/* ============================================================
   PEDZEL - jeden efekt zamalowania dla przyciskow calego serwisu
   Ladowany na KAZDEJ stronie, ktora obsluguje bm-newlayout.php,
   oraz przez szablony wlasne (sklep, karta produktu, 404).

   PO CO TEN PLIK:
   Efekt "pociagniecia pedzlem" na hoverze byl w serwisie pieciokrotnie,
   wpisany od nowa w kazdym arkuszu z osobna:
       bm-newhome.css  '.bmx-btn'
       produkt.css     2 miejsca
       koszyk.css      4 miejsca
       sklep.css       '.btn-variant'
       strony.css      '#new_columns-99-63 .ct-link-button'
   Za kazdym razem przepisana byla ta sama maska SVG (1,2 kB), te same
   szesc wlasciwosci maski i te same czasy przejscia. Przy takim rozrzucie
   nie dalo sie odpowiedziec na pytanie "czy wszedzie mamy pedzel" -
   i faktycznie na czterech ekranach go NIE bylo (salony, strefa
   wykonawcy, strefa architekta, dane kontaktowe).

   Zamiast dopisywac szosta i siodma kopie, mechanizm zyje TU, raz.
   Arkusze obszarow ustawiaja juz tylko ksztalt i kolor przycisku.

   KTORE PRZYCISKI DOSTAJA PEDZEL (decyzja 2026-09-16):
   tylko wlasciwe przyciski akcji - pigulki z wersalikami, wysokie
   na co najmniej 40 px. Male elementy nawigacyjne (pigulki wojewodztw,
   numery stron bloga, kafelki kategorii, chipy kolorow) zostaja przy
   zwyklej zamianie tla: pociagniecie pedzla na elemencie szerokim
   na 90 px nie jest czytelne, a przy kilkunastu naraz robi halas.
   Patrz 'design.md', rozdzial "Przyciski".

   CZEGO SIE TU NIE DA ZROBIC:
   Przyciskow bedacych '<input type="submit">' - element zastapiony
   nie ma pseudoelementow, wiec warstwy farby nie ma na czym polozyc.
   Dotyczy formularza rejestracji na /dla-profesjonalistow/ i logowania
   w strefie wykonawcy. Te zostaja przy zamianie tla i to jest swiadome.
   Autor: claude, 2026-09-16.
   ============================================================ */

