/* 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;
}





/* Widgets Salient --------------------------------------------------------------------------------- */
/* Widget salient - liste numérotée */
.liste-numerotee {
    counter-reset: etape;
    margin: 60px 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 30px 0;
}
    .liste-numerotee .liste-numerotee-item {
        flex: 0 0 100%;
        position: relative;
    }
        .liste-numerotee.liste-numerotee--blocs .liste-numerotee-item {
            padding: 50px 20px 40px 26px;
            box-shadow: 0 6px 24px -2px rgba(8, 52, 91, 0.10);
            border-radius: 16px;
        }
        .liste-numerotee.liste-numerotee--bordure .liste-numerotee-item {
            padding: 14px 20px 10px 26px;
            border-left: 1px solid var(--bleumoyen);
        }
        .liste-numerotee .liste-numerotee-item .liste-numerotee-numero {
            font-family: 'Chillax-Semibold';
            display: inline-block;
            font-size: 56px;
            color: var(--bleuclair);
            margin-bottom: 28px;
        }
        .liste-numerotee .liste-numerotee-item .liste-numerotee-contenu h3 {
            font-size: 24px !important;
            line-height: 28px !important;
        }
        .liste-numerotee .liste-numerotee-item .liste-numerotee-icone {
            position: absolute;
            top: 30px;
            right: 26px;
            width: 24px;
            height: 24px;
            border-radius: 8px;
            padding: 18px 26px;
            background-repeat: no-repeat;
            background-position: center;
            background-size: 24px;
        }

        .liste-numerotee.liste-numerotee--blocs .liste-numerotee-item:nth-child(1) .liste-numerotee-numero {
            color: var(--bleuclair);
        }
        .liste-numerotee.liste-numerotee--blocs .liste-numerotee-item:nth-child(2) .liste-numerotee-numero {
            color: var(--vert);
        }
        .liste-numerotee.liste-numerotee--blocs .liste-numerotee-item:nth-child(3) .liste-numerotee-numero {
            color: var(--orange);
        }
        .liste-numerotee.liste-numerotee--blocs .liste-numerotee-item:nth-child(4) .liste-numerotee-numero {
            color: var(--bleumoyen);
        }
        .liste-numerotee.liste-numerotee--blocs .liste-numerotee-item:nth-child(5) .liste-numerotee-numero {
            color: var(--gris-moyen);
        }

        .liste-numerotee .liste-numerotee-item:nth-child(1) .liste-numerotee-icone {
            background-color: var(--bleuclair);
        }
        .liste-numerotee .liste-numerotee-item:nth-child(2) .liste-numerotee-icone {
            background-color: var(--vert);
        }
        .liste-numerotee .liste-numerotee-item:nth-child(3) .liste-numerotee-icone {
            background-color: var(--orange);
        }
        .liste-numerotee .liste-numerotee-item:nth-child(4) .liste-numerotee-icone {
            background-color: var(--bleumoyen);
        }
        .liste-numerotee .liste-numerotee-item:nth-child(5) .liste-numerotee-icone {
            background-color: var(--gris-moyen);
        }

@media (min-width: 600px) {
    .liste-numerotee {
        gap: 30px 2%;
    }
        .liste-numerotee .liste-numerotee-item {
            flex: 0 0 48%;
        }
}
@media (min-width: 1000px) {
    .liste-numerotee {
        gap: 30px 2%;
    }
        .liste-numerotee .liste-numerotee-item {
            flex: 1;
        }
}
@media (min-width: 1200px) {
   .liste-numerotee--large .liste-numerotee-item {
        flex: 0 0 48% !important;
    }
}



