:root {

  /* ==========================
     BRAND COLORS
  ========================== */

   /* === BRAND COLORS === */
  --primary: #2e2b7a;
  --primary-light: #4a4796;
  --primary-soft: #c9c8e8;

  --accent: #f47a20;
  --accent-hover: #d96a1c;
  --accent-soft: #fbe3d1;

  /* === BACKGROUNDS === */
  --bg-main: #f5f6fa;
  --bg-section: #ededf5;
  --bg-warm: #f3efea;
  --bg-card: #ffffff;

  --navy-blue: #2e2b7a;
  --orange: #f47a20;
  --white: #ffffff;
  --light-gray: #f9fafb;
  --border-gray: #e5e7eb;
  --text-gray: #666666;
  --dark-text: #1f2937;
  --green: #10b981;
  --green-light: #d1fae5;
  --yellow-light: #fef3c7;
  --gray-light: #f1f5f9;
  --gray-medium: #94a3b8;
  --red: #ef4444;

  /* === TEXT === */
  --text-primary: #2f2f3a;
  --text-secondary: #6b6b7a;
  --text-muted: #a0a0b2;

  /* === BORDERS === */
  --border-light: #d6d6e5;

  /* === SHADOW === */
  --shadow-soft: 0 4px 20px rgba(46, 43, 122, 0.08);
}

  /* ==========================
     NEUTRAL COLORS
  ========================== */

  --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;

  --border-gray: #E5E7EB;

  /* ==========================
     TEXT COLORS
  ========================== */

  --text-dark: #111827;
  --text-light: #6B7280;
  --text-muted: #9CA3AF;

  /* ==========================
     STATUS COLORS
  ========================== */

  --success: #16A34A;
  --success-bg: #DCFCE7;

  --warning: #D97706;
  --warning-bg: #FEF3C7;

  --danger: #DC2626;
  --danger-bg: #FEE2E2;

  /* ==========================
     SHADOWS
  ========================== */

  --shadow-sm: 0 2px 8px rgba(0,0,0,.05);

  --shadow-md: 0 10px 30px rgba(0,0,0,.08);

  --shadow-lg: 0 20px 40px rgba(0,0,0,.12);

  --shadow-xl: 0 30px 60px rgba(0,0,0,.15);

  /* ==========================
     BORDER RADIUS
  ========================== */

  --radius-sm: 10px;
  --radius-md: 20px;
  --radius-lg: 30px;
  --radius-full: 999px;

  /* ==========================
     SPACING
  ========================== */

  --space-xs: .5rem;
  --space-sm: 1rem;
  --space-md: 1.5rem;
  --space-lg: 2rem;
  --space-xl: 3rem;
  --space-2xl: 5rem;
  --space-3xl: 7rem;

  /* ==========================
     TRANSITIONS
  ========================== */

  --transition-fast: .2s ease;
  --transition: .3s ease;
  --transition-slow: .5s ease;

  /* ==========================
     MAX WIDTHS
  ========================== */

  --container: 1200px;
  --container-narrow: 800px;
}