/* =========================================================
   TYPOGRAPHY — Coastline / Moray Jewel
   Newsreader (display serif, the italic does the emotional
   work) · Inter (text + labels) · JetBrains Mono (meta).
   Type scale is em-relative so a page scales without breaking.
   ========================================================= */
:root {
  /* ---- FAMILIES ---------------------------------------- */
  --font-display: "Newsreader", "Iowan Old Style", Georgia, serif;
  --font-text:    "Inter", system-ui, -apple-system, sans-serif;
  --font-mono:    "JetBrains Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;

  /* Semantic aliases */
  --font-serif: var(--font-display);
  --font-sans:  var(--font-text);

  /* ---- WEIGHTS ---------------------------- @kind font --- */
  --w-display-italic: 300; /* @kind font */ /* the signature thin italic */
  --w-display:        400; /* @kind font */ /* roman display */
  --w-display-mid:    500; /* @kind font */
  --w-text:           400; /* @kind font */
  --w-text-medium:    500; /* @kind font */
  --w-text-semibold:  600; /* @kind font */
  --w-text-bold:      700; /* @kind font */
  --w-mono:           500; /* @kind font */

  /* ---- TRACKING (letter-spacing) ----------------------- */
  --trk-label:   0.18em;   /* uppercase Inter labels */
  --trk-mono:    0.08em;   /* uppercase mono meta */
  --trk-display: -0.02em;  /* tight display headings */

  /* ---- DISPLAY SCALE (em-relative within a page) -------
     The page sets a root font-size with clamp(); these
     multiply off it. xl/lg used on covers + icon pages,
     md/sm in body flow. */
  --display-xl: 4.4em;   /* hero display, lh 0.96 */
  --display-lg: 3.2em;   /* page title, lh 1.02 */
  --display-md: 2.2em;   /* section title, lh 1.1 */
  --display-sm: 1.5em;   /* sub-title, lh 1.18 */

  /* ---- LINE HEIGHTS ------------------------ @kind font -- */
  --lh-display:  1.04; /* @kind font */
  --lh-lede:     1.42; /* @kind font */
  --lh-body:     1.6;  /* @kind font */
  --lh-tight:    1.0;  /* @kind font */

  /* ---- TEXT SIZES (absolute, for UI surfaces) ---------- */
  --text-lede:   1.18em;  /* italic display lede */
  --text-body:   0.94em;
  --text-small:  0.82em;
  --text-label:  0.72em;
  --text-mono:   0.72em;
  --text-caption: 0.66em;
}
