/* ═══════════════════════════════════════════════════════════════════════════
   RGB Business Way — Animations & Scroll Triggers
   ═══════════════════════════════════════════════════════════════════════════ */

/* ─── Base Scroll Animation (triggered by JS IntersectionObserver) ─────── */
[data-animate] {
    opacity: 0;
    transition: opacity var(--duration, .7s) var(--ease-out, cubic-bezier(.25,.46,.45,.94)),
                transform var(--duration, .7s) var(--ease-out, cubic-bezier(.25,.46,.45,.94));
}

[data-animate].animated {
    opacity: 1;
    transform: none !important;
}

/* ─── Direction Variants ─────────────────────────────────────────────────── */
[data-animate="fade-up"]    { transform: translateY(50px); }
[data-animate="fade-down"]  { transform: translateY(-50px); }
[data-animate="fade-right"] { transform: translateX(-50px); }
[data-animate="fade-left"]  { transform: translateX(50px); }
[data-animate="scale-in"]   { transform: scale(0.88); }
[data-animate="fade-in"]    { transform: none; }

/* Float badge — always visible, inherits its float animation */
[data-animate="float"] {
    opacity: 1;
    transform: none;
}

/* ─── Staggered Card Delays ──────────────────────────────────────────────── */
.services__grid .service-card:nth-child(1) { transition-delay: 0s; }
.services__grid .service-card:nth-child(2) { transition-delay: 0.08s; }
.services__grid .service-card:nth-child(3) { transition-delay: 0.16s; }
.services__grid .service-card:nth-child(4) { transition-delay: 0.24s; }
.services__grid .service-card:nth-child(5) { transition-delay: 0.32s; }
.services__grid .service-card:nth-child(6) { transition-delay: 0.40s; }

.about__features .about__feature:nth-child(1) { transition-delay: 0s; }
.about__features .about__feature:nth-child(2) { transition-delay: 0.1s; }
.about__features .about__feature:nth-child(3) { transition-delay: 0.2s; }
.about__features .about__feature:nth-child(4) { transition-delay: 0.3s; }

.process__step:nth-child(1) { transition-delay: 0s; }
.process__step:nth-child(2) { transition-delay: 0.15s; }
.process__step:nth-child(3) { transition-delay: 0.3s; }
.process__step:nth-child(4) { transition-delay: 0.45s; }

.portfolio__card:nth-child(1) { transition-delay: 0s; }
.portfolio__card:nth-child(2) { transition-delay: 0.1s; }
.portfolio__card:nth-child(3) { transition-delay: 0.2s; }
.portfolio__card:nth-child(4) { transition-delay: 0.3s; }

/* ─── Hero Float Keyframes ───────────────────────────────────────────────── */
@keyframes heroFloat {
    0%, 100% { transform: translateY(0); }
    50%      { transform: translateY(-12px); }
}

/* ─── Pulse Glow ─────────────────────────────────────────────────────────── */
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 20px rgba(0,174,239,.1); }
    50%      { box-shadow: 0 0 40px rgba(0,174,239,.25); }
}

/* ─── Counter Flash ──────────────────────────────────────────────────────── */
@keyframes counterFlash {
    0%   { opacity: 0; transform: scale(0.8); }
    100% { opacity: 1; transform: scale(1); }
}

/* ─── Gradient Shift ─────────────────────────────────────────────────────── */
@keyframes gradientShift {
    0%   { background-position: 0% 50%; }
    50%  { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

/* ─── Particle Float (Hero) ──────────────────────────────────────────────── */
@keyframes particleFloat {
    0%   { transform: translate(0, 0); opacity: 0; }
    20%  { opacity: 1; }
    80%  { opacity: 1; }
    100% { transform: translate(var(--tx), var(--ty)); opacity: 0; }
}

.hero__particles .particle {
    position: absolute;
    width: 3px; height: 3px;
    background: rgba(0,174,239,.4);
    border-radius: 50%;
    animation: particleFloat var(--duration-particle, 8s) linear infinite;
    pointer-events: none;
}

/* ─── CTA Border Glow ────────────────────────────────────────────────────── */
@keyframes borderGlow {
    0%, 100% {
        border-color: rgba(0,174,239,.15);
        box-shadow: 0 0 40px rgba(0,174,239,.05);
    }
    50% {
        border-color: rgba(0,174,239,.3);
        box-shadow: 0 0 60px rgba(0,174,239,.12);
    }
}
.final-cta__inner {
    animation: borderGlow 4s ease-in-out infinite;
}

/* ─── Navbar Link Hover Underline ────────────────────────────────────────── */
@keyframes slideIn {
    from { transform: scaleX(0); }
    to   { transform: scaleX(1); }
}

/* Removed duplicate badge pulse */

/* ─── Stat Number Count Animation ────────────────────────────────────────── */
@keyframes statReveal {
    from { opacity: 0; transform: translateY(10px) scale(.9); }
    to   { opacity: 1; transform: none; }
}

/* ─── Footer CTA Strip Entrance ──────────────────────────────────────────── */
.footer__cta-strip {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity .6s var(--ease), transform .6s var(--ease);
}
.footer__cta-strip.animated {
    opacity: 1;
    transform: none;
}

/* ─── Prefers Reduced Motion ─────────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
    [data-animate] {
        opacity: 1 !important;
        transform: none !important;
    }
    html { scroll-behavior: auto; }
}
