/* First-screen visual refinement: a contained globe, readable service band,
   and fixed status labels that never clip against the viewport edge. */

.hero {
  min-height: 625px;
  padding-top: 74px;
}

.hero-copy {
  padding-top: 42px;
}

.hero-visual {
  min-height: 530px;
}

.globe {
  width: 600px;
  height: 410px;
  right: -16px;
  bottom: 4px;
  border-radius: 50% 50% 8% 8% / 100% 100% 4% 4%;
  box-shadow: 0 -8px 28px #4a84ff, 0 -24px 70px #3262ff63, inset 0 20px 74px #8eccff75;
}

.globe-grid {
  inset: 10px -42px -8px;
  background-size: auto, 44px 44px;
}

.orbit-one {
  width: 760px;
  height: 290px;
  right: -68px;
  top: 146px;
}

.orbit-two {
  width: 590px;
  height: 218px;
  right: -2px;
  top: 194px;
}

.floating-tag {
  padding: 8px 13px;
  border-color: #7daaff8f;
  background: #16346fdf;
  box-shadow: 0 8px 20px #07173796;
  font-family: "Microsoft YaHei UI", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0;
  animation: none;
  transform: none;
}

.tag-left {
  top: 112px;
  left: 26px;
}

.tag-right {
  top: 224px;
  right: 30px;
}

.ticker {
  margin-top: 0;
  background: #0a1020;
}

.ticker-track {
  justify-content: flex-start;
  gap: 42px;
  height: 72px;
  padding: 0 24px;
  color: #c3cde5;
  font-family: "Microsoft YaHei UI", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: .1px;
  animation: service-band 48s linear infinite;
  transform: translateZ(0);
  will-change: transform;
}

.ticker b {
  color: #79e1cb;
  font-size: 13px;
}

@keyframes service-band {
  to { transform: translate3d(-18%, 0, 0); }
}

@media (max-width: 900px) {
  .globe {
    width: 520px;
    height: 350px;
    right: -78px;
    bottom: 18px;
  }

  .tag-left { left: 8px; }
  .tag-right { right: 16px; }
}

