.home-hero{
  background-image:
    radial-gradient(circle at 14% 18%,var(--color-accent-soft),transparent 31%),
    linear-gradient(to bottom,transparent,var(--color-bg));
}
.home-hero .hero-preview-in{
  padding-top:34px;
  padding-bottom:18px;
}
.hero-kicker{
  width:max-content;
  margin-bottom:18px;
}
.home-hero .hero-title{
  max-width:720px;
}
.home-hero .hero-lead{
  max-width:680px;
  margin-top:22px;
}
.hero-side-title{
  color:var(--color-text);
  font-family:var(--font-display);
  font-size:20px;
  font-weight:900;
}
.hero-platforms{
  gap:10px 16px;
  margin-top:15px;
}
.hero-platforms li{
  min-height:28px;
  padding:4px 0;
  color:var(--color-text);
}
.hero-platforms svg{
  width:18px;
  height:18px;
  color:var(--color-accent);
}
.popular-routes{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:18px;
  padding-top:17px;
  border-top:1px solid var(--color-border);
}
.popular-route{
  display:flex;
  min-width:0;
  align-items:center;
  gap:7px;
  padding:6px 9px;
  border:1px solid var(--color-border);
  border-radius:var(--radius-pill);
  background:var(--color-panel);
  color:var(--color-muted);
  font-size:12px;
  font-weight:800;
}
.popular-route svg{
  width:24px;
  height:16px;
  flex-shrink:0;
  border-radius:3px;
}
.home-hero .hero-stage{
  margin-top:24px;
  padding-bottom:48px;
}
.stage-line-art{
  position:absolute;
  inset:0;
  z-index:0;
  width:100%;
  height:100%;
  color:var(--color-accent);
  opacity:.45;
  pointer-events:none;
}
.home-hero .device-wrap{
  width:82%;
}
.home-hero .route-list li{
  padding-top:10px;
  padding-bottom:10px;
}
.hero-word{
  opacity:1;
  transform:none;
}
.home-enhanced .hero-word{
  animation:home-word-rise .58s cubic-bezier(.22,.7,.3,1) both;
}
.home-enhanced .hero-copy .hero-title .hero-word:first-child{animation-delay:.08s}
.home-enhanced .hero-copy .hero-title .hero-word:last-child{animation-delay:.18s}
.home-enhanced .hero-copy .cta-row{animation-delay:.3s}
.home-enhanced .hero-copy .hero-lead{animation-delay:.4s}
.home-enhanced .hero-copy .trust-row{animation-delay:.5s}
.home-enhanced .hero-side{animation-delay:.34s}
@keyframes home-word-rise{
  from{opacity:0;transform:translateY(20px)}
  to{opacity:1;transform:none}
}

.fact-band{
  border-top:1px solid var(--color-border);
  border-bottom:1px solid var(--color-border);
  background:var(--color-accent);
  color:var(--color-white);
}
.fact-band-in{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  min-height:74px;
  align-items:center;
}
.fact-band span{
  display:grid;
  gap:1px;
  min-width:0;
  padding:12px 20px;
  border-left:1px solid var(--color-accent-dark);
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.04em;
}
.fact-band span:last-child{
  border-right:1px solid var(--color-accent-dark);
}
.fact-band b{
  color:var(--color-white);
  font-size:17px;
  letter-spacing:0;
}

.home-difference{
  display:grid;
  grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);
  gap:clamp(30px,6vw,78px);
  margin-top:84px;
  padding:38px;
  border:1px solid var(--color-border);
  border-radius:var(--radius-md);
  background:var(--color-panel-alt);
  box-shadow:var(--shadow-card);
}
.difference-copy{
  display:grid;
  gap:18px;
  color:var(--color-muted);
}

