:root {
    /* Color Palette */
    --color-primary-blue: #11468F; /* Deep Blue Backgrounds */
    --color-primary-dark: #0d366e; /* Darker shade for hover/active */
    --color-accent-yellow: #F4D03F; /* Buttons, Highlights */
    --color-accent-hover: #e0be30; /* Darker yellow for hover */
    
    --color-text-light: #FFFFFF;
    --color-text-dark: #1A1A1A;
    --color-text-muted: #4B5563; /* Gray-600 equivalent */
    
    --color-bg-light: #F9FAFB; /* Off-white for sections */
    --color-bg-white: #FFFFFF;
    
    /* Typography */
    --font-heading: 'Inter', system-ui, -apple-system, sans-serif;
    --font-body: 'Inter', system-ui, -apple-system, sans-serif;
    
    /* Spacing */
    --spacing-xs: 0.5rem;
    --spacing-sm: 1rem;
    --spacing-md: 2rem;
    --spacing-lg: 4rem;
    --spacing-xl: 6rem;
    
    /* Border Radius */
    --radius-sm: 4px;
    --radius-md: 8px;
    --radius-lg: 16px;
    --radius-full: 9999px;
    
    /* Shadows */
    --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
    --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
    --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    
    /* Transitions */
    --transition-base: all 0.3s ease;
}