:root {
    /* Maska pociagniecia pedzla - postrzepiona krawedz plus odpryski.
       Ta sama wartosc co '--brush' w '.bmx' (bm-newhome.css); tutaj
       siedzi na ':root', wiec jest widoczna takze poza makieta, czyli
       na wszystkim, co rysuje Oxygen. */
    --bmx-brush: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 40' preserveAspectRatio='none'%3E%3Cpath fill='white' d='M0 0 H170 Q184 4 168 8 Q186 13 170 17 Q188 21 169 25 Q185 29 167 33 Q182 36 172 40 H0 Z'/%3E%3Cellipse fill='white' cx='191' cy='6' rx='4.2' ry='2.4'/%3E%3Cellipse fill='white' cx='195' cy='19' rx='2.8' ry='1.7'/%3E%3Cellipse fill='white' cx='190' cy='31' rx='3.4' ry='2.1'/%3E%3Cellipse fill='white' cx='197.5' cy='26' rx='1.6' ry='1.1'/%3E%3Cellipse fill='white' cx='196' cy='11' rx='1.4' ry='1'/%3E%3C/svg%3E");

    /* Krzywe czasu wpisane WPROST, bez 'var(--ease)'.
       Powod: '--ease' jest zdefiniowane w '.bmx', w 'sklep.css',
       'koszyk.css', 'blog.css', 'wpis.css' i 'kolory.css' - ale NIE
       na 'body.page'. Blok pedzla w 'strony.css' odwolywal sie do niego
       na przyciskach '/kolor-inspiracje/', gdzie token nie istnial:
       cale 'transition' bylo przez to nieprawidlowe i kolor tekstu
       zmienial sie skokowo. Wlasne tokeny zamykaja ten rodzaj bledu. */
    --bmx-ease:  cubic-bezier(.22, 1, .36, 1);
    --bmx-walek: cubic-bezier(.42, .03, .25, 1);

    /* Kolor farby, czyli czym pedzel zamalowuje przycisk. Pojedynczy
       przycisk nadpisuje go u siebie: czerwony zamalowuje sie granatem,
       granatowy i obrysowy - czerwienia albo granatem. */
    --bmx-farba: #0B2240;

    /* Kolor napisu POD farba oraz zwloki obu przejsc.
       Domyslnie farba jest ciemna (granat albo czerwien), wiec napis
       ma zbielec - ale dopiero PO 0,3 s, zeby nie zbielal jeszcze
       na jasnym tle i nie zniknal na moment.

       Przy farbie JASNEJ ta logika jest odwrotna i trzeba ja odwrocic
       tokenami, inaczej napis znika - patrz blok "FARBA JASNA" nizej. */
    --bmx-tekst:      #fff;
    --bmx-zwloka-wej: .3s;
    /* ZWLOKA POWROTU - poprawiona 2026-09-17 po zgloszeniu: "napisy na
       buttonach po zdjeciu kursora za szybko robia sie czarne, przez co
       migaja".

       Bylo '0s' z zalozeniem, ze przy zjezdzaniu myszy tlo od razu robi
       sie jasne. To nieprawda: farba WYCOFUJE sie 1,05 s, a napis wracal
       do ciemnego po 0,3 s - przez ponad pol sekundy stal wiec ciemny
       napis na wciaz granatowym tle. Stad miganie.

       0,45 s to moment, w ktorym farba zdazy cofnac sie za srodek
       przycisku, czyli za napis. */
    --bmx-zwloka-wyj: .45s;

    /* Kolor spoczynkowy tla przycisku. Warstwa farby zaczyna przejazd
       od prawej krawedzi, wiec przez sekunde widac jeszcze kawalek tla
       SPOD niej - i to musi byc dokladnie to samo tlo, co przed hoverem.
       Bez tego czerwony przycisk gasnie na biel w chwili najechania,
       a dopiero potem wjezdza granat. Kazdy przemalowany przycisk
       podaje tu swoj kolor; 'transparent' pasuje do przyciskow
       obrysowych i do fabrycznych, ktore stoja na jasnym tle. */
    --bmx-tlo: transparent;
}

/* ------------------------------------------------------------
   MECHANIZM

   Maska jest trzy razy szersza od przycisku - lewa czesc to farba,
   prawa przezroczystosc. Przesuwajac maske z prawej na lewa, postrzepiona
   krawedz przejezdza przez przycisk jak walek. Rozmiar maski jest staly,
   wiec krawedz sie nie deformuje niezaleznie od szerokosci przycisku.

   Trzy warunki, ktore musi spelniac przycisk (sprawdzone przed wdrozeniem
   na wszystkich objetych elementach):
     1. jest '<a>' albo '<button>', a nie '<input>' - inaczej nie ma
        pseudoelementow,
     2. jego ':after' jest wolne - przemiecione wszystkie arkusze Oxygena,
        zero trafien na '.ct-link-button:after',
     3. 'isolation:isolate' tworzy wlasny kontekst nakladania, wiec
        warstwa z 'z-index:-1' chowa sie pod tekstem przycisku,
        a nie pod cala sekcja (bez tego znika calkiem).
   ------------------------------------------------------------ */

