/* ==========================================================================
   EPICUREAN FLOW - DESIGN SYSTEM VARIABLES (EDITORIAL REFINEMENT)
   ========================================================================== */

:root {
  /* Master Color Palette */
  --color-ink: #12110F;
  --color-ink-subtle: #24221F;
  --color-ink-light: #44403B;
  --color-ink-muted: #6E685E;
  
  --color-ivory: #FFFFFF;
  --color-ivory-warm: #FAFAFA;
  --color-ivory-surface: #FFFFFF;
  --color-cream: #FFFFFF;
  --color-white: #FFFFFF;
  
  --color-gold: #BC9142;
  --color-gold-hover: #9E7732;
  --color-gold-light: #E8D9B7;
  --color-gold-subtle: rgba(188, 145, 66, 0.12);
  --color-gold-border: rgba(188, 145, 66, 0.35);
  --color-gold-gradient: linear-gradient(135deg, #D4AF37 0%, #BC9142 50%, #916E29 100%);
  
  --color-olive: #394236;
  --color-olive-dark: #222920;
  --color-olive-light: #4E594A;
  --color-olive-subtle: rgba(57, 66, 54, 0.08);
  --color-olive-badge: rgba(57, 66, 54, 0.92);
  
  --color-clay: #7A4034;
  --color-clay-light: #A35A4B;
  
  /* Borders & Dividers */
  --color-border: rgba(18, 17, 15, 0.11);
  --color-border-light: rgba(18, 17, 15, 0.06);
  --color-border-dark: rgba(245, 240, 231, 0.14);

  /* Typography */
  --font-serif: 'Cormorant Garamond', Garamond, 'Didot', Georgia, serif;
  --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  
  /* Layout Dimensions */
  --max-content-width: 1280px;
  --text-reading-width: 700px;
  --text-editorial-width: 860px;
  --header-height: 92px;
  --header-height-scrolled: 74px;
  --header-height-mobile: 70px;
  
  /* Section Spacing Foundation */
  --section-padding-desktop: 72px;
  --section-padding-tablet: 54px;
  --section-padding-mobile: 40px;
  
  --grid-gap-desktop: 36px;
  --grid-gap-tablet: 24px;
  --grid-gap-mobile: 16px;
  
  /* Shadows & Elevations */
  --shadow-subtle: 0 4px 20px rgba(18, 17, 15, 0.04);
  --shadow-card: 0 10px 30px rgba(18, 17, 15, 0.06);
  --shadow-card-hover: 0 22px 48px rgba(18, 17, 15, 0.12);
  --shadow-book: 0 18px 36px rgba(18, 17, 15, 0.18), 0 8px 12px rgba(18, 17, 15, 0.08);
  --shadow-book-hover: 0 26px 52px rgba(18, 17, 15, 0.24), 0 12px 18px rgba(18, 17, 15, 0.12);
  --shadow-drawer: -14px 0 50px rgba(18, 17, 15, 0.25);
  
  /* Border Radius */
  --radius-xs: 2px;
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 16px;
  --radius-pill: 9999px;
  
  /* Transitions */
  --transition-fast: 0.2s cubic-bezier(0.16, 1, 0.3, 1);
  --transition-normal: 0.35s cubic-bezier(0.16, 1, 0.3, 1);
  --transition-smooth: 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}