/* ==========================================================================
   Obsahové stránky v rámu e-shopu (N3, `eshop_front_obsah_v_layoutu`):
   stránky (VOP, GDPR, „o nás" …), hledání a kontakt platformy a blog.
   Šablony platformy (`platform/`, needitují se) nesou vlastní inline
   <style> s natvrdo zadanými barvami obecného webu; tenhle soubor se načítá
   PO nich a převádí je na tokeny rámu, takže platí oba směry (Půlnoc/Značka)
   i oba motivy. Blog má v rámu šablony vlastní (templates/Obsah/Blog). Selektory začínají `[data-smer]` — jen
   e-shopový layout ho má, v obecném layoutu se nic z toho neuplatní.
   ========================================================================== */

/* ----- Společný základ: pozadí rámu, žádné gradienty obecného webu ----- */
[data-smer] .vpage {
	min-height: 0;
	background: var(--c-pozadi);
	color: var(--c-text);
	font-family: var(--pismo-text);
}

[data-smer] .vpage-shell {
	max-width: var(--max-sirka);
	margin-inline: auto;
	padding: var(--k7) var(--okraj) var(--k8);
}

/* Nadpisy obsahu: písmo rámu, 500, bez „revue" prostrku obecného webu. */
[data-smer] :is(.vpage-title, .vpage-prose h2, .vpage-prose h3, .vpage-prose h4, .clanek-text h2, .clanek-text h3, .clanek-text h4) {
	color: var(--c-text);
	font-family: var(--pismo-display);
	font-weight: 500;
	letter-spacing: -.01em;
	line-height: 1.2;
}

/* ----- Drobečková navigace ----- */
[data-smer] .vpage-breadcrumbs {
	margin: 0 0 var(--k5);
	color: var(--c-text-tlumene);
	font-family: var(--pismo-text);
	font-size: 14px;
}

[data-smer] .vpage-breadcrumbs a {
	display: inline-flex;
	align-items: center;
	min-height: 32px;
	color: var(--c-text-tlumene);
	text-decoration: underline;
	text-decoration-color: var(--c-linka);
	text-underline-offset: 3px;
}

[data-smer] .vpage-breadcrumbs a:hover {
	color: var(--c-text);
	text-decoration-color: currentColor;
}

[data-smer] .vpage-breadcrumbs li:last-child {
	color: var(--c-text);
	font-weight: 400;
}

[data-smer] .vpage-breadcrumbs svg {
	color: var(--c-slabe);
}

/* ----- Čitelný text (stránky i článek) ----- */
[data-smer] :is(.vpage-prose, .clanek-text) {
	max-width: 700px;
	margin-inline: auto;
	color: var(--c-text);
	font-family: var(--pismo-text);
	font-size: clamp(17px, 1.2vw, 18px);
	line-height: 1.7;
	overflow-wrap: break-word;
}

[data-smer] :is(.vpage-prose, .clanek-text) :is(p, li) {
	color: var(--c-text);
	line-height: 1.7;
}

[data-smer] :is(.vpage-prose, .clanek-text) :is(p, ul, ol, blockquote, table) {
	margin: 0 0 1.1em;
}

[data-smer] :is(.vpage-prose, .clanek-text) h2 {
	margin: 2em 0 .6em;
	padding: 0;
	border: 0;
	font-size: var(--t-h3);
	font-size: clamp(22px, 2vw, 28px);
}

[data-smer] :is(.vpage-prose, .clanek-text) h3 {
	margin: 1.6em 0 .5em;
	font-size: clamp(19px, 1.5vw, 22px);
}

[data-smer] :is(.vpage-prose, .clanek-text) h4 {
	margin: 1.4em 0 .4em;
	font-size: 18px;
}

[data-smer] :is(.vpage-prose, .clanek-text) > :first-child {
	margin-top: 0;
}

[data-smer] :is(.vpage-prose, .clanek-text) :is(strong, b, li strong) {
	color: var(--c-text);
	font-size: inherit;
	font-weight: 600;
}

/* Odkazy: podtržené akcentem, rozpoznatelné i bez barvy (WCAG 1.4.1). */
[data-smer] :is(.vpage-prose, .clanek-text) a {
	color: var(--c-akcent-text);
	font-weight: inherit;
	text-decoration: underline;
	text-decoration-color: var(--c-akcent);
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
}

[data-smer] :is(.vpage-prose, .clanek-text) a:hover {
	text-decoration-thickness: 2px;
}

