/* The scene is built from the studio's film stills. Pixels, light and camera
   movement share the same input, so they behave like one cinematic space. */
:root{--pointer-x:65%;--pointer-y:45%;--camera-x:0px;--camera-y:0px;--camera-roll:0deg;--hero-lift:0px;--scene-rgb:116,192,225;--ambient-rgb:45,101,132;--ambient-x:70%;--ambient-y:35%;--reading-progress:0;--hero-progress:0}
body{background:#060d13}
main,.footer{position:relative;z-index:1}
.ambient-scene{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none;background:radial-gradient(ellipse at 75% 10%,rgba(var(--ambient-rgb),.19),transparent 60%),#060d13}
.ambient-wash{position:absolute;inset:-15%;background:radial-gradient(ellipse at var(--ambient-x) var(--ambient-y),rgba(var(--ambient-rgb),.23),transparent 55%),radial-gradient(ellipse at 10% 90%,#4c50721c,transparent 50%);transition:background .3s;mix-blend-mode:screen}
#ambient-pixels{position:absolute;inset:0;width:100%;height:100%;opacity:.6}
.reading-progress{height:1px;position:fixed;top:0;left:0;right:0;z-index:100;pointer-events:none}
.reading-progress>span{display:block;width:100%;height:100%;background:#b8dce8;transform:scaleX(var(--reading-progress));transform-origin:left;box-shadow:0 0 9px #b8dce8aa}
.header{position:fixed;transition:height .4s,background .4s,border-color .4s}
.header.is-scrolled{height:75px;background:#07121bd9;backdrop-filter:blur(22px);border-bottom-color:#ffffff14}
.header.is-scrolled .brand-symbol{width:33px;height:33px}
.header.is-scrolled .wordmark{font-size:23px}
.header.is-scrolled .wordmark>span{font-size:9px}
.hero{isolation:isolate;min-height:800px;overflow:clip}
.hero-visual{inset:-6%;transform:translate3d(var(--camera-x),calc(var(--camera-y) + var(--hero-lift)),0) rotate(var(--camera-roll));will-change:transform;overflow:hidden}
.hero-visual>img{animation:scene-breathe 24s ease-in-out infinite alternate;opacity:.69;transition:opacity 1.2s,filter 1.2s;filter:saturate(.8) contrast(1.1)}
.hero-visual>img.changing{opacity:0}
.hero-shade{background:linear-gradient(90deg,#040e17f0 0%,#040e17bd 24%,#040e1738 58%,#040e170c 80%),linear-gradient(0deg,#060d13 2%,#060d1366 24%,transparent 62%,#060d1340)}
.hero-light{position:absolute;z-index:1;inset:-12%;pointer-events:none;background:radial-gradient(ellipse 25% 38% at var(--pointer-x) var(--pointer-y),rgba(var(--scene-rgb),.17),transparent 75%);mix-blend-mode:screen;opacity:1;transform:translate3d(0,calc(var(--hero-lift) * .25),0)}
.hero-mesh{position:absolute;z-index:1;inset:0;pointer-events:none;background-image:linear-gradient(#8bc7df0c 1px,transparent 1px),linear-gradient(90deg,#8bc7df0c 1px,transparent 1px);background-size:72px 72px;mask-image:radial-gradient(ellipse 42% 50% at 77% 47%,#000,transparent 85%);opacity:.65;transform:translate3d(calc(var(--camera-x) * -.4),calc(var(--camera-y) * -.4),0)}
.hero-pixels{position:absolute;inset:0;width:100%;height:100%;z-index:2;pointer-events:none;mix-blend-mode:screen}
.hero-top,.hero-content,.hero-bottom{z-index:4}
.hero-top .eyebrow{font-size:13px;letter-spacing:2.2px}
.hero h1{font-size:clamp(80px,8.1vw,140px);font-weight:500;letter-spacing:-6px;line-height:1.02;text-shadow:0 2px 35px #04101924}
.hero h1>em{font-size:1.24em;line-height:1.02;letter-spacing:-3px;color:#dbeaf0}
.hero-description p{font-size:16px;color:#d0dde4;opacity:.88;line-height:2.1}
.hero-content{transform:translate3d(0,calc(var(--hero-lift) * -.12),0)}
.hero .button-light{border-radius:0;min-height:55px;padding:0 27px;background:#e4edef;position:relative;overflow:hidden;box-shadow:0 8px 32px #00000020}
.hero .button-light:before{content:'';position:absolute;inset:0;background:#b4d7df;transform:translateX(-101%);transition:transform .5s cubic-bezier(.25,.7,.2,1)}
.hero .button-light:hover:before{transform:none}
.hero .button-light>span{position:relative;z-index:1}
.hero-caption{padding:0 0 2px 24px;border-left:1px solid #b9dfeb55}
.hero-caption>span:last-child{font-family:var(--display);font-size:15px}
.hero-side-label{z-index:4;opacity:.55}
.scene-tools{position:absolute;right:5.55vw;top:190px;z-index:5;display:flex;align-items:center;gap:22px}
.scene-invitation{font-size:11px;letter-spacing:.5px;color:#c6d9e0;display:flex;align-items:center;gap:10px;opacity:.75}
.pointer-glyph{width:22px;height:22px;border:1px solid #b4d7e14a;border-radius:50%;display:grid;place-items:center;font-size:15px;animation:pointer-invitation 3s ease-in-out infinite}
.scene-mode{display:flex;border:1px solid #c0d9e537;background:#0817215c;padding:4px;backdrop-filter:blur(12px)}
.scene-mode button{padding:7px 13px;font-size:13px;color:#a5bbc6;transition:color .3s,background .3s}
.scene-mode button.is-active{background:#d8edf021;color:#e9f5f8}
.hero.pixel-view .hero-visual>img{opacity:.07;filter:saturate(.45)}
.hero.pixel-view .hero-light{opacity:.6}
.hero.pixel-view .hero-mesh{opacity:1}
.hero.pixel-view .hero-shade{background:linear-gradient(90deg,#040e17f0,#040e1720 70%),linear-gradient(0deg,#060d13,transparent 55%)}
.hero-controls{gap:13px}
.hero .slide-dot{min-width:33px;position:relative}
.hero .slide-dot:before{content:'';position:absolute;inset:-9px -3px}
.motion-toggle{width:36px;height:36px;border-color:#b6d9e14d;font-size:13px}
.studio,.work,.team{background:transparent}
.studio .statement{font-size:clamp(36px,4vw,61px);line-height:1.5}
.studio-copy>p,.technology-intro>p{font-size:17px;line-height:2.2}
.work .film-image{transform-style:preserve-3d;will-change:transform;transition:transform .55s cubic-bezier(.22,.61,.36,1);background:#10222c}
.film-card{perspective:1000px}
.film-card:hover .film-image{transform:perspective(1100px) rotateX(var(--card-rx,0deg)) rotateY(var(--card-ry,0deg))}
.film-card .film-image:before{content:'';position:absolute;inset:0;z-index:2;pointer-events:none;background:radial-gradient(ellipse at var(--card-x,50%) var(--card-y,50%),#c3edf31a,transparent 65%);opacity:0;transition:opacity .4s}
.film-card:hover .film-image:before{opacity:1}
.film-cursor{position:absolute;z-index:3;left:var(--card-x,50%);top:var(--card-y,50%);width:62px;height:62px;border:1px solid #d0e9ef99;border-radius:50%;display:grid;place-items:center;background:#0b202b40;backdrop-filter:blur(5px);transform:translate(-50%,-50%) scale(.5);font-size:23px;opacity:0;transition:opacity .3s,transform .3s;pointer-events:none}
@media(hover:hover) and (pointer:fine){.film-card:hover .film-cursor{opacity:1;transform:translate(-50%,-50%) scale(1)}.film-card:hover .film-open{opacity:0}}
.network{background:#e9efec;position:relative;overflow:hidden}
.network:before{content:'';position:absolute;inset:0;pointer-events:none;opacity:.28;background-image:radial-gradient(#395e4d38 .7px,transparent .7px);background-size:14px 14px;mask-image:linear-gradient(90deg,#000,transparent 57%)}
.network>*{position:relative}
.orbit-visual{transform:perspective(900px) rotateX(var(--orbit-rx,0deg)) rotateY(var(--orbit-ry,0deg));transition:transform .6s ease}
.orbit-orbit.one{animation:orbit-turn-one 38s linear infinite}
.orbit-orbit.two{animation:orbit-turn-two 45s linear infinite}
.orbit-orbit.three{animation:orbit-turn-three 65s linear infinite}
.orbit-orbit.one:after,.orbit-orbit.two:after{content:'';position:absolute;left:48%;top:-3px;width:5px;height:5px;background:#668f7b;border-radius:50%;box-shadow:0 0 0 4px #668f7b12}
.orbit-label{transition:color .35s,background .35s}
.orbit-visual[data-company="kuiper"] .label-creative,.orbit-visual[data-company="tech"] .label-technology,.orbit-visual[data-company="xinghe"] .label-asia,.orbit-visual[data-company="eagle"] .label-america{color:#214e3b;background:#dce9e1}
.company-tab{transition:padding .35s,background .35s}
.company-panel{animation:company-arrival .4s ease}
.technology{background:#0d1921ab;position:relative;overflow:hidden}
.technology:before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 0 60%,#317d9120,transparent 60%);pointer-events:none}
.technology>*{position:relative}
.tech-image{height:225px}
.tech-image:before{content:'';position:absolute;inset:0;z-index:2;background:linear-gradient(90deg,transparent 49%,#dcfff632 50%,transparent 51%);background-size:17px 100%;mask-image:linear-gradient(0deg,#000,transparent 80%);opacity:.5}
.contact-background{height:115%;top:-7%;transform:translate3d(0,var(--contact-shift,0px),0);will-change:transform}
.motion-paused .hero-visual>img,.motion-paused .orbit-orbit,.motion-paused .pointer-glyph{animation-play-state:paused!important}
@keyframes scene-breathe{from{transform:scale(1.02)}to{transform:scale(1.065) translateX(-.7%)}}
@keyframes pointer-invitation{0%,100%{transform:translate(0,0)}50%{transform:translate(3px,-3px)}}
@keyframes orbit-turn-one{from{transform:rotate(-38deg)}to{transform:rotate(322deg)}}
@keyframes orbit-turn-two{from{transform:rotate(-38deg)}to{transform:rotate(-398deg)}}
@keyframes orbit-turn-three{from{transform:rotate(0)}to{transform:rotate(360deg)}}
@keyframes company-arrival{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@media(min-width:1650px){.hero h1{font-size:145px}}
@media(max-width:1000px){.hero{min-height:760px}.hero h1{font-size:10vw}.scene-tools{top:180px}.scene-invitation{display:none}.studio-copy>p,.technology-intro>p{font-size:16px}}
@media(max-width:760px){.header.is-scrolled{height:70px}.header.is-scrolled .brand-symbol{width:30px;height:30px}.header.is-scrolled .wordmark{font-size:22px}.header.is-scrolled .wordmark>span{font-size:9px}.header.is-scrolled .mobile-nav{top:69px}.hero{min-height:740px}.hero-visual{inset:-8%}.hero-visual>img{opacity:.65}.hero-shade{background:linear-gradient(90deg,#06131bc9,#06131b10),linear-gradient(0deg,#060d13,#06131b10 55%,#06131b33)}.hero-top .eyebrow{font-size:9px;letter-spacing:1.5px}.hero h1{font-size:clamp(47px,14.7vw,82px);letter-spacing:-3.7px;line-height:1.06}.hero h1>em{font-size:1.27em;letter-spacing:-2.5px;line-height:1.02}.hero-description p{font-size:14px}.hero-content{padding-bottom:65px}.hero-caption{padding-left:0;border:0;margin-left:7px}.hero-caption>span:last-child{font-size:10px}.hero .slide-dot{min-width:18px}.hero-controls{gap:7px}.motion-toggle{width:30px;height:30px;font-size:11px}.hero .button-light{min-height:49px;padding:0 21px}.scene-tools{right:6vw;top:108px}.scene-mode{padding:3px}.scene-mode button{font-size:10px;padding:6px 9px}.hero-mesh{background-size:45px 45px;opacity:.45}.hero-pixels{opacity:.85}.studio .statement{font-size:36px}.studio-copy>p,.technology-intro>p{font-size:15px}.film-cursor{display:none}.tech-image{height:185px}}
@media(max-width:360px){.stats{column-gap:10px}.stats>div+div{padding-left:10px}.stat-value{font-size:32px}.stat-value>span{font-size:22px}}
@media(prefers-reduced-motion:reduce){.hero-visual,.hero-content,.hero-light,.hero-mesh,.contact-background{transform:none!important;will-change:auto}.hero-visual>img,.orbit-orbit,.pointer-glyph{animation:none!important}.hero-pixels,#ambient-pixels{opacity:.55}.scene-invitation{display:none}.film-card:hover .film-image{transform:none}.ambient-wash{transition:none}.orbit-visual{transform:none}}