/* novy-2026-rozvoz.css
   Sekce rozvozu: overeni PSC, mapa oblasti, kdy a kam jidlo prijede.
   Navazuje na zs26-tokeny.css a na komponenty z novy-2026.css.

   Plati kontrakt z 25/podklady/KONTRAKT.md:
   prefix .zs26 na kazdem selektoru, jen var(--zs-*), zadny hex krome #fff,
   zadny box-shadow, breakpointy jen 700 a 1024 px, cteny text nikdy pod 16 px.

   Bez JavaScriptu zustane videt formular i seznam mest, jen se neobjevi
   odpoved a mapa. Nic se neschovava dopredu.
   ======================================================================== */

/* --- ramec sekce --------------------------------------------------------- */

.zs26 .zs26-rozvoz { display: block; }

/* Sloupec s textem je od 31. 8. 2026 kratsi (pole na PSC odeslo k mape),
   takze pri align-items: start visel nadpis nahore a pod nim zela mezera
   do vysky fotky. Text je proto vuci fotce na stredu. */
.zs26 .zs-rozvoz__hlavicka {
  display: grid;
  gap: var(--zs-odstup-xl);
  align-items: center;
}

.zs26 .zs-rozvoz__hlavicka-akce { margin: var(--zs-odstup-lg) 0 0; }

/* Nadpis se lepil na perex, sablona ma na obojim margin 0. */
.zs26 .zs-rozvoz-obal > .zs-h2,
.zs26 .zs-rozvoz__hlavicka .zs-h1-podstranka { margin-bottom: var(--zs-odstup-sm); }

@media (min-width: 1024px) {
  .zs26 .zs-rozvoz__hlavicka { grid-template-columns: 570px 1fr; }
}

/* --- pole na PSC --------------------------------------------------------- */
/* Jedno pole a jedno tlacitko, ne formular. Merenim na sesti konkurentech
   to tak ma pet z nich, jediny NutritionPro chce nejdriv ctyri udaje. */

.zs26 .zs-rozvoz__form {
  display: flex;
  flex-wrap: wrap;
  gap: var(--zs-odstup-sm);
  align-items: flex-end;
  margin-block: var(--zs-odstup-lg);
}

.zs26 .zs-rozvoz__pole { flex: 1 1 12em; min-width: 10em; }

.zs26 .zs-rozvoz__popisek {
  display: block;
  margin-bottom: var(--zs-odstup-xs);
  font-size: 16px;
  font-weight: 600;
  color: var(--zs-barva-text-nadpis);
}

/* Popisek pole v tmave hlavicce (31. 8. 2026). Sdilena konvence
   .zs-sekce--tmava obarvi nadpis, perex i popisek pod stranky, ale tenhle
   <label> ma vlastni tridu s barvou nadpisu, tedy presne barvou noveho
   pozadi, a bez toho by z pasu zmizel. */
.zs26 .zs-sekce--tmava .zs-rozvoz__popisek {
  color: var(--zs-barva-text-na-tmavem);
}

.zs26 .zs-rozvoz__vstup {
  width: 100%;
  height: var(--zs-vyska-pole);
  padding: 0 var(--zs-odstup-base);
  font-family: var(--zs-pismo);
  font-size: 16px;
  color: var(--zs-barva-text-zakladni);
  background: var(--zs-barva-pozadi-karta);
  border: 1px solid var(--zs-barva-ramecek-pole);
  border-radius: var(--zs-radius-male);
}

.zs26 .zs-rozvoz__vstup:focus-visible {
  outline: 2px solid var(--zs-barva-stav-fokus);
  outline-offset: 2px;
}

/* --- odpoved ------------------------------------------------------------- */
/* Odpoved je celou vetou v prvni osobe, ne barvou ramecku. Barva je
   doprovod, ne sdeleni, aby to davalo smysl i pri poruse barvocitu. */

.zs26 .zs-rozvoz__odpoved {
  padding: var(--zs-odstup-xl);
  border-radius: var(--zs-radius-karta);
  border: 1px solid var(--zs-barva-ramecek-karta);
  background: var(--zs-barva-pozadi-jemne);
}

.zs26 .zs-rozvoz__odpoved--ano {
  background: var(--zs-barva-stav-ok-plo);
  border-color: var(--zs-barva-stav-ok);
}

.zs26 .zs-rozvoz__odpoved--ne {
  background: var(--zs-barva-pozadi-sekce-2);
  border-color: var(--zs-barva-stav-pozor);
}

.zs26 .zs-rozvoz__odpoved--chyba {
  background: var(--zs-barva-stav-chyba-plo);
  border-color: var(--zs-barva-stav-chyba);
}

.zs26 .zs-rozvoz__verdikt {
  margin: 0 0 var(--zs-odstup-sm);
  font-size: 20px;
  font-weight: 700;
  line-height: 1.3;
  color: var(--zs-barva-text-nadpis);
}

.zs26 .zs-rozvoz__detail {
  margin: 0 0 var(--zs-odstup-sm);
  font-size: 16px;
  line-height: 1.55;
}

.zs26 .zs-rozvoz__odpoved .zs-tlacitko { margin-top: var(--zs-odstup-md); }

/* --- tri vychody pri zaporne odpovedi ------------------------------------ */
/* Rohlik je jediny ze zkoumanych, kdo pri odmitnuti nabidne vic nez jednu
   cestu dal. Kosik nenabidne nic a clovek skonci ve slepe ulicce. */

.zs26 .zs-rozvoz__vychody {
  margin: var(--zs-odstup-base) 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: var(--zs-odstup-md);
}

@media (min-width: 700px) {
  .zs26 .zs-rozvoz__vychody { grid-template-columns: repeat(3, 1fr); }
}

/* Odsazeni xl, ne base. Pri sestnacti pixelech se text lepil na ramecek
   a karty pusobily namackane. */
