/* Zmienne projektu odczytane z Figmy (makiety 1800 px i 390 px). */
:root {
	/* Kolory */
	--color-bg: #ebeae5;
	--color-sand: #d1ccc6;
	--color-surface: #efeeea;
	--color-blue: #849dbb;
	--color-brown: #997752;
	--color-ink: #2a2a26;
	--color-black: #171717;
	--color-muted: #978f80;
	--color-faint: #a2a2a2;
	--color-accent: #a99c7b;
	--color-line: #cec6b2;
	--color-field: #757575;
	--color-white: #fff;

	/* Typografia */
	--font-sans: Poppins, Arial, sans-serif;
	--font-mono: "JetBrains Mono", monospace;
	--tracking-caps: 0.2em;

	/*
	 * Układ.
	 * --u to 1 piksel makiety 1800 px. Na węższych ekranach desktopowych maleje
	 * proporcjonalnie, np. calc(205 * var(--u)) to pozycja 205 z Figmy.
	 */
	--u: calc(min(100vw, 1800px) / 1800);
	--gutter: clamp(24px, 5.55vw, 100px);
	--content-max: 1390px;
	--header-height: 109px;
	--transition: 200ms ease;
}

@media (max-width: 1279px), (hover: none) {
	:root {
		--header-height: 80px;
	}
}