@media only screen and (max-width: 1230px) {
  /* mobilní menu = full-screen overlay (Figma ---menu_375): tmavé pozadí přes celý viewport,
     položky se zlatými odrážkami + kontakt dole; zavírá zlatý X (hamburger) vpravo nahoře. */
  .horni_menu {
    display: flex;
    flex-direction: column;
    position: fixed;
    inset: 0;
    top: 0;
    width: 100%;
    height: 100%;
    max-height: none;
    background-color: #131415;
    padding: 96px 0 40px 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    z-index: 95;
    opacity: 0;
    visibility: hidden;
    transform: translateX(7%);
    transition: opacity .32s ease, transform .32s ease, visibility 0s linear .32s;
  }
  .horni_menu.je-otevreno {
    opacity: 1;
    visibility: visible;
    transform: none;
    transition: opacity .32s ease, transform .32s ease;
  }
  /* X (hamburger) musí zůstat nad overlayem → vyšší z-index (header je fixed, hamburger tak drží vpravo nahoře) */
  .resp_menu { z-index: 120; }
  /* položky menu — větší, vzdušnější; boční odsazení na wrapperu, položka inline-block (obtéká text) */
  .horni_menu .obal_polozky_menu { width: 100%; box-sizing: border-box; padding-left: 8%; padding-right: 8%; }
  .horni_menu .polozka_menu,
  .hlavicka_roluje .horni_menu .polozka_menu {
    display: inline-block;
    font-size: 20px;
    line-height: 24px;
    font-weight: bold;
    padding: 10px 2px 10px 24px;
    background-position: left top 22px;
    background-size: 6px 6px;
  }
  /* underline efekt jako desktop, ale jen POD TEXTEM (položka je inline-block → right:2 = konec textu, ne celá šířka řádku) */
  .horni_menu .polozka_menu::after { display: block; left: 24px; right: 2px; bottom: 5px; }
  .horni_menu .obal_polozky_menu:last-of-type .polozka_menu { margin-bottom: 0; }
  .horni_menu .odsazeni_horni_menu_h { height: 8px; }
  .horni_menu .odsazeni_horni_menu_d { height: 28px; }

  /* kontakt pod položkami v overlay menu (specificita .horni_menu přebije base display:none) */
  .horni_menu .menu_mobil_kontakt {
    display: block;
    margin: 4px 8% 0 8%;
    padding: 24px 0 0 0;
  }
  .menu_mobil_kontakt .polozka_kontakt_home {
    font-size: 18px;
    line-height: 40px;
    margin: 14px 0;
  }
  /* jazykový přepínač uhne hamburgeru (62px vpravo) */
  .prepinac_jazyk {
    height: 62px;
    margin-right: 74px;
  }
}
/* kontakt v menu se zobrazuje jen v mobilním overlay */
.menu_mobil_kontakt { display: none; }
body.menu-zamek { overflow: hidden; }
/* otevřené menu: zrušit backdrop-filter/transform na headeru — jinak (po odscrollování, kdy je
   .hlavicka_roluje s backdrop-filter) vytváří containing block pro position:fixed overlay → menu
   se „uřízne" a má vlastní scrollbar místo celého viewportu. */
body.menu-zamek .hlavicka,
body.menu-zamek .hlavicka_in {
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  transform: none;
  filter: none;
}

.obal_submenu { transition: max-height .35s ease; }

/* HP služby — dle Figmy (homepage_1920, karta ~413×418): foto na CELOU kartu +
   tmavý gradient odspodu, název + odrážky + zlatá šipka jako overlay PŘES foto
   (NE plný šedý panel pod fotkou). Flex jen pro 3 sloupce + stejnou výšku. */
.blok_sluzby_home_in {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  align-items: stretch;
  text-align: left;
  font-size: initial;
}
.blok_sluzby_home_in > a {
  flex: 1 1 calc((100% - 40px) / 3);
  min-width: 260px;
  display: flex;
  text-decoration: none;
}
.blok_sluzby_home .polozka_sluzby_home {
  position: relative;
  width: 100%;
  margin: 0;
  overflow: hidden;
}
.polozka_sluzby_home_in {
  position: relative;
  display: block;
  width: 100%;
  height: 420px;
  line-height: normal;
}
.polozka_sluzby_home img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.polozka_sluzby_home_stin { display: block; z-index: 2; }
.polozka_sluzby_home_text {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  padding: 0 60px 40px 30px;
  box-sizing: border-box;
  z-index: 5;
}
.polozka_sluzby_home_tl { position: absolute; right: 0; bottom: 0; z-index: 8; }
@media (max-width: 1100px) { .blok_sluzby_home_in > a { flex-basis: calc((100% - 20px) / 2); } }

