/* ==========================================================================
   Regain Accreditation — design language tokens
   Direction: Fathom — scientific narrative (catalog id 04-fathom-scientific)
   School: information-architecture
   Mantra: every pixel must carry information.

   This is the second-generation token set, replacing the oxblood-on-paper
   editorial-restraint tokens shipped 2026-04-17. The new palette and type
   stack are authored against the Fathom register: scientific journal rigor
   with design elegance — Bill & Melinda Gates Foundation annual reports,
   Bloomberg Markets data spreads, NEJM long-form analyses.

   Scope: loaded only by pages under the `accreditation` audience slug.
   ========================================================================== */

:root {
  /* Palette — cream paper, navy ink, muted teal as the analytical accent.
     Cool professional tone (gray, navy, muted teal) on warm cream paper.
     Never #ffffff, never #000000. */
  --acc-color-ink: #0E1A2C;            /* near-black navy, body text + display */
  --acc-color-ink-2: #1E3A5F;          /* primary navy, charts + emphasis */
  --acc-color-ink-3: #4A5868;          /* secondary ink, captions + small-caps */
  --acc-color-ink-4: #7A8595;          /* tertiary ink, marginalia */
  --acc-color-paper: #FAF7F0;          /* primary cream paper ground */
  --acc-color-paper-2: #F1ECDF;        /* warm cream wash, pull-out sections */
  --acc-color-paper-3: #E8E2D0;        /* margin-card, sparkline ground */
  --acc-color-rule: #C8C2B0;           /* hairline rule between content */
  --acc-color-rule-strong: #8F8772;    /* heavier hairline for chart axes */

  /* Analytical accent — muted teal. Single accent across the whole site.
     Reserved for: chart lines, key callout numerals, footnote markers,
     and inline links. Not used as a fill. */
  --acc-color-accent: #4F7A7A;
  --acc-color-accent-soft: #88A6A6;
  --acc-color-accent-deep: #2D5454;
  --acc-color-accent-tint: rgba(79, 122, 122, 0.16);  /* chart shaded area */

  /* Annotator — soft saffron used only for inline annotations / highlights /
     citation markers in the body of a chart. Never as a background. */
  --acc-color-annotator: #B88B2E;
  --acc-color-annotator-soft: #D4B469;

  /* Semantic states — restrained, used inside data displays only. */
  --acc-state-positive: #2D5454;       /* aligned with teal, not green */
  --acc-state-attention: #8F6B1A;
  --acc-state-critical: #7C2418;
  --acc-state-info: #1E3A5F;

  /* Typography — serif display (Source Serif 4), serif body (same family,
     smaller optical size), monospace for data. Inter remains as a sans
     fallback for UI utility, never as display. Weights cap at 600.
     ALL CAPS body is forbidden; small-caps is the editorial alternative. */
  --acc-font-display: "Source Serif 4", "GT Sectra", ui-serif, Georgia, "Times New Roman", serif;
  --acc-font-body: "Source Serif 4", "GT Sectra", ui-serif, Georgia, "Times New Roman", serif;
  --acc-font-utility: "Inter", ui-sans-serif, system-ui, -apple-system, "Helvetica Neue", sans-serif;
  --acc-font-mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;

  /* Type scale — 17px reading body. The display sizes are smaller than the
     editorial-restraint precursor on purpose: Fathom's hierarchy comes from
     density and annotation, not from large display type. */
  --acc-fs-display-1: 3.5rem;     /* 56 / 60 — single big page title */
  --acc-lh-display-1: 1.0714;
  --acc-fs-display-2: 2.5rem;     /* 40 / 46 — section heads */
  --acc-lh-display-2: 1.15;
  --acc-fs-display-3: 1.875rem;   /* 30 / 38 — sub-section heads */
  --acc-lh-display-3: 1.2667;
  --acc-fs-headline: 1.375rem;    /* 22 / 30 — pillar / numbered-step heads */
  --acc-lh-headline: 1.3636;
  --acc-fs-subhead: 1.125rem;     /* 18 / 28 */
  --acc-lh-subhead: 1.5556;
  --acc-fs-body-lg: 1.1875rem;    /* 19 / 30 — lead paragraph */
  --acc-lh-body-lg: 1.5789;
  --acc-fs-body: 1.0625rem;       /* 17 / 28 — default body */
  --acc-lh-body: 1.6471;
  --acc-fs-body-sm: 0.9375rem;    /* 15 / 24 — captions, marginalia */
  --acc-lh-body-sm: 1.6;
  --acc-fs-eyebrow: 0.75rem;      /* 12 / 16 small-caps eyebrow */
  --acc-lh-eyebrow: 1.3333;
  --acc-fs-mono-sm: 0.875rem;     /* 14 / 22 — chart annotation labels */
  --acc-lh-mono-sm: 1.5714;
  --acc-fs-stat-xl: 4rem;         /* 64 / 68 — hero metric */
  --acc-lh-stat-xl: 1.0625;
  --acc-fs-stat-lg: 2.75rem;      /* 44 / 48 — stat-card metric */
  --acc-lh-stat-lg: 1.0909;
  --acc-fs-footnote: 0.8125rem;   /* 13 / 20 — footnote body */
  --acc-lh-footnote: 1.5385;

  /* Letter-spacing tokens. */
  --acc-tracking-display: -0.02em;
  --acc-tracking-display-tight: -0.028em;
  --acc-tracking-eyebrow: 0.16em;     /* small-caps eyebrows */
  --acc-tracking-smallcaps: 0.08em;   /* inline small-caps */

  /* OpenType features — tabular lining figures for stats, oldstyle for prose,
     small-caps for eyebrows. */
  --acc-feat-tabular: "tnum" 1, "lnum" 1;
  --acc-feat-oldstyle: "onum" 1;
  --acc-feat-smallcaps: "smcp" 1, "c2sc" 1;

  /* Spacing — Fathom 8/12/16 scale, never 10/15. */
  --acc-space-1: 0.25rem;     /* 4  */
  --acc-space-2: 0.5rem;      /* 8  */
  --acc-space-3: 0.75rem;     /* 12 */
  --acc-space-4: 1rem;        /* 16 */
  --acc-space-6: 1.5rem;      /* 24 */
  --acc-space-8: 2rem;        /* 32 */
  --acc-space-10: 2.5rem;     /* 40 */
  --acc-space-12: 3rem;       /* 48 */
  --acc-space-16: 4rem;       /* 64 */
  --acc-space-20: 5rem;       /* 80 */
  --acc-space-24: 6rem;       /* 96 */
  --acc-space-32: 8rem;       /* 128 */
  --acc-space-40: 10rem;
  --acc-space-48: 12rem;

  /* Container widths — editorial measures, never edge-to-edge. */
  --acc-measure-prose: 42rem;     /* 672  — long-form articles, footnoted */
  --acc-measure-default: 70rem;   /* 1120 — standard marketing + chart cols */
  --acc-measure-wide: 82.5rem;    /* 1320 — full-spread editorial diagrams */
  --acc-measure-full: 90rem;      /* 1440 — rare full-bleed */

  /* Radius — documentary, sharp. 4px is the system maximum. */
  --acc-radius: 0;
  --acc-radius-soft: 2px;       /* used only on tags, footnote markers */
  --acc-radius-cap: 4px;        /* maximum allowed; charts/cards stay 0 */

  /* Hairline weight — the only stroke weight on this site. */
  --acc-rule-hairline: 1px;
  --acc-rule-thick: 2px;        /* reserved for chart axes only */

  /* Shadow — none for body surfaces. Fathom uses paper texture, not elevation. */
  --acc-shadow-paper: none;
  --acc-shadow-paper-soft: 0 1px 0 rgba(14, 26, 44, 0.04);
  /* Floating-surface elevation — reserved for nav dropdowns and similar
     panels that overlay page content. Two-stop drop shadow (close + far)
     gives depth without blurring the background. This is NOT glassmorphism:
     the panel surface stays opaque cream paper. */
  --acc-shadow-elevated: 0 6px 24px -8px rgba(14, 26, 44, 0.12), 0 2px 6px -2px rgba(14, 26, 44, 0.06);

  /* Chart-specific tokens — Fathom's signature is bespoke charts. */
  --acc-chart-line: 1.5px;
  --acc-chart-line-emphasis: 2px;
  --acc-chart-grid: 1px;
  --acc-chart-axis: 1px;
  --acc-chart-tick-len: 6px;
  --acc-chart-callout-rule: 1px;
  --acc-chart-shaded-opacity: 0.18;
}

