/**
 * animations.css — Keyframes & Scroll Reveal
 * ────────────────────────────────────────────
 * Contains all @keyframes definitions and the `.reveal` / `.visible`
 * utility used by scroll.js (IntersectionObserver).
 *
 * Depends on: variables.css
 *
 * USAGE:
 *   Add class="reveal" to any element you want to animate on scroll.
 *   Optionally add rd1–rd4 for staggered delay.
 */

/* ══════════════════════════════════════
   GLOBAL SCROLL REVEAL UTILITY
   Single unified, elegant reveal animation for the entire website
   Triggered by IntersectionObserver in js/scroll.js
   ══════════════════════════════════════ */

.reveal-on-scroll,
.reveal {
    opacity: 0;
    transform: translateY(30px);
    will-change: opacity, transform;
    transition: opacity 0.85s cubic-bezier(0.16, 1, 0.3, 1),
                transform 0.85s cubic-bezier(0.16, 1, 0.3, 1);
}

.reveal-on-scroll.is-visible,
.reveal.is-visible,
.reveal-on-scroll.visible,
.reveal.visible {
    opacity: 1;
    transform: translateY(0);
}

/* Staggered delay helpers (applied alongside .reveal-on-scroll / .reveal) */
.rd1 { transition-delay: .12s; }
.rd2 { transition-delay: .24s; }
.rd3 { transition-delay: .36s; }
.rd4 { transition-delay: .48s; }

/* Accessibility: respect user preference for reduced motion */
@media (prefers-reduced-motion: reduce) {
    .reveal-on-scroll,
    .reveal {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
    }
}


/* ══════════════════════════════════════
   HERO ENTRANCE ANIMATIONS
   Run once on page load via CSS animation
   ══════════════════════════════════════ */

/* Fade up from below — used on hero text blocks */
@keyframes fadeUp {
    from { opacity: 0; transform: translateY(28px); }
    to   { opacity: 1; transform: translateY(0);    }
}

/* Simple fade in — used on hero stats and scroll indicator */
@keyframes fadeIn {
    from { opacity: 0; }
    to   { opacity: 1; }
}


/* ══════════════════════════════════════
   BACKGROUND ANIMATIONS
   ══════════════════════════════════════ */

/* Hero background slow Ken Burns zoom */
@keyframes slowZoom {
    from { transform: scale(1);    }
    to   { transform: scale(1.06); }
}

/* Horizontal marquee scroll — used on the gold ticker strip */
@keyframes mq {
    from { transform: translateX(0);    }
    to   { transform: translateX(-50%); }
}

/* Testimonials horizontal scroll ticker */
@keyframes ts {
    from { transform: translateX(0);    }
    to   { transform: translateX(-50%); }
}


/* ══════════════════════════════════════
   MICRO ANIMATIONS
   ══════════════════════════════════════ */

/* Scroll indicator pulse */
@keyframes sp {
    0%, 100% { opacity: .4; }
    50%       { opacity: 1;  }
}

/* WhatsApp button glow pulse */
@keyframes wap {
    0%, 100% { box-shadow: 0 6px 28px rgba(37, 211, 102, .35); }
    50%       { box-shadow: 0 6px 44px rgba(37, 211, 102, .60); }
}