/* ========================================
   Scroll Reveal - .section elements
   Progressive enhancement - SSR safe, accessibility-first
   Excludes ad blocks (.container-bn) via JS
   ======================================== */

/* Base state: sections start hidden but occupy space (no layout shift) */
.reveal-init {
    opacity: 0;
    transform: translateY(14px);
    will-change: opacity, transform;
}

/* Revealed state: soft fade + gentle slide up with noticeable bounce at end */
.reveal-in {
    opacity: 1 !important;
    transform: translateY(0) !important;
    transition: opacity 520ms cubic-bezier(0.22, 1, 0.36, 1),
                transform 650ms cubic-bezier(0.34, 1.5, 0.64, 1);
}

/* Child elements for stagger effect */
.reveal-init[data-reveal-child] {
    transition-delay: 0ms;
}

.reveal-in[data-reveal-child] {
    transition-delay: inherit;
}

/* Respect user's motion preferences */
@media (prefers-reduced-motion: reduce) {
    .reveal-init,
    .reveal-init[data-reveal-child] {
        opacity: 1 !important;
        transform: translateY(0) !important;
        transition: none !important;
        will-change: auto !important;
    }
    
    .reveal-in,
    .reveal-in[data-reveal-child] {
        transition: none !important;
    }
}

/* Keep in layout and accessible (do not change display - sections may use flex/grid) */
.reveal-init,
.reveal-init[data-reveal-child] {
    visibility: visible;
}

/* Above-fold sections: always visible (JS reveals them immediately) */
.section-newsticker,
.section-featured {
    opacity: 1 !important;
    transform: translateY(0) !important;
}

/* If reveal-init is ever applied to them, keep visible (no flash) */
.section-newsticker.reveal-init,
.section-featured.reveal-init {
    opacity: 1 !important;
    transform: translateY(0) !important;
}