/* La idea: del caos de proveedores a un solo responsable */
.cine{--bg:var(--deeper);--fg:var(--plat);--fg2:#B7C8C4;--rule:rgba(237,242,240,.18);--accent:var(--sig);position:relative;background:var(--deeper);color:var(--plat);padding:clamp(90px,14vh,150px) var(--gut)}
.cine-stage{display:grid;gap:60px;max-width:1400px;margin:0 auto}
.cine-a h2,.cine-b h2{font-size:clamp(44px,8.2vw,132px);line-height:1.02;letter-spacing:-.025em}
.cine-a h2 em,.cine-b h2 em{font-style:normal;color:var(--sig)}
.cine-a p{margin:26px auto 0;max-width:34ch;font-size:clamp(18px,1.7vw,24px);color:var(--fg2)}
.cine-b{display:flex;flex-direction:column;align-items:center;text-align:center}
.cine-logo{width:clamp(170px,17vw,250px);height:auto;margin-bottom:clamp(20px,3.4vh,36px)}
.cine-b>p{margin:clamp(14px,2.4vh,24px) 0 0;max-width:50ch;font-size:clamp(17px,1.5vw,21px);color:var(--fg2)}
.cine-pr{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(18px,3vw,48px);margin-top:clamp(22px,4.4vh,50px);max-width:1120px;text-align:left}
.cine-pr div{padding-top:15px;border-top:1px solid var(--sig)}
.cine-pr b{display:block;margin-bottom:6px;font:300 clamp(17px,1.5vw,21px)/1.25 var(--disp)}
.cine-pr span{display:block;font-size:15px;line-height:1.45;color:var(--fg2)}
.cine-b .btn{margin-top:clamp(20px,3.6vh,38px);font-size:18px}
.cine-bg,.cine-lines,.cine-chips,.cine-ring{display:none}

.cine.on{height:400vh;padding:0}
.on .cine-stage{position:sticky;top:0;display:block;height:100vh;height:100svh;max-width:none;overflow:hidden;background:radial-gradient(ellipse 80% 70% at 50% 50%,#0b2c28,var(--deeper) 72%)}
.on .cine-bg{display:block;position:absolute;inset:0;clip-path:circle(calc(var(--r,0)*120vmax) at 50% 42%)}
.on .cine-bg img{width:100%;height:100%;object-fit:cover;scale:calc(1.16 - var(--r,0)*.16)}
.on .cine-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(5,24,21,.82),rgba(5,24,21,.7) 45%,rgba(5,24,21,.92))}
.on .cine-a,.on .cine-b{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:70px var(--gut) 30px;text-align:center;will-change:transform,opacity}
.on .cine-a{pointer-events:none}
.on .cine-b{visibility:hidden}
.on .cine-lines{display:block;position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.cine-lines line{stroke:var(--sig);stroke-width:1;filter:drop-shadow(0 0 5px rgba(79,224,180,.8))}
.on .cine-chips{display:block;position:absolute;inset:0;pointer-events:none}
.cchip{position:absolute;left:0;top:0;will-change:transform,opacity}
.cchip>div{width:max-content;max-width:min(44vw,250px);padding:12px 15px;border:1px solid rgba(237,242,240,.2);border-radius:9px;background:rgba(7,32,29,.74);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);opacity:0;scale:.9;transition:opacity 1s var(--out) var(--d),scale 1.2s var(--out) var(--d);animation:cFlota 7s ease-in-out infinite alternate;animation-delay:var(--f)}
.cine.vista .cchip>div{opacity:1;scale:1}
.cchip b{display:flex;align-items:center;gap:8px;font:400 12px var(--disp);letter-spacing:.12em;text-transform:uppercase;white-space:nowrap}
.cchip b::before{content:"";flex:none;width:7px;height:7px;border-radius:50%;background:var(--pt,#E8735A);box-shadow:0 0 10px var(--pt,#E8735A)}
.cchip i{display:block;margin-top:5px;font-style:normal;font-size:14px;line-height:1.3;color:var(--fg2);opacity:var(--q,1)}
@keyframes cFlota{from{translate:0 -5px}to{translate:0 7px}}
.on .cine-ring{display:block;position:absolute;left:0;top:0;width:150px;height:150px;margin:-75px 0 0 -75px;border:1px solid var(--sig);border-radius:50%;opacity:0;pointer-events:none}
@media(max-width:820px){
  .cine-pr{grid-template-columns:minmax(0,1fr);gap:10px}
  .cine-pr span{font-size:14px}
  .cine.on{height:360vh}
  .on .cine-a{justify-content:flex-start;padding-top:clamp(84px,13vh,120px)}
  .cine-a h2,.cine-b h2{font-size:clamp(40px,11.5vw,74px)}
  .cine-a p{margin-top:14px;font-size:16px}
  .cine-b>p{font-size:15px}
  .cchip>div{padding:9px 11px}.cchip b{font-size:10.5px}.cchip i{font-size:12.5px}
  .on .cine-pr div{padding-top:9px}
  .cine-pr b{margin-bottom:2px;font-size:16px}
}
@media(max-height:700px) and (max-width:820px){.on .cine-pr span{display:none}.cine-logo{width:130px}}
@media(max-height:760px) and (min-width:821px){.cine-a h2,.cine-b h2{font-size:clamp(44px,12vh,84px)}.cine-pr span{font-size:14px}}

/* Portada: del espacio a Lima */
.espacio{display:none}
.js .espacio{display:block;position:absolute;inset:0;background:#030F0D;pointer-events:none;animation:espacioSeguro 0s 16s forwards}
@keyframes espacioSeguro{to{visibility:hidden;opacity:0}}
.espacio canvas{position:absolute;inset:0;width:100%;height:100%}
.espacio::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(3,15,13,.82),rgba(3,15,13,.34) 46%,transparent 66%)}
.espacio-hud{position:absolute;z-index:1;right:var(--gut);top:clamp(96px,13vh,130px);display:grid;gap:3px;text-align:right;font:400 12px/1.5 ui-monospace,"SF Mono",Menlo,monospace;letter-spacing:.06em;color:#AFC2BE;opacity:0}
.espacio-hud b{font-weight:400;color:#4FE0B4}
.hero-mark{transition:opacity 1.4s var(--out)}
.vuelo .hero-mark{opacity:0;transition:none}
@media(max-width:900px){.espacio::after{background:linear-gradient(0deg,rgba(3,15,13,.88) 28%,transparent 62%)}.espacio-hud{top:calc(84px + 2vh);font-size:10.5px}}
@media(prefers-reduced-motion:reduce){.js .espacio{display:none}}