.zs26 .zs-rozvoz__vychody li {
  display: flex;
  flex-direction: column;
  gap: var(--zs-odstup-xs);
  padding: var(--zs-odstup-xl);
  background: var(--zs-barva-pozadi-karta);
  border: 1px solid var(--zs-barva-ramecek-karta);
  border-radius: var(--zs-radius-karta);
  font-size: 16px;
  line-height: 1.55;
}

.zs26 .zs-rozvoz__vychody li > strong { margin-bottom: var(--zs-odstup-xs); }
.zs26 .zs-rozvoz__vychody li p { margin: 0; }
.zs26 .zs-rozvoz__vychody li .zs-popisek { margin-bottom: var(--zs-odstup-sm); }

.zs26 .zs-rozvoz__vychody strong {
  display: block;
  margin-bottom: var(--zs-odstup-xs);
  color: var(--zs-barva-text-nadpis);
}

/* --- mapa ---------------------------------------------------------------- */
/* Mapa se nenacita sama. Dokud na ni clovek neklikne, neodejde na cizi
   server jediny pozadavek a nepotrebuje tedy souhlas s cookies.
   Do te doby drzi misto klidna plocha se stejnou vyskou, aby stranka
   pri nacteni neposkocila. */

.zs26 .zs-rozvoz__mapa-ramec {
  position: relative;
  margin-block: var(--zs-odstup-xl);
  border-radius: var(--zs-radius-karta);
  border: 1px solid var(--zs-barva-ramecek-karta);
  background: var(--zs-barva-pozadi-sekce);
  overflow: hidden;
}

.zs26 .zs-rozvoz__mapa {
  width: 100%;
  height: 380px;
  background: var(--zs-barva-pozadi-sekce);
}

@media (min-width: 700px) { .zs26 .zs-rozvoz__mapa { height: 520px; } }

.zs26 .zs-rozvoz__mapa-vyzva {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  gap: var(--zs-odstup-md);
  align-items: center;
  justify-content: center;
  padding: var(--zs-odstup-xl);
  text-align: center;
  background: var(--zs-barva-pozadi-sekce);
}

.zs26 .zs-rozvoz__mapa-vyzva p {
  max-width: 34em;
  margin: 0;
  font-size: 16px;
  color: var(--zs-barva-text-tlumeny);
}

/* --- legenda ------------------------------------------------------------- */
/* Tri stavy, ne dva. Zbytek republiky neni prazdno, je to "domluvime se". */

.zs26 .zs-rozvoz__legenda {
  display: flex;
  flex-wrap: wrap;
  gap: var(--zs-odstup-base) var(--zs-odstup-xl);
  margin-block: var(--zs-odstup-base);
  padding: 0;
  list-style: none;
  font-size: 16px;
}

.zs26 .zs-rozvoz__legenda li {
  display: flex;
  align-items: center;
  gap: var(--zs-odstup-sm);
}

.zs26 .zs-rozvoz__vzorek {
  width: 20px;
  height: 20px;
  flex: none;
  border-radius: var(--zs-radius-male);
  border: 1px solid var(--zs-barva-ramecek-karta);
}

.zs26 .zs-rozvoz__vzorek--trasa { background: var(--zs-barva-akce-primarni); }
.zs26 .zs-rozvoz__vzorek--obal { background: var(--zs-barva-akcent-limetka-plo); }
.zs26 .zs-rozvoz__vzorek--zbytek { background: var(--zs-barva-pozadi-sekce-2); }

/* --- dve pojmenovane trasy ----------------------------------------------- */
/* Ne rozsah hodin. Zmereno u FitKitchen, NutritionPro i NTFY: cas se
   komunikuje jako dvojice pojmenovanych rozvozu, ne jako "5 az 23 hodin". */

.zs26 .zs-rozvoz__trasy {
  display: grid;
  gap: var(--zs-odstup-base);
  align-items: stretch;
  margin-block: var(--zs-odstup-xl);
}

@media (min-width: 700px) {
  .zs26 .zs-rozvoz__trasy { grid-template-columns: repeat(2, 1fr); }
}

/* Zadne height: 100 % na polozkach mrizky. Mrizka je uz sama roztahuje
   na stejnou vysku pres align-items: stretch, a stoprocentni vyska se
   v ni pocita z vysky kontejneru, ktera zavisi na obsahu. Vznikne kruh
   a karta prerusta ven: merenim 291 px karta v 241 px kontejneru,
   takze prekryvala sekci pod sebou. */
.zs26 .zs-rozvoz__trasa {
  padding: var(--zs-odstup-xl);
  background: var(--zs-barva-pozadi-karta);
  border: 1px solid var(--zs-barva-ramecek-karta);
  border-radius: var(--zs-radius-karta);
}

.zs26 .zs-rozvoz__trasa-cas {
  display: block;
  margin-block: var(--zs-odstup-xs) var(--zs-odstup-sm);
  font-size: 28px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: var(--zs-barva-text-nadpis);
}

/* --- tri dukazy pod trasami ---------------------------------------------- */

.zs26 .zs-rozvoz__dukazy {
  display: grid;
  gap: var(--zs-odstup-base);
  align-items: stretch;
  margin-block: var(--zs-odstup-xl);
  padding: 0;
  list-style: none;
}

@media (min-width: 700px) {
  .zs26 .zs-rozvoz__dukazy { grid-template-columns: repeat(3, 1fr); }
}

/* Ramecek, ne vypln. Vypln tady nefunguje: novy-2026.css prebiji pozadi
   u kazdeho `ul li` a tahle trojice je <ul>, zatimco tyden je <ol>,
   proto mel tyden zelene karty a cisla zustala na bilem. Ramecek projde
   a zaroven je to tatáž karta jako u odbernych mist. */
.zs26 .zs-rozvoz__dukaz {
  padding: var(--zs-odstup-lg) var(--zs-odstup-xl);
  border: 1px solid var(--zs-barva-ramecek-karta);
  border-radius: var(--zs-radius-karta);
}

.zs26 .zs-rozvoz__cislo {
  display: block;
  font-size: 28px;
  font-weight: 700;
  line-height: 1.1;
  font-variant-numeric: tabular-nums;
  color: var(--zs-barva-text-nadpis);
}

