/* One responsive diagram: the same paths, state and controls on every screen. */
.network-demo{width:100%;min-width:0;max-width:620px;justify-self:center;margin:0;padding:22px;background:#fff;border:1px solid #d8e2ea;border-radius:19px;color:#172b45;box-shadow:0 20px 65px #2b4c7e08;overflow:hidden}.demo-heading>p{color:#58697d;font-size:.64rem;letter-spacing:.1em;font-weight:650;margin-bottom:6px}.demo-heading h2{font-size:1.32rem;letter-spacing:-.025em;line-height:1.35}.demo-scene{padding:22px 0 0}.demo-icon{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}.demo-cloud{display:flex;align-items:center;justify-content:center;gap:11px;min-height:44px;width:max-content;max-width:85%;margin:auto;background:#edf2f6;border:1px solid #c5d3df;padding:8px 25px;border-radius:28px;font-weight:650;font-size:.9rem}.demo-cloud .demo-icon{width:30px;height:30px;color:#2b4c7e}.demo-wires{display:block;width:100%;height:35px;overflow:visible}.wire-base,.wire-flow{fill:none;stroke-linejoin:round;stroke-linecap:round;vector-effect:non-scaling-stroke}.wire-base{stroke:#b8c8d6;stroke-width:1.5}.wire-backup{stroke-dasharray:4 5}.wire-flow{stroke:#2b4c7e;stroke-width:3.5;stroke-dasharray:2 14;display:none;animation:demo-travel 1.6s linear infinite;animation-play-state:paused}.demo-moving .wire-flow{animation-play-state:running}.network-demo[data-state=primary] .flow-primary,.network-demo[data-state=restored] .flow-primary,.network-demo:not([data-state=outage]) .flow-lan,.network-demo[data-state=backup] .flow-backup{display:block}.network-demo[data-state=backup] .flow-backup,.network-demo[data-state=backup] .flow-lan{stroke:#698644}.network-demo[data-state=backup] .wire-backup{stroke:#95ad76;stroke-dasharray:none}.network-demo[data-state=outage] .wire-primary,.network-demo[data-state=backup] .wire-primary{stroke:#c6877b;stroke-dasharray:3 5}.demo-uplinks{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:22px}.demo-router{display:grid;grid-template-columns:25px minmax(0,1fr);align-items:center;gap:7px 9px;background:#f6f8fa;border:1px solid #d9e3eb;border-radius:11px;padding:12px;min-width:0}.demo-router strong{font-size:.81rem;line-height:1.4;font-weight:650;display:block;overflow-wrap:break-word}.demo-router small{font-size:.66rem;color:#58697d;line-height:1.45;display:block;margin-top:2px}.demo-router>.demo-icon{color:#526c87}.demo-link-status{display:flex;align-items:center;gap:6px;grid-column:1/-1;font-size:.67rem;line-height:1.4;font-weight:600;padding-top:7px;border-top:1px solid #dce5ec;color:#526578;min-height:24px}.demo-link-status:before{content:'•';font-size:1.1rem;line-height:.8}.demo-primary .demo-link-status{color:#2b4c7e}.network-demo[data-state=outage] .demo-primary,.network-demo[data-state=backup] .demo-primary{background:#fdf6f3;border-color:#dbb3a8}.network-demo[data-state=outage] .demo-primary .demo-link-status,.network-demo[data-state=backup] .demo-primary .demo-link-status{color:#a04939;border-color:#e7c9c1}.network-demo[data-state=outage] .demo-primary .demo-link-status:before,.network-demo[data-state=backup] .demo-primary .demo-link-status:before{content:'×';font-size:1rem}.network-demo[data-state=backup] .demo-backup{background:#f0f5e9;border-color:#a5ba8c}.network-demo[data-state=backup] .demo-backup .demo-link-status{color:#49662b;border-color:#ccdab9}.network-demo[data-state=backup] .demo-backup .demo-link-status:before{content:'✓';font-size:.75rem}.demo-gateway{display:grid;grid-template-columns:30px minmax(0,1fr);gap:6px 12px;align-items:center;padding:13px 20px;border-radius:12px;background:#2b4c7e;color:#fff;width:88%;margin:auto}.demo-gateway strong{font-size:.88rem;line-height:1.4}.demo-gateway small{display:block;font-size:.67rem;color:#e0e8f1;line-height:1.5}.demo-gateway>.demo-icon{width:30px;height:30px;color:#d3e4bb}.demo-gateway>[data-route-status]{grid-column:1/-1;border-top:1px solid #ffffff2b;padding-top:5px;font-size:.65rem;line-height:1.5;color:#f1f5ea;text-align:center}.network-demo[data-state=outage] .demo-gateway>[data-route-status]{color:#f5d990}.demo-lan-wire{display:block;width:100%;height:26px}.demo-lan{border:1px solid #d6e1e9;background:#f5f8fa;border-radius:10px;padding:13px}.demo-lan-heading{display:flex;align-items:center;justify-content:space-between;gap:6px 12px;margin-bottom:12px;flex-wrap:wrap}.demo-lan-heading strong{font-size:.76rem}.demo-lan-heading>span{font-size:.64rem;color:#58697d}.demo-device-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}.demo-endpoint{min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:5px;padding:9px 3px 6px;border-radius:6px;background:#fff;border:1px solid #e0e7ec;text-align:center}.demo-endpoint .demo-icon{width:19px;height:19px;color:#526c87}.demo-endpoint span{font-size:.67rem;line-height:1.45;overflow-wrap:break-word;hyphens:auto}.demo-state{display:flex;gap:11px;background:#edf2f7;padding:15px;border-radius:10px;margin-top:18px;min-height:112px}.demo-state-symbol{display:grid;place-items:center;border-radius:50%;width:23px;height:23px;flex-shrink:0;background:#d6e0eb;color:#2b4c7e;font-size:.8rem;margin-top:2px}.demo-state [data-state-title]{font-weight:650;font-size:.85rem;line-height:1.45}.demo-state [data-state-text]{font-size:.76rem;line-height:1.65;color:#526578;margin-top:5px}.network-demo[data-state=outage] .demo-state{background:#fff6e8}.network-demo[data-state=outage] .demo-state-symbol{background:#f4ddb5;color:#725010}.network-demo[data-state=backup] .demo-state{background:#eef4e6}.network-demo[data-state=backup] .demo-state-symbol{background:#d5e4c0;color:#415e26}.demo-scenario-controls{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin-top:13px}.demo-scenario-controls button{min-width:0;background:#fff;border:1px solid #c8d5e0;color:#58697d;padding:8px 6px;min-height:49px;border-radius:7px;font-size:.68rem;line-height:1.4;font-weight:550;text-align:left;overflow-wrap:break-word}.demo-scenario-controls button>span{display:block;font-size:.57rem;color:#6e8193;line-height:1.3;margin-bottom:3px;letter-spacing:.04em}.demo-scenario-controls button:hover{background:#f4f7fa;border-color:#8aa1b8}.demo-scenario-controls button[aria-pressed=true]{background:#edf2f7;border-color:#2b4c7e;color:#172b45;box-shadow:inset 0 0 0 1px #2b4c7e}.demo-footer{margin-top:12px;display:flex;align-items:start;gap:13px}.demo-control{border:1px solid #c8d5e0;background:#fff;border-radius:7px;padding:9px 12px;min-height:44px;color:#2b4c7e;font-size:.73rem;font-weight:600;line-height:1.4}.demo-control:hover{background:#edf2f6}.demo-control:disabled{opacity:.65;cursor:default}.demo-footer .demo-control{flex-shrink:0;max-width:42%}.demo-footer figcaption{font-size:.63rem;line-height:1.65;color:#58697d;padding-top:2px}.demo-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
/* Speed gauges share a fixed 500 Mbps scale and illustrative data. */
.speed-section{background:#f5f7f8;border-block:1px solid #e2e9ee}.speed-heading{display:flex;justify-content:space-between;align-items:end;gap:45px;margin-bottom:35px}.speed-heading>div{max-width:680px}.speed-heading .eyebrow{color:#2b4c7e;margin-bottom:18px}.speed-heading h2{font-size:clamp(2.2rem,3.6vw,3.2rem);line-height:1.15;text-wrap:balance}.speed-heading p:last-child{font-size:1.05rem;color:#58697d;line-height:1.75;margin-top:22px;max-width:600px}.speed-heading>.text-link{max-width:230px;flex-shrink:0;font-size:.86rem;line-height:1.6}.speed-comparison{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:26px}.speed-card{min-width:0;border:1px solid #dce5ec;border-radius:16px;background:#fff;padding:27px 30px 25px;display:flex;flex-direction:column;align-items:center;overflow:hidden}.speed-after{background:#edf3e5;border-color:#d2dfc2}.speed-card-heading{width:100%;display:flex;justify-content:space-between;align-items:center;gap:15px;min-height:46px}.speed-card-heading p{font-size:1.15rem;font-weight:650;letter-spacing:-.015em}.speed-card-heading>span{font-size:.72rem;color:#58697d}.speed-gauge{width:100%;max-width:420px;position:relative;margin:14px auto 0}.speed-gauge svg{display:block;width:100%;height:auto;overflow:visible}.speed-track,.speed-arc{fill:none;stroke-width:12;stroke-linecap:round}.speed-track{stroke:#e2e8ed}.speed-after .speed-track{stroke:#d8e2ce}.speed-arc{stroke:#b77b38}.speed-after .speed-arc{stroke:#2b4c7e}.speed-dot{fill:#e8cb7a;stroke:#fff;stroke-width:3}.speed-after .speed-dot{fill:#c3d99b}.speed-ticks path{stroke:#b5c4cf;stroke-width:1.5;fill:none}.speed-gauge svg text{font:13px 'DM Sans','Noto Sans',sans-serif;fill:#65778a}.speed-reading{position:absolute;top:38%;left:0;right:0;text-align:center;line-height:1.15;font-variant-numeric:tabular-nums;letter-spacing:-.05em;font-family:Manrope,'Noto Sans','Noto Sans Devanagari',sans-serif;font-weight:650;font-size:clamp(3rem,5vw,4.3rem);color:#172b45}.speed-reading small{font-family:'DM Sans',sans-serif;font-weight:500;font-size:.8rem;letter-spacing:0;display:block;color:#58697d;margin-top:6px}.speed-card>figcaption{font-size:.88rem;line-height:1.7;text-align:center;color:#58697d;margin-top:8px}.speed-toolbar{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:22px}.speed-scale{font-size:.79rem;color:#58697d}.speed-buttons{display:flex;gap:10px}.speed-status{font-size:.78rem;font-weight:550;color:#2b4c7e;margin-top:18px;min-height:22px}.speed-note{font-size:.81rem;line-height:1.75;max-width:890px;color:#58697d;margin-top:7px}.speed-section[data-phase=before] .speed-before,.speed-section[data-phase=after] .speed-after{border-color:#8da5bd;box-shadow:0 5px 25px #2b4c7e06}
@keyframes demo-travel{to{stroke-dashoffset:-32}}
@media(min-width:1600px){.network-demo{max-width:660px}.hero-grid{grid-template-columns:1fr 1.06fr}.demo-endpoint span{font-size:.65rem}}
@media(max-width:1100px){.network-demo{padding:18px}.demo-uplinks{gap:16px}.demo-router{padding:10px;gap:7px}.demo-endpoint span{font-size:.64rem}.demo-state{min-height:125px}.speed-card{padding:22px}.speed-card-heading{align-items:start;flex-direction:column;gap:3px}.speed-heading{gap:30px}}
@media(max-width:850px){.network-demo{max-width:590px}.demo-endpoint span{font-size:.67rem}.demo-state{min-height:106px}.demo-router strong{font-size:.88rem}.demo-router small{font-size:.74rem}.demo-link-status{font-size:.74rem}.demo-heading h2{font-size:1.45rem}.demo-gateway strong{font-size:.98rem}.demo-gateway small{font-size:.77rem}.demo-gateway>[data-route-status]{font-size:.72rem}.demo-lan-heading strong{font-size:.84rem}.demo-lan-heading>span{font-size:.72rem}.demo-state [data-state-title]{font-size:.94rem}.demo-state [data-state-text]{font-size:.84rem}.demo-scenario-controls button{font-size:.75rem}.demo-scenario-controls button>span{font-size:.65rem}.demo-footer figcaption{font-size:.7rem}.demo-control{font-size:.79rem}.speed-heading{display:block}.speed-heading>.text-link{max-width:none;margin-top:23px}.speed-reading{font-size:3rem}.speed-card>figcaption{font-size:.8rem}}
@media(max-width:600px){.network-demo{padding:17px;border-radius:14px}.demo-heading>p{font-size:.59rem;letter-spacing:.08em}.demo-heading h2{font-size:1.3rem;line-height:1.35}.demo-scene{padding-top:17px}.demo-wires{height:32px}.demo-uplinks{gap:13px}.demo-router{grid-template-columns:1fr;justify-items:center;text-align:center;padding:12px 8px;gap:6px}.demo-router strong{font-size:.81rem}.demo-router small{font-size:.71rem}.demo-link-status{justify-content:center;width:100%;font-size:.71rem}.demo-router>.demo-icon{width:25px;height:25px}.demo-gateway{padding:12px 14px;width:96%;gap:7px 10px}.demo-gateway strong{font-size:.88rem}.demo-gateway small{font-size:.7rem}.demo-gateway>[data-route-status]{font-size:.69rem}.demo-lan{padding:12px 10px}.demo-device-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.demo-endpoint{flex-direction:row;justify-content:flex-start;align-items:center;gap:7px;padding:8px 7px;text-align:left;min-height:37px}.demo-endpoint span{font-size:.68rem;line-height:1.5}.demo-endpoint .demo-icon{width:18px;height:18px}.demo-lan-heading{margin-bottom:10px}.demo-lan-heading strong{font-size:.8rem}.demo-lan-heading>span{font-size:.7rem}.demo-state{padding:13px;gap:9px;min-height:158px;margin-top:14px}.demo-state [data-state-title]{font-size:.9rem}.demo-state [data-state-text]{font-size:.81rem;line-height:1.65}.demo-scenario-controls{gap:6px}.demo-scenario-controls button{padding:9px 7px;font-size:.7rem}.demo-footer{flex-direction:column;gap:10px}.demo-footer .demo-control{max-width:100%}.demo-footer figcaption{font-size:.7rem;line-height:1.6}.speed-heading{margin-bottom:25px}.speed-heading h2{font-size:2.3rem}.speed-heading p:last-child{font-size:1rem;margin-top:20px}.speed-comparison{gap:12px}.speed-card{padding:16px 10px;border-radius:12px}.speed-card-heading{min-height:72px;justify-content:flex-start;gap:5px}.speed-card-heading p{font-size:.9rem;line-height:1.5;overflow-wrap:break-word}.speed-card-heading>span{font-size:.67rem;line-height:1.5}.speed-gauge{margin-top:8px}.speed-reading{font-size:clamp(1.6rem,7.5vw,2.8rem);top:35%;line-height:1.15}.speed-reading small{font-size:.65rem;margin-top:3px}.speed-gauge svg text{display:none}.speed-card>figcaption{font-size:.73rem;line-height:1.7;margin-top:8px}.speed-toolbar{align-items:flex-start;flex-direction:column;gap:15px}.speed-scale{font-size:.74rem}.speed-buttons{flex-wrap:wrap}.speed-status{font-size:.77rem;margin-top:15px}.speed-note{font-size:.78rem;line-height:1.8}.speed-heading .eyebrow{font-size:.65rem}}
@media(max-width:350px){.network-demo{padding:13px}.demo-router strong{font-size:.76rem}.demo-router small,.demo-link-status{font-size:.67rem}.demo-state{min-height:187px}.demo-endpoint span{font-size:.64rem}.demo-scenario-controls button{font-size:.65rem}.demo-control{font-size:.74rem}.speed-card-heading p{font-size:.82rem}.speed-card-heading>span{font-size:.61rem}.speed-card>figcaption{font-size:.69rem}.speed-card{padding:14px 8px}.speed-comparison{gap:10px}}
@media(prefers-reduced-motion:reduce){.wire-flow{animation:none!important;display:none!important}}

@media(min-width:851px){.hero-copy{align-self:start;padding-top:45px}}