/**
 * mapa.css — Mapa interactivo de Latinoamerica (SLCPFYR), Bloque G v2.
 *
 * theme.json ya define la paleta de marca (wp-themes/slcpfyr-2026/theme.json:
 * midnight, marine, marine-light, titanium, silver, base, paper, hairline) y
 * la familia Montserrat autoalojada. Estos custom properties tiran de esos
 * presets var(--wp--preset--color--*) con el HEX de marca como fallback (por
 * si este CSS se usa alguna vez fuera de un contexto con theme.json cargado).
 *
 * Los tokens de movimiento (--im-ease, --im-entrada, --im-dibujo,
 * --im-stagger) los define idea-motion.css en :root -- se reusan aqui tal
 * cual, no se redeclaran valores propios (vocabulario compartido del kit).
 *
 * Sin zoom, sin pan, sin tooltips flotantes — tal como pide la spec.
 *
 * Doctrina relevante: 23 bis (grid: toda celda con grid-area explicito,
 * nada a la auto-colocacion), 42 (nunca directivas dentro de <svg>), 44
 * (pulso finito), 44 bis (sticky va en la ficha, no en el mapa).
 */

.slcpfyr-mapa {
	--slcpfyr-midnight: var(--wp--preset--color--midnight, #111d30);
	--slcpfyr-marine: var(--wp--preset--color--marine, #0c6168);
	--slcpfyr-marine-lt: var(--wp--preset--color--marine-light, #2ea3a8); /* solo sobre fondo midnight, nunca sobre blanco */
	--slcpfyr-titanium: var(--wp--preset--color--titanium, #505867);
	--slcpfyr-silver: var(--wp--preset--color--silver, #b2b9c1); /* solo filetes/lineas/rotulos sobre midnight, nunca texto sobre blanco */
	--slcpfyr-white: var(--wp--preset--color--base, #ffffff);
	--slcpfyr-paper: var(--wp--preset--color--paper, #f5f6f8);
	--slcpfyr-hairline: var(--wp--preset--color--hairline, #e6e9ec);

	font-family: var(--wp--preset--font-family--montserrat, 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif);
	color: var(--slcpfyr-titanium);
	display: grid;
	width: 100%;
	max-width: none;
	margin: 0;
	grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
	grid-template-areas:
		"mapa ficha"
		"lista lista";
	column-gap: 40px;
	row-gap: 56px;
	align-items: start;
}

.slcpfyr-mapa__mapa-col {
	grid-area: mapa;
	contain: layout paint;
}

.slcpfyr-mapa__ficha-col {
	grid-area: ficha;
	align-self: stretch;
	min-width: 0;
}

.slcpfyr-mapa__form-select {
	display: none; /* display:none no ocupa pista de grid -- doctrina 23 bis */
}

.slcpfyr-mapa__lista {
	grid-area: lista;
}

/* Ficha pegajosa (44 bis, resuelto): el sticky va en la FICHA, dentro de su
 * columna estirada (align-self:stretch arriba) -- mismo patron que el aside
 * de single-evento.html (el contenedor se estira, el hijo lleva el sticky).
 * Tope de alto + scroll interno (Bloque G v2, autocritica C7): con una
 * tercera sociedad, o un portatil mas bajo que 900px, la ficha de Brasil
 * (2 fichas, ~640px) no debe cortarse contra el borde inferior de pantalla. */
@media (min-width: 1200px) {
	.slcpfyr-mapa__ficha {
		position: sticky;
		top: calc(var(--slcpfyr-header-h) + 24px);
		max-height: calc(100vh - var(--slcpfyr-header-h) - 48px);
		overflow-y: auto;
	}
}

@media (max-width: 780px) {
	.slcpfyr-mapa {
		grid-template-columns: 1fr;
		grid-template-areas:
			"select"
			"mapa"
			"ficha"
			"lista";
		row-gap: 32px;
	}
	.slcpfyr-mapa__form-select {
		grid-area: select;
		display: flex;
	}
}

@media (max-width: 599px) {
	/* La cabecera va a sangre por debajo de 600px (slcpfyr.css:210); el
	 * cuerpo de esta pagina replica ese mismo margen del 3% para que el
	 * borde del modulo del mapa siga alineado con el de la cabecera. */
	.slcpfyr-directorio__cuerpo {
		margin-inline: 3vw;
	}
}

/* ---------------------------------------------------------------------
 * SVG + paises
 * ------------------------------------------------------------------- */

.slcpfyr-mapa__svg {
	width: 100%;
	height: auto;
	display: block;
	background: var(--slcpfyr-paper);
	border-radius: 0.75rem;
}

.slcpfyr-mapa__pais {
	stroke: var(--slcpfyr-white);
	stroke-width: 0.5;
	stroke-dasharray: 100;
	stroke-dashoffset: 0; /* estado de reposo: trazo completo (im-static, sin JS, o ya dibujado) */
	transition: fill 200ms ease, stroke-width 200ms ease, stroke 200ms ease;
}

.slcpfyr-mapa__pais--no-miembro {
	fill: var(--slcpfyr-midnight);
}

.slcpfyr-mapa__pais--miembro {
	fill: var(--slcpfyr-marine);
}

.slcpfyr-mapa__pais-link {
	cursor: pointer;
}

.slcpfyr-mapa__hit {
	fill: transparent;
}

/* Hover/foco del <a>: el trazo del pais real se refuerza un poco (mecanismo
 * accesible primario, valido incluso sin JS/CSS de la copia elevada); el
 * crecimiento y el cambio de color reales los lleva la copia elevada de mas
 * abajo (crece en la capa superior, para no quedar tapada por los vecinos
 * posteriores en el DOM -- Bloque G v2, autocritica C6). Contraste
 * activo/miembro (marine vs. marine con stroke reforzado) es de solo 2.4:1
 * -- por eso la doble codificacion con stroke-width NO es decorativa, es el
 * mecanismo real de distincion accesible. */
.slcpfyr-mapa__pais-link:hover .slcpfyr-mapa__pais--miembro {
	stroke-width: 1.2;
}

.slcpfyr-mapa__pais-link:focus-visible .slcpfyr-mapa__pais--miembro {
	stroke-width: 1.6;
	stroke: var(--slcpfyr-silver);
}

.slcpfyr-mapa__pais-link.is-activo .slcpfyr-mapa__pais--miembro {
	stroke-width: 1.8;
	stroke: var(--slcpfyr-silver);
}

.slcpfyr-mapa__pais-link:focus-visible {
	outline: 3px solid var(--slcpfyr-silver);
	outline-offset: 2px;
}

/* Velo de aristas: puramente decorativo, generado offline (d3-delaunay). */
.slcpfyr-mapa__arista {
	stroke: var(--slcpfyr-white);
	stroke-width: 0.6;
	stroke-linecap: round;
	opacity: 0.55;
}

.slcpfyr-mapa__faceta-relleno {
	fill: var(--slcpfyr-white);
	stroke: none;
}

/* ---------------------------------------------------------------------
 * Capa elevada (Bloque G v2): dos copias <use> al final del SVG (SVG no
 * tiene z-index, pinta en orden de documento -- nunca quedan tapadas). La
 * copia --hover crece bajo el puntero/foco; la copia --activo lleva la
 * sombra (feDropShadow, en el <g> padre) y el pulso finito.
 * ------------------------------------------------------------------- */

.slcpfyr-mapa__elevado-use {
	transform-box: fill-box;
	transform-origin: center;
}

/* Corrección 4-sep-2026 (tarde): el scale(1.02) y el fill igual al de reposo
 * hacían el over casi imperceptible -- se pidió explícitamente "que se
 * amplíe mucho más el país" y "que cambie de color". La copia crece un 9%
 * (bien perceptible sin desbordar sobre los vecinos, verificado en los 10
 * países) y su relleno se aclara hacia marine-light (paleta corporativa,
 * theme.json) con fallback hex fijo. */
.slcpfyr-mapa__elevado-use--hover {
	fill: #1c8690;
	fill: color-mix(in oklch, var(--slcpfyr-marine) 45%, var(--slcpfyr-marine-lt) 55%);
	stroke: var(--slcpfyr-paper);
	stroke-width: 2.4;
	paint-order: stroke;
	transform: scale(1.09);
	opacity: 1;
	transition: opacity 150ms var(--im-ease), transform 200ms var(--im-ease), fill 200ms var(--im-ease);
}

.slcpfyr-mapa__elevado-use--hover:not([href]) {
	opacity: 0;
	transform: scale(1);
}

/* País seleccionado: color propio (marine-light, mismo tono que el hover
 * pero más saturado) además del refuerzo de trazo -- antes el relleno era
 * idéntico al de cualquier país miembro y solo cambiaba el stroke, por lo
 * que "no se notaba" cuál estaba elegido (corrección 4-sep-2026 tarde). El
 * stroke plata grueso sigue siendo el mecanismo accesible primario (3:1+);
 * el color es un refuerzo visual adicional, nunca el único medio. */
.slcpfyr-mapa__elevado-use--activo {
	fill: var(--slcpfyr-marine-lt);
	stroke: var(--slcpfyr-silver);
	stroke-width: 2.2;
}

/* Pulso suave del pais activo: solo el trazo, ciclo de 2.6s, 2 repeticiones
 * (doctrina 44 -- nunca infinito). mapa.js quita+reflow+pone la clase
 * is-pulsando en cada seleccion, asi que la animacion vuelve a arrancar de
 * cero aunque se elija el mismo pais dos veces seguidas. */
.slcpfyr-mapa__elevado-use--activo.is-pulsando {
	animation: slcpfyr-pulso 2.6s ease-in-out 2;
}

@keyframes slcpfyr-pulso {
	0%,
	100% {
		stroke-opacity: 1;
	}
	50% {
		stroke-opacity: 0.55;
	}
}

/* ---------------------------------------------------------------------
 * Rótulo del país señalado (Bloque G v2, corrección 4-sep-2026 tarde): pide
 * el cliente "que aparezca el nombre del país" en el over. Posición fija en
 * la esquina superior izquierda del viewBox (nunca sigue al puntero: no es
 * un tooltip flotante, doctrina de la spec original) -- mapa.js calcula el
 * ancho real del texto (getBBox) y ajusta el fondo. Oculto en reposo.
 * ------------------------------------------------------------------- */

.slcpfyr-mapa__etiqueta {
	opacity: 0;
	transition: opacity 150ms var(--im-ease);
}

.slcpfyr-mapa__etiqueta-fondo {
	fill: var(--slcpfyr-midnight);
}

.slcpfyr-mapa__etiqueta-texto {
	fill: var(--slcpfyr-white);
	font-family: var(--wp--preset--font-family--montserrat, 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif);
	font-weight: 700;
	font-size: 19px;
	text-anchor: middle;
	dominant-baseline: middle;
}

/* ---------------------------------------------------------------------
 * Dibujo de fronteras al entrar en pantalla -- TEMPORAL, disparado por
 * IntersectionObserver en TODOS los navegadores (Bloque G v2 §3.3: se
 * descarta animation-timeline: view() para este mapa -- a 1440x900 el mapa
 * ya arranca al ~24% de "cover" al cargar, un rango entry-based habria
 * terminado antes del primer fotograma, que es justo el bug que se corrige).
 * pathLength="100" en cada path (ver render.php) para que el dash funcione
 * igual sin importar el tamano real de cada pais.
 *
 * La guarda html.im-js / html.im-static la pone idea-motion.php en wp_head
 * prioridad 1 (antes del primer paint) segun prefers-reduced-motion /
 * saveData / si el kit js llega a arrancar (im-static automatico a los 3s
 * si no). Sin ella (im-static, o JS desactivado del todo -- <html> se queda
 * sin ninguna de las dos clases) el trazo esta completo desde el primer
 * fotograma via la regla base de arriba (stroke-dashoffset:0): nada queda
 * invisible.
 * ------------------------------------------------------------------- */

html.im-js .slcpfyr-mapa__mapa-col:not(.is-dibujado) .slcpfyr-mapa__pais {
	stroke-dashoffset: 100;
	animation: slcpfyr-dibujar-seguro var(--im-dibujo) var(--im-ease) 2.5s both;
}

html.im-js .slcpfyr-mapa__mapa-col.is-dibujado .slcpfyr-mapa__pais {
	animation: slcpfyr-dibujar-frontera var(--im-dibujo) var(--im-ease) both;
	animation-delay: calc(var(--slcpfyr-i, 0) * var(--im-stagger));
}

@keyframes slcpfyr-dibujar-frontera {
	from {
		stroke-dashoffset: 100;
	}
	to {
		stroke-dashoffset: 0;
	}
}

/* Red de seguridad (mismos keyframes, otro nombre): si is-dibujado llega
 * DESPUES de que esta animacion ya arranco, la regla de arriba deja de
 * aplicar (deja de matchear :not(.is-dibujado)) y la de .is-dibujado toma
 * el relevo desde el mismo stroke-dashoffset:100 -- el cambio de regla
 * arranca de cero, nunca salta a mitad de camino. */
@keyframes slcpfyr-dibujar-seguro {
	from {
		stroke-dashoffset: 100;
	}
	to {
		stroke-dashoffset: 0;
	}
}

html.im-js .slcpfyr-mapa__mapa-col:not(.is-dibujado) .slcpfyr-mapa__arista,
html.im-js .slcpfyr-mapa__mapa-col.is-dibujado .slcpfyr-mapa__arista {
	opacity: 0;
	animation: slcpfyr-aparecer-arista var(--im-entrada) var(--im-ease) 1.2s both;
}

@keyframes slcpfyr-aparecer-arista {
	from {
		opacity: 0;
	}
	to {
		opacity: 0.55;
	}
}

/* ---------------------------------------------------------------------
 * Ficha del pais activo (panel oscuro) -- Bloque G v2
 * ------------------------------------------------------------------- */

.slcpfyr-mapa__ficha {
	background: var(--slcpfyr-midnight);
	color: var(--slcpfyr-white);
	border-radius: 18px;
	padding: 32px;
	min-height: 11rem;
}

.slcpfyr-mapa__ficha-cabecera {
	display: flex;
	align-items: center;
	gap: 1rem;
	margin-bottom: 1.25rem;
}

.slcpfyr-mapa__bandera {
	display: block;
	width: auto;
	flex-shrink: 0;
	border-radius: 6px;
	background: #fff;
	box-shadow: inset 0 0 0 1px rgb(0 0 0 / 0.08), 0 1px 3px rgb(0 0 0 / 0.18);
}

.slcpfyr-mapa__bandera--ficha {
	height: 76px;
}

.slcpfyr-mapa__bandera--tarjeta {
	height: 40px;
}

/* El h4 hereda la asignacion directa de theme.json ":root :where(h1..h6)
 * {color:midnight}" (gana sobre la herencia del panel oscuro, doctrina --
 * mismo mecanismo que .slcpfyr-cabecera__h1); los <a> heredan
 * ":root :where(a){color:marine}". Sobre el fondo midnight, ambos casos
 * hay que fijarlos explicitamente -- esta es la causa raiz #2 del
 * diagnostico (textos invisibles). */
.slcpfyr-mapa__ficha .slcpfyr-mapa__ficha-nombre {
	color: var(--slcpfyr-white);
	font-size: 1.375rem;
	font-weight: 700;
	text-wrap: balance;
	margin: 0;
}

.slcpfyr-mapa__ficha .slcpfyr-mapa__sociedad {
	transition: opacity 300ms var(--im-ease), translate 300ms var(--im-ease);
}

.slcpfyr-mapa__ficha .slcpfyr-mapa__sociedad + .slcpfyr-mapa__sociedad {
	margin-top: 1.25rem;
	padding-top: 1.25rem;
	border-top: 1px solid rgb(255 255 255 / 0.12);
}

@starting-style {
	.slcpfyr-mapa__ficha .slcpfyr-mapa__sociedad {
		opacity: 0;
		translate: 0 8px;
	}
}

.slcpfyr-mapa__ficha .slcpfyr-mapa__sociedad-nombre {
	color: var(--slcpfyr-white);
	font-size: 1rem;
	font-weight: 700;
	margin: 0 0 0.35rem;
}

.slcpfyr-mapa__ficha .slcpfyr-mapa__sociedad-sigla {
	color: var(--slcpfyr-silver);
	font-size: 0.8125rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	margin: 0 0 0.75rem;
}

.slcpfyr-mapa__ficha .slcpfyr-mapa__sociedad-presidente {
	margin: 0 0 1rem;
	line-height: 1.5;
}

.slcpfyr-mapa__ficha .slcpfyr-mapa__sociedad-rotulo {
	color: var(--slcpfyr-silver);
	font-size: 0.6875rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.08em;
}

.slcpfyr-mapa__ficha .slcpfyr-mapa__ficha-nota {
	display: block;
	font-size: 0.8125rem;
	color: var(--slcpfyr-silver);
	margin-top: 0.15rem;
}

.slcpfyr-mapa__ficha .slcpfyr-mapa__sociedad-email a,
.slcpfyr-mapa__ficha .slcpfyr-mapa__sociedad-web a {
	color: var(--slcpfyr-marine-lt); /* ~5.5:1 sobre midnight */
	font-weight: 600;
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 2px;
	overflow-wrap: anywhere;
	display: inline-flex;
	min-height: 44px;
	align-items: center;
}

.slcpfyr-mapa__ficha .slcpfyr-mapa__sociedad-email a:hover,
.slcpfyr-mapa__ficha .slcpfyr-mapa__sociedad-email a:focus-visible,
.slcpfyr-mapa__ficha .slcpfyr-mapa__sociedad-web a:hover,
.slcpfyr-mapa__ficha .slcpfyr-mapa__sociedad-web a:focus-visible {
	color: var(--slcpfyr-white);
}

.slcpfyr-mapa__ficha .slcpfyr-mapa__sociedad-email a:focus-visible,
.slcpfyr-mapa__ficha .slcpfyr-mapa__sociedad-web a:focus-visible {
	outline: 3px solid var(--slcpfyr-silver);
	outline-offset: 2px;
}

/* ---------------------------------------------------------------------
 * <select> movil (toggle por CSS, no JS)
 * ------------------------------------------------------------------- */

.slcpfyr-mapa__select-label {
	font-weight: 600;
	color: var(--slcpfyr-titanium);
}

@media (max-width: 780px) {
	.slcpfyr-mapa__form-select {
		align-items: center;
		gap: 0.6rem;
	}
}

.slcpfyr-mapa__select {
	flex: 1;
	min-height: 48px;
	padding: 0.5rem 0.75rem;
	border: 1px solid var(--slcpfyr-hairline);
	border-radius: 0.5rem;
	background: var(--slcpfyr-white);
	color: var(--slcpfyr-titanium);
	font-family: inherit;
	font-size: 1rem;
}

.slcpfyr-mapa__select:focus-visible {
	outline: 3px solid var(--slcpfyr-silver);
	outline-offset: 1px;
}

.slcpfyr-mapa__select-submit {
	min-height: 48px;
	min-width: 48px;
	padding: 0.5rem 1rem;
	border: 1px solid var(--slcpfyr-marine);
	border-radius: 0.5rem;
	background: var(--slcpfyr-marine);
	color: var(--slcpfyr-white);
	font-family: inherit;
	font-weight: 600;
	cursor: pointer;
}

/* ---------------------------------------------------------------------
 * Lista completa (fallback SEO / sin JS, siempre presente) -- tarjetas
 * legibles, con aire (causa raiz #3: antes recortaba correos/URLs largas).
 * ------------------------------------------------------------------- */

.slcpfyr-mapa__lista {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(18rem, 1fr));
	gap: 1.5rem;
}

.slcpfyr-mapa__lista-item {
	background: var(--slcpfyr-white);
	border: 1px solid var(--slcpfyr-hairline);
	border-radius: 18px;
	padding: 28px;
	transition: border-color 200ms ease, box-shadow 200ms ease;
}

.slcpfyr-mapa__lista-item:hover {
	border-color: var(--slcpfyr-silver);
	box-shadow: 0 6px 20px rgb(17 29 48 / 0.06);
}

.slcpfyr-mapa__lista-item.is-activo {
	border-color: var(--slcpfyr-marine);
	box-shadow: inset 0 0 0 1px var(--slcpfyr-marine);
}

.slcpfyr-mapa__lista-titulo {
	margin: 0 0 0.75rem;
	font-size: 1rem;
}

.slcpfyr-mapa__lista-boton {
	display: inline-flex;
	align-items: center;
	gap: 0.6rem;
	min-height: 44px;
	padding: 0;
	background: none;
	border: none;
	font: inherit;
	font-weight: 700;
	font-size: 1.125rem;
	color: var(--slcpfyr-midnight);
	cursor: pointer;
	text-align: left;
}

.slcpfyr-mapa__lista-boton:focus-visible {
	outline: 3px solid var(--slcpfyr-silver);
	outline-offset: 2px;
}

.slcpfyr-mapa__lista-item.is-activo .slcpfyr-mapa__lista-boton {
	color: var(--slcpfyr-marine);
}

.slcpfyr-mapa__lista .slcpfyr-mapa__sociedad-nombre {
	color: var(--slcpfyr-midnight);
	font-size: 0.9375rem;
	font-weight: 700;
	margin: 0 0 0.35rem;
}

.slcpfyr-mapa__lista .slcpfyr-mapa__sociedad-sigla {
	color: var(--slcpfyr-titanium);
	font-size: 0.8125rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	margin: 0 0 0.5rem;
}

.slcpfyr-mapa__lista .slcpfyr-mapa__sociedad-presidente {
	margin: 0 0 0.5rem;
	font-size: 0.875rem;
	line-height: 1.5;
}

.slcpfyr-mapa__lista .slcpfyr-mapa__sociedad-rotulo {
	color: var(--slcpfyr-titanium);
	font-size: 0.6875rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.06em;
}

.slcpfyr-mapa__lista .slcpfyr-mapa__ficha-nota {
	display: block;
	font-size: 0.8125rem;
	color: var(--slcpfyr-titanium);
	margin-top: 0.15rem;
}

.slcpfyr-mapa__lista .slcpfyr-mapa__sociedad-email a,
.slcpfyr-mapa__lista .slcpfyr-mapa__sociedad-web a {
	color: var(--slcpfyr-marine);
	font-size: 0.875rem;
	font-weight: 600;
	text-decoration: none;
	overflow-wrap: anywhere; /* causa raiz #3: correos/URLs largas ya no se recortan */
	display: inline-flex;
	min-height: 44px;
	align-items: center;
}

.slcpfyr-mapa__lista .slcpfyr-mapa__sociedad-email a:hover,
.slcpfyr-mapa__lista .slcpfyr-mapa__sociedad-email a:focus-visible,
.slcpfyr-mapa__lista .slcpfyr-mapa__sociedad-web a:hover,
.slcpfyr-mapa__lista .slcpfyr-mapa__sociedad-web a:focus-visible {
	text-decoration: underline;
}

.slcpfyr-mapa__lista .slcpfyr-mapa__sociedad-email a:focus-visible,
.slcpfyr-mapa__lista .slcpfyr-mapa__sociedad-web a:focus-visible {
	outline: 3px solid var(--slcpfyr-silver);
	outline-offset: 2px;
}

/* Enlace a la ficha con URL propia de cada sociedad (subplan v6 §13, 5-sep) */
.slcpfyr-mapa__lista-ficha-enlace {
	margin: 0.5rem 0 0;
}
.slcpfyr-mapa__lista-ficha-enlace a {
	font-size: 0.8125rem;
	font-weight: 600;
	color: var(--slcpfyr-marine);
	text-decoration: none;
	display: inline-flex;
	min-height: 44px;
	align-items: center;
}
.slcpfyr-mapa__lista-ficha-enlace a:hover,
.slcpfyr-mapa__lista-ficha-enlace a:focus-visible {
	text-decoration: underline;
}
.slcpfyr-mapa__lista-ficha-enlace a:focus-visible {
	outline: 3px solid var(--slcpfyr-silver);
	outline-offset: 2px;
}

/* ---------------------------------------------------------------------
 * Movimiento sobrio: anular todo con prefers-reduced-motion o con la
 * guarda global im-static (idea-motion.php) -- doctrina: sin zoom/pan/
 * tooltips, pulso finito, y aqui ademas: nunca dejar el trazo o la ficha
 * en un estado a medio animar si el visitante pidio menos movimiento.
 * ------------------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
	.slcpfyr-mapa__pais,
	.slcpfyr-mapa__arista,
	.slcpfyr-mapa__elevado-use,
	.slcpfyr-mapa__pais-link,
	.slcpfyr-mapa__etiqueta,
	.slcpfyr-mapa__sociedad,
	.slcpfyr-mapa__lista-item {
		animation: none !important;
		transition: none !important;
	}
	.slcpfyr-mapa__pais {
		stroke-dashoffset: 0;
	}
	.slcpfyr-mapa__arista {
		opacity: 0.55;
	}
	.slcpfyr-mapa__elevado-use--hover,
	.slcpfyr-mapa__elevado-use--activo {
		transform: none;
	}
}

html.im-static .slcpfyr-mapa__pais,
html.im-static .slcpfyr-mapa__arista,
html.im-static .slcpfyr-mapa__elevado-use,
html.im-static .slcpfyr-mapa__pais-link,
html.im-static .slcpfyr-mapa__etiqueta,
html.im-static .slcpfyr-mapa__sociedad,
html.im-static .slcpfyr-mapa__lista-item {
	animation: none !important;
	transition: none !important;
}

html.im-static .slcpfyr-mapa__pais {
	stroke-dashoffset: 0;
}

html.im-static .slcpfyr-mapa__arista {
	opacity: 0.55;
}

html.im-static .slcpfyr-mapa__elevado-use--hover,
html.im-static .slcpfyr-mapa__elevado-use--activo {
	transform: none;
}