.bmx-pedzel,
body.page .ct-link-button,
body.page .oxel_flipbox__back .ct-link,
body.page a.ct-link[href*=".pdf"],
.bm-shop-wrapper .category-filter-btn:not(.active),
.bm-shop-wrapper .btn-clear-filters {
    position: relative;
    overflow: hidden;
    isolation: isolate;
    /* KTORA REGULA RZADZI CZYM:
       deklaracja na stanie SPOCZYNKU steruje POWROTEM (mysz zjezdza),
       a ta na ':hover' - WEJSCIEM (mysz najezdza).
       Tu jest powrot. OBIE strony maja zwloke, bo farba porusza sie
       wolniej (1,05 s) niz kolor tekstu (0,3 s) - patrz '--bmx-zwloka-*'. */
    transition: color .3s var(--bmx-ease) var(--bmx-zwloka-wyj),
                border-color .45s var(--bmx-ease);
}

.bmx-pedzel::after,
body.page .ct-link-button::after,
body.page .oxel_flipbox__back .ct-link::after,
body.page a.ct-link[href*=".pdf"]::after,
.bm-shop-wrapper .category-filter-btn:not(.active)::after,
.bm-shop-wrapper .btn-clear-filters::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    /* Matowa faktura farby - delikatne smugi po walku. */
    background:
        repeating-linear-gradient(112deg, rgba(255, 255, 255, .022) 0 2px, rgba(255, 255, 255, 0) 2px 11px),
        var(--bmx-farba);
    -webkit-mask-image: var(--bmx-brush);
            mask-image: var(--bmx-brush);
    -webkit-mask-size: 300% 100%;
            mask-size: 300% 100%;
    -webkit-mask-repeat: no-repeat;
            mask-repeat: no-repeat;
    -webkit-mask-position: 100% center;
            mask-position: 100% center;
    transition: -webkit-mask-position 1.05s var(--bmx-walek),
                        mask-position 1.05s var(--bmx-walek);
}

/* KARTA JAKO CEL HOVERA.
   Kafelek z jednym przyciskiem ("PRZEJDZ" na /dla-profesjonalistow/,
   "POZNAJ" na /kolor-inspiracje/) maluje swoj przycisk, gdy mysz jest
   gdziekolwiek na kafelku - caly kafelek jest tam jednym celem.

   ZAWEZENIE ':not(:has(.ct-link-button ~ .ct-link-button))' JEST KONIECZNE.
   Bez niego karta z DWOMA przyciskami (strefa architekta i strefa
   wykonawcy: "ZALOGUJ SIE" + "ZAREJESTRUJ SIE") malowala oba naraz,
   gdy tylko mysz wjechala na kartę - takze daleko od przyciskow.
   Ginela przez to roznica miedzy dzialaniem glownym a wtornym,
   a efekt odpalal sie bez zwiazku z tym, w co uzytkownik celuje.
   Sprawdzone w przegladarce: przy dwoch przyciskach oba szly
   z '100% 50%' na '0% 50%' jednoczesnie.

   Warunek czyta sie: "karta, ktora NIE ma dwoch przyciskow-rodzenstwa". */
.bmx-pedzel:hover::after,
.bmx-pedzel:focus-visible::after,
.bm-shop-wrapper .category-filter-btn:not(.active):hover::after,
.bm-shop-wrapper .category-filter-btn:not(.active):focus-visible::after,
.bm-shop-wrapper .btn-clear-filters:hover::after,
.bm-shop-wrapper .btn-clear-filters:focus-visible::after,
body.page .ct-link-button:hover::after,
body.page .ct-link-button:focus-visible::after,
body.page .oxel_flipbox__back .ct-link:hover::after,
body.page .oxel_flipbox__back .ct-link:focus-visible::after,
body.page a.ct-link[href*=".pdf"]:hover::after,
body.page a.ct-link[href*=".pdf"]:focus-visible::after,
/* TYLKO PIERWSZY przycisk. Decyzja klientki 2026-09-17: przy dwoch
   przyciskach ("ZOBACZ" i "POBIERZ") hover karty ma wypelniac ten,
   ktory odpowiada KLIKNIECIU W KARTE - czyli podglad. Pobranie wymaga
   wcelowania w swoj przycisk, bo to inne dzialanie.
   ':first-of-type' liczy sie wsrod rodzenstwa tego samego znacznika,
   a oba przyciski to '<a>' w jednym bloku - wiec trafia w ten po lewej. */
