/* Explain: Theme tokens for the Canadian sports media identity, including header height. */
:root {
    --primary-color: #0033A0;
    --primary-hover: #002277;
    --secondary-color: #F8F9FA;
    --accent-color: #FFC72C;
    --logo-subtitle-color: #FFC72C;
    --button-color: #FFC72C;
    --background-color: #FFFFFF;
    --surface-color: #F0F4F8;
    --footer-bg: #001530;
    --text-color: #111111;
    --text-muted: #4A5568;
    --border-color: rgba(0, 51, 160, 0.12);
    --glass-bg: rgba(255, 255, 255, 0.95);
    --glass-border: rgba(0, 51, 160, 0.2);
    --nav-bg: #0033A0;
    --field-bg: #FFFFFF;
    --sage-soft: #EBF8FF;
    --sage-dark: #0033A0;
    --terracotta-soft: #FEFCBF;
    --shadow-soft: 0 10px 40px rgba(0, 0, 0, 0.08);
    --shadow-button: 0 8px 20px rgba(255, 199, 44, 0.3);
    --font-heading: 'Oswald', sans-serif;
    --font-body: 'Inter', sans-serif;
    --font-logo: 'Oswald', sans-serif;
    --font-dynamic: 'Bebas Neue', sans-serif;
    --accent-bright: #FFEB00;
    --header-height: 76px;
}

@media (min-width: 640px) {
    :root {
        --header-height: 84px;
    }
}

@media (min-width: 1024px) {
    :root {
        --header-height: 104px;
    }
}

@media (min-width: 1280px) {
    :root {
        --header-height: 112px;
    }
}