/*
 * Kolonia Gosławicka — style komponentów.
 * Tokeny pochodzą z theme.json (--wp--preset--*). Ten plik dodaje wyłącznie to,
 * czego theme.json nie wyraża: komponenty, stany i drobne układy.
 * docs/06 §18 — niska specyficzność, bez !important jako strategii.
 */

/* ---------- 1. Podstawy ---------- */

:root {
	--kg-radius-sm: 4px;
	--kg-radius-md: 10px;
	--kg-radius-lg: 16px;
	--kg-radius-xl: 20px;
	--kg-tap: 44px;
	--kg-duration: 180ms;

	/* Kolor linku zależy od kontekstu, nie od miejsca reguły w pliku. Jasne tło:
	   docs/05 §14.1 (brand-700, hover brand-800 na brand-100). Ciemne tło i pasy
	   niebieskie nadpisują te trzy zmienne u siebie. */
	--kg-link: var(--wp--preset--color--brand-strong);
	--kg-link-hover: var(--wp--preset--color--brand-deep);
	--kg-link-hover-bg: var(--wp--preset--color--brand-faint);
}

html, body { overflow-x: clip; }

/* Nagłówek, treść i stopka same odmierzają swoje odstępy. Domyślny blockGap
   WordPressa (24 px) wstawiał między nie biały pas — nad hero wyglądał jak
   niedokończona sekcja. Reguła bazowa jest w :where(), więc jedna klasa
   wystarcza, żeby ją nadpisać. */
.wp-site-blocks > * {
	margin-block-start: 0;
	margin-block-end: 0;
}

body {
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

/* docs/05 §15.1 — wskaźnik fokusu widoczny na każdym tle. */
:focus-visible {
	outline: 3px solid var(--wp--preset--color--focus);
	outline-offset: 3px;
	box-shadow: 0 0 0 2px var(--wp--preset--color--ink);
	border-radius: var(--kg-radius-sm);
}

/* docs/08 — link pomijający nawigację; widoczny dopiero po otrzymaniu fokusu. */
.kg-skip-link {
	position: absolute;
	left: -9999px;
	z-index: 100;
	display: inline-flex;
	align-items: center;
	min-height: var(--kg-tap);
	padding: 0 18px;
	border-radius: 8px;
	background: var(--wp--preset--color--brand-strong);
	color: var(--wp--preset--color--surface);
	font-size: 16px;
	font-weight: 600;
	text-decoration: none;
}

.kg-skip-link:focus {
	left: var(--wp--preset--spacing--40);
	top: var(--wp--preset--spacing--20);
}

/* docs/05 §16 — ruch tylko wtedy, gdy wyjaśnia zmianę stanu. */
@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}

/* docs/05 §6.3 — czytelność przy wymuszonych kolorach systemowych. */
@media (forced-colors: active) {
	.kg-card,
	.kg-quick__item {
		border: 1px solid CanvasText;
	}
}

/* ---------- 2. Elementy powtarzalne ---------- */

/* Jedyna definicja nadlinii. Duplikat w §16 kasował wariant jasny i przez to
   eyebrow na niebieskim pasie był nieczytelny. */
.kg-eyebrow {
	display: block;
	margin: 0 0 10px;
	font-size: 13px;
	font-weight: 750;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--wp--preset--color--brand-strong);
}

/* Duplikat wymuszał brand-strong: 1,38:1 na pasie i 1,10:1 na panelu hero —
   nadlinia była praktycznie niewidoczna. Biel daje 5,14:1 na #0170C1
   i 7,82:1 na #00558D; on-brand-muted to tylko 4,0:1, za mało dla 13 px
   (docs/05 §6.1, WCAG 1.4.3). */
.kg-eyebrow--light,
.kg-band--brand .kg-eyebrow,
.kg-hero__panel .kg-eyebrow,
.kg-footer .kg-eyebrow {
	color: #fff;
}

.kg-meta {
	font-size: 15px;
	color: var(--wp--preset--color--ink-muted);
}

/* Linki zachowują odrębność bez podkreślenia: kolor i półgrube pismo są
   widoczne w stanie spoczynku, a łagodne tło potwierdza interakcję.
   Wyłączenia są w :where(), więc nie podbijają specyficzności — kolor ustawia
   wyłącznie ta reguła, a komponenty zmieniają zmienne, nie właściwość color.
   Prefiks :root podnosi wagę ponad regułę elements.link z theme.json. */
:root a:where(:not(.kg-btn, .kg-action, .kg-brand, .kg-nav__link, .kg-search-link, .kg-menu-toggle, .kg-share__button, .kg-button, .kg-skip-link, .kg-scope__link, .kg-datownik__step, .kg-datownik__day, .kg-taglist__item, .kg-chip, .page-numbers)) {
	border-radius: var(--kg-radius-sm);
	color: var(--kg-link);
	font-weight: 600;
	text-decoration: none;
	transition: color var(--kg-duration) ease, background-color var(--kg-duration) ease;
}

:root a:where(:not(.kg-btn, .kg-action, .kg-brand, .kg-nav__link, .kg-search-link, .kg-menu-toggle, .kg-share__button, .kg-button, .kg-skip-link, .kg-scope__link, .kg-datownik__step, .kg-datownik__day, .kg-taglist__item, .kg-chip, .page-numbers)):hover {
	background-color: var(--kg-link-hover-bg);
	color: var(--kg-link-hover);
}

/* Ciemne tła: link biały w spoczynku, jasnoniebieski na hoverze wraz z
   rozjaśnionym tłem. Dotyczy stopki, kafelków dat i ciemnego hero wydarzenia. */
.kg-footer,
.kg-datetile,
.kg-event-hero {
	--kg-link: #fff;
	--kg-link-hover: var(--wp--preset--color--brand-soft);
	--kg-link-hover-bg: rgba(255, 255, 255, 0.14);
}

/* Pasy i panele w kolorze marki: ten sam biały link, ale tło hoveru przyciemnia,
   bo jasnoniebieski tekst na jasnym niebieskim nie utrzymałby kontrastu. */
.kg-band--brand,
.kg-hero__panel {
	--kg-link: #fff;
	--kg-link-hover: var(--wp--preset--color--brand-soft);
	--kg-link-hover-bg: rgba(0, 0, 0, 0.2);
}

/* Linki, które są tytułami lub pozycjami nawigacji: kolor tekstu w spoczynku,
   niebieski dopiero na hoverze. */
.kg-card__title,
.kg-content-card h2,
.kg-news-card h2,
.kg-search-result h2,
.kg-contact-list,
.kg-quick__item,
.kg-mobile-panel__link {
	--kg-link: var(--wp--preset--color--ink);
	--kg-link-hover: var(--wp--preset--color--brand-strong);
	--kg-link-hover-bg: var(--wp--preset--color--brand-faint);
}

/* Okruszki dziedziczą kolor po akapicie; hover zostaje niebieski. */
.kg-breadcrumb {
	--kg-link: currentColor;
	--kg-link-hover: var(--wp--preset--color--brand-strong);
}

/* Link działania ze strzałką. Strzałka jest dekoracją — niesie ją ::after. */
.kg-action {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	min-height: var(--kg-tap);
	font-size: 15px;
	font-weight: 700;
	letter-spacing: 0.02em;
	color: var(--kg-link);
	text-decoration: none;
}

.kg-action::after {
	content: "";
	flex: none;
	width: 16px;
	height: 16px;
	background-color: currentColor;
	mask: var(--kg-arrow) center / contain no-repeat;
	-webkit-mask: var(--kg-arrow) center / contain no-repeat;
}

.kg-action:hover {
	color: var(--kg-link-hover);
	background: var(--kg-link-hover-bg);
}

.kg-action::after {
	transition: transform var(--kg-duration) ease;
}

.kg-action:hover::after {
	transform: translateX(3px);
}

:root {
	--kg-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12h15M13 6l6 6-6 6'/%3E%3C/svg%3E");
}

/* Status: kropka + słowo. docs/05 §6.2 — nigdy sam kolor. */
.kg-status {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.kg-status::before {
	content: "";
	flex: none;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: currentColor;
}

.kg-status--progress { color: #004e88; }
.kg-status--planned  { color: var(--wp--preset--color--ink-muted); }
.kg-status--consult  { color: var(--wp--preset--color--warning); }
.kg-status--done     { color: var(--wp--preset--color--success); }

/* ---------- 3. Nagłówek ---------- */

.kg-header {
	display: flex;
	align-items: center;
	gap: 20px;
	padding: 18px var(--wp--preset--spacing--50);
	border-bottom: 1px solid var(--wp--preset--color--border);
}

.kg-brand {
	display: flex;
	align-items: center;
	gap: 13px;
	text-decoration: none;
	color: var(--wp--preset--color--ink);
}

.kg-brand__mark {
	display: flex;
	align-items: center;
	justify-content: center;
	flex: none;
	width: 50px;
	height: 50px;
}

.kg-brand__mark img,
.kg-brand__mark svg {
	display: block;
	width: 50px;
	height: 50px;
}

.kg-brand__name {
	font-size: 20px;
	font-weight: 600;
	letter-spacing: -0.02em;
	line-height: 1.1;
}

.kg-brand__descriptor {
	display: block;
	margin-top: 3px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--wp--preset--color--ink-muted);
}

.kg-nav {
	display: flex;
	align-items: center;
	gap: 2px;
	margin-left: auto;
}

.kg-nav__link {
	display: inline-flex;
	align-items: center;
	min-height: var(--kg-tap);
	padding: 0 9px;
	border-radius: 8px;
	font-size: 16px;
	color: var(--wp--preset--color--ink);
	text-decoration: none;
	transition: color var(--kg-duration) ease, background-color var(--kg-duration) ease;
}

.kg-nav__link:hover {
	color: var(--wp--preset--color--brand-strong);
	background: var(--wp--preset--color--brand-faint);
}

.kg-nav__link[aria-current="page"] {
	font-weight: 600;
	box-shadow: inset 0 -3px 0 var(--wp--preset--color--brand);
}

.kg-header__actions {
	display: flex;
	align-items: center;
	gap: 10px;
}

.kg-search-link,
.kg-menu-toggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-width: var(--kg-tap);
	min-height: 48px;
	padding: 0 15px;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--kg-radius-md);
	background: var(--wp--preset--color--surface);
	color: var(--wp--preset--color--ink);
	font-size: 16px;
	font-weight: 600;
	text-decoration: none;
	cursor: pointer;
}

.kg-menu-toggle { display: none; }

html.kg-search-open { overflow: hidden; }
.kg-header-search[hidden] { display: none; }
.kg-header-search { position: fixed; z-index: 1000; inset: 0; display: grid; place-items: start center; padding: 96px 24px 24px; }
.kg-header-search__backdrop { position: absolute; inset: 0; background: rgba(23, 33, 43, .42); backdrop-filter: blur(3px); }
.kg-header-search__panel { position: relative; width: min(720px, 100%); max-height: calc(100dvh - 120px); overflow: auto; border: 1px solid var(--wp--preset--color--border); border-radius: 18px; background: var(--wp--preset--color--surface); box-shadow: 0 24px 70px rgba(23, 33, 43, .28); padding: 26px; }
.kg-header-search__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; margin-bottom: 22px; }
.kg-header-search__head .kg-eyebrow { margin: 0 0 4px; }
.kg-header-search__head h2 { margin: 0; font-size: clamp(24px, 3vw, 32px); }
.kg-header-search__close { display: inline-flex; align-items: center; gap: 7px; flex: none; min-height: 44px; padding: 0 12px; border: 1px solid var(--wp--preset--color--border); border-radius: var(--kg-radius-md); background: var(--wp--preset--color--surface); color: var(--wp--preset--color--ink); font: inherit; font-weight: 600; cursor: pointer; }
.kg-header-search__close .kg-icon { width: 18px; height: 18px; }
.kg-header-search__form label { display: block; margin-bottom: 8px; font-weight: 700; }
.kg-header-search__controls { display: flex; gap: 10px; }
.kg-header-search__controls input { flex: 1; min-width: 0; min-height: 52px; padding: 10px 13px; border: 1px solid var(--wp--preset--color--ink-muted); border-radius: var(--kg-radius-md); color: var(--wp--preset--color--ink); font: inherit; }
.kg-header-search__controls button { min-height: 52px; padding: 10px 20px; border: 1px solid var(--wp--preset--color--brand-strong); border-radius: var(--kg-radius-md); background: var(--wp--preset--color--brand-strong); color: #fff; font: inherit; font-weight: 700; cursor: pointer; }
.kg-header-search__suggestions { max-width: none; margin-top: 8px; border-radius: 10px; }
.kg-header-search__hint { margin: 12px 0 0; color: var(--wp--preset--color--ink-muted); font-size: 14px; line-height: 1.45; }

.kg-menu-toggle__cross { display: none; }
.kg-menu-toggle[aria-expanded="true"] .kg-menu-toggle__bars { display: none; }
.kg-menu-toggle[aria-expanded="true"] .kg-menu-toggle__cross { display: inline-block; }

.kg-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	min-height: 52px;
	padding: 0 24px;
	border: 2px solid transparent;
	border-radius: var(--kg-radius-md);
	font-size: 17px;
	font-weight: 600;
	text-decoration: none;
	cursor: pointer;
	transition: background-color var(--kg-duration) ease, color var(--kg-duration) ease,
		border-color var(--kg-duration) ease;
}

.kg-btn--primary {
	background: var(--wp--preset--color--brand-strong);
	border-color: var(--wp--preset--color--brand-strong);
	color: var(--wp--preset--color--surface);
}

.kg-btn--primary:hover {
	background: var(--wp--preset--color--brand-deep);
	border-color: var(--wp--preset--color--brand-deep);
	color: var(--wp--preset--color--surface);
}

.kg-btn--on-brand {
	background: var(--wp--preset--color--surface);
	border-color: var(--wp--preset--color--surface);
	color: var(--wp--preset--color--brand-strong);
}

.kg-btn--on-brand:hover {
	background: var(--wp--preset--color--brand-faint);
	border-color: var(--wp--preset--color--brand-faint);
	color: var(--wp--preset--color--brand-deep);
}

/* ---------- 4. Menu mobilne ---------- */

.kg-mobile-panel {
	display: none;
}

@media (max-width: 1023px) {
	.kg-header { gap: 12px; padding: 10px var(--wp--preset--spacing--40); }

	/* Znak jest jedynym elementem marki na małym ekranie, więc może urosnąć. */
	.kg-brand__mark { width: 56px; height: 56px; }
	.kg-brand__mark img, .kg-brand__mark svg { width: 56px; height: 56px; }
	.kg-brand__name { font-size: 16px; }
	.kg-brand__descriptor { display: none; }

	.kg-nav,
	.kg-header__actions .kg-btn { display: none; }

	/* Po ukryciu nawigacji to sterowanie musi dociskać się do prawej krawędzi —
	   wcześniej auto-margines siedział na .kg-nav i znikał razem z nim. */
	.kg-header__actions { margin-left: auto; gap: 8px; }

	.kg-menu-toggle { display: inline-flex; }

	/* Kwadratowe cele dotykowe 48×48 z samą ikoną. Etykiety zostają w DOM
	   jako nazwa dostępna (docs/08) — chowamy je wizualnie, nie usuwamy. */
	.kg-search-link,
	.kg-menu-toggle {
		width: 48px;
		min-width: 48px;
		height: 48px;
		min-height: 48px;
		padding: 0;
		gap: 0;
	}

	.kg-search-link .kg-icon,
	.kg-menu-toggle .kg-icon { width: 22px; height: 22px; }

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

	/* ----- Panel menu ----- */

	.kg-mobile-panel[data-open="true"] {
		display: flex;
		flex-direction: column;
		gap: 18px;
		max-height: calc(100vh - 76px);
		max-height: calc(100dvh - 76px);
		overflow-y: auto;
		overscroll-behavior: contain;
		border-bottom: 1px solid var(--wp--preset--color--border);
		background: var(--wp--preset--color--surface-warm);
		padding: 10px var(--wp--preset--spacing--40) 22px;
		box-shadow: 0 18px 32px rgba(23, 33, 43, 0.08);
	}

	.kg-mobile-panel__list { margin: 0; padding: 0; list-style: none; }

	.kg-mobile-panel__link {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 12px;
		min-height: 56px;
		padding: 0 14px;
		border-radius: var(--kg-radius-md);
		font-size: 19px;
		font-weight: 600;
		letter-spacing: -0.02em;
		text-decoration: none;
		border-bottom: 1px solid var(--wp--preset--color--border-warm);
	}

	.kg-mobile-panel__list > li:last-child .kg-mobile-panel__link { border-bottom: 0; }

	.kg-mobile-panel__chevron {
		width: 20px;
		height: 20px;
		color: var(--wp--preset--color--ink-muted);
		transition: transform var(--kg-duration) ease;
	}

	.kg-mobile-panel__link:hover .kg-mobile-panel__chevron { transform: translateX(3px); }

	/* Bieżąca strona: pionowy znacznik i wypełnienie, nie sam kolor tekstu. */
	.kg-mobile-panel__link[aria-current="page"] {
		background: var(--wp--preset--color--brand-faint);
		box-shadow: inset 3px 0 0 var(--wp--preset--color--brand);
		color: var(--wp--preset--color--brand-strong);
	}

	.kg-mobile-panel__link[aria-current="page"] .kg-mobile-panel__chevron {
		color: var(--wp--preset--color--brand-strong);
	}

	.kg-mobile-panel__cta {
		display: grid;
		gap: 10px;
		padding-top: 4px;
		border-top: 1px solid var(--wp--preset--color--border-warm);
	}

	.kg-mobile-panel__cta .kg-btn { width: 100%; margin-top: 14px; }

	.kg-mobile-panel__search {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		gap: 10px;
		min-height: var(--kg-tap);
		border-radius: var(--kg-radius-md);
		font-size: 16px;
		font-weight: 600;
	}
}

