/* STYLESHEET: Variables */
/* CSS custom properties (colors, spacing, fonts, etc.) */

:root {
    /* ===== BRAND COLORS ===== */
    --color-navy: #00254D;
    --color-navy-dark: #0A2347;
    --color-green: #3DBF2B;
    --color-green-dark: #35a825;
    --color-white: #FFFFFF;
    --color-orange: #FF6B35;
    
    /* ===== TEXT COLORS ===== */
    --text-primary: #FFFFFF;
    --text-secondary: #3DBF2B;
    
    /* ===== HEADER DIMENSIONS ===== */
    --header-height: 110px;
    --header-bg: var(--color-navy);
    
    /* Logo */
    --logo-width: 213px;
    --logo-height: 62px;
    --logo-left-padding: 81px;
    --logo-top-margin: 24px;
    --logo-bottom-margin: 23.68px;
    --logo-nav-gap: 88.98px;
    
    /* Navigation */
    --nav-font-size: 13px;
    --nav-link-gap: 21px;
    --nav-vertical-spacing: 45px;
    
    /* Contact Section */
    --contact-gap: 62px;
    --phone-icon-width: 25px;
    --phone-icon-height: 22px;
    --call-text-size: 14px;
    --call-text-top-margin: 27px;
    --phone-number-size: 28px;
    --phone-bottom-margin: 16px;
    --right-edge-spacing: 74px;
    --right-container-padding: 120px;
    
    /* ===== RESPONSIVE BREAKPOINTS ===== */
    --breakpoint-4k: 2560px;
    --breakpoint-large-desktop: 1920px;
    --breakpoint-desktop: 1440px;
    --breakpoint-large-tablet: 1024px;
    --breakpoint-tablet: 768px;
    --breakpoint-mobile: 480px;
    --breakpoint-small-mobile: 320px;
    --breakpoint-ultra-small: 280px;
    
    /* ===== TRANSITIONS ===== */
    --transition-fast: 150ms ease;
    --transition-normal: 250ms ease;
    --transition-slow: 350ms ease;
    
    /* ===== Z-INDEX LAYERS ===== */
    --z-header: 1000;
    --z-mobile-menu: 999;
    --z-overlay: 998;
}
