/* =================================================================
   animations.css — v2 keyframes (scoped under html.v2 selectors)
   Loaded only from index.html. Keep additions surgical.
   ================================================================= */

/* Logo mark — slow rotation */
@keyframes v2LogoSpin {
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}

/* AI badge dot — breathing pulse */
@keyframes v2BadgePulse {
  0%, 100% { transform: scale(1);   opacity: 1;   }
  50%      { transform: scale(1.6); opacity: 0.4; }
}
@keyframes v2BadgeRing {
  0%   { transform: scale(0.6); opacity: 0.7; }
  100% { transform: scale(2.2); opacity: 0;   }
}

/* Hero — drifting radial behind text */
@keyframes v2HeroDrift {
  0%   { transform: translate3d(-3%, -2%, 0) rotate(0deg); }
  50%  { transform: translate3d( 4%,  3%, 0) rotate(180deg); }
  100% { transform: translate3d(-3%, -2%, 0) rotate(360deg); }
}

/* Hero h1 — clip-path mask reveal upward, per line */
@keyframes v2LineReveal {
  from { clip-path: inset(0 0 100% 0); }
  to   { clip-path: inset(0 0 0% 0);   }
}

/* Em underline — draws from left */
@keyframes v2UnderlineDraw {
  from { transform: scaleX(0); }
  to   { transform: scaleX(1); }
}

/* Scroll indicator dot — travels down the rule */
@keyframes v2ScrollDot {
  0%   { transform: translateY(-4px); opacity: 0;   }
  20%  { opacity: 1; }
  80%  { opacity: 1; }
  100% { transform: translateY(40px); opacity: 0;   }
}

/* Marquee — continuous horizontal scroll */
@keyframes v2Marquee {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}

/* Sparkle (✦) — slow rotation for marquee separators */
@keyframes v2Sparkle {
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}

/* Mobile menu links — fade-up stagger */
@keyframes v2NavLinkIn {
  from { opacity: 0; transform: translateY(16px); }
  to   { opacity: 1; transform: translateY(0);    }
}

/* Chat typing indicator dots */
@keyframes v2TypingDot {
  0%, 80%, 100% { opacity: 0.3; transform: translateY(0);    }
  40%           { opacity: 1;   transform: translateY(-3px); }
}