/* =========================================================================
 * PickleLoop UI
 *
 * Los colores salen de la identidad ya fijada. Regla de contraste heredada:
 * el turquesa oficial es oscuro, así que manda sobre fondo claro; sobre fondo
 * oscuro se usa blanco + amarillo. No se inventan tintes claros de turquesa
 * porque se leen como azul.
 * ========================================================================= */

.plui-ficha,
.plui-bloque,
.plui-buscador,
.plui-mapa-wrap {
	--pl-teal: #03858D;
	--pl-teal-d: #026770;
	--pl-teal-mid: #02979E;
	--pl-yellow: #FEDA28;
	--pl-carbon: #0A1514;
	--pl-mint: #E4F7F5;
	--pl-soft: #F4F7F6;
	--pl-line: #DCE6E4;
	--pl-muted: #5B6B69;
	--pl-radio: 14px;
}

.plui-ficha { max-width: 100%; }

.plui-bloque {
	margin: 0 0 40px;
}

.plui-bloque h2 {
	font-size: clamp(22px, 3.4vw, 30px);
	line-height: 1.15;
	letter-spacing: -.01em;
	margin: 0 0 6px;
	color: var(--pl-carbon);
}

.plui-bloque h3 {
	font-size: 15px;
	text-transform: uppercase;
	letter-spacing: .08em;
	color: var(--pl-muted);
	margin: 22px 0 10px;
}

.plui-sub {
	color: var(--pl-muted);
	margin: 0 0 20px;
	font-size: 15px;
}

/* --- Cabecera ---------------------------------------------------------- */

.plui-migas {
	display: flex;
	align-items: center;
	gap: 10px;
	flex-wrap: wrap;
	margin-bottom: 10px;
}

.plui-migas a {
	color: var(--pl-teal);
	font-weight: 600;
	font-size: 14px;
	text-decoration: none;
	border-bottom: 1px solid rgba(3, 133, 141, .3);
}

.plui-chip {
	display: inline-block;
	padding: 4px 11px;
	border-radius: 999px;
	background: var(--pl-mint);
	color: var(--pl-teal-d);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .02em;
}

.plui-titulo {
	font-size: clamp(30px, 6vw, 50px);
	line-height: 1.05;
	letter-spacing: -.025em;
	margin: 0 0 12px;
	color: var(--pl-carbon);
}

.plui-dir {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	color: var(--pl-muted);
	font-size: 16px;
	margin: 0 0 18px;
}

.plui-dir svg {
	width: 19px;
	height: 19px;
	flex: 0 0 19px;
	fill: var(--pl-teal);
	margin-top: 1px;
}

/* Aviso de fiabilidad. Es deliberadamente visible: publicar un dato sin
   confirmar y no decirlo sería el modo más rápido de perder la confianza. */
.plui-fiab {
	font-size: 14px;
	line-height: 1.5;
	padding: 12px 16px;
	border-radius: 10px;
	margin: 0;
}

.plui-fiab.is-ok {
	background: var(--pl-mint);
	color: var(--pl-teal-d);
}

.plui-fiab.is-pend {
	background: #FFF8DC;
	color: #6B5600;
	border-left: 3px solid var(--pl-yellow);
}

/* --- Cómo se juega aquí ------------------------------------------------ */

.plui-exp-grid {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
	gap: 12px;
}

.plui-exp-item {
	background: #fff;
	border: 1px solid var(--pl-line);
	border-radius: var(--pl-radio);
	padding: 16px 18px;
	position: relative;
	overflow: hidden;
}

.plui-exp-item::before {
	content: "";
	position: absolute;
	inset: 0 auto 0 0;
	width: 4px;
	background: var(--pl-line);
}

.plui-exp-item.is-si::before { background: var(--pl-teal); }
.plui-exp-item.is-no::before { background: #C9403C; }
.plui-exp-item.is-info::before { background: var(--pl-yellow); }

.plui-exp-p {
	display: block;
	font-size: 13px;
	color: var(--pl-muted);
	margin-bottom: 4px;
}

.plui-exp-r {
	display: block;
	font-size: 21px;
	font-weight: 700;
	line-height: 1.2;
	color: var(--pl-carbon);
	margin-bottom: 4px;
}

.plui-exp-n {
	display: block;
	font-size: 12px;
	color: var(--pl-muted);
}

.plui-nota {
	background: var(--pl-soft);
	border-radius: var(--pl-radio);
	padding: 18px 20px;
	margin-top: 16px;
}

.plui-nota h3 { margin-top: 0; }
.plui-nota p:last-child { margin-bottom: 0; }

.plui-nota-destacada {
	background: var(--pl-carbon);
	color: #fff;
}

.plui-nota-destacada h3 { color: var(--pl-yellow); }
.plui-nota-destacada p { color: rgba(255,255,255,.88); }

.plui-aviso {
	background: #FFF8DC;
	border-left: 3px solid var(--pl-yellow);
	padding: 12px 16px;
	border-radius: 10px;
	font-size: 14px;
	color: #6B5600;
	margin: 16px 0 0;
}

/* --- Horarios ---------------------------------------------------------- */

.plui-tabla { display: grid; gap: 12px; }

.plui-fila {
	border: 1px solid var(--pl-line);
	border-radius: var(--pl-radio);
	padding: 16px 18px;
	background: #fff;
}

.plui-fila-cab {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
	margin-bottom: 8px;
}

.plui-chip-niv { background: var(--pl-soft); color: var(--pl-muted); }

.plui-fila-cuando {
	display: flex;
	align-items: baseline;
	gap: 12px;
	flex-wrap: wrap;
	font-size: 18px;
	color: var(--pl-carbon);
}

.plui-hora {
	font-weight: 700;
	color: var(--pl-teal);
	font-variant-numeric: tabular-nums;
}

.plui-fila-det { margin-top: 10px; }

.plui-fila-det p {
	margin: 0 0 4px;
	font-size: 14px;
	color: var(--pl-carbon);
}

.plui-fila-det p span {
	color: var(--pl-muted);
	margin-right: 6px;
}

.plui-fila-notas { color: var(--pl-muted) !important; font-style: italic; }

/* --- Cifras / instalación ---------------------------------------------- */

.plui-cifras {
	list-style: none;
	margin: 0 0 14px;
	padding: 0;
	display: flex;
	gap: 26px;
	flex-wrap: wrap;
}

.plui-cifra {
	display: block;
	font-size: 40px;
	font-weight: 700;
	line-height: 1;
	color: var(--pl-teal);
	letter-spacing: -.03em;
}

.plui-cifra-t {
	display: block;
	font-size: 13px;
	color: var(--pl-muted);
	margin-top: 2px;
}

.plui-tags {
	list-style: none;
	margin: 10px 0 0;
	padding: 0;
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
}

.plui-tags li {
	padding: 5px 12px;
	border-radius: 999px;
	background: var(--pl-soft);
	border: 1px solid var(--pl-line);
	font-size: 13px;
	color: var(--pl-carbon);
}

.plui-tags-serv li { background: var(--pl-mint); border-color: transparent; color: var(--pl-teal-d); }

/* --- Listas de datos --------------------------------------------------- */

.plui-lista-datos { list-style: none; margin: 0; padding: 0; }

.plui-lista-datos li {
	display: flex;
	justify-content: space-between;
	gap: 20px;
	padding: 12px 0;
	border-bottom: 1px solid var(--pl-line);
	font-size: 15px;
}

.plui-lista-datos li span { color: var(--pl-muted); }
.plui-lista-datos li strong { color: var(--pl-carbon); text-align: right; }

.plui-dir-grande { font-size: 18px; margin: 0 0 14px; color: var(--pl-carbon); }

/* --- Botones ----------------------------------------------------------- */

.plui-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 13px 22px;
	border-radius: 999px;
	background: var(--pl-teal);
	color: #fff !important;
	font-weight: 600;
	font-size: 15px;
	text-decoration: none;
	border: 0;
	cursor: pointer;
	transition: background .15s ease;
}

.plui-btn:hover { background: var(--pl-teal-d); }

.plui-btn-sec {
	background: transparent;
	color: var(--pl-teal) !important;
	border: 1.5px solid var(--pl-teal);
	margin-top: 16px;
}

.plui-btn-sec:hover { background: var(--pl-mint); }

/* WhatsApp: el CTA principal de todo el sitio. Grande y a pantalla completa
   en móvil, que es donde se va a usar de verdad. */
.plui-wa {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 15px 26px;
	border-radius: 999px;
	background: #1FAF54;
	color: #fff !important;
	font-weight: 700;
	font-size: 16px;
	text-decoration: none;
	transition: background .15s ease;
}

.plui-wa:hover { background: #17913F; }

.plui-wa svg { width: 22px; height: 22px; fill: currentColor; }

.plui-wa-mini {
	padding: 9px 16px;
	font-size: 14px;
	margin-top: 10px;
}

.plui-wa-nota {
	font-size: 13px;
	color: var(--pl-muted);
	margin: 10px 0 0;
	max-width: 46ch;
}

.plui-canales {
	list-style: none;
	margin: 18px 0 0;
	padding: 0;
	display: flex;
	gap: 8px 22px;
	flex-wrap: wrap;
}

.plui-canales a {
	color: var(--pl-teal);
	font-size: 15px;
	text-decoration: none;
	border-bottom: 1px solid rgba(3,133,141,.3);
}

/* --- Clubes ------------------------------------------------------------ */

.plui-club-lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }

.plui-club {
	border: 1px solid var(--pl-line);
	border-left: 4px solid var(--pl-teal);
	border-radius: var(--pl-radio);
	padding: 18px 20px;
	background: #fff;
}

.plui-club h3 {
	margin: 0 0 8px;
	font-size: 19px;
	text-transform: none;
	letter-spacing: 0;
	color: var(--pl-carbon);
}

.plui-club p { font-size: 15px; margin: 10px 0 0; color: var(--pl-carbon); }

/* --- FAQ --------------------------------------------------------------- */

.plui-faq details {
	border-bottom: 1px solid var(--pl-line);
	padding: 14px 0;
}

.plui-faq summary {
	cursor: pointer;
	font-weight: 600;
	font-size: 17px;
	color: var(--pl-carbon);
	list-style: none;
	position: relative;
	padding-right: 30px;
}

.plui-faq summary::-webkit-details-marker { display: none; }

.plui-faq summary::after {
	content: "+";
	position: absolute;
	right: 4px;
	top: 50%;
	transform: translateY(-50%);
	font-size: 22px;
	color: var(--pl-teal);
	line-height: 1;
}

.plui-faq details[open] summary::after { content: "–"; }
.plui-faq details > div { padding-top: 8px; color: var(--pl-muted); }

/* --- Tarjetas ---------------------------------------------------------- */

.plui-cards {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
	gap: 18px;
}

.plui-card a {
	display: block;
	text-decoration: none;
	border: 1px solid var(--pl-line);
	border-radius: var(--pl-radio);
	overflow: hidden;
	background: #fff;
	height: 100%;
	transition: transform .18s ease, box-shadow .18s ease;
}

.plui-card a:hover {
	transform: translateY(-3px);
	box-shadow: 0 12px 28px rgba(10, 21, 20, .1);
}

.plui-card-foto {
	aspect-ratio: 16 / 10;
	background: var(--pl-carbon) center/cover no-repeat;
	position: relative;
}

.plui-card-km {
	position: absolute;
	left: 10px;
	bottom: 10px;
	background: var(--pl-yellow);
	color: var(--pl-carbon);
	font-size: 12px;
	font-weight: 700;
	padding: 4px 10px;
	border-radius: 999px;
}

.plui-card-cuerpo { padding: 14px 16px 16px; }

.plui-card-zona {
	font-size: 12px;
	color: var(--pl-teal);
	font-weight: 600;
	letter-spacing: .04em;
	text-transform: uppercase;
}

.plui-card h3 {
	margin: 4px 0 8px;
	font-size: 17px;
	line-height: 1.25;
	color: var(--pl-carbon);
	text-transform: none;
	letter-spacing: -.01em;
}

.plui-card-meta {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	gap: 6px;
	flex-wrap: wrap;
}

.plui-card-meta li {
	font-size: 12px;
	color: var(--pl-muted);
	background: var(--pl-soft);
	padding: 3px 9px;
	border-radius: 999px;
}

/* --- Mapa -------------------------------------------------------------- */

.plui-mapa {
	border-radius: var(--pl-radio);
	overflow: hidden;
	background: var(--pl-soft);
	z-index: 0;
}

.plui-mapa-pie {
	font-size: 13px;
	color: var(--pl-muted);
	margin: 10px 0 0;
}

.plui-pop { min-width: 190px; font-family: inherit; }
.plui-pop-z { font-size: 11px; text-transform: uppercase; letter-spacing: .05em; color: var(--pl-teal); font-weight: 700; }
.plui-pop h4 { margin: 3px 0 4px; font-size: 16px; line-height: 1.2; color: var(--pl-carbon); }
.plui-pop p { margin: 0 0 8px; font-size: 13px; color: var(--pl-muted); }
.plui-pop a { color: var(--pl-teal); font-weight: 600; font-size: 14px; text-decoration: none; }

.plui-marcador {
	background: var(--pl-teal);
	width: 30px;
	height: 30px;
	border-radius: 50% 50% 50% 4px;
	transform: rotate(-45deg);
	border: 2.5px solid #fff;
	box-shadow: 0 3px 8px rgba(10,21,20,.35);
	display: flex;
	align-items: center;
	justify-content: center;
}

.plui-marcador span {
	transform: rotate(45deg);
	color: var(--pl-yellow);
	font-size: 13px;
	font-weight: 800;
	line-height: 1;
}

.plui-cluster {
	background: var(--pl-carbon);
	color: var(--pl-yellow);
	border: 2.5px solid #fff;
	border-radius: 50%;
	width: 38px;
	height: 38px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: 800;
	font-size: 14px;
	box-shadow: 0 3px 10px rgba(10,21,20,.35);
}

/* --- Buscador ---------------------------------------------------------- */

.plui-b-titulo {
	font-size: clamp(24px, 4vw, 36px);
	margin: 0 0 16px;
	letter-spacing: -.02em;
	color: var(--pl-carbon);
}

.plui-b-form {
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
	align-items: stretch;
}

.plui-b-input {
	flex: 1 1 240px;
	min-width: 0;
	padding: 14px 18px;
	border-radius: 999px;
	border: 1.5px solid var(--pl-line);
	font-size: 16px;
	background: #fff;
	color: var(--pl-carbon);
}

.plui-b-input:focus {
	outline: 0;
	border-color: var(--pl-teal);
	box-shadow: 0 0 0 4px rgba(3,133,141,.14);
}

.plui-b-geo {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	padding: 13px 18px;
	border-radius: 999px;
	background: transparent;
	border: 1.5px solid var(--pl-line);
	color: var(--pl-muted);
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
}

.plui-b-geo:hover { border-color: var(--pl-teal); color: var(--pl-teal); }
.plui-b-geo svg { width: 17px; height: 17px; fill: currentColor; }

.plui-b-estado {
	font-size: 14px;
	color: var(--pl-muted);
	margin: 14px 0 0;
	min-height: 1em;
}

.plui-b-estado strong { color: var(--pl-carbon); }
.plui-b-resultados { margin-top: 18px; }

.plui-b-aprox {
	background: var(--pl-mint);
	color: var(--pl-teal-d);
	padding: 11px 16px;
	border-radius: 10px;
	font-size: 14px;
	margin: 0 0 16px;
}

/* --- Editor de Elementor ----------------------------------------------- */

.plui-editor-vacio {
	border: 1.5px dashed #C4D3D1;
	border-radius: 10px;
	padding: 16px;
	font-size: 13px;
	color: #5B6B69;
	background: #F4F7F6;
	line-height: 1.5;
}

/* --- Móvil ------------------------------------------------------------- */

@media (max-width: 640px) {

	.plui-bloque { margin-bottom: 32px; }

	.plui-exp-grid { grid-template-columns: 1fr; }

	.plui-cifras { gap: 18px; }
	.plui-cifra { font-size: 32px; }

	/* El botón de WhatsApp a lo ancho: es la acción que la gente busca con
	   el móvil en la mano, de pie, decidiendo si va o no. */
	.plui-wa { width: 100%; }

	.plui-b-form { flex-direction: column; }
	.plui-b-input, .plui-b-btn, .plui-b-geo { width: 100%; }

	.plui-cards { grid-template-columns: 1fr 1fr; gap: 12px; }
	.plui-card h3 { font-size: 15px; }
	.plui-card-cuerpo { padding: 11px 12px 13px; }

	.plui-lista-datos li { font-size: 14px; }
}

@media (max-width: 380px) {
	.plui-cards { grid-template-columns: 1fr; }
}


