/* ─── Homepage layouts ───────────────────────────────────────────────────────
   Shared section styles live in hero.css / sections.css; this file holds only
   what is specific to the five compositions (scoped under .home--layout-N)
   plus the few homepage-only bits. Loaded on the front page only.
   ────────────────────────────────────────────────────────────────────────── */
.sec--flush-top{padding-top:0}
.cta-band .ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}

/* Hero arrangements ---------------------------------------------------------- */
/* centered (layout 2): headline centered, session card full width below */
.hero--centered .hero__text{text-align:center;max-width:860px;margin:0 auto}
.hero--centered .lede{margin-left:auto;margin-right:auto}
.hero--centered .ctas,.hero--centered .assure{justify-content:center}
.hero--centered .hero__aside{max-width:860px;width:100%;margin:0 auto}
.hero--centered::before{left:50%;right:auto;margin-left:-340px}

/* compact (layout 3): headline left, copy + buttons right, facts below */
.hero--compact{padding-bottom:clamp(32px,4vw,56px)}
@media (min-width:901px){
  .hero--compact .hero__text{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);column-gap:clamp(28px,4vw,64px);align-items:end}
  .hero--compact .eyebrow{grid-column:1/-1}
  .hero--compact h1{margin-bottom:0}
  .hero--compact .ctas{margin-top:22px}
}

/* stats (layout 5): the facts strip sits inside the hero */
.strip--in-hero{border:0;background:transparent;margin-top:clamp(28px,4vw,48px);position:relative}
.hero--stats .strip--in-hero .container{border-top:1px solid var(--line)}

/* Session band (layouts 3, 4) -------------------------------------------------- */
.session-band .split{align-items:center}
.session-band .hero-app{background:var(--ink-deep)}