:root {
  --paper: #f7f4ea;
  --linen: #efe6c8;
  --ink: #1c1d18;
  --muted: #5c5b52;
  --gold: #e6c31f;
  --olive: #24251c;
  --cream: #f3efe0;
  --line: rgba(28, 29, 24, 0.12);
  --line-strong: rgba(28, 29, 24, 0.22);
  --cream-muted: rgba(243, 239, 224, 0.72);
  --cream-faint: rgba(243, 239, 224, 0.58);
  --cream-line: rgba(243, 239, 224, 0.16);
  --cream-input: rgba(243, 239, 224, 0.08);
  --cream-border: rgba(243, 239, 224, 0.28);
  --shadow: 0 12px 28px rgba(28, 29, 24, 0.1);

  --font-display: "Outfit", "Figtree", "Segoe UI", sans-serif;
  --font-body: "Figtree", "Segoe UI", sans-serif;

  --header-height: 3.5rem;
  --touch-min: 44px;
  --radius-card: 0.75rem;
  --radius-media: 0.5rem;
  --radius-pill: 0;
  --radius-mark: 0.45rem;

  --container: 84rem;
  --container-wide: 86rem;
  --pad-x: clamp(1.5rem, 4.5vw, 3.5rem);
  --rhythm: clamp(2rem, 4.4vw, 3.75rem);
  --media-h: min(22rem, 48vh);
  --media-h-lg: min(36rem, 62vh);
  --split-h: clamp(28rem, 56vh, 38rem);

  --text-hero: clamp(2.35rem, 5.4vw, 3.85rem);
  --text-h2: clamp(1.7rem, 3.6vw, 2.85rem);
  --text-stat: clamp(2.15rem, 4.2vw, 3.4rem);
  --text-quote: clamp(1.35rem, 2.4vw, 1.95rem);
  --text-h3: clamp(1.1rem, 1.5vw, 1.35rem);
  --text-body: 1.0625rem;
  --text-small: 0.8125rem;

  --ease: cubic-bezier(0.16, 0.84, 0.28, 1);
}

html {
  scroll-padding-top: calc(var(--header-height) + 0.75rem);
}