/* ===========================================================================
   ESA · Mappa presenza internazionale · v1.3.1 (2026-10-27)
   Tutto è racchiuso in .esa-map: nessuna regola globale.
   =========================================================================== */
.esa-map{
  --esa-map-navy:#16243E;
  --esa-map-accent:#2E5CFF;
  --esa-map-line:#E1E3E7;
  --esa-map-mute:#5B6472;
  --esa-map-dot:rgba(22,36,62,.34);
  --esa-map-focus:2px solid #2E5CFF;     /* stile del focus visibile: cambialo qui */
  --esa-map-flag:20px;                   /* diametro delle bandiere sulla mappa */
  position:relative;
  font-family:'Inter',system-ui,sans-serif;
  color:var(--esa-map-navy);
}
.esa-map *,.esa-map *::before,.esa-map *::after{ box-sizing:border-box; }
/* --- area mappa --- */
.esa-map__stage{ position:relative; }
.esa-map__canvas{ position:relative; width:100%; aspect-ratio:1000 / 466; }
.esa-map__svg{ position:absolute; inset:0; width:100%; height:100%; display:block; overflow:visible; }
/* reticolo geografico */
.esa-map__grid line{ stroke:var(--esa-map-line); stroke-width:1; stroke-dasharray:2 5; vector-effect:non-scaling-stroke; }
.esa-map__grid line.is-eq{ stroke-dasharray:none; }
.esa-map__grid text{ font-family:'IBM Plex Mono',ui-monospace,monospace; font-size:8px; fill:var(--esa-map-mute); opacity:.75; }
/* terre emerse a punti */
.esa-map__dots{ fill:none; stroke:var(--esa-map-dot); stroke-width:1.9; stroke-linecap:round; }
.esa-map__reveal{
  transform:scale(0); transform-box:fill-box; transform-origin:center;
  transition:transform 1.8s cubic-bezier(.22,1,.36,1);
}
.esa-map.is-in .esa-map__reveal{ transform:scale(1); }
/* rotte dalla sede */
.esa-map__route{
  fill:none; stroke:var(--esa-map-navy); stroke-opacity:.32; stroke-width:.9; stroke-linecap:round;
  stroke-dasharray:var(--len); stroke-dashoffset:var(--len);
  transition:stroke-dashoffset 1s cubic-bezier(.45,0,.2,1) var(--d,0s), stroke .25s ease 0s, stroke-opacity .25s ease 0s, stroke-width .25s ease 0s;
}
.esa-map.is-in .esa-map__route{ stroke-dashoffset:0; }
.esa-map.is-active .esa-map__route{ stroke-opacity:.1; }
.esa-map .esa-map__route.is-on{ stroke:var(--esa-map-accent); stroke-opacity:.9; stroke-width:1.3; }
/* impulso luminoso che percorre la rotta attiva */
.esa-map__comet{
  fill:none; stroke:var(--esa-map-accent); stroke-width:2.4; stroke-linecap:round;
  stroke-dasharray:16px var(--len); stroke-dashoffset:16px; opacity:0;
}
.esa-map__comet.is-on{ opacity:1; animation:esaMapComet 1.5s cubic-bezier(.4,0,.6,1) infinite; }
@keyframes esaMapComet{
  from{ stroke-dashoffset:16px; }
  to  { stroke-dashoffset:calc(var(--len) * -1); }
}
/* --- segnaposti --- */
.esa-map__pins{ position:absolute; inset:0; }
.esa-map__pin{
  position:absolute; width:12px; height:12px; margin:-6px 0 0 -6px; border-radius:50%;
  cursor:pointer; opacity:0; transform:scale(.3); z-index:1;
  transition:opacity .35s ease var(--d,0s), transform .5s cubic-bezier(.34,1.56,.64,1) var(--d,0s);
}
.esa-map.is-in .esa-map__pin{ opacity:1; transform:scale(1); }
.esa-map__pin::before{
  content:""; position:absolute; inset:2.5px; border-radius:50%;
  background:var(--esa-map-accent);
  box-shadow:0 0 0 2px #fff, 0 0 0 4px rgba(46,92,255,.18);
  transition:transform .25s ease;
}
.esa-map__pin::after{
  content:""; position:absolute; inset:0; border-radius:50%;
  border:1px solid var(--esa-map-accent); opacity:0; pointer-events:none;
}
.esa-map__pin.is-on{ z-index:3; }
.esa-map__pin.is-on::before{ transform:scale(1.35); }
.esa-map__pin.is-on::after{ animation:esaMapPing 1.5s ease-out infinite; }
.esa-map.is-active .esa-map__pin:not(.is-on){ opacity:.4; }
/* la sede: mirino navy, unico punto che pulsa sempre */
.esa-map__pin--hq{
  width:34px; height:34px; margin:-17px 0 0 -17px; z-index:2;
  background:
    linear-gradient(var(--esa-map-navy),var(--esa-map-navy)) center / 1px 100% no-repeat,
    linear-gradient(var(--esa-map-navy),var(--esa-map-navy)) center / 100% 1px no-repeat;
}
.esa-map__pin--hq::before{
  inset:12px; background:var(--esa-map-navy);
  box-shadow:0 0 0 2px #fff, 0 0 0 3px var(--esa-map-navy);
}
.esa-map__pin--hq::after{ inset:9px; border-color:var(--esa-map-navy); animation:esaMapPing 2.6s ease-out infinite; }
.esa-map.is-active .esa-map__pin--hq:not(.is-on){ opacity:1; }
@keyframes esaMapPing{
  0%  { opacity:.8; transform:scale(1); }
  100%{ opacity:0;  transform:scale(2.6); }
}
.esa-map.is-settled .esa-map__pin,
.esa-map.is-settled .esa-map__route{ transition-delay:0s; }
/* --- bandiere (attive con data-flags sul contenitore) --- */
.esa-map .esa-map__pin.has-flag{
  width:var(--esa-map-flag); height:var(--esa-map-flag);
  margin:calc(var(--esa-map-flag) / -2) 0 0 calc(var(--esa-map-flag) / -2);
}
.esa-map__pin.has-flag::before{ display:none; }
.esa-map__pin.has-flag::after{ inset:-3px; }
.esa-map .esa-map__flag{
  position:absolute; inset:0; display:block; width:100%; height:100%; max-width:none;
  border-radius:50%; object-fit:cover;
  box-shadow:0 0 0 2px #fff, 0 3px 8px -2px rgba(22,36,62,.45);
  transition:transform .25s ease, box-shadow .25s ease;
}
.esa-map__pin.has-flag.is-on .esa-map__flag{
  transform:scale(1.25);
  box-shadow:0 0 0 2px #fff, 0 0 0 3.5px var(--esa-map-accent), 0 6px 14px -4px rgba(22,36,62,.5);
}
.esa-map.is-active .esa-map__pin.has-flag:not(.is-on){ opacity:.55; }
/* linea guida verso il punto reale, solo per le bandiere spostate */
.esa-map__leader{
  stroke:var(--esa-map-navy); stroke-width:.7; stroke-dasharray:1.5 1.5; stroke-opacity:0;
  transition:stroke-opacity .35s ease var(--d,0s);
}
.esa-map.is-in .esa-map__leader.is-moved{ stroke-opacity:.55; }
.esa-map__anchor{ fill:var(--esa-map-navy); opacity:0; transition:opacity .35s ease var(--d,0s); }
.esa-map.is-in .esa-map__anchor.is-moved{ opacity:.75; }
.esa-map.is-settled .esa-map__leader,
.esa-map.is-settled .esa-map__anchor{ transition-delay:0s; }
/* --- tooltip --- */
.esa-map__tip{
  --tx:-50%; --ty:calc(-100% - 18px);
  position:absolute; z-index:5; width:max-content; min-width:170px; max-width:250px;
  padding:12px 16px 13px; background:#fff;
  border:1px solid var(--esa-map-line); border-radius:4px;
  box-shadow:0 14px 32px -16px rgba(22,36,62,.45);
  background-image:
    linear-gradient(var(--esa-map-accent),var(--esa-map-accent)),
    linear-gradient(var(--esa-map-accent),var(--esa-map-accent)),
    linear-gradient(var(--esa-map-accent),var(--esa-map-accent)),
    linear-gradient(var(--esa-map-accent),var(--esa-map-accent));
  background-repeat:no-repeat;
  background-size:9px 1.5px, 1.5px 9px, 9px 1.5px, 1.5px 9px;
  background-position:0 0, 0 0, 100% 100%, 100% 100%;
  pointer-events:none; opacity:0;
  transform:translate(var(--tx),var(--ty)) scale(.96);
  transform-origin:center;
  transition:opacity .18s ease, transform .22s cubic-bezier(.22,1,.36,1);
}
.esa-map__tip.is-on{ opacity:1; transform:translate(var(--tx),var(--ty)) scale(1); }
.esa-map__tip > span{ display:block; }
.esa-map__tip-name{ font-family:'Archivo',sans-serif; font-weight:600; font-size:16px; line-height:1.25; color:var(--esa-map-navy); }
.esa-map__tip-meta{ margin-top:4px; font-family:'IBM Plex Mono',ui-monospace,monospace; font-size:11px; line-height:1.5; color:var(--esa-map-mute); }
.esa-map__tip-meta b{ font-weight:500; color:var(--esa-map-navy); margin-right:8px; }
.esa-map__tip-km{ margin-top:8px; padding-top:8px; border-top:1px dashed var(--esa-map-line); font-family:'IBM Plex Mono',ui-monospace,monospace; font-size:12px; color:var(--esa-map-accent); }
.esa-map__tip-name.has-flag{ display:flex; align-items:center; gap:9px; }
.esa-map .esa-map__tip-flag{ flex:none; width:18px; height:18px; max-width:none; border-radius:50%; object-fit:cover; box-shadow:0 0 0 1px var(--esa-map-line); }
.esa-map__tip-link{ margin-top:8px; font-weight:700; font-size:13px; color:var(--esa-map-accent); }
.esa-map .esa-map__legend a.esa-map__item{ text-decoration:none !important; }
.esa-map .esa-map__legend[hidden]{ display:none; }
/* voci-link (data-url): i colori del componente vincono sul colore dei link del tema */
.esa-map .esa-map__legend a.esa-map__item{ color:var(--esa-map-navy) !important; }
.esa-map .esa-map__legend a.esa-map__item:hover,
.esa-map .esa-map__legend a.esa-map__item.is-on{ color:var(--esa-map-accent) !important; }
.esa-map__tip-note{ margin-top:6px; font-size:12.5px; line-height:1.45; color:var(--esa-map-navy); }
/* --- legenda (è anche l'elenco dati) --- */
.esa-map .esa-map__legend{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:28px 40px;
  margin-top:36px; padding-top:28px; border-top:1px solid var(--esa-map-line);
}
.esa-map .esa-map__area-title{
  display:flex; align-items:baseline; justify-content:space-between; gap:12px;
  margin:0 0 10px; padding:0 0 10px; border-bottom:1px solid var(--esa-map-navy);
  font-family:'Archivo',sans-serif; font-weight:600; font-size:15px; line-height:1.2; color:var(--esa-map-navy);
}
.esa-map__count{ font-family:'IBM Plex Mono',ui-monospace,monospace; font-weight:400; font-size:12px; color:var(--esa-map-mute); }
.esa-map .esa-map__legend ul{ list-style:none; margin:0; padding:0; }
.esa-map .esa-map__legend li{ margin:0; padding:0; list-style:none; line-height:1.3; }
.esa-map .esa-map__item{
  display:flex; align-items:baseline; justify-content:space-between; gap:12px; width:100%;
  margin:0; padding:8px 2px; background:none; border:0; border-bottom:1px dashed var(--esa-map-line); border-radius:0;
  font:inherit; font-size:14px; color:var(--esa-map-navy); text-align:left; cursor:pointer;
  transition:color .2s ease, padding-left .2s ease;
}
.esa-map__item-name{ position:relative; padding-left:14px; }
.esa-map__item-name::before{
  content:""; position:absolute; left:0; top:50%; width:6px; height:6px; margin-top:-3px; border-radius:50%;
  background:var(--esa-map-line); transition:background .2s ease, transform .2s ease;
}
.esa-map__item-name.has-flag{ padding-left:23px; }
.esa-map__item-name.has-flag::before{ display:none; }
.esa-map .esa-map__item-flag{
  position:absolute; left:0; top:50%; width:15px; height:15px; max-width:none; margin-top:-7.5px;
  border-radius:50%; object-fit:cover; box-shadow:0 0 0 1px var(--esa-map-line);
  transition:transform .2s ease;
}
.esa-map__item:hover .esa-map__item-flag,
.esa-map__item.is-on .esa-map__item-flag{ transform:scale(1.15); }
.esa-map__item-km{ font-family:'IBM Plex Mono',ui-monospace,monospace; font-size:12px; color:var(--esa-map-mute); white-space:nowrap; }
.esa-map .esa-map__item:hover,
.esa-map .esa-map__item.is-on{ color:var(--esa-map-accent); padding-left:6px; }
.esa-map__item:hover .esa-map__item-name::before,
.esa-map__item.is-on .esa-map__item-name::before{ background:var(--esa-map-accent); transform:scale(1.3); }
.esa-map .esa-map__item:focus{ outline:none; }
.esa-map .esa-map__item:focus-visible{ outline:var(--esa-map-focus); outline-offset:2px; }
/* --- frecce di scorrimento (modalità a scorrimento su telefono) --- */
.esa-map__scroller{ position:relative; }
.esa-map .esa-map__arrow{
  position:absolute; top:50%; z-index:6; display:flex; align-items:center; justify-content:center;
  width:40px; height:40px; margin:-20px 0 0; padding:0;
  border:1px solid var(--esa-map-navy); border-radius:50%; background:#fff; color:var(--esa-map-navy); cursor:pointer;
  box-shadow:0 6px 14px -6px rgba(22,36,62,.45); transition:background .15s ease, color .15s ease;
}
.esa-map .esa-map__arrow[hidden]{ display:none; }
.esa-map .esa-map__arrow svg{ width:16px; height:16px; }
.esa-map .esa-map__arrow--prev{ left:4px; }
.esa-map .esa-map__arrow--prev svg{ transform:rotate(180deg); }
.esa-map .esa-map__arrow--next{ right:4px; }
.esa-map .esa-map__arrow:hover{ background:var(--esa-map-navy); color:#fff; }
.esa-map .esa-map__arrow:focus{ outline:none; }
.esa-map .esa-map__arrow:focus-visible{ outline:var(--esa-map-focus); outline-offset:2px; }
/* mappa inquadrata sulla zona dei segnaposti (data-mobile="fit"): niente fuori dai bordi */
.esa-map.is-cropped .esa-map__svg{ overflow:hidden; }
.esa-map.is-cropped .esa-map__grid text{ display:none; }

/* --- mobile: la mappa si scorre in orizzontale, partendo dalla sede --- */
@media (max-width:767px){
  .esa-map__stage{
    overflow-x:auto; overflow-y:hidden; overscroll-behavior-x:contain;
    -webkit-overflow-scrolling:touch; scrollbar-width:none;
    -webkit-mask-image:linear-gradient(90deg,transparent,#000 28px,#000 calc(100% - 28px),transparent);
            mask-image:linear-gradient(90deg,transparent,#000 28px,#000 calc(100% - 28px),transparent);
  }
  .esa-map__stage::-webkit-scrollbar{ display:none; }
  .esa-map{ --esa-map-flag:18px; }
  .esa-map__canvas{ width:900px; }
  /* data-mobile="fit": la mappa occupa la larghezza dello schermo e inquadra i segnaposti */
  .esa-map.is-fit .esa-map__stage{ overflow:visible; -webkit-mask-image:none; mask-image:none; }
  .esa-map.is-fit .esa-map__canvas{ width:100%; }
  .esa-map .esa-map__legend{ grid-template-columns:1fr 1fr; gap:24px 20px; margin-top:24px; }
}
@media (max-width:420px){
  .esa-map .esa-map__legend{ grid-template-columns:1fr; }
}
/* --- movimento ridotto --- */
@media (prefers-reduced-motion:reduce){
  .esa-map__reveal,.esa-map__route,.esa-map__pin,.esa-map__tip,.esa-map__leader,.esa-map__anchor{ transition:none !important; }
  .esa-map__pin::after,.esa-map__comet.is-on{ animation:none !important; }
}