/* VYNEX/public/animations.css — CSS-only animations and reduced-motion handling.
   All loops are slow and gentle on purpose. */
@keyframes marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@keyframes floaty { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }
@keyframes pulse-glow { 0%, 100% { opacity: .3; } 50% { opacity: .55; } }
@keyframes shimmer { 0%, 100% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } }
@keyframes drift-a { 0%, 100% { translate: 0 0; } 50% { translate: 40px 30px; } }
@keyframes drift-b { 0%, 100% { translate: 0 0; } 50% { translate: -46px -26px; } }
@keyframes sheen { 0% { transform: translateX(-130%) skewX(-20deg); } 60%, 100% { transform: translateX(260%) skewX(-20deg); } }
@keyframes pop-dot { 0%, 100% { transform: scale(1); opacity: 1; } 50% { transform: scale(1.5); opacity: .6; } }

.float-chip { animation: floaty 9s ease-in-out infinite; }
.chip-b { animation-delay: -4.5s; }
.orb-1, .orb-2, .orb-3 { animation: pulse-glow 16s ease-in-out infinite, drift-a 26s ease-in-out infinite; }
.orb-2 { animation-delay: -8s, -10s; animation-name: pulse-glow, drift-b; }
.orb-3 { animation-delay: -4s, -16s; }
.marquee-track { animation-duration: 70s; }
.marquee:hover .marquee-track { animation-play-state: paused; }

/* Slowly flowing colour on gradient headings */
.gradient-text { animation: shimmer 14s ease-in-out infinite; }

/* Soft light sweep across the main buttons */
.btn-primary { position: relative; overflow: hidden; isolation: isolate; }
.btn-primary::after { content: ""; position: absolute; inset: 0 auto 0 0; width: 40%; background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .28), transparent); transform: translateX(-130%) skewX(-20deg); animation: sheen 7s ease-in-out infinite; z-index: -1; pointer-events: none; }
.hero-meta i { animation: pop-dot 5s ease-in-out infinite; }
.hero-meta span:nth-child(2) i { animation-delay: -1.2s; } .hero-meta span:nth-child(3) i { animation-delay: -2.4s; } .hero-meta span:nth-child(4) i { animation-delay: -3.6s; }
.price-band::after { animation: sheen 9s ease-in-out infinite; }
.card .icon, .inc .inc-ico { transition: transform .9s cubic-bezier(.22, 1, .36, 1); }
.card:hover .icon, .inc:hover .inc-ico { transform: translateY(-3px) rotate(-6deg) scale(1.06); }

/* Initial hidden state is applied only when GSAP is running (class set by animations.js) */
.js-anim [data-reveal], .js-anim [data-stagger] > * { opacity: 0; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
  .marquee-track { animation: none; }
  .js-anim [data-reveal], .js-anim [data-stagger] > * { opacity: 1 !important; }
}
