/* ==========================================================================
   Typography

   Self-hosted WOFF2 font faces + font-family tokens + type utility classes.

   Three sanctioned families (see assets/fonts/README.md):
     - Playfair Display 500 / 500 italic    Display serif (headlines)
     - Source Serif 4 400 / 400 italic / 500 Long-form body serif
     - Archivo Narrow 400 / 500 / 400 italic UI, nav, meta, eyebrows

   Zero Google Fonts network calls. All faces load from ../fonts/.

   size-adjust / ascent-override / descent-override / line-gap-override
   values are initial defaults (100% / 90% / 25% / 0%). Refine empirically
   against final templates using a fallback-font metric matcher.
   ========================================================================== */

/* ---- Playfair Display ------------------------------------------------- */

@font-face {
  font-family: 'Playfair Display';
  src: url('../fonts/playfair-display/PlayfairDisplay-Medium.woff2') format('woff2');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
  size-adjust: 100%;
  ascent-override: 90%;
  descent-override: 25%;
  line-gap-override: 0%;
}

@font-face {
  font-family: 'Playfair Display';
  src: url('../fonts/playfair-display/PlayfairDisplay-MediumItalic.woff2') format('woff2');
  font-weight: 500;
  font-style: italic;
  font-display: swap;
  size-adjust: 100%;
  ascent-override: 90%;
  descent-override: 25%;
  line-gap-override: 0%;
}

/* ---- Source Serif 4 --------------------------------------------------- */

