.bt-halloween-position { position: relative; }
#bt-halloween-sky { position: absolute; left: 0; width: 100%; overflow: hidden; pointer-events: none; z-index: 20; }
#bt-halloween-sky img {
  --bt-byte-bob: 10px;
  display: block; position: absolute; left: -140px; top: calc(50% - 37px);
  width: 110px; height: auto; max-width: none; pointer-events: none; opacity: 0;
  animation: bt-halloween-roundtrip 50s linear 4s infinite;
}
/* 18 s de ida, 7 s de pausa, 18 s de volta, 7 s de pausa. */
@keyframes bt-halloween-roundtrip {
  0% { transform: translate(0, 0) scaleX(1); opacity: 1; }
  9% { transform: translate(calc(25vw + 35px), var(--bt-byte-bob)) scaleX(1) rotate(3deg); opacity: 1; }
  18% { transform: translate(calc(50vw + 70px), calc(-1 * var(--bt-byte-bob))) scaleX(1) rotate(-3deg); opacity: 1; }
  27% { transform: translate(calc(75vw + 105px), var(--bt-byte-bob)) scaleX(1) rotate(2deg); opacity: 1; }
  36% { transform: translate(calc(100vw + 140px), 0) scaleX(1); opacity: 1; }
  36.001%, 50% { transform: translate(calc(100vw + 140px), 0) scaleX(-1); opacity: 1; }
  59% { transform: translate(calc(75vw + 105px), calc(-1 * var(--bt-byte-bob))) scaleX(-1) rotate(3deg); opacity: 1; }
  68% { transform: translate(calc(50vw + 70px), var(--bt-byte-bob)) scaleX(-1) rotate(-3deg); opacity: 1; }
  77% { transform: translate(calc(25vw + 35px), calc(-1 * var(--bt-byte-bob))) scaleX(-1) rotate(2deg); opacity: 1; }
  86% { transform: translate(0, 0) scaleX(-1); opacity: 1; }
  86.001%, 100% { transform: translate(0, 0) scaleX(1); opacity: 1; }
}
@media (max-width: 767px) {
  #bt-halloween-sky img { --bt-byte-bob: 3px; width: 64px; top: calc(50% - 22px); }
}
@media (prefers-reduced-motion: reduce) { #bt-halloween-sky { display: none; } }
