/* Entrance visual system: stage portals, travelling light, compact chapters. */
header .brand-mark{display:block!important;width:44px;height:44px;border:0;background:none;flex:none;padding:0}
.brand-mark img{display:block;width:100%;height:100%}
header .brand{gap:12px}.header-inner{min-height:82px}
::selection{background:#ebc787;color:#17211b}
body{overflow-x:clip}
main>section{position:relative;isolation:isolate;scroll-margin-top:100px}
.scope,.guide,.seat-story{padding-block:clamp(48px,7vh,90px)}
.section-heading{margin-bottom:28px}.section-heading h2,.light-heading h2,.seat-story h2{font-size:clamp(30px,3.5vw,52px);line-height:1.3}
.scope-layout{border-radius:24px;overflow:hidden;grid-template-columns:minmax(0,1fr) minmax(220px,.34fr)}
.scope-view{min-height:0;aspect-ratio:1.7;perspective:900px}
.scope-view img{transform:scale(calc(1.02 + var(--chapter-progress,0)*.07));transition:transform .25s linear}
.scope-menu{background:linear-gradient(140deg,#30392d,#17231c);padding:24px}
.scope .zone{transition:background .25s,transform .25s}.scope .zone:hover{transform:translateX(4px)}
.scope-scan{opacity:.75!important}
.guide{overflow:hidden;background:radial-gradient(ellipse at 25% 70%,#39473266,transparent 55%),#151b16}
.guide::before,.finish::before{content:"";pointer-events:none;position:absolute;inset:-20% -25%;z-index:-1;background:conic-gradient(from -28deg at 28% 10%,transparent 0deg,#e8ce8824 14deg,transparent 30deg);transform:translateX(calc(var(--chapter-progress,0)*12%)) rotate(calc(var(--chapter-progress,0)*12deg))}
.guide-panel{gap:clamp(24px,5vw,80px)}
.guide .demo{min-height:260px;position:relative;isolation:isolate}
.guide .demo::before{content:"";position:absolute;inset:5% 12%;border:1px solid #e6cf8333;border-radius:50%;background:radial-gradient(ellipse,#d4c48914,transparent 65%);transform:rotateX(55deg) rotate(-20deg);box-shadow:0 0 0 28px #d4c48908,0 0 0 56px #d4c48905;z-index:-1}
.guide-steps li{border-bottom:1px solid #ffffff15;padding-block:14px}
.guide-steps li:last-child{border:0}.guide-steps p{margin:6px 0}
/* Keep heading, range and visual within a typical laptop viewport. */
.light-chapter{padding:clamp(32px,5vh,64px) 0;background:#111812;overflow:hidden}
.light-sticky{display:grid;grid-template-columns:minmax(250px,.75fr) minmax(0,1.65fr);gap:clamp(24px,4vw,64px);align-items:center;width:min(1280px,calc(100% - 80px));margin:auto;min-height:0;padding:0}
.light-heading.wrap{width:auto;margin:0;display:block;min-width:0}
.light-heading h2{margin:0 0 22px}.light-heading p{max-width:30em;margin:0 0 24px;color:#c2c8bb}
.light-compare{width:100%;height:clamp(310px,65svh,620px);min-height:0;max-height:none;aspect-ratio:auto;border-radius:26px;transform:perspective(1400px) rotateY(calc((var(--chapter-progress,.5) - .5)*-3deg));transition:transform .2s linear}
.light-compare>img{object-position:50% 48%}
.light-compare:after{background:linear-gradient(#0005,transparent 25%,transparent 80%,#10141066)}
.compare-divider{bottom:0}.compare-divider>span{top:50%;transform:translateY(-50%)}
.light-heading .compare-control{position:static;transform:none;width:100%;margin-top:28px;text-align:left}
.light-heading .compare-control input{height:44px;margin:0 0 12px;width:100%}
.light-heading .feature-buttons{display:flex;width:100%;gap:2px;padding:4px;margin:0;box-sizing:border-box}
.light-heading .feature-buttons button{flex:1;min-width:0;white-space:normal;overflow-wrap:anywhere;font-size:13px;line-height:1.45;padding:10px 8px;min-height:44px}
.light-labels{gap:12px;letter-spacing:.03em}.light-labels span{border-radius:20px;backdrop-filter:blur(10px);font-size:12px}
.seat-story{gap:clamp(24px,6vw,100px);align-items:center}
.seat-illustration{min-height:460px;transform:perspective(1200px) rotateY(calc((var(--chapter-progress,.5) - .5)*6deg));transition:transform .2s linear}
.seat-story .seat-map{top:105px}.seat-story .seat-example{margin-top:260px}
.finish{overflow:hidden;background:radial-gradient(ellipse at 70% 100%,#73724844,transparent 65%),#1e281f;padding-block:clamp(48px,8vh,100px)}
.finish .cta{position:relative;overflow:hidden}.finish .cta::after{content:"";position:absolute;inset:-100% -80%;background:linear-gradient(110deg,transparent 43%,#fff7 50%,transparent 57%);transform:translateX(-65%);pointer-events:none}
.finish.chapter-active .cta::after{animation:cta-glint 4.5s ease-in-out infinite}
@keyframes cta-glint{0%,45%{transform:translateX(-65%)}85%,100%{transform:translateX(65%)}}
/* Stagger content on entry. Defaults remain fully readable if JS is disabled. */
body.entrance-motion .chapter-item{transition:opacity .85s ease,transform 1s cubic-bezier(.16,1,.3,1);transition-delay:var(--item-delay,0ms)}
body.entrance-motion .chapter-pending .chapter-item{opacity:.15;transform:translateY(38px)}
body.entrance-motion .chapter-active .chapter-item{opacity:1;transform:translateY(0)}
.chapter-active .demo::before{animation:demo-halo 7s ease-in-out infinite alternate}
@keyframes demo-halo{to{transform:rotateX(55deg) rotate(12deg) scale(1.08);opacity:.5}}
.chapter-sheen{position:absolute;inset:0;pointer-events:none;z-index:2;background:linear-gradient(115deg,transparent 35%,#f6e1a31a 49%,transparent 62%);transform:translateX(-100%)}
.chapter-active .chapter-sheen{animation:chapter-sweep 2.1s cubic-bezier(.16,1,.3,1) both}
@keyframes chapter-sweep{to{transform:translateX(100%)}}
body.page-inactive *,body.page-inactive *::before,body.page-inactive *::after{animation-play-state:paused!important}
@media(max-width:900px){.light-sticky{width:calc(100% - 40px);grid-template-columns:minmax(210px,.8fr) minmax(0,1.2fr);gap:24px}.light-heading h2{font-size:32px}.scope-layout{grid-template-columns:minmax(0,1fr) 230px}.header-inner{min-height:72px}}
@media(max-width:760px){
 header .brand-mark{width:32px;height:32px}.header-inner{gap:10px;min-height:0}header .brand{align-items:center}.header-inner .brand>span:last-child{max-width:none;font-size:12px}
 .hero-content{padding-top:175px}.scope-layout{grid-template-columns:1fr}.scope-view{aspect-ratio:1.3}.scope-menu{padding:18px}
 .section-heading{display:block}.section-heading h2{margin-bottom:16px}.scope,.guide,.seat-story{padding-block:48px}
 .light-sticky{display:flex;flex-direction:column;align-items:stretch;gap:22px;width:calc(100% - 40px)}
 .light-heading h2{font-size:clamp(28px,7vw,36px);margin-bottom:12px}.light-heading h2 br{display:none}.light-heading p{margin-bottom:12px;font-size:14px}
 .light-heading .compare-control{margin-top:8px}.light-heading .compare-control input{margin-bottom:0}.light-compare{height:clamp(260px,43svh,420px);border-radius:20px;transform:none}
 .light-labels{top:12px;left:10px;right:10px}.light-labels span{font-size:11px;padding:6px 9px}.guide .demo{min-height:220px}
 .guide-panel{gap:18px}.seat-story{display:block}.seat-illustration{margin-top:28px;transform:none}.seat-story .seat-steps{margin-block:20px}
}
@media(max-height:650px) and (min-width:761px){.light-chapter{padding-block:24px}.light-compare{height:70svh}.light-heading h2{font-size:30px}.light-heading p{margin-bottom:12px}.light-heading .compare-control{margin-top:12px}}
@media(prefers-reduced-motion:reduce){
 html{scroll-behavior:auto}body.entrance-motion .chapter-item{opacity:1!important;transform:none!important;transition:none!important}
 .scope-view img,.light-compare,.seat-illustration,.guide::before,.finish::before{transform:none!important;transition:none!important}
 .chapter-sheen,.finish .cta::after{display:none}.chapter-active .demo::before{animation:none}
}
@media(min-width:761px){.scope-view{height:clamp(280px,48svh,480px);aspect-ratio:auto}.scope .section-heading{margin-bottom:22px}.scope .section-heading h2{margin-top:0}}
@media(min-width:761px) and (prefers-reduced-motion:no-preference){
 body.entrance-motion .chapter-active .light-compare{transform:perspective(1400px) rotateY(calc((var(--chapter-progress,.5) - .5)*-5deg))}
 body.entrance-motion .seat-story.chapter-active .seat-illustration{transform:perspective(1200px) rotateY(calc((var(--chapter-progress,.5) - .5)*8deg))}
}