.route-guide{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
  margin-top:28px;
}
.route-guide article{
  min-width:0;
  padding:24px;
  border-top:3px solid var(--color-accent);
  background:var(--color-bg);
}
.route-guide h3{
  font-size:21px;
}
.route-guide p{
  margin-top:10px;
  color:var(--color-muted);
  font-size:14px;
}
.status-preview{
  display:grid;
  grid-template-columns:minmax(220px,.42fr) minmax(0,1fr);
  gap:28px;
  align-items:start;
  margin-top:36px;
  padding:28px;
  border:1px solid var(--color-border);
  border-radius:var(--radius-md);
  background:var(--color-bg);
}
.status-preview h3{
  font-size:22px;
}
.status-preview p:last-child{
  margin-top:10px;
  color:var(--color-muted);
  font-size:14px;
}
.server-status{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
  min-width:0;
}
.srv-row{
  display:grid;
  grid-template-columns:auto auto minmax(0,1fr) auto auto;
  gap:8px;
  min-width:0;
  align-items:center;
  padding:10px 12px;
  border:1px solid var(--color-border);
  border-radius:var(--radius-sm);
  background:var(--color-panel);
  font-family:var(--font-mono);
  font-size:11px;
}
.srv-dot{
  width:7px;
  height:7px;
  flex-shrink:0;
  border-radius:50%;
  background:var(--color-success);
  animation:srv-pulse 2.2s ease-in-out infinite;
}
.srv-flag{
  width:24px;
  height:16px;
  overflow:hidden;
  border-radius:3px;
}
.srv-name{
  min-width:0;
  overflow:hidden;
  font-weight:800;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.srv-type{
  max-width:100%;
  overflow:hidden;
  padding:2px 6px;
  border-radius:var(--radius-pill);
  color:var(--color-accent-dark);
  background:var(--color-accent-soft);
  text-overflow:ellipsis;
  white-space:nowrap;
}
.srv-ms,.srv-bw{
  color:var(--color-muted);
  white-space:nowrap;
}
@keyframes srv-pulse{
  0%,100%{opacity:.55;transform:scale(.86)}
  50%{opacity:1;transform:scale(1)}
}
.section-link{
  display:flex;
  justify-content:flex-end;
  margin-top:28px;
}
.client-note{
  margin-top:28px;
}
.client-note a{
  color:var(--color-accent);
  font-weight:800;
  text-decoration:underline;
  text-underline-offset:3px;
}

.plan-summary{
  margin-top:18px;
  color:var(--color-muted);
  font-size:14px;
}
.traffic-pack-note{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:30px;
  align-items:center;
  margin-top:34px;
  padding:30px;
  border:1px solid var(--color-border);
  border-radius:var(--radius-md);
  background:var(--color-bg);
}
.traffic-pack-note h3{
  font-size:24px;
}
.traffic-pack-note p:last-child{
  max-width:800px;
  margin-top:10px;
  color:var(--color-muted);
}
.plan-explainer{
  max-width:900px;
  margin-top:32px;
  padding-left:22px;
  border-left:5px solid var(--color-accent);
}
.plan-explainer h3{
  font-size:23px;
}
.plan-explainer p{
  margin-top:10px;
  color:var(--color-muted);
}
.home-article-grid{
  grid-template-columns:repeat(4,minmax(0,1fr));
}
.home-article-grid .article-card h3{
  font-size:19px;
}

@media (max-width:1100px){
  .home-article-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .server-status{
    grid-template-columns:1fr;
  }
}
@media (max-width:960px){
  .home-hero .hero-side{
    display:grid;
    padding-top:4px;
  }
  .home-hero .hero-stage{
    margin-top:30px;
  }
  .home-hero .device-wrap{
    width:92%;
  }
  .status-preview{
    grid-template-columns:1fr;
  }
}
@media (max-width:768px){
  .home-hero .hero-preview-in{
    padding-top:26px;
  }
  .fact-band-in{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .fact-band span:nth-child(odd){
    border-left:0;
  }
  .fact-band span:last-child{
    border-right:0;
  }
  .home-difference{
    grid-template-columns:1fr;
    margin-top:58px;
    padding:26px;
  }
  .route-guide{
    grid-template-columns:1fr;
  }
  .traffic-pack-note{
    grid-template-columns:1fr;
  }
  .home-article-grid{
    grid-template-columns:1fr;
  }
}
@media (max-width:640px){
  .hero-kicker{
    width:100%;
  }
  .home-hero .hero-lead{
    margin-top:18px;
    font-size:15px;
  }
  .home-hero .trust-row{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:8px;
  }
  .home-hero .trust-row .chip{
    min-width:0;
    justify-content:flex-start;
    padding-inline:10px;
    font-size:10px;
  }
  .hero-platforms{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
  }
  .hero-platforms li{
    min-width:0;
  }
  .popular-routes{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
  .popular-route{
    padding-inline:7px;
  }
  .home-hero .hero-stage{
    margin-top:26px;
    padding-bottom:30px;
  }
  .home-hero .device-wrap{
    width:100%;
  }
  .stage-line-art{
    display:none;
  }
  .fact-band span{
    padding-inline:12px;
  }
  .home-difference{
    padding:22px;
  }
  .home-difference .no-break{
    white-space:normal;
  }
  .status-preview{
    padding:20px;
  }
  .srv-row{
    grid-template-columns:auto auto minmax(0,1fr) auto;
  }
  .srv-bw{
    display:none;
  }
  .traffic-pack-note{
    padding:22px;
  }
  .section-link{
    display:grid;
  }
}
@media (max-width:390px){
  .home-hero .trust-row{
    grid-template-columns:1fr;
  }
  .hero-platforms{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .popular-routes{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}
@media (prefers-reduced-motion:reduce){
  .home-enhanced .hero-word{
    animation:none;
    opacity:1;
    transform:none;
  }
  .srv-dot{
    animation:none;
  }
}