.z-marquee {
  overflow: hidden;
  white-space: nowrap;
  position: relative;
  font-size: 22px;
  font-weight: 700;
  text-transform: uppercase;
}

.z-marquee span {
  display: inline-block;
  padding-left: 100%;
  animation: marquee-left 20s linear infinite;
}

/* Chạy ngược chiều */
.z-marquee.marquee-right span {
  animation-name: marquee-right;
}

@keyframes marquee-left {
  0% { transform: translateX(0); }
  100% { transform: translateX(-100%); }
}

@keyframes marquee-right {
  0% { transform: translateX(-100%); }
  100% { transform: translateX(0); }
}

/* Dừng khi hover */
.z-marquee:hover span {
  animation-play-state: paused;
}