[data-smer] :is(.vpage-prose, .clanek-text) :is(ul, ol) {
	padding-left: 1.3em;
}

[data-smer] :is(.vpage-prose, .clanek-text) li + li {
	margin-top: .35em;
}

[data-smer] :is(.vpage-prose, .clanek-text) li::marker {
	color: var(--c-akcent-text);
}

[data-smer] :is(.vpage-prose, .clanek-text) img {
	display: block;
	max-width: 100%;
	height: auto;
	margin: 1.6em 0;
	border-radius: 10px;
	box-shadow: none;
}

[data-smer] :is(.vpage-prose, .clanek-text) blockquote {
	margin: 1.6em 0;
	padding: .2em 0 .2em 1.1em;
	border: 0;
	border-left: 2px solid var(--c-akcent);
	border-radius: 0;
	background: none;
	color: var(--c-text-tlumene);
	font-size: 1.05em;
	font-style: normal;
}

[data-smer] :is(.vpage-prose, .clanek-text) blockquote p {
	margin: 0;
	color: inherit;
}

/* Tabulky: na úzké obrazovce se posouvají samy, ne celá stránka. */
[data-smer] :is(.vpage-prose, .clanek-text) table {
	display: block;
	width: 100%;
	max-width: 100%;
	overflow-x: auto;
	border-collapse: collapse;
	font-size: 16px;
}

[data-smer] :is(.vpage-prose, .clanek-text) :is(th, td) {
	padding: 10px 14px;
	border-bottom: 1px solid var(--c-linka);
	color: var(--c-text);
	text-align: left;
	vertical-align: top;
}

[data-smer] :is(.vpage-prose, .clanek-text) th {
	background: var(--c-pozadi2);
	font-weight: 500;
}

[data-smer] :is(.vpage-prose, .clanek-text) hr {
	margin: 2em 0;
	border: 0;
	border-top: 1px solid var(--c-linka);
}

/* ----- Obsahová stránka (Page) ----- */
[data-smer] .vpage-shell {
	max-width: calc(700px + 2 * var(--okraj));
	padding-top: var(--k7);
}

[data-smer] .vpage-header {
	max-width: 700px;
	margin: 0 auto var(--k6);
	text-align: left;
}

/* Štítek „Informace" je natvrdo v šabloně platformy a nic neříká. */
[data-smer] .vpage-eyebrow {
	display: none;
}

[data-smer] .vpage-title {
	margin: 0;
	font-size: var(--t-h1);
}

[data-smer] .vpage-card {
	padding: 0;
	border-radius: 0;
	background: none;
	box-shadow: none;
}

/* ----- Blog: vlastní šablony e-shopu (templates/Obsah/Blog) -----
   Výpis i článek kreslí e-shopové šablony (EshopContentLayoutHook), ne
   šablony platformy — žádné přebíjení cizích stylů, jen tokeny rámu. */
.blog,
.clanek,
.clanek-dalsi {
	color: var(--c-text);
	font-family: var(--pismo-text);
}

.blog {
	padding-block: var(--stranka-nahore, var(--k7)) var(--k8);
}

/* Nadpisy blogu: písmo rámu, strop velikosti i pro revuální „Půlnoc". */
:where(.blog-uvod h1, .clanek-hlava h1, .blog-hlavni-nadpis, .blog-sekce-nadpis, .blog-karta-nadpis, .blog-prazdno h2) {
	margin: 0;
}

:is(.blog-uvod h1, .clanek-hlava h1, .blog-hlavni-nadpis, .blog-sekce-nadpis, .blog-karta-nadpis, .blog-prazdno h2) {
	color: var(--c-text);
	font-family: var(--pismo-display);
	font-weight: 500;
	letter-spacing: -.01em;
	line-height: 1.15;
	text-wrap: balance;
}

/* Hlavička výpisu: nadpis a úvod vlevo, hledání vpravo. */
.blog-hlava {
	display: grid;
	gap: var(--k5) var(--k7);
	align-items: end;
}

@media (min-width: 900px) {
	.blog-hlava {
		grid-template-columns: minmax(0, 1fr) minmax(300px, 420px);
	}
}

.blog-uvod h1 {
	font-size: min(var(--t-h1), 3.75rem);
}

/* Úvod může přijít z editoru (stránka `blog`) i s jeho třídami — tady platí
   jen prvky, ne cizí třídy. */
.blog-uvod > :not(h1) {
	max-width: 60ch;
	margin: var(--k3) 0 0;
	color: var(--c-text-tlumene);
	font-size: var(--t-lead);
	line-height: 1.6;
}

