html{scroll-behavior:smooth;scroll-padding-top:0}body{overflow-x:hidden}.app-header{height:72px;position:fixed;top:0;left:0;right:0;z-index:40;border:0;background:#faf7f0e8;backdrop-filter:blur(14px)}.header-inner{max-width:1200px;width:100%;height:100%;margin:auto;padding:0 30px;display:flex;align-items:center;justify-content:space-between;gap:16px;border-bottom:1px solid #dedfd04d}.hero-view{height:100svh;min-height:620px;padding-top:72px;display:flex;flex-direction:column;position:relative;overflow:hidden}.intro{flex:0 0 auto;padding:19px 20px 5px}.intro h1{font-size:clamp(25px,3.1vh,35px);margin:7px 0 4px}.intro p{font-size:11px}.scene-wrap{flex:1;min-height:0;padding:0;position:relative;overflow:visible}.scene{width:1100px!important;height:740px!important;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) scale(var(--scene-scale,1));transform-origin:center}.hero-controls{height:55px;flex:0 0 55px;max-width:1180px;width:100%;margin:auto;padding:5px 30px 12px;display:flex;justify-content:space-between;align-items:center;gap:18px;font-size:11px;color:#73806d}.hero-controls>div{display:flex;gap:17px}#hover-note{line-height:1.8}.hero-view>.mobile-services,.hero-view>.mobile-hint{display:none}.monitor-rear{display:none!important}
/* One contemporary, thin-bezel display. */
.monitor-position{width:376px;height:260px}.monitor-frame{border-radius:20px;border:1.5px solid #c4c69b;background:linear-gradient(140deg,#354a3e,#071d17 55%,#32473b);box-shadow:inset 0 0 0 2px #516959,inset 0 0 0 5px #102c21,4px 3px 0 #8e9c76,12px 17px 25px -13px #163a2a91}.monitor-screen{inset:9px;border-radius:12px;background:radial-gradient(ellipse at 65% 0%,#126045,#032e22 78%);padding:18px}.screen-head{font-size:17px;margin-bottom:12px}.screen-body{height:162px;grid-template-columns:88px 1fr;gap:13px}.screen-nav span{padding:8px 7px}.monitor-screen:before{height:155px;background:linear-gradient(155deg,#d7fff121,transparent 65%);top:-55px}.monitor-frame:after{content:"GreenOrRed";position:absolute;bottom:1px;left:50%;transform:translateX(-50%);font:4px Arial;color:#b7c5a1;letter-spacing:.8px}.monitor-stand{left:44%;right:41%;height:52px;background:linear-gradient(90deg,#243d2f,#6d8768 43%,#213e2e);border-color:#a5b18a}.monitor-stand:after{width:145px;height:13px;bottom:-7px;background:linear-gradient(#a3b58b,#4e6b49);box-shadow:0 4px 0 #9caa7d,2px 7px 10px #28452b40}.monitor-aura{inset:-35px}.sample-caption{display:none}.platform{top:calc(51% + 162px);height:145px;filter:drop-shadow(12px 13px 12px #6e75522d)}.tier-top{width:540px;height:88px;top:0;border-radius:50% / 28px;background:linear-gradient(90deg,#e3dac4,#faf6e9 22%,#f1e8d5 68%,#cfc4a8);box-shadow:inset 0 -3px 2px #d2c8b2}.tier-top i{height:54px;background:radial-gradient(ellipse at 38% 34%,#fffef7,#f3ecdd 73%,#d9cfb9)}.tier-middle,.tier-bottom{border-radius:16px;clip-path:polygon(9% 0,91% 0,100% 30%,100% 78%,92% 100%,8% 100%,0 78%,0 30%);background:linear-gradient(#f9f5eb 30%,#e6dcc8 31%,#e8dfcc 82%,#cfc6ae)}.tier-middle{width:700px;top:65px;height:61px}.tier-bottom{width:838px;top:96px;height:61px;box-shadow:none}.tier-middle i,.tier-bottom i{border-radius:0;height:38px;clip-path:polygon(10% 0,90% 0,100% 64%,91% 100%,9% 100%,0 64%);background:linear-gradient(110deg,#fffdf6,#f4eddf 75%,#e8ddc7)}.contact-shadow{top:11px;left:40%;right:29%;height:14px;filter:blur(6px);background:#21452b66}.platform-glow{top:47px;height:24px;left:7%;right:7%;border-bottom:3px solid #99d399b3;filter:blur(1px)}
/* Strong, continuous optical cable, distinct from orbital wires. */
.optical-link{position:absolute;inset:0;width:100%;height:100%;z-index:15;pointer-events:none;overflow:visible}#fiber-group{transition:opacity .35s}.optical-link path{fill:none;stroke-linecap:round}.fiber-halo{stroke:#63efb2;stroke-width:12;opacity:.42;filter:url(#fiber-glow)}.fiber-shell{stroke:#2b7a55;stroke-width:5.8}.fiber-core{stroke:#a9ffd2;stroke-width:2.8}.fiber-pulse{stroke:#fffde9;stroke-width:5;stroke-dasharray:28 972;animation:fiber-flow 1.8s linear infinite;filter:drop-shadow(0 0 3px #c8ffdb)}.fiber-pulse.second{animation-delay:-.9s;stroke-width:3.7}#fiber-source,#fiber-target{fill:#d9ffe5;stroke:#136a42;stroke-width:1.4}#fiber-arrival{fill:none;stroke:#aeffd6;stroke-width:1.5;opacity:.65;animation:arrival 1.8s ease-out infinite}.motion-off .fiber-pulse,.motion-off #fiber-arrival{animation-play-state:paused!important}.orbit-front{filter:blur(.12px)}
/* Hover ends face-on and 12% larger. */
.service-hit.active .spin{animation:face-on .65s cubic-bezier(.2,.75,.25,1) both}.service-hit.active .lift{animation:lift-front .85s cubic-bezier(.22,.75,.25,1) both,breath-front 2.8s ease-in-out .85s infinite}.spin{transition:transform .6s var(--ease)}.service-slot{--rest-y:0deg;--rest-x:0deg}.service-slot .service-hit{--rest-y:inherit;--rest-x:inherit}
/* Second full-viewport scene. The same physical block docks at its top-left. */
.detail-view{min-height:100svh;height:100svh;padding:106px 32px 30px;position:relative;display:flex;align-items:center;background:radial-gradient(ellipse at 10% 15%,#e4edda80,transparent 50%),#faf7f0;overflow:auto}.detail-shell{width:100%;max-width:1120px;margin:auto;position:relative;min-height:calc(100svh - 150px);display:flex;flex-direction:column;justify-content:center}.service-dock{position:absolute;top:0;left:0;width:145px;height:150px;direction:ltr;z-index:4}.dock-hint{position:absolute;left:0;top:145px;width:170px;font-size:10px;line-height:1.8;color:#7c886e;text-align:left}.return-link{position:absolute;top:8px;right:0;border:0;background:none;color:#446f54;font-size:12px;padding:10px 0;text-decoration:underline;text-underline-offset:5px}.detail-view .detail{display:block;border:0;padding:100px 0 45px;margin:0 0 0 190px;min-height:0}.detail-view .detail-title{margin-bottom:25px}.detail-view .detail-title .number{font-size:12px;letter-spacing:2.5px}.detail-view .detail h2{font-size:clamp(34px,4vw,55px);line-height:1.6;max-width:860px;margin-top:22px;letter-spacing:-1px}.detail-view .detail p{font-size:17px;line-height:2.2;max-width:800px}.detail-view .features{gap:10px;margin:24px 0 30px}.detail-view .feature{font-size:12px;padding:10px 14px;border-radius:7px;background:#f6f6eb}.detail-view .primary{font-size:16px;padding:17px 23px;gap:40px}.detail-view .hint{font-size:11px!important;max-width:280px!important}.detail-footnote{font-size:10px;line-height:2;color:#8b947f;position:absolute;bottom:0;right:0}.drawer{position:fixed;inset:105px max(25px,calc((100vw - 1100px)/2)) auto;z-index:80;box-shadow:0 22px 70px #1f3f2830;padding:28px;background:#f7f6ed}.drawer-close{position:absolute;top:8px;left:12px;border:0;background:none;font-size:24px}.drawer .service-index{margin-top:25px}.orbit-placeholder{position:absolute;left:var(--x);top:var(--y);width:184px;height:190px;transform:translate(-50%,-50%);pointer-events:none}.orbit-placeholder:before{content:"";position:absolute;inset:27px 23px;border:1px solid #b8c29b65;border-radius:28px;background:#dfe7d31a}.service-slot.in-flight{position:fixed!important;left:0!important;top:0!important;width:184px!important;height:190px!important;margin:0!important;transform-origin:0 0!important;z-index:100!important;pointer-events:none}.in-flight .service-idle{animation:none!important}.in-flight .lift{animation:none!important;transform:none!important}.in-flight .spin{animation:none!important;transform:none!important}.service-slot.docked{position:absolute!important;left:0!important;top:0!important;transform:scale(.72)!important;transform-origin:top left!important;width:184px!important;height:190px!important}.docked .service-idle{animation:none!important}.docked .lift{animation:dock-breath 3s ease-in-out infinite!important}.docked .spin{animation:none!important;transform:none!important}.docked .service-hit{cursor:pointer}.docked .service-idle:before{opacity:.35}.transitioning .service-hit{pointer-events:none}.detail-open .hero-view .service-hit{pointer-events:none}
@keyframes face-on{from{transform:rotateX(var(--rest-x)) rotateY(var(--rest-y))}to{transform:rotateX(0deg) rotateY(360deg)}}@keyframes lift-front{0%{transform:translateY(0) scale(1)}42%{transform:translateY(-46px) scale(1.12)}70%{transform:translateY(-17px) scale(1.12)}100%{transform:translateY(-23px) scale(1.12)}}@keyframes breath-front{0%,100%{transform:translateY(-23px) scale(1.12)}50%{transform:translateY(-13px) scale(1.12)}}@keyframes dock-breath{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}@keyframes fiber-flow{from{stroke-dashoffset:1000}to{stroke-dashoffset:0}}@keyframes arrival{0%,50%{opacity:.2}75%{opacity:.85}100%{opacity:.2}}
@media(min-width:720px) and (max-width:1000px){.monitor-position{transform:translate(-50%,-50%);scale:1}.monitor-tilt{scale:1}.platform{scale:1;transform:translateX(-50%);top:calc(51% + 162px)}}
@media(max-width:719px){.app-header{height:64px}.header-inner{padding:0 18px}.hero-view{padding-top:64px;min-height:640px}.intro{padding-top:15px}.intro h1{font-size:24px;margin:8px 0}.intro p{font-size:10px;max-width:330px;margin:auto}.hero-view .scene-wrap{flex:1;min-height:260px;overflow:visible}.hero-view .scene{position:relative!important;width:100%!important;height:300px!important;left:0;top:50%;transform:translateY(-50%);--scene-scale:1}.hero-view>.mobile-services{display:flex;height:137px;flex:0 0 137px;padding:23px 6px 5px;margin:0;overflow-y:hidden}.hero-view>.mobile-hint{display:none}.hero-controls{height:45px;flex-basis:45px;padding:0 18px 9px;font-size:9px}.hero-controls>div{gap:10px}.hero-controls #hover-note{max-width:180px}.hero-controls .text-button{font-size:9px}.monitor-position{width:300px;height:226px;top:39%}.monitor-screen{padding:13px;inset:8px}.screen-head{font-size:14px;margin-bottom:11px}.screen-body{height:140px;grid-template-columns:75px 1fr;gap:8px}.monitor-stand{height:45px}.platform{top:calc(39% + 127px);width:300px;filter:drop-shadow(5px 7px 8px #6e755224)}.tier-top{width:225px;height:46px}.tier-top i{height:25px}.tier-middle{width:277px;height:37px;top:34px}.tier-middle i{height:26px}.tier-bottom{width:325px;height:38px;top:55px}.tier-bottom i{height:26px}.platform-glow{top:20px;height:17px}.contact-shadow{top:3px;height:10px}.optical-link{height:calc(100% + 50px)}.detail-view{padding:88px 22px 25px;min-height:100svh;height:auto}.detail-shell{min-height:calc(100svh - 115px);padding-top:180px}.service-dock{left:0;top:0;scale:.85;transform-origin:top left}.dock-hint{top:127px;font-size:9px;width:130px}.return-link{top:7px;font-size:10px}.detail-view .detail{padding:0 0 55px;margin:0}.detail-view .detail h2{font-size:31px;margin:15px 0;line-height:1.65}.detail-view .detail-title{margin-bottom:16px}.detail-view .detail-title .number{font-size:10px}.detail-view .detail p{font-size:14px}.detail-view .feature{font-size:10px;padding:8px 10px}.detail-view .primary{font-size:14px;padding:15px 19px}.detail-view .hint{font-size:10px!important;max-width:220px!important}.drawer{inset:85px 18px auto}.service-slot.docked{transform:scale(.72)!important}.hero-view .orbit-front,.hero-view .orbit-back{height:calc(100% + 50px)}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.fiber-pulse,#fiber-arrival,.docked .lift{animation:none!important}.service-hit.active .lift{transform:scale(1.1)}.service-hit.active .spin{transform:none}}
html{scrollbar-gutter:stable}.mobile-services .orbit-placeholder{position:relative;left:auto;top:auto;transform:none;flex:0 0 112px;width:112px;height:126px}.mobile-services .orbit-placeholder:before{inset:12px 9px 17px}.detail-view[hidden]{display:none!important}.detail-view .detail-title,.detail-view .detail{scroll-margin-top:90px}
@media(max-width:719px){.detail-view{height:100svh}.hero-controls{flex-wrap:nowrap}.hero-controls>div{flex-shrink:0}.hero-controls>div .text-button:last-child{max-width:82px;line-height:1.6}.detail-open .hero-view>.mobile-services{overflow:hidden}}
.orbit-fallback{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;fill:none;stroke:#b18b3f;stroke-linecap:butt}.fallback-back{z-index:1;opacity:.6}.fallback-front{z-index:12;opacity:.27}.depth-ready .orbit-fallback{display:none}
.hero-view{user-select:none;-webkit-user-select:none}.motion-off .docked .lift{animation:none!important}

@media(min-width:720px){.contact-shadow{top:20px}}
