/* ===========================================================================
   TOPNATUR — CSS pro ČLÁNEK
   Platí pro články, Shoptet stránky A POPISKY KATEGORIÍ (společný wrapper
   `.mm-article-wrapper`).

   Vyčištěno 2026-08-24:
   - odstraněny styly banneru (typ obsahu není v editoru dostupný, 0 záznamů)
   - odstraněny mrtvé deklarace `max-width: var(--mm-max-width)` (proměnná
     se nikde nedefinuje, deklarace byla neplatná)
   - odstraněno prázdné pravidlo `.mm-article-wrapper .mm-text-block { }`
   - PŘESUNUTA sem pravidla `.mm-article-wrapper …`, která dosud omylem ležela
     v produktovém CSS (nadpisy v textovém bloku, FAQ, FAQ skupiny, tlačítko,
     karty, ikona + text)
   - doplněno „hranaté" zaoblení pro tento scope (editor tu třídu na bloky
     dává, definovaná byla jen pro `.mm-product`)
   - promo blok scopován pod wrapper (ověřeno, že wrapper na webu zůstává)
   =========================================================================== */

.mm-article-wrapper,
.post-description {

  --mm-gap: 28px;
  --mm-radius: 12px;
  --mm-accent: #2563eb;
  --mm-text: #1f2933;
  --mm-muted: #6b7280;
  --mm-border: #e5e7eb;
}

/* Úvodní perex vedle hlavní fotky */
.post-description {
  margin: 0 auto 28px;
  font-size: 1.125rem;
  line-height: 1.7;
  color: var(--mm-muted);
  font-weight: 500;
}

.mm-article-wrapper {
  margin: 0 auto;
  color: var(--mm-text);
  font-size: 1.0625rem;
  line-height: 1.75;
  font-family: "Inter", sans-serif;
}

.mm-article-wrapper > * + * {
  margin-top: var(--mm-gap);
}

/* Nadpisy */
.mm-article-wrapper .mm-heading {
  line-height: 1.25;
  font-weight: 700;
  color: #111827;
  scroll-margin-top: 80px;
}
.mm-article-wrapper h2.mm-heading,
.mm-article-wrapper h2.mm-main-heading { font-size: 1.875rem; margin-top: 40px; }
.mm-article-wrapper h3.mm-heading,
.mm-article-wrapper h3.mm-main-heading { font-size: 1.5rem; margin-top: 32px; }
.mm-article-wrapper h4.mm-heading,
.mm-article-wrapper h4.mm-main-heading { font-size: 1.25rem; margin-top: 28px; }
.mm-article-wrapper h5.mm-heading,
.mm-article-wrapper h5.mm-main-heading { font-size: 1.0625rem; margin-top: 24px; text-transform: uppercase; letter-spacing: 0.03em; color: var(--mm-muted); }
.mm-article-wrapper .mm-main-heading:first-child { margin-top: 0; }

/* Textový blok a odstavce */
.mm-article-wrapper .mm-paragraph { margin: 0 0 1em; }
.mm-article-wrapper .mm-paragraph:last-child { margin-bottom: 0; }
.mm-article-wrapper .mm-text-bold { font-weight: 700; }
.mm-article-wrapper a {
  color: var(--mm-accent);
  text-decoration: underline;
  text-underline-offset: 2px;
}
.mm-article-wrapper a:hover { text-decoration: none; }

/* Seznamy */
.mm-article-wrapper .mm-list { margin: 0 0 1em; padding-left: 1.4em; }
.mm-article-wrapper .mm-list-item { margin: 0.25em 0; }

/* Média — jeden obrázek/video/embed */
.mm-article-wrapper .mm-image,
.mm-article-wrapper .mm-video {
  display: block;
  width: 100%;
  height: auto;
  border-radius: var(--mm-radius);
}
.mm-article-wrapper .mm-iframe {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  border: 0;
  border-radius: var(--mm-radius);
}
.mm-article-wrapper .mm-media-wrapper { margin: var(--mm-gap) 0; }

