/* Colors */
:root {
--bleu: #08345B;
--bleutresclair: #DFF0FF;
--bleuclair: #5088FF;
--bleumoyen: #005FA5;
--bleufonce: #111827;
--orange: #FAB928;
--vert: #00CEB9;
--vertclair: #D7F2F2;
--blanc: #fff;
--noir: #000;
--gris: #ccc;
--gris-clair: #9CA3AF;
--gris-moyen: #666;
--gris-fonce: #333;
--gris-fond: #F3F4F6;
--gris-texte: #5b6675;
}




/* Etudes de cas - LISTE -------------------------------------------------------------------------------------------- */
.liste-etudes-de-cas {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 40px;
    margin: 40px 0;
}
    .etude-de-cas {
        background: var(--blanc);
        border-radius: 16px;
        overflow: hidden;
        box-shadow: 0 8px 24px rgba(0,0,0,.08);
        transition: transform .25s ease,box-shadow .25s ease;
    }
        .etude-de-cas__image {
            height: 220px;
            overflow: hidden;
        }
            .etude-de-cas__image img {
                width: 100% !important;
                height: 100% !important;
                display: block;
                object-fit: cover;
            }
        .etude-de-cas_content {
            padding: 20px 30px;
        }
            .etude-de-cas__sur-titre {
            }
            .etude-de-cas h3 {
                font-size: 22px !important;
                line-height: 27px !important;
            }
            .etude-de-cas__excerpt {
                padding: 0 0 30px 0;
            }
@media (max-width:1000px) {
    .liste-etudes-de-cas {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}
@media (max-width:700px) {
    .liste-etudes-de-cas {
        grid-template-columns:1fr;
    }
    .etude-de-cas__image {
        height:190px;
    }
}
@media (min-width: 1000px) {
    .etude-de-cas:hover {
        transform:translateY(-4px);
        box-shadow:0 14px 36px rgba(0,0,0,.12);
    }
}




/* Etudes de cas - PAGE -------------------------------------------------------------------------------------------- */
.single-etude-de-cas__bandeau {
    position: relative;
    min-height: 620px;
    display: flex;
    align-items: center;
    overflow: hidden;
    margin-top: 0;
}
    .single-etude-de-cas__bandeau-image {
        position: absolute;
        inset: 0;
        z-index: 1;
    }
        .single-etude-de-cas__bandeau-image img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            display: block;
        }
    .single-etude-de-cas__bandeau:before {
        content: "";
        position: absolute;
        inset: 0;
        background: linear-gradient(
            to right,
            rgba(0, 25, 46, 1) 0%,
            rgba(0, 25, 46, 1) 35%,
            rgba(0, 25, 46, 0.33) 100%
        );
        z-index: 2;
    }
    .single-etude-de-cas__bandeau:after {
        content: "";
        position: absolute;
        right: 12%;
        top: 0;
        height: 100%;
        width: 80%;
        background: transparent url('../img/grille.svg') repeat;
        z-index: 3;
        pointer-events: none;
    }

    .single-etude-de-cas__bandeau-content {
        position: relative;
        z-index: 4;
        width: 100%;
    }
        .single-etude-de-cas__bandeau-content_header {
            max-width: 56%;
            margin: 100px auto 0 5%;
            color: var(--blanc);
        }
            .categorie_contenu {
                display: inline-block;
                padding: 6px 20px;
                margin: 0 0 14px 0;
                border-radius: 8px;
                background-color: var(--gris-moyen);
                color: var(--blanc);
                font-size: 15px;
            }
                .single-etude-de-cas__bandeau-content h1 {
                    color: var(--blanc) !important;
                }
                .single-etude-de-cas__intro {
                    color: var(--blanc);
                    font-size: 22px;
                    line-height: 28px;
                }

    .single-etude-de-cas__chiffres {
        margin: 70px 2% 44px 2%;
        background-color: rgba(255, 255, 255, 0.26);
        border-radius: 16px;
        padding: 76px 30px;
        display: flex;
        flex-wrap: wrap;
        gap: 60px 0;
    }
        .single-etude-de-cas__chiffre {
            position: relative;
            flex: 0 0 100%;
        }
            .single-etude-de-cas__chiffre-valeur {
                font-size: 50px;
                font-weight: 600;
                color: var(--blanc);
                margin: 0 0 20px 0;
            }
            .single-etude-de-cas__chiffre-label {
                color: var(--blanc);
            }

    .single-etude-de-cas__chiffre:before {
        content: "";
        position: absolute;
        left: 0;
        top: -34px;
        width: 52px;
        height: 9px;
        border-radius: 999px;
    }
        .single-etude-de-cas__chiffre:first-child:before {
            background-color: var(--bleuclair);
        }
        .single-etude-de-cas__chiffre:nth-child(2):before {
            background-color: var(--vert);
        }
        .single-etude-de-cas__chiffre:nth-child(3):before {
            background-color: var(--orange);
        }
        .single-etude-de-cas__chiffre:nth-child(4):before {
            background-color: var(--bleumoyen);
        }
        .single-etude-de-cas__chiffre:nth-child(5):before {
            background-color: var(--gris-moyen);
        }


