/* Self-hosted fonts (latin subset; Lato = the hinted builds Google serves to Windows, so text renders as with Google Fonts everywhere). Only the styles a page uses are downloaded. */
@font-face {
  font-family: 'Lato';
  font-style: italic;
  font-weight: 300;
  font-display: swap;
  src: url(/assets/fonts/lato-300i.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Lato';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/lato-400i.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(/assets/fonts/lato-300.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/lato-400.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/assets/fonts/lato-700.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url(/assets/fonts/lato-900.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/assets/fonts/poppins-700.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ============================================================
   Genesis Education Solutions — Typography Tokens
   ============================================================
   Primary font:    Lato (Google Fonts) — all brand communications
   Supporting font: Montserrat Light — logo branch descriptor only
   ============================================================ */

/* ── JetBrains Mono — self-hosted woff2 ────────────────────── */
:root {
  /* ── Font Families ──────────────────────────────────────── */
  --font-sans: 'Lato', system-ui, -apple-system, sans-serif;
  --font-logo-descriptor: 'Montserrat', 'Lato', sans-serif; /* Montserrat Light — logo use only */
  --font-mono: 'JetBrains Mono', 'Fira Code', 'Cascadia Code', monospace;

  /* ── Font Sizes ─────────────────────────────────────────── */
  --text-xs:   0.75rem;    /* 12px */
  --text-sm:   0.875rem;   /* 14px */
  --text-base: 1rem;       /* 16px */
  --text-md:   1.125rem;   /* 18px */
  --text-lg:   1.25rem;    /* 20px */
  --text-xl:   1.5rem;     /* 24px */
  --text-2xl:  1.875rem;   /* 30px */
  --text-3xl:  2.25rem;    /* 36px */
  --text-4xl:  3rem;       /* 48px */
  --text-5xl:  3.75rem;    /* 60px */
  --text-6xl:  4.5rem;     /* 72px */

  /* ── Font Weights ───────────────────────────────────────── */
  --weight-regular:   400;
  --weight-medium:    500;
  --weight-semibold:  600;
  --weight-bold:      700;
  --weight-light:     300;
  --weight-extrabold: 800;
  --weight-black:     900;

  /* ── Line Heights ───────────────────────────────────────── */
  --leading-none:     1;
  --leading-tight:    1.25;
  --leading-snug:     1.375;
  --leading-normal:   1.5;
  --leading-relaxed:  1.625;
  --leading-loose:    2;

  /* ── Letter Spacing ─────────────────────────────────────── */
  --tracking-tight:   -0.025em;
  --tracking-normal:  0em;
  --tracking-wide:    0.025em;
  --tracking-wider:   0.05em;
  --tracking-widest:  0.12em;  /* for ALL-CAPS labels */

  /* ── Semantic Roles ─────────────────────────────────────── */

  /* Brand typographic scale (from brand guide p.16)
     H1: 36px | H2: 28px | H3: 20px | Body: 15px | Small: 12px */

  /* Display / Hero */
  --font-display:         var(--font-sans);
  --text-display-size:    var(--text-5xl);
  --text-display-weight:  var(--weight-black);
  --text-display-leading: var(--leading-tight);
  --text-display-tracking: var(--tracking-tight);

  /* Heading levels — exact brand spec */
  --text-h1-size:    2.25rem;  /* 36px */
  --text-h1-weight:  var(--weight-black);
  --text-h2-size:    1.75rem;  /* 28px */
  --text-h2-weight:  var(--weight-bold);
  --text-h3-size:    1.25rem;  /* 20px */
  --text-h3-weight:  var(--weight-bold);
  --text-h4-size:    var(--text-xl);
  --text-h4-weight:  var(--weight-bold);
  --text-h5-size:    var(--text-lg);
  --text-h5-weight:  var(--weight-semibold);

  /* Body — exact brand spec */
  --text-body-size:    0.9375rem; /* 15px */
  --text-body-weight:  var(--weight-regular);
  --text-body-leading: var(--leading-relaxed);

  /* UI chrome */
  --text-label-size:    0.75rem;  /* 12px — brand 'small' */
  --text-label-weight:  var(--weight-bold);
  --text-label-tracking: var(--tracking-widest);
  --text-caption-size:  0.75rem;  /* 12px */
  --text-caption-weight: var(--weight-regular);
}
