/* =====================================================================
   animations.css — entrada de página, stagger de cards, keyframes
===================================================================== */

/* Entrada de página: opacity + leve translateY */
.page-enter { animation: pageIn .5s var(--ease-out) both; }
@keyframes pageIn {
    from { opacity: 0; transform: translateY(10px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* Stagger: elementos com [data-stagger] entram em sequência.
   O índice é setado via --i no HTML/JS. */
[data-stagger] > * {
    opacity: 0;
    animation: cardIn .55s var(--ease-out) forwards;
    animation-delay: calc(var(--i, 0) * 60ms + 80ms);
}
[data-stagger] > *:nth-child(1)  { --i: 0; }
[data-stagger] > *:nth-child(2)  { --i: 1; }
[data-stagger] > *:nth-child(3)  { --i: 2; }
[data-stagger] > *:nth-child(4)  { --i: 3; }
[data-stagger] > *:nth-child(5)  { --i: 4; }
[data-stagger] > *:nth-child(6)  { --i: 5; }
[data-stagger] > *:nth-child(7)  { --i: 6; }
[data-stagger] > *:nth-child(8)  { --i: 7; }
[data-stagger] > *:nth-child(9)  { --i: 8; }
[data-stagger] > *:nth-child(n+10) { --i: 9; }

@keyframes cardIn {
    from { opacity: 0; transform: translateY(16px); }
    to   { opacity: 1; transform: translateY(0); }
}

@keyframes fadeScale {
    from { opacity: 0; transform: scale(.985); }
    to   { opacity: 1; transform: scale(1); }
}

/* Reveal on scroll (via IntersectionObserver em main.js) */
.reveal { opacity: 0; transform: translateY(22px); transition: opacity .6s var(--ease-out), transform .6s var(--ease-out); }
.reveal.is-in { opacity: 1; transform: translateY(0); }

/* Respeita preferências de movimento reduzido */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: .001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .001ms !important;
        scroll-behavior: auto !important;
    }
    .reveal { opacity: 1; transform: none; }
}
