/* ==========================================================================
   PLIK GŁÓWNY CSS — jedyny plik ze stylami w całym motywie.

   Koncepcja: "transkrypt z zakreśleniami". Strona wygląda jak starannie
   złożony zapis rozmowy: pytania mówią jednym głosem (bezszeryfowy,
   śliwkowy), odpowiedzi drugim (szeryfowy, atramentowy). Jedyny mocny
   akcent to żółte zakreślenie — tak dziennikarz zaznacza w notatkach
   zdanie, które musi trafić do tekstu. Zakreślenie pojawia się tylko
   tam, gdzie jest cytat; reszta strony jest spokojna.

   Sekcje:
   1. Font          2. Zmienne        3. Baza
   4. Układ         5. Nagłówek i mega menu
   6. Stopka        7. Elementy wspólne (przyciski, zakreślenie, formularze)
   8. Listy (rozmowy, rozmówcy, kategorie)
   9. Strona główna 10. Wywiad        11. Rozmówca
   12. Podstrony i kontakt            13. Druk
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. FONT — Literata (SIL OFL), hostowany lokalnie, jeden plik zmiennej
   grubości na zestaw znaków. Polskie litery są w "latin-ext".
   -------------------------------------------------------------------------- */
@font-face {
	font-family: "Literata";
	font-style: normal;
	font-weight: 200 900;
	font-display: swap;
	src: url("../fonts/literata-latin-ext-wght-normal.woff2") format("woff2");
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
	font-family: "Literata";
	font-style: normal;
	font-weight: 200 900;
	font-display: swap;
	src: url("../fonts/literata-latin-wght-normal.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Zastępczy Georgia dopasowany metrykami do Literaty — mniejszy skok
   układu (CLS), zanim właściwy font się wczyta. */
@font-face {
	font-family: "Literata zastepcza";
	src: local("Georgia");
	size-adjust: 104%;
	ascent-override: 92%;
	descent-override: 24%;
	line-gap-override: 0%;
}

/* --------------------------------------------------------------------------
   2. ZMIENNE
   -------------------------------------------------------------------------- */
:root {
	/* Kolory */
	--kolor-papier: #f6f7f4;      /* tło: chłodny, jasny papier */
	--kolor-papier-2: #eceee9;    /* tło paneli */
	--kolor-atrament: #1e2a3b;    /* tekst: granatowy atrament */
	--kolor-grafit: #566072;      /* tekst pomocniczy */
	--kolor-sliwka: #7a2b57;      /* głos pytającego, linki */
	--kolor-zakreslacz: #ffe45e;  /* zakreślenie cytatów */
	--kolor-linia: #d7dbe0;       /* linie podziału */
	--kolor-sukces: #1f6b45;
	--kolor-blad: #a3262e;

	/* Typografia */
	--font-szeryf: "Literata", "Literata zastepcza", Georgia, serif;
	--font-bez: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

	/* Skala typograficzna (stosunek ~1.25) */
	--rozmiar-xs: 0.8125rem;
	--rozmiar-s: 0.9375rem;
	--rozmiar-m: 1.125rem;   /* tekst czytany */
	--rozmiar-l: 1.375rem;
	--rozmiar-xl: clamp(1.5rem, 1.2rem + 1.2vw, 2rem);
	--rozmiar-2xl: clamp(2rem, 1.4rem + 2.6vw, 3.25rem);
	--rozmiar-3xl: clamp(2.25rem, 1.3rem + 4.2vw, 4.5rem);

	/* Odstępy */
	--odstep-1: 0.25rem;
	--odstep-2: 0.5rem;
	--odstep-3: 0.75rem;
	--odstep-4: 1rem;
	--odstep-5: 1.5rem;
	--odstep-6: 2rem;
	--odstep-7: 3rem;
	--odstep-8: 4.5rem;

	/* Szerokości */
	--szerokosc-strony: 76rem;
	--szerokosc-czytania: 42rem;
	--margines: clamp(1rem, 4vw, 2.5rem);

	--promien: 6px;
}

/* --------------------------------------------------------------------------
   3. BAZA
   -------------------------------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }

html {
	-webkit-text-size-adjust: 100%;
	text-size-adjust: 100%;
	/* Przyklejony nagłówek (ok. 4.5rem) nie może zasłaniać celów kotwic. */
	scroll-padding-top: calc(4.5rem + var(--odstep-5));
}

body {
	margin: 0;
	font-family: var(--font-szeryf);
	font-size: var(--rozmiar-m);
	line-height: 1.7;
	color: var(--kolor-atrament);
	background: var(--kolor-papier);
	font-optical-sizing: auto;
	text-rendering: optimizeLegibility;
}

img, video, svg { max-width: 100%; height: auto; display: block; }
audio { width: 100%; display: block; }

h1, h2, h3, h4 {
	margin: 0;
	line-height: 1.15;
	font-weight: 600;
	text-wrap: balance;
}

p { margin: 0 0 var(--odstep-4); }
p:last-child { margin-bottom: 0; }

a {
	color: var(--kolor-sliwka);
	text-decoration-thickness: 1px;
	text-underline-offset: 0.18em;
}
a:hover { text-decoration-thickness: 2px; }

:focus-visible {
	outline: 3px solid var(--kolor-sliwka);
	outline-offset: 3px;
	border-radius: 2px;
}

::selection { background: var(--kolor-zakreslacz); color: var(--kolor-atrament); }

.screen-reader-text,
.szukaj-etykieta--ukryta {
	position: absolute !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	white-space: nowrap;
}

.przejdz-do-tresci {
	position: absolute;
	left: var(--odstep-4);
	top: -10rem;
	z-index: 100;
	padding: var(--odstep-3) var(--odstep-4);
	background: var(--kolor-atrament);
	color: var(--kolor-papier);
	font-family: var(--font-bez);
	font-size: var(--rozmiar-s);
}
.przejdz-do-tresci:focus { top: var(--odstep-4); }

@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;
	}
}

/* --------------------------------------------------------------------------
   4. UKŁAD
   -------------------------------------------------------------------------- */
.tresc {
	max-width: var(--szerokosc-strony);
	margin-inline: auto;
	padding: var(--odstep-6) var(--margines) var(--odstep-8);
}

/* Długie teksty trzymają się wąskiej kolumny czytania. */
.tresc--wywiad > .wywiad > *,
.tresc--wywiad > .sekcja,
.tresc--strona > .strona > *,
.tresc--rozmowca .rozmowca-bio {
	max-width: var(--szerokosc-czytania);
	margin-inline: auto;
}

.sekcja {
	margin-top: var(--odstep-8);
}

.sekcja-naglowek {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: var(--odstep-2) var(--odstep-5);
	margin-bottom: var(--odstep-5);
}