/* Widget salient - secteur industriels */
.synidia-bloc-industries {
    position: relative;
}
    .synidia-bloc-industries__image {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 1;
    }
        .synidia-bloc-industries__image img {
            width: 100%;
            height: 100% !important;
            object-fit: cover;
            border-radius: 16px;
            margin-bottom: 0 !important;
        }
    .synidia-bloc-industries__content {
        position: relative;
        padding: 80px 20px 30px 36px;
        color: var(--blanc);
        z-index: 2;
    }
        .synidia-bloc-industries__content h3 {
            font-size: 30px;
            position: relative;
            color: var(--blanc) !important;
        }
        .synidia-bloc-industries__content h3:before {
            content: "";
            position: absolute;
            top: -50px;
            left: 0;
            border-radius: 8px;
            padding: 4px 14px;
            height: 24px;
            width: 24px;
        }
            .synidia-bloc-industries.secteur_industrie .synidia-bloc-industries__content h3:before {
                background: var(--orange) url('../img/manufacturing.png') no-repeat center;
            }
            .synidia-bloc-industries.secteur_logistique .synidia-bloc-industries__content h3:before {
                background: var(--bleuclair) url('../img/truck.png') no-repeat center;
            }
            .synidia-bloc-industries.secteur_services .synidia-bloc-industries__content h3:before {
                background: var(--vert) url('../img/network.png') no-repeat center;
            }
        .synidia-bloc-industries__profiles {
            margin: 26px 0 20px 0;
        }
            .synidia-bloc-industries__profiles li {
                list-style: none;
                display: inline-block;
                background-color: var(--gris-moyen);
                color: var(--blanc);
                padding: 3px 15px;
                margin: 0 10px 4px 0;
                border-radius: 8px;
                font-size: 14px;
            }
        .synidia-bloc-industries__lien {
            display: inline-block;
            border: 1px solid var(--blanc);
            padding: 16px 40px 16px 24px;
            border-radius: 16px;
            background: transparent url('../img/arrow-white-right.png') no-repeat 92% center;
            color: var(--blanc);
            font-size: 15px;
            transition: all 0.3s;
        }

    .synidia-bloc-industries:after {
        content: "";
        position: absolute;
        bottom: -10px;
        left: 9%;
        width: 82%;
        height: 10px;
        border-bottom-left-radius: 10px;
        border-bottom-right-radius: 10px;
    }
        .synidia-bloc-industries.secteur_industrie:after {
            background-color: var(--orange);
        }
        .synidia-bloc-industries.secteur_logistique:after {
            background: var(--bleuclair);
        }
        .synidia-bloc-industries.secteur_services:after {
            background: var(--vert);
        }
@media (min-width: 1000px) {
    .synidia-bloc-industries__lien:hover {
        transform: translateY(-4px);
    }
}






/* Widget salient - Liste chiffres-clés */
.chiffres-cles {
    display: flex;
    flex-wrap: wrap;
    gap: 30px 0;
    justify-content: space-between;
}
    .chiffre-cle {
        position: relative;
        flex: 0 0 100%;
        background-color: var(--blanc);
        padding: 20px 16px 30px 20px;
        border-radius: 16px;
        box-shadow: 0 8px 32px -4px rgba(8, 52, 91, 0.20);
    }
    .chiffres-cles--fond-transparent .chiffre-cle {
        background-color: rgba(255, 255, 255, 0.12);
    }
        .chiffre-cle-valeur {
            font-family: 'Chillax-Semibold';
            font-size: 25px;
            color: var(--bleufonce);
            margin: 0 0 20px 0;
        }
        .chiffres-cles--fond-transparent .chiffre-cle-valeur {
            color: var(--blanc);
        }
        .chiffre-cle-label {
            color: var(--bleufonce);
        }
        .chiffres-cles--fond-transparent .chiffre-cle-label {
            color: var(--blanc);
        }
        .chiffre-cle-icone {
            margin: 0 0 20px 0;
            width: 24px;
            height: 24px;
            padding: 16px 25px;
            border-radius: 8px;
            background-repeat: no-repeat;
            background-position: center;
            background-size: 24px;
        }
        .chiffres-cles .chiffre-cle:nth-child(1) .chiffre-cle-icone {
            background-color: var(--bleuclair);
        }
        .chiffres-cles .chiffre-cle:nth-child(2) .chiffre-cle-icone {
            background-color: var(--vert);
        }
        .chiffres-cles .chiffre-cle:nth-child(3) .chiffre-cle-icone {
            background-color: var(--orange);
        }
        .chiffres-cles .chiffre-cle:nth-child(4) .chiffre-cle-icone {
            background-color: var(--bleumoyen);
        }
        .chiffres-cles .chiffre-cle:nth-child(5) .chiffre-cle-icone {
            background-color: var(--gris-moyen);
        }
    .chiffres-cles--fond-transparent .chiffre-cle,
    .chiffres-cles--fond-blanc .chiffre-cle {
        padding-top: 30px;
    }
    .chiffres-cles--surlignage .chiffre-cle {
        padding-top: 70px;
    }
    .chiffres-cles--surlignage .chiffre-cle-icone {
        display: none;
    }
    .chiffres-cles--surlignage .chiffre-cle:before {
        content: "";
        position: absolute;
        left: 20px;
        top: 26px;
        width: 52px;
        height: 9px;
        border-radius: 999px;
    }    
        .chiffres-cles--surlignage .chiffre-cle:nth-child(1):before {
            background-color: var(--bleuclair);
        }
        .chiffres-cles--surlignage .chiffre-cle:nth-child(2):before{
            background-color: var(--vert);
        }
        .chiffres-cles--surlignage .chiffre-cle:nth-child(3):before {
            background-color: var(--orange);
        }
        .chiffres-cles--surlignage .chiffre-cle:nth-child(4):before {
            background-color: var(--bleumoyen);
        }
        .chiffres-cles--surlignage .chiffre-cle:nth-child(5):before {
            background-color: var(--gris-moyen);
        }

