:root {
  /* Color */
  --color-primary: #3f8a84;      /* brand — surfaces, large text, UI */
  --color-primary-hover: #428f89;/* brand hover */
  --color-primary-ink: #2a6560;  /* text on white — AA 4.5:1 */
  --color-primary-soft: #e8f2f1; /* tints / hover wash */
  --color-accent: #337079;       /* highlight teal (deep) — ~5.4:1, text-safe */
  --color-accent-light: #45909c; /* highlight teal (light) — ~3.5:1, large text/accent only */
  --color-ink: #111111;      /* primary text / headings */
  --color-body: #4a4a4a;     /* body text — ~8.9:1, AA */
  --color-muted: #6b6b6b;    /* secondary text — ~5.3:1, AA */
  --color-subtle: #818181;   /* large/secondary text only — ~3.6:1 */
  --color-quiet: #6b6b6b;    /* lightest grey that clears AA on --color-bg — ~5.3:1 */
  --color-disabled: #a4a4a4; /* disabled only (exempt from contrast) */
  --color-bg: #fdfdfd;           /* near-white page (reference measures the same) */
  --color-surface: #ffffff;      /* cards: white, carded by the hairline not a tint */
  --color-border: #e6e6e6;       /* neutral hairline */

  /* Radius */
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 20px;

  /* Spacing scale (8pt) */
  --space-1: 4px;  --space-2: 8px;  --space-3: 12px; --space-4: 16px;
  --space-5: 24px; --space-6: 32px; --space-7: 48px; --space-8: 64px;
  --space-9: 96px; --space-10: 120px;
  /* Reading rhythm on case pages: one value for the air around an evidence
     block (cards, figures, charts, stat rows), sitting between paragraph
     spacing (16) and a new beat (64) so the three intervals read as three. */
  --block-gap: 40px;

  /* Type scale */
  --font-sans: "DM Sans", system-ui, sans-serif;
  --font-display: "DM Sans", system-ui, sans-serif; /* every heading (Madhurima reference) */
  --font-mono: "DM Mono", ui-monospace, monospace; /* small uppercase labels */
  --fs-hero: clamp(2.5rem, 6vw, 4rem);
  --fs-h1: clamp(2rem, 4vw, 3rem);
  --fs-h2: clamp(1.5rem, 3vw, 2rem);
  --fs-h3: 1.1875rem;
  --fs-body: 1rem;
  --fs-small: 0.875rem;

  /* Six type roles, one family. Every font-size in the case column resolves to
     one of these; 13 / 14 / 16 / 19 / 24 / 32px on desktop. */
  --fs-label: 0.8125rem;    /* mono uppercase labels, 13px */
  --fs-title: 1.1875rem;    /* a beat inside a section, card titles, 19px */
  --fs-headline: 1.5rem;    /* a section's topic sentence, 24px */
  --fs-display: 2rem;       /* the case title and the largest figures, 32px */

  /* Case-page type roles, named by job rather than value. Ladder measures
     16 / 21 / 28 / 38.4px on desktop: steps of 1.31x, 1.33x and 1.37x. */
  --fs-case-display: var(--fs-display);
  --fs-case-headline: var(--fs-headline);
  --fs-case-subhead: var(--fs-title);
  --lh-tight: 1.15;
  --lh-body: 1.55;

  /* Elevation / layout */
  /* Ribbon / connective accent: brighter than the case accent, used at low alpha */
  --flow-accent: #f96f00;

  --shadow-1: 0 1px 3px rgba(0,0,0,0.06), 0 8px 24px rgba(0,0,0,0.05);
  --content-max: 1120px;
}
