/* Golden Spa — Design Tokens (mapează variabilele din Figma). */
:root {
  --oliv-profund: #262a20;
  --oliv: #4c5640;
  --oliv-adanc: #3c4533;
  --crem: #efeae0;
  --card: #fbf9f4;
  --sage: #9dab8e;
  --sage-deschis: #cbd4c2;
  --auriu-antic: #ad7f3e;
  --lemn-miere: #c2914d;
  --error: #b5563f;

  --bg: var(--crem);
  --surface: var(--card);
  --surface-2: var(--sage-deschis);
  --text: var(--oliv-profund);
  --text-muted: color-mix(in srgb, var(--oliv) 70%, transparent);
  --border: color-mix(in srgb, var(--oliv) 18%, transparent);
  --accent: var(--auriu-antic);
  --accent-contrast: var(--crem);
  --on-dark: var(--crem);

  --font-display: "Libre Bodoni", Georgia, serif;
  --font-body: "Jost", system-ui, sans-serif;

  --fs-eyebrow: 0.75rem;
  --fs-body-sm: 0.875rem;
  --fs-body: 1.125rem;
  --fs-h5: 1.375rem;
  --fs-h4: 1.75rem;
  --fs-h3: 2rem;
  --fs-h2: 2.5rem;
  --fs-h1: clamp(2.25rem, 4vw + 1rem, 3.75rem);

  --lh-tight: 1.1;
  --lh-heading: 1.15;
  --lh-body: 1.6;
  --ls-eyebrow: 0.12em;

  --space-8: 8px; --space-12: 12px; --space-16: 16px; --space-24: 24px;
  --space-32: 32px; --space-48: 48px; --space-64: 64px; --space-96: 96px;

  --container: 1240px;
  --pad-x: clamp(20px, 5vw, 100px);
  --read: 720px;

  --radius-md: 12px; --radius-lg: 24px; --radius-pill: 999px;

  --shadow-warm: rgba(38, 42, 32, 0.14);
  --shadow-sm: 0 2px 8px var(--shadow-warm);
  --shadow-md: 0 8px 24px var(--shadow-warm);
  --shadow-lg: 0 12px 32px var(--shadow-warm);

  --dur-instant: 120ms; --dur-base: 300ms; --dur-slow: 600ms; --dur-reveal: 800ms;
  --ease-calm: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --stagger: 90ms; --dist-md: 24px;
}