/* Mřížky 2 a 3 média */
.mm-article-wrapper .mm-media-grid-2,
.mm-article-wrapper .mm-media-grid-3 {
  display: grid;
  gap: 16px;
}
.mm-article-wrapper .mm-media-grid-2 { grid-template-columns: repeat(2, 1fr); }
.mm-article-wrapper .mm-media-grid-3 { grid-template-columns: repeat(3, 1fr); }
.mm-article-wrapper .mm-media-item .mm-image,
.mm-article-wrapper .mm-media-item .mm-video,
.mm-article-wrapper .mm-media-item .mm-iframe {
  height: 100%;
  object-fit: cover;
}

/* Médium + text vedle sebe */
.mm-article-wrapper .mm-media-text {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--mm-gap);
  align-items: center;
}
.mm-article-wrapper .mm-media-text.mm-reverse .mm-media-part { order: 2; }
.mm-article-wrapper .mm-media-text .mm-text-part > *:first-child { margin-top: 0; }

/* Dva sloupce vedle sebe */
.mm-article-wrapper .mm-columns {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--mm-cols-gap, var(--mm-gap));
  align-items: start;
}
.mm-article-wrapper .mm-columns .mm-col > * + * { margin-top: var(--mm-gap); }

/* Mezera (spacer) — sama tvoří rozestup, ruší výchozí gap okolo sebe */
.mm-article-wrapper .mm-spacer { width: 100%; }
.mm-article-wrapper .mm-spacer-sm { height: 16px; }
.mm-article-wrapper .mm-spacer-md { height: 32px; }
.mm-article-wrapper .mm-spacer-lg { height: 48px; }
.mm-article-wrapper .mm-spacer-xl { height: 88px; }
.mm-article-wrapper > * + .mm-spacer,
.mm-article-wrapper > .mm-spacer + *,
.mm-article-wrapper .mm-col > * + .mm-spacer,
.mm-article-wrapper .mm-col > .mm-spacer + * { margin-top: 0; }

/* Responsivita */
@media (max-width: 640px) {
  .mm-article-wrapper .mm-media-grid-2,
  .mm-article-wrapper .mm-media-grid-3,
  .mm-article-wrapper .mm-media-text,
  .mm-article-wrapper .mm-columns {
    grid-template-columns: 1fr;
  }
  .mm-article-wrapper .mm-columns { gap: var(--mm-gap); }
  .mm-article-wrapper .mm-media-text.mm-reverse .mm-media-part { order: 0; }
  .mm-article-wrapper h2.mm-main-heading { font-size: 1.5rem; }
}


/* Zaoblení rohů — per blok (editor přidává třídu na konkrétní blok).
   ZÁMĚRNĚ jen „hranaté": „oblé" je už výchozí stav (--mm-radius: 12px výš),
   takže pravidlo pro něj by nic nepřidalo — jen by přepsalo radius u bloků,
   které tu třídu v už publikovaném HTML mají. */
.mm-article-wrapper .mm-corners-square { --mm-radius: 0px; }

