/* =====================================================================
   Asad Enterprise — animations.css
   Keyframes + scroll-reveal classes (Intersection Observer driven)
   All animations GPU-accelerated using transform & opacity only.
   ===================================================================== */

/* ---------- Reveal base state ---------- */
/* Elements tagged with .reveal start hidden; animations.js adds .is-visible */
.reveal {
  opacity: 0;
  will-change: transform, opacity;
  transition: opacity 0.8s var(--ease-out, cubic-bezier(0.16,1,0.3,1)),
              transform 0.8s var(--ease-out, cubic-bezier(0.16,1,0.3,1));
  transition-delay: 0s;
}

/* Default reveal direction = fade up */
.reveal { transform: translate3d(0, 40px, 0); }

/* Direction variants — set via data-anim attribute, applied as inline
   transform by animations.js. These classes mirror the intent for
   any element that doesn't get an inline style. */
.reveal[data-anim="fade-up"]    { transform: translate3d(0, 40px, 0); }
.reveal[data-anim="fade-down"]  { transform: translate3d(0, -40px, 0); }
.reveal[data-anim="fade-left"]  { transform: translate3d(40px, 0, 0); }
.reveal[data-anim="fade-right"] { transform: translate3d(-40px, 0, 0); }
.reveal[data-anim="fade"]       { transform: none; }
.reveal[data-anim="scale"]      { transform: scale(0.88); }
.reveal[data-anim="zoom"]       { transform: scale(0.92); }

/* Visible state — cancels the offset */
.reveal.is-visible { opacity: 1; transform: translate3d(0, 0, 0) scale(1); }

/* Optional staggered delay via data-delay (ms) — applied inline by JS */

/* ---------- Keyframes ---------- */

/* Gentle vertical float (polaroids, frames, blobs) */
@keyframes floatY {
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(-16px); }
}

/* Larger floating drift for blobs */
@keyframes floatBlob {
  0%, 100% { transform: translate(0, 0) scale(1); }
  33%      { transform: translate(30px, -24px) scale(1.06); }
  66%      { transform: translate(-20px, 18px) scale(0.96); }
}

/* Slow spin for decorative circles / preloader logo */
@keyframes spin {
  to { transform: rotate(360deg); }
}

/* Twinkling sparks */
@keyframes twinkle {
  0%, 100% { opacity: 0; transform: scale(0.6); }
  50%      { opacity: 1; transform: scale(1.2); }
}

/* Mouse scroll wheel inside scroll cue */
@keyframes wheel {
  0%   { transform: translateY(0); opacity: 1; }
  100% { transform: translateY(10px); opacity: 0; }
}

/* Pulsing ring around play button */
@keyframes pulseRing {
  0%   { transform: scale(0.9); opacity: 0.8; }
  100% { transform: scale(1.4); opacity: 0; }
}

/* Gradient text shimmer */
@keyframes shimmer {
  0%   { background-position: 0% 50%; }
  100% { background-position: 200% 50%; }
}

/* Slide-in for lightbox image */
@keyframes lbIn {
  from { opacity: 0; transform: scale(0.92); }
  to   { opacity: 1; transform: scale(1); }
}
.lightbox-content { animation: lbIn 0.4s var(--ease-out, cubic-bezier(0.16,1,0.3,1)); }

/* Carousel item subtle fade */
@keyframes fadeSlide {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: translateY(0); }
}
.carousel-item.active .testimonial-card { animation: fadeSlide 0.6s var(--ease-out, cubic-bezier(0.16,1,0.3,1)); }

/* Particle float-up */
@keyframes particleRise {
  0%   { transform: translateY(100vh) translateX(0); opacity: 0; }
  10%  { opacity: 0.7; }
  90%  { opacity: 0.7; }
  100% { transform: translateY(-10vh) translateX(40px); opacity: 0; }
}
.particles span { animation: particleRise linear infinite; }

/* Navbar brand subtle glow pulse */
@keyframes brandGlow {
  0%, 100% { filter: drop-shadow(0 0 6px rgba(245,166,35,0.3)); }
  50%      { filter: drop-shadow(0 0 14px rgba(245,166,35,0.6)); }
}
.navbar-brand svg { animation: brandGlow 4s ease-in-out infinite; }

/* Reveal helper: when JS disabled, show everything */
.no-js .reveal { opacity: 1; transform: none; }