@media (max-width: 919px) {
    .single-etude-de-cas__bandeau {
        min-height: 520px;
        padding: 80px 20px;
    }
        .single-etude-de-cas__bandeau:after {
            right: 0;
            width: 100%;
        }
        .single-etude-de-cas__bandeau-content {
            max-width: 100%;
        }
        .single-etude-de-cas__bandeau-content_header {
            max-width: 100%;
            margin: 80px auto 0 2%;
        }
        .single-etude-de-cas__bandeau-content h1 {
            font-size: 30px !important;
            line-height: 34px;
        }
}
@media (min-width: 920px) {
    .single-etude-de-cas__chiffres {
        margin: 100px 5% 74px 5%;
        padding: 76px 30px 50px 30px;
    }
    .single-etude-de-cas__chiffres {
        gap: 30px 1%;
    }
        .single-etude-de-cas__chiffre {
            flex: 0 0 24%;
        }
}



/* Le client en bref */
.single-etude-de-cas__client {
    margin: 100px 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: start;
    gap: 30px 0;
}
    .single-etude-de-cas__client-texte {
        flex: 0 0 100%;
    }
    .single-etude-de-cas__client-image {
        flex: 0 0 100%;   
    }
    .single-etude-de-cas__client-image img {
        border-radius: 16px;
    }


@media (min-width: 920px) {
    .single-etude-de-cas__client {
        gap: 0;
    }
        .single-etude-de-cas__client-texte {
            flex: 0 0 45%;
            margin: 0 5% 0 0;
        }
        .single-etude-de-cas__client-image {
            flex: 0 0 50%;   
        }
}



/* Le défi */
.single-etude-de-cas__defi {
    position: relative;
    padding: 80px 0;
    background-color: var(--gris-fond);
    z-index: 2;
}
    .single-etude-de-cas__defi-intro {
        max-width: 100%;
        text-align: center;
        margin: 0 auto 20px auto;
    }

.single-etude-de-cas__defi-image-wrap {
    position: relative;
    overflow: hidden;
    border-radius: 16px;
    margin-bottom: 30px;
    padding: 60px 0;
}
    .single-etude-de-cas__defi-image-wrap img {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100% !important;
        object-fit: cover;
        object-position: center center;
        display: block;
    }
    .single-etude-de-cas__defi-overlay {
        position: relative;
        z-index: 2;
        width: 40%;
        margin-left: 40px;
        padding: 20px;
        border-radius: 16px;
        background: rgba(0, 0, 0, 0.70);
        color: var(--blanc);
    }
        .single-etude-de-cas__defi-overlay blockquote {
            background-color: rgba(255, 255, 255, 0.26);
            margin: 20px 0 0 0;
            padding: 26px 20px 26px 30px;
            border-radius: 8px;
            border-left: 6px solid var(--bleuclair);
            font-size: 18px;
        }
            .single-etude-de-cas__defi-overlay blockquote p:last-child {
                padding-bottom: 0;
            }   
    
