/* ===== FOOTER BASE ===== */
.footer {
  background: linear-gradient(135deg, #1C1B3A, #0f0e26);
  color: #fff;
  position: relative;
  overflow: hidden;
  font-family: 'Poppins', sans-serif;
}

/* Soft glowing effect */
.footer::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at center, rgba(255,255,255,0.08), transparent 70%);
  z-index: 0;
}

/* ===== WAVE SHAPE ===== */
.footer-wave svg path {
  fill: #f68a0a;
}

/* ===== FOOTER CONTENT ===== */
.footer-content {
  position: relative;
  z-index: 2;
}

.footer-content p {
  font-size: 15px;
  letter-spacing: 1px;
  opacity: 0.85;
  margin-bottom: 18px;
}

/* ===== MUSIC NOTES ===== */
.footer-music {
  display: flex;
  justify-content: center;
  gap: 18px;
}

/* Individual notes */
.footer-music .note {
  font-size: 26px;
  color: #ffcc70;
  text-shadow: 0 0 10px rgba(255, 204, 112, 0.6);
  animation: floatNotes 2.2s ease-in-out infinite;
  cursor: default;
}

/* Delay for wave animation */
.footer-music .note:nth-child(2) { animation-delay: 0.3s; }
.footer-music .note:nth-child(3) { animation-delay: 0.6s; }
.footer-music .note:nth-child(4) { animation-delay: 0.9s; }

/* ===== NOTE ANIMATION ===== */
@keyframes floatNotes {
  0% {
    transform: translateY(0) scale(1);
    opacity: 0.7;
  }
  50% {
    transform: translateY(-14px) scale(1.15);
    opacity: 1;
  }
  100% {
    transform: translateY(0) scale(1);
    opacity: 0.7;
  }
}

/* ===== HOVER MAGIC ===== */
.footer-music .note:hover {
  color: #ff7a18;
  text-shadow: 0 0 18px rgba(255, 122, 24, 0.9);
  transform: scale(1.4);
  transition: all 0.3s ease;
}

/* ===== RESPONSIVE ===== */
@media (max-width: 768px) {
  .footer-content p {
    font-size: 14px;
  }
  .footer-music .note {
    font-size: 22px;
  }
}