/*
 * Nabory według dyscyplin — style front-endu.
 * Wszystko pod prefiksem .nd-, reset przez :where() (zerowa specyficzność),
 * żeby motyw nie nadpisywał sekcji i żeby sekcja nie nadpisywała motywu.
 */

/* ---------- Fonty (lokalne, bez CDN) ----------
   Poppins i Source Sans 3, czyli kroje, których serwis już używa. Deklarujemy je
   u siebie, żeby sekcja wyglądała tak samo także wtedy, gdy motyw przestanie
   ładować Google Fonts. */

@font-face {
	font-family: 'Poppins';
	font-style: normal;
	font-weight: 500;
	font-display: swap;
	src: url('../fonts/poppins-500-latin-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: 'Poppins';
	font-style: normal;
	font-weight: 500;
	font-display: swap;
	src: url('../fonts/poppins-500-latin.woff2') format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
	font-family: 'Poppins';
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url('../fonts/poppins-600-latin-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: 'Poppins';
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url('../fonts/poppins-600-latin.woff2') format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
	font-family: 'Poppins';
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url('../fonts/poppins-700-latin-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: 'Poppins';
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url('../fonts/poppins-700-latin.woff2') format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
	font-family: 'Source Sans 3';
	font-style: normal;
	font-weight: 400 700;
	font-display: swap;
	src: url('../fonts/sourcesans-var-latin-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: 'Source Sans 3';
	font-style: normal;
	font-weight: 400 700;
	font-display: swap;
	src: url('../fonts/sourcesans-var-latin.woff2') format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ---------- Tokeny ---------- */
.nd-sec {
	--nd-r-card: 20px;
	--nd-r-item: 12px;
	--nd-r-pill: 999px;

	--nd-bg: #F5F6F8;
	--nd-surface: #FFFFFF;
	--nd-fg: #0E1526;
	--nd-muted: #5C667B;
	--nd-line: rgba(14, 21, 38, .13);
	--nd-line-soft: rgba(14, 21, 38, .07);
	/* Warianty -l i -d wstawia PHP z panelu, tutaj wybieramy właściwy do motywu. */
	--nd-accent: var(--nd-accent-l, #1447E6);
	--nd-accent-fg: #FFFFFF;

	--nd-st-open: var(--nd-st-open-l, #166534);
	--nd-st-soon: var(--nd-st-soon-l, #9A3412);
	--nd-st-rolling: var(--nd-st-rolling-l, #1447E6);
	--nd-st-closed: var(--nd-st-closed-l, #5C667B);
	--nd-shadow: 0 28px 60px -32px rgba(14, 21, 38, .42);

	--nd-display: 'Poppins', ui-sans-serif, system-ui, sans-serif;
	--nd-body: 'Source Sans 3', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;
	--nd-ease: cubic-bezier(.16, 1, .3, 1);

	background: var(--nd-bg);
	color: var(--nd-fg);
	font-family: var(--nd-body);
	-webkit-font-smoothing: antialiased;
	padding: clamp(48px, 6vw, 104px) 0;
	position: relative;
	overflow: clip;
}

.nd-sec.nd-theme-dark,
.nd-sec.nd-theme-auto {
	color-scheme: light dark;
}

@media (prefers-color-scheme: dark) {
	.nd-sec.nd-theme-auto {
		--nd-bg: #0A0D14;
		--nd-surface: #11151F;
		--nd-fg: #F1F4FA;
		--nd-muted: #98A2B7;
		--nd-line: rgba(255, 255, 255, .15);
		--nd-line-soft: rgba(255, 255, 255, .08);
		--nd-accent: var(--nd-accent-d, #6E9BFF);
		--nd-st-open: var(--nd-st-open-d, #4ADE80);
		--nd-st-soon: var(--nd-st-soon-d, #FDBA74);
		--nd-st-rolling: var(--nd-st-rolling-d, #93B4FF);
		--nd-st-closed: var(--nd-st-closed-d, #98A2B7);
		--nd-shadow: 0 28px 60px -30px rgba(0, 0, 0, .75);
	}
}

.nd-sec.nd-theme-dark {
	--nd-bg: #0A0D14;
	--nd-surface: #11151F;
	--nd-fg: #F1F4FA;
	--nd-muted: #98A2B7;
	--nd-line: rgba(255, 255, 255, .15);
	--nd-line-soft: rgba(255, 255, 255, .08);
	--nd-accent: var(--nd-accent-d, #6E9BFF);
	--nd-st-open: var(--nd-st-open-d, #4ADE80);
	--nd-st-soon: var(--nd-st-soon-d, #FDBA74);
	--nd-st-rolling: var(--nd-st-rolling-d, #93B4FF);
	--nd-st-closed: var(--nd-st-closed-d, #98A2B7);
	--nd-shadow: 0 28px 60px -30px rgba(0, 0, 0, .75);
}

/* ---------- Reset o zerowej specyficzności ---------- */
:where(.nd-sec) *,
:where(.nd-sec) *::before,
:where(.nd-sec) *::after {
	box-sizing: border-box;
}

:where(.nd-sec) h2,
:where(.nd-sec) h3,
:where(.nd-sec) p,
:where(.nd-sec) ul,
:where(.nd-sec) li {
	margin: 0;
	padding: 0;
	list-style: none;
	font-family: inherit;
}

:where(.nd-sec) a {
	text-decoration: none;
	color: inherit;
	box-shadow: none;
}

:where(.nd-sec) button {
	font: inherit;
	color: inherit;
	background: none;
	border: 0;
	cursor: pointer;
}

:where(.nd-sec) canvas,
:where(.nd-sec) svg {
	display: block;
	max-width: 100%;
}

/* Sekcja bywa wstawiana w wąską kolumnę buildera, więc układ reaguje na
   szerokość kontenera, a nie okna. Inaczej przy kontenerze 870 px dostajemy
   trzy kolumny po 200 px, mimo że okno ma 1440 px. */
.nd-wrapin {
	width: 100%;
	max-width: 1400px;
	margin: 0 auto;
	padding: 0 clamp(18px, 4vw, 56px);
	container-type: inline-size;
	container-name: nd;
}

/* ---------- Nagłówek ---------- */
.nd-head {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 28px;
	align-items: end;
	margin-bottom: clamp(28px, 4vw, 50px);
}

@container nd (min-width: 960px) {
	.nd-head {
		grid-template-columns: minmax(0, 1.15fr) minmax(320px, .85fr);
		gap: 48px;
	}
}

@supports not (container-type: inline-size) {
	@media (min-width: 1024px) {
		.nd-head {
			grid-template-columns: minmax(0, 1.15fr) minmax(320px, .85fr);
			gap: 48px;
		}
	}
}

.nd-h2 {
	font-family: var(--nd-display);
	font-weight: 700;
	letter-spacing: -.015em;
	font-size: clamp(29px, 4.2vw, 52px);
	line-height: 1.16;
	max-width: 18ch;
	color: var(--nd-fg);
}

/* zapas na dolne wydłużenia (j, y, ź) w maskowanych wersach */
.nd-h2 .nd-ln {
	display: block;
	padding-bottom: .06em;
}

.nd-lead {
	margin-top: 18px;
	font-size: clamp(15px, 1.1vw, 17px);
	line-height: 1.55;
	color: var(--nd-muted);
	max-width: 56ch;
}

.nd-controls {
	display: flex;
	flex-direction: column;
	gap: 12px;
	align-items: flex-start;
}

@container nd (min-width: 960px) {
	.nd-controls { align-items: flex-end; }
}

@supports not (container-type: inline-size) {
	@media (min-width: 1024px) {
		.nd-controls { align-items: flex-end; }
	}
}

.nd-seg {
	display: inline-flex;
	position: relative;
	flex-wrap: wrap;
	gap: 4px;
	padding: 5px;
	background: var(--nd-surface);
	border: 1px solid var(--nd-line);
	border-radius: var(--nd-r-pill);
}

.nd-seg-btn {
	position: relative;
	padding: 11px 17px;
	border-radius: var(--nd-r-pill);
	font-size: 13.5px;
	font-weight: 600;
	line-height: 1;
	color: var(--nd-muted);
	white-space: nowrap;
	transition: color .3s var(--nd-ease);
}

.nd-seg-btn:hover {
	color: var(--nd-fg);
}

.nd-seg-btn[aria-pressed="true"] {
	color: var(--nd-accent-fg);
}

.nd-seg-btn:active {
	transform: scale(.97);
}

.nd-seg-btn > span {
	position: relative;
	z-index: 1;
}

/* Pigułka ma stałą szerokość, równą najszerszemu przyciskowi, i tylko się
   przesuwa. Animowanie szerokości wymuszałoby układ w każdej klatce, a przy
   zaokrągleniu kapsułkowym nie da się tego podmienić na scaleX bez zniekształcenia
   końcówek. Szerokość i pozycja pionowa są ustawiane raz, bez przejścia. */
.nd-ind {
	position: absolute;
	top: 5px;
	left: 5px;
	z-index: 0;
	height: calc(100% - 10px);
	border-radius: var(--nd-r-pill);
	background: var(--nd-accent);
	pointer-events: none;
	transition: transform .5s var(--nd-ease);
}

.nd-count {
	font-size: 13px;
	font-weight: 500;
	color: var(--nd-muted);
	font-variant-numeric: tabular-nums;
}

.nd-count b {
	color: var(--nd-fg);
	font-weight: 700;
}

/* ---------- Siatka ---------- */
.nd-grid {
	display: grid;
	grid-template-columns: repeat(12, 1fr);
	gap: clamp(12px, 1.2vw, 18px);
}

.nd-card {
	grid-column: span var(--nd-span, 4);
}

@container nd (max-width: 1099px) {
	.nd-card { grid-column: span 6; }
	.nd-card.nd-last-odd { grid-column: span 12; }
}

@container nd (max-width: 719px) {
	.nd-card,
	.nd-card.nd-last-odd { grid-column: span 12; }
}

@supports not (container-type: inline-size) {
	@media (max-width: 1099px) {
		.nd-card { grid-column: span 6; }
		.nd-card.nd-last-odd { grid-column: span 12; }
	}

	@media (max-width: 719px) {
		.nd-card,
		.nd-card.nd-last-odd { grid-column: span 12; }
	}
}

/* ---------- Kafel ---------- */
.nd-card {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	min-height: 316px;
	padding: clamp(20px, 1.8vw, 28px);
	border-radius: var(--nd-r-card);
	background: var(--nd-c, #1246D3);
	color: var(--nd-ink, #fff);
	overflow: hidden;
	isolation: isolate;
	transition: transform .6s var(--nd-ease), box-shadow .6s var(--nd-ease);
}

.nd-art {
	position: absolute;
	inset: 0;
	z-index: 0;
	width: 100%;
	height: 100%;
	opacity: .95;
	transition: transform .8s var(--nd-ease);
}

/* przyciemnienie grafiki pod tekstem: tytuł i metadane zawsze czytelne */
.nd-card::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	pointer-events: none;
	background:
		linear-gradient(180deg, rgba(var(--nd-crgb, 18, 70, 211), .94) 0%, rgba(var(--nd-crgb, 18, 70, 211), 0) 38%),
		linear-gradient(0deg, rgba(var(--nd-crgb, 18, 70, 211), .90) 0%, rgba(var(--nd-crgb, 18, 70, 211), 0) 26%);
}

.nd-glow {
	position: absolute;
	inset: 0;
	z-index: 1;
	opacity: 0;
	pointer-events: none;
	transition: opacity .5s var(--nd-ease);
	background: radial-gradient(340px circle at var(--nd-mx, 50%) var(--nd-my, 50%), rgba(255, 255, 255, .34), transparent 62%);
}

.nd-top,
.nd-foot {
	position: relative;
	z-index: 2;
}

@media (hover: hover) {
	.nd-card:hover {
		transform: translateY(-6px);
		box-shadow: var(--nd-shadow);
	}

	.nd-card:hover .nd-glow {
		opacity: 1;
	}

	.nd-card:hover .nd-art {
		transform: scale(1.06);
	}
}

.nd-card:focus-within {
	box-shadow: var(--nd-shadow);
}

/* Kafel, którym zawężono listę pod spodem. */
.nd-card.nd-picked {
	outline: 3px solid var(--nd-fg);
	outline-offset: 3px;
}

.nd-title {
	font-family: var(--nd-display);
	font-weight: 600;
	letter-spacing: -.012em;
	font-size: clamp(20px, 1.75vw, 27px);
	line-height: 1.18;
	max-width: 16ch;
	color: inherit;
}

.nd-title a::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 2;
	border-radius: var(--nd-r-card);
}

.nd-title a:focus-visible::after {
	outline: 3px solid currentColor;
	outline-offset: -4px;
}

.nd-foot {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 16px;
	margin-top: 24px;
}

.nd-meta {
	display: flex;
	flex-direction: column;
	gap: 3px;
	min-width: 0;
}

.nd-meta b {
	font-family: var(--nd-display);
	font-weight: 700;
	font-size: 17px;
	line-height: 1.1;
	letter-spacing: -.01em;
}

.nd-meta span {
	font-size: 13.5px;
	line-height: 1.35;
	font-weight: 500;
	opacity: .84;
}

.nd-meta .nd-urgent {
	opacity: 1;
	font-weight: 700;
}

.nd-arrow {
	flex: none;
	display: grid;
	place-items: center;
	width: 52px;
	height: 52px;
	border-radius: var(--nd-r-pill);
	background: var(--nd-arr-bg, #fff);
	color: var(--nd-arr-fg, #1246D3);
	transition: transform .5s var(--nd-ease);
}

.nd-arrow svg {
	width: 19px;
	height: 19px;
	transition: transform .5s var(--nd-ease);
}

@media (hover: hover) {
	.nd-card:hover .nd-arrow {
		transform: scale(1.08);
	}

	.nd-card:hover .nd-arrow svg {
		transform: translateX(3px);
	}
}

/* ---------- Wariant [nabory_kafle]: same kafle ---------- */
.nd-only-tiles {
	padding: clamp(28px, 3vw, 56px) 0;
	background: transparent;
}

/* Strzałka schodzi pod listę naborów i wjeżdża razem z szufladą. */
.nd-arrow-on-hover .nd-foot .nd-arrow {
	display: none;
}

.nd-drawer-go {
	display: none;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	margin-top: 14px;
	padding-top: 12px;
	border-top: 1px solid rgba(255, 255, 255, .18);
	color: #fff;
	transition: opacity .25s ease;
}

.nd-drawer-go:hover {
	opacity: .82;
}

.nd-arrow-on-hover .nd-drawer-go {
	display: flex;
	flex: none;
}

/* Wiersz ze strzałką musi zostać widoczny nawet wtedy, gdy lista naborów
   się przewija, więc szuflada jest kolumną, a przewija się tylko lista. */
.nd-arrow-on-hover .nd-drawer {
	display: flex;
	flex-direction: column;
	overflow: hidden;
}

.nd-arrow-on-hover .nd-drawer-h,
.nd-arrow-on-hover .nd-more,
.nd-arrow-on-hover .nd-empty-in {
	flex: none;
}

.nd-arrow-on-hover .nd-drawer ul {
	min-height: 0;
	overflow-x: hidden;
	overflow-y: auto;
	overscroll-behavior: contain;
}

/* Wariant z samymi kaflami dostaje więcej wysokości: mieści listę i strzałkę. */
.nd-only-tiles .nd-card {
	min-height: 410px;
}

/* Cienki pasek w kolorze szuflady zamiast systemowego, który na ciemnym tle
   wygląda jak usterka. */
.nd-drawer,
.nd-drawer ul {
	scrollbar-width: thin;
	scrollbar-color: rgba(255, 255, 255, .42) transparent;
}

.nd-drawer::-webkit-scrollbar,
.nd-drawer ul::-webkit-scrollbar {
	width: 6px;
	height: 0;
}

.nd-drawer::-webkit-scrollbar-track,
.nd-drawer ul::-webkit-scrollbar-track {
	background: transparent;
}

.nd-drawer::-webkit-scrollbar-thumb,
.nd-drawer ul::-webkit-scrollbar-thumb {
	border-radius: 999px;
	background: rgba(255, 255, 255, .42);
}

.nd-drawer-go-label {
	font-size: 12.5px;
	font-weight: 600;
	letter-spacing: .01em;
}

.nd-arrow-drawer {
	width: 40px;
	height: 40px;
	background: #fff;
	color: var(--nd-deep, #0A2E8A);
}

.nd-arrow-drawer svg {
	width: 16px;
	height: 16px;
}

@media (hover: hover) {
	.nd-arrow-on-hover .nd-card:hover .nd-arrow-drawer {
		transform: scale(1.06);
	}
}

/* ---------- Szuflada z naborami ---------- */
.nd-drawer {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 3;
	padding: 13px 18px 15px;
	background: var(--nd-deep, #0A2E8A);
	color: #fff;
	border-radius: var(--nd-r-card);
	/* --nd-dmax liczone w JS z realnej wysokości tytułu */
	max-height: var(--nd-dmax, 72%);
	/* Oba kierunki podane wprost. Przy samym overflow-y przeglądarka wylicza
	   overflow-x jako auto i rysuje pusty pasek poziomy pod listą. */
	overflow-x: hidden;
	overflow-y: auto;
	overscroll-behavior: contain;
	transform: translateY(101%);
	visibility: hidden;
	transition: transform .55s var(--nd-ease), visibility 0s linear .55s;
	box-shadow: 0 -18px 40px -24px rgba(0, 0, 0, .6);
}

@media (hover: hover) {
	.nd-card:hover .nd-drawer {
		transform: translateY(0);
		visibility: visible;
		transition-delay: 0s, 0s;
	}
}

.nd-card:focus-within .nd-drawer {
	transform: translateY(0);
	visibility: visible;
	transition-delay: 0s, 0s;
}

.nd-drawer.nd-scrollable {
	-webkit-mask-image: linear-gradient(180deg, #000 calc(100% - 20px), transparent);
	mask-image: linear-gradient(180deg, #000 calc(100% - 20px), transparent);
}

.nd-drawer-h {
	margin-bottom: 7px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
	opacity: .7;
}

.nd-drawer ul {
	display: grid;
}

.nd-drawer li + li {
	border-top: 1px solid rgba(255, 255, 255, .16);
}

/* Każdy z czterech elementów ma wskazaną komórkę. Przy rozmieszczaniu
   automatycznym długi tytuł potrafił wpaść do kolumny „auto”, która rozdymała
   się do jego szerokości, a kolumna z jedynką fr kurczyła się do zera. */
.nd-nab {
	display: grid;
	grid-template-columns: minmax(0, 1fr) max-content;
	grid-template-rows: auto auto;
	gap: 1px 14px;
	align-items: baseline;
	padding: 8px 0;
	color: #fff;
	border-radius: 6px;
	transition: opacity .25s ease, transform .35s var(--nd-ease);
}

.nd-nab:hover {
	opacity: .78;
	transform: translateX(3px);
}

.nd-nab:focus-visible {
	outline: 2px solid #fff;
	outline-offset: 3px;
}

/* Urzędowe nazwy naborów bywają bardzo długie. W kaflu przycinamy je do trzech
   wierszy, żeby jeden wpis nie zajął całej szuflady. Ograniczenie idzie przez
   max-height, bo element siatki blokuje display:-webkit-box, przez co
   -webkit-line-clamp nie działa. Pełny tytuł jest w atrybucie title i na
   stronie naboru. */
.nd-nab-t {
	grid-column: 1 / 2;
	grid-row: 1;
	min-width: 0;
	font-size: 13.5px;
	font-weight: 600;
	line-height: 1.28;
	max-height: 3.84em;
	overflow: hidden;
	overflow-wrap: anywhere;
}

.nd-nab-d {
	grid-column: 2 / 3;
	grid-row: 1;
	font-size: 12.5px;
	font-weight: 700;
	white-space: nowrap;
	font-variant-numeric: tabular-nums;
}

.nd-nab-o {
	grid-column: 1 / 2;
	grid-row: 2;
	min-width: 0;
	font-size: 11.5px;
	font-weight: 500;
	opacity: .7;
	overflow-wrap: anywhere;
}

.nd-nab-x {
	grid-column: 2 / 3;
	grid-row: 2;
	font-size: 11.5px;
	font-weight: 500;
	text-align: right;
	white-space: nowrap;
	opacity: .7;
}

.nd-nab.nd-soon .nd-nab-d {
	color: #FFD166;
}

.nd-more {
	margin-top: 10px;
	font-size: 12.5px;
	font-weight: 600;
}

.nd-more a {
	border-bottom: 1px solid rgba(255, 255, 255, .4);
	padding-bottom: 1px;
}

.nd-more a:hover {
	border-bottom-color: #fff;
}

.nd-empty-in {
	font-size: 13.5px;
	line-height: 1.45;
	opacity: .9;
}

/* na dotyku i w wąskiej kolumnie nic się nie chowa: lista naborów jest
   częścią kafla. Test dotyku musi zostać media query, kontener tego nie umie. */
@media (hover: none) {
	.nd-drawer {
		position: static;
		transform: none;
		visibility: visible;
		max-height: none;
		margin-top: 20px;
		border-radius: var(--nd-r-item);
		box-shadow: none;
		transition: none;
	}

	/* Wysokość ma wynikać z treści. Wymuszone minimum zostawiłoby pod listą
	   pustą przestrzeń, bo szuflada nie jest już nałożona na kafel. */
	.nd-card,
	.nd-only-tiles .nd-card {
		min-height: 0;
		justify-content: flex-start;
	}

	.nd-card .nd-foot {
		margin-top: 18px;
	}

	.nd-arrow-on-hover .nd-drawer {
		overflow: visible;
	}

	.nd-arrow-on-hover .nd-drawer ul {
		overflow: visible;
	}
}

@container nd (max-width: 719px) {
	.nd-drawer {
		position: static;
		transform: none;
		visibility: visible;
		max-height: none;
		margin-top: 20px;
		border-radius: var(--nd-r-item);
		box-shadow: none;
		transition: none;
	}

	.nd-card,
	.nd-only-tiles .nd-card {
		min-height: 0;
		justify-content: flex-start;
	}

	.nd-card .nd-foot {
		margin-top: 18px;
	}

	.nd-arrow-on-hover .nd-drawer,
	.nd-arrow-on-hover .nd-drawer ul {
		overflow: visible;
	}
}

@supports not (container-type: inline-size) {
	@media (max-width: 719px) {
		.nd-drawer {
			position: static;
			transform: none;
			visibility: visible;
			max-height: none;
			margin-top: 20px;
			border-radius: var(--nd-r-item);
			box-shadow: none;
			transition: none;
		}

		.nd-card,
		.nd-only-tiles .nd-card {
			min-height: 0;
			justify-content: flex-start;
		}

		.nd-card .nd-foot {
			margin-top: 18px;
		}

		.nd-arrow-on-hover .nd-drawer,
		.nd-arrow-on-hover .nd-drawer ul {
			overflow: visible;
		}
	}
}

/* ---------- Stany ---------- */
.nd-state {
	display: none;
	padding: 44px 0;
	text-align: center;
}

.nd-state.nd-on {
	display: block;
}

.nd-state h3 {
	margin-bottom: 8px;
	font-family: var(--nd-display);
	font-weight: 700;
	font-size: 20px;
	color: var(--nd-fg);
}

.nd-state p {
	margin-bottom: 18px;
	font-size: 14.5px;
	color: var(--nd-muted);
}

.nd-retry {
	display: inline-block;
	padding: 11px 20px;
	border: 1px solid var(--nd-line);
	border-radius: var(--nd-r-pill);
	background: var(--nd-surface);
	color: var(--nd-fg);
	font-size: 14px;
	font-weight: 600;
}

.nd-retry:hover {
	border-color: var(--nd-accent);
	color: var(--nd-accent);
}

/* ---------- Stopka sekcji ---------- */
.nd-tail {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 18px 28px;
	margin-top: clamp(26px, 3vw, 42px);
	padding-top: clamp(20px, 2vw, 28px);
	border-top: 1px solid var(--nd-line);
}

.nd-tail p {
	max-width: 54ch;
	font-size: 14.5px;
	line-height: 1.5;
	color: var(--nd-muted);
}

.nd-cta {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 14px 22px;
	border-radius: var(--nd-r-pill);
	background: var(--nd-accent);
	color: var(--nd-accent-fg);
	font-size: 14.5px;
	font-weight: 700;
	transition: transform .35s var(--nd-ease), filter .35s var(--nd-ease);
}

.nd-cta svg {
	width: 17px;
	height: 17px;
	transition: transform .4s var(--nd-ease);
}

.nd-cta:hover {
	filter: brightness(1.08);
}

.nd-cta:hover svg {
	transform: translateX(4px);
}

.nd-cta:active {
	transform: translateY(1px) scale(.985);
}

.nd-cta:focus-visible,
.nd-seg-btn:focus-visible,
.nd-retry:focus-visible {
	outline: 3px solid var(--nd-accent);
	outline-offset: 3px;
}

/* ---------- Pełna lista ---------- */
.nd-list-h {
	margin-bottom: 24px;
}

.nd-list {
	margin-top: clamp(34px, 4vw, 60px);
	padding-top: clamp(24px, 2.5vw, 36px);
	border-top: 1px solid var(--nd-line);
	scroll-margin-top: 90px;
}

.nd-hidden {
	display: none !important;
}

.nd-list-bar {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 10px 20px;
	margin-bottom: 18px;
}

.nd-list-count {
	margin-left: auto;
	font-size: 13px;
	font-weight: 500;
	color: var(--nd-muted);
	font-variant-numeric: tabular-nums;
}

/* ---------- Wyszukiwarka ---------- */
.nd-search {
	display: flex;
	gap: 8px;
	margin-bottom: 18px;
	max-width: 560px;
}

.nd-search input[type="search"] {
	flex: 1;
	min-width: 0;
	padding: 12px 16px;
	border: 1px solid var(--nd-line);
	border-radius: var(--nd-r-pill);
	background: var(--nd-surface);
	color: var(--nd-fg);
	font: 400 14.5px/1.3 var(--nd-body);
	appearance: none;
	-webkit-appearance: none;
}

.nd-search input[type="search"]::placeholder {
	color: var(--nd-muted);
	opacity: 1;
}

.nd-search input[type="search"]:focus {
	outline: 3px solid var(--nd-accent);
	outline-offset: 2px;
	border-color: transparent;
}

.nd-search-go {
	flex: none;
	padding: 12px 22px;
	border-radius: var(--nd-r-pill);
	background: var(--nd-accent);
	color: var(--nd-accent-fg);
	font-size: 14px;
	font-weight: 700;
}

.nd-search-go:hover {
	filter: brightness(1.08);
}

.nd-search-go:focus-visible {
	outline: 3px solid var(--nd-accent);
	outline-offset: 3px;
}

/* Przy działającym skrypcie filtrowanie jest natychmiastowe, więc przycisk
   przestaje być potrzebny. Bez skryptu zostaje i wysyła formularz. */
.nd-js .nd-search-go {
	display: none;
}

.nd-list-title {
	font-family: var(--nd-display);
	font-weight: 600;
	font-size: clamp(19px, 1.7vw, 26px);
	letter-spacing: -.012em;
	color: var(--nd-fg);
}

.nd-list-clear {
	font-size: 13.5px;
	font-weight: 600;
	color: var(--nd-accent);
	border-bottom: 1px solid currentColor;
	padding-bottom: 1px;
}

.nd-list-clear:hover {
	filter: brightness(1.1);
}

/* Podpisy kolumn, żeby było jasne, że ostatnia liczba to termin składania. */
.nd-rows-head {
	display: none;
	padding: 0 0 8px;
	border-bottom: 1px solid var(--nd-line);
	font-size: 11.5px;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--nd-muted);
}

.nd-rows-head span:last-child {
	text-align: right;
}

@container nd (min-width: 720px) {
	.nd-rows-head {
		display: grid;
		grid-template-columns: minmax(0, 1fr) 130px 150px;
		gap: 20px;
	}
}

@supports not (container-type: inline-size) {
	@media (min-width: 768px) {
		.nd-rows-head {
			display: grid;
			grid-template-columns: minmax(0, 1fr) 130px 150px;
			gap: 20px;
		}
	}
}

.nd-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-bottom: 30px;
}

.nd-chip {
	padding: 9px 16px;
	border: 1px solid var(--nd-line);
	border-radius: var(--nd-r-pill);
	background: var(--nd-surface);
	font-size: 13.5px;
	font-weight: 600;
	color: var(--nd-muted);
	transition: color .25s ease, border-color .25s ease;
}

.nd-chip:hover {
	color: var(--nd-fg);
	border-color: var(--nd-c, var(--nd-accent));
}

.nd-chip.nd-on {
	color: var(--nd-fg);
	border-color: transparent;
	box-shadow: inset 0 0 0 2px var(--nd-c, var(--nd-accent));
}

/* Kolor dyscypliny niesie informację, więc zostaje, ale jako pozioma linia
   działowa nad grupą, a nie pasek przy krawędzi. */
.nd-group {
	margin-bottom: 38px;
	padding-top: 16px;
	border-top: 2px solid var(--nd-c, var(--nd-accent));
}

.nd-group-h {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 12px;
	margin-bottom: 12px;
	font-family: var(--nd-display);
	font-weight: 700;
	font-size: clamp(19px, 1.6vw, 25px);
	letter-spacing: -.02em;
	color: var(--nd-fg);
}

.nd-group-h a:hover {
	color: var(--nd-accent);
}

.nd-group-h small {
	font-family: var(--nd-body);
	font-size: 13px;
	font-weight: 500;
	color: var(--nd-muted);
}

.nd-rows {
	display: grid;
}

.nd-row + .nd-row {
	border-top: 1px solid var(--nd-line-soft);
}

.nd-row a {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 4px;
	padding: 14px 0;
	transition: transform .35s var(--nd-ease);
}

@container nd (min-width: 720px) {
	.nd-row a {
		grid-template-columns: minmax(0, 1fr) 130px 150px;
		align-items: baseline;
		gap: 4px 20px;
	}
}

@supports not (container-type: inline-size) {
	@media (min-width: 768px) {
		.nd-row a {
			grid-template-columns: minmax(0, 1fr) 130px 150px;
			align-items: baseline;
			gap: 4px 20px;
		}
	}
}

.nd-row a:hover {
	transform: translateX(4px);
}

.nd-row a:focus-visible {
	outline: 3px solid var(--nd-accent);
	outline-offset: 2px;
}

.nd-row-t {
	min-width: 0;
	font-size: 15.5px;
	font-weight: 600;
	line-height: 1.35;
	color: var(--nd-fg);
	overflow-wrap: anywhere;
}

.nd-row-o {
	font-size: 12.5px;
	font-weight: 500;
	color: var(--nd-muted);
}

/* Tu również wskazujemy komórki wprost, żeby długi tytuł nie mógł wylądować
   w kolumnie statusu ani terminu. */
@container nd (min-width: 720px) {
	.nd-row-t { grid-column: 1 / 2; grid-row: 1; }
	.nd-row-o { grid-column: 1 / 2; grid-row: 2; }
	.nd-row-s { grid-row: 1; grid-column: 2 / 3; }
	.nd-row-d { grid-row: 1; grid-column: 3 / 4; text-align: right; }
}

@supports not (container-type: inline-size) {
	@media (min-width: 768px) {
		.nd-row-t { grid-column: 1 / 2; grid-row: 1; }
		.nd-row-o { grid-column: 1 / 2; grid-row: 2; }
		.nd-row-s { grid-row: 1; grid-column: 2 / 3; }
		.nd-row-d { grid-row: 1; grid-column: 3 / 4; text-align: right; }
	}
}

/* Kolor niesie status naboru, nie dyscyplinę: te same cztery barwy w całym
   serwisie, ustawiane w panelu, z automatycznym wariantem na ciemne tło. */
.nd-row-s {
	font-size: 12.5px;
	font-weight: 700;
	color: var(--nd-accent);
}

.nd-st-open .nd-row-s { color: var(--nd-st-open); }
.nd-st-soon .nd-row-s { color: var(--nd-st-soon); }
.nd-st-rolling .nd-row-s { color: var(--nd-st-rolling); }
.nd-st-closed .nd-row-s { color: var(--nd-st-closed); }

.nd-st-closed .nd-row-t {
	opacity: .55;
}

.nd-row-d {
	font-size: 13px;
	font-weight: 500;
	color: var(--nd-muted);
	font-variant-numeric: tabular-nums;
}

/* ---------- Reveal i dostępność ---------- */
.nd-anim .nd-rv {
	opacity: 0;
}

.nd-sr {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

.nd-admin-note {
	margin: 16px 0;
	padding: 12px 16px;
	border: 1px solid #d6a3a4;
	border-radius: 8px;
	background: #fcf0f1;
	color: #8a1f21;
	font-size: 14px;
}

@media (prefers-reduced-motion: reduce) {
	.nd-sec *,
	.nd-sec *::before,
	.nd-sec *::after {
		animation-duration: .001ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .001ms !important;
	}

	.nd-anim .nd-rv {
		opacity: 1 !important;
		transform: none !important;
	}
}

/* ---------- Zabezpieczenie przed stylami motywu ----------
   Motywy i buildery kolorują odnośniki i przyciski selektorami w rodzaju
   `.elementor-kit-6 a { color: … }`. Taki selektor bije reset zapisany przez
   :where(), przez co biały tytuł na ciemnym kaflu robił się grafitowy.
   Poniższe reguły mają wyższą specyficzność i przywracają nasze kolory.
   Wszystko jest ograniczone do .nd-sec, więc nic poza sekcją nie zmieniamy. */
/* Stany :hover i :focus wymagają osobnych, jeszcze mocniejszych reguł, bo
   `.elementor-kit-6 a:hover` ma specyficzność 0,2,1 i bije samo `.nd-sec .nd-title a`.
   Stąd dodatkowy człon w selektorze. */
.nd-sec .nd-card .nd-title a,
.nd-sec .nd-card .nd-title a:link,
.nd-sec .nd-card .nd-title a:visited,
.nd-sec .nd-card .nd-title a:hover,
.nd-sec .nd-card .nd-title a:focus,
.nd-sec .nd-card .nd-title a:active { color: inherit; }

.nd-sec .nd-list .nd-row a,
.nd-sec .nd-list .nd-row a:link,
.nd-sec .nd-list .nd-row a:visited,
.nd-sec .nd-list .nd-row a:hover,
.nd-sec .nd-list .nd-row a:focus,
.nd-sec .nd-list .nd-row a:active { color: inherit; }

.nd-sec .nd-card .nd-drawer .nd-nab,
.nd-sec .nd-card .nd-drawer .nd-nab:link,
.nd-sec .nd-card .nd-drawer .nd-nab:visited,
.nd-sec .nd-card .nd-drawer .nd-nab:hover,
.nd-sec .nd-card .nd-drawer .nd-nab:focus,
.nd-sec .nd-card .nd-drawer .nd-nab:active,
.nd-sec .nd-card .nd-drawer .nd-more a,
.nd-sec .nd-card .nd-drawer .nd-more a:hover,
.nd-sec .nd-card .nd-drawer .nd-more a:focus,
.nd-sec .nd-card .nd-drawer .nd-drawer-go,
.nd-sec .nd-card .nd-drawer .nd-drawer-go:link,
.nd-sec .nd-card .nd-drawer .nd-drawer-go:visited,
.nd-sec .nd-card .nd-drawer .nd-drawer-go:hover,
.nd-sec .nd-card .nd-drawer .nd-drawer-go:focus { color: #fff; }

.nd-sec .nd-tail .nd-cta,
.nd-sec .nd-tail .nd-cta:link,
.nd-sec .nd-tail .nd-cta:visited,
.nd-sec .nd-tail .nd-cta:hover,
.nd-sec .nd-tail .nd-cta:focus,
.nd-sec .nd-tail .nd-cta:active {
	color: var(--nd-accent-fg);
	background: var(--nd-accent);
}

.nd-sec .nd-list .nd-chip,
.nd-sec .nd-list .nd-chip:link,
.nd-sec .nd-list .nd-chip:visited { color: var(--nd-muted); }
.nd-sec .nd-list .nd-chip:hover,
.nd-sec .nd-list .nd-chip:focus,
.nd-sec .nd-list .nd-chip.nd-on { color: var(--nd-fg); }

.nd-sec .nd-search-go,
.nd-sec .nd-search-go:hover,
.nd-sec .nd-search-go:focus {
	color: var(--nd-accent-fg);
	background: var(--nd-accent);
}

.nd-sec .nd-search input[type="search"] { color: var(--nd-fg); }

.nd-sec .nd-list .nd-list-clear,
.nd-sec .nd-list .nd-list-clear:hover,
.nd-sec .nd-list .nd-list-clear:focus,
.nd-sec .nd-list .nd-list-clear:visited { color: var(--nd-accent); }

.nd-sec .nd-state .nd-retry,
.nd-sec .nd-state .nd-retry:visited { color: var(--nd-fg); }
.nd-sec .nd-state .nd-retry:hover,
.nd-sec .nd-state .nd-retry:focus { color: var(--nd-accent); }

.nd-sec .nd-seg-btn { color: var(--nd-muted); }
.nd-sec .nd-seg-btn:hover { color: var(--nd-fg); }
.nd-sec .nd-seg-btn[aria-pressed="true"] { color: var(--nd-accent-fg); }

.nd-sec .nd-row-t { color: var(--nd-fg); }
.nd-sec .nd-st-open .nd-row-s { color: var(--nd-st-open); }
.nd-sec .nd-st-soon .nd-row-s { color: var(--nd-st-soon); }
.nd-sec .nd-st-rolling .nd-row-s { color: var(--nd-st-rolling); }
.nd-sec .nd-st-closed .nd-row-s { color: var(--nd-st-closed); }
.nd-sec .nd-row-o,
.nd-sec .nd-row-d { color: var(--nd-muted); }

.nd-sec .nd-h2,
.nd-sec .nd-group-h,
.nd-sec .nd-list-title,
.nd-sec .nd-state h3 { color: var(--nd-fg); }

.nd-sec .nd-list-clear { color: var(--nd-accent); }
.nd-sec .nd-rows-head { color: var(--nd-muted); }

.nd-sec .nd-card .nd-title,
.nd-sec .nd-card .nd-meta { color: var(--nd-ink, #fff); }

.nd-sec .nd-drawer,
.nd-sec .nd-drawer-h,
.nd-sec .nd-empty-in { color: #fff; }

@media print {
	.nd-sec {
		background: #fff !important;
	}

	.nd-anim .nd-rv,
	.nd-rv {
		opacity: 1 !important;
		transform: none !important;
	}

	.nd-drawer {
		position: static !important;
		transform: none !important;
		visibility: visible !important;
		max-height: none !important;
	}

	.nd-art,
	.nd-glow {
		display: none !important;
	}
}