.zs26 .zs-rozvoz__popis {
  display: block;
  margin-top: var(--zs-odstup-xs);
  font-size: 16px;
  color: var(--zs-barva-text-tlumeny);
}

/* --- seznam obci --------------------------------------------------------- */
/* Polygon v JS neni text a pro vyhledavace nema zadnou hodnotu. Jmenny
   vycet obci proto zustava v HTML, jen sbaleny pod <details>, aby
   neprebijel zbytek stranky. Organika mezirocne ztratila petinu kliku. */

.zs26 .zs-rozvoz__obce { margin-block: var(--zs-odstup-xl); }

.zs26 .zs-rozvoz__obce > summary {
  cursor: pointer;
  padding: var(--zs-odstup-base) 0;
  font-size: 17.5px;
  font-weight: 700;
  color: var(--zs-barva-text-nadpis);
}

.zs26 .zs-rozvoz__obce-sloupce {
  columns: 2;
  column-gap: var(--zs-odstup-xl);
  margin: 0;
  padding: 0;
  list-style: none;
  font-size: 16px;
}

@media (min-width: 700px) { .zs26 .zs-rozvoz__obce-sloupce { columns: 4; } }

.zs26 .zs-rozvoz__obce-sloupce li { break-inside: avoid; padding-block: 2px; }

/* Dvacet jedna mest ma vlastni vstupni stranku a tenhle seznam je jejich
   jediny interni odkaz. Barvu ani velikost pisma nemeni, aby se seznam
   nerozpadl na dva druhy polozek, odlisuje je jen podtrzeni. Kdo cte seznam
   kvuli "vozite ke mne", nema si vsimnout niceho. Kdo klikne, dostane mesto. */
.zs26 .zs-rozvoz__obce-sloupce a {
  color: inherit;
  text-decoration: underline;
  text-decoration-color: var(--zs-barva-ramecek-karta);
  text-underline-offset: 3px;
}

.zs26 .zs-rozvoz__obce-sloupce a:hover,
.zs26 .zs-rozvoz__obce-sloupce a:focus-visible {
  text-decoration-color: currentColor;
}

/* Ozvena zadaneho PSC. Rohlik i Kosik zadanou adresu zopakuji, aby bylo
   videt, co system pochopil. Nazev je v prvnim pade a veta je postavena
   tak, aby zadny jiny pad nepotrebovala. */
.zs26 .zs-rozvoz__ozvena {
  display: inline-block;
  padding: 2px var(--zs-odstup-sm);
  border-radius: var(--zs-radius-pill);
  background: var(--zs-barva-pozadi-karta);
  border: 1px solid var(--zs-barva-ramecek-karta);
  font-size: 16px;
  font-weight: 600;
  color: var(--zs-barva-text-nadpis);
}

/* Podklad mapy se ztlumi, aby zelene oblasti vystoupily. Bez toho
   prebijely barevne dlazdice OpenStreetMap nasi vrstvu a pul mapy
   zabiralo Nemecko a Polsko. Puvodne to resila zaclona jako polygon
   s dirou ve tvaru Ceska, ale na te Leaflet pri priblizeni spadne. */
.zs26 .zs-rozvoz__mapa .leaflet-tile-pane {
  filter: saturate(0.45) brightness(1.06);
}

/* Pri priblizeni se podklad vrati do plnych barev. Tlumeny podklad ma
   smysl na celorepublikovem pohledu, kde jde o tvar pokryti. Jakmile
   si clovek priblizi na ulice, potrebuje je precist. */
.zs26 .zs-rozvoz__mapa--detail .leaflet-tile-pane { filter: none; }

/* Popisky mest v mape. Vznikly z pripominky, ze mapa je slepa: dlazdice
   jsou ztlumene, pres ne lezi kremova vypln republiky a zelene oblasti,
   takze popisky OpenStreetMap byly citelne jen venku za hranici. Kresli
   se proto vlastni vrstva nad vsim, viz postavMesta v zs26-rozvoz.js.
   Na mape jsou jen mesta, kam se skutecne vozi. */
.zs26 .zs-rozvoz__mesto {
  width: 0;
  height: 0;
  line-height: 1;
  white-space: nowrap;
}

.zs26 .zs-rozvoz__mesto--skryte { visibility: hidden; }

.zs26 .zs-rozvoz__mesto-bod {
  position: absolute;
  left: -4px;
  top: -4px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--zs-barva-text-nadpis);
  border: 1.5px solid #FFFFFF;
  box-sizing: border-box;
}

/* Bily lem kolem pisma, ne stin pod nim. Je to mapove remeslo: nazev
   lezi jednou na zelene, jednou na kremove a jednou na dlazdicich,
   a bez lemu je ctvrtina popisku necitelna. Kresli se pres text-shadow
   ve ctyrech smerech, protoze paint-order na HTML textu neplati. */
.zs26 .zs-rozvoz__mesto-nazev {
  position: absolute;
  left: 9px;
  top: -8px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: -0.01em;
  color: var(--zs-barva-text-nadpis);
  text-shadow: 0 1px 2px #FFFFFF, 0 -1px 2px #FFFFFF,
               1px 0 2px #FFFFFF, -1px 0 2px #FFFFFF;
}

/* Popisek se vejde na ctyri mista vedle bodu, vybira ho postavMesta
   v zs26-rozvoz.js. Vpravo je vychozi, zbytek resi kolize: bez toho
   vypadalo z celorepublikoveho pohledu Usti nad Labem a Kladno. */
/* Vlevo se posouva o vlastni sirku, ne pres right. Ikona je nulove
   siroka, takze right: 9px znamena shrink-to-fit v nulove sirce: prvek
   dostane sirku 0, text z nej pretece doprava a kolizni vypocet meri nulu. */
