/* ==========================================================================
   TOKENY PROJEKTOWE – jedno źródło prawdy dla całego motywu.

   Kolejność ładowania: ten plik (wartości neutralne) -> preset z inc/config.php
   -> ustawienia klienta z Personalizacji (inline, na końcu).
   Odstępy i skalę typografii zmieniasz tutaj albo w presecie (vars).
   ========================================================================== */
:root {
	/* ---- Kolory (neutralne wartości awaryjne) ---- */
	--gf-color-bg: #ffffff;
	--gf-color-surface: #f6f4f1;
	--gf-color-text: #1a1a1a;
	--gf-color-heading: var(--gf-color-text);
	--gf-color-link: var(--gf-color-text);
	--gf-color-accent: #8a6f4d;
	--gf-color-dark: #1f1d1a;
	/* wartości pochodne: działają, jeśli preset ich nie ustawi */
	--gf-color-muted: color-mix(in srgb, var(--gf-color-text) 65%, var(--gf-color-bg));
	--gf-color-line: color-mix(in srgb, var(--gf-color-text) 18%, transparent);
	--gf-color-border: var(--gf-color-line);

	/* ---- Czcionki ---- */
	--gf-font-body: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
	--gf-font-heading: Georgia, "Times New Roman", serif;

	/* ---- Skala odstępów (rem) ---- */
	--gf-space-1: 0.25rem;
	--gf-space-2: 0.5rem;
	--gf-space-3: 0.75rem;
	--gf-space-4: 1rem;
	--gf-space-5: 1.5rem;
	--gf-space-6: 2rem;
	--gf-space-7: 3rem;
	--gf-space-8: 4.5rem;
	--gf-space-9: 6rem;
	--gf-space-10: 8rem;

	/* ---- Sekcje i siatka ---- */
	--gf-content-width: 1140px;
	/* Standard: maks. 72 px góra i dół (dawny „mniejszy"). Mniejszy = 60% (gf-section--tight). */
	--gf-section-pad-y: clamp(2.5rem, 1.8rem + 3vw, 4.5rem);
	--gf-section-pad-x: clamp(1rem, 4vw, 2rem);
	--gf-gap: clamp(1rem, 3vw, 2rem);
	--gf-sidebar-width: 300px;

	/* ---- Typografia: skala modularna ----
	   Trzy pokrętła: rozmiar bazowy (--gf-step-0), proporcja na mobile i na desktopie.
	   Każdy kolejny stopień = poprzedni × proporcja. Preset może przypiąć rozmiary na sztywno. */
	--gf-step-0: 1rem;
	--gf-scale: 1.2;
	--gf-step-1: calc(var(--gf-step-0) * var(--gf-scale));
	--gf-step-2: calc(var(--gf-step-1) * var(--gf-scale));
	--gf-step-3: calc(var(--gf-step-2) * var(--gf-scale));
	--gf-step-4: calc(var(--gf-step-3) * var(--gf-scale));
	--gf-step-5: calc(var(--gf-step-4) * var(--gf-scale));

	--gf-fs-h6: var(--gf-step-0);
	--gf-fs-h5: var(--gf-step-1);
	--gf-fs-h4: var(--gf-step-2);
	--gf-fs-h3: var(--gf-step-3);
	--gf-fs-h2: var(--gf-step-4);
	--gf-fs-h1: var(--gf-step-5);
	--gf-fs-display: calc(var(--gf-fs-h1) * 1.25);

	--gf-fs-body: 1rem;
	--gf-fs-small: 0.875rem;
	--gf-fs-lead: 1.1875rem;
	--gf-lh-body: 1.65;
	--gf-lh-heading: 1.15;
	--gf-fw-heading: 400;
	--gf-ls-heading: 0;

	/* „Napis akcentowy" (eyebrow, przyciski): małe litery kapitalikami, rozstrzelone */
	--gf-eyebrow-fs: 0.8125rem;
	--gf-eyebrow-ls: 0.12em;
	--gf-eyebrow-transform: uppercase;

	/* ---- Kształt i ruch ---- */
	--gf-radius: 0;
	--gf-transition: 0.3s ease;
	--gf-ease-out: cubic-bezier(0.22, 1, 0.36, 1);
	--gf-reveal-dur: 0.9s;
	--gf-reveal-shift: 28px;
	--gf-reveal-step: 90ms;
	--gf-header-h: 84px;
}

@media (min-width: 900px) {
	:root { --gf-scale: 1.25; }
}
