/* =========================================================
   VIDEURO ARTICLE ENRICHMENT
   Scoped ONLY to .va-enrichment
   ========================================================= */

.va-enrichment{
    margin-top:70px;
    color:#101713;
}

.vae-section{
    margin:0 0 90px;
}

.vae-section-head{
    display:grid;
    grid-template-columns:minmax(0,1.2fr) minmax(260px,.8fr);
    gap:50px;
    align-items:end;
    margin-bottom:34px;
}

.vae-kicker{
    display:block;
    margin-bottom:10px;

    font-size:10px;
    line-height:1.2;
    font-weight:700;
    letter-spacing:.16em;

    color:#597369;
}

.vae-section-head h2{
    margin:0;
    max-width:760px;

    font-size:clamp(30px,3.1vw,50px);
    line-height:1.04;
    letter-spacing:-.035em;
    font-weight:650;

    color:#101713;
}

.vae-section-head > p{
    margin:0;
    max-width:470px;

    font-size:14px;
    line-height:1.75;

    color:#55615c;
}


/* RESOURCES */

.vae-resource-list{
    list-style:none;
    margin:0;
    padding:0;

    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px;
}

.vae-resource-list li{
    display:grid;
    grid-template-columns:44px 1fr;
    gap:15px;

    padding:20px;

    border:1px solid rgba(12,31,24,.12);
    border-radius:16px;

    background:#fff;
}

.vae-resource-number,
.vae-card-number{
    font-size:12px;
    font-weight:700;
    color:#ff4566;
}

.vae-resource-list a{
    color:#102019 !important;
    -webkit-text-fill-color:#102019 !important;

    font-size:15px;
    font-weight:650;
    text-decoration:none;
}

.vae-resource-list a:hover{
    text-decoration:underline;
}

.vae-resource-list p{
    margin:6px 0 0;

    font-size:12px;
    line-height:1.55;

    color:#63706a !important;
    -webkit-text-fill-color:#63706a !important;
}


/* GRIDS */

.vae-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:14px;
}


/* VOICES */

.vae-voice-card,
.vae-person-card{
    position:relative;

    padding:24px;

    min-height:230px;

    border:1px solid rgba(12,31,24,.12);
    border-radius:18px;

    background:#fff;
}

.vae-card-number{
    position:absolute;
    top:22px;
    right:22px;
}

.vae-eyebrow,
.vae-person-field{
    margin-bottom:18px;

    font-size:9px;
    line-height:1.25;
    font-weight:700;
    letter-spacing:.14em;

    color:#557469;
}

.vae-voice-card h3,
.vae-person-card h3{
    margin:0 0 7px;

    padding-right:50px;

    font-size:22px;
    line-height:1.1;
    font-weight:650;

    color:#101713 !important;
    -webkit-text-fill-color:#101713 !important;
}

.vae-work{
    margin-bottom:17px;

    font-size:12px;
    font-style:italic;

    color:#65716c;
}

.vae-voice-card p,
.vae-person-card p{
    margin:0;

    font-size:14px;
    line-height:1.7;

    color:#48554f !important;
    -webkit-text-fill-color:#48554f !important;
}


/* FAMOUS PEOPLE */

.vae-people-grid{
    grid-template-columns:repeat(4,minmax(0,1fr));
}

.vae-person-card{
    min-height:270px;
}

.vae-person-card h3{
    font-size:20px;
}


/* LINKS */

.vae-link-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
}

.vae-link-card{
    display:flex;
    flex-direction:column;

    min-height:145px;

    padding:21px;

    border:1px solid rgba(12,31,24,.12);
    border-radius:16px;

    background:#fff;

    text-decoration:none !important;

    transition:
        transform .18s ease,
        box-shadow .18s ease;
}

.vae-link-card:hover{
    transform:translateY(-2px);
    box-shadow:0 12px 28px rgba(12,31,24,.08);
}

.vae-link-type{
    margin-bottom:18px;

    font-size:9px;
    font-weight:750;
    letter-spacing:.14em;

    color:#16876d !important;
    -webkit-text-fill-color:#16876d !important;
}

.vae-link-card strong{
    margin-bottom:7px;

    font-size:17px;
    line-height:1.2;
    font-weight:650;

    color:#101713 !important;
    -webkit-text-fill-color:#101713 !important;
}

