/* =========================================================================
   DESIGN TOKENS
   -------------------------------------------------------------------------
   Single source of truth for color, type, spacing and motion, matched to
   the supplied UI reference pack (see /refs) and the extracted logo.
   Everything downstream reads these custom properties, so a future
   brand refresh is a values-only edit here.
   ========================================================================= */

:root {
  /* ---- Color: warm ivory / champagne / brushed gold -------------------
     Light, editorial palette — cream surfaces throughout, deep warm
     charcoal for text, brushed gold as the single accent. Sampled from
     the reference pack rather than guessed. */
  --color-ivory-50:  #fbf9f5;
  --color-ivory-100: #f9f6f0;
  --color-ivory-200: #f1eadd;
  --color-champagne-300: #e7dac0;
  --color-champagne-400: #d9c6a3;

  --color-charcoal-950: #14120f;
  --color-charcoal-900: #1e1a15;
  --color-charcoal-800: #2b241c;
  --color-charcoal-700: #443a2c;

  --color-gold-500: #b9814a;
  --color-gold-600: #9c6c31;
  --color-gold-glow: rgba(185, 129, 74, 0.32);

  --color-brown-600: #5b4632;
  --color-brown-700: #40311f;

  /* Semantic roles — components consume these, not raw palette values.
     The site is light throughout; --text-on-dark / --surface-primary(dark
     variant) remain only for text sitting directly on a photograph
     (the hero's gradient scrim, image captions). */
  --surface-primary: var(--color-ivory-100);
  --surface-secondary: var(--color-ivory-50);
  --surface-elevated: var(--color-ivory-200);
  --surface-dark: var(--color-charcoal-950);
  --surface-light: var(--color-ivory-100);
  --surface-light-alt: var(--color-ivory-200);

  --text-on-dark: var(--color-ivory-100);
  --text-on-dark-muted: rgba(249, 246, 240, 0.72);
  --text-on-light: var(--color-charcoal-900);
  --text-on-light-muted: rgba(30, 26, 21, 0.6);
  --text-accent: var(--color-gold-600);

  --border-on-dark: rgba(249, 246, 240, 0.22);
  --border-on-light: rgba(30, 26, 21, 0.12);
  --border-accent: rgba(185, 129, 74, 0.45);

  --focus-ring: var(--color-gold-600);

  /* ---- Type ------------------------------------------------------------
     High-contrast editorial serif for display (matches the reference
     headlines), clean humanist sans for UI/support copy. */
  --font-display: "Playfair Display", "Times New Roman", serif;
  --font-body: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-script: "Petit Formal Script", "Brush Script MT", cursive;

  --tracking-wide: 0.18em;
  --tracking-mid: 0.08em;

  --fs-display-xl: clamp(3rem, 2.5rem + 4.5vw, 6.4rem);
  --fs-display-lg: clamp(2.3rem, 1.9rem + 3vw, 4.4rem);
  --fs-display-md: clamp(1.9rem, 1.6rem + 2vw, 3rem);
  --fs-heading: clamp(1.4rem, 1.2rem + 1vw, 2rem);
  --fs-body-lg: clamp(1.05rem, 1rem + 0.3vw, 1.25rem);
  --fs-body: 1rem;
  --fs-small: 0.85rem;
  --fs-eyebrow: 0.78rem;

  /* ---- Space / layout ---------------------------------------------------*/
  --space-3xs: 0.25rem;
  --space-2xs: 0.5rem;
  --space-xs: 0.75rem;
  --space-sm: 1.25rem;
  --space-md: 2rem;
  --space-lg: 3.5rem;
  --space-xl: 6rem;
  --space-2xl: 9rem;
  --space-3xl: 13rem;

  --content-max: 1440px;
  --content-narrow: 780px;
  --gutter: clamp(1.25rem, 4vw, 4rem);

  --radius-sm: 3px;
  --radius-md: 6px;

  /* ---- Motion ------------------------------------------------------------
     Slow, deliberate easing. Luxury through restraint: durations lean
     long, distances stay short. */
  --ease-luxe: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-out-soft: cubic-bezier(0.16, 1, 0.3, 1);

  --dur-fast: 220ms;
  --dur-med: 480ms;
  --dur-slow: 900ms;
  --dur-reveal: 1100ms;

  --z-nav: 100;
  --z-modal: 500;
  --z-modal-overlay: 490;
}

/* Respect user motion preference at the token level: collapse durations so
   any component reading these variables automatically goes still. */
@media (prefers-reduced-motion: reduce) {
  :root {
    --dur-fast: 1ms;
    --dur-med: 1ms;
    --dur-slow: 1ms;
    --dur-reveal: 1ms;
  }
}