/* @layer-wrap:site.zones */
@layer site.zones {
/* Version: 23-09-2026-20-19 */
#portfolio_page header {
    top: 0;
    left: 0;
    right: 0;
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
    overflow: visible;
}

/* line : logo + nav en rangée dans .header-inner (même plafond .pf-w-wide que #footer-main) */
#portfolio_page header.line {
    display: block;
}

#portfolio_page header.line .header-inner {
    display: flex;
    align-items: center;
}

#portfolio_page header .header-bar {
    display: flex;
    align-items: center;
    flex-shrink: 0;
    min-width: 0;
    transition: 0.2s linear;
}

@media (min-width: 1101px) {

    #portfolio_page header.line .header-bar {
        width: auto;
        max-width: none;
        margin: 0;
    }

    #portfolio_page header.line.nav-left .header-inner {
        justify-content: flex-start;
    }

    #portfolio_page header.line.nav-center .header-inner {
        justify-content: center;
    }

    #portfolio_page header.line.nav-right .header-inner {
        justify-content: space-between;
    }

    #portfolio_page header:is(.nav-left, .nav-center, .nav-right) .item-has-children > .sub-menu ul {
        justify-content: var(--pf-align-justify);
    }

    #portfolio_page header:is(.nav-left, .nav-center, .nav-right) #header-nav .nav__content .nav__list {
        justify-content: var(--pf-align-justify);
    }

}

#portfolio_page header .header-bar {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: 0.5s linear;
}

#portfolio_page header .nav-but-wrap {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    padding-left: 15px;
    transition: all 0.3s ease-out;
}

@media (min-width: 1101px) {

    /* Écart entre le logo et le menu : réglage « Espace entre le logo et le menu » (header-options.css). */

    #portfolio_page header.nav-left #header-nav.nav,
    #portfolio_page header.nav-right #header-nav.nav {
        flex: 1 1 0;
        min-width: 0;
        max-width: 100%;
    }

    #portfolio_page header.nav-center #header-nav.nav {
        flex: 0 1 auto;
        min-width: 0;
        max-width: calc(100% - 12rem);
    }

    #portfolio_page header #header-nav.nav {
        overflow: visible;
    }

    #portfolio_page header #header-nav .nav__content {
        min-width: 0;
        width: 100%;
    }

    #portfolio_page header #header-nav .nav__content .nav__list {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: flex-start;
        gap: var(--portfolios-header-nav-gap-y, 0.4rem) var(--portfolios-header-nav-gap-x, 1.25rem);
        padding: 4px 0 2px;
        overflow: visible;
    }

    #portfolio_page header #header-nav .nav__content .nav__list > li {
        margin: 0;
    }

    #portfolio_page header #header-nav .nav__content .nav__list li a {
        margin: 0;
    }

    /* Pastilles compactes dans la barre. Le pied de page n'est pas concerné : ses liens suivent le réglage « Liens ». */
    /* Apparence des liens : voir la feuille de liens (lot E2). */

}

#hamburgerBtn {
    display: none;
}
}

/* Déclarations imposées (D6, plan-elements-contenu.md § 6 bis) : couche « zones-imposees », après le thème, les
   dispositions et les pages, avant les réglages et le sur-mesure. Un thème ne les réécrit pas : il pose les
   variables d'accroche qu'elles lisent. Second bloc de couche : wrap.php --unwrap ne le retire pas. */
@layer site.zones-imposees {
#portfolio_page header {
    position: fixed;
}

@media (min-width: 1101px) {
    #portfolio_page header #header-nav {
        padding-left: var(--pf-header-logo-gap, 15px);
    }
}

@media (min-width: 1101px) {
    #portfolio_page header #header-nav .nav__content .nav__list li a {
        white-space: normal;
    }
}
}
