/* ============ RISE UP ============ */
@keyframes riseUp{to{transform:translateY(0)}}

/* ============ FADE UP ============ */
@keyframes fadeUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}

/* ============ STAGE CYCLE ============ */
@keyframes stageCycle{
  0%,25%{opacity:1;transform:translateY(0) rotate(0deg);z-index:3}
  30%,95%{opacity:0;transform:translateY(-40px) rotate(2deg);z-index:1}
  100%{opacity:0}
}

/* ============ SCROLL (MARQUEE) ============ */
@keyframes scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ============ PULSE (WA FLOAT) ============ */
@keyframes pulse{
  0%{transform:scale(1);opacity:.7}
  100%{transform:scale(1.9);opacity:0}
}
.wa-float::before,.wa-float::after{
  content:"";position:absolute;inset:0;border-radius:50%;
  background:var(--whatsapp);animation:pulse 2.2s ease-out infinite;
  z-index:-1;
}
.wa-float::after{animation-delay:1.1s}

/* ============ REVEAL ON SCROLL ============ */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .8s ease,transform .8s ease}
.reveal.in{opacity:1;transform:translateY(0)}
.reveal.delay-1{transition-delay:.08s}
.reveal.delay-2{transition-delay:.16s}
.reveal.delay-3{transition-delay:.24s}
.reveal.delay-4{transition-delay:.32s}

/* ============ HERO ANIMATIONS ============ */
.hero h1 .line{display:block;overflow:hidden}
.hero h1 .line span{display:inline-block;transform:translateY(100%);animation:riseUp .9s cubic-bezier(.2,.8,.2,1) forwards}
.hero h1 .line:nth-child(2) span{animation-delay:.12s}
.hero h1 .line:nth-child(3) span{animation-delay:.24s}
.hero h1 em{font-style:italic;color:var(--accent);font-weight:400}

.hero .sub{margin-top:28px;font-size:1.1rem;color:var(--muted);max-width:52ch;opacity:0;animation:fadeUp .7s .5s forwards}
.hero .sub-id{margin-top:10px;opacity:0;animation:fadeUp .7s .65s forwards}
.hero-ctas{margin-top:36px;display:flex;gap:14px;flex-wrap:wrap;opacity:0;animation:fadeUp .7s .8s forwards}
.hero-meta{margin-top:36px;display:flex;gap:24px;flex-wrap:wrap;opacity:0;animation:fadeUp .7s .95s forwards}
.hero-meta div{display:flex;align-items:center;gap:10px;font-size:.88rem;color:var(--muted)}
.hero-meta .dot{width:8px;height:8px;border-radius:50%;background:var(--accent)}