
.presentation_youtube,
.presentation_linkedin,
.presentation_website,
.presentation_twitter,
.presentation_facebook,
.presentation_instagram,
.presentation_viadeo,
.presentation_google_scholar,
.presentation_repec {
    border-radius: 50%;
    border: 1px solid #c5c5e1;
    padding: 0;
    filter: saturate(0%);
    -webkit-filter: saturate(0%);
    -moz-filter: saturate(0%);
}


.researcher{

    width:min(calc(100% - 2rem),1200px);

    margin:10px auto;

}

.researcher-header{

    display:grid;

    grid-template-columns:340px 1fr;

    gap:60px;

    align-items:flex-start;

    margin-bottom:60px;

}

.researcher-photo{

    width:340px;
    height:340px;

    overflow:hidden;

    border-radius:12px;

    border:1px solid rgba(255,255,255,.85);

    box-shadow:
            0 10px 25px rgba(0,0,0,.08),
            0 25px 55px rgba(0,0,0,.14),
            0 45px 90px rgba(0,0,0,.18);

}

.researcher-photo img{

    width:100%;
    height:100%;

    object-fit:cover;
    object-position: top;

    transition:transform .8s;

}

.researcher-photo:hover img{

    transform:scale(1.05);

}

.researcher-role{

    letter-spacing:.2em;

    text-transform:uppercase;

    color:#777;

}

.researcher-intro h1{

    margin:24px 0;

    font-size:clamp(2.2rem,5vw,3.4rem);

}

.researcher-labo{

    color:#333466;

    font-weight:600;

    margin-bottom: 35px;

}

.researcher-bio{

    max-width:700px;

    line-height:1.8;

    color:#555;

    margin-bottom: 35px;

}


.researcher-actions{

    display:flex;
    /*flex-direction: column;*/
    align-items:center;

    gap: 25px;

    margin-top: 35px;



}

.researcher-docs{
    display:flex;
    gap:15px;
}

.researcher-social{

    display:flex;
    align-items:center;
    gap:10px;

    margin-left:auto;

}

.researcher-social a{

    width:42px;
    height:42px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:50%;

    background:#f5f5f7;
    border:1px solid rgba(0,0,0,.08);

    color:#9b9b9b;

    text-decoration:none;

    transition:
            all .3s cubic-bezier(.22,1,.36,1);

}

.researcher-social a:hover{

    background:var(--ecox-bleu);

    border-color:var(--ecox-bleu);

    color:#fff;

    transform:translateY(-2px);

    box-shadow:
            0 8px 20px rgba(51,52,102,.18);

}

.researcher-social img {
    width: 100%;
    aspect-ratio: 1/1;
}

.researcher-social .material-symbols-outlined{

    font-size:20px;

}

.researcher-social i{

    font-size:18px;

}



.researcher-grid{

    display:grid;

    grid-template-columns:320px 1fr;

    gap:50px;

    align-items:start;

}

.researcher-sidebar {
    display: flex;
    flex-direction: column;
    gap: 25px;
}

@media (min-width: 992px){

    .researcher-sidebar{

        position:sticky;

        top:90px;

        align-self:start;

    }

}







.contact-list{

    list-style:none;

    margin:0;

    padding:0;

    display:flex;

    flex-direction:column;

    gap:18px;

}

.contact-list li{

    display:flex;

    align-items:flex-start;

    gap:15px;

}

.contact-icon{

    flex:0 0 42px;

    width:42px;

    height:42px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:50%;

    background:rgba(51,52,102,.08);

    color:var(--ecox-rouge);

    font-size:22px!important;

    transition:
            background .3s,
            color .3s,
            transform .3s;

}

.contact-list li:hover .contact-icon{

    background:var(--ecox-bleu);

    color:#fff;

    transform:scale(1.05);

}

.contact-content{

    flex:1;

    min-width:0;

}

.contact-content small{

    display:block;

    margin-bottom:3px;

    color:#8b8b8b;

    font-size:.78rem;

    font-weight:300;

    text-transform:uppercase;

    letter-spacing:.08em;

}

.contact-content a,
.contact-content span{

    color:#333466;

    font-weight:500;

    text-decoration:none;

    word-break:break-word;

}

.contact-content a:hover{

    color:var(--ecox-rouge);

}

.card{

    z-index: 2;
    display: block;

    padding: 25px;

    border:1px solid rgba(0,0,0,.08);

    border-radius:8px;

    background: #fff;

    margin-bottom:25px;

    transition:
            transform .35s,
            box-shadow .35s;

    overflow:hidden;

}
/*.card:hover{

    transform:translateY(-3px);

    box-shadow:
            0 12px 35px rgba(0,0,0,.08);

}*/

/* Image d'entête */

.card-cover{

    position:relative;

    height: 65px;

    margin:-35px -35px 30px;

    overflow:hidden;

}

/* Image */

.card-cover img{

    width:100%;

    height:100%;

    display:block;

    object-fit:cover;

    object-position:center;

    /*filter:saturate(.90) contrast(1.03);*/
    filter: grayscale(85%);

    transition:
            transform .6s cubic-bezier(.22,1,.36,1),
            filter .6s ease;

}

/* Zoom léger */

.card:hover .card-cover img{

    transform:scale(1.05);

    /*filter:saturate(1) contrast(1.08);*/

}

/* Dégradé */

.card-cover::after{

    content:"";

    position:absolute;

    inset:0;

    background:linear-gradient(
            to bottom,
            rgba(0,0,0,.15) 0%,
            rgba(0,0,0,.20) 35%,
            rgba(0,0,0,.55) 100%
    );

    z-index:1;

}

