/* ============================================================
   ADVANCED SYSTEMS — CSS Custom Properties (Design Tokens)
   ============================================================ */

:root {
  /* ─── Brand Colors ─────────────────────────────────────── */
  --primary-violet:  #5B2C7E;
  --primary-orange:  #E97826;
  --primary-yellow:  #FFC72C;

  --violet-dark:     #3D1A54;
  --violet-mid:      #6F3496;
  --violet-light:    #8B5FA8;
  --violet-pale:     #F3EDF7;
  --violet-100:      #E8D5F5;

  --orange-dark:     #C5621A;
  --orange-light:    #FF9A5C;
  --orange-pale:     #FFF3E8;

  --yellow-dark:     #E5A800;
  --yellow-light:    #FFD966;
  --yellow-pale:     #FFFBE6;

  /* ─── Neutrals ──────────────────────────────────────────── */
  --white:     #FFFFFF;
  --gray-50:   #F9FAFB;
  --gray-100:  #F3F4F6;
  --gray-200:  #E5E7EB;
  --gray-300:  #D1D5DB;
  --gray-400:  #9CA3AF;
  --gray-500:  #6B7280;
  --gray-600:  #4B5563;
  --gray-700:  #374151;
  --gray-800:  #1F2937;
  --gray-900:  #111827;
  --black:     #000000;

  /* ─── Semantic Colors ───────────────────────────────────── */
  --success:       #10B981;
  --success-light: #D1FAE5;
  --warning:       #F59E0B;
  --warning-light: #FEF3C7;
  --error:         #EF4444;
  --error-light:   #FEE2E2;
  --info:          #3B82F6;
  --info-light:    #DBEAFE;

  /* ─── Gradients ─────────────────────────────────────────── */
  --gradient-primary: linear-gradient(135deg, var(--primary-violet) 0%, var(--primary-orange) 100%);
  --gradient-violet:  linear-gradient(135deg, var(--violet-dark) 0%, var(--primary-violet) 100%);
  --gradient-hero:    linear-gradient(135deg, var(--violet-dark) 0%, var(--primary-violet) 50%, var(--primary-orange) 100%);
  --gradient-card:    linear-gradient(145deg, var(--primary-violet) 0%, var(--orange-dark) 100%);
  --gradient-dark:    linear-gradient(180deg, var(--gray-900) 0%, var(--gray-800) 100%);

  /* ─── Typography ────────────────────────────────────────── */
  --font-heading: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-body:    'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-mono:    'JetBrains Mono', 'Courier New', monospace;

  --text-xs:   0.75rem;
  --text-sm:   0.875rem;
  --text-base: 1rem;
  --text-lg:   1.125rem;
  --text-xl:   1.25rem;
  --text-2xl:  1.5rem;
  --text-3xl:  1.875rem;
  --text-4xl:  2.25rem;
  --text-5xl:  3rem;
  --text-6xl:  3.75rem;

  --font-normal:    400;
  --font-medium:    500;
  --font-semibold:  600;
  --font-bold:      700;
  --font-extrabold: 800;

  --leading-tight:   1.25;
  --leading-snug:    1.375;
  --leading-normal:  1.5;
  --leading-relaxed: 1.625;

  /* ─── 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;
  --space-24: 6rem;
  --space-32: 8rem;

  /* ─── Border Radius ─────────────────────────────────────── */
  --radius-sm:   0.25rem;
  --radius-md:   0.5rem;
  --radius-lg:   0.75rem;
  --radius-xl:   1rem;
  --radius-2xl:  1.5rem;
  --radius-full: 9999px;

  /* ─── Shadows ───────────────────────────────────────────── */
  --shadow-sm:     0 1px 2px 0 rgba(0,0,0,.05);
  --shadow-md:     0 4px 6px -1px rgba(0,0,0,.1), 0 2px 4px -2px rgba(0,0,0,.1);
  --shadow-lg:     0 10px 15px -3px rgba(0,0,0,.1), 0 4px 6px -4px rgba(0,0,0,.1);
  --shadow-xl:     0 20px 25px -5px rgba(0,0,0,.1), 0 8px 10px -6px rgba(0,0,0,.1);
  --shadow-2xl:    0 25px 50px -12px rgba(0,0,0,.25);
  --shadow-violet: 0 8px 30px rgba(91,44,126,.3);
  --shadow-orange: 0 8px 30px rgba(233,120,38,.3);

  /* ─── Transitions ───────────────────────────────────────── */
  --transition-fast:   150ms ease;
  --transition-base:   300ms ease;
  --transition-slow:   500ms ease;
  --transition-bounce: 300ms cubic-bezier(0.34, 1.56, 0.64, 1);

  /* ─── Layout ────────────────────────────────────────────── */
  --container-max: 1200px;
  --navbar-height: 72px;
  --sidebar-width: 280px;

  /* ─── Z-Index ───────────────────────────────────────────── */
  --z-dropdown: 100;
  --z-sticky:   200;
  --z-navbar:   300;
  --z-modal:    400;
  --z-toast:    500;

  /* ─── Vendor Badge Colors ───────────────────────────────── */
  --vendor-fortinet:    #EE3124;
  --vendor-paloalto:    #FA582D;
  --vendor-cisco:       #049FD9;
  --vendor-checkpoint:  #CC0000;
  --vendor-aws:         #FF9900;
  --vendor-azure:       #0089D6;
  --vendor-google:      #4285F4;
  --vendor-ibm:         #1F70C1;
  --vendor-splunk:      #65A637;
  --vendor-isc2:        #006847;
  --vendor-ec-council:  #2E3191;
  --vendor-pecb:        #0D2356;
  --vendor-pmi:         #003087;
  --vendor-axelos:      #6B2D8B;
  --vendor-advanced:    var(--primary-violet);
}