/* Revision V: a complete chapter is followed by its own scroll-scrubbed
   transition corridor. Nothing masks content while it is still being read. */
html{scroll-snap-type:none}
main>section{scroll-snap-align:none}
main>section:not(.journey){margin-top:0;z-index:auto;transform:none!important;opacity:1!important;clip-path:none!important;backface-visibility:visible}
main>section:not(.journey)::after,.chapter-cover{display:none!important}
main>section:not(.journey) :is(.manifesto-text,.atlas-intro h2,.study-heading h2,.reel-heading h2,.systems-head h2,.anatomy-intro h2,.origin-copy h2,.notes-title h2,.project-guide h2,.create-title h2,.image-orchestra,.light-compare,.reel-track,.system-specimen,.exploded-stage,.factory-window,.notes-list,.creation-desk){transform:none!important;opacity:1!important}
.journey .world-stage{transform:none!important;opacity:1!important}

.scene-corridor{--p:0;--r:0;position:relative;height:200svh;background:#19151e;color:#f5f1ed;isolation:isolate}
.scene-corridor__sticky{position:sticky;top:0;height:100svh;min-height:600px;overflow:hidden;background:#19151e;isolation:isolate}
.scene-corridor__field{position:absolute;inset:0;overflow:hidden;perspective:1200px}
.scene-corridor__field img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.scene-corridor__old{z-index:1}
.scene-corridor__new{z-index:2;clip-path:inset(0 calc((1 - var(--r))*100%) 0 0)}
.scene-corridor__field:after{content:"";position:absolute;inset:0;z-index:3;pointer-events:none;background:linear-gradient(0deg,#110e1bc9,transparent 40%),linear-gradient(90deg,#110e1b65,transparent 60%)}
.scene-corridor__light,.scene-corridor__rule{position:absolute;z-index:4;pointer-events:none}
.scene-corridor__copy{position:absolute;left:var(--pad);right:var(--pad);bottom:10%;z-index:5;display:grid;grid-template-columns:1fr 2fr;gap:8px 30px;align-items:end;text-shadow:0 2px 26px #0a0711}
.scene-corridor__number,.scene-corridor__en{font:10px/1.5 Consolas,monospace;letter-spacing:.14em}
.scene-corridor__en{text-align:right}
.scene-corridor__copy strong{grid-column:1/-1;font:400 clamp(46px,7vw,112px)/1.08 Georgia,"Microsoft YaHei",serif;letter-spacing:-.065em;max-width:16ch;opacity:clamp(0,calc(var(--r)*4),1);transform:translateY(calc((1 - var(--r))*35px))}
.scene-corridor__rail{position:absolute;z-index:6;left:var(--pad);right:var(--pad);bottom:5%;height:1px;background:#f3ecdb65}
.scene-corridor__rail i{display:block;width:100%;height:2px;background:#e4ffb8;transform:scaleX(var(--p));transform-origin:left}

/* 01: a drawn line pulls a new architectural image across the canvas. */
.scene-corridor--thread{background:#eee8e2;color:#221b2a}
.scene-corridor--thread .scene-corridor__sticky{background:#eee8e2}
.scene-corridor--thread .scene-corridor__old{object-fit:contain;transform:translateX(calc(var(--r)*-28vw)) scale(calc(.8 - var(--r)*.25));opacity:calc(1 - var(--r)*.8)}
.scene-corridor--thread .scene-corridor__new{inset:6% 0 6% auto;width:77%;height:88%;transform:translateX(calc((1 - var(--r))*48%));clip-path:inset(0 calc((1 - var(--r))*100%) 0 0)}
.scene-corridor--thread .scene-corridor__light{left:calc(var(--r)*77%);top:7%;height:86%;width:2px;background:#faffdf;box-shadow:0 0 22px #eec7ff,0 0 55px #e2c2fb}
.scene-corridor--thread .scene-corridor__field:after{background:linear-gradient(90deg,#eae2de 0%,transparent 68%)}
.scene-corridor--thread .scene-corridor__copy{text-shadow:none}
.scene-corridor--thread .scene-corridor__copy strong{max-width:7ch}

/* 02: the old plane hinges away and reveals a new quiet application. */
.scene-corridor--fold .scene-corridor__old{transform-origin:left center;transform:perspective(1100px) rotateY(calc(var(--r)*-72deg)) translateX(calc(var(--r)*-12%));filter:brightness(calc(1 - var(--r)*.42))}
.scene-corridor--fold .scene-corridor__new{clip-path:none;opacity:var(--r);transform:perspective(1100px) rotateY(calc((1 - var(--r))*38deg)) scale(calc(.84 + var(--r)*.16));transform-origin:right center}
.scene-corridor--fold .scene-corridor__rule{left:50%;top:0;bottom:0;width:1px;background:#ffffffa0;transform:scaleY(calc(1 - var(--r)*.6))}
.scene-corridor--fold .scene-corridor__copy{left:52%}

/* 03: chromatic shutters let saturated light into a monochrome scene. */
.scene-corridor--spectrum .scene-corridor__old{filter:grayscale(calc(var(--r)*1));transform:scale(calc(1 + var(--r)*.1))}
.scene-corridor--spectrum .scene-corridor__new{clip-path:none;opacity:clamp(0,calc((var(--r) - .72)*4),1)}
.scene-corridor--spectrum .scene-corridor__slat{z-index:3;clip-path:inset(0 calc((4 - var(--i))*20%) 0 calc(var(--i)*20%));opacity:clamp(0,calc((var(--r) - .08 - var(--i)*.13)*5),1);transform:translateY(calc((1 - var(--r))*12vh));filter:saturate(1.2)}
.scene-corridor--spectrum .scene-corridor__light{inset:0;background:linear-gradient(90deg,#b25aff30,#36f2e430,#eaff5140,#ff7b4540);mix-blend-mode:screen;opacity:calc(1 - var(--r))}
.scene-corridor--spectrum .scene-corridor__copy strong{color:#e6ffab}

/* 04: two full-scale spaces travel horizontally, like a moving panorama. */
.scene-corridor--panorama .scene-corridor__old{transform:translateX(calc(var(--r)*-100%))}
.scene-corridor--panorama .scene-corridor__new{clip-path:none;transform:translateX(calc((1 - var(--r))*100%))}
.scene-corridor--panorama .scene-corridor__rule{top:0;bottom:0;left:calc(var(--r)*100%);width:2px;background:#fff2c6;box-shadow:0 0 28px #fff2c6}
.scene-corridor--panorama .scene-corridor__copy{bottom:17%;grid-template-columns:1fr 1fr}

/* 05: an optical iris focuses a spatial photograph into a product close-up. */
.scene-corridor--iris .scene-corridor__old{transform:scale(calc(1 + var(--r)*.28));filter:brightness(calc(1 - var(--r)*.65))}
.scene-corridor--iris .scene-corridor__new{clip-path:circle(calc(var(--r)*78%) at 50% 45%);transform:scale(calc(1.25 - var(--r)*.25))}
.scene-corridor--iris .scene-corridor__light{width:calc(var(--r)*156vw);height:calc(var(--r)*156vw);left:50%;top:45%;transform:translate(-50%,-50%);border:1px solid #eddfc8;border-radius:50%;box-shadow:0 0 45px #eddfc855}
.scene-corridor--iris .scene-corridor__copy{right:auto;width:48%}

/* 06: engineering layers separate, then a light form takes their place. */
.scene-corridor--blueprint .scene-corridor__sticky{background:#112124}
.scene-corridor--blueprint .scene-corridor__field{background:linear-gradient(#cee5df18 1px,transparent 1px),linear-gradient(90deg,#cee5df18 1px,transparent 1px),#112124;background-size:8vw 8vw}
.scene-corridor--blueprint .scene-corridor__old{inset:15% 12%;width:76%;height:70%;object-fit:contain;transform:translateY(calc(var(--r)*-28%)) scale(calc(1 - var(--r)*.32));opacity:calc(1 - var(--r))}
.scene-corridor--blueprint .scene-corridor__new{object-fit:contain;clip-path:inset(calc((1 - var(--r))*50%) 0 calc((1 - var(--r))*50%) 0);transform:rotate(calc((1 - var(--r))*-22deg)) scale(calc(.52 + var(--r)*.3))}
.scene-corridor--blueprint .scene-corridor__rule{left:12%;right:12%;top:50%;height:1px;background:#d4ffb6;transform:scaleX(var(--r))}
.scene-corridor--blueprint .scene-corridor__copy{bottom:8%}

/* 07: the conceptual line travels down the production line. */
.scene-corridor--conveyor .scene-corridor__old{object-fit:contain;background:#201a2b;transform:translateY(calc(var(--r)*-110%))}
.scene-corridor--conveyor .scene-corridor__new{clip-path:none;transform:translateY(calc((1 - var(--r))*100%))}
.scene-corridor--conveyor .scene-corridor__rule{left:0;right:0;top:calc(var(--r)*100%);height:3px;background:#dcffa8;box-shadow:0 0 25px #dcffa8}
.scene-corridor--conveyor .scene-corridor__copy{bottom:12%;left:50%}

/* 08: a documentary frame slides aside, revealing a material detail. */
.scene-corridor--archive .scene-corridor__sticky{background:#e8e0d5;color:#28202b}
.scene-corridor--archive .scene-corridor__old{inset:8% 7%;width:66%;height:78%;transform:translateX(calc(var(--r)*-72%)) rotate(calc(var(--r)*-8deg)) scale(calc(1 - var(--r)*.2));box-shadow:0 20px 45px #21192355}
.scene-corridor--archive .scene-corridor__new{inset:8% 7% 8% auto;width:66%;height:78%;clip-path:none;transform:translateX(calc((1 - var(--r))*110%)) rotate(calc((1 - var(--r))*8deg));box-shadow:0 20px 45px #21192355}
.scene-corridor--archive .scene-corridor__field:after{background:none}
.scene-corridor--archive .scene-corridor__copy{bottom:7%;text-shadow:none}
.scene-corridor--archive .scene-corridor__rail{background:#33252f66}
.scene-corridor--archive .scene-corridor__rail i{background:#5e365c}

/* 09: an editorial question starts as type, then the scene opens behind it. */
.scene-corridor--type .scene-corridor__sticky{background:#d6ff9c;color:#1b2519}
.scene-corridor--type .scene-corridor__old{opacity:calc(1 - var(--r));transform:scale(calc(1 + var(--r)*.28));filter:grayscale(1)}
.scene-corridor--type .scene-corridor__new{clip-path:none;opacity:var(--r);transform:scale(calc(.32 + var(--r)*.68));border:solid #d6ff9c;border-width:calc((1 - var(--r))*12vh) calc((1 - var(--r))*18vw)}
.scene-corridor--type .scene-corridor__field:after{background:none}
.scene-corridor--type .scene-corridor__copy{top:9%;bottom:auto;text-shadow:none}
.scene-corridor--type .scene-corridor__copy strong{font-family:Arial,"Microsoft YaHei",sans-serif;font-weight:700;font-size:clamp(46px,10vw,155px);max-width:10ch;letter-spacing:-.075em}
.scene-corridor--type .scene-corridor__rail{background:#1b25194d}.scene-corridor--type .scene-corridor__rail i{background:#1b2519}

/* 10: all forms resolve back into one illuminated line. */
.scene-corridor--closure .scene-corridor__old{transform:scale(calc(1 + var(--r)*.2));opacity:calc(1 - var(--r))}
.scene-corridor--closure .scene-corridor__new{clip-path:none;object-fit:contain;opacity:var(--r);transform:scale(calc(.65 + var(--r)*.2)) rotate(calc((1 - var(--r))*-9deg))}
.scene-corridor--closure .scene-corridor__light{left:-25%;right:-25%;top:48%;height:2px;background:linear-gradient(90deg,transparent,#edddff,#d6ff9c,transparent);box-shadow:0 0 28px #f4e7ff;transform:translateX(calc((var(--r) - .5)*80%)) rotate(-13deg);opacity:calc(1 - var(--r)*.35)}
.scene-corridor--closure .scene-corridor__copy{bottom:13%;text-align:center}.scene-corridor--closure .scene-corridor__copy strong{max-width:none}

@media(max-width:760px){.scene-corridor{height:175svh}.scene-corridor__sticky{min-height:0}.scene-corridor__copy{bottom:13%;left:22px;right:22px;gap:8px}.scene-corridor__copy strong{font-size:clamp(34px,10vw,55px);max-width:12ch}.scene-corridor__number,.scene-corridor__en{font-size:8px}.scene-corridor__rail{left:22px;right:22px;bottom:8%}.scene-corridor--thread .scene-corridor__new{inset:15% 0 20% auto;height:65%;width:95%}.scene-corridor--fold .scene-corridor__copy,.scene-corridor--conveyor .scene-corridor__copy{left:22px}.scene-corridor--iris .scene-corridor__copy{width:auto;right:22px}.scene-corridor--archive .scene-corridor__old,.scene-corridor--archive .scene-corridor__new{top:15%;height:60%;width:83%}.scene-corridor--type .scene-corridor__copy{top:11%}.scene-corridor--type .scene-corridor__copy strong{font-size:12vw}}
@media(prefers-reduced-motion:reduce){.scene-corridor{display:none!important}}
.simple .scene-corridor{display:none!important}