.blog-hledani-popisek {
	display: block;
	margin-bottom: var(--k2);
	color: var(--c-text-tlumene);
	font-size: var(--t-popisek);
	font-weight: 500;
}

.blog-hledani-radek {
	display: flex;
	gap: var(--k2);
}

.blog-hledani input {
	flex: 1;
	min-width: 0;
	min-height: 48px;
	padding: 0 var(--k5);
	border: 1px solid var(--c-linka);
	border-radius: var(--r-pilulka);
	background: var(--c-povrch);
	color: var(--c-text);
	font: inherit;
	font-size: 16px;
}

.blog-hledani input::placeholder {
	color: var(--c-slabe);
	opacity: 1;
}

.blog-hledani input:focus-visible {
	border-color: var(--c-akcent);
	outline: 2px solid var(--c-akcent);
	outline-offset: 1px;
}

.blog-hledani button {
	flex: none;
	min-height: 48px;
	padding: 0 var(--k5);
	border: 0;
	border-radius: var(--r-pilulka);
	background: var(--c-akcent);
	color: var(--c-na-akcentu);
	font: inherit;
	font-size: 15px;
	font-weight: 500;
	cursor: pointer;
}

.blog-hledani button:hover {
	background: color-mix(in srgb, var(--c-akcent) 86%, var(--c-text));
}

.blog-hledani button:focus-visible {
	outline: 2px solid var(--c-akcent);
	outline-offset: 2px;
}

/* Kategorie jako pilulky katalogu. */
.blog-kategorie {
	display: flex;
	flex-wrap: wrap;
	gap: var(--k2);
	margin-top: var(--k6);
}

.blog-kategorie a,
.clanek-kategorie a {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	padding-inline: var(--k4);
	border: 1px solid var(--c-linka);
	border-radius: var(--r-pilulka);
	background: var(--c-povrch);
	color: var(--c-text);
	font-size: var(--t-popisek);
}

.blog-kategorie a:hover,
.clanek-kategorie a:hover {
	border-color: var(--c-akcent);
	color: var(--c-akcent-text);
}

.blog-kategorie a[aria-current="page"] {
	border-color: var(--c-akcent);
	background: var(--c-akcent);
	color: var(--c-na-akcentu);
}

/* „Půlnoc" světlá: `--c-na-akcentu` = tmavý text, na vínovém akcentu jen
   2,6 : 1. Světlé pozadí motivu dává přes 7 : 1 (AA). */
[data-smer="pulnoc"][data-motiv="svetly"] :is(.blog-hledani button, .blog-kategorie a[aria-current="page"]) {
	color: var(--c-pozadi);
}

.blog-vysledky {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--k1) var(--k4);
	margin: var(--k6) 0 0;
	color: var(--c-text-tlumene);
}

.blog-vysledky strong {
	color: var(--c-text);
	font-weight: 500;
}

.blog-vysledky a {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
}

/* Odkaz uvnitř věty (WCAG 2.5.8 výjimka pro text) — řádek se nerozbíjí. */
.blog-vysledky a,
.blog-prazdno a {
	color: var(--c-akcent-text);
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* Metadata: datum a doba čtení. */
.blog-meta {
	display: flex;
	flex-wrap: wrap;
	gap: var(--k1) var(--k4);
	margin: 0;
	color: var(--c-text-tlumene);
	font-size: var(--t-popisek);
	font-variant-numeric: tabular-nums;
}

.blog-dal {
	display: inline-flex;
	align-items: center;
	gap: var(--k2);
	margin-top: auto;
	padding-top: var(--k2);
	color: var(--c-akcent-text);
	font-size: 15px;
	font-weight: 500;
}

.blog-sipka {
	transition: transform var(--cas-rychle) ease;
}

/* Zvýrazněný článek: fotka a text vedle sebe v kartě. */
.blog-hlavni {
	margin-top: var(--k7);
	overflow: hidden;
	border: 1px solid var(--c-linka);
	border-radius: var(--r-karta);
	background: var(--c-povrch);
}

.blog-hlavni-odkaz {
	display: grid;
	color: inherit;
	text-decoration: none;
}

@media (min-width: 900px) {
	.blog-hlavni-odkaz {
		grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr);
	}
}

.blog-hlavni-foto,
.blog-karta-foto,
.clanek-foto {
	position: relative;
	overflow: hidden;
	background: var(--c-pozadi2);
}

.blog-hlavni-foto {
	aspect-ratio: 16 / 10;
}