body.page .ct-new-columns > .ct-div-block:hover a.ct-link[href*=".pdf"]:first-of-type::after,
body.page .ct-new-columns > .ct-div-block:hover:not(:has(.ct-link-button ~ .ct-link-button)) .ct-link-button::after {
    -webkit-mask-position: 0% center;
            mask-position: 0% center;
}

/* WEJSCIE: tekst bieleje dopiero po 0,3 s. Bez tego bielil sie
   natychmiast, jeszcze na jasnym tle - przez moment byl bialy na bialym
   i znikal. Zwloka daje warstwie farby czas, zeby wjechala pod tekst.
   Trzecia wartosc w skrocie 'transition' to opoznienie. Ramka zmienia
   sie od razu, bo lezy na krawedzi, gdzie pedzel dociera najwczesniej. */
.bmx-pedzel:hover,
.bmx-pedzel:focus-visible,
.bm-shop-wrapper .category-filter-btn:not(.active):hover,
.bm-shop-wrapper .category-filter-btn:not(.active):focus-visible,
.bm-shop-wrapper .btn-clear-filters:hover,
.bm-shop-wrapper .btn-clear-filters:focus-visible,
body.page .ct-link-button:hover,
body.page .ct-link-button:focus-visible,
body.page .oxel_flipbox__back .ct-link:hover,
body.page .oxel_flipbox__back .ct-link:focus-visible,
body.page a.ct-link[href*=".pdf"]:hover,
body.page a.ct-link[href*=".pdf"]:focus-visible,
body.page .ct-new-columns > .ct-div-block:hover a.ct-link[href*=".pdf"]:first-of-type,
body.page .ct-new-columns > .ct-div-block:hover:not(:has(.ct-link-button ~ .ct-link-button)) .ct-link-button {
    /* DLACZEGO TU JEST '!important' - jedyne trzy w tym pliku.

       Oxygen trzyma wyglad kazdego przycisku na jego identyfikatorze:
       '#link_button-202-231:hover { background-color:#000000 }' to waga
       (1,1,0). Selektor klasowy nie ma jak tego przebic - identyfikator
       wygrywa z dowolna liczba klas. A regula MUSI wygrac, bo to ona
       wylacza fabryczna zamiane tla; gdyby zostala, przycisk robilby
       sie czarny POD warstwa farby i przez sekunde widac by bylo czern
       zamiast koloru spoczynkowego.

       Alternatywa bylaby lista kilkudziesieciu identyfikatorow, ktora
       rozjezdza sie przy kazdym nowym przycisku w builderze - czyli
       dokladnie ten blad, ktory ten plik ma zlikwidowac.

       Zakres jest waski: tylko stan ':hover'/':focus-visible' i tylko
       trzy wlasciwosci. Wyglad spoczynkowy zostaje w rekach arkuszy
       obszarow i nie jest tu w zaden sposob ruszany. */
    background-color: var(--bmx-tlo) !important;
    border-color: var(--bmx-farba) !important;
    color: var(--bmx-tekst) !important;
    transition: color .3s var(--bmx-ease) var(--bmx-zwloka-wej),
                border-color .45s var(--bmx-ease);
}

/* Kto woli bezruch - pedzel wjezdza bez animacji, ale efekt zostaje. */
@media (prefers-reduced-motion: reduce) {
    .bmx-pedzel::after,
    body.page .ct-link-button::after,
    .bm-shop-wrapper .category-filter-btn::after,
    .bm-shop-wrapper .btn-clear-filters::after { transition: none; }
}

