/* ===============================
   SECTION AFTER MAST (HERO)
   =============================== */

/* Définit la hauteur de la section après le masthead
   à 90% de la hauteur de l’écran */
#after_mast{
    padding-bottom: 10%!important;
}

/* Classe utilitaire pour forcer un fond transparent */
.back_transp{
    background-color: transparent!important;
}

/* ===============================
   SECTION GALERIE
   =============================== */

/* Section principale de la galerie
   - padding-top en vh pour un espacement responsive
   - position relative pour contenir les éléments en absolute
   - hauteur égale à la hauteur du viewport */
.section_gallerie{
    padding-top: 10vh!important;
    position: relative;
    height:100vh!important;
}

/* Supprime la marge haute de la section avis */
#avis_house{
    margin-top: 0vh!important;
}

/* Fond du slider */
.back_slider{
    background-color: #657a73!important;
}

/* Largeur automatique de la galerie (desktop) */
.gal_auto{
    width: 60%!important;
}

/* Arrondi uniquement sur l’angle supérieur gauche */
.gal_left_corner{
    border-top-left-radius: 25%!important;
}

/* ===============================
   BLOCS DE FOND DÉCORATIFS
   =============================== */

/* Fond décoratif principal
   positionné en bas de la section */
#back{
    background-color: #40534d;
    position: absolute;
    bottom: -10%;
    height:60%;
    width: 100%;
    border-top-left-radius: 25%!important;
    z-index: 0;
}

/* Bande de fond en bas de page */
#back_bottom{
    background-color: #40534d;
    height:20vh;
    width: 100%;
}

/* Second fond décoratif, plus bas,
   avec un arrondi en haut à droite */
#back2{
    background-color: #d3c2b5;
    position: absolute;
    bottom: -50%;
    height:80%;
    width: 100%;
    border-top-right-radius: 25%!important;
    z-index: 0;
}




/* ===============================
   MEDIA QUERIES
   =============================== */

/* Écrans jusqu’à 1366px */
@media (max-width: 1366px){
    .section_gallerie{
        height:100vh!important;
    }
}

/* Écrans larges mais peu hauts (tablettes paysage) */
@media (max-width: 1280px) and (max-height: 1024px){
    .section_gallerie{
        height:90vh!important;
    }
}

/* Écrans larges et plus bas */
@media (max-width: 1280px) and (max-height: 800px){
    .section_gallerie{
        height:100vh!important;
    }
    #avis_house{
        height:70vh!important;
    }
}
/* Écrans larges et plus bas */
@media (max-width: 1280px) and (max-height: 720px){

    #avis_house{
        height:80vh!important;
    }
}
/* Écrans intermédiaires */
@media (max-width: 1152px){
    .section_gallerie{
        height:100vh!important;
    }
    #avis_house{
        height:60vh!important;
    }
}

/* Tablettes / petits écrans */
@media (max-width: 800px){
    .section_gallerie{
        height:100vh!important;
        min-height: 400px!important;
    }
    #avis_house{
        height:80vh!important;
    }
}

/* Mobile */
@media (max-width: 700px){
    /* La galerie prend plus de largeur */
    .gal_auto{
        width:80%!important;
        overflow: hidden;
    }
    #slider,
    #slider2,
    #slider3 {
        touch-action: none;
        touch-action: pan-y;
    }
}