.sekcja-tytul {
	font-size: var(--rozmiar-xl);
	margin-bottom: var(--odstep-5);
}
.sekcja-naglowek .sekcja-tytul { margin-bottom: 0; }

.sekcja-wiecej {
	font-family: var(--font-bez);
	font-size: var(--rozmiar-s);
	font-weight: 600;
}

.pusto {
	font-size: var(--rozmiar-m);
	color: var(--kolor-grafit);
}

/* --------------------------------------------------------------------------
   5. NAGŁÓWEK I MEGA MENU
   -------------------------------------------------------------------------- */
.naglowek-strony {
	border-bottom: 1px solid var(--kolor-linia);
	background: var(--kolor-papier);
	font-family: var(--font-bez);
	/* Przyklejony u góry na telefonie i komputerze. */
	position: sticky;
	top: 0;
	z-index: 20;
}
/* Zalogowany: pod paskiem admina (na wąskich ekranach pasek nie jest przyklejony). */
.admin-bar .naglowek-strony { top: var(--wp-admin--admin-bar--height, 32px); }
@media (max-width: 600px) {
	.admin-bar .naglowek-strony { top: 0; }
}
/* Otwarte menu na telefonie przewija się w obrębie ekranu. */
.naglowek-strony--otwarte {
	max-height: 100vh;
	max-height: 100dvh;
	overflow-y: auto;
	overscroll-behavior: contain;
}

.naglowek-strony-wnetrze {
	max-width: var(--szerokosc-strony);
	margin-inline: auto;
	padding: var(--odstep-4) var(--margines);
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--odstep-4);
}

.naglowek-strony-logo { margin: 0; margin-right: auto; }

/* Logo: znak słowny wywiady365.pl jako SVG (proporcje 6:1). */
.logo {
	display: inline-block;
	line-height: 0;
	text-decoration: none;
}
.logo-znak {
	display: block;
	width: auto;
	height: 2.25rem;
}
.custom-logo { max-height: 2.75rem; width: auto; }

.naglowek-strony-przelacznik {
	display: none;
	align-items: center;
	gap: var(--odstep-2);
	min-height: 44px;
	padding: var(--odstep-2) var(--odstep-3);
	font: 600 var(--rozmiar-s) / 1 var(--font-bez);
	color: var(--kolor-atrament);
	background: transparent;
	border: 1px solid var(--kolor-linia);
	border-radius: var(--promien);
	cursor: pointer;
}

.js .naglowek-strony-przelacznik { display: inline-flex; }

.naglowek-strony-przelacznik-ikona,
.naglowek-strony-przelacznik-ikona::before,
.naglowek-strony-przelacznik-ikona::after {
	display: block;
	width: 1.125rem;
	height: 2px;
	background: currentColor;
	transition: transform 0.2s ease;
}
.naglowek-strony-przelacznik-ikona { position: relative; }
.naglowek-strony-przelacznik-ikona::before,
.naglowek-strony-przelacznik-ikona::after {
	content: "";
	position: absolute;
	left: 0;
}
.naglowek-strony-przelacznik-ikona::before { top: -6px; }
.naglowek-strony-przelacznik-ikona::after { top: 6px; }

.naglowek-strony--otwarte .naglowek-strony-przelacznik-ikona { background: transparent; }
.naglowek-strony--otwarte .naglowek-strony-przelacznik-ikona::before { transform: translateY(6px) rotate(45deg); }
.naglowek-strony--otwarte .naglowek-strony-przelacznik-ikona::after { transform: translateY(-6px) rotate(-45deg); }

/* Telefon: menu i szukajka schowane pod przełącznikiem. Klasa .js
   (dodawana w <head>) sprawia, że bez JavaScriptu menu jest po prostu
   widoczne, a przełącznik ukryty. */
.naglowek-strony-nawigacja {
	flex-basis: 100%;
	padding-block: var(--odstep-4) var(--odstep-2);
}
.js .naglowek-strony-nawigacja { display: none; }
.js .naglowek-strony--otwarte .naglowek-strony-nawigacja { display: block; }

.mega-menu-lista-glowna,
.mega-menu-lista,
.mega-menu-podlista {
	list-style: none;
	margin: 0;
	padding: 0;
}

.mega-menu-link {
	display: flex;
	align-items: center;
	gap: var(--odstep-2);
	min-height: 44px;
	padding: var(--odstep-2) 0;
	font-weight: 600;
	font-size: var(--rozmiar-m);
	color: var(--kolor-atrament);
	text-decoration: none;
}
.mega-menu-link:hover { color: var(--kolor-sliwka); }

.mega-menu-item--ma-panel > .mega-menu-link::after {
	content: "";
	width: 0.45em;
	height: 0.45em;
	margin-left: var(--odstep-1);
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: translateY(-0.15em) rotate(45deg);
	transition: transform 0.2s ease;
}
.mega-menu-item--otwarte > .mega-menu-link::after { transform: translateY(0.1em) rotate(-135deg); }

.mega-menu-ikona { width: 20px; height: 20px; }

.mega-menu-panel {
	display: none;
	padding: var(--odstep-2) 0 var(--odstep-4) var(--odstep-4);
	border-left: 2px solid var(--kolor-zakreslacz);
}
.mega-menu-item--otwarte > .mega-menu-panel { display: block; }

.mega-menu-podpozycja-link {
	display: block;
	padding: var(--odstep-2) 0;
	color: var(--kolor-atrament);
	text-decoration: none;
}
.mega-menu-podpozycja-tytul { display: block; font-weight: 600; }
.mega-menu-podpozycja-link:hover .mega-menu-podpozycja-tytul { color: var(--kolor-sliwka); text-decoration: underline; }

.mega-menu-opis {
	display: block;
	font-size: var(--rozmiar-s);
	line-height: 1.45;
	color: var(--kolor-grafit);
}

.mega-menu-wyroznione {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(9rem, 1fr));
	gap: var(--odstep-4);
	margin-top: var(--odstep-4);
}

.mega-menu-wyroznione-link {
	display: grid;
	gap: var(--odstep-2);
	font-family: var(--font-szeryf);
	font-size: var(--rozmiar-s);
	line-height: 1.35;
	color: var(--kolor-atrament);
	text-decoration: none;
}
.mega-menu-wyroznione-link img {
	aspect-ratio: 3 / 2;
	object-fit: cover;
	border-radius: var(--promien);
}
.mega-menu-wyroznione-link:hover span { text-decoration: underline; }

/* Szukajka w nagłówku */
.szukaj { font-family: var(--font-bez); }

.szukaj-etykieta {
	display: block;
	margin-bottom: var(--odstep-2);
	font-size: var(--rozmiar-s);
	font-weight: 600;
}
.szukaj--naglowek .szukaj-etykieta {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip-path: inset(50%);
}

