/**
 * Animacje bloków przy wjeżdżaniu w viewport — wersja "lekka":
 * - Wyłącznie transform/opacity (kompozycja na GPU, zero reflow/layout,
 *   zero wpływu na CLS — element od początku zajmuje swoje miejsce w layoutcie).
 * - Bez żadnej biblioteki JS (odpowiednik AOS.js ~14kB) — własny, wspólny
 *   IntersectionObserver dla całej strony (patrz scroll-animate.php / view.js).
 * - Progressive enhancement: DOMYŚLNIE każdy element jest w pełni widoczny.
 *   Stan "ukryty przed animacją" włącza się WYŁĄCZNIE gdy klasa
 *   `addons-anim-ready` jest już na <html> (dodawana synchronicznie w <head>,
 *   zanim JS się w ogóle wykona). Dzięki temu:
 *     - użytkownicy/roboty bez JS zawsze widzą pełną treść (SEO),
 *     - nie ma "mignięcia" (FOUC) między stanem ukrytym a widocznym.
 */

html.addons-anim-ready [data-addons-animate] {
    opacity: 0;
}

html.addons-anim-ready [data-addons-animate="fadeInUp"] { transform: translateY(28px); }
html.addons-anim-ready [data-addons-animate="fadeInDown"] { transform: translateY(-28px); }
html.addons-anim-ready [data-addons-animate="fadeInLeft"] { transform: translateX(-32px); }
html.addons-anim-ready [data-addons-animate="fadeInRight"] { transform: translateX(32px); }
html.addons-anim-ready [data-addons-animate="zoomIn"] { transform: scale(0.94); }
html.addons-anim-ready [data-addons-animate="slideInUp"] { transform: translateY(48px); }
html.addons-anim-ready [data-addons-animate="slideInDown"] { transform: translateY(-48px); }
html.addons-anim-ready [data-addons-animate="slideInLeft"] { transform: translateX(-56px); }
html.addons-anim-ready [data-addons-animate="slideInRight"] { transform: translateX(56px); }
html.addons-anim-ready [data-addons-animate="flipInX"] { transform: perspective(800px) rotateX(-65deg); }
html.addons-anim-ready [data-addons-animate="rotateIn"] { transform: rotate(-8deg) scale(0.94); }
html.addons-anim-ready [data-addons-animate="bounceIn"] { transform: scale(0.7); }
/* fadeIn — tylko opacity, bez przesunięcia */

html.addons-anim-ready [data-addons-animate].is-inview {
    opacity: 1;
    transform: none;
    transition-property: opacity, transform;
    transition-duration: var( --addons-anim-duration, 1200ms );
    transition-delay: var( --addons-anim-delay, 0ms );
    transition-timing-function: cubic-bezier( 0.16, 1, 0.3, 1 );
}

/* Animacje o wyraźnym charakterze "sprężystym" — mocniejszy overshoot easing. */
html.addons-anim-ready [data-addons-animate="bounceIn"].is-inview {
    transition-timing-function: cubic-bezier( 0.34, 1.56, 0.64, 1 );
}

/* Włącz "will-change" tylko na czas animacji (przed wjechaniem w viewport),
   a nie na stałe — utrzymanie go stale kosztowałoby pamięć GPU na całej stronie. */
html.addons-anim-ready [data-addons-animate]:not(.is-inview) {
    will-change: opacity, transform;
}

/* Dostępność: użytkownicy z preferencją ograniczonego ruchu w ogóle nie
   dostają klasy `addons-anim-ready` (patrz inline-script w <head>), ale to
   dodatkowe zabezpieczenie na wypadek zmiany preferencji w locie. */
@media ( prefers-reduced-motion: reduce ) {
    html.addons-anim-ready [data-addons-animate] {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
    }
}