/* =========================================================
   LQS — línea visual
   Serif para titulares, rojo de acento, azul marino de marca.
   ========================================================= */

:root {
	/* Paleta de marca Lo Que Soñaste RD Real Estate */
	--lqs-ink:      #062F52;   /* azul marino profundo — cabecera, pie, fondos premium */
	--lqs-ink-deep: #09263D;   /* azul tinta — textos principales y bandas */
	--lqs-caribe:   #45AADB;   /* azul caribe — enlaces, iconos, detalles */
	--lqs-red:      #D71920;   /* rojo de marca — CTA y conversión */
	--lqs-red-dark: #B01319;
	--lqs-sky:      #EFF9FD;   /* azul hielo — fondos suaves */
	--lqs-eyebrow:  #45AADB;   /* antetítulos */
	--lqs-amber:    #D7A53C;   /* dorado arena — estados y etiquetas, con moderación */
	--lqs-ink-soft: #667B89;   /* gris azulado — textos secundarios */
	--lqs-line:     #D9E8EF;   /* borde celeste */
	--lqs-wa:       #D71920;   /* la conversión va en rojo, también WhatsApp */
	--lqs-radius:   12px;
	--lqs-serif:    "Playfair Display", Georgia, "Times New Roman", serif;

	/* ── Escala tipográfica ──────────────────────────────────────────
	   Había once tamaños distintos para cinco papeles: los títulos de
	   sección salían a 36, 38 y 32 px según el bloque, y los párrafos a
	   15, 15.5 y 14.5. Un paso de media unidad no se lee como jerarquía,
	   se lee como descuido. Estos son los únicos tamaños que existen; si
	   hace falta uno nuevo, se añade aquí y no dentro de un componente. */
	--t-portada: clamp(34px, 4.5vw, 52px);  /* h1 de la portada, y solo ahí */
	--t-d1:      clamp(28px, 3.8vw, 42px);  /* h1 de archivo y de ficha */
	--t-d2:      clamp(25px, 3.1vw, 34px);  /* título de sección */
	--t-d3:      clamp(20px, 2.1vw, 23px);  /* título de bloque o de panel */
	--t-d4:      20px;                      /* título de tarjeta */
	--t-cifra:   27px;                      /* números grandes */
	--t-lede:    17px;                      /* entradilla y texto editorial */
	--t-apoyo:   16px;                      /* párrafo de apoyo bajo un título */
	--t-cuerpo:  15px;                      /* texto de tarjeta y listas */
	--t-nota:    14px;                      /* apoyo pequeño */
	--t-menor:   13px;                      /* micro */
	--t-eti:     11.5px;                    /* etiqueta con letterspacing */
	--t-micro:   10px;                      /* microrrótulo muy espaciado */
}

/* Los titulares mandan en serif; el resto hereda la sans del tema. */
.lqs-serif,
.lqs-hero__title,
.lqs-sec__title,
.lqs-card__title,
.lqs-card__title a,
.lqs-zonecard__name,
.lqs-ctaband__title,
.lqs-pagehead__title,
.lqs-single__title,
.lqs-pitch__title,
.lqs-ft__brand,
.lqs-cookies__titulo,
.lqs-objetivo__titulo,
.lqs-hd__name {
	font-family: var(--lqs-serif);
	font-weight: 700;
	letter-spacing: -.01em;
	text-transform: none !important;
}

/* Antetítulo: la etiqueta pequeña que abre cada sección. */
.lqs-eyebrow {
	display: block;
	margin: 0 0 10px;
	font-size: var(--t-eti);
	font-weight: 700;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: var(--lqs-eyebrow);
}
.lqs-eyebrow--onDark { color: var(--lqs-caribe); }

