/**
 * Mobility Trailblazers v4 CSS Framework
 * Design Tokens - CSS Custom Properties
 * Version: 4.0.0
 */

:root {
  /* Brand Colors */
  --mt-color-primary: #00694E;
  --mt-color-primary-dark: #084452;
  --mt-color-primary-light: #009879;
  --mt-color-bg: #F4F5F7;
  --mt-text: #333333;
  --mt-border: #009879;

  /* Secondary Colors */
  --mt-color-secondary: #084452;
  --mt-color-accent: #0072BC;
  --mt-color-success: #4caf50;
  --mt-color-warning: #ff9800;
  --mt-color-error: #f44336;
  
  /* Neutral Colors */
  --mt-color-white: #fff;
  --mt-color-gray-light: #f5f5f5;
  --mt-color-gray-medium: #9e9e9e;
  --mt-color-gray-dark: #616161;
  
  /* Typography */
  --mt-font-family: system-ui, -apple-system, "Segoe UI", roboto, arial, sans-serif;
  --mt-font-headings: "Poppins", var(--mt-font-family);
  --mt-font-size-base: 16px;
  --mt-font-size-small: 0.875rem;
  --mt-font-size-large: 1.125rem;
  --mt-font-size-h1: 2rem;
  --mt-font-size-h2: 1.5rem;
  --mt-font-size-h3: 1.25rem;
  --mt-line-height: 1.5;
  
  /* Spacing */
  --mt-space-xs: 4px;
  --mt-space-sm: 8px;
  --mt-space-md: 16px;
  --mt-space: 20px;
  --mt-space-lg: 24px;
  --mt-space-xl: 32px;
  --mt-space-2xl: 48px;
  
  /* Layout */
  --mt-container-max: 1200px;
  --mt-gap: 20px;
  
  /* Border & Radius */
  --mt-radius-sm: 8px;
  --mt-radius: 14px;
  --mt-radius-lg: 16px;
  --mt-radius-full: 999px;
  --mt-border-width: 1px;
  
  /* Shadows */
  --mt-shadow-sm: 0 2px 4px rgb(0 0 0 / 6%);
  --mt-shadow: 0 6px 16px rgb(0 0 0 / 8%);
  --mt-shadow-lg: 0 10px 30px rgb(0 0 0 / 12%);
  
  /* Transitions */
  --mt-transition: all 0.3s ease;
  --mt-transition-fast: all 0.15s ease;
}