.product-section{height:285svh;position:relative;z-index:8;background:#050b14;scroll-margin-top:0}.product-sticky{position:sticky;top:0;height:100svh;overflow:hidden;isolation:isolate;background:radial-gradient(ellipse at 55% 55%,#13243b75,transparent 58%),#050b14}.server-stage{position:absolute;inset:0}.server-canvas{display:block;width:100%;height:100%;outline:none;touch-action:pan-y;cursor:grab}.server-canvas:focus-visible{box-shadow:inset 0 0 0 1px #82bfd1}.server-title{position:absolute;top:15.5%;left:5.3%;right:5.3%;pointer-events:none;z-index:2}.server-title .eyebrow{font-size:8px;letter-spacing:2.5px;margin-bottom:15px}.server-title h2{font-size:clamp(31px,3.3vw,49px);line-height:1.4;letter-spacing:3px;margin-bottom:12px}.server-title>p:not(.eyebrow){font-size:11px;color:#8fa9bb;letter-spacing:1px;line-height:2;max-width:420px}.server-open-copy{display:none}.server-open .server-closed-copy{display:none}.server-open .server-open-copy{display:block}.server-tag{position:absolute;right:5.3%;top:17%;z-index:2;border-left:1px solid #2f4d68;padding-left:15px;color:#7e9bb3;font:8px var(--utility);letter-spacing:1.7px;line-height:2;pointer-events:none}.server-tag strong{display:block;color:#c6d7e4;font-size:10px;font-weight:400;letter-spacing:2px}.server-bottom{position:absolute;left:5.3%;right:5.3%;bottom:33px;z-index:3;display:flex;align-items:flex-end;justify-content:space-between;gap:24px;pointer-events:none}.server-controls{display:flex;align-items:center;gap:12px;pointer-events:auto}.server-controls button{font:10px var(--body);letter-spacing:1px;color:#bed4e3;border:1px solid #8daec035;padding:10px 18px;background:#081320a8;backdrop-filter:blur(8px);transition:background .2s,border-color .2s}.server-controls button:hover{border-color:#8bb4ce;background:#172c40}.server-controls button:first-child{color:#d9edfa;border-color:#3c607b}.server-progress-track{width:190px;height:1px;background:#284052;margin-bottom:11px}.server-progress-track i{height:1px;display:block;width:0;background:#a1d9ec;box-shadow:0 0 8px #6baedc55}.server-scroll-note{font-size:8px;letter-spacing:1px;color:#638198;line-height:1.9}.server-scroll-note>span{color:#b8d1df;margin-right:13px}.server-caption{position:absolute;left:50%;bottom:96px;transform:translateX(-50%);font-size:9px;letter-spacing:1px;color:#66859b;pointer-events:none;white-space:nowrap}.server-status{position:absolute;left:5.3%;top:calc(15.5% - 28px);font:7px var(--utility);letter-spacing:1px;color:#476b87}.server-components{position:absolute;left:50%;bottom:102px;transform:translateX(-50%);display:flex;gap:7px;z-index:4;opacity:0;visibility:hidden;transition:opacity .35s;max-width:90%;padding:4px}.server-open .server-components{opacity:1;visibility:visible}.server-open .server-caption{display:none}.server-components button{white-space:nowrap;font-size:9px;letter-spacing:1px;padding:8px 11px;border:1px solid #36546b;background:#07131ef0;color:#85a6bd;transition:color .2s,border-color .2s}.server-components button:hover,.server-components button.selected{border-color:#94d1e5;color:#e1f3ff;background:#153247}.component-card{position:absolute;left:5.3%;bottom:167px;width:248px;padding:16px 18px;border-left:1px solid #315d75;background:linear-gradient(90deg,#07111eed,#07111e44);z-index:3;opacity:0;visibility:hidden;transition:opacity .35s;pointer-events:none}.server-open .component-card{opacity:1;visibility:visible}.component-card.has-selection{border-left-color:#7ecce5;background:linear-gradient(90deg,#0a1b2beF,#07111e99)}.component-card .component-kicker{font:7px var(--utility);color:#5e91b0;letter-spacing:2px;margin-bottom:8px}.component-card h3{font-size:16px;font-weight:400;letter-spacing:2px;color:#cce7f4;margin:0 0 8px}.component-card>p:last-child{font-size:10px;line-height:2;color:#7997ac;letter-spacing:.5px;margin:0}.server-model-note{position:absolute;bottom:20px;left:50%;transform:translateX(-50%);font-size:7px;letter-spacing:.6px;color:#4f6e85;white-space:nowrap;pointer-events:none}.server-fallback-image{position:absolute;width:72%;height:45%;object-fit:contain;left:14%;top:34%;border-radius:8px}.server-fallback .server-components,.server-fallback .component-card{display:none!important}.page-footer{position:relative;inset:auto;margin:0 5.3%;height:90px;z-index:8;background:#050b14}.product-mode .motion-toggle{z-index:35;right:1.5%;bottom:12px}.main-nav a.active:after{transform:scaleX(1)}
@media(min-width:1800px){.server-title{left:8%;right:8%}.server-tag{right:8%}.server-bottom{left:8%;right:8%}.component-card{left:8%}}
@media(max-height:740px) and (min-width:761px){.server-title{top:17%}.server-title h2{font-size:34px}.server-title .eyebrow{margin-bottom:9px}.server-title>p:not(.eyebrow){font-size:10px}.server-status{top:calc(17% - 23px)}.component-card{bottom:145px;width:222px;padding:12px 14px}.server-components{bottom:86px}.server-bottom{bottom:27px}.server-components button{padding:6px 9px;font-size:8px}.server-caption{bottom:84px}}
@media(max-width:1100px) and (min-width:761px){.server-tag{display:none}.component-card{width:225px;bottom:160px}.server-components button{font-size:8px;padding:7px 9px}}
@media(max-width:760px){.product-section{height:270svh}.server-title{top:15%;left:7%;right:7%}.server-title .eyebrow{font-size:6px;letter-spacing:1.7px;margin-bottom:13px}.server-title h2{font-size:29px;letter-spacing:2px;line-height:1.5;margin-bottom:10px}.server-title>p:not(.eyebrow){font-size:9px;line-height:1.9;max-width:280px;letter-spacing:.5px}.server-tag{display:none}.server-status{left:7%;top:calc(15% - 22px);font-size:6px}.server-bottom{left:7%;right:7%;bottom:43px;gap:15px;align-items:center}.server-controls{gap:6px}.server-controls button{font-size:8px;padding:8px 9px;letter-spacing:.5px}.server-progress-track{width:96px;margin-bottom:8px}.server-scroll-note{font-size:6px;letter-spacing:.3px}.server-scroll-note>span{margin-right:0;display:block}.server-caption{bottom:121px;font-size:8px;letter-spacing:.6px}.server-model-note{bottom:16px;font-size:6px;letter-spacing:.2px;white-space:normal;text-align:center;width:85%;line-height:1.7}.server-components{bottom:108px;left:7%;right:7%;max-width:none;width:auto;transform:none;overflow-x:auto;scrollbar-width:thin;scrollbar-color:#3f627d transparent;gap:5px;padding:3px 0 8px}.server-components button{font-size:8px;padding:7px 9px;letter-spacing:.3px}.component-card{bottom:169px;left:7%;right:7%;width:auto;max-width:290px;padding:11px 13px;background:#081422e8}.component-card .component-kicker{font-size:6px;margin-bottom:5px}.component-card h3{font-size:13px;margin-bottom:5px}.component-card>p:last-child{font-size:8px;line-height:1.8;letter-spacing:.3px}.server-fallback-image{left:5%;width:90%;top:37%;height:32%}.page-footer{margin:0 7%;height:85px}.page-footer .footer-copyright{font-size:5px;bottom:12px}.page-footer .footer-word{font-size:22px}.product-mode .motion-toggle{bottom:13px;right:2%}}
@media(max-width:760px) and (max-height:720px){.server-title{top:17%}.server-title h2{font-size:24px}.server-title>p:not(.eyebrow){font-size:8px;max-width:260px}.server-status{top:calc(17% - 20px)}.server-title .eyebrow{margin-bottom:8px}.component-card{bottom:150px;max-width:245px;padding:9px 11px}.component-card h3{font-size:12px}.component-card>p:last-child{font-size:7px}.server-components{bottom:94px}.server-bottom{bottom:39px}.server-caption{bottom:104px;font-size:7px}.server-model-note{bottom:12px;font-size:5px}}
@media(prefers-reduced-motion:reduce){.server-components,.component-card,.server-controls button{transition:none}}

.menu-toggle{display:none}@media(max-width:760px){.menu-toggle{display:flex;align-items:center;gap:15px;font-size:10px;letter-spacing:1px;padding:8px 12px;border:1px solid #3d576c;color:#bcd2df}.site-header .header-action{display:none}.main-nav{position:absolute;top:81px;left:6%;right:6%;padding:15px 20px;background:#07121bf5;backdrop-filter:blur(14px);border:1px solid #294052;flex-direction:column;gap:0;align-items:stretch;display:none}.main-nav.is-open{display:flex}.main-nav a{padding:12px 4px;font-size:12px}.main-nav a:after{bottom:5px}.server-title h2 .text-ice{display:block}.server-closed-copy h2{max-width:310px}}
.server-detail{pointer-events:auto;margin-top:10px;padding:6px 0;border:0;border-bottom:1px solid #567f96;color:#b6d9e9;font-size:9px;letter-spacing:1px;background:transparent;cursor:pointer}.server-detail:disabled{display:none}.server-detail:hover{color:#fff;border-color:#d4efff}.server-detail:focus-visible{outline:1px solid #b6d9e9;outline-offset:4px}.component-card>p{font-size:10px;line-height:2;color:#7997ac;letter-spacing:.5px;margin:0}@media(max-width:760px){.component-card>p{font-size:8px;line-height:1.8}.server-detail{margin-top:7px;font-size:8px;padding:3px 0}}
.server-title .server-detail-copy{display:none}.server-detail-mode .server-title h2.server-open-copy{display:none}.server-detail-mode .server-title .server-detail-copy{display:block}
.server-product-tooltip{position:absolute;z-index:7;pointer-events:none;max-width:min(330px,calc(100vw - 28px));margin:0;padding:13px 16px;border:1px solid #49697e;border-left:2px solid #a1d3df;background:#07141ff2;box-shadow:0 12px 32px #0006;backdrop-filter:blur(12px);color:#d7e9f1;font:11px/1.9 var(--body);letter-spacing:.6px}
/* Pin both scenes to one viewport during the map-to-product handoff. */
.product-transition{height:120svh;margin-top:-100svh;position:relative;z-index:6;pointer-events:none}
.handoff-active .network-panel{translate:0 var(--handoff-offset,0px);scale:var(--handoff-map-scale,1);opacity:var(--handoff-network-opacity,1)!important;filter:blur(var(--handoff-blur,0px));transform-origin:50% calc(100% - 50svh);pointer-events:var(--handoff-network-events,none);will-change:translate,scale,opacity,filter}
.product-section.is-entering .product-sticky{position:fixed;inset:0;height:100svh;opacity:var(--product-reveal,0);pointer-events:none;will-change:opacity}
.product-section.is-entering .server-stage{pointer-events:var(--product-entry-events,none)}
.product-section.is-entering .server-title,.product-section.is-entering .server-tag,.product-section.is-entering .server-status,.product-section.is-entering .server-bottom,.product-section.is-entering .server-caption,.product-section.is-entering .server-model-note{opacity:var(--product-copy-opacity,0)}
@media(max-width:760px){.server-product-tooltip{font-size:10px;max-width:280px;padding:11px 13px}}
@media(prefers-reduced-motion:reduce){.handoff-active .network-panel{scale:1;filter:none}}

/* Product copy lives directly in the scene, with the same serif as the hero. */
.server-introduction{position:absolute;top:16%;left:5.3%;right:5.3%;z-index:2;pointer-events:none;color:#e7f0f3}
.server-introduction h3{font:400 clamp(29px,3.1vw,53px)/1.45 var(--heading);letter-spacing:.035em;margin:0 0 16px;text-shadow:0 2px 24px #050b1480}
.server-introduction h3>span{display:inline-block;color:#b7e1eb}
.server-introduction>p{font-size:clamp(11px,.95vw,15px);color:#99b3c2;letter-spacing:.05em;line-height:2;margin:0;max-width:650px}
.server-introduction>p.server-introduction-hint{margin-top:6px;font-size:11px;color:#678698}
.product-section.is-entering .server-introduction{opacity:var(--product-copy-opacity,0)}
.server-detail-mode .server-introduction{visibility:hidden}
@media(min-width:1800px){.server-introduction{left:5.3%;top:15%}}
@media(max-width:760px){.server-introduction{top:118px;left:7%;right:7%}.server-introduction h3{font-size:26px;line-height:1.65;letter-spacing:.015em;margin-bottom:10px}.server-introduction>p{font-size:10px;line-height:1.9;max-width:310px}.server-introduction>p.server-introduction-hint{font-size:9px;margin-top:7px}}
@media(max-width:760px) and (max-height:720px){.server-introduction{top:103px}.server-introduction h3{font-size:23px;margin-bottom:7px}.server-introduction>p{font-size:9px}.server-introduction>p.server-introduction-hint{font-size:8px;margin-top:4px}}
