.network-section {
  box-sizing: border-box;
  width: min(100%, 1320px);
  margin-inline: auto;
  padding: clamp(64px, 8vw, 112px) var(--about-pad, 5vw) 0;
  background: var(--about-bg, #080b0b);
  color: var(--about-text, #eef3ef);
  scroll-margin-top: calc(var(--top, 88px) + 28px);
}
.network-heading { display: grid; grid-template-columns: 1fr 1fr; column-gap: 64px; align-items: end; }
.network-heading .about-kicker { grid-column: 1 / -1; }
.network-heading h2 { max-width: 12ch; margin: 0; font-size: clamp(38px, 5vw, 64px); font-weight: 300; letter-spacing: -.04em; line-height: 1.08; }
.network-heading > p:not(.about-kicker) { max-width: 27ch; margin: 0 0 4px; color: var(--about-muted, #acbab5); font-size: clamp(18px, 2vw, 24px); line-height: 1.6; }
.network-figure { margin: 48px 0 0; }
.network-map { position: relative; aspect-ratio: 2 / 1; width: 100%; background: radial-gradient(ellipse at 52% 44%, #8ed7c710, transparent 70%); isolation: isolate; }
.network-map img, .network-map svg { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: contain; }
/* Preserve the supplied geography while making the land legible behind the markers. */
.network-map img { opacity: .9; filter: brightness(1.25); }
.network-halo { fill: var(--about-accent, #8ed7c7); opacity: .18; }
.network-dot { fill: var(--about-accent, #8ed7c7); stroke: var(--about-bg, #080b0b); stroke-width: 1; }
.network-marker { cursor: pointer; }
.network-hit { fill: transparent; pointer-events: all; }
.network-halo, .network-dot { pointer-events: none; transition: r .18s ease, opacity .18s ease, fill .18s ease; }
.network-marker.is-highlighted .network-halo { r: 15px; opacity: .32; }
.network-marker.is-highlighted .network-dot { r: 5px; fill: var(--about-text, #eef3ef); stroke-width: 1.5; }
.network-marker:focus-visible { outline: none; }
.network-marker:focus-visible .network-halo { stroke: var(--about-accent, #8ed7c7); stroke-width: 2; stroke-dasharray: 3 3; opacity: .8; }
.network-map-label { position: absolute; z-index: 1; transform: translate(-50%, calc(-100% - 16px)); padding: 6px 10px; border: 1px solid var(--about-line); background: var(--about-panel); color: var(--about-text); font-size: 12px; line-height: 1.4; white-space: nowrap; pointer-events: none; }
.network-figure figcaption { margin: 16px 0 0; color: var(--about-muted, #acbab5); font-size: 12px; line-height: 1.7; }
.network-locations { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0 24px; margin: 22px 0 0; padding: 20px 0 32px; border-block: 1px solid var(--about-line, #eef3ef29); list-style: none; }
.network-locations li { min-width: 0; }
.network-country { position: relative; display: block; width: 100%; min-height: 44px; padding: 10px 10px 10px 18px; border: 0; border-radius: 0; background: transparent; color: var(--about-muted, #acbab5); font: 400 14px/1.5 Inter Tight, Arial, sans-serif; text-align: left; cursor: pointer; transition: color .18s ease, background .18s ease; }
.network-country::before { content: ''; position: absolute; top: 20px; left: 2px; width: 4px; height: 4px; border-radius: 50%; background: var(--about-accent, #8ed7c7); }
.network-country.is-highlighted { color: var(--about-accent); background: color-mix(in srgb, var(--about-accent) 9%, transparent); text-decoration: underline; text-underline-offset: 4px; }
.network-country.is-highlighted::before { box-shadow: 0 0 0 3px color-mix(in srgb, var(--about-accent) 20%, transparent); }
.network-section:focus-visible { outline: 2px solid var(--about-accent); outline-offset: -4px; }
html[data-theme=light] .network-map img { opacity: .75; filter: none; }
@media (max-width: 700px) {
  .network-section { padding-top: 56px; }
  .network-heading { grid-template-columns: 1fr; gap: 0; }
  .network-heading h2 { max-width: 15ch; font-size: clamp(34px, 9vw, 48px); }
  .network-heading > p:not(.about-kicker) { margin-top: 22px; font-size: 19px; }
  .network-figure { margin-top: 32px; }
  .network-dot { r: 4.5px; }
  .network-figure figcaption { margin-top: 12px; }
  .network-locations { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 16px; padding-block: 20px 28px; }
  .network-country { font-size: 13px; }
}
body.motion-paused .network-section * { transition: none; }
@media (prefers-reduced-motion: reduce) {
  .network-section, .network-section * { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
@media (forced-colors: active) {
  .network-dot, .network-halo { fill: Highlight; }
  .network-country::before { background: Highlight; }
  .network-country.is-highlighted { color: HighlightText; background: Highlight; }
  .network-map-label { color: CanvasText; background: Canvas; border-color: CanvasText; }
}