/**
 * Editorial Hero Rhythm System — 1.0.58
 * Final frontend spacing layer for the material-type/date kicker, headline
 * and preview/deck across standard articles, interviews and expert columns.
 */

:root{
    --ib-editorial-hero-top-gap:clamp(38px,3.4vw,52px);
    --ib-editorial-kicker-title-gap:clamp(22px,2vw,28px);
    --ib-editorial-title-deck-gap:clamp(28px,2.4vw,34px);
    --ib-editorial-kicker-font-size:11px;
}

/* STANDARD ARTICLES ------------------------------------------------------ */
body.ib-et .ib-single-template .ib-article-hero-copy{
    padding-top:max(58px,var(--ib-editorial-hero-top-gap));
}
body.ib-et .ib-single-template .ib-article-kicker{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:14px;
    margin:0 0 var(--ib-editorial-kicker-title-gap);
    font-family:var(--ib-meta-font,var(--ib-font-meta,Montserrat,Arial,sans-serif));
    font-size:var(--ib-editorial-kicker-font-size);
    font-weight:700;
    line-height:1.25;
    letter-spacing:.15em;
    text-transform:uppercase;
    color:var(--ib-meta-color,var(--ib-muted,#626262));
}
body.ib-et .ib-single-template .ib-article-kicker__divider{
    display:block;
    width:1px;
    height:17px;
    background:currentColor;
    opacity:.35;
}
body.ib-et .ib-single-template .ib-article-kicker time{
    color:inherit;
    font-weight:600;
}
body.ib-et .ib-single-template .ib-article-hero-copy > h1{
    margin-top:0;
}
body.ib-et .ib-single-template .ib-article-deck{
    margin-top:var(--ib-editorial-title-deck-gap);
}

/* INTERVIEWS ------------------------------------------------------------- */
/* Copy-led interview layouts receive a calm gap below navigation. Image
 * overlay and image-first layouts intentionally preserve their own geometry. */
body.ib-et .ib-interview-layout--int-01 .ib-int-hero--split-ref,
body.ib-et .ib-interview-layout--int-03 .ib-int-hero--classic,
body.ib-et .ib-interview-layout--int-05 .ib-int-hero--portrait{
    padding-top:var(--ib-editorial-hero-top-gap);
}
body.ib-et .ib-interview-layout--int-01 .ib-int-kicker,
body.ib-et .ib-interview-layout--int-05 .ib-int-kicker{
    margin-bottom:var(--ib-editorial-kicker-title-gap);
}
body.ib-et .ib-interview-layout--int-01 .ib-int-deck,
body.ib-et .ib-interview-layout--int-05 .ib-int-deck{
    margin-top:var(--ib-editorial-title-deck-gap);
}
/* INT-03 keeps its approved left metadata rail, but receives the same top
 * breathing room and consistent title-to-preview rhythm. */
body.ib-et .ib-interview-layout--int-03 .ib-int-classic-title .ib-int-deck{
    margin-top:var(--ib-editorial-title-deck-gap);
}

/* EXPERT COLUMNS --------------------------------------------------------- */
body.ib-et .ib-expert-system .ib-exp-hero--authority{
    padding-top:var(--ib-editorial-hero-top-gap);
}
body.ib-et .ib-expert-system .ib-exp-kicker{
    margin-bottom:var(--ib-editorial-kicker-title-gap);
}
body.ib-et .ib-expert-system .ib-exp-deck{
    margin-top:var(--ib-editorial-title-deck-gap);
}
/* Split and portrait expert layouts already use substantial internal copy
 * padding. Normalize the minimum top edge without disturbing image geometry. */
body.ib-et .ib-expert-system .ib-exp-split-copy,
body.ib-et .ib-expert-system .ib-exp-portrait-copy{
    padding-top:max(58px,var(--ib-editorial-hero-top-gap));
}

/* Make all kicker groups sit on the same left axis as their title. */
body.ib-et :is(
    .ib-article-kicker,
    .ib-int-kicker,
    .ib-exp-kicker
){
    box-sizing:border-box;
}

@media(max-width:900px){
    :root{
        --ib-editorial-hero-top-gap:36px;
        --ib-editorial-kicker-title-gap:20px;
        --ib-editorial-title-deck-gap:24px;
    }
    body.ib-et .ib-single-template .ib-article-hero-copy{
        padding-top:44px;
    }
    body.ib-et .ib-interview-layout--int-01 .ib-int-hero--split-ref,
    body.ib-et .ib-interview-layout--int-03 .ib-int-hero--classic,
    body.ib-et .ib-interview-layout--int-05 .ib-int-hero--portrait{
        padding-top:36px;
    }
}

@media(max-width:640px){
    :root{
        --ib-editorial-hero-top-gap:28px;
        --ib-editorial-kicker-title-gap:16px;
        --ib-editorial-title-deck-gap:20px;
        --ib-editorial-kicker-font-size:9px;
    }
    body.ib-et .ib-single-template .ib-article-hero-copy{
        padding-top:36px;
    }
    body.ib-et .ib-single-template .ib-article-kicker{
        gap:9px;
    }
    body.ib-et .ib-single-template .ib-article-kicker__divider{
        height:14px;
    }
}