.single-etude-de-cas__defi-etapes {
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
}
    .single-etude-de-cas__defi-etape {
        position: relative;
        flex: 1 1 0;
        min-width: 240px;
        background: var(--blanc);
        border-radius: 16px;
        padding: 40px 30px 16px 30px;
    }
        .single-etude-de-cas__defi-etape-numero {
            font-family: 'Chillax-Semibold';
            margin-bottom: 20px;
            font-size: 48px;
            line-height: 1;
            font-weight: 700;
        }
        .single-etude-de-cas__defi-etape:nth-child(1) .single-etude-de-cas__defi-etape-numero {
            color: var(--bleuclair);
        }
        .single-etude-de-cas__defi-etape:nth-child(2) .single-etude-de-cas__defi-etape-numero {
            color: var(--vert);
        }
        .single-etude-de-cas__defi-etape:nth-child(3) .single-etude-de-cas__defi-etape-numero {
            color: var(--orange);
        }
        .single-etude-de-cas__defi-etape:nth-child(4) .single-etude-de-cas__defi-etape-numero {
            color: var(--bleufonce);
        }
    .single-etude-de-cas__defi-etape h3 {
        margin-bottom: 15px;
    }
    .single-etude-de-cas__defi-etape p {
        margin-bottom: 0;
    }
    .single-etude-de-cas__defi-etape:after {
        content: "";
        position: absolute;
        top: 48px;
        right: 30px;
        width: 40px;
        height: 26px;
        background: transparent url('../img/network.png') no-repeat center;
        border-radius: 6px;
    }
        .single-etude-de-cas__defi-etape:nth-child(1):after {
            background-color: var(--bleuclair);
        }
        .single-etude-de-cas__defi-etape:nth-child(2):after {
            background-color: var(--vert);
        }
        .single-etude-de-cas__defi-etape:nth-child(3):after {
            background-color: var(--orange);
        }
        .single-etude-de-cas__defi-etape:nth-child(4):after {
            background-color: var(--bleufonce);
        }

@media (max-width: 919px) {
    .single-etude-de-cas__defi {
        padding: 60px 0;
    }
    .single-etude-de-cas__defi-overlay {
        position: relative;
        left: auto;
        top: auto;
        transform: none;
        width: auto;
        margin: 40px 10px 0;
    }
    .single-etude-de-cas__defi-etape {
        flex: 0 0 100%;
    }
}
@media (min-width: 920px) {
    .single-etude-de-cas__defi-intro {
        max-width: 80%;
    }
    .single-etude-de-cas__defi-overlay {
        padding: 40px;
    }
}




