.elementor-1460 .elementor-element.elementor-element-7948004d{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--overlay-opacity:0.5;}.elementor-1460 .elementor-element.elementor-element-7948004d::before, .elementor-1460 .elementor-element.elementor-element-7948004d > .elementor-background-video-container::before, .elementor-1460 .elementor-element.elementor-element-7948004d > .e-con-inner > .elementor-background-video-container::before, .elementor-1460 .elementor-element.elementor-element-7948004d > .elementor-background-slideshow::before, .elementor-1460 .elementor-element.elementor-element-7948004d > .e-con-inner > .elementor-background-slideshow::before, .elementor-1460 .elementor-element.elementor-element-7948004d > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{--background-overlay:'';}.elementor-1460 .elementor-element.elementor-element-4528da56.elementor-element{--align-self:flex-end;}#elementor-popup-modal-1460 .dialog-widget-content{animation-duration:1.2s;background-color:#FFFFFF00;}#elementor-popup-modal-1460 .dialog-message{width:640px;height:auto;}#elementor-popup-modal-1460{justify-content:flex-end;align-items:flex-end;}#elementor-popup-modal-1460 .dialog-close-button{display:flex;}#elementor-popup-modal-1460 .dialog-close-button i{color:#FFFFFF;}#elementor-popup-modal-1460 .dialog-close-button svg{fill:#FFFFFF;}@media(max-width:1024px){#elementor-popup-modal-1460{justify-content:center;}}@media(min-width:768px){.elementor-1460 .elementor-element.elementor-element-7948004d{--width:118.281%;}}@media(max-width:767px){.elementor-1460 .elementor-element.elementor-element-7948004d{--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-1460 .elementor-element.elementor-element-922f7ae{width:100%;max-width:100%;}.elementor-1460 .elementor-element.elementor-element-922f7ae img{width:100%;}#elementor-popup-modal-1460 .dialog-close-button{top:5%;}body:not(.rtl) #elementor-popup-modal-1460 .dialog-close-button{right:2%;}body.rtl #elementor-popup-modal-1460 .dialog-close-button{left:2%;}#elementor-popup-modal-1460 .dialog-widget-content{margin:0px 0px 0px 0px;}#elementor-popup-modal-1460 .dialog-message{padding:0px 0px 0px 0px;}}/* Start custom CSS */<style>
/* 1. Elimina cualquier scroll horizontal en la web */
html, body {
    overflow-x: clip !important;
}

.elementor-popup-modal,
.dialog-widget-content,
.dialog-message {
    overflow: visible !important;
}

/* Contenedor relativo al afiche */
.halloween-bats-screen {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    pointer-events: none !important;
    overflow: visible !important;
    z-index: 9999999 !important;
}

/* Base del murciélago con contraste */
.halloween-bats-screen .bat {
    position: absolute;
    top: 50%;
    left: 50%;
    display: flex;
    align-items: center;
    opacity: 0;
    filter: drop-shadow(0 4px 6px rgba(0, 0, 0, 0.95));
    will-change: transform, opacity;
}

.halloween-bats-screen .bat-body {
    width: 13px;
    height: 28px;
    background: #000000;
    border-radius: 50% 50% 25% 25%;
}

.halloween-bats-screen .wing {
    width: 32px;
    height: 23px;
    background: #000000;
    border-radius: 80% 10% 80% 10%;
    transform-origin: right center;
    animation: batFlapNoScroll 0.14s infinite alternate ease-in-out;
}

.halloween-bats-screen .wing-right {
    transform-origin: left center;
    border-radius: 10% 80% 10% 80%;
}

@keyframes batFlapNoScroll {
    0% { transform: scaleX(1) rotate(22deg); }
    100% { transform: scaleX(0.2) rotate(-45deg); }
}

/* --- TRAYECTORIAS SEGURAS: HACIA EL INTERIOR Y ARRIBA --- */

.bat-1 { animation: flySafe1 2.2s cubic-bezier(0.2, 0.8, 0.3, 1) forwards 0.05s; }
@keyframes flySafe1 {
    0%   { opacity: 0; transform: translate(-50%, -50%) scale(0.3) rotate(-35deg); }
    15%  { opacity: 1; }
    99%  { opacity: 0; transform: translate(-70vw, -85vh) scale(1.3) rotate(-55deg); }
    100% { opacity: 0; transform: translate(-70vw, -85vh) scale(0); display: none; }
}

.bat-2 { animation: flySafe2 2.4s cubic-bezier(0.2, 0.8, 0.3, 1) forwards 0.12s; }
@keyframes flySafe2 {
    0%   { opacity: 0; transform: translate(-50%, -50%) scale(0.35) rotate(-20deg); }
    15%  { opacity: 1; }
    99%  { opacity: 0; transform: translate(-45vw, -95vh) scale(1.15) rotate(-40deg); }
    100% { opacity: 0; transform: translate(-45vw, -95vh) scale(0); display: none; }
}

.bat-3 { animation: flySafe3 2.1s cubic-bezier(0.25, 0.9, 0.4, 1) forwards 0.18s; }
@keyframes flySafe3 {
    0%   { opacity: 0; transform: translate(-50%, -50%) scale(0.3) rotate(-5deg); }
    15%  { opacity: 1; }
    99%  { opacity: 0; transform: translate(-10vw, -100vh) scale(1.25) rotate(-15deg); }
    100% { opacity: 0; transform: translate(-10vw, -100vh) scale(0); display: none; }
}

