/* ---------- blob drift ---------- */

@keyframes blob-drift-1 {
  0%, 100% { transform: translate(0, 0) scale(1); }
  25% { transform: translate(220px, 140px) scale(1.15); }
  50% { transform: translate(120px, 280px) scale(0.9); }
  75% { transform: translate(-140px, 100px) scale(1.05); }
}

@keyframes blob-drift-2 {
  0%, 100% { transform: translate(0, 0) scale(1); }
  33% { transform: translate(-260px, 160px) scale(1.2); }
  66% { transform: translate(-140px, -150px) scale(0.92); }
}

@keyframes blob-drift-3 {
  0%, 100% { transform: translate(0, 0) scale(1); }
  33% { transform: translate(220px, -180px) scale(1.12); }
  66% { transform: translate(-120px, -100px) scale(0.95); }
}

/* ---------- marquee scroll ---------- */

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

/* ---------- typewriter caret ---------- */

@keyframes caret-blink {
  50% { opacity: 0; }
}

/* ---------- content social media card ---------- */

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

@keyframes battery-drain {
  0% { width: 100%; }
  70% { width: 22%; }
  85% { width: 22%; }
  100% { width: 100%; }
}

/* ---------- meta ads card ---------- */

@keyframes metaads-fill-area {
  0%, 20% { opacity: 0; }
  60%, 100% { opacity: 1; }
}

@keyframes metaads-draw-line {
  to { stroke-dashoffset: 0; }
}

@keyframes metaads-dot-appear {
  0%, 55% { opacity: 0; transform: scale(0.4); }
  68% { opacity: 1; transform: scale(1.3); }
  78%, 100% { opacity: 1; transform: scale(1); }
}

/* ---------- scroll reveal ---------- */

.reveal {
  opacity: 0;
  transform: translateY(48px) scale(0.97);
  transition: opacity var(--transition-reveal), transform var(--transition-reveal);
}

.reveal.is-visible {
  opacity: 1;
  transform: translateY(0) scale(1);
}

/* stagger direct children of a .reveal-stagger container as they enter */
.reveal-stagger > *:nth-child(1) { transition-delay: 0.05s; }
.reveal-stagger > *:nth-child(2) { transition-delay: 0.14s; }
.reveal-stagger > *:nth-child(3) { transition-delay: 0.23s; }
.reveal-stagger > *:nth-child(4) { transition-delay: 0.32s; }
.reveal-stagger > *:nth-child(5) { transition-delay: 0.41s; }
.reveal-stagger > *:nth-child(6) { transition-delay: 0.5s; }
.reveal-stagger > *:nth-child(n+7) { transition-delay: 0.58s; }