/* ═══ Design tokens — values only. No component styling belongs in this file. ═══ */
:root {
  /* ─── Palette ─── */
  --navy: #0E2A47;          /* dominant: hero, nav, footer, executive sections, headings */
  --navy-deep: #08192B;     /* hero gradient floor, executive fills */
  --white: #FFFFFF;
  --slate: #F5F7F9;         /* alternating calm sections, closing CTA band */
  --emerald: #2E7D45;       /* growth + validation on LIGHT surfaces only */
  --emerald-light: #5FB57A; /* the emerald equivalent for NAVY surfaces */
  --gold: #C4A24A;          /* FILL ONLY — never text on a light surface */
  --gold-ink: #8A6D1F;      /* gold as text on light surfaces */
  --ink-soft: #3D4C5C;      /* body copy on light surfaces */

  /* Hairlines. Derived, not independent colours. */
  --rule: rgba(14, 42, 71, 0.14);        /* on light surfaces */
  --rule-gold: rgba(196, 162, 74, 0.28); /* on navy surfaces */
  --spine: rgba(14, 42, 71, 0.16);

  /* ─── Type ─── */
  --display: 'Spectral', Georgia, 'Times New Roman', serif;
  --ui: 'Schibsted Grotesk', 'Helvetica Neue', Arial, sans-serif;

  --step-hero: clamp(2.75rem, 6.2vw, 5.25rem);
  --step-h2: clamp(2rem, 3.6vw, 3.25rem);
  --step-h3: clamp(1.375rem, 1.8vw, 1.75rem);
  --step-lead: clamp(1.0625rem, 1.35vw, 1.3125rem);
  --step-quote: clamp(1.5rem, 2.8vw, 2.25rem);
  --step-body: 1.0625rem;
  --step-label: 0.6875rem;

  /* ─── Layout ─── */
  --measure: 68ch;
  --gutter: clamp(1.25rem, 5vw, 4rem);
  --block: clamp(4.5rem, 9vw, 8.5rem);
  --maxw: 1240px;

  /* ─── Motion ─── */
  --ease: cubic-bezier(0.2, 0.7, 0.2, 1);
  --dur: 620ms;
}

@media (prefers-reduced-motion: reduce) {
  :root { --dur: 1ms; }
}