:root {
    --color-primary: #1B4D7A;
    --color-primary-hover: #153D61;
    --color-primary-light: #E8F0F7;
    --color-primary-muted: #3D6D96;
    --color-accent: #E85D2C;
    --color-accent-hover: #CF4F22;
    --color-accent-light: #FFF0EA;
    --color-accent-glow: rgba(232, 93, 44, 0.22);
    --color-bg: #F4F6F9;
    --color-bg-warm: #FAFBFC;
    --color-surface: #FFFFFF;
    --color-text: #1A1D21;
    --color-text-secondary: #5C6370;
    --color-border: #E2E5EB;
    --color-border-soft: #EEF1F5;
    --color-success: #2D7A4F;
    --color-success-light: #E8F5EE;
    --color-sponsored-bg: #EEF1F5;
    --color-footer-bg: #0F2D47;
    --color-footer-text: #E8ECF1;

    --font-heading: 'DM Sans', system-ui, sans-serif;
    --font-body: 'Inter', system-ui, sans-serif;

    --container-max: 1140px;
    --section-gap: 48px;
    --section-gap-lg: 72px;
    --radius-card: 16px;
    --radius-form: 20px;
    --radius-btn: 10px;
    --radius-pill: 999px;
    --shadow-sm: 0 1px 3px rgba(26, 29, 33, 0.06);
    --shadow-card: 0 4px 24px rgba(26, 29, 33, 0.07);
    --shadow-card-hover: 0 12px 40px rgba(26, 29, 33, 0.1);
    --shadow-hero: 0 20px 60px rgba(27, 77, 122, 0.12);
    --shadow-btn: 0 4px 14px rgba(232, 93, 44, 0.35);
    --gradient-hero: linear-gradient(135deg, #F8FAFC 0%, #EEF4FA 45%, #FFF5F0 100%);
    --gradient-primary: linear-gradient(135deg, #1B4D7A 0%, #256391 100%);
    --gradient-accent: linear-gradient(135deg, #E85D2C 0%, #F07040 100%);
    --transition: 0.22s ease;
}

@media (min-width: 1024px) {
    :root {
        --section-gap: 72px;
    }
}