.node-type-projet{
    .layout-content{
        margin-top: 2rem;
        // max-width: 100vw;
        .content_container{
           
            width: 100% !important;
            @media(max-width:810px){
                margin-top: 12rem !important;
            }
        }
    }
    .layout--threecol-25-50-25{
        flex-wrap: nowrap;
        @media(max-width: 810px){
            display: flex;
            flex-direction: column;
            width: 100%;
        }
        .layout__region--first{
            flex: 0 1 25%;
            position: relative;
            @media(max-width: 810px){
                flex: 0 1 100%;
            }
            .block-region-first{
                // position:fixed;
                // width: 20% !important;
                margin-top: 1rem;
                display: flex;
                flex-direction: column;
                // margin-left: 2rem;
                @media(max-width: 810px){
                    position: relative;
                    width: 100% !important;
                    margin-left: 0rem;
                    margin-top: 0;
                }
                
                #sites-map-container{
                    width: 100% !important;
                    padding-left: 1rem;
                    h2{
                        display: none;
                    }
                    @media(max-width: 810px){
                        // width: 50% !important;
                        margin: auto;
                        margin-top: 3rem;
                    }
                }
                .field_field_site_projet{
                    .node-type-site{
                        width: 65%;
                        margin: auto;
                        padding-left: 2rem;
                        @media(max-width: 810px){
                            padding-left: 0rem;
                            width: 80%;
                            margin-bottom: 1rem;
                        }
                        .field_title{
                            h2{
                                text-transform: none;
                                font-size: 0.60rem;
                                @media(max-width: 810px){
                                    font-size:1rem;
                                    margin: 0;
                                    margin-bottom: 0.5rem;
                                }
                                a{
                                    color: $blue_QDD;
                                    font-weight: 700;
                                }
                            }
                        }
                        .field_field_sous_titre{
                            p{
                                font-size: 0.55rem;
                                @media(max-width: 810px){
                                    font-size:0.8rem ;
                                    margin: 0;
                                    margin-bottom: 0.5rem;
                                }
                            }
                        }
                        .more-link{
                            width: fit-content;
                            display: inline-flex;
                            // padding-left: 0.5rem;
                            background: black;
                            @media (max-width:810px) {  
                                margin-left: 0;
                               
                            }
                            a{
                                display: inline-flex;
                                justify-content: space-between;
                                align-items: center;
                                color: white;
                                text-transform: uppercase;
                                font-size: 0.5rem;
                                padding-left: 0.5rem;
                                @media(max-width: 810px){
                                    font-size:0.7rem;
                                }

                                svg{
                                    display: none;
                                }
                                &::after{
                                    display: inline-flex;
                                    content: url("../img/noun-arrow-to-right.svg");
                                    padding-right: 0.2rem;
                                    padding-left: 0.2rem;
                                    // padding-bottom: 0.2rem;
                                    height: 25px;
                                }
                            }   
                          
                            
                        }
                    }
                    
                   
                }
            }
        }
       
        .layout__region--second{
            flex: 0 1 50% !important;
            margin-top: 1rem;
            max-width: 50%;
            @media(max-width: 810px){
                max-width: 80% !important;
                margin: auto;
            }
            .block-region-second{
                position: relative;
                margin-top: 1rem;
                display: flex;
                flex-direction: column;
                padding-left: 2rem;
                @media(max-width: 810px){
                   padding-left: 0rem;
                }
                .field_field_laureats{

                    &.is-laureat::before {
                        content: "";
                        position: absolute;
                        // display: block;
                        top:-0.1rem;
                        left: 0.5rem;
                        width: 2.5rem;
                        height: 2.5rem;
                        background-image: url("../img/laureat-ouvert.svg");
                        background-repeat: no-repeat;
                        background-position: center;
                        background-size: contain;
                        z-index: 0;
                        @media(max-width: 810px){
                            left: -1.5rem;
                            top:0.5rem;
                         }
                        
                    }

                   .laureat{
                       font-size: 0;
                   } 
                }
                .field_title{
                    @media(max-width: 810px){
                        font-size: 1.3rem;
                    }
                }
                .field_field_nom_de_l_equipe{
                    border-top: solid black 1px;
                    padding-bottom: 0.5rem;
                    text-transform: uppercase;
                    @media(max-width: 810px){
                        font-size: 1.3rem;
                    }
                }
                .field_field_infos{
                    column-count: 3; 
                    column-gap: 1.5rem;  
                    .infos-projet{
                        break-inside: avoid;
                        margin-bottom: 0.5rem  !important; 
                        margin: 0;
                        h4{
                            margin: 0;
                            font-size: 0.7em;
                            font-family: 'gilroy-light';
                            @media(max-width: 810px){
                                font-size:0.8rem;
                            }
                        }
                        .field_field_contenu{
                            font-size: 0.8em;
                            font-family: 'gilroy-bold';
                            @media(max-width: 810px){
                                font-size:0.8rem;
                            }
                        }
                    }
                }
                .field_field_equipe_photo{
                    padding-top: 2rem;
                    img{
                        width: 100%;
                        object-fit: cover;
                        height: 16rem;
                    }
                    .image-field-caption{
                        // margin-top: 0;
                        margin-left: 0;
                        font-size: 0.5rem;
                        font-family: "gilroy-light";
                        @media(max-width: 810px){
                            font-size:0.8rem;
                        }
                        p{
                            margin-top: 0;
                            font-size: 0.5rem;
                            @media(max-width: 810px){
                                font-size:0.8rem;
                            }
                        }
                    }
                }
                .field_field_equipe_presentation {
                    p{
                        font-family: "gilroy-light";
                        font-size: 0.6rem;
                        @media(max-width: 810px){
                            font-size:0.8rem;
                        }
                    }
                }
                .equipe-panel  {
                  overflow: hidden;
                  max-height: 0;
                  opacity: 0;
                  margin-top: 1rem;
                  transition:
                    max-height 1s ease,
                    opacity 0.8s ease;
                }
                
                .equipe-panel.is-open {
                //   max-height: 1500px;
                  opacity: 1;
                  
                }
                
                .btn-equipe-toggle{
                    justify-content: space-between;
                    align-items: center;
                    color: white;
                    text-transform: uppercase;
                    font-size: 0.5rem;
                    background-color: black;
                    padding-left: 0.5rem;
                    margin: auto;
                    display: flex;
                    border: none;
                    // margin-top: 1rem;
                    @media(max-width: 810px){
                        font-size:0.8rem;
                    }

                    svg{
                        display: none;
                    }
                    &::after{
                        display: inline-flex;
                        content: url("../img/arrow-down-white.svg");
                        padding-right: 0.2rem;
                        padding-left: 0.2rem;
                        height: 12px;
                    }
                    margin-bottom: 1rem;
                   
                }
                .btn-equipe-toggle[aria-expanded="true"]::after {
                    content: url("../img/arrow-up-white.svg");
                   
                }
                .equipe-separator {
                    border-bottom: 1px solid black;
                    margin: 20px 0;
                    width: 100%;
                  }

                .field_field_parties_projet{
                    margin-top: 2rem;
                    width: 100%;
                    @media(max-width: 500px){
                        width: 100%;
                    }
                    .paragraph--type--projet-partie-texte{
                        .field_field_titre_partie_texte_projet{
                            h3{
                            }
                        }
                        .field_field_texte_partie_texte_projet{
                            p{
                                font-family: "gilroy-light";
                                font-size: 0.6rem;
                                @media(max-width: 810px){
                                    font-size:0.8rem;
                                }
                            }
                        }
                    }
                    .paragraph--type--projet-video{

                    }
                    .paragraph--type--projet-diapo{
                        .field_field_images_projet{
                            .diaporama{
                                display: flex !important;
                                flex-direction: row !important;
                                gap: 20px;
                                flex-wrap: wrap;
                                margin-bottom: 2rem;
                                @media(max-width: 500px){
                                    flex-direction: column !important;
                                }
                                .cadre-img-zoom{
                                    img{
                                        object-fit: cover;
                                        width: 220px;
                                        height: 145px;
                                        @media (max-width:1500px){
                                            width: 150px;
                                            height: auto;
                                        }
                                        @media (max-width:810px){
                                            width: 100%;
                                            height: auto;
                                        }
                                    }
                                }
                                .image-field-caption{
                                    margin: 0;
                                    max-width: 220px;
                                    p{
                                        margin-top: 0;
                                        font-size: 0.5rem;
                                        font-family: 'gilroy-light';
                                        @media(max-width: 810px){
                                            font-size:0.8rem;
                                        }
                                }
    
                            }
                            } 
                        }
                    }
                }
                .field_field_documents,
                .field_field_liens{
                    width: fit-content;
                    padding-left: 0.5rem;
                    background: black;
                    margin-bottom: 1rem;
                    @media (max-width:810px) {  
                        margin-left: 0;
                    }
                    a{
                        display: inline-flex;
                        justify-content: space-between;
                        align-items: center;
                        color: white;
                        text-transform: uppercase;
                        font-size: 0.5rem;
                        @media(max-width: 810px){
                            font-size:0.8rem;
                        }
                        svg{
                            display: none;
                        }
                        &::after{
                            display: inline-flex;
                            content: url("../img/noun-arrow-to-right.svg");
                            padding-right: 0.2rem;
                            padding-left: 0.2rem;
                            // padding-bottom: 0.2rem;
                            height: 25px;
                        }
                    } 
                     
                    span:nth-child(2){
                        font-size: 0;
                    }
                    
                }

                div:has(.field_field_nom_de_l_equipe){
                    order: 1;
                }
                div:has(.field_field_infos){
                    order: 2;
                }
                div:has(.field_field_equipe_photo){
                    order: 3;
                }
                div:has(.field_field_equipe_presentation){
                    order: 4;
                }
                div:has(.field_field_parties_projet){
                    order: 7;
                }
                div:has(.field_field_documents){
                    order: 5;
                    margin-top: 2rem;
                }
                div:has(.field_field_liens){
                    order: 6;
                }
            }
        }
        .layout__region--third{
            flex: 0 1 24%;
            .block-region-third{
                position:relative;
                margin-top: 4.5rem;
                margin-left: 2rem;
                @media(max-width: 810px){
                    position: relative;
                    margin-left: 0;
                    margin-top: 2rem;
                }
                div{
                    display: flex;
                    flex-direction: column;
                    @media(max-width: 810px){
                        justify-content: center;
                        margin-bottom: 0rem;
                    }
                    h2{

                        font-family: "gilroy-light";
                        text-transform: uppercase;
                        font-size: 0.6rem;
                        @media(max-width: 810px){
                            font-size:0.8rem;
                            margin: auto;
                            margin-bottom: 1rem;
                            width: 80%;
                        }
                        &::after{
                            content: " :";
                        }
                    }
                    .view-rows-wrapper{
                        @media(max-width: 810px){
                            width: 80%;
                            margin: auto;
                        }
                        .views-row{
                            width: 80%;
                            border-bottom: solid black 1px;
                            padding-bottom: 0.5rem;
                            padding-top: 0.5rem;
                            @media(max-width: 810px){
                                width: 80%;
                                justify-content: start;
                                padding-top: 1rem;
                            }
                            transition: transform 0.4s ease-in-out;
                                &:hover {
                                    transform: scale(1.05); 
                                }
                            .is-laureat{
                                position: relative;
                                padding-top: 1.5rem;
                                ::before {
                                    content: "";
                                    position: absolute;
                                    top: 0.5rem;
                                    left: -1.4rem;
                                    width: 2.5rem;
                                    height: 2.5rem;
                                    background-image: url("../img/laureat-ouvert.svg");
                                    background-repeat: no-repeat;
                                    background-position: center;
                                    background-size: contain;
                                    z-index: 0;
                                    margin-top: 0.2rem;
                                    @media(max-width: 810px){
                                        top: 0rem;
                                        // left: -11.4rem;
                                    }
                                }
                                .field-content{
                                    font-size: 0;
                                }
                            }
    
                            .views-field-title {
                                @media (max-width:810px){
                                    width: fit-content;
                                    margin: 0;
                                }
                                h2 {
                                    font-size: 0.5rem;
                                    margin-bottom: 0rem;
                                    text-transform: none;
                                    font-family: "gilroy-regular";
                                        &::after{
                                            content: "";
                                        }
                                    @media(max-width: 810px){
                                        font-size:0.8rem;
                                        width: 100% !important;
                                    }
                                }
                            }
                            .views-field-field-nom-de-l-equipe{
                                @media (max-width:810px){
                                    width: fit-content;
                                    margin: 0;
                                }
                                h3 {
                                    margin-bottom: 0.3rem;
                                    margin-top:0.3rem;
                                    text-transform: uppercase;
                                }
                                font-size: 0.4rem;
                                @media(max-width: 810px){
                                    font-size:0.7rem;
                                }
                                p{
                                    font-family: "gilroy-semibold";
                                    margin-bottom: 0.5rem;
                                }
                               
                            }
                            .views-field-view-node{
                                display: none;  
                            }
                        }
                    }

                    
                    .field_field_laureats{
                        color: red;
                        text-transform: uppercase;
                        content: url('/web/themes/custom/quartiers_de_demain/dist/assets/img/LAUREAT.png');
                    }
    
                }


            }
        }
        
    }
}