/* ------------------------------------------------------------
   PRZYCISKI, KTORYCH NIE PRZEMALOWALISMY

   Regula wyzej lapie KAZDE '.ct-link-button' na stronach - takze te,
   ktore zostaly przy fabrycznym szarym tle Oxygena. Fabryczny hover
   byl tam czarny, wiec granat z '--bmx-farba' jest krokiem w strone
   makiety, a nie odejsciem od niej.

   Celowo nie ma tu listy identyfikatorow: kazdy przycisk dodany
   w builderze ma dzieki temu pedzel od pierwszego dnia, bez dopisywania
   go do arkusza. Lista byla wlasciwym powodem, dla ktorego efektu
   brakowalo na czterech ekranach naraz.
   ------------------------------------------------------------ */

/* ------------------------------------------------------------
   HOVER CALEJ KARTY, NIE SAMEGO PRZYCISKU
   Zgloszenie 2026-09-16: "brakuje mi buttonow reagujacych na hover
   karty, a nie tylko na hover na button".

   Kafelek podnosil sie i dostawal cien, ale pedzel na przycisku
   w srodku czekal, az mysz dojedzie do samego przycisku. Karta
   zachowywala sie wiec jak dwa osobne elementy.

   CO UZNAJEMY ZA KARTE: bezposrednie dziecko wiersza kolumn
   ('.ct-new-columns > .ct-div-block'). Sprawdzone w przegladarce na
   trzech ukladach i wszedzie jest tak samo - przycisk siedzi o dwa
   poziomy nizej:

     .ct-new-columns            wiersz            1440 x 471
       > .ct-div-block          KARTA              357 x 384
           > .ct-div-block      tresc karty        355 x 160
               > .ct-link-button   przycisk

   Dlatego celowo NIE ma tu listy identyfikatorow. Warunek
   "bezposrednie dziecko wiersza" sam odsiewa duze kontenery sekcji -
   gdyby wziac dowolnego przodka, pedzel odpalalby sie przy myszy
   oddalonej o pol ekranu.

   Makieta ma to juz rozwiazane u siebie: '.bmx-card:hover .bmx-card__go'
   animuje strzalke z poziomu karty, a '.bmx-card__lnk' (rozciagniety
   odnosnik 'position:absolute; inset:0') robi cala karte klikalna.
   Tutaj odtwarzamy to samo zachowanie dla kafelkow Oxygena.
   ------------------------------------------------------------ */

/* Kursor ma zapowiadac klikniecie na calej karcie, a nie dopiero
   nad przyciskiem. */
body.page .ct-new-columns > .ct-div-block:has(.ct-link-button) {
    cursor: pointer;
}

/* Rozciagniety odnosnik dokladany przez 'karty.js' - odpowiednik
   '.bmx-card__lnk' z makiety. Karta musi byc kontekstem pozycjonowania,
   inaczej nakladka rozciagnelaby sie do pierwszego pozycjonowanego
   przodka gdzies wyzej w drzewie. */
/* Bez 'body.page' - karty wystepuja takze na blogu i w aktualnosciach,
   gdzie <body> ma klase 'blog' / 'archive', nie 'page'. Zawezenie
   sprawialo, ze nakladka kotwiczyla sie do przodka wyzej w drzewie
   i nie pokrywala karty. */
.bmx-karta {
    position: relative;
}

.bmx-karta > .bmx-karta__lnk {
    position: absolute;
    inset: 0;
    z-index: 2;
}

/* Prawdziwy przycisk zostaje NAD nakladka. Dzieki temu klikniecie w niego
   idzie przez jego wlasny odnosnik (z etykieta i historia przegladarki),
   a nie przez nakladke bez nazwy. */
.bmx-karta .ct-link-button {
    z-index: 3;
}

