/* ═══════════════════════════════════════════════════════════════════
   CURASUR v2 — sistema editorial
   ───────────────────────────────────────────────────────────────────
   Se carga DESPUÉS de styles.css (y de propiedades.css en el catálogo).
   La primera parte redefine los tokens, así que todo lo viejo hereda la
   tipografía y la paleta nuevas sin tocarlo una por una. La segunda parte
   son los componentes de la portada, con prefijo h- para no chocar con
   las clases antiguas.

   Paleta sacada del lugar: basalto volcánico, araucaria, liquen, nieve.
   El ámbar queda reservado para precio y acción principal: si aparece en
   todas partes deja de señalar algo.
   ═══════════════════════════════════════════════════════════════════ */

:root {
  --basalto:     #17191A;
  --basalto-2:   #24282A;
  --araucaria:   #243328;
  --araucaria-2: #2F4234;
  --liquen:      #8E9B86;
  --liquen-osc:  #5F6D59;
  --nieve:       #F4F2ED;
  --papel:       #FBFAF7;
  --piedra:      #EBE7DF;
  --linea:       #DCD6CA;
  --linea-osc:   rgba(255,255,255,.15);
  --tinta:       #1B1D1C;
  --tinta-2:     #545953;
  --tinta-3:     #7D827B;
  --ambar:       #A64E10;
  --ambar-2:     #883F0C;
  --ambar-claro: #E6B679;

  --font-display: 'Fraunces', Georgia, 'Times New Roman', serif;
  --font-body:    'Instrument Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;

  /* Tokens semánticos que ya usan styles.css y propiedades.css */
  --color-primary:    var(--ambar);
  --color-primary-lt: #BD6420;
  --color-primary-dk: var(--ambar-2);
  --color-accent:     #C4843A;
  --color-nature:     var(--araucaria);
  --color-bg:         var(--nieve);
  --color-surface:    var(--papel);
  --color-surface-2:  var(--piedra);
  --color-border:     var(--linea);
  --color-text:       var(--tinta);
  --color-text-muted: var(--tinta-2);

  --ancho:  1240px;
  --margen: clamp(1.1rem, 4vw, 2.75rem);
  --ease:   cubic-bezier(.2, .7, .2, 1);
}

