/*
 * Corrections responsive du thème (vendor/styles/main.css est la feuille compilée d'origine, laissée intacte).
 * Chargée après main.css. Défauts constatés aussi sur le site 8.7.
 */

/* Menu principal : le thème masque les entrées jusqu'à 1326 px et affiche alors le bouton du menu mobile,
   mais ce bouton portait « d-md-none » : aucune navigation entre 768 et 1326 px. À 1326 px exactement, le menu
   mobile était en outre masqué (règle min-width: 1326px) alors que les entrées l'étaient aussi. */
@media (min-width: 1327px) {
    .menu .menu__cell.bg-menu {
        display: none;
    }
}
@media (max-width: 1326px) {
    html body #menu-mobile {
        display: block !important;
    }
}

/* En-tête, tablette : bloc « Inscrivez-vous » trop étroit (25 %), texte coupé mot à mot sous la carte d'Europe */
@media (min-width: 781px) and (max-width: 1199.98px) {
    .sub-header {
        background-size: 230px auto;
        background-position: 57% 0;
    }
    .sub-header .col-md-9 {
        flex: 0 0 60%;
        max-width: 60%;
    }
    .sub-header .col-md-3 {
        flex: 0 0 40%;
        max-width: 40%;
    }
    .sub-header .logo {
        font-size: 22px;
    }
    .sub-header .info .red {
        font-size: 21px;
    }
    .sub-header .info .black {
        font-size: 20px;
    }
}

/* Actualités de l'accueil, 992 à 1199 px : « L'Europe en Île-de-France » passait sur 3 lignes et décalait
   sa colonne de 26 px par rapport aux trois autres */
@media (min-width: 992px) and (max-width: 1199.98px) {
    .container--grey .actuality__category {
        font-size: 22px;
        padding-right: 20%;
    }
}

/* Cartes d'actualités : le chapô passait sous le bouton « + » (hauteur de carte fixe) */
.actuality__description {
    padding-right: 26px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
}

/* Pied de page : 4 colonnes de 90 px en tablette, titres coupés sur 4 lignes ; 2 colonnes sous 992 px
   (gabarit : col-lg-3 col-sm-6) et marge droite des titres réduite hors grand écran */
@media (max-width: 1199.98px) {
    .footer__title {
        padding-right: 10%;
    }
}
@media (min-width: 576px) and (max-width: 991.98px) {
    .footer__col:nth-of-type(2n) {
        border-right: 0;
    }
}

/* Titres sur plusieurs lignes : lignes équilibrées (« L'Europe en / Île-de-France » plutôt que « … Ile- / de-France ») */
.footer__title,
.actuality__category span,
.information__title span {
    text-wrap: balance;
}
