/*
Theme Name: JUFEP
Theme URI: https://jufep.com
Description: Tema de bloques para la Junta Federal de Educación Privada. Sin page builder: el diseño vive en theme.json y las secciones se arman con patterns.
Author: Sommie
Version: 0.1.0
Requires at least: 6.6
Tested up to: 7.1
Requires PHP: 8.1
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: jufep
*/

/* Casi todo el estilo sale de theme.json.
   Acá sólo lo que theme.json todavía no puede expresar. */

body {
  -webkit-font-smoothing: antialiased;
  text-wrap: pretty;
}

:where(h1, h2, h3) {
  text-wrap: balance;
}

/* Listas sin viñeta — usada en footer y tarjetas de servicio.
   Se registra como block style en inc/setup.php para que aparezca
   en el editor y el cliente pueda elegirla. */
.wp-block-list.is-style-jufep-plain {
  list-style: none;
  padding-left: 0;
}

/* ---------------------------------------------------------------
   Recurso visual de marca: campo azul con líneas de latitud.
   Es el elemento distintivo que se repite en todo el sitio.
   --------------------------------------------------------------- */

.jufep-marca-panel,
.jufep-avatar-panel {
  position: relative;
  display: grid;
  place-items: center;
  overflow: hidden;
  border-radius: 2px;
  background: var(--wp--preset--color--azul-profundo);
  color: #7e9bd4;
}

.jufep-marca-panel {
  min-height: 520px;
}

.jufep-avatar-panel {
  min-height: 380px;
  gap: 1.375rem;
  align-content: center;
}

