/* Preserve live typography, header, stores and lower sections; replace only step layout. */
html{scroll-behavior:smooth;scroll-padding-top:12px}
body.scroll-layout{padding-top:0;overscroll-behavior-y:auto;overflow-x:clip;overflow-y:auto}
.scroll-layout .opening-track,.scroll-layout .opening-pin{height:auto;min-height:0;position:relative;top:auto;transform:none}
.scroll-layout .banner-panel,.scroll-layout .final-panel{min-height:0!important}
.scroll-layout .banner-panel{padding-bottom:0}
.scroll-layout .banner-panel .hero-copy{min-height:0!important}
.scroll-layout .banner-panel>.opening-pin{padding-bottom:0}
.scroll-layout .banner-panel #mindify-stages{--hero-art-size:380px;--hero-art-width:380px;margin-bottom:0}
.scroll-layout #hero-animation-mount{width:100%}
.scroll-layout .try-section{padding-top:32px;padding-bottom:36px;--cta-reveal:1}
.scroll-layout .try-content{opacity:1}
.scroll-layout .final-panel .psych-tests{padding-top:36px;padding-bottom:36px}
.benefits-carousel{max-width:1200px;margin:0 auto;padding:36px 0 24px;overflow:hidden}
.benefits-carousel>.flow-heading{font:400 22px/1.35 'DM Sans',sans-serif;letter-spacing:0;text-transform:none;color:#fff;text-align:center;max-width:640px;margin:0 auto 28px;padding:0 24px}
.benefits-carousel>.flow-heading span{display:block}
.benefit-rail{display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:24px;padding:4px 24px 16px;scrollbar-width:none;overscroll-behavior-x:contain;cursor:grab;touch-action:pan-x pan-y pinch-zoom}
.benefit-rail::-webkit-scrollbar{display:none}
.benefit-card{flex:0 0 340px;min-width:0;scroll-snap-align:start;border:1px solid #a5a6ff36;border-radius:24px;background:#121d3c;padding:22px 26px 20px;transition:border-color .25s,background .25s}
.benefit-card.selected{border-color:#a5a6ff8c;background:#171f43}
.benefit-card>img{display:block;width:100%;height:210px;object-fit:contain;pointer-events:none}
.benefit-card .support-copy{text-align:center}
.benefit-card .support-copy h3{font-family:Fraunces,serif;min-height:66px;font-size:26px;line-height:1.2;color:var(--ink);margin:12px 0}
.benefit-card .support-copy p{min-height:94px;font:400 17px/1.45 'DM Sans',sans-serif;color:var(--muted);margin:0}
.benefit-card .area-action{color:var(--accent);font:400 15px/1.4 'DM Sans',sans-serif;display:inline-flex;align-items:center;min-height:44px;margin-top:8px;text-underline-offset:4px}
.benefit-indicators{display:flex;justify-content:center;gap:0}
.benefit-indicators button{display:grid;place-items:center;min-width:34px;height:44px;padding:10px;background:none;border:0;cursor:pointer}
.benefit-indicators span{width:5px;height:5px;background:#414967;border-radius:5px;transition:width .25s,background .25s}
.benefit-indicators button[aria-current=true] span{width:18px;background:#b9aff2}
.benefit-indicators button:focus-visible,.benefit-rail:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.benefit-rail.dragging{cursor:grabbing;scroll-snap-type:none;user-select:none}
@media(min-width:760px){.benefit-rail::after{content:'';flex:0 0 min(720px,calc(100vw - 390px))}}
@media(max-width:700px){.benefits-carousel{padding-top:28px}.benefits-carousel>.flow-heading{font-size:20px;margin-bottom:20px}.benefit-rail{gap:14px}.benefit-card{flex-basis:calc(100% - 24px);padding:18px 22px 16px}.benefit-card>img{height:190px}.benefit-card .support-copy h3{font-size:25px}.benefit-card .support-copy p{font-size:16px;min-height:92px}.scroll-layout .try-section{padding-top:24px}.scroll-layout .banner-panel #mindify-stages{--hero-art-size:320px;--hero-art-width:320px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.benefit-card,.benefit-indicators span{transition:none}}

/* Download introduction follows the CMS animation visibility. */
.scroll-layout .download-intro[hidden]{display:none}
.scroll-layout .download-intro :is(h1,h2){font-size:clamp(2rem,4vw,3.25rem);line-height:1.15;letter-spacing:normal;margin-bottom:30px}
.scroll-layout .download-intro p{font-size:1.125rem;line-height:1.75;max-width:740px;color:var(--muted);text-wrap:pretty;margin:0 auto 32px}
@media(max-width:700px){.scroll-layout .download-intro p{font-size:1rem;margin-bottom:28px}}

@media(max-width:700px){.scroll-layout .download-intro :is(h1,h2){margin-bottom:18px}}

/* The alternative introduction uses the existing download design. */
.scroll-layout .banner-panel .hero[hidden],.scroll-layout #intro-download[hidden]{display:none!important}
/* Keep the same header spacing in both introduction layouts. */
.scroll-layout #intro-download{padding-top:24px}

/* Keep the top download content above the decorative cloud overlay. */
.scroll-layout #intro-download{z-index:3}