/* AIFC Brand Guidelines 2024: Cold 4/5, Pastel 2, Main 1/2/3 */
.aim {
	--aim-base: #d7dbe2;
	--aim-on: #9ac1e2;
	--aim-hl: #008591;
	--aim-navy: #002554;
	--aim-ink: #161719;
	--aim-muted: #575d63;
	--aim-bg: #f4f4f4;
	--aim-h: min(520px, 62vh); /* compact map height */
	--aim-ease: cubic-bezier(.22, 1, .36, 1);
	position: relative;
	color: var(--aim-ink);
}
.aim-jump, .aim-jump::before { transition: none !important; }
html.aim-lock { overflow: hidden; }

/* Header */
.aim__head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 8px 32px; margin-bottom: 20px; }
.aim__title { margin: 0; }
.aim__info { margin: 0; color: var(--aim-muted); transition: opacity .4s var(--aim-ease); }
.aim.is-orgs .aim__info { opacity: 0; }

/* Stage */
.aim__stage { position: relative; inset: auto; display: block; width: auto; height: auto; margin: 0; padding: 64px 16px 16px; border: 0; border-radius: 16px; overflow: visible; color: inherit; background: var(--aim-bg); } /* also resets [popover] UA styles */
.aim__map { max-width: calc(var(--aim-h) * 20 / 13); margin: 0 auto; overflow-x: auto; scrollbar-width: none; -webkit-tap-highlight-color: transparent; }
.aim__map::-webkit-scrollbar { display: none; }
.aim__map:empty { aspect-ratio: 20 / 13; border-radius: 12px; background: linear-gradient(100deg, transparent 30%, rgb(255 255 255 / .7) 50%, transparent 70%) 0 0 / 200% 100%, #eceef1; animation: aim-shimmer 1.4s linear infinite; }
.aim__map svg { display: block; width: 100%; min-width: 720px; height: auto; animation: aim-fade .8s var(--aim-ease); }
.aim.is-full .aim__stage { position: fixed; inset: 0; z-index: 99999; width: 100%; height: 100%; padding: 0; border-radius: 0; }
.aim.is-full .aim__map { max-width: none; height: 100%; overflow: hidden; }
.aim.is-full .aim__map svg { width: 100%; height: 100%; min-width: 0; touch-action: none; cursor: grab; animation: none; }
.aim.is-drag .aim__map svg, .aim.is-drag .aim__map svg * { cursor: grabbing; }
.aim__stage::backdrop { background: transparent; }

/* Controls */
.aim__tabs, .aim__expand { position: absolute; top: 14px; z-index: 2; background: #fff; box-shadow: 0 1px 2px rgb(0 37 84 / .06), 0 4px 12px rgb(0 37 84 / .06); }
.aim__tabs { left: 14px; display: flex; padding: 4px; border-radius: 999px; }
.aim__tabs::before { content: ""; position: absolute; top: 4px; bottom: 4px; left: 0; width: var(--w, 0); transform: translateX(var(--x, 0)); border-radius: 999px; background: var(--aim-hl); transition: transform .5s var(--aim-ease), width .5s var(--aim-ease); }
.aim__tabs button { position: relative; padding: 8px 18px; border: 0; border-radius: 999px; background: none; color: var(--aim-muted); font: inherit; font-size: 14px; line-height: 1.2; cursor: pointer; transition: color .4s var(--aim-ease); }
.aim__tabs button:hover { color: var(--aim-ink); }
.aim__tabs [aria-selected=true], .aim__tabs [aria-selected=true]:hover { color: #fff; }
.aim__expand { right: 14px; display: grid; place-items: center; width: 40px; height: 40px; padding: 0; border: 0; border-radius: 50%; color: var(--aim-navy); cursor: pointer; transition: transform .4s var(--aim-ease), box-shadow .4s var(--aim-ease); }
.aim__expand:hover { transform: scale(1.08); box-shadow: 0 2px 4px rgb(0 37 84 / .08), 0 8px 20px rgb(0 37 84 / .12); }
.aim__expand:active { transform: scale(.96); }
.aim__expand svg, .aim__zoom svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.aim__i-close, .aim.is-full .aim__i-open, .aim:not(.is-full) .aim__zoom { display: none; }
.aim__zoom { position: absolute; right: 14px; bottom: 14px; z-index: 2; display: flex; flex-direction: column; overflow: hidden; border-radius: 12px; background: #fff; box-shadow: 0 1px 2px rgb(0 37 84 / .06), 0 4px 12px rgb(0 37 84 / .08); animation: aim-up .5s var(--aim-ease) .15s backwards; }
.aim__zoom button { display: grid; place-items: center; width: 40px; height: 40px; padding: 0; border: 0; background: none; color: var(--aim-navy); cursor: pointer; transition: background .25s; }
.aim__zoom button + button { border-top: 1px solid #edeff2; }
.aim__zoom button:hover { background: var(--aim-bg); }
.aim.is-full .aim__i-close { display: block; }
.aim button:focus-visible { outline: 2px solid var(--aim-hl); outline-offset: 2px; }

/* Map layers */
.aim__map path { fill: var(--aim-base); stroke: #fff; stroke-width: .6; vector-effect: non-scaling-stroke; transition: fill .4s var(--aim-ease); }
.aim .is-on, .aim .is-on path { fill: var(--aim-on); cursor: pointer; }
.aim .is-hl, .aim .is-hl path { fill: var(--aim-hl); }
.aim .aim__dot { fill: none; stroke: var(--aim-on); stroke-width: 2px; vector-effect: non-scaling-stroke; pointer-events: visible; transition: stroke .4s var(--aim-ease); }
.aim .aim__dot.is-hl { stroke: var(--aim-hl); }
.aim.is-orgs .is-on, .aim.is-orgs .is-on path { fill: var(--aim-base); cursor: default; }
.aim.is-orgs .aim__dot, .aim:not(.is-orgs) .aim__mk, .aim__mk.is-merged, .aim:not(.is-orgs) .aim__logos { display: none; }

.aim__mk { cursor: pointer; }
.aim__pin { transform-box: fill-box; transform-origin: center; transition: transform .45s var(--aim-ease); animation: aim-pop .6s var(--aim-ease) backwards; animation-delay: calc(var(--i) * 45ms); }
.aim__mk circle { fill: var(--aim-navy); stroke: #fff; stroke-width: 2; transition: fill .35s var(--aim-ease); }
.aim__mk text { fill: #fff; font: 600 11px sans-serif; text-anchor: middle; pointer-events: none; }
.aim__mk.is-hl .aim__pin { transform: scale(1.3); }
.aim__mk.is-hl circle { fill: var(--aim-hl); }

/* Tooltip & card: position via `translate`, appearance via `transform` */
.aim__tip {
	box-sizing: border-box;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 5;
	max-width: min(240px, 80%);
	padding: 7px 12px;
	border-radius: 8px;
	background: var(--aim-navy);
	color: #fff;
	font-size: 14px;
	line-height: 1.3;
	text-align: center;
	pointer-events: none;
	opacity: 0;
	visibility: hidden;
	transform: translate(-50%, calc(-100% - 14px)) scale(.94);
	transform-origin: 50% 100%;
	transition: opacity .25s ease, transform .35s var(--aim-ease), visibility 0s .35s;
}
.aim__tip.is-open { opacity: 1; visibility: visible; transform: translate(-50%, calc(-100% - 14px)); transition: opacity .25s ease, transform .35s var(--aim-ease), translate .18s var(--aim-ease); }
.aim__tip.is-below { transform: translate(-50%, 18px) scale(.94); transform-origin: 50% 0; }
.aim__tip.is-below.is-open { transform: translate(-50%, 18px); }
.aim__tip.is-card { overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; max-width: min(340px, 92%); padding: 14px 16px; border-radius: 12px; background: #fff; color: var(--aim-ink); text-align: left; box-shadow: 0 12px 32px rgb(0 37 84 / .16), 0 2px 6px rgb(0 37 84 / .08); }
.aim__tip.is-card.is-open { pointer-events: auto; transition: opacity .25s ease, transform .35s var(--aim-ease), translate .45s var(--aim-ease); }
.aim__country { margin-bottom: 8px; color: var(--aim-muted); font-size: 11px; letter-spacing: .06em; text-transform: uppercase; }
.aim__org + .aim__country { margin-top: 16px; }
.aim__org { display: flex; gap: 12px; align-items: center; }
.aim__org + .aim__org { margin-top: 12px; padding-top: 12px; border-top: 1px solid #edeff2; }
.aim__org img { flex: none; width: 44px; height: 44px; object-fit: contain; }
.aim__org b { display: block; font-weight: 600; line-height: 1.3; }
.aim__org a { color: var(--aim-hl); font-size: 13px; text-decoration: none; }
.aim__org a:hover { text-decoration: underline; }

/* Logo list */
.aim__logos { position: relative; display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 8px; margin: 24px 0 0; padding: 0; list-style: none; }
.aim__logos li { position: relative; display: flex; align-items: center; justify-content: center; min-height: 96px; padding: 16px; color: var(--aim-muted); font-size: 13px; line-height: 1.35; text-align: center; transition: color .35s var(--aim-ease); animation: aim-up .6s var(--aim-ease) backwards; animation-delay: calc(var(--i) * 35ms); }
.aim__logos li:hover { color: var(--aim-ink); }
.aim__logos a { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; padding: 16px; color: inherit; text-decoration: none; }
.aim__logos img { width: 100%; height: 56px; object-fit: contain; filter: grayscale(1); opacity: .7; transition: filter .45s var(--aim-ease), opacity .45s var(--aim-ease); }
.aim__logos li:hover img { filter: none; opacity: 1; }
.aim__glow { position: absolute; top: 0; left: 0; border-radius: 12px; background: var(--aim-bg); opacity: 0; pointer-events: none; transition: opacity .3s ease, transform .5s var(--aim-ease), width .5s var(--aim-ease), height .5s var(--aim-ease); }
.aim__glow.is-on { opacity: 1; }
.aim__glow.aim-jump { transition: opacity .3s ease !important; }

@keyframes aim-fade { from { opacity: 0; } }
@keyframes aim-shimmer { to { background-position: -200% 0, 0 0; } }
@keyframes aim-pop { from { opacity: 0; transform: scale(0); } }
@keyframes aim-up { from { opacity: 0; transform: translateY(10px); } }

@media (max-width: 640px) {
	.aim__stage { padding: 12px; }
	.aim__tabs { position: relative; top: 0; left: 0; display: grid; grid-template-columns: 1fr 1fr; margin: 0 52px 12px 0; }
	.aim__tabs button { padding: 8px 10px; font-size: 13px; }
	.aim__expand { top: 12px; right: 12px; }
	.aim.is-full .aim__stage { display: flex; flex-direction: column; padding: 12px 0 0; }
	.aim.is-full .aim__tabs { margin-left: 12px; }
	.aim.is-full .aim__map { flex: 1; min-height: 0; }
}
@media (prefers-reduced-motion: reduce) {
	.aim *, .aim *::before { animation: none !important; transition-duration: .01ms !important; }
}