.blog-hlavni-foto img,
.blog-karta-foto img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center 30%;
	transition: transform var(--cas-normal) var(--pohyb);
}

.blog-hlavni-telo {
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: var(--k3);
	padding: var(--k5);
}

@media (min-width: 900px) {
	.blog-hlavni-foto {
		aspect-ratio: auto;
		min-height: 380px;
	}

	.blog-hlavni-telo {
		padding: var(--k7) var(--k6);
	}
}

.blog-hlavni-nadpis {
	font-size: min(var(--t-h2), 2.75rem);
}

.blog-hlavni-perex,
.blog-karta-perex {
	margin: 0;
	color: var(--c-text-tlumene);
	font-size: 16px;
	line-height: 1.6;
}

.blog-hlavni-perex {
	font-size: var(--t-zaklad);
}

.blog-hlavni .blog-dal {
	margin-top: var(--k2);
}

/* Fotka chybí: tónovaná plocha s názvem, žádný cizí štítek. */
.blog-bez-foto {
	display: flex;
	align-items: flex-end;
	width: 100%;
	height: 100%;
	min-height: 100%;
	padding: var(--k5);
	background: var(--c-akcent-jemny);
	color: var(--c-text);
	font-family: var(--pismo-display);
	font-size: var(--t-h3);
	line-height: 1.2;
}

.blog-sekce-nadpis {
	margin: var(--k8) 0 var(--k5);
	font-size: min(var(--t-h2), 2.25rem);
}

/* Mřížka karet: fotka 16:10, datum, nadpis, perex. */
.blog-mrizka {
	display: grid;
	gap: var(--k7) var(--k5);
	margin-top: var(--k7);
}

.blog-sekce-nadpis + .blog-mrizka {
	margin-top: 0;
}

