/* =========================================================
   animations.css — hero load-in, scroll reveals, floating badge
   ========================================================= */

/* ---------- Hero content load-in ("jump up" fade) ---------- */
@keyframes fadeUp{
  from{opacity:0;transform:translateY(28px);}
  to{opacity:1;transform:translateY(0);}
}
.hero-animate{opacity:0;animation:fadeUp .85s cubic-bezier(.16,.84,.44,1) forwards;}
.hero-animate.delay-1{animation-delay:.15s;}
.hero-animate.delay-2{animation-delay:.32s;}
.hero-animate.delay-3{animation-delay:.48s;}

/* ---------- Gentle float for the GST badge ---------- */
@keyframes floatSlow{
  0%,100%{transform:translateY(0);}
  50%{transform:translateY(-8px);}
}
.float-slow{animation:floatSlow 4.5s ease-in-out infinite; opacity:0; animation:fadeUp .8s cubic-bezier(.16,.84,.44,1) .65s forwards, floatSlow 4.5s ease-in-out 1.5s infinite;}

/* ---------- Scroll-triggered reveal: elements jump up into place ---------- */
.reveal,.reveal-left,.reveal-right{
  opacity:0;
  transition:opacity .7s cubic-bezier(.16,.84,.44,1), transform .7s cubic-bezier(.16,.84,.44,1);
  transition-delay:var(--delay, 0s);
}
.reveal{transform:translateY(34px);}
.reveal-left{transform:translateX(-32px);}
.reveal-right{transform:translateX(32px);}
.reveal.in-view,.reveal-left.in-view,.reveal-right.in-view{opacity:1;transform:translate(0,0);}

/* ---------- Staggered grids/lists (cards, feature list, services) ---------- */
.stagger > *{
  opacity:0;
  transform:translateY(30px);
  transition:opacity .6s cubic-bezier(.16,.84,.44,1), transform .6s cubic-bezier(.16,.84,.44,1);
}
.stagger.in-view > *{opacity:1;transform:translateY(0);}
.stagger.in-view > *:nth-child(1){transition-delay:.05s;}
.stagger.in-view > *:nth-child(2){transition-delay:.15s;}
.stagger.in-view > *:nth-child(3){transition-delay:.25s;}
.stagger.in-view > *:nth-child(4){transition-delay:.35s;}
.stagger.in-view > *:nth-child(5){transition-delay:.45s;}
.stagger.in-view > *:nth-child(6){transition-delay:.55s;}

/* ---------- Play button pulse ring ---------- */
@keyframes pulseRing{
  0%{box-shadow:0 0 0 0 rgba(199,154,75,.55);}
  70%{box-shadow:0 0 0 22px rgba(199,154,75,0);}
  100%{box-shadow:0 0 0 0 rgba(199,154,75,0);}
}

/* ---------- Mobile nav drop ---------- */
@keyframes navDrop{
  from{opacity:0;transform:translateY(-10px);}
  to{opacity:1;transform:translateY(0);}
}
nav.main.open{animation:navDrop .25s cubic-bezier(.16,.84,.44,1) forwards;}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  .hero::before{animation:none;}
  .hero-animate,.float-slow,.reveal,.reveal-left,.reveal-right,.stagger > *{
    animation:none !important;transition:none !important;opacity:1 !important;transform:none !important;
  }
}
