/* ==========================================================================
   DVB - Animaciones (entrada + scroll reveal)
   ========================================================================== */

@media (prefers-reduced-motion: no-preference) {

    /* ---------- Entrada del Hero (al cargar la página) ---------- */

    .hero-tag,
    .hero-content h1,
    .hero-content p,
    .hero-buttons {
        opacity: 0;
        transform: translateY(26px);
        animation: dvbFadeUp .8s cubic-bezier(.22, .61, .36, 1) forwards;
    }

    .hero-tag        { animation-delay: .15s; }
    .hero-content h1 { animation-delay: .3s; }
    .hero-content p  { animation-delay: .48s; }
    .hero-buttons    { animation-delay: .64s; }

    .dvb-header {
        animation: dvbFadeDown .7s cubic-bezier(.22, .61, .36, 1) forwards;
    }

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

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

    /* ---------- Reveal al hacer scroll ---------- */

    .reveal {
        opacity: 0;
        transform: translateY(40px);
        transition: opacity .8s cubic-bezier(.22, .61, .36, 1),
                    transform .8s cubic-bezier(.22, .61, .36, 1);
        transition-delay: var(--reveal-delay, 0s);
        will-change: opacity, transform;
    }

    .reveal.in-view {
        opacity: 1;
        transform: translateY(0);
    }

    .reveal-scale {
        opacity: 0;
        transform: scale(.94);
        transition: opacity .7s ease, transform .7s cubic-bezier(.22, .61, .36, 1);
        transition-delay: var(--reveal-delay, 0s);
    }

    .reveal-scale.in-view {
        opacity: 1;
        transform: scale(1);
    }

    /* Stagger automático dentro de grids con clase .reveal-group */
    .reveal-group .reveal:nth-child(1) { --reveal-delay: 0s; }
    .reveal-group .reveal:nth-child(2) { --reveal-delay: .12s; }
    .reveal-group .reveal:nth-child(3) { --reveal-delay: .24s; }
    .reveal-group .reveal:nth-child(4) { --reveal-delay: .36s; }
}

/* Respeta accesibilidad: sin animaciones si el usuario las desactivó */
@media (prefers-reduced-motion: reduce) {
    .reveal, .reveal-scale,
    .hero-tag, .hero-content h1, .hero-content p, .hero-buttons {
        opacity: 1 !important;
        transform: none !important;
        animation: none !important;
        transition: none !important;
    }
}