/* BRAND-2 · LEAD31Oct01:14/01:56. Opening placement and tail transitions only.
   Protected #demo/#result markup, motion.css and motion.js remain exact latest MOTION bytes; see sources/latest-motion-protected.json. */
html{scroll-snap-type:none;scroll-behavior:auto}
.hf3 .screen{position:relative;top:auto;scroll-snap-align:none}
.opening{position:relative;background:var(--paper)}
#intro{height:auto;min-height:0;overflow:visible}
#intro .hero-grid{height:auto;display:block;padding:32px 0 28px}
#intro .hero-copy{text-align:center;max-width:940px;margin:0 auto}
#intro .tool-label{display:flex;align-items:center;justify-content:center;gap:10px;font:600 24px/1.3 DM,Arial,sans-serif;color:var(--blue);margin:0 0 18px}
#intro .tool-label svg{width:26px;height:26px;flex:0 0 auto}
#intro .hero-title{font:700 64px/1.1 Jakarta,Arial,sans-serif;letter-spacing:-.05em;max-width:20ch;color:var(--blue);margin:0 auto 22px}
#intro .lede{font-size:18px;line-height:1.55;max-width:67ch;margin:0 auto 24px}
#intro .hero-action{display:flex;flex-direction:column;align-items:center;gap:12px}
#intro .hero-action .allowance{font-size:12px;line-height:1.5;max-width:none}
/* Remove the separate chapter presentation, not MOTION's scene or controls. */
.opening>#demo{height:auto;min-height:0;overflow:visible}
.opening>#demo>.scene{height:auto;padding-top:0;padding-bottom:64px}
.opening>#demo>.scene>.section-head{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
.opening>#demo .demo-centre{flex:none;width:100%;height:auto}
/* Tail only: each following section covers the pinned previous one. */
.hf3>#your-ai{position:sticky;top:0;z-index:10}
.hf3>#questions{position:relative;top:auto;z-index:11;height:auto;min-height:100svh;overflow:visible}
#questions .faq-screen{height:auto}
#questions .faq-list{height:auto;max-height:none;flex:none;overflow:visible;overscroll-behavior:auto}
.hf3>#also-useful{position:sticky;top:0;z-index:12}
.hf3>#fresh-start{position:relative;top:auto;z-index:13}
.footer-b2{position:relative;top:auto;z-index:14}
@media(max-width:1000px) and (min-width:761px){#intro .hero-title{font-size:54px}#intro .lede{font-size:17px}}
@media(max-width:760px){
 #intro .hero-grid{padding:24px 0 24px}
 #intro .tool-label{font-size:20px;gap:8px;margin-bottom:16px}
 #intro .tool-label svg{width:23px;height:23px}
 #intro .hero-title{font-size:38px;line-height:1.13;max-width:18ch;margin-bottom:18px}
 #intro .lede{font-size:15px;line-height:1.55;max-width:36ch;margin-bottom:22px}
 #intro .hero-action{gap:12px}
 #intro .hero-action .allowance{font-size:12px;max-width:32ch}
 .opening>#demo>.scene{padding-bottom:36px}
}
@media(prefers-reduced-motion:reduce){.hf3>#your-ai,.hf3>#questions,.hf3>#also-useful{position:relative;top:auto}html{scroll-behavior:auto}}