.bat-4 { animation: flySafe4 2.3s cubic-bezier(0.2, 0.8, 0.3, 1) forwards 0.22s; }
@keyframes flySafe4 {
    0%   { opacity: 0; transform: translate(-50%, -50%) scale(0.3) rotate(-15deg); }
    15%  { opacity: 1; }
    99%  { opacity: 0; transform: translate(-25vw, -80vh) scale(1.2) rotate(-30deg); }
    100% { opacity: 0; transform: translate(-25vw, -80vh) scale(0); display: none; }
}

.bat-5 { animation: flySafe5 2.5s ease-out forwards 0.28s; }
@keyframes flySafe5 {
    0%   { opacity: 0; transform: translate(-50%, -50%) scale(0.25) rotate(-65deg); }
    18%  { opacity: 1; }
    99%  { opacity: 0; transform: translate(-80vw, -45vh) scale(1.1) rotate(-85deg); }
    100% { opacity: 0; transform: translate(-80vw, -45vh) scale(0); display: none; }
}

.bat-6 { animation: flySafe6 2.6s ease-out forwards 0.32s; }
@keyframes flySafe6 {
    0%   { opacity: 0; transform: translate(-50%, -50%) scale(0.3) rotate(-50deg); }
    15%  { opacity: 1; }
    99%  { opacity: 0; transform: translate(-60vw, -65vh) scale(1.05) rotate(-60deg); }
    100% { opacity: 0; transform: translate(-60vw, -65vh) scale(0); display: none; }
}

.bat-7 { animation: flySafe7 2.2s cubic-bezier(0.15, 0.85, 0.35, 1) forwards 0.38s; }
@keyframes flySafe7 {
    0%   { opacity: 0; transform: translate(-50%, -50%) scale(0.25) rotate(-10deg); }
    15%  { opacity: 1; }
    99%  { opacity: 0; transform: translate(-30vw, -90vh) scale(1.35) rotate(-25deg); }
    100% { opacity: 0; transform: translate(-30vw, -90vh) scale(0); display: none; }
}

.bat-8 { animation: flySafe8 2.4s ease-out forwards 0.42s; }
@keyframes flySafe8 {
    0%   { opacity: 0; transform: translate(-50%, -50%) scale(0.25) rotate(-35deg); }
    15%  { opacity: 1; }
    99%  { opacity: 0; transform: translate(-50vw, -55vh) scale(1) rotate(-45deg); }
    100% { opacity: 0; transform: translate(-50vw, -55vh) scale(0); display: none; }
}

.bat-9 { animation: flySafe9 2.5s cubic-bezier(0.2, 0.8, 0.2, 1) forwards 0.48s; }
@keyframes flySafe9 {
    0%   { opacity: 0; transform: translate(-50%, -50%) scale(0.25) rotate(-30deg); }
    15%  { opacity: 1; }
    99%  { opacity: 0; transform: translate(-35vw, -75vh) scale(1.1) rotate(-45deg); }
    100% { opacity: 0; transform: translate(-35vw, -75vh) scale(0); display: none; }
}

.bat-10 { animation: flySafe10 2.7s cubic-bezier(0.2, 0.9, 0.3, 1) forwards 0.55s; }
@keyframes flySafe10 {
    0%   { opacity: 0; transform: translate(-50%, -50%) scale(0.3) rotate(-5deg); }
    15%  { opacity: 1; }
    99%  { opacity: 0; transform: translate(-18vw, -95vh) scale(1.4) rotate(-15deg); }
    100% { opacity: 0; transform: translate(-18vw, -95vh) scale(0); display: none; }
}
</style>

<div class="halloween-bats-screen">
  <div class="bat bat-1"><div class="wing wing-left"></div><div class="bat-body"></div><div class="wing wing-right"></div></div>
  <div class="bat bat-2"><div class="wing wing-left"></div><div class="bat-body"></div><div class="wing wing-right"></div></div>
  <div class="bat bat-3"><div class="wing wing-left"></div><div class="bat-body"></div><div class="wing wing-right"></div></div>
  <div class="bat bat-4"><div class="wing wing-left"></div><div class="bat-body"></div><div class="wing wing-right"></div></div>
  <div class="bat bat-5"><div class="wing wing-left"></div><div class="bat-body"></div><div class="wing wing-right"></div></div>
  <div class="bat bat-6"><div class="wing wing-left"></div><div class="bat-body"></div><div class="wing wing-right"></div></div>
  <div class="bat bat-7"><div class="wing wing-left"></div><div class="bat-body"></div><div class="wing wing-right"></div></div>
  <div class="bat bat-8"><div class="wing wing-left"></div><div class="bat-body"></div><div class="wing wing-right"></div></div>
  <div class="bat bat-9"><div class="wing wing-left"></div><div class="bat-body"></div><div class="wing wing-right"></div></div>
  <div class="bat bat-10"><div class="wing wing-left"></div><div class="bat-body"></div><div class="wing wing-right"></div></div>
</div>/* End custom CSS */