@media (min-width: 640px) {
	.blog-mrizka {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (min-width: 1024px) {
	.blog-mrizka {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

.blog-karta-odkaz {
	display: flex;
	flex-direction: column;
	height: 100%;
	color: inherit;
	text-decoration: none;
}

.blog-karta-foto {
	aspect-ratio: 16 / 10;
	border-radius: var(--r-karta);
}

.blog-karta-telo {
	display: flex;
	flex: 1;
	flex-direction: column;
	gap: var(--k2);
	padding-top: var(--k4);
}

.blog-karta-nadpis {
	font-size: var(--t-h3);
}

@media (hover: hover) {
	:is(.blog-hlavni-odkaz, .blog-karta-odkaz):hover img {
		transform: scale(1.03);
	}

	:is(.blog-hlavni-odkaz, .blog-karta-odkaz):hover :is(.blog-hlavni-nadpis, .blog-karta-nadpis) {
		text-decoration: underline;
		text-decoration-thickness: 1px;
		text-underline-offset: 4px;
	}

	:is(.blog-hlavni-odkaz, .blog-karta-odkaz):hover .blog-sipka {
		transform: translateX(3px);
	}
}

:is(.blog-hlavni-odkaz, .blog-karta-odkaz):focus-visible {
	outline: 2px solid var(--c-akcent);
	outline-offset: 4px;
	border-radius: var(--r-karta);
}

.blog-strankovani {
	margin-top: var(--k8);
}

.blog-prazdno {
	margin-top: var(--k7);
	padding: var(--k7) var(--k5);
	border: 1px solid var(--c-linka);
	border-radius: var(--r-karta);
	background: var(--c-povrch);
	text-align: center;
}

.blog-prazdno h2 {
	font-size: var(--t-h3);
}

.blog-prazdno p {
	max-width: 44ch;
	margin: var(--k3) auto 0;
	color: var(--c-text-tlumene);
}

/* ----- Blog: článek ----- */
.clanek {
	padding-top: var(--stranka-nahore, var(--k6));
}

.clanek-hlava {
	max-width: 700px;
	margin-inline: auto;
}

.clanek-hlava .drobky {
	margin: 0 0 var(--k5);
}

.clanek-hlava .drobky a {
	min-height: 44px;
}

.clanek-hlava .drobky span[aria-current] {
	overflow-wrap: anywhere;
}

.clanek-kategorie {
	display: flex;
	flex-wrap: wrap;
	gap: var(--k2);
	margin: 0 0 var(--k4);
}

.clanek-hlava h1 {
	font-size: min(var(--t-h1), 3.5rem);
}

.clanek-perex {
	margin: var(--k4) 0 0;
	color: var(--c-text-tlumene);
	font-size: var(--t-lead);
	line-height: 1.6;
}

.clanek-meta {
	margin-top: var(--k4);
}

.clanek-foto {
	max-width: 1100px;
	margin: var(--k6) auto 0;
	border-radius: var(--r-karta);
}

.clanek-foto img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 9;
	object-fit: cover;
	object-position: center 30%;
}

.clanek-text {
	margin-top: var(--k7);
}

/* Míra řádku článku: 700 px při 18 px Jostu ≈ 65–72 znaků (měřeno). */
[data-smer] .clanek-text {
	font-size: clamp(17px, 1.25vw, 18px);
}

.clanek-pata {
	max-width: 700px;
	margin: var(--k7) auto 0;
	padding-top: var(--k5);
	border-top: 1px solid var(--c-linka);
}

.clanek-stitky {
	display: flex;
	flex-wrap: wrap;
	gap: var(--k2);
	margin: 0 0 var(--k5);
	padding: 0;
	list-style: none;
}

.clanek-stitky li {
	padding: 6px 14px;
	border: 1px solid var(--c-linka);
	border-radius: var(--r-pilulka);
	color: var(--c-text-tlumene);
	font-size: var(--t-popisek);
}

.clanek-sdileni {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--k2) var(--k4);
}

.clanek-sdileni-popisek {
	margin: 0;
	color: var(--c-text-tlumene);
	font-size: var(--t-popisek);
	font-weight: 500;
}

.clanek-sdileni ul {
	display: flex;
	gap: var(--k2);
	margin: 0;
	padding: 0;
	list-style: none;
}

.clanek-sdileni a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border: 1px solid var(--c-linka);
	border-radius: var(--r-pilulka);
	color: var(--c-text);
}

.clanek-sdileni a:hover {
	border-color: var(--c-akcent);
	color: var(--c-akcent-text);
}

.clanek-sdileni svg {
	width: 18px;
	height: 18px;
}

.clanek-zpet {
	display: inline-flex;
	align-items: center;
	gap: var(--k2);
	min-height: 44px;
	margin-top: var(--k5);
	color: var(--c-akcent-text);
	font-weight: 500;
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
}

:is(.clanek-sdileni a, .clanek-zpet, .blog-kategorie a, .clanek-kategorie a):focus-visible {
	outline: 2px solid var(--c-akcent);
	outline-offset: 2px;
}

.clanek-dalsi {
	padding-bottom: var(--k8);
}

/* ----- Blog: tělo článku z importu (inline styly) -----
   Články převzaté ze Shoptetu nesou v HTML vlastní písmo, barvy, pozadí
   bloků, zarovnání do bloku a tlačítka natvrdo (`style="…"`). Inline styl
   přebije jen `!important` — proto ho tahle vrstva používá a jen na
   prezentační vlastnosti: písmo, barvy, pozadí, rámečky, stíny. Struktura
   (flex/grid, odsazení uvnitř boxu, zarovnání na střed) zůstává autorovi.
   Výsledek: jeden hlas e-shopu, čitelný v obou motivech, a žádný bílý
   blok ani černý text na tmavém pozadí. */
.clanek-text [style] {
	font-family: inherit !important;
	letter-spacing: normal !important;
	text-transform: none !important;
	box-shadow: none !important;
}

/* Barvy textu: jedna barva rámu. Tlumené zůstává jen to, co bylo šedé
   (popisky obrázků), a to tokenem motivu. */
.clanek-text [style*="color"] {
	color: inherit !important;
}

.clanek-text > [style],
.clanek-text .blog-article-content {
	max-width: none !important;
	color: var(--c-text) !important;
	line-height: inherit !important;
}

/* Zarovnání do bloku dělá v češtině „řeky" mezer — vždy doleva. */
.clanek-text [style*="justify"] {
	text-align: left !important;
}

/* Nadpisy: velikost a barvu dává škála rámu, ne `font-size: 3em` z importu. */
.clanek-text :is(h2, h3, h4)[style] {
	padding: 0 !important;
	border: 0 !important;
	font-weight: 500 !important;
	line-height: 1.2 !important;
}

.clanek-text h2[style] {
	font-size: clamp(22px, 2vw, 28px) !important;
}

.clanek-text h3[style] {
	font-size: clamp(19px, 1.5vw, 22px) !important;
}

.clanek-text h4[style] {
	font-size: 18px !important;
}

.clanek-text :is(h2, h3, h4) [style] {
	font-weight: inherit !important;
	font-style: normal !important;
}

/* Zvětšené odstavce (podnadpisy, citáty) na velikost textu. */
.clanek-text p[style*="font-size"] {
	font-size: inherit !important;
	font-style: normal !important;
}

.clanek-text :is(p, span, div)[style*="font-size: 0.9em"],
.clanek-text :is(p, span, div)[style*="font-size: 0.85em"],
.clanek-text :is(p, span, div)[style*="font-size: 0.8em"] {
	color: var(--c-text-tlumene) !important;
	font-size: 15px !important;
	text-align: center;
}

/* Velikosti v bodech (`11pt`, `12pt` z Wordu) = velikost textu rámu. */
.clanek-text [style*="font-size"][style*="pt"] {
	font-size: inherit !important;
}

/* Odstavec s rámečkem vlevo = úvod článku: perex rámu, akcentní linka. */
.clanek-text p[style*="border-left"] {
	padding-left: 1.1em !important;
	border-left: 2px solid var(--c-akcent) !important;
	color: var(--c-text-tlumene) !important;
	font-size: 1.05em !important;
	font-style: normal !important;
}

/* Úvodní odstavec vysázený jako nadpis (`<h4>` na začátku těla, častý
   v importu): čte se jako perex, ne jako tučný blok s řádkováním nadpisu. */
[data-smer] .clanek-text > h4:first-child,
[data-smer] .clanek-text > .blog-article-content > h4:first-child {
	color: var(--c-text);
	font-family: var(--pismo-text);
	font-size: 1.1em;
	font-weight: 400;
	line-height: 1.6;
	letter-spacing: 0;
}

/* Bloky s pozadím (tipy, srovnání, produkt, výzva na konci): jedna tichá
   plocha motivu místo pastelových a černých boxů, bez cizích rámečků. */
.clanek-text :is(div, section, aside, footer)[style*="background"] {
	margin-block: 2em !important;
	padding: clamp(20px, 4vw, 32px) !important;
	border: 0 !important;
	border-radius: var(--r-karta) !important;
	background: var(--c-pozadi2) !important;
	color: var(--c-text) !important;
}

.clanek-text [style*="background"] :is(h2, h3, h4):first-child {
	margin-top: 0;
}

.clanek-text [style*="background"] > :last-child {
	margin-bottom: 0;
}

/* Rámeček s fotkou na začátku článku (bílá karta se stínem): bez karty. */
.clanek-text [style*="position: relative"][style*="background"] {
	padding: 0 !important;
	background: none !important;
}

/* Hlavička tabulky z importu bývá černá — jako `th` rámu. */
.clanek-text :is(tr, th, td)[style*="background"] {
	background: var(--c-pozadi2) !important;
}

.clanek-text :is(table, tr, th, td)[style*="border"] {
	border-color: var(--c-linka) !important;
}

.clanek-text :is(th, td)[style] {
	padding: 10px 14px !important;
}

/* Barevné hodnoty v tabulce (plus / mínus) nesou význam — zůstávají, ale
   v odstínech motivu s kontrastem AA. */
.clanek-text [style*="color: #5cb85c"],
.clanek-text [style*="color: #28a745"],
.clanek-text [style*="color: #2e7d32"] {
	color: var(--c-plus) !important;
}

.clanek-text [style*="color: #d9534f"],
.clanek-text [style*="color: #dc3545"] {
	color: var(--c-minus) !important;
}

.clanek-text {
	--c-plus: #1e6b3a;
	--c-minus: var(--c-chyba);
}

[data-motiv="tmavy"] .clanek-text {
	--c-plus: #7fd69a;
}

/* Úzká obrazovka: dvousloupcové mřížky a boxy s `min-width` se skládají
   pod sebe, nic nepřeteče. */
.clanek-text [style*="min-width"] {
	min-width: min(100%, 240px) !important;
}

.clanek-text [style*="flex: 2"][style*="padding-left"] {
	padding-left: 0 !important;
}

.clanek-text [style*="display: flex"] {
	gap: var(--k5) !important;
}

.clanek-text [style*="grid-template-columns"] {
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)) !important;
}

