/* Bouncing Arrow Styles */
.scroll-down {
  position: absolute;
  bottom: 40px;
  left: 50%;
  z-index: 3;
  transform: translateX(-50%);
}

.scroll-down i {
  font-size: 30px;
  color: white;
  display: block;
  animation: smooth-bounce 2s ease-in-out infinite;
  transform-origin: center bottom;
  transition: transform 0.4s ease;
}

.scroll-down:hover i {
  transform: scale(1.2) translateY(-5px);
  animation-play-state: paused;
}

/* Modern Smooth Bounce Animation */
@keyframes smooth-bounce {
  0% {
    transform: translateY(0);
  }
  30% {
    transform: translateY(-15px);
  }
  50% {
    transform: translateY(0);
  }
  70% {
    transform: translateY(-8px);
  }
  100% {
    transform: translateY(0);
  }
}