.mg-room-video-layer{position:fixed;inset:0;z-index:10;pointer-events:none;overflow:hidden;background:transparent;}
.mg-room-video-layer[hidden]{display:none;}
.mg-room-video-layer canvas{position:absolute;inset:0;display:block;width:100%;height:100%;pointer-events:none;}
.mg-room-video-layer::before,.mg-room-video-layer::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:1;}
.mg-room-video-layer::before,.mgc-cine #inicio .mgc-fons::after{background:linear-gradient(90deg,rgba(244,239,228,.68),rgba(244,239,228,.30) 44%,transparent 76%);box-shadow:none;}
.mg-room-video-layer::before{opacity:var(--hero-light,1);}
.mg-room-video-layer::after{background:linear-gradient(90deg,rgba(20,17,14,.44),rgba(20,17,14,.16) 45%,transparent 78%);opacity:var(--room-shade,0);}
.mgc-cine #inicio .mgc-fons{background:url('facade-aligned-v3.jpg') center/cover no-repeat;}
.mgc-cine #inicio .mgc-fons img{visibility:hidden;}
.mgc-cine #inicio,.mgc-cine #vende{min-height:160svh;}
.mgc-cine #inicio .mgc-escenari{opacity:var(--camera-hero,calc(1 - var(--sortida,0)));}
.mgc-cine #vende .mgc-escenari{opacity:var(--camera-entrance,calc((1 - var(--sortida,0))*var(--entrada,1)));}
.mgc-cine #buscador .mgc-escenari{opacity:var(--camera-living,calc((1 - var(--sortida,0))*var(--entrada,1)));}
.mgc-cine #inicio .mgc-escenari:focus-within,.mgc-cine #vende .mgc-escenari:focus-within,.mgc-cine #buscador .mgc-escenari:focus-within{opacity:1;}
/* Móvil: velo crema suave para que se vea la fachada (era .72→.40; Alex, 2026-09-21: .40→.08). */
@media(max-width:767px){.mg-room-video-layer::before,.mgc-cine #inicio .mgc-fons::after{background:linear-gradient(90deg,rgba(244,239,228,.40),rgba(244,239,228,.08));}.mg-room-video-layer::after{background:linear-gradient(90deg,rgba(20,17,14,.42),rgba(20,17,14,.22));}}
@media(prefers-reduced-motion:reduce){.mg-room-video-layer{display:none!important;}}

/* These scenes already fade with the camera; avoid a second delayed text animation. */
.mgc-cine :is(#inicio,#vende,#buscador) .mgc-text > *{transition:none;transform:none;opacity:1;}

/* A shallower photographic window reveals more width on portrait screens. */
@media(max-width:767px){
 .mg-room-video-layer{background:#29251e;}
 .mg-room-video-layer canvas{top:12%;height:76%;mask-image:linear-gradient(to bottom,transparent,#000 8%,#000 90%,transparent);}
 .mg-room-video-layer::before{background:linear-gradient(90deg,rgba(244,239,228,.40),rgba(244,239,228,.08));}
 .mgc-cine #inicio .mgc-fons{background-color:#29251e;background-size:auto 76svh;background-position:center;background-repeat:no-repeat;}
 .mgc-cine .mgc-fons img{height:76%;top:12%;object-fit:cover;mask-image:linear-gradient(to bottom,transparent,#000 8%,#000 90%,transparent);}
 .mgc-cine .mgc-fons{background-color:#29251e;}
}

/* «Pausar movimiento» quita .mgc-cine y la portada volvía a su recorte original con el velo
   crema antiguo, mucho más espeso. En pausa se ve igual que en movimiento: misma foto, mismo
   encuadre y mismo velo (Alex, 2026-09-21). Las demás estancias ya tienen sus fotos fijas. */
.mgc-pausat #inicio .mgc-fons{background:url('facade-aligned-v3.jpg') center/cover no-repeat;}
.mgc-pausat #inicio .mgc-fons img{visibility:hidden;}
.mgc-pausat #inicio .mgc-fons::after{background:linear-gradient(90deg,rgba(244,239,228,.68),rgba(244,239,228,.30) 44%,transparent 76%);box-shadow:none;}
@media(max-width:767px){
 .mgc-pausat #inicio .mgc-fons{background-color:#29251e;background-size:auto 76svh;background-position:center;background-repeat:no-repeat;}
 .mgc-pausat #inicio .mgc-fons::after{background:linear-gradient(90deg,rgba(244,239,228,.40),rgba(244,239,228,.08));}
 /* El mismo fundido de bordes que la máscara del lienzo en movimiento (12 %–18 % y 80 %–88 %). */
 .mgc-pausat #inicio .mgc-fons::before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(to bottom,#29251e 12%,rgba(41,37,30,0) 18%,rgba(41,37,30,0) 80.4%,#29251e 88%);}
}

/* Reading contrast is now local to the text, leaving the tour photograph clear. */
.mg-room-video-layer::before,.mgc-cine #inicio .mgc-fons::after,.mgc-pausat #inicio .mgc-fons::after{background:linear-gradient(90deg,rgba(244,239,228,.18),rgba(244,239,228,.06) 44%,transparent 76%);}
.mg-room-video-layer::after{background:linear-gradient(90deg,rgba(20,17,14,.10),transparent 78%);}

/* Portrait facade: feather into warm daylight instead of a black vignette.
   Preserve the camera crop and canvas size to keep the doorway aligned. */
@media(max-width:767px){
 .mg-room-video-layer{background:#f4efe4;}
 .mgc-cine #inicio .mgc-fons,.mgc-pausat #inicio .mgc-fons{background-color:#f4efe4;}
 .mgc-pausat #inicio .mgc-fons::before{background:linear-gradient(to bottom,#f4efe4 12%,rgba(244,239,228,0) 18%,rgba(244,239,228,0) 80.4%,#f4efe4 88%);}
}

/* Scroll más fluido (Alex, 2026-09-24). Mientras el lienzo opaco de room-video.js tapa la
   pantalla, las fotos de fachada, entrada y salón de debajo no se ven: no se pintan.
   !important porque portada-cinematica.js pone la visibilidad en línea en cada fotograma. */
.mg-camara-plena :is(#inicio,#vende,#buscador) .mgc-fons{visibility:hidden!important;}

/* Pausa (2026-09-24): el fondo de la fachada mide una pantalla, igual que el lienzo en movimiento.
   Medía toda la sección, que en pantallas bajas (360x740) es más alta que la pantalla, y la foto
   salía 35 px más abajo que en movimiento. */
.mgc-pausat #inicio{background-color:#f4efe4;}
.mgc-pausat #inicio .mgc-fons{bottom:auto;height:100svh;}
/* El halo claro del texto de la portada (inset -64px, header-hover.css) sobresalía por la derecha
   y ensanchaba la página en tablets: a 768 px la portada medía 794. Se recorta sin tocar el halo;
   clip no crea contenedor de scroll, así que el texto pegajoso sigue funcionando. */
body.mgc-pagina #inicio{overflow-x:clip;}

/* Unified tour timeline: the same frames drive all six rooms, without a second text delay. */
.mgc-cine.mg-tour-ready .mgc-capitol .mgc-escenari{opacity:var(--tour-copy,0)!important;}
.mgc-cine.mg-tour-ready .mgc-capitol .mgc-escenari:focus-within{opacity:1!important;}
.mg-tour-ready .mgc-capitol .mgc-fons{visibility:hidden!important;}
.mgc-cine.mg-tour-ready .mgc-text > *{transition:none;transform:none;opacity:1;}
/* Keep scene geometry and camera on the same mobile viewport while Safari's
   address bar changes height. Recalculate when width or orientation changes. */
@media(max-width:767px){
 .mgc-cine .mgc-capitol{min-height:calc(var(--mg-tour-vh,1svh)*125);padding-bottom:calc(var(--mg-tour-vh,1svh)*25);}
 .mgc-cine #inicio,.mgc-cine #vende{min-height:calc(var(--mg-tour-vh,1svh)*160);}
 .mgc-cine .mgc-capitol:last-child{min-height:calc(var(--mg-tour-vh,1svh)*100);padding-bottom:0;}
 .mgc-cine .mgc-escenari{min-height:calc(var(--mg-tour-vh,1svh)*100);}
}

/* Use the active timeline, not stale legacy camera state, to enable room links. */
.mgc-cine.mg-tour-ready .mgc-capitol .mgc-text{pointer-events:var(--tour-hit,auto);}
.mgc-cine.mg-tour-ready .mgc-capitol .mgc-text:focus-within{pointer-events:auto;}
