/* animations.css - Scroll-triggered animations and micro-interactions */

/* --- Section A: Base Animation States --- */
[data-animate] {
    opacity: 0;
    will-change: opacity, transform;
    transition: opacity 0.7s var(--transition-smooth),
                transform 0.7s var(--transition-smooth);
}

[data-animate="fade-up"]    { transform: translateY(28px); }
[data-animate="fade-left"]  { transform: translateX(28px); }
[data-animate="fade-right"] { transform: translateX(-28px); }
[data-animate="zoom"]       { transform: scale(0.95); }
[data-animate="stagger"]    { opacity: 1; transform: none; }
[data-animate="count"]      { opacity: 0; transform: translateY(10px); }

[data-animate].is-visible {
    opacity: 1;
    transform: none;
}

/* --- Section B: Stagger Children Animation --- */
[data-animate="stagger"] > * {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.5s var(--transition-smooth),
                transform 0.5s var(--transition-smooth);
}

[data-animate="stagger"].is-visible > * {
    opacity: 1;
    transform: none;
}

[data-animate="stagger"].is-visible > *:nth-child(1)  { transition-delay: 0s; }
[data-animate="stagger"].is-visible > *:nth-child(2)  { transition-delay: 0.1s; }
[data-animate="stagger"].is-visible > *:nth-child(3)  { transition-delay: 0.2s; }
[data-animate="stagger"].is-visible > *:nth-child(4)  { transition-delay: 0.3s; }
[data-animate="stagger"].is-visible > *:nth-child(5)  { transition-delay: 0.4s; }
[data-animate="stagger"].is-visible > *:nth-child(6)  { transition-delay: 0.5s; }
[data-animate="stagger"].is-visible > *:nth-child(7)  { transition-delay: 0.6s; }
[data-animate="stagger"].is-visible > *:nth-child(8)  { transition-delay: 0.7s; }
[data-animate="stagger"].is-visible > *:nth-child(9)  { transition-delay: 0.8s; }
[data-animate="stagger"].is-visible > *:nth-child(10) { transition-delay: 0.9s; }
[data-animate="stagger"].is-visible > *:nth-child(11) { transition-delay: 1s; }
[data-animate="stagger"].is-visible > *:nth-child(12) { transition-delay: 1.1s; }

/* --- Section C: Reduced Motion Override --- */
@media (prefers-reduced-motion: reduce) {
    [data-animate], [data-animate] > * {
        transition: none !important;
        opacity: 1 !important;
        transform: none !important;
    }
}

/* --- Section D: Keyframe Animations --- */
@keyframes pulse-glow {
    0%, 100% { box-shadow: var(--glow-green); }
    50%       { box-shadow: var(--glow-green-hover); }
}

@keyframes shimmer {
    0%   { background-position: -200% center; }
    100% { background-position: 200% center; }
}

@keyframes float {
    0%, 100% { transform: translateY(0px); }
    50%       { transform: translateY(-6px); }
}

/* --- Section E: Stat Counter Pulse --- */
.stat-number.counting {
    animation: pulse-glow 0.6s ease-out 1;
}