@font-face {
  font-family: 'Source Serif 4';
  src: url('../fonts/source-serif-4/SourceSerif4-Regular.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  size-adjust: 100%;
  ascent-override: 90%;
  descent-override: 25%;
  line-gap-override: 0%;
}

@font-face {
  font-family: 'Source Serif 4';
  src: url('../fonts/source-serif-4/SourceSerif4-Italic.woff2') format('woff2');
  font-weight: 400;
  font-style: italic;
  font-display: swap;
  size-adjust: 100%;
  ascent-override: 90%;
  descent-override: 25%;
  line-gap-override: 0%;
}

@font-face {
  font-family: 'Source Serif 4';
  src: url('../fonts/source-serif-4/SourceSerif4-Medium.woff2') format('woff2');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
  size-adjust: 100%;
  ascent-override: 90%;
  descent-override: 25%;
  line-gap-override: 0%;
}

/* ---- Archivo Narrow --------------------------------------------------- */

@font-face {
  font-family: 'Archivo Narrow';
  src: url('../fonts/archivo-narrow/ArchivoNarrow-Regular.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  size-adjust: 100%;
  ascent-override: 90%;
  descent-override: 25%;
  line-gap-override: 0%;
}

@font-face {
  font-family: 'Archivo Narrow';
  src: url('../fonts/archivo-narrow/ArchivoNarrow-Medium.woff2') format('woff2');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
  size-adjust: 100%;
  ascent-override: 90%;
  descent-override: 25%;
  line-gap-override: 0%;
}

@font-face {
  font-family: 'Archivo Narrow';
  src: url('../fonts/archivo-narrow/ArchivoNarrow-Italic.woff2') format('woff2');
  font-weight: 400;
  font-style: italic;
  font-display: swap;
  size-adjust: 100%;
  ascent-override: 90%;
  descent-override: 25%;
  line-gap-override: 0%;
}

/* ---- Display Classes (Playfair Display) ------------------------------- */
.type-display-9xl {
  font-family: var(--font-display);
  font-weight: 500;
  font-size: var(--text-9xl);
  line-height: var(--leading-none);
}

.type-display-7xl {
  font-family: var(--font-display);
  font-weight: 500;
  font-size: var(--text-7xl);
  line-height: var(--leading-tight);
}

.type-display-6xl {
  font-family: var(--font-display);
  font-weight: 500;
  font-size: var(--text-6xl);
  line-height: var(--leading-tight);
}

.type-display-5xl {
  font-family: var(--font-display);
  font-weight: 500;
  font-size: var(--text-5xl);
  line-height: var(--leading-tight);
}

.type-display-4xl {
  font-family: var(--font-display);
  font-weight: 500;
  font-size: var(--text-4xl);
  line-height: var(--leading-tight);
}

.type-display-3xl {
  font-family: var(--font-display);
  font-weight: 500;
  font-size: var(--text-3xl);
  line-height: var(--leading-tight);
}

.type-display-2xl {
  font-family: var(--font-display);
  font-weight: 500;
  font-size: var(--text-2xl);
  line-height: normal;
}

/* ---- Body Classes (Source Serif 4) ------------------------------------ */
.type-body-3xl {
  font-family: var(--font-body-serif);
  font-weight: 400;
  font-size: var(--text-3xl);
  line-height: var(--leading-snug);
  font-style: italic;
}

.type-body-2xl {
  font-family: var(--font-body-serif);
  font-weight: 400;
  font-size: var(--text-2xl);
  line-height: var(--leading-normal);
}

.type-body-xl {
  font-family: var(--font-body-serif);
  font-weight: 400;
  font-size: var(--text-xl);
  line-height: 1.3;
  font-style: italic;
}

.type-body-lg {
  font-family: var(--font-body-serif);
  font-weight: 400;
  font-size: var(--text-lg);
  line-height: var(--leading-normal);
}

.type-body-lg-italic {
  font-family: var(--font-body-serif);
  font-weight: 400;
  font-size: var(--text-lg);
  line-height: var(--leading-normal);
  font-style: italic;
}

.type-body-base {
  font-family: var(--font-body-serif);
  font-weight: 500;
  font-size: var(--text-base);
  line-height: var(--leading-normal);
}

.type-article-body {
  font-family: var(--font-body-serif);
  font-weight: 400;
  font-size: 22px;
  line-height: var(--leading-normal);
  color: var(--color-black);
}

/* ---- Meta/Eyebrow Classes (Archivo Narrow) ---------------------------- */
.type-meta-2xl {
  font-family: var(--font-eyebrow);
  font-weight: 500;
  font-size: var(--text-2xl);
  line-height: var(--leading-normal);
  text-transform: uppercase;
}

.type-meta-xl {
  font-family: var(--font-eyebrow);
  font-weight: 500;
  font-size: var(--text-xl);
  line-height: var(--leading-normal);
  text-transform: uppercase;
}

.type-meta-lg {
  font-family: var(--font-eyebrow);
  font-weight: 500;
  font-size: var(--text-lg);
  line-height: var(--leading-normal);
  text-transform: uppercase;
}

.type-meta-base {
  font-family: var(--font-eyebrow);
  font-weight: 500;
  font-size: var(--text-base);
  line-height: var(--leading-normal);
  text-transform: uppercase;
}

.type-meta-sm {
  font-family: var(--font-eyebrow);
  font-weight: 500;
  font-size: var(--text-sm);
  line-height: var(--leading-snug);
  text-transform: uppercase;
}

.type-meta-xs {
  font-family: var(--font-eyebrow);
  font-weight: 500;
  font-size: var(--text-xs);
  line-height: var(--leading-snug);
  text-transform: uppercase;
}

/* ---- UI Classes (Archivo Narrow) -------------------------------------- */
.type-ui-2xl {
  font-family: var(--font-ui);
  font-weight: 500;
  font-size: var(--text-2xl);
  line-height: var(--leading-normal);
}

.type-ui-xl {
  font-family: var(--font-ui);
  font-weight: 400;
  font-size: var(--text-xl);
  line-height: var(--leading-normal);
}

.type-ui-lg {
  font-family: var(--font-ui);
  font-weight: 400;
  font-size: var(--text-lg);
  line-height: var(--leading-normal);
}

.type-ui-lg-medium {
  font-family: var(--font-ui);
  font-weight: 500;
  font-size: var(--text-lg);
  line-height: var(--leading-normal);
}

.type-ui-base {
  font-family: var(--font-ui);
  font-weight: 500;
  font-size: var(--text-base);
  line-height: var(--leading-normal);
}

.type-ui-sm {
  font-family: var(--font-ui);
  font-weight: 400;
  font-size: var(--text-sm);
  line-height: var(--leading-snug);
}

.type-ui-sm-medium {
  font-family: var(--font-ui);
  font-weight: 500;
  font-size: var(--text-sm);
  line-height: var(--leading-snug);
}

.type-ui-xs {
  font-family: var(--font-ui);
  font-weight: 400;
  font-size: var(--text-xs);
  line-height: var(--leading-snug);
}

/* ---- Font-family tokens -----------------------------------------------
   Four canonical tokens. Legacy aliases (arcuata/signifier/decimal/archivo)
   were retired per LYC-128 / REQ-7. Every consumer has been repointed to
   the semantic token that matches its role. */
:root {
  --font-display: "Playfair Display", "Playfair Display Fallback", Georgia, serif;
  --font-body-serif: "Source Serif 4", "Source Serif 4 Fallback", Georgia, serif;
  --font-ui: "Archivo Narrow", "Archivo Narrow Fallback", "Arial Narrow", Arial, sans-serif;
  --font-eyebrow: var(--font-ui);
}

/* ==========================================================================
   ::selection. sitewide brand override (REQ-003 / F-02 / Pass-4)

   Replaces the OS default text-selection highlight (pale blue on macOS,
   bright blue on Windows) with a Lyceum brand-aligned Satin Linen
   background. Solves what the client perceived as a "highlighted
   background" on Think More headings/dek (CATCH-3): that artifact was
   the screenshot tool capturing the user's text selection, not styled
   CSS. This rule fixes it everywhere, not just on Think More.

   Edge cases:
   - Firefox legacy needs ::-moz-selection (vendor-prefix mirror).
   - Dark-mode contrast: use --color-text-primary instead of raw black
     so the rule cascades correctly when dark-mode tokens flip.
   - iOS Safari and SVG <text> use system colors; this rule won't apply
     there. Documented as known limitation, not a fix needed.
   ========================================================================== */
::selection {
  background: var(--color-satin-linen);
  color: var(--color-text-primary, var(--color-black));
}
::-moz-selection {
  background: var(--color-satin-linen);
  color: var(--color-text-primary, var(--color-black));
}