/* ══════════════════════════════════════════════════════════════════
   FollowNow Animations
   ══════════════════════════════════════════════════════════════════ */

/* ── Scroll Reveal ── */
[data-s]{opacity:0;transform:translateY(32px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
[data-s].on{opacity:1;transform:none}
[data-s="1"]{transition-delay:.1s}
[data-s="2"]{transition-delay:.2s}
[data-s="3"]{transition-delay:.3s}
[data-s="4"]{transition-delay:.4s}
[data-s="5"]{transition-delay:.5s}

/* ── Blob Float ── */
@keyframes fn-blob-float{
  0%,100%{transform:translate(0,0) scale(1)}
  33%{transform:translate(30px,-40px) scale(1.05)}
  66%{transform:translate(-20px,25px) scale(.95)}
}
.fn-blob{animation:fn-blob-float 25s ease-in-out infinite}
.fn-blob:nth-child(2){animation-duration:20s;animation-direction:reverse}
.fn-blob:nth-child(3){animation-duration:18s;animation-delay:5s}

/* ── Marquee ── */
@keyframes fn-mq{to{transform:translateX(-50%)}}

/* ── Blinker (hero tag dot) ── */
@keyframes fn-blinker{50%{opacity:.2}}
.fn-blinker{animation:fn-blinker 2s infinite}

/* ── Kinetic Word (breathe) ── */
@keyframes fn-breathe{
  0%,100%{transform:scale(1) rotate(0)}
  50%{transform:scale(1.03) rotate(-.5deg)}
}
.fn-breathe{display:inline-block;animation:fn-breathe 4s ease-in-out infinite}

/* ── Scroll Doodle Bob ── */
@keyframes fn-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(6px)}}
.fn-bob{animation:fn-bob 3s ease-in-out infinite}