/* Movimiento editorial: portadas y notas. Solo se activa con html.mov (lo pone movimiento.js);
   sin JS todo el contenido queda visible y quieto. */
@keyframes mv-sube{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes mv-kb{from{transform:scale(1.06) translate3d(0,-1%,0)}to{transform:scale(1) translate3d(0,0,0)}}
@keyframes mv-kb-lb{from{transform:scale(1.035)}to{transform:scale(1)}}

/* Notas: portada con zoom lento (Ken Burns) y entrada del título y el crédito */
.mov .nota>figure{overflow:hidden}
.mov .nota>figure img{animation:mv-kb 9s cubic-bezier(.2,.6,.2,1) both;transform-origin:50% 40%;will-change:transform}
.mov .nota>.kick,.mov .nota>h1,.mov .nota>.byline,.mov .nota>figure figcaption{animation:mv-sube .8s cubic-bezier(.2,.7,.2,1) both}
.mov .nota>h1{animation-delay:.12s}.mov .nota>.byline{animation-delay:.24s}.mov .nota>figure figcaption{animation-delay:.5s}
/* Revelado al hacer scroll (párrafos, bloque de datos, fuentes, compartir) */
.mov .rv{opacity:0;transform:translateY(22px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.7,.2,1)}
.mov .rv.vis{opacity:1;transform:none}

/* Lookbook: hover suave sin mover el diseño (solo filtro y sombra interior, nada de tamaño) */
.pz:not(.on)>img.fondo{transition:filter .45s ease}
@media(hover:hover){.pz:not(.on):hover>img.fondo{filter:grayscale(.15) brightness(.92)}
.pz:not(.on):hover::after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 0 2px var(--c);pointer-events:none;z-index:2}}
/* Portada activa: zoom lento y entrada escalonada del texto */
.mov .pz.on>img.fondo{animation:mv-kb-lb 7s cubic-bezier(.2,.6,.2,1) both;transform-origin:100% 50%}
.mov .pz.on .info>*{animation:mv-sube .7s cubic-bezier(.2,.7,.2,1) both}
.mov .pz.on .info>:nth-child(2){animation-delay:.42s}.mov .pz.on .info>:nth-child(3){animation-delay:.52s}
.mov .pz.on .info>:nth-child(4){animation-delay:.62s}.mov .pz.on .info>:nth-child(n+5){animation-delay:.72s}
.mov .pz.on .info>:first-child{animation-delay:.32s}

@media(prefers-reduced-motion:reduce){
.mov .nota>figure img,.mov .nota>*,.mov .nota>figure figcaption,.mov .pz.on>img.fondo,.mov .pz.on .info>*{animation:none!important}
.mov .rv{opacity:1!important;transform:none!important;transition:none!important}}
