/* Movimiento: entradas, aparición al desplazarse y fondo vivo.
   Solo anima opacity y transform (no recalcula el diseño). Se pausa fuera de pantalla
   y se apaga por completo con "reducir movimiento". */

/* ---------- Entrada de la portada (funciona aunque falle el JS) ---------- */
@keyframes mv-entrar{from{opacity:0;transform:translate3d(0,22px,0)}to{opacity:1;transform:none}}
@keyframes mv-bajar{from{opacity:0;transform:translate3d(0,-14px,0)}to{opacity:1;transform:none}}
@keyframes mv-aparecer{from{opacity:0}to{opacity:1}}
.cabecera .envoltura{animation:mv-bajar .7s cubic-bezier(.2,.7,.2,1) both}
.portada h1{animation:mv-entrar .9s cubic-bezier(.2,.7,.2,1) .12s both}
.portada .bajada{animation:mv-entrar .9s cubic-bezier(.2,.7,.2,1) .28s both}
.portada .acciones{animation:mv-entrar .9s cubic-bezier(.2,.7,.2,1) .44s both}
.portada .alterno,.portada .lugar,.portada .sello{animation:mv-aparecer 1s ease .7s both}
.portada .escena,.portada .estadia{animation:mv-entrar 1.1s cubic-bezier(.2,.7,.2,1) .35s both}
.estadia .linea-tiempo li{animation:mv-entrar .6s cubic-bezier(.2,.7,.2,1) both}
.estadia .linea-tiempo li:nth-child(1){animation-delay:.8s}
.estadia .linea-tiempo li:nth-child(2){animation-delay:1.25s}
.estadia .linea-tiempo li:nth-child(3){animation-delay:1.7s}
.estadia .linea-tiempo li:nth-child(4){animation-delay:2.15s}
.estadia .linea-tiempo li:nth-child(5){animation-delay:2.6s}
.estadia .linea-tiempo li:nth-child(6){animation-delay:3.05s}
.estadia .linea-tiempo li:nth-child(7){animation-delay:3.5s}

/* ---------- Aparición al desplazarse (lo activa movimiento.js) ---------- */
.mv-activo [data-revelar]{opacity:0;transform:translate3d(0,26px,0);transition:opacity .75s ease,transform .85s cubic-bezier(.2,.7,.2,1);transition-delay:calc(var(--i,0) * 90ms)}
.mv-activo [data-revelar].visible{opacity:1;transform:none}
/* Barras del caso: crecen al verse */
.relleno{transition:width 1.5s cubic-bezier(.2,.7,.2,1) .25s}
.mv-activo .barras[data-revelar]:not(.visible) .relleno{width:0}
.mv-activo .barras[data-revelar]{transform:none}
.mv-activo .barras .relleno.despues{transition-delay:.55s}

/* ---------- Fondo vivo de las secciones oscuras ---------- */
.mv-fondo-host{position:relative;overflow:hidden;isolation:isolate}
.mv-fondo-host > .envoltura{position:relative;z-index:1}
.fondo-vivo{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden;opacity:0;transition:opacity 1.6s ease}
.fondo-vivo.listo{opacity:1}
.fondo-vivo .mancha{position:absolute;border-radius:50%;will-change:transform}
.fondo-vivo .m1{width:70vmax;height:70vmax;left:-22vmax;top:-34vmax;background:radial-gradient(closest-side,rgba(0,104,144,.55),rgba(0,104,144,0));animation:mv-deriva1 28s ease-in-out infinite alternate}
.fondo-vivo .m2{width:56vmax;height:56vmax;right:-22vmax;top:-12vmax;background:radial-gradient(closest-side,rgba(124,195,218,.22),rgba(124,195,218,0));animation:mv-deriva2 34s ease-in-out infinite alternate}
.fondo-vivo .m3{width:44vmax;height:44vmax;left:34%;bottom:-30vmax;background:radial-gradient(closest-side,rgba(240,178,62,.13),rgba(240,178,62,0));animation:mv-deriva3 40s ease-in-out infinite alternate}
@keyframes mv-deriva1{to{transform:translate3d(14vmax,10vmax,0) scale(1.12)}}
@keyframes mv-deriva2{to{transform:translate3d(-12vmax,14vmax,0) scale(.9)}}
@keyframes mv-deriva3{to{transform:translate3d(-16vmax,-8vmax,0) scale(1.15)}}
.fondo-vivo .ola{position:absolute;left:0;width:200%;height:180px;will-change:transform}
.fondo-vivo .ola path{fill:none;stroke:rgba(124,195,218,.16);stroke-width:1.4;vector-effect:non-scaling-stroke}
.fondo-vivo .o1{bottom:12px;animation:mv-ola 46s linear infinite}
.fondo-vivo .o2{bottom:-18px;animation:mv-ola 64s linear infinite reverse}
.fondo-vivo .o2 path{stroke:rgba(124,195,218,.10)}
.fondo-vivo .o3{bottom:44px;animation:mv-ola 82s linear infinite}
.fondo-vivo .o3 path{stroke:rgba(240,178,62,.10)}
@keyframes mv-ola{to{transform:translate3d(-50%,0,0)}}
/* Foto o video de fondo opcional, medio transparente */
.fondo-vivo .fondo-media{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:center/cover no-repeat;opacity:0;transition:opacity 1.8s ease;filter:saturate(.85)}
.fondo-vivo.con-media .fondo-media{opacity:.2}
.fondo-vivo.pausa .mancha,.fondo-vivo.pausa .ola{animation-play-state:paused}

@media (max-width:760px){
  .fondo-vivo .m3,.fondo-vivo .o3{display:none}
  .fondo-vivo .ola{height:120px}
}

/* ---------- Reducir movimiento: todo quieto y visible ---------- */
@media (prefers-reduced-motion:reduce){
  .cabecera .envoltura,.portada h1,.portada .bajada,.portada .acciones,.portada .alterno,.portada .lugar,.portada .sello,.portada .escena,.portada .estadia,.estadia .linea-tiempo li{animation:none}
  .mv-activo [data-revelar]{opacity:1;transform:none;transition:none}
  .relleno{transition:none}
  .fondo-vivo .mancha,.fondo-vivo .ola{animation:none}
}
