/* Final viewport refinement: transparent canvas, white map, compact layout,
   and a continuous animated orbit around the whole Afghanistan map. */

.aa-map-canvas {
  isolation: auto;
  filter: none;
}

.aa-map-base {
  z-index: 1;
  opacity: 0.96;
  mix-blend-mode: screen;
  filter: invert(1) grayscale(1) brightness(3.35) contrast(1.32);
}

.aa-map-routes,
.aa-map-pin,
.aa-map-card { z-index: 4; }

.aa-map-canvas::before,
.aa-map-canvas::after {
  position: absolute;
  inset: 7% 3%;
  z-index: 2;
  border-radius: 48% 52% 46% 54% / 54% 44% 56% 46%;
  pointer-events: none;
  content: "";
}

.aa-map-canvas::before {
  padding: 2px;
  background: conic-gradient(
    from 0deg,
    transparent 0 9%,
    rgba(255, 255, 255, 0.9) 13%,
    rgba(169, 236, 0, 0.95) 17%,
    transparent 23% 48%,
    rgba(255, 255, 255, 0.72) 53%,
    rgba(76, 222, 214, 0.9) 58%,
    transparent 64% 85%,
    rgba(169, 236, 0, 0.82) 91%,
    transparent 97%
  );
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  opacity: 0.68;
  filter: drop-shadow(0 0 8px rgba(169, 236, 0, 0.5));
  animation: aa-map-orbit 8s linear infinite;
}

.aa-map-canvas::after {
  inset: 11% 7%;
  border: 1px solid rgba(255, 255, 255, 0.12);
  box-shadow:
    0 0 18px rgba(255, 255, 255, 0.08),
    0 0 42px rgba(169, 236, 0, 0.08);
  animation: aa-map-orbit-pulse 3.6s ease-in-out infinite;
}

@keyframes aa-map-orbit {
  to { transform: rotate(360deg); }
}

@keyframes aa-map-orbit-pulse {
  0%, 100% { opacity: 0.42; transform: scale(0.985); }
  50% { opacity: 0.9; transform: scale(1.02); }
}

@media (min-width: 1200px) {
  .aa-home-page .aa-map-hero {
    min-height: 880px;
  }

  .aa-home-page .aa-map-hero__inner {
    grid-template-columns: minmax(360px, 0.82fr) minmax(620px, 1.18fr);
    grid-template-rows: minmax(0, 1fr) auto auto;
    gap: 8px 34px;
    min-height: 880px;
    padding: 192px 0 22px;
  }

  .aa-map-hero__copy {
    padding-bottom: 22px;
  }

  .aa-map-experience {
    width: min(100%, 680px);
    justify-self: center;
  }

  .aa-map-pin__thumb {
    width: 34px;
    height: 34px;
  }

  .aa-map-pin.-hub .aa-map-pin__thumb {
    width: 48px;
    height: 48px;
  }

  .aa-map-pin__pulse {
    left: 24px;
    top: 24px;
    width: 48px;
    height: 48px;
  }

  .aa-map-pin__label strong { font-size: 0.69rem; }
  .aa-map-pin__label small { font-size: 0.56rem; }

  .aa-map-card {
    width: 210px;
    padding: 8px;
  }

  .aa-map-card__image {
    width: 66px;
    height: 64px;
  }

  .aa-route-planner {
    width: min(1100px, 88%);
    margin: -10px auto 0;
  }

  .aa-route-field {
    min-height: 58px;
    padding-block: 5px;
  }

  .aa-route-submit { min-height: 58px; }

  .aa-map-trust {
    gap: 54px;
  }

  .aa-map-trust i {
    width: 38px;
    height: 38px;
  }
}

@media (min-width: 1200px) and (max-height: 820px) {
  .aa-home-page .aa-map-hero,
  .aa-home-page .aa-map-hero__inner {
    min-height: 800px;
  }

  .aa-home-page .aa-map-hero__inner {
    padding-top: 178px;
  }

  .aa-map-experience {
    width: min(100%, 610px);
  }

  .aa-map-hero__copy {
    transform: scale(0.94);
    transform-origin: left center;
  }

  .aa-map-legend { margin-top: 18px; }
}

@media (max-width: 1199.98px) {
  .aa-map-experience {
    width: min(100%, 720px);
  }
}

@media (max-width: 767.98px) {
  .aa-map-canvas::before { inset: 5% 1%; }
  .aa-map-canvas::after { inset: 9% 5%; }
}

[dir="rtl"] .aa-map-hero__copy {
  transform-origin: right center;
}

@media (prefers-reduced-motion: reduce) {
  .aa-map-canvas::before,
  .aa-map-canvas::after {
    animation: none !important;
  }
}