/* ==========================================================================
   DESIGN TOKENS & EXECUTIVE LUXURY PALETTE — HASHIM BAJWA
   Pure Dark Executive Theme: Midnight Obsidian, Imperial Navy & Brushed Champagne Gold
   ========================================================================== */

:root {
  /* Core Background & Surface System */
  --bg-primary: #070A10;
  --bg-secondary: #0C111E;
  --bg-surface: #11182B;
  --bg-surface-elevated: #162038;
  --bg-card: rgba(17, 24, 43, 0.85);
  --bg-glass: rgba(12, 17, 30, 0.92);

  /* Modern Brushed Champagne Gold & Warm Amber Accents */
  --color-gold: #E5C37E;
  --color-gold-light: #F7E4BC;
  --color-gold-dark: #B28D3F;
  --color-gold-subtle: rgba(229, 195, 126, 0.12);
  --color-gold-glow: rgba(229, 195, 126, 0.38);

  /* Tailored Burgundy / Royal Wine Subtle Accent (harmonizing with portrait suit) */
  --color-burgundy: #831D3D;
  --color-burgundy-glow: rgba(131, 29, 61, 0.35);

  /* Text & Contrast Hierarchy (Pure High Legibility) */
  --text-primary: #FFFFFF;
  --text-secondary: #CBD5E1;
  --text-muted: #8492A6;
  --text-gold: #F1D49B;

  /* Borders & Lines */
  --border-subtle: rgba(255, 255, 255, 0.09);
  --border-gold: rgba(229, 195, 126, 0.28);
  --border-gold-strong: rgba(229, 195, 126, 0.7);
  --grid-line: rgba(255, 255, 255, 0.03);

  /* Typography Stacks */
  --font-serif: 'Playfair Display', 'Cormorant Garamond', Georgia, serif;
  --font-sans: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-mono: 'JetBrains Mono', Consolas, monospace;

  /* Fluid Typography Scale (Perfect on Mobile 320px to Desktop 4K) */
  --text-xs: clamp(0.72rem, 0.68rem + 0.2vw, 0.8rem);
  --text-sm: clamp(0.82rem, 0.78rem + 0.2vw, 0.9rem);
  --text-base: clamp(0.95rem, 0.9rem + 0.25vw, 1.05rem);
  --text-lg: clamp(1.05rem, 0.98rem + 0.35vw, 1.2rem);
  --text-xl: clamp(1.15rem, 1.05rem + 0.5vw, 1.45rem);
  --text-2xl: clamp(1.3rem, 1.18rem + 0.65vw, 1.75rem);
  --text-3xl: clamp(1.5rem, 1.35rem + 0.95vw, 2.2rem);
  --text-4xl: clamp(1.75rem, 1.5rem + 1.3vw, 2.75rem);
  --text-5xl: clamp(2.1rem, 1.75rem + 1.8vw, 3.5rem);
  --text-hero: clamp(2.25rem, 1.85rem + 2.2vw, 4.5rem);

  /* Spacing Scale */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;
  --space-24: 6rem;

  /* Layout Widths */
  --container-max: 1280px;
  --container-narrow: 920px;
  --header-height: 86px;

  /* Shadows & Backlight Glows */
  --shadow-sm: 0 4px 14px rgba(0, 0, 0, 0.45);
  --shadow-md: 0 10px 30px rgba(0, 0, 0, 0.65);
  --shadow-lg: 0 20px 50px rgba(0, 0, 0, 0.8);
  --glow-portrait: 0 0 80px rgba(229, 195, 126, 0.32), 0 0 140px rgba(131, 29, 61, 0.25);
  --glow-button: 0 0 28px rgba(229, 195, 126, 0.45);

  /* Transitions */
  --ease-spring: cubic-bezier(0.16, 1, 0.3, 1);
  --transition-fast: 200ms ease;
  --transition-base: 350ms var(--ease-spring);
  --transition-slow: 600ms var(--ease-spring);
}