/* ******************************************** */
/** MISSION
/* ******************************************** */

.c-mission__title{
    color: var(--color-lightest);
}

.c-mission__carousel{
    position: relative;
    z-index: 1;
}

.c-mission__carousel:before{
    content: "";
    display: block;
    position: absolute;
    z-index: -1;
    width: 100%;
    left: 0;
    bottom: -1px;
    height: 70px;
    background-color: var(--color-lightest);
}

.c-mission__carousel-item-holder{
    position: relative;
    aspect-ratio: 500/342;
}

.c-mission__carousel.js-carousel__notInit .c-mission__carousel-item-holder{
    width: 310px;
}

/* ********************** de Desktop a DESKTOP 2 ********************** */

@media (min-width: 1200px) {
    
    .c-mission__holder{
        padding-left: calc(var(--space-x) * 1.5 + 50px);
    }
    
    .c-mission__carousel{
        padding-left: 50px;
    }
    
    .c-mission__carousel.js-carousel__notInit .c-mission__carousel-item-holder{
        width: 462px;
    }

    /* Lines */

    .c-mission__carousel:after{
        content: "";
        display: block;
        position: absolute;
        left: var(--space-x);
        top: auto;
        bottom: calc(var(--section-y-xl)*-1);
        height: calc(var(--section-y-xl) + 70px);
        width: 1px;
        opacity: .17;
        background-color: var(--color-darkgreen);
        z-index: -1;
    }
}


/* ********************** de Desktop 2 a HD ********************** */

@media (min-width: 1400px) {

    /* Lines */

    .c-mission__carousel:after{
        left: 50%;
        margin-left: -640px;
    }
    
    .c-mission__carousel.js-carousel__notInit .c-mission__carousel-item-holder{
        width: 538px;
    }
}