/* Textové bloky podstránok Mňamka.
   Rozmery aj typografia sú namerané na origináli (scripts/strom.js).
   Používa ich /kolaciky/ a ďalšie obsahové stránky. */

/* ---------- Blok ----------
   Elementor boxed kontajner: na desktope a tablete 3 % zhora a zdola, bez
   bočného odsadenia; na mobile naopak 3 % po bokoch a zvisle nič (vínová
   sekcia má aj na mobile 3 % zvisle). Medzi prvkami 20 (medzera widgetov).
   Bočné odsadenie nesie sekcia, zvislé vnútro, Elementor počíta zvislé
   percentá zo šírky, ktorá ostane po bočnom odsadení. */

.blok__obal { padding-block: 3%; }

.blok__nadpis {
  margin: 0;
  font-size: 36px;                 /* namerané 36px/50,4px, váha 500 */
  font-weight: 500;
  line-height: 50.4px;
  color: var(--vinova-svetla);
  text-align: center;
}

.blok__nadpis--vlavo { text-align: left; }

.blok__text {
  margin: 20px 0 0;                /* namerané: medzi prvkami 20 */
  font-size: 22px;                 /* namerané 22px/40px, váha 300 */
  font-weight: 300;
  line-height: 40px;
  color: var(--vinova-svetla);
  text-align: center;
}

.blok__nadpis + .blok__text { margin-top: 20px; }
.blok__text + .blok__nadpis { margin-top: 20px; }

/* Vínová sekcia, nadpisy, linka aj body sú v nej biele */
.blok--vinovy { background: var(--vinova); }
.blok--vinovy .blok__nadpis,
.blok--vinovy .blok__text { color: var(--biela); }

.blok__linka {
  height: 0;
  margin: 15px 0;                  /* namerané: widget 31 vysoký, linka v strede */
  border: 0;
  border-top: 1px solid var(--biela);   /* namerané */
}

/* ---------- Body vedľa seba ----------
   Elementor (post-509 47b48b7, 514 85fd996, 519 9c77ea3, 524 3892f43):
   kontajner v riadku s odsadením 10 (predvolené e-con), medzera widgetov 20
   (kit post-68: --widgets-spacing 20px) a `justify-content: space-around`;
   každý image-box má `width: 20%; max-width: 20%` (mobil 46 % a riadok sa
   zalomí). Šírka je explicitná, nie podľa obsahu: päť bodov 5 × 20 % + 4 × 20
   sa nezmestí, takže sa zmenšia rovnakým dielom (namerané pri 1440: 208
   s krokom 228 = (1120 − 80) / 5 + 20) a space-around nemá čo deliť; štyri
   body sa zmestia a voľné miesto sa rozdelí okolo nich (namerané na
   /kaviarne-hotely/ pri 1440: medzera 61 = 20 + 164 / 4). */

.body {
  display: flex;
  justify-content: space-around;
  gap: 20px;                       /* kit: widgets-spacing 20 */
  padding: 10px;
}

.body > * { flex: 0 1 auto; width: 20%; max-width: 20%; }

/* Nad radom sedí v origináli oddeľovač (widget vysoký 31), raz je to
   viditeľná linka (`.blok__linka`), inde len prázdne miesto. */
.body--pod-oddelovacom { margin-top: 31px; }

.bod__nadpis {
  margin: 0;
  font-size: 24px;                 /* namerané 24px/31,2px, váha 800 */
  font-weight: 800;
  line-height: 31.2px;
  color: var(--biela);
  text-align: center;
}

.bod__popis {
  margin: 0;
  font-size: 18px;                 /* namerané 18px/29,7px */
  font-weight: 400;
  line-height: 29.7px;
  color: var(--biela);
  text-align: center;
}

/* ---------- Dva stĺpce ---------- */

.blok__obal--dva {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: start;
}

/* Nadpis, ktorý má v origináli čiernu farbu namiesto vínovej,
   namerané na /kaviarne-hotely/. */
.blok__nadpis--cierny { color: var(--cierna); }