/* Réponse Synidia */
.single-etude-de-cas__reponse {
    position: relative;
    overflow: hidden;
    padding: 100px 0;
    transform: translateY(-24px);
    margin-bottom: -24px;
    max-zoom: 1;
}
    .single-etude-de-cas__reponse-image {
        position: absolute;
        inset: 0;
        z-index: 1;
    }
        .single-etude-de-cas__reponse-image img {
            width: 100%;
            height: 100% !important;
            object-fit: cover;
            object-position: center center;
            display: block;
        }
    .single-etude-de-cas__reponse:before {
        content: "";
        position: absolute;
        inset: 0;
        background: linear-gradient(
            to right,
            rgba(0, 0, 0, 0.78) 0%,
            rgba(0, 0, 0, 0.68) 50%,
            rgba(0, 0, 0, 0.35) 100%
        );
        z-index: 2;
    }
    .single-etude-de-cas__reponse-content {
        position: relative;
        max-width: unset !important;
        z-index: 3;
    }
        .single-etude-de-cas__reponse-texte {
            max-width: 50%;
            color: var(--blanc);
            margin-bottom: 50px;
        }
        .single-etude-de-cas__reponse-texte p,
        .single-etude-de-cas__reponse-texte h2,
        .single-etude-de-cas__reponse-texte h3 {
            color: var(--blanc) !important;
        }

    .single-etude-de-cas__reponse-blocs {
        display: flex;
        flex-wrap: wrap;
        gap: 30px;
    }
        .single-etude-de-cas__reponse-bloc {
            flex: 1 1 0;
            min-width: 240px;
            padding: 20px;
            border-radius: 16px;
            background: rgba(255, 255, 255, 0.30);
        }
        .single-etude-de-cas__reponse-icone {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 56px;
            height: 32px;
            margin-bottom: 20px;
            padding: 0 14px;
            border-radius: 8px;
            color: var(--blanc);
            font-size: 13px;
            font-weight: 600;
            background-color: var(--vert);
            background-repeat: no-repeat;
            background-size: 24px;
            background-position: center;
            text-indent: -9999px;
        }

        .single-etude-de-cas__reponse-bloc h3 {
            margin-bottom: 12px;
            font-size: 24px !important;
            line-height: 28px !important;
            color: var(--blanc) !important;
        }

        .single-etude-de-cas__reponse-bloc p {
            margin-bottom: 0;
            color: var(--blanc) !important;
        }

@media (max-width: 919px) {
    .single-etude-de-cas__reponse {
        padding: 70px 30px;
    }
    .single-etude-de-cas__reponse-texte {
        max-width: 100%;
    }
    .single-etude-de-cas__reponse-bloc {
        flex: 0 0 100%;
    }
}
@media (min-width: 920px) {
    .single-etude-de-cas__reponse-bloc {
        padding: 30px;
    }
}




/* Avant-Après */
.single-etude-de-cas__avant-apres {
    background: var(--blanc);
    padding: 90px 0;
}
    .single-etude-de-cas__avant-apres-intro {
        max-width: 100%;
        text-align: center;
        margin: 0 auto 40px auto;
    }

.single-etude-de-cas__avant-apres-grid {
    display: flex;
    gap: 30px;
}
    .single-etude-de-cas__avant-apres-col {
        flex: 1 1 0;
        padding: 40px 40px 20px 40px;
        border-radius: 16px;
    }
        .single-etude-de-cas__avant {
            background: var(--blanc);
            box-shadow: 0 6px 24px -2px rgba(8, 52, 91, 0.10);
        }
        .single-etude-de-cas__apres {
            background: var(--bleu);
            color: var(--blanc);
        }
        .single-etude-de-cas__apres, 
        .single-etude-de-cas__apres h3 {
            color: var(--blanc) !important;
        }
            .single-etude-de-cas__apres h3,
            .single-etude-de-cas__avant h3 {
                margin: 4px 0 26px 0;
                padding-bottom: 20px;
                border-bottom: 1px solid var(--gris);
            }
        .single-etude-de-cas__avant-apres-label {
            display: block;
            margin-bottom: 25px;
            font-weight: 700;
            font-size: 22px;
            line-height: 1.2;
        }
        .single-etude-de-cas__avant-apres-texte ul {
            margin: 0;
            padding: 0;
        }
            .single-etude-de-cas__avant-apres-texte li {
                position: relative;
                list-style: none;
                padding-left: 42px;
                margin-bottom: 16px;
            }
            .single-etude-de-cas__avant-apres-texte li:before {
                content: "";
                position: absolute;
                left: 0;
                top: 0.15em;
                width: 24px;
                height: 24px;
                border-radius: 50%;
                background-position: center center;
                background-repeat: no-repeat;
                background-size: 12px 12px;
            }
                .single-etude-de-cas__avant .single-etude-de-cas__avant-apres-texte li:before {
                    background-color: var(--bleu);
                    background-image: url('../img/close.png');
                }
                .single-etude-de-cas__apres .single-etude-de-cas__avant-apres-texte li:before {
                    background-color: var(--blanc);
                    background-image: url('../img/check_bleu.png');
                }

