/* ==========================================================================
   RACHEL'S DESIGN TOKENS (PALM BEACH & ORLANDO)
   Single Source of Truth for Colors, Typography, Elevation & Z-Index
   ========================================================================== */

:root {
  /* Core Color System (Luxury Dark & Light Contrast) */
  --color-onyx: #060709;
  --color-charcoal: #111317;
  --color-surface-dark: #181A20;
  --color-alabaster: #FAF9F6;
  --color-white: #FFFFFF;
  --color-gold: #E6002E;
  --color-gold-bright: #FF2E54;
  --color-gold-dark: #9E001F;
  --color-champagne: #FF4769;
  --color-burgundy: #6A141D;
  --color-rose: #C02C58;
  --color-text-dark: #0E1326;
  --color-text-muted: rgba(250, 249, 246, 0.65);
  --color-text-dim: rgba(14, 19, 38, 0.65);

  /* Dynamic Page Canvas */
  --page-bg: #FAF9F6;
  --slogan-text-color: #FFFFFF;

  /* Typography Stacks */
  --font-primary: 'Benton Sans', 'Plus Jakarta Sans', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  --font-editorial: 'Benton Sans', 'Plus Jakarta Sans', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-display: 'Cinzel', serif;
  --font-headline: 'Anton', 'Bebas Neue', 'Plus Jakarta Sans', sans-serif;
  --font-mono: 'DM Mono', monospace;

  /* Layout Metrics */
  --header-height: 92px;
  --header-height-desktop: 106px;
  --max-content-width: 1200px;
  --radius-sm: 8px;
  --radius-md: 14px;
  --radius-lg: 20px;
  --radius-xl: 28px;
  --radius-full: 9999px;

  /* Z-Index Hierarchy */
  --z-background: 0;
  --z-video-media: 1;
  --z-stage-props: 2;
  --z-content: 10;
  --z-scrim-veil: 90;
  --z-header: 100;
  --z-sticky-dock: 110;
  --z-drawer-overlay: 1000;
  --z-modal-overlay: 1010;
  --z-toast: 2000;

  /* Transitions */
  --transition-fast: 0.2s cubic-bezier(0.16, 1, 0.3, 1);
  --transition-smooth: 0.35s cubic-bezier(0.16, 1, 0.3, 1);
  --transition-cinematic: 0.65s cubic-bezier(0.16, 1, 0.3, 1);

  /* Shadows */
  --shadow-subtle: 0 4px 16px rgba(0, 0, 0, 0.08);
  --shadow-card: 0 10px 30px rgba(0, 0, 0, 0.12);
  --shadow-floating: 0 16px 40px rgba(0, 0, 0, 0.25);
  --shadow-gold: 0 8px 24px rgba(230, 0, 46, 0.25);
}