/* Cosmic aurora animation for the header (.cloud-container) */
.cloud-container::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: radial-gradient(
    circle at 50% 50%,
    rgba(74, 158, 255, 0.6) 0%,
    rgba(139, 92, 246, 0.4) 30%,
    rgba(103, 126, 234, 0.3) 50%,
    transparent 70%
  );
  opacity: 0.7;
  z-index: -1; /* Behind header content but above background */
  border-radius: 20px; /* Match .cloud-container's border-radius */
  pointer-events: none;
  animation: cosmicHeaderPulse 6s ease-in-out infinite;
}

@keyframes cosmicHeaderPulse {
  0%, 100% {
    transform: scale(1);
    opacity: 0.7;
  }
  33% {
    transform: scale(1.1);
    opacity: 0.9;
  }
  66% {
    transform: scale(1.2);
    opacity: 0.8;
  }
}

/* Respect accessibility preferences */
@media (prefers-reduced-motion: reduce) {
  .cloud-container::before {
    animation: none;
    opacity: 0.7;
    transform: scale(1);
  }
}