/* ==========================================================================
   1. RÈGLES GÉNÉRALES
   ========================================================================== */

body img {
    max-width: 100% !important;
    height: auto !important;
}

/* Header desktop */
#header {
    background: #ffffff !important;
    min-height: 110px !important;
    display: flex !important;
    align-items: center !important;
    border-bottom: 1px solid #f0f0f0 !important;
}

#header .logo img {
    height: 100px !important;
}

/* Décalage desktop */
body.header-fixed #page-wrapper > section#start {
    padding-top: 115px !important;
}

/* Footer */
footer#footer {
    background: #f4f4f4 !important;
    padding: 2rem 0 !important;
}

/* Saut de ligne mobile masqué par défaut */
.mobile-break {
    display: inline !important;
}

.mobile-break::before {
    content: " ";
}

/* Footer sur une seule ligne en desktop */
footer#footer p {
    white-space: nowrap !important;
}


/* ==========================================================================
   2. MOBILE
   ========================================================================== */

@media (max-width: 480px) {

    /* Header mobile */
    #header {
        min-height: 95px !important;
        padding-top: 10px !important;
        padding-bottom: 10px !important;
    }

    #header .logo img {
        height: 70px !important;
        width: auto !important;
    }

    /* Espace sous le header sur pages normales */
    body.header-fixed #page-wrapper > section#start {
        padding-top: 20px !important;
    }

    /* Neutralisation du padding interne excessif */
    #page-wrapper > section#start {
        padding-top: 10px !important;
    }

    /* Ajustement titres en haut de page */
    #page-wrapper > section#start h1,
    #page-wrapper > section#start .blog-header,
    #page-wrapper > section#start .list-blog-header {
        margin-top: 10px !important;
    }

    /* Images du contenu */
    .body-content img {
        display: block !important;
        margin: 15px auto !important;
    }

    /* Hero mobile uniquement pour l’accueil */
    body.modular .section.modular-hero.hero.hero-fullscreen {
        background-image: url('../../../pages/01.accueil/01._grande-image/hero-mobile.jpg') !important;
        background-position: center top !important;
        background-size: cover !important;
        background-repeat: no-repeat !important;
        min-height: 96vh !important;
        padding-top: 28vh !important;
    }

    /* Retour à la ligne uniquement sur smartphone */
    .mobile-break {
        display: block !important;
        height: 0 !important;
    }

    .mobile-break::before {
        content: "";
    }

    /* Footer autorisé sur plusieurs lignes en mobile */
    footer#footer p {
        white-space: normal !important;
    }

    /* Texte hero mobile */
    body.modular .section.modular-hero.hero.hero-fullscreen p,
    body.modular .section.modular-hero.hero.hero-fullscreen .lead {
        font-size: 0.88rem !important;
        line-height: 1.3 !important;
        white-space: normal !important;
    }

    /* Overlay / menu mobile blanc quand le hamburger est ouvert */
    body.mobile-nav-open,
    body.mobile-nav-open .mobile-menu,
    body.mobile-nav-open .mobile-container,
    body.mobile-nav-open #header,
    body.mobile-nav-open #body-wrapper,
    body.mobile-nav-open .overlay,
    body.mobile-nav-open .page-overlay,
    body.mobile-nav-open .mobile-overlay {
        background: #ffffff !important;
        background-color: #ffffff !important;
    }

    /* Liens du menu lisibles sur fond blanc */
    body.mobile-nav-open .mobile-menu a,
    body.mobile-nav-open .mobile-menu li a,
    body.mobile-nav-open .mobile-container a,
    body.mobile-nav-open .mobile-container li a {
        color: #222222 !important;
        text-shadow: none !important;
    }

    /* Lien actif */
    body.mobile-nav-open .mobile-menu .active > a,
    body.mobile-nav-open .mobile-container .active > a,
    body.mobile-nav-open .mobile-menu a.active,
    body.mobile-nav-open .mobile-container a.active {
        color: #1e73be !important;
    }

    /* Centrage du listing Agenda / blog sur smartphone */
    #body-wrapper.blog-listing .container.grid-lg,
    #body-wrapper.blog-listing .columns,
    #body-wrapper.blog-listing .item.column.col-12.extra-spacing,
    #body-wrapper.blog-listing .bricklayer,
    #body-wrapper.blog-listing .bricklayer-column,
    #body-wrapper.blog-listing .card {
        width: 100% !important;
        max-width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        box-sizing: border-box !important;
    }

    /* Titre hero */
    body.modular .section.modular-hero.hero.hero-fullscreen h1 {
        font-size: 1.4rem !important;
        line-height: 1.2 !important;
        margin-bottom: 18px !important;
    }

    /* Phrase sous le titre */
    body.modular .section.modular-hero.hero.hero-fullscreen p,
    body.modular .section.modular-hero.hero.hero-fullscreen .lead {
        font-size: 0.92rem !important;
        line-height: 1.35 !important;
        letter-spacing: -0.2px !important;
        margin-top: 0 !important;
    }
}