.zs26 .zs-rozvoz__mesto-nazev--vlevo {
  left: -9px;
  right: auto;
  transform: translateX(-100%);
}
.zs26 .zs-rozvoz__mesto-nazev--nahore,
.zs26 .zs-rozvoz__mesto-nazev--dole {
  left: 0;
  transform: translateX(-50%);
}
.zs26 .zs-rozvoz__mesto-nazev--nahore { top: -25px; }
.zs26 .zs-rozvoz__mesto-nazev--dole { top: 10px; }
.zs26 .zs-rozvoz__mesto--p1 .zs-rozvoz__mesto-nazev--vlevo { left: -11px; }

/* Krajska mesta o stupen vyraznejsi, aby na celorepublikovem pohledu
   drzela kostru a mensi mesta pusobila jako doplnek. */
.zs26 .zs-rozvoz__mesto--p1 .zs-rozvoz__mesto-bod {
  left: -5px;
  top: -5px;
  width: 10px;
  height: 10px;
}
.zs26 .zs-rozvoz__mesto--p1 .zs-rozvoz__mesto-nazev {
  left: 11px;
  top: -9px;
  font-size: 15px;
  font-weight: 700;
}

/* Treti patro je orientacni vypln mezi vetsimi mesty, ne sdeleni. */
.zs26 .zs-rozvoz__mesto--p3 .zs-rozvoz__mesto-nazev {
  font-size: 12px;
  font-weight: 600;
  color: var(--zs-barva-text-zakladni);
}

/* Leaflet si kresli vlastni pismo, srovnat ho s webem. */
.zs26 .zs-rozvoz__mapa .leaflet-container {
  font-family: var(--zs-pismo);
  font-size: 16px;
  background: var(--zs-barva-pozadi-sekce);
}

/* Misto na fotku v hlavicce. Zmereny vzor u sedmi konkurentu: textovy
   sloupec kolem 570 px, vedle nej obrazek, vyska pasu kolem 470 px.
   V nahledu je to jen misto s poznamkou, co na fotku patri. */
/* Fotka v hlavicce. Je to snimek ze soucasneho webu, ridic s taskou,
   ne dodavka. Zmereny vzor u sedmi konkurentu: textovy sloupec kolem
   570 px, vedle nej obrazek, vyska pasu kolem 470 px. */
/* 31. 8. 2026: radius z --zs-radius-karta (16 px) na --zs-radius-velke (24 px).
   Je to fotka v hlavicce stranky, ne karta, a hero rozcestniku i katalogu
   maji 24. Merenim 31. 8. to byla jedina hlavicka na webu, ktera se lisila. */
.zs26 .zs-rozvoz__foto {
  border-radius: var(--zs-radius-velke);
  overflow: hidden;
  background: var(--zs-barva-pozadi-sekce);
}

.zs26 .zs-rozvoz__foto img {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 320px;
  object-fit: cover;
}

/* Stav, kdy se ceka na odpoved enginu. Bez nej by po odeslani chvili
   nebylo videt nic a clovek by klikal znovu. */
.zs26 .zs-rozvoz__odpoved--ceka {
  background: var(--zs-barva-pozadi-jemne);
  border-color: var(--zs-barva-ramecek-karta);
  color: var(--zs-barva-text-popisek);
}

/* Tyden po dnech. Ukazuje, ze adresa neni jedna na cely tyden, ale plan.
   Z osmi zkoumanych konkurentu tohle nepojmenoval nikdo krome NTFY,
   a ten jen vetou "nastavte si vic adres", bez ukazky. */
.zs26 .zs-rozvoz__tyden {
  display: grid;
  gap: var(--zs-odstup-base);
  align-items: stretch;
  margin-block: var(--zs-odstup-lg);
  padding: 0;
  list-style: none;
  counter-reset: den;
}

/* Text pod kartami mel margin 0 z resetu sablony, takze se dva odstavce
   slily do jednoho bloku nalepeneho na karty. */
.zs26 .zs-rozvoz__tyden ~ p { margin-block: 0; }
.zs26 .zs-rozvoz__tyden ~ p + p { margin-top: var(--zs-odstup-md); }

@media (min-width: 700px) {
  .zs26 .zs-rozvoz__tyden { grid-template-columns: repeat(3, 1fr); }
}

/* Karta je sloupec, obsah nahore. Puvodne tu bylo justify-content:
   space-between a min-height, takze den zustal nahore, cil spadl dolu
   a mezi nimi zela mezera. Pri ruzne dlouhych popiscich dnu z toho
   vznikl cikcak: kazda karta mela text jinde. Ted jde obsah za sebou,
   zahlavi ma rezervovanou vysku na dva radky, takze cile sedi v rade. */
.zs26 .zs-rozvoz__tyden li {
  display: flex;
  flex-direction: column;
  gap: var(--zs-odstup-sm);
  padding: var(--zs-odstup-xl);
  background: var(--zs-barva-pozadi-sekce);
  border-radius: var(--zs-radius-karta);
}

/* Rezervovana vyska zahlavi ma smysl jen tam, kde karty stoji vedle sebe
   a cile maji sedet v jedne rade. Na mobilu jsou pod sebou, takze tam
   delala jen diru mezi dnem a cilem: zmereno 31. 8. 2026, karta 132 px,
   z toho 51 px prazdno. */
.zs26 .zs-rozvoz__tyden .zs-rozvoz__zahlavi {
  align-items: flex-start;
  margin-bottom: 0;
}

@media (min-width: 700px) {
  .zs26 .zs-rozvoz__tyden .zs-rozvoz__zahlavi { min-height: 3.2em; }
}

.zs26 .zs-rozvoz__den {
  display: block;
  font-size: 14.5px;
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--zs-barva-text-popisek);
}

.zs26 .zs-rozvoz__kam {
  display: block;
  margin-top: auto;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.3;
  color: var(--zs-barva-text-nadpis);
}

/* --- ikony ---------------------------------------------------------------- */
/* Kreslene rucne, 24 x 24, tah 1.75, bez vyplne, barva se dedi.
   Nejsou to obrazky, ale <use> na jeden sprite na zacatku modulu,
   takze prohlizec stahuje nulu navic a barva jde z tokenu. */