.szukaj--naglowek,
.szukaj-wiersz {
	display: flex;
	gap: var(--odstep-2);
}
.szukaj--naglowek { margin-top: var(--odstep-4); }

.szukaj-pole {
	flex: 1;
	min-width: 0;
	min-height: 44px;
	padding: var(--odstep-2) var(--odstep-3);
	font: inherit;
	font-size: 1rem;
	color: var(--kolor-atrament);
	background: #fff;
	border: 1px solid #9aa3b0;
	border-radius: var(--promien);
}

.szukaj-przycisk {
	min-height: 44px;
	padding: var(--odstep-2) var(--odstep-4);
	font: 600 var(--rozmiar-s) / 1 var(--font-bez);
	color: var(--kolor-papier);
	background: var(--kolor-atrament);
	border: 0;
	border-radius: var(--promien);
	cursor: pointer;
}
.szukaj-przycisk:hover { background: var(--kolor-sliwka); }

/* Komputer: menu w jednej linii, panel rozwija się pod nagłówkiem. */
@media (min-width: 64em) {
	.naglowek-strony-wnetrze { flex-wrap: nowrap; gap: var(--odstep-6); padding-block: 0; }
	.js .naglowek-strony-przelacznik { display: none; }

	.naglowek-strony-nawigacja,
	.js .naglowek-strony-nawigacja {
		display: flex;
		align-items: center;
		gap: var(--odstep-5);
		flex-basis: auto;
		padding: 0;
	}

	.mega-menu-lista-glowna { display: flex; gap: var(--odstep-5); }
	/* Link wypełnia całą wysokość paska — kursor przechodzi z linku
	   prosto na panel, bez "dziury", w której panel by znikał. */
	.mega-menu-link { font-size: var(--rozmiar-s); min-height: 4.5rem; }

	.mega-menu-item { position: static; }

	.mega-menu-panel {
		position: absolute;
		left: 0;
		right: 0;
		top: 100%;
		padding: var(--odstep-6) max(var(--margines), calc((100% - var(--szerokosc-strony)) / 2 + var(--margines)));
		background: var(--kolor-papier);
		border-left: 0;
		border-top: 1px solid var(--kolor-linia);
		border-bottom: 3px solid var(--kolor-zakreslacz);
		box-shadow: 0 1.5rem 2rem -1.5rem rgba(30, 42, 59, 0.35);
	}

	.mega-menu-item--ma-panel:hover > .mega-menu-panel,
	.mega-menu-item--ma-panel:focus-within > .mega-menu-panel { display: grid; }
	.mega-menu-item--otwarte > .mega-menu-panel { display: grid; }

	.mega-menu-panel {
		grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr);
		gap: var(--odstep-6);
	}

	.mega-menu-lista {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: var(--odstep-2) var(--odstep-5);
		align-content: start;
	}

	.mega-menu-wyroznione { margin-top: 0; grid-template-columns: repeat(3, minmax(0, 1fr)); }

	.szukaj--naglowek { margin-top: 0; }
	.szukaj--naglowek .szukaj-pole { width: 13rem; flex: none; }
}

/* --------------------------------------------------------------------------
   6. STOPKA
   -------------------------------------------------------------------------- */
.stopka-strony {
	background: var(--kolor-atrament);
	color: #dfe3ea;
	font-family: var(--font-bez);
	font-size: var(--rozmiar-s);
}
.stopka-strony a { color: #fff; }
.stopka-strony a:hover { color: var(--kolor-zakreslacz); }
.stopka-strony :focus-visible { outline-color: var(--kolor-zakreslacz); }

.stopka-strony-wnetrze {
	max-width: var(--szerokosc-strony);
	margin-inline: auto;
	padding: var(--odstep-7) var(--margines) var(--odstep-5);
}

.stopka-strony-gora {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--odstep-6) var(--odstep-5);
	margin-bottom: var(--odstep-6);
}
.stopka-strony-marka { grid-column: 1 / -1; }
.stopka-strony .logo-znak { height: 2.25rem; }
.stopka-strony-logo { margin: 0 0 var(--odstep-3); }
.stopka-strony-opis {
	max-width: 20rem;
	margin: 0;
	font-family: var(--font-szeryf);
	font-size: var(--rozmiar-m);
	line-height: 1.5;
	color: #d7dbe0;
}

.stopka-strony-naglowek,
.stopka-strony-etykieta {
	margin: 0;
	font-size: var(--rozmiar-xs);
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #aeb6c3;
}
.stopka-strony-naglowek { margin-bottom: var(--odstep-2); }

.stopka-strony-lista {
	list-style: none;
	margin: 0;
	padding: 0;
}
.stopka-strony-lista a,
.stopka-strony-kontakt a {
	display: inline-flex;
	align-items: center;
	min-height: 2.75rem;
}
.stopka-strony-kontakt {
	display: grid;
	justify-items: start;
	font-style: normal;
}
.stopka-strony-kontakt a { gap: var(--odstep-2); text-decoration: none; }
.stopka-strony-kontakt svg { flex: none; color: var(--kolor-zakreslacz); }

.stopka-strony-pas {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--odstep-5) var(--odstep-6);
	padding-block: var(--odstep-5);
	border-block: 1px solid #3a4658;
}
.stopka-strony-wydawca {
	display: flex;
	align-items: center;
	gap: var(--odstep-4);
	text-decoration: none;
}
.stopka-strony-wydawca-znak {
	flex: none;
	width: 64px;
	height: 64px;
	border-radius: 50%;
}
.stopka-strony-wydawca-opis {
	display: grid;
	gap: 2px;
	line-height: 1.3;
	color: #d7dbe0;
}
.stopka-strony-wydawca-nazwa {
	font-size: var(--rozmiar-m);
	font-weight: 700;
	color: #fff;
}
.stopka-strony-wydawca:hover .stopka-strony-wydawca-nazwa { color: var(--kolor-zakreslacz); }

.stopka-strony-serwisy {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--odstep-3) var(--odstep-4);
}
.stopka-strony-serwisy ul {
	display: flex;
	flex-wrap: wrap;
	gap: var(--odstep-3);
	margin: 0;
	padding: 0;
	list-style: none;
}
.stopka-strony-serwis {
	box-sizing: border-box;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 9.5rem;
	height: 3rem;
	padding: 0.5rem 0.875rem;
	background: var(--kolor-papier);
	border-radius: 8px;
}
.stopka-strony-serwis img {
	display: block;
	max-width: 100%;
	max-height: 100%;
	width: auto;
	height: auto;
}
.stopka-strony-serwis:hover { box-shadow: 0 0 0 2px var(--kolor-zakreslacz); }

.stopka-strony-prawa {
	margin: 0;
	padding-top: var(--odstep-4);
	font-size: var(--rozmiar-xs);
	color: #aeb6c3;
}