/* Odkazy v textu: styl rámu (akcent, podtržení), ne černé tučné. */
.clanek-text a[style]:not([style*="background"]) {
	border: 0 !important;
	color: var(--c-akcent-text) !important;
	font-weight: inherit !important;
	text-decoration: underline !important;
	text-decoration-color: var(--c-akcent) !important;
	text-underline-offset: 3px;
}

/* Odkaz s pozadím = tlačítko: pilulka e-shopu (jako „Do košíku"). */
.clanek-text a[style*="background"] {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	margin-top: var(--k3);
	padding: 12px 28px !important;
	border: 0 !important;
	border-radius: var(--r-pilulka) !important;
	background: var(--c-akcent) !important;
	color: var(--c-na-akcentu) !important;
	font-size: 16px !important;
	font-weight: 500 !important;
	line-height: 1.2;
	text-decoration: none !important;
	transition: background var(--cas-rychle) ease;
}

.clanek-text a[style*="background"]:hover {
	background: color-mix(in srgb, var(--c-akcent) 86%, var(--c-text)) !important;
}

.clanek-text a[style*="background"]:focus-visible {
	outline: 2px solid var(--c-akcent);
	outline-offset: 3px;
}

/* Obrázky: na střed, zaoblení rámu, bez stínů a rámečků z importu. */
[data-smer] .clanek-text img {
	margin-inline: auto;
}

