/*
Theme Name: DentaMedika
Theme URI: https://www.dentamedika.cz/
Author: DentaMedika
Description: Vlastní klasický theme pro zubní ordinaci DentaMedika (Brno). Bez pluginů - SEO, JSON-LD, cookie lišta a nastavení řešeny přímo v theme.
Version: 1.0.0
Requires at least: 6.4
Requires PHP: 8.0
Text Domain: dentamedika
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
*/

/* ==========================================================================
   1. Brand tokens

   Hodnoty níže jsou jen výchozí (barva loga DentaMedika). Skutečnou paletu
   vypisuje theme jako inline CSS podle volby v Nastavení → Barevné téma,
   viz inc/theme-colors.php. Šablony proto sahají výhradně na tyto tokeny.
     --color-primary       brand barva (ikony, rámečky, akcenty)
     --color-primary-light světlá varianta - čitelná na tmavém brandu
     --color-primary-dark  tmavá varianta - texty a tlačítka (min. 4,5:1 na bílé)
     --color-primary-deep  sytá plocha pro velké bloky (min. 7:1 na bílé)
     --color-primary-band  nejsvětlejší plocha unesoucí bílý text (velké pruhy)
     --color-footer-bg     nejtmavší odstín brandu (patička, cookie lišta)
     --color-accent-2       doplňková brand barva (u petrolejové zlatá) - JEN drobné
                           dekorativní akcenty; palety bez ní sem dosadí základní barvu
     --color-accent-2-light doplňková barva pro tmavé podklady (patička)
     --color-accent-2-text  ztmavená varianta pro text a ikony (splní 4,5:1)
   ========================================================================== */
:root {
  --color-primary: #2f5266;
  --color-primary-light: #6fa3bf;
  --color-primary-dark: #24404f;
  --color-primary-deep: #182b36;
  /* Velký barevný pruh - nejsvětlejší odstín, který ještě unese bílý text. */
  --color-primary-band: #2f5266;
  --color-footer-bg: #14242d;
  --color-accent-2: #b08247;
  --color-accent-2-light: #d8b98a;
  --color-accent-2-text: #8a6636;
  /* Text i pozadí mají lehký nádech - chladný břidlicový u písma, teplý
     u podkladu. Čistá bílá se studenou šedí působila sterilně (připomínka 8). */
  --color-text: #1b2733;
  --color-text-muted: #5d6b76;
  --color-bg: #fffdfa;
  /* Podkladové plochy jsou teplé (krémové), ne tónované brandem - viz
     dentamedika_palette_tokens() v inc/theme-colors.php. */
  --color-bg-alt: #faf5ec;
  --color-border: #e7e1d7;
  --color-accent: #d80d0d;
  --color-gray: #b9b9b9;

  --font-base: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

  --container-width: 1180px;
  --radius: 10px;
  --space-1: 0.5rem;
  --space-2: 1rem;
  --space-3: 1.5rem;
  --space-4: 2.5rem;
  --space-5: 4rem;
}

/* ==========================================================================
   2. Reset
   ========================================================================== */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: var(--font-base);
  color: var(--color-text);
  background: var(--color-bg);
  line-height: 1.65;
  font-size: 1.0625rem;
}
img { max-width: 100%; height: auto; display: block; }
hr, table, iframe { max-width: 100%; }
a { color: var(--color-primary-dark); text-decoration: underline; text-decoration-color: color-mix(in srgb, currentColor 35%, transparent); text-underline-offset: 0.15em; }
a:hover { color: var(--color-primary); }
h1, h2, h3, h4 { font-weight: 700; line-height: 1.25; color: var(--color-text); }
h1 { font-size: clamp(1.9rem, 3vw, 2.6rem); }
h2 { font-size: clamp(1.5rem, 2.4vw, 2rem); }
h3 { font-size: 1.25rem; }
table { border-collapse: collapse; width: 100%; }
table td, table th { border: 1px solid var(--color-border); padding: 0.5em 0.75em; text-align: left; }
.screen-reader-text {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}
.skip-link {
  position: absolute; left: 0; top: -3rem; background: var(--color-primary-dark);
  color: #fff; padding: 0.75em 1.25em; z-index: 1000; transition: top 0.15s ease;
}
.skip-link:focus { top: 0; }

/* ==========================================================================
   3. Layout
   ========================================================================== */
.container {
  width: 100%;
  max-width: var(--container-width);
  margin-inline: auto;
  padding-inline: var(--space-2);
}

/* Header */
.site-header {
  border-bottom: 1px solid var(--color-border);
  background: #fff;
  position: sticky;
  top: 0;
  z-index: 100;
}
.site-header__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  padding-block: 1.1rem;
}
.site-branding { display: flex; align-items: center; gap: 0.75rem; text-decoration: none; }
.site-branding img.custom-logo,
.site-branding__logo { height: auto; max-height: 64px; width: auto; max-width: 100%; }
.site-branding__text { display: flex; flex-direction: column; line-height: 1.2; }
.site-branding__name { font-weight: 800; font-size: 1.25rem; color: var(--color-text); }
.site-branding__tagline { font-size: 0.78rem; color: var(--color-text-muted); }

/* Logo a vizitka drží u sebe jako jeden celek; zbytek hlavičky (oznámení, telefon)
   se od nich odsazuje. */
/* flex: none - logo s vizitkou se nikdy nesmršťují pod svůj obsah, jinak by je
   provozní oznámení vedle nich přetékalo. Zbylý prostor si bere oznámení. */
.site-header__brand { display: flex; align-items: center; gap: 1.35rem; flex: none; }

/* Vizitka vedle loga - každý údaj na vlastním řádku, zarovnané doleva, oddělené
   od loga svislou linkou. Údaje nemají stejnou váhu: první nese brand barvu
   a hlavní sdělení, další jsou doplňkové. */
/* Vizitka je od 2. kola připomínek jen dvouřádková (bez „DentaMedika.cz“),
   takže si může dovolit o něco větší písmo než dřív. */
.site-header__name {
  display: block; margin: 0; min-width: 0; position: relative; padding-left: 1.35rem;
  text-align: left; line-height: 1.3; text-decoration: none;
  font-size: clamp(0.95rem, 1.2vw, 1.15rem);
}
.site-header__name::before {
  content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%);
  width: 1px; height: 100%; min-height: 2.6rem;
  background: color-mix(in srgb, var(--color-primary) 40%, transparent);
}
.site-header__name span { display: block; }
.site-header__name span:first-child {
  font-weight: 700; color: var(--color-primary-dark);
  letter-spacing: 0.01em;
}
/* Doplňkové údaje ustupují barvou i o něco menším písmem. */
.site-header__name span + span {
  font-weight: 500; color: var(--color-text-muted);
  font-size: 0.9em;
}

.site-header__nav-bar {
  background: var(--color-bg-alt);
  border-block: 1px solid var(--color-border);
}
.site-header__nav-inner {
  display: flex; align-items: center; gap: var(--space-3);
}
.primary-nav { flex: 1; min-width: 0; }

.primary-nav > ul {
  list-style: none; display: flex; flex-wrap: wrap; gap: 0.2rem 2rem;
  margin: 0; padding: 0;
}
.primary-nav li { position: relative; }
.primary-nav > ul > li.nav-item-right { margin-left: auto; }
.primary-nav a {
  display: block; text-decoration: none; color: var(--color-text); font-weight: 600; font-size: 0.95rem;
  padding: 0.9em 0.2em; border-bottom: 2px solid transparent;
}
.primary-nav > ul > li > a:hover,
.primary-nav .current-menu-item > a, .primary-nav .current-menu-ancestor > a {
  color: var(--color-primary-dark); border-bottom-color: var(--color-primary);
}
/* Rozbalovací panel - výchozí (jednoduchý, jeden sloupec odkazů) */
.primary-nav .sub-menu {
  list-style: none; margin: 0; padding: 0.5rem 0;
  display: none;
  position: absolute; left: 0; top: 100%; min-width: 260px; z-index: 50;
  background: #fff; border: 1px solid var(--color-border); border-radius: 10px;
  box-shadow: 0 16px 32px rgba(53,53,53,0.1);
}
.primary-nav li:hover > .sub-menu,
.primary-nav li:focus-within > .sub-menu {
  display: block;
}
.primary-nav .sub-menu a { padding: 0.55em 1.1em; font-weight: 500; white-space: nowrap; border-bottom: 0; }
.primary-nav .sub-menu a:hover { background: var(--color-bg-alt); color: var(--color-primary-dark); }
.primary-nav .menu-item-has-children > a::after { content: ' ▾'; font-size: 0.75em; opacity: 0.55; margin-left: 0.15em; }
/* Odkaz na samotnou nadřazenou stránku, doplněný do panelu (viz inc/nav-menu.php).
   Odliší se vahou a linkou, aby bylo poznat, že nejde o „další“ podstránku. */
