/* Full-width cinematic background; existing Vergne copy and scroll clock. */
#inicio.journey-hero{background:#06070b;height:auto;overflow:visible}
#inicio .cinema-screen{height:100svh;min-height:720px;max-height:none;padding-top:var(--header-h);display:flex;flex-direction:column;position:relative;isolation:isolate;overflow:hidden;box-sizing:border-box}
#inicio .cinema-meta{height:54px;flex-shrink:0;font:9px var(--mono);letter-spacing:.1em;position:relative;z-index:3}
#inicio .cinema-meta>span{display:flex;align-items:center;gap:9px}
.film-live{width:5px;height:5px;border-radius:50%;background:#e11d48;box-shadow:0 0 14px #e11d4870}
#inicio .cinema-layout{display:block;flex:1;min-height:0;position:relative;z-index:2;perspective:none;isolation:auto}
#inicio .cinema-copy{width:48%;max-width:680px;margin-left:auto;margin-right:0;height:100%;min-height:0;z-index:2}
#inicio .scene-copy{justify-content:center;align-items:flex-end;text-align:right;padding:0 0 20px 26px;filter:none;transition:none;opacity:var(--scene-opacity,0);visibility:var(--scene-visibility,hidden);transform:translateY(var(--scene-shift,0px))}
#inicio .scene-copy.is-active{--scene-opacity:1;--scene-visibility:visible}
#inicio .scene-copy h1,#inicio .scene-copy h2{font-family:Arial,sans-serif;font-size:clamp(60px,min(7.8vw,12.6svh),128px);font-style:normal;font-weight:600;line-height:.82;letter-spacing:-.087em;margin:0 0 30px}
#inicio .scene-copy h2{font-size:clamp(56px,min(7.2vw,11.8svh),118px)}
#inicio .scene-copy .outline{color:transparent;-webkit-text-fill-color:transparent;-webkit-text-stroke:1px rgba(241,240,234,.88);font-style:normal;text-shadow:none}
#inicio .scene-copy p{font:clamp(11px,.95vw,14px)/1.65 Arial,sans-serif;color:#c0c4cd;margin:0 0 24px;max-width:365px}
#inicio .scene-index{font:8px/1.5 var(--mono);letter-spacing:.12em;margin-bottom:23px;color:#df8196;max-width:320px}
#inicio .opening-index{color:#9a9fa9}
#inicio .cinema-actions{gap:18px;flex-wrap:wrap;justify-content:flex-end}
#inicio .cinema-actions .btn{min-height:43px;padding:0 16px;font-size:10px;gap:12px}
#inicio .text-link{font-size:10px;gap:9px}
#inicio .scene-footnote{font:8px/1.5 Arial,sans-serif;color:#7d8490;margin-top:20px;max-width:320px}
.journey-stage{position:absolute;inset:0;width:100%;height:100%;min-width:0;margin:0;z-index:0;pointer-events:none}
.journey-frame{position:absolute;inset:0;width:100%;height:100%;overflow:hidden;background:#06070b}
.journey-shade{position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(270deg,rgba(6,7,11,.95) 0%,rgba(6,7,11,.86) 18%,rgba(6,7,11,.65) 34%,rgba(6,7,11,.2) 58%,rgba(6,7,11,.03) 80%),linear-gradient(0deg,#06070b 0%,rgba(6,7,11,.93) 10%,rgba(6,7,11,.35) 27%,transparent 44%,transparent 78%,rgba(6,7,11,.4) 100%)}
.journey-poster,#journey-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:40% 50%;display:block}
#journey-video{opacity:0}
.video-visible #journey-video{opacity:1}
.journey-load{position:absolute;bottom:145px;right:var(--pad);padding:12px 16px;color:#fff;border:1px solid #ffffff50;background:#06070bd9;font:11px Arial,sans-serif;cursor:pointer;z-index:3}
.journey-load[hidden]{display:none}
.journey-caption{position:relative;z-index:2;flex-shrink:0;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 0 0;color:#a8afbb;font:8px var(--mono);letter-spacing:.08em}
.journey-caption>span:first-child{display:flex;align-items:center;gap:10px;color:#c2c5cc;min-width:0;font-size:10px;letter-spacing:0}
.journey-caption img{height:23px;width:29px;object-fit:contain}
#inicio .cinema-footer{position:relative;z-index:3;display:flex;align-items:flex-end;gap:44px;padding:20px 0 17px;flex-shrink:0}
#inicio .chapter-controls{width:auto;flex:1;gap:26px}
#inicio .chapter-controls button{font:12px Arial,sans-serif;padding:14px 0 18px;white-space:nowrap;transition:color .2s}
#inicio .chapter-controls button small{font:8px var(--mono);margin-right:10px}
#inicio .chapter-controls button i{height:2px;transition:none}
.film-controls{display:flex;align-items:center;gap:18px;padding-bottom:6px;flex-shrink:0}
.film-scroll-hint{display:flex;align-items:center;gap:8px;font:9px Arial,sans-serif;color:#a7adb8;white-space:nowrap}
.film-scroll-hint svg{width:13px;height:18px;fill:none;stroke:currentColor;stroke-width:1.2}
.film-time{font:9px var(--mono);color:#8a919d;min-width:32px;text-align:right}
.film-restart{width:35px;height:35px;border:1px solid #ffffff30;background:transparent;color:#c8cdd5;font:22px/1 Arial,sans-serif;cursor:pointer}
.film-restart:hover{border-color:#ffffff80}
.film-bottom{position:relative;display:flex;justify-content:space-between;gap:20px;flex-shrink:0;padding-bottom:20px;color:#686f7b;font:7px var(--mono);letter-spacing:.06em}
#inicio button:focus-visible,#inicio a:focus-visible{outline:2px solid #f1849a;outline-offset:5px}
#inicio:not(.film-ready) .chapter-controls,#inicio:not(.film-ready) .film-controls{display:none}
#inicio:not(.film-ready) .scene-copy:first-child{--scene-opacity:1;--scene-visibility:visible;transform:none}
@media(min-width:1700px){#inicio .cinema-copy{width:48%;max-width:720px}}
@media(max-width:1100px) and (min-width:701px){#inicio .cinema-copy{width:48%}#inicio .scene-copy{padding-left:20px;padding-right:0}#inicio .scene-copy h1{font-size:7.7vw}#inicio .scene-copy h2{font-size:7.1vw}#inicio .cinema-actions{gap:13px}#inicio .cinema-footer{gap:24px}#inicio .chapter-controls{gap:16px}#inicio .chapter-controls button{font-size:10px}.film-controls{gap:10px}.journey-caption>span:last-child{font-size:6px}}
@media(max-width:700px){
 #inicio .cinema-screen{height:auto;min-height:100svh;padding-bottom:10px}
 #inicio .cinema-meta{height:38px;font-size:6px;letter-spacing:.06em}#inicio .cinema-meta a{font-size:7px}
 #inicio .cinema-layout{display:block;min-height:0}
 #inicio .cinema-copy{width:100%;max-width:460px;min-height:0}
 #inicio .scene-copy{padding:12px 0 4px;justify-content:flex-start}
 #inicio .scene-copy h1,#inicio .scene-copy h2{font-size:clamp(44px,min(14.4vw,8.5svh),78px);line-height:.84;margin-bottom:20px}
 #inicio .scene-copy p{font-size:11px;line-height:1.55;max-width:420px;margin-bottom:16px}
 #inicio .scene-index{font-size:6px;margin-bottom:13px;max-width:none}
 #inicio .cinema-actions{gap:17px;flex-wrap:nowrap}#inicio .cinema-actions .btn{min-height:36px;font-size:9px;padding:0 12px}#inicio .text-link{font-size:9px}
 #inicio .scene-footnote{font-size:7px;margin-top:12px}
 .journey-poster,#journey-video{object-fit:contain;object-position:50% 65%}.journey-shade{background:linear-gradient(180deg,#06070b 0%,rgba(6,7,11,.98) 16%,rgba(6,7,11,.86) 30%,rgba(6,7,11,.25) 48%,transparent 60%,rgba(6,7,11,.12) 72%,#06070b 89%)}.journey-caption{padding-top:10px;font-size:6px}.journey-caption>span:first-child{font-size:8px;gap:7px}.journey-caption img{width:21px;height:18px}.journey-caption>span:last-child{font-size:5px;letter-spacing:.03em}
 #inicio .cinema-footer{flex-wrap:wrap;gap:10px;padding:15px 0 8px}#inicio .chapter-controls{flex:0 0 100%;gap:12px}#inicio .chapter-controls button{font-size:9px;padding:10px 0 12px}#inicio .chapter-controls button small{font-size:6px;margin-right:5px}
 .film-controls{width:100%;gap:12px;padding:0;justify-content:flex-end}.film-scroll-hint{margin-right:auto;font-size:8px}.film-time{font-size:8px}.film-restart{width:29px;height:28px;font-size:18px}.film-bottom{display:none}
}
@media(max-width:380px){#inicio .scene-copy p{font-size:10px}#inicio .scene-copy h1,#inicio .scene-copy h2{font-size:44px}#inicio .cinema-copy{min-height:0}}
@media(max-height:720px) and (min-width:701px){#inicio .cinema-meta{height:35px}#inicio .scene-copy h1{font-size:min(7.8vw,12svh)}#inicio .scene-copy h2{font-size:min(7.2vw,11.5svh)}#inicio .scene-index{margin-bottom:15px}#inicio .scene-copy p{font-size:11px;margin-bottom:17px}#inicio .cinema-footer{padding-top:12px}.film-bottom{padding-bottom:12px}.journey-caption{padding-top:10px}}
@media(max-height:650px) and (max-width:700px){#inicio .cinema-meta{height:28px}#inicio .cinema-copy{min-height:0}#inicio .scene-copy h1,#inicio .scene-copy h2{font-size:42px;margin-bottom:14px}#inicio .scene-copy p{font-size:9px;margin-bottom:12px}#inicio .scene-index{margin-bottom:9px}#inicio .cinema-actions .btn{min-height:30px;font-size:8px}#inicio .scene-footnote{margin-top:7px}.journey-caption{padding-top:6px}#inicio .cinema-footer{padding-top:10px}}
@media(prefers-reduced-motion:reduce){#inicio *{animation:none!important;transition:none!important}#inicio .scene-copy{transform:none}}

/* The film fills the backdrop; text and controls remain on the editorial grid. */
#inicio .scene-copy h1,#inicio .scene-copy h2{text-shadow:0 3px 30px #0006}
#inicio .scene-copy .cinema-lead,#inicio .scene-copy p{text-shadow:0 2px 12px #0008}
#inicio .journey-load{z-index:5;pointer-events:auto}
@media(max-width:1100px) and (min-width:701px) and (orientation:portrait){#inicio .cinema-copy{width:62%;max-width:520px}.journey-poster,#journey-video{object-fit:contain;object-position:50% 70%}.journey-shade{background:linear-gradient(180deg,#06070b 0%,#06070beb 25%,#06070b60 47%,transparent 62%,#06070b 94%)}#inicio .scene-copy{justify-content:flex-start;padding-top:30px}}

/* Noema display: dense scale, filled/outlined contrast and masked lines.
   Motion reads the existing scroll-driven opacity; no second animation clock. */
#inicio .hero-title-line{display:block;overflow:hidden;padding:.12em .07em .2em;margin:-.12em -.07em -.2em}
#inicio .hero-line-content{display:block;transform-origin:100% 100%;transform:translateY(clamp(0%,calc((1 - var(--scene-opacity,1)) * var(--line-travel,110%)),145%)) rotate(calc((1 - var(--scene-opacity,1)) * -1.5deg))}
#inicio .hero-title-line:nth-child(2){--line-travel:125%}
#inicio .hero-title-line:nth-child(3){--line-travel:140%}
#inicio.film-manual .hero-line-content{transform:none}
@media(prefers-reduced-motion:reduce){#inicio .hero-line-content{transform:none}}
@media(forced-colors:active){#inicio .scene-copy .outline{color:CanvasText;-webkit-text-fill-color:CanvasText;-webkit-text-stroke:0}}