@media (min-width: 60em) {
	.stopka-strony-gora { grid-template-columns: 1.5fr 1fr 1fr 1.2fr; gap: var(--odstep-6); }
	.stopka-strony-marka { grid-column: auto; }
	.stopka-strony-lista a,
	.stopka-strony-kontakt a { min-height: 2.25rem; }
}

/* --------------------------------------------------------------------------
   7. ELEMENTY WSPÓLNE
   -------------------------------------------------------------------------- */

/* Zakreślenie — znak rozpoznawczy strony. Nieregularny pasek pod
   dolną częścią liter, łamie się razem z wierszami tekstu. */
.zakreslenie {
	background-image: linear-gradient(
		100deg,
		rgba(255, 228, 94, 0) 0.2em,
		var(--kolor-zakreslacz) 0.45em,
		#ffe96f 55%,
		var(--kolor-zakreslacz) calc(100% - 0.5em),
		rgba(255, 228, 94, 0) calc(100% - 0.15em)
	);
	background-repeat: no-repeat;
	background-size: 100% 0.68em;
	background-position: 0 92%;
	-webkit-box-decoration-break: clone;
	box-decoration-break: clone;
	padding-inline: 0.2em;
	margin-inline: -0.2em;
}

.przycisk {
	display: inline-flex;
	align-items: center;
	min-height: 48px;
	padding: var(--odstep-3) var(--odstep-5);
	font: 600 1rem / 1.2 var(--font-bez);
	color: var(--kolor-papier);
	background: var(--kolor-atrament);
	border: 0;
	border-radius: var(--promien);
	text-decoration: none;
	cursor: pointer;
}
.przycisk:hover { background: var(--kolor-sliwka); text-decoration: none; }

.okruszki {
	margin-bottom: var(--odstep-5);
	font-family: var(--font-bez);
	font-size: var(--rozmiar-xs);
	color: var(--kolor-grafit);
}
.okruszki p { margin: 0; }
.okruszki a { color: var(--kolor-grafit); }
.okruszki .separator { margin-inline: var(--odstep-1); }

.paginacja {
	margin-top: var(--odstep-7);
	font-family: var(--font-bez);
}
.paginacja .nav-links {
	display: flex;
	flex-wrap: wrap;
	gap: var(--odstep-2);
}
.paginacja .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 44px;
	min-height: 44px;
	padding: 0 var(--odstep-3);
	border: 1px solid var(--kolor-linia);
	border-radius: var(--promien);
	color: var(--kolor-atrament);
	text-decoration: none;
}
.paginacja .page-numbers.current {
	background: var(--kolor-atrament);
	border-color: var(--kolor-atrament);
	color: var(--kolor-papier);
}
.paginacja a.page-numbers:hover { border-color: var(--kolor-sliwka); color: var(--kolor-sliwka); }

/* Formularze */
.formularz {
	margin-top: var(--odstep-6);
	font-family: var(--font-bez);
	font-size: 1rem;
}

.formularz-pole { margin-bottom: var(--odstep-5); }

.formularz-pole label {
	display: block;
	margin-bottom: var(--odstep-2);
	font-weight: 600;
}

.formularz input[type="text"],
.formularz input[type="email"],
.formularz select,
.formularz textarea {
	width: 100%;
	min-height: 48px;
	padding: var(--odstep-3);
	font: inherit;
	color: var(--kolor-atrament);
	background: #fff;
	border: 1px solid #9aa3b0;
	border-radius: var(--promien);
}
.formularz textarea { resize: vertical; line-height: 1.5; }

.formularz-zgoda {
	display: flex;
	gap: var(--odstep-3);
	align-items: flex-start;
	margin-bottom: var(--odstep-5);
	font-size: var(--rozmiar-s);
	line-height: 1.5;
}
.formularz-zgoda input {
	flex: none;
	width: 1.25rem;
	height: 1.25rem;
	margin-top: 0.1rem;
	accent-color: var(--kolor-sliwka);
}

.formularz-pulapka {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.formularz-komunikat {
	padding: var(--odstep-4);
	margin-bottom: var(--odstep-5);
	border-left: 4px solid currentColor;
	background: #fff;
	font-weight: 600;
}
.formularz-komunikat--sukces { color: var(--kolor-sukces); }
.formularz-komunikat--blad { color: var(--kolor-blad); }

/* --------------------------------------------------------------------------
   8. LISTY
   -------------------------------------------------------------------------- */
.naglowek-listy {
	max-width: var(--szerokosc-czytania);
	margin-bottom: var(--odstep-7);
}

.naglowek-listy-tytul {
	font-size: var(--rozmiar-2xl);
	letter-spacing: -0.02em;
	margin-bottom: var(--odstep-4);
}

.naglowek-listy-opis { color: var(--kolor-grafit); margin-bottom: var(--odstep-4); }

.naglowek-listy-liczba {
	font-family: var(--font-bez);
	font-size: var(--rozmiar-s);
	color: var(--kolor-grafit);
	margin-bottom: var(--odstep-5);
}

.naglowek-listy .szukaj { margin-top: var(--odstep-5); }

/* Lista rozmów — wiersze, nie kafelki: tytuł rozmowy prowadzi oko. */
.lista-rozmow { border-top: 1px solid var(--kolor-linia); }

.karta-wywiadu {
	position: relative;
	display: grid;
	gap: var(--odstep-4);
	padding-block: var(--odstep-5);
	border-bottom: 1px solid var(--kolor-linia);
}

.karta-wywiadu-zdjecie img {
	width: 100%;
	aspect-ratio: 3 / 2;
	object-fit: cover;
	border-radius: var(--promien);
}

.karta-wywiadu-tytul {
	font-size: var(--rozmiar-xl);
	letter-spacing: -0.01em;
	margin-bottom: var(--odstep-2);
}

.karta-wywiadu-link {
	color: var(--kolor-atrament);
	text-decoration: none;
}
/* Cały wiersz klikalny, bez zagnieżdżania linków. */
.karta-wywiadu-link::after {
	content: "";
	position: absolute;
	inset: 0;
}
.karta-wywiadu:hover .karta-wywiadu-link {
	text-decoration: underline;
	text-decoration-color: var(--kolor-zakreslacz);
	text-decoration-thickness: 0.3em;
	text-underline-offset: -0.05em;
	text-decoration-skip-ink: none;
}

.karta-wywiadu-rozmowca {
	font-family: var(--font-bez);
	font-size: 1rem;
	font-weight: 600;
	color: var(--kolor-sliwka);
	margin-bottom: var(--odstep-2);
}
.karta-wywiadu-stanowisko { font-weight: 400; color: var(--kolor-grafit); }

.karta-wywiadu-zajawka {
	font-size: 1rem;
	line-height: 1.6;
	color: var(--kolor-grafit);
	max-width: 40rem;
	margin-bottom: var(--odstep-3);
}

.karta-wywiadu-meta {
	display: flex;
	flex-wrap: wrap;
	gap: var(--odstep-1) var(--odstep-4);
	margin: 0;
	font-family: var(--font-bez);
	font-size: var(--rozmiar-xs);
	color: var(--kolor-grafit);
}

@media (min-width: 48em) {
	.karta-wywiadu--ze-zdjeciem {
		grid-template-columns: 12rem minmax(0, 1fr);
		gap: var(--odstep-6);
		align-items: start;
	}
}

/* Wyniki niebędące rozmową (rozmówcy, podstrony) */
.wynik {
	position: relative;
	padding-block: var(--odstep-5);
	border-bottom: 1px solid var(--kolor-linia);
}
.wynik-typ {
	font-family: var(--font-bez);
	font-size: var(--rozmiar-xs);
	font-weight: 600;
	color: var(--kolor-sliwka);
	margin-bottom: var(--odstep-1);
}
.wynik-tytul { font-size: var(--rozmiar-l); margin-bottom: var(--odstep-2); }
.wynik-tytul a { color: var(--kolor-atrament); text-decoration: none; }
.wynik-tytul a::after { content: ""; position: absolute; inset: 0; }
.wynik:hover .wynik-tytul a { text-decoration: underline; }
.wynik-opis { font-size: 1rem; color: var(--kolor-grafit); }

/* Rozmówcy */
.siatka-rozmowcow {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(10rem, 1fr));
	gap: var(--odstep-6) var(--odstep-5);
}