/* Namerané pomery stĺpcov, Elementor ich má na každej sekcii iné. */
.blok__obal--siroky-uzky,
.blok__obal--uzky-siroky,
.blok__obal--526-570,
.blok__obal--514-649 {
  display: grid;
  align-items: start;
}

/* Percentá z kontajnera 1140, Elementor tie stĺpce nemá roztiahnuté na plnú
   šírku, medzi nimi (alebo za nimi) ostáva prázdne miesto. */
.blok__obal--siroky-uzky { grid-template-columns: 59.339% 40.661%; }
.blok__obal--uzky-siroky { grid-template-columns: 32.222% 56.893%; }
.blok__obal--526-570 { grid-template-columns: 46.153% 50%; }
.blok__obal--514-649 { grid-template-columns: 45.070% 56.893%; }

/* Obrázok v textovom bloku, namerané: ide cez celú šírku stĺpca */
.blok__obrazok { width: 100%; height: auto; }

.stlpec { padding: 10px; }

/* Elementor vie stĺpec zvisle vycentrovať (`--justify-content:center`):
   /svadby/ 7a83a44 SVADOBNÁ TORTA, 4838d53 CANDY BAR, 4720159 SLANÝ BAR,
   47cbe9f DOVOZ; /kolaciky/ 001eabf. Namerané na /svadby/ v sekcii
   DOVOZ: obsah 674,8 v stĺpci 857,7, teda 91,45 voľného miesta nad aj pod.
   (SLANÝ BAR mal predtým pevné odsadenie 49,92, sedelo len pri 1440.)
   Aby sa bolo voči čomu centrovať, riadok musí stĺpce natiahnuť. */
.blok__obal--stred { align-items: stretch; }