@media (min-width: 500px) {
    .chiffres-cles {
        gap: 30px 2%;
    }
    .chiffre-cle {
        flex: 0 0 48%;
    }
}
@media (min-width: 800px) {
    .chiffre-cle {
        flex: 0 0 31%;
    }
    .chiffre-cle-valeur {
        font-size: 36px;
    }
}
@media (min-width: 920px) {
    .chiffres-cles {
        gap: 30px 2%;
        justify-content: space-between;
    }
        .chiffre-cle {
            flex: 0 0 23%;
        }
}
@media (min-width: 1100px) {
    .chiffre-cle {
        flex: 1;
    }
}





/* WIDGET - liste pictos + texte */
.synidia-liste-pictos {
    padding-top: 14px;
}
    .synidia-liste-pictos__item {
        position: relative;
        display: flex;
        gap: 16px;
        align-items: top;
        margin-bottom: 18px;
    }
        .synidia-liste-pictos__icone_wrapper {
            padding-top: 8px;
        }
            .synidia-liste-pictos__icone {
                flex: 0 0 auto;
                background-repeat: no-repeat;
                background-position: center;
                background-size: 20px;
                background-color: var(--bleu);
                height: 20px;
            }
                .synidia-liste-pictos:not(.synidia-liste-pictos--ronds) .synidia-liste-pictos__icone,
                .synidia-liste-pictos:not(.synidia-liste-pictos--dots) .synidia-liste-pictos__icone {
                    min-width: 52px;
                    height: 32px;
                    border-radius: 8px;
                    padding: 4px 14px;
                }
                .synidia-liste-pictos--ronds .synidia-liste-pictos__icone {
                    padding: 17px;
                    border-radius: 20px;
                }
            .synidia-liste-pictos.synidia-liste-pictos--icones-couleur .synidia-liste-pictos__item:nth-child(1) .synidia-liste-pictos__icone {
                background-color: var(--bleu);
            }
            .synidia-liste-pictos.synidia-liste-pictos--icones-couleur .synidia-liste-pictos__item:nth-child(2) .synidia-liste-pictos__icone {
                background-color: var(--orange);
            }
            .synidia-liste-pictos.synidia-liste-pictos--icones-couleur .synidia-liste-pictos__item:nth-child(3) .synidia-liste-pictos__icone {
                background-color: var(--vert);
            }
            .synidia-liste-pictos.synidia-liste-pictos--icones-couleur .synidia-liste-pictos__item:nth-child(4) .synidia-liste-pictos__icone {
                background-color: var(--bleuclair);
            }
            .synidia-liste-pictos.synidia-liste-pictos--icones-couleur .synidia-liste-pictos__item:nth-child(5) .synidia-liste-pictos__icone {
                background-color: var(--gris-moyen);
            }
            .synidia-liste-pictos__texte {
                font-size: 16px;
            }
            .synidia-liste-pictos__texte p:last-child {
                margin-bottom: 0;
            }
            .synidia-liste-pictos__texte a {
                color: var(--bleufonce);
            }
    .synidia-liste-pictos.synidia-liste-pictos--dots .synidia-liste-pictos__item {
        padding-left: 24px;
    }
    .synidia-liste-pictos.synidia-liste-pictos--dots .synidia-liste-pictos__item:before {
        content: "";
        position: absolute;
        left: 0;
        top: .45em;
        width: 10px;
        height: 10px;
        border-radius: 50%;
        background-color: var(--bleuclair);
    }