.zs26 .zs-ikony { position: absolute; width: 0; height: 0; overflow: hidden; }

.zs26 .zs-ikona {
  width: 28px;
  height: 28px;
  flex: none;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.75;
  stroke-linecap: round;
  stroke-linejoin: round;
  color: var(--zs-barva-ikona-vychozi);
}

.zs26 .zs-ikona--velka { width: 34px; height: 34px; }

/* Ikona v zahlavi karty, vedle popisku, ne nad nim. */
.zs26 .zs-rozvoz__zahlavi {
  display: flex;
  align-items: center;
  gap: var(--zs-odstup-md);
  margin-bottom: var(--zs-odstup-sm);
}

.zs26 .zs-rozvoz__zahlavi .zs-h3,
.zs26 .zs-rozvoz__zahlavi .zs-rozvoz__den { margin: 0; }

/* --- tyden na tri sloupce ------------------------------------------------- */
/* Ctvrty den, patek na chatu, vypadl: v patek se nezavazi. Jidlo se vozi
   den predem na pondeli az patek, takze rozvoz jezdi nedele az ctvrtek. */
@media (min-width: 700px) {
  .zs26 .zs-rozvoz__tyden { grid-template-columns: repeat(3, 1fr); }
}

/* --- Vedeli jste ---------------------------------------------------------- */
/* Jedna veta o lidech, ne o cislech. Karty nad tim jsou vsechny mereni,
   tohle je protivaha: za tim rozvozem stoji lidi. */
.zs26 .zs-rozvoz__vedeli {
  padding: var(--zs-odstup-xl);
  background: var(--zs-barva-akcent-zluta-plo);
  border-radius: var(--zs-radius-karta);
}

.zs26 .zs-rozvoz__vedeli .zs-stitek { color: var(--zs-barva-text-nadpis); }

.zs26 .zs-rozvoz__vedeli-text {
  margin: 0;
  max-width: 44em;
  font-size: 20px;
  line-height: 1.45;
  color: var(--zs-barva-text-nadpis);
}

/* --- pas fotek ------------------------------------------------------------ */
/* Vodorovna rada fotek, na mobilu se posouva prstem se zastavkami.
   Stejny vzor jako .zs-pas-fotek na homepage. */
.zs26 .zs-rozvoz__pas-fotek {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 78%;
  gap: var(--zs-odstup-base);
  margin-block: var(--zs-odstup-xl) var(--zs-odstup-sm);
  padding: 0 0 var(--zs-odstup-sm);
  list-style: none;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  overscroll-behavior-x: contain;
}

@media (min-width: 700px) {
  .zs26 .zs-rozvoz__pas-fotek {
    grid-auto-flow: row;
    grid-auto-columns: auto;
    grid-template-columns: repeat(4, 1fr);
    overflow: visible;
  }
}

/* 1. 9. 2026 vecer: v dlazdici uz neni popisek mista, ale skutecna fotka.
   Pryc proto sla carkovana obruba, vypln a vycentrovani textu. Zaobleni
   rezea obal (overflow: hidden), fotka jde od kraje ke kraji. */
.zs26 .zs-rozvoz__pas-fotek li {
  aspect-ratio: 4 / 3;
  overflow: hidden;
  scroll-snap-align: start;
  background: var(--zs-barva-pozadi-sekce);
  border-radius: var(--zs-radius-karta);
}

.zs26 .zs-rozvoz__pas-fotek li img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 0;
}

/* --- ramec sekci ---------------------------------------------------------- */
/* Tohle bylo puvodne jen v nahledovem <style> a do modulu se nedostalo,
   takze na ostrem webu byl obsah pres celou sirku okna a vlevo orizly.
   Nazvy jsou prefixovane, obecne .obal a .sekce by se srazily se sablonou. */

.zs26 .zs-rozvoz-obal {
  max-width: var(--zs-sirka-obsah);
  margin-inline: auto;
  padding-inline: var(--zs-odstup-base);
  text-align: left;
}

@media (min-width: 700px) {
  .zs26 .zs-rozvoz-obal { padding-inline: var(--zs-odstup-xl); }
}

/* 31. 8. 2026, stranka byla rozteklá. Sekce mely 64 px nahore i dole,
   takze mezi dvema sekcemi bylo 128 px prazdna a stranka merila 6 657 px.
   Odstup je proto poloviční: 64 px mezi sekcemi na desktopu, 48 na mobilu.
   Uvnitr sekci se nemenilo nic, karty maji dal svych 24 px. */
.zs26 .zs-rozvoz-sekce { padding-block: var(--zs-odstup-xl); }

/* Hlavicka stranky ma barevny pas, tam je odsazeni videt jako plocha
   a pri 24 px by text sedel na hrane. */
.zs26 .zs-rozvoz-sekce.zs-sekce--tmava { padding-block: var(--zs-odstup-2xl); }

@media (min-width: 1024px) {
  .zs26 .zs-rozvoz-sekce { padding-block: var(--zs-odstup-2xl); }
  .zs26 .zs-rozvoz-sekce.zs-sekce--tmava { padding-block: var(--zs-odstup-sekce-mobil); }
}

/* Sablona ma na body text-align: center, coz se dedi az sem. */
.zs26 .zs26-rozvoz { text-align: left; }

/* Popisek nad dlazdicemi, ne pod nimi. Pod nimi se cetl jako poznamka
   pod carou a lidi ho minuli, pritom rika to nejdulezitejsi: ze je to
   ukazka, ne rozvrh, ktery musi dodrzet. */
.zs26 .zs-rozvoz__ukazka { margin: var(--zs-odstup-sm) 0 0; }

