/* === MENU BURGER (MOBILE) === */

/* Bouton burger */
.burger {
    display: none;
    flex-direction: column;
    justify-content: center;
    gap: 4px;
    width: 35px;
    height: 35px;
    margin: auto 15px auto 0;
    cursor: pointer;
    margin-right: 50px;
}

.burger span {
    width: 100%;
    height: 4px;
    background: #93abc9; /* couleur de ton header */
    border-radius: 5px;
    transition: 0s ease;
}

.burger:hover span {
  background: rgb(67, 71, 124);
}


/* ---- MOBILE ---- */
@media (max-width: 900px) {

    /* Le nav passe en menu déroulant */
    nav {
        position: absolute;
        top: 80px; /* hauteur du header */
        right: 0;
        width: 100%;
        background: #ecf4ff;
        flex-direction: column;
        align-items: center;
        padding: 0;
        max-height: 0;
        overflow: hidden;
        transition: max-height 0.35s ease;
    }

    nav.open {
        max-height: 400px; /* hauteur ouverte (ajuste si besoin) */
        border-top: 1px solid #c0d3ef;
    }

    .nav-item {
        width: 100%;
        padding: 15px 0;
        border-bottom: 1px solid #d6dde9;
    }

    /* Afficher le burger */
    .burger {
        display: flex;
    }

    /* Masquer le menu horizontal par défaut */
    header {
        justify-content: space-between;
        align-items: center;
    }
}

/* Animation burger → croix */
.burger.open span:nth-child(1) {
    transform: translateY(8px) rotate(45deg);
}
.burger.open span:nth-child(2) {
    opacity: 0;
}
.burger.open span:nth-child(3) {
    transform: translateY(-8px) rotate(-45deg);
}