/* ============================================
   KAASHI SAFETY NETS — MODERN DESIGN TOKENS
   Color System: Deep Space Navy + Electric Amber + Emerald Mint
   ============================================ */

:root {
  /* ── BRAND PALETTE (From Kaashi Logo) ── */
  --brand-navy-900: #08101E;        /* Ultra Deep Navy */
  --brand-navy-800: #0D1B33;        /* Deep Space Navy */
  --brand-navy-700: #132445;        /* Primary Navy (Bird Body/Ribbon) */
  --brand-navy-600: #1B325E;        /* Medium Navy */
  --brand-navy-500: #25447E;        /* Lighter Navy */
  
  --brand-amber-600: #D96500;       /* Dark Amber */
  --brand-amber-500: #FF7A00;       /* Vibrant Electric Amber (Logo Wings) */
  --brand-amber-400: #FFA033;       /* Bright Golden Amber */
  --brand-amber-300: #FFC066;       /* Soft Gold */
  
  --brand-emerald-600: #059669;     /* Deep Emerald */
  --brand-emerald-500: #10B981;     /* Vibrant Emerald Mint (Logo Building) */
  --brand-emerald-400: #34D399;     /* Light Mint */
  
  /* Semantic Tokens */
  --color-primary: #132445;
  --color-primary-dark: #08101E;
  --color-primary-light: #1B325E;
  
  --color-accent: #FF7A00;
  --color-accent-dark: #D96500;
  --color-accent-light: #FFA033;
  --color-accent-soft: rgba(255, 122, 0, 0.12);
  
  --color-success: #10B981;
  --color-success-soft: rgba(16, 185, 129, 0.12);
  
  /* Neutrals & Surfaces */
  --color-white: #FFFFFF;
  --color-bg-light: #F8FAFC;
  --color-bg-card: #FFFFFF;
  --color-bg-alt: #F1F5F9;
  
  --color-text-main: #0F172A;
  --color-text-muted: #64748B;
  --color-text-light: #94A3B8;
  --color-text-white: #FFFFFF;
  
  --color-border: #E2E8F0;
  --color-border-hover: #CBD5E1;
  --color-border-glow: rgba(255, 122, 0, 0.25);
  
  /* Modern Gradients */
  --grad-primary: linear-gradient(135deg, #0D1B33 0%, #1B325E 100%);
  --grad-hero: linear-gradient(135deg, rgba(8, 16, 30, 0.95) 0%, rgba(13, 27, 51, 0.85) 50%, rgba(8, 16, 30, 0.6) 100%);
  --grad-accent: linear-gradient(135deg, #FF7A00 0%, #FFA033 100%);
  --grad-accent-hover: linear-gradient(135deg, #E66E00 0%, #FF8C1A 100%);
  --grad-emerald: linear-gradient(135deg, #059669 0%, #10B981 100%);
  --grad-card-glow: linear-gradient(135deg, rgba(255, 122, 0, 0.08) 0%, rgba(16, 185, 129, 0.04) 100%);
  --grad-banner: linear-gradient(90deg, #08101E 0%, #132445 40%, #1B325E 70%, #08101E 100%);
  --grad-text-accent: linear-gradient(135deg, #FF7A00 0%, #FFC066 100%);
  --grad-text-emerald: linear-gradient(135deg, #10B981 0%, #34D399 100%);
  --grad-shine: linear-gradient(90deg, transparent, rgba(255,255,255,0.25), transparent);

  /* Glassmorphism System */
  --glass-white: rgba(255, 255, 255, 0.85);
  --glass-white-hover: rgba(255, 255, 255, 0.98);
  --glass-dark: rgba(13, 27, 51, 0.75);
  --glass-dark-card: rgba(19, 36, 69, 0.65);
  --glass-border: rgba(255, 255, 255, 0.15);
  --glass-blur: blur(14px);
  --glass-blur-lg: blur(24px);

  /* Typography */
  --font-display: 'Outfit', -apple-system, BlinkMacSystemFont, sans-serif;
  --font-body: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;

  /* Font Sizes */
  --fs-hero: clamp(2.2rem, 5.5vw, 3.8rem);
  --fs-h1: clamp(1.85rem, 4.2vw, 2.85rem);
  --fs-h2: clamp(1.6rem, 3.4vw, 2.35rem);
  --fs-h3: clamp(1.25rem, 2.4vw, 1.65rem);
  --fs-h4: 1.18rem;
  --fs-body-lg: 1.08rem;
  --fs-body: 0.96rem;
  --fs-small: 0.86rem;
  --fs-xs: 0.76rem;

  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;
  --fw-extrabold: 800;

  --lh-tight: 1.2;
  --lh-normal: 1.6;
  --lh-relaxed: 1.8;

  /* Spacing */
  --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;

  /* Rounded Corners */
  --radius-xs: 6px;
  --radius-sm: 10px;
  --radius-md: 16px;
  --radius-lg: 24px;
  --radius-xl: 32px;
  --radius-full: 9999px;

  /* Shadows */
  --shadow-xs: 0 1px 3px rgba(13, 27, 51, 0.05);
  --shadow-sm: 0 4px 12px rgba(13, 27, 51, 0.06);
  --shadow-md: 0 8px 24px rgba(13, 27, 51, 0.08);
  --shadow-lg: 0 16px 40px rgba(13, 27, 51, 0.12);
  --shadow-xl: 0 24px 60px rgba(13, 27, 51, 0.16);
  --shadow-glow-amber: 0 8px 28px rgba(255, 122, 0, 0.35);
  --shadow-glow-emerald: 0 8px 28px rgba(16, 185, 129, 0.3);
  --shadow-glow-navy: 0 12px 35px rgba(19, 36, 69, 0.4);

  /* Layout */
  --container-max: 1240px;
  --container-padding: clamp(16px, 4vw, 32px);
  --section-padding: clamp(3.5rem, 7vw, 6rem);
  --header-height: 92px;
  --topbar-height: 40px;
  --header-total-height: calc(var(--topbar-height) + var(--header-height));

  /* Z-Index */
  --z-base: 1;
  --z-sticky: 100;
  --z-header: 999;
  --z-modal-backdrop: 1040;
  --z-modal: 1050;
  --z-float: 1100;

  /* Animation Timings */
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
  --dur-fast: 0.2s;
  --dur-med: 0.35s;
  --dur-slow: 0.6s;
}