.featuredevent {

    --card-padding: 40px;
    --card-text: 22px;
    --card-heading: 36px;
    --headshot:145px;
    background: white; border-radius: var(--radius);
    display: flex; flex-wrap: wrap;
    padding-bottom: var(--card-padding);
}
.featuredevent+.featuredevent { margin-top: var(--gutter_big);}
.featuredevent header { width: 100%; border-bottom: 1px solid var(--ttl_lightgrey);
display: flex; flex-wrap: wrap;
    margin-bottom: var(--card-padding);
}
.featuredevent header > :is(time,span){


    flex: 0 0 33.333%;
    flex:1;

    white-space: nowrap;

    display:flex; align-items:center; padding: 1em var(--card-padding);
    font-size: var(--card-text); line-height: 32px;
}
@media all and (min-width: 1400px) {
    .featuredevent header > :is(time,span) {
        width: 33.333%; flex: 0 0 auto;
    }
}
.featuredevent header > :is(time,span):not(:last-child){
    border-right:  1px solid var(--ttl_lightgrey);
    font-weight: 500;
}
.featuredevent header i.icon { font-style: normal !important;
    display: block;   margin-right:0.5em; font-weight: 400;
}

.featuredevent header i.icon::after {
    font-family: "ttl_icons";
    font-size: 32px;
    content:"\E807";

}

.featuredevent header > span i.icon::after {
    content:"\E812";
}

.featuredevent header > span:last-child i.icon::after {
    content:"\E813";
}


.featuredevent header+div { padding: 0 var(--card-padding); border-right:  1px solid var(--ttl_lightgrey); flex:1;display: flex; flex-direction: column; }
.featuredevent > div+div:last-child { padding: 0 var(--card-padding); width: 50%;  display: flex; flex-direction: column; max-width: 600px; }


.featuredevent .heading { font-size: var(--card-heading); line-height: 133.3333333333333%; margin-bottom: 0.5em; }
.featuredevent .heading a { color:inherit; }
.featuredevent .heading a:focus-visible {display: inline-block; background: none; }
.featuredevent :is(p,h3) { font-size: var(--card-text); line-height: 1.5; margin-bottom: 1em; }

.featuredevent .cta:last-child { padding-top: 0.5em; margin-top: auto;}

div.speakers { display: flex; flex-wrap: wrap; gap: 20px; margin-bottom: 20px  }
div.speakers>figure { width:var(--headshot_speaker);display: block;  }
div.speakers>figure picture { width:var(--headshot_speaker);  height:var(--headshot_speaker); display: block; border-radius: 12px;  }

.featuredevent h3 { margin-top: auto }
.featuredevent > div:last-child ul { }

ul.hostlogos li { display: block; }
ul.hostlogos li:not(:first-child) {  }
ul.hostlogos li img { display: block; height: 40px; width: auto; }

ul.hostlogos
ul.hostlogos li,
ul.hostlogos picture,
ul.hostlogos img { mix-blend-mode: multiply; }
ul.hostlogos img { background:white; }
ul.hostlogos {display: flex; gap:24px; mix-blend-mode: multiply; flex-direction: row; align-items: center; }


/*

icon-chevron E800
icon-checkbox_checked E801
icon-checkbox_unchecked E802
icon-arrow E803
icon-external E804
icon-search E806
icon-venue E808
icon-date E809
icon-time E80A
icon-quote E80B
icon-bigcheck E80C
icon-social_linkedin E80D
icon-social_youtube E80E
icon-social_insta E80F

close E810
*/


@media all and (max-width: 1199.98px) {
    .featuredevent {
        --card-padding:24px;
        --card-text: 18px;
        --card-heading: 24px;
        --headshot:120px;

    }
    .featuredevent header > :is(time,span){
        width: 50%; flex: 0 0 auto;
    }
    .featuredevent header > span {
        border-right: none !important;
    }
    .featuredevent header > span:last-child {
        border-top: 1px solid var(--ttl_lightgrey);
        width: 100%;
    }
}

@media all and (max-width: 899.98px) {
    .featuredevent {
        --card-padding: 24px;
        --card-text: 18px;
        --card-heading: 24px;

        display: block;
    }
    .featuredevent header+div { border: none;}
    .featuredevent > div+div:last-child {
        width: 100%; max-width: 9999px; margin-top: var(--gutter);
    }
    .featuredevent header > :is(time,span){
        width: 100%;border-right: none !important;
    }.featuredevent header > span {
             border-top: 1px solid var(--ttl_lightgrey);
     }

    .featuredevent header i.icon::after {

        font-size: 20px;
    }
    .featuredevent .heading { margin-bottom: 0.75em; }

}

@media all and (max-width: 599.98px) {
    .featuredevent {
        --card-padding: 24px;
        --card-heading: 22px;
        --headshot: 80px;

    }

    .featuredevent div.speakers {
        gap: 16px;

    }
}
@media all and (max-width: 399.98px) {
    .featuredevent {
        --card-padding: 16px;
        --card-text: 16px;
    }
}

@media (prefers-color-scheme: dark) {
    .featuredevent { background: var(--ttl_black); border: 1px solid white;}
    ul.hostlogos,ul.hostlogos li, ul.hostlogos img { mix-blend-mode: normal !important}
}