@media (max-width: 767px) {
	.kg-brand__text { display: none; }
	.kg-mobile-panel[data-open="true"] { max-height: calc(100vh - 68px); max-height: calc(100dvh - 68px); }
	/* Telefon: panel zajmuje cały ekran, żeby nie konkurować z treścią strony. */
	.kg-header-search { padding: 0; place-items: stretch; }
	.kg-header-search__backdrop { display: none; }
	.kg-header-search__panel { width: 100%; max-height: 100dvh; border: 0; border-radius: 0; box-shadow: none; padding: 22px var(--wp--preset--spacing--40) 32px; }
	.kg-header-search__head { margin-bottom: 30px; }
	.kg-header-search__close { width: 48px; min-width: 48px; padding: 0; justify-content: center; }
	.kg-header-search__close span { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
	.kg-header-search__controls { flex-direction: column; }
	.kg-header-search__controls button { width: 100%; }
	.kg-header-search__suggestions { margin-top: 10px; }
}

/* ---------- 5. Pasy sekcji ---------- */

.kg-band {
	padding-block: var(--wp--preset--spacing--80);
}

.kg-band--warm {
	background: var(--wp--preset--color--surface-warm);
	border-block: 1px solid var(--wp--preset--color--border-warm);
}

.kg-band--brand {
	position: relative;
	overflow: hidden;
	background: var(--wp--preset--color--brand);
	color: var(--wp--preset--color--surface);
}

.kg-band--brand :is(h1, h2, h3) { color: var(--wp--preset--color--surface); }
.kg-band--brand p { color: var(--wp--preset--color--on-brand); }

/* Znak jako wyciszony watermark — identyfikacja, nie ozdoba (docs/05 §5.1). */
.kg-watermark {
	position: absolute;
	inset-inline-end: -130px;
	inset-block-start: -70px;
	width: 620px;
	height: 620px;
	opacity: 0.08;
	pointer-events: none;
}

.kg-watermark--bottom {
	inset-block-start: auto;
	inset-block-end: -190px;
	width: 560px;
	height: 560px;
	opacity: 0.09;
}

@media (max-width: 767px) {
	.kg-watermark { inset-inline-end: -110px; width: 360px; height: 360px; }
	.kg-watermark--bottom { inset-block-end: -120px; width: 330px; height: 330px; }
}

/* ---------- 6. Hero ---------- */

.kg-hero {
	padding-block: 76px 116px;
}

.kg-hero__grid {
	display: grid;
	grid-template-columns: minmax(0, 58fr) minmax(0, 42fr);
	gap: 64px;
	align-items: center;
}

.kg-hero__title {
	font-size: var(--wp--preset--font-size--display);
	line-height: 1.04;
	max-width: 13ch;
}

.kg-hero__lead {
	font-size: 20px;
	line-height: 1.55;
	max-width: 44ch;
}

.kg-hero__panel {
	--kg-poster-cap: min(64vh, 540px);
	background: var(--wp--preset--color--brand-panel);
	border-radius: var(--kg-radius-xl);
	padding: 28px 30px;
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.kg-hero__date {
	display: flex;
	align-items: baseline;
	gap: 14px;
}

/* Plakat jest tu treścią, nie ozdobą — dostaje realne proporcje pliku i tyle
   wysokości, ile mieści pierwszy widok, żeby dało się przeczytać nagłówek. */
.kg-hero__panel > .kg-poster {
	width: 100%;
	aspect-ratio: var(--kg-poster-ratio, 16 / 9);
	max-height: var(--kg-poster-cap);
	/* Kadr nie może być szerszy, niż wynika z proporcji przy pełnej wysokości —
	   inaczej w układzie jednokolumnowym plakat tonie w rozmytych skrzydłach. */
	max-width: calc(var(--kg-poster-cap) * var(--kg-poster-ratio, 1.7778));
	margin-inline: auto;
	border-radius: var(--kg-radius-lg);
	background: rgba(0, 0, 0, 0.22);
}

.kg-hero__panel > .kg-poster::after {
	background: radial-gradient(120% 90% at 50% 0, rgba(0, 0, 0, 0) 40%, rgba(0, 0, 0, 0.28) 100%);
}

.kg-hero__day {
	font-size: 52px;
	font-weight: 600;
	letter-spacing: -0.04em;
	line-height: 1;
}

@media (max-width: 1023px) {
	.kg-hero { padding-block: 36px 74px; }
	.kg-hero__grid { grid-template-columns: 1fr; gap: 28px; }
	.kg-hero__title, .kg-hero__lead { max-width: none; }
	.kg-hero__panel { --kg-poster-cap: min(56vh, 460px); padding: 22px 20px; border-radius: 18px; }
	.kg-hero__day { font-size: 42px; }
}

/* ---------- 7. Pasek szybkich działań (nachodzi na hero) ---------- */

.kg-quick {
	position: relative;
	margin-top: -56px;
}

.kg-quick__list {
	margin: 0;
	padding: 0;
	list-style: none;
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	background: var(--wp--preset--color--surface);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--kg-radius-xl);
	box-shadow: var(--wp--preset--shadow--overlap);
	overflow: hidden;
}

.kg-quick__item {
	display: flex;
	align-items: center;
	gap: 16px;
	padding: 26px 28px;
	text-decoration: none;
	border-inline-end: 1px solid var(--wp--preset--color--border);
}

.kg-quick__list > li:last-child .kg-quick__item { border-inline-end: 0; }

.kg-quick__tile {
	display: flex;
	align-items: center;
	justify-content: center;
	flex: none;
	width: 44px;
	height: 44px;
	border-radius: 12px;
	background: var(--wp--preset--color--brand-soft);
	color: var(--wp--preset--color--brand-strong);
}

.kg-quick__label {
	min-width: 0;
	font-size: 17px;
	font-weight: 600;
	letter-spacing: -0.01em;
	line-height: 1.3;
}

@media (max-width: 767px) {
	.kg-quick { margin-top: -52px; }
	.kg-quick__list { grid-template-columns: 1fr; border-radius: 18px; }
	.kg-quick__item {
		padding: 16px 18px;
		border-inline-end: 0;
		border-block-end: 1px solid var(--wp--preset--color--border);
	}
	.kg-quick__list > li:last-child .kg-quick__item { border-block-end: 0; }
	.kg-quick__tile { width: 40px; height: 40px; }
	.kg-quick__label {
	min-width: 0; font-size: 16px; }
}

/* ---------- 5a. Karta klikalna w całości ---------- */

/* Wzorzec „rozciągniętego linku”: jeden prawdziwy link przykrywa całą kartę
   swoim ::after, więc kliknięcie gdziekolwiek prowadzi tam, gdzie napis.
   Nie zagnieżdżamy linków ani nie robimy z karty diva z onclickiem — nazwa
   dostępna i obsługa klawiaturą zostają przy prawdziwym elemencie <a>. */
.kg-clickable {
	position: relative;
}

/* Nakładka siedzi na ::before, nie ::after — ::after w .kg-action rysuje
   strzałkę i ma własne width/height, które wygrywały z `inset: 0`, więc
   „rozciągnięty” link był w praktyce kwadratem 16×16 px w rogu karty. */
.kg-stretched::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	border-radius: inherit;
}

/* Linki, które mają zostać osobno klikalne mimo nakładki — np. adres
   prowadzący do map. Muszą być nad warstwą przykrywającą. */
.kg-clickable .kg-where__map,
.kg-clickable .kg-badge {
	position: relative;
	z-index: 2;
}

/* Zaznaczanie tekstu nadal działa, ale kursor mówi wprost, że karta jest celem. */
.kg-clickable { cursor: pointer; }
.kg-clickable :is(a, button) { cursor: pointer; }

/* Obrys fokusu przenosi się z samego linku na całą kartę — inaczej ramka
   otaczałaby tylko napis „Szczegóły”, choć klikalne jest wszystko.
   Cały blok jest za @supports: bez :has() nie da się obrysować karty, więc
   nie wolno wtedy zdejmować obrysu z linku — fokus zniknąłby z ekranu. */
@supports selector(:has(*)) {
	.kg-clickable:has(.kg-stretched:focus-visible) {
		outline: 3px solid var(--wp--preset--color--focus);
		outline-offset: 3px;
	}

	.kg-clickable .kg-stretched:focus-visible {
		outline: none;
		box-shadow: none;
	}
}

/* ---------- 6a. „Gdzie?” — lokalizacja podana od razu ---------- */

/* Tekst dostępny tylko dla czytnika ekranu. */
.kg-hidden {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
}

/* Pinezka, nazwa miejsca i adres w jednym wierszu — odpowiedź na „gdzie?”
   bez wchodzenia w szczegóły wydarzenia. */
.kg-where {
	display: flex;
	align-items: flex-start;
	gap: 9px;
	margin: 0;
	color: var(--wp--preset--color--ink-muted);
	font-size: 15px;
	line-height: 1.45;
}

.kg-where .kg-icon {
	margin-top: 2px;
	color: var(--wp--preset--color--brand-strong);
}

.kg-where__text {
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}

.kg-where__venue {
	color: var(--wp--preset--color--ink);
	font-weight: 600;
}

.kg-where__address {
	font-size: 14px;
}

/* Na niebieskim panelu pinezka i nazwa idą na biel — ink nie ma tam kontrastu. */
.kg-where--on-brand {
	color: var(--wp--preset--color--on-brand);
}

.kg-where--on-brand .kg-icon,
.kg-where--on-brand .kg-where__venue {
	color: #fff;
}

/* ---------- 7a. Kadr multimedialny ---------- */

/* docs/05 §12.2 — główny temat nie może być ucięty. Obraz mieści się w kadrze
   w całości (contain), a rozmyta kopia w tle wypełnia resztę pola i daje
   głębię. Działa tak samo dla pionowego plakatu i poziomego zdjęcia. */
.kg-poster {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	border-radius: var(--kg-radius-md);
	background: var(--wp--preset--color--surface-alt);
}

.kg-poster::before {
	content: "";
	position: absolute;
	inset: -10%;
	z-index: 0;
	background-image: var(--kg-poster-bg, none);
	background-position: center;
	background-size: cover;
	filter: blur(22px) saturate(1.12) brightness(0.94);
	transform: scale(1.08);
}

/* Delikatne przyciemnienie brzegów — kadr ma dno, a nie płaską plamę. */
.kg-poster::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	pointer-events: none;
	background: radial-gradient(120% 90% at 50% 0, rgba(23, 33, 43, 0) 40%, rgba(23, 33, 43, 0.18) 100%);
}

.kg-poster__img {
	position: relative;
	z-index: 2;
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
	filter: drop-shadow(0 10px 24px rgba(5, 33, 58, 0.3));
}

/* Kadr pełnej szerokości karty — bez własnego promienia, bo obcina go karta. */
.kg-poster--bleed {
	border-radius: 0;
}

@media (forced-colors: active) {
	.kg-poster::before,
	.kg-poster::after { display: none; }
}

/* ---------- 8. Karty ---------- */

.kg-card {
	background: var(--wp--preset--color--surface);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--kg-radius-lg);
}

.kg-card__title {
	overflow-wrap: break-word;
}

/* Kafelek daty */
.kg-datetile {
	flex: none;
	width: 74px;
	padding: 10px 0;
	border-radius: 12px;
	background: var(--wp--preset--color--ink);
	color: var(--wp--preset--color--surface);
	text-align: center;
}

.kg-datetile__day {
	display: block;
	font-size: 26px;
	font-weight: 600;
	line-height: 1;
	letter-spacing: -0.02em;
}

.kg-datetile__month {
	display: block;
	margin-top: 3px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.12em;
	color: var(--wp--preset--color--on-dark-muted);
}

/* Wiersz wydarzenia */
.kg-event {
	display: flex;
	align-items: center;
	gap: 24px;
	padding: 20px 24px;
	transition: border-color var(--kg-duration) ease, box-shadow var(--kg-duration) ease;
}

.kg-event:hover {
	border-color: var(--wp--preset--color--brand-soft);
	box-shadow: 0 14px 34px rgba(23, 33, 43, 0.09);
}

/* Kadr wydarzenia stoi przed datą: najpierw widać, o czym to jest. Stała jest
   wysokość, a szerokość idzie za proporcją pliku — pionowy plakat nie traci
   wtedy połowy miejsca na rozmyte marginesy. */
.kg-event > .kg-poster {
	flex: none;
	height: 168px;
	aspect-ratio: var(--kg-poster-ratio, 4 / 3);
	width: auto;
	max-width: 300px;
	min-width: 84px;
}

.kg-event__head { display: flex; align-items: center; gap: 22px; flex: 1; min-width: 0; }

.kg-event__body { display: flex; flex-direction: column; gap: 7px; flex: 1; min-width: 0; }

/* Odznaka jest etykietą, nie paskiem — w kolumnie flex nie może się rozciągać. */
.kg-event__body > .kg-badge,
.kg-hero__panel > .kg-badge { align-self: flex-start; }

.kg-event__cta { flex: none; }

.kg-facts {
	display: flex;
	gap: 24px;
	flex-wrap: wrap;
	margin: 2px 0 0;
	padding: 0;
	list-style: none;
}

.kg-facts li {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 15px;
	color: var(--wp--preset--color--ink-muted);
}

@media (max-width: 1023px) {
	.kg-event > .kg-poster { height: 140px; max-width: 220px; }
	.kg-event { gap: 18px; padding: 16px 18px; }
	.kg-event__head { gap: 16px; }
}

@media (max-width: 767px) {
	.kg-event { flex-direction: column; align-items: stretch; gap: 14px; padding: 14px; }
	.kg-event { --kg-poster-cap: min(62vh, 520px); }
	.kg-event > .kg-poster { width: 100%; height: auto; min-width: 0; aspect-ratio: var(--kg-poster-ratio, 16 / 10); max-height: var(--kg-poster-cap); max-width: calc(var(--kg-poster-cap) * var(--kg-poster-ratio, 1.6)); margin-inline: auto; }
	.kg-event__head { gap: 14px; align-items: flex-start; }
	.kg-datetile { width: 58px; padding: 9px 0; }
	.kg-datetile__day { font-size: 21px; }
	.kg-facts { flex-direction: column; gap: 6px; }
}

/* Karta projektu */
.kg-project {
	display: flex;
	flex-direction: column;
	gap: 14px;
	padding: 26px;
	background: var(--wp--preset--color--surface);
	border: 1px solid var(--wp--preset--color--border-warm);
	border-radius: var(--kg-radius-lg);
}

.kg-project__head {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 16px;
}

.kg-project__number {
	font-size: 56px;
	font-weight: 600;
	letter-spacing: -0.04em;
	line-height: 1;
	color: #dce3ea;
}

/* Etapy projektu — realne dane z modelu treści, nie wymyślony procent
   (docs/05 §14.5). */