.vae-link-card > span:last-child{
    font-size:12px;
    line-height:1.55;

    color:#617069 !important;
    -webkit-text-fill-color:#617069 !important;
}


/* =========================================================
   DARK MODE — THIS BLOCK ONLY
   ========================================================= */

html[data-theme="dark"] .va-enrichment,
body[data-theme="dark"] .va-enrichment,
body.dark .va-enrichment,
.dark-mode .va-enrichment{
    color:#fff;
}


html[data-theme="dark"] .vae-section-head h2,
body[data-theme="dark"] .vae-section-head h2,
body.dark .vae-section-head h2,
.dark-mode .vae-section-head h2,

html[data-theme="dark"] .vae-voice-card h3,
body[data-theme="dark"] .vae-voice-card h3,
body.dark .vae-voice-card h3,
.dark-mode .vae-voice-card h3,

html[data-theme="dark"] .vae-person-card h3,
body[data-theme="dark"] .vae-person-card h3,
body.dark .vae-person-card h3,
.dark-mode .vae-person-card h3,

html[data-theme="dark"] .vae-resource-list a,
body[data-theme="dark"] .vae-resource-list a,
body.dark .vae-resource-list a,
.dark-mode .vae-resource-list a,

html[data-theme="dark"] .vae-link-card strong,
body[data-theme="dark"] .vae-link-card strong,
body.dark .vae-link-card strong,
.dark-mode .vae-link-card strong{

    color:#fff !important;
    -webkit-text-fill-color:#fff !important;
}


html[data-theme="dark"] .vae-section-head > p,
body[data-theme="dark"] .vae-section-head > p,
body.dark .vae-section-head > p,
.dark-mode .vae-section-head > p,

html[data-theme="dark"] .vae-resource-list p,
body[data-theme="dark"] .vae-resource-list p,
body.dark .vae-resource-list p,
.dark-mode .vae-resource-list p,

html[data-theme="dark"] .vae-voice-card p,
body[data-theme="dark"] .vae-voice-card p,
body.dark .vae-voice-card p,
.dark-mode .vae-voice-card p,

html[data-theme="dark"] .vae-person-card p,
body[data-theme="dark"] .vae-person-card p,
body.dark .vae-person-card p,
.dark-mode .vae-person-card p,

html[data-theme="dark"] .vae-work,
body[data-theme="dark"] .vae-work,
body.dark .vae-work,
.dark-mode .vae-work,

html[data-theme="dark"] .vae-link-card > span:last-child,
body[data-theme="dark"] .vae-link-card > span:last-child,
body.dark .vae-link-card > span:last-child,
.dark-mode .vae-link-card > span:last-child{

    color:rgba(255,255,255,.68) !important;
    -webkit-text-fill-color:rgba(255,255,255,.68) !important;
}


html[data-theme="dark"] .vae-resource-list li,
body[data-theme="dark"] .vae-resource-list li,
body.dark .vae-resource-list li,
.dark-mode .vae-resource-list li,

html[data-theme="dark"] .vae-voice-card,
body[data-theme="dark"] .vae-voice-card,
body.dark .vae-voice-card,
.dark-mode .vae-voice-card,

html[data-theme="dark"] .vae-person-card,
body[data-theme="dark"] .vae-person-card,
body.dark .vae-person-card,
.dark-mode .vae-person-card,

html[data-theme="dark"] .vae-link-card,
body[data-theme="dark"] .vae-link-card,
body.dark .vae-link-card,
.dark-mode .vae-link-card{

    background:rgba(255,255,255,.025);

    border-color:rgba(255,255,255,.13);
}


/* TABLET */

@media(max-width:980px){

    .vae-people-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

}


/* MOBILE */

@media(max-width:700px){

    .va-enrichment{
        margin-top:52px;
    }

    .vae-section{
        margin-bottom:65px;
    }

    .vae-section-head{
        grid-template-columns:1fr;
        gap:15px;
    }

    .vae-resource-list,
    .vae-grid,
    .vae-people-grid,
    .vae-link-grid{
        grid-template-columns:1fr;
    }

    .vae-voice-card,
    .vae-person-card{
        min-height:0;
    }

}