.karta-rozmowcy {
	position: relative;
	text-align: left;
}

.karta-rozmowcy-portret {
	width: 7rem;
	height: 7rem;
	margin-bottom: var(--odstep-3);
}
.karta-rozmowcy-portret img,
.karta-rozmowcy-inicjaly {
	width: 100%;
	height: 100%;
	border-radius: 50%;
	object-fit: cover;
	filter: grayscale(1) contrast(1.05);
	transition: filter 0.25s ease;
}
.karta-rozmowcy:hover .karta-rozmowcy-portret img { filter: none; }

.karta-rozmowcy-inicjaly {
	display: grid;
	place-items: center;
	background: var(--kolor-papier-2);
	font-size: var(--rozmiar-xl);
	font-weight: 600;
	color: var(--kolor-sliwka);
	filter: none;
}

.karta-rozmowcy-imie { font-size: var(--rozmiar-m); margin-bottom: var(--odstep-1); }
.karta-rozmowcy-link { color: var(--kolor-atrament); text-decoration: none; }
.karta-rozmowcy-link::after { content: ""; position: absolute; inset: 0; }
.karta-rozmowcy:hover .karta-rozmowcy-link { text-decoration: underline; }

.karta-rozmowcy-stanowisko,
.karta-rozmowcy-liczba {
	font-family: var(--font-bez);
	font-size: var(--rozmiar-xs);
	line-height: 1.45;
	color: var(--kolor-grafit);
	margin-bottom: var(--odstep-1);
}

/* Kategorie */
.lista-kategorii {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: var(--odstep-3);
}

.lista-kategorii-link {
	display: inline-flex;
	align-items: baseline;
	gap: var(--odstep-2);
	padding: var(--odstep-2) var(--odstep-4);
	font-size: var(--rozmiar-l);
	color: var(--kolor-atrament);
	background: #fff;
	border: 1px solid var(--kolor-linia);
	border-radius: 999px;
	text-decoration: none;
}
.lista-kategorii-link:hover { border-color: var(--kolor-sliwka); color: var(--kolor-sliwka); }

.lista-kategorii-liczba {
	font-family: var(--font-bez);
	font-size: var(--rozmiar-xs);
	color: var(--kolor-grafit);
}

.lista-kategorii--male .lista-kategorii-link {
	min-height: 40px;
	align-items: center;
	padding: var(--odstep-1) var(--odstep-3);
	font-family: var(--font-bez);
	font-size: var(--rozmiar-s);
}

/* --------------------------------------------------------------------------
   9. STRONA GŁÓWNA
   -------------------------------------------------------------------------- */
.otwarcie {
	padding-block: var(--odstep-5) var(--odstep-7);
	border-bottom: 1px solid var(--kolor-linia);
}

/* Nazwa strony + opis jako dyskretna "stopka redakcyjna" nad cytatem. */
.otwarcie-strona {
	display: flex;
	flex-wrap: wrap;
	gap: var(--odstep-1) var(--odstep-3);
	align-items: baseline;
	margin-bottom: var(--odstep-6);
	font-family: var(--font-bez);
	font-size: var(--rozmiar-s);
	font-weight: 600;
	color: var(--kolor-atrament);
}

.otwarcie-opis { font-weight: 400; color: var(--kolor-grafit); }

.otwarcie-cytat { margin: 0; }

.otwarcie-tresc {
	margin: 0 0 var(--odstep-6);
	max-width: 22ch;
	font-size: var(--rozmiar-3xl);
	font-weight: 500;
	line-height: 1.12;
	letter-spacing: -0.025em;
}

/* Cudzysłów otwierający wysunięty na margines — tekst zaczyna się w linii. */
.otwarcie-tresc p { text-indent: -0.42em; }
.otwarcie-tresc p::before { content: "„"; }
.otwarcie-tresc p::after { content: "”"; }

.otwarcie-podpis {
	display: grid;
	gap: var(--odstep-1);
	font-family: var(--font-bez);
	font-size: 1rem;
}
.otwarcie-kto { font-weight: 700; color: var(--kolor-sliwka); }
.otwarcie-stanowisko { color: var(--kolor-grafit); }
.otwarcie-zrodlo { font-style: normal; margin-top: var(--odstep-2); }
.otwarcie-zrodlo a { color: var(--kolor-atrament); }

.otwarcie-akcje {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--odstep-3) var(--odstep-4);
	margin-top: var(--odstep-6);
	font-family: var(--font-bez);
	font-size: var(--rozmiar-s);
	color: var(--kolor-grafit);
}

.otwarcie-pusto {
	font-size: var(--rozmiar-2xl);
	line-height: 1.2;
	max-width: 20ch;
}

@media (min-width: 64em) {
	/* Podpis obok końca cytatu, jak w szpalcie z wywiadem. */
	.otwarcie-cytat {
		display: grid;
		grid-template-columns: minmax(0, 1fr) 16rem;
		gap: var(--odstep-7);
		align-items: end;
	}
	.otwarcie-tresc { margin-bottom: 0; }
	.otwarcie-podpis {
		padding-left: var(--odstep-4);
		border-left: 2px solid var(--kolor-sliwka);
	}
}

.tresc-strony {
	max-width: var(--szerokosc-czytania);
	margin-top: var(--odstep-7);
}

