/* ==========================================================================
   Design System Variables
   ========================================================================== */
:root {
  /* Colors - Brand Official */
  --color-primary-orange: #f18700;
  --color-primary-orange-hover: #d17500;
  
  --color-primary-blue: #002f6c;
  --color-primary-blue-hover: #001f4c;
  
  --color-secondary-blue: #00509d;
  
  /* Colors - Text & Backgrounds */
  --color-text-main: #333333;
  --color-text-muted: #666666;
  --color-text-light: #ffffff;
  
  --color-bg-white: #ffffff;
  --color-bg-light: #f7f7f7;
  --color-bg-dark: #001a3d;

  /* Typography */
  --font-family-main: 'Montserrat', sans-serif;
  
  --font-weight-regular: 400;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;

  /* Spacing */
  --space-xs: 0.5rem;   /* 8px */
  --space-sm: 1rem;     /* 16px */
  --space-md: 2rem;     /* 32px */
  --space-lg: 4rem;     /* 64px */
  --space-xl: 6rem;     /* 96px */

  /* Components */
  --border-radius-btn: 4px;
  --border-radius-card: 8px;
  
  --box-shadow-subtle: 0 4px 6px rgba(0, 0, 0, 0.05);
  --box-shadow-hover: 0 10px 20px rgba(0, 0, 0, 0.1);

  /* Transitions */
  --transition-fast: 0.2s ease-in-out;
  --transition-normal: 0.3s ease-in-out;
}