/* === BLINDAJE FRENTE AL TEMA ============================================
 * El kit global de Elementor y el tema definen sus propios estilos de boton
 * y ganan por orden de carga: dejaban el fondo transparente y el borde rosa,
 * y con el texto en blanco el boton «Buscar» se volvia invisible.
 *
 * Se sube la especificidad y se marcan como importantes SOLO las propiedades
 * que el tema secuestra (fondo, borde y color). El resto sigue siendo
 * sobrescribible desde Elementor, que es lo que interesa.
 * ====================================================================== */

.plui-buscador .plui-b-form button.plui-btn,
.plui-bloque a.plui-btn,
.plui-ficha a.plui-btn {
	background-color: var(--pl-teal) !important;
	border: 0 !important;
	color: #fff !important;
}

.plui-buscador .plui-b-form button.plui-btn:hover,
.plui-bloque a.plui-btn:hover,
.plui-ficha a.plui-btn:hover {
	background-color: var(--pl-teal-d) !important;
}

.plui-bloque a.plui-btn.plui-btn-sec,
.plui-ficha a.plui-btn.plui-btn-sec {
	background-color: transparent !important;
	border: 1.5px solid var(--pl-teal) !important;
	color: var(--pl-teal) !important;
}

.plui-bloque a.plui-btn.plui-btn-sec:hover,
.plui-ficha a.plui-btn.plui-btn-sec:hover {
	background-color: var(--pl-mint) !important;
}

.plui-bloque a.plui-wa,
.plui-ficha a.plui-wa,
.plui-fila a.plui-wa {
	background-color: #1FAF54 !important;
	border: 0 !important;
	color: #fff !important;
}

.plui-bloque a.plui-wa:hover,
.plui-ficha a.plui-wa:hover,
.plui-fila a.plui-wa:hover {
	background-color: #17913F !important;
}

.plui-buscador .plui-b-form button.plui-b-geo {
	background-color: transparent !important;
	border: 1.5px solid var(--pl-line) !important;
	color: var(--pl-muted) !important;
}

.plui-buscador .plui-b-form button.plui-b-geo:hover {
	border-color: var(--pl-teal) !important;
	color: var(--pl-teal) !important;
}

/* El campo de busqueda tambien recibe el borde del tema. */
.plui-buscador .plui-b-form input.plui-b-input {
	border: 1.5px solid var(--pl-line) !important;
	background-color: #fff !important;
	color: var(--pl-carbon) !important;
}

.plui-buscador .plui-b-form input.plui-b-input:focus {
	border-color: var(--pl-teal) !important;
}

/* El tema subraya todos los enlaces; en una cuadricula de tarjetas eso
 * ensucia mucho. Se quita el subrayado del tema solo dentro de las tarjetas. */
.plui-cards a,
.plui-cards a h3,
.plui-cards a span,
.plui-migas a,
.plui-card-zona {
	text-decoration: none !important;
}

.plui-migas a:hover {
	text-decoration: none !important;
}

/* === LOGOS Y MONOGRAMA ==================================================
 * Casi ningún club tiene todavía logo cargado. En vez de dejar el hueco
 * vacío se pinta un monograma con las iniciales sobre turquesa: se lee como
 * una decisión de diseño y no como una carencia, y desaparece solo en cuanto
 * se sube el logo de verdad.
 * ====================================================================== */

.plui-logo,
.plui-mono {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
}

.plui-logo {
	background: #fff;
	border: 1px solid var(--pl-line);
	border-radius: 14px;
	padding: 8px;
}

.plui-logo-img {
	display: block;
	width: auto;
	height: auto;
	object-fit: contain;
}

.plui-mono {
	background: var(--pl-teal);
	color: var(--pl-yellow);
	border-radius: 16px;
	font-weight: 800;
	letter-spacing: .02em;
	line-height: 1;
	user-select: none;
}

.plui-cab-marca {
	margin-bottom: 14px;
}

/* En el bloque de comunidades el logo va al lado del nombre, no encima. */
.plui-club {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 0 16px;
	align-items: start;
}

.plui-club-marca {
	grid-row: 1 / span 4;
}

.plui-club > :not(.plui-club-marca) {
	grid-column: 2;
}

.plui-btn-ig {
	margin-top: 0;
}

@media (max-width: 640px) {
	.plui-club { grid-template-columns: 1fr; gap: 12px; }
	.plui-club-marca { grid-row: auto; }
	.plui-club > :not(.plui-club-marca) { grid-column: 1; }
}

/* === PORTADA DE «DÓNDE JUGAR» ===========================================
 * Misma marca que el resto del sitio, pero con otro aire: banda oscura a
 * sangre, buscador en blanco flotando encima y la trama de puntos de fondo.
 * Respeta la cabecera del tema, que va por encima y no se toca.
 *
 * Sobre carbón manda el blanco + amarillo, nunca el turquesa oficial: es
 * demasiado oscuro y no contrasta. Es la misma regla de toda la identidad.
 * ====================================================================== */

.plui-portada {
	position: relative;
	background: var(--pl-carbon);
	color: #fff;
	padding: 64px 24px 132px;
	overflow: hidden;
	margin-bottom: 0;
}

.plui-portada::after {
	content: "";
	position: absolute;
	inset: 0;
	background-image: radial-gradient(rgba(255,255,255,.16) 1.5px, transparent 1.6px);
	background-size: 22px 22px;
	-webkit-mask-image: linear-gradient(to bottom right, #000, transparent 62%);
	mask-image: linear-gradient(to bottom right, #000, transparent 62%);
	pointer-events: none;
}

.plui-portada-int {
	position: relative;
	z-index: 1;
	max-width: 1140px;
	margin: 0 auto;
}

.plui-kicker {
	display: inline-block;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--pl-yellow);
	margin-bottom: 14px;
}

.plui-portada h1 {
	font-size: clamp(34px, 6vw, 62px);
	line-height: 1.02;
	letter-spacing: -.03em;
	margin: 0 0 14px;
	color: #fff;
	max-width: 16ch;
}

.plui-portada h1 em {
	font-style: normal;
	color: var(--pl-yellow);
}

.plui-portada-txt {
	font-size: 17px;
	line-height: 1.55;
	color: rgba(255,255,255,.82);
	max-width: 52ch;
	margin: 0;
}

/* El buscador rompe el límite entre la banda oscura y la sección siguiente. */
.plui-portada-caja {
	position: relative;
	z-index: 2;
	max-width: 1140px;
	margin: -96px auto 0;
	background: #fff;
	border-radius: 20px;
	padding: 28px 28px 30px;
	box-shadow: 0 18px 48px rgba(10,21,20,.16);
}

.plui-portada-caja .plui-b-titulo {
	font-size: clamp(20px, 3vw, 26px);
	margin-bottom: 14px;
}

.plui-cifras-banda {
	list-style: none;
	margin: 30px 0 0;
	padding: 0;
	display: flex;
	gap: 40px;
	flex-wrap: wrap;
}

.plui-cifras-banda b {
	display: block;
	font-size: 38px;
	line-height: 1;
	color: var(--pl-yellow);
	letter-spacing: -.03em;
}

.plui-cifras-banda span {
	display: block;
	font-size: 13px;
	color: rgba(255,255,255,.7);
	margin-top: 6px;
}

@media (max-width: 640px) {
	.plui-portada { padding: 40px 18px 116px; }
	.plui-portada-caja { margin: -92px 14px 0; padding: 20px 18px 22px; border-radius: 16px; }
	.plui-cifras-banda { gap: 24px; }
	.plui-cifras-banda b { font-size: 30px; }
}

/* === ALCANCE DE LAS VARIABLES ===========================================
 * Las variables de marca se declaraban solo en los bloques de ficha, así que
 * la portada salía sin fondo y sin color: var(--pl-carbon) no existía en su
 * ámbito. Se declaran en :root para que valgan en cualquier bloque nuevo sin
 * tener que acordarse de añadirlo aquí cada vez.
 * ====================================================================== */

:root {
	--pl-teal: #03858D;
	--pl-teal-d: #026770;
	--pl-teal-mid: #02979E;
	--pl-yellow: #FEDA28;
	--pl-carbon: #0A1514;
	--pl-mint: #E4F7F5;
	--pl-soft: #F4F7F6;
	--pl-line: #DCE6E4;
	--pl-muted: #5B6B69;
	--pl-radio: 14px;
}

/* El tema imprime su propio título de página. En las páginas que llevan
 * portada propia eso duplica el encabezado y deja dos H1 en el documento,
 * que además es malo para SEO. Se oculta solo donde hay portada. */
body:has(.plui-portada) .page-header,
body:has(.plui-portada) .entry-header,
body:has(.plui-portada) .entry-title {
	display: none !important;
}

/* La portada va a sangre completa aunque el tema meta el contenido en una
 * columna estrecha. Sin esto la banda oscura queda como un recuadro. */
.plui-portada {
	width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	max-width: 100vw;
}

.plui-cifras-banda {
	list-style: none !important;
}

.plui-cifras-banda li {
	list-style: none !important;
	margin: 0 !important;
}

.plui-portada h1 {
	color: #fff !important;
}

/* === PORTADA MAQUETADA EN ELEMENTOR =====================================
 * Cuando la portada se monta con contenedores de Elementor, el fondo, el
 * ancho y los colores los manda Elementor y son editables desde el panel.
 * Aquí solo queda lo que Elementor no sabe hacer: la trama de puntos de
 * marca y ocultar el título duplicado del tema.
 *
 * Se anula el truco de ancho completo de .plui-portada porque el contenedor
 * de Elementor ya va a sangre por sí mismo; si se dejaran los dos, la banda
 * se saldría de la pantalla y aparecería scroll horizontal.
 * ====================================================================== */

.plui-portada-el {
	width: auto !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
	max-width: none !important;
	position: relative;
	overflow: hidden;
}

.plui-portada-el::after {
	content: "";
	position: absolute;
	inset: 0;
	background-image: radial-gradient(rgba(255,255,255,.16) 1.5px, transparent 1.6px);
	background-size: 22px 22px;
	-webkit-mask-image: linear-gradient(to bottom right, #000, transparent 62%);
	mask-image: linear-gradient(to bottom right, #000, transparent 62%);
	pointer-events: none;
	z-index: 0;
}

.plui-portada-el > .e-con-inner,
.plui-portada-el > .elementor-widget-wrap {
	position: relative;
	z-index: 1;
}

body:has(.plui-portada-el) .page-header,
body:has(.plui-portada-el) .entry-header,
body:has(.plui-portada-el) .entry-title {
	display: none !important;
}

/* La tarjeta del buscador monta sobre la banda oscura. */
.plui-caja-el {
	position: relative;
	z-index: 3;
}

/* Icono de lupa dentro del botón de buscar. Va con currentColor para que
 * siga al color del texto si algún día se cambia el botón desde Elementor. */
.plui-b-btn-ico {
	width: 18px;
	height: 18px;
	fill: currentColor;
	flex: 0 0 18px;
}

.plui-buscador .plui-b-form button.plui-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 9px;
}

/* === ZONAS Y AGENDA ===================================================== */

.plui-zonas {
	list-style: none !important;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(215px, 1fr));
	gap: 14px;
}

.plui-zonas li { list-style: none !important; margin: 0 !important; }

.plui-zona a {
	display: grid;
	grid-template-columns: 1fr auto;
	align-items: center;
	gap: 2px 12px;
	padding: 18px 20px;
	border: 1px solid var(--pl-line);
	border-radius: var(--pl-radio);
	background: #fff;
	text-decoration: none !important;
	transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.plui-zona a:hover {
	transform: translateY(-3px);
	border-color: var(--pl-teal);
	box-shadow: 0 12px 26px rgba(10,21,20,.1);
}

.plui-zona-n {
	font-size: 17px;
	font-weight: 700;
	color: var(--pl-carbon);
	line-height: 1.2;
}

.plui-zona-c {
	grid-column: 1;
	font-size: 13px;
	color: var(--pl-muted);
}

/* La flecha vive en las dos filas de la derecha, centrada. */
.plui-zona-f {
	grid-column: 2;
	grid-row: 1 / span 2;
	font-size: 20px;
	color: var(--pl-teal);
	line-height: 1;
}

/* --- Agenda ---
 * Si no hay eventos futuros el widget no imprime nada, y el kicker y el
 * titular se quedaban huérfanos sobre un bloque vacío. La maqueta decía que
 * la sección entera debe desaparecer, así que se oculta el contenedor cuando
 * no contiene una lista de eventos. Basta con marcarlo con esta clase. */
.plui-si-eventos:not(:has(.plui-eventos)) {
	display: none !important;
}

.plui-eventos { list-style: none !important; margin: 0; padding: 0; display: grid; gap: 12px; }
.plui-eventos li { list-style: none !important; margin: 0 !important; }

.plui-evento {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 16px;
	align-items: center;
	padding: 16px 18px;
	border: 1px solid var(--pl-line);
	border-radius: var(--pl-radio);
	background: #fff;
}

.plui-ev-fecha {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	width: 56px;
	height: 56px;
	border-radius: 12px;
	background: var(--pl-mint);
	color: var(--pl-teal-d);
}

.plui-ev-fecha b { font-size: 22px; font-weight: 800; line-height: 1; }
.plui-ev-fecha i { font-style: normal; font-size: 11px; text-transform: uppercase; letter-spacing: .06em; }
.plui-ev-cuerpo > a { display: block; font-size: 17px; font-weight: 700; color: var(--pl-carbon); text-decoration: none !important; }
.plui-ev-meta { display: block; font-size: 13px; color: var(--pl-muted); margin-top: 3px; }
.plui-ev-meta a { color: var(--pl-teal); text-decoration: none !important; }


/* ==========================================================================
 * v0.4.0 · HOME v10 — PORTADO FIEL DE LA MAQUETA APROBADA
 *
 * Todo lo de aquí abajo es la hoja de la maqueta «pickleloophomev10.html»
 * copiada valor a valor (tipografías, radios, sombras, degradados, tramas y
 * posiciones), con las clases prefijadas «plh-» para que no choquen ni con el
 * tema ni con las «plui-» que ya existían.
 *
 * Lo único que cambia respecto al archivo original es el ámbito: la maqueta
 * daba por hecho que era el documento entero (usaba *, body y header a pelo)
 * y aquí son tres bloques dentro de una página de Elementor, así que el
 * saneado va colgado de «.plh» en vez de ser global.
 * ========================================================================== */

:root {
	/* turquesa muestreado del PNG real del logo */
	--plh-teal: #03858D;
	--plh-teal-d: #026770;
	--plh-teal-mid: #02979E;
	--plh-teal-soft: #00B0A8;
	--plh-yellow: #FEDA28;
	--plh-mint: #E4F7F5;
	--plh-carbon: #0A1514;
	--plh-carbon-2: #12241F;
	--plh-ink: #101010;
	--plh-muted: #5A6564;
	--plh-soft: #F4F7F6;
	--plh-line: #DDE7E5;
	--plh-rp: 999px;
	--plh-r: 20px;
	--plh-pad: clamp(20px, 5vw, 72px);
}

/* --- saneado, equivalente al *{} + body{} de la maqueta pero acotado ----- */
.plh, .plh *, .plh *::before, .plh *::after { box-sizing: border-box; }
.plh {
	position: relative;
	font-family: Poppins, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
	color: var(--plh-ink);
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
	overflow-x: clip;
	overflow-y: visible;
}
.plh h1, .plh h2, .plh h3, .plh h4, .plh p, .plh ul, .plh ol, .plh li, .plh figure, .plh form { margin: 0; padding: 0; }
.plh ul, .plh ol { list-style: none; }
.plh img, .plh svg { display: block; max-width: 100%; }
.plh a { color: inherit; text-decoration: none !important; }
.plh button { font-family: inherit; }
.plh-sr {
	position: absolute !important; width: 1px; height: 1px; overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%); white-space: nowrap;
}

/* --- el contenedor de Elementor no debe estrechar ni acolchar la maqueta -- */
.plh-full {
	--width: 100%; --content-width: 100%;
	--padding-top: 0px; --padding-bottom: 0px; --padding-left: 0px; --padding-right: 0px;
}
.plh-full, .plh-full > .e-con-inner {
	max-width: 100% !important;
	width: 100% !important;
	padding: 0 !important;
}
.plh-full > .e-con-inner > .elementor-widget,
.plh-full > .elementor-widget { width: 100% !important; max-width: 100% !important; }
.plh-full .elementor-widget-container { padding: 0 !important; }

/* --- rejilla y tipografías ---------------------------------------------- */
.plh-wrap { max-width: 1280px; margin: 0 auto; padding-inline: var(--plh-pad); }
.plh-h1 { font-size: clamp(40px, 5.6vw, 78px); font-weight: 700; letter-spacing: -.035em; line-height: 1.0; }
.plh-h2 { font-size: clamp(28px, 3.9vw, 52px); font-weight: 700; letter-spacing: -.03em; line-height: 1.08; }
.plh-kicker { font-size: 12px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--plh-teal); }
.plh-hero .plh-kicker { color: var(--plh-yellow); }
.plh-lead { font-size: clamp(15px, 1.3vw, 17.5px); color: var(--plh-muted); }
.plh-sec { padding: clamp(64px, 8vw, 116px) 0; position: relative; overflow: hidden; }
.plh-sec .plh-wrap { position: relative; z-index: 1; }

