:root {
  --color-cream: #e6e5e1;
  --color-ink: #1c1c1a;
  --color-red: #c4271f;
  --color-red-deep: #b32218;
  --color-cyan: #6fa3b0;
  --color-cyan-deep: #5d8d99;
  --color-olive: #6a7a4a;

  --font-display: "Archivo Black", sans-serif;
  --font-body: Geist, system-ui, sans-serif;

  --header-height: 56px;
  --touch-min: 44px;
  --radius: 0;

  --container: min(1360px, calc(100% - 2 * var(--pad-x)));
  --container-wide: min(1440px, 100%);
  --pad-x: clamp(1.25rem, 4vw, 4rem);
  --rhythm: clamp(2.5rem, 5vw, 4.5rem);
  --section-y: clamp(3.5rem, 8vw, 6.5rem);

  --text-body: 0.9375rem;
  --leading-body: 1.55;
  --h1: clamp(3.25rem, 9vw, 8rem);
  --h2: clamp(2.5rem, 6vw, 4rem);
  --h2-xl: clamp(3.25rem, 8vw, 6rem);
  --h-reserve: clamp(3.5rem, 10vw, 10rem);
  --stat: clamp(1.15rem, 3.4vh + 0.4vw, 2.5rem);
  --audience: clamp(1.75rem, 3.5vw, 2.5rem);

  --z-page: 1;
  --z-nav: 50;
  --z-header: 60;
  --z-toggle: 70;

  --ease: cubic-bezier(0.22, 0.61, 0.36, 1);
}

@media (max-width: 767px) {
  :root {
    --section-y: 2.35rem;
    --rhythm: 1.85rem;
    --h2: clamp(2rem, 9vw, 2.6rem);
    --h2-xl: clamp(2.15rem, 10vw, 3rem);
    --h-reserve: clamp(2.5rem, 12vw, 3.5rem);
    --audience: clamp(1.6rem, 7vw, 2rem);
  }
}