/* ==========================================================================
   INTELLIBRIDGE AI - DESIGN VARIABLES & TOKENS
   Refined Network Solutions Inspired Corporate Color System & Spacing Scale
   ========================================================================== */

:root {
  /* Brand Palette (Network Solutions Corporate Blue & Deep Navy) */
  --color-primary: #0B5FD9;
  --color-primary-dark: #084BB0;
  --color-primary-light: #2B7DF5;
  --color-primary-subtle: #F3F8FD;

  --color-secondary: #0A1A33;
  --color-secondary-dark: #061122;

  --color-accent: #0284C7;
  --color-accent-hover: #0369A1;
  --color-accent-subtle: #F0F9FF;

  /* Neutral Text Colors */
  --color-text-primary: #0A1A33;
  --color-text-secondary: #33475B;
  --color-text-muted: #64748B;
  --color-text-light: #94A3B8;

  /* Background Treatments (White & Soft Light-Blue #F3F8FD) */
  --color-background: #FFFFFF;
  --color-background-soft: #F3F8FD;
  --color-background-subtle: #EDF4FA;
  --color-surface: #FFFFFF;
  --color-surface-hover: #F8FAFC;

  /* Borders (Thin Light-Gray) */
  --color-border: #E2E8F0;
  --color-border-hover: #CBD5E1;
  --color-border-focus: #0B5FD9;

  /* Dark Section & Footer Backgrounds */
  --color-utility-bg: #0A1A33;
  --color-dark-bg: #0A1A33;
  --color-dark-navy: #0A1A33;
  --color-white: #FFFFFF;

  /* Status Colors */
  --color-success: #10B981;
  --color-success-bg: #ECFDF5;
  --color-error: #EF4444;
  --color-error-bg: #FEF2F2;

  /* Typography Stack */
  --font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", sans-serif;

  /* Container Max Width (Desktop Scale: 1240px) */
  --container-width: 1240px;

  /* Border Radius System (12-16px cards) */
  --radius-sm: 6px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 16px;
  --radius-pill: 9999px;

  /* Elevation Shadows (Soft Trustworthy Corporate Shadows) */
  --shadow-sm: 0 2px 8px rgba(10, 26, 51, 0.04);
  --shadow-md: 0 6px 20px rgba(10, 26, 51, 0.06);
  --shadow-lg: 0 12px 32px rgba(10, 26, 51, 0.08);
  --shadow-xl: 0 20px 40px rgba(10, 26, 51, 0.10);

  /* Spacing Scale System */
  --space-1: 0.25rem;  /* 4px */
  --space-2: 0.5rem;   /* 8px */
  --space-3: 0.75rem;  /* 12px */
  --space-4: 1rem;     /* 16px */
  --space-5: 1.5rem;   /* 24px */
  --space-6: 2rem;     /* 32px */
  --space-7: 3rem;     /* 48px */
  --space-8: 4rem;     /* 64px */
  --space-9: 6rem;     /* 96px */
  --space-10: 7.5rem;  /* 120px */

  /* Transitions */
  --transition-fast: 150ms cubic-bezier(0.16, 1, 0.3, 1);
  --transition-normal: 250ms cubic-bezier(0.16, 1, 0.3, 1);
}