:root {
  --black: #0a0908;
  --white: #FAFAFA;
  --green-900: #1A3610;
  --green-600: #2C5A1E;
  --green-500: #3F8C2A;
  --green-300: #7CC15E;
  --grey-400: #9A9A95;
  --grey-500: #8A8A86;

  /* One family across the whole site. --font-mono keeps its name because it
     still marks the small-caps label role (tags, labels, buttons), but it is
     Grift now, not a monospace. */
  --font-display: "Grift", "Grift Fallback", system-ui, sans-serif;
  --font-mono: "Grift", "Grift Fallback", system-ui, sans-serif;

  --step-hero: clamp(3rem, 13vw, 11rem);
  --step-xl: clamp(2rem, 6vw, 4.5rem);
  --step-lg: clamp(1.5rem, 3vw, 2.25rem);
  --step-md: 1.0625rem;
  --step-sm: 0.875rem;
  --step-xs: 0.75rem;

  --gutter: 24px;
  --maxw: 1280px;
  --section-gap: clamp(96px, 14vh, 200px);
}

@media (min-width: 1024px) {
  :root { --gutter: 64px; }
}