/* HP služby na mobilu = široké řádky dle Figmy (homepage_375): foto vlevo (bleeds) → gradient do šedé,
   název ExtraBold vpravo na šedé, zlatá šipka vpravo dole, BEZ odrážek. */
@media (max-width: 760px) {
  .blok_sluzby_home_in { display: block; }
  .blok_sluzby_home_in > a { display: block; width: 100%; min-width: 0; margin: 0 0 16px 0; }
  .blok_sluzby_home .polozka_sluzby_home {
    display: block;
    height: 154px;
    background-color: #353D41;
    overflow: hidden;
  }
  .polozka_sluzby_home_in { display: block; height: 100%; aspect-ratio: auto; }
  .polozka_sluzby_home img {
    position: absolute;
    left: 0; top: 0; right: auto; bottom: auto;
    width: 58%;
    height: 100%;
    aspect-ratio: auto;
    object-fit: cover;
  }
  .polozka_sluzby_home_stin {
    display: block;
    position: absolute;
    inset: 0;
    width: 100%; height: 100%;
    background: linear-gradient(to right, rgba(53,61,65,0) 22%, rgba(53,61,65,0.66) 44%, #353D41 58%);
  }
  .polozka_sluzby_home_text {
    position: absolute;
    left: auto; right: 18px; bottom: auto;
    top: 50%;
    transform: translateY(-50%);
    width: 46%;
    max-width: 190px;
    padding: 0;
    text-align: left;
    z-index: 5;
  }
  .polozka_sluzby_home_text_nazev {
    font-size: 22px;
    line-height: 1.16;
    font-weight: 800;
    letter-spacing: -0.44px;
    margin: 0;
  }
  .polozka_sluzby_home_text_odrazka { display: none; }
  .polozka_sluzby_home_tl { width: 48px; height: 46px; right: 0; bottom: 0; }
  .polozka_sluzby_home:hover { transform: none; box-shadow: none; }
  .polozka_sluzby_home:hover img { transform: none; }
}

.js [data-reveal] {
  opacity: 0;
  transform: translateY(48px) scale(0.965);
  transition: opacity .85s cubic-bezier(0.16, 1, 0.3, 1), transform .85s cubic-bezier(0.16, 1, 0.3, 1);
  will-change: opacity, transform;
}
.js [data-reveal="left"]  { transform: translateX(-48px); }
.js [data-reveal="right"] { transform: translateX(48px); }
.js [data-reveal].je-videt { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
  [data-reveal] { opacity: 1; transform: none; transition: none; }
  html { scroll-behavior: auto; }
}

/* slider (native scroll-snap) */
.slider { position: relative; }
.slider__track {
  display: flex;
  gap: 16px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  padding-bottom: 4px;
}
.slider__track::-webkit-scrollbar { display: none; }
.slider__track { cursor: grab; }
/* během tahu myší: instant scroll (ne smooth — jinak se každé scrollLeft animuje → sekání)
   + vypnout snap (pere se s drag pozicí) + bez výběru textu/obrázků */
.slider__track.je-tazeno {
  scroll-behavior: auto;
  scroll-snap-type: none;
  cursor: grabbing;
  user-select: none;
  -webkit-user-select: none;
}
.slider__track.je-tazeno img { pointer-events: none; }
.slider__item {
  flex: 0 0 calc((100% - 3 * 16px) / 4);
  scroll-snap-align: center; /* snap centruje aktivní panel/fotku (sjednoceno s JS stredItem/aktivni) */
  display: block;
  aspect-ratio: 4 / 3;
  overflow: hidden;
}
.slider__item img { width: 100%; height: 100%; object-fit: cover; display: block; }
@media (max-width: 1160px) { .slider__item { flex-basis: calc((100% - 2 * 16px) / 3); } }
@media (max-width: 760px)  { .slider__item { flex-basis: calc((100% - 16px) / 2); } }
@media (max-width: 480px)  { .slider__item { flex-basis: 100%; } }

.slider__item--auto { aspect-ratio: auto; overflow: visible; }
.slider--historie .slider__item { flex-basis: calc(100% / 3); }
@media (max-width: 1160px) { .slider--historie .slider__item { flex-basis: 50%; } }
/* na mobilu vw (ne %) → padding-inline track umí vycentrovat i první/poslední panel */
@media (max-width: 760px)  { .slider--historie .slider__item { flex-basis: 80vw; } }
@media (max-width: 480px)  { .slider--historie .slider__item { flex-basis: 86vw; } }

.slider__sip {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 48px;
  height: 48px;
  border: 0;
  cursor: pointer;
  background: #BD944A;
  z-index: 3;
  display: flex;
  align-items: center;
  justify-content: center;
}
.slider__sip--prev { left: 8px; }
.slider__sip--next { right: 8px; }
.slider__sip::before {
  content: "";
  width: 10px;
  height: 10px;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
}
.slider__sip--prev::before { transform: rotate(-135deg); margin-left: 4px; }
.slider__sip--next::before { transform: rotate(45deg); margin-right: 4px; }

/* lightbox (<dialog>) */
.lightbox {
  margin: 0;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: 100vw;
  max-height: 100vh;
  border: 0;
  padding: 0;
  background: transparent;
  align-items: center;
  justify-content: center;
  gap: 12px;
}
.lightbox[open] { display: flex; }
.lightbox::backdrop { background: rgba(0, 0, 0, .88); }
.lightbox__fig { margin: 0; display: flex; flex-direction: column; align-items: center; }
.lightbox__img { max-width: 88vw; max-height: 84vh; object-fit: contain; display: block; }
.lightbox__popis { color: #fff; margin-top: 12px; font-size: 14px; text-align: center; }
.lightbox__close, .lightbox__nav {
  border: 0;
  background: rgba(255, 255, 255, .12);
  cursor: pointer;
  position: relative;
  flex: 0 0 auto;
}
.lightbox__close { position: absolute; top: 20px; right: 20px; width: 44px; height: 44px; border-radius: 50%; }
.lightbox__close::before, .lightbox__close::after {
  content: ""; position: absolute; left: 50%; top: 50%; width: 18px; height: 2px; background: #fff;
}
.lightbox__close::before { transform: translate(-50%, -50%) rotate(45deg); }
.lightbox__close::after  { transform: translate(-50%, -50%) rotate(-45deg); }
.lightbox__nav { width: 52px; height: 52px; border-radius: 50%; }
.lightbox__nav::before { content: ""; position: absolute; left: 50%; top: 50%; width: 12px; height: 12px; border-top: 2px solid #fff; border-right: 2px solid #fff; }
.lightbox__nav--prev::before { transform: translate(-30%, -50%) rotate(-135deg); }
.lightbox__nav--next::before { transform: translate(-70%, -50%) rotate(45deg); }
@media (max-width: 760px) { .lightbox__nav { display: none; } }

/* modal validace (<dialog>) */
.modal {
  border: 0;
  padding: 0;
  width: 90vw;
  max-width: 460px;
  background: #363739;
  color: #fff;
}
.modal::backdrop { background: rgba(0, 0, 0, .6); }
.modal__telo { padding: 28px 30px 8px; }
.modal__nadpis { font-size: 20px; font-weight: 700; margin-bottom: 14px; }
.modal__chyba { display: block; padding: 4px 0; color: #e8b4b4; }
.modal__paticka { padding: 16px 30px 24px; text-align: right; }
.modal__ok { background: #BD944A; color: #fff; border: 0; padding: 12px 28px; cursor: pointer; font: inherit; }

.je-chyba { outline: 2px solid #c0392b; outline-offset: 1px; }

.ochrana_formulare { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }

/* McRai logo v patičce — inline SVG místo bitmapy */
.mcrai_pata_odkaz { float: right; display: inline-flex; align-items: center; gap: 9px; height: 22px; line-height: 22px; font-size: 14px; color: #fff; }
.mcrai_pata_odkaz:hover { color: #BD944A; }
.mcrai_pata_logo { display: inline-flex; }
.mcrai_pata_logo svg { height: 15px; width: auto; display: block; }
@media (max-width: 1230px) { .mcrai_pata_odkaz { float: none; } }

/* HP header na mobilu = 1 řádek vysoký 56px (Figma tembach-homepage_375):
   logo vlevo, CZ vpravo těsně před hamburgerem, vše vertikálně centrované.
   Předtím CZ wrapoval pod logo → hlavička 125px; hero se pak schoval pod fixed hlavičku. */
@media (max-width: 1230px) {
  .hlavicka_in,
  .hlavicka_roluje .hlavicka_in { padding: 0; }
  .hlavicka .blok_sirky_webu {
    display: flex;
    align-items: center;
    min-height: 56px;
  }
  .hlavicka .logo,
  .hlavicka_roluje .logo { float: none; margin: 0; height: 56px; flex: 0 0 auto; }
  /* nav je jen wrapper fixed overlaye → nesmí zabírat místo v řádku hlavičky */
  .hlavicka nav { width: 0; flex: 0 0 0; }
  .hlavicka .spacer,
  .hlavicka .stin_pro_menu { display: none; }
  .hlavicka .prepinac_jazyk,
  .hlavicka_roluje .prepinac_jazyk {
    float: none;
    height: 56px;
    margin: 0 84px 0 auto;   /* auto = doprava; 84px uhne 72px hamburgeru + mezera */
  }
  /* obsah/hero lícuje hned pod 56px hlavičku (bylo 62px) */
  .obsah { margin-top: 56px; }
  /* spodní linka headeru pryč + hero foto lícuje hned pod hlavičku (žádná 30px mezera) */
  .hlavicka { border-bottom: 0; }
  .uvodni_blok_home { padding-top: 0; }
}

/* HP hero text na mobilu — dle Figmy tembach-homepage_375:
   title 36/46, mezery 8px (eyebrow→title→perex), perex 16px JEN ŠEDÝ (#6A757B, žádná bílá slova). */
@media (max-width: 1100px) {
  .nazev_bloku_cik_cak_uvod { font-size: 36px; line-height: 46px; margin-top: 4px; }
  .blok_s_nadpisy_cik_cak_uvod { margin-bottom: 8px; }
  .obal_p_cik_cak_uvod { font-size: 16px; line-height: 22px; }
  /* perex je v datech obalen <strong> (desktop = bílé zvýraznění); na mobilu sjednotit na šedou */
  .obal_p_cik_cak_uvod strong { color: inherit; font-weight: inherit; }
  /* mezera mezi CTA buttony „Nabízené služby" → „Více o nás" = 8px dle Figmy (bylo 5px) */
  .tl_cik_cak_uvod { margin-bottom: 8px; }
}

/* HP výhody (benefits) na mobilu — dle Figmy: ikona 32px, text 16px, menší mezery (gap ikona→text 14px).
   Jen .polozka_vyhody_home (detail stránka .polozka_co_nabizime_detail zůstává). */
@media (max-width: 1100px) {
  .polozka_vyhody_home {
    line-height: 22px;
    padding: 6px 20px 6px 46px;
    background-size: auto 32px;
    /* ikona vertikálně centrovaná vůči celému 2řádkovému textu (dle Figmy) */
    background-position: left center;
    /* užší text box → zalomení na 2 řádky jako ve Figmě (ikona 32 + gap 14 + text ~219) */
    max-width: 285px;
  }
  /* 4. výhoda má <br class="br_pc"> (jinak skryté na mobilu) → odhalit, ať „služby" jde na 2. řádek dle Figmy */
  .polozka_vyhody_home .br_pc { display: inline; }
}

/* HP — sjednocená mezera mezi sekcemi na mobilu (40px nad sekcí, jako naše služby).
   Sekce s vlastním pozadím (benefits šedá, spolupracujeme bílá) drží symetrický vnitřní padding. */
@media (max-width: 1100px) {
  .blok_vyhody_home, .blok_sluzby_home, .blok_cik_cak_home, .blok_spolupracujeme_home, .blok_kontakt_home {
    padding-top: 40px;
    padding-bottom: 0;
  }
  .blok_vyhody_home, .blok_spolupracujeme_home { padding-bottom: 40px; }
}

/* HP naše služby na mobilu — nadpis 30/46 dle Figmy */
@media (max-width: 1100px) {
  /* nadpisový wrapper = plná šířka + 5% padding (jako hero text) → box sedne, zarovnání i 2řádkové zalomení */
  .blok_sluzby_home .blok_sirky_webu_uzky { width: 100%; padding-left: 5%; padding-right: 5%; box-sizing: border-box; }
  .blok_sluzby_home .nazev_bloku_home { font-size: 30px; line-height: 46px; letter-spacing: -0.6px; }
}

/* mobilní zalom nadpisů (opak .br_pc): skrytý na desktopu, zalomí jen na mobilu */
.br_resp { display: none; }
@media (max-width: 1100px) { .br_resp { display: inline; } }

/* HP O nás (cik-cak „Praktické zkušenosti") na mobilu — menší mezera, větší nadpis dle Figmy,
   fotka pryč, šedý text 16px, button na celou šířku jako hero buttony. */
@media (max-width: 1100px) {
  /* cik-cak má vnitřní strukturu (table/obr_prava) → menší padding-top, ať výsledná mezera = 40px jako Figma */
  .blok_cik_cak_home { padding-top: 16px; }
  /* nadpis 30/41 dle Figmy (mezera nad sekcí řeší globální blok).
     Nadpis = Figma šířka ~343 (širší než 5% box) → zalomí na 3 řádky jako Figma; text/button drží 5%. */
  .blok_cik_cak_home .nazev_bloku_cik_cak { font-size: 30px; line-height: 41px; letter-spacing: -0.6px; margin-inline: -10px; }
  /* vnitřní vrstvy cik-cak přidávaly dalších 40px nad nadpis (obr_prava 20 + td_text 20) → vynulovat,
     mezeru nad sekcí drží jen globální padding-top: 40px */
  .blok_cik_cak_home .blok_cik_cak_obr_prava { padding-top: 0; }
  .blok_cik_cak_home .cik_cak_td_text { padding-top: 0 !important; }
  /* fotka v sekci pryč (Figma ji nemá) */
  .blok_cik_cak_home .obr_cik_cak_resp { display: none; }
  /* text šedý 16px + zvýrazněná slova taky šedá (žádný bílý text v perexu) */
  .blok_cik_cak_home .obal_p_cik_cak { font-size: 16px; line-height: 22px; }
  .blok_cik_cak_home .obal_p_cik_cak strong { color: inherit; font-weight: inherit; }
  /* button „Více o nás" na celou šířku jako hero CTA (override inline display:inline-block) */
  .blok_cik_cak_home a[style] { display: block !important; }
  .blok_cik_cak_home .tl_cik_cak { display: block; width: 100%; box-sizing: border-box; text-align: center; }
}

/* HP spolupracujeme (loga) na mobilu — nadpis 30px dle Figmy + menší mezery (nadpis→loga, mezi řadami) */
@media (max-width: 1100px) {
  .blok_spolupracujeme_home .blok_sirky_webu_uzky { width: 100%; padding-left: 5%; padding-right: 5%; box-sizing: border-box; }
  .blok_spolupracujeme_home .nazev_bloku_home { font-size: 30px; line-height: 41px; letter-spacing: -0.6px; }
  /* nadpis → loga mezera (bylo 50px → Figma ~20) */
  .blok_spolupracujeme_home .blok_s_nadpisy_home { margin-bottom: 20px; }
  /* mezera mezi řadami log (bylo 14+14=28px → Figma ~8) */
  .blok_spolupracujeme_home .polozka_spolupracujeme_home { margin-top: 4px; margin-bottom: 4px; }
}

/* HP kontakt na mobilu — větší mezera mapa→Kontakt, nadpis 30px, větší email/tel, button na šířku */
@media (max-width: 1100px) {
  /* mezera pod buttonem, ať je vidět šedá linka (footer border-top); přebíjí globální padding-bottom: 0 */
  .blok_kontakt_home { padding-bottom: 40px; }
  /* větší mezera mezi mapou a sekcí Kontakt */
  .blok_kontakt_home_leva { margin-bottom: 36px; }
  .blok_kontakt_home_prava .nazev_bloku_home { font-size: 30px; line-height: 41px; letter-spacing: -0.6px; }
  /* email + telefon větší (Figma ~24px) */
  .blok_kontakt_home .polozka_kontakt_home { font-size: 24px; }
  /* button „Přejít do kontaktu" na celou šířku (override inline display:inline-block) */
  .blok_kontakt_home a[style] { display: block !important; }
  .blok_kontakt_home .tl_kontakt_home { display: block; width: 100%; box-sizing: border-box; text-align: center; }
}

/* Footer na mobilu — pořadí dle Figmy: Copyright → Zásady/Cookies → „Vyrobila a spravuje firma McRai" (bylo McRai před Zásady) */
@media (max-width: 1230px) {
  .paticka_in_d { display: flex; flex-direction: column; }
  .paticka_in_d .copyright_pata { order: 1; }
  .paticka_in_d nav { order: 2; }
  .paticka_in_d .mcrai_pata_odkaz { order: 3; }
  .paticka_in_d .spacer { order: 4; }
}

/* ============================================================
   PŘEHLED kategorie (prumysl/stavebnictvi/logistika → section-vypis.php)
   Stejné cik-cak classy jako HP O nás, ale MIMO .blok_cik_cak_home wrapper →
   HP overridy se sem nepropíšou, scope = .obal_polozek_vypis.
   ============================================================ */

/* Položky služeb (cik-cak) na mobilu — text 16px, menší mezery, buttony na celou šířku.
   Pozn.: bílá zvýrazněná slova v perexu ZŮSTÁVAJÍ (desktop i art je mají) — neměnit na šedou. */
@media (max-width: 1100px) {
  /* perex 16px (bylo 18); .obal_p_cik_cak strong = bílá z base (.obal_p_cik_cak strong{color:#FFF}) */
  .obal_polozek_vypis .obal_p_cik_cak { font-size: 16px; line-height: 22px; margin-bottom: 16px; }
  /* zmenšit mezeru obrázek → text (bylo margin-bottom 20px) */
  .obal_polozek_vypis .obr_cik_cak_resp { margin-bottom: 10px; }
  /* doladit mezeru u gold prefixů — položky padding 20/20 → 10/10 (jen výpisové sekce) */
  .obal_polozek_vypis .blok_cik_cak_obr_leva,
  .obal_polozek_vypis .blok_cik_cak_obr_prava { padding-top: 10px; padding-bottom: 10px; }
  /* button „Více informací" na celou šířku jako hero CTA (override inline display:inline-block) */
  .obal_polozek_vypis a[style] { display: block !important; }
  .obal_polozek_vypis .tl_cik_cak { display: block; width: 100%; box-sizing: border-box; text-align: center; margin-right: 0; }
}

/* Horní blok s H1 (název kategorie) na mobilu — utáhnout mezeru nad H1 (od hlavičky) i pod ním.
   Bylo padding 50px / 40px → 30px / 0 (spodní mezeru k 1. prefixu drží vnitřní padding položky). */
@media (max-width: 1100px) {
  .obsah_vypis_horni { padding-top: 30px; padding-bottom: 0; }
}

/* ============================================================
   DETAIL SLUŽBY (detail-sluzba.php → section-detail.php) na mobilu
   ============================================================ */

/* Hero — velikosti písma dle zadání: gold prefix 16px (už base), title 36px, perex 18px;
   mezera gold prefix → title 8px (bylo margin-top 28px na _in wrapperu ≈ 32px);
   mezera nad prefixem (od hlavičky) 50→20px (.blok_detail_hero padding-top). */
@media (max-width: 1100px) {
  .blok_detail_hero { padding-top: 20px; }
  .nazev_detail_hero { font-size: 36px; line-height: 44px; }
  .obal_p_detail_hero { font-size: 18px; line-height: 26px; }
  .blok_detail_hero_in { margin-top: 4px; }
}

/* Galerie — šipky úplně nalepené na strany (bylo 16% ~60px) + padding-bottom 50→0 */
@media (max-width: 1100px) {
  .blok_detail_galerie { padding-bottom: 0; }
  .blok_detail_galerie .slider__sip--prev { left: 0; }
  .blok_detail_galerie .slider__sip--next { right: 0; }
}

/* Popisná sekce — pryč brand piktogram (watermark) na mobilu + utáhnout velkou mezeru nad kontaktem
   (popis padding-bottom 60px → 0; sekční mezeru drží padding-top 40px formuláře, jako HP/přehled). */
@media (max-width: 1100px) {
  .piktogram_detail_popis { display: none; }
  .blok_detail_popis { padding-bottom: 0; }
}

/* Kontakt/formulář na detailu dědí globální .blok_s_formularem pravidla (= HP/přehled):
   nadpis 30px, email/tel 24px, submit „Odeslat dotaz" full-width. Není potřeba nic navíc. */

/* ============================================================
   O NÁS (o-nas.php) na mobilu — sjednotit fonty/mezery s patterny,
   proč-sekce jako HP výhody, trojúhelník „26 let" zmenšit.
   ============================================================ */

/* Hero — menší top mezera (60→24), perex 20→16px (jako ostatní perexy) */
@media (max-width: 1100px) {
  .obsah_clanek_o_nas .obsah_clanek_horni { padding-top: 24px; }
  .obsah_clanek_o_nas .zkraceny_vypis { font-size: 16px; line-height: 22px; }
}

/* Trojúhelník „26 let" — zmenšit ~40 % (scale 0.6) s pivotem v pravém dolním rohu (drží spodní pravý roh) */
@media (max-width: 1100px) {
  .trojuhelnik_clanek_o_nas { transform: scale(0.6); transform-origin: 100% 100%; }
}

/* Cik-cak „Mezinárodní" — nadpis 30px, perex 16px, položky seznamu 16px, menší mezera obrázek→text
   (jako HP/přehled cik-cak). strong v perexu = bílá zůstává (base). */
@media (max-width: 1100px) {
  .obal_cik_cak_detail .nazev_bloku_cik_cak { font-size: 30px; line-height: 41px; letter-spacing: -0.6px; }
  .obal_cik_cak_detail .obal_p_cik_cak { font-size: 16px; line-height: 22px; }
  .obal_cik_cak_detail li { font-size: 16px; line-height: 24px; }
  .obal_cik_cak_detail .obr_cik_cak_resp { margin-bottom: 10px; }
}

/* „Proč spolupracovat právě s námi" — nadpis 30px + položky stejné CSS jako HP výhody
   (ikona 32px, font 16px, ikona vert. centr. vůči 2řádk. textu, max-width 285px). */
@media (max-width: 1100px) {
  .blok_co_nabizime_detail_nadpis { font-size: 30px; line-height: 41px; letter-spacing: -0.6px; }
  .polozka_co_nabizime_detail {
    line-height: 22px;
    padding: 6px 20px 6px 46px;
    background-size: auto 32px;
    background-position: left center;
    max-width: 285px;
  }
}

/* ============================================================
   GDPR (gdpr.php → .obsah_gdpr) na mobilu — fonty/mezery + pryč lezecí watermark
   ============================================================ */
@media (max-width: 1100px) {
  /* hero — utáhnout mezery (60/100 → 24/16), perex 20→16px */
  .obsah_gdpr .obsah_clanek_horni { padding-top: 24px; padding-bottom: 16px; }
  .obsah_gdpr .zkraceny_vypis { font-size: 16px; line-height: 22px; }
  /* text sekce — velký horní padding (100px, byl kvůli watermarku) pryč; spodní mezeru drží formulář */
  .obsah_gdpr .obsah_clanek_text { padding-top: 8px; padding-bottom: 0; }
  /* „lezecí" brand watermark pryč na mobilu */
  .obsah_clanek_text_pozadi { display: none; }
  /* tělo zásad: nadpis sekce (h2) 20px, podnadpisy (h3) 18px, odstavce 16px */
  .obsah_gdpr .text_detail h2 { font-size: 20px; line-height: 28px; margin: 0 0 8px; }
  .obsah_gdpr .text_detail h3 { font-size: 18px; line-height: 24px; margin: 22px 0 6px; }
  .obsah_gdpr .text_detail p { font-size: 16px; line-height: 24px; }
}

/* Kontakt / formulářový blok (form.php) na mobilu — sjednotit s HP kontaktem (stejné CSS),
   ať sekce mezi sebou ladí: nadpis 30px, email/tel 24px, submit na celou šířku. */
@media (max-width: 1100px) {
  .blok_s_formularem .nazev_bloku_home { font-size: 30px; line-height: 41px; letter-spacing: -0.6px; }
  .blok_s_formularem .polozka_kontakt_home { font-size: 24px; }
  /* submit „Odeslat dotaz" na celou šířku jako ostatní mobilní buttony */
  .blok_s_formularem .form_tl_def { display: block; width: 100%; box-sizing: border-box; text-align: center; }
}