/* --------------------------------------------------------------------------
   10. WYWIAD
   -------------------------------------------------------------------------- */
.wywiad-naglowek { padding-top: var(--odstep-4); }

.wywiad-kategorie {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: var(--odstep-2) var(--odstep-4);
	margin: 0 0 var(--odstep-4);
	padding: 0;
	font-family: var(--font-bez);
	font-size: var(--rozmiar-s);
	font-weight: 600;
}

.wywiad-tytul {
	font-size: var(--rozmiar-2xl);
	letter-spacing: -0.02em;
	margin-bottom: var(--odstep-5);
}

.wywiad-lead {
	font-size: var(--rozmiar-l);
	line-height: 1.55;
	margin-bottom: var(--odstep-5);
}

.wywiad-meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--odstep-4);
	padding-block: var(--odstep-4);
	border-block: 1px solid var(--kolor-linia);
	font-family: var(--font-bez);
	font-size: var(--rozmiar-s);
}

.wywiad-rozmowca {
	display: inline-flex;
	align-items: center;
	gap: var(--odstep-3);
	color: var(--kolor-atrament);
	text-decoration: none;
}
.wywiad-rozmowca-zdjecie {
	width: 48px;
	height: 48px;
	border-radius: 50%;
	object-fit: cover;
}
.wywiad-rozmowca-opis { display: grid; line-height: 1.35; }
.wywiad-rozmowca-imie { font-weight: 700; color: var(--kolor-sliwka); }
.wywiad-rozmowca:hover .wywiad-rozmowca-imie { text-decoration: underline; }
.wywiad-rozmowca-stanowisko { color: var(--kolor-grafit); }

/* Rozmówca + wywiadujący obok siebie */
.wywiad-osoby {
	display: flex;
	flex-wrap: wrap;
	gap: var(--odstep-3) var(--odstep-5);
}
.wywiad-wywiadujacy {
	display: inline-flex;
	align-items: center;
	gap: var(--odstep-3);
	color: var(--kolor-atrament);
	text-decoration: none;
}
.wywiad-wywiadujacy-zdjecie {
	width: 48px;
	height: 48px;
	border-radius: 50%;
	object-fit: cover;
}
.wywiad-wywiadujacy-opis { display: grid; line-height: 1.35; }
.wywiad-wywiadujacy-imie { font-weight: 700; color: var(--kolor-atrament); }
.wywiad-wywiadujacy:hover .wywiad-wywiadujacy-imie { text-decoration: underline; }
.wywiad-wywiadujacy-rola { color: var(--kolor-grafit); }

.wywiad-daty {
	display: flex;
	flex-direction: column;
	gap: 2px;
	margin: 0;
	line-height: 1.45;
	color: var(--kolor-grafit);
}
.wywiad-daty-linia--aktualizacja { color: var(--kolor-atrament); }
.wywiad-daty-etykieta {
	padding: 0 0.25em;
	font-weight: 600;
	background: var(--kolor-zakreslacz);
}

/* Nagłówek archiwum wywiadującego (/autor/…) */
.naglowek-autora {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--odstep-4) var(--odstep-5);
}
.naglowek-autora-zdjecie {
	width: 120px;
	height: 120px;
	border-radius: 50%;
	object-fit: cover;
	flex: none;
}
.naglowek-autora-opis { flex: 1 1 18rem; }
.naglowek-autora-opis .naglowek-listy-tytul { margin-bottom: var(--odstep-1); }
.naglowek-autora-rola {
	margin: 0;
	font-family: var(--font-bez);
	font-size: var(--rozmiar-s);
	font-weight: 600;
	color: var(--kolor-sliwka);
}
.naglowek-autora-bio { margin: var(--odstep-3) 0 0; max-width: var(--szerokosc-czytania); }
.naglowek-autora + .naglowek-listy-liczba { margin-top: var(--odstep-4); }

/* Udostępnij — <details> z panelem; na telefonie JS otwiera okno systemowe. */
.udostepnij {
	position: relative;
	margin-top: var(--odstep-4);
	font-family: var(--font-bez);
}
.udostepnij-przycisk {
	display: inline-flex;
	align-items: center;
	gap: var(--odstep-2);
	min-height: 44px;
	padding: 0 var(--odstep-4);
	font-size: var(--rozmiar-s);
	font-weight: 600;
	color: var(--kolor-atrament);
	background: #fff;
	border: 1px solid var(--kolor-linia);
	border-radius: 999px;
	cursor: pointer;
	list-style: none;
	user-select: none;
}
.udostepnij-przycisk::-webkit-details-marker { display: none; }

/* Pasek akcji wywiadu: Udostępnij · Drukuj · Pobierz PDF */
.wywiad-akcje {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	gap: var(--odstep-2);
	margin-top: var(--odstep-4);
}
.wywiad-akcje .udostepnij { margin-top: 0; }
a.udostepnij-przycisk { text-decoration: none; }
button.udostepnij-przycisk { font-family: inherit; }
.wywiad-akcje > .udostepnij-przycisk { font-family: var(--font-bez); }
.wywiad-akcje > .udostepnij-przycisk:hover { border-color: var(--kolor-atrament); }
.tylko-js { display: none; }
.js .wywiad-akcje > .tylko-js { display: inline-flex; }
.druk-zrodlo { display: none; }
.udostepnij-przycisk:hover,
.udostepnij[open] > .udostepnij-przycisk { border-color: var(--kolor-atrament); }

.udostepnij-panel {
	position: absolute;
	top: calc(100% + var(--odstep-2));
	left: 0;
	z-index: 20;
	width: min(21rem, calc(100vw - 2rem));
	padding: var(--odstep-2);
	background: #fff;
	border: 1px solid var(--kolor-linia);
	border-radius: 14px;
	box-shadow: 0 12px 32px rgb(30 42 59 / 16%);
}
.udostepnij-tytul {
	margin: 0;
	padding: var(--odstep-2) var(--odstep-3);
	font-size: var(--rozmiar-s);
	font-weight: 700;
}
.udostepnij-lista { list-style: none; margin: 0; padding: 0; }
.udostepnij-tylko-js { display: none; }
.js .udostepnij-tylko-js { display: block; }

.udostepnij-pozycja {
	display: flex;
	align-items: center;
	gap: var(--odstep-3);
	width: 100%;
	min-height: 48px;
	padding: 0 var(--odstep-3);
	font: inherit;
	font-size: var(--rozmiar-s);
	font-weight: 600;
	color: var(--kolor-atrament);
	text-align: left;
	text-decoration: none;
	background: none;
	border: 0;
	border-radius: 10px;
	cursor: pointer;
}
.udostepnij-pozycja:hover { background: var(--kolor-papier); }

