/**
 * Tokeny projektu SKALART (źródło: Styleguide w Claude Design).
 * Nazwy kolorów odpowiadają globalnym kolorom Kitu Elementora.
 */
:root {
	/* Kolory */
	--sk-walnut: #4b3023;      /* Orzech — główne CTA */
	--sk-ink: #201a17;         /* Ciemny brąz — nagłówki, stopka */
	--sk-text: #2d2925;        /* Grafit — tekst */
	--sk-text-2: #4a423b;      /* Tekst drugorzędny */
	--sk-muted: #5e554d;       /* Opisy pomocnicze */
	--sk-copper-text: #8a5a32; /* Miedź do tekstu (AA) — linki, eyebrow */
	--sk-copper: #b57b4b;      /* Miedź — dekor, focus */
	--sk-sage: #737966;        /* Szałwia */
	--sk-sage-dark: #4f5445;
	--sk-sage-line: #a7ac98;
	--sk-sand: #d9c6ab;        /* Piasek — obramowania */
	--sk-line: #e6daca;        /* Separatory */
	--sk-input: #cdbba3;       /* Obramowanie pól */
	--sk-cream: #f4ecdf;       /* Krem — tła sekcji */
	--sk-bg: #fffdf8;          /* Ciepła biel — tło strony */
	--sk-footer-text: #e6daca;
	--sk-footer-muted: #bfaf9a;
	--sk-footer-line: #3a302a;
	--sk-success: #2f5236;
	--sk-success-bg: #e3ede0;
	--sk-error: #a23b2a;
	--sk-error-bg: #f6e1dc;
	--sk-warn: #6e4a12;
	--sk-warn-bg: #fbefd9;

	/* Typografia */
	--sk-font-display: "Cormorant Garamond", Georgia, "Times New Roman", serif;
	--sk-font-body: Manrope, "Segoe UI", Arial, sans-serif;
	--sk-fs-h1: clamp(2.5rem, 1.6rem + 3.4vw, 4.25rem);   /* 40 → 68 */
	--sk-fs-h2: clamp(2rem, 1.55rem + 1.7vw, 2.875rem);   /* 32 → 46 */
	--sk-fs-h3: clamp(1.5rem, 1.35rem + 0.5vw, 1.75rem);  /* 24 → 28 */
	--sk-fs-body: 1rem;
	--sk-fs-small: 0.875rem;
	--sk-lh-body: 1.6;

	/* Układ */
	--sk-container: 1240px;
	--sk-gutter: 24px;
	--sk-section: clamp(48px, 6vw, 96px);
	--sk-radius-s: 4px;
	--sk-radius-m: 6px;
	--sk-radius-l: 8px;
	--sk-shadow: 0 12px 32px rgba(32, 26, 23, 0.16);
	--sk-focus: 0 0 0 3px var(--sk-bg), 0 0 0 6px var(--sk-copper);
	--sk-header-h: 84px;
}

@media (max-width: 767px) {
	:root {
		--sk-gutter: 20px;
		--sk-header-h: 64px;
	}
}