/*============BANDEAU=============*/

#bandeau-carousel {

    width: 100%;

    height: clamp(34vh, 60vw, 70rem);

    /* Set fixed height */

    overflow: hidden;

    /* Prevent overflow outside the container */

    position: relative;

    /* Allows inner items to be positioned */

    margin: auto;

    /* Center the carousel horizontally */

}



#bandeau-splide {

    height: 100%;

}



.splide__track {

    height: 100%;

    /* Match container height */

}



.splide__slide {

    width: 100%;

    height: 100%;

    overflow: hidden;

    display: flex;

    justify-content: center;

    align-items: center;

    /* Ensure content doesn't overflow */

}



.bandeau-item {

    width: 100%;

    height: 100%;

    position: relative;

    cursor: pointer;

}



.bandeau-item img {

    width: 100%;

    /* Maintain aspect ratio by default */

    height: 100%;

    /* Match the container's height */

    object-fit: cover;

    /* Scale the image and crop as necessary */

    object-position: center center;

    /* Center cropping both horizontally and vertically */

}



.bandeau-item::before {

    content: '';

    position: absolute;

    top: 0;

    left: 0;

    right: 0;

    bottom: 0;

    background-color: rgba(0, 0, 0, 0.25);

    /* Black color with 25% opacity */

    z-index: 2;

    /* Ensures the filter is on top of the image */

}



.bandeau-item::after {

    content: '';

    position: absolute;

    top: 0;

    left: 0;

    right: 0;

    bottom: 0;

    z-index: 1;

    opacity: .7;

    box-shadow: inset 171px 0px 303px rgba(0, 0, 0, 0.75);

    width: 100%;

    height: 100%;

}



.bandeau-info {

    position: absolute;

    top: 50%;

    max-width: 960px;

    transform: translateY(-50%);

    color: var(--param_couleurTexte2);

    text-align: left;

    z-index: 3;

    padding: 0 clamp(2rem, 5vw, 11.4rem);

}



.bandeau-title {

    

    font-weight: 600;

    font-family: 'Open Sans', sans-serif;

    margin: 0;

}


@media screen and (min-width: 768px) {
    .bandeau-title {
      font-size: clamp(3.4rem, 5vw, 5rem);
    }
  }




.bandeau-subtitle {

    font-family: "Source Serif 4", serif;

    font-weight: 600;

    font-style: italic;

    font-size: 4.6rem;

}



.bandeau-link {

    display: flex;

    align-items: center;

    justify-content: center;

    background-color: var(--param_couleur1);

    width: fit-content;

    border-radius: 10px;

    padding: 8px;

    margin-top: clamp(1rem, 2vw, 2.4rem);

    transition: all .2s ease-in-out;

}



.bandeau-link:hover {

    background-color: var(--param_couleur_hover1);

}



.bandeau-link span {

    font-family: 'Open Sans', sans-serif;

    font-weight: 400;

    margin-right: 8px;

}



.bandeau-credit {

    position: absolute;

    bottom: 1rem;

    right: 1.4rem;

    z-index: 3;

    color: var(--param_couleurTexte2);

    text-transform: capitalize;

    font-style: italic;

}



.splide__pagination__page {

    background-color: #fff;

    /* Default color */

    width: 1.2rem;

    height: 1.2rem;

    border-radius: 50%;

    margin: 0.5rem 0.5rem;

    transition: background-color 0.3s ease;

    opacity: 1;

    /* Smooth transition */

}



.splide__pagination__page.is-active {

    background-color: var(--param_couleur1);

    /* Highlighted color */

}



/* .splide__arrow {

    position: absolute;

    top: 50%;

    transform: translateY(-50%);

    background-color: transparent;

    border: none;

    cursor: pointer;

    z-index: 10;

}





.splide__arrow--prev {

    left: 2rem;



}





.splide__arrow--next {

    right: 2rem;



}



.custom-prev-button,

.custom-next-button {

    width: 4.4rem;

    height: 4.4rem;

    background-color: var(--param_couleur2);

    border-radius: 50%;

    color: white;

    display: flex;

    justify-content: center;

    align-items: center;

    font-size: 2rem;

    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);

    transition: background-color 0.3s ease;

    border: 0.3rem solid #fff;

    opacity: 1;

}





.custom-prev-button i,

.custom-next-button i {

    font-size: 2.4rem;

} */