@media (max-width: 919px) {
    .single-etude-de-cas__avant-apres {
        padding: 60px 0;
    }
    .single-etude-de-cas__avant-apres-grid {
        flex-direction: column;
    }
    .single-etude-de-cas__avant-apres-col {
        padding: 20px;
    }
}
@media (min-width: 920px) {
    .single-etude-de-cas__avant-apres-intro {
        max-width: 80%;
    }
}



/* Les piliers du projet */
.single-etude-de-cas__piliers {
    position: relative;
    overflow: hidden;
    background: var(--bleuclair);
    padding: 90px 0;
}
    .single-etude-de-cas__piliers:before {
        content: "";
        position: absolute;
        inset: 0;
        background: transparent url('../img/grille.svg') repeat;
        opacity: 1;
        z-index: 1;
        pointer-events: none;
    }
    .single-etude-de-cas__piliers-inner {
        position: relative;
        z-index: 2;
    }
        .single-etude-de-cas__piliers-intro {
            max-width: 100%;
            margin: 4px auto 50px auto;
            text-align: center;
        }
        .single-etude-de-cas__piliers-intro h2,
        .single-etude-de-cas__piliers-intro p {
            color: var(--blanc) !important;
        }

    .single-etude-de-cas__piliers-grid {
        display: flex;
        flex-wrap: wrap;
        gap: 30px;
    }
        .single-etude-de-cas__pilier {
            position: relative;
            flex: 1 1 0;
            min-width: 240px;
            background: var(--blanc);
            border-radius: 16px;
            padding: 30px 20px 16px 20px;
        }
            .single-etude-de-cas__pilier:after {
                content: "";
                position: absolute;
                bottom: -10px;
                left: 9%;
                width: 82%;
                height: 10px;
                border-bottom-left-radius: 10px;
                border-bottom-right-radius: 10px;
            }
            .single-etude-de-cas__pilier-icone {
                display: inline-flex;
                align-items: center;
                justify-content: center;
                min-width: 50px;
                height: 32px;
                margin-bottom: 20px;
                padding: 0 14px;
                border-radius: 8px;
                text-indent: -9999px;
                font-weight: 600;
                background-repeat: no-repeat;
                background-size: 24px;
                background-position: center;
            }
            .single-etude-de-cas__pilier h3 {
                margin-bottom: 12px;
                font-size: 26px !important;
            }
            .single-etude-de-cas__pilier p {
                margin-bottom: 0;
            }

        .single-etude-de-cas__pilier:nth-child(1):after {
            background-color: var(--bleu);
        }
        .single-etude-de-cas__pilier:nth-child(2):after  {
            background-color: var(--orange);
        }
        .single-etude-de-cas__pilier:nth-child(3):after  {
            background-color: var(--vert);
        }
        .single-etude-de-cas__pilier:nth-child(4):after  {
            background-color: var(--bleutresclair);
        }

        .single-etude-de-cas__pilier:nth-child(1) .single-etude-de-cas__pilier-icone {
            background-color: var(--bleu);
        }
        .single-etude-de-cas__pilier:nth-child(2) .single-etude-de-cas__pilier-icone {
            background-color: var(--orange);
        }
        .single-etude-de-cas__pilier:nth-child(3) .single-etude-de-cas__pilier-icone {
            background-color: var(--vert);
        }
        .single-etude-de-cas__pilier:nth-child(4) .single-etude-de-cas__pilier-icone {
            background-color: var(--bleuclair);
        }


