/* ══ EFEKTY WOW — wspolne dla wszystkich stron lejka (11.10.2026, prompt Marii) ══
   JEDNO zrodlo: strony linkuja ten plik i wow.js, nikt go nie kopiuje inline
   (ta sama zasada co mobile-fixes.css, CLAUDE.md).

   Zasady:
   - animujemy wylacznie transform / translate / scale / rotate, opacity,
     filter (blur tylko na komputerze) i clip-path; jedyny wyjatek to rozmiar
     tla zakreslacza (pas inline nie ma innej drogi, zeby malowac sie od lewej);
   - NIC nie jest ukryte bez JS: stan „przed wejsciem” wisi na klasie .wow-go,
     ktora zaklada wow.js dopiero po zbudowaniu obserwatorow;
   - prefers-reduced-motion: wow.js nie zaklada .wow / .wow-go — wszystko stoi;
   - pliku nie trzeba czekac przy pierwszym renderze (link na koncu <body>):
     bez niego strona wyglada jak przed efektami.
   ═════════════════════════════════════════════════════════════════════════ */

/* ── pasek postepu czytania ──
   pod przyklejonym paskiem strony (jesli jest), inaczej przy gornej krawedzi */
.wow-postep {
    position: absolute; left: 0; right: 0; bottom: -3px; height: 3px;
    background: var(--wow-postep, linear-gradient(90deg, #FFC48A, #EB512E));
    transform-origin: 0 50%; transform: scaleX(0); pointer-events: none;
}
.wow-postep.wow-postep--gora { position: fixed; top: 0; bottom: auto; z-index: 10001; }

/* ── wejscie sekcji: fade-up 24 px (+ blur na komputerze), po kolei co 80 ms, raz ── */
/* blur tylko na komputerze: na telefonie sam filtr (nawet blur(0)) kosztuje
   kazda klatke wejscia na slabym procesorze */
@keyframes wow-wejscie { from { opacity: 0; translate: 0 24px; } }
@keyframes wow-wejscie-blur { from { opacity: 0; translate: 0 24px; filter: blur(6px); } }
@keyframes wow-zrzut { from { opacity: 0; rotate: -2deg; scale: .95; translate: 0 16px; } }
html.wow-go .wow-el:not(.wow-in) { opacity: 0; }
html.wow-go .wow-el.wow-in {
    animation: wow-wejscie .7s cubic-bezier(.2, .7, .2, 1) backwards;
    animation-delay: var(--d, 0ms);
}
@media (min-width: 1024px) { html.wow-go .wow-el.wow-in { animation-name: wow-wejscie-blur; } }
html.wow-go .wow-el.wow-zr.wow-in { animation-name: wow-zrzut; animation-duration: .8s; }

/* ── liczby odliczaja (szerokosc zablokowana na czas liczenia — tekst obok stoi) ── */
.wow-licz { display: inline-block; text-align: right; white-space: nowrap; }

/* ── zakreslacze maluja sie od lewej ── */
html.wow-go .wow-mal { background-repeat: no-repeat; background-position: 0 0; background-size: 0% 100%; }
html.wow-go .wow-mal.wow-in { background-size: 100% 100%; transition: background-size .9s cubic-bezier(.6, 0, .2, 1) .15s; }

/* ── karty: lekki tilt 3D za kursorem (komputer z myszka) ── */
.wow-tilt { transition: transform .4s cubic-bezier(.2, .7, .2, 1), box-shadow .25s ease, translate .25s ease; }
.wow-tilt.wow-tilt-ruch { transition: transform .12s linear, box-shadow .25s ease, translate .25s ease; }

/* ── refleks swiatla na przyciskach akcji (co 4 s) ──
   span wstawiany przez wow.js; przycisk dostaje tylko position + overflow */
.wow-ma-blysk { position: relative; overflow: hidden; isolation: isolate; }
.wow-blysk {
    position: absolute; z-index: -1; top: -20%; bottom: -20%; left: 0; width: 46px;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, .2), rgba(255, 255, 255, 0));
    transform: translateX(-80px) skewX(-20deg); pointer-events: none;
}
@keyframes wow-refleks {
    0%   { transform: translateX(-80px) skewX(-20deg); }
    30%, 100% { transform: translateX(var(--wow-blysk-x, 560px)) skewX(-20deg); }
}
html.wow .wow-blysk { animation: wow-refleks 4s ease-in-out 1.2s infinite; }

@media (prefers-reduced-motion: reduce) {
    .wow-blysk { display: none !important; }
    .logo-scroll-track { animation: none !important; }
}