.galerie-coulissante-verticale{position:relative; width:100%; height:100vh; overflow:hidden; cursor:grab; touch-action:pan-y;}
.slides-container{position:relative; width:100%; height:100vh; overflow:hidden; z-index:10; }

.slide-image{position:absolute; top:0px; left:0px; z-index:1; width:100%;}
.slide-image.is-entering {opacity:1; transform:translateY(0%)!important; z-index:3; transition:transform 0.8s ease-in-out, opacity 0.6s ease;}
.slide-image:not(.active):not(.is-entering) {opacity:0; transform:translateY(100%)!important; transition:none; z-index:1;}

.slide-image img {display:block; width:100%; height:100vh!important; object-fit:cover; object-position:center; user-select:none; -webkit-user-drag:none;}


/* --- AJOUT : STYLE DES FLÈCHES DE NAVIGATION --- */
.wgc-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 20; /* Doit être supérieur au z-index des slides */
    background-color: rgba(0, 0, 0, 0);
    border: none;
    border-radius: 50%;
    width: 50px;
    height: 50px;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0;
    transition: background-color 0.3s ease;
   filter: drop-shadow(00px 0px 7px #000);
}

.wgc-nav:hover {
    background-color: rgba(0, 0, 0, 0.6);
}

.wgc-nav.wgc-prev {
    left: 15px;
}

.wgc-nav.wgc-next {
    right: 15px;
}

.wgc-nav svg {
    width: 30px;
    height: 30px;
    fill: #ffffff;
}

/* C'est la "fenêtre" à travers laquelle on voit la galerie. *//*
.galerie-coulissante-verticale {position:relative; width:100%; height:100vh; overflow:hidden; cursor:grab; touch-action:pan-y;}
.slides-container {width:100%; height:100%; position:relative;}

.slide-image {position:absolute; top:0; left:0; width:100%; height:100vh; opacity 0; transform:translateY(100%); z-index: 1; transition:transform 0.8s ease-in-out, opacity 0.6s ease;}

/* 1. La slide actuellement visible et stable. *//*
.slide-image.active {opacity:1; transform:translateY(0); z-index:2;}

/* 2. La NOUVELLE slide qui entre par le haut. *//*
.slide-image.is-entering {opacity:1; transform:translateY(0%); z-index:3; transition:transform 0.8s ease-in-out, opacity 0.6s ease;}
.slide-image:not(.active):not(.is-entering) {opacity:0; transform:translateY(100%); transition:none; z-index:1;}

.slide-image img {display:block; width:100%; height:100vh; object-fit:cover; object-position:center; user-select:none; -webkit-user-drag:none;}