.network-earth{
  position:relative;
  display:block;
  height:145vh;
  min-height:1120px;
  padding:0;
  overflow:visible;
  background:linear-gradient(180deg,#fff 0%,#fcfdff 100%);
  border-top:1px solid #edf1f7;
}
.network-earth__sticky{
  position:sticky;
  top:80px;
  display:grid;
  grid-template-columns:minmax(0,.82fr) minmax(520px,1.18fr);
  gap:clamp(44px,5vw,92px);
  align-items:center;
  height:calc(100svh - 80px);
  min-height:640px;
  padding:44px 7.4vw 40px;
  overflow:hidden;
}
.network-earth:before{
  content:none;
}
.network-earth__copy,.network-earth__visual{position:relative;z-index:1}
.network-earth__copy{padding-top:34px}
.network-earth__index{
  position:absolute;
  top:-78px;
  left:-8px;
  color:#0b1726;
  opacity:.045;
  font-size:clamp(7rem,11vw,11rem);
  font-weight:320;
  line-height:1;
  letter-spacing:-.08em;
  user-select:none;
}
.network-earth h2{
  max-width:660px;
  margin:22px 0 22px;
  font-size:clamp(3rem,4.2vw,5.15rem);
  line-height:.98;
  letter-spacing:-.055em;
}
.network-earth h2 span{color:#1764ff}
.network-earth__lead{
  max-width:620px;
  margin:0;
  color:#5e6b80;
  font-size:1.06rem;
  line-height:1.72;
}
.network-earth__stats{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:0 34px;
  max-width:660px;
  margin-top:52px;
}
.network-earth__stat{
  position:relative;
  min-height:130px;
  padding:20px 0 18px 38px;
  border-top:1px solid #dce5f1;
}
.network-earth__stat-icon{
  position:absolute;
  top:21px;
  left:0;
  width:25px;
  height:25px;
  color:#1764ff;
}
.network-earth__stat-icon svg,.network-earth__device-icon svg{
  width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round
}
.network-earth__stat small{
  display:block;
  color:#1764ff;
  font-size:.84rem;
  font-weight:720;
  letter-spacing:.01em;
}
.network-earth__stat strong{
  display:block;
  margin-top:10px;
  color:#101827;
  font-size:clamp(2.25rem,3vw,3.35rem);
  font-weight:430;
  line-height:1;
  letter-spacing:-.045em;
}
.network-earth__note{
  display:block;
  max-width:620px;
  margin:44px 0 0;
  padding-left:18px;
  border-left:2px solid #1764ff;
  color:#697487;
  font-size:.9rem;
  line-height:1.55;
}
.network-earth__visual{
  display:grid;
  place-items:center;
  align-self:start;
  margin-top:42px;
  min-height:min(620px,calc(100svh - 178px));
  isolation:isolate;
  transform-origin:50% 56%;
  will-change:transform,opacity;
}
.network-earth.has-scroll-reveal .network-earth__visual{
  opacity:var(--earth-opacity,0);
  transform:translateY(var(--earth-shift,170px)) scale(var(--earth-scale,.18));
}
.network-earth__halo{
  position:absolute;
  z-index:-2;
  width:min(720px,58vw);
  aspect-ratio:1;
  border-radius:50%;
  background:radial-gradient(circle,rgba(24,185,129,.07),rgba(255,255,255,.02) 46%,transparent 70%);
  filter:blur(12px);
}
.network-earth__globe-stage{
  position:relative;
  display:block;
  width:min(620px,46vw,calc(100svh - 190px));
  aspect-ratio:1;
  cursor:grab;
  touch-action:none;
  user-select:none;
  outline:none;
  overflow:hidden;
  border-radius:50%;
  clip-path:circle(49.85% at 50% 50%);
  filter:drop-shadow(0 34px 44px rgba(6,48,90,.2));
  animation:labioEarthFloat 8s ease-in-out infinite;
}
.network-earth__globe-stage:focus-visible{
  border-radius:50%;
  box-shadow:0 0 0 3px rgba(23,100,255,.32);
}
.network-earth__globe-stage.is-dragging{cursor:grabbing;animation-play-state:paused}
.network-earth__canvas{
  position:absolute;
  inset:0;
  z-index:2;
  overflow:hidden;
  border-radius:50%;
  clip-path:circle(49.85% at 50% 50%);
  opacity:0;
  transition:opacity .5s ease;
}
.network-earth__canvas canvas{display:block;width:100%;height:100%;border-radius:50%;clip-path:circle(49.85% at 50% 50%)}
.network-earth__globe-stage.is-webgl-ready .network-earth__canvas{opacity:1}
.network-earth__globe-picture{
  position:absolute;
  inset:0;
  z-index:1;
  display:block;
  width:100%;
  overflow:hidden;
  border-radius:50%;
  clip-path:circle(49.85% at 50% 50%);
  transition:opacity .45s ease;
}
.network-earth__globe-stage.is-webgl-ready .network-earth__globe-picture{opacity:0}
.network-earth__globe{
  display:block;
  width:100%;
  height:auto;
  border-radius:50%;
  clip-path:circle(49.85% at 50% 50%);
  user-select:none;
  pointer-events:none;
}
@keyframes labioEarthFloat{50%{transform:translateY(-10px) scale(1.008)}}
.network-earth__drag-hint{
  position:absolute;
  left:50%;
  bottom:12%;
  display:flex;
  align-items:center;
  gap:8px;
  padding:9px 13px;
  border:1px solid rgba(255,255,255,.88);
  border-radius:999px;
  background:rgba(255,255,255,.78);
  color:#315274;
  box-shadow:0 10px 30px rgba(15,73,144,.12);
  backdrop-filter:blur(12px);
  font-size:.7rem;
  font-weight:750;
  white-space:nowrap;
  z-index:4;
  pointer-events:none;
  transform:translateX(-50%);
  transition:opacity .28s ease,transform .28s ease;
}
.network-earth__drag-hint svg{width:16px;height:16px;fill:none;stroke:#1764ff;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.network-earth__globe-stage.is-dragging .network-earth__drag-hint,
.network-earth__globe-stage.has-interacted .network-earth__drag-hint{opacity:0;transform:translateX(-50%) translateY(8px)}
.network-earth__device{
  position:absolute;
  z-index:4;
  display:flex;
  align-items:center;
  gap:11px;
  min-width:118px;
  padding:8px 12px 8px 9px;
  border:1px solid rgba(255,255,255,.82);
  border-radius:16px;
  background:rgba(255,255,255,.76);
  box-shadow:0 12px 28px rgba(20,65,126,.085);
  backdrop-filter:blur(16px) saturate(1.2);
  pointer-events:none;
}
.network-earth__device[hidden]{display:none!important}
.network-earth__device-icon{
  display:grid;
  place-items:center;
  width:32px;height:32px;padding:8px;border-radius:10px;background:rgba(235,244,255,.9);color:#1764ff
}
.network-earth__device-icon svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.network-earth__device small{display:block;color:#738096;font-size:.68rem;font-weight:750}
.network-earth__device strong{display:block;margin-top:0;color:#15233a;font-size:.95rem;font-weight:820}
.network-earth__device strong b{font:inherit}
.network-earth__device--mobile{
  left:var(--marker-x,72%);
  right:auto;
  top:var(--marker-y,57%);
  min-width:166px;
  border-color:rgba(35,197,143,.27);
  background:rgba(250,255,253,.88);
  box-shadow:0 15px 34px rgba(20,126,96,.14);
  opacity:0;
  transform:translate(-50%,calc(-100% - 38px));
  transition:opacity .22s ease,transform .22s ease;
}
.network-earth__device--mobile.is-marker-visible{opacity:1}
.network-earth__device--mobile .network-earth__device-icon{background:rgba(224,249,241,.95);color:#12a879}
.network-earth__device--mobile:after{
  content:"";
  position:absolute;
  left:50%;
  top:100%;
  width:1px;
  height:38px;
  background:linear-gradient(to bottom,rgba(24,185,129,.72),rgba(24,185,129,.14));
  box-shadow:0 0 12px rgba(24,185,129,.26);
}
.network-earth__device--mobile:before{
  content:"";
  position:absolute;
  z-index:2;
  left:calc(50% - 4px);
  top:calc(100% + 34px);
  width:8px;
  height:8px;
  border-radius:50%;
  background:#18b981;
  box-shadow:0 0 0 6px rgba(24,185,129,.15),0 0 22px rgba(24,185,129,.72);
}
.network-earth__device--desktop{right:5%;top:22%}
.network-earth__device--server{left:11%;bottom:17%}
.network-earth__panel{
  position:absolute;
  z-index:5;
  right:6%;
  bottom:4%;
  width:min(355px,58%);
  padding:20px;
  border:1px solid rgba(255,255,255,.88);
  border-radius:22px;
  background:rgba(249,252,255,.84);
  box-shadow:0 24px 65px rgba(20,67,133,.17);
  backdrop-filter:blur(18px);
}
.network-earth__panel-head{
  display:flex;justify-content:space-between;align-items:center;gap:16px;padding-bottom:13px;border-bottom:1px solid rgba(135,157,187,.26);font-size:.82rem;font-weight:850
}
.network-earth__live{display:flex;align-items:center;gap:7px;color:#5e6c80;font-size:.7rem;font-weight:750;text-transform:uppercase;letter-spacing:.06em}
.network-earth__live i{width:7px;height:7px;border-radius:50%;background:#18b981;box-shadow:0 0 0 4px rgba(24,185,129,.10)}
.network-earth__nodes{display:grid;gap:0;margin-top:5px}
.network-earth__node{
  display:grid;
  grid-template-columns:29px 1fr auto;
  gap:10px;
  align-items:center;
  min-height:47px;
  border-bottom:1px solid rgba(135,157,187,.18);
}
.network-earth__node:last-child{border-bottom:0}
.network-earth__node-icon{display:grid;place-items:center;width:28px;height:28px;color:#1764ff}
.network-earth__node-icon svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.network-earth__node b{display:block;overflow:hidden;color:#172033;font-size:.72rem;text-overflow:ellipsis;white-space:nowrap}
.network-earth__node small{display:block;margin-top:2px;color:#8490a1;font-size:.63rem;text-transform:capitalize}
.network-earth__status{display:flex;align-items:center;gap:5px;color:#8b96a6;font-size:.62rem;font-weight:760;text-transform:uppercase;letter-spacing:.04em}
.network-earth__status:before{content:"";width:6px;height:6px;border-radius:50%;background:#abb4c1}
.network-earth__status.online,.network-earth__status.busy{color:#118568}
.network-earth__status.online:before,.network-earth__status.busy:before{background:#18b981;box-shadow:0 0 0 3px rgba(24,185,129,.10)}
.network-earth__loading{padding:28px 0 18px;color:#7f8b9d;font-size:.76rem;text-align:center}

@media(max-width:1120px){
  .network-earth{height:auto;min-height:0;overflow:hidden}
  .network-earth__sticky{position:relative;top:auto;height:auto;min-height:0;grid-template-columns:1fr;padding:100px 6vw 112px}
  .network-earth__copy{max-width:780px}
  .network-earth__visual{width:min(820px,100%);min-height:620px;margin:0 auto}
  .network-earth__globe-stage{width:min(680px,82vw)}
  .network-earth__halo{width:min(720px,88vw)}
  .network-earth__device--server{left:4%;bottom:8%}
  .network-earth__panel{right:1%;bottom:1%}
}
@media(max-width:720px){
  .network-earth__sticky{gap:30px;min-height:0;padding:82px 5vw 88px}
  .network-earth__copy{padding-top:20px}
  .network-earth__index{top:-52px;font-size:7rem}
  .network-earth h2{font-size:clamp(2.7rem,13vw,4rem)}
  .network-earth__lead{font-size:1rem}
  .network-earth__stats{gap:0 18px;margin-top:38px}
  .network-earth__stat{min-height:112px;padding-left:31px}
  .network-earth__stat-icon{width:21px;height:21px}
  .network-earth__stat strong{font-size:2.25rem}
  .network-earth__note{margin-top:30px}
  .network-earth__visual{min-height:500px}
  .network-earth__globe-stage{width:min(520px,92vw)}
  .network-earth__device{min-width:112px;padding:9px 10px}
  .network-earth__device-icon{width:30px;height:30px}
  .network-earth__device--mobile{min-width:154px}
  .network-earth__device--desktop{right:0;top:14%}
  .network-earth__device--server{display:none}
  .network-earth__panel{right:2%;bottom:1%;width:88%;max-width:350px}
}
@media(prefers-reduced-motion:reduce){.network-earth__globe-stage{animation:none}.network-earth__canvas,.network-earth__globe-picture{transition:none}}
@media(prefers-reduced-motion:reduce){.network-earth.has-scroll-reveal .network-earth__visual{opacity:1;transform:none}}