/* ===== Hero globe ===== */
.hero-globe {
  position: absolute;
  top: 50%;
  right: -20px;
  width: clamp(344px, 30.4vw, 496px);
  aspect-ratio: 1 / 1;
  transform: translateY(-50%);
  z-index: 0;
  pointer-events: none;
  opacity: 0.95;
}

.hero-globe::before {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background:
    radial-gradient(circle at 46% 42%, rgba(104, 140, 216, 0.20), rgba(60, 92, 160, 0.06) 54%, transparent 70%);
  filter: blur(20px);
}

.hero-globe::after {
  content: '';
  position: absolute;
  inset: 5.5%;
  border-radius: 50%;
  box-shadow:
    inset 0 0 60px rgba(126, 164, 240, 0.12),
    0 0 42px 8px rgba(92, 130, 205, 0.10),
    0 0 120px 26px rgba(70, 105, 180, 0.10);
}

.hero-globe canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
}

.globe-canvas { z-index: 0; }
.globe-arcs { z-index: 1; }

.globe-pin {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px 4px 8px;
  border-radius: 999px;
  white-space: nowrap;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.4px;
  color: #fff;
  background: rgba(12, 13, 20, 0.74);
  border: 1px solid rgba(232, 66, 90, 0.48);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.45), 0 0 18px rgba(166, 25, 46, 0.22);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  transform: translate(-100%, -50%);
  opacity: 0;
  transition: opacity 0.4s ease;
}

.globe-pin::before {
  content: '';
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #ff5c70;
  box-shadow: 0 0 8px #ff5c70;
}

.globe-pin::after {
  content: '';
  position: absolute;
  left: 100%;
  top: 50%;
  width: 11px;
  height: 1px;
  background: linear-gradient(90deg, rgba(232, 66, 90, 0.75), rgba(232, 66, 90, 0));
}

@media (min-width: 1100px) {
  .page-hero { min-height: 600px; }
  .page-hero h1,
  .page-hero p { max-width: 740px; }
}

@media (min-width: 1100px) and (max-width: 1439px) {
  .page-hero h1,
  .page-hero p { max-width: calc(64vw - 90px); }
}

@media (max-width: 1439px) {
  .hero-globe { right: -24px; width: clamp(320px, 28.8vw, 416px); }
}

@media (min-width: 835px) and (max-width: 1099px) {
  .page-hero h1,
  .page-hero p { max-width: calc(100vw - 342px); }
}

@media (max-width: 1099px) {
  .hero-globe { right: -42px; width: 272px; top: calc(50% + 28px); opacity: 0.88; }
  .hero-globe::after { box-shadow: inset 0 0 40px rgba(126, 164, 240, 0.10); }
}

@media (max-width: 834px) {
  .hero-globe { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .globe-pin { transition: none; }
}
