/* ============================================================
   animations.css  |  Scroll reveal & keyframe animations
   ============================================================ */

/* ---------- Scroll reveal ---------- */
[data-reveal] {
  opacity: 0;
  transform: translateY(38px);
  transition: opacity .8s cubic-bezier(.22,.61,.36,1), transform .8s cubic-bezier(.22,.61,.36,1);
  will-change: opacity, transform;
}
[data-reveal].in { opacity: 1; transform: none; }

[data-reveal="left"]  { transform: translateX(-48px); }
[data-reveal="right"] { transform: translateX(48px); }
[data-reveal="zoom"]  { transform: scale(.9); }
[data-reveal="left"].in,
[data-reveal="right"].in,
[data-reveal="zoom"].in { transform: none; }

/* Stagger delays */
[data-delay="1"] { transition-delay: .1s; }
[data-delay="2"] { transition-delay: .2s; }
[data-delay="3"] { transition-delay: .3s; }
[data-delay="4"] { transition-delay: .4s; }
[data-delay="5"] { transition-delay: .5s; }
[data-delay="6"] { transition-delay: .6s; }

/* ---------- Floating ---------- */
@keyframes float { 0%,100%{ transform: translateY(0);} 50%{ transform: translateY(-14px);} }
.floating { animation: float 5s ease-in-out infinite; }

/* ---------- Fade in up (loaders / hero) ---------- */
@keyframes fadeUp { from{ opacity:0; transform: translateY(30px);} to{ opacity:1; transform:none;} }
.fade-up { animation: fadeUp .9s var(--ease) both; }
.d1{ animation-delay:.15s; } .d2{ animation-delay:.3s; } .d3{ animation-delay:.45s; }
.d4{ animation-delay:.6s; } .d5{ animation-delay:.75s; }

/* ---------- Gradient shift ---------- */
@keyframes gradientShift { 0%{ background-position:0% 50%;} 50%{ background-position:100% 50%;} 100%{ background-position:0% 50%;} }
.grad-animate { background-size: 200% 200%; animation: gradientShift 8s ease infinite; }

/* ---------- Shine ---------- */
@keyframes shine { to { left: 130%; } }
.shine { position: relative; overflow: hidden; }
.shine::before {
  content:''; position:absolute; top:0; left:-60%; width:40%; height:100%;
  background: linear-gradient(120deg, transparent, rgba(255,255,255,.35), transparent);
  transform: skewX(-20deg);
}
.shine:hover::before { animation: shine .9s ease; }

/* ---------- Bounce arrow ---------- */
@keyframes bob { 0%,100%{ transform: translateY(0);} 50%{ transform: translateY(6px);} }
.bob { animation: bob 1.8s ease-in-out infinite; }

/* ---------- Count pop ---------- */
@keyframes pop { 0%{ transform: scale(.9);} 60%{ transform: scale(1.06);} 100%{ transform: scale(1);} }
.pop { animation: pop .5s var(--ease); }

/* Reduce motion */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
  [data-reveal] { opacity: 1 !important; transform: none !important; }
}
