/* =========================================
   EN-TÊTE — logo, menu principal, bouton mobile
   Mobile (< 900px) : menu replié derrière le bouton [data-nav-toggle] (main.js).
   Sans JS, le menu reste visible (classe .js absente du <html>).
   ========================================= */

.site-header {
    position: sticky;
    top: 0;
    z-index: 50;
    background-color: var(--color-header-background);
    border-bottom: var(--border-width) solid var(--color-border);
}

.admin-bar .site-header {
    top: var(--wp-admin--admin-bar--height, 0);
}

.site-header__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-md);
    min-height: var(--header-height);
}

.site-header__name {
    font-family: var(--font-heading);
    font-size: var(--text-xl);
    font-weight: var(--weight-heading);
    color: var(--color-text);
    text-decoration: none;
}

.site-header__brand .custom-logo {
    width: auto;
    max-height: calc(var(--header-height) - var(--space-sm));
}

.site-nav {
    display: flex;
    align-items: center;
    gap: var(--space-md);
}

.site-nav__list {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-md);
}

.site-nav__list a {
    color: var(--color-text);
    font-weight: var(--weight-medium);
    text-decoration: none;
}

.site-nav__list a:hover,
.site-nav__list .current-menu-item > a,
.site-nav__list .current-menu-ancestor > a {
    color: var(--color-link);
}

/* Sous-menus : affichés sous l'entrée parente */
.site-nav__list .sub-menu {
    list-style: none;
    padding-left: var(--space-sm);
}

/* Bouton du menu mobile (3 barres) */
.site-header__toggle {
    display: none;
    width: var(--toggle-size);
    height: var(--toggle-size);
    align-items: center;
    justify-content: center;
}

.site-header__toggle-bar,
.site-header__toggle-bar::before,
.site-header__toggle-bar::after {
    display: block;
    width: var(--toggle-bar-width);
    height: var(--toggle-bar-height);
    background-color: var(--color-text);
    transition: transform var(--transition-fast), opacity var(--transition-fast);
}

.site-header__toggle-bar {
    position: relative;
}

.site-header__toggle-bar::before,
.site-header__toggle-bar::after {
    content: "";
    position: absolute;
    left: 0;
}

.site-header__toggle-bar::before { top: calc(-1 * var(--toggle-bar-gap)); }
.site-header__toggle-bar::after { top: var(--toggle-bar-gap); }

.site-header__toggle[aria-expanded="true"] .site-header__toggle-bar { background-color: transparent; }
.site-header__toggle[aria-expanded="true"] .site-header__toggle-bar::before { transform: translateY(var(--toggle-bar-gap)) rotate(45deg); }
.site-header__toggle[aria-expanded="true"] .site-header__toggle-bar::after { transform: translateY(calc(-1 * var(--toggle-bar-gap))) rotate(-45deg); }

@media (max-width: 900px) {
    .js .site-header__toggle {
        display: inline-flex;
    }

    .site-header__inner {
        flex-wrap: wrap;
    }

    .site-nav {
        flex-basis: 100%;
        flex-direction: column;
        align-items: flex-start;
        padding-bottom: var(--space-md);
    }

    .js .site-nav {
        display: none;
    }

    .js .site-nav.is-open {
        display: flex;
    }

    .site-nav__list {
        flex-direction: column;
        gap: var(--space-xs);
    }
}