/*
 * Implai: zmienne, których theme.json nie wyrazi, bo zależą od szerokości okna.
 *
 * theme.json trzyma JEDNĄ wartość na preset, czyli tryb desktopowy makiety
 * (implai-html/css/tokens.css, :root). Makieta ma jeszcze dwa tryby tych samych
 * nazw: telefon poniżej 48rem i skalę `--u` od 48rem, która obejmuje wyłącznie
 * treść strony i stopkę, a nie pasek nagłówka (decyzja D14, DOCS/progress-implai.md).
 *
 * Dlatego ten plik przedefiniowuje same zmienne presetów, a nie zmienne pomocnicze.
 * Rdzeń deklaruje `--wp--preset--*` na :root, a `var()` w zmiennej rozwiązuje się
 * tam, gdzie zmienna jest zadeklarowana: preset wskazujący `var(--x)` nie
 * zobaczyłby `--x` przedefiniowanego w `main`.
 *
 * Wartości przepisane z makiety; każda zmiana skali idzie w parze z theme.json.
 */

/* ---- Tryb mobilny (poniżej 48rem, projekt telefonu z ramki 5404:11640) ----
 * Pozycje płynne, które przy 360 px same schodzą do wartości mobilnej, nie są
 * tu powtarzane (siatka, sekcja, bok-waski, tytul-xl, tytul-xxl). */
@media (width < 48rem) {
	:root {
		--wp--preset--spacing--1: 0.125rem;
		--wp--preset--spacing--2: 0.25rem;
		--wp--preset--spacing--3: 0.375rem;
		--wp--preset--spacing--4: 0.5rem;
		--wp--preset--spacing--5: 0.75rem;
		--wp--preset--spacing--6: 1rem;
		--wp--preset--spacing--7: 1.5rem;
		--wp--preset--spacing--8: 2rem;
		--wp--preset--spacing--10: 4.5rem;
		--wp--preset--spacing--12: 8rem;
		--wp--preset--spacing--naglowek-sekcji: 0.375rem;
		--wp--preset--spacing--sekcja-pion: 4.5rem;

		--wp--preset--font-size--tekst: 0.875rem;
		--wp--preset--font-size--wstep: 1rem;
		--wp--preset--font-size--tytul-s: 1.375rem;
		--wp--preset--font-size--tytul-m: 1.625rem;
		--wp--preset--font-size--tytul-l: 2rem;

		/* Przyciski mają w Figmie własne wcięcia, które na telefonie nie schodzą
		   razem ze skalą odstępów. */
		--wp--custom--przycisk--bok: 1rem;
		--wp--custom--przycisk--pion: 1rem;
		--wp--custom--przycisk--bok-kursor: 1.125rem;

		/* Telefon ma własną skalę, mnożnik go nie dotyczy. */
		--wp--custom--u: 0.0625rem;
	}
}

/* ---- Skala desktopowa (od 48rem, prośba klienta z 2026-10-16) ----
 * Wartość z projektu razy `--u`: 1 px przy 1920 px i szerzej, 0,75 px przy
 * 1440 px i węziej. Pozycje płynne biorą mniejszą z dwóch wartości, więc na
 * tablecie nic nie rośnie; pismo nie schodzi poniżej trybu mobilnego.
 * Pasek nagłówka nie jest skalowany (przyklejanie, banery na wysokość okna).
 * Wcięcia przycisku są powtórzone, bo zmienna liczy się tam, gdzie jest
 * zadeklarowana.
 *
 * `.wp-block-post-content` jest tu dla kanwy edytora: w trybie „sama treść”
 * kanwa nie ma `main`, a jej korzeniem jest element z tą klasą. Bez niego
 * kanwa pokazywała tytuł sekcji 35,8 px przy stronie 31,5 px (kanwa 1320).
 *
 * Okno ze źródłami (`.flexisnap-references`) drukuje wtyczka na końcu
 * dokumentu, poza `main`, a w makiecie stoi w treści strony i skaluje się
 * razem z nią. */