/* --- motivo bola --------------------------------------------------------- */
.plh-ball { position: absolute; z-index: 0; pointer-events: none; height: auto; }
.plh-halftone {
	position: absolute; z-index: 0; pointer-events: none; opacity: .5;
	background-image: radial-gradient(currentColor 1.9px, transparent 2px);
	background-size: 13px 13px;
	-webkit-mask-image: linear-gradient(90deg, #000, transparent);
	mask-image: linear-gradient(90deg, #000, transparent);
}
.plh-loopline { position: absolute; z-index: 0; pointer-events: none; color: var(--plh-teal-mid); opacity: .45; }
.plh-band { background-size: cover; background-position: center; position: relative; }

/* --- botones ------------------------------------------------------------- */
.plh-btn {
	display: inline-flex; align-items: center; gap: 10px; border-radius: var(--plh-rp);
	padding: 15px 28px; font-weight: 600; font-size: 15px; border: 1.5px solid transparent;
	transition: .2s; cursor: pointer; white-space: nowrap; line-height: 1.6;
}
.plh-btn svg { width: 17px; height: 17px; transition: transform .2s; flex: none; }
.plh-btn:hover svg { transform: translateX(4px); }
.plh .plh-btn-p { background: var(--plh-teal); color: #fff; }
.plh .plh-btn-p:hover { background: var(--plh-teal-d); }
.plh .plh-btn-d { background: var(--plh-carbon); color: #fff; }
.plh .plh-btn-d:hover { background: var(--plh-carbon-2); }
.plh .plh-btn-w { background: #fff; color: var(--plh-carbon); }

/* --- cabecera flotante ---------------------------------------------------- */
.plh-header { position: absolute; top: 0; left: 0; right: 0; z-index: 50; padding-top: 20px; }
.plh-hbar {
	background: rgba(255,255,255,.95); backdrop-filter: blur(12px); border-radius: var(--plh-rp);
	padding: 14px 14px 14px 30px; display: flex; align-items: center; gap: 18px;
	box-shadow: 0 16px 44px -20px rgba(10,21,20,.6);
}
.plh-hbar .plh-logo img { height: 84px; width: auto; }
.plh-mn { margin-inline: auto; display: flex; gap: 2px; }
.plh-mn a { color: #28403d; font-size: 14.5px; font-weight: 500; padding: 10px 17px; border-radius: var(--plh-rp); transition: .18s; }
.plh-mn a:hover { background: var(--plh-mint); color: var(--plh-teal-d); }
.plh-mn a.plh-on { background: var(--plh-carbon); color: #fff; font-weight: 600; }
.plh-burger {
	display: none; background: var(--plh-mint); border: 0; border-radius: 14px; width: 44px; height: 44px;
	color: var(--plh-carbon); align-items: center; justify-content: center;
}

/* --- HERO A SANGRE -------------------------------------------------------- */
.plh-hero {
	position: relative; z-index: 3; min-height: min(94vh, 900px); display: flex; align-items: flex-end;
	padding: 170px 0 clamp(70px, 9vw, 120px); background: transparent; overflow: visible;
}
.plh-hero .plh-bg { position: absolute; inset: 0; z-index: 0; overflow: hidden; background: var(--plh-carbon); }
.plh-hero .plh-bg img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 42%; }
/* velado: oscurece y tiñe de turquesa, para que el texto siempre se lea */
.plh-hero .plh-veil {
	position: absolute; inset: 0; z-index: 1;
	background: linear-gradient(90deg, rgba(10,21,20,.94) 0%, rgba(10,21,20,.80) 38%, rgba(10,21,20,.30) 70%, rgba(10,21,20,.55) 100%);
}
.plh-hero .plh-veil2 {
	position: absolute; inset: 0; z-index: 1;
	background: linear-gradient(to top, rgba(10,21,20,.92) 0%, rgba(10,21,20,0) 45%),
	            radial-gradient(70% 60% at 20% 60%, rgba(0,176,168,.24), transparent 70%);
}
.plh-hero > .plh-wrap { width: 100%; flex: 1 1 auto; position: relative; z-index: 2; }
.plh-hero .plh-inner { position: relative; z-index: 2; max-width: 640px; }
.plh-hero h1 { color: #fff; margin: 16px 0 18px; text-shadow: 0 2px 30px rgba(0,0,0,.35); }
.plh-hero h1 em { font-style: normal; color: var(--plh-yellow); }
.plh-hero p.plh-lead { color: #CFE4E2; max-width: 520px; margin-bottom: 32px; }
.plh-credit { position: absolute; right: 14px; bottom: 8px; z-index: 3; font-size: 10.5px; color: rgba(255,255,255,.45); }

/* --- buscador en píldora -------------------------------------------------- */
.plh-search {
	background: #fff; border-radius: var(--plh-rp); padding: 8px 8px 8px 22px; display: flex;
	align-items: center; gap: 12px; box-shadow: 0 30px 70px -24px rgba(0,0,0,.75); max-width: 620px;
}
.plh-search .plh-pin { width: 21px; height: 21px; color: var(--plh-teal); flex: none; }
.plh-search input {
	border: 0; outline: 0; flex: 1; font-family: inherit; font-size: 16px; font-weight: 500;
	color: var(--plh-ink); min-width: 0; background: none; box-shadow: none; padding: 0; height: auto;
	-webkit-appearance: none; appearance: none;
}
.plh-search input::placeholder { color: #9AA5A4; font-weight: 400; }
.plh-search input::-webkit-search-cancel-button { display: none; }

/* estado y resultados del buscador real: no estaban en la maqueta (no tenía
   buscador funcional), así que se resuelven como prolongación de la píldora */
.plh-b-estado:not(:empty) { color: #CFE4E2; font-size: 14px; margin-top: 16px; max-width: 620px; }
.plh-b-estado strong { color: var(--plh-yellow); font-weight: 700; }
.plh-b-resultados:not(:empty) {
	margin-top: 14px; background: #fff; border-radius: var(--plh-r); padding: 16px;
	max-height: 52vh; overflow: auto; box-shadow: 0 30px 70px -24px rgba(0,0,0,.75);
}
.plh-b-resultados .plui-b-aprox { font-size: 14px; color: var(--plh-muted); margin-bottom: 12px; }

/* --- chips ---------------------------------------------------------------- */
.plh-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 20px; align-items: center; max-width: 600px; }
.plh-chips .plh-lbl { color: #9FC3BF; font-size: 13px; }
.plh .plh-chip {
	border: 1px solid rgba(255,255,255,.3); background: rgba(10,21,20,.28); backdrop-filter: blur(6px);
	color: #EAFAF8; border-radius: var(--plh-rp); padding: 8px 15px; font-size: 13.5px; font-weight: 500; transition: .18s;
}
.plh .plh-chip:hover { background: #fff; color: var(--plh-carbon); border-color: #fff; }

/* --- tarjeta superpuesta al hero ------------------------------------------ */
.plh-overcard {
	position: absolute; z-index: 4; right: clamp(20px, 5vw, 72px); bottom: -88px;
	width: min(392px, calc(100vw - 2*var(--plh-pad)));
	background: var(--plh-teal); color: #fff; border-radius: 28px; padding: 30px 32px 28px;
	box-shadow: 0 40px 80px -34px rgba(0,0,0,.7); overflow: hidden;
}
.plh-overcard .plh-ball { right: -46px; bottom: -52px; top: auto; width: 150px; opacity: .92; z-index: 0; }
.plh-overcard > h3, .plh-overcard > p, .plh-overcard > .plh-btn { position: relative; z-index: 2; }
.plh-overcard h3 { position: relative; font-size: 23px; font-weight: 700; letter-spacing: -.025em; line-height: 1.18; margin-bottom: 9px; }
.plh-overcard p { position: relative; font-size: 14.5px; color: rgba(255,255,255,.93); margin-bottom: 20px; }
.plh-overcard .plh-btn { position: relative; }

/* --- banda de cifras ------------------------------------------------------ */
/* Ojo: «background» en atajo resetea background-size, así que la trama sale a
   tamaño natural y se repite. Es exactamente lo que hace la maqueta. */
.plh-cover { background: var(--plh-teal); color: #fff; padding-top: 132px; }
.plh-cover .plh-wrap { display: flex; flex-wrap: wrap; gap: 12px 44px; align-items: center; padding-block: 20px; }
.plh-cover b { font-weight: 700; color: var(--plh-yellow); }
.plh-cover .plh-dot { width: 5px; height: 5px; border-radius: 50%; background: rgba(255,255,255,.3); }
.plh-cover .plh-note { margin-left: auto; font-size: 12.5px; color: #6E8B88; }

/* --- cabeceras de sección -------------------------------------------------- */
.plh-sec-head {
	display: flex; align-items: flex-end; justify-content: space-between; gap: 30px;
	margin-bottom: 42px; flex-wrap: wrap; position: relative; z-index: 1;
}
.plh-sec-head .plh-lead { max-width: 520px; margin-top: 12px; }
.plh-sec-head .plh-h2 { margin-top: 10px; }

/* --- zonas ----------------------------------------------------------------- */
.plh-zonas { display: grid; grid-template-columns: repeat(auto-fill, minmax(215px, 1fr)); gap: 16px; }
.plh-zona {
	position: relative; border-radius: var(--plh-r); overflow: hidden; aspect-ratio: 4/3;
	background: linear-gradient(150deg, #14403B, #0A1514); display: flex; align-items: flex-end;
	padding: 20px; transition: .25s;
}
.plh-zona:hover { transform: translateY(-4px); }
.plh-zona .plh-bl { position: absolute; right: -30px; top: -30px; width: 104px; opacity: .92; }
/* la bola es un guiño, no un patrón: solo en algunas tarjetas */
.plh-zonas .plh-zona:not(:nth-child(1)):not(:nth-child(4)) .plh-bl { display: none; }
.plh-zona .plh-cn { position: relative; color: #fff; }
.plh-zona .plh-cn strong { display: block; font-size: 20px; font-weight: 600; letter-spacing: -.02em; }
.plh-zona .plh-cn span { font-size: 13px; color: #9DC6C2; }
.plh-zona.plh-mas { background: var(--plh-mint); align-items: center; justify-content: center; }
.plh-zona.plh-mas .plh-cn { color: var(--plh-teal-d); text-align: center; font-weight: 600; }

/* --- responsive (copiado de la maqueta) ------------------------------------- */
@media (max-width: 900px) {
	.plh-mn { display: none; }
	.plh-burger { display: flex; }
	.plh-hbar { justify-content: space-between; padding-left: 16px; }
	.plh-overcard { position: static; width: auto; display: block; margin: 30px var(--plh-pad) -20px; }
	.plh-hero { min-height: auto; padding-bottom: 40px; display: block; }
	.plh-cover { padding-top: 64px; }
}
@media (max-width: 640px) {
	.plh-hbar .plh-btn-p { display: none; }
	.plh-hero { padding-top: 120px; }
	.plh-hero .plh-search { flex-wrap: wrap; padding: 14px; gap: 10px; border-radius: 22px; }
	.plh-hero .plh-search input { flex: 1 0 100%; order: 1; padding-inline: 4px; }
	.plh-hero .plh-search .plh-pin { order: 0; }
	.plh-hero .plh-search .plh-btn { order: 2; width: 100%; justify-content: center; }
	.plh-hero .plh-veil { background: linear-gradient(to top, rgba(10,21,20,.96) 30%, rgba(10,21,20,.55) 100%); }
	.plh-cover .plh-wrap { flex-direction: column; align-items: flex-start; gap: 6px; }
	.plh-cover .plh-dot { display: none; }
	.plh-cover .plh-note { margin-left: 0; }
	.plh-sec-head { flex-direction: column; align-items: flex-start; }
}

/* --- Corrección de convivencia -------------------------------------------
 * El tema y el «kit» de Elementor estilan button e input a lo bruto
 * (`.elementor-kit-26543 button`, `[type=submit], button`), y la hoja plui-
 * ya trae !important en el campo del buscador. Dentro de .plh manda la
 * maqueta aprobada: estos son los únicos !important de todo el bloque, y
 * están solo en los tres controles de formulario que el tema pisaba.
 * ---------------------------------------------------------------------- */
.plh .plh-btn {
	display: inline-flex !important;
	align-items: center !important;
	gap: 10px !important;
	border-radius: var(--plh-rp) !important;
	padding: 15px 28px !important;
	font-weight: 600 !important;
	font-size: 15px !important;
	line-height: 1.6 !important;
	border: 1.5px solid transparent !important;
	box-shadow: none !important;
	width: auto !important;
	height: auto !important;
	min-height: 0 !important;
	text-transform: none !important;
	letter-spacing: normal !important;
	white-space: nowrap !important;
}
.plh .plh-btn-p { background-color: var(--plh-teal) !important; color: #fff !important; }
.plh .plh-btn-p:hover { background-color: var(--plh-teal-d) !important; }
.plh .plh-btn-d { background-color: var(--plh-carbon) !important; color: #fff !important; }
.plh .plh-btn-d:hover { background-color: var(--plh-carbon-2) !important; }
.plh .plh-btn-w { background-color: #fff !important; color: var(--plh-carbon) !important; }

.plh .plh-burger {
	display: none !important;
	background-color: var(--plh-mint) !important;
	border: 0 !important;
	border-radius: 14px !important;
	width: 44px !important;
	height: 44px !important;
	padding: 0 !important;
	color: var(--plh-carbon) !important;
	align-items: center !important;
	justify-content: center !important;
	box-shadow: none !important;
}

.plh .plh-search input,
.plh .plh-search input.plui-b-input {
	border: 0 !important;
	outline: 0 !important;
	border-radius: 0 !important;
	background: none !important;
	background-color: transparent !important;
	box-shadow: none !important;
	padding: 0 !important;
	margin: 0 !important;
	height: auto !important;
	min-height: 0 !important;
	width: auto !important;
	flex: 1 1 auto !important;
	min-width: 0 !important;
	font-family: inherit !important;
	font-size: 16px !important;
	font-weight: 500 !important;
	line-height: 1.6 !important;
	color: var(--plh-ink) !important;
}
.plh .plh-search input::placeholder { color: #9AA5A4 !important; font-weight: 400 !important; }

@media (max-width: 900px) {
	.plh .plh-burger { display: flex !important; }
}
@media (max-width: 640px) {
	.plh .plh-hbar .plh-btn-p { display: none !important; }
	.plh .plh-hero .plh-search input { flex: 1 0 100% !important; order: 1; padding-inline: 4px !important; }
	.plh .plh-hero .plh-search .plh-btn { width: 100% !important; justify-content: center !important; order: 2; }
}

/* La hoja plui- pasa el formulario del buscador a columna en móvil. La
   maqueta lo mantiene en fila y deja que envuelva, así que el icono de pin se
   queda a la izquierda y no centrado. */
.plh .plh-search { flex-direction: row !important; align-items: center !important; }
@media (max-width: 640px) {
	.plh .plh-hero .plh-search { flex-wrap: wrap !important; }
}

/* El formulario del buscador plui- trae su propio relleno a 0. La píldora de
   la maqueta lleva 8px y 22px a la izquierda para que respire el pin. */
.plh .plh-search {
	padding: 8px 8px 8px 22px !important;
	gap: 12px !important;
	border: 0 !important;
	border-radius: var(--plh-rp) !important;
	background: #fff !important;
	box-shadow: 0 30px 70px -24px rgba(0, 0, 0, .75) !important;
	max-width: 620px !important;
}
@media (max-width: 640px) {
	.plh .plh-hero .plh-search { padding: 14px !important; gap: 10px !important; border-radius: 22px !important; }
}

/* El tema impone tamaño base 17px y fija familia y color en h1–h4, así que la
   tarjeta turquesa salía con el titular en negro en vez de en blanco. La
   maqueta parte de 16px y deja que los encabezados hereden el color de su
   bloque. */
.plh { font-size: 16px; }
.plh h1, .plh h2, .plh h3, .plh h4 { font-family: inherit; color: inherit; }
.plh .plh-search { flex-wrap: nowrap !important; }
.plh .plh-search input,
.plh .plh-search input.plui-b-input { line-height: normal !important; }

/* La regla de encabezados de arriba empata en especificidad con «.plh-hero h1»
   y ganaba por orden de aparición, dejando el titular del hero en negro. */
.plh .plh-hero h1 { color: #fff; }


/* ==========================================================================
 * v0.5.0 · HOME v10 — SECCIONES 4 A 9 DE LA MAQUETA APROBADA
 *
 * Continuación literal de «pickleloophomev10.html»: recién añadidos, cómo
 * funciona, agenda, aprender, comunidad y pie. Mismos valores que el archivo
 * original (radios, sombras, degradados, tamaños y posiciones de la bola),
 * con el prefijo «plh-» y colgando de «.plh» para no pisar al tema.
 * ========================================================================== */

/* --- piezas de tipografía que faltaban ----------------------------------- */
.plh .plh-h3 { font-size: clamp(18px, 1.55vw, 22px); font-weight: 600; letter-spacing: -.02em; line-height: 1.28; }

/* --- fondos de sección ---------------------------------------------------- */
.plh-sec-soft { background: var(--plh-soft); }
.plh-sec-mint { background: var(--plh-mint); }
.plh-sec-dark { background: var(--plh-carbon); color: #fff; }
.plh-sec-dark .plh-lead { color: #A7C4C1; }
.plh-sec-dark .plh-kicker { color: var(--plh-yellow); }
.plh .plh-sec-dark .plh-h2 { color: #fff; }
.plh .plh-sec-dark .plh-h3 { color: #fff; }
.plh-sec-mint .plh-lead { color: #3E5B58; }

/* --- variantes de la bola y marca de agua --------------------------------- */
.plh-ball.plh-blur { filter: blur(30px); opacity: .5; }
.plh-ball.plh-blur-xl { filter: blur(60px); opacity: .45; }
.plh-ball.plh-ghost { opacity: .16; }
.plh-ball.plh-wire { opacity: .20; }
.plh-logomark { position: absolute; z-index: 0; pointer-events: none; opacity: .09; }
.plh-logomark.plh-dark { filter: none; opacity: .06; }
.plh-isoseal { position: absolute; z-index: 1; pointer-events: none; opacity: .32; }
@media (max-width: 1100px) { .plh-isoseal { display: none; } }

/* --- botón fantasma ------------------------------------------------------- */
.plh .plh-btn-g { background-color: transparent !important; border-color: var(--plh-line) !important; color: var(--plh-ink) !important; }
.plh .plh-btn-g:hover { border-color: var(--plh-teal) !important; color: var(--plh-teal-d) !important; }
/* el de la tarjeta turquesa: en la maqueta iba con estilo en línea, y el
   estilo en línea pierde contra los !important que el tema obliga a poner */
.plh .plh-btn-o { background-color: transparent !important; border-color: rgba(255,255,255,.5) !important; color: #fff !important; }
.plh .plh-btn-o:hover { border-color: #fff !important; }

/* --- 4 · tarjetas de lugar ------------------------------------------------ */
.plh-grid3 { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 22px; }
.plh-card {
	background: #fff; border: 1px solid var(--plh-line); border-radius: var(--plh-r);
	overflow: hidden; display: flex; flex-direction: column; transition: .25s;
}
.plh-card:hover { transform: translateY(-4px); box-shadow: 0 20px 46px -24px rgba(8,8,8,.3); border-color: transparent; }
.plh-card .plh-ph {
	aspect-ratio: 16/10; background: linear-gradient(140deg, #D6EEEB, #EEF7F6); position: relative;
	display: flex; align-items: center; justify-content: center; color: #8AB4AF; font-size: 11px;
	letter-spacing: .12em; text-transform: uppercase; overflow: hidden;
}
/* La maqueta solo tenía marcadores «Foto real pendiente». Cuando el lugar sí
   trae foto se usa de fondo y desaparece el texto: mismo hueco, mismo recorte. */
.plh-card .plh-ph.plh-con-foto { background-size: cover; background-position: center; }
.plh-card .plh-ph .plh-ball { right: -26px; bottom: -34px; width: 120px; opacity: .95; }
.plh-grid3 .plh-card:not(:nth-child(2)) .plh-ph .plh-ball { display: none; }
.plh-card .plh-badge {
	position: absolute; top: 12px; left: 12px; background: rgba(10,21,20,.82); color: #fff;
	font-size: 11px; font-weight: 600; letter-spacing: .04em; padding: 6px 11px;
	border-radius: var(--plh-rp); z-index: 2;
}
.plh-card .plh-bd { padding: 20px 20px 22px; display: flex; flex-direction: column; gap: 9px; flex: 1; }
.plh-card .plh-loc { font-size: 13px; color: var(--plh-muted); }
.plh-tags { display: flex; flex-wrap: wrap; gap: 7px; margin-top: auto; padding-top: 6px; }
.plh-tag { background: var(--plh-mint); color: var(--plh-teal-d); font-size: 12px; font-weight: 600; padding: 5px 11px; border-radius: var(--plh-rp); }
.plh-tag.plh-g { background: #F0F3F2; color: var(--plh-muted); font-weight: 500; }
.plh-card .plh-go {
	display: flex; align-items: center; gap: 8px; color: var(--plh-teal-d); font-weight: 600;
	font-size: 14px; padding-top: 12px; border-top: 1px solid var(--plh-line); margin-top: 12px;
}

/* --- 5 · los tres pasos --------------------------------------------------- */
.plh-steps { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 38px; position: relative; z-index: 1; }
.plh-step .plh-n {
	width: 60px; height: 60px; border-radius: 50%; background: var(--plh-teal); color: #fff;
	display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 21px;
	margin-bottom: 20px; box-shadow: 0 0 0 10px rgba(0,176,168,.14);
}
.plh-sec-dark .plh-step .plh-n { background: var(--plh-yellow); color: #0A1514; }
.plh-sec-dark .plh-step p { color: #A7C4C1; font-size: 14.5px; margin-top: 9px; }
.plh-disclaimer {
	margin-top: 48px; padding: 22px 26px; border-radius: var(--plh-r); background: rgba(255,255,255,.05);
	border: 1px solid rgba(255,255,255,.12); max-width: 720px; position: relative; z-index: 1;
}
.plh-disclaimer p { color: #C6E5E2; font-size: 15px; }
.plh-disclaimer strong { color: #fff; }

/* --- 6 · agenda ----------------------------------------------------------- */
.plh-evs { display: flex; flex-direction: column; gap: 12px; }
.plh-ev {
	display: flex; gap: 20px; align-items: center; background: #fff; border: 1px solid var(--plh-line);
	border-radius: var(--plh-r); padding: 18px 22px; transition: .25s;
}
.plh-ev:hover { border-color: var(--plh-teal); transform: translateX(4px); }
.plh-ev .plh-date {
	flex: none; width: 66px; height: 66px; border-radius: 14px; background: var(--plh-carbon); color: #fff;
	display: flex; flex-direction: column; align-items: center; justify-content: center; line-height: 1;
}
.plh-ev .plh-date b { font-size: 22px; font-weight: 700; }
.plh-ev .plh-date span { font-size: 10.5px; text-transform: uppercase; letter-spacing: .1em; color: var(--plh-yellow); margin-top: 4px; }
.plh-ev .plh-ev-cuerpo { flex: 1; }
.plh-ev .plh-meta { font-size: 13px; color: var(--plh-muted); }

/* --- 7 · lecturas --------------------------------------------------------- */
.plh-arts { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 18px; }
.plh-art {
	border: 1px solid var(--plh-line); border-radius: var(--plh-r); padding: 26px 24px; background: #fff;
	transition: .25s; display: flex; flex-direction: column; gap: 10px; min-height: 180px;
}
.plh-art:hover { border-color: var(--plh-teal); transform: translateY(-4px); }
.plh-art .plh-num { font-size: 12px; font-weight: 700; color: var(--plh-teal); letter-spacing: .1em; }
.plh-art .plh-go { margin-top: auto; color: var(--plh-teal-d); font-weight: 600; font-size: 14px; }

/* --- 8 · comunidad -------------------------------------------------------- */
.plh-cta {
	background: var(--plh-teal); border-radius: 28px; padding: clamp(38px, 5vw, 64px); color: #fff;
	position: relative; overflow: hidden;
}
.plh-cta .plh-ball { right: -90px; top: -90px; width: 330px; opacity: .95; }
.plh-cta .plh-in { position: relative; max-width: 620px; }
.plh .plh-cta .plh-h2 { color: #fff; }
.plh .plh-cta .plh-kicker { color: rgba(255,255,255,.88); }
.plh-cta p { color: rgba(255,255,255,.92); margin: 14px 0 26px; font-size: 16px; }
.plh-cta .plh-row { display: flex; gap: 12px; flex-wrap: wrap; }

/* --- 9 · banda de marca y pie --------------------------------------------- */
.plh-brandband { background: var(--plh-carbon); padding: 44px 0; overflow: hidden; position: relative; }
.plh-brandband .plh-wrap { display: flex; align-items: center; justify-content: center; gap: clamp(20px, 4vw, 54px); flex-wrap: wrap; }
.plh-brandband img.plh-bl-logo { height: clamp(78px, 10vw, 130px); width: auto; }
.plh-brandband .plh-claim {
	color: #8FBDB8; font-size: clamp(13px, 1.3vw, 16px); letter-spacing: .24em;
	text-transform: uppercase; font-weight: 600;
}
.plh-footer {
	background: var(--plh-carbon); color: #A7C4C1; padding: clamp(56px, 7vw, 86px) 0 32px;
	position: relative; overflow: hidden;
}
.plh-fgrid { display: grid; grid-template-columns: 1.6fr repeat(4, 1fr); gap: 38px; position: relative; z-index: 1; }
.plh .plh-footer h4 { color: #fff; font-size: 13px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; margin-bottom: 16px; }
.plh .plh-footer ul { list-style: none; display: flex; flex-direction: column; gap: 9px; }
.plh .plh-footer .plh-nolink { font-size: 14px; }
.plh .plh-footer a { font-size: 14px; transition: .18s; }
.plh .plh-footer a:hover { color: var(--plh-yellow); }
.plh-footer .plh-flogo { height: 132px; width: auto; margin-bottom: 18px; }
.plh-footer .plh-tagline { font-size: 14px; max-width: 290px; }
.plh-fbot {
	margin-top: 50px; padding-top: 24px; border-top: 1px solid rgba(255,255,255,.1); display: flex;
	justify-content: space-between; gap: 16px; flex-wrap: wrap; font-size: 13px; color: #6E8B88;
	position: relative; z-index: 1;
}

/* --- responsive (copiado de la maqueta) ----------------------------------- */
@media (max-width: 900px) {
	.plh-fgrid { grid-template-columns: 1fr 1fr; gap: 30px; }
}
@media (max-width: 640px) {
	.plh .plh-sec-head .plh-btn { width: 100% !important; justify-content: center !important; }
	.plh .plh-cta .plh-row .plh-btn { width: 100% !important; justify-content: center !important; }
	.plh-ev { flex-wrap: wrap; }
}
@media (max-width: 520px) {
	.plh-fgrid { grid-template-columns: 1fr; }
}

/* La sección de comunidad va pegada a la de aprender: en la maqueta llevaba
   «padding-top:0» en línea. Aquí es una clase para no meter estilo en el HTML. */
.plh-sec.plh-sin-top { padding-top: 0; }

/* La cabecera de la sección oscura no es la de dos columnas: en la maqueta
   era un bloque suelto de 620px de ancho con 52px de aire debajo. */
.plh-sec-intro { max-width: 620px; margin-bottom: 52px; }

/* === FICHA DE LUGAR · estética de la home ================================
 * La ficha usaba la cabecera del tema y otra maquetación, así que al pasar
 * de la home a una ficha parecían dos webs distintas. Aquí se reutiliza la
 * cabecera flotante (.plh-header) y se lleva el lenguaje visual de la home
 * a la portada de la ficha y a la tarjeta de contacto.
 * ====================================================================== */

.plf-cab { position: relative; z-index: 20; }

.plf-hero {
	position: relative;
	background: var(--pl-carbon);
	color: #fff;
	padding: 128px 24px 92px;
	margin-top: -104px;
	overflow: hidden;
}

.plf-hero-trama {
	position: absolute;
	inset: 0;
	background-image: radial-gradient(rgba(255,255,255,.14) 1.5px, transparent 1.6px);
	background-size: 22px 22px;
	-webkit-mask-image: linear-gradient(to bottom right, #000, transparent 64%);
	mask-image: linear-gradient(to bottom right, #000, transparent 64%);
	pointer-events: none;
}

.plf-wrap { position: relative; z-index: 1; max-width: 1140px; margin: 0 auto; }

.plf-migas { font-size: 13px; margin-bottom: 22px; color: rgba(255,255,255,.55); }
.plf-migas a { color: rgba(255,255,255,.75); text-decoration: none !important; }
.plf-migas a:hover { color: var(--pl-yellow); }
.plf-migas span { margin: 0 7px; }

.plf-id { display: flex; align-items: flex-start; gap: 22px; }
.plf-id-marca .plui-logo { background: #fff; border: 0; border-radius: 18px; padding: 10px; }
.plf-id-marca .plui-mono { border-radius: 18px; }

.plf-tipo {
	display: inline-block; font-size: 12px; font-weight: 700; letter-spacing: .1em;
	text-transform: uppercase; color: var(--pl-yellow); margin-bottom: 8px;
}

.plf-titulo {
	font-size: clamp(30px, 5vw, 50px); line-height: 1.04; letter-spacing: -.028em;
	color: #fff !important; margin: 0 0 12px;
}

.plf-dir { display: flex; align-items: flex-start; gap: 8px; font-size: 16px; color: rgba(255,255,255,.8); margin: 0; }
.plf-dir svg { width: 19px; height: 19px; flex: 0 0 19px; fill: var(--pl-yellow); margin-top: 2px; }

.plf-rapidos { list-style: none; margin: 30px 0 0; padding: 0; display: flex; gap: 38px; flex-wrap: wrap; }
.plf-rapidos li { list-style: none; margin: 0; }
.plf-rapidos b { display: block; font-size: 34px; font-weight: 800; line-height: 1; color: var(--pl-yellow); letter-spacing: -.03em; }
.plf-rapidos span { display: block; font-size: 13px; color: rgba(255,255,255,.7); margin-top: 5px; }

.plf-fiab { font-size: 14px; line-height: 1.5; padding: 13px 18px; border-radius: 12px; margin: 28px 0 0; max-width: 68ch; }
.plf-fiab.is-ok { background: rgba(255,255,255,.1); color: #fff; }
.plf-fiab.is-pend { background: rgba(254,218,40,.12); color: #FFF1B8; border-left: 3px solid var(--pl-yellow); }

.plf-contacto {
	background: #fff; border: 1px solid var(--pl-line); border-radius: 20px;
	padding: 26px 24px 20px; box-shadow: 0 14px 40px rgba(10,21,20,.08);
}

.plf-contacto-cab h2 { font-size: 24px; margin: 0 0 4px; color: var(--pl-carbon); letter-spacing: -.01em; }
.plf-contacto-sub { font-size: 14px; color: var(--pl-muted); margin: 0 0 18px; }

.plf-wa {
	display: flex !important; align-items: center; justify-content: center; gap: 10px;
	width: 100%; padding: 15px 22px; border-radius: 999px;
	background-color: #1FAF54 !important; border: 0 !important; color: #fff !important;
	font-weight: 700; font-size: 16px; text-decoration: none !important;
}

.plf-wa:hover { background-color: #17913F !important; }
.plf-wa svg { width: 22px; height: 22px; fill: currentColor; }
.plf-wa-nota { font-size: 12.5px; color: var(--pl-muted); margin: 10px 2px 0; line-height: 1.45; }

.plf-filas { margin-top: 16px; }

.plf-fila {
	display: grid; grid-template-columns: 38px 1fr auto; align-items: center; gap: 12px;
	padding: 12px 6px; border-top: 1px solid var(--pl-line);
	text-decoration: none !important; transition: background .15s ease; border-radius: 10px;
}

.plf-fila:hover { background: var(--pl-soft); }

.plf-fila-ico {
	display: flex; align-items: center; justify-content: center;
	width: 38px; height: 38px; border-radius: 11px; background: var(--pl-mint);
}

.plf-fila-ico svg { width: 19px; height: 19px; fill: var(--pl-teal-d); }
.plf-fila-txt i { display: block; font-style: normal; font-size: 12px; color: var(--pl-muted); }
.plf-fila-txt b { display: block; font-size: 15px; font-weight: 600; color: var(--pl-carbon); word-break: break-word; }
.plf-fila-f { color: var(--pl-teal); font-size: 17px; opacity: .55; }
.plf-fila:hover .plf-fila-f { opacity: 1; }

@media (max-width: 860px) {
	.plf-hero { padding: 118px 18px 62px; }
	.plf-id { flex-direction: column; gap: 16px; }
	.plf-rapidos { gap: 24px; }
	.plf-rapidos b { font-size: 27px; }
	.plf-contacto { border-radius: 16px; padding: 20px 18px 16px; }
}

/* La plantilla de ficha ya trae su propia cabecera flotante y su propio pie.
 * El tema Hello sigue imprimiendo los suyos porque una plantilla del
 * maquetador de temas no respeta el modo lienzo, así que salían duplicados.
 * Se ocultan solo en las fichas de lugar, no en todo el sitio. */
body.single-pl_lugar .site-header,
body.single-pl_lugar .site-footer,
body.single-pl_club .site-header,
body.single-pl_club .site-footer {
	display: none !important;
}

/* --- Cabecera dentro de la ficha ---
 * En la home la cabecera va en posicion absoluta flotando sobre la foto del
 * hero. En la ficha no hay foto y su contenedor no tiene altura, asi que
 * absoluta se comia el nombre del lugar. Aqui va en el flujo normal.
 * Ademas el kit de Elementor le mete 64px de relleno al boton y lo
 * convertia en un bloque enorme; se acota solo dentro de la ficha. */

.plf-cab .plh-header {
	position: relative !important;
	top: auto !important;
	padding-top: 18px;
}

.plf-cab .plh-cta {
	padding: 14px 26px !important;
	border-radius: 999px !important;
	font-size: 15px !important;
	line-height: 1.2 !important;
	height: auto !important;
	width: auto !important;
}

.plf-cab .plh-hbar {
	padding: 12px 12px 12px 26px !important;
}

.plf-cab .plh-logo img {
	max-height: 58px;
	width: auto;
}

/* Con la cabecera en flujo ya no hace falta subir el hero por debajo de ella. */
.plf-hero {
	margin-top: -78px;
	padding-top: 104px;
}

@media (max-width: 860px) {
	.plf-hero { margin-top: -70px; padding-top: 96px; }
	.plf-cab .plh-cta { padding: 11px 18px !important; font-size: 14px !important; }
}

/* === BUSCADOR CON FORMA DE PÍLDORA EN EL HERO ===========================
 * Al reconstruir la home con widgets nativos, el buscador dejó de estar
 * dentro del widget del hero y perdió su forma: volvió al estilo genérico
 * de caja cuadrada, que sobre la foto se lee mal y no es lo aprobado.
 *
 * Se le devuelve la píldora de la maqueta: campo y botón dentro de la misma
 * cápsula blanca, y el «Cerca de mí» en blanco translúcido para que se lea
 * sobre la foto, donde el gris del estilo genérico desaparecía.
 * ====================================================================== */

.plh-busc-hero .plui-b-form {
	display: flex;
	align-items: center;
	gap: 10px;
	flex-wrap: nowrap;
	max-width: 620px;
}

.plh-busc-hero .plui-b-titulo { display: none; }

/* La cápsula: campo + botón comparten fondo, borde y sombra. */
.plh-busc-hero .plui-b-form > input.plui-b-input {
	flex: 1 1 auto;
	height: 72px;
	padding: 0 10px 0 54px;
	border: 0 !important;
	border-radius: 999px 0 0 999px;
	background-color: #fff !important;
	font-size: 16px;
	box-shadow: none;
}

.plh-busc-hero .plui-b-form > input.plui-b-input:focus {
	box-shadow: none;
	outline: 0;
}

.plh-busc-hero .plui-b-form {
	position: relative;
}

/* El pin, dentro del campo. */
.plh-busc-hero .plui-b-form::before {
	content: "";
	position: absolute;
	left: 22px;
	top: 50%;
	transform: translateY(-50%);
	width: 20px;
	height: 20px;
	background: var(--pl-teal);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a7 7 0 0 0-7 7c0 5 7 13 7 13s7-8 7-13a7 7 0 0 0-7-7Zm0 9.5A2.5 2.5 0 1 1 12 6a2.5 2.5 0 0 1 0 5.5Z'/%3E%3C/svg%3E") center/contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a7 7 0 0 0-7 7c0 5 7 13 7 13s7-8 7-13a7 7 0 0 0-7-7Zm0 9.5A2.5 2.5 0 1 1 12 6a2.5 2.5 0 0 1 0 5.5Z'/%3E%3C/svg%3E") center/contain no-repeat;
	z-index: 2;
	pointer-events: none;
}

/* Contenedor blanco que envuelve campo y botón. */
.plh-busc-hero .plui-buscador {
	background: #fff;
	border-radius: 999px;
	padding: 8px 8px 8px 0;
	max-width: 620px;
	box-shadow: 0 14px 40px rgba(10,21,20,.28);
}

.plh-busc-hero .plui-b-form > button.plui-btn {
	height: 56px;
	padding: 0 26px;
	border-radius: 999px;
	background-color: var(--pl-carbon) !important;
	color: #fff !important;
	flex: 0 0 auto;
}

.plh-busc-hero .plui-b-form > button.plui-btn:hover {
	background-color: #16302d !important;
}

/* «Cerca de mí» sale fuera de la cápsula, sobre la foto. */
.plh-busc-hero .plui-b-form > button.plui-b-geo {
	position: absolute;
	left: calc(100% + 14px);
	top: 50%;
	transform: translateY(-50%);
	height: 56px;
	border: 1.5px solid rgba(255,255,255,.5) !important;
	color: #fff !important;
	background: rgba(255,255,255,.08) !important;
	white-space: nowrap;
}

.plh-busc-hero .plui-b-form > button.plui-b-geo:hover {
	border-color: #fff !important;
	background: rgba(255,255,255,.18) !important;
}

.plh-busc-hero .plui-b-estado { color: rgba(255,255,255,.85); }

@media (max-width: 900px) {
	.plh-busc-hero .plui-buscador { background: transparent; box-shadow: none; padding: 0; }
	.plh-busc-hero .plui-b-form { flex-wrap: wrap; }
	.plh-busc-hero .plui-b-form::before { display: none; }
	.plh-busc-hero .plui-b-form > input.plui-b-input { border-radius: 999px; padding-left: 22px; height: 60px; width: 100%; flex: 1 1 100%; }
	.plh-busc-hero .plui-b-form > button.plui-btn { width: 100%; }
	.plh-busc-hero .plui-b-form > button.plui-b-geo { position: static; transform: none; left: auto; width: 100%; }
}

/* === «AYÚDANOS A COMPLETAR ESTA FICHA» ==================================
 * Rellena el hueco que dejaba la columna derecha en las fichas con pocos
 * datos. No es relleno decorativo: pide exactamente lo que le falta a esa
 * ficha, que es como se consigue que alguien conteste.
 * ====================================================================== */

.plf-completar {
	position: relative;
	overflow: hidden;
	background: var(--pl-mint);
	border-radius: 18px;
	padding: 30px 32px 32px;
	margin: 8px 0 40px;
}

.plf-completar-bola {
	position: absolute;
	right: -58px;
	bottom: -68px;
	width: 190px;
	height: 190px;
	border-radius: 50%;
	background: radial-gradient(circle at 34% 30%, #FFE86B 0%, var(--pl-yellow) 46%, #E4B800 100%);
	opacity: .5;
	pointer-events: none;
}

.plf-completar-txt { position: relative; z-index: 1; max-width: 56ch; }

.plf-completar-kicker {
	display: inline-block;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--pl-teal-d);
	margin-bottom: 8px;
}

.plf-completar h2 {
	font-size: 26px;
	line-height: 1.15;
	letter-spacing: -.015em;
	color: var(--pl-carbon);
	margin: 0 0 10px;
}

.plf-completar-intro {
	font-size: 15.5px;
	line-height: 1.55;
	color: var(--pl-teal-d);
	margin: 0 0 18px;
}

.plf-completar-lbl {
	font-size: 13px;
	font-weight: 700;
	color: var(--pl-carbon);
	margin: 0 0 8px;
}

.plf-completar-lista {
	list-style: none !important;
	margin: 0 0 22px;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.plf-completar-lista li {
	list-style: none !important;
	margin: 0 !important;
	background: #fff;
	border-radius: 999px;
	padding: 7px 14px;
	font-size: 13.5px;
	color: var(--pl-carbon);
}

.plf-completar-cta {
	display: inline-flex !important;
	align-items: center;
	gap: 8px;
	padding: 13px 24px;
	border-radius: 999px;
	background-color: var(--pl-teal) !important;
	border: 0 !important;
	color: #fff !important;
	font-weight: 700;
	font-size: 15px;
	text-decoration: none !important;
}

.plf-completar-cta:hover { background-color: var(--pl-teal-d) !important; }

.plf-completar-nota {
	font-size: 13px;
	color: var(--pl-muted);
	margin: 14px 0 0;
}

@media (max-width: 640px) {
	.plf-completar { padding: 24px 20px 26px; border-radius: 14px; }
	.plf-completar h2 { font-size: 22px; }
	.plf-completar-bola { width: 140px; height: 140px; right: -46px; bottom: -52px; }
}

/* === ZONA Y CLUB ========================================================
 * Reutilizan el hero de la ficha de lugar (.plf-hero) para que las tres
 * páginas se lean como la misma web. Solo se añade lo propio de cada una.
 * ====================================================================== */

.plz-intro {
	font-size: 17px;
	line-height: 1.55;
	color: rgba(255,255,255,.82);
	max-width: 62ch;
	margin: 14px 0 0;
}

.plz-hero .plf-tipo,
.plc-hero .plf-tipo { margin-bottom: 10px; }

.plc-sedes {
	font-size: 16px;
	color: rgba(255,255,255,.8);
	margin: 4px 0 0;
}

.plc-sedes a {
	color: var(--pl-yellow);
	text-decoration: none !important;
	border-bottom: 1px solid rgba(254,218,40,.35);
}

.plz-lista,
.plz-clubes,
.plz-mapa,
.plc-unirse,
.plc-sedes-bloque { max-width: 1140px; margin-left: auto; margin-right: auto; }

.plz-clubes .plui-club h3 { margin-bottom: 6px; }
.plz-clubes .plui-club h3 a { color: var(--pl-carbon); text-decoration: none !important; }
.plz-clubes .plui-club h3 a:hover { color: var(--pl-teal); }

@media (max-width: 860px) {
	.plz-intro { font-size: 15.5px; }
}

/* === CABECERA GLOBAL: SIN SOLAPE =======================================
 * El hero llevaba margen superior negativo para meterse por debajo de la
 * cabecera, que en su día iba DENTRO de la propia página y era flotante
 * sobre fondo oscuro.
 *
 * Ahora la cabecera es una plantilla global con su barra blanca propia, así
 * que ese margen negativo hacía que el hero tapara el logo. Se anula y se
 * devuelve al hero un relleno superior normal.
 * ====================================================================== */

.plf-hero {
	margin-top: 0 !important;
	padding-top: 64px !important;
}

@media (max-width: 860px) {
	.plf-hero { padding-top: 44px !important; }
}

/* === BUSCADOR · sugerencias y responsive ================================
 * El botón «Cerca de mí» se desbordaba y se solapaba con «Buscar», y en
 * móvil la fila de tres controles provocaba scroll horizontal. Se resuelve
 * dejando que el campo crezca y que los botones no se encojan, y apilando
 * en móvil: primero el campo, y debajo los dos botones al 50%.
 * ====================================================================== */

.plui-buscador { position: relative; }

.plui-b-form {
	display: flex;
	flex-wrap: wrap;
	align-items: stretch;
	gap: 10px;
}

/* El campo se lleva todo el espacio sobrante; los botones nunca se encogen
 * por debajo de su contenido, que era lo que los partía. */
.plui-b-input { flex: 1 1 260px; min-width: 0; }
.plui-buscador .plui-b-form button { flex: 0 0 auto; white-space: nowrap; }

/* --- Sugerencias --- */

.plui-sug {
	position: absolute;
	z-index: 60;
	left: 0;
	right: 0;
	margin: 8px 0 0;
	padding: 6px;
	list-style: none !important;
	background: #fff;
	border: 1px solid var(--pl-line);
	border-radius: 16px;
	box-shadow: 0 18px 44px rgba(10,21,20,.16);
	max-height: 52vh;
	overflow-y: auto;
}

.plui-sug[hidden] { display: none !important; }

.plui-sug-i {
	list-style: none !important;
	margin: 0 !important;
	padding: 10px 12px;
	border-radius: 11px;
	cursor: pointer;
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.plui-sug-i:hover,
.plui-sug-i.is-sel { background: var(--pl-mint); }

.plui-sug-n { font-size: 15px; font-weight: 600; color: var(--pl-carbon); line-height: 1.25; }
.plui-sug-t { font-size: 12px; color: var(--pl-muted); }
.plui-sug-i.is-sel .plui-sug-t { color: var(--pl-teal-d); }

/* --- Tablet --- */
@media (max-width: 900px) {
	.plui-b-input { flex: 1 1 100%; }
	.plui-buscador .plui-b-form button { flex: 1 1 calc(50% - 5px); }
}

/* --- Móvil ---
 * Tres controles en horizontal no caben. Se prioriza la usabilidad: campo
 * a lo ancho y los dos botones repartidos debajo. */
@media (max-width: 640px) {
	.plui-b-form { gap: 8px; }
	.plui-b-input { flex: 1 1 100%; width: 100%; }
	.plui-buscador .plui-b-form button { flex: 1 1 calc(50% - 4px); min-width: 0; }
	.plui-buscador .plui-b-form button.plui-b-geo span { overflow: hidden; text-overflow: ellipsis; }
	.plui-sug { border-radius: 14px; max-height: 46vh; }
}

/* En el hero de la home la píldora es blanca y el desplegable debe salir
 * por debajo de ella sin romper el redondeo. */
.plh-busc-hero .plui-sug { margin-top: 10px; }

/* === AJUSTES FINALES DEL BUSCADOR ======================================= */

/* Los dos botones deben repartirse la fila. Con calc(50% - 5px) la suma
 * daba exactamente el ancho disponible y el redondeo del navegador los
 * hacía saltar de línea. Con un poco más de holgura caben siempre. */
@media (max-width: 900px) {
	.plui-buscador .plui-b-form button { flex: 1 1 calc(50% - 12px); }
}

@media (max-width: 640px) {
	.plui-buscador .plui-b-form button { flex: 1 1 calc(50% - 10px); }
}

/* El desbordamiento horizontal en móvil no venía del buscador sino del
 * mapa: sus teselas se salen del contenedor y arrastran la página entera.
 * Se contiene el mapa, que es donde está el problema, en vez de esconder
 * el scroll a nivel de documento, que taparía el síntoma sin arreglarlo. */
.plui-mapa-wrap,
.plui-mapa {
	max-width: 100%;
	overflow: hidden;
}

.plui-mapa .leaflet-pane,
.plui-mapa .leaflet-container { max-width: 100%; }

/* =========================================================================
 * FICHA DE LUGAR · v1.0
 *
 * Si no hay dato, no hay bloque. El widget devuelve cadena vacia, Elementor
 * no imprime nada y el contenedor se esconde solo con :has().
 * Los colores salen de las variables de marca: la ficha tiene que
 * parecerse a la home, no a otra web.
 * ========================================================================= */

.plf-si-hero:not(:has(.plfx-hero)),
.plf-si-jugar:not(:has(.plfx-jugar)),
.plf-si-cj:not(:has(.plfx-comojuega)),
.plf-si-pistas:not(:has(.plfx-pistas)),
.plf-si-precios:not(:has(.plfx-precios)),
.plf-si-clases:not(:has(.plfx-clases)),
.plf-si-ubi:not(:has(.plfx-ubicacion)),
.plf-si-revision:not(:has(.plfx-revision)),
.plf-si-contacto:not(:has(.plf-contacto)),
.plf-si-cercanos:not(:has(.plui-cercanos)) {
	display: none !important;
}

.plfx { margin: 0; min-width: 0; }
.plfx * { min-width: 0; }
.plfx img { max-width: 100%; height: auto; }

.plfx h2 {
	font-size: clamp(23px, 3.6vw, 32px);
	line-height: 1.14;
	letter-spacing: -.02em;
	color: var(--pl-carbon);
	margin: 0 0 14px;
}
.plfx .plfx-sub { margin: -6px 0 20px; color: var(--pl-muted); font-size: 15px; }
.plfx .plfx-h3,
.plfx-pistas h3 {
	font-size: 12px;
	letter-spacing: .09em;
	text-transform: uppercase;
	color: var(--pl-muted);
	font-weight: 800;
	margin: 22px 0 10px;
}

/* --- A · portada ------------------------------------------------------ */
.plfx-hero {
	position: relative;
	background: var(--pl-carbon);
	background-size: cover;
	background-position: center;
	color: #fff;
	padding: 64px 24px 72px;
	overflow: hidden;
}
.plfx-hero.tiene-foto::before {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(10,21,20,.5), rgba(10,21,20,.93));
}
.plfx-hero-trama {
	position: absolute;
	inset: 0;
	background-image: radial-gradient(rgba(255,255,255,.14) 1.5px, transparent 1.6px);
	background-size: 22px 22px;
	-webkit-mask-image: linear-gradient(to bottom right, #000, transparent 64%);
	mask-image: linear-gradient(to bottom right, #000, transparent 64%);
	pointer-events: none;
}
.plfx-wrap { position: relative; z-index: 2; max-width: 1140px; margin: 0 auto; }

.plfx-migas { font-size: 13px; margin-bottom: 22px; color: rgba(255,255,255,.55); display: flex; flex-wrap: wrap; gap: 7px; }
.plfx-migas a { color: rgba(255,255,255,.75); text-decoration: none !important; }
.plfx-migas a:hover { color: var(--pl-yellow); }

.plfx-id { display: flex; align-items: flex-start; gap: 20px; flex-wrap: wrap; }
.plfx-id-marca .plui-logo { background: #fff; border: 0; border-radius: 18px; padding: 10px; }
.plfx-id-marca .plui-logo.plui-mono { border-radius: 18px; }
.plfx-id-txt { flex: 1 1 260px; }
.plfx-tipo {
	display: inline-block;
	font-size: 12px; font-weight: 700; letter-spacing: .1em;
	text-transform: uppercase; color: var(--pl-yellow); margin-bottom: 6px;
}
.plfx-titulo {
	font-size: clamp(28px, 5.6vw, 50px);
	line-height: 1.04; letter-spacing: -.028em;
	color: #fff !important; margin: 0 0 10px;
	overflow-wrap: anywhere;
}
.plfx-dir { font-size: 16px; color: rgba(255,255,255,.8); margin: 0; overflow-wrap: anywhere; }

.plfx-chips { list-style: none; display: flex; flex-wrap: wrap; gap: 8px; margin: 24px 0 0; padding: 0; }
.plfx-chip {
	list-style: none; margin: 0;
	font-size: 14px; font-weight: 600; color: #fff;
	background: rgba(255,255,255,.1);
	border: 1px solid rgba(255,255,255,.16);
	border-radius: 999px;
	padding: 7px 15px 7px 35px;
	position: relative;
}
.plfx-chip::before { position: absolute; left: 13px; top: 50%; transform: translateY(-50%); font-size: 13px; line-height: 1; }
.plfx-chip.is-ubi::before   { content: "\1F4CD"; }
.plfx-chip.is-pista::before { content: "\1F3D3"; }
.plfx-chip.is-techo::before { content: "\1F3E0"; }
.plfx-chip.is-sol::before   { content: "\2600\FE0F"; }

/* --- B · quieres jugar aqui ------------------------------------------- */
.plfx-jugar-caja {
	background: linear-gradient(180deg, var(--pl-mint), #fff);
	border: 1px solid var(--pl-line);
	border-left: 4px solid var(--pl-teal);
	border-radius: var(--pl-radio);
	padding: 24px 22px;
}
.plfx-jugar-h { font-size: clamp(22px, 3.4vw, 28px); line-height: 1.15; margin: 0 0 16px; color: var(--pl-carbon); letter-spacing: -.02em; }
.plfx-lista { list-style: none; margin: 0 0 20px; padding: 0; }
.plfx-fila {
	list-style: none; margin: 0;
	display: flex; justify-content: space-between; align-items: baseline;
	gap: 16px; padding: 11px 0; border-top: 1px solid var(--pl-line);
}
.plfx-fila:first-child { border-top: 0; padding-top: 0; }
.plfx-fila-e { color: var(--pl-muted); font-size: 15px; flex: 0 1 auto; }
.plfx-fila-v { font-size: 15px; color: var(--pl-carbon); text-align: right; overflow-wrap: anywhere; }

.plfx-acciones { display: flex; flex-wrap: wrap; gap: 10px; }
.plfx-cta, .plfx-cta2 {
	display: inline-flex; align-items: center; justify-content: center;
	font-weight: 700; font-size: 16px; line-height: 1.2;
	border-radius: 999px; padding: 15px 28px;
	text-decoration: none !important; text-align: center;
}
.plfx-cta { background: var(--pl-teal); color: #fff !important; border: 1px solid var(--pl-teal); }
.plfx-cta:hover { background: var(--pl-teal-d); border-color: var(--pl-teal-d); color: #fff !important; }
.plfx-cta2 { background: #fff; color: var(--pl-teal-d) !important; border: 1px solid var(--pl-teal); font-size: 15px; padding: 14px 22px; }
.plfx-cta2:hover { background: var(--pl-mint); color: var(--pl-teal-d) !important; }

/* --- C · como se juega aqui ------------------------------------------- */
.plfx-cj { display: grid; grid-template-columns: repeat(auto-fit, minmax(290px, 1fr)); gap: 18px; align-items: start; }
.plfx-cj-lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.plfx-cj-item {
	list-style: none; margin: 0;
	background: #fff; border: 1px solid var(--pl-line);
	border-left: 4px solid var(--pl-teal);
	border-radius: 12px; padding: 15px 18px;
}
.plfx-cj-item.is-no { border-left-color: #C3CDCB; }
.plfx-cj-item.is-info { border-left-color: var(--pl-yellow); }
.plfx-cj-p { display: block; font-size: 14px; color: var(--pl-muted); }
.plfx-cj-r { display: block; font-size: 24px; font-weight: 800; line-height: 1.2; color: var(--pl-carbon); margin: 2px 0 1px; }
.plfx-cj-n { display: block; font-size: 13px; color: var(--pl-muted); }

.plfx-cj-nota { background: var(--pl-carbon); border-radius: var(--pl-radio); padding: 22px 24px; }
.plfx-cj-nota h3 { color: var(--pl-yellow); margin: 0 0 10px; font-size: 12px; letter-spacing: .09em; text-transform: uppercase; font-weight: 800; }
.plfx-cj-nota p { color: rgba(255,255,255,.9); font-size: 15px; line-height: 1.62; margin: 0 0 10px; }
.plfx-cj-nota p:last-child { margin: 0; }

.plfx-cj-amb { background: var(--pl-soft); border-radius: var(--pl-radio); padding: 20px 22px; }
.plfx-cj-amb h3 { margin: 0 0 6px; }
.plfx-cj-amb p { margin: 0; font-size: 15px; line-height: 1.6; color: #283634; }

/* --- D · pistas e instalaciones --------------------------------------- */
.plfx-cifras { list-style: none; display: flex; flex-wrap: wrap; gap: 14px 30px; margin: 0 0 20px; padding: 0; }
.plfx-cifras li { list-style: none; margin: 0; }
.plfx-cifra { display: block; font-size: 34px; font-weight: 800; line-height: 1; color: var(--pl-teal); }
.plfx-cifra-t { display: block; font-size: 13px; color: var(--pl-muted); margin-top: 5px; }

.plfx-tags { list-style: none; display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; }
.plfx-tags li {
	list-style: none; margin: 0; font-size: 14px;
	background: #fff; border: 1px solid var(--pl-line);
	border-radius: 999px; padding: 7px 15px; color: var(--pl-carbon);
}
.plfx-tags.is-serv li { background: var(--pl-mint); border-color: transparent; color: var(--pl-teal-d); }

.plfx-nota { background: var(--pl-soft); border-radius: var(--pl-radio); padding: 18px 20px; margin-top: 18px; }
.plfx-nota p { margin: 0 0 10px; font-size: 15px; line-height: 1.65; color: #283634; overflow-wrap: anywhere; }
.plfx-nota p:last-child { margin: 0; }

/* --- E · precios ------------------------------------------------------ */
.plfx-tarifa { margin-top: 16px; border: 1px solid var(--pl-line); border-radius: var(--pl-radio); background: #fff; }
.plfx-tarifa > summary {
	cursor: pointer; list-style: none;
	padding: 15px 20px; font-weight: 700; font-size: 15px; color: var(--pl-teal-d);
}
.plfx-tarifa > summary::-webkit-details-marker { display: none; }
.plfx-tarifa > summary::after { content: " \25BE"; }
.plfx-tarifa[open] > summary::after { content: " \25B4"; }
.plfx-tarifa-txt { padding: 0 20px 18px; }
.plfx-tarifa-txt p { margin: 0 0 10px; font-size: 14.5px; line-height: 1.62; color: #283634; overflow-wrap: anywhere; }
.plfx-tarifa-txt p:last-child { margin: 0; }

/* --- F · clases y actividades ----------------------------------------- */
.plfx-club {
	display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
	gap: 14px; background: var(--pl-mint); border-radius: var(--pl-radio); padding: 20px 22px;
}
.plfx-club-n { margin: 0; font-size: 18px; font-weight: 800; color: var(--pl-carbon); overflow-wrap: anywhere; }
.plfx-acts { list-style: none; margin: 16px 0 0; padding: 0; display: grid; gap: 10px; }
.plfx-act { list-style: none; margin: 0; background: #fff; border: 1px solid var(--pl-line); border-radius: 12px; padding: 15px 18px; }
.plfx-act-t { display: block; font-weight: 800; color: var(--pl-carbon); }
.plfx-act-m { display: block; font-size: 14px; color: var(--pl-teal-d); margin-top: 3px; }
.plfx-act-c { display: block; font-size: 14px; color: var(--pl-muted); margin-top: 7px; }

/* --- G · donde esta --------------------------------------------------- */
.plfx-dircompleta { font-size: 17px; color: var(--pl-carbon); margin: 0 0 16px; overflow-wrap: anywhere; }
.plfx-ubi { list-style: none; margin: 20px 0 0; padding: 0; display: grid; gap: 14px; }
.plfx-ubi-i { list-style: none; margin: 0; }
.plfx-ubi-i strong { display: block; font-size: 12px; letter-spacing: .09em; text-transform: uppercase; color: var(--pl-muted); font-weight: 800; margin-bottom: 3px; }
.plfx-ubi-i span { font-size: 15px; line-height: 1.6; color: #283634; }

/* --- I · de donde sale la informacion --------------------------------- */
.plfx-revision { background: var(--pl-soft); border-radius: var(--pl-radio); padding: 22px 24px; }
.plfx-revision h2 { font-size: 12px; letter-spacing: .09em; text-transform: uppercase; color: var(--pl-muted); font-weight: 800; margin: 0 0 8px; }
.plfx-rev-f { margin: 0 0 6px; font-size: 15px; font-weight: 700; color: var(--pl-carbon); }
.plfx-rev-s { margin: 0; font-size: 14px; line-height: 1.6; color: var(--pl-muted); overflow-wrap: anywhere; }

/* --- aviso solo dentro del editor ------------------------------------- */
.plfx-editor-vacio {
	background: #FFF8E1; border: 1px dashed #E0C36A; border-radius: 10px;
	padding: 12px 15px; font-size: 13px; color: #6B5A22;
}

/* --- movil ------------------------------------------------------------ */
@media (max-width: 860px) {
	.plfx-hero { padding: 44px 20px 52px; }
	.plfx-id { gap: 14px; }
	.plfx-cifra { font-size: 30px; }
}
@media (max-width: 600px) {
	.plfx-acciones { flex-direction: column; align-items: stretch; }
	.plfx-acciones .plfx-cta,
	.plfx-acciones .plfx-cta2 { width: 100%; }
	.plfx-jugar-caja { padding: 20px 18px; }
	.plfx-fila { flex-direction: column; gap: 2px; align-items: flex-start; }
	.plfx-fila-v { text-align: left; }
	.plfx-club { flex-direction: column; align-items: flex-start; }
	.plfx-club .plfx-cta2 { width: 100%; }
	.plfx-cj-nota, .plfx-cj-amb, .plfx-revision { padding: 18px 18px; }
}

/* ===== v0.9.1 - ficha de lugar: columna lateral pegajosa =====
   La tarjeta de contacto acompana al lector mientras recorre la ficha.
   position:sticky no puede salirse de su contenedor, asi que nunca tapa
   la seccion siguiente (Otros sitios cerca). Solo en escritorio. */
@media (min-width: 1025px) {
	.plf-sec-cuerpo .plf-col-lat {
		position: sticky;
		top: 24px;
		align-self: flex-start;
	}
	body.admin-bar .plf-sec-cuerpo .plf-col-lat { top: 56px; }
}

/* === EXPLORADOR «DÓNDE JUGAR» ===========================================
 * Listado y mapa en paralelo en escritorio; en móvil manda la lista y el
 * mapa se abre con un botón fijo, para no dejar un mapa diminuto e inútil
 * encima de los resultados.
 * ====================================================================== */

.plx { --plx-alto: 620px; }

.plx-t {
	font-size: clamp(26px, 4vw, 40px);
	line-height: 1.08;
	letter-spacing: -.02em;
	color: var(--pl-carbon);
	margin: 0 0 10px;
}

.plx-s {
	font-size: 17px;
	line-height: 1.5;
	color: var(--pl-muted);
	margin: 0 0 22px;
	max-width: 62ch;
}

/* --- Buscador --------------------------------------------------------- */

.plx-form { display: flex; gap: 10px; flex-wrap: wrap; align-items: stretch; }

.plx-campo {
	position: relative;
	flex: 1 1 320px;
	min-width: 0;
	display: flex;
	align-items: center;
}

.plx-campo > svg {
	position: absolute;
	left: 18px;
	width: 20px;
	height: 20px;
	fill: var(--pl-teal);
	pointer-events: none;
}

.plx .plx-input {
	width: 100%;
	padding: 15px 44px 15px 48px;
	border-radius: 999px;
	border: 1.5px solid var(--pl-line) !important;
	background-color: #fff !important;
	color: var(--pl-carbon) !important;
	font-size: 16px;
}

.plx .plx-input:focus {
	outline: 0;
	border-color: var(--pl-teal) !important;
	box-shadow: 0 0 0 4px rgba(3,133,141,.14);
}

.plx-limpiar {
	position: absolute;
	right: 14px;
	width: 26px;
	height: 26px;
	border-radius: 50%;
	border: 0 !important;
	background-color: var(--pl-soft) !important;
	color: var(--pl-muted) !important;
	font-size: 17px;
	line-height: 1;
	cursor: pointer;
	padding: 0 !important;
}

.plx .plx-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 15px 30px;
	border-radius: 999px;
	background-color: var(--pl-teal) !important;
	border: 0 !important;
	color: #fff !important;
	font-weight: 700;
	font-size: 16px;
	cursor: pointer;
}

.plx .plx-btn:hover { background-color: var(--pl-teal-d) !important; }

.plx .plx-geo {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 14px 20px;
	border-radius: 999px;
	background-color: transparent !important;
	border: 1.5px solid var(--pl-line) !important;
	color: var(--pl-muted) !important;
	font-size: 15px;
	font-weight: 600;
	cursor: pointer;
}

.plx .plx-geo:hover { border-color: var(--pl-teal) !important; color: var(--pl-teal) !important; }
.plx-geo svg { width: 18px; height: 18px; fill: currentColor; }

.plx-filtros { display: flex; gap: 8px; margin-top: 14px; flex-wrap: wrap; }

.plx .plx-f {
	padding: 9px 18px;
	border-radius: 999px;
	background-color: #fff !important;
	border: 1.5px solid var(--pl-line) !important;
	color: var(--pl-muted) !important;
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
}

.plx .plx-f.is-on {
	background-color: var(--pl-carbon) !important;
	border-color: var(--pl-carbon) !important;
	color: #fff !important;
}

.plx-estado { font-size: 14px; color: var(--pl-muted); margin: 20px 0 14px; }
.plx-estado strong { color: var(--pl-carbon); }

/* --- Cuerpo: lista + mapa --------------------------------------------- */

.plx-cuerpo {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr);
	gap: 22px;
	align-items: start;
}

.plx-lista-col { min-width: 0; }

.plx-lista {
	display: grid;
	gap: 12px;
	max-height: var(--plx-alto);
	overflow-y: auto;
	padding-right: 6px;
	scrollbar-width: thin;
}

.plx-card {
	display: grid;
	grid-template-columns: auto 1fr auto;
	align-items: center;
	gap: 16px;
	padding: 14px 16px;
	border: 1px solid var(--pl-line);
	border-radius: var(--pl-radio);
	background: #fff;
	cursor: pointer;
	transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}

.plx-card:hover,
.plx-card:focus-visible {
	border-color: var(--pl-teal);
	box-shadow: 0 8px 22px rgba(10,21,20,.08);
	outline: 0;
}

.plx-card.is-on {
	border-color: var(--pl-teal);
	box-shadow: 0 0 0 2px rgba(3,133,141,.22), 0 10px 26px rgba(10,21,20,.1);
}

.plx-card-marca img {
	width: 52px;
	height: 52px;
	object-fit: contain;
	border-radius: 12px;
	background: #fff;
	border: 1px solid var(--pl-line);
	padding: 4px;
	display: block;
}

.plx-card-cuerpo { min-width: 0; }

.plx-card h3 {
	margin: 0 0 3px;
	font-size: 16px;
	line-height: 1.25;
	color: var(--pl-carbon);
	letter-spacing: -.01em;
}

.plx-card-zona { margin: 0 0 7px; font-size: 13px; color: var(--pl-teal); font-weight: 600; }

.plx-chips { list-style: none; margin: 0; padding: 0; display: flex; gap: 6px; flex-wrap: wrap; }

.plx-chips li {
	list-style: none;
	margin: 0;
	font-size: 12px;
	color: var(--pl-muted);
	background: var(--pl-soft);
	padding: 3px 9px;
	border-radius: 999px;
}

.plx-card-fin { display: flex; flex-direction: column; align-items: flex-end; gap: 6px; }

.plx-km {
	font-size: 12px;
	font-weight: 700;
	color: var(--pl-carbon);
	background: var(--pl-yellow);
	padding: 3px 9px;
	border-radius: 999px;
}

.plx .plx-ver {
	white-space: nowrap;
	font-size: 14px;
	font-weight: 600;
	color: var(--pl-teal) !important;
	text-decoration: none !important;
	border: 1.5px solid var(--pl-line);
	border-radius: 999px;
	padding: 8px 16px;
}

.plx .plx-ver:hover { border-color: var(--pl-teal); background: var(--pl-mint); }

.plx .plx-mas {
	width: 100%;
	margin-top: 12px;
	padding: 13px;
	border-radius: 999px;
	background-color: transparent !important;
	border: 1.5px solid var(--pl-line) !important;
	color: var(--pl-teal) !important;
	font-weight: 600;
	cursor: pointer;
}

/* --- Mapa ------------------------------------------------------------- */

.plx-mapa {
	border-radius: var(--pl-radio);
	overflow: hidden;
	background: var(--pl-soft);
	position: sticky;
	top: 96px;
	z-index: 0;
}

.plx-pin {
	background: var(--pl-teal);
	width: 30px; height: 30px;
	border-radius: 50% 50% 50% 4px;
	transform: rotate(-45deg);
	border: 2.5px solid #fff;
	box-shadow: 0 3px 8px rgba(10,21,20,.35);
	display: flex; align-items: center; justify-content: center;
	transition: background .15s ease, transform .15s ease;
}

.plx-pin span { transform: rotate(45deg); color: var(--pl-yellow); font-size: 13px; font-weight: 800; line-height: 1; }
.plx-pin.is-on { background: var(--pl-carbon); transform: rotate(-45deg) scale(1.18); }

.plx-pop { min-width: 190px; }
.plx-pop-z { font-size: 11px; text-transform: uppercase; letter-spacing: .05em; color: var(--pl-teal); font-weight: 700; }
.plx-pop h4 { margin: 3px 0 4px; font-size: 16px; line-height: 1.2; color: var(--pl-carbon); }
.plx-pop p { margin: 0 0 6px; font-size: 13px; color: var(--pl-muted); }
.plx-pop a { color: var(--pl-teal); font-weight: 600; font-size: 14px; text-decoration: none; }

.plx-toggle { display: none; }

/* --- Móvil: la lista manda, el mapa se abre con un botón fijo ---------- */

@media (max-width: 900px) {

	.plx-cuerpo { grid-template-columns: 1fr; }

	.plx-lista { max-height: none; overflow: visible; padding-right: 0; }

	.plx-mapa-col {
		position: fixed;
		inset: 0;
		z-index: 9000;
		background: #fff;
		padding: 64px 12px 84px;
		display: none;
	}

	.plx.plx-ver-mapa .plx-mapa-col { display: block; }
	.plx.plx-ver-mapa .plx-lista-col { display: none; }

	.plx-mapa { position: static; height: 100% !important; }

	.plx .plx-toggle {
		display: inline-flex;
		align-items: center;
		gap: 9px;
		position: fixed;
		left: 50%;
		transform: translateX(-50%);
		bottom: 20px;
		z-index: 9500;
		padding: 14px 24px;
		border-radius: 999px;
		background-color: var(--pl-carbon) !important;
		border: 0 !important;
		color: #fff !important;
		font-weight: 700;
		font-size: 15px;
		box-shadow: 0 10px 28px rgba(10,21,20,.32);
		cursor: pointer;
	}

	.plx-toggle svg { width: 19px; height: 19px; fill: var(--pl-yellow); }

	.plx-form { flex-direction: column; }
	.plx .plx-btn, .plx .plx-geo { width: 100%; }

	.plx-card { grid-template-columns: auto 1fr; gap: 12px; padding: 13px 14px; }
	.plx-card-marca img, .plx-card .plui-mono { width: 46px !important; height: 46px !important; }
	.plx-card-fin { grid-column: 1 / -1; flex-direction: row; align-items: center; justify-content: space-between; }
	.plx .plx-ver { flex: 1; text-align: center; }
	.plx-card h3 { font-size: 15px; }
}

/* =========================================================================
 * HERO DE LA HOME - AJUSTES 01-09
 *
 * 1. La capsula blanca del buscador era el contenedor del widget, que
 *    ademas envuelve el parrafo de estado y la caja de resultados: por eso
 *    quedaba un hueco blanco muerto debajo del campo y el pin y el boton
 *    parecian descolocados. La capsula pasa a ser el propio formulario.
 * 2. Cerca de mi respira de verdad respecto al boton negro.
 * 3. La tarjeta del hero recupera la posicion flotante de la maqueta. Hay
 *    que forzar con !important porque la hoja de Elementor se carga
 *    despues de esta y su .e-con manda position y width.
 * ========================================================================= */

.plh-busc-hero .plui-buscador {
	background: transparent;
	box-shadow: none;
	padding: 0;
	border-radius: 0;
	max-width: 620px;
}

.plh-busc-hero .plui-b-form {
	background: #fff;
	border-radius: 999px;
	padding: 8px 8px 8px 0;
	box-shadow: 0 26px 60px -22px rgba(10,21,20,.62);
	max-width: 620px;
	align-items: center;
	gap: 10px;
}

.plh-busc-hero .plui-b-form > input.plui-b-input {
	height: 56px;
	padding: 0 6px 0 52px;
	border-radius: 999px 0 0 999px;
}

.plh-busc-hero .plui-b-form::before { left: 20px; }

.plh-busc-hero .plui-b-form > button.plui-btn {
	height: 56px;
	padding: 0 24px;
}

.plh-busc-hero .plui-b-form > button.plui-b-geo {
	left: calc(100% + 16px);
	padding: 0 18px;
}

.plh-busc-hero .plui-b-estado { margin: 16px 0 0; }
.plh-busc-hero .plui-b-resultados { margin-top: 14px; }

@media (max-width: 900px) {
	.plh-busc-hero .plui-b-form {
		background: transparent;
		box-shadow: none;
		padding: 0;
		flex-wrap: wrap;
	}
	.plh-busc-hero .plui-b-form > input.plui-b-input {
		border-radius: 999px;
		padding-left: 22px;
		height: 60px;
		width: 100%;
		flex: 1 1 100%;
	}
	.plh-busc-hero .plui-b-form > button.plui-btn { width: 100%; }
	.plh-busc-hero .plui-b-form > button.plui-b-geo {
		position: static;
		transform: none;
		left: auto;
		width: 100%;
	}
}

/* --- La tarjeta flotante, dentro de un contenedor de Elementor ---------- */

.e-con.plh-overcard {
	position: absolute !important;
	z-index: 6;
	top: auto !important;
	left: auto !important;
	right: clamp(20px, 5vw, 72px) !important;
	bottom: -88px !important;
	width: min(392px, calc(100% - 40px)) !important;
	max-width: none !important;
	border-radius: 28px !important;
	box-shadow: 0 40px 80px -34px rgba(10,21,20,.72) !important;
}

/* La banda que va justo debajo deja sitio a lo que sobresale. */
.plh-tras-hero { padding-top: 118px !important; }

@media (max-width: 1024px) {
	.e-con.plh-overcard {
		position: relative !important;
		right: auto !important;
		bottom: auto !important;
		width: 100% !important;
	}
	.plh-tras-hero { padding-top: 26px !important; }
}

/* --- Logo de marca sobre la tarjeta de zona ---------------------------

   Va como elemento propio de la plantilla del bucle, no incrustado en la
   imagen: asi el recorte del fondo (cover) no puede comerselo. Estas dos
   reglas solo garantizan que se vea entero y con su proporcion, pase lo que
   pase con el ancho de la tarjeta.
   --------------------------------------------------------------------- */

.plh-zona-logo { pointer-events: none; }

.plh-zona-logo img {
	display: block;
	width: 100%;
	height: auto;
	max-width: 100%;
	object-fit: contain;
	/* Sombra minima: el logo es blanco y algunos fondos tienen cielo claro. */
	filter: drop-shadow(0 1px 3px rgba(10,21,20,.55)) drop-shadow(0 0 10px rgba(10,21,20,.35));
}

/* --- Formulario de Anadir un lugar -------------------------------------

   Solo dos cosas que Elementor no expone con controles: la casilla de
   privacidad, que por defecto sale a 13 px y es incomoda en movil, y algo
   de aire entre los bloques de texto que separan las secciones.
   --------------------------------------------------------------------- */

.plh-form-lugar input[type="checkbox"] {
	width: 20px;
	height: 20px;
	min-width: 20px;
	accent-color: #03858D;
	margin-right: 4px;
}

.plh-form-lugar .elementor-field-type-acceptance label {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	line-height: 1.5;
}

.plh-form-lugar .elementor-field-type-html { width: 100%; }


/* ============================================================
   MARCA DE LAS TARJETAS DE LUGAR - 04/09
   Sustituye el rectangulo negro de .plui-card-foto cuando el lugar
   no tiene imagen destacada. Muestra logo del club o monograma.
   ============================================================ */

.plui-card-foto--marca {
	background: radial-gradient(120% 120% at 28% 18%, #0b6d74 0%, #084a52 42%, #05252c 100%);
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 16px;
	text-align: center;
}

.plui-card-foto--marca .plui-card-logo {
	display: block;
	width: auto;
	height: auto;
	max-width: 62%;
	max-height: 74%;
	object-fit: contain;
	background: #fff;
	border-radius: 16px;
	padding: 10px;
	box-shadow: 0 12px 26px -14px rgba(4, 26, 32, .8);
}

.plui-card-marca {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 10px;
	max-width: 100%;
}

.plui-card-foto--marca .plui-mono {
	background: rgba(255, 255, 255, .10);
	border: 2px solid rgba(255, 255, 255, .30);
	border-radius: 24px;
	color: #fff;
	font-weight: 800;
	letter-spacing: .01em;
}

.plui-card-tipo {
	color: rgba(255, 255, 255, .82);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: .13em;
	line-height: 1.35;
	text-transform: uppercase;
	max-width: 92%;
}

@media (max-width: 640px) {
	.plui-card-foto--marca .plui-mono { width: 76px !important; height: 76px !important; font-size: 28px !important; }
	.plui-card-tipo { font-size: 10px; letter-spacing: .10em; }
}


/* Ajuste 04/09: el logo ocupa un chip blanco de tamano estable en todas las
   tarjetas, independientemente del tamano original del archivo. */
.plui-card-foto--marca .plui-card-logo {
	width: 66% !important;
	height: 58% !important;
	max-width: 220px !important;
	max-height: 130px !important;
	min-height: 56px;
	object-fit: contain;
	background: #fff;
	border-radius: 16px;
	padding: 10px;
	box-shadow: 0 12px 26px -14px rgba(4, 26, 32, .8);
}


/* ============================================================
   CABECERA MOVIL COMPACTA - 05/09
   Hasta 767px la cabecera pasa de tres filas (243px) a dos:
   fila 1 logo + boton Anadir lugar, fila 2 los dos enlaces.
   Afecta al header global (c325d91) y al header en linea de la
   Home (faa01de). El escritorio no se toca.
   ============================================================ */

@media (max-width: 767px) {

	.elementor-element-c325d91.e-con,
	.elementor-element-faa01de.e-con {
		display: grid !important;
		grid-template-columns: auto 1fr;
		grid-template-areas:
			"logo cta"
			"nav  nav";
		align-items: center;
		row-gap: 10px;
		column-gap: 12px;
		padding: 12px 16px !important;
		border-radius: 28px !important;
	}

	.elementor-element-37c7090,
	.elementor-element-1a6eb67 {
		grid-area: logo;
		width: auto !important;
		max-width: none !important;
	}

	.elementor-element-37c7090 img,
	.elementor-element-1a6eb67 img {
		width: 104px !important;
		height: auto !important;
		display: block;
	}

	.elementor-element-9e76c15,
	.elementor-element-b90a681 {
		grid-area: cta;
		justify-self: end;
		width: auto !important;
	}

	.elementor-element-9e76c15 .elementor-button,
	.elementor-element-b90a681 .elementor-button {
		padding: 11px 18px !important;
		font-size: 14px !important;
		line-height: 1.1 !important;
	}

	.elementor-element-f787e8b.e-con,
	.elementor-element-114369e.e-con {
		grid-area: nav;
		width: 100% !important;
		max-width: none !important;
		display: flex !important;
		flex-direction: row !important;
		flex-wrap: nowrap !important;
		align-items: center !important;
		justify-content: center !important;
		gap: 8px !important;
		padding: 0 !important;
		margin: 0 !important;
	}

	.elementor-element-485e81e,
	.elementor-element-5397f3e,
	.elementor-element-bfc89c8,
	.elementor-element-41dbbdd {
		width: auto !important;
	}

	.elementor-element-485e81e .elementor-button,
	.elementor-element-5397f3e .elementor-button,
	.elementor-element-bfc89c8 .elementor-button,
	.elementor-element-41dbbdd .elementor-button {
		padding: 8px 16px !important;
		font-size: 14px !important;
		line-height: 1.1 !important;
	}
}

@media (max-width: 360px) {
	.elementor-element-37c7090 img,
	.elementor-element-1a6eb67 img { width: 92px !important; }

	.elementor-element-9e76c15 .elementor-button,
	.elementor-element-b90a681 .elementor-button { padding: 10px 14px !important; font-size: 13px !important; }

	.elementor-element-485e81e .elementor-button,
	.elementor-element-5397f3e .elementor-button,
	.elementor-element-bfc89c8 .elementor-button,
	.elementor-element-41dbbdd .elementor-button { padding: 7px 13px !important; font-size: 13px !important; }
}


/* Ajuste 05/09: que Anadir lugar no parta en dos lineas en movil. */
@media (max-width: 767px) {
	.elementor-element-9e76c15 .elementor-button,
	.elementor-element-b90a681 .elementor-button {
		white-space: nowrap !important;
		padding: 11px 16px !important;
	}
	.elementor-element-9e76c15 .elementor-button-text,
	.elementor-element-b90a681 .elementor-button-text {
		white-space: nowrap !important;
	}
	.elementor-element-485e81e .elementor-button,
	.elementor-element-5397f3e .elementor-button,
	.elementor-element-bfc89c8 .elementor-button,
	.elementor-element-41dbbdd .elementor-button {
		white-space: nowrap !important;
	}
}


/* ============================================================
   CABECERA UNICA - 05/09
   La Home ya no lleva cabecera ni pie propios: usa las plantillas
   globales como el resto de la web. Para conservar el diseno
   aprobado, en la portada la cabecera se superpone sobre la foto
   del hero en lugar de quedar sobre una banda blanca.
   ============================================================ */

body.home header.elementor-location-header {
	position: relative;
	z-index: 20;
}

body.home .elementor-element-352cad3 {
	margin-top: -121px;
	padding-top: 139px !important;
}

@media (max-width: 767px) {
	body.home .elementor-element-352cad3 {
		margin-top: -132px;
		padding-top: 146px !important;
	}
}


/* ============================================================
   TARJETAS DEL BUSCADOR - UNIFICACION VISUAL - 05/09
   El listado del mapa conserva su layout horizontal (correcto
   para un panel de resultados junto al mapa) pero comparte
   tokens, tipografia y tratamiento de marca con .plui-card.
   ============================================================ */

/* 1. Insignia de marca. El reset de Elementor (.elementor img)
      anulaba el radio y el borde del logo, de modo que el logo
      salia como un cuadrado blanco sin redondear al lado de un
      monograma redondeado. Subimos especificidad. */
.plx .plx-card .plx-card-marca img {
	width: 52px;
	height: 52px;
	object-fit: contain;
	display: block;
	background: #fff;
	padding: 5px;
	border: 1px solid var(--pl-line) !important;
	border-radius: 16px !important;
	box-shadow: 0 8px 18px -12px rgba(4, 26, 32, .55);
}

.plx .plx-card .plui-mono {
	border-radius: 16px;
	box-shadow: 0 8px 18px -12px rgba(4, 26, 32, .55);
}

/* 2. Tipografia identica a la de .plui-card */
.plx .plx-card h3 {
	margin: 3px 0 8px;
	font-size: 17px;
	line-height: 1.25;
	letter-spacing: -.01em;
	color: var(--pl-carbon);
}

.plx .plx-card-zona {
	margin: 0;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .04em;
	text-transform: uppercase;
	color: var(--pl-teal);
}

/* 3. Elevacion en hover igual que la cuadricula */
.plx .plx-card:hover,
.plx .plx-card:focus-visible {
	transform: translateY(-2px);
	box-shadow: 0 12px 28px rgba(10, 21, 20, .10);
}

@media (max-width: 900px) {
	.plx .plx-card .plx-card-marca img {
		border-radius: 14px !important;
	}
	.plx .plx-card .plui-mono {
		border-radius: 14px;
	}
}


/* ------------------------------------------------------------
   Orden de campos igual que .plui-card: zona arriba, titulo,
   luego chips.
   ------------------------------------------------------------ */
.plx .plx-card-cuerpo {
	display: flex;
	flex-direction: column;
}

.plx .plx-card-cuerpo > .plx-card-zona { order: 1; }
.plx .plx-card-cuerpo > h3            { order: 2; }
.plx .plx-card-cuerpo > .plx-chips    { order: 3; }

/* ------------------------------------------------------------
   FIX: el boton flotante "Ver el mapa" se colaba en escritorio.
   reset.css de Hello Elementor trae [type="button"]{display:inline-block},
   misma especificidad que .plx-toggle y cargado despues, asi que
   ganaba y anulaba el display:none. Subimos especificidad.
   ------------------------------------------------------------ */
.plx button.plx-toggle {
	display: none;
}

@media (max-width: 900px) {
	.plx button.plx-toggle {
		display: inline-flex;
	}
	.plx button.plx-toggle svg {
		width: 19px;
		height: 19px;
		flex: 0 0 auto;
	}
}


/* ------------------------------------------------------------
   FIX: hueco vacio en el buscador en movil.
   .plx-campo lleva flex: 1 1 320px. En escritorio el formulario
   es fila y esos 320px son ANCHO, pero por debajo de 900px pasa
   a columna y los 320px se convierten en ALTO, dejando unos
   265px de espacio muerto encima del boton Buscar.
   ------------------------------------------------------------ */
@media (max-width: 900px) {
	.plx .plx-form .plx-campo {
		flex: 0 0 auto;
	}
}


/* ------------------------------------------------------------
   FIX: el numero de resultados del buscador de la home era
   invisible. El <strong> heredaba el carbon de marca sobre el
   hero oscuro, asi que "2 lugares en Alcobendas" se leia
   " lugares en Alcobendas".
   ------------------------------------------------------------ */
.plui-buscador .plui-b-estado strong {
	color: inherit;
}


/* ============================================================
   TESELAS DEL MAPA - 09/2026
   Se dejo CARTO: cambio sus condiciones y empezo a estampar
   "API KEY REQUIRED" en las teselas servidas sin clave. Ahora
   se usan las de OpenStreetMap, que no piden clave.
   El estilo de OSM es mas saturado que el Voyager anterior, asi
   que se suaviza por CSS para que no compita con las chinchetas
   ni con la paleta de marca. Solo afecta al pintado en el
   navegador: la tesela servida no se modifica y la atribucion
   se mantiene visible.
   ============================================================ */
.plx-mapa .leaflet-tile-pane,
.plui-mapa .leaflet-tile-pane,
.plf-mapa .leaflet-tile-pane {
	filter: saturate(.35) brightness(1.1) contrast(.92);
}

/* La atribucion debe seguir legible por encima del filtro. */
.leaflet-container .leaflet-control-attribution {
	background: rgba(255, 255, 255, .82);
	font-size: 11px;
}


/* ===== PLFX COMUNIDADES · INICIO 12-09-2026 ===== */
/* Bloque «Quién juega aquí» de la ficha de lugar.
   Reutiliza los tokens y las convenciones de las demás secciones .plfx:
   tarjeta blanca, borde --pl-line, radio --pl-radio. No introduce estética
   nueva ni toca ningún otro bloque. */

.plfx-com-lista {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 14px;
}

.plfx-com {
	border: 1px solid var(--pl-line);
	border-radius: var(--pl-radio);
	background: #fff;
	padding: 16px 18px;
}

.plfx-com-cab {
	display: flex;
	align-items: center;
	gap: 14px;
}

.plfx-com-marca img,
.plfx-com-marca .plui-mono {
	width: 48px !important;
	height: 48px !important;
	object-fit: contain;
	display: block;
	background: #fff;
	border: 1px solid var(--pl-line) !important;
	border-radius: 14px !important;
	padding: 4px;
	flex: 0 0 auto;
}

.plfx-com-id {
	min-width: 0;
}

.plfx-comunidades .plfx-com-id h3 {
	margin: 0;
	font-size: 17px;
	line-height: 1.25;
	letter-spacing: -.01em;
	text-transform: none;
	color: var(--pl-carbon);
	font-weight: 700;
}

.plfx-comunidades .plfx-com-id h3 a {
	color: inherit;
	text-decoration: none;
}

.plfx-comunidades .plfx-com-id h3 a:hover {
	color: var(--pl-teal);
}

.plfx-com-chips {
	list-style: none;
	margin: 6px 0 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}

.plfx-com-chips li {
	font-size: 12px;
	color: var(--pl-muted);
	background: var(--pl-soft);
	padding: 3px 9px;
	border-radius: 999px;
}

.plfx-com-como {
	margin: 12px 0 0;
	font-size: 15px;
	line-height: 1.55;
	color: var(--pl-carbon);
}

.plfx-com-pie {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 14px;
}

.plfx-comunidades .plfx-com-pie a {
	font-size: 14px;
	font-weight: 600;
	border-radius: 999px;
	padding: 9px 16px;
	text-decoration: none !important;
	white-space: nowrap;
}

.plfx-comunidades .plfx-com-ficha {
	border: 1.5px solid var(--pl-line);
	color: var(--pl-teal) !important;
}

.plfx-comunidades .plfx-com-ficha:hover {
	border-color: var(--pl-teal);
	background: var(--pl-mint);
}

.plfx-comunidades .plfx-com-via {
	background: var(--pl-teal);
	color: #fff !important;
	border: 1.5px solid var(--pl-teal);
}

.plfx-comunidades .plfx-com-via:hover {
	background: var(--pl-teal-oscuro, #046b72);
	border-color: var(--pl-teal-oscuro, #046b72);
}

/* Si el lugar no tiene comunidades el widget no pinta nada. Sin esto el
   contenedor vacío seguiría aportando el gap de la columna. */
.plf-col-main > .plf-si-comunidades:not(:has(.plfx-comunidades)) {
	display: none !important;
}

@media (max-width: 767px) {
	.plfx-com {
		padding: 14px;
	}
	.plfx-com-pie a {
		flex: 1 1 auto;
		text-align: center;
	}
}

/* ===== PLFX COMUNIDADES · FIN 12-09-2026 ===== */


/* ===== JERARQUIA FICHA · INICIO 13-09-2026 ===== */
/* Cuatro ajustes de jerarquía sobre la ficha de lugar. No cambian la
   arquitectura ni añaden estética nueva: reducen el peso de lo accesorio
   y hacen escaneable lo que antes era un párrafo corrido. */

/* 1 · «Si vas por primera vez»: el campo pl_primera_vez pasa a escribirse
      con un salto de línea por pregunta. pre-line respeta esos saltos sin
      tocar el render, y la negrita de cada pregunta la marca el propio
      texto. De ~530 px a la mitad. */
.plfx-cj-nota p {
	white-space: pre-line;
	font-size: 15px;
	line-height: 1.5;
}

.plfx-cj-nota p strong,
.plfx-cj-nota p b {
	display: block;
	margin-top: 12px;
	color: var(--pl-yellow);
	font-weight: 700;
}

.plfx-cj-nota p strong:first-child,
.plfx-cj-nota p b:first-child {
	margin-top: 0;
}

/* 2 · Jerarquía de botones. El turquesa sólido se reserva para la acción
      principal de la instalación (Reservar). Las vías de la comunidad van
      en contorno para que no compitan con ella. */
.plfx-comunidades .plfx-com-via {
	background: transparent;
	color: var(--pl-teal) !important;
	border: 1.5px solid var(--pl-line);
}

.plfx-comunidades .plfx-com-via:hover {
	border-color: var(--pl-teal);
	background: var(--pl-mint);
}

.plfx-comunidades .plfx-com-ficha {
	border: 1.5px solid transparent;
	color: var(--pl-muted) !important;
	padding-left: 6px;
	padding-right: 6px;
}

.plfx-comunidades .plfx-com-ficha:hover {
	color: var(--pl-teal) !important;
	background: transparent;
	text-decoration: underline !important;
}

/* El chip de tipo (Escuela, Club, Asociación) manda sobre el resto. */
.plfx-com-chips .plfx-com-chip-tipo {
	background: var(--pl-mint, #e5f8f6);
	color: var(--pl-teal);
	font-weight: 700;
}

/* 3 · Contacto de la instalación: se le pone dueño bajo el título. */
.plf-contacto-cab .plf-contacto-de {
	display: block;
	margin-top: 2px;
	font-size: 13px;
	color: var(--pl-muted);
	font-weight: 500;
}

/* 4 · Fuente compacta. Una línea, y el detalle en un desplegable. */
.plfx-fuente {
	border-top: 1px solid var(--pl-line);
	padding-top: 14px;
}

.plfx-fuente .plfx-fuente-linea {
	margin: 0;
	font-size: 13px;
	color: var(--pl-muted);
}

.plfx-fuente .plfx-fuente-det {
	margin-top: 6px;
}

.plfx-fuente .plfx-fuente-det > summary {
	font-size: 13px;
	color: var(--pl-teal);
	cursor: pointer;
	display: inline-block;
	list-style: none;
}

.plfx-fuente .plfx-fuente-det > summary::-webkit-details-marker {
	display: none;
}

.plfx-fuente .plfx-fuente-det > summary::after {
	content: " ▾";
	font-size: 11px;
}

.plfx-fuente .plfx-fuente-det[open] > summary::after {
	content: " ▴";
}

.plfx-fuente .plfx-fuente-det p {
	margin: 8px 0 0;
	font-size: 13px;
	line-height: 1.55;
	color: var(--pl-muted);
}

/* El contenedor de la sección de fuente ya no necesita el fondo de tarjeta. */
.plf-si-revision {
	background: transparent !important;
}

@media (max-width: 767px) {
	.plfx-cj-nota p {
		font-size: 15px;
	}
}


/* addendum 13-09-2026 : preguntas en bloque y titular del contacto */
.plfx-cj-nota p { white-space: normal; }
.plfx-cj-nota p br { display: none; }
.plfx-cj-nota p strong:first-child { margin-top: 0; }
.plf-contacto-cab h2::after { content: " con la instalaci\00f3n"; }
.plf-si-revision:has(.plfx-fuente) { display: var(--display, flex) !important; }




/* ===== JERARQUIA FICHA · FIN 13-09-2026 ===== */

/* ===== PLFX AVISO CORRECCION · INICIO 20-09-2026 ===== */
.plfx-fuente .plfx-fuente-aviso {
	margin: 10px 0 0;
	font-size: 13px;
	line-height: 1.5;
	color: var(--pl-muted);
}
.plfx-fuente .plfx-fuente-aviso a {
	color: var(--pl-teal);
	text-decoration: underline;
	text-underline-offset: 2px;
}
.plfx-fuente .plfx-fuente-aviso a:hover { text-decoration: none; }
/* ===== PLFX AVISO CORRECCION · FIN 20-09-2026 ===== */

/* ===== PLFX WHATSAPP FLOTANTE · INICIO 21-09-2026 ===== */
.plfx-wa {
	position: fixed;
	right: 18px;
	bottom: 18px;
	z-index: 9990;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 54px;
	height: 54px;
	border-radius: 999px;
	background: #25D366;
	color: #FFFFFF;
	box-shadow: 0 6px 20px rgba(10,21,20,.28);
	transition: transform .15s ease, box-shadow .15s ease;
}
.plfx-wa:hover, .plfx-wa:focus-visible {
	color: #FFFFFF;
	transform: translateY(-2px);
	box-shadow: 0 10px 26px rgba(10,21,20,.34);
}
.plfx-wa:focus-visible { outline: 3px solid var(--pl-teal, #03858D); outline-offset: 3px; }
.plfx-wa svg { display: block; }
/* si el aviso de cookies esta abierto, el boton se aparta para no taparlo */
body:has(#cmplz-cookiebanner-container .cmplz-cookiebanner.cmplz-show) .plfx-wa {
	display: none;
}
@media (max-width: 767px) {
	.plfx-wa { right: 14px; bottom: 14px; width: 50px; height: 50px; }
}
@media print { .plfx-wa { display: none; } }
/* ===== PLFX WHATSAPP FLOTANTE · FIN 21-09-2026 ===== */

/* --- Intro editorial de zona ------------------------------------------- */
/* Cuando la zona tiene texto propio, el campo llega con sus parrafos.     */
.plz-intro p { margin: 0 0 10px; }
.plz-intro p:last-child { margin-bottom: 0; }
.plz-intro a { color: #fff; text-decoration: underline; }


/* =====================================================================
   MOVIL COMPACTO - 29/09/2026
   Cabecera en 2 filas (logo+CTA / menu+Instagram), hero y titulares mas
   pequenos, buscador con campo de 56 px y cifras en 2 filas.
   Solo afecta a <=767 px. Para revertir: borrar este bloque entero.
   ===================================================================== */
@media (max-width: 767px){
  .elementor-location-header .elementor-element-c325d91.e-con,
  .elementor-location-header .elementor-element-faa01de.e-con{grid-template-columns:auto 1fr auto!important;grid-template-rows:auto auto!important;grid-template-areas:"logo . cta" "nav nav ig"!important;gap:8px 10px!important;padding:10px 14px!important;border-radius:22px!important}
  .elementor-location-header .elementor-element-37c7090 img,
  .elementor-location-header .elementor-element-1a6eb67 img{width:76px!important}
  .elementor-location-header .elementor-element-9e76c15 .elementor-button,
  .elementor-location-header .elementor-element-b90a681 .elementor-button{padding:9px 14px!important;font-size:13px!important}
  .elementor-location-header .elementor-element-f787e8b.e-con,
  .elementor-location-header .elementor-element-114369e.e-con{justify-content:flex-start!important;gap:6px!important}
  .elementor-location-header .elementor-element-f787e8b .elementor-button,
  .elementor-location-header .elementor-element-114369e .elementor-button{padding:7px 14px!important;font-size:14px!important}
  .elementor-location-header .elementor-widget-social-icons{grid-area:ig;justify-self:end;align-self:center;width:auto!important}

  body.home .elementor-element.elementor-element-352cad3{margin-top:-90px!important;padding-top:104px!important}
  body.home .elementor-element-c1e54c7 .elementor-heading-title{font-size:12px!important;line-height:1.2!important}
  body.home .elementor-element-d76614d .elementor-heading-title{font-size:31px!important;line-height:1.1!important}
  body.home .elementor-element-497e8a5,
  body.home .elementor-element-497e8a5 p{font-size:16px!important;line-height:1.5!important}

  .plh-busc-hero .plui-b-form > input.plui-b-input{flex:0 0 auto!important;height:56px!important;min-height:56px!important;line-height:56px!important;padding:0 18px!important;font-size:15px!important}
  .plh-busc-hero .plui-b-form > button.plui-btn{flex:0 0 auto!important;height:52px!important}
  .plh-busc-hero .plui-b-form > button.plui-b-geo{flex:0 0 auto!important;height:46px!important}

  body.home [data-elementor-type="wp-page"] h2.elementor-heading-title{font-size:32px!important;line-height:1.12!important}
  body.home [data-elementor-type="wp-page"] .elementor-widget-text-editor,
  body.home [data-elementor-type="wp-page"] .elementor-widget-text-editor p{font-size:16px!important;line-height:1.55!important}
  body.home [data-elementor-type="wp-page"] > .e-con:not(.elementor-element-352cad3):not(.elementor-element-ce71acd){--padding-top:44px!important;--padding-bottom:44px!important;padding-top:44px!important;padding-bottom:44px!important}

  body.home .elementor-element-45a74db{width:100%!important;max-width:100%!important;flex:1 1 100%!important}

  body.home .elementor-element-1269389.e-con{display:grid!important;grid-template-columns:auto 1fr;align-items:center;gap:6px 10px!important}
  body.home .elementor-element-1269389 .elementor-widget{width:auto!important;margin:0!important}
  body.home .elementor-element-ce71acd.e-con{--padding-bottom:28px!important;padding-bottom:28px!important}
}
/* ===================== FIN MOVIL COMPACTO 29/09 ===================== */

/* === ENLACES DE TEXTO · 18/10 ======================================
   Los enlaces dentro de parrafos salian en negro y sin subrayado, es
   decir, identicos al texto normal. Sobre fondo claro mandan el
   turquesa oficial y el subrayado. Sobre fondo oscuro, el amarillo,
   como dice la identidad visual.
   Para revertir: borrar este bloque entero.                         */

.elementor-widget-text-editor a:not(.elementor-button):not(.plui-btn),
.plui-bloque p a:not(.elementor-button):not(.plui-btn) {
  color: #03858D;
  text-decoration: underline;
  text-underline-offset: 2px;
  text-decoration-thickness: 1px;
}

.elementor-widget-text-editor a:not(.elementor-button):not(.plui-btn):hover,
.plui-bloque p a:not(.elementor-button):not(.plui-btn):hover {
  color: #02979E;
  text-decoration-thickness: 2px;
}

/* Sobre fondo oscuro: amarillo de marca. */
.plz-intro a,
.plf-hero a:not(.elementor-button):not(.plui-btn) {
  color: #FEDA28;
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* === FIN ENLACES DE TEXTO 18/10 =================================== */