/* A shorter route: large demonstrations, deliberate pauses, direct controls. */
html:has(.tour-route){scroll-padding-top:calc(var(--stage-top,78px) + 12px)}
body:has(.tour-route) main>section{position:relative;scroll-margin-top:0}
body:has(.tour-route) main{padding-bottom:0}
.journey-trail.tour-route{position:fixed!important;top:auto!important;bottom:18px!important;left:50%!important;right:auto!important;transform:translateX(-50%)!important;display:flex!important;gap:3px;padding:7px;border:1px solid #899b9b66;border-radius:40px;background:#182329ee;backdrop-filter:blur(18px);z-index:80;width:max-content;max-width:calc(100vw - 150px);box-shadow:0 8px 30px #0004}
.tour-route a{display:flex!important;align-items:center;gap:6px;border:0!important;border-radius:24px!important;width:auto!important;height:auto!important;padding:10px 12px!important;font:11px var(--ui)!important;color:#c4d2d0!important;background:transparent!important;text-decoration:none}
.tour-route a span{font-size:9px;color:#cdbb99}.tour-route a b{font-weight:400}
.tour-route a[aria-current=location]{background:#d6ded5!important;color:#213338!important}.tour-route a[aria-current=location] span{color:inherit}
.tour-route a:hover{background:#ffffff16!important}.tour-route a:focus-visible{outline:2px solid #dbc6a2;outline-offset:2px}
.tour-route a:before{display:none!important}
.tour-next{position:relative;display:flex;align-items:center;justify-content:space-between;gap:30px;margin:0 6%;padding:24px 0 32px;border-top:1px solid #899e9655;text-decoration:none;color:inherit;font:13px var(--ui);z-index:2}
.tour-next>span:last-child{font-size:24px;transition:transform .4s}.tour-next:hover>span:last-child{transform:translateY(5px)}
.atelier>.tour-next,.digital-walkthrough>.tour-next,.digital-systems>.tour-next{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(transparent,#172027);color:#e4e9df;padding:20px 0}
body:has(.tour-route) .transformation-sticky{display:block;max-width:1150px}
body:has(.tour-route) .transformation-story{height:auto!important;padding:55px 0 0!important}
body:has(.tour-route) .transformation-story .signature-lab{padding:26px;box-shadow:0 30px 80px #21383e24}
body:has(.tour-route) .transformation-story .signature-lab .lab-heading h2{font-size:clamp(38px,5vw,64px)}
body:has(.tour-route) .transformation-story .redesign-intro{font-size:20px;margin:10px 0 24px}
body:has(.tour-route) .transformation-story .redesign-comparison{height:430px}
body:has(.tour-route) .transformation-story .arrival-scene{height:335px}
body:has(.tour-route) .transformation-story .comparison-note{margin:12px 0}.tour-route~* .lab-sample{display:none}
body:has(.tour-route) .design-playground.tour-studio{padding:0}
.tour-studio>.continuum-stage{position:relative!important;top:auto!important;height:auto!important;overflow:visible!important;padding:75px 0!important}
.tour-studio .playground-grid{display:grid!important;grid-template-columns:.75fr 1.25fr;align-items:center;gap:5%}
.tour-studio .playground-result{width:100%;min-width:0}.tour-studio .playground-copy h2{font-size:clamp(36px,4vw,58px)}
.tour-studio .playground-copy>p:not(.eyebrow){font-size:19px;line-height:1.5}
.tour-studio .sequence-track,.tour-services .sequence-track{display:none}
.tour-studio .play-preview{transform:perspective(1500px) rotateY(var(--tour-turn,0deg));transition:box-shadow .5s;box-shadow:0 30px 65px #25494540}
.tour-studio .play-site{padding:22px}.tour-studio .play-type h3{font-size:clamp(26px,3vw,43px)}
.tour-studio .play-composition{min-height:260px}.tour-studio .play-art img{height:270px}
body:has(.tour-route) .home-services.tour-services{display:block;width:100%;max-width:none;padding:0}
.tour-services>.continuum-stage{position:relative!important;top:auto!important;height:auto!important;overflow:visible!important;display:grid;grid-template-columns:.75fr 1.25fr;grid-template-rows:auto auto auto;gap:24px 6%;padding:75px 6%}
.tour-services>.continuum-stage>div:first-child{grid-column:1;grid-row:1}
.tour-services .service-machine{grid-column:2;grid-row:1/4;min-width:0}
.tour-services .intro-text{font-size:19px!important;line-height:1.5}.tour-services h2{font-size:clamp(36px,4vw,54px)!important}
.tour-service-controls{grid-column:1;grid-row:2;display:grid;gap:8px;align-self:start}
.tour-service-controls button{display:flex;align-items:center;gap:16px;text-align:left;padding:18px 14px;border:1px solid #81999855;background:#1e2d32;color:#e3e7df;font:22px var(--display,serif);cursor:pointer;border-radius:6px;transition:background .35s,transform .35s}
.tour-service-controls button span{font:11px var(--ui);color:#cbb996}.tour-service-controls button span:last-child{margin-left:auto}
.tour-service-controls button[aria-pressed=true]{background:#354b50;border-color:#b6cdc7;transform:translateX(7px)}
.tour-service-details{grid-column:1;grid-row:3;justify-self:start;align-self:start}
.tour-services .machine-scene{display:none;opacity:1!important;transform:none!important}.tour-services .machine-scene.machine-active{display:block}
.tour-services .machine-scenes{min-height:360px;height:32vw;max-height:480px}.tour-services .machine-scene{position:absolute;inset:0;min-height:0}
.tour-services{--service-local:1}.tour-services .machine-browser{transform:none!important;opacity:1!important}
body:has(.tour-route) .tour-contact{padding:70px 0 110px;clip-path:none!important;transform:none!important;background:linear-gradient(180deg,#1b2228 0%,#172027 45%,#152027 100%);isolation:isolate;--closing-arrival:1}
.tour-contact-grid{display:grid;grid-template-columns:1.15fr 1fr;gap:8%;align-items:center}.tour-contact-image{position:relative;min-width:0;border:1px solid #b0c6bd66;border-radius:10px;overflow:hidden}
.tour-contact-image img{width:100%;height:430px;object-fit:cover;object-position:50% 77%;display:block}
.tour-contact-image>span{position:absolute;bottom:0;left:0;right:0;padding:22px;color:#f5f1e7;background:linear-gradient(transparent,#142027e8);font:14px var(--ui)}
body:has(.tour-route) .tour-contact h2{font-size:clamp(40px,4.4vw,60px);line-height:1.05}.tour-contact p:not(.eyebrow){font-size:20px;line-height:1.5;margin-block:22px}.tour-contact .text-link{display:flex;width:max-content;max-width:100%;margin-top:20px;font-size:17px}
body:has(.tour-route) .footer{padding-bottom:100px}
/* A continuous exit from the screen demonstration into a concise enquiry. */
#digital-systems:after{content:'';position:absolute;left:0;right:0;bottom:0;height:90px;background:linear-gradient(transparent,#1b2228);pointer-events:none;z-index:1}
.tour-contact .tour-contact-image{transform:translateY(calc((1 - var(--closing-arrival))*36px));box-shadow:0 25px 65px #07121744}
.tour-contact .tour-contact-copy{transform:translateY(calc((1 - var(--closing-arrival))*22px));min-width:0}
.tour-contact .tour-contact-image img{transform:scale(calc(1.035 - var(--closing-arrival)*.035));transform-origin:center}
.tour-contact .enquiry-link{margin-top:24px;display:inline-flex;justify-content:space-between;gap:24px;align-items:center;min-height:48px;font:14px var(--ui)}
.motion-disabled .tour-contact :is(.tour-contact-image,.tour-contact-copy,.tour-contact-image img){transform:none}
@media(prefers-reduced-motion:reduce){.tour-contact :is(.tour-contact-image,.tour-contact-copy,.tour-contact-image img){transform:none}}
@media(max-width:1000px){
 .tour-studio .playground-grid,.tour-services>.continuum-stage{grid-template-columns:1fr}
 .tour-studio>.continuum-stage{padding:45px 0!important}.tour-studio .playground-copy{max-width:650px}.tour-studio #playground-controls{display:flex;flex-wrap:wrap;gap:18px;margin-top:20px}.tour-studio fieldset{margin:0}.tour-studio .play-actions{margin:0}
 .tour-studio .playground-result{max-width:850px}.tour-studio .play-composition{min-height:230px}.tour-studio .play-art img{height:240px}
 .tour-services .service-machine{grid-column:1;grid-row:3}.tour-service-controls{display:flex;grid-row:2}.tour-service-controls button{flex:1;font-size:18px;gap:8px;padding:12px}.tour-service-controls button span:last-child{display:none}.tour-service-controls button[aria-pressed=true]{transform:translateY(-3px)}
 .tour-service-details{grid-row:4}.tour-services .machine-scenes{height:55vw;min-height:340px}.tour-services>.continuum-stage{padding:55px 6%;gap:24px}
 .tour-route a{padding:10px 8px!important}.tour-route a span{display:none}
 .tour-contact-grid{grid-template-columns:1fr;gap:35px}.tour-contact-image img{height:300px}
}
@media(max-width:600px){
 .tour-studio .playground-grid{gap:18px}.tour-studio .playground-copy{display:contents}.tour-studio .playground-copy>.eyebrow{grid-row:1;margin:0}.tour-studio .playground-copy>h2{grid-row:2;margin:0}.tour-studio .playground-copy>p:not(.eyebrow){grid-row:3;margin:0}.tour-studio .playground-result{grid-row:5}.tour-studio #playground-controls{grid-row:4;margin-top:0;gap:12px}.tour-studio #playground-controls fieldset{margin:0}.tour-studio #playground-controls legend{font-size:12px;margin-bottom:6px}.tour-studio #playground-controls button{font-size:13px;padding:7px 10px;min-height:36px}.tour-studio .play-actions{display:none}.tour-studio .play-result-caption{display:block}.tour-studio .play-result-caption .text-link{margin-top:10px}.tour-studio .play-note{margin-top:12px}
 .journey-trail.tour-route{left:12px!important;right:12px!important;transform:none!important;max-width:none;width:auto;bottom:12px!important;padding:5px;justify-content:space-between}.tour-route a{padding:10px 7px!important;font-size:10px!important}
 body:has(.tour-route) .motion-toggle{bottom:70px!important}
 body:has(.tour-route) .transformation-story .signature-lab{padding:12px}body:has(.tour-route) .transformation-story .redesign-comparison{height:365px}body:has(.tour-route) .transformation-story .arrival-scene{height:273px}
 .tour-studio .play-site{padding:14px}.tour-studio .play-art img{height:190px}.tour-studio .play-composition{min-height:200px}.tour-studio .play-type h3{font-size:27px}
 .tour-service-controls button{font-size:16px;display:block;text-align:left}.tour-service-controls button span{display:block;margin-bottom:9px}.tour-service-controls button span:last-child{display:none}
 .tour-services .machine-scenes{min-height:440px}.tour-services .machine-scene{padding:16px}.tour-services .machine-redesign{height:350px}.tour-services .machine-caption{bottom:12px;font-size:10px}.tour-contact-image img{height:240px}
}
@media(prefers-reduced-motion:reduce){.tour-studio .play-preview{transform:none!important}.tour-service-controls button{transition:none}.tour-next>span:last-child{transition:none}}
/* Phone browser toolbars reduce the visible height. Fit the same scroll
   sequences into that space instead of replacing them with static content. */
@media(max-width:999px) and (min-height:480px) and (max-height:799px){
 .atelier-live .digital-studio .atelier-stage{height:calc(100svh - var(--stage-top,70px));min-height:0;top:var(--stage-top,70px)}
 .atelier-live .digital-studio .atelier-intro{position:absolute!important;top:4%!important;padding:0;left:6%;width:88%}
 .atelier-live .digital-studio .atelier-intro h1{font-size:clamp(32px,8.6vw,48px);margin:12px 0;line-height:1}
 .atelier-live .digital-studio .atelier-description{font-size:15px;line-height:1.35}
 .atelier-live .digital-studio .atelier-intro .eyebrow{font-size:10px}
 .atelier-live .digital-studio .atelier-actions{margin-top:14px;gap:10px}
 .atelier-live .digital-studio .atelier-actions :is(.button,.text-link){font-size:12px;padding:9px 10px}
 .atelier-live .digital-studio .design-object{display:block;top:calc(55% - var(--assembly,0)*18%);left:5%;right:auto;width:90%;height:28%;min-height:0}
 .atelier-live .digital-studio .atelier-arrival{top:5%}.atelier-live .digital-studio .atelier-arrival>p{font-size:32px;margin-top:10px}
 .atelier-live .digital-studio .atelier-bottom{bottom:66px;font-size:11px}.atelier-live .digital-studio .atelier-bottom .scroll-circle{width:28px;height:28px;font-size:18px}
 .atelier-live .walk-live .worlds-stage{top:var(--stage-top,70px);height:calc(100svh - var(--stage-top,70px));padding:12px 5% 65px}
 .walk-live .worlds-heading{padding-bottom:6px}.walk-live .worlds-heading .eyebrow,.walk-live .worlds-bottom>p,.walk-live .scene-editorial .eyebrow{display:none}
 body:has(.digital-evolution) .walk-live .worlds-heading h2{font-size:27px}
 .walk-live .walk-instruction{padding:5px 0}.atelier-live .walk-live .worlds-track{margin:4px 0;min-height:0}
 .atelier-live .walk-live .work-scene{inset:0 2%;gap:8px;padding:0}
 .walk-live .scene-editorial{padding:6px 10px}.walk-live .scene-editorial .text-link{font-size:11px;min-height:24px}
 body:has(.digital-evolution) .walk-live .scene-editorial h3{font-size:20px;margin:4px 0}
 .atelier-live .walk-live .scene-site{min-height:145px}.atelier-live .walk-live .scene-canvas{min-height:85px}
 .walk-live .scene-site-copy>span:first-child,.walk-live .scene-foot{display:none}
 body:has(.digital-evolution) .walk-live .scene-site-copy>p{font-size:24px}
 .walk-live .worlds-bottom{padding:6px 0 0!important}.walk-live .worlds-stops button{min-height:34px;padding:6px 5px!important}
 .systems-scroll .systems-stage{padding:12px 6% 70px;gap:10px;justify-content:flex-start}
 .systems-scroll .systems-intro{display:block;flex:none}.systems-scroll .systems-intro .eyebrow{font-size:10px}
 .systems-scroll .systems-intro h2{font-size:27px;margin:6px 0}
 .systems-scroll .systems-intro>p:not(.eyebrow){font-size:12px;line-height:1.35;max-width:none}
 .systems-scroll .device-controls{margin-top:8px;gap:6px}.systems-scroll .device-controls button{padding:6px 10px;min-height:32px}
 .systems-scroll .systems-intro #device-status{font-size:9px;margin-top:6px;min-height:0}
 .systems-scroll .device-stage{flex:1;min-height:0;justify-content:center}
 .systems-scroll .responsive-device{max-width:520px;padding:5px}
 .systems-scroll .responsive-device[data-device=tablet]{width:82%}
 .systems-scroll .responsive-device[data-device=mobile]{width:65%;min-width:185px}
 .systems-scroll .responsive-chrome{padding:5px 6px;font-size:7px}
 .systems-scroll .responsive-site{padding:8px 5%}.systems-scroll .responsive-nav{padding-bottom:5px}
 .systems-scroll .responsive-nav b{font-size:20px}.systems-scroll .responsive-nav>span{font-size:6px}
 .systems-scroll body:has(.digital-evolution) .responsive-site .responsive-hero{height:120px;min-height:120px;padding:8px 0;gap:6px}
 .systems-scroll body:has(.digital-evolution) .responsive-site .responsive-hero h3{font-size:21px;margin:5px 0}
 .systems-scroll .responsive-hero p{font-size:7px;line-height:1.3}.systems-scroll .ui-kicker{font-size:6px}
 .systems-scroll .responsive-projects>div:first-child{display:flex!important;align-items:center;padding-top:6px;margin-bottom:5px}
 .systems-scroll .responsive-projects h4{font-size:7px;margin:0}.systems-scroll .responsive-projects button{font-size:7px;padding:3px 5px;min-height:24px}
 .systems-scroll .mini-art{height:35px}.systems-scroll .mini-projects article>span{font-size:6px;margin-top:4px}
 .systems-scroll .systems-caption{font-size:8px;margin-top:6px}
}
@media(max-width:999px) and (min-height:480px) and (max-height:579px){
 .systems-scroll .systems-intro>.eyebrow,.systems-scroll .systems-intro>p:not([id]),.systems-scroll .systems-caption{display:none}
 .systems-scroll .systems-intro h2{font-size:24px}.systems-scroll .systems-stage{gap:6px}
 .atelier-live .digital-studio .atelier-description{font-size:12px}.atelier-live .digital-studio .atelier-intro h1{font-size:30px}
}
/* Closing scene: an opaque website lifts out of the workspace as you scroll. */
.tour-contact .closing-scene{--scene-progress:1;--scene-x:0deg;--scene-y:0deg;height:440px;background:#1c2b30;perspective:1100px;isolation:isolate}
.tour-contact .closing-scene .closing-workspace{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 72%;transform:scale(calc(1.16 - var(--scene-progress)*.16));filter:brightness(calc(1 - var(--scene-progress)*.5));will-change:transform}
.closing-shade{position:absolute;inset:0;background:linear-gradient(180deg,#15262b22,#15262b05 45%,#142027e8)}
.closing-orbit{position:absolute;width:90%;height:62%;left:5%;top:15%;border:1px solid #e4c89766;border-radius:50%;transform:rotate(-24deg) scale(calc(.45 + var(--scene-progress)*.55));box-shadow:0 0 60px #d7bd9415}
.closing-window{position:absolute;left:8%;top:17%;width:84%;overflow:hidden;border:1px solid #dbe3d3bb;border-radius:9px;background:#edf0e9;box-shadow:0 32px 65px #06121599,0 1px 0 #fff9 inset;transform-origin:75% 65%;transform:translate3d(calc((1 - var(--scene-progress))*36%),calc((1 - var(--scene-progress))*48%),0) scale(calc(.16 + var(--scene-progress)*.84)) rotateX(calc((1 - var(--scene-progress))*24deg + var(--scene-y))) rotateY(calc((1 - var(--scene-progress))*-25deg + var(--scene-x))) rotateZ(calc(-4deg * var(--scene-progress)));transition:box-shadow .3s;will-change:transform}
.closing-chrome{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 14px;background:#e5eae3;color:#365057;font:10px var(--ui);border-bottom:1px solid #a9b6ae}
.closing-chrome>span:first-child{letter-spacing:3px}
.tour-contact .closing-window img{display:block;width:100%;height:auto;aspect-ratio:1.65;object-fit:cover;object-position:top;transform:none;border:0}
.closing-window-foot{display:flex;justify-content:space-between;padding:12px 14px;color:#30484b;font:10px var(--ui);border-top:1px solid #b5c2b7}
.closing-scene-bottom{position:absolute;bottom:18px;left:20px;right:20px;display:flex;align-items:center;justify-content:space-between;gap:16px;color:#f0ede2;font:12px/1.4 var(--ui);z-index:2}
.closing-replay{min-height:44px;padding:8px 12px;border:1px solid #b7c6bc88;border-radius:25px;background:#162930d9;color:#efe8d7;font:11px var(--ui);cursor:pointer;flex-shrink:0}
.closing-replay:hover{background:#365057}.closing-replay:focus-visible{outline:2px solid #e0c293;outline-offset:4px}
.closing-replay[hidden]{display:none}
@media(min-width:601px) and (max-width:1000px){.tour-contact .closing-scene{height:430px}.closing-window{width:68%;left:16%;top:10%}}
@media(max-width:600px){.tour-contact .closing-scene{height:320px}.closing-window{top:19%;left:5%;width:90%}.closing-chrome{padding:8px 10px;font-size:8px}.closing-window-foot{font-size:8px;padding:9px 10px}.closing-scene-bottom{left:14px;right:14px;bottom:12px;font-size:10px;gap:8px}.closing-replay{font-size:10px;padding:8px 10px}}
.motion-disabled .closing-scene{--scene-progress:1!important;--scene-x:0deg!important;--scene-y:0deg!important}
@media(prefers-reduced-motion:reduce){.closing-scene{--scene-progress:1!important;--scene-x:0deg!important;--scene-y:0deg!important}}
.closing-window{container-type:inline-size}
.closing-design{position:relative;height:43cqw;padding:5cqw;background:radial-gradient(ellipse at 90% 70%,#adc3bd,#e9ece2 65%);color:#243b40}
.closing-brand{font:5cqw/1 var(--display,serif);letter-spacing:-.04em}.closing-brand>span{font-size:2cqw;vertical-align:top}
.closing-design-copy{position:absolute;left:5cqw;top:16cqw;width:56%;z-index:1}
.closing-design-copy>span{font:1.5cqw var(--ui);letter-spacing:.05em;display:block}
.closing-design-copy>strong{display:block;font:7cqw/.98 var(--display,serif);letter-spacing:-.025em;margin:2cqw 0}
.closing-design-copy>i{display:block;font:2cqw var(--ui);font-style:normal;margin-top:3cqw}
.tour-contact .closing-window .closing-art{position:absolute;right:3%;top:13%;width:40%;height:80%;object-fit:contain;aspect-ratio:auto;transform:rotate(calc(-18deg + var(--scene-progress)*18deg));filter:drop-shadow(0 12px 15px #1a343a44)}
@media(max-width:600px){.tour-contact .closing-scene{height:clamp(320px,80vw,470px)}.closing-window{top:15%}}
@media(min-width:1001px){.closing-window{top:8%}}
@media(min-width:601px) and (max-width:1000px){.closing-window{top:5%}}