/* anim.css — animaciones de entrada estilo "clip reveal" (adaptadas de Neuros).
   Contrato Elementor: el elemento recibe la clase de animación + `animated` al entrar
   en viewport. En el mockup, ui.js replica ese contrato con IntersectionObserver. */

@keyframes bwClipUp    { from { clip-path: inset(100% 0 0 0); } to { clip-path: inset(0 0 0 0); } }
@keyframes bwClipDown  { from { clip-path: inset(0 0 100% 0); } to { clip-path: inset(0 0 0 0); } }
@keyframes bwClipLeft  { from { clip-path: inset(0 0 0 100%); } to { clip-path: inset(0 0 0 0); } }
@keyframes bwClipRight { from { clip-path: inset(0 100% 0 0); } to { clip-path: inset(0 0 0 0); } }
@keyframes bwHeadingUp { from { transform: translateY(120%); } to { transform: translateY(0); } }
@keyframes bwFadeIn    { from { opacity: 0; } to { opacity: 1; } }
@keyframes bwPulsate   { 0% { transform: scale(.9); opacity: .8; } 50% { transform: scale(1.08); opacity: .25; } 100% { transform: scale(.9); opacity: .8; } }

/* Clips — la clase la pone Elementor (dropdown) o ui.js (mockup) */
.bw_clip_up.animated    { animation: bwClipUp    .9s var(--eo) both; }
.bw_clip_down.animated  { animation: bwClipDown  .9s var(--eo) both; }
.bw_clip_left.animated  { animation: bwClipLeft  .9s var(--eo) both; }
.bw_clip_right.animated { animation: bwClipRight .9s var(--eo) both; }

/* Estado inicial SOLO mockup (Elementor usa .elementor-invisible).
   opacity (no clip-path ni visibility): clip-path de área cero colapsa el box del
   IntersectionObserver a una línea que puede caer fuera del viewport (nunca dispara),
   y visibility:hidden directamente impide la intersección en Chromium. */
[data-bw-anim]:not(.animated) { opacity: 0; }

/* Heading reveal por palabra/letra — bw3d.js envuelve en .bw-word > .bw-letter */
.bw-word   { display: inline-block; overflow: hidden; vertical-align: top; }
.bw-letter { display: inline-block; }
[data-bw-heading] .bw-letter { opacity: 0; transform: translateY(120%); }
.bw_heading_animation.animated .bw-letter,
[data-bw-heading].animated .bw-letter {
  /* el stagger lo pone ui.js como animation-delay inline (gana al shorthand) */
  animation: bwFadeIn .35s forwards, bwHeadingUp .7s var(--espring) forwards;
}

@media (prefers-reduced-motion: reduce) {
  .bw_clip_up.animated, .bw_clip_down.animated, .bw_clip_left.animated, .bw_clip_right.animated { animation: none; }
  [data-bw-anim]:not(.animated) { opacity: 1; }
  .bw-letter { opacity: 1; transform: none; animation: none !important; }
}

/* ---- Marquee (.bw-marquee): emula el movimiento de neuros_special_text.
   bw3d.js envuelve el contenido en .bw-marquee__track (x2 copias) y esto lo desplaza en loop sin corte.
   La rotación/bg de la barra quedan en el widget; acá solo se mueve el texto interno. ---- */
.bw-marquee .elementor-widget-container{ overflow:hidden; }
.bw-marquee .bw-marquee__track{ display:flex; flex-wrap:nowrap; width:max-content; will-change:transform; animation:bwMarqueeX var(--bw-mq-dur,20s) linear infinite; font-size:inherit; line-height:inherit; }
.bw-marquee .bw-marquee__item{ flex:0 0 auto; white-space:nowrap; padding-right:.5em; font-size:inherit; line-height:inherit; }
/* font-size:inherit fuerza la herencia del 80px del widget (vence el reset p{} del tema) */
.bw-marquee .bw-marquee__item > p{ margin:0; display:inline-block; white-space:nowrap; font-size:inherit; line-height:inherit; color:inherit; }
@keyframes bwMarqueeX{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }
@media (prefers-reduced-motion: reduce){ .bw-marquee .bw-marquee__track{ animation:none; } }