/**
 * BQB Landing — Motion (flutter-animate → CSS)
 * fadeIn + slide, stagger por intervalo, state-driven (.bqb-in-view)
 * Personalidad: Corporate / confianza — 200–480ms, ease-out
 */
:root {
    --bqb-motion-ease-out: cubic-bezier(0.05, 0.7, 0.1, 1);
    --bqb-motion-ease-in-out: cubic-bezier(0.2, 0, 0, 1);
    --bqb-motion-ease-exit: cubic-bezier(0.3, 0, 1, 1);
    --bqb-motion-fast: 200ms;
    --bqb-motion-base: 320ms;
    --bqb-motion-slow: 480ms;
    --bqb-stagger-step: 72ms;
}

/* ── Scroll reveal (equivalente a .animate(interval: 72ms).fadeIn().slide()) ── */
@media (prefers-reduced-motion: no-preference) {
    .bqb-landing-main .bqb-reveal,
    .bqb-producer-landing .bqb-reveal {
        opacity: 0;
        transform: translateY(18px) scale(0.985);
        transition:
            opacity var(--bqb-motion-base) var(--bqb-motion-ease-out),
            transform var(--bqb-motion-base) var(--bqb-motion-ease-out);
        transition-delay: calc(var(--bqb-stagger, 0) * var(--bqb-stagger-step));
        will-change: opacity, transform;
    }

    .bqb-landing-main .bqb-reveal.bqb-in-view,
    .bqb-producer-landing .bqb-reveal.bqb-in-view {
        opacity: 1;
        transform: none;
    }

    /* Hero: entrada inmediata al cargar (sin esperar scroll) */
    .bqb-landing-main .bqb-snippet-carousel.bqb-reveal-hero {
        opacity: 0;
        transform: scale(1.03);
        animation: bqb-hero-enter var(--bqb-motion-slow) var(--bqb-motion-ease-out) forwards;
    }

    @keyframes bqb-hero-enter {
        to {
            opacity: 1;
            transform: none;
        }
    }

    /* Contenido del slide — secuencia fade → slide (then delay) */
    .bqb-landing-main .slider-info-div .bqb-slide-line {
        opacity: 0;
        transform: translateY(10px);
        transition:
            opacity 280ms var(--bqb-motion-ease-out),
            transform 280ms var(--bqb-motion-ease-out);
    }

    .bqb-landing-main .carousel-item.active .bqb-slide-line:nth-child(1) {
        opacity: 1;
        transform: none;
        transition-delay: 120ms;
    }

    .bqb-landing-main .carousel-item.active .bqb-slide-line:nth-child(2) {
        opacity: 1;
        transform: none;
        transition-delay: 220ms;
    }

    .bqb-landing-main .carousel-item.active .bqb-slide-line:nth-child(3) {
        opacity: 1;
        transform: none;
        transition-delay: 320ms;
    }

    /* Menú móvil — stagger en ítems (interval por --bqb-nav-stagger) */
    .bqb-site-nav .navbar-collapse.show .nav-item,
    .bqb-site-nav .navbar-collapse.bqb-expand .nav-item,
    #top .navbar #top_menu_collapse.show .nav-item {
        opacity: 0;
        transform: translateX(-10px);
        animation: bqb-nav-item-in var(--bqb-motion-base) var(--bqb-motion-ease-out) forwards;
        animation-delay: calc(var(--bqb-nav-stagger, 0) * 55ms + 80ms);
    }

    @keyframes bqb-nav-item-in {
        to {
            opacity: 1;
            transform: none;
        }
    }

    /* Floating bar — entrada desde abajo */
    .bqb-floating-buttons {
        transform: translateY(100%);
        animation: bqb-float-bar-in 420ms var(--bqb-motion-ease-out) 600ms forwards;
    }

    @keyframes bqb-float-bar-in {
        to {
            transform: none;
        }
    }
}

@media (prefers-reduced-motion: reduce) {
    .bqb-landing-main .bqb-reveal,
    .bqb-producer-landing .bqb-reveal {
        opacity: 1;
        transform: none;
        transition: none;
    }

    .bqb-landing-main .bqb-snippet-carousel.bqb-reveal-hero {
        animation: none;
        opacity: 1;
        transform: none;
    }

    .bqb-floating-buttons {
        animation: none;
        transform: none;
    }
}