/* YAH design tokens. Palette and type scale from the visual direction brief. */
:root {
  /* Palette */
  --limestone: #f4efe6;
  --limestone-deep: #ebe4d6;
  --sand: #d8c8ad;
  --sand-soft: #e6dbc6;
  --cork: #8a6a4b;
  --cork-deep: #5f4631;
  --olive: #4b573f;
  --olive-soft: #7d8770;
  --charcoal: #1e1d1a;
  --charcoal-soft: #34322d;
  --ink: #23221e;
  --ink-muted: #6b665c;
  --line: rgba(30, 29, 26, 0.14);
  --line-light: rgba(244, 239, 230, 0.22);

  /* Type */
  --font-serif: "Cormorant Garamond", "Cormorant", Georgia, "Times New Roman", serif;
  --font-sans: "Inter", "Helvetica Neue", Arial, sans-serif;

  --text-xs: 0.6875rem;
  --text-sm: 0.8125rem;
  --text-base: 1.0625rem;
  --text-lg: clamp(1.15rem, 1rem + 0.5vw, 1.4rem);
  --text-xl: clamp(1.5rem, 1.2rem + 1.2vw, 2.25rem);
  --text-2xl: clamp(2rem, 1.4rem + 2.4vw, 3.6rem);
  --text-3xl: clamp(2.6rem, 1.6rem + 4.2vw, 5.6rem);
  --text-display: clamp(3.2rem, 1.2rem + 7.6vw, 9.5rem);
  --text-number: clamp(6rem, 2rem + 18vw, 20rem);

  --tracking-label: 0.22em;
  --tracking-display: 0.01em;

  /* Layout */
  --container: 1480px;
  --gutter: clamp(1.25rem, 4vw, 4.5rem);
  --section: clamp(5.5rem, 11vw, 11rem);
  --section-sm: clamp(3.5rem, 7vw, 7rem);
  --gap: clamp(1.25rem, 2.5vw, 2.5rem);

  /* Motion */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur: 900ms;

  /* Misc */
  --radius: 2px;
  --header-h: 5.25rem;
}

@media (max-width: 720px) {
  :root {
    --header-h: 4.25rem;
  }
}