.hero-banner h1 {
  text-shadow: 2px 2px 6px rgba(0,0,0,0.7);
}

.scroll-container {
  position: relative;
  width: 100%;
  height: 50px;
  overflow: hidden;
  background: #392766;
  border-top: 2px solid #0d6efd;
  border-bottom: 2px solid #0d6efd;
}

.scroll-text {
  display: inline-block;
  white-space: nowrap;
  padding-left: 100%;
  animation: scroll-left 66s linear infinite; /* adjust speed */
  
  /* ✅ Gradient text styling */
  background: linear-gradient(90deg, #ff6b6b, #feca57, #48dbfb, #1dd1a1);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;

  font-family: 'Poppins', sans-serif; /* custom font */
  font-size: 22px;
  font-weight: 700;
  line-height: 50px;
}

.scroll-text:hover {
  animation-play-state: paused; /* pause on hover */
}

@keyframes scroll-left {
  from { transform: translateX(0); }
  to   { transform: translateX(-100%); }
}