/* Design tokens. Single source of truth — nothing below this file hardcodes a
   colour, size or duration. Rebrand = edit this file only. */

:root {
  /* ---- Typeface stacks ---- */
  --display: "Fraunces", Georgia, "Times New Roman", serif;
  --body: "Inter", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
  --mono: "IBM Plex Mono", "PlexMono Fallback", ui-monospace, "SFMono-Regular", monospace;

  /* ---- Surfaces: paper ground ---- */
  --bone: #ffffff;      /* page background */
  --bone-2: #f3f3f3;    /* alternating band */
  --bone-card: #ffffff; /* card on bone */
  --paper: #ffffff;

  /* ---- Ink: deep navy ---- */
  --ink: #15203b;   /* headings */
  --ink-2: #0e1730; /* inverted section background */
  --ink-3: #1d2a48; /* raised surface on ink */
  --text: #18223c;
  --muted: #586079;
  --muted-2: #646b80;
  --nav-link: #414b66;

  /* ---- On inverted sections ---- */
  --on-dark: #f2efe8;
  --on-dark-mut: #a7aec0;

  /* ---- Accent ---- */
  --coral: #ec6a4c;
  --coral-deep: #d8502f;
  --coral-ink: #b8411f;
  --amber: #f4a23c;
  --accent-grad: linear-gradient(105deg, #ec6a4c 0%, #f4a23c 100%);

  /* ---- Semantic ---- */
  --pos: #1f8a5b;
  --pos-2: #22a76a;

  /* ---- Hairlines ---- */
  --line: #e2d9c9;
  --line-ink: rgba(255, 255, 255, 0.12);

  /* ---- Type scale ---- */
  --fs-h1: clamp(2.1rem, 4.2vw, 3.3rem);
  --fs-h2: clamp(1.9rem, 3.4vw, 2.75rem);
  --fs-h3: 1.375rem;
  --fs-h4: 1.125rem;
  --fs-lead: 1.1875rem;
  --fs-body: 1.0625rem;
  --fs-ui: 0.9375rem;
  --fs-sm: 0.875rem;
  --fs-xs: 0.75rem;
  --fs-2xs: 0.6875rem;
  --ls-lab: 0.12em; /* mono label tracking */

  /* ---- Spacing ---- */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 24px;
  --sp-6: 32px;
  --sp-7: 48px;
  --sp-8: 64px;

  /* Vertical rhythm for full sections */
  --band: clamp(56px, 9vw, 96px);
  --band-sm: clamp(44px, 7vw, 72px);

  /* ---- Layout ---- */
  --maxw: 1180px;
  --gutter: clamp(18px, 4vw, 32px);
  --nav-h: 74px;

  /* ---- Radii ---- */
  --r-xs: 6px;
  --r-sm: 10px;
  --r-md: 14px;
  --r-lg: 20px;
  --r-pill: 100px;
  --radius: var(--r-md);
  --radius-lg: var(--r-lg);

  /* ---- Elevation ---- */
  --shadow-sm: 0 2px 8px rgba(20, 28, 52, 0.06);
  --shadow-md: 0 14px 34px -12px rgba(20, 28, 52, 0.18);
  --shadow-lg: 0 40px 80px -28px rgba(20, 28, 52, 0.34);
  --shadow-warm: 0 14px 32px -14px rgba(216, 80, 47, 0.35);

  /* ---- Motion ---- */
  --ease: cubic-bezier(0.22, 0.7, 0.3, 1);
  --t-fast: 0.16s;
  --t-med: 0.3s;

  /* ---- Stacking ---- */
  --z-nav: 60;
  --z-menu: 80;
  --z-skip: 200;
}