.bandeau-promo {
    position: relative;
    z-index: 45;
    display: flex;
    align-items: center;
    background: var(--terre-500);
    color: var(--beige-100);
    border-bottom: 1px solid rgba(21, 32, 26, 0.18);
    overflow: hidden;
}

.bandeau-promo[hidden] {
    display: none;
}

.bandeau-promo__piste {
    display: flex;
    flex: 1;
    min-width: 0;
    gap: 0;
    padding-block: 0.55rem;
    mask-image: linear-gradient(90deg, transparent, #000 4rem, #000 calc(100% - 4rem), transparent);
}

.bandeau-promo__groupe {
    display: flex;
    align-items: center;
    flex-shrink: 0;
    gap: var(--e-6);
    padding-right: var(--e-6);
    animation: defilement var(--vitesse, 46s) linear infinite;
}

.bandeau-promo:hover .bandeau-promo__groupe,
.bandeau-promo:focus-within .bandeau-promo__groupe {
    animation-play-state: paused;
}

@keyframes defilement {
    from {
        transform: translate3d(0, 0, 0);
    }
    to {
        transform: translate3d(-100%, 0, 0);
    }
}

.bandeau-promo__item {
    display: inline-flex;
    align-items: center;
    gap: var(--e-2);
    font-size: var(--t-sm);
    letter-spacing: 0.04em;
    white-space: nowrap;
    transition: opacity var(--duree-1) var(--sortie);
}

.bandeau-promo__item:hover {
    opacity: 0.78;
}

.bandeau-promo__taux {
    font-family: var(--police-mono);
    font-size: var(--t-xs);
    font-weight: 700;
    letter-spacing: 0.06em;
    padding: 0.15rem 0.45rem;
    background: var(--beige-100);
    color: var(--terre-600);
    border-radius: var(--r-xs);
}

.bandeau-promo__note {
    font-family: var(--police-mono);
    font-size: var(--t-xs);
    text-transform: uppercase;
    letter-spacing: 0.18em;
    opacity: 0.85;
}

.bandeau-promo__etoile {
    opacity: 0.5;
}

.bandeau-promo__fermer {
    flex-shrink: 0;
    display: grid;
    place-items: center;
    width: 2.25rem;
    align-self: stretch;
    color: inherit;
    opacity: 0.7;
    border-left: 1px solid rgba(252, 249, 243, 0.22);
    transition: opacity var(--duree-1), background var(--duree-1);
}

.bandeau-promo__fermer:hover {
    opacity: 1;
    background: rgba(21, 32, 26, 0.14);
}

.entete {
    position: sticky;
    top: 0;
    z-index: 40;
    background: color-mix(in srgb, var(--creme) 82%, transparent);
    backdrop-filter: blur(14px) saturate(1.3);
    -webkit-backdrop-filter: blur(14px) saturate(1.3);
    border-bottom: 1px solid transparent;
    transition:
        border-color var(--duree-2) var(--sortie),
        background var(--duree-2) var(--sortie),
        box-shadow var(--duree-2) var(--sortie);
}

.entete.est-detachee {
    border-bottom-color: var(--trait);
    background: color-mix(in srgb, var(--creme) 94%, transparent);
    box-shadow: 0 12px 32px -28px rgba(21, 32, 26, 0.6);
}

.entete__interieur {
    display: flex;
    align-items: center;
    gap: var(--e-5);
    height: var(--entete-h);
    transition: height var(--duree-2) var(--sortie);
}

.entete.est-detachee .entete__interieur {
    height: 64px;
}

.marque {
    display: inline-flex;
    align-items: center;
    gap: 0.7rem;
    flex-shrink: 0;
}

.marque__ecusson {
    position: relative;
    display: grid;
    place-items: center;
    width: 2.6rem;
    height: 2.6rem;
    background: var(--vert-700);
    color: var(--beige-200);
    border-radius: var(--r-sm);
    overflow: hidden;
    transition: transform var(--duree-2) var(--ressort);
}

.marque:hover .marque__ecusson {
    transform: rotate(-6deg) scale(1.05);
}

.marque__ecusson img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    background: transparent;
}

