/* ============================================================================
   CASA LUNA · v5 (29-sep-2026) — va DESPUÉS de v4.css y solo sobrescribe.
   Pedido de Rodrigo: fuera la tira de cifras y el carrusel de la portada; la
   galería pasa a una pantalla propia (pestaña del menú, 100 % de las fotos,
   filtro por espacio y zoom); «Incluye / llegada / reglas / cancelación»
   rediseñado; experiencias con foto; y todos los textos más legibles.
   ========================================================================== */

/* ── Legibilidad ─────────────────────────────────────────────────────────────
   Cormorant tiene la «x» baja y a 400 se ve delgada; el gris secundario tenía
   poco contraste y las etiquetas en mayúsculas iban a 300. Todo sube un punto. */
:root{--tinta-2:#3F4C42}
/* 29-sep noche (Rodrigo): sin negritas; lo que faltaba era tamaño → toda la página +10 %. */
html{font-size:110%}
.d{font-weight:400}
.ojo{font-size:.9rem;letter-spacing:.18em;color:var(--tierra)}
.bl-h3{font-size:1.1rem;font-weight:400}
.bl-lead{color:var(--tinta)}
.bl-lista{font-size:1.18rem}
.bl-espacios__grid p,.bl-faq__lista p{font-size:1.16rem;line-height:1.5}
.bl-faq__lista h3{font-size:1.4rem;font-weight:500}
.bl-cerca{font-size:1.16rem}
.bl-cifras li{font-size:1.05rem}
.bl-link{font-weight:400;font-size:.9rem}
.btn{font-weight:400}

/* ── La casa: el mosaico y las tarjetas llevan a su sección de la galería ── */
.bl-casa__mosaico a{position:relative;display:block;overflow:hidden;color:#FBFAF6;text-decoration:none}
.bl-casa__mosaico a.m0{grid-row:span 2}
.bl-casa__mosaico img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
.bl-casa__mosaico a:hover img{transform:scale(1.03)}
.bl-casa__mosaico a::after{content:"";position:absolute;inset:auto 0 0 0;height:45%;background:linear-gradient(180deg,rgba(20,30,22,0),rgba(20,30,22,.55))}
.m__pie{position:absolute;left:1.1rem;bottom:1rem;z-index:1;font-family:var(--serif);font-style:italic;font-size:1.55rem}
@media (max-width:860px){
  .bl-casa__mosaico a.m0{grid-row:auto;grid-column:span 2;aspect-ratio:4/3}
  .bl-casa__mosaico a:not(.m0){aspect-ratio:1}
}

.bl-espacios__grid a{display:flex;flex-direction:column;gap:.6rem;color:inherit;text-decoration:none}
.esp__foto{position:relative;display:block;overflow:hidden;margin-bottom:.4rem}
.bl-espacios__grid .esp__foto img{margin:0;transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
.bl-espacios__grid a:hover .esp__foto img{transform:scale(1.04)}
.esp__n{position:absolute;right:.7rem;bottom:.7rem;font-family:var(--display);font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;color:var(--tinta);background:rgba(251,250,246,.92);padding:.4rem .65rem;border-radius:2px}
.bl-espacios__grid a:hover h3{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.2em}
.bl-espacios__grid h3{font-weight:500}

/* ── Tu estancia ─────────────────────────────────────────────────────────── */
.bl-estancia{display:block;padding-block:clamp(3rem,6vw,5.5rem)}
.bl-cab--col{display:block;margin-bottom:2rem}
.bl-cab--col .bl-h2{margin:0}
.ico{flex:none;display:grid;place-items:center;width:3rem;height:3rem;border-radius:50%;background:var(--hoja);color:var(--tierra);border:1px solid var(--linea)}

.inc{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:.9rem}
.inc li{display:flex;align-items:center;gap:1rem;padding:1rem 1.1rem;background:var(--hoja);border:1px solid var(--linea);border-radius:4px;font-size:1.14rem;line-height:1.3}
.inc li .ico{background:var(--hueso)}
.inc small{display:block;font-size:.95rem;color:var(--tinta-2);margin-top:.15rem}

.horas{display:grid;grid-template-columns:auto auto 1fr;align-items:center;gap:1rem clamp(2rem,5vw,5rem);margin:clamp(2rem,4vw,3.2rem) 0 1.2rem;padding:clamp(1.4rem,3vw,2.2rem) clamp(1.4rem,3vw,2.6rem);background:var(--bosque);color:var(--hueso);border-radius:4px}
.horas .d{font-size:.85rem;color:#D3DCCF;margin:0 0 .5rem}
.horas__h{margin:0;font-size:1.2rem}
.horas__h b{display:block;font-family:var(--display);font-weight:300;font-size:clamp(2.6rem,4vw,3.4rem);line-height:1;letter-spacing:.02em}
.horas__nota{margin:0;justify-self:end;max-width:30ch;font-size:1.1rem;line-height:1.45;color:#E4E9E0;padding-left:1.4rem;border-left:1px solid rgba(243,241,232,.25)}

.estancia2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:1.2rem}
.tarjeta{background:var(--hoja);border:1px solid var(--linea);border-radius:4px;padding:clamp(1.4rem,3vw,2.4rem);display:flex;flex-direction:column;gap:1.3rem}
.tarjeta__h{font-family:var(--serif);font-weight:500;font-size:clamp(1.7rem,2.2vw,2.1rem);line-height:1.1;margin:0}
.reglas{list-style:none;margin:0;padding:0;display:grid;gap:1.1rem}
.reglas li{display:flex;gap:1rem;align-items:flex-start}
.reglas b{display:block;font-size:1.18rem;font-weight:500;line-height:1.35}
.reglas small{display:block;font-size:1.05rem;line-height:1.45;color:var(--tinta-2);margin-top:.2rem}
.reglas .ico{margin-top:-.2rem}

.tramos{display:grid;grid-template-columns:1fr 1fr;gap:.8rem}
.tramo{padding:1.1rem 1.2rem 1.2rem;border-radius:4px;border:1px solid var(--linea)}
.tramo p{margin:0;font-size:1.02rem;line-height:1.45;color:var(--tinta-2)}
.tramo .tramo__cuando{font-family:var(--display);font-size:.85rem;letter-spacing:.14em;text-transform:uppercase;color:var(--tinta)}
.tramo .tramo__cifra{font-family:var(--serif);font-weight:500;font-size:2rem;line-height:1.1;margin:.35rem 0 .6rem;color:var(--tinta)}
.tramo--si{background:#E6ECDF;border-color:#C5D2BD}
.tramo--si .tramo__cifra{color:var(--musgo)}
.tramo--no{background:#F1E7DC;border-color:#DDC9B4}
.tramo--no .tramo__cifra{color:var(--tierra)}
.bl-lista--chica{font-size:1.05rem;color:var(--tinta-2)}
.tarjeta .bl-link{align-self:flex-start}

@media (max-width:980px){
  .estancia2{grid-template-columns:1fr}
  .horas{grid-template-columns:1fr 1fr}
  .horas__nota{grid-column:1/-1;justify-self:start;padding:1rem 0 0;border-left:0;border-top:1px solid rgba(243,241,232,.25);max-width:none}
}
@media (max-width:560px){
  .tramos{grid-template-columns:1fr}
  /* En el teléfono, dos por fila con el ícono arriba: 14 renglones sueltos eran demasiado scroll. */
  .inc{grid-template-columns:1fr 1fr;gap:.6rem}
  .inc li{flex-direction:column;align-items:flex-start;gap:.6rem;padding:.9rem;font-size:1.02rem}
  .inc li .ico{width:2.5rem;height:2.5rem}
  .gal__cerrar-mas{display:none}
  .gal__titulo .d{display:none}
}

/* ── Experiencias: cada una con su foto ─────────────────────────────────── */
.bl-carta{border-top:0;gap:2.2rem 1.2rem}
.bl-carta li,.bl-carta li:not(:nth-child(4n+1)),.bl-carta li:nth-child(2n){padding:0;border:0;gap:0}
.carta__foto{display:block;aspect-ratio:4/3;overflow:hidden;background:var(--arena);margin-bottom:1rem;border-radius:3px}
.carta__foto img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
.bl-carta li:hover .carta__foto img{transform:scale(1.04)}
.carta__txt{display:flex;flex-direction:column;gap:.4rem}
.bl-carta h3{font-weight:500;font-size:1.45rem;line-height:1.2}
.carta__precio{margin:0}
.bl-carta .precio{font-family:var(--display);font-weight:400;font-size:1.3rem;letter-spacing:.04em;color:var(--tierra)}
.bl-carta .unidad{font-size:1rem;color:var(--tinta-2)}
.bl-carta p{font-size:1.1rem;line-height:1.5;color:var(--tinta-2);margin:.2rem 0 0}
.bl-nota{margin:2.2rem 0 0;font-style:normal;color:var(--tinta)}
.bl-nota p{margin:0;font-size:1.15rem}
.bl-nota .bl-nota__chica{font-size:1rem;color:var(--tinta-2);margin-top:.3rem}
@media (max-width:560px){
  .bl-carta li,.bl-carta li:nth-child(2n),.bl-carta li:not(:nth-child(4n+1)){padding:0;border:0}
}

/* ── Galería a pantalla completa ─────────────────────────────────────────── */
html.con-galeria,html.con-galeria body{overflow:hidden}
.gal{position:fixed;inset:0;z-index:80;background:var(--hueso);display:flex;flex-direction:column;opacity:0;transform:translateY(12px);transition:opacity .3s ease,transform .35s cubic-bezier(.2,.7,.2,1)}
.gal.abierta{opacity:1;transform:none}
.gal__cab{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem clamp(18px,3.2vw,56px);border-bottom:1px solid var(--linea);background:var(--hueso)}
.gal__titulo{display:flex;align-items:baseline;gap:1rem}
.gal__titulo .d{font-size:.85rem;color:var(--tierra);margin:0}
.gal__titulo h2{font-size:clamp(1.8rem,3vw,2.4rem);line-height:1;margin:0}
.gal__cerrar{display:inline-flex;align-items:center;gap:.5rem;font-family:var(--display);font-weight:400;font-size:.9rem;letter-spacing:.14em;text-transform:uppercase;padding:.7rem 1rem;border:1px solid var(--tinta);border-radius:2px}
.gal__cerrar:hover{background:var(--bosque);border-color:var(--bosque);color:var(--hueso)}
.gal__filtros{display:flex;gap:.45rem;flex-wrap:wrap;padding:.9rem clamp(18px,3.2vw,56px);border-bottom:1px solid var(--linea);background:var(--hueso)}
@media (max-width:760px){.gal__filtros{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}.gal__filtros::-webkit-scrollbar{display:none}}
.gal__filtros button{flex:none;font-family:var(--display);font-weight:400;font-size:.88rem;letter-spacing:.12em;text-transform:uppercase;padding:.55rem .95rem;border:1px solid var(--linea);border-radius:999px;color:var(--tinta);background:var(--hoja);transition:background .2s,color .2s}
.gal__filtros button:hover{border-color:var(--tinta)}
.gal__filtros button small{font-size:.78em;opacity:.65;margin-left:.15rem}
.gal__filtros button.on{background:var(--bosque);border-color:var(--bosque);color:var(--hueso)}
.gal__cuerpo{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:1.4rem clamp(18px,3.2vw,56px) 4rem}
.gal__grupo{max-width:1560px;margin:0 auto 2.6rem}
.gal__grupo h3{font-family:var(--serif);font-weight:500;font-size:clamp(1.6rem,2.2vw,2rem);margin:0 0 1rem;display:flex;align-items:baseline;gap:.8rem}
.gal__grupo h3 small{font-family:var(--display);font-weight:400;font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;color:var(--tinta-2)}
.gal__rej{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,340px),1fr));gap:10px}
.gal__rej figure{position:relative;margin:0;aspect-ratio:3/2;overflow:hidden;background:var(--arena);cursor:zoom-in}
.gal__rej img{width:100%;height:100%;object-fit:cover;transition:transform 1s cubic-bezier(.2,.7,.2,1)}
.gal__rej figure:hover img,.gal__rej figure:focus-visible img{transform:scale(1.04)}
.gal__rej figcaption{position:absolute;inset:auto 0 0 0;padding:1.6rem .9rem .7rem;font-size:1rem;line-height:1.3;color:#FBFAF6;background:linear-gradient(180deg,rgba(20,30,22,0),rgba(20,30,22,.72));opacity:0;transition:opacity .25s}
.gal__rej figure:hover figcaption,.gal__rej figure:focus-visible figcaption{opacity:1}
@media (hover:none){.gal__rej figcaption{opacity:1;font-size:.95rem}}

/* ── Visor con zoom ──────────────────────────────────────────────────────── */
.visor{z-index:100;padding:3.4rem 0 4.4rem;overflow:hidden}
.visor__lienzo{position:relative;width:100%;height:100%;display:flex;align-items:center;justify-content:center;touch-action:none;overflow:hidden}
.visor__lienzo img{max-width:calc(100% - 2rem);max-height:100%;object-fit:contain;transform-origin:center;transition:transform .25s ease;cursor:zoom-in;user-select:none;-webkit-user-select:none}
.visor.con-zoom .visor__lienzo img{cursor:grab}
.visor.con-zoom .visor__lienzo img:active{cursor:grabbing}
.visor__cerrar{z-index:2}
.visor__nav{z-index:2;padding:.9rem}
.visor__nav button{width:2.8rem;height:2.8rem}
.visor__pie{font-size:1rem;opacity:.95}
.visor__zoom{position:absolute;top:.9rem;left:1.2rem;z-index:2;display:flex;gap:.5rem}
.visor__zoom button{width:2.6rem;height:2.6rem;border:1px solid rgba(243,241,232,.5);border-radius:50%;color:var(--hueso);font-size:1.3rem;line-height:1;display:grid;place-items:center}
.visor__zoom button:hover,.visor__nav button:hover{background:rgba(243,241,232,.15)}

/* Los saltos del menú no quedan tapados por la barra fija. */
section[id]{scroll-margin-top:var(--alto-nav)}
/* El visor tapa del todo lo de atrás (encima de la galería se transparentaba). */
.visor{background:#121A14}
.carta__foto{position:relative}
.carta__credito{position:absolute;right:.45rem;bottom:.4rem;font-family:var(--display);font-size:.68rem;letter-spacing:.06em;color:#FBFAF6;background:rgba(20,30,22,.55);padding:.15rem .45rem;border-radius:2px;text-decoration:none}
.carta__credito:hover{background:rgba(20,30,22,.85)}

/* Amenidades con fotito en lugar de ícono (29-sep noche, Rodrigo). */
.inc{grid-template-columns:repeat(auto-fill,minmax(270px,1fr))}
.inc li{padding:.7rem 1rem .7rem .7rem}
.inc__foto{flex:none;width:5.2rem;height:5.2rem;border-radius:3px;overflow:hidden;background:var(--arena)}
.inc__foto img{width:100%;height:100%;object-fit:cover}
@media (max-width:560px){.inc__foto{width:100%;height:auto;aspect-ratio:4/3}.inc li{padding:.6rem .6rem .9rem}}
@media (max-width:560px){.inc{grid-template-columns:1fr 1fr}.inc li{font-size:1rem;line-height:1.25}}

/* ── Tipografía (29-sep noche, Rodrigo): títulos en Cormorant Garamond, todo lo demás en
   Crimson Pro. Las etiquetas condensadas en mayúsculas (.d) no cambian. ─────────────── */
:root{--texto:"Crimson Pro","Iowan Old Style",Georgia,serif}
body{font-family:var(--texto)}
h1,h2,h3{font-family:var(--serif)}
/* Amenidad sin foto (Wi-Fi): su ícono ocupa el mismo cuadro que las fotitos. */
.inc li .ico{width:5.2rem;height:5.2rem;border-radius:3px;background:var(--hueso)}
.inc li .ico svg{width:34px;height:34px}
@media (max-width:560px){.inc li .ico{width:100%;height:auto;aspect-ratio:4/3}}
/* Portada: arranque rápido los primeros 3 s (fundido corto). */
.portada__capas.rapida .portada__img{transition-duration:.55s}

/* ── 29-sep noche: calendario compacto (que se vea el cotizador) ─────── */
.cal__dia{aspect-ratio:auto;height:2.7rem;font-size:.92rem;gap:0}
.cal__tarifa{font-size:.58rem}
.cal__cabeza{padding:.55rem .8rem}
.cal__dow{padding:.4rem 0}
.cal__leyenda{padding:.5rem .8rem}
.reservar #calendario{max-width:27rem}
.reservar .resumen-fechas{margin:.6rem 0 .2rem}
@media (max-width:560px){.cal__dia{height:2.6rem}.reservar #calendario{max-width:none}}

/* ── Tu estancia: banda en movimiento con lo que incluye la casa ─────── */
.banda{overflow:hidden;margin:0 calc(-1 * clamp(18px,3.2vw,56px));padding:.4rem 0;border-block:1px solid var(--linea);
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.banda__pista{list-style:none;margin:0;padding:0;display:flex;width:max-content;animation:banda 60s linear infinite}
.banda:hover .banda__pista,.banda:focus-within .banda__pista{animation-play-state:paused}
.banda__pista li{display:flex;align-items:center;gap:.8rem;padding:1rem 2.2rem;border-right:1px solid var(--linea);white-space:nowrap;font-size:1.12rem;line-height:1.25}
.banda__pista .ico{flex:none;width:2.6rem;height:2.6rem;border-radius:50%;display:grid;place-items:center;background:var(--hueso);color:var(--musgo)}
.banda__pista .ico svg{width:24px;height:24px}
.banda__pista small{display:block;font-size:.88rem;color:var(--tinta-2)}
@keyframes banda{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){
  .banda{-webkit-mask-image:none;mask-image:none;margin:0}
  .banda__pista{animation:none;width:auto;flex-wrap:wrap;gap:0 1rem}
  .banda__pista li[aria-hidden]{display:none}
  .banda__pista li{border-right:0;padding:.8rem 1rem .8rem 0;white-space:normal}
}
.cotiza-caja{margin-bottom:1.8rem}
.cotiza-caja .resumen-fechas{margin-top:0}
.pagos-oficial{margin-top:.7rem}

/* ── 29-sep noche: barra más delgada (sobre todo en celular) y sin subrayado en «Menú» ── */
:root{--alto-nav:60px}
.nav{padding:.55rem var(--gutter);min-height:var(--alto-nav)}
.nav__marca{font-size:1.4rem}
.nav__links .btn{padding:.5rem 1rem}
@media (max-width:760px){:root{--alto-nav:50px}}
@media (max-width:640px){
  .nav{padding:.35rem var(--gutter)}
  .nav__marca{font-size:1.25rem}
  .nav__links .btn{padding:.42rem .8rem;font-size:.74rem}
  .nav__menu{border-bottom:0;padding:.42rem .2rem;font-size:.8rem}
}
/* Cierre más luminoso: velo ligero con degradado solo detrás del texto */
.cierre::after{background:radial-gradient(ellipse at center,rgba(20,30,22,.44) 0%,rgba(20,30,22,.16) 60%,rgba(20,30,22,.04) 100%)}
.cierre h2{text-shadow:0 2px 18px rgba(0,0,0,.35)}
.cierre img{object-position:50% 40%}

/* «Dónde está» v2 (30-sep, Rodrigo): foto de extremo a extremo y el texto
   abajo en tres columnas, para que la sección ocupe menos a lo alto. */
.bl-donde{display:block}
.bl-donde__foto{min-height:0;height:clamp(260px,40vw,560px);aspect-ratio:auto}
.bl-donde__foto img{object-position:70% 62%}
.bl-donde__texto{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,4fr) minmax(0,3fr);gap:clamp(1.5rem,4vw,4rem);padding:clamp(2rem,4vw,3.5rem) clamp(18px,3.2vw,56px)}
.bl-donde__col .bl-h4{margin-top:0}
@media (max-width:860px){.bl-donde__texto{grid-template-columns:1fr 1fr}.bl-donde__col:first-child{grid-column:1 / -1}}
@media (max-width:560px){.bl-donde__texto{grid-template-columns:1fr}}

/* «Ver más» (30-sep, Rodrigo): las listas largas enseñan solo el principio. */
.vm-cerrado > li:nth-child(n+5){display:none}
.vm-cerrado.vm-3 > li:nth-child(n+4){display:none}
.estancia2.vm-cerrado{display:none}
.vm-btn{display:block;margin:1.6rem auto 0;background:none;border:0;border-bottom:1px solid currentColor;color:inherit;cursor:pointer}
@media (max-width:560px){
  /* en celular el recorrido y la carta ya son carrusel: se ven completos */
  .bl-espacios__grid.vm-cerrado > li,.bl-carta.vm-cerrado > li{display:block}
  .vm-btn--carrusel{display:none}
}

/* iPad (16-oct, Rodrigo: «optimiza los espacios en iPad»). Entre celular y
   escritorio el calendario se quedaba en 27rem con media columna vacía, las
   cifras de la casa iban en 2×2 con huecos y las preguntas en dos columnas
   angostas. */
@media (min-width:561px) and (max-width:1200px){
  .reservar #calendario{max-width:none}
  .bl-faq{grid-template-columns:1fr}
}
@media (min-width:561px) and (max-width:860px){
  .bl-cifras{grid-template-columns:repeat(4,minmax(0,1fr))}
  .bl-lead,.reservar .nota{max-width:62ch}
}