/* Keep the globe square at every breakpoint; animate its position, never its scale. */
.partner-link { display: block; color: inherit; }
.partner-link:hover h3 { color: var(--blue); }
.visual {
  display: grid;
  place-items: center;
  isolation: isolate;
}
.globe {
  position: relative;
  inset: auto;
  width: min(100%, 460px);
  height: auto;
  aspect-ratio: 1 / 1;
  flex-shrink: 0;
  filter: none;
  animation: earth-drift 14s ease-in-out infinite;
}
.globe::before {
  content: "";
  position: absolute;
  inset: 7%;
  border-radius: 50%;
  background: var(--cs-cyan);
  filter: blur(48px);
  opacity: .12;
  z-index: -1;
}
.earth-surface {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  aspect-ratio: 1;
}
.globe .earth-routes {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  pointer-events: none;
}
.connection {
  fill: none;
  stroke: url(#route-light);
  stroke-width: 2.4;
  vector-effect: non-scaling-stroke;
  stroke-linecap: round;
  stroke-dasharray: 1 2.5;
  filter: drop-shadow(0 0 3px var(--cs-cyan));
  animation: connection-flow 24s linear infinite;
}
.connection-sea { stroke: url(#route-china-fade); opacity: .95; animation-duration: 36s; }
.connection-africa { stroke: url(#route-africa-light); animation-duration: 30s; }
.route-traveler {
  fill: #fff;
  stroke: var(--cs-cyan);
  stroke-width: 1;
  filter: drop-shadow(0 0 5px var(--cs-cyan));
}
.route-label {
  fill: white;
  font-family: Montserrat, Arial, sans-serif;
  font-size: 10px;
  font-weight: 600;
  paint-order: stroke fill;
  stroke: var(--cs-navy);
  stroke-width: 3px;
  stroke-linejoin: round;
}
.route-label--china { fill: white; }
.connection-point {
  fill: #fff;
  stroke: var(--cs-cyan);
  stroke-width: 1.5;
  filter: drop-shadow(0 0 6px var(--cs-cyan));
}
.connection-beacon { fill: none; stroke: white; stroke-width: 1.6; opacity: .95; }
.transport {
  z-index: 2;
  border-color: color-mix(in srgb,var(--cs-cyan) 15%,transparent);
  box-shadow: 0 12px 36px #0002;
  background: color-mix(in srgb,var(--cs-navy) 81%,transparent);
}
.air { top: 84px; right: -2px; }
.sea { bottom: 65px; left: -12px; }
@keyframes earth-drift {
  0%, 100% { transform: translateY(3px) rotate(-2deg); }
  50% { transform: translateY(-5px) rotate(0deg); }
}
@keyframes connection-flow { to { stroke-dashoffset: -100; } }
@media (max-width: 900px) {
  .globe { width: min(100%, 360px); }
  .air { top: 55px; right: 0; }
  .sea { bottom: 55px; left: 0; }
}
@media (max-width: 640px) {
  .visual { height: auto; min-height: 350px; margin-top: 12px; padding: 24px 0 30px; }
  .globe { width: min(100%, 330px); }
  .air { top: 70px; }
  .sea { bottom: 60px; }
}
@media (prefers-reduced-motion: reduce) {
  .globe, .connection { animation: none; }
  .route-traveler { display: none; }
}