/* * WARSTWA BAZOWA PO KADENCE - paleta i typografia globalna. * * --------------------------------------------------------------------------- * PO CO TEN PLIK ISTNIEJE * * Motyw Kadence nie trzymal palety ani typografii w arkuszu. Wyliczal je * z ustawien Kreatora wygladu i wypisywal STYLEM OSADZONYM w kodzie strony. * Przy zejsciu z tamtego motywu przeniesione zostaly jego pliki * (`kadence-global.css`, `kadence-content.css`), ale ta wyliczana warstwa * nie przeniosla sie razem z nimi - bo nie byla plikiem. * * Skutek, zmierzony na zywej stronie 2026-09-07: * * - ZADNA regula w calym arkuszu nie ustawiala czcionki dla `body`, * wiec przegladarka schodzila na awaryjny krój szeryfowy; * - `html { font-size: 56.25% }` zostalo, wiec baza to 9 px i caly * tekst byl mikroskopijny; * - `--global-palette1` … `--global-palette9` byly PUSTE, a siega po nie * `kadence-global.css` w kilkudziesieciu miejscach: odnosniki, przyciski, * ramki pol formularza, cytaty, przycisk powrotu na gore; * - Poppins byl zadeklarowany (`@font-face`), ale nic go nie wolalo. * * Miejsce na te wartosci bylo przewidziane od poczatku - plik * `assets/zgodnosc-kadence.css`, ktory mial zapisac na serwerze migracja * jeszcze przy wlaczonym Kadence. Nigdy nie powstal, a wczytywanie go bylo * oslonione `file_exists()`, wiec brak nie dawal zadnego bledu. Martwy kod * usunieto 2026-09-04, dziura po nim zostala. Ten plik ja domyka. * * --------------------------------------------------------------------------- * SKAD SA TE LICZBY - ZMIERZONE, NIE ZALOZONE * * TYPOGRAFIA: z migawki ustawien Kreatora wygladu zapisanej w dniu * przelaczenia motywu (`_stan/snapshots/`, `theme_mods` starego potomnego, * 2026-09-02 21:02). To sa dokladnie te wartosci, ktore Kadence wypisywal * na te strone. * * PALETA: przepisana z filtru `bpsx_motyw_paleta_blokow()` w `functions.php` * tego motywu - jedynego zapisu palety TEJ witryny, jaki przetrwal. * Wartosci pochodna (`highlight`, `btn`) sa wyliczone z ustawien z tej samej * migawki: `link_color` wskazuje sloty 1 / 2 / 9, a przyciski maja wlasne * kolory podane hexem, nie slotem. * * ZASTRZEZENIE, KTORE MA TU ZOSTAC: slot 1 i 2 to jedyne dwie wartosci * bez drugiego, niezaleznego potwierdzenia. Sloty 3-9 zgadzaja sie co do * znaku z pomiarem strony wzorcowej. Gdyby kiedys wyszlo, ze odnosniki * w tresci maja inny kolor niz przed zmiana motywu - to jest to miejsce * do poprawienia i jedyne. * * --------------------------------------------------------------------------- * CZEGO TU NIE MA I DLACZEGO * * `h5` i `h6` - w migawce ustawien ich nie ma, wiec nie ma czego odtwarzac. * Wpisanie tu wymyslonych rozmiarow wygladaloby na zmierzone i nikt by tego * pozniej nie podwazyl. Zostaja na domyslnych. * * Szerokosci pojemnikow - robi je `geometria-podstawy.css` i dziala. * Podstawa `rem` (`html { font-size: 56.25% }`) tez juz jest. * * --------------------------------------------------------------------------- * KOLEJNOSC * * Arkusz idzie jako jeden z ostatnich (priorytet 220). Zmienne definiuje * tu jedyne miejsce w calym serwisie, wiec o nie kolejnosc nie walczy - * ale reguly przyciskow nadpisuja te z `kadence-global.css` przy tej samej * wadze selektora, a tam rozstrzyga wlasnie kolejnosc. */ /* * `:root:root` - podwojony celowo, nie z pomylki. * * Wtyczka Kadence Blocks, dzialajac bez motywu Kadence, wypisuje wlasna * DOMYSLNA palete stylem osadzonym w kodzie strony (`--global-palette1` * dostaje wtedy #3182CE). Styl osadzony i arkusz z pliku sa dla przegladarki * rownorzedne - rozstrzyga kolejnosc w dokumencie, a na nia nie mamy * pewnego wplywu. Poleganie na kolejnosci kosztowalo juz ten projekt * runde poprawek (opis w `functions.php`). * * Podwojony `:root` ma wieksza wage selektora, wiec wygrywa niezaleznie * od kolejnosci. Zadnego innego skutku nie ma - to caly czas ten sam element. */ :root:root { --global-palette1: #2563eb; --global-palette2: #1e40af; --global-palette3: #020617; --global-palette4: #1e293b; --global-palette5: #475569; --global-palette6: #cbd5e1; --global-palette7: #e2e8f0; --global-palette8: #f1f5f9; --global-palette9: #ffffff; /* Odnosniki: sloty 1 / 2 / 9 - wprost z ustawien `link_color`. */ --global-palette-highlight: var(--global-palette1); --global-palette-highlight-alt: var(--global-palette2); --global-palette-highlight-alt2: var(--global-palette9); /* Przyciski mialy kolory podane hexem, nie slotem palety. */ --global-palette-btn: #08131c; --global-palette-btn-hover: #08131c; --global-palette-btn-bg: #2cb8b4; --global-palette-btn-bg-hover: #33c9c4; } body { font-family: Poppins, sans-serif; font-size: 1.7rem; font-weight: 400; line-height: 1.5; color: var(--global-palette4); } /* * Pola formularzy nie dziedzicza kroju z `body` same z siebie - przegladarka * daje im wlasny. Bez tej linii formularz kontaktowy zostalby na kroju * systemowym, mimo poprawnej reszty strony. */ input, select, textarea { font-family: inherit; } h1 { font-size: var(--bp-h1-tel); line-height: 1.15; font-weight: 400; color: var(--global-palette3); } h2 { font-size: var(--bp-h2-tel); line-height: 1.15; font-weight: 700; color: var(--global-palette3); } h3 { font-size: var(--bp-h3); line-height: 1.15; font-weight: 700; color: var(--global-palette3); } h4 { font-size: var(--bp-h4); line-height: 1.15; font-weight: 600; color: var(--global-palette4); } /* * Rozmiary naglowkow z „Rozmiarow pisma" w „Dostosuj" (spec. 2, M4) - * wartosc telefonowa ponizej 60em, komputerowa od 60em, tak jak u rodzica. */ @media (min-width: 60em) { h1 { font-size: var(--bp-h1); } h2 { font-size: var(--bp-h2); } } /* * Przyciski. Selektory sa te same co w `kadence-global.css`, wiec waga jest * rowna i rozstrzyga kolejnosc wczytania - dlatego ten arkusz idzie pozniej. * Wartosci: `buttons_typography`, `buttons_padding` i `buttons_border_radius` * z tej samej migawki ustawien. */ button, .button, .wp-block-button__link, .wp-element-button, input[type="button"], input[type="reset"], input[type="submit"] { font-size: 1.6rem; font-weight: 600; line-height: 1.15; letter-spacing: -0.02rem; padding: 1.6rem 5rem; border-radius: 1rem; } /* Tablet - prog 1024 px, domyslny Kadence. Tekst bez zmiany, zostaje 1.7rem. */ /* Telefon - prog 767 px, domyslny Kadence. */ @media screen and (max-width: 767px) { body { font-size: 1.8rem; } button, .button, .wp-block-button__link, .wp-element-button, input[type="button"], input[type="reset"], input[type="submit"] { font-size: 1.7rem; } } /* * --------------------------------------------------------------------------- * WSPOLNE MIARY STRONY - jedno zrodlo dla wszystkich sekcji (2026-09-15) * * Liczby zmierzone na stronie glownej przy oknie 1536 px. Sekcja, ktora * potrzebuje promienia, odstepu albo wielkosci tytulu, bierze je STAD, * zamiast wpisywac wlasna liczbe - wtedy zmiana w jednym miejscu przestawia * cala strone naraz. Same zmienne niczego nie zmieniaja w wygladzie, dopoki * regula po nie nie siegnie. * --------------------------------------------------------------------------- */ :root:root { --bpsx-promien-karta: 2rem; --bpsx-promien-maly: 1rem; --bpsx-odstep-sekcji: clamp( 6.4rem, 2rem + 5vw, 12rem ); --bpsx-tytul-sekcji: var(--bp-h2-tel); --bpsx-tytul-sekcji-interlinia: 1.15; --bpsx-tekst: 1.7rem; --bpsx-przycisk-wyscielka: 1.7rem 3.2rem; --bpsx-przycisk-wysokosc: 5.6rem; --bpsx-przycisk-pismo: 1.7rem; --bpsx-przycisk-tlo: linear-gradient( 135deg, var(--bpmh-akcent-jasny, #4fdbd4) 0%, var(--bpmh-akcent, #2cb8b4) 100% ); --bpsx-przycisk-cien: 0 .8rem 2rem rgba( 44, 184, 180, .35 ); } /* * --------------------------------------------------------------------------- * JEDNA SKALA DUZYCH NAGLOWKOW NA CALEJ STRONIE (2026-09-16) * * Wzorzec: tytuly sekcji podstrony EMS - na ekranie 1536 px 50 px, * grubosc 600, interlinia 1,15, ciasne litery. Wielkosc bierze sie * z „Rozmiarow pisma" w „Dostosuj" (spec. 2, M4): H1 i H2, osobno na * telefon (ponizej 60em) i na komputer. Wlasnych liczb tu nie ma. * * Obejmuje KAZDY naglowek najwyzszego poziomu: tytuly slidera, tytuly * sekcji strony glownej, tytul i sekcje karty produktu, sekcje rozszerzone, * pierwsza sekcje i sekcje podstrony EMS. Male naglowki (kafle, karta * kontaktu, punkty listy) maja wlasna, mniejsza wielkosc i tu nie wchodza. * * `!important` celowo: te naglowki dostawaly wielkosc z pieciu arkuszy * i z ustawien blokow, kazdy z inna waga selektora i wlasnymi progami * szerokosci. Bez niego kazdy nowy prog w sekcji znow rozjechalby skale. * Zmiana wielkosci calej strony = zmiana H1/H2 w „Dostosuj", nic wiecej. * --------------------------------------------------------------------------- */ @media (min-width: 60em) { :root:root { --bpsx-tytul-sekcji: var(--bp-h2); } } :root:root { --bpsx-tytul-grubosc: 600; --bpsx-tytul-odstep-liter: -0.02em; } .bps__tytul, .bpsx-naglowek, .bpsx-produkty__naglowek, .bpsx-k-h2, .bpsx-rs__tytul, .bpsx-e3__tytul, .entry-content h2.wp-block-kadence-advancedheading { font-size: var(--bp-h2-tel) !important; } .bpsx-produkt__tytul, .bpsx-e3-hero__tytul, .entry-content h1.wp-block-kadence-advancedheading { font-size: var(--bp-h1-tel) !important; } @media (min-width: 60em) { .bps__tytul, .bpsx-naglowek, .bpsx-produkty__naglowek, .bpsx-k-h2, .bpsx-rs__tytul, .bpsx-e3__tytul, .entry-content h2.wp-block-kadence-advancedheading { font-size: var(--bp-h2) !important; } .bpsx-produkt__tytul, .bpsx-e3-hero__tytul, .entry-content h1.wp-block-kadence-advancedheading { font-size: var(--bp-h1) !important; } } .bps__tytul, .bpsx-naglowek, .bpsx-produkty__naglowek, .bpsx-k-h2, .bpsx-produkt__tytul, .bpsx-rs__tytul, .bpsx-e3__tytul, .bpsx-e3-hero__tytul, .entry-content h1.wp-block-kadence-advancedheading, .entry-content h2.wp-block-kadence-advancedheading { line-height: var(--bpsx-tytul-sekcji-interlinia) !important; font-weight: var(--bpsx-tytul-grubosc) !important; letter-spacing: var(--bpsx-tytul-odstep-liter) !important; } /* ========================================================================== SZEROKOSC TRESCI - WZOR WIAZACY (specyfikacja 2, M9). Kontener staly 140rem, oddech 1/2/2/4/12/18rem (ze snippetu progow), nigdy mniej niz 10 px. `:root:root` ma wieksza wage niz `:root` snippetu - oba z !important, wiec wygrywa waga, nie kolejnosc. Krawedz tresci: 10 / 18 / 52,5 / 372,5 px przy 390 / 1024 / 1440 / 1920. ========================================================================== */ :root:root { --global-content-edge-padding: max(1rem, 10px) !important; } @media screen and (min-width: 30em) { :root:root { --global-content-edge-padding: 2rem !important; } } @media screen and (min-width: 60em) { :root:root { --global-content-width: 140rem !important; } } @media screen and (min-width: 90em) { :root:root { --global-content-edge-padding: 4rem !important; } } @media screen and (min-width: 120em) { :root:root { --global-content-edge-padding: 12rem !important; } } @media screen and (min-width: 150em) { :root:root { --global-content-edge-padding: 18rem !important; } } /* Naglowek (Mega Header) - logo i przycisk na krawedzi tresci (M9). Pigulka ma wlasna wysciolke: kontener 1.2rem + pigulka 1.2rem = 2.4rem. Szerokosc kontenera = kontener tresci - 2 x oddech + 2 x 2.4rem, wiec logo staje dokladnie tam, gdzie zaczyna sie tekst sekcji. */ @media screen and (min-width: 60em) { .bpmh__kontener { max-width: calc(min(100%, 140rem) - 2 * var(--global-content-edge-padding) + 4.8rem) !important; } } /* ===================================================================== ATRYBUT hidden UKRYWA ZAWSZE Ta sama regula stoi w bazie motywu nadrzednego (jego style.css, ktory przy motywie potomnym sie nie wczytuje). Bez niej okno formularza motywu nadrzednego (klasa z display: flex) wychodzi spod atrybutu hidden jako niewidzialna warstwa nad cala strona i blokuje klikanie. Stoi TUTAJ, a nie w style.css potomnego: ten plik ma wersje z daty modyfikacji, a style.css potomnego dostaje wersje pliku rodzica i po zmianie przegladarka potrafi trzymac stara kopie. ===================================================================== */ [hidden] { display: none !important; } /* ===================================================================== ZGODA W FORMULARZU - ODSTEP POLE WYBORU / TEKST (spec. 1, F12) Wzor: 0.7rem miedzy polem wyboru a zdaniem, zdanie wyrownane do gory pola. Starszy styl formularzy tej strony (fragment kodu „form-styles") dawal 0.5rem - wyzsza waga selektora wygrywa bez ruszania tamtego. ===================================================================== */ .wpcf7 .bp-form-layout .wpcf7-acceptance label { gap: 0.7rem; align-items: flex-start; } /* ===================================================================== ARKUSZE MOTYWU NADRZEDNEGO WCZYTANE (spec. 2, M7, od 1.5.0) `bp-sekcje` i `bp-zgodnosc-blokow` nie sa juz zdejmowane. Rame treści zgodnosci blokow wylacza klasa `bp-bez-ramy-blokow` na . Tu zostaja trzy rzeczy, ktore ten arkusz ustawial inaczej niz Kadence: - zmienne, ktorych Kadence nie mial (`--global-vw` = 2rem zmienialo wyliczenie pelnej szerokosci rzedow Kadence) - wracaja do „brak"; - odstep w przycisku Kadence (`gap`), ktorego Kadence nie ustawial. Zmierzone na 18 widokach x 3 szerokosci: bez roznic w ukladzie. ===================================================================== */ :root { --global-vw: initial; --wp--style--block-gap: initial; --global-body-font-family: initial; --global-heading-font-family: initial; --global-content-narrow-width: initial; } .kb-button { gap: normal; } /* Kolor glowny w tekscie formularza na bialym (motyw 1.23.2): gwiazdki, „czytaj wiecej", numer „lub zadzwon", odnosnik w oknie zgody. Turkus #4fdbd4 mial na bieli 1,7:1 - ciemny odcien tej samej barwy 5,5:1. */ :root { --bp-akcent-tekst: #0f766e; } /* Przycisk wysylki formularza zostaje w wygladzie zaakceptowanym przez klienta (sprzed motywu nadrzednego 1.24.2): wyzszy, pismo 1.7rem. Waga podniesiona przez `body`, zeby nie zalezec od kolejnosci arkuszy. */ body .bp-formularz input[type="submit"], body .bp-pole input[type="submit"] { padding: 1.7rem 3.2rem; border: 0; line-height: 2.4rem; font-size: var(--bp-btn-rozmiar, 1.7rem); } @media (min-width: 60em) { body .bp-formularz input[type="submit"], body .bp-pole input[type="submit"] { font-size: var(--bp-btn-rozmiar, 1.7rem); } }