/* Progressive disclosure: preserve existing functionality without duplicate primary actions. */
.ux-secondary-controls{margin:16px 0;border:1px solid #d7dfda;border-radius:12px;background:#fff;padding:12px 16px}
.ux-secondary-controls>summary{cursor:pointer;font-weight:650;color:#15392f;min-height:28px;line-height:28px}
.ux-secondary-controls[open]>summary{margin-bottom:14px}
.ux-secondary-controls .apartment-view-buttons{margin:8px 0;justify-content:flex-start}
.detail-main-action{flex:0 1 auto}
.detail-main-action .availability-pending{max-width:280px;font-size:13px;line-height:1.4;margin:0}
.detail-quick-summary{gap:12px;align-items:center;z-index:20}
#interest-form-slot{scroll-margin-top:150px}
.status-legend{display:none!important} /* Buttons and unit labels already name each state. */
.detail-quick-summary .detail-back{white-space:normal}
.interest-form input,.interest-form select{min-height:44px;font-size:16px}
button:focus-visible,summary:focus-visible,a:focus-visible{outline:3px solid #b17d35;outline-offset:3px}
@media(max-width:680px){
 .detail-quick-summary{display:grid!important;grid-template-columns:1fr auto;padding:12px!important}
 .detail-quick-summary>.detail-back{grid-column:1 / -1}
 .detail-quick-summary>div:first-of-type{min-width:0}
 .detail-main-action .availability-primary{min-height:44px;padding:10px 12px;font-size:13px;white-space:normal}
 .detail-main-action .availability-pending{max-width:150px;font-size:12px}
 .ux-secondary-controls{padding:12px}
 .apartment-view-buttons{flex-wrap:wrap}
}
/* Reservation-first entry: one master plan, three independent journeys. */
.hero,.intro,.guide-section,.consult-section{display:none!important}
body:not([data-focus]) .experience-section,body:not([data-focus]) .catalog-section{display:none}
body[data-focus="casas"] .experience-section,body[data-focus="apartamentos"] .experience-section{display:none}
body[data-focus] .catalog-tabs,body[data-focus] .section-header{display:none}
.map-section{padding-top:32px}
.map-shortcuts button{gap:12px;flex-wrap:wrap}
body[data-focus] [data-view-all]{display:none}
#commercial-request{padding-top:28px;padding-bottom:56px;max-width:900px}
#commercial-form{display:grid;gap:18px}
#commercial-form label{display:grid;gap:8px}
#commercial-form input:not([type="checkbox"]),#commercial-form textarea{width:100%;padding:12px;border:1px solid #a9b7ad;border-radius:8px;font:inherit;box-sizing:border-box}
#commercial-form [type="checkbox"]{width:20px;height:20px}
#commercial-form button{padding:14px;background:#15392f;color:white;border:0;border-radius:8px;font:inherit}
#commercial-form button:disabled{opacity:.6;cursor:not-allowed}
#commercial-request[hidden]{display:none}
.house-load-feedback{display:flex;gap:12px;flex-wrap:wrap;align-items:center;padding:14px;background:#edf2ed;font-size:14px}
.house-load-feedback button,.house-load-feedback a{padding:8px;color:#15392f}
.form-unit-summary{background:#edf2ed;padding:14px;border-radius:8px;font-weight:600}
#interest-form input[aria-invalid="true"]{border:2px solid #a52a2a}
@media(max-width:680px){
 #unit-dialog{max-width:100vw;width:100vw;margin:0;padding:0;max-height:100dvh}
 .detail-quick-summary{position:relative!important;top:auto!important}
 #interest-form{display:grid;grid-template-columns:1fr!important}
 #interest-form label{min-width:0}
 #interest-form input:not([type="checkbox"]){width:100%;box-sizing:border-box;font-size:16px;min-height:44px}
 button{min-height:44px}
 .house-live-render iframe{height:520px!important}
 .apartment-media-grid{grid-template-columns:1fr!important}
}
@media print{
 body>*:not(#unit-dialog){display:none!important}
 #unit-dialog{position:static!important;display:block!important;max-height:none!important;overflow:visible!important;width:100%!important;max-width:none!important}
 #unit-dialog::backdrop{display:none}
 #unit-dialog .dialog-close,#unit-dialog .apartment-typology-media,#unit-dialog .detail-quick-summary,#unit-dialog .detail-body>*:not(.detail-availability){display:none!important}
 .reservation-confirmation button{display:none}
}
.draft-close-notice{position:sticky;top:0;z-index:40;padding:20px;background:#fff6de;border:2px solid #a97926;border-radius:8px}
.draft-close-notice button{padding:12px;margin:4px;border-radius:6px}
.updated-render-gallery { margin:24px 0; padding:16px; border:1px solid #ddd; border-radius:12px; }
.updated-render-gallery summary { cursor:pointer; font-weight:600; padding:8px; }
.updated-render-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:18px; margin-top:16px; }
.updated-render-grid figure { margin:0; min-width:0; }
.updated-render-grid button { width:100%; padding:0; border:0; background:#f4f1ec; cursor:zoom-in; border-radius:8px; overflow:hidden; }
.updated-render-grid img { display:block; width:100%; height:240px; object-fit:contain; }
.updated-render-grid figcaption { margin-top:8px; }
.updated-render-grid .detail-image-disclaimer { font-size:11px; line-height:1.5; }
/* El visor de la casa ocupaba todo el ancho y 590px de alto. Dos problemas en
   uno: el raton caia siempre encima y la pagina no bajaba (eso lo arregla
   visor-casa.js), y a 1900px de ancho el recuadro era casi todo gris, porque
   el modelo se encuadra por el alto y ensanchar solo anade fondo.
   A 900x400 la casa llena el recuadro y quedan margenes a los lados por
   donde la rueda funciona como en cualquier otra parte de la pagina.
   El movil se queda como estaba: ahi se desplaza con el dedo y el visor ya
   lo permite (touch-action: pan-y). */
@media(min-width:681px){
 .house-live-render{max-width:900px;margin-inline:auto}
 .house-live-render iframe{height:400px}
}
/* El aviso que sale al clicar en la maqueta algo que no esta a la venta.
   Flota sobre la pagina en vez de colgar de la maqueta: esa tarjeta se mueve,
   se oculta y se vuelve a montar segun el foco, y el aviso acababa en un sitio
   invisible. Asi el clic nunca se queda en silencio. */
.maqueta-aviso{position:fixed;left:50%;bottom:24px;transform:translateX(-50%) translateY(8px);
 z-index:9999;max-width:min(560px,calc(100vw - 32px));margin:0;padding:14px 18px;border-radius:10px;
 background:#fff6de;border:1px solid #a97926;color:#4a3610;font-size:15px;line-height:1.45;
 box-shadow:0 10px 34px #0003;opacity:0;visibility:hidden;
 transition:opacity .18s ease,transform .18s ease,visibility 0s linear .18s}
.maqueta-aviso.visible{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0);transition-delay:0s}
@media(max-width:680px){.maqueta-aviso{bottom:12px;font-size:14px;padding:12px 14px}}
@media(prefers-reduced-motion:reduce){.maqueta-aviso{transition:none}}
/* La Torre 2, cerrada: se ve que existe y no se puede entrar.
   El <option> en gris lo pinta el navegador solo; esto es para la tarjeta de
   edificio del catalogo, que es la otra puerta de entrada a la torre. */
.building-card-cerrada{opacity:.55;cursor:not-allowed;filter:grayscale(.65)}
.building-card-cerrada:hover{transform:none;border-color:inherit}
.building-card-cerrada i{color:#6b6b6b}
/* El menú de la cabecera no llevaba a ninguna parte.
   Sus cinco enlaces apuntan a #inicio, #proyecto, #explorar y #como-consultar,
   y las cuatro secciones están ocultas por la regla de arriba desde el rediseño
   del 30-sep: «Reservation-first entry», que se quedó con un master plan y tres
   recorridos y retiró el hero, la intro y el «cómo consultar». El menú es lo
   que quedó del diseño anterior, apuntando a lo que ya no existe.
   Medido en producción: los cinco destinos devuelven display:none.
   Se retira el menú y se deja el logo, que app.js sí atiende. */
.site-header nav, .header-action { display: none !important; }
.site-header .header-inner { justify-content: flex-start; }
/* Regreso al sitio (3-nov-2026). El catálogo va en el iframe de /reservas y
   ocupa la pantalla: no había forma de volver a paseovivo.com sin el botón
   atrás del navegador. target="_top" en el HTML: abre el sitio en la ventana
   entera, no dentro del iframe. */
.pv-volver-sitio{margin-left:auto;display:inline-flex;align-items:center;gap:8px;padding:8px 16px;border:1px solid rgba(255,255,255,.7);border-radius:999px;color:#fff;font-size:13px;font-weight:700;white-space:nowrap}
.pv-volver-sitio:hover{background:#fff;color:#15392f}
.pv-volver-sitio:focus-visible{outline:2px solid #fff;outline-offset:3px}
@media(max-width:420px){.pv-volver-sitio{padding:7px 12px;font-size:12px}}
/* Tarjetas de torre con su render. La tarjeta ya traía el diseño de foto
   (imagen de fondo, degradado oscuro abajo y texto claro encima); la versión
   ilustrada lo anulaba. Aquí sólo se encuadra el edificio. */
.building-card-render img{object-position:center 30%}
/* La torre cerrada: la foto en gris, el texto legible. Ya no se apaga la
   tarjeta entera, porque sobre una foto la opacidad lo vuelve todo barro. */
.building-card-render.building-card-cerrada{opacity:1;filter:none}
.building-card-render.building-card-cerrada img{filter:grayscale(1) brightness(.8)}
.building-card-render.building-card-cerrada:hover img{transform:none}
.building-card-render.building-card-cerrada i{color:#cfd6d2;border-color:#cfd6d2}

/* ===== Carrusel de galerias (carrusel.js): N a la vez segun el panel (2 por defecto); una en movil ===== */
.pv-carrusel { margin-top:16px; outline:none; --pv-por-vista:2; --pv-alto:clamp(220px, 36vh, 400px); }
/* La altura acompana al numero de columnas: una sola, grande; tres o cuatro, mas bajas. */
.pv-carrusel[data-por-vista="1"] { --pv-alto:clamp(260px, 52vh, 520px); }
.pv-carrusel[data-por-vista="3"], .pv-carrusel[data-por-vista="4"] { --pv-alto:clamp(180px, 28vh, 320px); }
.pv-carrusel:focus-visible { outline:3px solid #15392f; outline-offset:3px; border-radius:10px; }
.pv-carrusel-escenario { position:relative; }
.pv-carrusel .updated-render-grid {
  display:flex; grid-template-columns:none; gap:12px; margin-top:0;
  overflow-x:auto; overflow-y:hidden; scroll-snap-type:x mandatory;
  scrollbar-width:none; -ms-overflow-style:none; overscroll-behavior-x:contain;
}
.pv-carrusel .updated-render-grid::-webkit-scrollbar { display:none; }
.pv-carrusel .updated-render-grid figure { flex:0 0 calc((100% - (var(--pv-por-vista) - 1) * 12px) / var(--pv-por-vista)); min-width:0; scroll-snap-align:start; scroll-snap-stop:always; }
.pv-carrusel-uno .updated-render-grid figure { flex-basis:100%; }
.pv-carrusel .updated-render-grid button { background:#f4f1ec; }
.pv-carrusel .updated-render-grid img { width:100%; height:var(--pv-alto); object-fit:contain; }
.pv-carrusel .updated-render-grid figcaption { margin-top:10px; text-align:center; }
.pv-carrusel .updated-render-grid .detail-image-disclaimer { text-align:center; margin:4px 0 0; }
.pv-carrusel-flecha {
  position:absolute; top:calc(var(--pv-alto) / 2); transform:translateY(-50%);
  width:44px; height:44px; min-width:44px; padding:0; border:0; border-radius:50%;
  background:#15392f; color:#fff; font-size:30px; line-height:1; cursor:pointer; z-index:2;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 2px 8px rgba(0,0,0,.3);
}
.pv-carrusel-flecha span { display:block; margin-top:-3px; }
.pv-carrusel-ant { left:8px; }
.pv-carrusel-sig { right:8px; }
.pv-carrusel-flecha:disabled { opacity:.35; cursor:default; }
.pv-carrusel-flecha:focus-visible, .pv-carrusel-punto:focus-visible { outline:3px solid #fff; box-shadow:0 0 0 6px #15392f; }
.pv-carrusel-contador { margin:8px 0 0; text-align:center; font-size:13px; color:#15392f; font-weight:600; }
.pv-carrusel-puntos { display:flex; flex-wrap:wrap; justify-content:center; gap:2px; margin-top:2px; }
/* area tactil de 24px con el punto visible dentro */
.pv-carrusel-punto { position:relative; width:24px; height:24px; padding:0; border:0; background:transparent; cursor:pointer; }
.pv-carrusel-punto::before { content:""; position:absolute; top:50%; left:50%; width:10px; height:10px; margin:-5px 0 0 -5px; border-radius:50%; background:#c9c4bb; transition:background .2s, transform .2s; }
.pv-carrusel-punto[hidden] { display:none; }
.pv-carrusel-quieto .pv-carrusel-flecha, .pv-carrusel-quieto .pv-carrusel-contador, .pv-carrusel-quieto .pv-carrusel-puntos { display:none; }
.pv-carrusel-punto[aria-current="true"]::before { background:#15392f; transform:scale(1.25); }
@media (prefers-reduced-motion: reduce) { .pv-carrusel-punto::before { transition:none; } }
/* Movil: la altura fija dejaba un render horizontal flotando en un cajon
   crema alto. Ahi manda la proporcion, y las flechas siguen a la imagen. */
@media (max-width: 640px) {
  .pv-carrusel-escenario { container-type:inline-size; }
  .pv-carrusel .updated-render-grid { gap:0; }
  .pv-carrusel .updated-render-grid figure { flex-basis:100%; }
  .pv-carrusel .updated-render-grid img { height:auto; aspect-ratio:16 / 10; }
  .pv-carrusel-flecha { top:calc(100cqw * 10 / 32); width:38px; height:38px; min-width:38px; min-height:38px; font-size:26px; }
}
/* ===== Estado «Vendida» (6-oct-2026): gris oscuro, distinto del rojo de Reservada ===== */
.status-badge.sold{background:#e4e7ea;color:#3b444c}
.status-badge.sold i,.availability-summary i.sold,.status-legend i.sold{background:#4f5a63}
.unit-selector-item.sold{border-left:4px solid #4f5a63;opacity:.8}
.apartment-option.sold{border-left-color:#4f5a63}
.house-map-marker.sold{background:#4f5a63}
.site-house-3d.sold{background:#d5d9dd}

/* ===== Listado del filtro: una fila por unidad (6-oct-2026) =====
   El rediseño ocultaba las tarjetas dentro de Casas y Apartamentos y el filtro
   contaba «9 unidades» sin enseñar ninguna. Vuelve, en filas compactas. */
body[data-focus="casas"] .unit-grid,body[data-focus="apartamentos"] .unit-grid{display:grid}
body[data-focus="casas"] .load-more-wrap,body[data-focus="apartamentos"] .load-more-wrap{display:block}
.unit-grid{grid-template-columns:1fr;gap:0;border:1px solid #d8e2d8;border-radius:8px;overflow:hidden;background:#fff}
.unit-row{display:flex;align-items:center;gap:8px;border-top:1px solid #e3e9e3;padding-right:14px}
.unit-row:first-child{border-top:0}
.unit-row:hover{background:#f6f8f3}
.unit-row-link{flex:1;min-width:0;display:grid;grid-template-columns:minmax(150px,1.2fr) 2fr auto auto;align-items:center;gap:16px;padding:13px 16px;color:var(--forest,#15392f);text-decoration:none}
.unit-row-link:focus-visible{outline:3px solid #15392f;outline-offset:-3px}
.unit-row-name{display:grid;gap:1px}
.unit-row-name strong{font-size:15px}
.unit-row-name small{font-size:12px;color:var(--muted,#5b665f)}
.unit-row-meta{font-size:13px;color:#3d4a42}
.unit-row .status-badge{margin:0;font-size:11px;padding:5px 10px}
.unit-row-cta{font-size:13px;font-weight:700;white-space:nowrap}
.unit-row .compare-toggle{padding:0;font-size:11px}
.result-line .solo-disponibles{display:flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:var(--forest,#15392f);cursor:pointer}
.result-line .solo-disponibles input{width:16px;height:16px;accent-color:#15392f}
@media (max-width:760px){
  .unit-row{flex-wrap:wrap;padding:0 14px 12px 0}
  .unit-row-link{grid-template-columns:1fr auto;gap:6px 12px;padding:12px 14px 4px}
  .unit-row-meta{grid-column:1/-1;order:3}
  .unit-row-cta{grid-column:1/-1;order:4}
  .unit-row .compare-toggle{margin-left:14px}
}

/* ===== Leyenda de estados en la maqueta 3D (maqueta-estados.js) ===== */
.pv-maqueta-leyenda{position:absolute;z-index:3;right:14px;top:14px;display:flex;gap:12px;padding:7px 12px;border-radius:999px;background:rgba(255,255,255,.94);box-shadow:0 2px 10px rgba(18,55,44,.15);font-size:12px;font-weight:700;color:#15392f}
.pv-maqueta-leyenda span{display:flex;align-items:center;gap:6px}
.pv-maqueta-leyenda i{width:12px;height:12px;border-radius:3px}
.pv-maqueta-leyenda i.available{background:#f3efe6;border:1px solid #b9b2a3}
.pv-maqueta-leyenda i.reserved{background:#e8141b;border:1px solid #b70f15}
.pv-maqueta-leyenda i.sold{background:rgba(79,90,99,.8);border:1px solid #4f5a63}
.pv-maqueta-leyenda .pv-maqueta-ver{margin-left:2px;padding:3px 10px;border:1px solid #15392f;border-radius:999px;background:transparent;color:#15392f;font:inherit;cursor:pointer}
.pv-maqueta-leyenda .pv-maqueta-ver:hover{background:#15392f;color:#fff}
.pv-maqueta-leyenda .pv-maqueta-ver:focus-visible{outline:2px solid #15392f;outline-offset:2px}
/* El aviso de la casa (al pasar el ratón) quedaba debajo de la barra «67 casas vinculadas…». */
.real-project-viewer .real-viewer-tooltip{bottom:58px}