@media (max-width: 680px) {
  .hero {
    min-height: 690px;
    padding-top: 46px;
  }

  .hero-visual {
    height: 285px;
    min-height: 0;
    margin-top: 10px;
  }

  .globe {
    width: 442px;
    height: 282px;
    right: -38px;
    bottom: 0;
  }

  .orbit-one {
    width: 500px;
    height: 185px;
    right: -98px;
    top: 72px;
  }

  .tag-left {
    top: 14px;
    left: 14px;
  }

  .tag-right {
    top: 145px;
    right: 13px;
  }

  .ticker-track {
    height: 62px;
    gap: 30px;
    padding: 0 18px;
    font-size: 13px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .ticker-track { animation: none; }
}

/* K2_ROUTE_CONSOLE_POLISH */
.feature-card-large {
  overflow: hidden;
  background: linear-gradient(135deg, rgba(22, 52, 104, .96), rgba(11, 19, 46, .98)) !important;
}
.feature-card-large::after {
  content: "";
  position: absolute;
  width: 18rem;
  height: 18rem;
  right: -6rem;
  bottom: -7rem;
  border-radius: 50%;
  border: 1px solid rgba(137, 187, 255, .16);
  box-shadow: 0 0 0 2.6rem rgba(92, 153, 255, .035), 0 0 0 5.2rem rgba(92, 153, 255, .025);
  pointer-events: none;
}
.route-console {
  position: relative;
  z-index: 1;
  margin-top: 1.8rem;
  min-height: 16.6rem;
  padding: 1rem 1rem .9rem;
  border: 1px solid rgba(159, 204, 255, .2);
  border-radius: 1rem;
  overflow: hidden;
  background: linear-gradient(145deg, rgba(4, 13, 34, .66), rgba(16, 44, 94, .38));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), 0 1.4rem 2.4rem rgba(0, 0, 0, .2);
}
.route-console::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: linear-gradient(rgba(131, 181, 255, .07) 1px, transparent 1px), linear-gradient(90deg, rgba(131, 181, 255, .07) 1px, transparent 1px);
  background-size: 1.55rem 1.55rem;
  mask-image: linear-gradient(to bottom, #000, transparent 88%);
  pointer-events: none;
}
.route-console-head, .route-metrics { display: flex; align-items: center; justify-content: space-between; gap: .8rem; position: relative; z-index: 1; }
.route-console-head { color: #e9f4ff; font-size: .7rem; letter-spacing: .08em; }
.route-console-head strong { padding: .28rem .52rem; border-radius: 999px; color: #bfe1ff; background: rgba(105, 176, 255, .13); font-size: .68rem; font-weight: 650; letter-spacing: .02em; }
.route-live { display: inline-flex; align-items: center; gap: .42rem; color: #9ec7ff; font-weight: 700; }
.route-live i { width: .38rem; height: .38rem; border-radius: 50%; background: #69e6b3; box-shadow: 0 0 .65rem #69e6b3; animation: routePulse 1.8s ease-in-out infinite; }
.route-map { position: relative; z-index: 1; height: 9.4rem; margin: .25rem 0 .32rem; }
.route-grid { position: absolute; left: 11%; right: 8%; top: 50%; border-top: 1px dashed rgba(155, 201, 255, .18); }
.route-link { position: absolute; height: 1px; transform-origin: left center; background: linear-gradient(90deg, #76c5ff, rgba(121, 192, 255, .12)); box-shadow: 0 0 .65rem rgba(83, 172, 255, .58); }
.link-one { left: 17%; top: 65%; width: 38%; transform: rotate(-24deg); }
.link-two { left: 17%; top: 65%; width: 59%; transform: rotate(-4deg); }
.link-three { left: 17%; top: 65%; width: 72%; transform: rotate(-38deg); opacity: .44; }
.route-node { position: absolute; display: grid; place-items: center; width: 2.65rem; height: 2.65rem; border: 1px solid rgba(166, 213, 255, .7); border-radius: 50%; color: #dceeff; background: radial-gradient(circle at 35% 30%, #357dcc, #0b2556 72%); box-shadow: 0 0 0 .3rem rgba(91, 169, 255, .07), 0 0 1.25rem rgba(67, 152, 255, .38); }
.route-node b { font-size: .74rem; line-height: 1; }
.route-node small { position: absolute; top: 3rem; color: #91b6e9; font-size: .58rem; white-space: nowrap; }
.route-origin { left: 8%; top: 56%; background: radial-gradient(circle at 35% 30%, #65d9ff, #1450aa 75%); }
.route-node-a { left: 48%; top: 34%; }
.route-node-b { left: 70%; top: 56%; }
.route-node-c { right: 6%; top: 17%; }
.route-packet { position: absolute; z-index: 2; width: .36rem; height: .36rem; border-radius: 50%; background: #d7f4ff; box-shadow: 0 0 .75rem #d7f4ff; }
.packet-one { left: 29%; top: 52%; animation: routePacketOne 2.6s linear infinite; }
.packet-two { left: 43%; top: 55%; animation: routePacketTwo 3.2s linear infinite; }
.route-metrics { padding-top: .72rem; border-top: 1px solid rgba(159, 204, 255, .13); }
.route-metrics span { display: grid; gap: .1rem; }
.route-metrics b { color: #eff8ff; font-size: .95rem; letter-spacing: -.02em; }
.route-metrics small { color: #8daed9; font-size: .62rem; }
@keyframes routePulse { 50% { opacity: .38; transform: scale(.76); } }
@keyframes routePacketOne { 0% { transform: translate(0, 0); opacity: 0; } 12% { opacity: 1; } 100% { transform: translate(8.9rem, -3.85rem); opacity: 0; } }
@keyframes routePacketTwo { 0% { transform: translate(0, 0); opacity: 0; } 14% { opacity: 1; } 100% { transform: translate(11rem, -.75rem); opacity: 0; } }
@media (max-width: 680px) { .route-console { min-height: 15.3rem; margin-top: 1.35rem; } .route-node-c { right: 2%; } .route-node-b { left: 67%; } }


/* K2_ROUTE_SIGNAL_REFINEMENT */
.route-console .route-packet { display: none; }
.route-console .route-link {
  overflow: visible;
  height: 2px;
  background: linear-gradient(90deg, rgba(69, 138, 230, .10), rgba(103, 190, 255, .46), rgba(60, 130, 226, .08));
  box-shadow: 0 0 8px rgba(77, 166, 255, .18);
}
.route-console .route-link::after {
  content: "";
  position: absolute;
  top: -2px;
  left: -34%;
  width: 30%;
  height: 5px;
  border-radius: 999px;
  opacity: 0;
  background: linear-gradient(90deg, transparent, rgba(134, 212, 255, .96), rgba(93, 171, 255, .72), transparent);
  box-shadow: 0 0 12px rgba(111, 195, 255, .76);
  animation: k2RouteSignalSweep 4.8s cubic-bezier(.42,0,.26,1) infinite;
}
.route-console .link-two::after { animation-delay: 1.25s; }
.route-console .link-three::after { animation-delay: 2.5s; }
.route-console .route-node { box-shadow: 0 0 0 .32rem rgba(91, 169, 255, .055), 0 0 1.1rem rgba(67, 152, 255, .25); }
.route-console .route-origin { box-shadow: 0 0 0 .38rem rgba(104, 217, 255, .075), 0 0 1.5rem rgba(83, 191, 255, .38); }
@keyframes k2RouteSignalSweep {
  0%, 9% { transform: translateX(0); opacity: 0; }
  16% { opacity: .92; }
  72% { opacity: .72; }
  88%, 100% { transform: translateX(470%); opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .route-console .route-link::after, .route-console .route-live i { animation: none; }
}