/* Google Fonts Import - Modern Luxury Pairings */
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800;900&family=Playfair+Display:ital,wght@0,400;0,600;0,700;1,400&family=Plus+Jakarta+Sans:wght@300;400;500;600;700;800&display=swap');

:root {
  /* Brand Primary Palette */
  --primary-blue: #0077B6;
  --deep-navy: #023E8A;
  --ocean-sapphire: #0096C7;
  --turquoise: #00B4D8;
  --electric-cyan: #00F2FE;
  --golden-sunset: #FDB813;
  --amber-gold: #F59E0B;
  --emerald-green: #2E8B57;
  
  /* Shared Base Tokens */
  --font-heading: 'Outfit', 'Playfair Display', Georgia, serif;
  --font-body: 'Plus Jakarta Sans', 'Outfit', system-ui, -apple-system, sans-serif;
  --font-editorial: 'Playfair Display', Georgia, serif;
  
  --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-slow: 0.65s cubic-bezier(0.16, 1, 0.3, 1);
  --transition-spring: 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
  
  --radius-xs: 6px;
  --radius-sm: 10px;
  --radius-md: 18px;
  --radius-lg: 28px;
  --radius-xl: 36px;
  --radius-round: 9999px;

  --container-width: 1280px;

  /* Theme Dependent Tokens (Defaulting to Luxury Dark Mode) */
  --bg-primary: #030712;
  --bg-secondary: #0b1528;
  --bg-tertiary: #111d35;
  --bg-gradient: linear-gradient(135deg, #023E8A 0%, #030712 100%);
  
  --text-primary: #F3F4F6;
  --text-secondary: #D1D5DB;
  --text-muted: #9CA3AF;
  
  --glass-bg: rgba(7, 15, 30, 0.72);
  --glass-bg-subtle: rgba(255, 255, 255, 0.04);
  --glass-border: rgba(255, 255, 255, 0.1);
  --glass-border-glow: rgba(0, 180, 216, 0.35);
  --glass-shadow: 0 15px 35px rgba(0, 0, 0, 0.5);
  
  --border-color: rgba(255, 255, 255, 0.08);
  --shadow-sm: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  --shadow-md: 0 10px 25px -3px rgba(0, 0, 0, 0.35), 0 4px 6px -2px rgba(0, 0, 0, 0.15);
  --shadow-lg: 0 20px 35px -5px rgba(0, 0, 0, 0.45), 0 10px 15px -5px rgba(0, 0, 0, 0.25);
  --shadow-glow-cyan: 0 0 40px rgba(0, 180, 216, 0.3);
  --shadow-glow-gold: 0 0 40px rgba(253, 184, 19, 0.25);
  --shadow-premium: 0 0 60px rgba(0, 119, 182, 0.25);
  
  --scrollbar-track: #030712;
  --scrollbar-thumb: #0077B6;
}

/* Light Theme Variables */
:root[data-theme="light"] {
  --bg-primary: #FAFAFC;
  --bg-secondary: #FFFFFF;
  --bg-tertiary: #F1F5F9;
  --bg-gradient: linear-gradient(135deg, #E0F2FE 0%, #FAFAFC 100%);
  
  --text-primary: #0F172A;
  --text-secondary: #334155;
  --text-muted: #64748B;
  
  --glass-bg: rgba(255, 255, 255, 0.85);
  --glass-bg-subtle: rgba(2, 62, 138, 0.03);
  --glass-border: rgba(2, 62, 138, 0.12);
  --glass-border-glow: rgba(0, 180, 216, 0.4);
  --glass-shadow: 0 15px 35px rgba(2, 62, 138, 0.08);
  
  --border-color: rgba(2, 62, 138, 0.08);
  --shadow-sm: 0 1px 3px 0 rgba(0, 0, 0, 0.05), 0 1px 2px 0 rgba(0, 0, 0, 0.03);
  --shadow-md: 0 4px 12px -1px rgba(2, 62, 138, 0.1), 0 2px 4px -1px rgba(2, 62, 138, 0.05);
  --shadow-lg: 0 12px 25px -3px rgba(2, 62, 138, 0.15), 0 4px 6px -2px rgba(2, 62, 138, 0.06);
  --shadow-glow-cyan: 0 0 35px rgba(0, 180, 216, 0.2);
  --shadow-glow-gold: 0 0 35px rgba(253, 184, 19, 0.18);
  --shadow-premium: 0 0 50px rgba(0, 119, 182, 0.12);
  
  --scrollbar-track: #F1F5F9;
  --scrollbar-thumb: #00B4D8;
}