/* No dark mode for Fathom. The register is paper. A dark variant would
   undermine the metaphor. (Reverted from the previous editorial token set,
   which exposed a `[data-theme="dark"]` block.) */

/* Base reset — scoped to the accreditation audience class only. */
body.accreditation {
  background: var(--acc-color-paper);
  color: var(--acc-color-ink);
  font-family: var(--acc-font-body);
  font-size: var(--acc-fs-body);
  line-height: var(--acc-lh-body);
  font-feature-settings: var(--acc-feat-oldstyle);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body.accreditation h1,
body.accreditation h2,
body.accreditation h3,
body.accreditation .display {
  font-family: var(--acc-font-display);
  font-weight: 500;
  letter-spacing: var(--acc-tracking-display);
  color: var(--acc-color-ink);
}

body.accreditation code,
body.accreditation .mono {
  font-family: var(--acc-font-mono);
  font-feature-settings: var(--acc-feat-tabular);
}

/* Inline link — muted teal, hairline underline at offset, no flourish. */
body.accreditation a {
  color: var(--acc-color-accent-deep);
  text-decoration: underline;
  text-underline-offset: 4px;
  text-decoration-thickness: 1px;
  transition: color 120ms ease, text-decoration-color 120ms ease;
}

body.accreditation a:hover {
  color: var(--acc-color-accent);
  text-decoration-color: var(--acc-color-accent);
}

/* Focus rings — 2px ink outline, 2px offset, no rounding. */
body.accreditation *:focus-visible {
  outline: 2px solid var(--acc-color-ink-2);
  outline-offset: 2px;
  border-radius: 0;
}

/* Reduced-motion respect — all non-essential transitions go to 0. */
@media (prefers-reduced-motion: reduce) {
  body.accreditation * {
    transition-duration: 0ms !important;
    animation-duration: 0ms !important;
  }
}
