/* ===========================================================
   Radiomex — Animaciones de las imágenes del constructor de banner
   Las usan el sitio (.rm-bnr.is-in) y el editor del panel (.bnr-layer.is-play).
   --d = retraso de cada imagen (lo define el panel).
   =========================================================== */
.bnr-anim{--d:0s;--bnr-ease:cubic-bezier(.2,.8,.2,1)}

/* Antes de entrar a pantalla, las de "entrada" esperan ocultas.
   Sólo si hay JavaScript (html.rm-js): sin JS se ven normales. */
.rm-js .rm-bnr.has-anim:not(.is-in) :is(.bnr-anim-aparecer,.bnr-anim-izquierda,.bnr-anim-derecha,.bnr-anim-abajo,.bnr-anim-arriba,
  .bnr-anim-acercar,.bnr-anim-alejar,.bnr-anim-rebote,.bnr-anim-girar,.bnr-anim-voltear,.bnr-anim-enfocar){opacity:0}

/* ---- entrada (una vez) ---- */
:is(.rm-bnr.is-in .bnr-anim-aparecer, .bnr-anim-aparecer.is-play){animation:bnrFade .9s var(--bnr-ease) var(--d) both}
:is(.rm-bnr.is-in .bnr-anim-izquierda, .bnr-anim-izquierda.is-play){animation:bnrLeft .9s var(--bnr-ease) var(--d) both}
:is(.rm-bnr.is-in .bnr-anim-derecha, .bnr-anim-derecha.is-play){animation:bnrRight .9s var(--bnr-ease) var(--d) both}
:is(.rm-bnr.is-in .bnr-anim-abajo, .bnr-anim-abajo.is-play){animation:bnrUp .9s var(--bnr-ease) var(--d) both}
:is(.rm-bnr.is-in .bnr-anim-arriba, .bnr-anim-arriba.is-play){animation:bnrDown .9s var(--bnr-ease) var(--d) both}
:is(.rm-bnr.is-in .bnr-anim-acercar, .bnr-anim-acercar.is-play){animation:bnrZoomIn .9s var(--bnr-ease) var(--d) both}
:is(.rm-bnr.is-in .bnr-anim-alejar, .bnr-anim-alejar.is-play){animation:bnrZoomOut .9s var(--bnr-ease) var(--d) both}
:is(.rm-bnr.is-in .bnr-anim-rebote, .bnr-anim-rebote.is-play){animation:bnrBounce 1s cubic-bezier(.28,.84,.42,1) var(--d) both}
:is(.rm-bnr.is-in .bnr-anim-girar, .bnr-anim-girar.is-play){animation:bnrSpin .9s var(--bnr-ease) var(--d) both}
:is(.rm-bnr.is-in .bnr-anim-voltear, .bnr-anim-voltear.is-play){animation:bnrFlip .9s var(--bnr-ease) var(--d) both}
:is(.rm-bnr.is-in .bnr-anim-enfocar, .bnr-anim-enfocar.is-play){animation:bnrFocus 1s ease-out var(--d) both}

@keyframes bnrFade{from{opacity:0}to{opacity:1}}
@keyframes bnrLeft{from{opacity:0;transform:translateX(-60%)}to{opacity:1;transform:none}}
@keyframes bnrRight{from{opacity:0;transform:translateX(60%)}to{opacity:1;transform:none}}
@keyframes bnrUp{from{opacity:0;transform:translateY(45%)}to{opacity:1;transform:none}}
@keyframes bnrDown{from{opacity:0;transform:translateY(-45%)}to{opacity:1;transform:none}}
@keyframes bnrZoomIn{from{opacity:0;transform:scale(.55)}to{opacity:1;transform:none}}
@keyframes bnrZoomOut{from{opacity:0;transform:scale(1.4)}to{opacity:1;transform:none}}
@keyframes bnrBounce{0%{opacity:0;transform:scale(.3)}50%{opacity:1;transform:scale(1.08)}72%{transform:scale(.95)}88%{transform:scale(1.02)}100%{opacity:1;transform:none}}
@keyframes bnrSpin{from{opacity:0;transform:rotate(-25deg) scale(.7)}to{opacity:1;transform:none}}
@keyframes bnrFlip{from{opacity:0;transform:perspective(800px) rotateY(80deg)}to{opacity:1;transform:perspective(800px) rotateY(0)}}
@keyframes bnrFocus{from{opacity:0;filter:blur(14px);transform:scale(1.06)}to{opacity:1;filter:none;transform:none}}

/* ---- continuas (mientras está a la vista) ---- */
:is(.rm-bnr.is-in .bnr-anim-flotar, .bnr-anim-flotar.is-play){animation:bnrFloat 3.2s ease-in-out var(--d) infinite alternate}
:is(.rm-bnr.is-in .bnr-anim-latido, .bnr-anim-latido.is-play){animation:bnrBeat 1.6s ease-in-out var(--d) infinite}
:is(.rm-bnr.is-in .bnr-anim-balanceo, .bnr-anim-balanceo.is-play){transform-origin:50% 100%;animation:bnrSway 2.6s ease-in-out var(--d) infinite alternate}
@keyframes bnrFloat{from{transform:translateY(0)}to{transform:translateY(-5%)}}
@keyframes bnrBeat{0%,100%{transform:scale(1)}30%{transform:scale(1.06)}45%{transform:scale(.99)}}
@keyframes bnrSway{from{transform:rotate(-3deg)}to{transform:rotate(3deg)}}

@media (prefers-reduced-motion:reduce){
  .bnr-anim,.bnr-anim.is-play,.rm-bnr.is-in .bnr-anim{animation:none!important;opacity:1!important;transform:none!important;filter:none!important}
}