/* Map coordinates are the top-left of each original 1vw marker. */
.jj-site .home-global .map-point {
  width: 1vw;
  height: 1vw;
  padding: 0;
  margin: 0;
  transform: none;
  z-index: 2;
}

.jj-site .home-global .map-point span,
.jj-site .home-global .map-point::before,
.jj-site .home-global .map-point::after {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  border: clamp(1px, .1vw, 2px) solid #b6d976;
  border-radius: 50%;
  background: #80b52b;
  box-shadow: none;
  opacity: .9;
  transform: rotateX(49deg) scale(1);
  transform-origin: center;
  pointer-events: none;
  animation: jj-map-point-pulse 2s cubic-bezier(.215, .61, .355, 1) infinite;
  animation-play-state: paused;
}

.jj-site .home-global .map-point::before {
  content: "";
  z-index: 1;
  animation-delay: .2s;
}

.jj-site .home-global .map-point::after {
  content: "";
  z-index: 2;
  animation-delay: .4s;
}

.jj-site .home-global .map-point span {
  z-index: 3;
  animation-delay: .6s;
}

.jj-site .home-global.map-in-view .map-point span,
.jj-site .home-global.map-in-view .map-point::before,
.jj-site .home-global.map-in-view .map-point::after {
  animation-play-state: running;
}

/* Region tint, marker, arrow, and flags form separate visual layers. */
.jj-site .home-global .map-overlay img:first-child { z-index: 1; }
.jj-site .home-global .global-map-arrows { z-index: 3; }
.jj-site .home-global .map-overlay img:last-child { z-index: 4; }

@keyframes jj-map-point-pulse {
  0%, 100% { opacity: .9; transform: rotateX(49deg) scale(1); }
  50% { opacity: .25; transform: rotateX(49deg) scale(2); }
}

@media (prefers-reduced-motion: reduce) {
  .jj-site .home-global .map-point span,
  .jj-site .home-global .map-point::before,
  .jj-site .home-global .map-point::after {
    animation: none;
  }
}