/* WCH design tokens — derived from docs/brand.md (AUTHORITATIVE).
   Do not hardcode a hex value in a page. If a value is missing here, add it here. */

:root {
  /* ---- Type ----
     DECIDED (Dan, 2026-07-14): keep the prototype's look for now — Fraunces + DM Sans,
     teal ink, teal actions. brand.md specifies Libre Baskerville + Space Grotesk with navy
     type and gold accent; that swap is deferred, not rejected. Fonts are not a priority.
     To go brand-true later, change only the four semantic roles marked PROTOTYPE below. */
  --serif: 'Fraunces', Georgia, serif;            /* headlines */
  --sans:  'DM Sans', system-ui, -apple-system, sans-serif; /* subheads + body */

  /* ---- Primary palette (navy dominant; navy for ALL type) ---- */
  --navy:  #033466;
  --ivory: #FDFDFD;
  --gold:  #FFC300;

  /* Navy tints (light → dark: C6D0DB, 90A5B9, 5E7A97, 305378) */
  --navy-1: #305378;
  --navy-2: #5E7A97;
  --navy-3: #90A5B9;
  --navy-4: #C6D0DB;

  /* Gold tints */
  --gold-1: #FEC743;
  --gold-2: #FED567;
  --gold-3: #FEE395;
  --gold-4: #FFF1C8;

  /* ---- Secondary (complement only; navy + gold stay dominant) ---- */
  --slate: #5C87B0;
  --teal:  #007F80;
  --grey:  #E9EDF1;

  --teal-1: #2F8E8D;
  --teal-2: #5CA9A9;
  --teal-3: #8FC5C4;
  --teal-4: #C5E1E2;

  /* ---- Extended secondary — shading / data categories / soft accents only ---- */
  --violet:   #6C5DA6;
  --violet-1: #8C81BA;
  --violet-2: #AAA1CB;
  --violet-3: #C7C1DD;
  --violet-4: #E5E2EF;

  --rose:   #B85C7E;
  --rose-1: #C8809A;
  --rose-2: #D6A0B4;
  --rose-3: #E4C1CE;
  --rose-4: #F2E2E8;

  /* ---- Semantic roles (use these in components, not raw colors) ----
     The four marked PROTOTYPE are the whole difference between the current look and brand.md.
     Flip those four and the site goes brand-true. Nothing else needs to change. */
  --ink:      #16414A;          /* PROTOTYPE — brand.md says var(--navy) */
  --body:     #42555D;          /* PROTOTYPE — brand.md says a navy-derived grey */
  --muted:    #7A8791;
  --hint:     #A0ABB3;
  --bg:       #FCFBF7;          /* PROTOTYPE — brand.md says var(--ivory) #FDFDFD */
  --surface:  #FFFFFF;
  --line:     #E7EAEC;
  --line-2:   #DBE2E6;
  --accent:   var(--teal);      /* PROTOTYPE — brand.md says var(--gold) */

  /* ---- Layout ---- */
  --wrap:      1040px;
  --wrap-wide: 1180px;          /* proposal data bands (cost curve, funnel, ledger) run wider */
  --gutter:    24px;
  --section-y: 84px;
  --radius:    16px;
  --radius-sm: 12px;
  --pill:      999px;

  /* ---- Type scale ---- */
  --fs-hero:    clamp(34px, 5.4vw, 56px);
  --fs-h2:      clamp(26px, 3.4vw, 36px);
  --fs-h3:      20px;
  --fs-lead:    17px;
  --fs-body:    15.5px;
  --fs-small:   13.5px;
  --fs-eyebrow: 12px;

  /* ---- Elevation ---- */
  --shadow:    0 12px 40px -24px rgba(3, 52, 102, .45);
  --shadow-lg: 0 16px 44px -22px rgba(3, 52, 102, .5);
}