.marque__monogramme {
    font-family: var(--police-titre);
    font-size: 1.32rem;
    font-weight: 600;
    font-variation-settings: "SOFT" 60, "WONK" 1;
    line-height: 1;
    padding-top: 2px;
}

.marque__texte {
    display: flex;
    flex-direction: column;
    line-height: 1.06;
}

.marque__nom {
    font-family: var(--police-titre);
    font-size: 1.32rem;
    font-weight: 600;
    letter-spacing: -0.02em;
}

.marque__baseline {
    font-family: var(--police-mono);
    font-size: 0.6rem;
    text-transform: uppercase;
    letter-spacing: 0.2em;
    color: var(--gris);
}

.nav-principale {
    display: flex;
    align-items: center;
    gap: var(--e-1);
    margin-left: auto;
}

.nav-principale__lien {
    position: relative;
    padding: 0.5rem 0.85rem;
    font-size: var(--t-sm);
    letter-spacing: 0.02em;
    color: var(--encre-doux);
    transition: color var(--duree-1) var(--sortie);
}

.nav-principale__lien::after {
    content: "";
    position: absolute;
    left: 0.85rem;
    right: 0.85rem;
    bottom: 0.25rem;
    height: 1px;
    background: var(--vert-500);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform var(--duree-2) var(--sortie);
}

.nav-principale__lien:hover {
    color: var(--vert-600);
}

.nav-principale__lien:hover::after {
    transform: scaleX(1);
}

.nav-principale__lien.est-active {
    color: var(--vert-700);
    font-weight: 600;
}

.nav-principale__lien.est-active::after {
    transform: scaleX(1);
    background: var(--beige-600);
}

.entete__actions {
    display: flex;
    align-items: center;
    gap: var(--e-2);
    flex-shrink: 0;
}

.declencheur-recherche {
    display: inline-flex;
    align-items: center;
    gap: var(--e-2);
    padding: 0.42rem 0.7rem 0.42rem 0.6rem;
    border: 1px solid var(--trait);
    border-radius: var(--r-sm);
    background: color-mix(in srgb, var(--surface) 70%, transparent);
    color: var(--gris);
    font-size: var(--t-sm);
    transition:
        border-color var(--duree-1) var(--sortie),
        color var(--duree-1) var(--sortie),
        background var(--duree-1) var(--sortie);
}

.declencheur-recherche:hover {
    border-color: var(--vert-300);
    color: var(--vert-700);
    background: var(--surface);
}

.declencheur-recherche kbd {
    font-family: var(--police-mono);
    font-size: 0.62rem;
    letter-spacing: 0.06em;
    padding: 0.12rem 0.32rem;
    border: 1px solid var(--trait);
    border-radius: var(--r-xs);
    background: var(--beige-100);
    color: var(--gris);
}

.entete__burger {
    display: none;
    flex-direction: column;
    justify-content: center;
    gap: 5px;
    width: 2.6rem;
    height: 2.6rem;
    border: 1px solid var(--trait);
    border-radius: var(--r-sm);
    padding: 0 0.65rem;
}

.entete__burger span {
    display: block;
    height: 1.5px;
    background: var(--encre);
    transition: transform var(--duree-2) var(--sortie), opacity var(--duree-1);
}

.entete__burger.est-ouvert span:nth-child(1) {
    transform: translateY(6.5px) rotate(45deg);
}

.entete__burger.est-ouvert span:nth-child(2) {
    opacity: 0;
}

.entete__burger.est-ouvert span:nth-child(3) {
    transform: translateY(-6.5px) rotate(-45deg);
}

.menu-mobile {
    position: fixed;
    inset: 0;
    z-index: 39;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: var(--e-2);
    padding: var(--e-8) var(--gouttiere);
    background: var(--vert-800);
    color: var(--beige-200);
    clip-path: circle(0% at calc(100% - 3rem) 2.5rem);
    transition: clip-path 620ms var(--doux);
    pointer-events: none;
}

.menu-mobile.est-ouvert {
    clip-path: circle(150% at calc(100% - 3rem) 2.5rem);
    pointer-events: auto;
}

