.mk-hero .mv-hero-grid{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(24px,4vw,68px);min-height:550px}
.mk-topology{position:relative;height:440px;overflow:hidden;isolation:isolate;border:1px solid #c8d8f4;border-radius:26px;background:radial-gradient(circle at 50% 50%,#dceaff 0,#f5f9ff 38%,#fff 78%);box-shadow:0 32px 75px #17439416}
.mk-topology-grid{position:absolute;inset:0;background-image:linear-gradient(#1d56c809 1px,transparent 1px),linear-gradient(90deg,#1d56c809 1px,transparent 1px);background-size:30px 30px;mask-image:radial-gradient(ellipse at center,#000 22%,transparent 78%)}
.mk-topology:before,.mk-topology:after{content:"";position:absolute;inset:24% 31%;border:1px solid #3976e829;border-radius:50%;animation:mk-ring 8s ease-out infinite;pointer-events:none}.mk-topology:after{animation-delay:-4s}
.mk-topology-lines{position:absolute;inset:0;width:100%;height:100%;stroke-width:1.5}.mk-wire{stroke:#87aceb}.mk-packet{stroke:#2457db;stroke-width:3;stroke-dasharray:12 330;stroke-linecap:round;animation:mk-packet 9s linear infinite}.mk-packet:nth-of-type(6){animation-delay:-2.1s}.mk-packet:nth-of-type(7){animation-delay:-4.2s}.mk-packet:nth-of-type(8){animation-delay:-6.3s}
.mk-topology-center{position:absolute;left:50%;top:50%;z-index:2;transform:translate(-50%,-50%);width:176px;height:176px;display:flex;flex-direction:column;align-items:center;justify-content:center;border:1px solid #9ebcf1;border-radius:26px;background:#fff;box-shadow:0 22px 55px #17439428;color:#102758}.mk-center-icon{display:grid;place-items:center;width:57px;height:57px;margin-bottom:9px;border-radius:16px;background:#edf4ff}.mk-center-icon img{max-width:44px;max-height:38px}.mk-topology-center strong{font-size:20px;letter-spacing:-.04em}.mk-topology-center small{font-size:10px;color:#567098;margin-top:4px}.mk-topology-center i{position:absolute;top:14px;right:14px;width:7px;height:7px;border-radius:50%;background:#18b88b;box-shadow:0 0 0 5px #18b88b1e}
.mk-topology-node{position:absolute;z-index:1;display:flex;align-items:center;gap:9px;min-width:115px;padding:11px 13px;border:1px solid #c9d9f2;border-radius:12px;background:#fff;box-shadow:0 13px 32px #17439413;color:#19345f;font-size:12px;font-weight:650;animation:mk-float 5s ease-in-out infinite}.mk-topology-node .icon{width:17px;height:17px;color:#2457db}.mk-node-routing{left:5%;top:18%}.mk-node-firewall{right:5%;top:18%;animation-delay:-1.2s}.mk-node-vpn{left:5%;bottom:19%;animation-delay:-2.5s}.mk-node-cloud{right:5%;bottom:19%;animation-delay:-3.7s}
.mk-topology-caption{position:absolute;bottom:15px;left:22px;display:flex;align-items:center;gap:9px;color:#6980a3;font-size:9px;font-weight:700;letter-spacing:.12em}.mk-caption-light{width:6px;height:6px;border-radius:50%;background:#18b88b;box-shadow:0 0 0 4px #18b88b1c}
[data-theme=dark] .mk-topology{border-color:#344b70;background:radial-gradient(circle at 50% 50%,#20395e,#101b30 75%)}[data-theme=dark] .mk-topology-center,[data-theme=dark] .mk-topology-node{background:#16243b;border-color:#46618a;color:#ecf3ff}[data-theme=dark] .mk-center-icon{background:#fff}[data-theme=dark] .mk-topology-center small,[data-theme=dark] .mk-topology-caption{color:#a9bedc}[data-theme=dark] .mk-wire{stroke:#537cb6}
@keyframes mk-packet{to{stroke-dashoffset:-684}}@keyframes mk-ring{0%{transform:scale(.6);opacity:.55}100%{transform:scale(1.65);opacity:0}}@keyframes mk-float{50%{transform:translateY(-5px)}}
@media(max-width:1000px){.mk-hero .mv-hero-grid{gap:25px}.mk-topology{height:390px}.mk-topology-center{width:145px;height:145px}.mk-topology-node{min-width:95px;padding:9px;font-size:11px}.mk-node-routing,.mk-node-vpn{left:3%}.mk-node-firewall,.mk-node-cloud{right:3%}}
@media(max-width:760px){.mk-hero .mv-hero-grid{grid-template-columns:minmax(0,1fr);min-height:0}.mk-topology{height:360px;max-width:620px;width:100%;margin:5px auto 15px}.mk-topology-center{width:132px;height:132px}.mk-topology-center strong{font-size:17px}.mk-topology-center small{font-size:8px}.mk-topology-node{min-width:0;font-size:10px;gap:5px}.mk-topology-node .icon{width:14px;height:14px}}
@media(max-width:420px){.mk-topology{height:320px}.mk-topology-center{width:105px;height:105px;border-radius:19px}.mk-center-icon{width:36px;height:36px;margin-bottom:3px}.mk-center-icon img{max-width:31px}.mk-topology-center strong{font-size:14px}.mk-topology-center small{font-size:7px}.mk-topology-node{padding:7px}.mk-topology-node span{max-width:65px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mk-topology-caption{font-size:7px}}
@media(prefers-reduced-motion:reduce){.mk-topology:before,.mk-topology:after,.mk-packet,.mk-topology-node{animation:none}}