/* ---------- Botones ---------- */
.lqs-btn--primary { background: var(--lqs-red); color: #fff; border-color: var(--lqs-red); }
.lqs-btn--primary:hover { background: var(--lqs-red-dark); border-color: var(--lqs-red-dark); opacity: 1; }
.lqs-btn--onDark { background: rgba(255, 255, 255, .14); color: #fff; border-color: rgba(255, 255, 255, .34); backdrop-filter: blur(6px); }
.lqs-btn--onDark:hover { background: rgba(255, 255, 255, .24); opacity: 1; }
.lqs-btn--pill { border-radius: 999px; padding-inline: 22px; }

/* =========================================================
   HERO
   ========================================================= */
.lqs-hero {
	position: relative;
	background: var(--lqs-ink);
	color: #fff;
	isolation: isolate;
	padding: 0 0 92px;
}
.lqs-hero__bg { position: absolute; inset: 0; z-index: -2; overflow: hidden; }
.lqs-hero__bg img { width: 100%; height: 100%; object-fit: cover; display: block; }
.lqs-hero::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	/* El velo tapa donde va el texto y se abre donde está el sujeto de la foto.
	   Del 0 al 44 % —donde viven el titular y el párrafo— no baja de .74, que
	   con una foto totalmente blanca debajo todavía deja el texto en 5.3:1;
	   así el hero aguanta cualquier imagen que suba el cliente mañana. Del
	   56 % en adelante se abre para que la familia se vea de verdad, porque es
	   la idea que sostiene la marca. */
	background: linear-gradient(100deg, rgba(6, 47, 82, .94) 0%, rgba(6, 47, 82, .90) 32%, rgba(6, 47, 82, .74) 44%, rgba(6, 47, 82, .34) 56%, rgba(6, 47, 82, .14) 74%, rgba(6, 47, 82, .10) 100%);
}
.lqs-hero__wrap {
	max-width: 1240px;
	margin-inline: auto;
	padding: 82px 22px 0;
	display: grid;
	grid-template-columns: minmax(0, 1.05fr) 350px;
	gap: 48px;
	align-items: start;
}
.lqs-hero__title {
	font-size: var(--t-portada);
	line-height: 1.1;
	margin: 0 0 18px;
	color: #fff;
	max-width: 16ch;
}
.lqs-hero__text {
	font-size: 17px;
	line-height: 1.6;
	margin: 0 0 28px;
	max-width: 52ch;
	color: rgba(255, 255, 255, .86);
}
.lqs-hero__acciones { display: flex; flex-wrap: wrap; gap: 12px; }

/* Tarjeta de búsqueda flotante */
.lqs-hero__card {
	background: #fff;
	border-radius: var(--lqs-radius);
	padding: 24px;
	box-shadow: 0 22px 60px rgba(6, 47, 82, .34);
	color: var(--lqs-ink);
}
.lqs-hero__card h2 {
	font-family: var(--lqs-serif);
	font-size: 21px;
	margin: 0 0 4px;
	color: var(--lqs-ink);
	text-transform: none;
}
.lqs-hero__card p { margin: 0 0 16px; font-size: var(--t-nota); color: var(--lqs-ink-soft); }
.lqs-hero__card .lqs-search { background: none; border: 0; padding: 0; margin: 0; }
.lqs-hero__card .lqs-search__grid { grid-template-columns: 1fr 1fr; gap: 12px; }
.lqs-hero__card .lqs-field--actions { grid-column: 1 / -1; }
.lqs-hero__card .lqs-field--actions .lqs-btn { flex: 1; }
.lqs-hero__card .lqs-btn--ghost { display: none; }

/* Barra de cifras superpuesta */
.lqs-stats--float {
	max-width: 1196px;
	margin: -70px auto 0;
	position: relative;
	z-index: 3;
	background: #fff;
	border: 0;
	border-radius: var(--lqs-radius);
	box-shadow: 0 14px 44px rgba(6, 47, 82, .13);
	grid-template-columns: repeat(4, 1fr);
	gap: 0;
	overflow: hidden;
}
.lqs-stats--float .lqs-stat { padding: 26px 28px; border-right: 1px solid var(--lqs-line); }
.lqs-stats--float .lqs-stat:last-child { border-right: 0; }
.lqs-stat__n { font-family: var(--lqs-serif); font-size: var(--t-cifra); font-weight: 700; color: var(--lqs-ink); }
.lqs-stat__l { font-size: var(--t-menor); color: var(--lqs-ink-soft); }

/* =========================================================
   ENCABEZADO DE SECCIÓN
   ========================================================= */
.lqs-sec { max-width: 1240px; margin-inline: auto; padding: 74px 22px 0; }
.lqs-sec__head {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 30px;
	margin-bottom: 28px;
}
.lqs-sec__title { font-size: var(--t-d2); line-height: 1.16; margin: 0; color: var(--lqs-ink); }
.lqs-sec__lede { margin: 0; font-size: var(--t-apoyo); color: var(--lqs-ink-soft); max-width: 54ch; }
.lqs-sec__link {
	color: var(--lqs-red);
	font-weight: 700;
	font-size: var(--t-nota);
	text-decoration: none;
	white-space: nowrap;
}
.lqs-sec__link:hover { text-decoration: underline; }

/* =========================================================
   TARJETAS DE FICHA
   ========================================================= */
.lqs-card { border-radius: var(--lqs-radius); border-color: var(--lqs-line); }
.lqs-card__media { aspect-ratio: 16 / 11; }
.lqs-card__kind {
	background: rgba(255, 255, 255, .94);
	color: var(--lqs-ink);
	font-size: 10px;
	letter-spacing: .1em;
	border-radius: 5px;
	padding: 5px 9px;
}
.lqs-card__badge {
	background: var(--lqs-amber);
	color: #2E2003;
	font-size: 10px;
	letter-spacing: .08em;
	border-radius: 5px;
	padding: 5px 9px;
}
.lqs-card__zone { font-size: var(--t-eti); letter-spacing: .12em; color: var(--lqs-ink-soft); }
.lqs-card__title { font-size: var(--t-d4); line-height: 1.28; }
.lqs-card__title a { color: var(--lqs-ink); }
.lqs-card__title a:hover { color: var(--lqs-red); }
.lqs-card__price { font-size: 18px; font-weight: 700; color: var(--lqs-ink); letter-spacing: 0; }
.lqs-specs { font-size: var(--t-menor); gap: 0; }
.lqs-specs li { padding-right: 14px; margin-right: 14px; border-right: 1px solid var(--lqs-line); }
.lqs-specs li:last-child { border-right: 0; margin-right: 0; padding-right: 0; }

/* =========================================================
   BANDA DE PROPUESTA DE VALOR
   ========================================================= */
.lqs-pitch { background: var(--lqs-sky); margin-top: 78px; padding: 76px 0; }
.lqs-pitch__wrap {
	max-width: 1240px;
	margin-inline: auto;
	padding-inline: 22px;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 60px;
	align-items: center;
}
.lqs-pitch__media { position: relative; }
.lqs-pitch__media img {
	width: 100%;
	border-radius: var(--lqs-radius);
	display: block;
	box-shadow: 0 18px 46px rgba(6, 47, 82, .16);
}
.lqs-pitch__title { font-size: var(--t-d2); line-height: 1.16; margin: 0 0 16px; color: var(--lqs-ink); }
.lqs-pitch__text { font-size: 15.5px; line-height: 1.65; color: var(--lqs-ink-soft); margin: 0 0 22px; max-width: 52ch; }
.lqs-pitch__checks {
	list-style: none;
	margin: 0 0 26px;
	padding: 0;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 10px 24px;
}
.lqs-pitch__checks li {
	position: relative;
	padding-left: 24px;
	font-size: 14.5px;
	font-weight: 600;
	color: var(--lqs-ink);
}
.lqs-pitch__checks li::before {
	content: "✓";
	position: absolute;
	left: 0;
	color: var(--lqs-red);
	font-weight: 700;
}

/* =========================================================
   TARJETAS DE ZONA CON FOTO
   ========================================================= */
.lqs-zonegrid {
	display: grid;
	/* El número de columnas viene del PHP, con las tarjetas que haya de
	   verdad. Antes era `auto-fit` y sobre los 1000 px de ancho colocaba
	   tres y mandaba la cuarta a una fila para ella sola: la versión en
	   rejilla de una viuda tipográfica. */
	grid-template-columns: repeat(var(--lqs-zonecols, 4), minmax(0, 1fr));
	gap: 20px;
}
@media (max-width: 900px) {
	.lqs-zonegrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 460px) {
	.lqs-zonegrid { grid-template-columns: minmax(0, 1fr); }
}
.lqs-zonecard {
	position: relative;
	display: block;
	aspect-ratio: 3 / 4;
	border-radius: var(--lqs-radius);
	overflow: hidden;
	text-decoration: none;
	background: var(--lqs-ink);
	isolation: isolate;
}
.lqs-zonecard img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	z-index: -2;
	transition: transform .5s ease;
}
.lqs-zonecard:hover img { transform: scale(1.06); }
.lqs-zonecard::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: linear-gradient(to top, rgba(9, 38, 61, .93) 0%, rgba(9, 38, 61, .34) 46%, rgba(9, 38, 61, .04) 100%);
}
.lqs-zonecard__body { position: absolute; inset: auto 0 0 0; padding: 20px; }
.lqs-zonecard__name { font-size: var(--t-d4); color: #fff; margin: 0 0 3px; }
.lqs-zonecard__sub { font-size: var(--t-menor); color: rgba(255, 255, 255, .78); margin: 0; }

/* =========================================================
   BANDA DE LLAMADA A LA ACCIÓN
   ========================================================= */
.lqs-ctaband {
	background: var(--lqs-ink);
	border-radius: var(--lqs-radius);
	padding: 42px 48px;
}
.lqs-ctaband__title { font-size: var(--t-d2); margin: 0 0 8px; color: #fff; }
.lqs-ctaband__text { font-size: var(--t-apoyo); color: rgba(255, 255, 255, .8); }

/* =========================================================
   CABECERA Y PIE
   ========================================================= */
.lqs-hd__top { background: var(--lqs-ink-deep); }
.lqs-hd__name { font-size: 19px; line-height: 1.1; color: var(--lqs-ink); display: block; }
.lqs-hd__sub {
	display: block;
	font-size: var(--t-micro);
	letter-spacing: .3em;
	text-transform: uppercase;
	color: var(--lqs-eyebrow);
	margin-top: 2px;
}
.lqs-hd__logo { gap: 12px; }
.lqs-hd__logo img { height: 46px; }
.lqs-nav__item.is-active > a { color: var(--lqs-red); }
.lqs-mega__head { color: var(--lqs-red); }

.lqs-ft { background: var(--lqs-ink-deep); margin-top: 0; }
.lqs-ft__brand { font-size: var(--t-d4); color: #fff; margin: 0 0 2px; }
.lqs-ft__title { color: #fff; letter-spacing: .04em; font-size: 14px; text-transform: none; font-weight: 700; }
.lqs-ft__list a:hover { color: var(--lqs-red); }
.lqs-ft__social a:hover { background: var(--lqs-red); border-color: var(--lqs-red); }

.lqs-pagehead { background: var(--lqs-ink); }
.lqs-pagehead::after { background: radial-gradient(circle, rgba(69, 170, 219, .26) 0%, transparent 68%); }
.lqs-pagehead__eyebrow { color: var(--lqs-eyebrow); letterspacing: .18em; }

.lqs-panel--cta { background: var(--lqs-ink); border-color: var(--lqs-ink); }
.lqs-page li::marker { color: var(--lqs-red); }
.lqs-chip:hover { border-color: var(--lqs-red); color: var(--lqs-red); }
.lqs-pricebox__value { font-family: var(--lqs-serif); }

/* =========================================================
   ADAPTATIVO
   ========================================================= */
@media (max-width: 980px) {
	.lqs-hero__wrap { grid-template-columns: minmax(0, 1fr); gap: 32px; padding-top: 56px; }
	.lqs-hero { padding-bottom: 70px; }
	.lqs-hero__card { max-width: 520px; }
	.lqs-stats--float { grid-template-columns: 1fr 1fr; margin-top: -50px; }
	.lqs-stats--float .lqs-stat:nth-child(2) { border-right: 0; }
	.lqs-stats--float .lqs-stat:nth-child(-n+2) { border-bottom: 1px solid var(--lqs-line); }
	.lqs-pitch__wrap { grid-template-columns: 1fr; gap: 34px; }
	.lqs-sec__head { flex-direction: column; align-items: flex-start; gap: 12px; }
}

@media (max-width: 640px) {
	.lqs-sec { padding-top: 52px; }
	.lqs-pitch { padding: 52px 0; margin-top: 52px; }
	.lqs-ctaband { padding: 30px 24px; }
	.lqs-stats--float { grid-template-columns: 1fr 1fr; }
	.lqs-pitch__checks { grid-template-columns: 1fr; }
	.lqs-hero__card { padding: 20px; }
}

/* =========================================================
   Aplicación de la paleta
   ========================================================= */
.lqs-page, .lqs-wrap { color: var(--lqs-ink-deep); }
.lqs-page a:not(.lqs-btn), .lqs-links a:hover { color: var(--lqs-caribe); }
.lqs-page :is(h2, h3, h4):not([class*="lqs-"]) { color: var(--lqs-ink); }
.lqs-breadcrumb a:hover { color: var(--lqs-caribe); }
.lqs-hd__util a:hover { color: var(--lqs-caribe); }
.lqs-mega__col li a:hover { color: var(--lqs-caribe); background: var(--lqs-sky); }
.lqs-chip:hover { border-color: var(--lqs-caribe); color: var(--lqs-caribe); background: var(--lqs-sky); }
.lqs-field select:focus, .lqs-field input:focus, .lqs-lead textarea:focus {
	outline: 2px solid var(--lqs-caribe);
	border-color: var(--lqs-caribe);
}
.lqs-search { background: var(--lqs-sky); border-color: var(--lqs-line); }
.lqs-amenities li::before { background: var(--lqs-caribe); }
.lqs-steps__n { color: var(--lqs-red); }
.lqs-steps li { background: var(--lqs-sky); border-color: var(--lqs-line); }
.lqs-table thead th { color: var(--lqs-ink-soft); }
.lqs-table tbody tr:hover { background: var(--lqs-sky); }
.lqs-table tbody th a:hover { color: var(--lqs-caribe); }
.lqs-pagination .page-numbers.current { background: var(--lqs-ink); border-color: var(--lqs-ink); }
.lqs-empty { background: var(--lqs-sky); }
.lqs-lead { background: var(--lqs-sky); border-color: var(--lqs-line); }
.lqs-hero__card .lqs-search { background: transparent; }

/* El dorado, solo en las etiquetas de estado. */
.lqs-card__badge { background: var(--lqs-amber); }

/* Marca de la cabecera y del pie */
.lqs-hd__marca { display: flex; flex-direction: column; justify-content: center; }
.lqs-ft__sub {
	margin: 0 0 16px;
	font-size: var(--t-micro);
	letter-spacing: .3em;
	text-transform: uppercase;
	color: var(--lqs-caribe);
}
.lqs-ctaband { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 24px; }
.lqs-ctaband__actions { display: flex; gap: 10px; flex-wrap: wrap; }
@media (max-width: 700px) { .lqs-hd__marca { display: none; } }

/* =========================================================
   Legibilidad del hero sobre fotos claras
   El degradado original suponía una foto oscura. Con una imagen
   brillante el texto y los botones perdían contraste.
   OJO: aquí había una segunda declaración de .lqs-hero::before que
   repetía el degradado con el velo alto hasta el borde derecho. Al ir
   después, ganaba, y dejaba la foto apagada de lado a lado —da igual lo
   que dijera la regla de arriba—. La única definición del velo está en
   .lqs-hero::before, más arriba en este mismo archivo. Lo que sí se
   mantiene aquí es el segundo velo bajo la columna de texto.
   ========================================================= */
/* Segundo velo bajo la columna de texto: garantiza el contraste
   aunque la foto tenga una zona blanca justo detrás del titular. */
.lqs-hero::after {
	content: "";
	position: absolute;
	inset: 0 40% 0 0;
	z-index: -1;
	background: linear-gradient(90deg, rgba(4, 32, 56, .55) 0%, rgba(4, 32, 56, 0) 100%);
	pointer-events: none;
}

.lqs-hero__title { color: #fff !important; text-shadow: 0 1px 24px rgba(4, 26, 45, .45); }
.lqs-hero__text  { color: rgba(255, 255, 255, .94) !important; text-shadow: 0 1px 16px rgba(4, 26, 45, .4); }
.lqs-hero .lqs-eyebrow--onDark { color: #7CC7F0 !important; }

/* Los botones del hero mandan sobre cualquier estilo del tema. */
.lqs-hero .lqs-btn--primary,
.lqs-ctaband .lqs-btn--primary,
.lqs-pitch .lqs-btn--primary {
	background: var(--lqs-red) !important;
	border-color: var(--lqs-red) !important;
	color: #fff !important;
	box-shadow: 0 6px 20px rgba(215, 25, 32, .34);
}
.lqs-hero .lqs-btn--primary:hover { background: var(--lqs-red-dark) !important; border-color: var(--lqs-red-dark) !important; }

/* El secundario pasa a ser sólido: translúcido sobre foto clara no se lee. */
.lqs-btn--onDark {
	background: #fff !important;
	color: var(--lqs-ink) !important;
	border-color: #fff !important;
	backdrop-filter: none;
	box-shadow: 0 6px 20px rgba(4, 26, 45, .22);
}
.lqs-btn--onDark:hover { background: #EFF9FD !important; border-color: #EFF9FD !important; }

/* La tarjeta de búsqueda del hero es para buscar, no para ordenar:
   el selector de orden vive en los listados, no aquí. */
.lqs-hero__card .lqs-field:has(select[name="orden"]) { display: none; }
.lqs-hero__card .lqs-search__grid { gap: 10px 12px; }
.lqs-hero__card .lqs-field select,
.lqs-hero__card .lqs-field input { min-height: 40px; padding-block: 8px; }
.lqs-hero__card .lqs-field--orden { display: none; }

/* =========================================================
   La banda de los listados no es el hero de la portada
   El hero reserva 92px abajo para que la barra de cifras se
   superponga. En los archivos no hay barra: ese aire sobra.
   ========================================================= */
/* =========================================================
   Cabecera del catálogo
   -----------------------------------------------------------------
   La banda de los listados usa ahora el mismo patrón que las páginas:
   franja a sangre de lado a lado con un wrap interior de 1240 px. Antes
   vivía dentro del contenedor, redondeada, y se cortaba a 1200 px con
   aire blanco a los lados: leía como una caja suelta, no como la
   cabecera de la página. Una sola banda en toda la web.
   ========================================================= */
.lqs-pagehead--catalogo { padding: 44px 0 46px; }
.lqs-pagehead--catalogo .lqs-pagehead__title { max-width: 22ch; }
.lqs-pagehead--catalogo .lqs-pagehead__text { max-width: 58ch; }
.lqs-pagehead--catalogo .lqs-breadcrumb { margin-bottom: 14px; }
.lqs-pagehead .lqs-breadcrumb,
.lqs-pagehead .lqs-breadcrumb a { color: rgba(255, 255, 255, .78); }
.lqs-pagehead .lqs-breadcrumb a:hover { color: #fff; }
.lqs-pagehead .lqs-zonechips { margin-top: 22px; }
.lqs-pagehead .lqs-zonechips__label { color: rgba(255, 255, 255, .72); }
.lqs-pagehead .lqs-chip {
	background: rgba(255, 255, 255, .1);
	border-color: rgba(255, 255, 255, .26);
	color: #fff;
}
.lqs-pagehead .lqs-chip:hover { background: #fff; color: var(--lqs-ink); border-color: #fff; }
.lqs-pagehead .lqs-chip__n { background: rgba(255, 255, 255, .18); color: #fff; }

/* El contenido del listado arranca justo debajo de la banda. */
.lqs-archivo { padding-top: 30px; }

/* =========================================================
   Cabecera en móvil
   El botón de asesor a texto completo no cabe junto al logo y la
   hamburguesa: desbordaba la página en horizontal. En pantallas
   estrechas se reduce a icono, sin perder el acceso a WhatsApp.
   ========================================================= */
.lqs-hd__asesorIcon { display: none; }
.lqs-hd__asesor { gap: 0; }

@media (max-width: 1080px) {
	.lqs-hd__asesorTxt { display: none; }
	.lqs-hd__asesorIcon { display: inline-flex; }
	.lqs-hd__asesor {
		width: 42px;
		height: 42px;
		padding: 0;
		border-radius: 10px;
		justify-content: center;
	}
	.lqs-hd__cta { gap: 8px; }
	.lqs-hd__main .lqs-hd__wrap { gap: 12px; }
	.lqs-hd__logo img { max-width: 150px; }
}

/* Nada puede empujar la página a lo ancho.
   Ojo: aquí NO va un max-width:100% sobre los contenedores. Al ir al final
   del archivo pisaría el max-width:1240px que los centra y la web se
   estiraría de borde a borde. El overflow-x basta. */
.lqs-shell-on { overflow-x: hidden; }

/* =========================================================
   Botones: el color del texto no lo decide el tema
   Astra pinta los enlaces del contenido con su propio color y ganaba
   por especificidad, dejando "Ver ficha" con texto oscuro sobre azul
   oscuro. Estas reglas cierran el asunto en todas las variantes.
   ========================================================= */
.lqs-btn { text-decoration: none !important; }
.lqs-btn--primary,
.lqs-btn--primary:visited { background: var(--lqs-red) !important; border-color: var(--lqs-red) !important; color: #fff !important; }
.lqs-btn--primary:hover  { background: var(--lqs-red-dark) !important; border-color: var(--lqs-red-dark) !important; color: #fff !important; }

.lqs-btn--wa,
.lqs-btn--wa:visited { background: var(--lqs-wa) !important; border-color: var(--lqs-wa) !important; color: #fff !important; }
.lqs-btn--wa:hover   { background: var(--lqs-red-dark) !important; border-color: var(--lqs-red-dark) !important; color: #fff !important; }

.lqs-btn--ghost,
.lqs-btn--ghost:visited { background: transparent !important; color: var(--lqs-ink) !important; border-color: var(--lqs-line) !important; }
.lqs-btn--ghost:hover    { border-color: var(--lqs-ink) !important; color: var(--lqs-ink) !important; }

.lqs-panel--cta .lqs-btn--ghost,
.lqs-panel--cta .lqs-btn--ghost:visited { color: #fff !important; border-color: rgba(255,255,255,.34) !important; }

.lqs-btn--onDark,
.lqs-btn--onDark:visited { background: #fff !important; color: var(--lqs-ink) !important; border-color: #fff !important; }

/* "Ver ficha" es la acción principal de cada tarjeta: azul marino sólido,
   para que el rojo quede reservado a WhatsApp y no compitan entre sí. */
.lqs-card__actions .lqs-btn--primary,
.lqs-card__actions .lqs-btn--primary:visited {
	background: var(--lqs-ink) !important;
	border-color: var(--lqs-ink) !important;
	color: #fff !important;
}
.lqs-card__actions .lqs-btn--primary:hover { background: var(--lqs-ink-deep) !important; border-color: var(--lqs-ink-deep) !important; }

/* =========================================================
   Ajustes finales de legibilidad
   ========================================================= */
/* El azul caribe es color de detalle, no de texto: sobre blanco da 2.4:1
   y no llega al mínimo legible. Los títulos van en marino. */
.lqs-card__title a,
.lqs-card__title a:visited,
.lqs-table tbody th a,
.lqs-page .lqs-card__title a { color: var(--lqs-ink) !important; }
.lqs-card__title a:hover,
.lqs-table tbody th a:hover { color: var(--lqs-red) !important; }

/* Los titulares de sección de la portada no llevan subrayado:
   ese borde es de los encabezados de las páginas de texto. */
.lqs-sec__title,
.lqs-pitch__title,
.lqs-hero__title,
.lqs-ctaband__title { border-bottom: 0 !important; padding-bottom: 0 !important; }

/* Enlaces dentro de texto: subrayado en vez de solo color, para no
   depender del azul para distinguirlos. */
.lqs-page__main a:not(.lqs-btn) { text-decoration: underline; text-underline-offset: 3px; }

/* "Ver todas" es una acción, no un enlace de texto: va en rojo de marca.
   La regla genérica de enlaces la pisaba por especificidad. */
.lqs-page .lqs-sec__link,
.lqs-sec__link,
.lqs-sec__link:visited { color: var(--lqs-red) !important; text-decoration: none !important; }
.lqs-sec__link:hover { text-decoration: underline !important; }

/* El azul caribe solo sobre fondo oscuro, donde sí contrasta. */
.lqs-ft__list a:hover,
.lqs-hd__util a:hover { color: var(--lqs-caribe) !important; }

/* =========================================================
   Ajuste de legibilidad de la paleta en texto pequeño
   Los colores de marca se mantienen intactos en fondos oscuros,
   iconos, bordes y elementos gráficos. Solo el TEXTO pequeño sobre
   blanco usa una variante un punto más oscura, porque los originales
   se quedaban por debajo del mínimo legible:
     · Gris azulado #667B89 → 4.41:1   (mínimo 4.5)
     · Azul caribe  #45AADB → 2.62:1   (mínimo 4.5)
   ========================================================= */
:root {
	/* Estos dos tonos se calcularon para cumplir 4.5:1 sobre los DOS fondos
	   claros que usa la web, el blanco y el azul hielo #EFF9FD. Sobre el hielo
	   los valores anteriores se quedaban en 4.2 y bajaban del mínimo. */
	--lqs-ink-soft: #607482;   /* 4.86:1 sobre blanco · 4.55:1 sobre hielo */
	--lqs-eyebrow:  #30789B;   /* 4.90:1 sobre blanco · 4.58:1 sobre hielo */
	--lqs-caribe:   #45AADB;   /* el caribe original sigue vivo para fondos oscuros */
	--lqs-gold:     #D7A53C;   /* dorado de marca, solo etiquetas sobre oscuro */
}
/* Sobre azul marino el caribe original sí contrasta: se recupera ahí. */
.lqs-hero .lqs-eyebrow--onDark,
.lqs-pagehead__eyebrow,
.lqs-ft__sub { color: var(--lqs-caribe) !important; }
/* El «Real Estate» de la cabecera va sobre blanco, no sobre azul marino:
   ahí el caribe original se queda en 2.6:1 y no se lee. */
.lqs-hd__sub { color: var(--lqs-eyebrow) !important; }

/* =========================================================
   Marca
   ========================================================= */
/* El logo horizontal ya trae el nombre: puede crecer y no compite
   con ningún texto al lado. */
.lqs-hd__logo img { height: 52px; max-width: 300px; }

/* El logo del pie viene ya preparado para fondo oscuro: nada de
   filtros, que aplanan el degradado y comen el azul caribe. */
.lqs-ft__logo--propio { filter: none !important; height: auto; width: 210px; max-width: 100%; margin-bottom: 18px; }

@media (max-width: 1080px) { .lqs-hd__logo img { height: 42px; max-width: 210px; } }
@media (max-width: 700px)  { .lqs-hd__logo img { height: 38px; max-width: 180px; } }

/* =========================================================
   Página no encontrada
   ========================================================= */
.lqs-404 .lqs-hero { padding-bottom: 8px; }
.lqs-404__acciones { display: flex; flex-wrap: wrap; gap: 12px; margin: 22px 0 0; }

/* =========================================================
   Aire: separación entre cajas y antes del pie
   -----------------------------------------------------------------
   Las secciones solo llevaban padding arriba, así que la última —la banda
   oscura de cierre— quedaba pegada al pie, sin un milímetro entre las dos
   franjas azules. Y los recuadros del lateral iban justos de margen interno.
   ========================================================= */
.lqs-page--front { padding-bottom: 84px; }
.lqs-page--front > .lqs-sec:last-child,
.lqs-sec:last-child { padding-bottom: 8px; }

/* Recuadros del lateral: más aire dentro y más separación entre ellos. */
.lqs-panel { padding: 26px 24px; }
.lqs-panel--cta { padding: 26px 24px 28px; }
.lqs-panel__title { margin-top: 0; }
.lqs-panel--cta p { margin-bottom: 18px; }
.lqs-panel--cta .lqs-btn--block + .lqs-btn--block { margin-top: 10px; }
.lqs-single__aside { gap: 22px; }

/* La banda de cierre también respira por dentro en pantallas medianas. */
@media (max-width: 900px) {
	.lqs-ctaband { padding: 34px 28px; }
}
@media (max-width: 640px) {
	.lqs-panel { padding: 22px 20px; }
	.lqs-page--front { padding-bottom: 60px; }
}

/* =========================================================
   ¿Qué buscas? — los cuatro caminos por los que se compra
   ========================================================= */
.lqs-objetivos__grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 20px;
}
.lqs-objetivo {
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 26px 24px 24px;
	border: 1px solid var(--lqs-line);
	border-radius: var(--lqs-radius);
	background: #fff;
	text-decoration: none;
	color: inherit;
	transition: border-color .16s, box-shadow .16s, transform .16s;
}
.lqs-objetivo:hover {
	border-color: var(--lqs-caribe);
	box-shadow: 0 10px 28px rgba(6, 47, 82, .09);
	transform: translateY(-2px);
}
.lqs-objetivo__icono {
	display: grid;
	place-items: center;
	width: 46px;
	height: 46px;
	border-radius: 12px;
	background: var(--lqs-sky);
	color: var(--lqs-ink);
	margin-bottom: 4px;
}
.lqs-objetivo__titulo {
	font-family: var(--lqs-serif);
	font-size: var(--t-d4);
	line-height: 1.25;
	margin: 0;
	color: var(--lqs-ink);
}
.lqs-objetivo__texto { margin: 0; font-size: var(--t-cuerpo); line-height: 1.55; color: var(--lqs-ink-soft); }
.lqs-objetivo__accion {
	margin-top: auto;
	padding-top: 8px;
	/* La flecha no se queda nunca sola en una línea. */
	white-space: nowrap;
	font-size: var(--t-menor);
	font-weight: 600;
	color: var(--lqs-eyebrow);
}
.lqs-objetivo:hover .lqs-objetivo__accion { color: var(--lqs-red); }

@media (max-width: 1080px) { .lqs-objetivos__grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px)  { .lqs-objetivos__grid { grid-template-columns: 1fr; } }

/* =========================================================
   Aviso de cookies
   ========================================================= */
.lqs-cookies {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 300;
	padding: 0 16px 16px;
	opacity: 0;
	transform: translateY(14px);
	transition: opacity .24s ease, transform .24s ease;
}
.lqs-cookies.is-visible { opacity: 1; transform: none; }
.lqs-cookies__caja {
	max-width: 1000px;
	margin-inline: auto;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 18px 28px;
	padding: 22px 24px;
	background: #fff;
	border: 1px solid var(--lqs-line);
	border-radius: 14px;
	box-shadow: 0 14px 44px rgba(6, 47, 82, .18);
}
.lqs-cookies__texto { flex: 1 1 420px; min-width: 0; }
.lqs-cookies__titulo {
	font-family: var(--lqs-serif);
	font-size: 18px;
	margin: 0 0 6px;
	color: var(--lqs-ink);
}
.lqs-cookies__texto p { margin: 0; font-size: 14px; line-height: 1.55; color: var(--lqs-ink-soft); }
.lqs-cookies__texto a { color: var(--lqs-eyebrow); }
/* Sin esto el panel de opciones y el botón de guardar se ven desde el primer
   momento: `display: grid` y `display: inline-flex` le ganan al `[hidden]` del
   navegador, que solo vale `display: none` a nivel de agente de usuario. */
.lqs-cookies [hidden] { display: none !important; }
.lqs-cookies__opciones { display: grid; gap: 10px; margin-top: 16px; }
.lqs-cookies__op {
	display: flex;
	gap: 10px;
	align-items: flex-start;
	font-size: var(--t-nota);
	line-height: 1.5;
	color: var(--lqs-ink-soft);
	cursor: pointer;
}
.lqs-cookies__op input { margin-top: 3px; flex: 0 0 auto; accent-color: var(--lqs-ink); }
.lqs-cookies__op strong { color: var(--lqs-ink); }
.lqs-cookies__acciones { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; flex: 0 0 auto; }
.lqs-cookies__link {
	background: none;
	border: 0;
	padding: 8px 4px;
	font: inherit;
	font-size: var(--t-nota);
	font-weight: 600;
	color: var(--lqs-eyebrow);
	text-decoration: underline;
	text-underline-offset: 3px;
	cursor: pointer;
}
.lqs-cookies__link:hover { color: var(--lqs-ink); }

@media (max-width: 720px) {
	.lqs-cookies__caja { padding: 20px; }
	.lqs-cookies__acciones { width: 100%; }
	.lqs-cookies__acciones .lqs-btn { flex: 1 1 auto; justify-content: center; }
}

/* =========================================================
   COMPOSICIÓN DEL TEXTO
   Nada de líneas finales con una palabra suelta.
   -----------------------------------------------------------------
   `balance` reparte las líneas de un titular o de un párrafo corto para
   que queden parejas; `pretty` se reserva para los párrafos largos,
   donde balance está limitado a unas pocas líneas y no aplicaría. En
   Firefox aún no funcionan, y por eso el plugin además une las dos
   últimas palabras con un espacio duro (lqs_viuda).
   ========================================================= */
.lqs-hero__title,
.lqs-sec__title,
.lqs-pitch__title,
.lqs-ctaband__title,
.lqs-pagehead__title,
.lqs-single__title,
.lqs-card__title,
.lqs-zonecard__name,
.lqs-objetivo__titulo,
.lqs-panel__title,
.lqs-ft__brand,
.lqs-empty h2,
.lqs-section > h2,
.lqs-related h2,
.lqs-page :is(h1, h2, h3, h4),
.lqs-wrap :is(h1, h2, h3, h4) {
	text-wrap: balance;
}

/* Párrafos cortos de apoyo: van bajo un título y se leen de un vistazo. */
.lqs-sec__lede,
.lqs-ctaband__text,
.lqs-pagehead__text,
.lqs-zonecard__sub,
.lqs-objetivo__texto,
.lqs-single__lede,
.lqs-hero__card p,
.lqs-empty p {
	text-wrap: balance;
}

/* Párrafos largos: `pretty` cuida la última línea sin tocar el resto. */
.lqs-pitch__text,
.lqs-prose p,
.lqs-page p:not([class*="lqs-"]),
.lqs-ft__texto,
.lqs-panel--cta p {
	text-wrap: pretty;
}
/* La entradilla del hero son tres líneas: `balance` las reparte parejas,
   que es lo que hace falta. `pretty` solo cuida la última y dejaba
   «de llaves.» colgando. */
.lqs-hero__text { text-wrap: balance; }

/* La entradilla del hero pide una medida cómoda: a todo lo ancho de la
   columna la última línea acaba siempre suelta. */
.lqs-hero__text { max-width: 50ch; }
.lqs-pitch__text { max-width: 54ch; }

/* =========================================================
   WHATSAPP
   -----------------------------------------------------------------
   El verde de WhatsApp es el color que la gente reconoce sin leer, así
   que el botón lo lleva. Lo que no lleva es texto blanco encima: blanco
   sobre #25D366 se queda en 1.98:1 y no se lee. Va tinta verde oscura,
   que da 7.08:1 y es además como pinta WhatsApp sus propias burbujas.
   El rojo de marca se reserva para la conversión propia («Hablar con un
   asesor», «Explorar propiedades»); el verde dice «esto abre WhatsApp».
   ========================================================= */
:root {
	--lqs-wa:       #25D366;
	--lqs-wa-hover: #1EBE5B;
	--lqs-wa-ink:   #06331A;
}
.lqs-btn--wa,
.lqs-btn--wa:visited {
	background: var(--lqs-wa) !important;
	border-color: var(--lqs-wa) !important;
	color: var(--lqs-wa-ink) !important;
	font-weight: 700;
	gap: 8px;
}
.lqs-btn--wa:hover,
.lqs-btn--wa:focus-visible {
	background: var(--lqs-wa-hover) !important;
	border-color: var(--lqs-wa-hover) !important;
	color: var(--lqs-wa-ink) !important;
}
/* El glifo, en máscara para que herede el color del texto. */
.lqs-btn--wa::before {
	content: "";
	flex: 0 0 auto;
	width: 17px;
	height: 17px;
	background: currentColor;
	-webkit-mask: var(--lqs-wa-glifo) center / contain no-repeat;
	mask: var(--lqs-wa-glifo) center / contain no-repeat;
}
:root {
	--lqs-wa-glifo: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12.04 2C6.58 2 2.13 6.45 2.13 11.91c0 1.75.46 3.46 1.32 4.96L2 22l5.25-1.38c1.45.79 3.08 1.21 4.79 1.21h.01c5.46 0 9.91-4.45 9.91-9.91S17.5 2 12.04 2Zm0 18.02h-.01c-1.52 0-3.01-.41-4.31-1.18l-.31-.18-3.2.84.85-3.12-.2-.32a8.2 8.2 0 0 1-1.26-4.39c0-4.54 3.7-8.23 8.24-8.23 2.2 0 4.27.86 5.83 2.42a8.18 8.18 0 0 1 2.41 5.82c0 4.54-3.7 8.34-8.04 8.34Zm4.52-6.16c-.25-.12-1.47-.72-1.69-.81-.23-.08-.39-.12-.56.13-.16.24-.64.8-.79.97-.14.16-.29.18-.54.06-.25-.12-1.05-.39-1.99-1.23-.74-.66-1.23-1.47-1.38-1.72-.14-.25-.02-.38.11-.5.11-.11.25-.29.37-.43.13-.15.17-.25.25-.41.08-.17.04-.31-.02-.43-.06-.12-.56-1.34-.76-1.84-.2-.48-.4-.42-.56-.43h-.47c-.17 0-.43.06-.66.31-.23.25-.86.84-.86 2.05s.89 2.38 1.01 2.54c.12.17 1.74 2.66 4.22 3.73.59.25 1.05.41 1.41.52.59.19 1.13.16 1.56.1.48-.07 1.47-.6 1.68-1.18.21-.58.21-1.07.14-1.18-.06-.11-.22-.17-.47-.29Z'/%3E%3C/svg%3E");
}
/* Sobre el panel azul marino el verde ya destaca: no hace falta borde. */
.lqs-panel--cta .lqs-btn--wa { border-color: var(--lqs-wa) !important; }

/* =========================================================
   Tarjeta de búsqueda del hero
   -----------------------------------------------------------------
   El titular iba a 30 px y competía con el h1 que tiene al lado; ahora
   entra en la escala como título de bloque. Y la tarjeta gana ancho
   porque a 350 px los desplegables cortaban su propio texto: se leía
   «Venta y alquile» y «Cualquier esta», que es peor que no ponerlo.
   ========================================================= */
.lqs-hero__card h2 {
	font-family: var(--lqs-serif);
	font-size: var(--t-d3);
	font-weight: 700;
	line-height: 1.2;
	margin: 0 0 8px;
	color: var(--lqs-ink);
	padding-bottom: 14px;
	border-bottom: 1px solid var(--lqs-line);
}
.lqs-hero__card .lqs-field select,
.lqs-hero__card .lqs-field input { font-size: var(--t-nota); padding: 10px 10px; }
.lqs-hero__card .lqs-field__label { font-size: 10.5px; letter-spacing: .06em; }

@media (min-width: 1081px) {
	.lqs-hero__wrap { grid-template-columns: minmax(0, 1fr) 386px; }
}

/* =========================================================
   PIE CLARO
   -----------------------------------------------------------------
   El logotipo de la marca es azul y así lo quiere el cliente. Sobre el
   azul marino no se ve —azul sobre azul—, y la salida no es reteñir el
   logo ni usar una versión en negativo: es ponerle debajo un fondo donde
   el azul funcione. El pie pasa a azul hielo y la barra legal se queda
   en marino, que sigue cerrando la página con peso.
   Todos los tonos de aquí están comprobados sobre #EFF9FD.
   ========================================================= */
.lqs-ft--claro {
	background: var(--lqs-sky);
	color: #3C5261;                     /* 7.64:1 sobre el hielo */
	border-top: 1px solid var(--lqs-line);
}
.lqs-ft--claro .lqs-ft__logo,
.lqs-ft--claro .lqs-ft__logo--propio {
	/* Ni filtros ni inversiones: el logo va con sus colores. */
	filter: none !important;
	width: 240px;
	max-width: 100%;
	height: auto;
	margin-bottom: 20px;
}
.lqs-ft--claro .lqs-ft__brand { color: var(--lqs-ink); }
.lqs-ft--claro .lqs-ft__sub { color: var(--lqs-eyebrow) !important; }
.lqs-ft--claro .lqs-ft__texto { color: #3C5261; }
.lqs-ft--claro .lqs-ft__title { color: var(--lqs-ink); }
.lqs-ft--claro .lqs-ft__list { color: #3C5261; }
.lqs-ft--claro .lqs-ft__list a { color: #3C5261; }
.lqs-ft--claro .lqs-ft__list a:hover { color: var(--lqs-red); }
.lqs-ft--claro .lqs-ft__dir { color: #3C5261; }
.lqs-ft--claro .lqs-ft__horario { color: var(--lqs-ink-soft); }   /* 4.55:1 */
.lqs-ft--claro .lqs-ft__social a {
	border-color: rgba(6, 47, 82, .22);
	color: var(--lqs-ink);
}
.lqs-ft--claro .lqs-ft__social a:hover { background: var(--lqs-ink); border-color: var(--lqs-ink); color: #fff; }
.lqs-ft--claro .lqs-ft__wa {
	color: var(--lqs-ink);
	border-color: rgba(6, 47, 82, .26);
}
.lqs-ft--claro .lqs-ft__wa:hover { background: var(--lqs-ink); border-color: var(--lqs-ink); color: #fff; }

/* La barra legal se queda oscura: cierra la página y separa lo comercial
   de lo administrativo. */
.lqs-ft--claro .lqs-ft__legal {
	background: var(--lqs-ink);
	color: rgba(255, 255, 255, .76);
	border-top: 0;
}
.lqs-ft--claro .lqs-ft__legales a { color: rgba(255, 255, 255, .76); }
.lqs-ft--claro .lqs-ft__legales a:hover { color: #fff; }
.lqs-ft--claro .lqs-ft__legal a { color: var(--lqs-gold); }

@media (max-width: 700px) {
	.lqs-ft--claro .lqs-ft__logo,
	.lqs-ft--claro .lqs-ft__logo--propio { width: 200px; }
}

/* Sobre la banda azul marino el verde ya destaca solo: se le quita el borde
   para que no se lea como una pastilla pegada encima. */
.lqs-ctaband .lqs-btn--wa { border-color: var(--lqs-wa) !important; }