.primary-nav .nav-item-overview > a { font-weight: 700; }
.primary-nav .sub-menu > .nav-item-overview {
  border-bottom: 1px solid var(--color-border); padding-bottom: 0.35rem; margin-bottom: 0.35rem;
}

/* Mega panel - víceslopcové kategorie (Výplně a protetika, Chirurgie a implantáty) */
.primary-nav .mega-menu > .sub-menu {
  display: none;
  padding: 1.75rem;
  min-width: 460px;
  white-space: normal;
}
.primary-nav .mega-menu:hover > .sub-menu,
.primary-nav .mega-menu:focus-within > .sub-menu {
  display: flex;
  gap: 2.75rem;
}
/* Sloupec = přímé dítě mega panelu, které má vlastní pod-seznam */
.primary-nav .mega-menu > .sub-menu > .menu-item-has-children {
  flex: 1 1 180px; min-width: 180px;
}
.primary-nav .mega-menu > .sub-menu > .menu-item-has-children > a {
  padding: 0 0 0.5rem; margin-bottom: 0.65rem; font-size: 0.8rem;
  text-transform: uppercase; letter-spacing: 0.04em; color: var(--color-text);
  border-bottom: 3px solid var(--color-primary-light); display: inline-block;
}
.primary-nav .mega-menu > .sub-menu > .menu-item-has-children > a::after { content: none; }
/* Vnořený sloupcový seznam (skutečné odkazy) - už není samostatný popout, jen prostý sloupec */
.primary-nav .mega-menu .sub-menu .sub-menu {
  position: static; display: block; padding: 0; margin: 0; border: 0; box-shadow: none; background: none;
  min-width: 0;
}
.primary-nav .mega-menu .sub-menu .sub-menu a { padding: 0.4em 0; white-space: normal; }
.primary-nav .mega-menu .sub-menu .sub-menu a:hover { background: none; padding-left: 0.4em; }

/* Mřížka - Technologie a vybavení (ploché položky, bez podnadpisů) */
.primary-nav .mega-grid > .sub-menu {
  display: none;
  padding: 1.5rem 1.75rem;
  min-width: 0;
}
.primary-nav .mega-grid:hover > .sub-menu,
.primary-nav .mega-grid:focus-within > .sub-menu {
  display: grid;
  grid-template-columns: repeat(3, max-content);
  gap: 0.6rem 2.25rem;
}
.primary-nav .mega-grid .sub-menu a {
  padding: 0.3em 0.5em; border-radius: 8px; white-space: nowrap;
}
/* Odkaz na nadřazenou stránku stojí nad mřížkou, ne v jejím prvním sloupci. */
.primary-nav .mega-grid > .sub-menu > .nav-item-overview { grid-column: 1 / -1; }
.primary-nav .mega-grid .sub-menu a:hover { background: var(--color-bg-alt); }

/* Přepínač menu stojí na řádku s logem (viz header.php); na širokém displeji
   se skryje, protože tam je menu vypsané v pruhu pod hlavičkou. */