@media (width >= 48rem) {
	main,
	.wp-block-post-content,
	.wp-block-implai-footer,
	.flexisnap-references {
		--wp--preset--spacing--1: calc(4 * var(--wp--custom--u));
		--wp--preset--spacing--2: calc(8 * var(--wp--custom--u));
		--wp--preset--spacing--3: calc(12 * var(--wp--custom--u));
		--wp--preset--spacing--4: calc(16 * var(--wp--custom--u));
		--wp--preset--spacing--5: calc(24 * var(--wp--custom--u));
		--wp--preset--spacing--6: calc(32 * var(--wp--custom--u));
		--wp--preset--spacing--7: calc(48 * var(--wp--custom--u));
		--wp--preset--spacing--8: calc(64 * var(--wp--custom--u));
		--wp--preset--spacing--10: calc(128 * var(--wp--custom--u));
		--wp--preset--spacing--12: calc(256 * var(--wp--custom--u));
		--wp--preset--spacing--naglowek-sekcji: calc(12 * var(--wp--custom--u));
		--wp--preset--spacing--siatka: min(clamp(1rem, 0.757rem + 1.036vw, 2rem), calc(32 * var(--wp--custom--u)));
		--wp--preset--spacing--sekcja: min(clamp(2rem, 1.515rem + 2.071vw, 4rem), calc(64 * var(--wp--custom--u)));
		--wp--preset--spacing--sekcja-pion: min(clamp(3rem, 1.788rem + 5.178vw, 8rem), calc(128 * var(--wp--custom--u)));

		--wp--preset--font-size--tekst: max(0.9375rem, calc(16 * var(--wp--custom--u)));
		--wp--preset--font-size--wstep: min(clamp(1.0625rem, 1.017rem + 0.194vw, 1.25rem), max(1.0625rem, calc(20 * var(--wp--custom--u))));
		--wp--preset--font-size--tytul-s: min(clamp(1.25rem, 1.129rem + 0.518vw, 1.75rem), max(1.375rem, calc(28 * var(--wp--custom--u))));
		--wp--preset--font-size--tytul-m: min(clamp(1.5rem, 1.318rem + 0.777vw, 2.25rem), max(1.625rem, calc(36 * var(--wp--custom--u))));
		--wp--preset--font-size--tytul-sekcji: min(clamp(1.625rem, 1.382rem + 1.036vw, 2.625rem), calc(42 * var(--wp--custom--u)));
		--wp--preset--font-size--tytul-l: min(clamp(1.875rem, 1.572rem + 1.294vw, 3.125rem), max(2rem, calc(50 * var(--wp--custom--u))));
		--wp--preset--font-size--tytul-xl: min(clamp(2.5rem, 2.015rem + 2.071vw, 4.5rem), calc(72 * var(--wp--custom--u)));
		--wp--preset--font-size--tytul-xxl: min(clamp(2.5rem, 1.681rem + 3.495vw, 5.875rem), calc(94 * var(--wp--custom--u)));

		--wp--custom--przycisk--bok: var(--wp--preset--spacing--5);
		--wp--custom--przycisk--pion: var(--wp--preset--spacing--4);
		--wp--custom--przycisk--bok-kursor: calc(28 * var(--wp--custom--u));

		/* Tekst bez własnego rozmiaru dziedziczy go z body, które liczy go bez
		   mnożnika, więc treść dostaje go jeszcze raz. */
		font-size: var(--wp--preset--font-size--tekst);
	}
}

/* Pasek z poziomym menu (od 85rem): 24 + 44 + 24. */
@media (width >= 85rem) {
	:root {
		--wp--custom--naglowek--wysokosc: 5.75rem;
	}
}

/* Ograniczenie ruchu zeruje czasy w jednym miejscu. */
@media (prefers-reduced-motion: reduce) {
	:root {
		--wp--custom--ruch--szybko: 0.01ms;
		--wp--custom--ruch--srednio: 0.01ms;
		--wp--custom--ruch--wolno: 0.01ms;
		--wp--custom--ruch--szuflada-czas: 0.01ms;
		--wp--custom--ruch--wypelnienie: none;
	}
}