/* --- FAQ nad clankem ------------------------------------------------------ */
/* Clanek 15 kresli sest dvojic nadpis a odstavec pod sebou, coz vypada
   jako bezny text, ne jako casto kladene dotazy. Skript z nich udela
   nativni <details>. Bez JS zustane puvodni text presne jako dnes,
   nic se neschovava.

   1. 9. 2026 vecer: vzhled samotnych dotazu uz nedelame my. Marek nasel,
   ze tenhle blok ma proti zbytku webu stary design ("maji stary design FAQ"),
   a mel pravdu: bylo to sest holych <details> s vlastnimi styly, tedy
   radek, tenka cara a plus vpravo, kdezto tataz FAQ na deviti jinych
   strankach uz je karta s limetkovym koleckem. Skript proto uzlum davá
   sdilenou komponentu .zs-faq z novy-2026.css a pravidla, ktera tu byla
   (.zs26-rozvoz-faq details, summary, summary::after a __odpoved), jsou
   SMAZANA, ne jen nepouzita. Musela pryc: novy-2026-rozvoz.css se nacita
   az za novy-2026.css, takze by komponentu prebila pri stejne specificite
   a nic by to nehlasilo.

   Zustava jen ramec bloku, tedy sirka, odsazeni a nadpis. Kdyby na /rozvoz
   melo FAQ jine odsazeni nez jinde, meni se promenne --zs-faq-odsazeni-x
   a --zs-faq-odsazeni-y, ne deklarace komponenty: kolem ni je v novy-2026.css
   blok proti sablone, ktery deklarace opakuje s !important, a ten prebije
   i pozdejsi soubor. Promenna se prebiji normalni kaskadou a doteče
   i dovnitr !important. */

.zs26-rozvoz-faq {
  max-width: var(--zs-sirka-obsah);
  margin: 0 auto;
  padding-inline: var(--zs-odstup-base);
  text-align: left;
}

@media (min-width: 700px) {
  .zs26-rozvoz-faq { padding-inline: var(--zs-odstup-xl); }
}

.zs26-rozvoz-faq > h2 {
  font-family: var(--zs-pismo);
  font-size: clamp(26px, 2.7vw, 36px);
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -0.015em;
  color: var(--zs-barva-text-nadpis);
  margin: 0 0 var(--zs-odstup-lg);
}

/* --- vychody pri zaporne odpovedi, v radcich ------------------------------ */
/* Tri sloupce se v uzkem sloupci hlavicky smrskly na peti slov na radek
   a text se lamal po jednom slove. V radcich je to citelne i na 570 px. */

.zs26 .zs-rozvoz__vychody--radky { grid-template-columns: 1fr; }

@media (min-width: 700px) {
  .zs26 .zs-rozvoz__vychody--radky { grid-template-columns: 1fr; }
}

.zs26 .zs-rozvoz__vychody--radky li {
  flex-direction: row;
  align-items: flex-start;
  gap: var(--zs-odstup-base);
  padding: var(--zs-odstup-lg);
}

.zs26 .zs-rozvoz__vychody--radky li > div { display: block; }
.zs26 .zs-rozvoz__vychody--radky strong { display: block; margin-bottom: 2px; }
.zs26 .zs-rozvoz__vychody--radky p { margin: 0; color: var(--zs-barva-text-tlumeny); }

.zs26 .zs-rozvoz__vychod-odkaz {
  display: inline-block;
  margin-top: var(--zs-odstup-sm);
  font-weight: 700;
  color: var(--zs-barva-text-odkaz);
}

/* Telefon je proklik, na mobilu to je jedno kliknuti misto opisovani. */
.zs26 .zs-rozvoz__vychod-odkaz[href^="tel:"]::before { content: "\260E\FE0E  "; }

/* --- srovnani specificity proti resetu seznamu ---------------------------- */
/* novy-2026.css ma `.zs26 ul li, .zs26 ul li:nth-child(n) { padding-left: 0 }`,
   coz je reset legacy odrazek s obrazkem. Ten `:nth-child(n)` zvedne
   specificitu na (0,2,2) a prebije tim odsazeni u nasich karet, takze
   text zleva lezel na ramecku. Tady se to srovnava stejnym trikem,
   ne vykricnikem: `li:nth-child(n)` za dvema tridami je (0,3,1). */

.zs26 .zs-rozvoz__vychody li:nth-child(n) { padding-left: var(--zs-odstup-xl); }
.zs26 .zs-rozvoz__vychody--radky li:nth-child(n) { padding-left: var(--zs-odstup-lg); }
.zs26 .zs-rozvoz__dukazy li:nth-child(n) { padding-left: var(--zs-odstup-xl); }
/* Vypln byla kvuli popisku uvnitr dlazdice. S fotkou musi byt nula,
   jinak zustane po levem kraji prouzek pozadi. Sablona vynucuje na kazdem
   li vlastni padding-left, proto tu ta nula musi byt napsana, ne vynechana. */
.zs26 .zs-rozvoz__pas-fotek li:nth-child(n) { padding: 0; }

/* --- filtr odbernych mist ------------------------------------------------- */
/* Trinact mist, z toho sest v Praze. Chipy jsou tataz komponenta jako filtr
   programu v novy-2026.css, jen v nasem scope: bila pilulka s rameckem,
   aktivni tmave zelena.

   !important je tu nutne, ne kosmeticke. Sablona v content2024.css vynucuje
   na kazdem <button> padding 21px 25px a border 0, obojí s !important,
   a novy-2026.css to neutralizuje pravidlem
   `.zs26 button { padding: 0 !important; border: 0 !important }`.
   Bez !important by chip zustal bez ramecku a bez odsazeni, at ma
   selektor jakoukoliv specificitu. Zapsano u konfiguratoru 27. 8. 2026. */

.zs26 .zs-rozvoz__filtr {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--zs-odstup-sm) var(--zs-odstup-md);
  margin-block: var(--zs-odstup-base) var(--zs-odstup-lg);
}

.zs26 .zs-rozvoz__filtr-popisek {
  font-size: 16px;
  font-weight: 600;
  color: var(--zs-barva-text-nadpis);
}

.zs26 .zs-rozvoz__filtr-chipy {
  display: flex;
  flex-wrap: wrap;
  gap: var(--zs-odstup-sm);
}

