@media (max-width: 1024px) {
    /* main */
    .btn {
        font-size: 1.4rem;
    }

    /* header */
    .logo img {
        height: 45px;
        width: auto;
    }

    .header__nav > ul > li {
        font-size: 1.4rem;
    }

    /* FOOTER_Newsletter */
    .newsletter__form > form > div {
        gap: 8px;
    }
}

@media (max-width: 768px) {
    /* header */
    .header__container {
        position: relative; /* ➤ Permet d'ancrer correctement les éléments enfants */
    }

    .header__burger {
        display: block;
        color: var(--black);
        padding: 10px 15px;
        border-radius: 8px;
        position: relative;
    }

    .header__nav-container {
        display: none;
        position: absolute;
        top: 100%; /* Positionné juste sous le bouton */
        right: 0;
        width: 300px;
        background-color: var(--white);
        box-shadow: var(--border-shadow);
        border-radius: 15px;
        padding: 16px 16px;
        opacity: 0;
        transform: translateY(-10px);
        transition: opacity 0.3s ease, transform 0.3s ease;
    }

    .header__nav-container.is-active {
        display: flex;
        opacity: 1;
        transform: translateY(0);
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }

    .header__nav > ul {
        width: 100%;
        display: flex;
        flex-direction: column;
        padding: 0;
        margin: 0;
        list-style: none;
    }

    /* HEADeR - Gestion des icônes */
    .header__burger.is-active .header__burger-icon {
        opacity: 0; /* Masque l'icône burger lors de l'ouverture */
    }

    .header__burger.is-active .header__close-icon {
        opacity: 1; /* Affiche l'icône croix lors de l'ouverture */
    }

    /* FOOTER_Newsletter */
    .newsletter {
        gap: 24px;
        padding: 32px;
    }

    .newsletter__form {
        margin: 0 auto;
    }

    .newsletter__form > form > div {
        gap: 8px;
    }

    .newsletter__form > form > div > .invi-recaptcha {
        display: none;
    }
}

@media (max-width: 640px) {
    .footer__container {
        flex-flow: column wrap;

        gap: 24px;
    }

    .footer__legal {
        flex-flow: column nowrap;
        align-items: center;
    }
}