.nav-toggle {
  display: none;
  background: var(--color-primary-dark);
  color: #fff; border: 0; border-radius: 8px; padding: 0.65em 1em; font-size: 0.95rem; font-weight: 700;
  cursor: pointer;
}
.nav-toggle:hover { background: var(--color-primary-deep); color: #fff; }
.nav-toggle__icon, .nav-toggle__icon::before, .nav-toggle__icon::after {
  display: block; width: 18px; height: 2px; background: currentColor; border-radius: 2px; transition: transform 0.2s ease, opacity 0.2s ease;
}
.nav-toggle__icon { position: relative; }
.nav-toggle__icon::before, .nav-toggle__icon::after { content: ''; position: absolute; left: 0; }
.nav-toggle__icon::before { top: -6px; }
.nav-toggle__icon::after { top: 6px; }
.nav-toggle[aria-expanded="true"] .nav-toggle__icon { background: transparent; }
.nav-toggle[aria-expanded="true"] .nav-toggle__icon::before { top: 0; transform: rotate(45deg); }
.nav-toggle[aria-expanded="true"] .nav-toggle__icon::after { top: 0; transform: rotate(-45deg); }

.header-cta {
  display: inline-flex; align-items: center; gap: 0.45em; flex: none;
  background: var(--color-primary-dark); color: #fff;
  border-radius: 999px; padding: 0.55em 1.3em; font-weight: 700; text-decoration: none;
  white-space: nowrap;
}
.header-cta:hover { background: var(--color-primary-deep); color: #fff; }
/* Sluchátko je na širokém displeji jen doplněk čísla, proto menší než v obsahu. */
.header-cta__icon { width: 18px; height: 18px; flex: none; }

/* Provozní oznámení (dovolená, zástup) - v hlavičce mezi vizitkou a telefonem,
   aby ho pacient viděl na každé stránce. Bez oznámení hlavička vypadá jako dřív.
   --notice-color / --notice-strong dodává šablona podle Nastavení → Provozní
   oznámení; bez vlastní volby se použije základní barva webu. */
.site-notice {
  --notice-color: var(--color-primary);
  --notice-strong: var(--color-primary-deep);
  /* flex-grow: 1 - hláška vyplní celý volný prostor mezi vizitkou a telefonem,
     ať je text krátký nebo dlouhý. */
  flex: 1 1 auto; min-width: 0;
  display: flex; align-items: flex-start; gap: 0.55rem;
  padding: 0.6rem 0.9rem; border-radius: 10px;
  background: color-mix(in srgb, var(--notice-color) 10%, #fff);
  border-left: 3px solid var(--notice-color);
  font-size: 0.85rem; line-height: 1.4;
}
.site-notice__icon { flex: none; display: flex; color: var(--notice-strong); margin-top: 0.1em; }
.site-notice__body { min-width: 0; }
.site-notice__title { display: block; color: var(--notice-strong); }
.site-notice__text { display: block; color: var(--color-text); }
.site-notice__text a { color: var(--notice-strong); }
/* Křížek pro skrytí hlášky – dostatečně velká plocha pro prst (44 px), ale
   opticky nenápadný, aby nekonkuroval samotnému sdělení. */
.site-notice__close {
  flex: none; align-self: flex-start;
  display: flex; align-items: center; justify-content: center;
  width: 1.9rem; height: 1.9rem; margin: -0.25rem -0.35rem -0.25rem 0.25rem;
  padding: 0; border: 0; border-radius: 50%;
  background: transparent; color: var(--notice-strong);
  font-size: 0.85rem; line-height: 1; cursor: pointer;
}
.site-notice__close:hover { background: color-mix(in srgb, var(--notice-color) 20%, transparent); }

@media (max-width: 900px) {
  /* Hlavička je sticky, takže na malém displeji drží jediný řádek: logo, vizitka
     a vpravo přepínač menu. Telefon z hlavičky mizí - číslo je pořád po ruce ve
     spodní liště (viz .mobile-cta). Oznámení dostane vlastní řádek přes celou šířku. */
  .site-header__top { flex-wrap: wrap; row-gap: 0.6rem; gap: 0.75rem; padding-block: 0.6rem; }
  /* Základ 0 (ne auto) - jinak by si vizitka nárokovala celou šířku řádku
     a přepínač menu by spadl pod ni na vlastní řádek. */
  .site-header__brand { gap: 0.7rem; flex: 1 1 0; min-width: 0; }
  .site-branding img.custom-logo,
  .site-branding__logo { max-height: 40px; }
  .site-header__name { padding-left: 0.7rem; font-size: 0.85rem; line-height: 1.25; }
  .site-header__name::before { min-height: 2rem; }
  .site-notice { order: 3; flex-basis: 100%; }
  .header-cta { display: none; }

  /* Pruh pod hlavičkou je na mobilu jen schránka pro rozbalené menu - dokud je
     zavřené, nesmí zabírat ani pixel. */
  .site-header__nav-bar { background: transparent; border-block: 0; padding-block: 0; }
  .site-header__nav-inner { flex-wrap: wrap; padding-inline: var(--space-2); }
  .nav-toggle {
    display: flex; align-items: center; justify-content: center; gap: 0.5em;
    flex: none; min-height: 40px; padding: 0.4em 0.9em; font-size: 0.88rem;
  }

  .primary-nav {
    display: none; flex: 0 0 100%; width: 100%;
    max-height: calc(100vh - 130px); overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }
  .primary-nav.is-open {
    display: block; background: #fff; margin-block: 0 0.75rem;
    border: 1px solid var(--color-border); border-radius: var(--radius);
    box-shadow: 0 12px 28px rgba(53,53,53,0.12);
  }
  .primary-nav > ul { flex-direction: column; gap: 0; padding-block: 0.4rem; }
  .primary-nav > ul > li.nav-item-right { margin-left: 0; }
  .primary-nav li { border-top: 1px solid var(--color-border); }
  .primary-nav > ul > li:first-child { border-top: 0; }
  .primary-nav a { padding: 0.85em 1rem; min-height: 44px; display: flex; align-items: center; }

  /* Vsechny podnabidky jsou po rozbaleni Menu rovnou videt - zadne dalsi rozbalovani */
  .primary-nav .sub-menu,
  .primary-nav .mega-menu > .sub-menu, .primary-nav .mega-grid > .sub-menu,
  .primary-nav li:hover > .sub-menu, .primary-nav li:focus-within > .sub-menu,
  .primary-nav .mega-menu:hover > .sub-menu, .primary-nav .mega-menu:focus-within > .sub-menu,
  .primary-nav .mega-grid:hover > .sub-menu, .primary-nav .mega-grid:focus-within > .sub-menu {
    display: block; position: static; border: 0; box-shadow: none; background: var(--color-bg-alt);
    min-width: 0; gap: 0; width: 100%;
  }
  .primary-nav .sub-menu a { padding-left: 2rem; }
  .primary-nav .mega-menu > .sub-menu > .menu-item-has-children { flex: none; }
  .primary-nav .mega-menu > .sub-menu > .menu-item-has-children > a {
    padding: 0.85em 1rem 0.4em; margin: 0; border-bottom: 1px solid var(--color-border); display: flex;
  }
  .primary-nav .mega-menu .sub-menu .sub-menu a { padding-left: 2rem; }
}

/* Úzký telefon - hlavička musí ukrojit z viewportu co nejmíň. Vizitka zůstává
   dvouřádková (od 2. kola připomínek už nenese třetí údaj), přepínač menu se
   smrskne na samotnou ikonu; popisek zůstává v DOM pro čtečky obrazovky. */
@media (max-width: 640px) {
  .site-header__top { gap: 0.5rem; padding-block: 0.5rem; }
  .site-header__brand { gap: 0.45rem; }
  .site-branding img.custom-logo,
  .site-branding__logo { max-height: 34px; }

  .site-header__name { padding-left: 0.5rem; font-size: 0.78rem; line-height: 1.3; letter-spacing: 0; }
  .site-header__name::before { min-height: 1.9rem; }

  .nav-toggle { width: 44px; height: 44px; min-height: 44px; padding: 0; gap: 0; }
  .nav-toggle__label {
    position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0;
  }
}

/* Nejužší displeje (do ~380 px) - vizitka se vejde jen menším písmem. */
@media (max-width: 380px) {
  .site-branding img.custom-logo,
  .site-branding__logo { max-height: 30px; }
  .site-header__name { font-size: 0.72rem; padding-left: 0.4rem; }
}

/* Nízký viewport (telefon nebo tablet na šířku). Sticky hlavička by ve výchozí
   velikosti sebrala skoro třetinu obrazovky, proto se všechno stlačí. */
@media (orientation: landscape) and (max-height: 560px) {
  .site-header__top { padding-block: 0.35rem; }
  .site-branding img.custom-logo,
  .site-branding__logo { max-height: 32px; }
  .site-header__name { font-size: 0.78rem; line-height: 1.25; }
  .site-header__name::before { min-height: 1.9rem; }
  .site-notice { padding: 0.35rem 0.7rem; font-size: 0.78rem; }
  .header-cta { padding: 0.35em 1em; }
  .primary-nav a { padding-block: 0.5em; font-size: 0.88rem; }
  .nav-toggle { min-height: 38px; height: 38px; padding-block: 0.4em; }
  /* Rozbalené menu se musí vejít pod hlavičku a rolovat, ne přetéct přes patu. */
  .primary-nav { max-height: calc(100dvh - 96px); overflow-y: auto; }
}

/* Hero (front page) - hlavní barevná plocha webu.
   Plocha byla plochá a jednolitá (připomínka č. 7), proto ji rozbíjí tři vrstvy:
   měkké nasvícení vpravo nahoře, ztmavení v protilehlém rohu a jemný rastr teček.
   Všechny pracují jen s odstíny brandu a bílou o nízké průhlednosti, takže bílý
   text na nich drží kontrast i v nejsvětlejším místě. */
.hero {
  position: relative;
  isolation: isolate;
  background:
    radial-gradient(90% 120% at 88% 8%, color-mix(in srgb, var(--color-primary-dark) 85%, transparent), transparent 62%),
    radial-gradient(70% 90% at 0% 100%, color-mix(in srgb, var(--color-footer-bg) 55%, transparent), transparent 65%),
    linear-gradient(135deg, var(--color-primary-dark), var(--color-primary-deep));
  color: #fff;
  padding-block: var(--space-5);
}
.hero::before {
  content: "";
  position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background-image: radial-gradient(circle, rgba(255, 255, 255, 0.055) 1px, transparent 1px);
  background-size: 22px 22px;
}
.hero__inner {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 420px);
  gap: var(--space-4); align-items: center;
}
.hero h1 { margin-block-start: 0; color: #fff; }
.hero__lead { font-size: 1.15rem; color: rgba(255,255,255,0.88); max-width: 42em; }
.hero__actions { display: flex; gap: 1rem; flex-wrap: wrap; margin-top: var(--space-3); }
.hero__media { position: relative; }
.hero__media img {
  width: 100%; height: auto; border-radius: var(--radius);
  box-shadow: 0 24px 48px rgba(0,0,0,0.25);
}
/* Bublina přes pravý dolní roh fotky (Nastavení → Úvodní stránka). */
.hero__badge {
  position: absolute; right: 0.85rem; bottom: 0.85rem; z-index: 1;
  display: flex; align-items: center; gap: 0.15rem;
  background: #fff; color: var(--color-primary-deep);
  border-radius: 999px; padding: 0.35rem 0.5rem 0.35rem 0.9rem;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.28);
  font-size: 0.9rem; font-weight: 700; line-height: 1.3;
}
.hero__badge-link {
  display: inline-flex; align-items: center; gap: 0.45em;
  color: inherit; text-decoration: none;
}
a.hero__badge-link:hover { color: var(--color-primary-dark); text-decoration: underline; }
.hero__badge .dm-icon { flex: none; color: var(--color-accent-2-text); }
/* Tlačítka v hero jsou na barevném podkladu - obrácený kontrast (bílá plocha, brand text) */
.hero .btn--primary { background: #fff; color: var(--color-primary-deep); }
.hero .btn--primary:hover { background: rgba(255,255,255,0.88); color: var(--color-primary-deep); }
.hero .btn--phone { background: transparent; color: #fff; border-color: rgba(255,255,255,0.7); }
.hero .btn--phone:hover { background: rgba(255,255,255,0.14); color: #fff; border-color: #fff; }

@media (max-width: 800px) {
  .hero__inner { grid-template-columns: 1fr; }
  .hero__media { order: -1; }
}
/* Na úzkém displeji se tři tlačítka do řádku nevejdou. „Objednat se“ dostane
   vlastní řádek a „Napište nám“ + „Nový pacient“ zůstanou vedle sebe -
   klient je chce vedle sebe i na mobilu (3. kolo připomínek, bod 1). */
@media (max-width: 640px) {
  .hero__actions .btn--primary { flex: 1 1 100%; }
  .hero__actions .btn--phone { flex: 1 1 auto; }
}
/* Používá se na <a> i na <button> (odeslání formuláře). Tlačítko si od prohlížeče
   nese vlastní rámeček a písmo, proto je nutné je explicitně srovnat s odkazy. */
.btn {
  /* Flex kvůli ikoně vedle textu (telefon) - inline-block by ji nechal na
     účaří písma a ikona pak nesedí svisle na střed tlačítka. */
  display: inline-flex; align-items: center; justify-content: center; gap: 0.5em;
  padding: 0.75em 1.5em; border-radius: 999px;
  text-decoration: none; cursor: pointer;
  border: 0; -webkit-appearance: none; appearance: none;
  font: inherit; font-weight: 700; line-height: inherit;
}
.btn--primary { background: var(--color-primary-dark); color: #fff; }
.btn--primary:hover { background: var(--color-primary-deep); color: #fff; }
.btn--ghost { border: 2px solid var(--color-primary); color: var(--color-primary-dark); }

.telefon-odkaz {
  display: inline-block; font-size: 1.4rem; font-weight: 800;
  color: var(--color-primary-dark); text-decoration: none;
}
.telefon-odkaz:hover { color: var(--color-primary); }

/* Main content area */
.site-main { padding-block: var(--space-4); }
/* Hero má vlastní barevné pozadí a má navazovat hned pod hlavičkou, bez bílé mezery */
.site-main:has(> .hero:first-child) { padding-top: 0; }
/* ...ale obsah/sidebar POD hero potřebuje vlastní odstup, jinak by mu "lepil" na dělicí čáru */
.hero + .container { padding-top: var(--space-4); }
.content-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 300px;
  gap: var(--space-4);
  align-items: start;
}
.content-layout.no-sidebar { grid-template-columns: minmax(0, 1fr); }
@media (max-width: 800px) {
  .content-layout { grid-template-columns: minmax(0, 1fr); }
}

.entry-content { max-width: 72ch; }
.entry-content.wide { max-width: none; }
/* Titulek stránky nese stejný barevný akcent jako nadpisy sekcí na úvodní stránce. */
.entry-content > h1:first-child::after {
  content: ""; display: block; width: 3.5rem; height: 4px; border-radius: 999px;
  background: var(--color-accent-2); margin-top: 0.7rem;
}
/* Prezentační utility třídy pro obsah - nahrazují inline styly z migrace (obsah tak
   nese jen class, hodnoty jsou centralizované zde). Nadpisy nemají třídu → default vlevo,
   velikost dle theme. */
.entry-content .text-center { text-align: center; }
.entry-content .text-justify { text-align: justify; }
.entry-content .text-right { text-align: right; }
/* Zarovnání nastavené v editoru musí přebít starou migrační třídu. Migrovaný
   obsah nese .text-center/.text-right z původního webu; když pak redaktor v
   editoru zarovnání změní, WordPress přidá jen svou has-text-align-* třídu a
   ta stará v obsahu zůstane. Bez těchto pravidel má stejnou specificitu (0,2,0)
   a rozhoduje pořadí v souboru → vyhrála by migrační třída a změna z editoru by
   se na webu vůbec neprojevila (a v editoru přitom vypadala správně). */
.entry-content .has-text-align-left { text-align: left; }
.entry-content .has-text-align-center { text-align: center; }
.entry-content .has-text-align-right { text-align: right; }
.entry-content .has-text-align-justify { text-align: justify; }
.entry-content .c-green { color: var(--color-primary-dark); }
.entry-content .c-red { color: #cc0000; }
.entry-content .c-white { color: #ffffff; }
.entry-content .c-gray { color: #707070; }
.entry-content .bg-green { background-color: var(--color-primary-dark); padding: 0.05em 0.3em; }
.entry-content .fs-lg { font-size: 1.5rem; }
/* Obrázky ze scrapu nesou původní inline float/align/rozměry (staré obtékání textem) -
   přebito na jednotné zarovnání na střed (!important nutné, inline styly mají jinak přednost).

   Mezery jsou záměrně nesymetrické: velký odstup NAD obrázkem odděluje jednotlivé
   kroky/případy, malý POD ním drží popisek u jeho fotky (migrovaný obsah popisky
   nemá jako <figcaption>, jsou to samostatné odstavce hned pod obrázkem). */
.entry-content img {
  border-radius: var(--radius);
  display: block !important;
  float: none !important;
  margin: var(--space-4) auto var(--space-1) !important;
  max-width: 100% !important;
  height: auto !important;
}
/* Popisek hned pod obrázkem se k němu přimkne, ať je zřejmé, ke které fotce patří.
   Odsazení musí sedět na odstavci i na obrázku uvnitř - jinak si vlastní mezeru
   prosadí ten z nich, který ji má větší (slučování vnějších okrajů).

   Druhá větev pokrývá obrázek zabalený v inline značce - `<a><img></a>`
   (proklikávací fotky), ale i `<em>`/`<strong>`/`<span>`, což migrovaný obsah
   ze starého webu používá běžně. Bez ní se pravidlo netrefilo (míří na `p > img`)
   a popisek zůstal odsazený o celý --space-4 místo 0.5rem. */
.entry-content p:has(> img:only-child),
.entry-content p:has(> :only-child > img:only-child) {
  margin-top: var(--space-4);
  margin-bottom: 0.5rem;
}
.entry-content p:has(> img:only-child) > img,
.entry-content p:has(> :only-child > img:only-child) > * > img { margin-block: 0 !important; }
.entry-content p:has(> img:only-child) + p,
.entry-content p:has(> :only-child > img:only-child) + p { margin-top: 0.5rem; }
/* Obrázky bez textu mezi sebou (typicky pár/trojice fotek jednoho případu) -
   zůstávají v řadě vedle sebe jako skupina, ne každý zvlášť pod sebou.
   Řádek staví flex s `gap`, ne okraje jednotlivých obrázků: ty se u skupin
   uvnitř <figure> přebíjely pravidlem `figure > img { margin: 0 auto }` a fotky
   se pak lepily bez mezery. Vodorovné okraje proto obrázkům ve skupině mažeme
   a odstup drží jen kontejner. Na úzkém displeji se řádek zalomí. */
.entry-content :has(> img + img) {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: flex-start;
  gap: var(--space-2);
  margin-block: var(--space-4) var(--space-1);
}
.entry-content :has(> img + img) > img {
  margin: 0 !important;
}
.entry-content .box, .entry-content .box_content { padding: 0; }
/* Řádky prokliknutelných miniatur (odkazy s obrázky v odstavci) - např. galerie
   kazuistik na /zubni-implantaty/. Obrázky nejsou přímé děti odstavce (jsou
   v <a>), takže na ně pravidlo pro skupiny výše nedosáhne a mezeru drží okraje.
   Půl rem z každé strany dá stejných 16 px jako `gap` u ostatních skupin. */
.entry-content p a img { display: inline-block !important; margin: 0.5rem !important; vertical-align: middle; }
/* width (ne jen max-width) - jinak si prohlížeč u hr dopočítá šířku 700px i v užším
   kontejneru a stránka jde vodorovně odtáhnout (viz např. /zubni-implantaty/sinus-lift-brno/). */
.entry-content hr { border: 0; height: 2px; background: var(--color-primary-light); width: min(700px, 100%); margin: var(--space-4) auto; }
/* Kotvy uvnitř obsahu (odkazy typu /prevence/#kaz) - bez odsazení skok skončí
   pod sticky hlavičkou. Stejný princip jako u .cenik-nadpis výše, jen obecně
   pro libovolný nadpis s id v obsahu stránky. */
.entry-content :is(h1, h2, h3, h4, h5, h6)[id] {
  scroll-margin-top: calc(var(--dm-header-height, 5rem) + 1rem);
}

/* Vyčištěné obrázky v obsahu: obtékání textem přes <figure class="alignleft/right/center">.
   Migrované stránky bez těchto tříd zůstávají na centrovaném fallbacku (výše). */
/* Obrázek s popiskem jako celek: nad blokem i pod popiskem je stejně velký odstup,
   uvnitř bloku (obrázek → popisek) zůstává mezera malá. */
.entry-content figure { margin: var(--space-4) 0; }
.entry-content figure > img { margin: 0 auto !important; }
/* Stejné "přilepení" popisku jako u prostého <p><img></p> (viz výše) - jen pro
   obrázky zabalené v <figure> (aligncenter/alignleft/alignright). Bez téhle
   větve zůstal popisek pod figure vzdálený o celý --space-4, ne 0.5rem. */
.entry-content figure:has(+ p) { margin-bottom: 0.5rem; }
.entry-content figure + p { margin-top: 0.5rem; }
.entry-content .alignleft, .entry-content .alignright { width: 320px; max-width: 44%; }
.entry-content .alignleft { float: left; clear: left; margin: 0.3em var(--space-3) var(--space-3) 0; }
.entry-content .alignright { float: right; clear: right; margin: 0.3em 0 var(--space-3) var(--space-3); }
.entry-content .alignleft img, .entry-content .alignright img { width: 100%; margin: 0 !important; }
.entry-content .aligncenter { text-align: center; margin-inline: auto; }
/* Popisek z bloku Obrázek (<figcaption>) musí vypadat stejně jako popisky
   z migrace, které jsou v obsahu jako samostatný odstavec <em> na střed.
   Dřív byl menší (0.85rem) a tlumený, takže stránka vytvořená v editoru
   působila "jiným fontem" než zbytek webu. Velikost i barva proto dědí z textu,
   odlišuje ho jen kurzíva a zarovnání na střed. */
.entry-content figcaption {
  font-size: inherit; color: inherit; font-style: italic;
  text-align: center; margin-top: 0.5rem;
}
.entry-content::after { content: ""; display: block; clear: both; }
@media (max-width: 600px) {
  .entry-content .alignleft, .entry-content .alignright { float: none; width: auto; max-width: 100%; margin: 0 auto var(--space-3); }
}

/* Vložené YouTube video jako "facade" (náhled + přehrát; přehrávač se načte až po kliknutí) */
.dm-video { position: relative; clear: both; max-width: 560px; margin: 0 auto var(--space-3); }
.dm-video__btn {
  display: block; width: 100%; padding: 0; border: 0; cursor: pointer; background: #000;
  border-radius: var(--radius); overflow: hidden; position: relative; aspect-ratio: 16 / 9;
}
.dm-video__poster {
  width: 100%; height: 100%; object-fit: cover; display: block; opacity: 0.92;
  transition: opacity 0.2s ease, transform 0.4s ease;
}
.dm-video__btn:hover .dm-video__poster, .dm-video__btn:focus-visible .dm-video__poster { opacity: 1; transform: scale(1.03); }
.dm-video__play {
  position: absolute; inset: 0; margin: auto; width: 4.2rem; height: 4.2rem;
  display: grid; place-items: center; border-radius: 50%;
  background: rgba(0, 0, 0, 0.55); transition: background 0.2s ease;
}
.dm-video__btn:hover .dm-video__play, .dm-video__btn:focus-visible .dm-video__play { background: var(--color-primary); }
.dm-video__play::before {
  content: ""; width: 0; height: 0; margin-left: 0.35rem;
  border-style: solid; border-width: 0.82rem 0 0.82rem 1.35rem; border-color: transparent transparent transparent #fff;
}
.dm-video__btn:focus-visible { outline: 2px solid var(--color-primary-dark); outline-offset: 2px; }
.dm-video iframe { display: block; width: 100%; aspect-ratio: 16 / 9; height: auto; border: 0; border-radius: var(--radius); }
@media (prefers-reduced-motion: reduce) {
  .dm-video__poster { transition: none; }
  .dm-video__btn:hover .dm-video__poster, .dm-video__btn:focus-visible .dm-video__poster { transform: none; }
}

/* modernTable ze scrapu je vždy jen dekorativní 1x1 obalový box kolem titulku
   stránky (staré HTML tabulkové rozvržení) - nikdy skutečná datová tabulka.
   Zrušit fixní pixelovou šířku a vzhled tabulky, nechat plout na celou šířku. */
.entry-content table.modernTable {
  width: 100% !important;
  height: auto !important;
  margin: 0 0 var(--space-3);
}
.entry-content table.modernTable td,
.entry-content table.modernTable th {
  border: 0; padding: 0;
}

/* Skutečné datové tabulky v obsahu (např. Zásady cookies) – vodorovný scroll na mobilu */
.entry-content .table-scroll { overflow-x: auto; margin: var(--space-2) 0 var(--space-3); }
.entry-content .table-scroll table { min-width: 34rem; }
.entry-content .table-scroll th,
.entry-content .table-scroll td {
  border: 1px solid var(--color-border);
  padding: 0.6rem 0.8rem; text-align: left; vertical-align: top; font-size: 0.95rem;
}
.entry-content .table-scroll thead th {
  background: color-mix(in srgb, var(--color-primary) 10%, #fff); font-weight: 700;
}
.entry-content .table-scroll tbody tr:nth-child(even) td { background: color-mix(in srgb, var(--color-bg-alt) 55%, #fff); }

.breadcrumbs {
  font-size: 0.85rem; color: var(--color-text-muted); margin-bottom: var(--space-2);
}
.breadcrumbs a { color: inherit; text-decoration: none; }
.breadcrumbs a:hover { text-decoration: underline; }
.breadcrumbs [aria-current] { color: var(--color-text); font-weight: 600; }

.child-pages { list-style: none; margin: var(--space-3) 0 0; padding: 0; }
.child-pages li { margin: 0.4rem 0; padding-left: 1.2em; position: relative; }
.child-pages li::before { content: "›"; position: absolute; left: 0; color: var(--color-primary); font-weight: 700; }
.child-pages a { font-weight: 600; }

/* Rozcestník odkazů s ikonami (v obsahu) - např. Protetika */
.entry-content .icon-links {
  list-style: none; margin: var(--space-3) 0 0; padding: 0;
  display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: var(--space-2) var(--space-3);
}
.entry-content .icon-links li { margin: 0; }
.entry-content .icon-links a { display: flex; align-items: center; gap: 0.85rem; text-decoration: none; font-weight: 600; color: var(--color-primary-dark); }
.entry-content .icon-links a:hover { color: var(--color-primary); }
.entry-content .icon-links a:hover span { text-decoration: underline; }
.entry-content .icon-links img { flex: none; width: 60px; height: 60px; object-fit: cover; border-radius: 8px; margin: 0 !important; }

/* Životopis lékaře (/zubari-brno/mudr-tomas-sojka/) */
.entry-content .cv-lead { margin-top: 0; color: var(--color-text-muted); font-weight: 600; }
.entry-content .cv-portrait { max-width: 240px; }
/* Vzdělání a praxe - dvousloupcová osa, roky v jednom sloupci pod sebou. */
.entry-content .cv-timeline { list-style: none; margin: var(--space-3) 0; padding: 0; }
.entry-content .cv-timeline li {
  display: grid; grid-template-columns: 7.5rem minmax(0, 1fr); gap: 0.25rem 1rem;
  padding: 0.5rem 0; margin: 0;
}
.entry-content .cv-timeline li + li { border-top: 1px solid var(--color-border); }
.entry-content .cv-timeline__when { font-weight: 700; color: var(--color-primary-dark); font-variant-numeric: tabular-nums; }
/* Přes devadesát položek - dvousloupcová sazba na širokém displeji zkrátí
   stránku na polovinu a zůstane čitelná. */
.entry-content .cv-courses {
  list-style: none; margin: var(--space-3) 0; padding: 0;
  columns: 2; column-gap: var(--space-4);
}
.entry-content .cv-courses li {
  break-inside: avoid; margin: 0 0 0.85rem; padding-left: 1rem;
  position: relative; font-size: 0.95rem; line-height: 1.5;
}
.entry-content .cv-courses li::before {
  content: ""; position: absolute; left: 0; top: 0.62em;
  width: 5px; height: 5px; border-radius: 50%; background: var(--color-primary);
}
@media (max-width: 800px) {
  .entry-content .cv-courses { columns: 1; }
  .entry-content .cv-timeline li { grid-template-columns: minmax(0, 1fr); }
  .entry-content .cv-portrait { float: none; max-width: 200px; margin-inline: auto; }
}

/* Sidebar */
.sidebar { font-size: 0.92rem; }
.sidebar-widget { background: var(--color-bg-alt); border-radius: var(--radius); padding: var(--space-3); margin-bottom: var(--space-3); border: 1px solid var(--color-border); }
.sidebar-widget h2 { font-size: 1rem; margin: 0; }
.sidebar-widget h2 a { color: var(--color-text); text-decoration: none; display: block; }
.sidebar-widget h2 a:hover { color: var(--color-primary-dark); }
.sidebar-map { margin-block: var(--space-3); border-radius: var(--radius); overflow: hidden; }
.sidebar-map iframe { display: block; width: 100%; height: 220px; border: 0; }

/* Menu v postranním sloupci - dřív tři samostatné boxy s jedním nadpisem-odkazem.
   Odkazy si drží váhu původních nadpisů, aby v sloupci nezapadly. */
.sidebar-menu ul { list-style: none; margin: 0; padding: 0; }
.sidebar-menu li + li { border-top: 1px solid var(--color-border); }
.sidebar-menu a {
  display: block; padding: 0.6em 0; font-size: 1rem; font-weight: 700;
  color: var(--color-text); text-decoration: none;
}
.sidebar-menu a:hover { color: var(--color-primary-dark); }
.sidebar-menu li:first-child a { padding-top: 0; }
.sidebar-menu li:last-child a { padding-bottom: 0; }

/* Aktuality v postranním sloupci - titulek a pod ním datum. */
.sidebar-news { list-style: none; margin: var(--space-2) 0 var(--space-2); padding: 0; }
.sidebar-news li + li { margin-top: 0.7rem; padding-top: 0.7rem; border-top: 1px solid var(--color-border); }
.sidebar-news a { font-weight: 600; text-decoration: none; }
.sidebar-news a:hover { text-decoration: underline; }
.sidebar-news time { display: block; font-size: 0.8rem; color: var(--color-text-muted); }
.sidebar-news + p { margin-bottom: 0; }

.opening-hours { list-style: none; margin: 0; padding: 0; max-width: 18rem; }
.opening-hours li { display: grid; grid-template-columns: 2.75rem 1fr; gap: 0.9rem; padding: 0.35rem 0; }
.opening-hours li + li { border-top: 1px solid color-mix(in srgb, currentColor 15%, transparent); }
.opening-hours li span:first-child { font-weight: 700; }
.opening-hours li span:last-child { font-variant-numeric: tabular-nums; }

/* Blog (Články) */
.post-list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--space-3); }
.post-card { border: 1px solid var(--color-border); border-radius: var(--radius); padding: var(--space-3); }
.post-card h2 { margin-block-start: 0; font-size: 1.2rem; }
.post-card h2 a { text-decoration: none; color: var(--color-text); }
.post-meta { font-size: 0.82rem; color: var(--color-text-muted); }
.pagination { display: flex; gap: 0.5rem; margin-top: var(--space-3); }
.pagination a, .pagination span { padding: 0.4em 0.8em; border: 1px solid var(--color-border); border-radius: 6px; text-decoration: none; }

/* Footer */
.site-footer { background: var(--color-footer-bg); color: #d5dedf; margin-top: var(--space-5); border-top: 6px solid var(--color-accent-2); }
.site-footer a { color: #eee; text-decoration: none; }
.site-footer a:hover { color: var(--color-accent-2-light); text-decoration: underline; }
.footer-grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: var(--space-4);
  padding-block: var(--space-5);
}
.footer-grid h2 { color: #fff; font-size: 1rem; margin-block-start: 0; }
.footer-brand p { color: #c3cfd0; }
.footer-links { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 0.5rem; }

.social-links { list-style: none; display: flex; gap: 0.6rem; margin: var(--space-3) 0 0; padding: 0; }
.social-links a {
  display: flex; align-items: center; justify-content: center; width: 2.25rem; height: 2.25rem;
  border-radius: 50%; background: rgba(255,255,255,0.1); color: #fff;
}
.social-links a:hover { background: var(--color-primary-dark); color: #fff; }

.footer-bottom {
  border-top: 1px solid rgba(255,255,255,0.15); padding-block: var(--space-2);
  font-size: 0.8rem; color: #c3cfd0; text-align: center;
}
.footer-bottom a, .footer-bottom .link-button { color: #c3cfd0; text-decoration: underline; }
.footer-bottom .link-button {
  background: none; border: 0; cursor: pointer; padding: 0; font: inherit;
}
.footer-bottom a:hover, .footer-bottom .link-button:hover { color: #fff; }

/* Kontaktní formulář (Napište nám) */
.contact-form { max-width: 42em; }
.contact-form__row { display: flex; flex-direction: column; gap: 0.3em; margin-bottom: 1em; }
.contact-form__row label { font-weight: 600; font-size: 0.9rem; }
.contact-form__row input, .contact-form__row textarea {
  font: inherit; padding: 0.6em 0.75em; border: 1px solid var(--color-border); border-radius: 8px;
}
.contact-form__honeypot { position: absolute; left: -9999px; }
.contact-form__notice { padding: 0.8em 1em; border-radius: var(--radius); font-weight: 600; }
.contact-form__notice--success { background: color-mix(in srgb, var(--color-primary) 15%, white); color: var(--color-primary-dark); }
.contact-form__notice--error { background: color-mix(in srgb, var(--color-accent) 15%, white); color: var(--color-accent); }

/* Ankety (poll widget) */
.poll-widget { font-size: 0.88rem; }
.poll-widget h3 { font-size: 0.95rem; margin-block-start: 0; }
.poll-results { list-style: none; margin: 0; padding: 0; }
.poll-results li { margin-bottom: 0.6rem; }
.poll-vote-form { margin: 0; }
.poll-answer-link {
  background: none; border: 0; padding: 0; margin: 0; text-align: left;
  color: var(--color-primary-dark); text-decoration: underline; cursor: pointer; font: inherit;
}
.poll-answer-label { color: var(--color-text); }
.poll-bar {
  display: block; height: 6px; background: var(--color-border); border-radius: 999px;
  margin-block: 0.25rem; overflow: hidden;
}
/* Barvu pruhu dodává šablona jako --poll-bar-color (jedna barva na odpověď,
   viz dentamedika_poll_colors). Bez ní se použije základní barva webu. */
.poll-bar__fill { display: block; height: 100%; background: var(--poll-bar-color, var(--color-primary)); }
.poll-pct { color: var(--color-text-muted); font-size: 0.82rem; }
.poll-total { font-size: 0.82rem; color: var(--color-text-muted); margin-block-end: 0; }

/* Ceník - jednotné položky přes shortcode [cenik_polozka] */
.cenik-tabulka {
  border: 1px solid var(--color-border); border-radius: var(--radius);
  overflow: hidden; margin-block: var(--space-3);
}
.cenik-radek {
  display: flex; align-items: baseline; justify-content: space-between; gap: var(--space-3);
  padding: 1.1rem 1.4rem; border-bottom: 1px solid var(--color-border);
}
.cenik-tabulka > .cenik-radek:last-child { border-bottom: 0; }
.cenik-radek:nth-of-type(even) { background: color-mix(in srgb, var(--color-bg-alt) 55%, #fff); }
.cenik-radek__hlavni { flex: 1 1 auto; min-width: 0; }
.cenik-radek__nazev { font-weight: 700; margin: 0 0 0.2em; color: var(--color-text); }
.cenik-radek__popis { margin: 0 0 0.2em; color: var(--color-text-muted); font-size: 0.92rem; }
.cenik-radek__poznamka { margin: 0 0 0.2em; color: var(--color-text-muted); font-size: 0.85rem; font-style: italic; }
.cenik-radek__odkaz { margin: 0.3em 0 0; font-size: 0.88rem; }
.cenik-radek__cena {
  flex: 0 0 auto; font-weight: 800; font-size: 1.1rem; color: var(--color-primary-dark);
  white-space: nowrap; margin: 0;
}
/* Neaktivni polozka: barvy misto opacity (opacity by srazela kontrast textu pod WCAG limit) */
.cenik-radek--neaktivni .cenik-radek__nazev,
.cenik-radek--neaktivni .cenik-radek__cena,
.cenik-radek--neaktivni .cenik-radek__odkaz a { color: var(--color-text-muted); }
.cenik-badge {
  display: inline-block; font-size: 0.7rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: 0.03em; background: var(--color-bg-alt); color: var(--color-text-muted);
  border: 1px solid var(--color-border); border-radius: 999px; padding: 0.15em 0.7em; margin-left: 0.5em;
  vertical-align: middle;
}
.cenik-nadpis {
  margin: 0; padding: 0.9rem 1.4rem; background: var(--color-bg-alt);
  border-bottom: 1px solid var(--color-border); font-size: 1rem;
  /* Hlavička je sticky - bez odsazení by skok na kotvu skončil pod ní. Výšku
     hlavičky měří JS (--dm-header-height), protože roste s provozním oznámením. */
  scroll-margin-top: calc(var(--dm-header-height, 5rem) + 1rem);
}
.cenik-nadpis--varovani { color: var(--color-accent); }

/* Přehled skupin nad ceníkem (skládá ho shortcode [cenik] z názvů skupin). */
.entry-content .cenik-nav ul {
  list-style: none; margin: var(--space-3) 0; padding: 0;
  display: flex; flex-wrap: wrap; gap: 0.5rem;
}
.entry-content .cenik-nav li { margin: 0; }
.entry-content .cenik-nav a {
  display: inline-block; padding: 0.4em 0.9em;
  background: var(--color-bg-alt); border: 1px solid var(--color-border); border-radius: 999px;
  font-size: 0.9rem; font-weight: 600; color: var(--color-primary-dark); text-decoration: none;
}
.entry-content .cenik-nav a:hover, .entry-content .cenik-nav a:focus-visible {
  background: var(--color-primary-dark); border-color: var(--color-primary-dark); color: #fff;
}

@media (max-width: 560px) {
  .cenik-radek { flex-direction: column; gap: 0.3rem; }
  .cenik-radek__cena { font-size: 1.05rem; }
}

/* Homepage - kontaktni pas a ankety (drive v sidebaru, ted soucasti obsahu - homepage je bez sidebaru).
   Kontaktní pás je druhá velká barevná plocha stránky (po hero) - kotví praktické údaje. */
/* Kontaktní pás sdílí úvodní stránka a stránka Kontakt (template-parts/contact-band.php).
   Rozvržení je společné, liší se jen podklad: barevný pruh na homepage,
   světlá plocha na stránce Kontakt. */
.contact-band {
  display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-4);
  align-items: start; padding-block: var(--space-5);
}
.contact-band h2, .contact-band h3 { margin-block-start: 0; }
.contact-band__map { grid-column: 1 / -1; text-align: center; margin-top: var(--space-3); }
.contact-band__map .sidebar-map { max-width: 680px; margin: 0 auto var(--space-2); }

.home-contact-section { background: var(--color-primary-band); color: #fff; }
.home-contact-section .contact-band h2, .home-contact-section .contact-band h3 { color: #fff; }
.home-contact-section a { color: #fff; }
.home-contact-section a:hover { color: #fff; }
.home-contact-section .btn--primary { background: #fff; color: var(--color-primary-deep); text-decoration: none; }
.home-contact-section .btn--primary:hover { background: rgba(255,255,255,0.88); color: var(--color-primary-deep); }

/* Stránka Kontakt - tentýž pás na světlém podkladu, oddělený linkou od textu. */
.contact-page-band { background: var(--color-bg-alt); border-top: 1px solid var(--color-border); margin-top: var(--space-4); }
.home-polls {
  display: flex; flex-wrap: wrap; gap: var(--space-3);
  padding-block: var(--space-4); border-top: 1px solid var(--color-border);
}
.home-polls > .sidebar-widget { flex: 1 1 320px; margin-bottom: 0; }

@media (max-width: 560px) {
  .contact-band { grid-template-columns: 1fr; }
}

/* ==========================================================================
   Homepage sekce (USP, služby, hodnoty, tým, aktuality) + plovoucí prvky
   ========================================================================== */

/* Ikony */
.dm-icon { width: 1.5rem; height: 1.5rem; flex: none; }
.dm-icon--sm { width: 1.05rem; height: 1.05rem; }
.dm-icon--check { width: 1.25rem; height: 1.25rem; color: var(--color-primary-dark); }

/* Hero – doplňky (eyebrow, odrážky, tlačítko telefon) */
.hero__points { list-style: none; margin: var(--space-3) 0 0; padding: 0; display: grid; gap: 0.6rem; }
.hero__points li { display: flex; align-items: flex-start; gap: 0.6rem; font-weight: 600; }
.hero__points .dm-icon { margin-top: 0.15em; }
.hero .dm-icon--check { color: #fff; }
.btn--phone {
  border: 2px solid var(--color-primary); color: var(--color-primary-dark); background: #fff;
}
.btn--phone:hover { background: var(--color-primary-dark); color: #fff; border-color: var(--color-primary-dark); }

/* Sdílená hlavička sekce - barevná linka pod nadpisem drží brand i mimo barevné bloky */
.section-head { text-align: center; max-width: 46em; margin: 0 auto var(--space-4); }
.section-head h2 { margin: 0 0 0.4rem; }
.section-head h2::after {
  content: ""; display: block; width: 3.5rem; height: 4px; border-radius: 999px;
  background: var(--color-accent-2); margin: 0.7rem auto 0;
}
.section-head--row h2::after { margin-inline: 0; }
.section-head p { margin: 0; color: var(--color-text-muted); font-size: 1.05rem; }
.section-head--row {
  display: flex; align-items: baseline; justify-content: space-between; gap: var(--space-3);
  text-align: left; max-width: none; flex-wrap: wrap;
}
.section-head--row h2 { margin: 0; }
.home-news__all { display: inline-flex; align-items: center; gap: 0.35em; font-weight: 700; text-decoration: none; white-space: nowrap; }
.home-news__all:hover { text-decoration: underline; }

/* USP pruh */
.home-usp { background: var(--color-bg-alt); border-bottom: 1px solid var(--color-border); }
.home-usp__grid {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-3);
  padding-block: var(--space-4);
}
.home-usp__item { display: flex; align-items: flex-start; gap: 0.9rem; }
.home-usp__icon {
  flex: none; display: grid; place-items: center; width: 3rem; height: 3rem; border-radius: 50%;
  background: var(--color-primary-dark); color: #fff;
}
.home-usp__body { min-width: 0; }
.home-usp__title { margin: 0 0 0.15rem; font-weight: 700; }
.home-usp__text { margin: 0; font-size: 0.92rem; color: var(--color-text-muted); }

/* Sekce se pravidelně střídají bílá - krémová, aby stránka nebyla jednolitě
   bílá a bloky šly od sebe rozeznat (připomínka č. 8). Pořadí na úvodní stránce:
   hero (barevný) → výhody (krémová) → tým (bílá) → kontakt (barevný) →
   obsah (bílá) → služby (krémová) → proč zvolit (bílá). */
.home-services, .home-values, .home-team, .home-news { padding-block: var(--space-5); }
.home-services, .home-news { background: var(--color-bg-alt); }
.home-values { border-top: 1px solid var(--color-border); }

/* Grid služeb */
.service-grid {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-3);
}
.service-card__link {
  display: flex; align-items: flex-start; gap: 1rem; height: 100%;
  padding: 1.15rem 1.3rem; background: #fff; border: 1px solid var(--color-border);
  border-left: 4px solid var(--color-primary);
  border-radius: var(--radius); text-decoration: none; color: var(--color-text); font-weight: 700;
  transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
}
.service-card__body { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 0.3rem; }
.service-card__desc { font-weight: 400; font-size: 0.92rem; line-height: 1.5; color: var(--color-text-muted); }
.service-card__link:hover, .service-card__link:focus-visible {
  border-color: var(--color-primary); color: var(--color-primary-dark);
  box-shadow: 0 12px 24px rgba(53,53,53,0.08); transform: translateY(-2px);
}
.service-card__icon {
  flex: none; display: grid; place-items: center; width: 2.75rem; height: 2.75rem; border-radius: 12px;
  background: color-mix(in srgb, var(--color-primary) 14%, #fff); color: var(--color-primary-dark);
}
.service-card__title { display: block; }
.service-card__arrow { flex: none; color: var(--color-primary); opacity: 0; transition: opacity 0.15s ease, transform 0.15s ease; margin-top: 0.1rem; }
.service-card__link:hover .service-card__arrow, .service-card__link:focus-visible .service-card__arrow { opacity: 1; transform: translateX(2px); }

/* Proč zvolit naši ordinaci - samotné body, většina prokliknutelná. */
.values-grid {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-3);
}
.value-card {
  background: #fff; border: 1px solid var(--color-border); border-radius: var(--radius);
}
.value-card__link,
.value-card > .value-card__num {
  /* Nekliknutelný bod má stejné odsazení jako odkaz uvnitř kliknutelného. */
  padding: var(--space-3);
}
.value-card__link {
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center;
  gap: 0.25rem 1rem; height: 100%;
  text-decoration: none; color: var(--color-text);
}
.value-card:not(.value-card--link) {
  display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center;
  gap: 0.25rem 1rem; padding: var(--space-3);
}
.value-card:not(.value-card--link) > .value-card__num { padding: 0; }
.value-card__num {
  font-size: 2.2rem; font-weight: 800; line-height: 1;
  color: var(--color-accent-2); font-variant-numeric: tabular-nums;
}
.value-card__title { font-size: 1.05rem; font-weight: 700; line-height: 1.4; }
.value-card__arrow { color: var(--color-primary); opacity: 0.55; transition: opacity 0.15s ease, transform 0.15s ease; }
.value-card--link { transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease; }
.value-card--link:hover, .value-card--link:focus-within {
  border-color: var(--color-primary);
  box-shadow: 0 12px 24px rgba(53,53,53,0.08); transform: translateY(-2px);
}
.value-card--link:hover .value-card__title { color: var(--color-primary-dark); text-decoration: underline; }
.value-card--link:hover .value-card__arrow { opacity: 1; transform: translateX(2px); }
.value-card__link:focus-visible { outline: 2px solid var(--color-primary-dark); outline-offset: 2px; border-radius: var(--radius); }

/* Tým */
.team-grid {
  list-style: none; margin: 0 auto; padding: 0; max-width: 820px;
  display: flex; flex-wrap: wrap; justify-content: center; gap: var(--space-4);
}
.team-card { text-align: center; flex: 0 1 210px; }
.team-card__photo {
  aspect-ratio: 3 / 4; margin: 0 auto 1rem; max-width: 240px; border-radius: var(--radius);
  overflow: hidden; background: color-mix(in srgb, var(--color-primary) 10%, #fff);
  display: grid; place-items: center;
  position: relative;
}
/* Fotka vyplňuje rámeček přesně. Absolutní pozicování je tu schválně: procentní
   výška uvnitř mřížky s aspect-ratio se v prohlížeči nespolehlivě dopočítává
   a fotka pak z rámečku přečnívala. */
.team-card__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.team-card__ph { color: var(--color-primary); }
.team-card__ph .dm-icon { width: 3.5rem; height: 3.5rem; }
.team-card__name { margin: 0 0 0.15rem; font-size: 1.15rem; }
.team-card__role { margin: 0; color: var(--color-text-muted); font-size: 0.95rem; }
/* Fotka s prokliknutím (např. na životopis lékaře) - odkaz obaluje celou kartu,
   proto nesmí přebít barvy uvnitř; zvýraznění řeší rámeček fotky. */
.team-card__link { display: block; text-decoration: none; color: inherit; }
.team-card__link:hover { color: inherit; }
.team-card__link:hover .team-card__photo { box-shadow: 0 0 0 3px var(--color-primary); }
.team-card__link:hover .team-card__name { color: var(--color-primary-dark); text-decoration: underline; }
.team-card__link:focus-visible { outline: 3px solid var(--color-primary); outline-offset: 4px; border-radius: var(--radius); }
/* Že fotka odkazuje dál, musí být poznat i bez najetí myší - na dotykovém
   zařízení se hover nekoná (připomínka č. 16). */
.team-card__badge {
  position: absolute; right: 0.5rem; bottom: 0.5rem; z-index: 1;
  display: grid; place-items: center; width: 1.9rem; height: 1.9rem;
  border-radius: 50%; background: #fff; color: var(--color-primary-dark);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.22);
  transition: background 0.15s ease, color 0.15s ease;
}
.team-card__link:hover .team-card__badge { background: var(--color-primary-dark); color: #fff; }
.team-card__more {
  margin: 0.3rem 0 0; font-size: 0.85rem; font-weight: 600;
  color: var(--color-primary-dark); text-decoration: underline;
  text-decoration-color: color-mix(in srgb, currentColor 35%, transparent);
}
.home-team__group { text-align: center; margin: var(--space-4) 0 var(--space-3); font-size: 1.2rem; color: var(--color-primary-dark); }
.home-team__group:first-of-type { margin-top: 0; }
.home-team__more { text-align: center; margin: var(--space-4) 0 0; }

/* Aktuality */
.news-grid {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-3);
}
.news-card__link {
  display: flex; flex-direction: column; height: 100%; background: #fff;
  border: 1px solid var(--color-border); border-radius: var(--radius); overflow: hidden;
  text-decoration: none; color: var(--color-text);
  transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
}
.news-card__link:hover, .news-card__link:focus-visible {
  border-color: var(--color-primary); box-shadow: 0 12px 24px rgba(53,53,53,0.08); transform: translateY(-2px);
}
.news-card__media { display: block; aspect-ratio: 3 / 2; overflow: hidden; background: var(--color-bg-alt); }
.news-card__media img { width: 100%; height: 100%; object-fit: cover; }
.news-card__body { display: flex; flex-direction: column; gap: 0.35rem; padding: 1.1rem 1.2rem; }
.news-card__date { font-size: 0.8rem; color: var(--color-text-muted); }
.news-card__title { margin: 0; font-size: 1.05rem; font-weight: 700; }

@media (max-width: 900px) {
  .home-usp__grid { grid-template-columns: repeat(2, 1fr); gap: var(--space-3) var(--space-4); }
  .service-grid, .news-grid, .values-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
  .home-usp__grid, .service-grid, .news-grid, .values-grid, .team-grid { grid-template-columns: 1fr; }
  .section-head--row { flex-direction: column; gap: 0.4rem; }
}

/* Plovoucí „zpět nahoru“ */
/* Bílý okraj drží tlačítko viditelné i nad barevnými bloky (hero, kontaktní pás). */
.to-top {
  position: fixed; right: 1.1rem; bottom: 1.1rem; z-index: 90;
  width: 2.9rem; height: 2.9rem; border: 2px solid #fff; border-radius: 50%; cursor: pointer;
  background: var(--color-primary-dark); color: #fff; display: grid; place-items: center;
  box-shadow: 0 8px 20px rgba(53,53,53,0.25);
}
.to-top[hidden] { display: none; }
.to-top:hover { background: var(--color-primary-deep); color: #fff; }

/* Sticky mobilní lišta (Zavolat / Objednat) */
.mobile-cta { display: none; }
@media (max-width: 800px) {
  .mobile-cta {
    position: fixed; inset-inline: 0; bottom: 0; z-index: 95;
    display: grid; grid-template-columns: 1fr 1fr;
    background: #fff; border-top: 1px solid var(--color-border);
    box-shadow: 0 -4px 18px rgba(0,0,0,0.22);
  }
  .mobile-cta__btn {
    display: flex; align-items: center; justify-content: center; gap: 0.4em;
    padding: 0.9em 0.5em; font-weight: 700; text-decoration: none; min-height: 52px;
  }
  .mobile-cta__btn--call { color: var(--color-primary-dark); }
  .mobile-cta__btn--book { background: var(--color-primary-dark); color: #fff; }
  .mobile-cta .dm-icon { width: 1.2rem; height: 1.2rem; }
  /* místo pro lištu, ať nepřekrývá patičku a plovoucí tlačítko */
  body { padding-bottom: 56px; }
  .to-top { bottom: 4.5rem; }
}

/* Cookie consent */
#cookie-consent {
  position: fixed; inset-inline: 0; bottom: 0; z-index: 1000;
  background: var(--color-footer-bg); color: #fff; padding: 1.1rem 1.25rem;
  box-shadow: 0 -4px 20px rgba(0,0,0,0.2);
}
#cookie-consent[hidden] { display: none; }
.cookie-consent__inner {
  max-width: var(--container-width); margin-inline: auto; display: flex; gap: 1.25rem;
  align-items: center; flex-wrap: wrap; justify-content: space-between;
}
.cookie-consent__text { font-size: 0.88rem; max-width: 60ch; }
.cookie-consent__text a { color: var(--color-primary-light); }
.cookie-consent__actions { display: flex; gap: 0.6rem; flex-wrap: wrap; }
.cookie-consent__actions button {
  border: 0; border-radius: 999px; padding: 0.6em 1.2em; font-weight: 700; cursor: pointer;
  font-size: 0.88rem;
}
/* Na tmavém pozadí lišty je bezpečnější obrácený kontrast než brand plocha. */
#cookie-accept { background: #fff; color: var(--color-primary-deep); }
#cookie-reject { background: transparent; color: #fff; border: 1px solid #777 !important; }

/* --- Tým vložený do obsahu stránky přes [tym] (např. KONTAKT) -------------- */
.entry-content .entry-team { margin: var(--space-4) 0; }
.entry-content .entry-team .home-team__group:first-of-type { margin-top: var(--space-2); }
/* Fotky v kartách týmu nejsou obrázky v textu - obecná pravidla pro obrázky
   v obsahu (velký horní odstup, vlastní rádius) by je odsunula dolů a nad nimi
   by se ukázal pruh podkladu rámečku. Vyplňují celý rámeček, stejně jako na
   úvodní stránce. */
.entry-content .entry-team .team-card__img {
  margin: 0 !important;
  /* Přebít height:auto z obecného pravidla pro obrázky v obsahu - u absolutně
     pozicovaného obrázku se auto počítá z poměru stran, ne z rámečku. */
  height: 100% !important;
  border-radius: 0;
}

/* --- Poradna: hledání, flag ve výpisu, bloky otázka / odpověď na detailu --- */
.entry-content .poradna-search {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  margin: var(--space-3) 0;
}
.poradna-search__input {
  flex: 1 1 16rem;
  min-width: 0;
  padding: 0.6rem 0.85rem;
  font: inherit;
  color: var(--color-text);
  background: #fff;
  border: 1px solid var(--color-border);
  border-radius: var(--radius);
}
.poradna-search__input:focus-visible { outline: 2px solid var(--color-primary); outline-offset: 1px; }
.entry-content .poradna-search__meta {
  margin: 0 0 var(--space-3);
  font-size: 0.92rem;
  color: var(--color-text-muted);
}


.post-flag {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  margin: 0 0 0.5rem;
  padding: 0.28rem 0.7rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--color-primary) 14%, #fff);
  color: var(--color-primary-deep);
  font-size: 0.78rem;
  font-weight: 700;
  line-height: 1.25;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}
/* Kartu dotazu odliší i barevný pruh, aby byl flag čitelný i při skenování očima. */
.post-card.type-dm_poradna {
  border-left: 4px solid var(--color-primary);
  background: color-mix(in srgb, var(--color-primary) 3%, #fff);
}

.entry-content .qa-block { margin: var(--space-3) 0; }
.entry-content .qa-block__label {
  margin: 0 0 0.4rem;
  font-size: 0.8rem;
  font-weight: 700;
  line-height: 1.3;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--color-primary-deep);
}
.entry-content .qa-block--question {
  background: var(--color-bg-alt);
  border-left: 4px solid var(--color-primary);
  border-radius: 0 var(--radius) var(--radius) 0;
  padding: var(--space-2) var(--space-3);
}
.entry-content .qa-block--question > :last-child { margin-bottom: 0; }
.entry-content .qa-back { margin-top: var(--space-4); }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}