/* animations.css — keyframes + scroll-trigger utilities */

/* Reveal-on-scroll: stays invisible until JS adds .is-visible */
[data-reveal] {
  opacity: 0;
  transform: translateY(20px);
  transition:
    opacity var(--t-slow) var(--ease),
    transform var(--t-slow) var(--ease);
  transition-delay: var(--reveal-delay, 0ms);
  will-change: opacity, transform;
}
[data-reveal].is-visible {
  opacity: 1;
  transform: translateY(0);
}
[data-reveal="left"]   { transform: translateX(-20px); }
[data-reveal="right"]  { transform: translateX(20px); }
[data-reveal="scale"]  { transform: scale(0.96); }
[data-reveal].is-visible[data-reveal="left"],
[data-reveal].is-visible[data-reveal="right"] { transform: translateX(0); }
[data-reveal].is-visible[data-reveal="scale"] { transform: scale(1); }

/* Conteúdo do hero é sempre visível — não depende do reveal via JS.
   Evita hero em branco / flicker quando o IntersectionObserver atrasa. */
.hero [data-reveal] { opacity: 1 !important; transform: none !important; }

/* Pulse glow (CTA buttons) */
@keyframes pulse-glow {
  0%, 100% { box-shadow: 0 0 24px rgba(54, 208, 234, 0.2); }
  50%      { box-shadow: 0 0 32px rgba(54, 208, 234, 0.45); }
}
.pulse { animation: pulse-glow 3s ease-in-out infinite; }

/* Floating gradient blob (hero decorative) */
@keyframes float-blob {
  0%, 100% { transform: translate(0, 0) scale(1); }
  50%      { transform: translate(20px, -16px) scale(1.04); }
}
.blob { animation: float-blob 8s ease-in-out infinite; }

/* Typing cursor */
@keyframes blink { 0%, 49% { opacity: 1; } 50%, 100% { opacity: 0; } }
.caret::after { content: "|"; margin-left: 2px; animation: blink 1s step-end infinite; color: var(--accent); }

/* Number counter (used by counters.js) */
.counter {
  display: inline-block;
  font-variant-numeric: tabular-nums;
}

/* Theme transition smoothing */
html.theme-transition *,
html.theme-transition *::before,
html.theme-transition *::after {
  transition:
    background-color var(--t-med) var(--ease),
    color var(--t-med) var(--ease),
    border-color var(--t-med) var(--ease) !important;
}

/* Reduced motion overrides — kill non-essential animations */
@media (prefers-reduced-motion: reduce) {
  [data-reveal] { opacity: 1; transform: none; transition: none; }
  .pulse, .blob, .caret::after { animation: none; }
}