.jufep-marca-panel__lineas {
  position: absolute;
  inset: 3.625rem 0;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.jufep-marca-panel__lineas i {
  display: block;
  height: 1px;
  background: rgb(237 241 250 / 10%);
}

.jufep-marca-panel__lineas i:nth-child(3) {
  background: rgb(237 241 250 / 16%);
}

.jufep-marca-panel__centro {
  position: relative;
  display: grid;
  justify-items: center;
  gap: 1.625rem;
  text-align: center;
}

.jufep-marca-panel__titulo {
  margin: 0;
  color: var(--wp--preset--color--azul-tinte);
  font-family: var(--wp--preset--font-family--titulos);
  font-size: 1.5rem;
}

.jufep-marca-panel__pie {
  margin: 0;
  font-size: 0.719rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
}

.jufep-avatar-panel__aro {
  display: grid;
  place-items: center;
  width: 132px;
  height: 132px;
  border: 1px solid rgb(126 155 212 / 55%);
  border-radius: 50%;
  background: rgb(126 155 212 / 8%);
  color: var(--wp--preset--color--azul-claro);
}

.jufep-avatar-panel__estado {
  display: inline-flex;
  gap: 0.563rem;
  align-items: center;
  margin: 0;
  padding: 0.5rem 1rem;
  border: 1px solid rgb(126 155 212 / 40%);
  border-radius: 20px;
  color: var(--wp--preset--color--azul-claro);
  font-size: 0.781rem;
}

/* --- Muestra de conversación del asistente --- */

.jufep-chat {
  display: flex;
  flex-direction: column;
  gap: 1.125rem;
  min-height: 380px;
  padding: 1.875rem;
  border: 1px solid var(--wp--preset--color--linea);
  border-radius: 2px;
  background: var(--wp--preset--color--papel);
}

.jufep-chat__titulo {
  margin: 0;
  padding-bottom: 1rem;
  border-bottom: 1px solid var(--wp--preset--color--linea-suave);
  color: var(--wp--preset--color--azul-profundo);
  font-weight: 600;
}

.jufep-chat__hilo {
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: 0.75rem;
}

.jufep-chat__bot,
.jufep-chat__persona {
  max-width: 86%;
  margin: 0;
  padding: 0.875rem 1.125rem;
  line-height: 1.55;
}

.jufep-chat__bot {
  align-self: flex-start;
  border-radius: 2px 12px 12px;
  background: var(--wp--preset--color--azul-tinte);
  color: var(--wp--preset--color--azul-medio);
}

.jufep-chat__persona {
  align-self: flex-end;
  border-radius: 12px 2px 12px 12px;
  background: var(--wp--preset--color--azul);
  color: #fff;
}

.jufep-chat__chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.jufep-chat__chips li {
  padding: 0.563rem 0.938rem;
  border: 1px solid var(--wp--preset--color--azul-linea);
  border-radius: 18px;
  color: var(--wp--preset--color--azul-medio);
  font-size: 0.813rem;
}

/* ---------------------------------------------------------------
   Entidades fundadoras.
   --------------------------------------------------------------- */

.jufep-fundadoras {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
  gap: 4rem;
  align-items: start;
}

.jufep-fundadoras__rotulo {
  margin: 0;
  color: var(--wp--preset--color--ocre);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.15em;
  text-transform: uppercase;
}

.jufep-fundadoras__titulo {
  margin: 0.875rem 0 0;
  color: var(--wp--preset--color--azul-profundo);
  font-family: var(--wp--preset--font-family--titulos);
  font-size: clamp(1.875rem, 3vw, 2.75rem);
  font-weight: 500;
  line-height: 1.12;
  letter-spacing: -0.012em;
}

.jufep-fundadoras__bajada {
  margin: 1.25rem 0 0;
  color: var(--wp--preset--color--tinta-suave);
  font-size: 1.063rem;
  line-height: 1.6;
}

.jufep-fundadoras__lista {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.jufep-fundadora__enlace {
  display: flex;
  flex-direction: column;
  gap: 0.375rem;
  height: 100%;
  padding: 1.5rem;
  border: 1px solid var(--wp--preset--color--linea);
  border-left: 3px solid var(--wp--preset--color--azul);
  border-radius: 2px;
  background: var(--wp--preset--color--papel);
  text-decoration: none;
  transition: border-left-color 0.15s ease, background 0.15s ease;
}

.jufep-fundadora__enlace:hover {
  border-left-color: var(--wp--preset--color--ocre);
  background: var(--wp--preset--color--azul-tinte);
}

.jufep-fundadora__logo {
  width: 3.5rem;
  height: 3.5rem;
  margin-bottom: 0.5rem;
  object-fit: contain;
}

.jufep-fundadora__sigla {
  color: var(--wp--preset--color--azul);
  font-size: 1.125rem;
  font-weight: 700;
  letter-spacing: 0.06em;
}

.jufep-fundadora__nombre {
  color: var(--wp--preset--color--tinta);
  font-size: 0.875rem;
  line-height: 1.45;
}

.jufep-fundadora__provincia {
  margin-top: 0.25rem;
  color: var(--wp--preset--color--gris);
  font-size: 0.75rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

/* ---------------------------------------------------------------
   Manifiesto — "Nuestra gran idea".
   La cita es la pieza central; los tres valores cierran en fila.
   --------------------------------------------------------------- */

.jufep-manifiesto {
  display: grid;
  justify-items: center;
  max-width: 62rem;
  margin-inline: auto;
  text-align: center;
}

.jufep-manifiesto__rotulo {
  margin: 0;
  color: var(--wp--preset--color--papel);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.15em;
  text-transform: uppercase;
}

.jufep-manifiesto__cita {
  position: relative;
  margin: 2rem 0 0;
  color: var(--wp--preset--color--papel);
  font-family: var(--wp--preset--font-family--titulos);
  font-size: clamp(1.625rem, 3.2vw, 2.625rem);
  font-weight: 400;
  line-height: 1.34;
  text-wrap: balance;
}

.jufep-manifiesto__cita em {
  color: var(--wp--preset--color--ocre-claro);
  font-style: normal;
}

.jufep-manifiesto__comilla {
  position: absolute;
  top: -0.45em;
  left: -0.55em;
  color: rgb(185 203 234 / 28%);
  font-size: 3.5em;
  line-height: 1;
  pointer-events: none;
}

.jufep-manifiesto__firma {
  display: inline-flex;
  gap: 0.875rem;
  align-items: center;
  margin: 2.25rem 0 0;
  color: var(--wp--preset--color--papel);
  font-size: 0.813rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.jufep-manifiesto__filete {
  display: block;
  width: 2.75rem;
  height: 1px;
  background: rgb(185 203 234 / 45%);
}

.jufep-manifiesto__valores {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.5rem;
  width: 100%;
  margin: 3.5rem 0 0;
  padding: 0;
  list-style: none;
}

.jufep-valor {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  padding-top: 1.25rem;
  border-top: 1px solid rgb(185 203 234 / 30%);
}

.jufep-valor__verbo {
  color: var(--wp--preset--color--papel);
  font-family: var(--wp--preset--font-family--titulos);
  font-size: 1.5rem;
}

.jufep-valor__resto {
  color: var(--wp--preset--color--azul-claro);
  font-size: 0.938rem;
}

/* --- Chips de filtro del directorio --- */

/* ---------------------------------------------------------------
   Directorio de asociaciones — encabezado, buscador, filtros,
   grilla de tarjetas y ficha individual.
   --------------------------------------------------------------- */

.jufep-directorio-encabezado__rotulo {
  margin: 0;
  color: var(--wp--preset--color--ocre);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.15em;
  text-transform: uppercase;
}

.jufep-directorio-encabezado__titulo {
  max-width: 20ch;
  margin: 0.75rem 0 0;
  color: var(--wp--preset--color--azul-profundo);
  font-family: var(--wp--preset--font-family--titulos);
  font-size: clamp(2.25rem, 5vw, 3.5rem);
  font-weight: 400;
  line-height: 1.05;
  letter-spacing: -0.015em;
}

.jufep-directorio-encabezado__bajada {
  max-width: 54ch;
  margin: 1.25rem 0 0;
  color: var(--wp--preset--color--tinta-suave);
  font-size: 1.063rem;
  line-height: 1.6;
}

.jufep-directorio-encabezado__nota {
  margin: 0.625rem 0 0;
  color: var(--wp--preset--color--gris);
  font-size: 0.875rem;
}

/* --- Buscador --- */

.jufep-buscador {
  margin-bottom: 1.5rem;
}

.jufep-buscador__form {
  display: flex;
  max-width: 34rem;
  border: 1px solid var(--wp--preset--color--azul-linea);
  border-radius: 2px;
  background: var(--wp--preset--color--blanco);
}

.jufep-buscador__form:focus-within {
  border-color: var(--wp--preset--color--azul);
}

.jufep-buscador__campo {
  flex: 1 1 auto;
  min-width: 0;
  padding: 0.875rem 1rem;
  border: 0;
  background: transparent;
  color: var(--wp--preset--color--tinta);
  font-family: var(--wp--preset--font-family--textos);
  font-size: 0.938rem;
}

.jufep-buscador__campo::placeholder {
  color: var(--wp--preset--color--gris);
}

.jufep-buscador__campo:focus {
  outline: 0;
}

.jufep-buscador__boton {
  flex: 0 0 auto;
  padding: 0.875rem 1.5rem;
  border: 0;
  background: var(--wp--preset--color--azul);
  color: var(--wp--preset--color--blanco);
  font-family: var(--wp--preset--font-family--textos);
  font-size: 0.938rem;
  font-weight: 600;
  cursor: pointer;
}

.jufep-buscador__boton:hover {
  background: var(--wp--preset--color--azul-medio);
}

/* --- Chips de provincia --- */

.jufep-filtros {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.jufep-filtros__chip {
  display: inline-flex;
  gap: 0.438rem;
  align-items: center;
  padding: 0.5rem 0.875rem;
  border: 1px solid var(--wp--preset--color--azul-linea);
  border-radius: 2px;
  color: var(--wp--preset--color--azul-medio);
  font-size: 0.813rem;
  white-space: nowrap;
  text-decoration: none;
}

.jufep-filtros__chip:hover {
  border-color: var(--wp--preset--color--azul);
  background: var(--wp--preset--color--azul-tinte);
}

.jufep-filtros__chip.is-activo {
  border-color: var(--wp--preset--color--azul);
  background: var(--wp--preset--color--azul);
  color: var(--wp--preset--color--blanco);
  font-weight: 600;
}

.jufep-filtros__cuenta {
  font-size: 0.688rem;
  opacity: 0.65;
}

/* --- Grilla de tarjetas ---
   grid-auto-rows: 1fr es lo que empareja el alto. Sin eso cada tarjeta
   mide lo que mide su título y la fila queda dentada. */

.jufep-directorio {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(17.5rem, 1fr));
  grid-auto-rows: 1fr;
  gap: 1.25rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.jufep-directorio__item {
  display: flex;
}

.jufep-directorio__vacio {
  color: var(--wp--preset--color--gris);
  font-size: 1.063rem;
}

.jufep-tarjeta {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  padding: 1.625rem 1.5rem 1.375rem;
  border: 1px solid var(--wp--preset--color--linea);
  border-radius: 2px;
  background: var(--wp--preset--color--blanco);
  color: inherit;
  text-decoration: none;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.jufep-tarjeta:hover {
  border-color: var(--wp--preset--color--azul);
  box-shadow: 0 2px 14px rgb(42 82 162 / 9%);
}

/* La fundadora se distingue con un filete al costado, no con otro color
   de fondo: la grilla tiene que seguir leyéndose pareja. */
.jufep-tarjeta--fundadora {
  border-left: 3px solid var(--wp--preset--color--ocre);
}

/* El logo va arriba a la derecha y sólo si existe. No se reserva lugar para
   las que no lo tienen: una grilla llena de huecos vacíos se ve rota.
   El margen negativo abajo hace que no ocupe alto: sin eso el título baja y
   queda desalineado con los de las tarjetas vecinas. El título le deja lugar
   con padding a la derecha. */
.jufep-tarjeta__cabeza {
  display: flex;
  gap: 1rem;
  align-items: flex-start;
  justify-content: space-between;
}

.jufep-tarjeta__logo {
  flex: 0 0 auto;
  width: 3.25rem;
  height: 3.25rem;
  margin: -0.375rem -0.25rem -2.25rem 0;
  object-fit: contain;
}

.jufep-tarjeta__cabeza:has(.jufep-tarjeta__logo) + .jufep-tarjeta__titulo {
  padding-right: 3.25rem;
}

.jufep-tarjeta__ambito {
  margin: 0;
  color: var(--wp--preset--color--ocre);
  font-size: 0.688rem;
  font-weight: 600;
  letter-spacing: 0.11em;
  text-transform: uppercase;
}

.jufep-tarjeta__ambito--nacional {
  color: var(--wp--preset--color--gris);
}

.jufep-tarjeta__titulo {
  margin: 0.75rem 0 0;
  color: var(--wp--preset--color--azul);
  font-family: var(--wp--preset--font-family--titulos);
  font-size: 1.313rem;
  font-weight: 400;
  line-height: 1.2;
  text-wrap: balance;
}

.jufep-tarjeta:hover .jufep-tarjeta__titulo {
  color: var(--wp--preset--color--azul-profundo);
}

.jufep-tarjeta__sigla {
  margin: 0.5rem 0 0;
  color: var(--wp--preset--color--gris);
  font-size: 0.813rem;
  font-weight: 600;
  letter-spacing: 0.06em;
}

/* margin-top: auto empuja el pie al fondo. Con las tarjetas ya emparejadas,
   es lo que alinea todos los "Ver ficha" de una misma fila. */
.jufep-tarjeta__pie {
  margin-top: auto;
  padding-top: 1.25rem;
}

.jufep-tarjeta__niveles {
  margin: 0 0 0.75rem;
  padding-top: 0.875rem;
  border-top: 1px solid var(--wp--preset--color--linea-suave);
  color: var(--wp--preset--color--gris);
  font-size: 0.813rem;
}

.jufep-tarjeta__sello {
  display: inline-block;
  margin: 0 0 0.75rem;
  padding: 0.188rem 0.5rem;
  border: 1px solid var(--wp--preset--color--ocre);
  border-radius: 2px;
  color: var(--wp--preset--color--ocre);
  font-size: 0.625rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.jufep-tarjeta__enlace {
  display: block;
  color: var(--wp--preset--color--azul);
  font-size: 0.875rem;
  font-weight: 600;
}

/* --- Ficha individual --- */

.jufep-ficha__portada {
  padding: 3.5rem 0 2.75rem;
  background: var(--wp--preset--color--azul-profundo);
}

.jufep-ficha__portada-interior,
.jufep-ficha__cuerpo {
  max-width: 1312px;
  margin: 0 auto;
  padding-right: 1.25rem;
  padding-left: 1.25rem;
}

.jufep-ficha__cuerpo {
  padding-top: 3.5rem;
}

/* Los logos traen texto negro y rellenos claros: sobre azul profundo se
   pierden. Van en una placa de papel, que además los empareja entre sí. */
.jufep-ficha__portada-interior--logo {
  display: flex;
  gap: 2rem;
  align-items: center;
}

.jufep-ficha__placa {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  width: 8.5rem;
  height: 8.5rem;
  padding: 0.875rem;
  border-radius: 2px;
  background: var(--wp--preset--color--papel);
}

.jufep-ficha__logo {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.jufep-ficha__ambito {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  align-items: center;
  margin: 0;
  color: var(--wp--preset--color--ocre-claro);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.15em;
  text-transform: uppercase;
}

.jufep-ficha__sello {
  padding: 0.188rem 0.563rem;
  border: 1px solid rgb(237 241 250 / 28%);
  border-radius: 2px;
  color: var(--wp--preset--color--azul-claro);
  font-size: 0.625rem;
  letter-spacing: 0.1em;
}

.jufep-ficha__titulo {
  max-width: 24ch;
  margin: 1rem 0 0;
  color: var(--wp--preset--color--papel);
  font-family: var(--wp--preset--font-family--titulos);
  font-size: clamp(1.875rem, 4vw, 2.75rem);
  font-weight: 400;
  line-height: 1.1;
  text-wrap: balance;
}

.jufep-ficha__sigla {
  margin: 0.875rem 0 0;
  color: var(--wp--preset--color--azul-claro);
  font-size: 0.875rem;
  font-weight: 600;
  letter-spacing: 0.1em;
}

.jufep-ficha__columnas {
  display: grid;
  grid-template-columns: minmax(0, 58fr) minmax(0, 42fr);
  gap: 3rem;
}

.jufep-ficha__rotulo {
  margin: 0;
  color: var(--wp--preset--color--ocre);
  font-size: 0.688rem;
  font-weight: 600;
  letter-spacing: 0.13em;
  text-transform: uppercase;
}

.jufep-ficha__rotulo--separado {
  margin-top: 2.5rem;
}

.jufep-ficha__lista {
  margin: 1.25rem 0 0;
}

.jufep-ficha__fila {
  display: flex;
  gap: 1rem;
  justify-content: space-between;
  padding: 0.875rem 0;
  border-bottom: 1px solid var(--wp--preset--color--linea-suave);
}

.jufep-ficha__fila dt {
  color: var(--wp--preset--color--gris);
  font-size: 0.875rem;
}

.jufep-ficha__fila dd {
  margin: 0;
  color: var(--wp--preset--color--tinta);
  font-weight: 600;
  text-align: right;
}

.jufep-ficha__texto {
  margin-top: 1rem;
  color: var(--wp--preset--color--tinta-suave);
  line-height: 1.7;
}

.jufep-ficha__lateral {
  padding-left: 3rem;
  border-left: 1px solid var(--wp--preset--color--linea-suave);
}

.jufep-ficha__valor {
  margin: 0.5rem 0 0;
  color: var(--wp--preset--color--tinta);
}

.jufep-ficha__volver {
  margin: 0;
  padding: 3rem 0;
  border-top: 1px solid var(--wp--preset--color--linea);
  font-size: 0.938rem;
}

/* --- Ficha todavía sin datos ---
   Es una pantalla deliberada, no un error: dice qué falta, muestra lo
   que sí sabemos y deja un camino de contacto abierto. */

.jufep-preparacion {
  max-width: 42rem;
  margin: 0 auto;
  padding: 1rem 0 3rem;
  text-align: center;
}

.jufep-preparacion__marca {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 4.5rem;
  height: 4.5rem;
  margin: 0 auto;
  border: 1px solid var(--wp--preset--color--azul-linea);
  border-radius: 50%;
  color: var(--wp--preset--color--azul);
}

.jufep-preparacion__marca svg {
  width: 2.25rem;
  height: 2.063rem;
}

.jufep-preparacion__estado {
  margin: 1.5rem 0 0;
  color: var(--wp--preset--color--ocre);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.15em;
  text-transform: uppercase;
}

.jufep-preparacion__titulo {
  margin: 0.875rem 0 0;
  color: var(--wp--preset--color--azul-profundo);
  font-family: var(--wp--preset--font-family--titulos);
  font-size: clamp(1.5rem, 3.2vw, 2rem);
  font-weight: 400;
  line-height: 1.2;
  text-wrap: balance;
}

.jufep-preparacion__texto {
  margin: 1.25rem 0 0;
  color: var(--wp--preset--color--tinta-suave);
  font-size: 1.063rem;
  line-height: 1.65;
}

.jufep-preparacion__datos {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr));
  gap: 1px;
  margin-top: 2.5rem;
  border: 1px solid var(--wp--preset--color--linea);
  border-radius: 2px;
  background: var(--wp--preset--color--linea);
  overflow: hidden;
  text-align: left;
}

.jufep-preparacion__dato {
  padding: 1.125rem 1.25rem;
  background: var(--wp--preset--color--blanco);
}

.jufep-preparacion__clave {
  display: block;
  color: var(--wp--preset--color--gris);
  font-size: 0.688rem;
  font-weight: 600;
  letter-spacing: 0.11em;
  text-transform: uppercase;
}

.jufep-preparacion__valor {
  display: block;
  margin-top: 0.375rem;
  color: var(--wp--preset--color--tinta);
  font-weight: 600;
}

.jufep-preparacion__acciones {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  align-items: center;
  justify-content: center;
  margin-top: 2.5rem;
}

.jufep-preparacion__boton {
  padding: 1rem 1.75rem;
  border-radius: 2px;
  background: var(--wp--preset--color--azul);
  color: var(--wp--preset--color--blanco);
  font-size: 0.938rem;
  font-weight: 600;
  text-decoration: none;
}

.jufep-preparacion__boton:hover {
  background: var(--wp--preset--color--azul-medio);
}

.jufep-preparacion__enlace {
  color: var(--wp--preset--color--azul);
  font-size: 0.938rem;
  font-weight: 600;
}

.jufep-preparacion__pie {
  margin: 2rem 0 0;
  color: var(--wp--preset--color--gris);
  font-size: 0.875rem;
}

@media (max-width: 860px) {
  .jufep-ficha__columnas {
    grid-template-columns: minmax(0, 1fr);
    gap: 2.5rem;
  }

  .jufep-ficha__lateral {
    padding-top: 2rem;
    padding-left: 0;
    border-top: 1px solid var(--wp--preset--color--linea-suave);
    border-left: 0;
  }
}

@media (max-width: 600px) {
  .jufep-buscador__form {
    max-width: none;
  }

  .jufep-ficha__portada-interior--logo {
    flex-direction: column;
    gap: 1.5rem;
    align-items: flex-start;
  }

  .jufep-ficha__placa {
    width: 5.5rem;
    height: 5.5rem;
    padding: 0.5rem;
  }

  .jufep-directorio {
    grid-template-columns: minmax(0, 1fr);
    grid-auto-rows: auto;
  }
}

/* ---------------------------------------------------------------
   Mapa federal — sección de portada.
   La geometría sale de inc/mapa-argentina.php y el contenido, del
   directorio de asociaciones. Acá está sólo el aspecto.
   --------------------------------------------------------------- */

.jufep-mapa {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 400px) minmax(0, 1fr);
  grid-template-areas:
    "intro  intro"
    "cifras cifras"
    "mapa   panel";
  gap: 2.25rem 4rem;
  align-items: start;
}

/* Las mismas líneas de latitud del panel de marca: es el recurso
   que se repite en hero, asistente y footer. */
.jufep-mapa__lineas {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  pointer-events: none;
}

.jufep-mapa__lineas i {
  display: block;
  height: 1px;
  background: rgb(237 241 250 / 7%);
}

.jufep-mapa__lineas i:nth-child(4) {
  background: rgb(237 241 250 / 14%);
}

.jufep-mapa__intro {
  position: relative;
  grid-area: intro;
  max-width: 46rem;
}

.jufep-mapa__rotulo {
  margin: 0;
  color: var(--wp--preset--color--ocre-claro);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.15em;
  text-transform: uppercase;
}

.jufep-mapa__titulo {
  margin: 0.875rem 0 0;
  color: var(--wp--preset--color--blanco);
  font-family: var(--wp--preset--font-family--titulos);
  font-size: clamp(1.875rem, 1.2rem + 2vw, 2.75rem);
  font-weight: 500;
  line-height: 1.12;
  letter-spacing: -0.012em;
}

.jufep-mapa__bajada {
  margin: 0.875rem 0 0;
  max-width: 40rem;
  color: var(--wp--preset--color--azul-claro);
  font-size: 1.1875rem;
}

/* --- Las cifras, misma sección: lectura numérica del mapa --- */

.jufep-mapa__cifras {
  position: relative;
  grid-area: cifras;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 2rem;
}

.jufep-mapa__cifra {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: baseline;
  column-gap: 0.75rem;
  padding-top: 0.875rem;
  /* border-style explícito: sin esto el borde queda indefinido. */
  border-top: 2px solid rgb(237 241 250 / 22%);
  text-decoration: none;
  transition: border-color 0.15s ease;
}

.jufep-mapa__cifra:hover {
  border-top-color: var(--wp--preset--color--ocre-claro);
}

.jufep-mapa__cifra-valor {
  grid-row: span 2;
  color: var(--wp--preset--color--blanco);
  font-family: var(--wp--preset--font-family--titulos);
  font-size: clamp(2rem, 2.6vw, 2.5rem);
  line-height: 1;
}

.jufep-mapa__cifra-rotulo {
  color: var(--wp--preset--color--blanco);
  font-size: 0.9375rem;
  font-weight: 600;
  line-height: 1.2;
}

.jufep-mapa__cifra-nota {
  color: var(--wp--preset--color--azul-claro);
  font-size: 0.8125rem;
  line-height: 1.35;
}

/* --- El mapa --- */

.jufep-mapa__figura {
  position: relative;
  grid-area: mapa;
  display: grid;
  justify-items: center;
  gap: 1.5rem;
  margin: 0;
}

.jufep-mapa__svg {
  display: block;
  width: auto;
  max-width: 100%;
  height: min(660px, 74vh);
  overflow: visible;
}

.jufep-mapa__provincia {
  fill: rgb(237 241 250 / 4%);
  stroke: rgb(237 241 250 / 15%);
  stroke-width: 1.1;
  stroke-linejoin: round;
  transition: fill 160ms ease, stroke 160ms ease;
}

.jufep-mapa__provincia.is-activa {
  fill: rgb(42 82 162 / 58%);
  stroke: #7e9bd4;
  stroke-width: 1.3;
}

.jufep-mapa__provincia.is-fundadora {
  fill: rgb(42 82 162 / 68%);
  stroke: var(--wp--preset--color--ocre-claro);
}

.jufep-mapa__punto {
  fill: var(--wp--preset--color--azul-claro);
  transform-box: fill-box;
  transform-origin: center;
  animation: jufep-pulso 3.6s ease-in-out infinite;
  transition: fill 160ms ease;
}

.jufep-mapa__provincia.is-fundadora + .jufep-mapa__punto {
  fill: var(--wp--preset--color--ocre-claro);
}

/* Tres tandas de retardo para que los puntos no latan al unísono. */
.jufep-mapa__enlace:nth-of-type(3n + 2) .jufep-mapa__punto {
  animation-delay: 1.2s;
}

.jufep-mapa__enlace:nth-of-type(3n) .jufep-mapa__punto {
  animation-delay: 2.4s;
}

@keyframes jufep-pulso {
  0%,
  100% {
    opacity: 0.55;
    transform: scale(0.62);
  }

  50% {
    opacity: 1;
    transform: scale(1);
  }
}

.jufep-mapa__enlace {
  cursor: pointer;
}

.jufep-mapa__enlace:hover .jufep-mapa__provincia,
.jufep-mapa__enlace:focus-visible .jufep-mapa__provincia,
.jufep-mapa__enlace.is-resaltada .jufep-mapa__provincia {
  fill: rgb(42 82 162 / 95%);
  stroke: var(--wp--preset--color--ocre-claro);
  stroke-width: 1.8;
}

.jufep-mapa__enlace:hover .jufep-mapa__punto,
.jufep-mapa__enlace:focus-visible .jufep-mapa__punto,
.jufep-mapa__enlace.is-resaltada .jufep-mapa__punto {
  fill: var(--wp--preset--color--blanco);
  animation: none;
  transform: scale(1.15);
}

.jufep-mapa__enlace:focus-visible {
  outline: 2px solid var(--wp--preset--color--ocre-claro);
  outline-offset: 3px;
}

.jufep-mapa__leyenda {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 1.25rem;
  color: var(--wp--preset--color--azul-claro);
  font-size: 0.75rem;
}

.jufep-mapa__llave::before {
  content: "";
  display: inline-block;
  width: 0.625rem;
  height: 0.625rem;
  margin-right: 0.5rem;
  border: 1px solid;
  border-radius: 2px;
}

.jufep-mapa__llave--fundadora::before {
  border-color: var(--wp--preset--color--ocre-claro);
  background: rgb(42 82 162 / 68%);
}

.jufep-mapa__llave--activa::before {
  border-color: #7e9bd4;
  background: rgb(42 82 162 / 58%);
}

.jufep-mapa__llave--vacia::before {
  border-color: rgb(237 241 250 / 25%);
  background: rgb(237 241 250 / 4%);
}

/* --- El panel --- */

.jufep-mapa__panel {
  position: relative;
  grid-area: panel;
  display: grid;
  gap: 2.25rem;
  align-content: start;
}

/* Sin JavaScript se ven todas las fichas y la sección queda como una
   nómina completa. La clase la pone el script: recién ahí se ocultan. */
.jufep-mapa.is-interactivo .jufep-mapa__ficha {
  display: none;
}

.jufep-mapa.is-interactivo .jufep-mapa__ficha.is-visible {
  display: block;
  animation: jufep-ficha-entra 220ms ease both;
}

@keyframes jufep-ficha-entra {
  from {
    opacity: 0;
    transform: translateY(6px);
  }
}

.jufep-mapa__ficha-titulo {
  margin: 0;
  color: var(--wp--preset--color--blanco);
  font-family: var(--wp--preset--font-family--titulos);
  font-size: 1.625rem;
  font-weight: 500;
  line-height: 1.2;
}

.jufep-mapa__ficha-nota {
  margin: 0.5rem 0 0;
  color: var(--wp--preset--color--azul-claro);
  font-size: 0.875rem;
}

.jufep-mapa__ficha-lista {
  list-style: none;
  display: grid;
  gap: 1px;
  margin: 1.5rem 0 0;
  padding: 0;
  background: rgb(237 241 250 / 12%);
  border-block: 1px solid rgb(237 241 250 / 12%);
}

.jufep-mapa__ficha-lista a {
  display: grid;
  grid-template-columns: 7rem minmax(0, 1fr);
  gap: 1rem;
  align-items: baseline;
  padding: 0.875rem 0.25rem;
  background: var(--wp--preset--color--azul-profundo);
  color: var(--wp--preset--color--azul-tinte);
  text-decoration: none;
}

.jufep-mapa__ficha-lista a:hover,
.jufep-mapa__ficha-lista a:focus-visible {
  background: rgb(42 82 162 / 35%);
}

.jufep-mapa__sigla {
  color: var(--wp--preset--color--ocre-claro);
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.jufep-mapa__nombre {
  font-size: 0.9375rem;
  line-height: 1.4;
}

/* Sin sigla, la entidad ocupa las dos columnas y no deja un hueco. */
.jufep-mapa__nombre:first-child {
  grid-column: 1 / -1;
}

.jufep-mapa__ficha-pie {
  display: inline-block;
  margin-top: 1.25rem;
  color: var(--wp--preset--color--ocre-claro);
  font-size: 0.844rem;
  text-decoration: none;
}

.jufep-mapa__ficha-pie:hover {
  text-decoration: underline;
}

.jufep-mapa__chips {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin: 1.5rem 0 0;
  padding: 0;
}

.jufep-mapa__chip {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.375rem 0.75rem;
  border: 1px solid rgb(237 241 250 / 18%);
  border-radius: 2px;
  color: var(--wp--preset--color--azul-tinte);
  font-size: 0.844rem;
  text-decoration: none;
  transition: border-color 160ms ease, background 160ms ease;
}

.jufep-mapa__chip:hover,
.jufep-mapa__chip.is-resaltado {
  border-color: var(--wp--preset--color--ocre-claro);
  background: rgb(42 82 162 / 45%);
}

.jufep-mapa__chip.is-nacional {
  border-style: dashed;
}

.jufep-mapa__chip-cuenta {
  color: var(--wp--preset--color--azul-claro);
  font-size: 0.75rem;
}

@media (prefers-reduced-motion: reduce) {
  .jufep-mapa__punto,
  .jufep-mapa.is-interactivo .jufep-mapa__ficha.is-visible {
    animation: none;
  }
}

@media (width <= 1024px) {
  .jufep-mapa__cifras {
    gap: 1.5rem;
  }

  .jufep-fundadoras {
    grid-template-columns: 1fr;
    gap: 2.5rem;
  }

  .jufep-mapa {
    grid-template-columns: minmax(0, 300px) minmax(0, 1fr);
    gap: 2.25rem 2.5rem;
  }

  .jufep-mapa__svg {
    height: min(540px, 62vh);
  }
}

@media (width <= 781px) {
  .jufep-fundadoras__lista {
    grid-template-columns: 1fr;
  }

  .jufep-mapa__cifras {
    grid-template-columns: 1fr;
    gap: 1.25rem;
  }

  .jufep-marca-panel {
    min-height: 320px;
  }

  .jufep-marca-panel__centro svg {
    width: 112px;
    height: 103px;
  }

  .jufep-manifiesto__valores {
    grid-template-columns: 1fr;
    gap: 1rem;
  }

  .jufep-manifiesto__comilla {
    display: none;
  }

  .jufep-mapa {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas:
      "intro"
      "cifras"
      "mapa"
      "panel";
  }

  .jufep-mapa__svg {
    height: min(460px, 58vh);
  }

  .jufep-mapa__ficha-lista a {
    grid-template-columns: 1fr;
    gap: 0.25rem;
  }
}