.clanek-text img[style] {
	border-radius: var(--r-karta) !important;
}

[data-smer] .clanek-text [style*="flex: 1"] img,
[data-smer] .clanek-text [style*="grid"] img {
	margin-block: 0;
}

.clanek-dalsi .blog-sekce-nadpis {
	margin-top: var(--k9);
}

/* ----- Blog: bloky editoru WordPress ve starších článcích -----
   Články z let 2018–2024 nesou třídy bloků (`wp-block-*`, `has-*-font-size`)
   bez jejich stylopisu. Tady dostanou podobu rámu: obrázky na střed,
   popisky, „obrázek + text" vedle sebe, tlačítka jako pilulky e-shopu. */
[data-smer] .clanek-text figure {
	margin: 2em 0;
}

[data-smer] .clanek-text figure img {
	margin-block: 0;
}

[data-smer] .clanek-text figcaption {
	margin-top: var(--k2);
	color: var(--c-text-tlumene);
	font-size: 15px;
	line-height: 1.5;
	text-align: center;
}

.clanek-text :is(.has-large-font-size, .has-x-large-font-size) {
	margin-top: 1.6em;
	font-family: var(--pismo-display);
	font-size: clamp(19px, 1.5vw, 22px);
	font-weight: 500;
	line-height: 1.3;
}

/* „Zdroj" fotky bývá v importu uvnitř nadpisu (`<h2><img><span>Zdroj`)
   — je to popisek, ne titulek. */
.clanek-text :is(h2, h3, h4) > span[style*="font-size"]:has(> a:only-child) {
	display: block;
	font-family: var(--pismo-text);
	font-size: 14px !important;
	font-weight: 400;
	text-align: center;
}

.clanek-text .has-medium-font-size {
	font-size: 1.05em;
}

.clanek-text .has-small-font-size {
	font-size: 15px;
}

.clanek-text .has-text-align-center {
	text-align: center;
}

/* Velká citace: hlas článku, ne šedý řádek. */
[data-smer] .clanek-text blockquote.is-style-large {
	color: var(--c-text);
	font-family: var(--pismo-display);
	font-size: clamp(19px, 1.6vw, 23px);
	line-height: 1.45;
}

[data-smer] .clanek-text blockquote :is(em, i) {
	font-style: normal;
}

/* Obrázek + text vedle sebe (karta produktu v článku). */
.clanek-text .wp-block-media-text {
	display: grid;
	grid-template-columns: minmax(0, 2fr) minmax(0, 3fr);
	gap: var(--k5);
	align-items: center;
	margin: 2em 0;
	padding: var(--k4);
	border-radius: var(--r-karta);
	background: var(--c-pozadi2);
}

.clanek-text .wp-block-media-text.has-media-on-the-right {
	grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);
}

.clanek-text .wp-block-media-text.has-media-on-the-right .wp-block-media-text__media {
	order: 2;
}

[data-smer] .clanek-text .wp-block-media-text__media {
	margin: 0;
}

[data-smer] .clanek-text .wp-block-media-text__media img {
	width: 100%;
	margin: 0;
}

.clanek-text .wp-block-media-text__content > :first-child {
	margin-top: 0;
}

.clanek-text .wp-block-media-text__content > :last-child {
	margin-bottom: 0;
}

/* Galerie: mřížka čtverců. */
[data-smer] .clanek-text .wp-block-gallery {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 180px), 1fr));
	gap: var(--k3);
	margin: 2em 0;
}

[data-smer] .clanek-text .wp-block-gallery figure {
	margin: 0;
}

[data-smer] .clanek-text .wp-block-gallery img {
	width: 100%;
	aspect-ratio: 1;
	margin: 0;
	object-fit: cover;
}

