#carousel-home{
    margin-bottom:25px;
}
#carousel-home li{
    list-style:none;
    padding:0;
}

#carousel-home .item .slide-text .btn{
    background-color:var(--color-white);
    border-color:var(--color-white);
    text-transform:uppercase;
    font-weight:bold;
}
#carousel-home .item .slide-text .btn:focus,
#carousel-home .item .slide-text .btn:hover{
    background-color:var(--color-white);
    border-color:var(--color-gray-light);
}
#carousel-home .carousel-indicators li{
    border-color:var(--color-primary);
    margin-right:5px;
    box-shadow:0px 0px 3px rgba(255,255,255,0.75);
}

.carousel-control{
    opacity:0.25;
}
.carousel-control.left,
.carousel-control.right{
    background-image:none;
}
.carousel-control .icon-next,
.carousel-control .icon-prev{
    width:32px;
    height:50px;
    margin-top:-25px;
    font-size:50px;
}
.carousel-control .icon-prev{
    margin-left:-50%;
}
.carousel-control .icon-next{
    margin-right:-50%;
}
.carousel-control .icon-prev::before,
.carousel-control .icon-next::before{
    display:inline-block;
    width:100%;
    text-align:center;
    font-family:'Icomoon';
}
.carousel-control .icon-prev::before{
    content:"\e9c8";
}
.carousel-control .icon-next::before{
    content:"\e9cb";
}
@media screen and (min-width:768px){
    .carousel-control{
        width:10%;
    }
    .carousel-control .icon-next,
    .carousel-control .icon-prev{
        width:50px;
        height:80px;
        margin-top:-40px;
        font-size:80px;
    }
}
@media screen and (min-width:1200px){
    .carousel-control{
        width:5%;
    }
}

/* Styles généraux du carrousel */
.custom-carousel{
    position:relative;
}

.custom-carousel .carousel-inner{
    position:relative;
    overflow:hidden;
}

.custom-carousel .item{
    display:none;
    position:relative;
}

.custom-carousel .item.active{
    display:block;
}

/* Structure des slides */
.slide-content{
    min-height:400px;
    display:flex;
    align-items:stretch;
}

.slide-text{
    padding:40px 60px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    position:relative;
}

.slide-image{
    background-size:cover;
    background-position:center;
    background-repeat:no-repeat;
    min-height:300px;
}

/* Styles du contenu textuel */
.slide-title{
    font-size:2em;
    font-weight:bold;
    margin-bottom:20px;
    color:white;
    text-shadow:2px 2px 4px rgba(0,0,0,0.3);
}

.slide-description{
    font-size:1.2em;
    margin-bottom:30px;
    color:white;
    text-shadow:1px 1px 2px rgba(0,0,0,0.3);
}

.slide-cta{
    align-self:flex-start;
}

/* Contrôles du carrousel */
.carousel-control{
    background:none;
    border:none;
    font-size:2em;
    color:white;
    text-shadow:2px 2px 4px rgba(0,0,0,0.5);
    opacity:0.7;
    transition:opacity 0.3s ease;
}

.carousel-control:hover,
.carousel-control:focus{
    color:white;
    opacity:1;
    text-decoration:none;
}

.carousel-control.left,
.carousel-control.right{
    background-image:none;
    filter:none;
}

/* Indicateurs */
.carousel-indicators{
    bottom:-40px;
}

.carousel-indicators li{
    border:2px solid white;
    background-color:transparent;
}

.carousel-indicators .active{
    background-color:white;
}

/* Responsive Design */
@media (max-width:767px){
    .slide-content{
        flex-direction:column;
        min-height:auto;
    }

    .slide-image{
        order:-1;
        min-height:calc(100vw / 4 * 3);
    }

    .slide-text{
        padding:30px 20px;
    }

    .slide-title{
        font-size:1.5em;
        margin-bottom:15px;
    }

    .slide-description{
        font-size:1.1em;
        margin-bottom:25px;
    }

    .carousel-control{
        font-size:1.5em;
    }
}

@media (min-width:768px){
    .slide-content{
        flex-direction:row;
        /*min-height:500px;*/
        min-height:calc(50vw * 3 / 4);
    }

    .slide-text{
        flex:0 0 50%;
        max-width:50%;
    }

    .slide-image{
        flex:0 0 50%;
        max-width:50%;
    }
    .carousel-indicators{
        bottom:20px;
    }
}

@media (min-width:1200px){
    /*.slide-content{
        min-height:600px;
        min-height:calc(50vw * 3 / 4);
    }*/

    .slide-text{
        padding:60px 90px;
    }

    .slide-title{
        font-size:2.5em;
    }

    .slide-description{
        font-size:1.3em;
    }
}
