/* La cartina «Dove siamo presenti» (class-mappa.php). I segni restano della
   stessa grandezza a ogni inquadratura: --k la aggiorna mappa.js. */
.rv-mappa { --k: 1; position: relative; isolation: isolate; overflow: hidden; border-radius: 26px; padding: clamp(1.4rem, 4vw, 2.6rem); color: #fff; background: radial-gradient(900px 500px at 85% 0%, rgba(0, 160, 227, .22), transparent 60%), radial-gradient(700px 400px at 0% 100%, rgba(230, 0, 126, .18), transparent 60%), #0a1f2e; }
.rv-mappa__testa { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 1rem 2rem; }
.rv-mappa .rv-occhiello { color: #ff5fae; }
.rv-mappa__titolo { margin: .45rem 0 0 !important; max-width: 24ch; color: #fff; font-family: var(--wp--preset--font-family--titoli, sans-serif); font-size: clamp(1.6rem, 3.2vw, 2.5rem) !important; line-height: 1.1; text-wrap: balance; }
.rv-mappa__comandi { display: inline-flex; gap: .3rem; padding: .3rem; border-radius: 13px; background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .12); }
.rv-mappa__comandi button { appearance: none; border: 0; cursor: pointer; padding: .55rem .95rem; border-radius: 10px; background: transparent; color: #cfe0ea; font: inherit; font-weight: 600; font-size: .9rem; transition: background .25s, color .25s; }
.rv-mappa__comandi button:hover { background: rgba(255, 255, 255, .12); color: #fff; }
.rv-mappa__comandi button[aria-pressed="true"] { background: #fff; color: #0a1f2e; }
.rv-mappa__comandi button:focus-visible { outline: 3px solid #ffd500; outline-offset: 2px; }
.rv-mappa__riquadro { position: relative; margin-top: 1.4rem; border-radius: 18px; overflow: hidden; background: radial-gradient(circle at 60% 40%, #0f3449, #0a2232 75%); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .08); }
.rv-mappa__svg { display: block; width: 100%; height: auto; aspect-ratio: 16 / 10; }
@media (max-width: 700px) { .rv-mappa__svg { aspect-ratio: 1 / 1; } }

.rv-rotta { fill: none; stroke: #00a0e3; stroke-width: 1.2; vector-effect: non-scaling-stroke; stroke-linecap: round; opacity: .42; }
.rv-rotta:nth-child(4n+2) { stroke: #e6007e; }
.rv-rotta:nth-child(4n+3) { stroke: #ffd500; }
.rv-rotta:nth-child(4n+4) { stroke: #3fb34f; }
.rv-segno { cursor: pointer; outline: none; }
.rv-segno__corpo { transform: scale(var(--k)); }
.rv-segno__punto { fill: #e6007e; stroke: #fff; stroke-width: 2.4; vector-effect: non-scaling-stroke; transition: fill .2s; }
.rv-segno__onda { fill: rgba(230, 0, 126, .35); transform-box: fill-box; transform-origin: center; animation: rv-mappa-onda 2.6s ease-out infinite; animation-delay: calc(var(--i) * 137ms); }
.rv-segno--sede .rv-segno__punto { fill: #ffd500; stroke: #0a1f2e; stroke-width: 3; }
.rv-segno--sede .rv-segno__onda { fill: rgba(255, 213, 0, .4); }
.rv-segno:hover .rv-segno__punto, .rv-segno:focus-visible .rv-segno__punto { fill: #00a0e3; }
@keyframes rv-mappa-onda { 0% { transform: scale(.35); opacity: .9; } 100% { transform: scale(1.7); opacity: 0; } }

/* L'animazione d'arrivo: solo se il JavaScript è partito (sennò si vede tutto subito) */
.rv-mappa--pronta:not(.rv-mappa--viva) .rv-segno { opacity: 0; }
.rv-mappa--pronta .rv-rotta { stroke-dasharray: 1; stroke-dashoffset: 1; }
.rv-mappa--viva .rv-rotta { animation: rv-mappa-traccia 1.3s ease forwards; animation-delay: calc(var(--i) * 90ms + 250ms); }
.rv-mappa--viva .rv-segno__pop { transform-box: fill-box; transform-origin: center; animation: rv-mappa-cade .7s cubic-bezier(.2, 1.7, .4, 1) both; animation-delay: calc(var(--i) * 90ms); }
@keyframes rv-mappa-traccia { to { stroke-dashoffset: 0; } }
@keyframes rv-mappa-cade { from { transform: scale(0) translateY(-30px); opacity: 0; } to { transform: none; opacity: 1; } }

.rv-mappa__nome { position: absolute; left: 0; top: 0; z-index: 2; padding: .38rem .7rem; border-radius: 9px; background: #fff; color: #0a1f2e; font-weight: 700; font-size: .88rem; white-space: nowrap; pointer-events: none; transform: translate(-50%, calc(-100% - 10px)); opacity: 0; transition: opacity .18s; box-shadow: 0 10px 24px -10px rgba(0, 0, 0, .6); }
.rv-mappa__nome--su { opacity: 1; }
.rv-mappa__elenco { list-style: none; display: flex; flex-wrap: wrap; gap: .4rem; padding: 0; margin: 1.2rem 0 0; }
.rv-mappa__elenco li { padding: .3rem .7rem; border-radius: 999px; font-size: .82rem; color: #d6e6ef; background: rgba(255, 255, 255, .07); border: 1px solid rgba(255, 255, 255, .12); cursor: default; transition: background .2s, color .2s; }
.rv-mappa__elenco li.rv-acceso { background: #00a0e3; color: #fff; border-color: transparent; }
.rv-mappa__elenco .rv-mappa__sede { background: #ffd500; color: #0a1f2e; border-color: transparent; font-weight: 700; }
.rv-mappa__fonte { margin: .9rem 0 0; font-size: .72rem; color: #7fa3b6; }

@media (prefers-reduced-motion: reduce) {
	.rv-mappa *, .rv-mappa *::before { animation: none !important; transition: none !important; }
	.rv-mappa .rv-segno { opacity: 1 !important; }
	.rv-mappa .rv-rotta { stroke-dashoffset: 0 !important; }
}