.mm-article-wrapper .mm-highlight {
  background: var(--mm-highlight-bg, #f3f4f6);
  border-radius: var(--mm-radius);
  padding: 22px 26px;
}
.mm-article-wrapper .mm-highlight > *:first-child { margin-top: 0; }

/* Podbarvení přes celou šířku obrazovky (full-bleed mimo container) */
.mm-article-wrapper .mm-highlight.mm-highlight-full {
  padding-left: max(24px, calc(50vw - 50%));
  padding-right: max(24px, calc(50vw - 50%));
  border-radius: 0;
}

/* Nadpisy vepsané uvnitř textového bloku (H2–H5 z formátovací lišty) */
.mm-article-wrapper .mm-text-block :is(h2, h3, h4, h5) {
  font-family: var(--mm-font-head, inherit);
  font-weight: 700;
  color: #111827;
  scroll-margin-top: 80px;
}
.mm-article-wrapper .mm-text-block h2 { font-size: 1.875rem; margin: 40px 0 12px; }
.mm-article-wrapper .mm-text-block h3 { font-size: 1.5rem; margin: 32px 0 10px; }
.mm-article-wrapper .mm-text-block h4 { font-size: 1.25rem; margin: 28px 0 8px; }
.mm-article-wrapper .mm-text-block h5 { font-size: 1.0625rem; margin: 24px 0 8px; text-transform: uppercase; letter-spacing: 0.03em; color: var(--mm-muted); }
.mm-article-wrapper .mm-text-block :is(h2, h3, h4, h5):first-child { margin-top: 0; }

/* Produkty v článku — vkládaný shortcode doplňku */
.mm-article-wrapper .mm-products { margin: 24px 0; }

/* FAQ accordion — v článkovém CSS dosud chyběl úplně */

/* FAQ (accordion) */
.mm-article-wrapper .mm-faq { margin: 32px 0; }
.mm-article-wrapper .mm-faq-title { margin: 0 0 16px; }
.mm-article-wrapper .mm-faq-list { border-top: 1px solid var(--mm-border, #e5e7eb); }
.mm-article-wrapper .mm-faq-item {
  border-bottom: 1px solid var(--mm-border, #e5e7eb);
}
.mm-article-wrapper .mm-faq-question {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 16px 0;
  font-weight: 600;
  cursor: pointer;
  list-style: none;
}
.mm-article-wrapper .mm-faq-question::-webkit-details-marker { display: none; }
.mm-article-wrapper .mm-faq-question::after {
  content: "+";
  flex: 0 0 auto;
  width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  background: var(--mm-faq-toggle-bg, #fcd6df);
  color: var(--mm-faq-toggle-text, #161616);
  font-weight: 700;
  line-height: 1;
}
.mm-article-wrapper .mm-faq-item[open] .mm-faq-question::after { content: "\2212"; }
.mm-article-wrapper .mm-faq-answer { padding: 0 0 18px; }

/* FAQ skupiny — záložky */

/* FAQ skupiny (záložky bez JS) */
.mm-article-wrapper .mm-faq-groups { margin: 32px 0; }
.mm-article-wrapper .mm-faq-groups-title { margin: 0 0 16px; }
.mm-article-wrapper .mm-faq-tab-input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}
.mm-article-wrapper .mm-faq-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 20px;
}
.mm-article-wrapper .mm-faq-tab {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 16px;
  border-radius: 10px;
  background: var(--mm-faq-tab-bg, #f2f2f2);
  color: var(--mm-faq-tab-text, #454545);
  font-weight: 500;
  cursor: pointer;
  transition: background 0.15s, color 0.15s;
}
.mm-article-wrapper .mm-faq-tab-icon {
  width: 20px;
  height: 20px;
  object-fit: contain;
  display: block;
}
.mm-article-wrapper .mm-faq-panel { display: none; }
.mm-article-wrapper .mm-faq-panel > .mm-faq-item:first-child {
  border-top: 1px solid var(--mm-border, #e5e7eb);
}

.mm-article-wrapper .mm-faq-groups > .mm-faq-tab-input:nth-of-type(1):checked ~ .mm-faq-tabs .mm-faq-tab:nth-child(1) {
  background: var(--mm-faq-tab-active-bg, #dcf0c8);
  color: var(--mm-faq-tab-active-text, #1c4434);
}
.mm-article-wrapper .mm-faq-groups > .mm-faq-tab-input:nth-of-type(1):checked ~ .mm-faq-panel:nth-of-type(2) {
  display: block;
}
.mm-article-wrapper .mm-faq-groups > .mm-faq-tab-input:nth-of-type(2):checked ~ .mm-faq-tabs .mm-faq-tab:nth-child(2) {
  background: var(--mm-faq-tab-active-bg, #dcf0c8);
  color: var(--mm-faq-tab-active-text, #1c4434);
}
.mm-article-wrapper .mm-faq-groups > .mm-faq-tab-input:nth-of-type(2):checked ~ .mm-faq-panel:nth-of-type(3) {
  display: block;
}
.mm-article-wrapper .mm-faq-groups > .mm-faq-tab-input:nth-of-type(3):checked ~ .mm-faq-tabs .mm-faq-tab:nth-child(3) {
  background: var(--mm-faq-tab-active-bg, #dcf0c8);
  color: var(--mm-faq-tab-active-text, #1c4434);
}
.mm-article-wrapper .mm-faq-groups > .mm-faq-tab-input:nth-of-type(3):checked ~ .mm-faq-panel:nth-of-type(4) {
  display: block;
}
.mm-article-wrapper .mm-faq-groups > .mm-faq-tab-input:nth-of-type(4):checked ~ .mm-faq-tabs .mm-faq-tab:nth-child(4) {
  background: var(--mm-faq-tab-active-bg, #dcf0c8);
  color: var(--mm-faq-tab-active-text, #1c4434);
}
.mm-article-wrapper .mm-faq-groups > .mm-faq-tab-input:nth-of-type(4):checked ~ .mm-faq-panel:nth-of-type(5) {
  display: block;
}
.mm-article-wrapper .mm-faq-groups > .mm-faq-tab-input:nth-of-type(5):checked ~ .mm-faq-tabs .mm-faq-tab:nth-child(5) {
  background: var(--mm-faq-tab-active-bg, #dcf0c8);
  color: var(--mm-faq-tab-active-text, #1c4434);
}
.mm-article-wrapper .mm-faq-groups > .mm-faq-tab-input:nth-of-type(5):checked ~ .mm-faq-panel:nth-of-type(6) {
  display: block;
}
.mm-article-wrapper .mm-faq-groups > .mm-faq-tab-input:nth-of-type(6):checked ~ .mm-faq-tabs .mm-faq-tab:nth-child(6) {
  background: var(--mm-faq-tab-active-bg, #dcf0c8);
  color: var(--mm-faq-tab-active-text, #1c4434);
}
.mm-article-wrapper .mm-faq-groups > .mm-faq-tab-input:nth-of-type(6):checked ~ .mm-faq-panel:nth-of-type(7) {
  display: block;
}
.mm-article-wrapper .mm-faq-groups > .mm-faq-tab-input:nth-of-type(7):checked ~ .mm-faq-tabs .mm-faq-tab:nth-child(7) {
  background: var(--mm-faq-tab-active-bg, #dcf0c8);
  color: var(--mm-faq-tab-active-text, #1c4434);
}
.mm-article-wrapper .mm-faq-groups > .mm-faq-tab-input:nth-of-type(7):checked ~ .mm-faq-panel:nth-of-type(8) {
  display: block;
}
.mm-article-wrapper .mm-faq-groups > .mm-faq-tab-input:nth-of-type(8):checked ~ .mm-faq-tabs .mm-faq-tab:nth-child(8) {
  background: var(--mm-faq-tab-active-bg, #dcf0c8);
  color: var(--mm-faq-tab-active-text, #1c4434);
}
.mm-article-wrapper .mm-faq-groups > .mm-faq-tab-input:nth-of-type(8):checked ~ .mm-faq-panel:nth-of-type(9) {
  display: block;
}

/* Tlačítko, karty vedle sebe, ikona + text */

/* Tlačítko (odkaz) */
.mm-article-wrapper .mm-button-wrap { display: flex; }
.mm-article-wrapper .mm-button-wrap.mm-align-left { justify-content: flex-start; }
.mm-article-wrapper .mm-button-wrap.mm-align-center { justify-content: center; }
.mm-article-wrapper .mm-button-wrap.mm-align-right { justify-content: flex-end; }
.mm-article-wrapper .mm-button {
  display: inline-block;
    padding: .75em 1em;
    font-weight: 600;
  border-radius: 8px;
font-size:1rem;
  line-height: 1.2;
  text-decoration: none;
    transition: all .15s ease-in-out;
}
.mm-article-wrapper .mm-button:hover { opacity: 0.85; text-decoration: none; }
.mm-article-wrapper .mm-button-green {
  background: var(--mm-green, #1c4434);
  color: #fff;
}
.mm-article-wrapper .mm-button-pink {
  background: var(--mm-highlight-bg, #fcd6df);
  color: var(--mm-text, #161616);
}
.mm-article-wrapper .mm-button-dark { background: #161616; color: #fff; }
.mm-article-wrapper .mm-button-outline {
  background: transparent;
  color: var(--mm-green, #1c4434);
  border-color: var(--mm-green, #1c4434);
}

/* Karty vedle sebe */
.mm-article-wrapper .mm-cards {
  display: grid;
  gap: 24px;
  align-items: stretch;
}
.mm-article-wrapper .mm-cards-2 { grid-template-columns: repeat(2, 1fr); }
.mm-article-wrapper .mm-cards-3 { grid-template-columns: repeat(3, 1fr); }
.mm-article-wrapper .mm-cards-4 { grid-template-columns: repeat(4, 1fr); }
.mm-article-wrapper .mm-card {
  display: flex;
  flex-direction: column;
  gap: 12px;
  background: #fff;
  border-radius: var(--mm-radius, 16px);
  padding: 24px;
  box-shadow: 0 8px 52px rgba(0, 0, 0, 0.08);
}
.mm-article-wrapper .mm-card-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: var(--mm-card-icon-bg, #dcf0c8);
  flex: 0 0 auto;
}
.mm-article-wrapper .mm-card-icon img { width: 22px; height: 22px; object-fit: contain; }
.mm-article-wrapper .mm-card-title { margin: 0; font-size: 1.25rem; }
.mm-article-wrapper .mm-card-text { margin: 0; }
.mm-article-wrapper .mm-card-links {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: auto;
}
.mm-article-wrapper .mm-card-link {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-weight: 700;
  color: var(--mm-green, #1c4434);
  text-decoration: none;
}
.mm-article-wrapper .mm-card-link:hover { text-decoration: underline; }
.mm-article-wrapper .mm-card-link-icon { width: 18px; height: 18px; object-fit: contain; }

@media (max-width: 640px) {
  .mm-article-wrapper .mm-cards-2,
  .mm-article-wrapper .mm-cards-3,
  .mm-article-wrapper .mm-cards-4 { grid-template-columns: 1fr; }
}

/* Ikona + text */
.mm-article-wrapper .mm-icon-text {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.mm-article-wrapper .mm-icon-text-item {
  display: flex;
  align-items: flex-start;
  gap: 16px;
}
.mm-article-wrapper .mm-icon-text-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: var(--mm-card-icon-bg, #dcf0c8);
  flex: 0 0 auto;
}
.mm-article-wrapper .mm-icon-text-icon img { width: 22px; height: 22px; object-fit: contain; }
.mm-article-wrapper .mm-icon-text-body { display: flex; flex-direction: column; gap: 2px; }
.mm-article-wrapper .mm-icon-text-label { color: var(--mm-muted, #557367); }
.mm-article-wrapper .mm-icon-text-value { font-weight: 500; }
.mm-article-wrapper .mm-icon-text-link {
  font-weight: 700;
  color: var(--mm-green, #1c4434);
  text-decoration: none;
  margin-top: 2px;
}
.mm-article-wrapper .mm-icon-text-link::after { content: " ↗"; }
.mm-article-wrapper .mm-icon-text-link:hover { text-decoration: underline; }
/* Obrázek promo bloku pro obrázkový slot kategorie. Stojí ZÁMĚRNĚ mimo
   .mm-article-wrapper — šablona e-shopu ho musí najít jako samostatného
   potomka .category-perex, přesune si ho do .category-top-image a tenhle
   prvek smaže. Na webu se tedy neuplatní; styl je jen pro náhled v editoru
   (a kdyby ho šablona nepřebrala). Proto bez scopu. */
.mm-promo-image { margin: 0 0 28px; }
.mm-promo-image img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 16px;
}
/* Přepínání desktopního a mobilního obrázku podle šířky. ZÁMĚRNĚ bez scopu:
   šablona e-shopu si oba obrázky přesune do .category-top-image, tedy mimo
   .mm-article-wrapper — scopovaná pravidla by na ně přestala sedět. Třídy
   hoisting přežijí (ověřeno na webu). Vyplněný jen jeden obrázek dostane
   samotnou .mm-promo-img bez -d/-m, takže platí na všech šířkách. */
.mm-promo-img-m { display: none; }
@media (max-width: 640px) {
  .mm-promo-img-d { display: none; }
  .mm-promo-img-m { display: block; }
}

/* Promo blok */
.mm-article-wrapper .mm-promo {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--mm-gap, 28px);
  align-items: center;
  border-radius: var(--mm-radius, 12px);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}
/* Obrázek vedle textu na desktopu → dva sloupce */
.mm-article-wrapper .mm-promo.mm-promo-inline-d { grid-template-columns: 1fr 1fr; }
/* Výchozí pořadí je obrázek vlevo; mm-reverse ho posune za text */
.mm-article-wrapper .mm-promo.mm-reverse .mm-promo-media { order: 2; }
/* Pozadí = text leží na obrázku, takže blok potřebuje vnitřní odsazení */
.mm-article-wrapper .mm-promo.mm-promo-bg-d {
  background-image: var(--mm-promo-bg-d);
  padding: 48px;
}
.mm-article-wrapper .mm-promo-text > *:first-child { margin-top: 0; }
.mm-article-wrapper .mm-promo-text > *:last-child { margin-bottom: 0; }
.mm-article-wrapper .mm-promo-heading { margin-top: 0; }
.mm-article-wrapper .mm-promo-img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: var(--mm-radius, 12px);
}
/* Obrázek pro mobil se nad breakpointem nezobrazuje (a naopak) */
.mm-article-wrapper .mm-promo-img-m { display: none; }
/* Bez obrázku vedle textu na dané velikosti obrazovky obal zmizí, ať po něm
   nezůstane prázdná mezera v gridu */
.mm-article-wrapper .mm-promo:not(.mm-promo-inline-d) .mm-promo-media { display: none; }

@media (max-width: 640px) {
  /* POZOR: media query NEZVYŠUJE specificitu. Resety proto musí mít stejný
     počet tříd jako desktopní pravidla — jinak se vůbec neuplatní (přesně
     na tom jsem se sekl: pozadí i dva sloupce zůstávaly i na mobilu). */
  .mm-article-wrapper .mm-promo.mm-promo-inline-d { grid-template-columns: 1fr; }
  /* Pozadí z desktopu na mobilu NEPLATÍ — výřez utne, co je důležité. */
  .mm-article-wrapper .mm-promo.mm-promo-bg-d {
    background-image: none;
    padding: 0;
  }
  /* Mobilní pozadí AŽ ZA desktopním resetem: má stejnou specificitu, takže
     při obou pozadích rozhoduje pořadí. */
  .mm-article-wrapper .mm-promo.mm-promo-bg-m {
    background-image: var(--mm-promo-bg-m);
    padding: 24px;
  }
  .mm-article-wrapper .mm-promo.mm-reverse .mm-promo-media { order: 0; }
  .mm-article-wrapper .mm-promo-img-d { display: none; }
  .mm-article-wrapper .mm-promo-img-m { display: block; }
  .mm-article-wrapper .mm-promo:not(.mm-promo-inline-d) .mm-promo-media { display: block; }
  .mm-article-wrapper .mm-promo:not(.mm-promo-inline-m) .mm-promo-media { display: none; }
}

/* Barva písma nad pozadím. Volí ji editor podle podkladu (kontrast dle WCAG)
   a vkládá hotovou třídu — web k tomu nepotřebuje žádný JS.
   ZÁMĚRNĚ dva breakpointy a ŽÁDNÝ reset: barva se nastavuje jen tam, kde daná
   velikost obrazovky pozadí opravdu má. Kdyby se resetovala na "inherit",
   přebilo by to i vlastní barvu nadpisu z šablony. */
@media (min-width: 641px) {
.mm-article-wrapper .mm-promo.mm-promo-text-d-light .mm-promo-text,
.mm-article-wrapper .mm-promo.mm-promo-text-d-light .mm-promo-text * { color: #ffffff; }
.mm-article-wrapper .mm-promo.mm-promo-text-d-dark .mm-promo-text,
.mm-article-wrapper .mm-promo.mm-promo-text-d-dark .mm-promo-text * { color: #161616; }
}
@media (max-width: 640px) {
.mm-article-wrapper .mm-promo.mm-promo-text-m-light .mm-promo-text,
.mm-article-wrapper .mm-promo.mm-promo-text-m-light .mm-promo-text * { color: #ffffff; }
.mm-article-wrapper .mm-promo.mm-promo-text-m-dark .mm-promo-text,
.mm-article-wrapper .mm-promo.mm-promo-text-m-dark .mm-promo-text * { color: #161616; }
}
.mm-promo-top {
  border-radius: var(--mm-radius, 12px);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}
.mm-promo-top .mm-promo-text > *:first-child { margin-top: 0; }
.mm-promo-top .mm-promo-text > *:last-child { margin-bottom: 0; }
.mm-promo-top .mm-promo-heading { margin-top: 0; }

/* Desktop — text LEŽÍ na obrázku. Barvu písma volí editor podle podkladu
   (kontrast dle WCAG) a vkládá hotovou třídu, web k tomu nepotřebuje JS. */
@media (min-width: 641px) {
  .mm-promo-top {
    background-image: var(--mm-promo-bg-d);
    padding: 48px;
  }
  .mm-promo-top .mm-promo-media { display: none; }
  .mm-promo-top.mm-promo-text-d-light .mm-promo-text,
  .mm-promo-top.mm-promo-text-d-light .mm-promo-text * { color: #ffffff; }
  .mm-promo-top.mm-promo-text-d-dark .mm-promo-text,
  .mm-promo-top.mm-promo-text-d-dark .mm-promo-text * { color: #161616; }
}

/* Mobil — obrázek POD textem, ne pozadí: výřez by utnul, co je důležité.
   Prvek je prázdný (v perexu nesmí být <img>), takže výšku mu dá jen poměr
   stran původního obrázku — ten posílá editor v --mm-promo-ratio-m. */
@media (max-width: 640px) {
  .mm-promo-top {
    background-image: none;
    padding: 0;
  }
  .mm-promo-top .mm-promo-media {
    display: block;
    margin-top: 16px;
    aspect-ratio: var(--mm-promo-ratio-m, 3 / 2);
    border-radius: var(--mm-radius, 12px);
    background-image: var(--mm-promo-bg-m, var(--mm-promo-bg-d));
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
  }
}

/* Promo kategorie nemá co dát do obrázkového slotu šablony (obrázek je
   pozadím našeho bloku), takže by po něm zbyl prázdný sloupec. Selektor má
   o třídu víc než pravidlo šablony, takže nezáleží na pořadí souborů. */
.category-top:has(#promo-page) { grid-template-columns: 1fr; }
.category-top:has(#promo-page) .category-top-image { display: none; }

/* Starší publikace: obrázek promo bloku šablona hoistovala do
   .category-top-image a přepínal se tam podle šířky. Nové exporty tudy
   nechodí, pravidla tu zůstávají, aby se nerozsypaly už publikované
   kategorie (bez nich by se ukázaly oba obrázky pod sebou). */
.mm-promo-img-m { display: none; }
@media (max-width: 640px) {
  .mm-promo-img-d { display: none; }
  .mm-promo-img-m { display: block; }
}
ul{
    display: flow-root;}
ul{
.mm-list-item{
p{margin:0 !important;padding:0 !important;}
}}

.mm-article-wrapper .post-anchors a {
    color: #1c4434;
}