/* CSS Custom Properties - Design System Variables */

:root {
  /* Color Palette - Primary */
  --color-primary-navy: #1a2332;
  --color-primary-navy-light: #2d3e50;
  
  /* Color Palette - Accent */
  --color-accent-gold: #d4af37;
  --color-accent-gold-light: #e6c968;
  --color-accent-gold-dark: #b8941f;
  
  /* Color Palette - Neutral */
  --color-neutral-white: #ffffff;
  --color-neutral-light-gray: #f8f9fa;
  --color-neutral-medium-gray: #6c757d;
  --color-neutral-dark-gray: #343a40;
  
  /* Color Palette - Semantic */
  --color-semantic-success: #28a745;
  --color-semantic-error: #dc3545;
  --color-semantic-warning: #ffc107;
  --color-semantic-info: #17a2b8;
  
  /* Typography - Font Families */
  --font-family-primary: 'Roboto', sans-serif;
  --font-family-headings: 'Montserrat', sans-serif;
  
  /* Typography - Font Sizes */
  --font-size-h1: 3rem;        /* 48px */
  --font-size-h2: 2.5rem;      /* 40px */
  --font-size-h3: 2rem;        /* 32px */
  --font-size-h4: 1.5rem;      /* 24px */
  --font-size-h5: 1.25rem;     /* 20px */
  --font-size-h6: 1rem;        /* 16px */
  --font-size-body: 1rem;      /* 16px */
  --font-size-small: 0.875rem; /* 14px */
  
  /* Typography - Font Weights */
  --font-weight-light: 300;
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;
  
  /* Spacing Scale */
  --spacing-xs: 0.25rem;   /* 4px */
  --spacing-sm: 0.5rem;    /* 8px */
  --spacing-md: 1rem;      /* 16px */
  --spacing-lg: 1.5rem;    /* 24px */
  --spacing-xl: 2rem;      /* 32px */
  --spacing-xxl: 3rem;     /* 48px */
  --spacing-xxxl: 4rem;    /* 64px */
}