.stlpec--na-stred {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

/* Elementor tieto stĺpce neroztiahne na plnú šírku kontajnera, `--width`
   z Elementor CSS (od 768; na mobile idú cez celú šírku):
   /kolaciky/ 9b4571e 97,099 % a dcba9fd 95,385 %, /kaviarne-hotely/ 59a67d1
   97,396 %, /ponuka-toriet/ 61edf4d 93,552 % (namerané sirky.js: 1066,5 pri
   1140, 958 pri 1024, 718,5 pri 768), /svadby/ 3b83fa8 83,669 %. */
.stlpec--siroky { padding: 10px; width: 97.099%; }
.stlpec--uzsi { width: 95.385%; }
.stlpec--prichute { width: 93.552%; }
.stlpec--kombinacie { width: 83.669%; }
.stlpec--galeria { padding: 10px; width: 97.396%; }

/* Elementor vie dať stĺpcu medzeru medzi prvkami, namerané 20 na
   /ponuka-toriet/ v sekcii INTOLERANCIE (v ostatných stĺpcoch je 0).
   Prvky sú tým flexové položky, takže im spodné medzery nekolabujú von
   a odsek si nechá svojich 35,2. */
.stlpec--s-medzerou {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

/* ---------- Zoznamy ----------
   Namerané: 22px/36,3px váha 300, odsadenie zľava 20, medzera nad aj pod 22. */

/* Blok textu nadväzuje na nadpis bez medzery, odstupy si robia až odseky
   (35,2 pod sebou) a zoznamy (22 nad aj pod). */
.zoznam-blok {
  font-size: 22px;
  font-weight: 300;
  line-height: 36.3px;
  color: var(--vinova-svetla);
}

.zoznam-blok p { margin: 0 0 35.2px; }   /* namerané */

.zoznam-blok ul,
.zoznam-blok__stlpce ul {
  margin-block: 22px;
  padding-left: 20px;
  list-style: disc;
}

/* Zoznam rozdelený do stĺpcov. Stĺpcovanie sedí na obale, nie na zozname,
   presne ako v origináli, takže medzera 22 nad zoznamom ostane vnútri
   prvého stĺpca a blok o ňu nenarastie. */
.zoznam-blok__stlpce {
  font-size: 22px;
  font-weight: 300;
  line-height: 36.3px;
  color: var(--vinova-svetla);
  columns: 3;
  column-gap: 0;                   /* namerané */
}

/* Druhý dlhý zoznam má v origináli medzi stĺpcami 41 (namerané) */
.zoznam-blok__stlpce--samostatny { column-gap: 41px; }

/* Váha položiek sa líši zoznam od zoznamu, klient ju písal inline, takže
   niekde je 400 a inde 300. Predvolená je 300 (dedí sa z bloku), 400 sa
   pridáva triedou tam, kde je nameraná.
   Poslednú položku candybarového zoznamu klient inline štýlom minul, takže
   ostala na 300, bez tejto výnimky by sa líšila od originálu. */
.zoznam-blok--vaha-400 li,
.zoznam-blok__stlpce--vaha-400 li:not(:last-child) { font-weight: 400; }

/* Tučné medzinadpisy v cenníkoch, namerané 22px/25px váha 700 */
.zoznam-blok strong { font-weight: 700; }

/* Za zoznamom je v origináli ešte prázdny odsek, nič nezobrazuje, ale blok
   je oň o jeden riadok (36,3) vyšší. Namerané na /kaviarne-hotely/. */
.zoznam-blok--riadok-pod { padding-bottom: 36.3px; }

/* Originál tu má prázdny nadpis `<h3>&nbsp;</h3>`, nič nezobrazuje, ale
   blok je oň o 51,2 vyšší (31,2 nadpis + 20 medzera). Prázdny prvok
   neprepisujeme, len započítame jeho výšku. */
.zoznam-blok--medzera { padding-bottom: 51.2px; }

/* `break-inside: avoid` tu zámerne NIE JE: originál necháva dlhú položku
   pretiecť cez zlom stĺpca a bez toho sa stĺpce vyvážia inak (na /kolaciky/
   15 + 13 namiesto 14 + 14). */

/* ---------- Pásy fotiek ----------
   Všetky mriežky fotiek na podstránkach používajú ten istý orez 9 : 16
   (namerané: 133,75 × 237,77, 130 × 231,11, 117,7 × 209,27, 270 × 480 aj
   85 × 151,1 na mobile, všetko 0,5625). Líši sa len počet stĺpcov. */

.pas-galeria { padding-inline: 10px; }
.pas-galeria .obal { padding-block: 10px; }

.galeria-riadok {
  display: grid;
  gap: 10px;
}

.galeria-riadok img {
  width: 100%;
  aspect-ratio: 9 / 16;
  object-fit: cover;
}

.galeria-riadok--osem { grid-template-columns: repeat(8, 1fr); }
.galeria-riadok--sest { grid-template-columns: repeat(6, 1fr); }
.galeria-riadok--pat { grid-template-columns: repeat(5, 1fr); }
.galeria-riadok--styri { grid-template-columns: repeat(4, 1fr); }
.galeria-riadok--dve { grid-template-columns: repeat(2, 1fr); }

/* Šesť fotiek v štyroch stĺpcoch s medzerou 5, namerané na /svadby/
   (mriežka 628,6 = 4 × 153,4 + 3 × 5). */
.galeria-riadok--sest-v-styroch {
  grid-template-columns: repeat(4, 1fr);
  gap: 5px;
}

/* Niektoré mriežky majú štvorcové dlaždice namiesto orezu 9 : 16. */
.galeria-riadok--stvorcove img { aspect-ratio: 1 / 1; }

/* Tri štvorcové stĺpce s medzerou 1 (Elementor gallery 67d85e0 na /kolaciky/) */
.galeria-riadok--tri { grid-template-columns: repeat(3, 1fr); gap: 1px; }
.galeria-riadok--tri img { aspect-ratio: 1 / 1; }

/* Elementor gallery má pre tablet 2 stĺpce s medzerou 10. Prepína podľa
   vlastných hraníc (ako Swiper): desktop od 1024, tablet 767 až 1023,
   mobil do 766, teda o pixel inak než CSS rozloženie (768 / 1025). */
@media (max-width: 1023.98px) {
  .galeria-riadok { grid-template-columns: repeat(2, 1fr); gap: 10px; }
}

/* Zarovnaná (justified) mriežka, Elementor jej nedáva stĺpce, ale pevnú
   výšku riadku a šírku dopočíta z pomeru strán fotky; posledný riadok
   dotiahne na plnú šírku. Namerané na /ponuka-toriet/: päť fotiek 200 × 300
   a jedna 300 × 200, riadky vysoké 195 a 248,8 (na mobile 163,3 a 115,3). */
.galeria-riadok--zarovnana {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.galeria-riadok--zarovnana > li {
  --pomer: 0.66667;                       /* 200 × 300 */
  --vyska: 195px;
  height: var(--vyska);
  /* Tá stotina sa odpočítava zámerne: riadok vychádza na šírku kontajnera
     presne a bez rezervy by posledná fotka pretiekla do ďalšieho riadku.
     Rozdiel dorovná `flex-grow` v pomere strán, teda tak, ako to robí
     zarovnaná galéria. */
  flex: var(--pomer) 1 calc(var(--pomer) * var(--vyska) - 0.05px);
}

.galeria-riadok--zarovnana > li:nth-child(n+5) { --vyska: 248.8px; }
.galeria-riadok--zarovnana > li:last-child { --pomer: 1.5; }   /* 300 × 200 */

.galeria-riadok--zarovnana img {
  width: 100%;
  height: 100%;
  aspect-ratio: auto;
  object-fit: cover;
}

/* Rozloženie z js/galeria-zarovnana.js, vzorce 1:1 z e-gallery.min.css
   (`.e-gallery-justified`): kontajner drží výšku cez padding-bottom
   (pomer výšky k šírke), položky sú absolútne a ich šírka/poloha je podiel
   z (šírka − medzery). Medzera 10 = gap 10 / 10 / 10 z data-settings. */
.galeria-riadok--zarovnana.je-zarovnana {
  --hgap: 10px;
  --vgap: 10px;
  display: block;
  position: relative;
  height: 0;
  padding-bottom: calc(var(--container-aspect-ratio) * 100%);
}

.galeria-riadok--zarovnana.je-zarovnana > li {
  position: absolute;
  width: calc(var(--item-width) * (100% - var(--hgap) * var(--gap-count)));
  height: var(--item-height);
  top: calc(var(--item-top) + (var(--row) * var(--vgap)));
  left: calc(var(--item-start) * (100% - var(--hgap) * var(--gap-count)) + var(--hgap) * var(--item-row-index));
}

.galeria-riadok--zarovnana.je-zarovnana > li > a { height: 100%; }

/* ---------- Hover fotiek galérie ----------
   Elementor gallery `overlay_background: yes` na všetkých galériách mňamky
   (post-509/514/519/524.css): pri hoveri/focuse prekryv rgba(0,0,0,.5),
   prechod `--overlay-transition-duration: 800ms` (widget-gallery.min.css:
   transition-property mix-blend-mode, transform, opacity, background-color). */
.galeria-riadok a {
  position: relative;
  display: block;
  overflow: hidden;
}

.galeria-riadok a::after {
  content: '';
  position: absolute;
  inset: 0;
  background-color: transparent;
  transition: background-color 800ms;
}

.galeria-riadok a:hover::after,
.galeria-riadok a:focus::after { background-color: rgba(0, 0, 0, 0.5); }   /* Elementor CSS */

/* Mriežky na mobile (e-gallery do 766): 4 stĺpce, orez ostáva; šesť fotiek
   na /svadby/ v troch, dve fotky ostávajú v dvoch. */
@media (max-width: 766.98px) {
  .galeria-riadok--osem,
  .galeria-riadok--sest,
  .galeria-riadok--pat,
  .galeria-riadok--styri,
  .galeria-riadok--tri { grid-template-columns: repeat(4, 1fr); }
  .galeria-riadok--sest-v-styroch { grid-template-columns: repeat(3, 1fr); }
}

/* ---------- Astra ≤921 ----------
   Prázdny nadpis `<h3>&nbsp;</h3>`, ktorý blok predlžuje, má v Astre do 921 px
   1,25rem pri koreni 91,2 % (18,24 px × 1,3 = 23,7) namiesto 24 px × 1,3,
   blok je o 23,7 + 20 medzery dlhší (namerané na /kolaciky/ pri 768: o 7,5
   menej než pri 1024). */
@media (max-width: 921px) {
  .zoznam-blok--medzera { padding-bottom: 43.7px; }
}

/* ---------- Mobil (≤767) ---------- */

@media (max-width: 767px) {
  .blok { padding-inline: 3%; }                   /* Elementor mobil: 3 % po bokoch */
  .blok__obal { padding-block: 0; }
  .blok--uvod-uzky { padding-right: 4%; }         /* /kolaciky/: 3 % / 4 % */
  .blok--uvod-zvisly .blok__obal { padding-block: 3%; }   /* /ponuka-toriet/: 3 % dookola */

  .blok__obal--dva,
  .blok__obal--siroky-uzky,
  .blok__obal--uzky-siroky,
  .blok__obal--526-570,
  .blok__obal--514-649 { grid-template-columns: 1fr; }

  /* Vínová sekcia ide na mobile cez celú šírku, odsadenie má len zvislé;
     na /svadby/ má 3 % dookola. */
  .blok--vinovy { padding-inline: 0; }
  .blok--vinovy .blok__obal { padding-block: 3%; }
  .blok--vinovy-odsadeny { padding-inline: 3%; }

  /* Rad bodov sa zalomí, body po 46 % (Elementor mobil), medzera 20 */
  .body { flex-wrap: wrap; }
  .body > * { width: 46%; max-width: 46%; }

  /* na mobile idú aj tieto stĺpce cez celú šírku */
  .stlpec--galeria { width: auto; }

  .zoznam-blok__stlpce { columns: 1; }
  .zoznam-blok__stlpce--samostatny { columns: 2; column-gap: 12px; }

  /* Pás fotiek na /kolaciky/: 3 % zhora a po bokoch; na /svadby/,
     /ponuka-toriet/ a /kaviarne-hotely/ ostáva predvolených 10 dookola. */
  .pas-galeria { padding-inline: 3%; }
  .pas-galeria .obal { padding: 3% 0 0; }
  .pas-galeria--siroka { padding-inline: 10px; }
  .pas-galeria--siroka .obal { padding-block: 10px; }

  /* Zarovnaná mriežka sa na mobile láme inak, namerané riadky 163,3 a 115,3
     (tri fotky hore, tri dole). */
  .galeria-riadok--zarovnana > li { --vyska: 163.3px; }
  .galeria-riadok--zarovnana > li:nth-child(n+4) { --vyska: 115.3px; }

  /* Na mobile idú stĺpce cez celú šírku. Candybarový zoznam (d7a6b9a) má
     okraj 17 dookola a jeho stĺpec (dcba9fd) je flex v stĺpci so zalamovaním
     (`--flex-wrap-mobile: wrap`). Vo viacriadkovom flexe sa riadok roztiahne
     na fit-content najširšej položky, takže zoznam nikdy nie je užší než jeho
     min-content (dva stĺpce najdlhších slov + 12), ale ani širší než stĺpec
     (max-width 100 %). Namerané sirky.js: 335,2 pri 414 (= 369,2 − 34),
     327,9 pri 390 (min-content), 318,4 pri 360 (= 100 %). */
  .stlpec--siroky { width: auto; }
  .stlpec--uzsi { display: flex; flex-direction: column; flex-wrap: wrap; }
  .stlpec--uzsi > .blok__nadpis { width: 100%; }   /* nadpis: container-widget-width 100 % */
  .zoznam-blok__stlpce--samostatny { margin: 17px; max-width: 100%; }

  /* Elementor na /svadby/ posúva tretiu dlaždicu na koniec (`order: 99999`),
     Slaný bar je preto na mobile posledný. */
  .body > .bod--na-koniec { order: 99999; }
}