@media (max-width: 919px) {
    .single-etude-de-cas__piliers {
        padding: 60px 0;
    }
    .single-etude-de-cas__pilier {
        flex: 0 0 100%;
    }
}
@media (min-width: 920px) {
    .single-etude-de-cas__piliers-intro {
        max-width: 80%;
    }
    .single-etude-de-cas__pilier {
        padding: 30px 30px 16px 30px;
    }
}






/* Résultats */
.single-etude-de-cas__resultats {
    padding: 100px 0;
}
    .single-etude-de-cas__resultats h2 {
        margin-bottom: 30px;
        font-size: 18px !important;
    }
    .resultats-introduction {
        margin-bottom: 60px;
    }
    .single-etude-de-cas__resultats-grid {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 70px 40px;
    }
    .single-etude-de-cas__resultat {
        position: relative;
    }
        .single-etude-de-cas__resultat:before {
            content: "";
            position: absolute;
            left: 0;
            top: -30px;
            width: 52px;
            height: 9px;
            border-radius: 999px;
        }
            .single-etude-de-cas__resultat:nth-child(5n+1):before {
                background-color: var(--bleuclair);
            }
            .single-etude-de-cas__resultat:nth-child(5n+2):before {
                background-color: var(--vert);
            }
            .single-etude-de-cas__resultat:nth-child(5n+3):before {
                background-color: var(--orange);
            }
            .single-etude-de-cas__resultat:nth-child(5n+4):before {
                background-color: var(--bleumoyen);
            }
            .single-etude-de-cas__resultat:nth-child(5n+5):before {
                background-color: var(--gris-moyen);
            }

        .single-etude-de-cas__resultat h3 {
            margin-bottom: 12px;
            font-size: 26px !important;
        }
        .single-etude-de-cas__resultat p {
            margin-bottom: 0;
        }

@media (max-width: 920px) {
    .single-etude-de-cas__resultats {
        padding: 60px 0;
    }
    .single-etude-de-cas__resultats-grid {
        grid-template-columns: 1fr;
    }
}






/* Liste - Etudes de cas */
.liste-etudes-de-cas {
    display: grid;
    grid-template-columns:1fr;
    gap: 30px;
}
    .liste-etudes-de-cas__item {
        min-height: 420px;
        border-radius: 16px;
        overflow: hidden;
        background-size: cover;
        background-position: center;
    }
        .liste-etudes-de-cas__overlay {
            min-height: 420px;
            padding: 35px 26px;
            display: flex;
            flex-direction: column;
            justify-content: flex-end;
            background:rgba(0,0,0,0.74);
        }
        .liste-etudes-de-cas__secteur { 
            text-indent: -9999px;
            width: 24px;
            height: 24px;
            margin: 0 0 25px 0;
            padding: 16px 25px;
            border-radius: 8px;
            background-repeat: no-repeat;
            background-position: center;
            background-size: contain;
            background-size: 24px;
        }
        .liste-etudes-de-cas__titre {
            margin:0 0 20px 0;
            color:var(--blanc) !important;
            font-size: 24px !important;
            line-height: 26px !important;
        }
        .liste-etudes-de-cas__texte {
            margin:0 0 30px 0;
            color:var(--blanc);
        }
        .liste-etudes-de-cas__lien {
            color:var(--blanc);
            font-size: 16px;
        }
        .liste-etudes-de-cas__lien:after {
            content: ">";
            margin: 0 0 0 8px;
        }

.liste-etudes-de-cas__item:nth-child(1) .liste-etudes-de-cas__secteur {
    background-color: var(--bleumoyen);;
}


@media(min-width: 800px){
    .liste-etudes-de-cas {
        grid-template-columns: repeat(2, 1fr);
    }
}
@media(min-width: 1000px){
    .liste-etudes-de-cas {
        grid-template-columns: repeat(3, 1fr);
    }
    .liste-etudes-de-cas__lien:hover {
        color: var(--bleuclair);
    }
}