:root {
  /* ===== Brand palette (fixed by brief) ===== */
  --cream: #F5F1EA;
  --cream-soft: #FBF9F5;
  --sand: #EAE0CE;
  --sand-line: #DDD0B8;
  --terracotta: #C1673E;
  --terracotta-dark: #A2532F;
  --charcoal: #3A2E28;
  --charcoal-soft: #6E5D51;
  --gold: #B8863B;
  --gold-soft: #D7B978;
  /* stable dark surface, used for the stats band — independent of
     --charcoal so it stays dark even when --charcoal flips to a
     light text color in dark mode */
  --ink: #3A2E28;

  /* ===== Type ===== */
  --font-display: "Fraunces", "Playfair Display", serif;
  --font-body: "Work Sans", "Inter", sans-serif;
  --font-accent: "Caveat", cursive;

  /* ===== Spacing scale ===== */
  --space-xs: 0.5rem;
  --space-sm: 1rem;
  --space-md: 1.75rem;
  --space-lg: 3rem;
  --space-xl: 5rem;
  --space-2xl: 8rem;

  /* ===== Layout ===== */
  --container-w: 1180px;
  --radius-sm: 6px;
  --radius-md: 14px;
  --radius-lg: 28px;

  /* ===== Motion ===== */
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --dur-fast: 0.25s;
  --dur-med: 0.6s;
  --dur-slow: 1.1s;

  /* ===== Shadow ===== */
  --shadow-soft: 0 10px 30px -12px rgba(58, 46, 40, 0.18);
  --shadow-card: 0 4px 18px -6px rgba(58, 46, 40, 0.12);
  --shadow-lift: 0 24px 60px -18px rgba(58, 46, 40, 0.30);
  --shadow-glow-gold: 0 12px 30px -10px rgba(184, 134, 59, 0.45);
  --shadow-glow-terracotta: 0 12px 30px -10px rgba(193, 103, 62, 0.4);

  /* ===== Glassmorphism ===== */
  --glass-bg: rgba(251, 249, 245, 0.6);
  --glass-bg-strong: rgba(251, 249, 245, 0.85);
  --glass-border: rgba(255, 255, 255, 0.5);
}

/* ===== Dark mode — same brand hues, inverted surfaces ===== */
[data-theme="dark"] {
  --cream: #16120F;
  --cream-soft: #1F1A15;
  --sand: #2A2119;
  --sand-line: rgba(245, 241, 234, 0.12);
  --terracotta: #E28A5C;
  --terracotta-dark: #C1673E;
  --charcoal: #F5F1EA;
  --charcoal-soft: #B7AC9E;
  --gold: #D7B978;
  --gold-soft: #E8CDA0;
  --ink: #0D0B09;

  --shadow-soft: 0 10px 30px -12px rgba(0, 0, 0, 0.55);
  --shadow-card: 0 4px 18px -6px rgba(0, 0, 0, 0.45);
  --shadow-lift: 0 24px 60px -18px rgba(0, 0, 0, 0.65);
  --shadow-glow-gold: 0 12px 30px -10px rgba(215, 185, 120, 0.35);
  --shadow-glow-terracotta: 0 12px 30px -10px rgba(226, 138, 92, 0.35);

  --glass-bg: rgba(22, 18, 15, 0.6);
  --glass-bg-strong: rgba(22, 18, 15, 0.85);
  --glass-border: rgba(255, 255, 255, 0.08);
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --dur-fast: 0.001s;
    --dur-med: 0.001s;
    --dur-slow: 0.001s;
  }
}