/* WIDGET blocs texte, icone et lien */
.blocs-texte-icone-lien {
    display: flex;
    flex-wrap: wrap;
    gap: 30px 2%;
}
    .bloc-texte-icone-lien {
        position: relative;
        flex:1;
        background-color:var(--blanc);
        border-radius: 16px;
        padding: 40px 16px 30px 22px;
        display: flex;
        flex-direction: column;
    }
        .bloc-texte-icone-lien__icone {
            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;
        }

    .bloc-texte-icone-lien__titre {
        margin: 0 0 20px 0;
        font-size: 24px !important;
        line-height: 30px !important;
    }

    .bloc-texte-icone-lien__texte {
        flex-grow: 1;
        margin: 0 0 30px 0;
    }
    .bloc-texte-icone-lien:after {
        content: "";
        position: absolute;
        bottom: -10px;
        left: 9%;
        width: 82%;
        height: 10px;
        border-bottom-left-radius: 10px;
        border-bottom-right-radius: 10px;
    }
    .bloc-texte-icone-lien:nth-child(1):after {
        background-color: var(--bleumoyen);
    }
    .bloc-texte-icone-lien:nth-child(2):after {
        background-color: var(--orange);
    }
    .bloc-texte-icone-lien:nth-child(3):after {
        background-color: var(--vert);
    }
    .bloc-texte-icone-lien:nth-child(4):after {
        background-color: var(--bleuclair);
    }
    .bloc-texte-icone-lien:nth-child(5):after {
        background-color: var(--gris-moyen);
    }

    .bloc-texte-icone-lien:nth-child(1) .bloc-texte-icone-lien__icone {
        background-color: var(--bleumoyen);
    }
    .bloc-texte-icone-lien:nth-child(2) .bloc-texte-icone-lien__icone {
        background-color: var(--orange);
    }
    .bloc-texte-icone-lien:nth-child(3) .bloc-texte-icone-lien__icone {
        background-color: var(--vert);
    }
    .bloc-texte-icone-lien:nth-child(4) .bloc-texte-icone-lien__icone {
        background-color: var(--bleuclair);
    }
    .bloc-texte-icone-lien:nth-child(5) .bloc-texte-icone-lien__icone {
        background-color: var(--gris-moyen);
    }

@media (min-width: 920px) {
    .bloc-texte-icone-lien {
        padding: 40px 30px;
    }
}







/* Chronologie */
.synidia-chronologie-wrapper {
    position:relative;
}
    .synidia-chronologie {
        display: flex;
        gap: 24px;
        overflow-x: auto;
        scroll-behavior: smooth;
        padding: 10px 0 14px;
        scrollbar-width: none;
        cursor:grab;
    }
        .synidia-chronologie.dragging{
            cursor:grabbing;
            user-select:none;
        }
        .synidia-chronologie.dragging *{
            pointer-events:none;
        }
        .synidia-chronologie::-webkit-scrollbar {
            display:none;
        }
        .synidia-chronologie__item {
            flex:0 0 calc((100% - 72px) / 3.5);
            background: var(--blanc);
            box-shadow: 0 6px 24px -2px rgba(8, 52, 91, 0.10);
            border-radius: 18px;
            padding: 30px;
            transition: all .25s ease;
        }
        .synidia-chronologie__annee {
            font-size: 42px;
            font-weight: 700;
            color: var(--bleu);
            margin-bottom: 20px;
        }
        .synidia-chronologie__sur-titre {
            margin-bottom:10px;
        }
        .synidia-chronologie__titre {
            margin-bottom: 15px;
            font-size: 24px !important;
            line-height: 28px !important;
        }
        .synidia-chronologie__texte { }

        .synidia-chronologie__footer {
            display: flex;
            justify-content: start;
            gap: 0 10px;
            margin-top: 36px;
        }
            .synidia-chronologie__icone {
                width: 24px;
                height: 24px;
                filter:invert(1);
            }
            .synidia-chronologie__lieu { 
                font-size: 15px;
                line-height: 24px;
            }
    .synidia-chronologie-nav {
        display: flex;
        gap: 12px;
        justify-content: right;
        margin: 20px 20px 0 0;
    }
        .synidia-chronologie-nav button {
            width: 46px;
            height: 46px;
            transition: .2s;
            border: none !important;
            background-color: transparent;
        }
            .synidia-chronologie-nav button span {
                display: inline-block;
                width: 46px;
                height: 46px;
                border-radius: 16px !important;
                border: 0;
                background: var(--bleuclair);
                color: var(--blanc);
                cursor: pointer;
                font-size: 22px;
                line-height: 46px;
            }