/* ------------------------------------------------------------
   FARBA JASNA - odwrocenie zwlok
   Zgloszenie 2026-09-16: "button ma bialy efekt zamalowania i z tym
   nie zamierzam sie sprzeczac, to jest valid wariant buttonu, ale
   napis nie moze przez to znikac".

   CO SIE DZIALO - zmierzone na '/kontakt/dane-kontaktowe/':
       t = 0 ms     napis bialy, maska 100%  (farby nie widac)
       t = 120 ms   napis bialy, maska  94%
       t = 270 ms   napis BIALY, maska  71%  <- bialy na bialym
       t = 420 ms   napis granatowy, maska 34%
   Przez pierwsze ~350 ms biala farba zakrywala juz do 29% przycisku
   od prawej, a napis byl jeszcze bialy - koncowe litery znikaly.

   SKAD TA ZWLOKA: przy farbie CIEMNEJ napis musi zbielec dopiero
   wtedy, gdy ciemna farba pod niego dojedzie - inaczej bieleje na
   jasnym tle i znika tak samo, tylko na odwrot. Stad '.3s' opoznienia
   przy wejsciu i zero przy wyjsciu.

   Przy farbie JASNEJ obie te zwloki trzeba ZAMIENIC MIEJSCAMI:
     wejscie - napis ciemnieje NATYCHMIAST, bo jasna farba juz jedzie,
     wyjscie - napis wraca do bieli dopiero PO wycofaniu farby,
               inaczej bieleje jeszcze na bialym.

   Kazdy przycisk malowany jasnym kolorem musi wiec podac trzy rzeczy:
       --bmx-farba       jasny kolor farby
       --bmx-tekst       kolor napisu POD ta farba (ciemny)
       --bmx-jasna-farba wlaczenie odwroconych zwlok (ta klasa)
   ------------------------------------------------------------ */
.bmx-jasna-farba {
    --bmx-zwloka-wej: 0s;
    --bmx-zwloka-wyj: .35s;
}


/* ------------------------------------------------------------
   PRZYCISKI FILTROW W SKLEPIE (2026-09-16)

   Zgloszenie klientki: "na sklepie buttony maja inne stylowanie
   i nie maja efektu malowania - chodzi o filtry z lewej".

   Miala racje i przyczyna byla strukturalna: '/sklep/' renderuje wlasny
   szablon ('sklep-template.php'), ktory omija 'bm_newlayout_aktywny()',
   wiec TEN PLIK w ogole sie tam nie wczytywal. Karty produktu mialy pedzel
   tylko dlatego, ze 'sklep.css' nosi wlasna, starsza kopie mechanizmu
   ('.btn-variant'). Filtry zadnej kopii nie mialy - i nie mialy skad jej
   wziac. Szablon dociaga teraz 'pedzel.css' tak samo jak reszta serwisu.

   DLACZEGO TE PRZYCISKI, skoro 'design.md' mowi, ze drobna nawigacja
   pedzla nie dostaje: to nie sa chipy. "WSZYSTKIE" / "FARBY" / "GRUNTY"
   sa na cala szerokosc panelu (243 px), ulozone jeden pod drugim
   i sterują cala zawartoscia sklepu - czytaja sie jak przyciski akcji
   i tak samo wygladaja.

   ':not(.active)' JEST KONIECZNE. Aktywna kategoria ma juz pelne
   granatowe tlo, wiec granatowa farba byla by granatem na granacie -
   niewidoczna. Aktywny przycisk to zreszta oznaczenie STANU, a nie
   dzialanie do wykonania.
   ------------------------------------------------------------ */

.bm-shop-wrapper .category-filter-btn:not(.active) {
    --bmx-farba: var(--navy);
    --bmx-tlo: transparent;
}

/* "Wyczysc" kasuje ustawione filtry, wiec maluje sie czerwienia -
   tym samym kolorem, ktory mial juz wczesniej na tekscie i ramce. */
.bm-shop-wrapper .btn-clear-filters {
    --bmx-farba: var(--red);
    --bmx-tlo: transparent;
}

/* ------------------------------------------------------------
   ODNOSNIK W KAFELKU OBRACANYM ('.oxel_flipbox')
   Dolozony 2026-09-16 przy ujednolicaniu wersji PL i EN.

   Komponent uzywa zwyklego '.ct-link', a nie '.ct-link-button',
   wiec wypadal poza regule wyzej i jako jedyny na '/en/find-the-store/'
   zostawal bez efektu. Obejmujemy KOMPONENT, nie konkretna strone -
   kazdy nastepny flipbox, takze w wersji PL, dostanie efekt sam.
   ------------------------------------------------------------ */