/* Prázdná galerie z importu nemá co ukázat — ani mezeru. */
.clanek-text .wp-block-gallery:not(:has(img)) {
	display: none;
}

/* Tlačítka bloků: pilulka e-shopu místo barev editoru. */
.clanek-text .wp-block-buttons,
.clanek-text .wp-block-button {
	margin: var(--k4) 0;
}

.clanek-text .wp-block-button.aligncenter {
	text-align: center;
}

[data-smer] .clanek-text .wp-block-button__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	padding: 12px 28px;
	border-radius: var(--r-pilulka);
	background: var(--c-akcent);
	color: var(--c-na-akcentu);
	font-size: 16px;
	font-weight: 500;
	line-height: 1.2;
	text-decoration: none;
	transition: background var(--cas-rychle) ease;
}

[data-smer] .clanek-text .wp-block-button__link:hover {
	background: color-mix(in srgb, var(--c-akcent) 86%, var(--c-text));
}

.clanek-text .wp-block-media-text .wp-block-button {
	margin-bottom: 0;
}

.clanek-text .wp-block-media-text .wp-block-button__link {
	min-height: 44px;
	padding: 10px 22px;
	font-size: 15px;
}

/* Vložená videa: plná šířka sloupce, poměr 16 : 9. */
[data-smer] .clanek-text :is(iframe, video) {
	display: block;
	width: 100%;
	max-width: 100%;
	height: auto;
	aspect-ratio: 16 / 9;
	margin: 2em 0;
	border: 0;
	border-radius: var(--r-karta);
}

/* Tmavý motiv: fotky z importu mají často bílé pozadí — ztlumit oslnění. */
[data-motiv="tmavy"] :is(.clanek-text img, .clanek-foto img, .blog-karta-foto img, .blog-hlavni-foto img) {
	filter: brightness(.9);
}

@media (max-width: 639px) {
	.blog {
		padding-bottom: var(--k7);
	}

	.blog-kategorie {
		margin-top: var(--k5);
	}

	.blog-hlavni {
		margin-top: var(--k6);
	}

	.blog-sekce-nadpis,
	.clanek-dalsi .blog-sekce-nadpis {
		margin-top: var(--k8);
	}

	.clanek-foto {
		margin-inline: calc(-1 * var(--okraj));
		border-radius: 0;
	}

	.clanek-text {
		margin-top: var(--k6);
	}
}

@media (prefers-reduced-motion: reduce) {
	:is(.blog-hlavni-foto, .blog-karta-foto) img,
	.blog-sipka {
		transition: none;
	}
}

/* ----- Hledání a kontakt platformy (styly má šablona inline) ----- */
[data-smer] main > section[style] :is(h1, h2) {
	color: var(--c-text) !important;
	font-family: var(--pismo-display) !important;
	font-weight: 500 !important;
}

[data-smer] main > section[style] :is(input, textarea) {
	min-height: 48px;
	font-family: inherit;
	border-color: var(--c-linka) !important;
	background: var(--c-povrch);
	color: var(--c-text);
}

[data-smer] main > section[style] button {
	min-height: 48px;
	border-radius: 999px !important;
	background: var(--c-akcent) !important;
	color: var(--c-na-akcentu) !important;
}

[data-smer] main > section[style] :is(p, small, li) {
	color: var(--c-text-tlumene) !important;
}

[data-smer] main > section[style] a h2 {
	color: var(--c-akcent-text) !important;
}

[data-smer] main > section[style] div[style*="background"] {
	background: var(--c-pozadi2) !important;
}

@media (max-width: 639px) {
	/* Boční okraj jako hlavička a katalog (šablona platformy má 1rem). */
	[data-smer] main > section[style] {
		padding-inline: 20px !important;
	}

	[data-smer] .vpage-shell {
		padding-top: var(--k5);
		padding-bottom: var(--k7);
	}
}

/* ----- Jack: sjednocení s katalogem a detailem (směr Značka) ----- */
[data-smer="znacka"] .vpage-shell {
	padding-top: var(--stranka-nahore);
}

/* Drobky jako v katalogu a na detailu: lomítko, bez podtržení. */
[data-smer="znacka"] .vpage-breadcrumbs a {
	text-decoration: none;
}

[data-smer="znacka"] .vpage-breadcrumbs svg {
	display: none;
}

[data-smer="znacka"] .vpage-breadcrumbs li + li::before {
	content: "/";
	margin-inline: var(--k2);
	color: var(--c-slabe);
}