.locations-section { padding: 68px 0 64px; background: linear-gradient(#fff, #f8fbff); }
.locations-heading { text-align: center; }
.locations-heading > p:not(.section-eyebrow) { margin: 14px 0; color: #818b9d; font-size: 16px; }
.map-viewport { width: 100%; overflow-x: auto; overflow-y: hidden; scrollbar-width: thin; }
.map-viewport:focus-visible { outline: 2px solid var(--color-primary); outline-offset: -2px; }
.world-map { position: relative; width: min(1800px, 100%); min-width: 960px; margin: 54px auto 25px; direction: ltr; isolation: isolate; }
.world-map > img { display: block; width: 100%; height: auto; opacity: .95; }
.map-pin { position: absolute; left: var(--x); top: var(--y); width: 32px; height: 40px; transform: translate(-50%, -90%); border: 0; padding: 0; background: transparent; color: #26357c; font-family: Arial, sans-serif; z-index: 1; }
.map-pin::before { content: ''; position: absolute; top: 14px; left: 15px; height: 22px; width: 1px; background: #7e8de5; }
.map-pin::after { content: ''; position: absolute; bottom: 0; left: 3px; width: 26px; height: 6px; border: 1px solid #b7c7f7; border-radius: 50%; }
.pin-dot { position: absolute; top: 6px; left: 10px; width: 11px; height: 11px; border: 2px solid #5265e2; border-radius: 50%; background: #fff; }
.pin-dot::after { content: ''; position: absolute; inset: 2px; border-radius: 50%; background: #eca754; }
.pin-label { position: absolute; top: var(--dy); left: calc(50% + var(--dx)); transform: translateX(-50%); font-size: 14px; font-weight: 600; white-space: nowrap; }
.map-pin[aria-pressed='true'], .map-pin:hover { z-index: 3; color: #2635d9; }
.map-pin[aria-pressed='true'] .pin-dot { background: #2635d9; box-shadow: 0 0 0 6px #4d65df1a; }
.map-pin[aria-pressed='true'] .pin-label { background: white; box-shadow: 0 3px 14px #4c65ab16; border-radius: 5px; padding: 5px 8px; margin-top: -5px; }
@media (max-width: 760px) { .locations-section { padding-block: 44px 20px; } .world-map { margin-top: 36px; } .pin-label { font-size: 12px; } }