:root {
  /* Decision infrastructure — locked art direction */
  --canvas: #F4F5F2;
  --mist: #E7ECEA;
  --paper: #FFFFFF;
  --ink: #17212B;
  --ink-soft: #3D4A57;
  --navy: #163B5C;
  --navy-deep: #0F2A42;
  --teal: #14A38B;
  --teal-dark: #0E7A68;
  --violet: #6B5FD2;
  --line: rgba(23, 33, 43, 0.12);
  --line-strong: rgba(23, 33, 43, 0.22);
  --shadow: 0 20px 50px rgba(22, 59, 92, 0.08);
  --shadow-soft: 0 8px 24px rgba(22, 59, 92, 0.06);

  --font-display: "Sora", "Inter", system-ui, sans-serif;
  --font-body: "Inter", system-ui, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, monospace;

  --step--1: clamp(0.78rem, 0.74rem + 0.15vw, 0.875rem);
  --step-0: clamp(0.95rem, 0.91rem + 0.2vw, 1.0625rem);
  --step-1: clamp(1.125rem, 1.02rem + 0.45vw, 1.375rem);
  --step-2: clamp(1.45rem, 1.2rem + 1.1vw, 2rem);
  --step-3: clamp(2rem, 1.45rem + 2.2vw, 3.25rem);
  --step-4: clamp(2.5rem, 1.7rem + 3.2vw, 4.25rem);

  --radius-sm: 2px;
  --radius-md: 4px;
  --container: 72rem;
  --gutter: clamp(1.25rem, 4vw, 2.5rem);
  --ease: cubic-bezier(0.16, 1, 0.3, 1);
  --banner-h: 2.25rem;
  --header-h: 4rem;
  --header-offset: calc(var(--banner-h) + var(--header-h));
}