/**
 * Gradient Shimmer text - adapted from 21st @mona_biasia/gradient-shimmer
 * for COZQ homepage brand marks (PHP / CSS / light JS).
 */

.gradient-shimmer,
.hero-neon__brand.gradient-shimmer,
.home-close__brand.gradient-shimmer,
body.has-tubes-live .hero-neon__brand.gradient-shimmer,
body.has-tubes-live .home-close__brand.gradient-shimmer {
  --gs-angle: 105deg;
  --gs-duration: 2.6s;
  --gs-ease: cubic-bezier(0.4, 0, 0.2, 1);
  display: inline-block;
  background-image: linear-gradient(
    var(--gs-angle),
    #ffffff 0%,
    #ffffff 32%,
    #ffb088 42%,
    #ff4d20 50%,
    #ff8a5b 58%,
    #ffffff 68%,
    #ffffff 100%
  );
  background-size: 280% 100%;
  background-position: 100% 50%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent !important;
  -webkit-text-fill-color: transparent;
  text-shadow: none !important;
  animation: cozq-gradient-shimmer var(--gs-duration) var(--gs-ease) infinite;
  will-change: background-position;
}

.gradient-shimmer.is-paused {
  animation-play-state: paused;
}

@keyframes cozq-gradient-shimmer {
  0% {
    background-position: 100% 50%;
  }
  55% {
    background-position: 0% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .gradient-shimmer,
  .hero-neon__brand.gradient-shimmer,
  .home-close__brand.gradient-shimmer,
  body.has-tubes-live .hero-neon__brand.gradient-shimmer,
  body.has-tubes-live .home-close__brand.gradient-shimmer {
    animation: none;
    background-image: linear-gradient(
      105deg,
      #ffffff 0%,
      #ffb088 40%,
      #ff4d20 55%,
      #ffffff 100%
    );
    background-size: 100% 100%;
    background-position: center;
  }
}