/* tokens.css — verbatim from DESIGN_SYSTEM.md §6. Single source of design values. */
:root {
  /* Colors — navy + gold brand system (client rebrand 2026-08; retires the former Signal Blue).
     Navy = headings + primary UI + dark bands; Gold = the single functional accent. */
  /* Exact values sampled from the real logo files (navy #001B40, gold #BE9149). */
  --color-signal: #be9149;          /* Gold accent (buttons, seams, indicators, focus ring) */
  --color-signal-hover: #a67c3a;    /* Gold, darker — hover / active */
  --color-gold-ink: #856a2c;        /* Gold, darkened for AA-legible TEXT on light surfaces */
  /* Lighter gold for accents/links on the navy dark bands (past AA on navy). */
  --color-signal-on-dark: #dcbd82;
  --color-navy: #001b40;            /* Brand navy — headings + primary UI text + nav */
  --color-navy-hover: #063163;
  --color-obsidian: #001b40;        /* Dark bands are brand navy */
  --color-basalt: #06264f;          /* Slightly lifted navy (fallback tiles) */
  --color-lapis: #063163;
  --color-alabaster: #ffffff;       /* Card surface stays clean white */
  --color-ink: #10151d;             /* Near-black body ink (warm-neutral) */
  --color-slate: #4b4a45;           /* Warm slate for secondary text (AA on white/cream) */
  --color-mist: #e7e0d2;            /* Warm hairline border */
  --color-fog: #f5f0e6;             /* Warm sand — alternating sections */
  --color-cream: #fcf9f2;           /* Warm page background (adds warmth, less stark white) */
  --color-papyrus: #e7d8b5;
  --color-papyrus-ink: #4a3f24;
  --gradient-hero: linear-gradient(180deg, #001b40 22%, #063163 64%, #be9149 100%);

  /* Brand logo hex — navy + gold logo mark */
  --color-brand-navy: #001b40;

  /* Fonts */
  --font-display: "Manrope", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-body: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

  /* Type scale */
  --text-eyebrow: 13px;   --leading-eyebrow: 1.4;   --tracking-eyebrow: 0.08em;
  --text-caption: 14px;   --leading-caption: 1.5;
  --text-body-sm: 15px;   --leading-body-sm: 1.55;
  --text-body: 16px;      --leading-body: 1.6;
  --text-lede: 20px;      --leading-lede: 1.5;    --tracking-lede: -0.01em;
  --text-subheading: 24px;--leading-subheading: 1.35; --tracking-subheading: -0.01em;
  --text-heading-sm: 34px;--leading-heading-sm: 1.18; --tracking-heading-sm: -0.02em;
  --text-heading: 54px;   --leading-heading: 1.08;    --tracking-heading: -0.023em;
  --text-heading-lg: 66px;--leading-heading-lg: 1.06; --tracking-heading-lg: -0.023em;
  --text-display: clamp(48px, 8vw, 96px); --leading-display: 1.04; --tracking-display: -0.025em;

  /* Weights */
  --fw-light: 300; --fw-regular: 400; --fw-medium: 500; --fw-bold: 700;

  /* Spacing (4px base) */
  --spacing-4: 4px;  --spacing-8: 8px;  --spacing-12: 12px; --spacing-16: 16px;
  --spacing-20: 20px;--spacing-24: 24px;--spacing-32: 32px; --spacing-48: 48px;
  --spacing-64: 64px;--spacing-80: 80px;--spacing-96: 96px; --spacing-128: 128px;
  /* Tighter vertical rhythm — client asked for less open white space, more warmth. */
  --section-y: clamp(52px, 5.5vw, 84px);

  /* Radius */
  --radius-pill: 9999px;
  --radius-card: 16px;
  --radius-input: 8px;

  /* Shadow — navy-tinted, more prominent so cards/sections stand out (client feedback). */
  --shadow-card: 0 6px 22px -6px rgba(14, 32, 56, 0.13);
  --shadow-card-hover: 0 16px 40px -8px rgba(14, 32, 56, 0.20);
  --shadow-nav: 0 1px 0 0 var(--color-mist);

  /* Layout */
  --max-w: 1200px;
  --gutter: clamp(20px, 5vw, 48px);

  /* Motion */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --dur-nav: 200ms;
}