/* ============================================================
   BNI HOME - PROCHAINE CONFERENCE
   Extension des composants natifs de home-1.css
   ============================================================ */


.home-card-conference{
    grid-column:1 / -1;

    position:relative;

    overflow:hidden;

    cursor:default;
}


.home-card-conference::before{
    content:"";

    position:absolute;

    top:0;
    left:0;
    bottom:0;

    width:4px;

    background:#c00000;
}


.home-conference-head{
    align-items:center;
}


.home-conference-heading{
    min-width:0;

    flex:1;
}


.home-conference-date{
    flex:0 0 auto;

    padding:
        8px
        11px;

    color:#900000;

    background:#fff4f5;

    border:
        1px solid
        #efd6da;

    border-radius:7px;

    font-size:12px;
    font-weight:800;

    white-space:nowrap;
}


.home-conference-layout{
    display:grid;

    grid-template-columns:
        minmax(220px, .8fr)
        minmax(0, 1.7fr)
        minmax(130px, .45fr);

    align-items:center;

    gap:28px;

    margin-top:22px;

    padding-top:22px;

    border-top:
        1px solid
        #e7e3df;
}


/* ============================================================
   MEMBRE
   ============================================================ */

.home-conference-member{
    display:flex;

    align-items:center;

    gap:15px;
}


.home-conference-photo{
    flex:0 0 94px;

    width:94px;
    height:94px;

    overflow:hidden;

    display:flex;

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

    background:#f1efec;

    border:
        4px solid
        #fff;

    border-radius:50%;

    box-shadow:
        0 8px 21px
        rgba(20,0,4,.14);
}


.home-conference-photo img{
    display:block;

    width:100%;
    height:100%;

    object-fit:cover;
    object-position:center;

    animation:
        conferencePhotoMove
        7s
        ease-in-out
        infinite;
}


.home-conference-initials{
    color:#c00000;

    font-size:26px;

    font-weight:850;
}


.home-conference-member-info{
    min-width:0;
}


.home-conference-member-name{
    color:#222;

    font-size:17px;

    font-weight:850;
}


.home-conference-company{
    margin-top:3px;

    color:#c00000;

    font-size:13px;

    font-weight:800;
}


.home-conference-sector{
    margin-top:6px;

    color:#777;

    font-size:11px;

    line-height:1.4;
}


/* ============================================================
   CONTENU
   ============================================================ */

.home-conference-content{
    min-width:0;
}


.home-card-conference .home-card-description{
    margin-top:14px;
}


.home-conference-extra{
    margin-top:12px;

    padding:
        10px
        12px;

    color:#666;

    background:#f8f7f5;

    border-radius:6px;

    font-size:12px;

    line-height:1.55;
}


/* ============================================================
   LOGO
   ============================================================ */

.home-conference-logo{
    min-height:115px;

    display:flex;

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

    padding:15px;

    background:#faf9f7;

    border:
        1px solid
        #e7e3df;

    border-radius:7px;
}


.home-conference-logo img{
    display:block;

    max-width:100%;
    max-height:90px;

    width:auto;
    height:auto;

    object-fit:contain;
}


/* ============================================================
   ANIMATION
   ============================================================ */

.home-card-conference h2{
    animation:
        conferenceTitleIn
        .55s
        ease-out
        both;
}


@keyframes conferenceTitleIn{

    from{
        opacity:0;
        transform:translateY(7px);
    }

    to{
        opacity:1;
        transform:translateY(0);
    }

}


@keyframes conferencePhotoMove{

    0%,
    100%{
        transform:scale(1);
    }

    50%{
        transform:scale(1.035);
    }

}


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

@media(max-width:850px){

    .home-conference-layout{
        grid-template-columns:
            minmax(200px,.8fr)
            minmax(0,1.4fr);
    }


    .home-conference-logo{
        grid-column:1 / -1;

        min-height:90px;
    }


    .home-conference-logo img{
        max-height:70px;
    }

}


@media(max-width:620px){

    .home-conference-head{
        align-items:flex-start;

        flex-wrap:wrap;
    }


    .home-conference-date{
        width:100%;

        white-space:normal;
    }


    .home-conference-layout{
        grid-template-columns:1fr;

        gap:20px;
    }


    .home-conference-member{
        align-items:center;
    }


    .home-conference-logo{
        grid-column:auto;
    }

}


@media(prefers-reduced-motion:reduce){

    .home-card-conference h2,
    .home-conference-photo img{
        animation:none !important;
    }

}
