/* ============================================================
   ANIMATIONS — Scroll reveal & micro-interactions
   ============================================================ */

/* ── Scroll Reveal ─── */
.section-hidden {
    opacity: 0;
    transform: translateY(40px);
    transition: all 1.5s var(--ease-out);
}

.section-hidden.show {
    opacity: 1;
    transform: translateY(0);
}

/* ── Fade In Up (Hero) ─── */
.fade-in-up {
    opacity: 0;
    transform: translateY(30px);
    animation: fadeInUp 1.5s var(--ease-out) forwards;
}

.delay-1 { animation-delay: 0.2s; }
.delay-2 { animation-delay: 0.4s; }
.delay-3 { animation-delay: 0.6s; }
.delay-4 { animation-delay: 0.8s; }

@keyframes fadeInUp {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ── Stagger Children ─── */
.stagger-children > * {
    opacity: 0;
    transform: translateY(20px);
    transition: all 0.6s var(--ease-out);
}

.stagger-children.show > *:nth-child(1) { transition-delay: 0.1s; }
.stagger-children.show > *:nth-child(2) { transition-delay: 0.2s; }
.stagger-children.show > *:nth-child(3) { transition-delay: 0.3s; }
.stagger-children.show > *:nth-child(4) { transition-delay: 0.4s; }
.stagger-children.show > *:nth-child(5) { transition-delay: 0.5s; }
.stagger-children.show > *:nth-child(6) { transition-delay: 0.6s; }

.stagger-children.show > * {
    opacity: 1;
    transform: translateY(0);
}

/* ── Shimmer / Loading ─── */
@keyframes shimmer {
    0% { background-position: -200% 0; }
    100% { background-position: 200% 0; }
}

.shimmer {
    background: linear-gradient(90deg, var(--bg-alt) 25%, var(--glass-border) 50%, var(--bg-alt) 75%);
    background-size: 200% 100%;
    animation: shimmer 1.5s infinite;
}

/* ── Gentle Scale on Hover ─── */
.hover-lift {
    transition: var(--transition);
}

.hover-lift:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-md);
}