:root {
  --cream: #f1ede3;
  --sand: #eae4d2;
  --forest: #1f3b32;
  --forest-deep: #16302a;
  --ink: #0f1f1a;
  --paper: #f4efe3;
  --line: rgba(15, 31, 26, 0.12);
  --line-on-dark: rgba(244, 239, 227, 0.18);
  --mute: rgba(15, 31, 26, 0.72);
  --mute-on-dark: rgba(244, 239, 227, 0.8);
  --error: #a31b16;

  --font: "Outfit", "Helvetica Neue", sans-serif;
  --display: "Instrument Sans", "Helvetica Neue", sans-serif;

  --header-height: 5.25rem;
  --touch-min: 44px;
  --radius: 0;
  --radius-pill: 999px;
  --gap: 0.625rem;
  --page: min(82.5rem, calc(100% - 2 * var(--pad-x)));
  --pad-x: clamp(1.15rem, 4vw, 3rem);
  --section-y: clamp(2.75rem, 5.5vw, 4.25rem);
  --h1: clamp(2.85rem, 8.2vw, 4.85rem);
  --h2: clamp(2.15rem, 4.2vw, 3.6rem);
  --h3: clamp(1.45rem, 2vw, 1.9rem);

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

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

@media (prefers-reduced-motion: reduce) {
  :root {
    --duration: 0.01ms;
  }
}

@media (max-width: 767px) {
  :root {
    --header-height: 4rem;
    --pad-x: 1.15rem;
    --section-y: 3.25rem;
  }
}