.menu-mobile__lien {
    display: flex;
    align-items: baseline;
    gap: var(--e-3);
    padding-block: 0.6rem;
    font-family: var(--police-titre);
    font-size: clamp(1.9rem, 8vw, 3rem);
    border-bottom: 1px solid var(--trait-clair);
    opacity: 0;
    transform: translateY(1.5rem);
    transition: opacity 460ms var(--sortie), transform 460ms var(--sortie);
    transition-delay: calc(var(--i, 0) * 60ms + 140ms);
}

.menu-mobile.est-ouvert .menu-mobile__lien {
    opacity: 1;
    transform: none;
}

.menu-mobile__index {
    font-family: var(--police-mono);
    font-size: 0.7rem;
    letter-spacing: 0.18em;
    color: var(--vert-300);
}

.menu-mobile__pied {
    margin-top: var(--e-6);
    display: flex;
    flex-wrap: wrap;
    gap: var(--e-3);
}

.pied {
    position: relative;
    background: var(--vert-900);
    color: var(--beige-300);
    overflow: hidden;
}

.pied__bandeau {
    display: flex;
    overflow: hidden;
    border-bottom: 1px solid var(--trait-clair);
    mask-image: linear-gradient(90deg, transparent, #000 6rem, #000 calc(100% - 6rem), transparent);
}

.pied__piste {
    display: flex;
    flex-shrink: 0;
    align-items: center;
    gap: var(--e-6);
    padding: var(--e-4) var(--e-3) var(--e-4) 0;
    animation: defilement 34s linear infinite;
}

.pied__mot {
    font-family: var(--police-titre);
    font-size: clamp(1.4rem, 3.4vw, 2.6rem);
    font-style: italic;
    font-weight: 400;
    letter-spacing: -0.01em;
    color: transparent;
    -webkit-text-stroke: 1px var(--vert-400);
    white-space: nowrap;
}

.pied__mot--plein {
    color: var(--vert-300);
    -webkit-text-stroke: 0;
    font-style: normal;
}

.pied__grille {
    display: grid;
    grid-template-columns: 1.4fr repeat(3, 1fr);
    gap: var(--e-6);
    padding-block: clamp(3rem, 6vw, 5rem);
}

.pied__colonne h3 {
    font-family: var(--police-mono);
    font-size: var(--t-xs);
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.2em;
    color: var(--vert-300);
    margin-bottom: var(--e-4);
}

.pied__colonne ul {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
    font-size: var(--t-sm);
}

.pied__colonne a {
    position: relative;
    color: var(--beige-300);
    transition: color var(--duree-1) var(--sortie), padding-left var(--duree-2) var(--sortie);
}

.pied__colonne a::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    width: 0.5rem;
    height: 1px;
    background: var(--vert-300);
    opacity: 0;
    transition: opacity var(--duree-1);
}

.pied__colonne a:hover {
    color: var(--creme);
    padding-left: 0.9rem;
}

.pied__colonne a:hover::before {
    opacity: 1;
}

.pied__signature {
    font-family: var(--police-titre);
    font-size: var(--t-xl);
    color: var(--beige-200);
    margin-bottom: var(--e-3);
}

.pied__texte {
    font-size: var(--t-sm);
    color: var(--vert-200);
    max-width: 34ch;
}

.pied__bas {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: var(--e-3);
    padding-block: var(--e-4);
    border-top: 1px solid var(--trait-clair);
    font-family: var(--police-mono);
    font-size: var(--t-xs);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--vert-300);
}

.pied__filigrane {
    position: absolute;
    right: -2%;
    bottom: -22%;
    font-family: var(--police-titre);
    font-size: clamp(9rem, 26vw, 22rem);
    font-weight: 600;
    line-height: 1;
    color: var(--vert-800);
    pointer-events: none;
    user-select: none;
}

@media (max-width: 1080px) {
    .declencheur-recherche span {
        display: none;
    }

    .declencheur-recherche kbd {
        display: none;
    }
}

@media (max-width: 900px) {
    .nav-principale,
    .entete__actions .bouton--compte {
        display: none;
    }

    .entete__burger {
        display: flex;
        margin-left: auto;
    }

    .entete__actions {
        margin-left: auto;
    }

    .pied__grille {
        grid-template-columns: 1fr 1fr;
        gap: var(--e-5);
    }
}

@media (max-width: 560px) {
    .pied__grille {
        grid-template-columns: 1fr;
    }

    .marque__texte {
        display: none;
    }
}