/* Autonomous layers: motion is driven by time, never by scroll position. */
.desktop-nav a{transition:color .25s,transform .35s cubic-bezier(.2,.8,.2,1);isolation:isolate}
.desktop-nav a:before{content:"";position:absolute;inset:9px -10px;border-radius:12px;background:linear-gradient(135deg,#ffffff42,#a9dcff24);opacity:0;transform:scale(.86);transition:opacity .3s,transform .35s;z-index:-1}
.desktop-nav a:after,.desktop-nav a[aria-current]:after,.company-page .desktop-nav a[href="#about"]:after{content:"";position:absolute;bottom:7px;left:0;right:0;height:2px;border-radius:2px;background:currentColor;box-shadow:0 0 10px #a8e5ff;transform:scaleX(0);transform-origin:left;transition:transform .38s cubic-bezier(.22,1,.36,1)}
.desktop-nav a[aria-current]:after{transform:scaleX(.45)}
.desktop-nav a:hover,.desktop-nav a:focus-visible{transform:translateY(-3px)}
.desktop-nav a:hover:before,.desktop-nav a:focus-visible:before{opacity:1;transform:scale(1)}
.desktop-nav a:hover:after,.desktop-nav a:focus-visible:after{transform:scaleX(1)}
.living-region{position:relative}.atmosphere{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:1;mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
.atmosphere-track{position:absolute;display:flex;width:200%;height:100%;left:0;bottom:0;opacity:.2;will-change:transform}
.atmosphere-track img{width:50%;height:100%;object-fit:fill;flex:none}
.atmosphere-track:nth-child(2){bottom:-28%;height:110%;opacity:.14}
.hero>.atmosphere{z-index:1;top:65%;bottom:-14%;opacity:.65}
.world-section>.atmosphere{z-index:-1;inset:-40px -20px 0;opacity:.7}
.about-card>.atmosphere{z-index:0;top:48%;opacity:.6}.about-title,.about-description{z-index:3}
.cosmic-banner>.atmosphere{z-index:0;top:26%;opacity:.48;mix-blend-mode:screen}.cosmic-copy{position:relative;z-index:4}
.download-picture,.company-home-art,.company-art{isolation:isolate}.download-picture>.atmosphere{z-index:2;top:36%;opacity:.75}
footer{position:relative;isolation:isolate;overflow:hidden}footer>.atmosphere{z-index:-1;opacity:.45}
.living-particles{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:1}.living-particles i{position:absolute;display:block;width:3px;height:3px;border-radius:50%;background:#e8faff;box-shadow:0 0 7px 2px #a9e0ff8a;will-change:transform,opacity}
.living-particles i.star{width:9px;height:9px;border-radius:0;clip-path:polygon(50% 0,60% 39%,100% 50%,60% 61%,50% 100%,39% 61%,0 50%,39% 39%);background:#fff}
.cosmic-banner .living-particles{z-index:2}.meteor{position:absolute;width:130px;height:2px;background:linear-gradient(90deg,transparent,#c7f1ff);transform:rotate(-24deg);border-radius:50%;box-shadow:0 0 6px #82dbff;opacity:0}
.scene-picture{position:relative;isolation:isolate}.scene-picture img{transform:scale(1.055)}
.scene-card .scene-picture:after{content:"";position:absolute;inset:-30%;pointer-events:none;background:linear-gradient(115deg,transparent 35%,#ffffff55 49%,transparent 63%);transform:translateX(-100%);transition:transform .75s}
.scene-card:hover .scene-picture:after,.scene-card:focus-visible .scene-picture:after{transform:translateX(100%)}
.scene-card{transition:box-shadow .35s,translate .35s}.scene-card:hover{translate:0 -5px}
.download-actions .platform-icon{width:26px;height:29px;filter:drop-shadow(0 1px 3px #0003)}
.download-actions [data-info=ios] .platform-icon{color:#84d9ff;fill:#84d9ff}
.download-actions [data-info=android] .platform-icon{color:#8ce957;fill:#8ce957}
.download-actions button{position:relative;overflow:hidden;box-shadow:0 5px 15px #164c8125}
.download-actions button:after{content:"";position:absolute;inset:-100%;background:linear-gradient(110deg,transparent 45%,#ffffff30 50%,transparent 55%);transform:translateX(-65%);transition:transform .8s}
.download-actions button:hover:after{transform:translateX(65%)}
.office-live{position:absolute;inset:0;width:100%;height:100%;display:block;pointer-events:none;z-index:0}.office-live.ready+img{visibility:hidden}
.office-apple{position:absolute;z-index:1;pointer-events:none;fill:#eaf5ff;filter:drop-shadow(0 1px 2px #0c235e66);transform:rotate(-5deg) skewX(9deg)}
.motion-switch{position:fixed;right:16px;bottom:18px;z-index:25;display:flex;align-items:center;gap:7px;min-width:44px;height:36px;padding:0 12px;border:1px solid #ffffffd9;border-radius:24px;background:#f0f8ffe8;color:#225ba1;box-shadow:0 3px 16px #22549324;backdrop-filter:blur(12px);font:12px system-ui;cursor:pointer;transition:transform .3s,box-shadow .3s}
.motion-switch:hover{transform:translateY(-2px);box-shadow:0 4px 20px #22549345}.motion-switch svg{width:14px;height:14px;fill:currentColor}
.train-motion-scene{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:hidden;z-index:1}.train-motion-scene .moving-train{transform-origin:1000px 450px}
.station-assembly .brand-flag{z-index:4}.station-assembly.train-ready>.train-badge,.station-assembly.train-ready>.station-brand-name,.station-assembly.train-ready>.train-window-light{visibility:hidden}
.station-assembly.train-ready>.station-environment{visibility:hidden}.train-clean-plate{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;z-index:0}
.station-assembly.train-ready>.sign-removal{display:none}
.station-assembly .station-platform-name{z-index:2}.train-mist{position:absolute;inset:45% -5% -4% 55%;z-index:3;pointer-events:none;background:url('assets/cloud-sea.webp') center/cover no-repeat;opacity:0;mask-image:linear-gradient(90deg,transparent,#000 30%)}
@media(max-width:700px){.motion-switch{bottom:12px;right:10px;height:34px;font-size:11px;padding:0 10px}.living-particles i:nth-child(n+12){display:none}.hero>.atmosphere{top:73%;bottom:0}.cosmic-banner>.atmosphere{top:43%;opacity:.34}.desktop-nav a:hover{transform:none}.download-actions .platform-icon{width:25px;height:28px}}
@media(prefers-reduced-motion:reduce){.desktop-nav a,.desktop-nav a:before,.desktop-nav a:after,.scene-card,.scene-card .scene-picture:after,.download-actions button:after{transition:none}.desktop-nav a:hover,.desktop-nav a:focus-visible{transform:none}.scene-card:hover{translate:none}.atmosphere-track{will-change:auto}.living-particles i{will-change:auto}}
.train-motion-scene .moving-train{transform-origin:0 0;transform-box:view-box}

/* The right walkway is behind the passing train; its flag cannot cut through the cab. */
.station-assembly.train-ready .brand-flag{z-index:1}
.train-motion-scene{z-index:2}

.train-mist{background-image:url(assets/clouds.webp);background-size:160% 140%;background-position:50% 80%;inset:40% -10% -15% 50%;mask-image:radial-gradient(ellipse at 78% 80%,#000 15%,#0009 50%,transparent 74%);filter:brightness(1.1)}

.train-mist{inset:23% -15% -20% 52%;background-size:190% 160%;background-position:60% 55%;mask-image:radial-gradient(ellipse at 88% 62%,#000 30%,#000e 53%,transparent 82%);filter:brightness(1.16) saturate(.8)}
/* Feather all four edges of the transition cloud, including narrow mobile viewports. */
.train-mist{mask-image:linear-gradient(90deg,transparent,#000 22%,#000 90%,transparent),linear-gradient(0deg,transparent,#000 18%,#000 80%,transparent),radial-gradient(ellipse at 88% 62%,#000 30%,#000e 53%,transparent 82%);mask-composite:intersect}
/* Office: dappled light drifts while the desk and laptop stay anchored. */
.office-sunrays{position:absolute;inset:-28%;pointer-events:none;z-index:1;mix-blend-mode:screen;background:linear-gradient(116deg,transparent 19%,#fff3d44a 24%,transparent 30%,transparent 39%,#fff3d438 44%,transparent 51%);filter:blur(6px);transform-origin:top left;mask-image:linear-gradient(#000,transparent 90%)}
.company-home-art .office-light,.company-art .office-light{z-index:1}
/* Translucent glass with an illuminated bevel and colored light behind it. */
.download-actions{position:relative;isolation:isolate;overflow:visible}
.download-glass-glow{position:absolute;inset:-14px -8px;z-index:-1;pointer-events:none;border-radius:32px;background:radial-gradient(ellipse at 20% 50%,#54bbef9c,transparent 60%),radial-gradient(ellipse at 84% 60%,#a6dce899,transparent 60%);filter:blur(13px)}
.download-actions button{--glass-x:28%;--glass-y:15%;isolation:isolate;border:1px solid #ffffffe0;border-radius:15px;background:linear-gradient(145deg,#ffffff96,#e8f5ff4d 44%,#b7daf74f);color:#124b7b;backdrop-filter:blur(18px) saturate(170%);-webkit-backdrop-filter:blur(18px) saturate(170%);box-shadow:inset 0 1px 0 #fff,inset 0 -1px 0 #ffffff6b,inset 1px 0 0 #ffffff8c,0 7px 19px #32699826;min-height:54px;transition:transform .3s,box-shadow .3s,background .3s,border-color .3s;text-shadow:0 1px 0 #ffffff80}
.download-actions button:before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;border-radius:inherit;background:radial-gradient(ellipse at var(--glass-x) var(--glass-y),#ffffffe0,transparent 67%);opacity:.6;transition:opacity .25s}
.download-actions button:after{inset:-100%;background:linear-gradient(110deg,transparent 43%,#ffffff80 50%,transparent 57%);pointer-events:none}
.download-actions button>span{font-weight:650}.download-actions small{color:#366589;opacity:1;font-weight:450;letter-spacing:1px}
.download-actions [data-info=ios] .platform-icon{color:#087bc7;fill:#087bc7;filter:drop-shadow(0 1px 0 #fff9)}
.download-actions [data-info=android] .platform-icon{color:#398718;fill:#398718;filter:drop-shadow(0 1px 0 #fff9)}
.download-actions button:hover,.download-actions button:focus-visible{background:linear-gradient(145deg,#ffffffbd,#e6f5ff72 44%,#c2e5ff63);border-color:#fff;box-shadow:inset 0 1px 0 #fff,inset 0 -1px 0 #ffffff8c,0 10px 25px #2a71ad33;transform:translateY(-3px)}
.download-actions button:hover:before,.download-actions button:focus-visible:before{opacity:.9}.download-actions button:active{transform:translateY(0) scale(.98)}
@media(max-width:700px){.download-actions button{border-radius:14px;min-height:54px}.office-sunrays{filter:blur(4px)}}
@media(prefers-reduced-motion:reduce){.download-actions button:hover,.download-actions button:focus-visible,.download-actions button:active{transform:none}}
/* Rail drive v2: a mesh follows the actual rail centerline, no whole-image sliding. */
.track-train-canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:2}
.station-assembly.track-drive-ready .moving-train{visibility:hidden}
.station-assembly.track-drive-ready .train-motion-scene{z-index:3}
.station-assembly .rail-train-badge{visibility:visible}
.office-apple{fill:#d2d6df;filter:none}
.download-picture{overflow:hidden;min-width:0;background:#dceeff}
.download-picture>img{width:100%;height:100%;max-width:none;object-fit:cover;object-position:right center;mask-image:linear-gradient(90deg,transparent,#000 12%);clip-path:none;image-rendering:auto;filter:none}
.download-picture>.atmosphere{opacity:.35;top:64%}
.cosmic-banner>.atmosphere{opacity:.6;top:40%}
@media(max-width:700px){.download-picture{aspect-ratio:2.5}.download-picture>img{mask-image:none}.cosmic-banner>.atmosphere{opacity:.45}.whale{left:45%;width:42%;top:9%}}
/* Fast directional flight; parked train; cloth moves independently of its mast. */
.hero .whale{left:0;top:0;height:auto;opacity:1;transform-origin:center;will-change:transform}
.whale-turner{position:relative;width:100%;transform-origin:50% 50%;will-change:transform}
.whale-body{display:block;width:100%;height:auto;max-width:none}
.whale-surface{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.flag-wind{position:absolute;pointer-events:none;max-width:none;z-index:1}
.station-assembly .flag-cloth{transform:none!important}
.station-assembly .flag-support{transform:none!important;z-index:2}
.station-assembly .brand-flag{transform:none!important}
/* Flight trail is behind the mascot and all readable copy. */
.whale-wake{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}
.hero-character .hero-friends-live{height:auto;aspect-ratio:1774/887;transform:none!important}
.cosmic-depth{position:absolute;inset:0;width:100%;height:100%;z-index:-2;pointer-events:none}
@media(min-width:701px){.about-title{width:29%}.about-description{left:31%;width:31%;padding-left:calc(24 * var(--u))}}