:root{
  /* ---- three voices, product stack ------------------------------------ */
  --font-display:"Fraunces", Georgia, serif;
  --font-ui:"Inter", system-ui, sans-serif;
  --font-mono:"Space Grotesk", ui-monospace, monospace;

  /* ---- three voices, editorial stack (Field Notes) -------------------- */
  --font-editorial-display:"Instrument Serif", "DM Serif Display", Georgia, serif;
  --font-editorial-ui:"DM Sans", system-ui, sans-serif;
  --font-editorial-mono:"JetBrains Mono", ui-monospace, monospace;

  /* ---- scale (literal values lifted from source) ---------------------- */
  --size-hero:clamp(40px, 10.8vw, 64px);
  --size-hero-editorial:clamp(48px, 7.6vw, 108px);
  --size-section:clamp(28px, 7.5vw, 40px);
  --size-section-editorial:clamp(28px, 3.4vw, 44px);
  --size-panel-head:clamp(32px, 4.2vw, 52px);
  --size-h3:22px;
  --size-lede:21px;
  --size-quote:clamp(22px, 5.8vw, 30px);
  --size-vernacular:22px;
  --size-body:16px;
  --size-body-sm:15.5px;
  --size-body-xs:14px;
  --size-meta:13.5px;
  --size-label:11.5px;
  --size-label-sm:11px;
  --size-label-xs:10px;

  /* ---- line-height / tracking ---------------------------------------- */
  --leading-hero:0.98; /* @kind font */
  --leading-section:1.04; /* @kind font */
  --leading-tight:1.15; /* @kind font */
  --leading-body:1.55; /* @kind font */
  --leading-prose:1.6; /* @kind font */
  --track-hero:-0.025em; /* @kind font */
  --track-section:-0.018em; /* @kind font */
  --track-tight:-0.01em; /* @kind font */
  --track-label:0.14em; /* @kind font */
  --track-label-wide:0.18em; /* @kind font */

  /* ---- weights -------------------------------------------------------- */
  --weight-display:500; /* @kind font */         /* Fraunces headlines sit at 500 */
  --weight-display-strong:600; /* @kind font */  /* hero only */
  --weight-body:400; /* @kind font */
  --weight-medium:500; /* @kind font */
  --weight-bold:600; /* @kind font */

  /* ---- roles ---------------------------------------------------------- */
  --type-hero:var(--weight-display-strong) var(--size-hero)/var(--leading-hero) var(--font-display);
  --type-section:var(--weight-display) var(--size-section)/var(--leading-section) var(--font-display);
  --type-h3:var(--weight-display) var(--size-h3)/var(--leading-tight) var(--font-display);
  --type-body:var(--weight-body) var(--size-body)/var(--leading-body) var(--font-ui);
  --type-label:var(--weight-medium) var(--size-label-sm)/1.2 var(--font-mono);
}
