.builder-hero{position:relative;overflow:hidden;padding:155px 0 72px;color:#fff;background:radial-gradient(circle at 80% 20%,rgba(0,183,241,.2),transparent 26%),linear-gradient(145deg,#020b14,#071a2e)}
.builder-hero-grid{position:relative;z-index:1;display:flex;align-items:end;justify-content:space-between;gap:40px}.builder-hero h1{font-size:clamp(3.3rem,7vw,6rem);margin:.4rem 0 1rem}.builder-hero p:not(.kicker){max-width:780px;color:#aebfcd;font-size:1.02rem}.builder-status{flex:0 0 auto;display:flex;align-items:center;gap:9px;border:1px solid rgba(114,226,255,.25);border-radius:999px;background:rgba(4,24,40,.78);padding:.65rem .9rem;color:#a9c4d5;font-size:.72rem}.builder-status i,.live-badge i{width:7px;height:7px;border-radius:50%;background:#57e29a;box-shadow:0 0 12px #57e29a}
.builder-section{padding:70px 0 110px;background:#f3f7fa}.builder-layout{display:grid;grid-template-columns:340px minmax(0,1fr);gap:26px;align-items:start}.builder-controls{position:sticky;top:104px;border:1px solid #dce6ed;border-radius:24px;background:#fff;padding:27px;box-shadow:0 20px 55px rgba(4,25,43,.06)}.control-head h2,.workspace-head h2,.architecture-summary h2{font-size:1.75rem;letter-spacing:-.035em}.control-head>p:last-child{color:var(--muted);font-size:.85rem;margin-bottom:26px}.builder-group{border:0;border-top:1px solid #e3e9ee;margin:0;padding:22px 0 5px}.builder-group legend{padding:0 9px 0 0;color:#64798a;font-size:.68rem;font-weight:800;text-transform:uppercase;letter-spacing:.1em}.choice-row{display:grid;grid-template-columns:20px 1fr;gap:11px;align-items:start;padding:10px 8px;border-radius:12px;cursor:pointer;transition:.2s}.choice-row:hover{background:#f3f8fb}.choice-row input{margin-top:4px;accent-color:var(--blue)}.choice-row strong,.choice-row small{display:block}.choice-row strong{font-size:.8rem;color:#17324a}.choice-row small{font-size:.67rem;color:#8292a0;line-height:1.35;margin-top:2px}.builder-actions{display:flex;flex-direction:column;gap:10px;margin-top:20px}.builder-actions .btn{width:100%;border:0;cursor:pointer}.reset-btn{border:0;background:transparent;color:var(--blue);font-weight:750;cursor:pointer;padding:.65rem}
.builder-workspace{min-width:0}.workspace-head{display:flex;align-items:end;justify-content:space-between;margin:3px 0 18px}.live-badge{display:flex;align-items:center;gap:7px;color:#5f7788;font-size:.7rem}.architecture-canvas{position:relative;min-height:545px;overflow:hidden;border:1px solid rgba(107,190,225,.2);border-radius:26px;background:radial-gradient(circle at 50% 48%,rgba(0,183,241,.1),transparent 28%),linear-gradient(145deg,#03111e,#071e34);box-shadow:0 28px 65px rgba(3,22,38,.18)}.canvas-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(114,226,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(114,226,255,.035) 1px,transparent 1px);background-size:34px 34px}.access-zone{position:absolute;left:5%;right:5%;top:32px;display:flex;justify-content:center;gap:12px;flex-wrap:wrap}.arch-node{position:relative;z-index:3;min-width:126px;max-width:160px;border:1px solid rgba(135,220,255,.28);border-radius:16px;background:linear-gradient(155deg,rgba(12,49,78,.9),rgba(4,22,38,.88));color:#fff;padding:12px 13px;box-shadow:0 14px 35px rgba(0,0,0,.22);animation:nodeIn .38s ease both}.arch-node .node-icon{display:block;color:var(--cyan2);font-size:1.1rem}.arch-node strong,.arch-node small{display:block}.arch-node strong{font:700 .76rem var(--display);margin-top:4px}.arch-node small{color:#8ea9bc;font-size:.58rem;line-height:1.3;margin-top:2px}.core-stack{position:absolute;left:50%;top:48%;transform:translate(-50%,-50%);display:flex;gap:12px;align-items:center;z-index:5}.core-stack .arch-node{min-width:145px;text-align:center;border-color:rgba(114,226,255,.48);box-shadow:0 0 35px rgba(0,183,241,.13)}.endpoint-zone{position:absolute;left:50%;bottom:37px;transform:translateX(-50%);z-index:4}.endpoint-zone .arch-node{min-width:195px;text-align:center}.monitor-node{position:absolute;right:4%;top:45%;z-index:5;width:145px;border:1px dashed rgba(114,226,255,.35);border-radius:16px;background:rgba(3,25,43,.86);padding:12px;color:#fff;animation:nodeIn .38s ease both}.monitor-node strong,.monitor-node small{display:block}.monitor-node strong{font-size:.74rem}.monitor-node small{color:#8ea9bc;font-size:.57rem}.monitor-node .node-icon{color:var(--cyan2)}.flow-line{position:absolute;left:50%;width:2px;transform:translateX(-50%);background:linear-gradient(var(--cyan),rgba(0,183,241,.15));box-shadow:0 0 11px rgba(0,183,241,.65);z-index:1}.flow-line:after{content:"";position:absolute;left:-3px;width:8px;height:8px;border-radius:50%;background:#c8f6ff;box-shadow:0 0 12px #72e2ff;animation:flow 2.2s linear infinite}.flow-a{top:124px;height:105px}.flow-b{top:244px;height:58px}.flow-c{top:345px;height:96px}.flow-b:after{animation-delay:.7s}.flow-c:after{animation-delay:1.3s}.builder-metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:14px}.builder-metrics article{border:1px solid #dce6ed;border-radius:16px;background:#fff;padding:16px}.builder-metrics span,.builder-metrics strong{display:block}.builder-metrics span{color:#778b9b;font-size:.65rem;text-transform:uppercase;letter-spacing:.08em}.builder-metrics strong{color:#12324d;font:800 .95rem var(--display);margin-top:5px}.architecture-summary{display:grid;grid-template-columns:1.1fr .9fr;gap:50px;margin-top:18px;border:1px solid #dce6ed;border-radius:24px;background:#fff;padding:32px}.architecture-summary p:not(.section-kicker){color:var(--muted);font-size:.86rem}.architecture-summary ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;justify-content:center;gap:10px}.architecture-summary li{position:relative;padding-left:20px;color:#496274;font-size:.8rem}.architecture-summary li:before{content:"";position:absolute;left:0;top:.5rem;width:7px;height:7px;border-radius:50%;background:var(--cyan);box-shadow:0 0 10px rgba(0,183,241,.45)}.builder-cta{display:flex;align-items:center;justify-content:space-between;gap:25px;margin-top:18px;border-radius:22px;background:linear-gradient(120deg,#0e5aa7,#073864);color:#fff;padding:25px 28px}.builder-cta strong,.builder-cta span{display:block}.builder-cta strong{font-family:var(--display)}.builder-cta span{color:#b9ccda;font-size:.76rem;margin-top:3px}.builder-cta .btn{white-space:nowrap}
@keyframes nodeIn{from{opacity:0;transform:translateY(10px) scale(.97)}to{opacity:1;transform:none}}@keyframes flow{from{top:0}to{top:calc(100% - 8px)}}
@media(max-width:1050px){.builder-layout{grid-template-columns:290px minmax(0,1fr)}.core-stack{flex-direction:column;gap:7px}.architecture-canvas{min-height:620px}.flow-c{top:420px}.monitor-node{top:52%}}
@media(max-width:820px){.builder-hero-grid{align-items:flex-start;flex-direction:column}.builder-layout{grid-template-columns:1fr}.builder-controls{position:static}.architecture-summary{grid-template-columns:1fr}.builder-metrics{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.builder-hero{padding:125px 0 55px}.builder-hero h1{font-size:3.05rem}.builder-status{white-space:normal}.architecture-canvas{min-height:690px}.access-zone{left:12px;right:12px;gap:7px}.arch-node{min-width:104px;max-width:125px;padding:9px}.core-stack{top:54%}.endpoint-zone{bottom:24px}.monitor-node{right:10px;top:67%;width:125px}.flow-a{top:170px;height:120px}.flow-b{top:302px;height:82px}.flow-c{top:446px;height:126px}.builder-metrics{grid-template-columns:1fr 1fr}.builder-cta{align-items:flex-start;flex-direction:column}.builder-cta .btn{width:100%}}