:root {
  --color-cream: #f4efe6;
  --color-parchment: #ebe4d6;
  --color-ink: #1a1410;
  --color-ink-soft: #4a4038;
  --color-burgundy: #7a1f3d;
  --color-burgundy-deep: #5c1530;
  --color-terracotta: #c4623a;
  --color-forest: #2d4a3e;
  --color-gold: #b8952e;
  --color-gold-light: #d4b85a;
  --color-white: #fffdf9;
  --color-border: rgba(26, 20, 16, 0.12);
  --color-shadow: rgba(92, 21, 48, 0.14);

  --font-display: 'Cormorant Garamond', Georgia, serif;
  --font-body: 'Outfit', system-ui, sans-serif;

  --space-xs: clamp(0.5rem, 1vw, 0.75rem);
  --space-sm: clamp(0.75rem, 1.5vw, 1rem);
  --space-md: clamp(1rem, 2vw, 1.5rem);
  --space-lg: clamp(1.5rem, 3vw, 2.5rem);
  --space-xl: clamp(2.5rem, 5vw, 4rem);
  --space-2xl: clamp(4rem, 8vw, 7rem);

  --radius-sm: 0.5rem;
  --radius-md: 1rem;
  --radius-lg: 1.75rem;
  --radius-pill: 999px;

  --header-h: 4.5rem;
  --container: min(72rem, 92vw);
  --container-wide: min(88rem, 94vw);

  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --transition: 0.35s var(--ease-out);
}

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