.kg-stages {
	display: flex;
	gap: 4px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.kg-stages__seg {
	flex: 1;
	height: 6px;
	border-radius: 3px;
	background: #dce3ea;
}

.kg-stages__seg--done { background: var(--wp--preset--color--brand); }
.kg-stages__seg--done-consult { background: var(--wp--preset--color--warning-mark); }
.kg-stages__seg--done-planned { background: var(--wp--preset--color--ink-muted); }

.kg-project__stageline {
	display: flex;
	justify-content: space-between;
	gap: 12px;
	font-size: 13px;
	color: var(--wp--preset--color--ink-muted);
}

@media (max-width: 767px) {
	.kg-project { padding: 20px; }
	.kg-project__number { font-size: 44px; }
}

/* ---------- 10. Miejsce na zdjęcie ---------- */

.kg-photo-slot {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 6px;
	padding: 16px;
	background: var(--wp--preset--color--brand-faint);
	border: 1px dashed #8fb6d8;
	border-radius: var(--kg-radius-lg);
	color: var(--wp--preset--color--ink-muted);
	font-size: 14px;
	text-align: center;
}

.kg-photo-slot--warm {
	background: #f3efe8;
	border-color: #c9bfb0;
}

.kg-photo-slot__title {
	font-size: 15px;
	font-weight: 600;
	letter-spacing: -0.01em;
	color: var(--wp--preset--color--ink);
}

/* ---------- 11. Stopka ---------- */

.kg-footer {
	background: var(--wp--preset--color--ink);
	color: var(--wp--preset--color--surface);
	padding: 56px var(--wp--preset--spacing--50) 30px;
}

.kg-footer__grid {
	display: grid;
	grid-template-columns: minmax(0, 1.3fr) repeat(3, minmax(0, 1fr));
	gap: 44px;
}

.kg-footer__heading {
	margin: 0 0 4px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: #8fa2b4;
}

.kg-footer__links {
	display: flex;
	flex-direction: column;
	margin: 0;
	padding: 0;
	list-style: none;
}

.kg-footer__links a {
	display: inline-flex;
	align-items: center;
	min-height: var(--kg-tap);
	font-size: 16px;
}

.kg-footer__bottom {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 32px;
	flex-wrap: wrap;
	margin-top: 40px;
	padding-top: 22px;
	border-top: 1px solid #2c3946;
}

.kg-footer__note {
	font-size: 13px;
	line-height: 1.6;
	color: #8fa2b4;
	max-width: 60ch;
}

/* Kredyt wykonawcy — biały kafelek, bo znak ma czarne elementy. */
.kg-credit {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	min-height: var(--kg-tap);
	flex: none;
	text-decoration: none;
}

.kg-credit__mark {
	display: flex;
	align-items: center;
	justify-content: center;
	flex: none;
	width: 40px;
	height: 40px;
	border-radius: var(--kg-radius-md);
	background: var(--wp--preset--color--surface);
}

.kg-credit__mark img { display: block; width: 29px; height: auto; }

.kg-credit__role {
	display: block;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: #8fa2b4;
}

.kg-credit__name {
	display: block;
	margin-top: 2px;
	font-size: 15px;
	font-weight: 600;
	letter-spacing: -0.01em;
}

@media (max-width: 1023px) {
	.kg-footer { padding: 36px var(--wp--preset--spacing--40) 24px; }
	.kg-footer__grid { grid-template-columns: 1fr; gap: 20px; }
	.kg-footer__bottom { flex-direction: column; align-items: flex-start; gap: 18px; margin-top: 22px; }
}

/* ---------- 12. Siatki treści ---------- */

.kg-grid-3 {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 20px;
}

.kg-grid-2 {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 24px;
}

.kg-split {
	display: grid;
	grid-template-columns: minmax(0, 44fr) minmax(0, 56fr);
	gap: 56px;
	align-items: center;
}

.kg-stack {
	display: flex;
	flex-direction: column;
	gap: 14px;
	min-width: 0;
}

.kg-split--news    { grid-template-columns: minmax(0, 58fr) minmax(0, 42fr); gap: 32px; align-items: start; }
.kg-split--cta     { grid-template-columns: minmax(0, 52fr) minmax(0, 48fr); gap: 64px; }
.kg-split--contact { grid-template-columns: minmax(0, 40fr) minmax(0, 60fr); }

.kg-featured {
	display: grid;
	grid-template-columns: minmax(0, 44fr) minmax(0, 56fr);
	overflow: hidden;
}

.kg-featured__body {
	display: flex;
	flex-direction: column;
	gap: 12px;
	padding: 28px 30px;
}

.kg-section-head {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 32px;
	margin-bottom: 32px;
}

@media (max-width: 1023px) {
	.kg-grid-3, .kg-grid-2 { grid-template-columns: 1fr; gap: 14px; }
	.kg-split,
	.kg-split--news,
	.kg-split--cta,
	.kg-split--contact,
	.kg-featured { grid-template-columns: 1fr; gap: 24px; }
	.kg-featured { gap: 0; }
	.kg-featured__body { padding: 18px; }
	.kg-split--news    { grid-template-columns: minmax(0, 58fr) minmax(0, 42fr); gap: 32px; align-items: start; }
.kg-split--cta     { grid-template-columns: minmax(0, 52fr) minmax(0, 48fr); gap: 64px; }
.kg-split--contact { grid-template-columns: minmax(0, 40fr) minmax(0, 60fr); }

.kg-featured {
	display: grid;
	grid-template-columns: minmax(0, 44fr) minmax(0, 56fr);
	overflow: hidden;
}

.kg-featured__body {
	display: flex;
	flex-direction: column;
	gap: 12px;
	padding: 28px 30px;
}

.kg-section-head { flex-direction: column; align-items: flex-start; gap: 12px; margin-bottom: 20px; }
}

/* ---------- 13. Lista faktów ---------- */

.kg-factlist {
	margin: 0;
	padding: 0;
	list-style: none;
	border-top: 1px solid var(--wp--preset--color--border-warm);
}

.kg-factlist li {
	display: flex;
	gap: 28px;
	padding: 14px 0;
	border-bottom: 1px solid var(--wp--preset--color--border-warm);
}

.kg-factlist dt,
.kg-factlist__label {
	flex: none;
	width: 220px;
	font-size: 15px;
	color: var(--wp--preset--color--ink-muted);
}

@media (max-width: 767px) {
	.kg-factlist li { flex-direction: column; gap: 2px; padding: 12px 0; }
	.kg-factlist dt, .kg-factlist__label { width: auto; font-size: 13px; }
}

/* ---------- 14. Kontakt ---------- */

.kg-contact-list { margin: 0; padding: 0; list-style: none; }
/* Na stronie „Kontakt” lista jest samodzielnym blokiem, nie kolumną obok
   nagłówka — dostaje więcej powietrza i górną krawędź. */
.kg-contact-list--page { margin-top: 26px; margin-bottom: 26px; border-top: 1px solid var(--wp--preset--color--border); }

.kg-contact-list a {
	display: flex;
	align-items: center;
	gap: 18px;
	padding: 20px 4px;
	border-top: 1px solid var(--wp--preset--color--border);
	text-decoration: none;
}

.kg-contact-list li:last-child a { border-bottom: 1px solid var(--wp--preset--color--border); }

.kg-contact-list__tile {
	display: flex;
	align-items: center;
	justify-content: center;
	flex: none;
	width: 48px;
	height: 48px;
	border-radius: 50%;
	background: var(--wp--preset--color--brand-soft);
	color: var(--wp--preset--color--brand-strong);
}

.kg-contact-list a > span:not(.kg-contact-list__tile) { min-width: 0; }

.kg-contact-list__value {
	font-size: 18px;
	font-weight: 600;
	letter-spacing: -0.01em;
}

/* ---------- 15. Ikony ---------- */

.kg-icon {
	flex: none;
	width: 1.25em;
	height: 1.25em;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.9;
	stroke-linecap: round;
	stroke-linejoin: round;
}

/* ---------- 16. Archiwa i szczegóły treści ---------- */

.kg-page-shell { padding-top: clamp(48px, 7vw, 88px); padding-bottom: clamp(64px, 9vw, 112px); }
.kg-archive__head { max-width: 720px; margin-bottom: 32px; }
.kg-archive h1, .kg-detail h1 { margin: 0 0 16px; }
.kg-lead { max-width: 720px; margin: 0; color: var(--wp--preset--color--ink-muted); font-size: clamp(20px, 2vw, 24px); line-height: 1.45; }
.kg-card-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
/* Bez `min-height: 100%` — w siatce element i tak rozciąga się na wysokość
   wiersza (`align-items: stretch`), a procent liczony od wysokości wiersza robił
   karty wyższe niż wiersz: przy dwóch i więcej wierszach nachodziły na siebie
   i na kolejną sekcję. */
.kg-content-card { display: flex; flex-direction: column; align-items: flex-start; padding: 24px; border: 1px solid var(--wp--preset--color--border); border-radius: 16px; background: var(--wp--preset--color--surface); }
.kg-content-card h2 { margin: 14px 0 10px; font-size: clamp(21px, 2vw, 26px); line-height: 1.18; }
.kg-document-card { gap: 0; }
.kg-document-card__summary p { margin: 0 0 12px; }
.kg-document-card .kg-action + .kg-action { margin-top: 12px; }
.kg-content-card p { margin: 0 0 14px; }
.kg-content-card .kg-action { margin-top: auto; }
.kg-content-card__meta, .kg-event-card__top { color: var(--wp--preset--color--ink-muted); font-size: 15px; }
.kg-event-card__top { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.kg-content-card__next { color: var(--wp--preset--color--ink); }
.kg-badge { display: inline-flex; align-items: center; gap: 8px; min-height: 28px; padding: 4px 11px; border: 1px solid currentColor; border-radius: 999px; background: var(--kg-badge-bg, transparent); color: var(--kg-badge-ink, var(--wp--preset--color--brand-strong)); font-size: 13px; font-weight: 700; line-height: 1.25; }

/* docs/05 §6.2 — stan niesie kropka i słowo, nigdy sam kolor. Kropki nie
   dostaje neutralna etykieta typu dokumentu, tylko znacznik stanu. */
.kg-badge--status::before { content: ""; flex: none; width: 8px; height: 8px; border-radius: 50%; background: currentColor; }

/* Cztery główne stany wydarzenia plus dwa redakcyjne. Kontrast liczony na
   własnym tle: 6,6:1 / 5,6:1 / 8,7:1 / 5,5:1 / 6,7:1. */
.kg-badge--planowane { --kg-badge-ink: var(--wp--preset--color--brand-strong); --kg-badge-bg: var(--wp--preset--color--brand-faint); }
.kg-badge--trwa { --kg-badge-ink: var(--wp--preset--color--success); --kg-badge-bg: var(--wp--preset--color--success-soft); }
.kg-badge--zakonczone, .kg-badge--zrealizowany { --kg-badge-ink: var(--wp--preset--color--ink-muted); --kg-badge-bg: var(--wp--preset--color--surface-alt); }
.kg-badge--odwolane, .kg-badge--anulowany { --kg-badge-ink: var(--wp--preset--color--error); --kg-badge-bg: var(--wp--preset--color--error-soft); }
.kg-badge--przelozone, .kg-badge--wstrzymany { --kg-badge-ink: var(--wp--preset--color--warning); --kg-badge-bg: var(--wp--preset--color--warning-soft); }
.kg-badge--brak-terminu { --kg-badge-ink: var(--wp--preset--color--ink-muted); --kg-badge-bg: var(--wp--preset--color--surface-alt); }

/* Na ciemnym panelu żaden z tych jasnych tintów nie ma kontrastu — znacznik
   przechodzi na biel na przyciemnionym tle (5,4:1). */
.kg-hero__panel .kg-badge { --kg-badge-ink: #fff; --kg-badge-bg: rgba(255, 255, 255, .16); border-color: rgba(255, 255, 255, .42); }
.kg-filter { display: flex; flex-wrap: wrap; align-items: end; gap: 12px 16px; margin: 0 0 18px; padding: 18px; border: 1px solid var(--wp--preset--color--border); border-radius: 12px; background: var(--wp--preset--color--surface-alt); }
.kg-filter label { display: block; width: 100%; font-weight: 700; }
.kg-filter select { min-height: 44px; min-width: min(100%, 260px); padding: 8px 10px; border: 1px solid var(--wp--preset--color--ink-muted); border-radius: 6px; background: #fff; color: var(--wp--preset--color--ink); }
.kg-filter__field { display: grid; flex: 1 1 180px; gap: 6px; }
.kg-filter__field label { width: auto; font-size: 14px; }
.kg-filter__field input { box-sizing: border-box; width: 100%; min-height: 44px; padding: 8px 10px; border: 1px solid var(--wp--preset--color--ink-muted); border-radius: 6px; background: #fff; color: var(--wp--preset--color--ink); font: inherit; }
.kg-filter__field select { width: 100%; min-width: 0; }
.kg-filter button, .kg-button { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 10px 16px; border: 1px solid var(--wp--preset--color--brand-strong); border-radius: 6px; background: var(--wp--preset--color--brand-strong); color: #fff; font-weight: 700; text-decoration: none; cursor: pointer; }
.kg-filter a { display: inline-flex; align-items: center; min-height: 44px; }
.kg-results { margin: 0 0 20px; color: var(--wp--preset--color--ink-muted); }
.kg-project-group { margin-top: 52px; }
.kg-project-group h2 { margin-bottom: 18px; }
.kg-archive__cta { margin-top: 48px; }
.kg-empty { max-width: 680px; padding: 28px; border: 1px dashed var(--wp--preset--color--border); border-radius: 16px; background: var(--wp--preset--color--surface-alt); }
.kg-empty :is(h2, h3) { margin-top: 0; }
.kg-breadcrumb { margin: 0 0 20px; color: var(--wp--preset--color--ink-muted); font-size: 15px; }
.kg-detail > .kg-badge { margin-bottom: 14px; }
.kg-detail__grid { display: grid; grid-template-columns: minmax(0, 2fr) minmax(280px, 1fr); gap: clamp(32px, 6vw, 80px); margin-top: 36px; }
.kg-detail__body { min-width: 0; }
.kg-detail__body > *:first-child { margin-top: 0; }
.kg-detail__body h2 { margin-top: 42px; }
.kg-facts { align-self: start; padding: 24px; border: 1px solid var(--wp--preset--color--border); border-radius: 16px; background: var(--wp--preset--color--surface-alt); }
.kg-facts h2 { margin: 0 0 16px; font-size: 21px; }
.kg-facts dl { margin: 0 0 20px; }
.kg-facts dl > div { padding: 12px 0; border-top: 1px solid var(--wp--preset--color--border); }
.kg-facts dl > div:last-child { border-bottom: 1px solid var(--wp--preset--color--border); }
.kg-facts dt { margin-bottom: 3px; color: var(--wp--preset--color--ink-muted); font-size: 14px; font-weight: 700; }
.kg-facts dd { margin: 0; }
.kg-document-detail__summary { margin-bottom: 0; }
.kg-document-detail__summary > * { margin: 0; }
.kg-document-detail__notice { margin: 18px 0 0; color: var(--wp--preset--color--ink-muted); font-size: 14px; line-height: 1.5; }
.kg-project-timeline { margin-top: 48px; }
.kg-project-timeline h2 { margin: 0 0 22px; }
.kg-project-timeline ol { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; }
.kg-project-timeline__item { position: relative; padding: 0 0 30px 32px; border-left: 2px solid var(--wp--preset--color--border); }
.kg-project-timeline__item::before { content: ""; position: absolute; top: 4px; left: -7px; width: 12px; height: 12px; border: 3px solid #fff; border-radius: 50%; background: var(--wp--preset--color--brand-strong); box-shadow: 0 0 0 1px var(--wp--preset--color--border); }
.kg-project-timeline__item:last-child { padding-bottom: 0; border-left-color: transparent; }
.kg-project-timeline__meta { display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: center; margin-bottom: 7px; color: var(--wp--preset--color--ink-muted); font-size: 14px; font-weight: 700; }
.kg-project-timeline__status { padding: 3px 8px; border-radius: 999px; background: var(--wp--preset--color--surface-alt); color: var(--wp--preset--color--ink); font-size: 12px; }
.kg-project-timeline__status--w-trakcie {
	background: var(--wp--preset--color--brand-soft);
	color: var(--wp--preset--color--brand-strong);
}

.kg-project-timeline__status--wykonany { background: #ddf3e6; color: #104526; }
.kg-project-timeline__status--opozniony { background: #fff0c2; color: #704d00; }
.kg-project-timeline__status--pominiety { background: #eef1f4; color: #44515e; }
.kg-project-timeline h3 { margin: 0 0 7px; font-size: 19px; }
.kg-project-timeline p { margin: 0 0 10px; }
.kg-related-content { margin-top: 48px; padding-top: 32px; border-top: 1px solid var(--wp--preset--color--border); }
.kg-related-content h2 { margin: 0 0 16px; }
.kg-related-content ul { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.kg-related-content li { position: relative; padding-left: 20px; }
.kg-related-content li::before { content: "→"; position: absolute; left: 0; color: var(--wp--preset--color--brand-strong); font-weight: 700; }
.kg-related-content a { font-weight: 700; }
.kg-event-card { overflow: hidden; padding: 0; }
.kg-event-card > :not(.kg-poster) { margin-right: 24px; margin-left: 24px; }
.kg-event-card > .kg-event-card__top { margin-top: 20px; }
.kg-event-card > .kg-action { margin-bottom: 24px; }
.kg-event-card > .kg-poster { align-self: stretch; width: 100%; aspect-ratio: var(--kg-poster-ratio, 3 / 2); max-height: 420px; }
.kg-home-events { max-width: 1120px; margin: 0 auto; padding: 84px var(--wp--preset--spacing--40) 0; }
/* Sekcja projektów jest pełnym pasem — odstęp bierze margines, nie padding. */
.kg-home-projects { margin-top: 84px; }
@media (max-width: 767px) { .kg-home-projects { margin-top: 56px; } }
.kg-home-events__lead { max-width: 52ch; margin: 0; color: var(--wp--preset--color--ink-muted); font-size: 20px; line-height: 1.55; }
.kg-home-events__list { display: grid; gap: 16px; margin: 0; padding: 0; list-style: none; }
.kg-home-events__list .kg-card__title { margin: 6px 0 2px; font-size: 23px; line-height: 1.25; }
.kg-home-events__facts { display: flex; flex-wrap: wrap; gap: 4px 8px; margin: 0; color: var(--wp--preset--color--ink-muted); font-size: 15px; }
.kg-event-facts { display: grid; gap: 20px; margin: 24px 0 0; padding: 22px; border: 1px solid var(--wp--preset--color--border); border-radius: 20px; background: linear-gradient(145deg, var(--wp--preset--color--brand-faint), #fff); box-shadow: 0 16px 36px rgba(23, 33, 43, .07); }
.kg-event-facts__heading { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; }
.kg-event-facts h2 { margin: 0; font-size: 22px; }
.kg-event-facts dl { display: grid; gap: 0; margin: 0; }
.kg-event-facts dl > div { padding: 14px 0; border-top: 1px solid var(--wp--preset--color--border); }
.kg-event-facts dl > div:last-child { padding-bottom: 0; }
.kg-event-facts dt { margin-bottom: 3px; color: var(--wp--preset--color--ink-muted); font-size: 14px; font-weight: 700; }
.kg-event-facts dd { margin: 0; font-weight: 600; }
.kg-event-facts .kg-button { justify-self: start; }
.kg-event-hero { display: grid; place-items: center; min-height: 180px; margin: 24px 0 0; padding: clamp(12px, 3vw, 28px); overflow: hidden; border: 1px solid rgba(255, 255, 255, .2); border-radius: 24px; background: radial-gradient(circle at 50% 0, #276a9d 0, #08375f 48%, #041f39 100%); box-shadow: 0 22px 52px rgba(5, 33, 58, .26), inset 0 1px rgba(255, 255, 255, .26); }
.kg-event-hero__poster { display: block; width: 100%; height: auto; max-height: none; border-radius: 10px; object-fit: contain; box-shadow: 0 12px 30px rgba(0, 0, 0, .26); }
.kg-event-description { max-width: 760px; margin-top: clamp(40px, 7vw, 72px); padding: clamp(24px, 5vw, 44px); border: 1px solid var(--wp--preset--color--border-warm); border-radius: 20px; background: var(--wp--preset--color--surface-warm); }
.kg-event-description h2 { margin: 0 0 18px; }
.kg-event-description .kg-lead { margin-bottom: 24px; color: var(--wp--preset--color--ink); }
.kg-event-additional { max-width: 760px; margin-top: 40px; }
.kg-event-map { max-width: 760px; margin-top: clamp(40px, 6vw, 64px); }
.kg-event-map h2 { margin: 0 0 14px; }
.kg-event-map .kg-where { margin-bottom: 16px; }
.kg-event-map__frame { display: grid; overflow: hidden; border: 1px solid var(--wp--preset--color--border); border-radius: var(--kg-radius-lg); background: var(--wp--preset--color--surface-alt); }
.kg-event-map__frame[data-kg-map-loaded] { aspect-ratio: 16 / 10; background: var(--wp--preset--color--ink); }
.kg-event-map__frame iframe { display: block; width: 100%; height: 100%; border: 0; }
.kg-event-map__gate { padding: 24px; }
.kg-event-map__gate p { margin: 0; color: var(--wp--preset--color--ink-muted); font-size: 15px; line-height: 1.55; }
.kg-event-map__gate .kg-event-map__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 20px; margin-top: 16px; }
@media (max-width: 767px) { .kg-event-map__gate { padding: 18px; } .kg-event-map__frame[data-kg-map-loaded] { aspect-ratio: 4 / 3; } }
.kg-share { margin: 32px 0; padding: 20px; border: 1px solid var(--wp--preset--color--border); border-radius: 16px; background: var(--wp--preset--color--surface-alt); }
.kg-share h2 { margin: 0 0 14px; font-size: 20px; }
.kg-share__actions { display: flex; flex-wrap: wrap; gap: 10px; }
.kg-share__button { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 9px 13px; border: 1px solid var(--wp--preset--color--brand-strong); border-radius: 6px; background: #fff; color: var(--wp--preset--color--brand-strong); font: inherit; font-weight: 700; text-decoration: none; cursor: pointer; }
.kg-share__button:hover { background: var(--wp--preset--color--brand-faint); }
.kg-share__status { min-height: 1.5em; margin: 12px 0 0; color: var(--wp--preset--color--ink-muted); font-size: 14px; }
.kg-search-form { max-width: 760px; margin: 0 0 28px; }
.kg-search-form label { display: block; margin-bottom: 8px; font-weight: 700; }
.kg-search-form__controls { display: flex; gap: 12px; }
.kg-search-form input { flex: 1; min-width: 0; min-height: 48px; padding: 10px 12px; border: 1px solid var(--wp--preset--color--ink-muted); border-radius: 6px; background: #fff; color: var(--wp--preset--color--ink); font: inherit; }
.kg-search-form button { flex: none; min-height: 48px; padding: 10px 18px; border: 1px solid var(--wp--preset--color--brand-strong); border-radius: 6px; background: var(--wp--preset--color--brand-strong); color: #fff; font: inherit; font-weight: 700; cursor: pointer; }
.kg-search-suggestions { max-width: 760px; margin-top: -18px; overflow: hidden; border: 1px solid var(--wp--preset--color--border); border-radius: 0 0 10px 10px; background: var(--wp--preset--color--surface); box-shadow: 0 12px 26px rgba(23, 33, 43, .12); }
.kg-search-suggestions__item { display: grid; grid-template-columns: auto 1fr; gap: 3px 10px; padding: 13px 14px; border-top: 1px solid var(--wp--preset--color--border); color: var(--wp--preset--color--ink); text-decoration: none; }
.kg-search-suggestions__item:first-child { border-top: 0; }
.kg-search-suggestions__kind { grid-row: span 2; align-self: start; padding: 3px 7px; border-radius: 999px; background: var(--wp--preset--color--brand-faint); color: var(--wp--preset--color--brand-strong); font-size: 12px; font-weight: 700; line-height: 1.25; }
.kg-search-suggestions__title { font-weight: 700; line-height: 1.35; }
.kg-search-suggestions__meta { color: var(--wp--preset--color--ink-muted); font-size: 14px; line-height: 1.35; }
.kg-search-suggestions__item[aria-selected="true"], .kg-search-suggestions__item:hover { background: var(--wp--preset--color--brand-faint); }
.kg-search-suggestions__item:focus-visible { position: relative; z-index: 1; outline: 3px solid var(--wp--preset--color--brand-strong); outline-offset: -3px; }
.kg-search-suggestions__status { min-height: 1.4em; max-width: 760px; margin: 8px 0 20px; color: var(--wp--preset--color--ink-muted); font-size: 14px; line-height: 1.4; }
.kg-search-results { border-top: 1px solid var(--wp--preset--color--border); }
.kg-search-result { padding: 24px 0; border-bottom: 1px solid var(--wp--preset--color--border); }
.kg-search-result h2 { margin: 4px 0 8px; font-size: clamp(22px, 2.3vw, 30px); }
.kg-search-result p { max-width: 720px; margin: 0; }
.kg-search-result__kind, .kg-search-result__meta { color: var(--wp--preset--color--ink-muted); font-size: 15px; }
.kg-search-result__kind { font-weight: 700; }
.kg-search-result__meta { margin-bottom: 10px !important; }
.kg-news-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.kg-news-card { display: flex; flex-direction: column; align-items: flex-start; min-height: 100%; padding: 24px; border: 1px solid var(--wp--preset--color--border); border-radius: 16px; background: var(--wp--preset--color--surface); transition: border-color var(--kg-duration) ease, box-shadow var(--kg-duration) ease; }
.kg-news-card:hover { border-color: var(--wp--preset--color--brand-soft); box-shadow: 0 14px 34px rgba(23, 33, 43, .09); }
.kg-news-card > .kg-poster { align-self: stretch; width: 100%; aspect-ratio: 3 / 2; margin-bottom: 18px; }
.kg-news-card > .kg-poster + .kg-news-card__meta { margin-top: 0; }
.kg-news-card__meta { display: flex; flex-wrap: wrap; gap: 8px 12px; margin: 0; color: var(--wp--preset--color--ink-muted); font-size: 14px; }
.kg-news-card__meta span { color: var(--wp--preset--color--brand-strong); font-weight: 750; }
.kg-news-card h2 { margin: 14px 0 10px; font-size: clamp(22px, 2.3vw, 29px); line-height: 1.18; }
.kg-news-card > p:not(.kg-news-card__meta):not(.kg-news-card__source) { margin: 0 0 14px; }
.kg-news-card__source { margin: 0 0 16px; color: var(--wp--preset--color--ink-muted); font-size: 14px; }
.kg-news-card .kg-action { margin-top: auto; }
.kg-latest-news { max-width: 1120px; margin: 84px auto 0; padding: 0 var(--wp--preset--spacing--40); }
.kg-latest-news__facebook { margin: 24px 0 0; }
.kg-latest-news__facebook a { display: inline-flex; align-items: center; gap: 8px; font-weight: 700; }
.kg-news-detail__date, .kg-news-detail__source { color: var(--wp--preset--color--ink-muted); }
.kg-news-detail__body { max-width: 760px; margin-top: 36px; }

@media (max-width: 1023px) { .kg-card-grid, .kg-news-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 768px) { .kg-event-facts dl { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 32px; } .kg-event-facts dl > div:nth-child(2) { border-top: 1px solid var(--wp--preset--color--border); } }
@media (max-width: 767px) { .kg-card-grid, .kg-detail__grid { grid-template-columns: 1fr; } .kg-content-card:not(.kg-event-card) { padding: 20px; } .kg-event-card > :not(.kg-poster) { margin-right: 20px; margin-left: 20px; } .kg-event-card > .kg-action { margin-bottom: 20px; } .kg-detail__grid { gap: 28px; } .kg-facts { order: -1; } .kg-event-facts { margin-top: 18px; padding: 20px; } .kg-event-hero { min-height: 132px; margin-top: 18px; padding: 12px; border-radius: 18px; } .kg-event-description { margin-top: 40px; padding: 24px 20px; border-radius: 16px; } .kg-share { margin: 24px 0; padding: 18px; } .kg-share__actions { display: grid; grid-template-columns: 1fr 1fr; } .kg-search-form__controls { flex-direction: column; } .kg-search-form button { width: 100%; } .kg-search-suggestions { margin-top: -18px; } .kg-search-suggestions__item { padding: 14px 12px; } }
@media (max-width: 767px) { .kg-news-grid { grid-template-columns: 1fr; } .kg-news-card { padding: 20px; } .kg-latest-news { margin-top: 56px; } }

/* ---------- 17. Globalny formularz „Mam sprawę” ---------- */

#formularz { scroll-margin-top: 32px; }
.kg-global-form { --kg-form-navy: #08294d; --kg-form-blue: #0068b5; --kg-form-line: #c8d5e2; display: grid; grid-template-columns: minmax(280px, .82fr) minmax(500px, 1.18fr); gap: clamp(40px, 7vw, 112px); align-items: center; padding: clamp(56px, 8vw, 112px) max(20px, calc((100% - 1280px) / 2)); background: linear-gradient(135deg, #eef6fc 0%, #f7fbff 54%, #eaf4fb 100%); color: var(--kg-form-navy); }
.kg-global-form__intro { max-width: 470px; }
.kg-global-form__intro h2 { margin: 10px 0 18px; font-size: clamp(38px, 4vw, 58px); letter-spacing: -.045em; line-height: 1; color: var(--kg-form-navy); }
.kg-global-form__intro > p:not(.kg-eyebrow) { max-width: 31ch; margin: 0; font-size: clamp(17px, 1.45vw, 20px); line-height: 1.55; }
.kg-global-form__reasons { display: grid; gap: 11px; margin: 30px 0 0; padding: 0; list-style: none; }
.kg-global-form__reasons li { position: relative; padding: 12px 16px 12px 47px; border: 1px solid rgba(0, 77, 136, .14); border-radius: 12px; background: rgba(255, 255, 255, .7); color: #173c63; font-size: 15px; font-weight: 650; line-height: 1.35; }
.kg-global-form__reasons li::before { content: "✓"; position: absolute; top: 50%; left: 15px; display: grid; width: 22px; height: 22px; place-items: center; transform: translateY(-50%); border-radius: 50%; background: #d9f0e4; color: #14653e; font-size: 14px; font-weight: 800; }
.kg-global-form__fields { box-sizing: border-box; padding: clamp(26px, 3.5vw, 44px); border: 1px solid rgba(92, 127, 161, .3); border-radius: 24px; background: #fff; box-shadow: 0 18px 50px rgba(20, 66, 107, .12); }
.kg-global-form__fields fieldset { display: grid; gap: 22px; min-inline-size: 0; margin: 0; padding: 0; border: 0; }
.kg-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; align-items: start; }
.kg-form-grid--single { grid-template-columns: minmax(0, 1fr); }
.kg-global-form__fields fieldset > div:not(.kg-form-grid) { display: grid; gap: 8px; }
.kg-global-form label { display: block; margin: 0; color: var(--kg-form-navy); font-size: 15px; font-weight: 750; line-height: 1.35; }
.kg-global-form input, .kg-global-form select, .kg-global-form textarea { box-sizing: border-box; width: 100%; min-height: 52px; margin-top: 8px; padding: 13px 15px; border: 1px solid var(--kg-form-line); border-radius: 10px; background: #fff; color: var(--kg-form-navy); box-shadow: inset 0 1px 1px rgba(8, 41, 77, .02); font: inherit; line-height: 1.35; transition: border-color .18s ease, box-shadow .18s ease, background .18s ease; }
.kg-global-form textarea { min-height: 172px; resize: vertical; }
.kg-global-form input:hover, .kg-global-form select:hover, .kg-global-form textarea:hover { border-color: #8aa7c2; }
.kg-global-form input:focus, .kg-global-form select:focus, .kg-global-form textarea:focus { border-color: var(--kg-form-blue); outline: 0; box-shadow: 0 0 0 4px rgba(0, 104, 181, .13); }
.kg-global-form input:disabled, .kg-global-form select:disabled, .kg-global-form textarea:disabled { border-color: var(--kg-form-line); background: #f4f7fa; color: #66798b; opacity: 1; }
.kg-form-help { margin: 7px 0 0; color: #52708d; font-size: 13px; line-height: 1.45; }
.kg-global-form .kg-form-check { display: flex; gap: 12px; align-items: flex-start; margin-top: 2px; color: #264561; font-size: 14px; font-weight: 500; line-height: 1.55; }
.kg-global-form .kg-form-check input { flex: none; width: 20px; min-width: 20px; min-height: 20px; height: 20px; margin: 2px 0 0; padding: 0; accent-color: var(--kg-form-blue); }
.kg-global-form .kg-form-check a { color: #005fa8; font-weight: 700; }
.kg-global-form button { justify-self: start; min-height: 54px; padding: 14px 23px; border: 1px solid var(--kg-form-blue); border-radius: 10px; background: var(--kg-form-blue); box-shadow: 0 7px 14px rgba(0, 90, 161, .2); color: #fff; font: inherit; font-weight: 750; transition: transform .18s ease, background .18s ease, box-shadow .18s ease; }
.kg-global-form button:hover { background: #00538f; box-shadow: 0 10px 18px rgba(0, 90, 161, .26); transform: translateY(-1px); }
.kg-global-form button:disabled { border-color: #8a97a4; background: #8a97a4; box-shadow: none; color: #fff; cursor: not-allowed; transform: none; }
.kg-global-form [aria-invalid="true"] { border-color: #b42318; background: #fff8f7; }
.kg-global-form :focus-visible { outline: 3px solid var(--wp--preset--color--focus); outline-offset: 3px; }
.kg-honeypot { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(1px,1px,1px,1px); white-space: nowrap; }
.kg-form-errors, .kg-form-success { margin: 0; padding: 16px 18px; border-radius: 12px; }
.kg-form-errors { border: 1px solid #b42318; background: #fff1ef; color: #751710; }
.kg-form-success { border: 1px solid #176b3a; background: #e7f6ed; color: #104526; }
.kg-form-errors ul { margin: 8px 0 0; padding-left: 20px; }
.kg-form-success p { margin: 8px 0 0; }
@media (max-width: 960px) { .kg-global-form { grid-template-columns: 1fr; gap: 36px; padding: 64px max(20px, calc((100% - 640px) / 2)); } .kg-global-form__intro { max-width: 640px; } .kg-global-form__intro > p:not(.kg-eyebrow) { max-width: 42ch; } }
@media (max-width: 600px) { .kg-global-form { padding: 52px 16px; } .kg-global-form__intro h2 { font-size: 42px; } .kg-global-form__reasons { gap: 9px; margin-top: 24px; } .kg-global-form__reasons li { padding: 11px 13px 11px 43px; font-size: 14px; } .kg-global-form__fields { padding: 22px 18px; border-radius: 18px; } .kg-global-form__fields fieldset { gap: 18px; } .kg-form-grid { grid-template-columns: 1fr; gap: 18px; } .kg-global-form textarea { min-height: 150px; } .kg-global-form button { width: 100%; justify-self: stretch; } }

/* ---------- 18. Strony informacyjne („O Kolonii” i podstrony) ---------- */

/* Świadomie bez box-sizing: border-box — pasy strony głównej liczą max-width
   od pola treści (1120 + 2×16), a nowe strony muszą się z nimi pokrywać co do piksela. */
.kg-info { max-width: 1120px; margin-inline: auto; padding-inline: var(--wp--preset--spacing--40); }
.kg-info--narrow { max-width: 860px; }
.kg-info-section { padding-block: clamp(48px, 6vw, 80px); }
.kg-info-section > * + * { margin-top: 22px; }
.kg-info-section h2 { margin: 0; }
.kg-info-section h3 { margin: 0 0 8px; font-size: clamp(19px, 1.7vw, 23px); }

.kg-prose { max-width: 68ch; }
.kg-prose p { margin: 0 0 16px; font-size: 17px; line-height: 1.65; color: var(--wp--preset--color--ink-muted); }
.kg-prose p:last-child { margin-bottom: 0; }
.kg-prose strong { color: var(--wp--preset--color--ink); font-weight: 700; }

/* Kluczowe liczby — wyłącznie dane z podanego źródła, nigdy szacunki. */
.kg-keyfigures { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; margin: 0; padding: 0; list-style: none; }
.kg-keyfigures li { padding: 22px 24px; border: 1px solid var(--wp--preset--color--border-warm); border-radius: var(--kg-radius-lg); background: var(--wp--preset--color--surface); }
.kg-keyfigures dt, .kg-keyfigures__label { display: block; margin: 0 0 6px; color: var(--wp--preset--color--ink-muted); font-size: 13px; font-weight: 700; letter-spacing: .02em; }
.kg-keyfigures dd, .kg-keyfigures__value { display: block; margin: 0; color: var(--wp--preset--color--ink); font-size: clamp(26px, 2.6vw, 34px); font-weight: 600; letter-spacing: -.025em; line-height: 1.1; }
.kg-keyfigures__note { display: block; margin-top: 8px; color: var(--wp--preset--color--ink-muted); font-size: 13px; line-height: 1.45; }

/* Oś czasu historii — ta sama kreska co w projektach, bez statusów etapów. */
.kg-timeline { margin: 0; padding: 0; list-style: none; }
.kg-timeline__item { position: relative; padding: 0 0 30px 32px; border-left: 2px solid var(--wp--preset--color--border-warm); }
.kg-timeline__item::before { content: ""; position: absolute; top: 6px; left: -7px; width: 12px; height: 12px; border: 3px solid var(--wp--preset--color--surface-warm); border-radius: 50%; background: var(--wp--preset--color--brand-strong); box-shadow: 0 0 0 1px var(--wp--preset--color--border-warm); }
.kg-timeline__item:last-child { padding-bottom: 0; border-left-color: transparent; }
.kg-timeline__year { display: block; margin-bottom: 4px; color: var(--wp--preset--color--brand-strong); font-size: 14px; font-weight: 700; letter-spacing: .04em; }
.kg-timeline__item h3 { margin: 0 0 6px; font-size: 19px; font-weight: 600; line-height: 1.3; }
.kg-timeline__item p { margin: 0; color: var(--wp--preset--color--ink-muted); font-size: 16px; line-height: 1.6; }

/* Wykaz ulic — długa lista alfabetyczna, kolumny zamiast przewijania. */
.kg-streets { columns: 4 190px; column-gap: 32px; margin: 0; padding: 0; list-style: none; }
.kg-streets li { break-inside: avoid; padding: 6px 0; border-bottom: 1px solid var(--wp--preset--color--border-warm); font-size: 16px; line-height: 1.45; }

/* Tabela danych z oficjalnego zestawienia. */
.kg-datatable { width: 100%; border-collapse: collapse; font-size: 16px; }
.kg-datatable caption { margin-bottom: 12px; color: var(--wp--preset--color--ink-muted); font-size: 14px; text-align: left; }
.kg-datatable th, .kg-datatable td { padding: 12px 14px; border-bottom: 1px solid var(--wp--preset--color--border); text-align: left; }
.kg-datatable thead th { border-bottom-width: 2px; color: var(--wp--preset--color--ink-muted); font-size: 14px; }
.kg-datatable tbody th { font-weight: 600; }
.kg-datatable td { color: var(--wp--preset--color--ink-muted); }
.kg-datatable tfoot th, .kg-datatable tfoot td { color: var(--wp--preset--color--ink); font-weight: 700; }

/* Uwaga redakcyjna — m.in. zastrzeżenie o umocowaniu serwisu. */
.kg-note { margin: 0; padding: 20px 22px; border: 1px solid var(--wp--preset--color--border); border-left: 4px solid var(--wp--preset--color--brand); border-radius: 12px; background: var(--wp--preset--color--surface); color: var(--wp--preset--color--ink-muted); font-size: 15px; line-height: 1.6; }
.kg-note strong { color: var(--wp--preset--color--ink); }
.kg-note > * + * { margin-top: 10px; }
.kg-note :last-child { margin-bottom: 0; }

/* Źródła — obowiązkowe pod każdą treścią faktograficzną (docs/02 §19). */
.kg-sources { margin: 0; padding: 0; list-style: none; counter-reset: kg-source; }
.kg-sources li { position: relative; padding: 14px 0 14px 38px; border-bottom: 1px solid var(--wp--preset--color--border); font-size: 16px; line-height: 1.55; }
.kg-sources li::before { counter-increment: kg-source; content: counter(kg-source); position: absolute; top: 15px; left: 0; display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: var(--wp--preset--color--brand-faint); color: var(--wp--preset--color--brand-strong); font-size: 13px; font-weight: 700; }
.kg-sources__meta { display: block; margin-top: 3px; color: var(--wp--preset--color--ink-muted); font-size: 14px; }

@media (max-width: 900px) {
	.kg-keyfigures { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
	.kg-keyfigures li { padding: 18px; }
}

@media (max-width: 600px) {
	.kg-keyfigures { grid-template-columns: 1fr; }
	.kg-datatable, .kg-datatable caption, .kg-datatable thead, .kg-datatable tbody, .kg-datatable tfoot, .kg-datatable tr, .kg-datatable th, .kg-datatable td { display: block; }
	.kg-datatable thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(1px,1px,1px,1px); white-space: nowrap; }
	.kg-datatable tr { padding: 10px 0; border-bottom: 1px solid var(--wp--preset--color--border); }
	.kg-datatable th, .kg-datatable td { padding: 3px 0; border: 0; }
	.kg-datatable td::before { content: attr(data-label) ": "; color: var(--wp--preset--color--ink-muted); font-size: 14px; }
}

/* Poniżej ~430 px dwie kolumny nazw ulic robią się za ciasne — jedna kolumna czyta się lepiej. */
@media (max-width: 430px) {
	.kg-streets { columns: 1; }
}

/* ---------- 19. Zdjęcia z podpisem i atrybucją ---------- */

/* Każde zdjęcie z zewnętrznego źródła musi nieść autora i licencję —
   podpis jest częścią komponentu, nie opcjonalnym dodatkiem. */
/* align-self: start — w siatce i w kg-split figura nie może się rozciągać na
   wysokość sąsiada, bo wtedy podpis wychodzi poza komórkę i nachodzi na kolejną sekcję. */
.kg-figure { margin: 0; align-self: start; }
/* height: auto zdejmuje podpowiedź prezentacyjną z atrybutu `height` w HTML —
   bez tego atrybut wygrywa z `aspect-ratio` i sąsiednie zdjęcia mają różną wysokość. */
.kg-figure img { display: block; width: 100%; height: auto; border-radius: var(--kg-radius-lg); object-fit: cover; background: var(--wp--preset--color--surface-alt); }
.kg-figure--portrait img { aspect-ratio: 4 / 3; }
.kg-figure--wide img { aspect-ratio: 3 / 2; }
.kg-figure figcaption { margin-top: 10px; color: var(--wp--preset--color--ink-muted); font-size: 13px; line-height: 1.5; }
.kg-figure figcaption b { display: block; margin-bottom: 2px; color: var(--wp--preset--color--ink); font-weight: 600; }
.kg-figure__credit { display: block; }

/* Spis zdjęć pod listą źródeł — pełna atrybucja w jednym miejscu. */
.kg-credits { margin: 20px 0 0; padding: 0; list-style: none; }
.kg-credits li { padding: 10px 0; border-top: 1px solid var(--wp--preset--color--border); color: var(--wp--preset--color--ink-muted); font-size: 14px; line-height: 1.55; }
.kg-credits li:first-child { border-top: 0; }

/* ---------- 20. Strona „Wydarzenia” (/wydarzenia) ---------- */

/* Szablon archiwum oddaje szerokość blokowi, bo pas nagłówka jest pełnej
   szerokości okna, a treść pilnuje własnego kontenera (docs/05 §8.2). */
.kg-page-shell--flush { padding-top: 0; }

.kg-events__inner {
	box-sizing: border-box;
	max-width: 1560px;
	margin-inline: auto;
	padding-inline: clamp(16px, 3.5vw, 40px);
}

.kg-events__band {
	padding-block: clamp(22px, 4vw, 40px);
	border-bottom: 1px solid var(--wp--preset--color--border-warm);
	background: var(--wp--preset--color--surface-warm);
}

.kg-events__band .kg-breadcrumb { margin: 0 0 18px; }
.kg-events__intro { max-width: 60ch; }
.kg-events__intro h1 { margin: 0 0 12px; }
.kg-events__intro .kg-lead { margin: 0; }
.kg-events__body { padding-block: clamp(24px, 4vw, 40px) clamp(56px, 8vw, 104px); }

/* Przełącznik zakresu: dwa stany kalendarza, nie filtr — dlatego linki,
   a nie pola formularza. Aktywny stan niesie też aria-current. */
.kg-scope {
	display: inline-flex;
	gap: 4px;
	margin-top: 24px;
	padding: 4px;
	border: 1px solid var(--wp--preset--color--border-warm);
	border-radius: 999px;
	background: var(--wp--preset--color--surface);
}

/* Pasek statusów to NIE segmentowany przełącznik: pozycji jest osiem, więc
   `inline-flex` bez zawijania wypychał je poza ekran telefonu — przy 390 px
   pigułka „Wstrzymany” lądowała na x = 400 i nie dało się jej kliknąć.
   Tutaj pigułki zawijają się do kolejnych wierszy. */
.kg-scope--status {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
}

.kg-scope--status .kg-scope__link {
	border: 1px solid var(--wp--preset--color--border);
}

.kg-scope--status .kg-scope__link.is-active {
	border-color: var(--wp--preset--color--brand-strong);
}

.kg-scope__link {
	display: inline-flex;
	align-items: center;
	min-height: var(--kg-tap);
	padding: 0 20px;
	border-radius: 999px;
	color: var(--wp--preset--color--ink-muted);
	font-size: 15px;
	font-weight: 700;
	text-decoration: none;
	transition: background-color var(--kg-duration) ease, color var(--kg-duration) ease;
}

.kg-scope__link:hover { background: var(--wp--preset--color--brand-faint); color: var(--wp--preset--color--brand-deep); }
.kg-scope__link.is-active { background: var(--wp--preset--color--brand-strong); color: #fff; }

/* Pasek nad wynikami: przycisk filtrów i licznik. */
.kg-events__toolbar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px 20px;
	margin-bottom: 16px;
}

.kg-filter-toggle {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	min-height: var(--kg-tap);
	padding: 10px 18px;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 999px;
	background: var(--wp--preset--color--surface);
	color: var(--wp--preset--color--ink);
	font: inherit;
	font-weight: 700;
	cursor: pointer;
	transition: border-color var(--kg-duration) ease, background-color var(--kg-duration) ease;
}

.kg-filter-toggle:hover { border-color: var(--wp--preset--color--brand-strong); background: var(--wp--preset--color--brand-faint); }
.kg-filter-toggle__icon { flex: none; }
.kg-filter-toggle[aria-expanded="true"] { border-color: var(--wp--preset--color--brand-strong); background: var(--wp--preset--color--brand-faint); }

.kg-filter-toggle__count {
	display: inline-grid;
	min-width: 22px;
	height: 22px;
	place-items: center;
	padding: 0 6px;
	border-radius: 999px;
	background: var(--wp--preset--color--brand-strong);
	color: #fff;
	font-size: 13px;
	font-weight: 800;
}

.kg-events__toolbar .kg-results { margin: 0; }

/* Panel filtrów. Bez JavaScriptu jest po prostu widoczny — przycisk startuje
   z atrybutem hidden i odsłania go dopiero skrypt (docs/04 §14.1). */
.kg-filter-panel {
	margin: 0 0 18px;
	padding: 20px;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--kg-radius-lg);
	background: var(--wp--preset--color--surface-alt);
}

.kg-filter-panel[hidden] { display: none; }
/* `.kg-filter-toggle` ustawia `display: inline-flex`, co bije regułę
   `[hidden]` z arkusza przeglądarki — bez tej linii przycisk filtrów
   pokazywał się także bez JavaScriptu, choć ma nic nie robić. */
.kg-filter-toggle[hidden] { display: none; }
.kg-filter-panel__title { margin: 0 0 16px; font-size: 18px; }
.kg-filter-panel__fields { display: grid; gap: 16px; }
.kg-filter-panel .kg-filter__field { display: grid; gap: 6px; }
.kg-filter-panel label { font-size: 14px; font-weight: 700; }

.kg-filter-panel :is(select, input) {
	box-sizing: border-box;
	width: 100%;
	min-height: var(--kg-tap);
	padding: 8px 10px;
	border: 1px solid var(--wp--preset--color--ink-muted);
	border-radius: var(--kg-radius-sm);
	background: #fff;
	color: var(--wp--preset--color--ink);
	font: inherit;
}

.kg-filter-panel__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; margin-top: 18px; }
.kg-filter-panel button { display: inline-flex; align-items: center; justify-content: center; min-height: var(--kg-tap); padding: 10px 22px; border: 1px solid var(--wp--preset--color--brand-strong); border-radius: var(--kg-radius-md); background: var(--wp--preset--color--brand-strong); color: #fff; font: inherit; font-weight: 700; cursor: pointer; }
.kg-filter-panel__actions a { display: inline-flex; align-items: center; min-height: var(--kg-tap); }

/* Aktywne warunki widoczne i możliwe do usunięcia (docs/05 §14.9). */
.kg-chips { margin: 0 0 20px; }
.kg-chips ul { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }

.kg-chip {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 36px;
	padding: 4px 14px;
	border: 1px solid var(--wp--preset--color--brand-soft);
	border-radius: 999px;
	background: var(--wp--preset--color--brand-faint);
	color: var(--wp--preset--color--brand-deep);
	font-size: 14px;
	font-weight: 600;
	text-decoration: none;
	transition: background-color var(--kg-duration) ease;
}

.kg-chip:hover { background: var(--wp--preset--color--brand-soft); }

.kg-chip__remove { font-size: 17px; line-height: 1; }
.kg-chip--clear { border-style: dashed; border-color: var(--wp--preset--color--border); background: transparent; }

/* Dwie kolumny: wyniki 80 %, datownik i kategorie 20 % (docs/05 §17). */
.kg-events__layout { display: grid; gap: 40px; }
.kg-events__results-title { margin: 0 0 18px; font-size: clamp(20px, 2vw, 24px); }
.kg-events__results-title:focus-visible { outline-offset: 6px; }

.kg-event-month + .kg-event-month { margin-top: 32px; }

.kg-event-month__title {
	margin: 0 0 12px;
	font-size: 14px;
	font-weight: 750;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--wp--preset--color--ink-muted);
}

.kg-event-list { display: grid; gap: 14px; margin: 0; padding: 0; list-style: none; }

.kg-event-row {
	position: relative;
	display: flex;
	flex-direction: column;
	overflow: hidden;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--kg-radius-lg);
	background: var(--wp--preset--color--surface);
	transition: border-color var(--kg-duration) ease, box-shadow var(--kg-duration) ease;
}

.kg-event-row:hover { border-color: var(--wp--preset--color--brand-soft); box-shadow: 0 12px 30px rgba(23, 33, 43, .09); }
.kg-event-row:focus-within { border-color: var(--wp--preset--color--brand-strong); }
.kg-event-row--lead { border-color: var(--wp--preset--color--brand-soft); background: var(--wp--preset--color--brand-faint); }

.kg-event-row__media { display: flex; flex: none; align-self: stretch; }
.kg-event-row__media .kg-poster { flex: 1 1 auto; aspect-ratio: var(--kg-poster-ratio, 3 / 2); max-height: 240px; }
.kg-event-row__main { display: flex; gap: 16px; padding: 18px; }
.kg-event-row__date { margin: 0; }
.kg-datetile__weekday { display: block; margin-top: 2px; font-size: 11px; font-weight: 600; color: var(--wp--preset--color--on-dark-muted); }
.kg-event-row__body { min-width: 0; }
.kg-event-row__tags { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 10px; }
.kg-badge--type { --kg-badge-ink: var(--wp--preset--color--ink-muted); --kg-badge-bg: var(--wp--preset--color--surface-alt); font-weight: 600; }

.kg-event-row__title {
	--kg-link: var(--wp--preset--color--ink);
	--kg-link-hover: var(--wp--preset--color--brand-strong);
	--kg-link-hover-bg: transparent;
	margin: 0 0 8px;
	font-size: clamp(18px, 1.6vw, 21px);
	line-height: 1.22;
}

/* Jeden link na kartę: pseudoelement rozciąga obszar kliknięcia na cały
   wiersz, więc czytnik ekranu nie słyszy trzech odnośników do tej samej
   strony (docs/04 §11.1). */
.kg-event-row__title a::after { content: ""; position: absolute; inset: 0; }

/* Godzina i miejsce w jednym wierszu, ale bez separatora — po zawinięciu
   kropka zostawałaby sierotą na początku nowej linii. */
.kg-event-row__facts { display: flex; flex-wrap: wrap; gap: 4px 16px; margin: 0; color: var(--wp--preset--color--ink-muted); font-size: 15px; }
.kg-event-row__venue { color: var(--wp--preset--color--ink); }
.kg-event-row__summary { margin: 10px 0 0; font-size: 16px; line-height: 1.5; }
.kg-event-row--lead .kg-event-row__title { font-size: clamp(21px, 2.2vw, 27px); }

/* Kolumna pomocnicza */
.kg-events__aside { display: grid; gap: 20px; align-content: start; }

.kg-datownik,
.kg-taglist,
.kg-events__aside-cta {
	padding: 18px;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--kg-radius-lg);
	background: var(--wp--preset--color--surface);
}

.kg-datownik__nav { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 12px; }
.kg-datownik__title { margin: 0; font-size: 16px; text-align: center; }

.kg-datownik__step {
	display: inline-grid;
	flex: none;
	width: var(--kg-tap);
	height: var(--kg-tap);
	place-items: center;
	border-radius: 50%;
	color: var(--wp--preset--color--brand-strong);
	font-size: 22px;
	line-height: 1;
	text-decoration: none;
	transition: background-color var(--kg-duration) ease;
}

.kg-datownik__step:hover { background: var(--wp--preset--color--brand-faint); }

.kg-datownik__grid { width: 100%; border-collapse: collapse; table-layout: fixed; }
.kg-datownik__grid th { padding-bottom: 6px; font-size: 11px; font-weight: 700; letter-spacing: .06em; color: var(--wp--preset--color--ink-muted); }
.kg-datownik__grid th abbr { text-decoration: none; }
.kg-datownik__grid td { padding: 1px; text-align: center; }

.kg-datownik__cell :is(a, span) {
	display: grid;
	min-height: 38px;
	place-items: center;
	border-radius: 8px;
	font-size: 15px;
	line-height: 1;
	text-decoration: none;
}

.kg-datownik__cell span { color: var(--wp--preset--color--ink-muted); }
.kg-datownik__day { position: relative; color: var(--wp--preset--color--ink); font-weight: 700; transition: background-color var(--kg-duration) ease; }
.kg-datownik__day span { color: inherit; }

/* Kropka pod dniem: dzień z wydarzeniem rozpoznaje się nie tylko po kolorze
   (docs/05 §14.7, WCAG 1.4.1). */
.kg-datownik__day::after {
	content: "";
	position: absolute;
	bottom: 4px;
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background: currentColor;
}

.kg-datownik__day:hover { background: var(--wp--preset--color--brand-faint); }
.kg-datownik__cell.is-today :is(a, span) { box-shadow: inset 0 0 0 1px var(--wp--preset--color--ink-muted); }
.kg-datownik__cell.is-selected .kg-datownik__day { background: var(--wp--preset--color--brand-strong); color: #fff; }
.kg-datownik__legend { display: flex; align-items: center; gap: 8px; margin: 12px 0 0; font-size: 13px; color: var(--wp--preset--color--ink-muted); }
.kg-datownik__mark { flex: none; width: 6px; height: 6px; border-radius: 50%; background: var(--wp--preset--color--brand-strong); }
.kg-datownik__reset { margin: 10px 0 0; font-size: 14px; }

.kg-taglist__title,
.kg-events__aside-cta h3 { margin: 0 0 12px; font-size: 16px; }
.kg-taglist ul { margin: 0; padding: 0; list-style: none; }

.kg-taglist__item {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	min-height: var(--kg-tap);
	padding: 6px 10px;
	border-radius: var(--kg-radius-sm);
	color: var(--wp--preset--color--ink);
	font-size: 15px;
	text-decoration: none;
	transition: background-color var(--kg-duration) ease, color var(--kg-duration) ease;
}

.kg-taglist__item:hover { background: var(--wp--preset--color--brand-faint); color: var(--wp--preset--color--brand-deep); }

.kg-taglist__item.is-active { background: var(--wp--preset--color--brand-faint); font-weight: 750; }
.kg-taglist__count { flex: none; color: var(--wp--preset--color--ink-muted); font-size: 13px; font-weight: 700; }
.kg-taglist__item.is-active .kg-taglist__count { color: var(--wp--preset--color--brand-deep); }
.kg-events__aside-cta { border-color: var(--wp--preset--color--border-warm); background: var(--wp--preset--color--surface-warm); }
.kg-events__aside-cta p { margin: 0 0 14px; font-size: 15px; line-height: 1.5; }

/* Paginacja list — dotąd nie miała własnych reguł i renderowała się
   jako goła lista punktowana. */
.kg-pagination { margin-top: 32px; }
.kg-pagination ul { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }

.kg-pagination :is(a, span).page-numbers {
	display: inline-grid;
	min-width: var(--kg-tap);
	min-height: var(--kg-tap);
	place-items: center;
	padding: 0 12px;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--kg-radius-sm);
	color: var(--wp--preset--color--brand-strong);
	font-weight: 700;
	text-decoration: none;
	transition: background-color var(--kg-duration) ease, border-color var(--kg-duration) ease;
}

.kg-pagination a.page-numbers:hover { border-color: var(--wp--preset--color--brand-strong); background: var(--wp--preset--color--brand-faint); }

.kg-pagination .page-numbers.current { border-color: var(--wp--preset--color--brand-strong); background: var(--wp--preset--color--brand-strong); color: #fff; }
.kg-pagination .page-numbers.dots { border-color: transparent; }

@media (min-width: 600px) {
	.kg-filter-panel__fields { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (min-width: 768px) {
	.kg-event-row { flex-direction: row; }
	.kg-event-row__media { width: 210px; }
	.kg-event-row__media .kg-poster { max-height: none; aspect-ratio: auto; }
	.kg-event-row__main { flex: 1 1 auto; min-width: 0; padding: 20px 22px; }
	.kg-event-row--lead .kg-event-row__media { width: 320px; }
	.kg-event-row--lead .kg-event-row__main { padding: 26px 28px; }
}

@media (min-width: 1024px) {
	.kg-events__layout {
		grid-template-columns: minmax(0, 80fr) minmax(240px, 20fr);
		gap: clamp(28px, 2.6vw, 44px);
		align-items: start;
	}

	.kg-events__body { padding-top: clamp(28px, 3vw, 44px); }
}

@media (max-width: 1023px) {
	/* Kolumna pomocnicza schodzi pod wyniki, więc dostaje własny separator. */
	.kg-events__aside { padding-top: 32px; border-top: 1px solid var(--wp--preset--color--border); }
}

@media (max-width: 599px) {
	.kg-events__toolbar { flex-direction: column; align-items: stretch; }
	.kg-filter-toggle { justify-content: center; }
	.kg-filter-panel button { width: 100%; }
	.kg-filter-panel__actions a { justify-content: center; width: 100%; }
	.kg-event-row__main { gap: 14px; padding: 16px; }
	.kg-event-row__summary { font-size: 15px; }
}

/* ---------- 21. Zgody cookies (baner i panel ustawień) ---------- */

/* docs/10 §5.3 — warstwa nie przykrywa całej strony i nie łapie fokusu.
   Pas przy dolnej krawędzi zostawia treść czytelną, a na wąskim ekranie
   przewija się razem z własną zawartością, nie ze stroną pod spodem. */
.kg-consent {
	position: fixed;
	inset-inline: 0;
	inset-block-end: 0;
	z-index: 90;
	padding: 0 var(--wp--preset--spacing--40) clamp(12px, 2vw, 24px);
	pointer-events: none;
}

.kg-consent[hidden] { display: none; }

.kg-consent__dialog {
	box-sizing: border-box;
	max-width: 1120px;
	max-height: min(78vh, 720px);
	margin-inline: auto;
	overflow-y: auto;
	overscroll-behavior: contain;
	padding: clamp(20px, 2.4vw, 30px);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--kg-radius-lg);
	background: var(--wp--preset--color--surface);
	box-shadow: 0 -6px 40px rgba(20, 66, 107, .18);
	pointer-events: auto;
}

.kg-consent__title { margin: 0; font-size: clamp(20px, 2vw, 25px); }
.kg-consent__lead { margin: 10px 0 0; max-width: 78ch; color: var(--wp--preset--color--ink-muted); font-size: 16px; line-height: 1.6; }
/* Zapewnienie o zakresie użycia danych — mieszkaniec ma je przeczytać przed
   kliknięciem, nie dopiero w polityce. */
.kg-consent__assurance {
	margin: 10px 0 0;
	max-width: 78ch;
	padding: 12px 14px;
	border-inline-start: 3px solid var(--wp--preset--color--brand);
	border-radius: var(--kg-radius-sm);
	background: var(--wp--preset--color--brand-faint);
	color: var(--wp--preset--color--ink);
	font-size: 15px;
	line-height: 1.55;
}

.kg-consent__links { margin: 12px 0 0; font-size: 15px; }

.kg-consent__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin-top: 20px;
}

.kg-consent__actions--panel { margin-top: 18px; }

.kg-consent__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: var(--kg-tap);
	padding: 0 22px;
	border: 2px solid var(--wp--preset--color--brand-strong);
	border-radius: var(--kg-radius-md);
	background: var(--wp--preset--color--surface);
	color: var(--wp--preset--color--brand-strong);
	font: inherit;
	font-size: 16px;
	font-weight: 600;
	cursor: pointer;
	transition: background-color var(--kg-duration) ease, color var(--kg-duration) ease;
}

/* Akceptacja i odrzucenie mają identyczną wagę wizualną — docs/10 §5.3
   zakazuje manipulacyjnego wyróżniania jednej z odpowiedzi. */
.kg-consent__btn--primary:hover {
	background: var(--wp--preset--color--brand-faint);
	color: var(--wp--preset--color--brand-deep);
}

.kg-consent__btn--quiet {
	border-color: var(--wp--preset--color--border);
	color: var(--wp--preset--color--ink);
}

.kg-consent__btn--quiet:hover { background: var(--wp--preset--color--surface-alt); }

.kg-consent__panel {
	margin-top: 22px;
	padding-top: 20px;
	border-top: 1px solid var(--wp--preset--color--border);
}

.kg-consent__panel[hidden] { display: none; }

.kg-consent__group { margin: 0; padding: 0; border: 0; }
.kg-consent__legend { padding: 0; margin-bottom: 12px; font-size: 15px; font-weight: 700; }

.kg-consent__item {
	padding: 14px 0;
	border-top: 1px solid var(--wp--preset--color--border-warm);
}

.kg-consent__check {
	display: flex;
	gap: 12px;
	align-items: flex-start;
	min-height: 28px;
	cursor: pointer;
}

.kg-consent__check input {
	flex: none;
	width: 22px;
	height: 22px;
	margin: 1px 0 0;
	accent-color: var(--wp--preset--color--brand-strong);
}

.kg-consent__check input:disabled { cursor: not-allowed; }

.kg-consent__name { font-size: 17px; font-weight: 600; line-height: 1.35; }

.kg-consent__always {
	display: inline-block;
	margin-inline-start: 6px;
	padding: 2px 8px;
	border-radius: 999px;
	background: var(--wp--preset--color--surface-alt);
	color: var(--wp--preset--color--ink-muted);
	font-size: 12px;
	font-weight: 600;
	vertical-align: 2px;
}

.kg-consent__summary { margin: 6px 0 0 34px; color: var(--wp--preset--color--ink-muted); font-size: 15px; line-height: 1.55; }
.kg-consent__meta { margin: 6px 0 0 34px; color: var(--wp--preset--color--ink-muted); font-size: 13px; line-height: 1.5; }
.kg-consent__note { margin: 12px 0 0; color: var(--wp--preset--color--ink-muted); font-size: 14px; }

/* Przycisk „Ustawienia cookies” w stopce wygląda jak sąsiednie linki. */
.kg-footer__links button {
	padding: 0;
	border: 0;
	background: none;
	color: inherit;
	font: inherit;
	text-align: start;
	cursor: pointer;
}

@media (max-width: 599px) {
	.kg-consent { padding-inline: 12px; }
	.kg-consent__dialog { max-height: 82vh; padding: 18px 16px; }
	.kg-consent__actions { flex-direction: column; }
	.kg-consent__btn { width: 100%; }
	.kg-consent__summary, .kg-consent__meta { margin-inline-start: 0; }
}

/* Zoom 400% i bardzo niskie okna: warstwa przestaje być przyklejona,
   żeby nie zasłonić treści (docs/08 — reflow). */
@media (max-height: 460px) {
	.kg-consent { position: static; padding-top: 16px; }
	.kg-consent__dialog { max-height: none; }
}

/* ---------- Partnerzy współpracy (CPT kg_partner) ----------
   Mobile first: jedna kolumna kafelków od 320 px, dwie od 480 px, dalej tyle,
   ile zmieści się przy minimalnej szerokości 190 px. Logo nigdy nie jest
   kadrowane — `contain` w stałej ramce trzyma rząd równy niezależnie od
   proporcji pliku (docs/05 §12.2). Nazwa jest zawsze tekstem, więc kafelek
   działa też wtedy, gdy redaktor nie dodał logotypu. */

.kg-partners__group + .kg-partners__group {
	margin-top: 28px;
}

/* Selektor musi być mocniejszy niż `.kg-info-section h3` ze stron
   informacyjnych, inaczej nazwa kategorii rośnie do 23 px. */
.kg-partners .kg-partners__role {
	margin: 0 0 12px;
	font-size: 13px;
	font-weight: 750;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--wp--preset--color--brand-strong);
}

.kg-partners__list {
	display: grid;
	grid-template-columns: 1fr;
	gap: 12px;
	margin: 0;
	padding: 0;
	list-style: none;
}

/* Kafelek jest siatką, więc link wypełnia całą komórkę bez `height: 100%`
   (procent liczony od wiersza siatki potrafił rozdymać kafelek — ten sam błąd
   naprawialiśmy już w `.kg-content-card`). */
.kg-partner {
	display: grid;
	margin: 0;
}

.kg-partner__link {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 14px 16px;
	border: 1px solid var(--wp--preset--color--border-warm);
	border-radius: var(--kg-radius-lg);
	background: var(--wp--preset--color--surface);
	color: var(--wp--preset--color--ink);
	font-size: 16px;
	font-weight: 600;
	line-height: 1.35;
	text-decoration: none;
}

a.kg-partner__link:focus-visible {
	border-color: var(--wp--preset--color--brand);
	background: var(--wp--preset--color--brand-faint);
	color: var(--wp--preset--color--brand-strong);
}

@media (hover: hover) {
	a.kg-partner__link:hover {
		border-color: var(--wp--preset--color--brand);
		background: var(--wp--preset--color--brand-faint);
		color: var(--wp--preset--color--brand-strong);
	}
}

.kg-partner__logo {
	display: grid;
	place-items: center;
	flex: none;
	width: 72px;
	height: 48px;
}

.kg-partner__img {
	max-width: 100%;
	max-height: 48px;
	width: auto;
	height: auto;
	object-fit: contain;
}

.kg-partner__name {
	min-width: 0;
	overflow-wrap: anywhere;
}

/* Bez logotypu kafelek zostaje czytelną nazwą, a nie pustą ramką. */
.kg-partner--text .kg-partner__link {
	justify-content: flex-start;
}

.kg-partners .kg-empty {
	max-width: 680px;
}

.kg-partners .kg-empty p {
	margin: 0;
	color: var(--wp--preset--color--ink-muted);
}

/* Sekcja na stronie wydarzenia — oddzielona od treści, ale bez własnego pasa. */
.kg-partners {
	margin-top: 36px;
}

.kg-partners > h2 {
	margin: 0 0 18px;
	font-size: clamp(22px, 2vw, 26px);
}

@media (min-width: 480px) {
	.kg-partners__list {
		grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
	}

	.kg-partner__link {
		flex-direction: column;
		gap: 12px;
		padding: 18px 16px;
		text-align: center;
	}

	.kg-partner__logo {
		width: 100%;
		height: 56px;
	}

	.kg-partner__img {
		max-height: 56px;
	}

	.kg-partner--text .kg-partner__link {
		justify-content: center;
	}
}


/* Blok stałych partnerów i podpis „przy jakim wydarzeniu”. */
.kg-partners__standing,
.kg-partners__block + .kg-partners__block {
	margin-top: 28px;
}

/* Nagłówek bloku stoi wyżej w hierarchii niż nazwa kategorii, więc nie może
   wyglądać jak ta sama nadlinia. */
.kg-partners .kg-partners__block-title {
	margin: 0 0 14px;
	padding-bottom: 8px;
	border-bottom: 1px solid var(--wp--preset--color--border-warm);
	color: var(--wp--preset--color--ink);
	font-size: clamp(18px, 1.6vw, 21px);
	font-weight: 600;
	letter-spacing: -0.01em;
	text-transform: none;
}

.kg-partner__event {
	margin: 8px 2px 0;
	color: var(--wp--preset--color--ink-muted);
	font-size: 13px;
	line-height: 1.45;
}

@media (min-width: 480px) {
	.kg-partner__event {
		text-align: center;
	}
}

/* ---------- Katalog partnerów (podstrona /wspolpraca/partnerzy/) ----------
   Mobile first: wiersz zaczyna się jako karta w jednej kolumnie — logo i nazwa
   obok siebie, reszta pod spodem. Od 640 px logo odchodzi w stałą kolumnę
   z lewej, a od 1200 px katalog rozkłada się na dwie kolumny wierszy, żeby
   szeroki ekran nie był pasem pustki po prawej. */

.kg-partner-directory__group + .kg-partner-directory__group {
	margin-top: clamp(36px, 5vw, 56px);
}

.kg-partner-directory__group > h2 {
	margin: 0 0 6px;
}

.kg-partner-directory__lead {
	margin: 0 0 20px;
	max-width: 62ch;
	color: var(--wp--preset--color--ink-muted);
	font-size: 17px;
	line-height: 1.6;
}

.kg-keyfigures--partners {
	grid-template-columns: 1fr;
	margin-bottom: clamp(32px, 4vw, 48px);
}

.kg-partner-rows {
	display: grid;
	gap: 16px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.kg-partner-row {
	display: grid;
	grid-template-columns: 72px 1fr;
	gap: 14px 16px;
	align-items: start;
	margin: 0;
	padding: 18px;
	border: 1px solid var(--wp--preset--color--border-warm);
	border-radius: var(--kg-radius-lg);
	background: var(--wp--preset--color--surface);
}

.kg-partner-row__logo {
	display: grid;
	place-items: center;
	width: 72px;
	height: 72px;
	padding: 8px;
	border: 1px solid var(--wp--preset--color--border-warm);
	border-radius: var(--kg-radius-md);
	background: var(--wp--preset--color--surface);
}

.kg-partner-row__img {
	max-width: 100%;
	max-height: 56px;
	width: auto;
	height: auto;
	object-fit: contain;
}

/* Bez logotypu zostaje inicjał — kwadrat nie może świecić pustką. */
.kg-partner-row__initials {
	color: var(--wp--preset--color--brand-strong);
	font-size: 26px;
	font-weight: 700;
	line-height: 1;
}

.kg-partner-row__body {
	min-width: 0;
}

.kg-partner-row__name {
	margin: 0;
	font-size: clamp(19px, 1.8vw, 22px);
	font-weight: 600;
	line-height: 1.25;
	letter-spacing: -0.01em;
}

.kg-partner-row__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin: 10px 0 0;
}

.kg-badge--standing {
	background: var(--wp--preset--color--brand-soft);
	color: var(--wp--preset--color--brand-deep);
}

.kg-partner-row__desc {
	margin-top: 12px;
	color: var(--wp--preset--color--ink-muted);
	font-size: 16px;
	line-height: 1.6;
}

.kg-partner-row__desc > :first-child { margin-top: 0; }
.kg-partner-row__desc > :last-child { margin-bottom: 0; }
.kg-partner-row__desc p { margin: 0 0 10px; }
.kg-partner-row__desc strong { color: var(--wp--preset--color--ink); }
.kg-partner-row__desc ul,
.kg-partner-row__desc ol { margin: 0 0 10px; padding-inline-start: 20px; }
.kg-partner-row__desc a { color: var(--wp--preset--color--brand-strong); font-weight: 600; }

.kg-partner-row__events {
	margin-top: 16px;
	padding-top: 14px;
	border-top: 1px solid var(--wp--preset--color--border-warm);
}

.kg-partner-row__events h4 {
	margin: 0 0 8px;
	color: var(--wp--preset--color--brand-strong);
	font-size: 13px;
	font-weight: 750;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.kg-partner-row__events ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.kg-partner-row__events li + li {
	margin-top: 8px;
	padding-top: 8px;
	border-top: 1px dashed var(--wp--preset--color--border-warm);
}

.kg-partner-row__events li span {
	display: block;
	color: var(--wp--preset--color--ink-muted);
	font-size: 14px;
}

.kg-partner-row__more {
	margin: 10px 0 0;
	color: var(--wp--preset--color--ink-muted);
	font-size: 14px;
}

.kg-partner-row .kg-action {
	margin-top: 16px;
}

@media (min-width: 640px) {
	.kg-keyfigures--partners {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.kg-partner-row {
		grid-template-columns: 108px 1fr;
		gap: 18px 24px;
		padding: 24px;
	}

	.kg-partner-row__logo {
		width: 108px;
		height: 108px;
	}

	.kg-partner-row__img {
		max-height: 84px;
	}

	/* Nazwa i odznaki w jednym rzędzie, gdy jest na to miejsce. */
	.kg-partner-row__meta {
		margin-top: 8px;
	}
}

@media (min-width: 1200px) {
	/* Element siatki i tak rozciąga się przez `align-items: stretch`.
	   `height: 100%` liczone od wiersza siatki rozdymało kartę o kilkadziesiąt
	   pikseli — ten sam błąd naprawialiśmy już w `.kg-content-card`. */
	.kg-partner-rows {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 20px;
	}
}

@media (forced-colors: active) {
	.kg-partner-row,
	.kg-partner-row__logo {
		border: 1px solid CanvasText;
	}
}

/* ---------- Karta partnera z opisem działalności ----------
   Mobile first i bez JavaScriptu: kafelek z opisem to `<details>`, więc dotyk
   albo Enter rozwija kartę w miejscu — „najechanie” na telefonie nie istnieje,
   więc nie może być jedyną drogą do treści. Od 768 px karta zamienia się
   w dymek nad sąsiadami, a skrypt otwiera ją po najechaniu myszą. */

/* Ramka należy do całej karty, nie do samego nagłówka — inaczej rozwinięty
   opis wypada wizualnie poza kafelek. */
.kg-partner__card {
	position: relative;
	height: 100%;
	border: 1px solid var(--wp--preset--color--border-warm);
	border-radius: var(--kg-radius-lg);
	background: var(--wp--preset--color--surface);
}

.kg-partner--has-card .kg-partner__link {
	border: 0;
	background: none;
}

.kg-partner__card:focus-within,
.kg-partner__card[open] {
	border-color: var(--wp--preset--color--brand);
}

.kg-partner__card[open] .kg-partner__name {
	color: var(--wp--preset--color--brand-strong);
}

/* Na ekranie dotykowym `:hover` potrafi zostać po stuknięciu i kafelek świeci
   się bez powodu, dlatego stan hover trzymamy tylko dla prawdziwego wskaźnika. */
@media (hover: hover) {
	.kg-partner__card:hover {
		border-color: var(--wp--preset--color--brand);
	}

	.kg-partner__card:hover .kg-partner__name {
		color: var(--wp--preset--color--brand-strong);
	}
}

/* Bez tego przeglądarki dorysowują własny trójkącik przed treścią. */
.kg-partner__card > summary {
	list-style: none;
	cursor: pointer;
}

.kg-partner__card > summary::-webkit-details-marker {
	display: none;
}

.kg-partner__card > summary:focus-visible {
	outline: 3px solid var(--wp--preset--color--brand-strong);
	outline-offset: 2px;
}

/* Logo jako link: ten sam kadr co wcześniej, tylko z reakcją na wskaźnik.
   `.kg-partner-row__logo--link` i `.kg-partner__logo--link` mają `display`
   ustawiony wyżej przy wersji nielinkowej, więc dokładamy tu tylko stany. */
.kg-partner__logo--link,
.kg-partner-row__logo--link {
	cursor: pointer;
	transition: border-color 0.15s ease, transform 0.15s ease;
}

.kg-partner-row__logo--link {
	text-decoration: none;
}

@media (hover: hover) {
	.kg-partner__logo--link:hover .kg-partner__img,
	.kg-partner-row__logo--link:hover .kg-partner-row__img {
		transform: scale(1.03);
	}

	.kg-partner-row__logo--link:hover {
		border-color: var(--wp--preset--color--brand);
	}
}

@media (prefers-reduced-motion: reduce) {
	.kg-partner__logo--link,
	.kg-partner-row__logo--link,
	.kg-partner__img,
	.kg-partner-row__img {
		transition: none;
	}

	.kg-partner__logo--link:hover .kg-partner__img,
	.kg-partner-row__logo--link:hover .kg-partner-row__img {
		transform: none;
	}
}

.kg-partner__img,
.kg-partner-row__img {
	transition: transform 0.15s ease;
}

.kg-partner__hint {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	margin-inline-start: auto;
	color: var(--wp--preset--color--brand-strong);
	font-size: 13px;
	font-weight: 700;
	white-space: nowrap;
}

.kg-partner__chevron {
	width: 16px;
	height: 16px;
	transition: transform 0.18s ease;
}

.kg-partner__card[open] .kg-partner__chevron {
	transform: rotate(180deg);
}

.kg-partner__panel {
	padding: 14px 16px 16px;
	border-top: 1px solid var(--wp--preset--color--border-warm);
	text-align: start;
}

/* Opis jest teraz HTML-em z edytora: akapity, pogrubienia, linki i listy.
   Reguły trzymają go w ryzach karty — bez własnych marginesów z motywu. */
.kg-partner__desc {
	margin: 0 0 12px;
	color: var(--wp--preset--color--ink-muted);
	font-size: 15px;
	font-weight: 400;
	line-height: 1.55;
	text-wrap: pretty;
}

.kg-partner__desc > :first-child {
	margin-top: 0;
}

.kg-partner__desc > :last-child {
	margin-bottom: 0;
}

.kg-partner__desc p {
	margin: 0 0 8px;
}

.kg-partner__desc strong,
.kg-partner__desc b {
	color: var(--wp--preset--color--ink);
	font-weight: 700;
}

.kg-partner__desc ul,
.kg-partner__desc ol {
	margin: 0 0 8px;
	padding-inline-start: 20px;
}

.kg-partner__desc li + li {
	margin-top: 4px;
}

.kg-partner__desc a {
	color: var(--wp--preset--color--brand-strong);
	font-weight: 600;
}

.kg-partner__cta {
	font-size: 15px;
}

/* Na wąskim ekranie zostaje sama strzałka — nazwa firmy ma pierwszeństwo. */
@media (max-width: 399px) {
	.kg-partner__hint-text {
		position: absolute;
		width: 1px;
		height: 1px;
		margin: -1px;
		padding: 0;
		overflow: hidden;
		clip-path: inset(50%);
		white-space: nowrap;
	}
}

@media (min-width: 480px) {
	.kg-partner--has-card .kg-partner__link {
		align-items: center;
	}

	.kg-partner__hint {
		margin-inline-start: 0;
	}
}

@media (min-width: 768px) {
	/* Dymek nie rozpycha siatki — sąsiednie kafelki zostają na miejscu.
	   Domyślnie równa się z lewą krawędzią kafelka; gdy nie mieści się w oknie,
	   skrypt przesuwa go przez `--kg-panel-shift`, a dzióbek wraca na miejsce
	   przeciwnym przesunięciem. `overflow-x: clip` na liście jest siatką
	   bezpieczeństwa: nawet bez JavaScriptu nic nie wypchnie strony w bok. */
	.kg-partners__list {
		overflow-x: clip;
		overflow-y: visible;
	}

	.kg-partner--has-card .kg-partner__panel {
		position: absolute;
		inset-inline-start: 0;
		top: calc(100% + 10px);
		z-index: 20;
		box-sizing: border-box;
		width: min(320px, calc(100vw - 24px));
		margin-top: 0;
		padding: 16px 18px;
		border: 1px solid var(--wp--preset--color--border);
		border-radius: var(--kg-radius-lg);
		background: var(--wp--preset--color--surface);
		box-shadow: 0 18px 40px rgba(23, 33, 43, 0.16);
		transform: translateX(var(--kg-panel-shift, 0px));
	}

	.kg-partner--has-card .kg-partner__panel::before {
		content: "";
		position: absolute;
		top: -7px;
		inset-inline-start: 28px;
		width: 12px;
		height: 12px;
		border-top: 1px solid var(--wp--preset--color--border);
		border-inline-start: 1px solid var(--wp--preset--color--border);
		border-radius: 2px 0 0 0;
		background: var(--wp--preset--color--surface);
		transform: translateX(calc(-1 * var(--kg-panel-shift, 0px))) rotate(45deg);
	}
}

@media (prefers-reduced-motion: reduce) {
	.kg-partner__chevron {
		transition: none;
	}
}

@media (forced-colors: active) {
	.kg-partner__link {
		border: 1px solid CanvasText;
	}
}

/* -------------------------------------------------------------------------
 * 27. Aktualności jako tablica (wall)
 *
 * Układ jest bliźniaczy do archiwum wydarzeń (§ powyżej): pas nagłówka na pełną
 * szerokość okna, treść w kontenerze 1560 px, od 1024 px dwie kolumny 80/20.
 * Kolejność DOM jest ta sama w obu układach — kolumna pomocnicza schodzi pod
 * wyniki, nie przed nie (docs/05 §17).
 *
 * Sam strumień wpisów jest wąski (do 720 px), bo to kolumna czytelnicza:
 * docs/05 §7 wymaga 60–75 znaków w wierszu, a nie pełnej szerokości ekranu.
 * ---------------------------------------------------------------------- */

.kg-news__inner {
	box-sizing: border-box;
	max-width: 1560px;
	margin-inline: auto;
	padding-inline: clamp(16px, 3.5vw, 40px);
}

.kg-news__band {
	padding-block: clamp(22px, 4vw, 40px);
	border-bottom: 1px solid var(--wp--preset--color--border-warm);
	background: var(--wp--preset--color--surface-warm);
}

.kg-news__band .kg-breadcrumb { margin: 0 0 18px; }
.kg-news__intro { max-width: 60ch; }
.kg-news__intro h1 { margin: 0 0 12px; }
.kg-news__intro .kg-lead { margin: 0; }
.kg-news__body { padding-block: clamp(24px, 4vw, 40px) clamp(56px, 8vw, 104px); }

/* Pasek profilu. Zwykłe łącze, zero skryptów Meta — docs/10 §5.2 wprost
   przedkłada link nad osadzenie, dzięki czemu strona nie odpytuje Facebooka. */
.kg-news__profile {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 14px 18px;
	margin-top: clamp(20px, 3vw, 28px);
	padding: 16px 18px;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--kg-radius-lg);
	background: var(--wp--preset--color--surface);
}

.kg-news__profile-text { flex: 1 1 12ch; min-width: 0; }
.kg-news__profile-name { margin: 0; font-weight: 700; font-size: 17px; }

.kg-news__profile-descriptor {
	margin: 2px 0 0;
	color: var(--wp--preset--color--ink-muted);
	font-size: 15px;
}

.kg-news__profile-link {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-weight: 700;
}

.kg-avatar {
	flex: 0 0 auto;
	width: 48px;
	height: 48px;
	padding: 6px;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 50%;
	background: var(--wp--preset--color--surface);
	object-fit: contain;
}

.kg-avatar--post { width: 44px; height: 44px; }

.kg-news__toolbar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px 20px;
	margin-bottom: 16px;
}

.kg-news__toolbar .kg-filter { margin: 0; }
.kg-news__toolbar .kg-results { margin: 0; }
.kg-news__layout { display: grid; gap: 40px; }

/* Strumień wpisów. */
.kg-wall {
	display: grid;
	gap: 20px;
	max-width: 720px;
}

.kg-post {
	padding: 20px;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--kg-radius-lg);
	background: var(--wp--preset--color--surface);
	transition: border-color var(--kg-duration) ease, box-shadow var(--kg-duration) ease;
}

.kg-post:hover { border-color: var(--wp--preset--color--brand-soft); box-shadow: 0 14px 34px rgba(23, 33, 43, .09); }
.kg-post__head { display: flex; align-items: center; gap: 12px; }
.kg-post__by { min-width: 0; }
.kg-post__author { margin: 0; font-weight: 700; font-size: 16px; line-height: 1.3; }

.kg-post__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 4px 10px;
	margin: 3px 0 0;
	color: var(--wp--preset--color--ink-muted);
	font-size: 14px;
}

.kg-post__category { color: var(--wp--preset--color--brand-strong); font-weight: 750; }

/* Odznaka źródła ma etykietę tekstową, nie sam kolor (docs/05 §6.2). */
.kg-post__origin {
	padding: 1px 8px;
	border-radius: 999px;
	background: var(--wp--preset--color--brand-soft);
	color: var(--wp--preset--color--brand-strong);
	font-size: 13px;
	font-weight: 700;
}

.kg-post__title { margin: 14px 0 8px; font-size: clamp(20px, 2vw, 25px); line-height: 1.2; }
.kg-post__text { margin: 0; }
.kg-post__text p { margin: 0; }

/* Zwinięcie dokłada dopiero JavaScript — bez niego tekst jest w całości. */
.kg-post__text.is-collapsed {
	display: -webkit-box;
	overflow: hidden;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 7;
	line-clamp: 7;
}

.kg-post__more {
	margin-top: 8px;
	padding: 0;
	border: 0;
	background: none;
	color: var(--wp--preset--color--brand-strong);
	font: inherit;
	font-weight: 700;
	cursor: pointer;
}

.kg-post__more:hover { text-decoration: underline; }
.kg-post__media { margin-top: 16px; }
.kg-post__media .kg-poster { width: 100%; border-radius: var(--kg-radius-md); }

.kg-post__note {
	margin: 14px 0 0;
	padding: 10px 12px;
	border-radius: var(--kg-radius-md);
	background: var(--wp--preset--color--surface-alt);
	color: var(--wp--preset--color--ink-muted);
	font-size: 14px;
}

.kg-post__actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px 20px;
	margin-top: 16px;
	padding-top: 14px;
	border-top: 1px solid var(--wp--preset--color--border);
}

.kg-post__source { display: inline-flex; align-items: center; font-weight: 700; }

/* Kolumna pomocnicza. */
.kg-news__aside { display: grid; gap: 20px; align-content: start; }

.kg-news__categories,
.kg-news__aside-cta {
	padding: 18px;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--kg-radius-lg);
	background: var(--wp--preset--color--surface);
}

.kg-news__categories h3,
.kg-news__aside-cta h3 { margin: 0 0 12px; font-size: 16px; }
.kg-news__categories ul { margin: 0; padding: 0; list-style: none; }
.kg-news__categories li + li { margin-top: 2px; }

.kg-news__category-link {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	padding: 7px 10px;
	border-radius: var(--kg-radius-md);
	font-size: 15px;
}

.kg-news__category-link:hover { background: var(--wp--preset--color--surface-alt); }

.kg-news__category-link.is-active {
	background: var(--wp--preset--color--brand-soft);
	color: var(--wp--preset--color--brand-strong);
	font-weight: 700;
}

.kg-news__category-count { color: var(--wp--preset--color--ink-muted); font-size: 14px; }
.kg-news__category-link.is-active .kg-news__category-count { color: inherit; }

.kg-news__aside-cta {
	border-color: var(--wp--preset--color--border-warm);
	background: var(--wp--preset--color--surface-warm);
}

.kg-news__aside-cta p { margin: 0 0 14px; font-size: 15px; line-height: 1.5; }

@media (min-width: 1024px) {
	.kg-news__layout {
		grid-template-columns: minmax(0, 80fr) minmax(240px, 20fr);
		gap: clamp(28px, 2.6vw, 44px);
		align-items: start;
	}

	.kg-news__body { padding-top: clamp(28px, 3vw, 44px); }
}

@media (max-width: 1023px) {
	/* Kolumna pomocnicza schodzi pod wyniki, więc dostaje własny separator. */
	.kg-news__aside { padding-top: 32px; border-top: 1px solid var(--wp--preset--color--border); }
}

@media (max-width: 599px) {
	.kg-news__toolbar { flex-direction: column; align-items: stretch; }
	.kg-news__profile-link { width: 100%; }
	.kg-post { padding: 16px; }
	.kg-post__actions .kg-action { width: 100%; justify-content: center; }
}

/* Profile społecznościowe w stopce. Pojawiają się tylko wtedy, gdy adres jest
   wpisany w Ustawienia → Ustawienia serwisu. */
.kg-footer__social { margin-top: 14px; }
.kg-footer__social ul { display: flex; flex-wrap: wrap; gap: 8px 16px; margin: 0; padding: 0; list-style: none; }
.kg-footer__social a { display: inline-flex; align-items: center; font-weight: 700; }

/* -----------------------------------------------------------------------
 * 28. Strona „Projekty” — lista, szczegół, panel działania
 *
 * Układ jest bliźniaczy do sekcji 20 (wydarzenia) i 27 (aktualności): pas
 * nagłówka pełnej szerokości, kontener 1560 px i siatka 80/20 od 1024 px.
 * Kolejność DOM jest w obu układach ta sama — na telefonie kolumna
 * pomocnicza po prostu ląduje pod wynikami (docs/05 §17).
 * -------------------------------------------------------------------- */

.kg-projects__inner {
	box-sizing: border-box;
	max-width: 1560px;
	margin-inline: auto;
	padding-inline: clamp(16px, 3.5vw, 40px);
}

.kg-projects__band {
	padding-block: clamp(22px, 4vw, 40px);
	border-bottom: 1px solid var(--wp--preset--color--border-warm);
	background: var(--wp--preset--color--surface-warm);
}

.kg-projects__intro {
	max-width: 68ch;
	margin-bottom: 20px;
}

.kg-projects__intro h1 {
	margin: 0 0 12px;
}

.kg-projects__body {
	display: flex;
	flex-direction: column;
	gap: 20px;
	padding-block: clamp(24px, 4vw, 40px) clamp(56px, 8vw, 104px);
}

.kg-projects__toolbar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 12px 24px;
}

.kg-projects__layout {
	display: grid;
	gap: 40px;
}

.kg-projects__list {
	display: flex;
	flex-direction: column;
	gap: 16px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.kg-projects__aside {
	display: grid;
	gap: 20px;
	align-content: start;
}

.kg-projects__aside-cta {
	padding: 18px;
	border: 1px solid var(--wp--preset--color--border-warm);
	border-radius: var(--kg-radius-lg);
	background: var(--wp--preset--color--surface-warm);
}

.kg-projects__aside-cta h3 {
	margin: 0 0 12px;
	font-size: 16px;
}

.kg-projects__aside-cta p {
	margin: 0 0 14px;
	font-size: 15px;
	line-height: 1.5;
}

/* Pozycja rocznika pod kategorią nadrzędną — wcięcie, nie osobna lista. */
.kg-taglist__item--child {
	padding-left: 18px;
	font-size: 15px;
}

/* --- wiersz wyniku ---------------------------------------------------- */

.kg-project-row {
	display: flex;
	flex-direction: column;
	gap: 12px;
	padding: 20px;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--kg-radius-lg);
	background: var(--wp--preset--color--surface);
	transition: border-color var(--kg-duration) ease, box-shadow var(--kg-duration) ease;
}

.kg-project-row:hover {
	border-color: var(--wp--preset--color--brand-soft);
	box-shadow: 0 12px 30px rgba(23, 33, 43, .09);
}

.kg-project-row__body {
	display: flex;
	flex-direction: column;
	gap: 11px;
	min-width: 0;
}

.kg-project-row__tags {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
}

.kg-project-row__title {
	margin: 0;
	font-size: clamp(20px, 2vw, 24px);
	line-height: 1.2;
}

.kg-project-row__summary {
	margin: 0;
	max-width: 64ch;
	color: var(--wp--preset--color--ink-muted);
	font-size: 16px;
	line-height: 1.55;
}

.kg-project-row__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px 20px;
	margin: 0;
	color: var(--wp--preset--color--ink-muted);
	font-size: 15px;
}

/* Znacznik terminu jest TEKSTEM, nie drugim przyciskiem — karta ma mieć
   jedno działanie (docs/04 §11.1). */
.kg-project-row__mark,
.kg-project__mark {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	margin: 0;
	color: var(--wp--preset--color--brand-strong);
	font-size: 14px;
	font-weight: 700;
}

.kg-project-row__mark svg,
.kg-project__mark svg {
	flex: none;
}

.kg-project-row__progress {
	display: flex;
	flex-direction: column;
	gap: 7px;
	max-width: 340px;
}

.kg-project-row__step {
	font-weight: 600;
	color: var(--wp--preset--color--ink);
}

.kg-project-row__cta {
	min-height: 0;
}

.kg-project-row__media {
	--kg-poster-ratio: 3 / 2;
}

/* --- panel działania -------------------------------------------------- */

.kg-project-cta {
	display: flex;
	flex-direction: column;
	gap: 14px;
	margin: 24px 0;
	padding: 20px 18px;
	border: 2px solid var(--wp--preset--color--brand-strong);
	border-radius: var(--kg-radius-xl);
	background: var(--wp--preset--color--brand-faint);
}

.kg-project-cta h2 {
	margin: 0;
	font-size: clamp(22px, 2.4vw, 28px);
}

.kg-project-cta .kg-eyebrow {
	margin: 0;
}

.kg-project-cta__window {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	align-self: flex-start;
	margin: 0;
	padding: 6px 12px;
	border: 1px solid var(--wp--preset--color--brand-soft);
	border-radius: 999px;
	background: var(--wp--preset--color--surface);
	color: var(--wp--preset--color--brand-strong);
	font-size: 14px;
	font-weight: 700;
}

.kg-project-cta__window svg {
	flex: none;
}

.kg-project-cta__primary {
	align-self: stretch;
}

.kg-project-cta__note {
	margin: 0;
	max-width: 62ch;
	color: var(--wp--preset--color--ink-muted);
	font-size: 15px;
	line-height: 1.55;
}

.kg-project-cta__more {
	display: flex;
	flex-direction: column;
	gap: 2px;
	margin: 0;
	padding: 0;
	list-style: none;
}

/* Po zamknięciu terminu panel traci kolor działania, ale zostaje —
   mieszkaniec ma się dowiedzieć, co się stało (docs/05 §15). */
.kg-project-cta--closed {
	border-width: 1px;
	border-color: var(--wp--preset--color--border);
	background: var(--wp--preset--color--surface-alt);
}

.kg-project-cta--closed .kg-eyebrow {
	color: var(--wp--preset--color--ink-muted);
}

.kg-project-cta--closed .kg-project-cta__window {
	border-color: var(--wp--preset--color--border);
	color: var(--wp--preset--color--ink-muted);
}

.kg-project-cta--plain {
	border-width: 1px;
	border-color: var(--wp--preset--color--border-warm);
	background: var(--wp--preset--color--surface-warm);
}

/* Pas zamykający idzie przez całą szerokość okna. */
.kg-project-cta--closing {
	--kg-link: #fff;
	--kg-link-hover: var(--wp--preset--color--brand-soft);
	--kg-link-hover-bg: rgba(0, 0, 0, .2);
	max-width: none;
	margin: clamp(48px, 7vw, 84px) 0 0;
	padding: clamp(32px, 5vw, 56px) clamp(16px, 3.5vw, 40px);
	border: 0;
	border-radius: 0;
	background: var(--wp--preset--color--brand-strong);
	color: var(--wp--preset--color--surface);
}

.kg-project-cta--closing h2 {
	color: var(--wp--preset--color--surface);
}

.kg-project-cta--closing .kg-project-cta__note {
	color: var(--wp--preset--color--on-brand);
}

.kg-project-cta--closing .kg-project-cta__window {
	border-color: rgba(255, 255, 255, .42);
	background: transparent;
	color: #fff;
}

/* --- udostępnianie w panelu ------------------------------------------- */

.kg-project-cta .kg-share {
	margin: 4px 0 0;
	padding: 16px 0 0;
	border: 0;
	border-top: 1px solid var(--wp--preset--color--brand-soft);
	border-radius: 0;
	background: transparent;
}

.kg-project-cta--closed .kg-share {
	border-top-color: var(--wp--preset--color--border);
}

.kg-project-cta--plain .kg-share {
	border-top-color: var(--wp--preset--color--border-warm);
}

.kg-share--on-brand {
	border-top-color: rgba(255, 255, 255, .32) !important;
}

.kg-share__prompt {
	margin: 0 0 12px;
	font-size: 17px;
	font-weight: 600;
	line-height: 1.35;
}

.kg-share__button--wide {
	grid-column: 1 / -1;
}

.kg-share__button--on-brand {
	border-color: #fff;
	background: transparent;
	color: #fff;
}

.kg-share__button--on-brand:hover {
	background: rgba(255, 255, 255, .14);
	color: #fff;
}

.kg-share__button[hidden] {
	display: none;
}

/* --- pas trwającego działania na liście ------------------------------- */

.kg-project-alert {
	display: grid;
	gap: 16px;
	padding: 20px;
	border: 2px solid var(--wp--preset--color--brand-strong);
	border-radius: var(--kg-radius-xl);
	background: var(--wp--preset--color--brand-faint);
}

.kg-project-alert__body {
	display: flex;
	flex-direction: column;
	gap: 8px;
	min-width: 0;
}

.kg-project-alert h2 {
	margin: 0;
	font-size: clamp(21px, 2.2vw, 28px);
}

.kg-project-alert p {
	margin: 0;
	max-width: 70ch;
	color: var(--wp--preset--color--ink-muted);
	font-size: 16px;
	line-height: 1.55;
}

/* --- historia zmian statusu ------------------------------------------- */

.kg-status-history {
	margin-top: 44px;
	padding: 26px 22px;
	border: 1px solid var(--wp--preset--color--border-warm);
	border-radius: var(--kg-radius-xl);
	background: var(--wp--preset--color--surface-warm);
}

.kg-status-history h2 {
	margin: 0 0 6px;
}

.kg-status-history__intro {
	margin: 0 0 20px;
	color: var(--wp--preset--color--ink-muted);
	font-size: 15px;
}

.kg-status-history ol {
	margin: 0;
	padding: 0;
	list-style: none;
}

.kg-status-history__item {
	position: relative;
	padding: 0 0 22px 30px;
	border-left: 2px solid var(--wp--preset--color--border-warm);
}

.kg-status-history__item:last-child {
	padding-bottom: 0;
	border-left-color: transparent;
}

.kg-status-history__item::before {
	content: "";
	position: absolute;
	top: 5px;
	left: -6px;
	width: 10px;
	height: 10px;
	border: 3px solid var(--wp--preset--color--surface-warm);
	border-radius: 50%;
	background: var(--wp--preset--color--ink-muted);
	box-shadow: 0 0 0 1px var(--wp--preset--color--border-warm);
}

.kg-status-history__date {
	margin: 0 0 4px;
	color: var(--wp--preset--color--ink-muted);
	font-size: 14px;
	font-weight: 700;
}

/* Kierunek zmiany niosą strzałka i przekreślenie, nie kolor (docs/08 §17). */
.kg-status-history__change {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	margin: 0;
	font-size: 17px;
	font-weight: 600;
}

.kg-status-history__change svg {
	flex: none;
}

.kg-status-history__from {
	color: var(--wp--preset--color--ink-muted);
	font-weight: 400;
	text-decoration: line-through;
	text-decoration-thickness: 1px;
}

.kg-status-history__note {
	margin: 5px 0 0;
	color: var(--wp--preset--color--ink-muted);
	font-size: 15px;
	line-height: 1.55;
}

.kg-status-history__foot {
	margin: 20px 0 0;
	padding-top: 14px;
	border-top: 1px solid var(--wp--preset--color--border-warm);
	color: var(--wp--preset--color--ink-muted);
	font-size: 14px;
}

/* --- kontener strony szczegółu ---------------------------------------- */

.kg-project-page__inner {
	box-sizing: border-box;
	max-width: 1120px;
	margin-inline: auto;
	padding-inline: clamp(16px, 3.5vw, 40px);
	padding-top: clamp(24px, 4vw, 44px);
}

.kg-project-detail__tags {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-bottom: 14px;
}

/* --- brakujące warianty odznaki statusu projektu ---------------------- */

.kg-badge--pomysl {
	--kg-badge-ink: var(--wp--preset--color--ink-muted);
	--kg-badge-bg: transparent;
}

.kg-badge--planowany {
	--kg-badge-ink: var(--wp--preset--color--brand-strong);
	--kg-badge-bg: var(--wp--preset--color--brand-faint);
}

.kg-badge--konsultowany {
	--kg-badge-ink: var(--wp--preset--color--brand-strong);
	--kg-badge-bg: var(--wp--preset--color--brand-soft);
}

.kg-badge--w-realizacji {
	--kg-badge-ink: var(--wp--preset--color--success);
	--kg-badge-bg: var(--wp--preset--color--success-soft);
}

/* --- układy szersze --------------------------------------------------- */

@media (min-width: 768px) {
	.kg-project-row {
		flex-direction: row;
		align-items: flex-start;
		gap: 22px;
		padding: 22px;
	}

	.kg-project-row__media {
		flex: none;
		width: 210px;
	}

	.kg-project-row--lead .kg-project-row__media {
		width: 300px;
	}

	.kg-project-row__body {
		flex: 1;
	}

	.kg-project-alert {
		grid-template-columns: minmax(0, 1fr) auto;
		align-items: center;
		gap: 32px;
		padding: 22px 26px;
	}

	.kg-project-cta {
		padding: 26px 28px;
	}

	.kg-project-cta__primary {
		align-self: flex-start;
	}
}

@media (min-width: 1024px) {
	.kg-projects__layout {
		grid-template-columns: minmax(0, 80fr) minmax(240px, 20fr);
		gap: clamp(28px, 2.6vw, 44px);
		align-items: start;
	}

	/* Panel działania na szerokim ekranie: treść i udostępnianie obok siebie,
	   żeby przycisk nie uciekał pod linię zgięcia. */
	.kg-project-cta--lead {
		display: grid;
		grid-template-columns: minmax(0, 54fr) minmax(0, 46fr);
		gap: 32px;
		align-items: start;
	}

	.kg-project-cta--lead > .kg-eyebrow,
	.kg-project-cta--lead > h2,
	.kg-project-cta--lead > .kg-project-cta__window,
	.kg-project-cta--lead > .kg-project-cta__primary,
	.kg-project-cta--lead > .kg-project-cta__note,
	.kg-project-cta--lead > .kg-project-cta__more,
	.kg-project-cta--lead > .kg-action {
		grid-column: 1;
	}

	.kg-project-cta--lead > .kg-share {
		grid-column: 2;
		grid-row: 1 / -1;
		margin: 0;
		padding: 0 0 0 32px;
		border-top: 0;
		border-left: 1px solid var(--wp--preset--color--brand-soft);
	}

	.kg-project-cta--closing {
		display: grid;
		grid-template-columns: minmax(0, 52fr) minmax(0, 48fr);
		gap: 64px;
		align-items: center;
	}

	.kg-project-cta--closing > .kg-share {
		grid-column: 2;
		grid-row: 1 / -1;
		margin: 0;
		padding: 0;
		border: 0;
	}
}

@media (max-width: 1023px) {
	.kg-projects__aside {
		padding-top: 32px;
		border-top: 1px solid var(--wp--preset--color--border);
	}

	.kg-project-cta--closing {
		padding-inline: clamp(16px, 3.5vw, 40px);
	}
}

@media (max-width: 767px) {
	.kg-status-history {
		margin-top: 32px;
		padding: 22px 18px;
	}

	.kg-project-cta {
		margin: 20px 0;
	}
}

/* --- galeria efektów projektu (docs/02 §16.3 pkt 14) ------------------- */

.kg-project-gallery {
	margin-top: 44px;
	padding-top: 32px;
	border-top: 1px solid var(--wp--preset--color--border);
}

.kg-project-gallery h2 {
	margin: 0 0 20px;
}

.kg-project-gallery__grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 20px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.kg-project-gallery figure {
	margin: 0;
}

.kg-project-gallery__image {
	display: block;
	width: 100%;
	height: auto;
	border-radius: var(--kg-radius-lg);
	background: var(--wp--preset--color--surface-alt);
}

.kg-project-gallery figcaption {
	margin-top: 8px;
	color: var(--wp--preset--color--ink-muted);
	font-size: 14px;
	line-height: 1.5;
}

@media (min-width: 600px) {
	.kg-project-gallery__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

/* --- dziennik aktualizacji projektu ----------------------------------- */

/*
 * Trzecia oś czasu szczegółu projektu: etapy (plan), historia statusu (fakt
 * systemowy) i to — relacja redakcji. Ma wyglądać inaczej niż historia
 * statusu, bo niesie zdania, a nie same przejścia między stanami: pełna
 * szerokość, wyraźniejszy nagłówek wpisu, wcięcie na oś czasu.
 */
.kg-project-updates {
	margin-top: 44px;
}

.kg-project-updates h2 {
	margin: 0 0 6px;
}

.kg-project-updates__intro {
	margin: 0 0 24px;
	max-width: 70ch;
	color: var(--wp--preset--color--ink-muted);
	font-size: 15px;
}

.kg-project-updates ol {
	margin: 0;
	padding: 0;
	list-style: none;
}

.kg-project-updates__item {
	position: relative;
	padding: 0 0 26px 30px;
	border-left: 2px solid var(--wp--preset--color--border-warm);
}

.kg-project-updates__item:last-child {
	padding-bottom: 0;
	border-left-color: transparent;
}

.kg-project-updates__item::before {
	content: "";
	position: absolute;
	top: 6px;
	left: -7px;
	width: 12px;
	height: 12px;
	border: 3px solid var(--wp--preset--color--surface);
	border-radius: 50%;
	background: var(--wp--preset--color--ink-muted);
	box-shadow: 0 0 0 1px var(--wp--preset--color--border-warm);
}

/* Najnowszy wpis dostaje pełny znacznik marki — kropka i słowo, nie sam kolor. */
.kg-project-updates__item--latest::before {
	background: var(--wp--preset--color--brand-strong);
}

.kg-project-updates__date {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	margin: 0 0 4px;
	color: var(--wp--preset--color--ink-muted);
	font-size: 14px;
	font-weight: 700;
}

.kg-project-updates__latest {
	padding: 2px 8px;
	border-radius: 999px;
	background: var(--wp--preset--color--brand-faint);
	color: var(--wp--preset--color--brand-strong);
	font-size: 12px;
	letter-spacing: .04em;
	text-transform: uppercase;
}

.kg-project-updates h3 {
	margin: 0 0 6px;
	font-size: clamp(18px, 1.8vw, 21px);
}

.kg-project-updates__body {
	max-width: 70ch;
}

.kg-project-updates__body p {
	margin: 0 0 10px;
	font-size: 16px;
	line-height: 1.6;
}

.kg-project-updates__body p:last-child {
	margin-bottom: 0;
}

.kg-project-updates .kg-action {
	margin-top: 10px;
}

/* Skrót z ramki „Stan projektu” do dziennika — cel dotykowy pełnej wysokości. */
.kg-facts__jump {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	font-size: 15px;
	font-weight: 600;
}

/* --- pytania mieszkańców ---------------------------------------------- */

/*
 * Para pytanie–odpowiedź, nie wątek komentarzy (ADR 0005). Układ ma to
 * pokazywać: cytat mieszkańca jest wcięty i odsunięty pionową linią,
 * odpowiedź stoi pod nim jako zwykła treść z podpisem redakcji.
 */
.kg-questions {
	margin-top: 44px;
	padding-top: 28px;
	border-top: 1px solid var(--wp--preset--color--border);
}

.kg-questions h2 {
	margin: 0 0 8px;
}

.kg-questions__intro,
.kg-questions__empty {
	margin: 0 0 16px;
	max-width: 70ch;
	color: var(--wp--preset--color--ink-muted);
	font-size: 15px;
	line-height: 1.55;
}

.kg-questions__list {
	margin: 0 0 32px;
	padding: 0;
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: 24px;
}

.kg-question {
	padding: 20px;
	border: 1px solid var(--wp--preset--color--border-warm);
	border-radius: var(--kg-radius-lg);
	background: var(--wp--preset--color--surface-warm);
}

.kg-question__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 8px;
	margin: 0 0 8px;
	color: var(--wp--preset--color--ink-muted);
	font-size: 14px;
}

.kg-question__author {
	color: var(--wp--preset--color--ink);
	font-weight: 700;
}

.kg-question__body {
	margin: 0;
	padding-left: 16px;
	border-left: 3px solid var(--wp--preset--color--border-warm);
	max-width: 70ch;
}

.kg-question__body p {
	margin: 0 0 8px;
	font-size: 17px;
	line-height: 1.6;
}

.kg-question__body p:last-child {
	margin-bottom: 0;
}

.kg-question__answer {
	margin-top: 16px;
	padding-top: 14px;
	border-top: 1px solid var(--wp--preset--color--border-warm);
	max-width: 70ch;
}

.kg-question__answer-label {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0 0 6px;
	color: var(--wp--preset--color--brand-strong);
	font-size: 14px;
	font-weight: 700;
}

.kg-question__answer p {
	margin: 0 0 10px;
	font-size: 16px;
	line-height: 1.6;
}

.kg-question__answer p:last-child {
	margin-bottom: 0;
}

/* --- formularz pytania ------------------------------------------------ */

.kg-questions__ask {
	padding: 22px;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--kg-radius-lg);
	background: var(--wp--preset--color--surface-alt);
}

.kg-questions__ask h3 {
	margin: 0 0 10px;
	font-size: clamp(19px, 1.9vw, 22px);
}

.kg-questions__gate,
.kg-questions__note {
	margin: 0 0 14px;
	max-width: 66ch;
	color: var(--wp--preset--color--ink-muted);
	font-size: 15px;
	line-height: 1.55;
}

.kg-questions__note {
	margin: 14px 0 0;
	font-size: 14px;
}

.kg-questions__form p {
	margin: 0 0 16px;
}

.kg-questions__form label {
	display: block;
	margin-bottom: 4px;
	font-weight: 700;
}

.kg-questions__form textarea,
.kg-questions__form input[type="text"] {
	box-sizing: border-box;
	width: 100%;
	min-height: 44px;
	padding: 10px 12px;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--kg-radius-sm);
	background: var(--wp--preset--color--surface);
	font: inherit;
	font-size: 16px; /* poniżej 16px iOS przybliża widok przy fokusie */
}

.kg-questions__help {
	display: block;
	margin-top: 4px;
	color: var(--wp--preset--color--ink-muted);
	font-size: 14px;
	line-height: 1.5;
}

.kg-questions__consent label {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	font-weight: 400;
	line-height: 1.55;
}

.kg-questions__consent input {
	flex: none;
	width: 22px;
	height: 22px;
	margin-top: 2px;
}

/* Pułapka na roboty. Nie `display: none` — część botów pomija ukryte pola. */
.kg-questions__trap {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.kg-questions__result {
	margin: 0 0 16px;
	padding: 12px 14px;
	border-radius: var(--kg-radius-sm);
	font-size: 15px;
	line-height: 1.55;
}

.kg-questions__result ul {
	margin: 6px 0 0;
	padding-left: 20px;
}

.kg-questions__result--ok {
	border: 1px solid var(--wp--preset--color--success);
	background: var(--wp--preset--color--success-soft);
}

.kg-questions__result--error {
	border: 1px solid var(--wp--preset--color--error);
	background: var(--wp--preset--color--error-soft);
}
