:root {
  /* Colors - Primary */
  --color-bg: #FDE0C7;
  --color-card-bg: #FFD4AF;
  --color-half-heading: #DE3C0D;
  --color-heading: #0C323C;
  --color-text: #000000CC;
  --color-button-bg: #DE3C0D;
  --bg-color-secondary: #141823;
  --bg-color-card-light: #FFE7D2;
  --font-color-blue: #BECAE8;
  --font-color-light-blue: #7A8399;
  
  /* Colors - Extended */
  --color-orange: #DE3C0D;
  --color-orange-hover: #c4330c;
  --color-cream: #FDE0C7;
  --color-light-orange: #FFD4AF;
  --color-lighter-orange: #FFC6A3;
  --color-lightest-orange: #FFC898;
  --color-gold: #F6A44D;
  --color-light-blue: #BECAE8;
  --color-gray-blue: #7A8399;
  --color-dark-blue: #2B3660;
  --color-darker-blue: #181C2D;
  --color-dark-gray-blue: #1E2336;
  --color-very-dark: #191D2A;
  --color-dark-bg: #0b1321;
  --color-dark-blue-alt: #243055;
  --color-dark-blue-hover: #2b3964;
  --color-accent-blue: #6C7AA0;
  --color-cream-alt: #E4D2A7;
  --color-secondary-para:#D0D1D3;
  --color-card-two:#72655A;
  --color-white: #fff;
  --color-black: #000;
  --placeholder-color:#97A6CF;
  
  /* Colors - Opacity variants */
  --color-black-80: #000000CC;
  --color-black-70: #000000B2;
  --color-black-20: #00000033;
  --color-white-80: #FFFFFF99;
  --color-white-50: #FFFFFF50;
  --color-border:#DE3C0D33;
  --color-white-25: rgba(255, 255, 255, 0.25);
  --color-white-20: rgba(255, 255, 255, 0.2);
  --color-white-18: rgba(255, 255, 255, 0.18);
  --color-white-10: rgba(255, 255, 255, 0.1);
  --color-black-25: rgba(0, 0, 0, 0.25);
  --color-black-20: rgba(0, 0, 0, 0.2);
  --color-cream-10: rgba(253, 224, 199, 0.1);
  
  /* Fonts */
  --font-heading: 'Nulshock', sans-serif;
  --font-body: 'Inter', sans-serif;

  /* Font sizes */
  --fs-h1: 52px;
  --fs-h2: 40px;
  --fs-h3: 32px;
  --fs-h4: 24px;
  --fs-body: 20px;
  --fs-btn: 14px;
  --fs-20: 20px;
  --fs-18: 18px;
  --fs-17: 17px;
  --fs-16: 16px;
  --fs-14: 14px;
  --fs-12: 12px;
  --fs-13: 13px;
  --fs-11: 11px;
  --fs-10: 10px;
  --bs-nav-link-font-size:13px;
  /* FONT WEIGHT */
  --fg-700: 700;
  --fg-500: 500;
  --fg-400: 400;
  --fg-600: 600;
  
  /* Spacing */
  --spacing-xs: 2px;
  --spacing-sm: 6px;
  --spacing-md: 12px;
  --spacing-lg: 16px;
  --spacing-xl: 24px;
  --spacing-2xl: 32px;
  --spacing-3xl: 40px;
  --spacing-4xl: 48px;
  --spacing-5xl: 56px;
  --spacing-6xl: 72px;
  --spacing-7xl: 80px;
  --section-padding: 80px;
  
  /* Border Radius */
  --radius-xs: 3px;
  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-lg: 8px;
  --radius-xl: 10px;
  --radius-2xl: 12px;
  --radius-3xl: 15px;
  --radius-4xl: 16px;
  --radius-5xl: 20px;
  --radius-6xl: 24px;
  --card-radius: 24px;
  --btn-radius: 6px;

  /* Shadows */
  --shadow-card: 0px 8px 20px 0px #FFCEA3;
  --shadow-card-dark: 0 4px 12px rgba(0, 0, 0, 0.3);
  --shadow-card-inset: inset 0 1px 0 rgba(0, 0, 0, 0.35);
  
  /* Gradients */
  --gradient-card-dark: radial-gradient(62.67% 62.67% at 50% 0%, #2B3660 0%, #181C2D 100%);
  --gradient-card-full: radial-gradient(100% 100% at 50% 0%, #2B3660 0%, #181C2D 100%);
  --gradient-data-content: radial-gradient(#2B3660, #181C2D);
  --gradient-blue-banner: linear-gradient(135deg, #4A90E2 0%, #357ABD 100%);
  --gradient-orange-banner: linear-gradient(135deg, #F6A44D 0%, #DE3C0D 100%);
  --gradient-fade-left: linear-gradient(90deg, #0b1321 0%, rgba(11, 19, 33, 0) 100%);
  --gradient-fade-right: linear-gradient(270deg, #0b1321 0%, rgba(11, 19, 33, 0) 100%);
}