@keyframes float {
  0%   { transform: translateY(0px); }
  50%  { transform: translateY(-10px); }
  100% { transform: translateY(0px); }
}

.filter-icon:nth-child(1) { animation-delay: 0s; }
.filter-icon:nth-child(2) { animation-delay: 0.5s; }
.filter-icon:nth-child(3) { animation-delay: 1s; }
.filter-icon:nth-child(4) { animation-delay: 1.5s; }
.filter-icon:nth-child(5) { animation-delay: 2s; }
.filter-icon:nth-child(6) { animation-delay: 2.5s; }
@keyframes satelliteFloat {
  0% {
    transform: translateY(0px) rotate(0deg);
  }
  25% {
    transform: translateY(-5px) rotate(2deg);
  }
  50% {
    transform: translateY(-10px) rotate(-2deg);
  }
  75% {
    transform: translateY(-5px) rotate(2deg);
  }
  100% {
    transform: translateY(0px) rotate(0deg);
  }
}

.filter-icon {
  animation: satelliteFloat 1s ease-in-out infinite;
  display: inline-block;
}
.filter-icon:nth-child(1) { animation-delay: 0s; }
.filter-icon:nth-child(2) { animation-delay: 0.5s; }
.filter-icon:nth-child(3) { animation-delay: 1s; }
.filter-icon:nth-child(4) { animation-delay: 1.5s; }
.filter-icon:nth-child(5) { animation-delay: 2s; }
.filter-icon {
  box-shadow: 0 0 10px #00f0ff, 0 0 20px #00f0ff;
  border-radius: 50%; /* if you're using circular icons */
}
.floating-astronaut {
  position: fixed;
  width: 100px; /* Adjust size */
  opacity: 0.7; /* Subtle effect */
  z-index: 0;
  pointer-events: none;
  animation: gentleFloat 4s ease-in-out infinite;
  mix-blend-mode: screen;
}

@keyframes gentleFloat {
  0%, 100% { transform: translateY(0px); }
  50% { transform: translateY(-10px); }
}