/* === Carousel Container === */
.carousel {
    width: 95%;
    max-width: 1200px;   /* Desktop */
    margin: 0 auto;
    padding: 2rem 0;
    overflow: visible; /* flèches visibles */
}

/* === Slides === */
.carousel .slick-slide {
    display: flex !important;
    justify-content: center;
    align-items: center;
    border-radius: 0.5rem;
    overflow: hidden;
    margin: 0 10px;   /* espace entre slides */
}

.carousel .slide-inner {
    width: 100%;
    aspect-ratio: 5/4;   /* hauteur proportionnelle */
    padding: 1rem;
    background: #F6F4F1;
    color: #000;
    border-radius: 0.5rem;
    box-shadow: 0 6px 24px rgba(0,0,0,0.25);
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

/* Texte */
.carousel .slide-inner h2 { font-size: 1.5rem; margin-bottom:0.5rem; color: #232950 ;}
.carousel .slide-inner p { font-size: 1rem; line-height:1.4; color: #232950 ;}

/* Slide centrale */
.carousel .slick-slide.slick-center .slide-inner {
    transform: scale(1.05);
    box-shadow: 0 8px 28px rgba(0,0,0,0.25);
}

/* Flèches */
.carousel .slick-prev, .carousel .slick-next {
    top: 50%;
    transform: translateY(-50%);
    z-index: 10;
}
.carousel .slick-prev { left: -40px; }
.carousel .slick-next { right: -30px; }
.carousel .slick-prev:before,
.carousel .slick-next:before { color: #F6F4F1; font-size:1.875rem; }
.carousel .slick-prev:hover:before,
.carousel .slick-next:hover:before { color:#F6F4F1; }

/* === Tablette === */
@media (max-width:1024px){
    .carousel { max-width: 700px; }    /* carousel plus petit */
    .carousel .slide-inner h2 { font-size:1.3rem; }
    .carousel .slide-inner p { font-size:0.95rem; }
    .carousel .slick-prev { left:-30px; }
    .carousel .slick-next { right:-20px; }
}

/* === Mobile === */
@media (max-width:768px){
    .carousel { max-width: 350px; }    /* carousel encore plus petit */
    .carousel .slide-inner h2 { font-size:1rem; }
    .carousel .slide-inner p { font-size:0.85rem; }
    .carousel .slick-prev { left:-20px; }
    .carousel .slick-next { right:-10px; }
}