.udostepnij-ikona {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: none;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	font-weight: 700;
	color: #fff;
	background: var(--kolor-atrament);
}
.udostepnij-ikona--jasna { color: var(--kolor-atrament); background: var(--kolor-zakreslacz); }
.udostepnij-ikona-ok,
.udostepnij-pozycja--gotowe .udostepnij-ikona-link { display: none; }
.udostepnij-pozycja--gotowe .udostepnij-ikona-ok { display: block; }

/* Okładka może być szersza niż kolumna czytania. */
.tresc--wywiad > .wywiad > .wywiad-okladka {
	max-width: none;
	margin: var(--odstep-6) 0 0;
}
.wywiad-okladka img {
	width: 100%;
	aspect-ratio: 16 / 9;
	object-fit: cover;
	border-radius: var(--promien);
}
.wywiad-okladka figcaption {
	max-width: var(--szerokosc-czytania);
	margin: var(--odstep-2) auto 0;
	font-family: var(--font-bez);
	font-size: var(--rozmiar-xs);
	color: var(--kolor-grafit);
}

/* Odsłuch + podsumowanie AI */
.wywiad-narzedzia {
	display: grid;
	gap: var(--odstep-5);
	margin-block: var(--odstep-6);
	padding: var(--odstep-5);
	background: var(--kolor-papier-2);
	border-radius: var(--promien);
	font-family: var(--font-bez);
}

.odsluch-tytul,
.podsumuj-tytul {
	font-family: var(--font-bez);
	font-size: var(--rozmiar-s);
	font-weight: 700;
	margin-bottom: var(--odstep-3);
}
.odsluch-czas { font-weight: 400; color: var(--kolor-grafit); }

.odsluch-odtwarzacz { height: 48px; }

.podsumuj-lista {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: var(--odstep-2);
}

.podsumuj-przycisk {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	padding: var(--odstep-2) var(--odstep-4);
	font-size: var(--rozmiar-s);
	font-weight: 600;
	color: var(--kolor-atrament);
	background: #fff;
	border: 1px solid var(--kolor-linia);
	border-radius: 999px;
	text-decoration: none;
}
.podsumuj-przycisk:hover { border-color: var(--kolor-sliwka); color: var(--kolor-sliwka); }

.podsumuj-info {
	margin: var(--odstep-3) 0 0;
	font-size: var(--rozmiar-s);
	color: var(--kolor-sukces);
}

/* Wstęp z edytora */
.wywiad-tresc > * + * { margin-top: var(--odstep-4); }
.wywiad-tresc > p:first-child::first-line { font-weight: 600; }

