
/* ---------- animated gradient text utilities ---------- */
@layer utilities {
  .text-glow {
    --tg-angle: 270deg;
    --tg-stops: #a78bfa, #f472b6, #60a5fa, #facc15, #ec4899, #8b5cf6;
    background-image: linear-gradient(var(--tg-angle), var(--tg-stops));
    background-size: 800% 800%;
    -webkit-background-clip: text;
            background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
    animation: glowPulse 12s ease-in-out infinite;
    will-change: background-position;
  }

  /* модификаторы скорости (по желанию) */
  @layer utilities{
    .text-glow-slow   { animation-duration: 16s; }
    .text-glow-slower { animation-duration: 36s; }
  }

  .text-glow-blue { --tg-stops: #60a5fa, #a78bfa, #8b5cf6, #22d3ee, #60a5fa; }
  .text-glow-green { --tg-stops: #34d399, #a7f3d0, #22c55e, #86efac, #34d399; }

  @media (prefers-reduced-motion: reduce) {
    .text-glow, .text-glow-slow, .text-glow-fast {
      animation: none;
      background-position: 50% 50%;
    }
  }
}