/* Signature ECOX */

.card-cover::before{

    content:"";

    position:absolute;

    left:0;

    right:0;

    bottom:0;

    height:2px;

    background:linear-gradient(
            90deg,
            var(--ecox-rouge),
            var(--ecox-bleu)
    );

    z-index:2;

}

/* =====================================================
   TITRE
===================================================== */

.card-cover-title{

    position:absolute;

    left:35px;

    right:35px;

    bottom: -17px;

    z-index:2;

    margin:0;

    color:#fff !important;

    font-size:clamp(1.9rem,2vw,2.5rem);

    font-weight: 500;

    line-height:1.2;

    letter-spacing: .06em;

    text-transform:uppercase;

    text-shadow:
            0 2px 6px rgba(0,0,0,.45),
            0 8px 20px rgba(0,0,0,.35);

}

/* =====================================================
   RESPONSIVE
===================================================== */

@media (max-width:991px){

    .card-cover{

        /*height:65px;*/

        margin:-35px -35px 25px;

    }

    .card-cover-title{

        left:25px;

        /*bottom:20px;*/

        font-size:1.8rem;

    }

}

.card h2,
.card h3{

    margin-top:0;
    margin-bottom: 25px;
    color: var(--ecox-bleu);

}





/* =====================================================
   CARD EXPANDABLE
===================================================== */

.card-expandable .card-body{

    position:relative;

    overflow:hidden;

    transition:height .45s cubic-bezier(.22,1,.36,1);

}

/* Dégradé */

.card-expandable .card-body::after{

    content:"";

    position:absolute;

    left:0;
    right:0;
    bottom:0;

    height:90px;

    background:linear-gradient(
            to bottom,
            rgba(255,255,255,0),
            rgba(255,255,255,.96) 55%,
            #fff
    );

    pointer-events:none;

    opacity:1;

    transition:opacity .25s ease;

}


.card-expandable.open .card-body::after{
    opacity:0;
}

.card-body.transparent-after::after{
    opacity:0;
}


/* =====================================================
   FOOTER
===================================================== */

.card-expandable .card-footer{

    display:flex;

    justify-content:center;

    padding-top:20px;

}


/* =====================================================
   BOUTON
===================================================== */

.card-expandable .card-toggle{

    width:64px;
    height:64px;

    display:flex;
    align-items:center;
    justify-content:center;

    border:none;

    border-radius:50%;

    background:#fff;

    color:var(--ecox-bleu);

    cursor:pointer;

    /*box-shadow: 0 8px 24px rgba(15,23,42,.10);*/

    transition:
            transform .3s,
            color .3s,
            box-shadow .3s;

}

.card-expandable .card-toggle:hover{

    color:var(--ecox-rouge);

    transform:translateY(-3px);

    /*box-shadow: 0 14px 36px rgba(15,23,42,.15);*/

}

.card-expandable .card-toggle .material-symbols-outlined{

    font-size: 72px!important;

    transform:translateY(3px);

    transition:transform .35s cubic-bezier(.22,1,.36,1);

}

.card-expandable.open .card-toggle .material-symbols-outlined{

    transform:rotate(180deg);

}


.phd-card{

    background:#fff;

    border:1px solid rgba(0,0,0,.08);

    border-radius:8px;

    padding:30px;

    transition:
            transform .35s cubic-bezier(.22,1,.36,1),
            box-shadow .35s cubic-bezier(.22,1,.36,1);

}

.phd-label{
    display:block;

    margin-bottom:8px;

    font-size:.75rem;

    font-weight:600;

    text-transform:uppercase;

    letter-spacing:.08em;

    color:#777;
}

.phd-title{

    margin:0 0 28px;

    font-size:1.35rem;

    line-height:1.4;

    color:var(--ecox-bleu);

}

.phd-meta{

    display:flex;

    flex-direction:column;

    gap:18px;

}

.phd-item{

    display:flex;

    align-items:flex-start;

    gap:14px;

}

.phd-item .material-symbols-outlined{

    flex-shrink:0;

    font-size:24px;

    color:var(--ecox-rouge);

    font-variation-settings:
            'FILL' 0,
            'wght' 300,
            'GRAD' 0,
            'opsz' 24;

}

.phd-item small{

    display:block;

    margin-bottom:3px;

    color:#777;

    text-transform:uppercase;

    letter-spacing:.08em;

    font-size:.75rem;

}

.phd-item strong{

    color:#222;

    font-weight:600;

}


.publication{

    display:flex;

    gap:25px;

    padding:18px 0;

    border-bottom:1px solid #eee;

}

.year{

    min-width:55px;

    font-weight:700;

    color:#C62032;

}

.resource-list{

    display:flex;

    flex-direction:column;

    gap:12px;

}




@media (max-width: 767px){

    .researcher-actions{
        flex-direction:column;
        align-items:center;
        gap:35px;
    }

    .researcher-docs{
        justify-content:center;
        flex-wrap:wrap;
    }

    .researcher-social{
        margin-left:0;
        justify-content:center;
        flex-wrap:wrap;
    }


}

@media(max-width:991px){

    .card-resource {
        display: none;
    }

    .researcher-header{

        grid-template-columns:1fr;

        text-align:center;

    }

    .researcher-photo{

        margin-inline:auto;

    }

    .researcher-grid{

        grid-template-columns:1fr;

    }

    .researcher-actions{

        justify-content:center;
        gap:35px;

    }

}