/* ==========================================================================
   Klima Plzeň – blog, reference, stránky, 404, hledání
   Vzhled podle předlohy z ostrého webu (7. 11. 2026). Body zlomu jako v zaklad.css.
   ========================================================================== */

/* ---------- Společné ---------- */
.kp-drobecky {
	margin-bottom: 16px;
	font-size: 16px;
	color: var(--kp-n500);
}
.kp-drobecky a {
	color: var(--kp-nadpis);
	font-weight: 600;
	text-decoration: underline;
	text-underline-offset: 3px;
}
.kp-drobecky a:hover { color: var(--kp-cervena); }
.kp-drobecky__oddelovac { margin-inline: 4px; }
.kp-prazdno { font-size: 20px; }

/* ---------- Úvodní pás (šedý) ---------- */
.kp-blog-uvod {
	padding-block: 72px 64px;
	background: var(--kp-n100);
}
.kp-blog-uvod__nadpis { margin-bottom: 20px; }
.kp-blog-uvod__text {
	max-width: 760px;
	font-size: 18px;
	color: var(--kp-text);
}
.kp-blog-uvod__text p:last-child { margin-bottom: 0; }

/* ---------- Přehled článků – karty ---------- */
.kp-blog-prehled { padding-block: 80px 64px; }
.kp-karty {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 20px;
}
.kp-karta {
	display: flex;
	background: var(--kp-bila);
	box-shadow: var(--kp-stin);
	transition: box-shadow var(--kp-prechod);
}
.kp-karta:hover { box-shadow: 0 0 30px 0 #0000002e; }
.kp-karta__odkaz {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	padding: 32px 24px 28px;
	color: var(--kp-nadpis);
}
.kp-karta__odkaz:hover { color: var(--kp-nadpis); }
.kp-karta__datum {
	display: block;
	margin-bottom: 12px;
	font-size: 16px;
	color: var(--kp-cervena);
}
.kp-karta__nadpis {
	margin-bottom: 24px;
	font-size: 20px;
	font-weight: 500;
	line-height: 1.4;
}
/* Nadpis zčervená jen při najetí přímo na něj, ne kdekoli na kartě. */
.kp-karta__nadpis { width: fit-content; transition: color var(--kp-prechod); }
.kp-karta__nadpis:hover { color: var(--kp-cervena); }
.kp-karta__cta {
	/* Tlačítko s dostatečnou plochou pro dotyk, text zůstává jako v předloze. */
	display: inline-flex;
	align-items: center;
	align-self: flex-start;
	min-height: 44px;
	margin-top: auto;
	font-size: 18px;
	color: var(--kp-nadpis);
	text-decoration: underline;
	text-underline-offset: 3px;
	transition: color var(--kp-prechod);
}
.kp-karta__cta:hover { color: var(--kp-cervena); }

/* ---------- Stránkování ---------- */
.kp-blog-prehled .navigation.pagination { margin-top: 56px; }
.kp-blog-prehled .nav-links {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 8px;
}
.kp-blog-prehled .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 44px;
	min-height: 44px;
	padding: 0 12px;
	font-size: 18px;
	color: var(--kp-n800);
	border-radius: 999px;
}
.kp-blog-prehled .page-numbers:hover { color: var(--kp-cervena); }
.kp-blog-prehled .page-numbers.current { color: var(--kp-cervena); font-weight: 600; }
.kp-blog-prehled .screen-reader-text {
	position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap;
}

/* ---------- Hledání ---------- */
.search-form {
	display: flex;
	gap: 8px;
	max-width: 560px;
	margin-bottom: 48px;
}
.search-form .search-field {
	flex: 1 1 auto;
	min-width: 0;
	min-height: 48px;
	padding: 0 16px;
	border: 1px solid var(--kp-ramecek);
	border-radius: 999px;
	font: inherit;
	color: var(--kp-nadpis);
	background: var(--kp-bila);
}
.search-form .search-submit {
	min-height: 48px;
	padding: 0 24px;
	border: 0;
	border-radius: 999px;
	font: inherit;
	font-weight: 500;
	text-transform: uppercase;
	color: var(--kp-bila);
	background: var(--kp-cervena);
	cursor: pointer;
}
.search-form .search-submit:hover { background: var(--kp-cervena-hover); }

/* ---------- Detail článku ---------- */
.kp-clanek__uvod {
	padding-block: 64px 0;
	background: var(--kp-n50);
}
.kp-clanek__karta {
	max-width: 880px;
	margin-inline: auto;
	padding: 48px 56px 56px;
	background: var(--kp-bila);
	box-shadow: var(--kp-stin);
}
.kp-clanek__karta .kp-drobecky { margin-bottom: 24px; }
.kp-clanek__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 24px;
	margin-bottom: 16px;
	font-size: 16px;
	color: var(--kp-n600);
}
.kp-clanek__nadpis {
	margin-bottom: 40px;
	font-size: var(--kp-h2);
}
.kp-clanek__dalsi {
	padding-block: 80px 96px;
	background: var(--kp-n50);
}
.kp-clanek__dalsi .kp-nadtitulek { color: var(--kp-n600); }

/* ---------- Obecná stránka (ochrana údajů apod.) ---------- */
.kp-stranka-obecna__text { max-width: 880px; margin-inline: auto; }

/* ---------- Reference: detail ---------- */
.kp-reference__hlavni { padding-block: 56px 80px; }
.kp-reference__zpet {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 44px;
	margin-bottom: 40px;
	font-size: 18px;
	color: var(--kp-nadpis);
	text-decoration: underline;
	text-underline-offset: 3px;
}
.kp-reference__zpet:hover { color: var(--kp-cervena); }
.kp-reference__zpet-ikona { width: 24px; height: 24px; flex: 0 0 24px; }
.kp-reference__nadpis {
	margin-bottom: 24px;
	font-size: var(--kp-h3);
}
.kp-reference__popis { max-width: 760px; margin-bottom: 40px; }