/* Kursor na kartach list dynamicznych (wpisy blogowe, aktualnosci).
   Nakladke dokłada 'karty.js'; tu tylko zapowiedz klikniecia na calej
   karcie, a nie dopiero nad tytulem. */
body .oxy-dynamic-list > div.bmx-karta {
    cursor: pointer;
}

/* ------------------------------------------------------------
   WNETRZE PRZYCISKU TEZ MUSI ZMIENIC KOLOR
   Zgloszenie 2026-09-16: "buttony maja czarny napis na granatowym tle
   na hover, przez co znika".

   PRZYCZYNA: w Oxygenie napis nie jest tekstem samego '<a>'. Przycisk
   bywa zlozony z osobnych elementow, kazdy z wlasnym kolorem na
   identyfikatorze:

       <a class="ct-link">
         <div class="ct-fancy-icon"><svg>...</svg></div>
         <div class="ct-text-block">view</div>     <- kolor rgb(37,43,49)
       </a>

   Regula wyzej ustawia 'color' na '<a>', ale te dzieci maja swoj wlasny
   i go nie dziedzicza. Na jasnym tle roznicy nie bylo widac; dopiero
   granatowa farba pokazala, ze napis zostaje ciemny.

   Ikony SVG dodatkowo maja 'fill' - samo 'color' ich nie ruszy, stad
   'fill: currentColor'.
   ------------------------------------------------------------ */
.bmx-pedzel:hover :is(.ct-text-block, .ct-fancy-icon, span, div, svg),
.bmx-pedzel:focus-visible :is(.ct-text-block, .ct-fancy-icon, span, div, svg),
body.page .ct-link-button:hover :is(.ct-text-block, .ct-fancy-icon, span, div, svg),
body.page .ct-link-button:focus-visible :is(.ct-text-block, .ct-fancy-icon, span, div, svg),
body.page .oxel_flipbox__back .ct-link:hover :is(.ct-text-block, .ct-fancy-icon, span, div, svg),
body.page a.ct-link[href*=".pdf"]:hover :is(.ct-text-block, .ct-fancy-icon, span, div, svg),
body.page a.ct-link[href*=".pdf"]:focus-visible :is(.ct-text-block, .ct-fancy-icon, span, div, svg),
body.page .ct-new-columns > .ct-div-block:hover a.ct-link[href*=".pdf"]:first-of-type :is(.ct-text-block, .ct-fancy-icon, span, div, svg) {
    color: var(--bmx-tekst) !important;
    fill: currentColor !important;
    transition: color .3s var(--bmx-ease) var(--bmx-zwloka-wej);
}

/* POWROT WNETRZA PRZYCISKU.
   Regula wyzej dziala tylko na ':hover', wiec przy zjezdzaniu myszy
   napis w srodku wracal do swojego koloru BEZ zadnego przejscia -
   skokowo, jeszcze na granatowym tle. To bylo glowne zrodlo migania,
   bo napis nie jest tekstem samego '<a>', tylko osobnego '<div>'.
   Tutaj dajemy mu to samo przejscie i te sama zwloke co przyciskowi. */
.bmx-pedzel :is(.ct-text-block, .ct-fancy-icon, span, div, svg),
body.page .ct-link-button :is(.ct-text-block, .ct-fancy-icon, span, div, svg),
body.page .oxel_flipbox__back .ct-link :is(.ct-text-block, .ct-fancy-icon, span, div, svg),
body.page a.ct-link[href*=".pdf"] :is(.ct-text-block, .ct-fancy-icon, span, div, svg) {
    transition: color .3s var(--bmx-ease) var(--bmx-zwloka-wyj),
                fill .3s var(--bmx-ease) var(--bmx-zwloka-wyj);
}