/* ==========================================================================
   Get reVAmp HQ — Animations
   Keyframes + scroll-reveal utility classes (driven by animations.js).
   ========================================================================== */

/* ---- Keyframes ---- */
@keyframes gradientShift {
  0%, 100% { background-position: 0% 50%; }
  50%      { background-position: 100% 50%; }
}

@keyframes blobFloat {
  0%, 100% { transform: translate(0, 0) scale(1); }
  33%      { transform: translate(40px, -30px) scale(1.08); }
  66%      { transform: translate(-30px, 24px) scale(0.94); }
}

@keyframes floatY {
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(-14px); }
}

@keyframes blink {
  0%, 100% { opacity: 1; }
  50%      { opacity: 0; }
}

@keyframes marquee {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}

@keyframes ripple {
  to { transform: scale(4); opacity: 0; }
}

@keyframes pulseSoft {
  0%, 100% { opacity: 1; }
  50%      { opacity: 0.35; }
}

@keyframes growBar {
  from { width: 0; }
}

@keyframes spinSlow {
  to { transform: rotate(360deg); }
}

/* ==========================================================================
   Scroll Reveal
   Elements with [data-reveal] start hidden and animate in when
   IntersectionObserver (animations.js) adds .is-revealed.
   ========================================================================== */
[data-reveal] {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity var(--speed-slow) var(--ease), transform var(--speed-slow) var(--ease);
  transition-delay: var(--reveal-delay, 0ms);
  will-change: opacity, transform;
}
[data-reveal="left"]  { transform: translateX(-36px); }
[data-reveal="right"] { transform: translateX(36px); }
[data-reveal="zoom"]  { transform: scale(0.92); }

[data-reveal].is-revealed {
  opacity: 1;
  transform: none;
}

/* Stagger helpers — set per-child delays inside a revealed group */
[data-reveal-group] > * { --reveal-delay: 0ms; }
[data-reveal-group] > *:nth-child(2) { --reveal-delay: 90ms; }
[data-reveal-group] > *:nth-child(3) { --reveal-delay: 180ms; }
[data-reveal-group] > *:nth-child(4) { --reveal-delay: 270ms; }
[data-reveal-group] > *:nth-child(5) { --reveal-delay: 360ms; }
[data-reveal-group] > *:nth-child(6) { --reveal-delay: 450ms; }

/* Hover lift utility */
.hover-lift { transition: transform var(--speed) var(--ease), box-shadow var(--speed) var(--ease); }
.hover-lift:hover { transform: translateY(-6px); box-shadow: var(--shadow-lg); }

/* Parallax layers — translated by animations.js on mousemove */
[data-parallax] { will-change: transform; }

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


/* ---- Motion graphics keyframes ---- */
@keyframes spinReverse {
  to { transform: rotate(-360deg); }
}

/* AI "typing" skeleton lines: grow, hold, reset */
@keyframes lineType {
  0%       { width: 0; opacity: 0.9; }
  35%      { width: 100%; opacity: 0.9; }
  78%      { width: 100%; opacity: 0.9; }
  92%      { width: 100%; opacity: 0.15; }
  100%     { width: 0; opacity: 0.9; }
}

/* Engagement icons pop after the post "publishes" */
@keyframes popBeat {
  0%, 55%, 100% { transform: scale(1); }
  62%           { transform: scale(1.45); }
  70%           { transform: scale(1); }
  76%           { transform: scale(1.2); }
  82%           { transform: scale(1); }
}