@media (max-width: 520px) {
    .synidia-chronologie__item {
        flex: 0 0 98%;
    }
    .synidia-chronologie__texte {
        font-size: 16px;
        line-height: 24px;
    }
    .synidia-chronologie__lieu {
        font-size: 15px;
        line-height: 18px;
    }
}

@media (min-width: 1000px) {
    .synidia-chronologie__item:hover{
        background: var(--bleu);
        color: var(--blanc);
    }
    .synidia-chronologie__item:hover * {
        color: var(--blanc) !important;
    }
    .synidia-chronologie-nav button:hover span{
        background: var(--bleu);
    }
}



/* Bloc blancs transparents */
.synidia-blocs-transparents {
    display: grid;
    grid-template-columns:1fr;
    gap: 30px;
}
    .synidia-bloc-transparent {
        background: rgba(255,255,255,.30);
        border-radius: 16px;
        padding: 20px 30px 30px 30px;
        color: var(--blanc);
    }
        .synidia-bloc-transparent__icone {
            width: 50px;
            height: 34px;
            margin-bottom: 20px;
            display: flex;
            align-items: center;
            justify-content: center;
            background-color: var(--vert);
            background-size: 24px;
            background-repeat: no-repeat;
            background-position: center;
            border-radius: 8px;
        }
        .synidia-bloc-transparent__icone:before {
            font-size:24px;
            color: var(--blanc);
        }
        .synidia-bloc-transparent__titre {
            margin: 0 0 12px;
            color: var(--blanc) !important;
            font-size: 20px !important;
            font-weight: 600;
            line-height: 22px !important;
        }
        .synidia-bloc-transparent__texte{
            color:var(--blanc);
            font-size: 17px;
            line-height: 21px;
        }

    .synidia-bloc-transparent__texte p:last-child{
        margin-bottom:0;
    }

@media (min-width: 992px) {
    .synidia-blocs-transparents{
        grid-template-columns: repeat(2, minmax(0,1fr));
    }

}




/* Ressources */
.synidia-ressources {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 30px;
}
    .synidia-ressource {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        padding: 30px;
        background: var(--bleuclair);
        border-radius: 16px;
        color: var(--blanc);
    }
    .synidia-ressource-type {
        display:inline-block;
        margin-bottom: 18px;
        padding: 6px 12px 6px 40px;
        border-radius: 8px;
        font-size: 14px;
        line-height: 1;
        color: var(--bleumoyen);
        background-color:var(--gris-fond);
        background-size: 24px;
        background-repeat: no-repeat;
        background-position: 10px center;
    }
    .synidia-ressource--livre-blanc .synidia-ressource-type {
        background-image: url('../img/whitebook.png');
    }
    .synidia-ressource--cas-client .synidia-ressource-type {
        background-image: url('../img/person_blue.png');
    }
    .synidia-ressource--article .synidia-ressource-type {
        background-image: url('../img/article.png');
    }
    .synidia-ressource h3 {
        margin: 0 0 24px;
        color: var(--blanc) !important;
        font-size: 22px !important;
        line-height: 26px !important;
    }
    .synidia-ressource .bouton_transparent{
        margin-top: 20px;
    }
@media (max-width:999px){
    .synidia-ressources{
        grid-template-columns:1fr;
    }
}