/* --- GESTION DE LA NAV-CONTAINER (FLEXBOX) --- */
.nav-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap; 
    gap: 15px; 
    padding: 10px 20px;
}

/* --- PROTECTION DU LOGO --- */
.brand-logo {
    display: flex;
    align-items: center;
    gap: 12px;
    text-decoration: none;
    flex-shrink: 0; 
}

.logo-text {
    display: flex;
    flex-direction: column;
    white-space: nowrap; 
}

/* --- AJUSTEMENT DU MENU ET DE LA LANGUE --- */
nav {
    margin-left: auto; 
    flex-grow: 0;     
}

nav ul {
    display: flex;
    list-style: none;
    margin: 0;
    padding: 0;
    flex-wrap: wrap; 
    gap: 15px; 
}

/* Le bouton de langue reste naturellement à sa place à droite */
.lang-dropdown {
    flex-shrink: 0;
    /* On s'assure qu'il n'a pas de marge automatique intempestive */
    margin-left: auto; 
}


/* --- RESPONSIVE --- */

@media (max-width: 1024px) {
    .nav-container {
        /* On garde les éléments en ligne ou on gère l'ordre si besoin, 
           mais ici on autorise le menu central à descendre à la ligne */
        justify-content: space-between;
    }
    
    /* Le menu central passe à la ligne et prend toute la largeur s'il le faut */
    nav {
        order: 3; /* Force le menu à passer en 3ème position (sous le logo et la langue) */
        flex-basis: 100%; /* Force le menu à occuper toute la largeur en dessous */
        margin-left: 0; 
    }
    
    nav ul {
        justify-content: center;
    }
}

/* --- TRÈS PETITS ÉCRANS (Smartphone portrait) --- */
@media (max-width: 768px) {
    /* Si tu souhaites masquer complètement le menu central sur mobile comme tu l'évoquais : */
    nav {
        display: none; /* Disparition du menu central */
    }
}