/* Treść pod rozmową: FAQ, źródła, zastrzeżenie */
.wywiad-tresc--po { margin-top: var(--odstep-8); }
.wywiad-tresc--po > p:first-child::first-line { font-weight: inherit; }
.wywiad-tresc--po h2 { font-size: var(--rozmiar-xl); }
.wywiad-tresc--po > * + * { margin-top: var(--odstep-6); }
.wywiad-faq > * + *, .wywiad-zrodla > * + * { margin-top: var(--odstep-4); }
.wywiad-faq h3 { margin-top: var(--odstep-5); font-family: var(--font-bez); font-size: var(--rozmiar-m); font-weight: 700; line-height: 1.4; color: var(--kolor-sliwka); }
.wywiad-faq h3 + p { margin-top: var(--odstep-2); }
.wywiad-zrodla ul { padding-left: var(--odstep-5); font-size: var(--rozmiar-s); line-height: 1.5; }
.wywiad-zrodla li + li { margin-top: var(--odstep-2); }
.wywiad-zastrzezenie { padding: var(--odstep-4); font-family: var(--font-bez); font-size: var(--rozmiar-s); color: var(--kolor-grafit); background: #fff; border-left: 3px solid var(--kolor-linia); }

/* Spis pytań */
.spis-pytan {
	margin-block: var(--odstep-6);
	font-family: var(--font-bez);
	font-size: var(--rozmiar-s);
	border-block: 1px solid var(--kolor-linia);
}

.spis-pytan-tytul {
	min-height: 44px;
	display: flex;
	align-items: center;
	font-weight: 700;
	cursor: pointer;
}

.spis-pytan-lista {
	margin: 0 0 var(--odstep-4);
	padding-left: var(--odstep-5);
	line-height: 1.5;
}
.spis-pytan-lista li + li { margin-top: var(--odstep-2); }
.spis-pytan-lista a { color: var(--kolor-atrament); }

/* Rozmowa: dwa głosy */
.rozmowa { margin-top: var(--odstep-6); }

.rozmowa-pytanie {
	margin: var(--odstep-7) 0 var(--odstep-4);
	font-family: var(--font-bez);
	font-size: var(--rozmiar-l);
	font-weight: 700;
	line-height: 1.35;
	color: var(--kolor-sliwka);
}
.rozmowa-pytanie:first-child { margin-top: 0; }

.rozmowa-odpowiedz > * + * { margin-top: var(--odstep-4); }
.rozmowa-odpowiedz p { margin-bottom: 0; }

/* Cytat wpleciony w rozmowę */
.cytat {
	margin: var(--odstep-7) 0;
	padding: 0;
}

.cytat-tresc {
	margin: 0;
	font-size: var(--rozmiar-xl);
	font-weight: 500;
	line-height: 1.35;
	letter-spacing: -0.01em;
}
.cytat-tresc p { text-indent: -0.42em; }
.cytat-tresc p::before { content: "„"; }
.cytat-tresc p::after { content: "”"; }

.cytat-autor {
	margin-top: var(--odstep-3);
	font-family: var(--font-bez);
	font-size: var(--rozmiar-s);
	font-weight: 600;
	color: var(--kolor-sliwka);
}

@media (min-width: 64em) {
	/* Na szerokim ekranie cytat wychodzi z kolumny w lewo. */
	.rozmowa .cytat { margin-left: -6rem; }
}

/* O rozmówcy */
.o-rozmowcy {
	display: grid;
	gap: var(--odstep-5);
	margin-top: var(--odstep-8);
	padding-top: var(--odstep-6);
	border-top: 3px solid var(--kolor-atrament);
}
.o-rozmowcy-portret img {
	width: 7rem;
	height: 7rem;
	border-radius: 50%;
	object-fit: cover;
}
.o-rozmowcy-tytul { font-size: var(--rozmiar-xl); margin-bottom: var(--odstep-3); }
.o-rozmowcy-bio { font-size: 1rem; color: var(--kolor-grafit); }
.o-rozmowcy-link {
	display: inline-block;
	margin-top: var(--odstep-3);
	font-family: var(--font-bez);
	font-size: var(--rozmiar-s);
	font-weight: 600;
}

@media (min-width: 40em) {
	.o-rozmowcy { grid-template-columns: 7rem minmax(0, 1fr); align-items: start; }
}

/* --------------------------------------------------------------------------
   11. ROZMÓWCA
   -------------------------------------------------------------------------- */
.rozmowca-naglowek {
	display: grid;
	gap: var(--odstep-5);
	align-items: end;
	padding-bottom: var(--odstep-6);
	margin-bottom: var(--odstep-6);
	border-bottom: 1px solid var(--kolor-linia);
}
.rozmowca-naglowek .okruszki { grid-column: 1 / -1; margin-bottom: 0; }

.rozmowca-portret img {
	width: 12rem;
	height: 12rem;
	border-radius: 50%;
	object-fit: cover;
}

.rozmowca-imie {
	font-size: var(--rozmiar-3xl);
	letter-spacing: -0.03em;
	margin-bottom: var(--odstep-3);
}

.rozmowca-stanowisko {
	font-family: var(--font-bez);
	font-size: var(--rozmiar-m);
	color: var(--kolor-grafit);
	margin-bottom: var(--odstep-4);
}

.rozmowca-social {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: var(--odstep-2) var(--odstep-4);
	font-family: var(--font-bez);
	font-size: var(--rozmiar-s);
	font-weight: 600;
}

.rozmowca-lead { font-size: var(--rozmiar-l); line-height: 1.55; }
.rozmowca-bio > * + * { margin-top: var(--odstep-4); }

.tresc--rozmowca .sekcja { margin-top: var(--odstep-7); }

@media (min-width: 48em) {
	.rozmowca-naglowek { grid-template-columns: auto minmax(0, 1fr); gap: var(--odstep-6); }
	.rozmowca-naglowek:not(:has(.rozmowca-portret)) { grid-template-columns: 1fr; }
}

/* --------------------------------------------------------------------------
   12. PODSTRONY I KONTAKT (treść z edytora bloków)
   -------------------------------------------------------------------------- */
.strona-tytul {
	font-size: var(--rozmiar-2xl);
	letter-spacing: -0.02em;
	margin-bottom: var(--odstep-6);
}

.tresc-strony > * + * { margin-top: var(--odstep-4); }
.tresc-strony h2 { font-size: var(--rozmiar-xl); margin-top: var(--odstep-7); }
.tresc-strony h3 { font-size: var(--rozmiar-l); margin-top: var(--odstep-6); }
.tresc-strony ul,
.tresc-strony ol { padding-left: var(--odstep-5); }
.tresc-strony li + li { margin-top: var(--odstep-2); }
.tresc-strony img { border-radius: var(--promien); }
.tresc-strony .alignwide { max-width: var(--szerokosc-strony); }
.tresc-strony table { width: 100%; border-collapse: collapse; font-family: var(--font-bez); font-size: var(--rozmiar-s); }
.tresc-strony th,
.tresc-strony td { padding: var(--odstep-3); border-bottom: 1px solid var(--kolor-linia); text-align: left; }
.tresc-strony blockquote {
	margin-inline: 0;
	padding-left: var(--odstep-5);
	border-left: 3px solid var(--kolor-zakreslacz);
	font-size: var(--rozmiar-l);
}
.tresc-strony .wp-block-button__link {
	font-family: var(--font-bez);
	font-weight: 600;
	background: var(--kolor-atrament);
	color: var(--kolor-papier);
	border-radius: var(--promien);
}
.tresc-strony .wp-block-button__link:hover { background: var(--kolor-sliwka); }

/* --------------------------------------------------------------------------
   13. DRUK
   -------------------------------------------------------------------------- */
@media print {
	@page { size: A4; margin: 15mm 16mm 18mm; }
	.naglowek-strony-przelacznik,
	.naglowek-strony-nawigacja,
	.przejdz-do-tresci,
	.stopka-strony,
	.wywiad-narzedzia,
	.wywiad-akcje,
	.wywiad-okladka,
	.spis-pytan,
	.sekcja--podobne,
	.okruszki,
	#wpadminbar { display: none !important; }
	html { margin-top: 0 !important; }
	body { background: #fff; color: #000; font-size: 11pt; line-height: 1.45; }
	.naglowek-strony { position: static; background: none; border-bottom: 2px solid #000; box-shadow: none; }
	.naglowek-strony-wnetrze { padding: 0 0 3mm; }
	.zakreslenie { background: none; text-decoration: underline; }
	a { color: inherit; text-decoration: none; }
	.rozmowa-odpowiedz a[href^="http"]:not([href*="wywiady365.pl"])::after,
	.wywiad-tresc a[href^="http"]:not([href*="wywiady365.pl"])::after { content: " (" attr(href) ")"; font-size: .85em; color: #333; word-break: break-all; }
	h1, h2, h3, .rozmowa-pytanie, .o-rozmowcy-tytul { break-after: avoid; page-break-after: avoid; }
	figure, blockquote, .cytat, .o-rozmowcy, .wywiad-zastrzezenie { break-inside: avoid; page-break-inside: avoid; }
	p, li { orphans: 3; widows: 3; }
	.rozmowa .cytat { margin-left: 0; }
	.druk-zrodlo { display: block; margin: 8mm 0 0; padding-top: 3mm; border-top: 1px solid #000; font-size: 9pt; }
}

/* Mapa witryny */
.mapa-witryny { font-family: var(--font-bez); }
.mapa-witryny-spis {
	margin-block: var(--odstep-5);
	padding: var(--odstep-4);
	background: var(--kolor-papier-2);
	border-radius: var(--promien);
}
.mapa-witryny-spis ul {
	display: flex;
	flex-wrap: wrap;
	gap: var(--odstep-2) var(--odstep-4);
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: var(--rozmiar-s);
	font-weight: 600;
}
.mapa-witryny-spis li,
.mapa-witryny-spis li + li { margin: 0; }
.mapa-witryny-spis a { display: inline-block; padding-block: var(--odstep-2); }
.mapa-witryny-sekcja { margin-top: var(--odstep-6); scroll-margin-top: var(--odstep-5); }
.mapa-witryny-sekcja h2 {
	margin-bottom: var(--odstep-3);
	padding-bottom: var(--odstep-2);
	border-bottom: 1px solid var(--kolor-linia);
}
.mapa-witryny-wstep { margin: 0 0 var(--odstep-3); color: var(--kolor-grafit); }
.mapa-witryny-lista { margin: 0; padding-left: 1.25em; }
.mapa-witryny-lista li { margin-block: var(--odstep-2); line-height: 1.5; }
.mapa-witryny-lista .mapa-witryny-lista { margin-top: var(--odstep-1); }
.mapa-witryny-lista a { font-weight: 600; }
.mapa-witryny-opis { display: block; font-size: var(--rozmiar-s); color: var(--kolor-grafit); }
.mapa-witryny-notka { margin: var(--odstep-1) 0 0; font-size: var(--rozmiar-s); color: var(--kolor-grafit); }
