/* ==========================================================================
   BASTION ADVISORS GROUP — MODERN DESIGN SYSTEM & TOKEN ARCHITECTURE
   ========================================================================== */

:root {
  /* ------------------------------------------------------------------------
     1. Brand Palette & Surfaces
     ------------------------------------------------------------------------ */
  --bg-primary: #0a0d14;
  --bg-secondary: #101522;
  --bg-card: rgba(18, 24, 38, 0.75);
  --bg-card-hover: rgba(28, 38, 60, 0.85);
  --border-subtle: rgba(255, 255, 255, 0.08);
  --border-active: rgba(56, 189, 248, 0.4);
  
  /* ------------------------------------------------------------------------
     2. Text & Typography Colors (WCAG AA & AAA Compliant)
     ------------------------------------------------------------------------ */
  --text-primary: #f8fafc;
  --text-secondary: #cbd5e1;       /* > 7:1 contrast on dark card backgrounds */
  --text-muted: #94a3b8;           /* > 4.5:1 contrast on dark card backgrounds */
  --text-accent: #38bdf8;          /* Electric Cyan: 9.1:1 contrast */
  --text-highlight: #3b82f6;

  /* ------------------------------------------------------------------------
     3. Accents & Gradients
     ------------------------------------------------------------------------ */
  --accent-gradient: linear-gradient(135deg, #38bdf8 0%, #2563eb 50%, #1d4ed8 100%);
  --accent-gradient-glow: linear-gradient(135deg, rgba(56, 189, 248, 0.15), rgba(37, 99, 235, 0.15));
  --hero-glow: radial-gradient(circle at 50% 20%, rgba(37, 99, 235, 0.25) 0%, rgba(10, 13, 20, 0) 70%);

  /* ------------------------------------------------------------------------
     4. 8-Point Spatial Grid Tokens
     ------------------------------------------------------------------------ */
  --space-3xs: 2px;
  --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;

  /* ------------------------------------------------------------------------
     5. Typography System: Outfit (Headings) & Inter (Body)
     ------------------------------------------------------------------------ */
  --font-heading: 'Outfit', 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-body: 'Inter', 'Source Sans Pro', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

  /* Modular Fluid Typographic Scale */
  --text-xs: clamp(0.75rem, 1.5vw, 0.8125rem);
  --text-sm: clamp(0.875rem, 1.8vw, 0.9375rem);
  --text-base: clamp(1rem, 2vw, 1.0625rem);
  --text-lg: clamp(1.125rem, 2.2vw, 1.25rem);
  --text-xl: clamp(1.25rem, 2.5vw, 1.5rem);
  --text-2xl: clamp(1.5rem, 3vw, 1.875rem);
  --text-3xl: clamp(1.875rem, 3.5vw, 2.25rem);
  --text-4xl: clamp(2.25rem, 4vw, 2.75rem);
  --text-5xl: clamp(2.75rem, 5vw, 3.75rem);
  --text-6xl: clamp(3.25rem, 6vw, 4.5rem);

  /* Line Heights */
  --leading-tight: 1.15;
  --leading-snug: 1.25;
  --leading-normal: 1.6;
  --leading-relaxed: 1.75;

  /* Letter Spacing */
  --tracking-tight: -0.025em;
  --tracking-normal: 0em;
  --tracking-wide: 0.05em;
  --tracking-wider: 0.08em;

  /* ------------------------------------------------------------------------
     6. Border Radius, Shadows & Focus Rings (ADA Compliant)
     ------------------------------------------------------------------------ */
  --radius-sm: 8px;
  --radius-md: 14px;
  --radius-lg: 20px;
  --radius-full: 9999px;
  
  --shadow-sm: 0 4px 12px rgba(0, 0, 0, 0.3);
  --shadow-md: 0 12px 28px rgba(0, 0, 0, 0.45);
  --shadow-lg: 0 20px 48px rgba(0, 0, 0, 0.6);
  --shadow-glow: 0 0 25px rgba(56, 189, 248, 0.2);
  --shadow-glow-active: 0 0 35px rgba(56, 189, 248, 0.35);

  --focus-ring: 0 0 0 3px rgba(56, 189, 248, 0.45);

  /* ------------------------------------------------------------------------
     7. Interactive Timing & Easing
     ------------------------------------------------------------------------ */
  --transition-fast: 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  --transition-normal: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  --ease-spring: cubic-bezier(0.16, 1, 0.3, 1);
}