/* Omelette Studio — design tokens (single source of truth).
   Consumed by the React site (index.html / components.jsx, via the T
   object which maps each token to a var()) and by the static brief
   pages (pre-call-brief, pre-kickoff-brief). Edit values here only —
   nothing else defines these. */
:root {
  --color-white:      #FFFFFF;
  /* COOL-GREY RAMP (Option B, experimental) — the neutral greys below are
     nudged slightly cool to harmonize with the blueprint tone. White and
     coral are unchanged. EASY ROLLBACK: restore the hex marked "orig:" on
     each line (or git-checkout this file). */
  --color-off-white:  #F8FAFC;  /* orig: #FAFAFA */
  --color-light-grey: #EEF0F4;  /* orig: #F2F2F2 */
  --color-mid-grey:   #CDD0D7;  /* orig: #D1D1D1 */
  --color-dark-grey:  #696D76;  /* orig: #6B6B6B */
  --color-near-black: #191A1E;  /* orig: #1A1A1A */
  --color-black:      #0A0B0E;  /* orig: #0A0A0A */
  --color-muted-grey: #989CA4;  /* orig: #9A9A9A — muted micro-label grey (logo-strip eyebrow, footer labels) */
  --color-coral:      #FF6C79;
  /* Blueprint cool — a cool neutral family that replaces the old warm cream
     (which read as the Claude/Anthropic ivory). */
  --color-blueprint:      #EBEEF2; /* cool panel — Process figure cards */
  --color-blueprint-wash: #EEF1F6; /* derived lighter wash — Services & CTA bands + footer */
  --font-serif:       'Fraunces', serif;
  --font-sans:        'Geist', sans-serif;

  /* ─── Spacing scale (4px base grid) ───────────────────────────────
     Mirrors docs/design-system-update.md. Consumed by the static brief
     pages so their component spacing can't drift. The React site does
     NOT reference these (its spacing is inline), so they are inert there
     — adding them changes nothing about how index.html renders. */
  --space-4:    4px;
  --space-6:    6px;   /* half-step — pill/tag vertical padding (per design system) */
  --space-8:    8px;
  --space-12:  12px;
  --space-16:  16px;
  --space-20:  20px;
  --space-24:  24px;
  --space-28:  28px;  /* button horizontal padding (12 / 28) */
  --space-32:  32px;
  --space-36:  36px;
  --space-40:  40px;
  --space-48:  48px;
  --space-56:  56px;
  --space-64:  64px;
  --space-80:  80px;
  --space-96:  96px;
  --space-112: 112px;
  --space-160: 160px;

  /* ─── Border radius ───────────────────────────────────────────── */
  --radius-sm:    4px;
  --radius-md:    8px;
  --radius-lg:   12px;  /* inputs / textareas on the brief pages */
  --radius-full: 9999px;

  /* ─── Type scale ──────────────────────────────────────────────────
     Matches docs/design-system-update.md. Brief-page consumers only. */
  --text-micro:      11px;
  --text-caption:    13px;
  --text-ui:         14px;
  --text-body-sm:    15px;
  --text-body:       16px;
  --text-body-lg:    18px;
  --text-serif-md:   24px;
  --text-subsection: 28px;
  --text-section:    40px;
  --text-hero:       64px;
}