/* Section 02: a cropped overhead maze and individual scroll-driven scenes. */
.journey{--maze-width:clamp(100px,17vw,180px);padding:40px 0 25px;margin-top:40px}
.interest{grid-template-columns:minmax(0,1fr) var(--maze-width) minmax(0,1fr);gap:24px;min-height:360px;padding:35px 0;--p:0}
.interest .interest-copy{grid-column:1;max-width:340px;margin:0;z-index:2}
.interest:nth-of-type(even) .interest-copy{grid-column:3;margin:0 0 0 auto}
.interest h3{font-size:clamp(20px,2.35vw,33px);line-height:1.3;margin-bottom:0;font-weight:550}
.interest .item-number{font-size:9px;margin-bottom:19px;letter-spacing:.1em;transition:color .3s}
.interest .route-node{display:none}
.interest.current h3{color:var(--ink)}
.interest.current .item-number{color:var(--green)}
.interest-visual{grid-column:3;grid-row:1;align-self:center;justify-self:center;width:100%;max-width:330px;color:var(--green-soft);position:relative;z-index:1}
.interest:nth-of-type(even) .interest-visual{grid-column:1}
.art-scene{position:relative;--p:0;opacity:calc(.44 + var(--p)*.56);transition:opacity .15s linear}
.art-scene>svg{width:100%;height:auto;overflow:visible;display:block;fill:none;stroke:currentColor;stroke-width:1.15;stroke-linejoin:round;stroke-linecap:round}
.scene-base{opacity:.48}.scene-detail{opacity:.65}.scene-accent{stroke:var(--green)}.scene-solid{fill:var(--green);stroke:none}
.scene-grid{opacity:.16;stroke-width:.7}.scene-caption{font:8px var(--mono);letter-spacing:.12em;color:var(--green-muted);margin:18px 0 0 12px;display:flex;gap:10px;align-items:center}
.scene-caption:before{content:'';display:block;width:15px;height:1px;background:var(--green);opacity:calc(.2 + var(--p)*.8)}
.scene-ink{fill:var(--bg)}
.scene-key .moving-key{transform:translate(calc(var(--p)*48px),calc(var(--p)*-7px)) rotate(calc(var(--p)*-12deg));transform-origin:90px 119px}
.scene-key .key-door{transform:scaleX(calc(1 - var(--p)*.36));transform-origin:193px 95px}
.scene-key .key-spark{opacity:var(--p);transform:scale(calc(.6 + var(--p)*.4));transform-origin:216px 90px}
.draw-stroke{stroke-dasharray:1;stroke-dashoffset:calc(1 - var(--p))}
.scene-map .compass-needle{transform:rotate(calc(-45deg + var(--p)*100deg));transform-origin:239px 62px}
.scene-map .map-pin{transform:translate(calc(var(--p)*61px),calc(var(--p)*-34px))}
.scene-book .turning-page{transform:scaleX(calc(1 - var(--p)*1.7));transform-origin:160px 126px}
.scene-book .story-bubble{transform:translateY(calc(22px - var(--p)*22px));opacity:calc(.1 + var(--p)*.9)}
.scene-film .film-frames{transform:translateX(calc(var(--p)*-79px))}
.scene-film .play-mark{transform:scale(calc(.8 + var(--p)*.2));transform-origin:161px 110px;opacity:calc(.2 + var(--p)*.8)}
.scene-ui .ui-image{transform:translate(calc(-32px + var(--p)*32px),calc(24px - var(--p)*24px));opacity:calc(.15 + var(--p)*.85)}
.scene-ui .ui-text{transform:translateX(calc(37px - var(--p)*37px));opacity:calc(.15 + var(--p)*.85)}
.scene-ui .ui-button{transform:translateY(calc(30px - var(--p)*30px));opacity:var(--p)}
.scene-ui .ui-cursor{transform:translate(calc(30px - var(--p)*30px),calc(18px - var(--p)*18px))}
.scene-test .test-glass{transform:translate(calc(-40px + var(--p)*65px),calc(12px - var(--p)*12px))}
.scene-test .test-check{opacity:calc(.12 + var(--p)*.88)}
.scene-people .person-a{transform:translate(calc(-25px + var(--p)*25px),calc(15px - var(--p)*15px))}
.scene-people .person-b{transform:translate(calc(25px - var(--p)*25px),calc(15px - var(--p)*15px))}
.scene-people .person-c{transform:translateY(calc(-22px + var(--p)*22px))}
.scene-people .connection{opacity:var(--p)}
.scene-nerd .creative-orbit{transform:rotate(calc(-14deg + var(--p)*28deg));transform-origin:160px 110px}
.scene-nerd .code-brackets{transform:translateX(calc(15px - var(--p)*15px));opacity:calc(.2 + var(--p)*.8)}
.scene-star .star-orbit{transform:rotate(calc(var(--p)*120deg));transform-origin:160px 110px}
.scene-star .star-core{transform:scale(calc(.72 + var(--p)*.28)) rotate(calc(var(--p)*15deg));transform-origin:160px 110px}
.scene-star .star-ray{opacity:var(--p)}
.maze-field{position:absolute;top:0;bottom:0;left:50%;width:calc(var(--maze-width) + 36px);transform:translateX(-50%);overflow:hidden;z-index:0;pointer-events:none;mask-image:linear-gradient(to right,transparent,#000 17%,#000 83%,transparent);-webkit-mask-image:linear-gradient(to right,transparent,#000 17%,#000 83%,transparent)}
.maze-field:after{content:'';position:absolute;inset:0;background:linear-gradient(to bottom,var(--bg),transparent 85px,transparent calc(100% - 85px),var(--bg));z-index:4;pointer-events:none}
.maze-field .route{position:absolute;inset:0;width:100%;height:100%;z-index:0;overflow:hidden}
.maze-field .route path{fill:none;vector-effect:non-scaling-stroke;stroke-linejoin:miter;stroke-linecap:square}
.maze-field #maze-walls{stroke:var(--green-line);opacity:.55}
.maze-field #maze-floor{stroke:color-mix(in srgb,var(--green) 3%,var(--bg));opacity:1}
.maze-field #route-base{stroke:none;opacity:0}
.maze-field #route-progress{stroke:var(--green);stroke-width:1;stroke-linecap:round;opacity:.17}
.maze-field .maze-landmark{fill:var(--green);opacity:.24;stroke:none}
.maze-field .runner{width:21px;height:40px;z-index:3;opacity:0;transform-origin:center;will-change:transform}
.rat-heading{width:100%;height:100%;transform-origin:50% 50%;transition:transform .12s linear}
.runner .rat-top{width:100%;height:100%;overflow:visible;color:var(--green);fill:var(--green);stroke:none;animation:none}
.rat-top .rat-body{fill:var(--green-soft);stroke:var(--green-pale);stroke-width:1}
.rat-top .rat-head{fill:var(--green-soft);stroke:var(--green-pale);stroke-width:1}
.rat-top .rat-ear{fill:var(--green-line);stroke:var(--green-pale);stroke-width:1}
.rat-top .rat-tail{stroke:var(--green-soft);stroke-width:2.4;fill:none;stroke-linecap:round;transform-origin:25px 54px}
.rat-top .rat-foot{fill:var(--green-soft);transform-box:fill-box;transform-origin:center}
.rat-top .rat-whisker{stroke:var(--green-pale);stroke-width:.8;fill:none;opacity:.85}
.runner.is-moving svg{animation:none}
.runner.is-moving .rat-foot-a{animation:paw-a .19s linear infinite alternate}
.runner.is-moving .rat-foot-b{animation:paw-b .19s linear infinite alternate}
.runner.is-moving .rat-tail{animation:tail-sway .32s ease-in-out infinite alternate}
@keyframes paw-a{from{transform:translateY(-2px) rotate(-12deg)}to{transform:translateY(2px) rotate(12deg)}}
@keyframes paw-b{from{transform:translateY(2px) rotate(12deg)}to{transform:translateY(-2px) rotate(-12deg)}}
@keyframes tail-sway{from{transform:rotate(-5deg)}to{transform:rotate(5deg)}}
@media(min-width:1600px){.interest{min-height:390px}.journey{--maze-width:210px}}
@media(max-width:1050px){.interest{min-height:325px;gap:18px}.interest .item-number{font-size:8px;letter-spacing:.06em}.scene-caption{font-size:7px;letter-spacing:.04em;margin-top:12px;margin-left:3px}.interest-visual{max-width:265px}}
@media(max-width:700px){.journey{--maze-width:62px;margin-top:15px;padding-top:15px}.interest{min-height:320px;padding:30px 0;gap:9px;grid-template-columns:minmax(0,1fr) var(--maze-width) minmax(0,1fr)}.interest h3{font-size:clamp(16px,4.2vw,22px);line-height:1.35;overflow-wrap:normal}.interest .interest-copy,.interest:nth-of-type(even) .interest-copy{max-width:none;margin:0}.interest .item-number{font-size:7px;letter-spacing:0;line-height:1.6;margin-bottom:13px}.interest-visual{width:110%;max-width:none}.scene-caption{font-size:6px;line-height:1.7;letter-spacing:.03em;gap:5px}.scene-caption:before{width:8px}.art-scene{opacity:calc(.6 + var(--p)*.4)}.maze-field{width:calc(var(--maze-width) + 12px);mask-image:linear-gradient(to right,transparent,#000 12%,#000 88%,transparent);-webkit-mask-image:linear-gradient(to right,transparent,#000 12%,#000 88%,transparent)}.maze-field .runner{width:14px;height:28px}.maze-field #maze-walls{opacity:.48}}
@media(max-width:360px){.journey{--maze-width:48px}.interest{gap:7px;min-height:330px}.interest h3{font-size:15px}}
@media(prefers-reduced-motion:reduce){.art-scene{--p:1!important;opacity:1}.maze-field .runner{display:none}.rat-heading{transition:none}.art-scene *{transition:none!important;animation:none!important}}

/* Detective scene: link clues, inspect a fingerprint, reveal a match. */
.scene-detective .detective-lens{transform:translate(calc(-42px + var(--p)*62px),calc(17px - var(--p)*17px))}
.scene-detective .detective-reveal{opacity:var(--p);transform:scale(calc(.65 + var(--p)*.35));transform-origin:267px 155px}

.scene-marketing .marketing-message{transform:translateY(calc(15px - var(--p)*15px));opacity:calc(.3 + var(--p)*.7)}