.film-home .stage::before{display:none}
.js .film-home.is-preparing .loading-screen{display:grid;opacity:1;visibility:visible;pointer-events:auto}
.js .film-home.is-preparing .stage>*{visibility:hidden}
.film-home .loading-mark img{display:block;width:190px;height:auto;max-height:180px;object-fit:contain;margin:auto}
html:not(.js) .film-home .loading-screen{display:none}
.film-cover{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;z-index:2;pointer-events:none}
.film-cover[hidden]{display:none}
.film-still{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:2;opacity:0;pointer-events:none}
.film-home .experience-video{width:100%;height:100%;left:0;top:0;object-fit:cover;object-position:center;z-index:1}
.film-home .film-cover,.film-home .film-still{object-fit:cover}
/* Móvil y tablet comparten un vídeo 3:4: ocupa todo el ancho, centrado; las franjas son el fondo de la sección. */
.film-home[data-film-format=mobile] .experience-video,.film-home[data-film-format=mobile] .film-cover,.film-home[data-film-format=mobile] .film-still{width:100%;height:auto;aspect-ratio:3/4;top:50%;bottom:auto;transform:translateY(-50%)}
.film-home[data-film-format=tablet] .experience-video,.film-home[data-film-format=tablet] .film-cover,.film-home[data-film-format=tablet] .film-still{width:100%;height:auto;aspect-ratio:3/4;top:50%;bottom:auto;transform:translateY(-50%)}
.film-home .shade{display:none}
.film-frame{position:absolute;z-index:2;pointer-events:none;container-type:inline-size}
.film-effects{position:absolute;inset:0;z-index:3;width:100%;height:100%;pointer-events:none}
.film-home .panel.four{z-index:4}
.film-sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.film-frame .film-intro{position:absolute;top:64%;left:0;width:100%;max-width:none;margin:0;text-align:center;font:400 2.5cqw 'MAGMA Scaver Custom',Georgia,serif;letter-spacing:.11em;color:#ffffff;text-shadow:0 1px 4px rgba(0,0,0,.6);transform-origin:center;opacity:1;white-space:nowrap}
.film-scene{position:absolute;inset:0;visibility:hidden;pointer-events:none}
.film-copy{position:absolute;left:10%;top:24%;width:37%;transform-origin:center;text-shadow:0 1px 4px #0009}
.film-scene-1 .film-copy{top:18%;left:9%;width:39%}
.film-scene-2 .film-copy{top:65%;left:9%;width:40%}
.film-scene-3 .film-copy{top:66%;left:48%;width:43%;text-align:center}
.film-word{display:inline-block;white-space:nowrap}
.film-home[data-film-format=mobile] .film-intro{top:57%;font-size:4.5cqw}
.film-home[data-film-format=mobile] .film-copy{left:10%;top:28%;width:64%}
.film-home[data-film-format=mobile] .film-scene-1 .film-copy{left:7%;top:8%;width:86%}
.film-home[data-film-format=mobile] .film-scene-2 .film-copy{left:7%;top:18%;width:52%}
.film-home[data-film-format=mobile] .film-scene-3 .film-copy{left:7%;top:10%;width:86%}
.film-home[data-film-format=tablet] .film-intro{top:61%;font-size:3.5cqw}
.film-home[data-film-format=tablet] .film-copy{left:10%;top:19%;width:66%}
.film-home[data-film-format=tablet] .film-scene-1 .film-copy{left:7%;top:15%;width:76%}
.film-home[data-film-format=tablet] .film-scene-2 .film-copy{left:7%;top:15%;width:50%}
.film-home[data-film-format=tablet] .film-scene-3 .film-copy{left:12%;top:8%;width:76%}
/* No JS, reduced motion and media failure expose readable content and the shared final actions. */
.film-home:not(.chapter-mode) .film-frame{position:relative;inset:auto!important;width:100%!important;height:auto!important;padding-top:110px}
.film-home:not(.chapter-mode) .film-scene{position:relative;visibility:visible!important;padding:60px 8%;min-height:40vh}
.film-home:not(.chapter-mode) .film-copy{position:relative;left:auto!important;top:auto!important;width:100%!important;opacity:1!important;transform:none!important}
.film-home:not(.chapter-mode) .film-intro,.film-home:not(.chapter-mode) .film-effects{display:none}
.film-home:not(.chapter-mode) .film-cover,.film-home:not(.chapter-mode) .film-still{display:none}
.film-home:not(.chapter-mode) .film-scene{opacity:1!important}
.film-home:not(.chapter-mode) .film-word{opacity:1!important;transform:none!important}
/* Positions and type sizes measured from the supplied horizontal and true vertical references. */
.film-home[data-film-format=desktop] .film-scene-0 .film-copy{left:8.2%;top:45.5%;width:54%}
.film-home[data-film-format=desktop] .film-scene-1 .film-copy{left:5.7%;top:20.2%;width:58%}
.film-home[data-film-format=desktop] .film-scene-2 .film-copy{left:4.6%;top:65.4%;width:55%}
.film-home[data-film-format=desktop] .film-scene-3 .film-copy{left:26%;top:52.8%;width:54%}
.film-home[data-film-format=mobile] .film-scene-0 .film-copy{left:7%;top:53%;width:84%}
.film-home[data-film-format=mobile] .film-scene-1 .film-copy{left:7%;top:8%;width:86%}
.film-home[data-film-format=mobile] .film-scene-2 .film-copy{left:7%;top:18%;width:52%}
.film-home[data-film-format=mobile] .film-scene-3 .film-copy{left:7%;top:10%;width:86%}
.film-home[data-film-format=tablet] .film-scene-0 .film-copy{left:7%;top:32%;width:68%}
.film-home[data-film-format=tablet] .film-scene-1 .film-copy{left:7%;top:15%;width:76%}
.film-home[data-film-format=tablet] .film-scene-2 .film-copy{left:7%;top:15%;width:50%}
.film-home[data-film-format=tablet] .film-scene-3 .film-copy{left:12%;top:8%;width:76%}
@media(prefers-reduced-motion:reduce){.film-home .film-effects{display:none}.film-home .film-scene{visibility:visible!important}.film-home .film-word{opacity:1!important;transform:none!important}}
/* Narrative type system: brand display face, quiet readable Georgia prose. */
.film-home .film-copy{--film-heading-size:clamp(36px,3.4cqw,64px);--film-body-size:clamp(20px,1.65cqw,30px);--film-subtitle-size:clamp(24px,2.1cqw,38px)}
.film-home .film-copy h2{margin:0;max-width:25ch;font:400 var(--film-heading-size)/1.12 'MAGMA Scaver Custom',Georgia,serif;color:#fff;letter-spacing:.005em;text-wrap:balance}
.film-home .film-copy p{margin:clamp(14px,1.2cqw,24px) 0 0;max-width:48ch;font:400 var(--film-body-size)/1.48 Georgia,'Times New Roman',serif;color:#fff;letter-spacing:.006em;text-wrap:pretty}
.film-home .film-scene-3 h2{color:#e8bb63;margin-inline:auto;letter-spacing:.035em}
.film-home .film-scene-3 .film-subtitle{font-size:var(--film-subtitle-size);line-height:1.24;margin:clamp(12px,1cqw,20px) auto 0;text-wrap:balance}
.film-home .film-scene-3 p:last-child{margin-inline:auto;max-width:43ch}
.film-home[data-film-format=mobile] .film-copy{--film-heading-size:clamp(24px,6.2cqw,30px);--film-body-size:clamp(18px,4.2cqw,20px);--film-subtitle-size:clamp(20px,5.1cqw,22px)}
.film-home[data-film-format=tablet] .film-copy{--film-heading-size:clamp(28px,3.9cqw,36px);--film-body-size:clamp(18px,2.25cqw,21px);--film-subtitle-size:clamp(22px,2.9cqw,24px)}
.film-home:not(.chapter-mode) .film-copy h2{font-size:clamp(30px,4vw,56px)}
.film-home:not(.chapter-mode) .film-copy p{font-size:clamp(18px,2vw,26px)}

/* Compact copy follows the clear areas of the portrait footage. */
.film-home[data-film-format=mobile] .film-copy p{margin-top:10px;line-height:1.42}
.film-home[data-film-format=tablet] .film-copy p{margin-top:12px;line-height:1.44}
.film-home[data-film-format=mobile] .film-scene-3 .film-subtitle,.film-home[data-film-format=tablet] .film-scene-3 .film-subtitle{line-height:1.22}
@media(orientation:landscape){
 .film-home[data-film-format=mobile] .film-copy{--film-heading-size:27px;--film-body-size:18px;--film-subtitle-size:21px}
 .film-home[data-film-format=tablet] .film-copy{--film-heading-size:30px;--film-body-size:19px;--film-subtitle-size:23px}
 .film-home[data-film-format=mobile] .film-scene-3 .film-copy,.film-home[data-film-format=tablet] .film-scene-3 .film-copy{left:6%;width:52%;text-align:left}
 .film-home[data-film-format=mobile] .film-scene-3 .film-copy>* ,.film-home[data-film-format=tablet] .film-scene-3 .film-copy>*{margin-left:0}
}

@media(orientation:landscape){
 /* The portrait film is cropped closely here; soften the bright hands behind the closing copy. */
 .film-home[data-film-format=mobile] .film-scene-3::before,.film-home[data-film-format=tablet] .film-scene-3::before{content:"";position:fixed;inset:0;background:linear-gradient(180deg,#000c 0%,#0009 28%,transparent 70%)}
}

/* Closing copy centered in the usable mobile viewport; motion owns transform. */
.film-home[data-film-format=mobile] .film-scene-3 .film-copy{left:7%;width:86%;text-align:center}
.film-home[data-film-format=mobile] .film-scene-3 .film-copy>*{margin-inline:auto}
.film-home.chapter-mode[data-film-format=mobile] .film-scene-3::before{content:"";position:fixed;inset:0;background:linear-gradient(180deg,transparent 22%,#0009 43%,#0009 63%,transparent 86%)}

/* Final editorial refinement: handwritten subtitle, unchanged Georgia paragraph. */
.film-home .film-scene-3 .film-subtitle{font-family:'Allison',cursive;font-weight:400;font-size:calc(var(--film-subtitle-size) * 1.85);line-height:1.12;letter-spacing:0}
.film-home[data-film-format=mobile] .film-scene-3 .film-subtitle{font-size:clamp(37px,9.7cqw,41px);white-space:nowrap}
@media(orientation:landscape) and (max-height:640px){
 .film-home[data-film-format=mobile] .film-scene-3 .film-copy p{max-width:none;margin-top:8px}
}
.film-play-retry{position:absolute;bottom:84px;left:50%;transform:translateX(-50%);width:max-content;max-width:85vw;padding:12px 20px;border:1px solid #d9b77c;border-radius:999px;background:#090806;color:#f5e9d6;font:16px Georgia,serif;cursor:pointer;pointer-events:auto}
.film-play-retry[hidden]{display:none}

/* Barra vertical de continuidad (sustituye a los puntos, que quedan solo para lectores de pantalla) */
.film-home .checkpoints{position:absolute!important;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);margin:-1px;padding:0}
.film-progress{position:absolute;z-index:4;left:max(16px,2.2vw);top:50%;width:2px;height:min(34vh,260px);transform:translateY(-50%);border-radius:2px;background:rgba(233,210,164,.16);pointer-events:none;transition:opacity .4s ease-out}
.film-progress__fill{position:absolute;inset:0;border-radius:2px;transform-origin:top;transform:scaleY(var(--p,0));background:linear-gradient(#f0d399,#c9a463);box-shadow:0 0 8px rgba(240,211,153,.45)}
.film-progress i{position:absolute;left:50%;width:5px;height:5px;margin:-2.5px 0 0 -2.5px;border-radius:50%;background:#0b0907;border:1px solid rgba(233,210,164,.5)}
.film-home.footer-unlocked .film-progress,.film-home:not(.chapter-mode) .film-progress{opacity:0}
@media(max-width:600px){.film-progress{left:10px;height:30vh;top:50%}}

/* El indicador de scroll se oculta solo mientras avanza un tramo y vuelve en cada parada */
.controls .scroll-cue{transition:opacity .35s cubic-bezier(.23,1,.32,1),visibility .35s ease}
body[data-playing="true"] .controls .scroll-cue{opacity:0!important;pointer-events:none!important;visibility:hidden!important}
/* "Desliza para continuar" visible en cada parada; "Mantén pulsado para acelerar" solo durante un tramo */
.film-home .controls .scroll-cue__status{position:absolute;left:50%;bottom:calc(100% + 8px);transform:translateX(-50%);width:max-content;min-width:0;height:auto;margin:0;overflow:visible;clip-path:none;color:#f0ddbb;font:600 10px/1.2 Arial,sans-serif;letter-spacing:.12em;text-transform:uppercase;text-shadow:0 1px 3px #000;opacity:.72;pointer-events:none;transition:opacity .3s}
.film-home[data-playing="true"] .controls .scroll-cue__status,.film-home.footer-unlocked .controls .scroll-cue__status{opacity:0}
.film-home:not([data-playing="true"]) .hold-hint{visibility:hidden!important;opacity:0!important;animation:none!important}

/* Prueba ?lleno: el vídeo 3:4 ocupa todo el alto en móvil y tablet (se recortan los lados) */
.film-home.film-fill[data-film-format] .experience-video,.film-home.film-fill[data-film-format] .film-cover,.film-home.film-fill[data-film-format] .film-still{top:0;left:50%;bottom:auto;width:auto;height:100%;aspect-ratio:3/4;transform:translateX(-50%)}

/* Align floating contact dock to same bottom level as language switcher on mobile */
@media(max-width:640px){
 .film-home .magma-contact-dock{
  --fab-size:48px;
  right:max(12px,env(safe-area-inset-right)) !important;
  bottom:calc(16px + env(safe-area-inset-bottom)) !important;
 }
}


/* ---- Mejoras UX (Claude, 03/10/2026) ---- */
/* Legibilidad: velo oscuro y difuso detrás de cada bloque de texto; se mueve y se desvanece con él. */
.film-home.chapter-mode .film-copy::before{content:"";position:absolute;inset:-22% -16%;z-index:-1;pointer-events:none;background:radial-gradient(closest-side,rgba(0,0,0,.62),rgba(0,0,0,.34) 58%,transparent 100%)}
.film-home.chapter-mode .film-scene-3 .film-copy::before{inset:-18% -10%}
/* Indicación de "mantén pulsado" en texto. */
.film-home .hold-hint__rate{white-space:nowrap;letter-spacing:.04em}
body.film-home.hold-hint-visible[data-playing="true"] .hold-hint{visibility:visible!important}

/* Enlaces a servicios en cada parada (Claude, 03/10/2026): secundarios, aparecen con el texto asentado */
.film-cta{display:flex;align-items:center;gap:.5em;width:max-content;max-width:100%;margin-top:clamp(12px,1.1cqw,20px);padding:8px 0 5px;color:#e8c98a;font:400 clamp(13px,1.05cqw,16px)/1.2 'MAGMA Scaver Custom',Georgia,serif;letter-spacing:.1em;text-transform:uppercase;text-decoration:none;border-bottom:1px solid rgba(232,201,138,.7);text-shadow:0 1px 4px #000;opacity:0;transform:translateY(6px);pointer-events:none;transition:opacity .5s ease-out,transform .5s ease-out,color .2s,border-color .2s}
.film-cta span{transition:transform .2s}
.film-settled .film-cta{opacity:1;transform:none;pointer-events:auto}
.film-cta:hover,.film-cta:focus-visible{color:#fff;border-color:#fff}
.film-cta:hover span{transform:translateX(3px)}
.film-cta:focus-visible{outline:2px solid #f0d399;outline-offset:4px}
.film-home:not(.chapter-mode) .film-cta{opacity:1;transform:none;pointer-events:auto}
.film-home[data-film-format=mobile] .film-cta{font-size:14px;margin-top:10px}

/* Indicador de scroll discreto: respira como una luz tenue */
.film-home .controls .scroll-cue{width:40px;height:52px}
.film-home .scroll-cue svg{width:30px;height:45px;filter:drop-shadow(0 0 6px rgba(240,211,153,.35));animation:magma-cue-breathe 3.2s ease-in-out infinite}
.film-home .controls .scroll-cue__status{opacity:.5}
@keyframes magma-cue-breathe{0%,100%{opacity:.16}50%{opacity:.5}}
@media(prefers-reduced-motion:reduce){.film-home .scroll-cue svg{animation:none;opacity:.4}}

/* Botón de sonido: pequeño, encima del botón de contacto */
.film-sound{position:fixed;z-index:6;right:29px;bottom:98px;width:34px;height:34px;display:grid;place-items:center;padding:0;border:1px solid rgba(233,210,164,.35);border-radius:50%;background:rgba(8,7,6,.5);color:#e9d2a4;cursor:pointer;opacity:.65;pointer-events:auto;touch-action:manipulation;-webkit-tap-highlight-color:transparent;transition:opacity .2s,border-color .2s}
.film-sound:hover,.film-sound:focus-visible{opacity:1;border-color:rgba(240,211,153,.85)}
.film-sound:focus-visible{outline:2px solid #f0d399;outline-offset:3px}
.film-sound svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.film-sound .film-sound__wave,.film-sound.is-on .film-sound__off{display:none}
.film-sound.is-on .film-sound__wave{display:block}
.film-sound.is-on{opacity:.9}
.film-home:not(.chapter-mode) .film-sound,.film-home.footer-scrolled .film-sound{display:none}
body:has(.magma-contact-dock:not([data-state="closed"])) .film-sound{opacity:0;pointer-events:none}
@media(max-width:640px){.film-sound{right:19px;bottom:calc(76px + env(safe-area-inset-bottom))}}

/* Indicación para activar sonido en los primeros segundos */
.film-sound-hint{position:fixed;z-index:6;right:70px;bottom:98px;height:34px;display:inline-flex;align-items:center;gap:6px;padding:0 12px 0 14px;border:1px solid rgba(233,210,164,.4);border-radius:17px;background:rgba(12,10,8,.82);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:#f5e9d6;font-family:inherit;font-size:12px;font-weight:500;letter-spacing:.02em;white-space:nowrap;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;box-shadow:0 4px 18px rgba(0,0,0,.45);animation:magmaSoundHintIn .6s cubic-bezier(.22,1,.36,1) backwards;transition:opacity .4s ease,transform .4s ease,border-color .2s,background .2s;pointer-events:auto}
.film-sound-hint:hover,.film-sound-hint:focus-visible{background:rgba(22,18,14,.92);border-color:rgba(240,211,153,.85);color:#fff}
.film-sound-hint:focus-visible{outline:2px solid #f0d399;outline-offset:2px}
.film-sound-hint__arrow{display:inline-block;color:#d9b77c;font-size:14px;line-height:1}
.film-sound-hint .arrow-desktop{display:inline-block;transform:translateX(0);animation:magmaSoundArrowPulse 1.4s ease-in-out infinite}
.film-sound-hint .arrow-mobile{display:none}
.film-sound-hint.is-dismissed{opacity:0;transform:translateX(6px);pointer-events:none}
.film-home:not(.chapter-mode) .film-sound-hint,.film-home.footer-scrolled .film-sound-hint,body:has(.magma-contact-dock:not([data-state="closed"])) .film-sound-hint{opacity:0;pointer-events:none}
@keyframes magmaSoundHintIn{from{opacity:0;transform:translateX(8px)}to{opacity:1;transform:translateX(0)}}
@keyframes magmaSoundArrowPulse{0%,100%{transform:translateX(0)}50%{transform:translateX(3px)}}
@keyframes magmaSoundArrowPulseDown{0%,100%{transform:translateY(0)}50%{transform:translateY(3px)}}
@media(max-width:640px){
  .film-sound-hint{
    right:16px;
    bottom:calc(118px + env(safe-area-inset-bottom));
    height:28px;
    padding:0 10px;
    gap:5px;
    font-size:11px;
    border-radius:14px;
    box-shadow:0 3px 12px rgba(0,0,0,.5);
  }
  .film-sound-hint .arrow-desktop{display:none}
  .film-sound-hint .arrow-mobile{display:inline-block;transform:translateY(0);animation:magmaSoundArrowPulseDown 1.4s ease-in-out infinite}
  .film-sound-hint.is-dismissed{transform:translateY(4px)}
}
@media(prefers-reduced-motion:reduce){.film-sound-hint,.film-sound-hint .arrow-desktop,.film-sound-hint .arrow-mobile{animation:none}}

/* Responsive Age Gate on mobile */
@media(max-width:600px){
  .age-gate{padding:12px}
  .age-gate__panel{width:100%;max-width:calc(100vw - 24px);padding:22px 16px}
  .age-gate h2{font-size:22px;line-height:1.2}
  .age-gate p{font-size:13px;line-height:1.45;margin:12px auto}
  .age-gate__actions{flex-direction:column;width:100%;gap:10px}
  .age-gate__actions .button,.age-gate__actions button{width:100%;text-align:center;padding:12px 16px}
}

/* Calma: sin aceleración, sin indicación de "mantén pulsado" */
.film-home .hold-hint{display:none!important}


/* Anula la regla de YellowPencil (top:385px en móvil) que descuadraba el vídeo según la altura de pantalla */
@media (max-width:600px){
 body.film-home #main-content .stage .experience-video,body.film-home #main-content .stage .film-cover,body.film-home #main-content .stage .film-still{top:50%!important}
 body.film-home.film-fill #main-content .stage .experience-video,body.film-home.film-fill #main-content .stage .film-cover,body.film-home.film-fill #main-content .stage .film-still{top:0!important}
 body.film-home #main-content .stage .brand-composition img{top:auto!important}
}
