/* AX Consultoria · Effects (motion)
 * Animações inspiradas em react-bits, portadas pra vanilla JS.
 * Documentação completa em docs/DESIGN.md §6 (Movimento).
 *
 * Padrões aprovados:
 *   - blur-text   → H1 do hero, palavra a palavra
 *   - stagger     → proof-strip, process-list, FAQ list
 *   - reveal      → parágrafos lead, blocos editoriais
 *   - count       → numerais editoriais (16 anos, etc)
 *
 * Tudo respeita prefers-reduced-motion via base.css.
 * JS dispara via IntersectionObserver em scripts/anims.js.
 */

.js [data-anim="blur-text"] .word {
  display: inline-block;
  opacity: 0;
  filter: blur(10px);
  transform: translateY(8px);
  transition: opacity 0.7s var(--motion-ease-soft),
              filter 0.7s var(--motion-ease-soft),
              transform 0.7s var(--motion-ease-soft);
}
.js [data-anim="blur-text"].is-revealed .word {
  opacity: 1;
  filter: blur(0);
  transform: translateY(0);
}

.js [data-anim="stagger"] > * {
  opacity: 0;
  transform: translateY(12px);
  transition: opacity 0.55s var(--motion-ease-soft),
              transform 0.55s var(--motion-ease-soft);
}
.js [data-anim="stagger"].is-revealed > * {
  opacity: 1;
  transform: translateY(0);
}

.js [data-anim="reveal"] {
  opacity: 0;
  transform: translateY(10px);
  transition: opacity 0.7s var(--motion-ease-soft),
              transform 0.7s var(--motion-ease-soft);
}
.js [data-anim="reveal"].is-revealed {
  opacity: 1;
  transform: translateY(0);
}

.js [data-anim="count"] { font-variant-numeric: tabular-nums; }