.distribution-map {
  position: relative;
  margin-top: 12px;
  overflow: hidden;
  border: 1px solid #e2ece7;
  border-radius: 14px;
  background: radial-gradient(circle at 52% 48%, rgba(42, 158, 114, .12), transparent 42%), linear-gradient(180deg, #fbfefd, #f2f8f5);
}
.distribution-map[hidden] { display: none; }
.distribution-map::before { position: absolute; inset: 0; background-image: radial-gradient(#b7d7cb 1px, transparent 1px); background-size: 18px 18px; content: ''; opacity: .3; pointer-events: none; }
.distribution-map svg { position: relative; display: block; width: 100%; height: auto; }
.distribution-map__geography { opacity: .88; filter: brightness(0) saturate(100%) invert(65%) sepia(23%) saturate(779%) hue-rotate(105deg) brightness(91%) contrast(88%); }
.distribution-map__routes path { fill: none; stroke: #087ad1; stroke-width: 2.15; stroke-linecap: round; stroke-dasharray: 8 10; opacity: .44; filter: var(--distribution-route-glow, none); animation: distribution-route-flow 7s linear infinite; animation-delay: var(--route-delay, 0s); }
.distribution-map__city-dot { fill: #08714f; stroke: #fff; stroke-width: 3; filter: drop-shadow(0 2px 4px rgba(3, 29, 62, .3)); transform-box: fill-box; transform-origin: center; transition: transform .18s ease, fill .18s ease; }
.distribution-map__hub-ring { fill: rgba(0, 94, 64, .12); stroke: #00714e; stroke-width: 2; }
.distribution-map__destination--hub .distribution-map__city-dot { fill: #f0ae00; }
.distribution-map__destination { outline: none; }
.distribution-map__destination:hover .distribution-map__city-dot { fill: #f0ae00; transform: scale(1.45); }
.distribution-map__leader { stroke: #164f65; stroke-width: 1.5; stroke-linecap: round; opacity: .68; vector-effect: non-scaling-stroke; }
.distribution-map__label { pointer-events: none; }
.distribution-map__label rect { fill: rgba(6, 37, 74, .94); stroke: rgba(255, 255, 255, .8); stroke-width: 1; vector-effect: non-scaling-stroke; }
.distribution-map__label text { fill: #fff; font: 700 14px Arial, sans-serif; }
@keyframes distribution-route-flow { to { stroke-dashoffset: -72; } }
@media (prefers-reduced-motion: reduce) { .distribution-map__routes path { animation: none; } }
