/* ========== LATIN-EXT FONT SUBSETS — polskie znaki (ń, ą, ć, ę, ł, ó, ś, ź, ż) ========== */
/* theme.json wstrzykuje @font-face dla "latin" (U+0000-00FF). Bez unicode-range
   browser nie wie, że dla polskich znaków musi sięgnąć po inny plik — i fallbackuje
   do system fontu, który ma inne kerning/wagę. Te @font-face z explicit unicode-range
   pasują WYŁĄCZNIE do latin-ext, więc browser pobierze je tylko dla polskich znaków. */

@font-face {
	font-family: 'Rajdhani';
	font-weight: 400; font-style: normal; font-display: swap;
	src: url('../fonts/Rajdhani-Regular-ext.woff2') format('woff2');
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
	font-family: 'Rajdhani';
	font-weight: 500; font-style: normal; font-display: swap;
	src: url('../fonts/Rajdhani-Medium-ext.woff2') format('woff2');
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
	font-family: 'Rajdhani';
	font-weight: 600; font-style: normal; font-display: swap;
	src: url('../fonts/Rajdhani-SemiBold-ext.woff2') format('woff2');
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
	font-family: 'Rajdhani';
	font-weight: 700; font-style: normal; font-display: swap;
	src: url('../fonts/Rajdhani-Bold-ext.woff2') format('woff2');
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
	font-family: 'IBM Plex Sans';
	font-weight: 400; font-style: normal; font-display: swap;
	src: url('../fonts/IBMPlexSans-Regular-ext.woff2') format('woff2');
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
	font-family: 'IBM Plex Sans';
	font-weight: 500; font-style: normal; font-display: swap;
	src: url('../fonts/IBMPlexSans-Medium-ext.woff2') format('woff2');
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
	font-family: 'IBM Plex Sans';
	font-weight: 600; font-style: normal; font-display: swap;
	src: url('../fonts/IBMPlexSans-SemiBold-ext.woff2') format('woff2');
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
	font-family: 'JetBrains Mono';
	font-weight: 400; font-style: normal; font-display: swap;
	src: url('../fonts/JetBrainsMono-Regular-ext.woff2') format('woff2');
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
	font-family: 'JetBrains Mono';
	font-weight: 500; font-style: normal; font-display: swap;
	src: url('../fonts/JetBrainsMono-Medium-ext.woff2') format('woff2');
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* ========== DESIGN TOKENS — ATZ-Diament (1:1 z design-reference) ========== */

:root {
	/* --- Typography scales --- */
	--font-display: "Rajdhani", "Barlow Condensed", ui-sans-serif, system-ui, sans-serif;
	--font-body: "IBM Plex Sans", "Inter", ui-sans-serif, system-ui, sans-serif;
	--font-mono: "JetBrains Mono", "IBM Plex Mono", ui-monospace, monospace;

	/* --- Accent (runtime overridable przez Customizer) --- */
	--accent: #2062C7;
	--accent-ink: #FFFFFF;
	--accent-glow: color-mix(in oklab, var(--accent) 35%, transparent);

	/* --- Industrial grays --- */
	--concrete-50:  #F6F5F3;
	--concrete-100: #ECEAE6;
	--concrete-200: #D9D6CF;
	--concrete-300: #B5B0A6;
	--concrete-400: #87827A;
	--concrete-500: #5C5951;
	--concrete-600: #3D3B36;
	--concrete-700: #262523;
	--concrete-800: #17171A;
	--concrete-900: #0B0B0E;

	/* --- Semantic (light mode defaults) --- */
	--bg: var(--concrete-50);
	--bg-elev: #FFFFFF;
	--bg-inset: var(--concrete-100);
	--ink: var(--concrete-900);
	--ink-2: var(--concrete-600);
	--ink-3: var(--concrete-400);
	--hair: color-mix(in oklab, var(--concrete-900) 12%, transparent);
	--hair-strong: color-mix(in oklab, var(--concrete-900) 22%, transparent);
	--rule: color-mix(in oklab, var(--concrete-900) 8%, transparent);

	/* --- Grid unit --- */
	--u: 4px;

	/* --- Shadows: flat, industrial — avoid soft blur --- */
	--shadow-card: 0 1px 0 0 var(--hair);
	--shadow-lift: 0 2px 0 0 var(--hair), 0 12px 24px -16px rgba(0,0,0,.25);

	/* --- Motion --- */
	--ease: cubic-bezier(.2,.7,.2,1);

	/* --- Header height (used by hero to fit viewport on desktop) --- */
	--atz-header-h: 56px;
}
@media (min-width: 1024px) {
	:root { --atz-header-h: 96px; }
}

/* Dark mode wycięty świadomie — motyw zawsze light, niezależnie od ustawień systemowych. */

/* ===== Type utilities ===== */
.t-display { font-family: var(--font-display); font-weight: 600; letter-spacing: -0.015em; line-height: 0.95; }
.t-mono    { font-family: var(--font-mono); font-feature-settings: "ss01", "zero"; letter-spacing: 0.02em; }
.t-body    { font-family: var(--font-body); letter-spacing: -0.005em; }
.t-label   { font-family: var(--font-mono); text-transform: uppercase; font-size: 11px; letter-spacing: 0.12em; font-weight: 500; }

/* ===== Patterns ===== */
.tick-rule {
	background-image: linear-gradient(to right, var(--hair-strong) 1px, transparent 1px);
	background-size: 8px 1px;
	background-repeat: repeat-x;
}

.blueprint-grid {
	background-image:
		linear-gradient(var(--hair) 1px, transparent 1px),
		linear-gradient(90deg, var(--hair) 1px, transparent 1px);
	background-size: 32px 32px;
}

.diag-hatch {
	background-image: repeating-linear-gradient(
		-45deg,
		var(--hair-strong) 0 1px,
		transparent 1px 8px
	);
}

.caution-stripes {
	background-image: repeating-linear-gradient(
		-45deg,
		var(--accent) 0 10px,
		var(--ink) 10px 20px
	);
}

/* Concrete texture — subtle noise via radial dots */
.concrete {
	background-color: var(--bg-inset);
	background-image:
		radial-gradient(circle at 17% 42%, color-mix(in oklab, var(--ink) 8%, transparent) 0.5px, transparent 1px),
		radial-gradient(circle at 73% 28%, color-mix(in oklab, var(--ink) 6%, transparent) 0.4px, transparent 1px),
		radial-gradient(circle at 42% 81%, color-mix(in oklab, var(--ink) 7%, transparent) 0.5px, transparent 1px),
		radial-gradient(circle at 88% 67%, color-mix(in oklab, var(--ink) 5%, transparent) 0.4px, transparent 1px);
	background-size: 13px 11px, 19px 17px, 23px 19px, 29px 23px;
}

/* ===== Base ===== */
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
	font-family: var(--font-body);
	color: var(--ink);
	background: var(--bg);
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

button { font-family: inherit; cursor: pointer; border: 0; background: none; color: inherit; }
a { color: inherit; text-decoration: none; }
input, textarea, select { font: inherit; color: inherit; }

::selection { background: var(--accent); color: var(--accent-ink); }