/** The map of the Netherlands, shared by network_map and hero_portal. */

.ecza-map { width: 100%; max-width: 26rem; margin-inline: auto; }
.ecza-map svg { width: 100%; height: auto; display: block; }

.ecza-map__land { fill: var(--cream-200); stroke: var(--border-soft); stroke-width: 1; }
.ecza-map__water { fill: var(--cream-50); stroke: none; }

.ecza-map__link { fill: none; stroke: var(--champagne); stroke-width: 1.2; stroke-dasharray: 3 4; opacity: 0.65; }
.ecza-map__clinic { fill: var(--champagne); }

.ecza-map__label text { font-family: var(--font-body); font-size: 9px; fill: var(--ink-soft); }
.ecza-map__sub { font-size: 7.5px; fill: var(--ink-muted); }
.ecza-map__hq { font-family: var(--font-body); font-size: 9px; font-weight: 600; fill: var(--ink); }
.ecza-map__heart { fill: var(--umc-red); }

/* The centre pulses, quietly. Two rings offset in time read as a heartbeat. */
.ecza-map__pulse { fill: var(--umc-red); opacity: 0.18; transform-origin: 178px 332px; animation: ecza-pulse 3s ease-out infinite; }
.ecza-map__pulse.is-delayed { animation-delay: 1.5s; }

@keyframes ecza-pulse {
  0%   { transform: scale(0.45); opacity: 0.34; }
  70%  { transform: scale(1.25); opacity: 0; }
  100% { transform: scale(1.25); opacity: 0; }
}

.is-dark .ecza-map__land { fill: rgba(255,255,255,0.08); stroke: rgba(255,255,255,0.16); }
.is-dark .ecza-map__water { fill: transparent; }
.is-dark .ecza-map__label text,
.is-dark .ecza-map__hq { fill: var(--cream-100); }
.is-dark .ecza-map__sub { fill: rgba(248,245,239,0.6); }

.ecza-network__inner { display: grid; gap: 3rem; align-items: center; grid-template-columns: 0.9fr 1.1fr; }

.ecza-network__clinics { list-style: none; margin: 1.5rem 0 0; padding: 0; display: grid; gap: 0.5rem; }
.ecza-network__clinics li { display: flex; align-items: baseline; gap: 0.6rem; }
.ecza-network__name { font-weight: 600; }
.ecza-network__city { font-size: 0.875rem; color: var(--ink-muted); }
.is-dark .ecza-network__city { color: rgba(248,245,239,0.6); }

@media (max-width: 760px) {
  .ecza-network__inner { grid-template-columns: 1fr; }
}

/* The animation is the most likely thing on the site to bother someone. */
@media (prefers-reduced-motion: reduce) {
  .ecza-map__pulse { animation: none; opacity: 0.16; }
}