/* cohort-b.css · Bottom Line, Top of Mind and The Long Game.
   Only the few pieces the kit in app.css doesn't already have. */

/* small section label (At a glance) */
.sec-k{margin-bottom:18px}

/* who it's for and the problem: the story on the left, what this cohort covers on the right */
.split--top{align-items:start}
.story__k .ic{width:18px;height:18px;color:var(--violet)}
.story__h{margin:16px 0 26px;font-size:var(--fs-2);line-height:1.1;letter-spacing:-.035em;font-weight:700;text-wrap:balance}
.scope{position:sticky;top:calc(var(--nav-h) + 28px);padding:clamp(20px,2.4vw,28px);border-radius:var(--r-l);background:var(--grey)}
.scope__r{display:flex;align-items:flex-start;gap:14px;padding:16px 0;border-top:1px solid var(--line)}
.scope__r:first-child{padding-top:0;border-top:0}
.scope__r:last-child{padding-bottom:0}
.scope__r b{display:block;font-size:var(--fs-3);line-height:1.3;letter-spacing:-.015em}
.scope__r div>span{display:block;margin-top:2px;font-size:var(--fs-ui);line-height:1.45;color:var(--ink-3)}
a.scope__r:hover b{color:var(--violet)}
.scope__x{width:32px;height:32px;flex:none;display:grid;place-items:center;border-radius:9px;background:var(--grey-2);color:var(--ink-3)}
.scope__x .ic{width:13px;height:13px}
@media (max-width:899px){ .scope{position:static} }

/* how it runs: the pod hours, and the weekly rule at the foot of the Monday card */
.pods-k{margin-top:10px;font-size:var(--fs-ui);font-weight:600;color:var(--ink-3)}
.pill b{color:var(--ink)}
.runs-note{margin-top:16px}
.card .note{margin-top:auto;background:var(--grey);font-size:var(--fs-ui)}
.card .note .ic{width:16px;height:16px}

/* the seat price wraps under itself on a phone instead of squeezing */
.seat__price{flex-wrap:wrap;row-gap:6px}

/* who this is not for, a size up beside the big heading */
.ticks--lg{gap:16px}
.ticks--lg li{font-size:var(--fs-lead)}
.ticks--lg li::before{top:3px}

/* the questions, with the next step beside them */
.fq{display:grid;grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr);gap:clamp(28px,5vw,80px);align-items:start}
.fq__intro{position:sticky;top:calc(var(--nav-h) + 32px)}
.fq__cta{display:flex;flex-wrap:wrap;align-items:center;gap:12px 22px;margin-top:28px}
.fq .faq{max-width:none}
@media (max-width:899px){ .fq{grid-template-columns:1fr} .fq__intro{position:static} }

/* where else to go: the pass and the free room */
.after{margin-top:clamp(48px,6vw,80px)}
.card__top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}
.card__p{font-size:var(--fs-2b);font-weight:700;letter-spacing:-.03em}
.card--pass{background:radial-gradient(90% 120% at 100% 0%,rgba(226,109,240,.26),transparent 60%),linear-gradient(140deg,#F4EEFB,#EDE4F8)!important}
.card--pass .card__p{color:var(--violet)}
.card--pass .syms{--syms-ring:#F1EAFA}

/* the Long Game: the pass, with the saving drawn */
.seat.pass{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,4vw,64px);align-items:center;margin-top:16px}
.pass__copy{display:flex;flex-direction:column;align-items:flex-start;gap:12px}
.pass__copy .btn{margin-top:8px}
.pass__copy .seat__k{align-self:stretch}
.pass__copy .seat__note b{color:var(--ink)}
.bars{display:grid;gap:20px}
.bar{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px 12px;font-size:var(--fs-ui)}
.bar__k{font-weight:600;color:var(--ink-3)}
.bar__v{font-weight:700;font-variant-numeric:tabular-nums}
.bar__t{grid-column:1 / -1;height:12px;border-radius:999px;background:rgba(0,0,0,.06);overflow:hidden}
.bar__t i{display:block;width:var(--w);height:100%;border-radius:inherit;background:var(--grey-3);transition:width 1.2s var(--ease) .25s}
.bars.is-pre .bar__t i{width:0}
.bar--x .bar__v{color:var(--ink-4);text-decoration:line-through}
.bar--win .bar__k{color:var(--violet)}
.bar--win .bar__t i{background:var(--grad)}
@media (max-width:899px){ .seat.pass{grid-template-columns:1fr} }

/* the Long Game: what a year leaves you with */
.yr{display:flex;align-items:flex-start;gap:16px;padding:20px 22px;border-radius:var(--r-m);background:var(--grey)}
.yr small{display:block;font-size:var(--fs-ui);font-weight:600;color:var(--ink-3)}
.yr p{margin-top:2px;font-size:var(--fs-lead);line-height:1.4;font-weight:600;letter-spacing:-.02em}

/* the Long Game hero: the second half of the headline stays in one piece */
.phero__h .blk,.band__h .blk{display:inline-block}
.pass__copy .seat__k{justify-content:flex-start}