html { -webkit-text-size-adjust: 100%; }
body {
  font-family: var(--font-body);
  background: var(--color-bg);
  color: var(--tinta);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* Cinzel era todo mayúsculas con mucho interletrado; con una serif de
   minúsculas reales ese interletrado sobra y se ve desarmado. */
h1, h2, h3, h4,
.section-title, .logo-text, .ficha-nombre, .feature-title,
.detalle-proyecto-nombre, .proy-nombre, .card-precio {
  font-family: var(--font-display);
  font-optical-sizing: auto;
  letter-spacing: -0.01em;
}

:focus-visible { outline: 2px solid var(--ambar); outline-offset: 3px; }


/* ═══════════════════════ PORTADA ═══════════════════════ */

.h-contenedor { max-width: var(--ancho); margin: 0 auto; }

/* Aparición suave, solo si hay JS: sin JS todo queda visible */
html.js .rv { opacity: 0; transform: translateY(14px);
  transition: opacity .8s var(--ease), transform .8s var(--ease); }
html.js .rv.visible { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  html.js .rv { opacity: 1; transform: none; transition: none; }
}

.h-kicker {
  font-family: var(--font-body);
  font-size: .74rem; font-weight: 600;
  letter-spacing: .17em; text-transform: uppercase;
  color: var(--liquen-osc);
  margin: 0 0 1rem;
}

/* ── Cabecera ── */
.h-nav {
  position: fixed; inset: 0 0 auto 0; z-index: 50;
  display: flex; align-items: center; gap: 2rem;
  height: 76px; padding: 0 var(--margen);
  color: #fff;
  transition: background .35s var(--ease), color .35s var(--ease), box-shadow .35s var(--ease);
}
.h-nav.solido {
  background: rgba(251,250,247,.94);
  backdrop-filter: saturate(1.2) blur(12px);
  -webkit-backdrop-filter: saturate(1.2) blur(12px);
  color: var(--tinta);
  box-shadow: 0 1px 0 var(--linea);
}
.h-marca {
  display: flex; align-items: center; gap: .65rem;
  color: inherit; text-decoration: none; margin-right: auto;
}
.h-marca img { width: 38px; height: auto; }
.h-marca span {
  font-family: var(--font-display); font-size: 1.45rem;
  font-weight: 500; letter-spacing: -.01em;
}
.h-links { display: flex; gap: 2rem; }
.h-links a, .h-nav-cta {
  color: inherit; text-decoration: none;
  font-size: .93rem; font-weight: 500;
  opacity: .88; transition: opacity .2s;
}
.h-links a:hover { opacity: 1; }
.h-nav-cta {
  opacity: 1; padding: .6rem 1.15rem; border-radius: 999px;
  border: 1px solid currentColor;
}
.h-nav.solido .h-nav-cta { background: var(--tinta); color: var(--papel); border-color: var(--tinta); }

.h-hamburguesa {
  display: none; width: 44px; height: 44px; margin-right: -10px;
  background: none; border: 0; color: inherit; cursor: pointer;
  flex-direction: column; justify-content: center; gap: 7px; padding: 0 11px;
}
.h-hamburguesa span { display: block; height: 1.5px; background: currentColor; transition: transform .3s var(--ease); }
.h-hamburguesa.open span:first-child { transform: translateY(4.25px) rotate(45deg); }
.h-hamburguesa.open span:last-child  { transform: translateY(-4.25px) rotate(-45deg); }

.h-movil {
  position: fixed; inset: 76px 0 auto 0; z-index: 49;
  background: var(--papel); border-bottom: 1px solid var(--linea);
  display: flex; flex-direction: column; padding: .5rem var(--margen) 1.5rem;
  transform: translateY(-8px); opacity: 0; pointer-events: none;
  transition: opacity .25s, transform .25s var(--ease);
}
.h-movil.open { opacity: 1; transform: none; pointer-events: auto; }
.h-movil a {
  font-family: var(--font-display); font-size: 1.5rem; color: var(--tinta);
  text-decoration: none; padding: .8rem 0; border-bottom: 1px solid var(--linea);
}

/* ── Hero ── */
.h-hero {
  position: relative; min-height: 100svh; max-height: 1000px;
  display: grid; grid-template-rows: 1fr auto; grid-template-columns: minmax(0, 1fr);
  color: #fff; overflow: hidden; isolation: isolate;
}
.h-hero-foto {
  position: absolute; inset: 0; z-index: -2;
  background: #2a2a28 center 45% / cover no-repeat;
  background-image: url('../assets/hero-bg-1280.jpg');
  background-image: image-set(url('../assets/hero-bg-1280.webp') type('image/webp'),
                              url('../assets/hero-bg-1280.jpg')  type('image/jpeg'));
}
@media (min-width: 1400px) {
  .h-hero-foto {
    background-image: url('../assets/hero-bg-1920.jpg');
    background-image: image-set(url('../assets/hero-bg-1920.webp') type('image/webp'),
                                url('../assets/hero-bg-1920.jpg')  type('image/jpeg'));
  }
}
@media (max-width: 768px) and (orientation: portrait) {
  .h-hero-foto {
    background-image: url('../assets/hero-vert-900.jpg');
    background-image: image-set(url('../assets/hero-vert-900.webp') type('image/webp'),
                                url('../assets/hero-vert-900.jpg')  type('image/jpeg'));
    background-position: center 30%;
  }
}
/* Oscurece solo donde va el texto (izquierda y abajo): la foto respira a la derecha */
.h-hero::before {
  content: ''; position: absolute; inset: 0; z-index: -1;
  background:
    linear-gradient(90deg, rgba(14,15,15,.82) 0%, rgba(14,15,15,.55) 42%, rgba(14,15,15,.12) 75%),
    linear-gradient(0deg, rgba(14,15,15,.7) 0%, rgba(14,15,15,0) 38%);
}
.h-hero-contenido {
  align-self: end;
  width: 100%; max-width: var(--ancho); margin: 0 auto;
  padding: 140px var(--margen) 3.2rem;
}
.h-hero .h-kicker { color: rgba(255,255,255,.72); }
.h-hero h1 {
  font-size: clamp(2.7rem, 6.4vw, 5.4rem);
  font-weight: 400; line-height: 1.02; letter-spacing: -.025em;
  max-width: 13ch; margin: 0 0 1.4rem; color: #fff;
  text-wrap: balance;
}
.h-hero h1 em { font-style: italic; font-weight: 300; color: var(--ambar-claro); }
.h-hero-bajada {
  font-size: clamp(1.02rem, 1.4vw, 1.18rem); line-height: 1.6;
  max-width: 46ch; color: rgba(255,255,255,.84); margin: 0 0 2.2rem;
  text-wrap: pretty;
}

/* Buscador: la acción más útil de la página, arriba del pliegue */
.h-buscador {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; gap: .35rem;
  max-width: 640px; padding: .4rem;
  background: var(--papel); border-radius: 14px;
  box-shadow: 0 18px 50px rgba(0,0,0,.28);
}
.h-campo { display: flex; flex-direction: column; min-width: 0; padding: .55rem .95rem; border-radius: 10px; cursor: pointer; }
.h-campo + .h-campo { border-left: 1px solid var(--linea); border-radius: 0 10px 10px 0; }
.h-campo span {
  font-size: .68rem; font-weight: 600; letter-spacing: .12em;
  text-transform: uppercase; color: var(--tinta-3);
}
.h-campo select {
  appearance: none; -webkit-appearance: none;
  border: 0; background: transparent; padding: .15rem 1.2rem .1rem 0;
  font: 500 1rem var(--font-body); color: var(--tinta); cursor: pointer;
  width: 100%; min-width: 0; text-overflow: ellipsis;
  background-image: linear-gradient(45deg, transparent 50%, var(--tinta-3) 50%),
                    linear-gradient(135deg, var(--tinta-3) 50%, transparent 50%);
  background-position: right 4px center, right 0 center;
  background-size: 4px 4px; background-repeat: no-repeat;
}
.h-campo select:focus { outline: none; }
.h-campo:focus-within { background: var(--nieve); }

.h-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .6rem;
  padding: .95rem 1.6rem; border-radius: 10px; border: 1px solid transparent;
  font: 600 .95rem var(--font-body); letter-spacing: .01em;
  text-decoration: none; cursor: pointer;
  transition: background .2s, color .2s, border-color .2s, transform .2s var(--ease);
}
.h-btn--ambar { background: var(--ambar); color: #fff; }
.h-btn--ambar:hover { background: var(--ambar-2); }
.h-btn--claro { background: var(--papel); color: var(--tinta); }
.h-btn--claro:hover { background: #fff; }
.h-btn--borde { background: transparent; color: inherit; border-color: currentColor; }
.h-btn--borde:hover { background: rgba(255,255,255,.08); }
.h-btn svg { flex: none; }

.h-link-claro {
  margin-top: 1.1rem; padding: .3rem 0;
  background: none; border: 0; cursor: pointer;
  font: 500 .95rem var(--font-body); color: rgba(255,255,255,.85);
  text-decoration: underline; text-underline-offset: 5px;
  text-decoration-color: rgba(255,255,255,.35);
}
.h-link-claro:hover { color: #fff; text-decoration-color: #fff; }

/* Franja de cifras al pie de la foto */
.h-hero-datos {
  list-style: none; margin: 0; padding: 1.3rem var(--margen) 1.5rem;
  border-top: 1px solid var(--linea-osc);
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem;
  max-width: calc(var(--ancho) + 2 * var(--margen)); width: 100%; margin: 0 auto;
  font-size: .86rem; color: rgba(255,255,255,.7);
}
.h-hero-datos strong {
  display: block; font-family: var(--font-display); font-weight: 400;
  font-size: 1.55rem; color: #fff; letter-spacing: -.01em; margin-bottom: .1rem;
}

/* ── Secciones ── */
.h-seccion { padding: clamp(4.5rem, 10vw, 8rem) var(--margen); }
.h-seccion--piedra { background: var(--piedra); }
.h-cabecera {
  max-width: var(--ancho); margin: 0 auto clamp(2.2rem, 5vw, 3.6rem);
  display: flex; align-items: flex-end; justify-content: space-between; gap: 2rem;
}
.h-cabecera h2, .h-titulo {
  font-size: clamp(2.1rem, 4.4vw, 3.4rem);
  font-weight: 400; line-height: 1.06; letter-spacing: -.02em;
  margin: 0; max-width: 18ch; color: var(--tinta); text-wrap: balance;
}
.h-cabecera h2 em, .h-titulo em { font-style: italic; font-weight: 300; }
.h-link {
  flex: none; color: var(--tinta); font-weight: 600; font-size: .95rem;
  text-decoration: none; border-bottom: 1px solid var(--tinta); padding-bottom: 2px;
}
.h-link:hover { color: var(--ambar); border-color: var(--ambar); }

/* ── Destacadas ── */
.h-destacadas {
  max-width: var(--ancho); margin: 0 auto;
  display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 2.6rem 1.6rem;
}
.h-destacadas > :first-child { grid-row: span 2; }
.h-card { display: block; color: inherit; text-decoration: none; }
.h-card-foto {
  position: relative; overflow: hidden; border-radius: 10px;
  aspect-ratio: 4 / 3; background: var(--piedra);
}
/* La tarjeta grande ocupa dos filas y se adapta a su alto: la foto va
   absoluta para no aportar su altura propia (una vertical estiraba las
   filas y dejaba un hueco entre las tarjetas chicas). */
.h-destacadas > :first-child { display: flex; flex-direction: column; }
.h-destacadas > :first-child .h-card-foto { flex: 1 1 0; min-height: 0; aspect-ratio: auto; }
.h-destacadas > :first-child .h-card-foto img { position: absolute; inset: 0; }
.h-card-foto img {
  width: 100%; height: 100%; object-fit: cover; display: block;
  transition: transform 1.1s var(--ease);
}
.h-card:hover .h-card-foto img { transform: scale(1.035); }
.h-card-etiqueta {
  position: absolute; left: .8rem; top: .8rem;
  font-size: .72rem; font-weight: 600; letter-spacing: .04em;
  padding: .32rem .65rem; border-radius: 999px;
  background: rgba(251,250,247,.94); color: var(--araucaria);
}
.h-card h3 {
  font-size: 1.32rem; font-weight: 500; line-height: 1.2;
  margin: 1rem 0 .4rem; color: var(--tinta);
}
.h-destacadas > :first-child h3 { font-size: clamp(1.5rem, 2.4vw, 1.9rem); }
.h-card-linea { font-size: .92rem; color: var(--tinta-2); line-height: 1.5; }
.h-card-linea b { color: var(--ambar); font-weight: 600; }
.h-card-linea i { font-style: normal; color: var(--linea); margin: 0 .45rem; }

.h-sk { border-radius: 10px; background: linear-gradient(90deg, var(--piedra), #f1ede6, var(--piedra));
  background-size: 200% 100%; animation: hSk 1.4s infinite linear; }
@keyframes hSk { to { background-position: -200% 0; } }

/* ── Confianza ── */
.h-confianza {
  background: var(--basalto); color: var(--nieve);
  padding: clamp(4.5rem, 10vw, 8rem) var(--margen);
}
.h-confianza-grid {
  max-width: var(--ancho); margin: 0 auto;
  display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
  gap: clamp(2.5rem, 7vw, 6rem); align-items: start;
}
.h-cifra {
  font-family: var(--font-display); font-weight: 300;
  font-size: clamp(6rem, 15vw, 12rem); line-height: .85; letter-spacing: -.045em;
  color: var(--ambar-claro); margin: 0;
}
.h-cifra-texto { margin: 1.2rem 0 0; font-size: 1.05rem; color: rgba(244,242,237,.72); max-width: 26ch; }
.h-confianza .h-kicker { color: var(--liquen); }
.h-confianza h2 {
  font-size: clamp(1.9rem, 3.6vw, 2.8rem); font-weight: 400;
  line-height: 1.1; letter-spacing: -.02em; margin: 0 0 1.1rem; color: #fff; text-wrap: balance;
}
.h-confianza-bajada { color: rgba(244,242,237,.72); line-height: 1.7; margin: 0 0 2.4rem; max-width: 52ch; }
.h-garantias { margin: 0; }
.h-garantias > div {
  display: grid; grid-template-columns: 12rem minmax(0, 1fr); gap: 1.5rem;
  padding: 1.25rem 0; border-top: 1px solid var(--linea-osc);
}
.h-garantias dt { font-family: var(--font-display); font-size: 1.2rem; color: #fff; }
.h-garantias dd { margin: 0; color: rgba(244,242,237,.7); line-height: 1.65; font-size: .96rem; }

/* ── Zonas ── */
.h-zonas {
  list-style: none; margin: 0 auto; padding: 0; max-width: var(--ancho);
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 2.5rem;
}
.h-zonas li { border-top: 1px solid var(--tinta); padding-top: 1.4rem; }
.h-zona-dist {
  display: block; font-family: var(--font-display); font-style: italic; font-weight: 300;
  font-size: clamp(2.4rem, 4.6vw, 3.6rem); line-height: 1; color: var(--liquen-osc);
  margin-bottom: 1.4rem;
}
.h-zona-dist small { font-size: .9rem; font-style: normal; font-family: var(--font-body);
  font-weight: 500; letter-spacing: .02em; color: var(--tinta-3); margin-left: .35rem; }
.h-zonas h3 { font-size: 1.6rem; font-weight: 500; margin: 0 0 .7rem; }
.h-zonas p  { color: var(--tinta-2); line-height: 1.7; margin: 0; max-width: 34ch; }

/* ── Cómo comprar ── */
.h-pasos {
  list-style: none; margin: 0 auto; padding: 0; max-width: var(--ancho);
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 2.5rem;
  counter-reset: paso;
}
.h-pasos li { counter-increment: paso; position: relative; padding-top: 2.2rem; }
.h-pasos li::before {
  content: '0' counter(paso);
  position: absolute; top: 0; left: 0;
  font-family: var(--font-display); font-style: italic; font-size: 1rem; color: var(--ambar);
}
.h-pasos li::after {
  content: ''; position: absolute; top: .62rem; left: 2.2rem; right: -2.5rem;
  height: 1px; background: var(--linea);
}
.h-pasos li:last-child::after { right: 0; }
.h-pasos h3 { font-size: 1.3rem; font-weight: 500; margin: 0 0 .6rem; }
.h-pasos p  { color: var(--tinta-2); line-height: 1.7; margin: 0; font-size: .96rem; }

/* ── Preguntas: la estructura de cajas se mantiene tal cual ── */
.h-faq .faq-lista { max-width: 860px; margin: 0 auto; }
.h-faq .faq-item summary { font-family: var(--font-body); font-weight: 600; }

/* ── Contacto ── */
.h-contacto {
  background: var(--araucaria); color: var(--nieve);
  padding: clamp(4.5rem, 10vw, 7.5rem) var(--margen);
}
.h-contacto-grid {
  max-width: var(--ancho); margin: 0 auto;
  display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr);
  gap: 3rem; align-items: end;
}
.h-contacto .h-kicker { color: var(--liquen); }
.h-contacto h2 {
  font-size: clamp(2.2rem, 4.8vw, 3.8rem); font-weight: 400; line-height: 1.04;
  letter-spacing: -.02em; margin: 0 0 1.2rem; color: #fff; text-wrap: balance;
}
.h-contacto p { color: rgba(244,242,237,.75); line-height: 1.7; margin: 0; max-width: 46ch; }
.h-contacto-acciones { display: flex; flex-direction: column; gap: .8rem; }
.h-contacto-acciones .h-btn { width: 100%; padding: 1.1rem 1.5rem; font-size: 1rem; }
.h-contacto-acciones .h-btn--claro svg { color: #128C7E; }
.h-contacto-tel { font-size: .9rem; color: rgba(244,242,237,.6); text-align: center; margin-top: .3rem; }
.h-contacto-tel a { color: inherit; }

/* ── Pie ── */
.h-pie { background: var(--basalto); color: rgba(244,242,237,.6); padding: 4rem var(--margen) 2rem; font-size: .92rem; }
.h-pie-grid {
  max-width: var(--ancho); margin: 0 auto;
  display: grid; grid-template-columns: 1.6fr repeat(3, minmax(0, 1fr)); gap: 2.5rem;
  padding-bottom: 3rem; border-bottom: 1px solid var(--linea-osc);
}
.h-pie h3 { font-size: 1.45rem; font-weight: 500; color: #fff; margin: 0 0 .8rem; }
.h-pie h4 { font-family: var(--font-body); font-size: .72rem; font-weight: 600;
  letter-spacing: .15em; text-transform: uppercase; color: var(--liquen); margin: 0 0 1rem; }
.h-pie ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .6rem; }
.h-pie a { color: rgba(244,242,237,.78); text-decoration: none; }
.h-pie a:hover { color: #fff; }
.h-pie p { margin: 0; line-height: 1.7; max-width: 36ch; }
.h-pie .h-pie-legal { max-width: var(--ancho); margin: 1.6rem auto 0; font-size: .82rem; }

/* ── Responsivo ── */
@media (max-width: 1000px) {
  .h-links { display: none; }
  .h-hamburguesa { display: flex; }
  .h-nav-cta { display: none; }
  .h-destacadas { grid-template-columns: 1fr 1fr; }
  .h-destacadas > :first-child { grid-column: 1 / -1; grid-row: auto; }
  .h-destacadas > :first-child .h-card-foto { flex: none; aspect-ratio: 16 / 10; }
  .h-pasos { grid-template-columns: 1fr 1fr; }
  .h-pasos li::after { display: none; }
  .h-pie-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 720px) {
  .h-nav { height: 64px; }
  .h-movil { top: 64px; }
  .h-hero::before {
    background: linear-gradient(0deg, rgba(14,15,15,.88) 0%, rgba(14,15,15,.55) 55%, rgba(14,15,15,.2) 100%);
  }
  .h-hero-contenido { padding-top: 110px; padding-bottom: 2rem; }
  .h-buscador { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .h-buscador .h-btn { grid-column: 1 / -1; }
  .h-hero-datos { grid-template-columns: 1fr 1fr; row-gap: 1.1rem; }
  .h-cabecera { flex-direction: column; align-items: flex-start; }
  .h-destacadas { grid-template-columns: 1fr; }
  .h-confianza-grid, .h-contacto-grid { grid-template-columns: 1fr; }
  .h-garantias > div { grid-template-columns: 1fr; gap: .4rem; }
  .h-zonas { grid-template-columns: 1fr; gap: 2.5rem; }
  .h-pasos { grid-template-columns: 1fr; gap: 2rem; }
  .h-pie-grid { grid-template-columns: 1fr; }
}


/* ═══════════════════════ CATÁLOGO ═══════════════════════ */

/* Encabezado claro: la franja oscura con textura se fue junto con las
   fotos que rotaban. El título manda, no el fondo. */
.c-cabecera {
  padding: calc(76px + clamp(2.2rem, 5vw, 3.6rem)) var(--margen) clamp(1.2rem, 2.4vw, 1.8rem);
  background: var(--nieve);
}
.c-cabecera h1 {
  font-size: clamp(2.5rem, 5.6vw, 4.4rem); font-weight: 400;
  line-height: 1.03; letter-spacing: -.025em; margin: 0 0 1rem; color: var(--tinta);
}
.c-cabecera h1 em { font-style: italic; font-weight: 300; }
.c-bajada { font-size: 1.08rem; line-height: 1.6; color: var(--tinta-2); max-width: 52ch; margin: 0; }
/* En una ficha el encabezado se esconde; queda solo el aire de la cabecera fija */
.c-cabecera.detalle-activo { padding: 76px 0 0; }
.c-cabecera.detalle-activo > * { display: none; }

/* Mismo borde izquierdo que el encabezado: el ancho incluye el margen */
#main-contenido { max-width: calc(var(--ancho) + 2 * var(--margen)) !important; padding: 1rem var(--margen) 5rem !important; }

/* Tarjeta: foto grande, nombre, una línea. Sin caja alrededor. */
.proyectos-grid { gap: 2.8rem 1.6rem !important; }
.proyecto-card-big {
  background: none !important; border: 0 !important; box-shadow: none !important;
  border-radius: 0 !important; overflow: visible !important; cursor: pointer;
}
.proyecto-card-big:hover { transform: none !important; box-shadow: none !important; }
.proyecto-card-big .proy-cover {
  position: relative; overflow: hidden; border-radius: 10px;
  aspect-ratio: 4 / 3; height: auto !important; background: var(--piedra);
}
.proyecto-card-big .proy-cover img {
  width: 100%; height: 100%; object-fit: cover; display: block;
  transition: transform 1.1s var(--ease);
}
.proyecto-card-big:hover .proy-cover img { transform: scale(1.035); }
.proyecto-card-big .proy-cover-overlay { display: none; }
.proy-disponibles {
  top: .8rem !important; right: auto !important; left: .8rem !important;
  background: rgba(251,250,247,.94) !important; color: var(--araucaria) !important;
  border: 0 !important; backdrop-filter: none !important;
  font: 600 .72rem var(--font-body) !important; letter-spacing: .04em !important;
  text-transform: none !important; padding: .32rem .65rem !important;
}
.proy-disponibles::before { display: none !important; }
.proyecto-card-big .fav-btn { top: .6rem !important; right: .6rem !important; left: auto !important; }
.proy-body { padding: 1rem 0 0 !important; background: none !important; }
.proy-nombre {
  font-family: var(--font-display) !important; font-size: 1.32rem !important;
  font-weight: 500 !important; line-height: 1.2; color: var(--tinta) !important;
  letter-spacing: -.01em; margin: 0 0 .4rem;
}
.proy-linea { font-size: .92rem; color: var(--tinta-2); line-height: 1.5; margin: 0; }
.proy-linea b { color: var(--ambar); font-weight: 600; }
.proy-linea i { font-style: normal; color: var(--linea); margin: 0 .45rem; }

/* Filtros en escritorio: una sola franja, sin caja. Antes eran un panel
   alto que empujaba la primera parcela debajo del pliegue. En móvil siguen
   siendo la hoja que sube desde abajo (propiedades.css, max-width 768px). */
@media (min-width: 769px) {
  .filtros-barra {
    display: flex !important; flex-wrap: wrap; align-items: flex-end; gap: .9rem 1.4rem;
    background: none !important; border: 0 !important; box-shadow: none !important;
    padding: 1.1rem 0 !important; margin: 0 !important;
    border-top: 1px solid var(--linea) !important; border-bottom: 1px solid var(--linea) !important;
    border-radius: 0 !important;
  }
  .filtros-barra-head { display: none !important; }
  .filtros-grupos { display: flex !important; gap: .9rem !important; margin: 0 !important; flex: 0 1 auto; }
  .filtro-grupo { min-width: 170px; }
  .filtro-grupo label { font: 600 .66rem var(--font-body) !important; letter-spacing: .13em !important;
    text-transform: uppercase; color: var(--tinta-3) !important; margin-bottom: .3rem !important; }
  .filtro-select { padding: .55rem 2rem .55rem .8rem !important; font-size: .92rem !important;
    border-radius: 8px !important; border-color: var(--linea) !important; background-color: var(--papel) !important; }
  .filtro-chips-grupo { display: flex !important; flex-wrap: wrap; align-items: center; gap: .45rem !important;
    padding: 0 !important; margin: 0 !important; border: 0 !important; }
  .filtro-chips-label { display: none !important; }
  .filtro-chip-toggle { padding: .5rem .85rem !important; font: 500 .86rem var(--font-body) !important;
    border-radius: 999px !important; background: transparent !important; border: 1px solid var(--linea) !important;
    color: var(--tinta-2) !important; }
  .filtro-chip-toggle.activo { background: var(--tinta) !important; color: var(--papel) !important; border-color: var(--tinta) !important; }
  .filtros-pie { margin: 0 0 0 auto !important; padding: 0 !important; border: 0 !important; }
  .filtros-limpiar:disabled { visibility: hidden; }
}
.filtros-fila-resultado { margin: 1.2rem 0 1.6rem !important; }
.filtros-resultado { font-size: .9rem !important; color: var(--tinta-2) !important; }
.filtros-container { border-radius: 12px !important; box-shadow: none !important; }
.filtro-select, .filtro-input { font-family: var(--font-body) !important; }

/* Ficha: el nombre y el precio con la serif nueva, sin versalitas */
.ficha-nombre { font-weight: 400 !important; letter-spacing: -.02em !important; font-size: clamp(2.2rem, 4.6vw, 3.4rem) !important; }
.ficha-hechos dd { font-family: var(--font-body) !important; font-size: 1rem !important; }
.ficha-hechos .hecho--destacado dd { font-family: var(--font-display) !important; font-weight: 500 !important; }

@media (max-width: 720px) {
  .c-cabecera { padding-top: calc(64px + 2rem); }
  .c-cabecera.detalle-activo { padding-top: 64px; }
}

/* Botones de la ficha con la misma forma que los de la portada */
.btn-contactar-proyecto, .btn-solicitar-info {
  font: 600 .95rem var(--font-body) !important; letter-spacing: .01em !important;
  text-transform: none !important; border-radius: 10px !important; padding: .95rem 1.4rem !important;
}
.btn-solicitar-info { background: transparent !important; color: var(--tinta) !important; border: 1px solid var(--linea) !important; }
.btn-solicitar-info:hover { border-color: var(--tinta) !important; }
.breadcrumb, .breadcrumb button { font-family: var(--font-body) !important; }

/* Selector de moneda: no debe partirse en dos líneas */
.uf-toggle { flex-wrap: nowrap !important; white-space: nowrap; }
.uf-toggle button { font-family: var(--font-body) !important; }

@media (max-width: 600px) {
  /* De a dos las tarjetas quedaban de 160 px y el precio se partía */
  .proyectos-grid { grid-template-columns: minmax(0, 1fr) !important; gap: 2.2rem !important; }
  .uf-valor { display: none !important; }
}