.zs26 .zs-rozvoz__chip {
  display: inline-flex;
  align-items: center;
  gap: var(--zs-odstup-xs);
  min-height: var(--zs-vyska-tlacitko-male);
  padding: 0 var(--zs-odstup-lg) !important;
  border: 1px solid var(--zs-barva-ramecek-karta) !important;
  border-radius: var(--zs-radius-pill);
  background: var(--zs-barva-pozadi-karta);
  /* Barva textu taky s !important, a ne kosmeticky. novy-2026.css ma
     `.zs26 button, input, select, textarea { color: inherit !important }`,
     takze chip dedil zakladni #1D1D1D. Na aktivnim chipu to znamenalo
     temne pismo na tmave zelene, kontrast 1,1:1, tedy necitelne. */
  color: var(--zs-barva-text-nadpis) !important;
  font-family: var(--zs-pismo);
  font-size: 16px;
  font-weight: 600;
  line-height: 1.2;
  white-space: nowrap;
  cursor: pointer;
}

.zs26 .zs-rozvoz__chip:hover {
  border-color: var(--zs-barva-ramecek-pole) !important;
  background: var(--zs-barva-akce-sekundarni-hover);
}

.zs26 .zs-rozvoz__chip:focus-visible {
  outline: 2px solid var(--zs-barva-stav-fokus);
  outline-offset: 2px;
}

.zs26 .zs-rozvoz__chip--aktivni,
.zs26 .zs-rozvoz__chip--aktivni:hover {
  border-color: var(--zs-barva-akce-tmave) !important;
  background: var(--zs-barva-akce-tmave);
  color: var(--zs-barva-text-inverzni) !important;
}

/* Pocet je tlumeny, ne sedy: sediva by na tmavem chipu spadla pod kontrast.
   Kryti 0,75 drzi bilou na tmave zelene nad 8:1 a tmavou na bile taky. */
.zs26 .zs-rozvoz__chip-pocet { font-weight: 600; opacity: 0.75; }

/* Karta je <li> s display: flex, a to by hidden prebilo. */
.zs26 .zs-rozvoz__vychody-karta[hidden] { display: none !important; }

/* --- overeni nad mapou ---------------------------------------------------- */
/* Jedine pole na PSC na strance. Do 31. 8. 2026 bylo pole i v hlavicce
   a tohle bylo druhe, jen na posun mapy, s jednoradkovou odpovedi.
   Dve pole na tutez otazku znamenala dve mista, kde clovek premysli,
   ktere z nich je to spravne. Zustalo to u mapy, protoze odpoved
   a obrazek pokryti patri k sobe. */

.zs26 .zs-rozvoz__overeni { margin-block: var(--zs-odstup-lg) var(--zs-odstup-xl); }

.zs26 .zs-rozvoz__form--mapa {
  margin-block: 0 var(--zs-odstup-sm);
  max-width: 32em;
}

/* Odpoved pod polem, ne slepena s nim. */
.zs26 .zs-rozvoz__overeni > [data-zs26-rozvoz-odpoved-pro]:not(:empty) {
  margin-top: var(--zs-odstup-base);
}

/* --- odpoved v heru homepage --------------------------------------------- */
/* Hero ma uzsi sloupec nez hlavicka rozvozu, tak at box nepretahuje. */
.zs26 .zs-m-hero__psc-odpoved:empty { display: none; }
.zs26 .zs-m-hero__psc-odpoved { margin-top: var(--zs-odstup-base); max-width: 34em; }

/* 30. 8. 2026: odpoved v heru stridá formular, nestoji pod nim. Kdyz je
   formular schovany, horni odstup uz nema od ceho odsazovat. */
.zs26 .zs-m-hero__psc-box[data-zs-odpoved="ano"] .zs-m-hero__psc-odpoved,
.zs26 .zs-m-hero__psc-box[data-zs-odpoved="ne"] .zs-m-hero__psc-odpoved { margin-top: 0; }
.zs26 .zs-m-hero__psc-odpoved:focus { outline: none; }
.zs26 .zs-m-hero__psc-odpoved:focus-visible { outline: 2px solid var(--zs-barva-stav-fokus); outline-offset: 2px; }

/* Kratka odpoved: mensi vnitrni odsazeni a mensi verdikt nez na /rozvoz,
   aby vysledny box nebyl vyssi nez formular, ktery nahradil. */
.zs26 .zs-rozvoz__odpoved--kratka { padding: var(--zs-odstup-lg); }
.zs26 .zs-rozvoz__odpoved--kratka .zs-rozvoz__verdikt { font-size: 18px; margin-bottom: var(--zs-odstup-xs); }
.zs26 .zs-rozvoz__odpoved--kratka .zs-rozvoz__detail { font-size: 14.5px; margin-bottom: 0; }
.zs26 .zs-rozvoz__odpoved--kratka .zs-rozvoz__detail + .zs-rozvoz__detail { margin-top: var(--zs-odstup-xs); }

/* Tlacitko a "Zadat jine PSC" na jednom radku. Pod 380 px se zalomi. */
.zs26 .zs-rozvoz__akce {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--zs-odstup-md);
  margin: var(--zs-odstup-md) 0 0;
}
.zs26 .zs-rozvoz__odpoved .zs-rozvoz__akce .zs-tlacitko { margin-top: 0; }

/* "Zadat jine PSC" je akce, ne navigace, proto <button>. Vypada jako odkaz. */
.zs26 .zs-rozvoz__znovu {
  padding: 0;
  border: 0;
  background: none;
  font: inherit;
  font-size: 14.5px;
  color: var(--zs-barva-text-odkaz);
  text-decoration: underline;
  cursor: pointer;
}
.zs26 .zs-rozvoz__znovu:hover { text-decoration: none; }

