/* ==========================================================================
   BIBLEO MAGZ - DESIGN TOKENS & SYSTEM VARIABLES
   Aesthetic: Romantic Minimalist Luxury (Apple / DTC / High-Fashion Editorial)
   ========================================================================== */

:root {
  /* Color Palette - Primary & Warm Neutrals */
  --color-bg-main: #FAF8F5;          /* Warm Alabaster / Rice Paper */
  --color-bg-card: #FFFFFF;          /* Pure Crisp White */
  --color-bg-subtle: #F4EFEA;        /* Soft Sand Stone */
  --color-bg-dark: #141312;          /* Rich Luxury Obsidian */
  --color-bg-dark-card: #1E1D1B;     /* Obsidian Card */
  
  /* Text Colors */
  --color-text-main: #1A1918;        /* Deep Espresso Charcoal */
  --color-text-muted: #6B6864;       /* Balanced Neutral Charcoal */
  --color-text-light: #9B9893;       /* Subtle Hint Gray */
  --color-text-white: #FFFFFF;
  --color-text-dark-muted: #ABA8A4;

  /* Accent Colors - Romantic Gold, Rose & Emerald */
  --color-accent-gold: #C5A059;      /* Champagne / Warm Brushed Gold */
  --color-accent-gold-light: #F4EBD9;
  --color-accent-gold-dark: #9A7730;
  --color-accent-rose: #D98880;      /* Vintage Blush Rose */
  --color-accent-rose-light: #FBF0EF;
  --color-accent-emerald: #2D6A4F;   /* Trust / Success Green */
  --color-accent-emerald-light: #E8F4EC;

  /* Borders & Dividers */
  --border-light: rgba(0, 0, 0, 0.07);
  --border-medium: rgba(0, 0, 0, 0.12);
  --border-gold: rgba(197, 160, 89, 0.35);
  --border-dark: rgba(255, 255, 255, 0.1);

  /* Typography */
  --font-serif: 'Playfair Display', 'Cormorant Garamond', Georgia, serif;
  --font-sans: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-editorial: 'Italiana', 'Playfair Display', serif;

  /* Spacing Scale */
  --space-2xs: 4px;
  --space-xs: 8px;
  --space-sm: 12px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 32px;
  --space-2xl: 48px;
  --space-3xl: 64px;
  --space-4xl: 96px;
  --space-5xl: 128px;

  /* Border Radii */
  --radius-sm: 8px;
  --radius-md: 14px;
  --radius-lg: 20px;
  --radius-xl: 28px;
  --radius-full: 9999px;

  /* Shadows & Elevation */
  --shadow-subtle: 0 2px 8px rgba(0, 0, 0, 0.03);
  --shadow-card: 0 10px 30px -10px rgba(26, 25, 24, 0.07), 0 4px 10px -2px rgba(26, 25, 24, 0.03);
  --shadow-hover: 0 20px 40px -12px rgba(26, 25, 24, 0.12), 0 8px 16px -4px rgba(26, 25, 24, 0.04);
  --shadow-gold: 0 10px 25px -5px rgba(197, 160, 89, 0.3);
  --shadow-dark: 0 20px 50px rgba(0, 0, 0, 0.4);

  /* Transitions & Animation Timings */
  --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-bounce: 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);

  /* Layout Max Widths */
  --container-max: 1200px;
  --container-narrow: 840px;
  --container-wide: 1360px;
}