/* Galerie: první obrázek přes celou šířku, ostatní ve dvou až třech sloupcích. */
.kp-galerie {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 16px;
}
.kp-galerie__polozka { margin: 0; }
.kp-galerie__polozka img {
	width: 100%;
	height: auto;
	object-fit: cover;
}
.kp-galerie__polozka--hlavni {
	grid-column: 1 / -1;
}
.kp-galerie__polozka--hlavni img {
	aspect-ratio: 2.2 / 1;
}
.kp-galerie__polozka:not(.kp-galerie__polozka--hlavni) img {
	aspect-ratio: 1 / 1;
}

/* Další realizace */
.kp-reference__dalsi {
	padding-block: 80px 96px;
	background: var(--kp-n50);
}
.kp-reference__dalsi .kp-nadtitulek { color: var(--kp-n600); }
.kp-ref-karty {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 24px;
}
.kp-ref-karta {
	position: relative;
	display: block;
	overflow: hidden;
	color: var(--kp-bila);
}
.kp-ref-karta__obrazek { display: block; }
.kp-ref-karta__obrazek img {
	width: 100%;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	transition: transform 400ms ease;
}
.kp-ref-karta:hover { color: var(--kp-bila); }
.kp-ref-karta:hover .kp-ref-karta__obrazek img { transform: scale(1.03); }
.kp-ref-karta__sipka {
	position: absolute;
	top: 16px;
	right: 16px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	border-radius: 999px;
	background: #0a0e1280;
	color: var(--kp-bila);
}
.kp-ref-karta__sipka svg { width: 24px; height: 24px; }
.kp-ref-karta:hover .kp-ref-karta__sipka { background: var(--kp-cervena); }

/* ---------- 404 ---------- */
.kp-chyba {
	padding-block: 120px 140px;
	text-align: center;
}
.kp-chyba__vnitrek {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 16px;
}
.kp-chyba__kod {
	margin: 0;
	font-size: 96px;
	font-weight: 700;
	line-height: 1;
	color: var(--kp-cervena);
}
.kp-chyba__nadpis { font-size: var(--kp-h2); }
.kp-chyba__text { margin-bottom: 16px; font-size: 20px; }

/* ---------- Mobil: karty do jednoho sloupce, bez vodorovného posuvníku ---------- */
@media (max-width: 1023px) {
	.kp-karty { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.kp-ref-karty { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.kp-ref-karty .kp-ref-karta:last-child:nth-child(odd) { grid-column: 1 / -1; }
	.kp-clanek__karta { padding: 40px 40px 48px; }
}
@media (max-width: 767px) {
	.kp-blog-uvod { padding-block: 48px 48px; }
	.kp-blog-prehled { padding-block: 48px 40px; }
	.kp-blog-uvod__text { font-size: 17px; }
	.kp-karty { grid-template-columns: minmax(0, 1fr); gap: 16px; }
	.kp-karta__odkaz { padding: 24px 20px 20px; }
	.kp-karta__nadpis { font-size: 19px; margin-bottom: 16px; }
	.kp-clanek__uvod { padding-top: 32px; }
	.kp-clanek__karta { padding: 28px 20px 36px; }
	.kp-clanek__dalsi { padding-block: 56px 64px; }
	.kp-galerie { grid-template-columns: minmax(0, 1fr); gap: 12px; }
	.kp-galerie__polozka--hlavni img { aspect-ratio: 4 / 3; }
	.kp-galerie__polozka:not(.kp-galerie__polozka--hlavni) img { aspect-ratio: 4 / 3; }
	.kp-ref-karty { grid-template-columns: minmax(0, 1fr); gap: 16px; }
	.kp-ref-karty .kp-ref-karta:last-child:nth-child(odd) { grid-column: auto; }
	.kp-ref-karta__obrazek img { aspect-ratio: 4 / 3; }
	.kp-reference__hlavni { padding-block: 32px 56px; }
	.kp-reference__zpet { margin-bottom: 24px; font-size: 17px; }
	.kp-reference__dalsi { padding-block: 56px 64px; }
	.search-form { flex-direction: column; }
	.search-form .search-submit { min-height: 48px; }
	.kp-chyba { padding-block: 72px 88px; }
	.kp-chyba__kod { font-size: 72px; }
	.kp-chyba__text { font-size: 18px; }
}

/* Ikony u data a autora (jako v originálu) */
.kp-clanek__meta-polozka { display: inline-flex; align-items: center; gap: 6px; }
.kp-clanek__meta-polozka .kp-ikona { width: 16px; height: 16px; color: var(--kp-cervena); flex: 0 0 16px; }

/* Výzva k poptávce na konci článku */
.kp-clanek__vyzva { margin-top: 48px; padding: 32px; background: var(--kp-n50); border-left: 4px solid var(--kp-cervena); }
.kp-clanek__vyzva-nadpis { margin-bottom: 8px; font-size: var(--kp-h5, 22px); font-weight: 600; color: var(--kp-nadpis); line-height: 1.25; }
.kp-clanek__vyzva .kp-akce { margin-top: 20px; display: flex; flex-wrap: wrap; gap: 12px; }
@media (max-width: 767px) {
	.kp-clanek__vyzva { padding: 24px 16px; }
	.kp-clanek__vyzva .kp-akce { flex-direction: column; }
	.kp-clanek__vyzva .kp-btn { width: 100%; justify-content: center; }
}
