/* ==================== WANDERING TURTLES ====================
 * Tortugas errantes que cruzan la pantalla aleatoriamente.
 * La tortuga del logo está vista cenitalmente con la cabeza arriba.
 * Cada movimiento orienta la cabeza en la dirección de avance,
 * solo cabeceo natural (±8°), nunca giros completos.
 * Ligero pulse de scale (±3-4%) simula el empuje de las aletas.
 */
.wandering-turtle {
  position: fixed;
  pointer-events: none;
  z-index: 5;
  opacity: 0;
  filter: brightness(0) invert(1) drop-shadow(0 0 8px rgba(229, 255, 0, 0.35));
  will-change: transform, opacity;
}

.wandering-turtle.cruise { left: -80px; animation: turtleCruise linear forwards; }
.wandering-turtle.cruise.reverse { left: auto; right: -80px; animation-name: turtleCruiseReverse; }
.wandering-turtle.bubble { bottom: -80px; animation: turtleBubble ease-in-out forwards; }
.wandering-turtle.fall { top: -80px; animation: turtleFall ease-in-out forwards; }
.wandering-turtle.diagonal { left: -80px; animation: turtleDiagonal ease-in-out forwards; }
.wandering-turtle.diagonal.reverse { left: auto; right: -80px; animation-name: turtleDiagonalReverse; }

@keyframes turtleCruise {
  0%   { transform: translate(0, 0) rotate(86deg) scale(1); opacity: 0; }
  8%   { transform: translate(8vw, -10px) rotate(89deg) scale(1.02); opacity: 0.45; }
  20%  { transform: translate(20vw, -22px) rotate(95deg) scale(1.04); }
  38%  { transform: translate(38vw, 18px) rotate(83deg) scale(0.97); }
  56%  { transform: translate(56vw, -26px) rotate(97deg) scale(1.04); }
  74%  { transform: translate(74vw, 14px) rotate(85deg) scale(0.97); }
  90%  { transform: translate(92vw, -8px) rotate(92deg) scale(1.02); opacity: 0.45; }
  100% { transform: translate(115vw, 0) rotate(90deg) scale(1); opacity: 0; }
}
@keyframes turtleCruiseReverse {
  0%   { transform: translate(0, 0) rotate(-94deg) scale(1); opacity: 0; }
  8%   { transform: translate(-8vw, -10px) rotate(-91deg) scale(1.02); opacity: 0.45; }
  20%  { transform: translate(-20vw, -22px) rotate(-85deg) scale(1.04); }
  38%  { transform: translate(-38vw, 18px) rotate(-97deg) scale(0.97); }
  56%  { transform: translate(-56vw, -26px) rotate(-83deg) scale(1.04); }
  74%  { transform: translate(-74vw, 14px) rotate(-95deg) scale(0.97); }
  90%  { transform: translate(-92vw, -8px) rotate(-88deg) scale(1.02); opacity: 0.45; }
  100% { transform: translate(-115vw, 0) rotate(-90deg) scale(1); opacity: 0; }
}
@keyframes turtleBubble {
  0%   { transform: translate(0, 0) rotate(-3deg) scale(1); opacity: 0; }
  10%  { transform: translate(-4px, -8vh) rotate(2deg) scale(1.02); opacity: 0.4; }
  30%  { transform: translate(-12px, -25vh) rotate(7deg) scale(1.04); }
  55%  { transform: translate(14px, -50vh) rotate(-6deg) scale(0.97); }
  80%  { transform: translate(-9px, -80vh) rotate(5deg) scale(1.03); opacity: 0.35; }
  100% { transform: translate(0, -120vh) rotate(0deg) scale(1); opacity: 0; }
}
@keyframes turtleFall {
  0%   { transform: translate(0, 0) rotate(177deg) scale(1); opacity: 0; }
  10%  { transform: translate(-4px, 8vh) rotate(182deg) scale(1.02); opacity: 0.4; }
  30%  { transform: translate(-12px, 25vh) rotate(186deg) scale(1.04); }
  55%  { transform: translate(14px, 50vh) rotate(173deg) scale(0.97); }
  80%  { transform: translate(-9px, 80vh) rotate(184deg) scale(1.03); opacity: 0.35; }
  100% { transform: translate(0, 120vh) rotate(180deg) scale(1); opacity: 0; }
}
@keyframes turtleDiagonal {
  0%   { transform: translate(0, 0) rotate(130deg) scale(1); opacity: 0; }
  15%  { transform: translate(15vw, 8vh) rotate(133deg) scale(1.03); opacity: 0.4; }
  30%  { transform: translate(30vw, 16vh) rotate(140deg) scale(0.98); }
  45%  { transform: translate(45vw, 25vh) rotate(138deg) scale(1.04); }
  60%  { transform: translate(60vw, 33vh) rotate(132deg) scale(0.97); }
  75%  { transform: translate(85vw, 47vh) rotate(137deg) scale(1.03); opacity: 0.4; }
  100% { transform: translate(115vw, 60vh) rotate(135deg) scale(1); opacity: 0; }
}
@keyframes turtleDiagonalReverse {
  0%   { transform: translate(0, 0) rotate(-50deg) scale(1); opacity: 0; }
  15%  { transform: translate(-15vw, -8vh) rotate(-47deg) scale(1.03); opacity: 0.4; }
  30%  { transform: translate(-30vw, -16vh) rotate(-40deg) scale(0.98); }
  45%  { transform: translate(-45vw, -25vh) rotate(-42deg) scale(1.04); }
  60%  { transform: translate(-60vw, -33vh) rotate(-48deg) scale(0.97); }
  75%  { transform: translate(-85vw, -47vh) rotate(-43deg) scale(1.03); opacity: 0.4; }
  100% { transform: translate(-115vw, -60vh) rotate(-45deg) scale(1); opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .wandering-turtle { display: none !important; }
}