/* =====================================================================
   FLORIPA WALKS · animations.css
   Movimento discreto e profissional: um fade-up suave no scroll.
   Sem gimmicks, sem blur, sem shimmer. Robusto e à prova de travar.
   ===================================================================== */

/* fade-up base */
@keyframes fadeUp   {from{opacity:0;transform:translateY(18px)} to{opacity:1;transform:none}}
@keyframes fadeSoft {from{opacity:0}                            to{opacity:1}}
@keyframes spin     {to{transform:rotate(360deg)}}
@keyframes waPulse  {0%{transform:scale(1);opacity:.5}70%{transform:scale(1.7);opacity:0}100%{opacity:0}}

/* ---------------------------------------------------------------------
   REVEAL no scroll
   Estado inicial só com JS ativo; sem JS tudo aparece normalmente.
   Um fallback no JS garante que nada fica preso invisível.
   --------------------------------------------------------------------- */
html.has-js [data-anim]{opacity:0}
html.has-js [data-anim].in{
  animation:fadeUp .6s cubic-bezier(.22,1,.36,1) both;
  animation-delay:var(--d,0s);
}
/* variações mantêm o mesmo fade suave (sem saltos direcionais exagerados) */
[data-anim="zoom"].in,[data-anim="blur"].in{animation-name:fadeSoft}

/* stagger opcional */
.stagger > *:nth-child(1){--d:.04s}
.stagger > *:nth-child(2){--d:.1s}
.stagger > *:nth-child(3){--d:.16s}
.stagger > *:nth-child(4){--d:.22s}
.stagger > *:nth-child(5){--d:.28s}
.stagger > *:nth-child(6){--d:.34s}

/* ---------------------------------------------------------------------
   Toque de vida discreto (nada exagerado)
   --------------------------------------------------------------------- */
/* seta do hero */
.scroll-cue .mouse::before{animation:fadeSoft 1.6s ease-in-out infinite alternate}
/* pulso suave no botão flutuante de WhatsApp */
.wa-float-pulse{position:absolute;inset:0;border-radius:50%;background:var(--yellow);z-index:1;
  animation:waPulse 2.6s ease-out infinite}

/* ---------------------------------------------------------------------
   Reduced motion
   --------------------------------------------------------------------- */
@media (prefers-reduced-motion:reduce){
  html.has-js [data-anim]{opacity:1 !important;animation:none !important}
  .wa-float-pulse,.scroll-cue,.scroll-cue .mouse::before{animation:none !important}
}
