/* Uses the existing DTEXPAND Blueprint palette and typefaces. */
.build-system{border-bottom:1px solid var(--line);background:var(--paper-2);overflow:hidden}
.build-layout{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
.build-copy h2{font-size:clamp(32px,4vw,48px);margin:20px 0}
.build-copy p{color:var(--ink-soft);max-width:490px}
.build-services{display:flex;flex-wrap:wrap;gap:10px 22px;list-style:none;margin:26px 0 30px;font:12px var(--mono);color:var(--ink)}
.build-services li{display:flex;align-items:center;gap:8px}
.build-services li::before{content:'';width:6px;height:6px;background:var(--signal)}
.build-visual{min-width:0}
.build-stage{height:350px;position:relative;perspective:1000px;background:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:40px 40px;border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.build-stage::after{content:'';position:absolute;left:25%;right:25%;bottom:38px;height:20px;background:var(--ink);opacity:.13;filter:blur(16px);border-radius:50%}
.build-world{position:absolute;left:50%;top:47%;transform-style:preserve-3d}
.build-cube{position:absolute;width:44px;height:44px;margin:-22px;transform-style:preserve-3d}
.build-face{position:absolute;inset:0;border:1px solid rgba(255,255,255,.18);border-radius:2px;backface-visibility:hidden;background:var(--ink)}
.build-front{transform:translateZ(22px);background:var(--ink-soft)}
.build-back{transform:rotateY(180deg) translateZ(22px)}
.build-right{transform:rotateY(90deg) translateZ(22px)}
.build-left{transform:rotateY(-90deg) translateZ(22px)}
.build-top{transform:rotateX(90deg) translateZ(22px);background:var(--blue-fog)}
.build-bottom{transform:rotateX(-90deg) translateZ(22px)}
.build-cube.is-signal .build-front{background:var(--signal)}
.build-cube.is-signal .build-top{background:var(--signal-lite)}
.build-cube.is-signal .build-right,.build-cube.is-signal .build-left,.build-cube.is-signal .build-back,.build-cube.is-signal .build-bottom{background:var(--signal-dark)}
.build-caption{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:18px}
.build-phase{font:12px var(--mono);color:var(--ink-mute)}
@media(max-width:760px){.build-layout{grid-template-columns:1fr;gap:32px}.build-stage{height:310px}.build-copy h2{max-width:480px}.build-caption{flex-wrap:wrap}}

/* One continuous hero background, full-width animation stage. */
.build-intro{position:relative;background:var(--paper);isolation:isolate;overflow:hidden}
.build-intro>.hero-grid-bg{z-index:-1}
.build-intro .hero{background:transparent}
.build-system{background:transparent;border:0;padding-top:40px;padding-bottom:70px;overflow:visible}
.build-layout{display:block}
.build-copy-wrap{width:100%}
.build-copy{max-width:760px}
.build-copy h2{max-width:22ch}
.build-copy p{max-width:620px}
.build-visual{width:100%;margin-top:30px}
.build-stage{width:100%;height:clamp(400px,70svh,800px);border:0;border-radius:0;background:none;overflow:visible;perspective:1400px}
.build-stage::after{left:38%;right:38%;bottom:12%}
.build-world{top:48%}
.build-caption{max-width:var(--maxw);margin:0 auto;padding:0 var(--pad)}
@media(max-width:760px){.build-system{padding-top:20px}.build-stage{height:460px}.build-copy h2{max-width:22ch}.build-visual{margin-top:8px}}/* Subtle animation behind the section content. */
.build-system{min-height:660px;padding-block:100px 130px;overflow:hidden;isolation:isolate}
.build-layout{position:relative;min-height:430px}
.build-copy-wrap{position:relative;z-index:2;pointer-events:none}
.build-copy-wrap a{pointer-events:auto}
.build-copy{position:relative}
.build-visual{position:absolute;inset:-100px 0 -130px;margin:0;z-index:0;pointer-events:none;opacity:.19;}
.build-stage{height:100%;min-height:660px;overflow:hidden;mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.25) 32%,#000 72%);-webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.25) 32%,#000 72%)}
.build-world{left:72%;top:48%}
.build-stage::after{display:none}
.build-caption{display:none}
@media(max-width:760px){.build-system{min-height:560px;padding-block:60px 80px}.build-layout{min-height:420px}.build-visual{inset:-60px 0 -80px;opacity:.12}.build-stage{min-height:560px;mask-image:linear-gradient(90deg,transparent,#000);-webkit-mask-image:linear-gradient(90deg,transparent,#000)}.build-world{left:76%;top:55%}}

/* Keep the shared grid, but confine animated network dots to the hero. */
.build-network-only::before{display:none}