/* ---------------------------------------------------------------------------
   Velka fotka v hlavicce, 1. 9. 2026 vecer
   Marek poslal /rozvoz mezi tremi adresami s tim, ze to tam chybi. Odpoledne
   ho z rozsahu vyloucil, vecer si to rozmyslel. Fotka tedy prestava byt
   zaoblenou kartou v obsahovem sloupci a stava se vyrezem pres polovinu sirky
   okna az k prave hrane, v plne vysce pasu, jako na /jak-to-funguje.

   Zmereno na 1440 pred zmenou: fotka 538 px, 37,4 % sirky okna, prava hrana
   154 px od okraje, radius 24, zelena 44 px nad i pod.
   Cil: 720 px, 50,0 %, 0 px, radius 0, zelena 0.

   Plati od 700 px. Pod 700 px se nemeni nic, tam je fotka pod textem pres
   sirku obalu a je to zamer.

   Tri veci, ktere nejsou ozdoba, vsechny stejne jako u bloku 8b
   v novy-2026.css, odkud se to sem prenasi:
   1. min-height patri na textovy sloupec, ne na .zs-rozvoz__hlavicka.
      Na kontejneru se pod 1024 px rozdeli mezi dva zalomene radky a fotka
      spadne na nulu.
   2. Vzorec osy obsahu se pocita ze sirky bunky mrizky. Mezi 700 a 1023 px je
      mrizka jednosloupcova a bunka je siroka jako okno, takze 50 %. Od 1024 px
      je dvousloupcova a totez je 100 %. Bez vw, ten pocita i posuvnik.
      Pozor, obal rozvozu ma vlastni sirku odsazeni: --zs-odstup-base (16 px)
      do 700 px a --zs-odstup-xl (24) nad ni, ne --zs-odstup-lg (20) jako
      rozcestniky. Vzorec proto bere --zs-odstup-xl, aby text stal na tez ose
      jako zbytek stranky.
   3. Textovy sloupec je bezejmenny <div>, proto :first-child. Druhy potomek
      je .zs-rozvoz__foto.
   4. Vsechna pravidla v tomhle souboru maji prefix .zs26 a bez nej se nechytnou,
      a nestaci ani ten: selektory jsou o stupen delsi (.zs-rozvoz-obal,
      .zs-rozvoz__hlavicka), aby nezalezelo na poradi souboru. Zjisteno merenim
      1. 9.: pri shode specificity pravidla z novy-2026-rozvoz.css vyhravala,
      protoze se soubor nacita pozdeji nez testovaci <style> v head.
      Overeno injektazi 1. 9.: bez prefixu se z celeho bloku projevil jen
      textovy sloupec, mrizka i zaobleni zustaly na puvodnich hodnotach,
      protoze .zs26 .zs-rozvoz__hlavicka (0,2,0) prebije .zs-rozvoz__hlavicka
      (0,1,0) bez ohledu na poradi.

   Vraceni: novy-2026-rozvoz.css.pred-velka-fotka-hlavicky, postup
   v 25/VRACENI.md, dvacata ctvrta vlna.
   --------------------------------------------------------------------------- */

@media (min-width: 700px) {
  .zs26 .zs-rozvoz-sekce.zs-sekce--tmava:has(> .zs-rozvoz-obal > .zs-rozvoz__hlavicka) {
    padding-block: 0;
  }
  .zs26 .zs-rozvoz-obal:has(> .zs-rozvoz__hlavicka) {
    max-width: none;
    padding-inline: 0;
  }
  .zs26 .zs-rozvoz-obal .zs-rozvoz__hlavicka {
    gap: 0;
    align-items: stretch;
  }
  /* Svisly stred textu, 3. 9. 2026. Mrizka ma align-items: stretch, takze se
     textovy sloupec natahne na vysku fotky, ale obsah v nem zustaval nahore
     na hornim paddingu. Zmereno na webvyvoj2 pred zmenou: nad textem 64 px,
     pod nim 152 px na 1440 a 250 px na 1920, osa textu byla o 44 respektive
     93 px nad osou pasu. Ctyri ostatni rodiny hlavicek mely nad == pod uz
     predtim (rozcestniky a poradna pres justify-content: center v
     25/css-partials/40-rozcestnik.css, /o-nas a stare pasy /jak-to-funguje
     a /jak-to-funguje/faq vlastni cestou), /rozvoz z te opravy 31. 8. vypadl,
     protoze ma vlastni tridu v tomhle souboru.

     Padding zustava jako minimum, ne jako pozice: pod 1024 px je mrizka
     jednosloupcova, vyska sloupce se rovna vysce obsahu a centrovani je no-op,
     stejne jako u rodiny rozcestniku. Odstupy uvnitr sloupce dal drzi margin
     jednotlivych prvku, gap se nezavadi, aby se nezmenila skladba, ktera je
     shodna s ostatnimi hlavickami. */
  .zs26 .zs-rozvoz-obal .zs-rozvoz__hlavicka > div:first-child {
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-block: var(--zs-odstup-sekce);
    padding-inline: max(
      var(--zs-odstup-xl),
      calc(50% - var(--zs-sirka-obsah) / 2 + var(--zs-odstup-xl))
    );
  }
  .zs26 .zs-rozvoz__hlavicka .zs-rozvoz__foto { border-radius: 0; }
}

@media (min-width: 1024px) {
  .zs26 .zs-rozvoz-obal .zs-rozvoz__hlavicka {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }
  .zs26 .zs-rozvoz-obal .zs-rozvoz__hlavicka > div:first-child {
    padding-inline: max(
        var(--zs-odstup-xl),
        calc(100% - var(--zs-sirka-obsah) / 2 + var(--zs-odstup-xl))
      )
      var(--zs-odstup-2xl);
    min-height: 400px;
  }
  /* Prechod z fotky do pasu, tyz jako u rodiny: 150 px zleva, barva pasu
     do prusvitna. Az od 1024 px, mezi 700 a 1023 je fotka samostatny radek
     pres celou sirku a svisly gradient by na ni byl vodorovny sev. */
  .zs26 .zs-rozvoz__hlavicka .zs-rozvoz__foto { position: relative; }
  .zs26 .zs-rozvoz__hlavicka .zs-rozvoz__foto::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    z-index: 1;
    width: 150px;
    background-image: linear-gradient(to right, var(--zs-barva-pozadi-tmave), transparent);
  }
}