/* Fourth-round supplement. Bounded native SVG; every moving effect uses the
   same visibility-controlled clock. Static gradients need no blur filters. */
.tech-earth-host { position: relative; display: block; flex: none; isolation: isolate; contain: layout style; }
.tech-earth-host::before { content: ''; position: absolute; inset: 5%; z-index: -1; border-radius: 50%; background: radial-gradient(circle, #8ecddb1f 0, #a5dce515 52%, transparent 73%); pointer-events: none; }
.tech-earth-svg { display: block; width: 100%; height: 100%; overflow: visible; }
.tech-earth-fallback { display: block; width: 100%; height: 100%; object-fit: contain; }
.ip-check-hint { color: var(--xb-brand-navy); letter-spacing: .02em; font-weight: 650; }
.ip-check-link .tech-earth-host { filter: none; }
.tech-earth-host[data-tech-earth-tier="low"]::before,
.tech-earth-host[data-tech-earth-tier="static"]::before { background: none; }
.banner-ip-check .ip-check-link:focus-visible { outline: 2px solid #2563eb; outline-offset: 4px; border-radius: 16px; }
@media (min-width: 1024px) {
  .banner.banner-ip-check { grid-template-columns: minmax(0, 1fr) minmax(310px, .85fr); gap: 28px; }
  .banner-ip-check .ip-check-link { justify-content: center; gap: clamp(8px, 1vw, 14px); padding: 8px; transform: translateX(-12px); }
  .banner-ip-check .ip-check-earth { width: clamp(148px, 14vw, 178px); height: clamp(148px, 14vw, 178px); }
  .banner-ip-check .ip-check-hint { font-size: clamp(13px, 1vw, 15px); }
}
@media (max-width: 699px) {
  .banner-ip-check .ip-check-link { gap: 3px; padding: 3px; }
  .banner-ip-check .ip-check-earth { width: 110px; height: 110px; }
  .banner-ip-check .ip-check-hint { font-size: 12px; }
}
@media (max-width: 359px) {
  .banner-ip-check .ip-check-earth { width: 96px; height: 96px; }
}
@media (prefers-reduced-motion: reduce) {
  .tech-earth-svg, .tech-earth-svg * { animation: none !important; transition: none !important; }
}


/* Desktop tech banner polish; keeps IP quality-check link clickable. */
@media (min-width: 1024px) {
  .banner.banner-ip-check-tech {
    position: relative;
    overflow: hidden;
    border: 1px solid #9ec5ff88;
    background:
      radial-gradient(120% 90% at 12% 10%, #d9ecff 0%, transparent 55%),
      radial-gradient(90% 80% at 88% 30%, #b7f0ff66 0%, transparent 50%),
      linear-gradient(120deg, #eaf3ff 0%, #f4fbff 48%, #e7f6ff 100%);
    box-shadow: inset 0 1px 0 #ffffffaa, 0 18px 40px #1d4ed81a;
  }
  .banner.banner-ip-check-tech::before {
    content: '';
    position: absolute;
    inset: 0;
    pointer-events: none;
    background-image:
      linear-gradient(#3b82f614 1px, transparent 1px),
      linear-gradient(90deg, #3b82f614 1px, transparent 1px);
    background-size: 28px 28px;
    mask-image: linear-gradient(90deg, transparent, #000 18%, #000 82%, transparent);
    opacity: .55;
  }
  .banner.banner-ip-check-tech::after {
    content: '';
    position: absolute;
    width: 220%;
    height: 90px;
    left: -60%;
    top: -40px;
    pointer-events: none;
    background: linear-gradient(90deg, transparent, #ffffff66, transparent);
    transform: rotate(8deg);
    animation: bannerTechSweep 5.5s ease-in-out infinite;
  }
  .banner-ip-check-tech .banner-ip-copy h2 {
    letter-spacing: .04em;
    text-shadow: 0 0 18px #60a5fa55;
  }
  .banner-ip-check-tech .ip-check-link {
    position: relative;
    z-index: 1;
    border: 1px solid #93c5fd88;
    background: #ffffffb8;
    backdrop-filter: blur(6px);
    box-shadow: 0 10px 28px #2563eb22;
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
  }
  .banner-ip-check-tech .ip-check-link:hover {
    transform: translateY(-2px);
    border-color: #60a5fa;
    box-shadow: 0 16px 34px #2563eb33;
  }
  .banner-ip-check-tech .ip-check-hint {
    color: #1d4ed8;
  }
}
@keyframes bannerTechSweep {
  0%, 100% { transform: translateX(-8%) rotate(8deg); opacity: .15; }
  50% { transform: translateX(18%) rotate(8deg); opacity: .45; }
}
@media (prefers-reduced-motion: reduce) {
  .banner.banner-ip-check-tech::after { animation: none; }
}

/* Tech banner v2 — ripples origin = Earth center (all widths); no L→R sweep. */
.banner.banner-ip-check-tech-v2 {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border: 1px solid #38bdf866;
  border-radius: 18px;
  background:
    linear-gradient(#38bdf812 1px, transparent 1px),
    linear-gradient(90deg, #38bdf812 1px, transparent 1px),
    radial-gradient(40% 80% at 8% 20%, #22d3ee33 0%, transparent 60%),
    radial-gradient(45% 70% at 85% 50%, #6366f128 0%, transparent 55%),
    radial-gradient(30% 50% at 55% 0%, #0ea5e933 0%, transparent 70%),
    linear-gradient(135deg, #071426 0%, #0b1f3a 42%, #102a4a 72%, #0a1a30 100%);
  background-size:
    22px 22px,
    22px 22px,
    auto,
    auto,
    auto,
    auto;
  box-shadow:
    inset 0 1px 0 #ffffff22,
    inset 0 -1px 0 #38bdf822,
    0 0 0 1px #0ea5e91a,
    0 16px 36px #02061766;
}
/* No banner-level ripple seeds (those sat in the middle on mobile). */
.banner.banner-ip-check-tech-v2::before,
.banner.banner-ip-check-tech-v2::after {
  content: none;
  display: none;
  animation: none;
}
.banner-ip-check-tech-v2 .banner-ip-copy {
  position: relative;
  z-index: 2;
}
.banner-ip-check-tech-v2 .banner-ip-copy h2 {
  margin: 0 0 8px;
  color: #e8f6ff;
  letter-spacing: .06em;
  text-shadow:
    0 0 10px #22d3ee77,
    0 0 28px #0ea5e955,
    0 2px 0 #02061788;
}
.banner-ip-check-tech-v2 .banner-ip-copy p {
  color: #9ad7f0;
  text-shadow: 0 0 8px #0ea5e944;
}
.banner-ip-check-tech-v2 .ip-check-link {
  position: relative;
  z-index: 2;
  overflow: visible;
  border: none;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
.banner-ip-check-tech-v2 .ip-check-link::before {
  content: none;
  display: none;
}
.banner-ip-check-tech-v2 .ip-check-hint {
  color: #e0f7ff;
  font-weight: 700;
  letter-spacing: .04em;
  text-shadow: 0 0 8px #22d3ee77;
}
.banner-ip-check-tech-v2 .ip-check-arrow {
  color: #67e8f9;
  filter: drop-shadow(0 0 5px #22d3ee);
}
.banner-ip-check-tech-v2 .ip-check-earth {
  position: relative;
  z-index: 2;
  overflow: visible;
  contain: none;
  isolation: isolate;
  filter: drop-shadow(0 0 14px #22d3ee77) drop-shadow(0 8px 14px #02061799);
}
/* Soft core + dual full-banner ripples, transform-origin = globe center. */
.banner-ip-check-tech-v2 .ip-check-earth::before,
.banner-ip-check-tech-v2 .ip-check-earth::after {
  content: '';
  position: absolute;
  left: 50%;
  top: 50%;
  width: 10px;
  height: 10px;
  margin: 0;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  transform-origin: center center;
  pointer-events: none;
  z-index: -1;
  background: transparent;
  border: none;
  box-shadow:
    0 0 0 0 #22d3ee00,
    0 0 0 0 #38bdf800,
    0 0 0 0 #67e8f900;
}
.banner-ip-check-tech-v2 .ip-check-earth::before {
  /* faint core glow under rings */
  background: radial-gradient(circle, #22d3ee33 0%, transparent 70%);
  animation: bannerEarthRippleFull 4.2s cubic-bezier(.12,.65,.22,1) infinite;
}
.banner-ip-check-tech-v2 .ip-check-earth::after {
  animation: bannerEarthRippleFull 4.2s cubic-bezier(.12,.65,.22,1) infinite;
  animation-delay: 2.1s;
}

@media (min-width: 1024px) {
  .banner.banner-ip-check-tech-v2 {
    min-height: 236px;
    border-radius: 22px;
    box-shadow:
      inset 0 1px 0 #ffffff22,
      inset 0 -1px 0 #38bdf822,
      0 0 0 1px #0ea5e91a,
      0 24px 60px #02061788;
  }
  .banner-ip-check-tech-v2 .banner-ip-copy {
    padding-left: 4px;
  }
  .banner-ip-check-tech-v2 .banner-ip-copy h2 {
    margin: 0 0 12px;
    font-size: clamp(28px, 2.4vw, 36px);
    letter-spacing: .08em;
    text-shadow:
      0 0 12px #22d3ee88,
      0 0 36px #0ea5e966,
      0 2px 0 #02061788;
  }
  .banner-ip-check-tech-v2 .banner-ip-copy p {
    font-size: 16px;
    letter-spacing: .04em;
  }
  .banner-ip-check-tech-v2 .ip-check-link {
    gap: 14px;
    padding: 8px 4px;
    transform: translateX(-8px);
    transition: filter .22s ease, transform .22s ease;
  }
  .banner-ip-check-tech-v2 .ip-check-link:hover {
    transform: translateX(-8px) translateY(-2px);
    border: none;
    box-shadow: none;
    filter: saturate(1.12) brightness(1.06);
  }
  .banner-ip-check-tech-v2 .ip-check-hint {
    letter-spacing: .06em;
    text-shadow: 0 0 10px #22d3ee88;
  }
  .banner-ip-check-tech-v2 .ip-check-earth {
    filter: drop-shadow(0 0 18px #22d3ee88) drop-shadow(0 10px 18px #020617aa);
  }
}

@keyframes bannerEarthRippleFull {
  0% {
    box-shadow:
      0 0 0 12px #67e8f966,
      0 0 0 36px #22d3ee44,
      0 0 0 72px #38bdf828,
      0 0 0 120px #0ea5e914;
    opacity: .95;
  }
  55% { opacity: .55; }
  100% {
    box-shadow:
      0 0 0 220px #67e8f900,
      0 0 0 420px #22d3ee00,
      0 0 0 700px #38bdf800,
      0 0 0 980px #0ea5e900;
    opacity: 0;
  }
}
@media (prefers-reduced-motion: reduce) {
  .banner-ip-check-tech-v2 .ip-check-earth::before,
  .banner-ip-check-tech-v2 .ip-check-earth::after { animation: none !important; opacity: .35; box-shadow: none; }
}