:root {
	/* Kolory tła */
	--color-background: #080a0c;
	--color-surface: #101317;
	--color-surface-light: #161a1f;

	/* Kolory tekstu */
	--color-text: #f4f2ed;
	--color-text-muted: #a9adb3;
	--color-white: #ffffff;
	--color-black: #000000;

	/* Kolor wyróżniający */
	--color-accent: #d3b36a;
	--color-accent-hover: #e4c77f;
	--color-accent-dark: #9f8141;

	/* Obramowania */
	--color-border: rgba(255, 255, 255, 0.12);
	--color-border-strong: rgba(255, 255, 255, 0.22);

	/* Komunikaty */
	--color-success: #55b685;
	--color-error: #d96b6b;

	/* Fonty */
	--font-body: "Inter", "Segoe UI", Arial, sans-serif;
    --font-heading: "Montserrat", "Segoe UI", Arial, sans-serif;

	/* Rozmiary tekstu */
	--font-size-small: 0.8125rem;
	--font-size-body: 1rem;
	--font-size-lead: clamp(1.0625rem, 1.5vw, 1.25rem);
	--font-size-h3: clamp(1.25rem, 2vw, 1.625rem);
	--font-size-h2: clamp(2rem, 4vw, 3.5rem);
	--font-size-h1: clamp(2.75rem, 6vw, 5.75rem);

	/* Odstępy */
	--space-1: 0.25rem;
	--space-2: 0.5rem;
	--space-3: 0.75rem;
	--space-4: 1rem;
	--space-5: 1.5rem;
	--space-6: 2rem;
	--space-7: 3rem;
	--space-8: 4rem;
	--space-9: 6rem;
	--space-10: 8rem;

	/* Układ strony */
	--container-width: 77.5rem;
	--container-narrow: 48rem;
	--container-padding: clamp(1rem, 4vw, 2rem);
	--section-spacing: clamp(4.5rem, 8vw, 8rem);

	/* Zaokrąglenia */
	--radius-small: 0.25rem;
	--radius-medium: 0.5rem;
	--radius-large: 0.875rem;

	/* Cienie */
	--shadow-small: 0 0.5rem 1.5rem rgba(0, 0, 0, 0.2);
	--shadow-large: 0 1.5rem 4rem rgba(0, 0, 0, 0.35);

	/* Animacje */
	--transition-fast: 160ms ease;
	--transition-normal: 280ms ease;

	/* Warstwy */
	--z-header: 100;
	--z-overlay: 200;
	--z-modal: 300;
}