/* =========================================================================
 * 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%; }