/* =========================================================
   ZAHRADY DVOŘÁKOVÁ – EDITOR STYLŮ
   CLEAN RELEASE 2026-10-23
   - odstraněny prokazatelné duplicity a překryté legacy bloky
   - bez gap / row-gap / column-gap
   - Veřejná zeleň: mobilní šipky sjednoceny s portfoliovým systémem
   ========================================================= */

/* ==================================================
   STABILNÍ VELIKOST TEXTU NA REÁLNÝCH TABLETECH / MOBILECH
   zabrání automatickému zvětšování některých textových bloků
   v Chrome / Safari mimo desktopovou emulaci
   ================================================== */

html,
body {
    -webkit-text-size-adjust: 100% !important;
    text-size-adjust: 100% !important;
}

html,
body,
#page,
.page,
#wrapper,
.wrapper,
#main,
.main,
#content,
.content,
.content-wrapper,
#incenterpage2,
#incenterpage2 > .article-content,
#right-box,
#right-box .article-content,
.right-box,
.right-box .article-content,
#rightbox,
.rightbox,
html body .hp-hero,
html body .hp-categories {
    background: #f7f4ed !important;
}

#main,
.main,
#content,
.content,
.content-wrapper {
    width: calc(100% - 40px) !important;
    max-width: 1400px !important;
    margin-left: auto !important;
    margin-right: auto !important;
} 
#search {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
}
html body #aroundpage {
    background: #f7f4ed !important;
    box-shadow: none !important;
}

/* ==================================================
   HLAVIČKA + LOGO + HLAVNÍ MENU – FINÁLNÍ VERZE
   bez ořezu rozbalovacího menu
   ================================================== */

.myheader,
.navigate_bar {
    background-color: #f7f4ed !important;
    background-image: none !important;
    border-bottom: none !important;
    box-shadow: none !important;
    overflow: visible !important;
}

html body .myheader {
    position: relative !important;
    padding-top: 14px !important;
    padding-bottom: 14px !important;
    box-shadow: none !important;
    overflow: visible !important;
    z-index: 1000 !important;
}

.header_slider {
    box-shadow: none !important;
}

.navigate_bar {
    position: relative !important;
    min-height: 88px !important;
    height: auto !important;
    display: flex !important;
    align-items: center !important;
    overflow: visible !important;
    z-index: 1001 !important;
}

/* LOGO – nenechat ořezat */
.logo-wrapper,
.logo_wrapper {
    overflow: visible !important;
}

.logo-wrapper img,
.logo_wrapper img {
    display: block !important;
    width: auto !important;
    height: auto !important;
    max-height: 72px !important;
    object-fit: contain !important;
}

#site_logo.mylogo {
    background-size: contain !important;
    background-position: left center !important;
    background-repeat: no-repeat !important;
    overflow: visible !important;
}

/* HLAVNÍ MENU */
#topmenu {
    position: relative !important;
    margin-top: 0 !important;
    overflow: visible !important;
    z-index: 5000 !important;
}

#topmenu ul,
#topmenu li {
    overflow: visible !important;
}

#topmenu #main-menu li.eshop-menu-home {
    display: none !important;
}

#topmenu ul li a {
    background: transparent !important;
    color: #2f312b !important;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    letter-spacing: 0.02em !important;
    padding-left: 12px !important;
    padding-right: 12px !important;
}

#topmenu ul li a:hover,
#topmenu ul li.active > a,
#topmenu ul li.selected > a {
    background: transparent !important;
    color: #687253 !important;
}

/* ROZBALOVACÍ MENU – celé nad hero obrázkem */
#topmenu ul ul {
    background: #f7f4ed !important;
    overflow: visible !important;
    z-index: 99999 !important;
    box-shadow: 0 8px 18px rgba(47,49,43,0.08) !important;
}

#topmenu ul ul li,
#topmenu ul ul li a {
    background: #f7f4ed !important;
    color: #2f312b !important;
}

#topmenu ul ul li a {
    white-space: nowrap !important;
}

#topmenu ul ul li a:hover,
#topmenu ul ul li.active > a,
#topmenu ul ul li.selected > a {
    background: #ece8de !important;
    color: #5f694c !important;
}

/* TYPOGRAFIE – NADČASOVÝ ATELIÉR */

/* základní text */
body,
input,
textarea,
button {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif !important;
}

/* hlavní nadpisy */
h1,
h2,
h3,
.content h1,
.content h2,
.content h3 {
    font-family: Constantia, Georgia, serif !important;
    font-weight: 400 !important;
    letter-spacing: -0.015em !important;
}


/* ==================================================
   TYPOGRAFICKÝ SYSTÉM – DESKTOP + TABLET
   hlavní narativ projektů zůstává 14 px / 1.65
   sekundární text 13 px / metadata 12–13 px
   labely sjednocené na 11 px
   ================================================== */

@media screen and (min-width: 701px) {

    /* Drobné kapitálkové labely:
       v jednotlivých článcích byly 10 nebo 12 px.
       Sjednocujeme pouze tuto úroveň!important; hlavní odstavce
       ponecháváme v jejich klidnější velikosti 14 px. */
    html body .article-content div[style*="font-size: 10px"][style*="letter-spacing"],
    html body .article-content div[style*="font-size:10px"][style*="letter-spacing"],
    html body .article-content div[style*="font-size: 12px"][style*="letter-spacing"],
    html body .article-content div[style*="font-size:12px"][style*="letter-spacing"] {
        font-size: 11px !important;
        line-height: 1.35 !important;
    }
}

/* Malé olivové texty – kontrast AA na #F7F4ED.
   Týká se i starších inline stylů uvnitř článků. */
html body .article-content [style*="color: #6f795b"],
html body .article-content [style*="color:#6f795b"],
html body .article-content [style*="color: #6F795B"],
html body .article-content [style*="color:#6F795B"] {
    color: #687253 !important;
}

/* HOMEPAGE – KATEGORIE RESPONZIVNĚ */
.hp-categories {
    width: calc(100vw - 80px)!important;
    max-width: 1200px!important;
    position: relative!important;
    left: 50%!important;
    transform: translateX(-50%)!important;
    display: flex!important;
    flex-wrap: wrap!important;
    margin: 0 auto!important;
}

.hp-categories > div {
    width: 25%!important;
    box-sizing: border-box!important;
    padding: 0 12px 0px 12px!important;
}

/* TABLET */
@media (max-width: 1180px) {
    .hp-categories {
        width: calc(100vw - 32px)!important;
    }

    .hp-categories > div {
        width: 50%!important;
        padding: 0 9px 18px 9px!important;
    }
}

/* TELEFON */

/* HOMEPAGE – O MNĚ */
.hp-about-grid {
    display: flex!important;
    align-items: center!important;
}

.hp-about-grid > div {
    box-sizing: border-box!important;
}

.hp-about-grid > div:nth-child(1) {
    width: 47%!important;
    padding-right: 14px!important;
}

.hp-about-grid > div:nth-child(2) {
    width: 22%!important;
    padding-left: 14px!important;
    padding-right: 14px!important;
}

.hp-about-grid > div:nth-child(3) {
    width: 31%!important;
    padding-left: 14px !important;
}

/* TABLET */
@media (max-width: 1180px) {
    .hp-about {
        width: calc(100vw - 24px) !important;
        padding: 30px !important;
    }

    .hp-about-grid {
        flex-wrap: wrap!important;
        align-items: stretch!important;
    }

    .hp-about-grid > div:nth-child(1) {
        width: 65%!important;
        padding-right: 10px!important;
    }

    .hp-about-grid > div:nth-child(2) {
        width: 35%!important;
        padding-left: 10px!important;
        padding-right: 0!important;
    }

    .hp-about-grid > div:nth-child(3) {
        width: 100%!important;
        padding-left: 0 !important;
        padding-top: 26px!important;
    }

    .hp-about-grid > div:nth-child(3) > div:nth-child(2) {
        font-size: 34px !important;
        line-height: 1.08 !important;
    }
}

/* TELEFON */
@media (max-width: 650px) {
    .hp-about {
        width: calc(100vw - 20px) !important;
        padding: 20px !important;
    }

    .hp-about-grid > div:nth-child(1) {
        width: 65%!important;
        padding-right: 6px!important;
    }

    .hp-about-grid > div:nth-child(2) {
        width: 35%!important;
        padding-left: 6px!important;
    }

    .hp-about-grid > div:nth-child(1) img,
    .hp-about-grid > div:nth-child(2) img {
        height: 180px !important;
    }

    .hp-about-grid > div:nth-child(3) {
        width: 100%!important;
        padding-top: 22px!important;
    }

    .hp-about-grid > div:nth-child(3) > div:nth-child(2) {
        font-size: 31px !important;
        line-height: 1.05 !important;
    }

    .hp-about-grid > div:nth-child(3) > div:nth-child(3) {
        font-size: 16px !important;
    }
}/* HOMEPAGE – KONTAKT */
.hp-contact-grid {
    display: flex!important;
    align-items: stretch!important;
}

.hp-contact-grid > div:nth-child(1) {
    width: 58%!important;
}

.hp-contact-grid > div:nth-child(2) {
    width: 42%!important;
}

/* TABLET */
@media (max-width: 1180px) {
    .hp-contact {
        width: calc(100vw - 24px) !important;
    }

    .hp-contact-grid > div:nth-child(1) {
        width: 52%!important;
    }

    .hp-contact-grid > div:nth-child(2) {
        width: 48%!important;
        padding: 38px 32px !important;
    }

    .hp-contact-grid img {
        min-height: 320px !important;
    }
}

/* TELEFON */
@media (max-width: 650px) {
    .hp-contact {
        width: calc(100vw - 24px) !important;
        margin-top: 24px !important;
    }

    .hp-contact-grid {
        flex-wrap: wrap!important;
    }

    .hp-contact-grid > div:nth-child(1),
    .hp-contact-grid > div:nth-child(2) {
        width: 100%!important;
    }

    .hp-contact-grid > div:nth-child(1) img {
        height: 240px !important;
        min-height: 0 !important;
        object-fit: cover !important;
    }

    .hp-contact-grid > div:nth-child(2) {
        padding: 30px 24px !important;
    }

    .hp-contact-grid > div:nth-child(2) > div:nth-child(2) {
        font-size: 30px !important;
        line-height: 1.12 !important;
    }
}/* KONTAKT – DOLADĚNÍ TABLETU */
@media (min-width: 651px) and (max-width: 1180px) {

    .hp-contact-grid > div:nth-child(1) {
        width: 45%!important;
    }

    .hp-contact-grid > div:nth-child(2) {
        width: 55%!important;
        padding: 30px 28px !important;
    }

    .hp-contact-grid > div:nth-child(2) > div:nth-child(2) {
        font-size: 34px !important;
        line-height: 1.08 !important;
    }
}
/* SKRÝT E-SHOP V RESPONZIVNÍM MENU */
html body #left-box .responsive-menu-button.eshop-menu-button {
    display: none !important;
}

/* MOBIL – ČISTÉ MENU BEZ PODBARVENÍ */
@media (max-width: 840px) {

    html body #left-box {
        background: transparent !important;
    }

    html body #left-box .responsive-menu-button.article-menu-button {
        background: transparent !important;
        color: #687253 !important;
        border: none !important;
        box-shadow: none !important;
        font-size: 14px !important;
        padding-top: 10px !important;
        padding-bottom: 10px !important;
    }

    html body #left-box .article-menu-button:before {
        color: #687253 !important;
    }
  }
/* MOBIL – BARVA HORNÍ LIŠTY OTEVŘENÉHO MENU */
@media (max-width: 840px) {
    html body .fixed-parent-node .direct-link-text {
        background: #6f795b !important;
    }
}
/* SKRÝT AUTOMATICKÝ VÝPIS PODMENU NA VNITŘNÍCH STRÁNKÁCH */
body.not-home .article-submenu {
    display: none !important;
}
  /* MOBIL – TEPLÉ POZADÍ HLAVIČKY */
@media (max-width: 840px) {
    .myheader,
    .navigate_bar {
        background-color: #f7f4ed !important;
    }
}
  /* MOBIL + TABLET – KOMPAKTNÍ HLAVIČKA */
@media (max-width: 840px) {

    /* pruh s logem */
    .myheader,
    .navigate_bar {
        background-color: #f7f4ed !important;
    }

    /* zrušit prostor původního mobilního menu */
    #left-box {
        position: static !important;
        min-height: 0 !important;
        height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    /* schovat druhé tlačítko e-shopu */
    .responsive-menu-button.eshop-menu-button {
        display: none !important;
    }

    /* hamburger doprava k logu */
 #left-box .responsive-menu-button.article-menu-button {
    position: absolute !important;
    top: 42px !important;
    right: 22px !important;

    width: 48px !important;
    height: 48px !important;
    min-height: 0 !important;

    margin: 0 !important;
    padding: 0 !important;

    background: transparent !important;
    color: #4f5831 !important;

    text-indent: -9999px !important;
    white-space: nowrap !important;
    overflow: hidden !important;

    z-index: 9999 !important;
}

#left-box .responsive-menu-button.article-menu-button::before {
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;

    width: 48px !important;
    height: 48px !important;

    text-indent: 0 !important;
    font-size: 24px !important;
    line-height: 48px !important;
    text-align: center !important;

    color: #4f5831 !important;
}
  /* MOBIL – NIŽŠÍ HLAVIČKA */
.myheader {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.navigate_bar {
    min-height: 120px !important;
}
  #aroundpage > hr.hide {
    display: none !important;
    margin: 0 !important;
    border: 0 !important;
}
  #incenterpage2 > .article-content:first-of-type {
    margin-top: 0 !important;
    padding-top: 0 !important;
}
  #incenterpage2 {
    padding-top: 0 !important;
    background-color: #f7f4ed !important;
    box-shadow: 0 0 0 100vmax #f7f4ed!important;
    clip-path: inset(0 -100vmax)!important;
}
  #incenterpage2 > .article-content:has(.hp-categories) {
    margin-top: 0 !important;
    padding-top: 0 !important;
}
  #incenterpage2 > .article-content:has(.kontakt-home) {
    margin-top: 0 !important;
    padding-top: 0 !important;
}
  }
 /* HOMEPAGE – OD NÁVRHU K PÉČI */
@media (min-width: 1025px) {

    .hp-services {
        width: calc(100vw - 80px) !important;
        max-width: 1200px !important;
        position: relative !important;
        left: 50% !important;
        transform: translateX(-50%) !important;
        margin: -30px auto 0 !important;
    }

    .hp-services .hp-intro {
        width: 100% !important;
        max-width: none !important;
        position: static !important;
        left: auto !important;
        transform: none !important;
        margin: 0 !important;
        padding: 0 0 28px 0 !important;
        text-align: center !important;
    }

    .hp-services .hp-categories {
        width: 100% !important;
        max-width: none !important;
        position: static !important;
        left: auto !important;
        transform: none !important;
        margin: 0 !important;
    }
}
  


  /* INFORMAČNÍ PÁS – TABLET + MOBIL */
@media (max-width: 900px) {

  .hp-categories > div:first-child {
    padding: 0 12px 24px 12px !important;
  }

  .hp-categories > div:first-child > div {
    display: flex !important;
    flex-wrap: nowrap !important;
    width: 100% !important;
    padding: 16px 4px !important;
  }

  .hp-categories > div:first-child > div > div {
    flex: 0 0 33.333% !important;
    width: 33.333% !important;
    min-width: 0 !important;
    padding: 6px 8px !important;
    box-sizing: border-box !important;

    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;

    text-align: center !important;
  }

  .hp-categories > div:first-child > div > div:not(:last-child) {
    border-right: 1px solid rgba(79,88,49,0.18) !important;
  }

  /* IKONKA */
  .hp-categories > div:first-child > div > div > div:first-child {
    width: auto !important;
    flex: none !important;
    font-size: 22px !important;
    line-height: 1 !important;
    margin: 0 0 4px 0 !important;
  }

  /* TEXTOVÝ BLOK */
  .hp-categories > div:first-child > div > div > div:last-child {
    width: 100% !important;
  }

  /* HLAVNÍ POPISEK */
  .hp-categories > div:first-child > div > div > div:last-child > div:first-child {
    font-size: 11px !important;
    line-height: 1.25 !important;
    letter-spacing: 0.05em !important;
    margin-bottom: 3px !important;
  }

  /* MALÝ PODTITULEK */
  .hp-categories > div:first-child > div > div > div:last-child > div:last-child {
    font-size: 11px !important;
    line-height: 1.3 !important;
  }
}
  

  /* MOBIL – srovnání textů pod kartami */


  /* MOBIL – 4 HLAVNÍ KATEGORIE JAKO KOMPAKTNÍ SEZNAM */


  

  /* MOBIL – menší mezera před Vybranými projekty */


  /* VYBRANÉ PROJEKTY – MOBILNÍ KOMPAKTNÍ SEZNAM */


  /* O MNĚ + KONTAKT – MOBILNÍ KOMPAKTNÍ VERZE */


  

  /* O MNĚ – MOBIL: PORTRÉT VLEVO, TEXT VEDLE */


  

  

  
  /* MOBIL – FINÁLNÍ DOLADĚNÍ SPODNÍ ČÁSTI */



  

  

  /* VYBRANÉ PROJEKTY – MOBIL: VĚTŠÍ FOTO + KOMPAKTNĚJŠÍ SEKCE */


  

  /* VYBRANÉ PROJEKTY – MOBIL / 3 VELKÉ KARTY */


  

  /* MOBIL – O MNĚ + KONTAKT bez fotografií */


  

  

  

  



/* ==================================================
   HOMEPAGE – VYBRANÉ PROJEKTY + O MNĚ / KONTAKT
   jediný finální blok
   ================================================== */

/* portrét na homepage schovat ve všech šířkách */
.home-about-contact-inner > div:first-child {
    display: none !important;
}


/* TABLET + DESKTOP */
@media screen and (min-width: 601px) {

    /* VYBRANÉ PROJEKTY */
    #projekty {
        width: min(1200px, calc(100vw - 80px)) !important;
        max-width: none !important;

        position: relative !important;
        left: 50% !important;
        transform: translateX(-50%) !important;

        margin-left: 0 !important;
        margin-right: 0 !important;
        box-sizing: border-box !important;
    }

    #projekty > div:nth-child(2) {
        display: flex !important;
        flex-wrap: nowrap !important;
        width: 100% !important;
    }

    #projekty > div:nth-child(2) > div {
        flex: 1 1 33.333% !important;
        width: 33.333% !important;
        min-width: 0 !important;

        margin: 0 !important;
        padding: 0 10px !important;
        box-sizing: border-box !important;
    }

    #projekty > div:nth-child(2) > div:first-child {
        padding-left: 0 !important;
    }

    #projekty > div:nth-child(2) > div:last-child {
        padding-right: 0 !important;
    }

    #projekty > div:nth-child(2) > div > a:first-child,
    #projekty > div:nth-child(2) > div > a:first-child img {
        display: block !important;
        width: 100% !important;
        height: auto !important;
    }

    /* O MNĚ + KONTAKT */
    .home-about-contact-inner {
        width: min(1200px, calc(100vw - 80px)) !important;
        max-width: none !important;

        position: relative !important;
        left: 50% !important;
        transform: translateX(-50%) !important;

        margin: 0 !important;

        display: flex !important;
        flex-wrap: nowrap !important;
        align-items: stretch !important;

        box-sizing: border-box !important;
    }

    .home-about,
    .home-contact {
        flex: 0 0 50% !important;
        width: 50% !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
    }

    .home-about {
    padding: 46px 48px !important;
    background: #eef1e4 !important;
    justify-content: flex-start !important;
}

.home-contact {
    padding: 46px 48px !important;
    background: #f7f4ed !important;
    justify-content: flex-start !important;
}

    .home-contact-details,
    .home-contact-details a,
    .home-quick-contact,
    .home-quick-contact a {
        font-size: 13px !important;
        line-height: 1.55 !important;
        font-weight: 500 !important;
        color: #4f5831 !important;
        text-decoration: none !important;
    }

    .home-contact-details,
    .home-quick-contact {
        margin-top: 12px !important;
    }
}


/* TABLET 601–900 PX – stojatý tablet zůstává bez desktopové kompenzace */
@media screen and (min-width: 601px) and (max-width: 900px) {

    #projekty,
    .home-about-contact-inner {
        width: calc(100vw - 56px) !important;
        max-width: none !important;

        left: 50% !important;
        transform: translateX(-50%) !important;
    }

    #projekty > div:nth-child(2) > div {
        padding-left: 7px !important;
        padding-right: 7px !important;
    }

    #projekty > div:nth-child(2) > div:first-child {
        padding-left: 0 !important;
    }

    #projekty > div:nth-child(2) > div:last-child {
        padding-right: 0 !important;
    }

    .home-about,
    .home-contact {
        flex: 0 0 50% !important;
        width: 50% !important;
        padding: 32px 28px !important;
    }

    .home-contact-details,
    .home-contact-details a,
    .home-quick-contact,
    .home-quick-contact a {
        font-size: 12px !important;
        line-height: 1.5 !important;
    }
}


/* PC + TABLET NA ŠÍŘKU – pouze spodní dvě sekce
   kompenzace Webarealu, která už se ukázala jako správná */
@media screen and (min-width: 901px) {

    #projekty,
    .home-about-contact-inner {
        transform: translateX(-39%) !important;
    }

    .home-about-contact,
    .article-content:has(.home-about-contact) {
        background: #f7f4ed !important;
    }

    .home-about {
        background: #eef1e4 !important;
    }

    .home-contact {
        background: #f7f4ed !important;
    }
}
/* HOMEPAGE – PÁS + 4 KARTY ZPĚT DO SPRÁVNÉ POLOHY */

/* PC */
@media screen and (min-width: 1181px) {
    .hp-categories {
        transform: translateX(-39%) !important;
        margin-bottom: -18px !important;
    }
}

/* TABLET NA ŠÍŘKU */
@media screen and (min-width: 900px) and (max-width: 1180px) and (orientation: landscape) {
    .hp-categories {
        transform: translateX(-39%) !important;
    }
}
/* ==================================================
   NOVÉ DVORY – PRAVÝ PANEL SKUTEČNĚ AŽ K OKRAJI
   ================================================== */
@media screen and (min-width: 901px) {

    html,
    body {
        overflow-x: hidden !important;
    }

    .hp-feature-text {
        position: relative !important;
        background: #f3f0e7 !important;
        box-shadow: none !important;
    }

    .hp-feature-text::after {
        content: "" !important;

        position: absolute !important;
        top: 0 !important;
        bottom: 0 !important;
        left: 100% !important;

        width: 100vw !important;

        background: #f3f0e7 !important;

        pointer-events: none !important;
    }
}
/* ==================================================
   KONTAKT – FINÁLNÍ ČISTÁ VERZE
   ================================================== */

.contact-single {
    width: calc(100% - 80px) !important;
    max-width: 980px !important;

    display: grid !important;
    grid-template-columns: 52% 48% !important;

    margin: 20px auto 55px auto !important;
    padding: 38px 42px !important;

    background: #eef1e4 !important;
    color: #2f312b !important;

    box-sizing: border-box !important;
}


/* LEVÝ SLOUPEC */

.contact-single-left {
    padding-right: 46px !important;
    box-sizing: border-box !important;
}

.contact-single-label {
    margin: 0 0 10px 0 !important;

    font-family: Arial, sans-serif !important;
    font-size: 9px !important;
    line-height: 1.2 !important;
    font-weight: 500 !important;
    letter-spacing: 0.14em !important;

    color: #687253 !important;
}

.contact-single-left h1 {
    margin: 0 !important;

    font-family: Constantia, Georgia, serif !important;
    font-size: 29px !important;
    line-height: 1.08 !important;
    font-weight: 400 !important;

    color: #2f312b !important;
}

.contact-single-left p {
    max-width: 400px !important;

    margin: 20px 0 0 0 !important;
    padding: 0 !important;

    font-size: 15px !important;
    line-height: 1.65 !important;

    color: #4b4d48 !important;
}


/* PRAVÝ SLOUPEC */

.contact-single-right {
    padding: 19px 0 0 42px !important;
    border-left: 1px solid rgba(111,121,91,0.22) !important;

    box-sizing: border-box !important;
}

.contact-single-right h2 {
    margin: 0 0 5px 0 !important;
    padding: 0 !important;

    font-family: Constantia, Georgia, serif !important;
    font-size: 21px !important;
    line-height: 1.2 !important;
    font-weight: 400 !important;

    color: #2f312b !important;
}

.contact-single-role {
    margin: 0 !important;
    padding: 0 !important;

    font-size: 12px !important;
    line-height: 1.45 !important;

    color: #687253 !important;
}

.contact-single-main {
    margin: 25px 0 0 0 !important;
    padding: 0 !important;
}

.contact-single-main a {
    display: block !important;

    margin: 0 !important;
    padding: 0 !important;

    font-size: 17px !important;
    line-height: 1.5 !important;
    font-weight: 600 !important;

    color: #4f5831 !important;
    text-decoration: none !important;
}

.contact-single-main a:hover {
    text-decoration: underline !important;
}

.contact-single-meta {
    margin: 18px 0 0 0 !important;
    padding: 0 !important;

    font-size: 12px !important;
    line-height: 1.5 !important;

    color: #4b4d48 !important;
}


/* MOBIL */

@media screen and (max-width: 767px) {

    .contact-single {
        width: calc(100% - 36px) !important;
        max-width: none !important;

        display: block !important;

        margin: 22px auto 42px auto !important;
        padding: 28px 24px 30px 24px !important;
    }

    .contact-single-left {
        padding: 0 !important;
    }

    .contact-single-left h1 {
        font-size: 27px !important;
    }

    .contact-single-right {
        margin-top: 24px !important;
        padding: 22px 0 0 0 !important;

        border-left: none !important;
        border-top: 1px solid rgba(111,121,91,0.22) !important;
    }

    .contact-single-right h2 {
        font-size: 21px !important;
    }

    .contact-single-main a {
        font-size: 16px !important;
    }
}

/* ==================================================
   HLAVNÍ MENU – ROZBALOVACÍ PODMENU / TABLET + PC
   všechny položky podmenu viditelné
   podporuje obě možné struktury Webarealu
   ================================================== */

@media screen and (min-width: 768px) {

    html body #topmenu,
    html body #topmenu #main-menu,
    html body #topmenu #main-menu > li,
    html body #topmenu #main-menu > ul > li {
        overflow: visible !important;
    }

    html body #topmenu #main-menu > li,
    html body #topmenu #main-menu > ul > li {
        position: relative !important;
    }

    /* samotné podmenu */
    html body #topmenu #main-menu > li > ul,
    html body #topmenu #main-menu > ul > li > ul {
        position: absolute !important;
        top: calc(100% - 2px) !important;
        left: 0 !important;

        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        pointer-events: none !important;

        width: max-content !important;
        min-width: 220px !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;

        margin: 0 !important;
        padding: 6px 0 !important;

        overflow: visible !important;
        list-style: none !important;

        background: #f7f4ed !important;
        box-shadow: 0 8px 18px rgba(47,49,43,0.08) !important;
        z-index: 99999 !important;
        box-sizing: border-box !important;
    }

    /* zobrazit celé podmenu při najetí / fokusu */
    html body #topmenu #main-menu > li:hover > ul,
    html body #topmenu #main-menu > li:focus-within > ul,
    html body #topmenu #main-menu > li > ul:hover,
    html body #topmenu #main-menu > ul > li:hover > ul,
    html body #topmenu #main-menu > ul > li:focus-within > ul,
    html body #topmenu #main-menu > ul > li > ul:hover {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        pointer-events: auto !important;
    }

    /* všechny položky podmenu – Webareal je nesmí schovat ani oříznout */
    html body #topmenu #main-menu > li > ul > li,
    html body #topmenu #main-menu > ul > li > ul > li {
        display: block !important;
        float: none !important;
        position: relative !important;

        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;

        margin: 0 !important;
        padding: 0 !important;

        overflow: visible !important;
        box-sizing: border-box !important;
    }

    html body #topmenu #main-menu > li > ul > li > a,
    html body #topmenu #main-menu > ul > li > ul > li > a {
        display: block !important;

        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;

        margin: 0 !important;
        padding: 10px 14px !important;

        white-space: nowrap !important;
        line-height: 1.35 !important;

        background: #f7f4ed !important;
        color: #2f312b !important;

        box-sizing: border-box !important;
    }

    html body #topmenu #main-menu > li > ul > li > a:hover,
    html body #topmenu #main-menu > li > ul > li.active > a,
    html body #topmenu #main-menu > li > ul > li.selected > a,
    html body #topmenu #main-menu > ul > li > ul > li > a:hover,
    html body #topmenu #main-menu > ul > li > ul > li.active > a,
    html body #topmenu #main-menu > ul > li > ul > li.selected > a {
        background: #ece8de !important;
        color: #687253 !important;
    }
}
/* ==================================================
   HOMEPAGE – FINÁLNÍ DESKTOP OSA
   kompenzace konstrukce šablony Webareal
   ================================================== */

@media screen and (min-width: 901px) {

    /* všechny běžné bloky homepage na jednu osu */
    html body #hp-principles,
    html body #oblasti,
    html body #projekty,
    html body #hp-about-final {
        width: min(1200px, calc(100vw - 80px)) !important;
        max-width: none !important;

        position: relative !important;
        left: 50% !important;
        transform: translateX(-39%) !important;

        margin-left: 0 !important;
        margin-right: 0 !important;

        box-sizing: border-box !important;
    }

    /* zrušit starý samostatný posun hp-categories,
       protože nyní řídíme osu nadřazeným blokem */
    html body .hp-categories {
        position: static !important;
        left: auto !important;
        transform: none !important;
        width: 100% !important;
        max-width: none !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
}
/* ==================================================
   HOMEPAGE – NOVÉ DVORY / FINÁLNÍ VÝŠKA PC
   ================================================== */

@media screen and (min-width: 901px) {

    html body #hp-feature-final {
        height: 600px !important;
        min-height: 600px !important;
        max-height: 600px !important;
    }

    html body #hp-feature-final > a {
        height: 600px !important;
        overflow: hidden !important;
    }

    html body #hp-feature-final > a > img {
        width: 100% !important;
        height: 600px !important;
        object-fit: cover !important;
        object-position: center center !important;
    }

    html body #hp-feature-final > div {
        height: 600px !important;
        box-sizing: border-box !important;
    }
}
/* ==================================================
   ROZBALOVACÍ MENU – ČISTÉ, BEZ DĚLICÍCH LINEK
   ================================================== */

@media screen and (min-width: 768px) {

    #topmenu #main-menu > ul > li > ul > li,
    #topmenu #main-menu > ul > li > ul > li > a {
        border: none !important;
        border-top: none !important;
        border-bottom: none !important;
        box-shadow: none !important;
        outline: none !important;
    }

    #topmenu #main-menu > ul > li > ul > li > a:hover,
    #topmenu #main-menu > ul > li > ul > li.active > a,
    #topmenu #main-menu > ul > li > ul > li.selected > a {
        background: #ece8de !important;
        color: #687253 !important;
    }
}
/* ==================================================
   HOMEPAGE – TABLET 768–900 PX
   finální osa + hierarchie hero
   ================================================== */

@media screen and (min-width: 768px) and (max-width: 900px) {


    /* ----------------------------------------------
       HOMEPAGE – JEDNOTNÁ OSA
       kompenzace konstrukce Webarealu
       ---------------------------------------------- */

    html body #hp-principles,
    html body #oblasti,
    html body #projekty,
    html body #hp-about-final {
        width: calc(100vw - 56px) !important;
        max-width: none !important;

        position: relative !important;
        left: 50% !important;
        transform: translateX(-39%) !important;

        margin-left: 0 !important;
        margin-right: 0 !important;

        box-sizing: border-box !important;
    }


    /* karty už neposouvat ještě jednou uvnitř oblasti */

    html body #oblasti .hp-categories {
        position: static !important;
        left: auto !important;
        transform: none !important;

        width: 100% !important;
        max-width: none !important;

        margin-left: 0 !important;
        margin-right: 0 !important;
    }
}

/* ==================================================
   HLAVIČKA – TABLET 768–1100 PX
   FINÁLNÍ OPRAVA STRUKTURY WEBAREALU
   logo + menu v jednom řádku
   ================================================== */

@media screen and (min-width: 841px) and (max-width: 1100px) {

    html body .myheader {
        position: relative !important;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
        overflow: visible !important;
    }

    html body .navigate_bar {
        min-height: 100px !important;
        height: auto !important;

        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        justify-content: flex-start !important;

        padding: 0 28px !important;

        overflow: visible !important;
        box-sizing: border-box !important;
    }

    /* LOGO */
    html body .logo-wrapper,
    html body .logo_wrapper {
        width: 225px !important;
        min-width: 225px !important;
        max-width: 225px !important;
        flex: 0 0 225px !important;

        margin: 0 18px 0 0 !important;
        padding: 0 !important;

        overflow: visible !important;
    }

    html body #site_logo.mylogo {
        width: 220px !important;
        height: 78px !important;

        margin: 0 !important;
        padding: 0 !important;

        background-size: contain !important;
        background-position: left center !important;
        background-repeat: no-repeat !important;
    }

    /* HLAVNÍ MENU */
    html body #topmenu {
        display: block !important;

        position: relative !important;

        flex: 1 1 auto !important;
        width: auto !important;
        min-width: 0 !important;

        margin: 0 !important;
        padding: 0 !important;

        overflow: visible !important;
    }

    /* #main-menu je ve Webarealu samotné UL */
    html body #topmenu #main-menu {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;

        justify-content: flex-end !important;
        align-items: center !important;

        width: 100% !important;

        margin: 0 !important;
        padding: 0 !important;

        list-style: none !important;
        box-sizing: border-box !important;
    }

    html body #topmenu #main-menu > li {
        display: block !important;
        float: none !important;

        flex: 0 0 auto !important;

        margin: 0 !important;
        padding: 0 !important;

        white-space: nowrap !important;

        position: relative !important;
    }

    html body #topmenu #main-menu > li > a {
        display: block !important;

        padding: 10px 6px !important;

        font-size: 10px !important;
        line-height: 1.2 !important;
        font-weight: 500 !important;
        letter-spacing: 0.01em !important;

        white-space: nowrap !important;
    }

    /* submenu zůstává rozbalovací */
    html body #topmenu #main-menu > li > ul {
        position: absolute !important;
        top: calc(100% - 2px) !important;
        left: 0 !important;

        display: none!important;
        z-index: 99999 !important;
    }

    html body #topmenu #main-menu > li:hover > ul,
    html body #topmenu #main-menu > li:focus-within > ul {
        display: block !important;
    }

    /* mobilní ovladače na tabletu nepotřebujeme */
    html body #left-box .responsive-menu-button.article-menu-button,
    html body #left-box .responsive-menu-button.eshop-menu-button {
        display: none !important;
    }

    html body #left-box {
        height: 0 !important;
        min-height: 0 !important;

        margin: 0 !important;
        padding: 0 !important;
    }
}
/* ==================================================
   HLAVIČKA – DOTYKOVÝ TABLET 768–840 PX
   používá nativní responzivní menu Webarealu
   místo hover podmenu, aby byly odkazy spolehlivě klikatelné
   ================================================== */

@media screen and (min-width: 768px) and (max-width: 840px) {

    html body #topmenu {
        display: none !important;
    }

    html body #left-box {
        display: block !important;
        position: static !important;
        width: 0 !important;
        min-width: 0 !important;
        height: 0 !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: visible !important;
        background: transparent !important;
    }

    html body #left-box .responsive-menu-button.article-menu-button {
        display: block !important;
        position: absolute !important;
        top: 36px !important;
        right: 28px !important;
        width: 48px !important;
        height: 48px !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        background: transparent !important;
        color: #4f5831 !important;
        border: none !important;
        box-shadow: none !important;
        text-indent: -9999px !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        z-index: 99999 !important;
    }

    html body #left-box .responsive-menu-button.article-menu-button::before {
        position: absolute !important;
        left: 0 !important;
        top: 0 !important;
        width: 48px !important;
        height: 48px !important;
        text-indent: 0 !important;
        font-size: 24px !important;
        line-height: 48px !important;
        text-align: center !important;
        color: #4f5831 !important;
    }

    html body #left-box .responsive-menu-button.eshop-menu-button {
        display: none !important;
    }

    html body .myheader,
    html body .navigate_bar {
        overflow: visible !important;
        background: #f7f4ed !important;
    }
}

/* ==================================================
   HOMEPAGE – TABLET 768–840 PX
   FINÁLNÍ OSA OBSAHU
   ================================================== */

@media screen and (min-width: 768px) and (max-width: 840px) {

    /* hlavní obsahové sekce */
    html body #hp-principles,
    html body #oblasti,
    html body #projekty,
    html body #hp-about-final {
        width: calc(100vw - 56px) !important;
        max-width: none !important;

        position: relative !important;
        left: 50% !important;
        transform: translateX(-35%) !important;

        margin-left: 0 !important;
        margin-right: 0 !important;

        box-sizing: border-box !important;
    }

    /* čtyři karty už uvnitř neposouvat podruhé */
    html body #oblasti .hp-categories {
        position: static !important;
        left: auto !important;
        transform: none !important;

        width: 100% !important;
        max-width: none !important;

        margin-left: 0 !important;
        margin-right: 0 !important;
    }

}


/* ==================================================
   NOVÉ DVORY – TABLET / PŘIROZENÝ FORMÁT FOTOGRAFIÍ
   768–980 PX
   Pavilon, altán a interiér už se na tabletu neořezávají.
   Desktopová mozaika zůstává beze změny.
   ================================================== */

@media screen and (min-width: 768px) and (max-width: 980px) {

    html body img[src*="nove-dvory_pavilon-oranzerie.jpg"],
    html body img[src*="nove-dvory_altan-cihlovy.jpg"],
    html body img[src*="nove-dvory_pavilon-interier.jpg"] {
        width: 100% !important;
        height: auto !important;
        object-fit: initial !important;
    }
}
/* ==================================================
   O MNĚ – TABLET 768–900 PX
   vyvážení portrétu a profilového textu
   ================================================== */

@media screen and (min-width: 768px) and (max-width: 900px) {

    html body .zd-about-profile {
        min-height: 305px !important;
    }

    html body .zd-about-photo {
        flex: 0 0 35% !important;
        width: 35% !important;
        height: 305px !important;
    }

    html body .zd-about-photo img {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
        object-position: center center !important;
    }

    html body .zd-about-profile-text {
        flex: 1 1 65% !important;
        padding: 30px 36px !important;
    }

    html body .zd-about-profile-text h2 {
        font-size: 32px !important;
        line-height: 1.12 !important;
        margin-bottom: 16px !important;
    }

    html body .zd-about-profile-text > div:last-child {
        max-width: 470px !important;
        font-size: 15px !important;
        line-height: 1.65 !important;
    }
}

/* =========================================================
   HOMEPAGE – PROFESNÍ PÁSEK / FINÁLNÍ VERZE
   čistě typografický, bez ikon
   ========================================================= */

html body #hp-principles .hp-principles-row {
    width: 100% !important;
    box-sizing: border-box !important;
    border-top: 1px solid rgba(111,121,91,0.18) !important;
    padding: 18px 0 16px 0 !important;
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0,1fr)) !important;
    align-items: stretch !important;
    background: transparent !important;
}

html body #hp-principles .hp-principle {
    min-width: 0 !important;
    padding: 0 34px !important;
    box-sizing: border-box !important;
    text-align: center !important;
}

html body #hp-principles .hp-principle:first-child {
    padding-left: 10px !important;
}

html body #hp-principles .hp-principle:last-child {
    padding-right: 10px !important;
}

html body #hp-principles .hp-principle + .hp-principle {
    border-left: 1px solid rgba(79,88,49,0.18) !important;
}

html body #hp-principles .hp-principle-title {
    margin: 0 0 5px 0 !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.25 !important;
    letter-spacing: 0.08em !important;
    color: #2F312B !important;
}

html body #hp-principles .hp-principle-text {
    margin: 0 !important;
    font-size: 13px !important;
    line-height: 1.45 !important;
    color: #62645C !important;
}

@media screen and (min-width: 768px) and (max-width: 900px) {
    html body #hp-principles .hp-principles-row {
        padding: 16px 0 15px 0 !important;
    }

    html body #hp-principles .hp-principle {
        padding: 0 18px !important;
    }

    html body #hp-principles .hp-principle:first-child {
        padding-left: 0 !important;
    }

    html body #hp-principles .hp-principle:last-child {
        padding-right: 0 !important;
    }

    html body #hp-principles .hp-principle-title {
        font-size: 12px !important;
        letter-spacing: 0.07em !important;
    }

    html body #hp-principles .hp-principle-text {
        font-size: 12px !important;
        line-height: 1.4 !important;
    }
}




/* =========================================================
   HOMEPAGE – HERO / FINÁLNÍ 10/10 VERZE
   velký obraz v rotátoru přes celou šířku
   textový dvousloupec samostatně pod obrazem
   + subtilní identifikace projektu v obraze
   ========================================================= */

/* Slider bez textových vrstev a ovládacích bodů */
.ms-layer,
.ms-slide-layers,
.ms-slide-layers * {
    display: none !important;
}

.header_slider .ms-bullets,
.header_slider .ms-bullet {
    display: none !important;
}

/* CTA – společné chování */
html body .hp-hero-button {
    box-sizing: border-box !important;
    transition: background-color 180ms ease, color 180ms ease, box-shadow 180ms ease !important;
}

html body .hp-hero-button:hover {
    background: #2F3A2E !important;
    color: #FFFFFF !important;
    text-decoration: none !important;
}

html body .hp-hero-button:focus-visible {
    background: #2F3A2E !important;
    color: #FFFFFF !important;
    outline: 2px solid #2F3A2E !important;
    outline-offset: 3px !important;
}


/* =========================================================
   DESKTOP 901+
   ========================================================= */

@media screen and (min-width: 901px) {

    html body .myheader .header_slider {
        display: block !important;
        width: 100vw !important;
        max-width: none !important;
        height: 525px !important;
        max-height: 525px !important;
        position: relative !important;
        left: 50% !important;
        margin-left: -50vw !important;
        margin-right: -50vw !important;
        overflow: hidden !important;
        box-shadow: none !important;
    }

    html body .myheader .master-slider-parent,
    html body .myheader .master-slider,
    html body .myheader .ms-view,
    html body .myheader .ms-slide,
    html body .myheader .ms-slide-bgcont {
        width: 100% !important;
        height: 525px !important;
        max-height: 525px !important;
    }

    html body .myheader .ms-slide-bgcont img {
        display: block !important;
        width: 100% !important;
        height: 100% !important;
        margin: 0 !important;
        object-fit: cover !important;
        object-position: center center !important;
        image-rendering: auto !important;
    }

    /* Subtilní legenda přímo v obraze – 2 úrovně */
    html body:has(.hp-hero) .myheader .header_slider::before {
        content: "ZÁMECKÁ ZAHRADA NOVÉ DVORY"!important;

        position: absolute !important;
        right: 30px !important;
        bottom: 45px !important;
        z-index: 40 !important;

        width: 168px !important;
        box-sizing: border-box !important;
        padding: 7px 10px 3px 10px !important;

        background: rgba(247,244,237,0.90) !important;
        color: #2F312B !important;

        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif !important;
        font-size: 9.5px !important;
        line-height: 1.25 !important;
        font-weight: 600 !important;
        letter-spacing: 0.065em !important;
        text-align: left !important;

        box-shadow: 0 1px 8px rgba(47,49,43,0.05) !important;
        pointer-events: none !important;
    }

    html body:has(.hp-hero) .myheader .header_slider::after {
        content: "SOUTĚŽNÍ NÁVRH · 2026"!important;

        position: absolute !important;
        right: 30px !important;
        bottom: 26px !important;
        z-index: 41 !important;

        width: 168px !important;
        box-sizing: border-box !important;
        padding: 2px 10px 7px 10px !important;

        background: rgba(247,244,237,0.90) !important;
        color: #687253 !important;

        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif !important;
        font-size: 8.5px !important;
        line-height: 1.25 !important;
        font-weight: 500 !important;
        letter-spacing: 0.075em !important;
        text-align: left !important;

        pointer-events: none !important;
    }

    html body #incenterpage2 > .article-content:has(.hp-hero) {
        margin-top: 0 !important;
        margin-bottom: 0 !important;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
        background: #F7F4ED !important;
    }

    html body .hp-hero {
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        background: #F7F4ED !important;
        box-sizing: border-box !important;
    }

    html body .hp-hero-shade {
        display: none !important;
    }

    html body .hp-hero-content {
        width: min(1200px, calc(100vw - 80px)) !important;
        max-width: none !important;
        position: relative !important;
        left: 50% !important;
        transform: translateX(-39%) !important;
        margin: 0 !important;
        padding: 18px 0 27px 0 !important;

        display: grid !important;
        grid-template-columns: minmax(0, 500px) minmax(0, 1fr) !important;
        align-items: start !important;

        text-align: left !important;
        box-sizing: border-box !important;
    }

    html body .hp-hero-title {
        grid-column: 1 !important;
        max-width: 500px !important;
        margin: 0 !important;
        padding: 0 !important;

        font-family: Constantia, Georgia, serif !important;
        font-weight: 400 !important;
        color: #2F312B !important;
    }

    html body .hp-hero-kicker {
        display: block !important;
        margin: 0 0 10px 0 !important;

        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif !important;
        font-size: 11px !important;
        line-height: 1.3 !important;
        font-weight: 500 !important;
        letter-spacing: 0.10em !important;
        color: #687253 !important;
    }

    html body .hp-hero-main {
        display: block !important;
        max-width: 500px !important;

        font-family: Constantia, Georgia, serif !important;
        font-size: 36px !important;
        line-height: 1.08 !important;
        font-weight: 400 !important;
        letter-spacing: -0.005em !important;
        color: #2F312B !important;
    }

    /* Pravý sloupec je opticky navázaný na první řádek hlavního claimu */
    html body .hp-hero-side {
        grid-column: 2 !important;
        max-width: 500px !important;
        padding-top: 29px !important;
        box-sizing: border-box !important;
    }

    html body .hp-hero-lead {
        max-width: 500px !important;
        margin: 0 !important;
        padding: 0 !important;

        font-size: 15px !important;
        line-height: 1.58 !important;
        color: #4B4D48 !important;
    }

    html body .hp-hero-actions {
        margin: 19px 0 0 0 !important;
        padding: 0 !important;
    }

    html body .hp-hero-button {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;

        width: auto !important;
        min-height: 42px !important;

        margin: 0 !important;
        padding: 11px 23px !important;

        background: #4F5831 !important;
        color: #FFFFFF !important;
        border: 0 !important;
        box-shadow: none !important;

        font-size: 12px !important;
        line-height: 1.35 !important;
        font-weight: 600 !important;
        letter-spacing: 0.06em !important;
        text-decoration: none !important;
        white-space: nowrap !important;
    }
}


/* =========================================================
   TABLET 768–900
   obraz nahoře, text pod ním
   ========================================================= */

@media screen and (min-width: 768px) and (max-width: 900px) {

    html body .myheader .header_slider {
        display: block !important;
        width: 100vw !important;
        max-width: none !important;
        height: clamp(320px, 42vw, 380px) !important;
        max-height: none !important;
        position: relative !important;
        left: 50% !important;
        margin-left: -50vw !important;
        margin-right: -50vw !important;
        overflow: hidden !important;
        background-image: url("/fotky130413/nove-dvory_01-hlavni-osa.jpg") !important;
        background-size: cover !important;
        background-position: center center !important;
        background-repeat: no-repeat !important;
        background-color: #F7F4ED !important;
    }

    /* MasterSlider – všechny vnitřní vrstvy musí na tabletu převzít výšku hero */
    html body .myheader .master-slider-parent,
    html body .myheader .master-slider,
    html body .myheader .ms-container,
    html body .myheader .ms-inner-controls-cont,
    html body .myheader .ms-view,
    html body .myheader .ms-slide-container,
    html body .myheader .ms-slide,
    html body .myheader .ms-slide-bgcont {
        width: 100% !important;
        height: 100% !important;
        min-height: 100% !important;
        max-height: none !important;
    }

    html body .myheader .ms-container,
    html body .myheader .ms-inner-controls-cont,
    html body .myheader .ms-view,
    html body .myheader .ms-slide-container {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        overflow: hidden !important;
    }

    /* TABLET: slider vizuálně zmrazit na prvním / aktivním obrazu.
       MasterSlider si jinak na 768 px ponechává inline transformaci mimo viewport. */
    html body .myheader .ms-slide-container {
        transform: none !important;
        -webkit-transform: none !important;
        left: 0 !important;
        top: 0 !important;
    }

    html body .myheader .ms-slide {
        transform: none !important;
        -webkit-transform: none !important;
    }

    html body .myheader .ms-slide-container > .ms-slide:first-child,
    html body .myheader .ms-slide.ms-sl-selected {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;

        position: absolute !important;
        left: 0 !important;
        top: 0 !important;

        width: 100% !important;
        height: 100% !important;

        transform: none !important;
        -webkit-transform: none !important;
    }

    /* pokud má rotátor více slidů, na tabletu necháme čistě první obraz */
    html body .myheader .ms-slide-container > .ms-slide:not(:first-child) {
        display: none !important;
    }

    html body .myheader .ms-slide-bgcont,
    html body .myheader .ms-slide-bgcont img {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        transform: none !important;
        -webkit-transform: none !important;
    }

    html body .myheader .ms-slide-bgcont img {
        width: 100% !important;
        height: 100% !important;
        max-width: none !important;
        object-fit: cover !important;
        object-position: center center !important;
        image-rendering: auto !important;
        margin: 0 !important;
    }

    html body:has(.hp-hero) .myheader .header_slider::before {
        content: "ZÁMECKÁ ZAHRADA NOVÉ DVORY"!important;

        position: absolute !important;
        right: 20px !important;
        bottom: 37px !important;
        z-index: 40 !important;

        width: 160px !important;
        box-sizing: border-box !important;
        padding: 7px 9px 3px 9px !important;

        background: rgba(247,244,237,0.90) !important;
        color: #2F312B !important;

        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif !important;
        font-size: 9.25px !important;
        line-height: 1.25 !important;
        font-weight: 600 !important;
        letter-spacing: 0.06em !important;
        text-align: left !important;

        box-shadow: 0 1px 7px rgba(47,49,43,0.05) !important;
        pointer-events: none !important;
    }

    html body:has(.hp-hero) .myheader .header_slider::after {
        content: "SOUTĚŽNÍ NÁVRH · 2026"!important;

        position: absolute !important;
        right: 20px !important;
        bottom: 18px !important;
        z-index: 41 !important;

        width: 160px !important;
        box-sizing: border-box !important;
        padding: 2px 9px 7px 9px !important;

        background: rgba(247,244,237,0.90) !important;
        color: #687253 !important;

        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif !important;
        font-size: 8.5px !important;
        line-height: 1.25 !important;
        font-weight: 500 !important;
        letter-spacing: 0.07em !important;
        text-align: left !important;

        pointer-events: none !important;
    }

    html body #incenterpage2 > .article-content:has(.hp-hero) {
        margin: 0 !important;
        padding: 0 !important;
    }

    html body .hp-hero {
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        background: #F7F4ED !important;
    }

    html body .hp-hero-shade {
        display: none !important;
    }

    html body .hp-hero-content {
        width: calc(100vw - 56px) !important;
        max-width: none !important;
        position: relative !important;
        left: 50% !important;
        transform: translateX(-35%) !important;
        margin: 0 !important;
        padding: 27px 0 31px 0 !important;
        display: block !important;
        box-sizing: border-box !important;
    }

    html body .hp-hero-title {
        max-width: 650px !important;
        margin: 0 !important;

        font-family: Constantia, Georgia, serif !important;
        font-weight: 400 !important;
        color: #2F312B !important;
    }

    html body .hp-hero-kicker {
        display: block !important;
        margin: 0 0 10px 0 !important;

        font-size: 10px !important;
        line-height: 1.3 !important;
        font-weight: 500 !important;
        letter-spacing: 0.10em !important;
        color: #687253 !important;
    }

    html body .hp-hero-main {
        display: block !important;
        max-width: 650px !important;

        font-family: Constantia, Georgia, serif !important;
        font-size: 30px !important;
        line-height: 1.10 !important;
        font-weight: 400 !important;
        color: #2F312B !important;
    }

    html body .hp-hero-side {
        max-width: 650px !important;
        padding-top: 18px !important;
    }

    html body .hp-hero-lead {
        max-width: 650px !important;
        margin: 0 !important;

        font-size: 14px !important;
        line-height: 1.58 !important;
        color: #4B4D48 !important;
    }

    html body .hp-hero-actions {
        margin: 19px 0 0 0 !important;
    }

    html body .hp-hero-button {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;

        min-height: 42px !important;
        padding: 10px 20px !important;

        background: #4F5831 !important;
        color: #FFFFFF !important;

        font-size: 11px !important;
        font-weight: 600 !important;
        letter-spacing: 0.06em !important;
        text-decoration: none !important;
    }

    html body .myheader .header_slider > .master-slider-parent,
    html body .myheader .header_slider .master-slider-parent {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        pointer-events: none !important;
    }

}




/* =========================================================
   HOMEPAGE – NOVÉ DVORY / TABLET 768–900
   současný blok #hp-feature-final: obraz nahoře, text pod ním
   ========================================================= */

@media screen and (min-width: 768px) and (max-width: 900px) {

    html body #hp-feature-final {
        width: calc(100vw - 56px) !important;
        max-width: none !important;

        position: relative !important;
        left: 50% !important;
        transform: translateX(-35%) !important;

        margin: 42px 0 0 0 !important;

        display: block !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;

        background: #F7F4ED !important;
        box-sizing: border-box !important;
        overflow: hidden !important;
    }

    html body #hp-feature-final > a {
        display: block !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        overflow: hidden !important;
        line-height: 0 !important;
    }

    html body #hp-feature-final > a > img {
        display: block !important;
        width: 100% !important;
        height: auto !important;
        max-height: none !important;
        object-fit: initial !important;
        object-position: center center !important;
    }

    html body #hp-feature-final > div {
        display: block !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;

        margin: 0 !important;
        padding: 30px 28px 34px 28px !important;

        background: #F7F4ED !important;
        box-sizing: border-box !important;
        overflow: hidden !important;
    }

    html body #hp-feature-final > div > div:nth-of-type(2) {
        font-size: 31px !important;
        line-height: 1.10 !important;
    }

    html body #hp-feature-final > div > div:nth-of-type(3),
    html body #hp-feature-final > div > div:nth-of-type(4) {
        max-width: 580px !important;
    }
}

/* =========================================================
   MOBIL DO 767
   obraz nahoře, text pod ním
   ========================================================= */

@media screen and (max-width: 767px) {

    html body .myheader .header_slider {
        display: block !important;
        width: 100vw !important;
        max-width: none !important;
        height: 250px !important;
        max-height: 250px !important;
        position: relative !important;
        left: 50% !important;
        margin-left: -50vw !important;
        margin-right: -50vw !important;
        overflow: hidden !important;
        background-image: url("/fotky130413/nove-dvory_01-hlavni-osa.jpg") !important;
        background-size: cover !important;
        background-position: center center !important;
        background-repeat: no-repeat !important;
        background-color: #F7F4ED !important;
    }

    html body .myheader .master-slider-parent,
    html body .myheader .master-slider,
    html body .myheader .ms-view,
    html body .myheader .ms-slide,
    html body .myheader .ms-slide-bgcont {
        width: 100% !important;
        height: 250px !important;
        max-height: 250px !important;
    }

    html body .myheader .ms-slide-bgcont img {
        width: 100% !important;
        height: 250px !important;
        object-fit: cover !important;
        object-position: center center !important;
        image-rendering: auto !important;
        margin: 0 !important;
    }

    html body:has(.hp-hero) .myheader .header_slider::before {
        content: "ZÁMECKÁ ZAHRADA NOVÉ DVORY"!important;

        position: absolute !important;
        right: 14px !important;
        bottom: 31px !important;
        z-index: 40 !important;

        width: 148px !important;
        box-sizing: border-box !important;
        padding: 6px 8px 3px 8px !important;

        background: rgba(247,244,237,0.92) !important;
        color: #2F312B !important;

        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif !important;
        font-size: 9px !important;
        line-height: 1.22 !important;
        font-weight: 600 !important;
        letter-spacing: 0.05em !important;
        text-align: left !important;

        box-shadow: 0 1px 6px rgba(47,49,43,0.05) !important;
        pointer-events: none !important;
    }

    html body:has(.hp-hero) .myheader .header_slider::after {
        content: "SOUTĚŽNÍ NÁVRH · 2026"!important;

        position: absolute !important;
        right: 14px !important;
        bottom: 13px !important;
        z-index: 41 !important;

        width: 148px !important;
        box-sizing: border-box !important;
        padding: 2px 8px 6px 8px !important;

        background: rgba(247,244,237,0.92) !important;
        color: #687253 !important;

        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif !important;
        font-size: 8.25px !important;
        line-height: 1.22 !important;
        font-weight: 500 !important;
        letter-spacing: 0.06em !important;
        text-align: left !important;

        pointer-events: none !important;
    }

    html body #incenterpage2 > .article-content:has(.hp-hero) {
        margin: 0 !important;
        padding: 0 !important;
    }

    html body .hp-hero {
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        background: #F7F4ED !important;
    }

    html body .hp-hero-shade {
        display: none !important;
    }

    html body .hp-hero-content {
        position: static !important;
        width: calc(100% - 36px) !important;
        max-width: none !important;

        margin: 0 auto !important;
        padding: 23px 0 27px 0 !important;

        transform: none !important;
        text-align: left !important;
        box-sizing: border-box !important;
    }

    html body .hp-hero-title {
        margin: 0 !important;

        font-family: Constantia, Georgia, serif !important;
        font-weight: 400 !important;
        color: #2F312B !important;
    }

    html body .hp-hero-kicker {
        display: block !important;
        margin: 0 0 9px 0 !important;

        font-size: 10px !important;
        line-height: 1.3 !important;
        font-weight: 500 !important;
        letter-spacing: 0.10em !important;
        color: #687253 !important;
    }

    html body .hp-hero-main {
        display: block !important;

        font-family: Constantia, Georgia, serif !important;
        font-size: 27px !important;
        line-height: 1.08 !important;
        font-weight: 400 !important;
        color: #2F312B !important;
    }

    html body .hp-hero-side {
        padding-top: 16px !important;
    }

    html body .hp-hero-lead {
        margin: 0 !important;

        font-size: 14px !important;
        line-height: 1.55 !important;
        color: #4B4D48 !important;
    }

    html body .hp-hero-actions {
        margin: 18px 0 0 0 !important;
    }

    html body .hp-hero-button {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;

        min-height: 44px !important;
        padding: 11px 19px !important;

        background: #4F5831 !important;
        color: #FFFFFF !important;

        font-size: 11px !important;
        font-weight: 600 !important;
        letter-spacing: 0.06em !important;
        text-decoration: none !important;
    }

    html body .myheader .header_slider > .master-slider-parent,
    html body .myheader .header_slider .master-slider-parent {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        pointer-events: none !important;
    }

}

/* =========================================================
   HOMEPAGE – MOBIL 360–600 PX / JEDINÁ FINÁLNÍ VRSTVA
   FINAL 10/10 – mobile first
   ========================================================= */

@media screen and (max-width: 600px) {

    /* -----------------------------------------------------
       1 / HLAVIČKA – výraznější logo, klidnější hamburger
       ----------------------------------------------------- */

    html body .myheader {
        padding: 0 !important;
    }

    html body .navigate_bar {
        position: relative !important;
        height: 74px !important;
        min-height: 74px !important;
        margin: 0 !important;
        padding: 0 !important;
        background: #F7F4ED !important;
        box-sizing: border-box !important;
        overflow: visible !important;
    }

    html body .logo-wrapper,
    html body .logo_wrapper {
        position: absolute !important;
        left: 14px !important;
        top: 50% !important;
        transform: translateY(-50%) !important;

        width: 270px !important;
        min-width: 270px !important;
        max-width: 270px !important;
        height: 70px !important;

        margin: 0 !important;
        padding: 0 !important;
        overflow: visible !important;
    }

    html body #site_logo.mylogo {
        width: 270px !important;
        height: 70px !important;
        margin: 0 !important;
        padding: 0 !important;
        background-size: contain !important;
        background-position: left center !important;
        background-repeat: no-repeat !important;
    }

    html body #left-box .responsive-menu-button.article-menu-button {
        position: absolute !important;
        top: 18px !important;
        right: 13px !important;
        width: 38px !important;
        height: 38px !important;
        margin: 0 !important;
    }

    html body #left-box .responsive-menu-button.article-menu-button::before {
        width: 38px !important;
        height: 38px !important;
        font-size: 20px !important;
        line-height: 38px !important;
    }


    /* -----------------------------------------------------
       2 / HERO – obraz a popisek beze změny,
           textová část lépe využije mobilní šířku
       ----------------------------------------------------- */

    html body:has(.hp-hero) .myheader .header_slider::before {
        content: "ZÁMECKÁ ZAHRADA NOVÉ DVORY" !important;
        right: 10px !important;
        bottom: 28px !important;
        width: 190px !important;
        padding: 5px 8px 2px 8px !important;
        box-sizing: border-box !important;
        background: rgba(247,244,237,0.92) !important;
        color: #2F312B !important;
        font-size: 8px !important;
        line-height: 1.15 !important;
        font-weight: 600 !important;
        letter-spacing: 0.035em !important;
        white-space: nowrap !important;
    }

    html body:has(.hp-hero) .myheader .header_slider::after {
        content: "SOUTĚŽNÍ NÁVRH · 2026" !important;
        right: 10px !important;
        bottom: 13px !important;
        width: 190px !important;
        padding: 1px 8px 5px 8px !important;
        box-sizing: border-box !important;
        background: rgba(247,244,237,0.92) !important;
        color: #687253 !important;
        font-size: 7.7px !important;
        line-height: 1.15 !important;
        font-weight: 500 !important;
        letter-spacing: 0.055em !important;
        white-space: nowrap !important;
    }

    /* HERO článek vytáhnout z globálně zúženého #main */
    html body #incenterpage2 > .article-content:has(.hp-hero) {
        width: 100vw !important;
        max-width: none !important;

        position: relative !important;
        left: 50% !important;
        transform: translateX(-50%) !important;

        margin-left: 0 !important;
        margin-right: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;

        overflow: visible !important;
        box-sizing: border-box !important;
    }

    html body .hp-hero {
        width: 100% !important;
        max-width: none !important;
        margin: 0 !important;
        padding: 0 !important;
        box-sizing: border-box !important;
    }

    html body .hp-hero-content {
        width: calc(100% - 20px) !important;
        max-width: none !important;

        position: static !important;
        left: auto !important;
        transform: none !important;

        margin: 0 auto !important;
        padding-top: 23px !important;
        padding-right: 0 !important;
        padding-bottom: 10px !important;
        padding-left: 0 !important;
        box-sizing: border-box !important;
    }

    html body .hp-hero-title,
    html body .hp-hero-main,
    html body .hp-hero-side,
    html body .hp-hero-lead,
    html body .hp-hero-actions {
        width: 100% !important;
        max-width: none !important;
    }

    /* claim lehce přesáhne do stran, bez zásahu do hero obrázku */
    html body .hp-hero-title {
        width: calc(100% + 8px) !important;
        margin-left: -4px !important;
        margin-right: -4px !important;
    }

    html body .hp-hero-side {
        width: calc(100% + 8px) !important;
        margin-left: -4px !important;
        margin-right: -4px !important;
    }

    html body .hp-hero-main {
        font-size: 26px !important;
        line-height: 1.08 !important;
    }

    html body .hp-hero-lead {
        font-size: 14px !important;
        line-height: 1.52 !important;
    }

    html body .hp-hero-actions {
        margin-top: 18px !important;
    }

    html body .hp-hero-button {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
        max-width: none !important;
        min-height: 44px !important;
        padding: 11px 18px !important;
        box-sizing: border-box !important;
        text-align: center !important;
        white-space: nowrap !important;
    }


    /* -----------------------------------------------------
       3 / PROFESNÍ PÁSEK – 3 sloupce, čitelnější typografie
       ----------------------------------------------------- */

    html body #hp-principles {
        width: calc(100vw - 16px) !important;
        max-width: none !important;
        position: relative !important;
        left: 50% !important;
        transform: translateX(-50%) !important;

        /* vytáhnout profesní pásek nahoru – skutečný zdroj mezery */
        margin: -34px 0 0 0 !important;

        box-sizing: border-box !important;
    }

    html body #hp-principles > div,
    html body #hp-principles .hp-principles-row {
        width: 100% !important;
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0,1fr)) !important;
        align-items: stretch !important;
        padding: 15px 0 14px 0 !important;
        border-top: 1px solid rgba(79,88,49,0.16) !important;
        border-bottom: 1px solid rgba(79,88,49,0.16) !important;
        box-sizing: border-box !important;
    }

    html body #hp-principles > div > div,
    html body #hp-principles .hp-principle {
        min-width: 0 !important;
        width: auto !important;
        padding: 0 9px !important;
        box-sizing: border-box !important;
        text-align: left !important;
        border-top: 0 !important;
        border-bottom: 0 !important;
    }

    html body #hp-principles > div > div:first-child,
    html body #hp-principles .hp-principle:first-child {
        padding-left: 2px !important;
    }

    html body #hp-principles > div > div:last-child,
    html body #hp-principles .hp-principle:last-child {
        padding-right: 2px !important;
    }

    html body #hp-principles > div > div + div,
    html body #hp-principles .hp-principle + .hp-principle {
        border-left: 1px solid rgba(79,88,49,0.16) !important;
    }

    html body #hp-principles > div > div > div:first-child,
    html body #hp-principles .hp-principle-title {
        margin: 0 0 4px 0 !important;
        font-size: 10.3px !important;
        line-height: 1.22 !important;
        font-weight: 600 !important;
        letter-spacing: 0.04em !important;
        color: #4F5831 !important;
    }

    html body #hp-principles > div > div > div:last-child,
    html body #hp-principles .hp-principle-text {
        margin: 0 !important;
        font-size: 11.2px !important;
        line-height: 1.36 !important;
        color: #62645C !important;
    }


    /* -----------------------------------------------------
       4 / OBLASTI TVORBY – ponechat schválenou kompozici
       ----------------------------------------------------- */

    html body #oblasti {
        width: calc(100vw - 28px) !important;
        max-width: none !important;
        position: relative !important;
        left: 50% !important;
        transform: translateX(-50%) !important;
        margin: 25px 0 0 0 !important;
        box-sizing: border-box !important;
    }

    html body #oblasti > div:first-child {
        display: flex !important;
        align-items: center !important;
        width: 100% !important;
        margin: 0 0 8px 0 !important;
    }

    html body #oblasti > div:first-child > div:first-child {
        font-size: 9.8px !important;
        line-height: 1.3 !important;
        letter-spacing: 0.08em !important;
        color: #687253 !important;
    }

    html body #oblasti > h2 {
        display: block !important;
        margin: 0 0 18px 0 !important;
        font-family: Constantia, Georgia, serif !important;
        font-size: 26px !important;
        line-height: 1.10 !important;
        font-weight: 400 !important;
        color: #2F312B !important;
    }

    html body #oblasti > div:last-child {
        display: block !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        box-sizing: border-box !important;
    }

    html body #oblasti > div:last-child > div {
        position: relative !important;
        display: grid !important;
        grid-template-columns: 112px minmax(0,1fr) 18px !important;
        align-items: center !important;
        width: 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 9px 0 !important;
        border-bottom: 1px solid rgba(79,88,49,0.15) !important;
        box-sizing: border-box !important;
    }

    html body #oblasti > div:last-child > div:first-child {
        border-top: 1px solid rgba(79,88,49,0.15) !important;
    }

    html body #oblasti > div:last-child > div > div:first-child {
        grid-column: 1 !important;
        width: 100px !important;
        height: 68px !important;
        margin: 0 !important;
        overflow: hidden !important;
    }

    html body #oblasti > div:last-child > div > div:first-child img {
        display: block !important;
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
        object-position: center center !important;
    }

    html body #oblasti > div:last-child > div > div:nth-child(2) {
        grid-column: 2 !important;
        margin: 0 !important;
        padding: 0 !important;
        font-size: 10.9px !important;
        line-height: 1.28 !important;
        font-weight: 600 !important;
        letter-spacing: 0.02em !important;
        color: #2F312B !important;
    }

    html body #oblasti > div:last-child > div > div:nth-child(3),
    html body #oblasti > div:last-child > div > div:nth-child(4) {
        display: none !important;
    }

    html body #oblasti > div:last-child > div::after {
        content: "→" !important;
        grid-column: 3 !important;
        font-size: 15px !important;
        line-height: 1 !important;
        color: #4F5831 !important;
        text-align: right !important;
        pointer-events: none !important;
    }


    /* -----------------------------------------------------
       5 / NOVÉ DVORY – ponechat silný flagship blok
       ----------------------------------------------------- */

    html body #hp-feature-final {
        width: calc(100vw - 18px) !important;
        max-width: none !important;
        position: relative !important;
        left: 50% !important;
        transform: translateX(-50%) !important;
        margin: 34px 0 0 0 !important;
        display: block !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        box-sizing: border-box !important;
        overflow: hidden !important;
    }

    html body #hp-feature-final > a {
        display: block !important;
        width: 100% !important;
        height: auto !important;
        flex: none !important;
        line-height: 0 !important;
        overflow: hidden !important;
    }

    html body #hp-feature-final > a > img {
        display: block !important;
        width: 100% !important;
        height: auto !important;
        max-height: none !important;
        object-fit: initial !important;
        object-position: center center !important;
        margin: 0 !important;
    }

    html body #hp-feature-final > div {
        display: block !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 20px 10px 27px 10px !important;
        background: #F7F4ED !important;
        box-sizing: border-box !important;
        overflow: hidden !important;
    }

    html body #hp-feature-final > div > img {
        right: -5px !important;
        bottom: -5px !important;
        width: 145px !important;
        max-width: 38% !important;
        opacity: 0.10 !important;
    }

    html body #hp-feature-final > div > div:first-of-type {
        margin-bottom: 9px !important;
        font-size: 9.8px !important;
        line-height: 1.3 !important;
    }

    html body #hp-feature-final > div > div:nth-of-type(2) {
        margin-bottom: 13px !important;
        font-size: 29px !important;
        line-height: 1.08 !important;
    }

    html body #hp-feature-final > div > div:nth-of-type(3) {
        max-width: 345px !important;
        margin-bottom: 11px !important;
        font-size: 13.5px !important;
        line-height: 1.52 !important;
    }

    html body #hp-feature-final > div > div:nth-of-type(4) {
        margin-bottom: 17px !important;
        font-size: 12px !important;
        line-height: 1.45 !important;
    }

    html body #hp-feature-final > div > a {
        font-size: 10.5px !important;
        line-height: 1.35 !important;
    }


    /* -----------------------------------------------------
       6 / VYBRANÉ PROJEKTY – plnohodnotné portfolio karty
       velký obraz, text pod ním, šipka vpravo
       ----------------------------------------------------- */

    html body #projekty {
        width: calc(100vw - 24px) !important;
        max-width: none !important;
        position: relative !important;
        left: 50% !important;
        transform: translateX(-50%) !important;
        margin: 36px 0 0 0 !important;
        box-sizing: border-box !important;
    }

    html body #projekty > div:first-child {
        margin-bottom: 16px !important;
    }

    html body #projekty > div:first-child > div:first-child {
        margin-bottom: 5px !important;
        font-size: 10px !important;
        line-height: 1.3 !important;
    }

    html body #projekty > div:first-child > div:last-child {
        font-size: 28px !important;
        line-height: 1.10 !important;
    }

    html body #projekty > div:nth-child(2) {
        display: block !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    html body #projekty > div:nth-child(2) > div {
        position: relative !important;
        display: grid !important;
        grid-template-columns: minmax(0,1fr) 32px !important;
        grid-template-rows: auto auto auto !important;
        align-items: center !important;
        width: 100% !important;
        min-width: 0 !important;
        margin: 0 0 24px 0 !important;
        padding: 0 0 17px 0 !important;
        border-bottom: 1px solid rgba(79,88,49,0.15) !important;
        box-sizing: border-box !important;
    }

    html body #projekty > div:nth-child(2) > div > img:first-child {
        grid-column: 1 / 3 !important;
        grid-row: 1 !important;
        display: block !important;
        width: 100% !important;
        height: 170px !important;
        margin: 0 0 11px 0 !important;
        object-fit: cover !important;
        object-position: center center !important;
    }

    html body #projekty > div:nth-child(2) > div > div:nth-child(2) {
        grid-column: 1 !important;
        grid-row: 2 !important;
        margin: 0 !important;
        padding: 0 !important;
        font-size: 12.5px !important;
        line-height: 1.30 !important;
        font-weight: 600 !important;
        letter-spacing: 0.02em !important;
        color: #2F312B !important;
    }

    html body #projekty > div:nth-child(2) > div > div:nth-child(3) {
        grid-column: 1 !important;
        grid-row: 3 !important;
        margin: 4px 0 0 0 !important;
        padding: 0 !important;
        font-size: 10.8px !important;
        line-height: 1.35 !important;
        letter-spacing: 0.015em !important;
        color: #687253 !important;
    }

    html body #projekty > div:nth-child(2) > div::after {
        content: "→" !important;
        grid-column: 2 !important;
        grid-row: 2 / 4 !important;
        font-size: 16px !important;
        line-height: 1 !important;
        color: #4F5831 !important;
        text-align: right !important;
        pointer-events: none !important;
    }


    /* -----------------------------------------------------
       7 / O MNĚ – větší a důvěryhodnější osobní blok
       ----------------------------------------------------- */

    html body #hp-about-final {
        width: calc(100vw - 24px) !important;
        max-width: none !important;
        position: relative !important;
        left: 50% !important;
        transform: translateX(-50%) !important;
        margin: 30px 0 0 0 !important;
        box-sizing: border-box !important;
    }

    html body #hp-about-final > div {
        padding: 29px 24px 28px 24px !important;
    }

    html body #hp-about-final > div > img {
        right: -2px !important;
        bottom: -22px !important;
        width: 130px !important;
        max-width: 32% !important;
        opacity: 0.09 !important;
    }

    html body #hp-about-final > div > div {
        position: static !important;
        max-width: none !important;
    }

    html body #hp-about-final > div > div > div:nth-of-type(1) {
        margin-bottom: 8px !important;
        font-size: 10px !important;
    }

    html body #hp-about-final > div > div > div:nth-of-type(2) {
        margin-bottom: 6px !important;
        font-size: 24px !important;
        line-height: 1.10 !important;
    }

    html body #hp-about-final > div > div > div:nth-of-type(3) {
        margin-bottom: 13px !important;
        font-size: 12.5px !important;
        line-height: 1.42 !important;
    }

    html body #hp-about-final > div > div > div:nth-of-type(4) {
        display: block !important;
        max-width: 315px !important;
        margin: 0 0 15px 0 !important;
        font-size: 13px !important;
        line-height: 1.52 !important;
        color: #4B4D48 !important;
    }

    /* celý blok O MNĚ je klikací přes existující odkaz */
    html body #hp-about-final > div > div > a {
        position: absolute !important;
        top: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        left: 0 !important;
        z-index: 20 !important;

        display: block !important;
        width: 100% !important;
        height: 100% !important;

        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;

        font-size: 0 !important;
        line-height: 0 !important;
        color: transparent !important;
        background: transparent !important;

        cursor: pointer !important;
    }

    /* viditelný text odkazu zůstane na svém místě */
    html body #hp-about-final > div > div::after {
        content: "VÍCE O MNĚ →"!important;

        display: inline-block !important;
        position: relative !important;
        z-index: 5 !important;

        margin-top: 0 !important;

        font-size: 10.5px !important;
        line-height: 1.35 !important;
        font-weight: 600 !important;
        letter-spacing: 0.05em !important;
        color: #4F5831 !important;

        pointer-events: none !important;
    }
}

/* =========================================================
   VNITŘNÍ STRÁNKY – JEDNOTNÝ RESPONSIVE SYSTÉM
   MOBIL <= 700 / TABLET 701–1100 / PC >= 1101
   2026-10-22 – vyčištěná autoritativní vrstva
   ========================================================= */

/* ---------------------------------------------------------
   SPOLEČNÝ ZÁKLAD – landing pages a projektové detaily
   --------------------------------------------------------- */
/* historické zahrady – základní rytmus, bez breakpointového duplikování */
html body.page-1 .history-intro {
    margin-bottom: 30px !important;
}

html body.page-1 .history-projects {
    margin-top: 0 !important;
}

html body.page-1 .history-projects > div:first-child {
    font-size: 28px !important;
    margin-bottom: 22px !important;
}

html body.page-1 .history-projects > div:nth-child(2) > div a > div:last-child {
    font-size: 22px !important;
    line-height: 1.15 !important;
}

html body.not-home .history-page,
html body.not-home .public-green-page,
html body.not-home .private-gardens-hero,
html body.not-home .private-gardens-when,
html body.not-home .public-green-services,
html body.not-home .public-projects,
html body.not-home .service-projects,
html body.not-home .professional-services-hero,
html body.not-home .kokorinsko-detail {
    box-sizing: border-box !important;
}

/* hlavní fotografie landingů – vždy ořez v rámci řízeného hero */
html body.page-1 .history-page > div[style*="height: 500px"][style*="overflow: hidden"],
html body.page-1 .history-page > div[style*="height:500px"][style*="overflow:hidden"],
html body.page-10 .public-green-page > div[style*="height: 500px"][style*="overflow: hidden"],
html body.page-10 .public-green-page > div[style*="height:500px"][style*="overflow:hidden"],
html body.page-9 .private-gardens-hero,
html body.not-home .professional-services-hero {
    overflow: hidden !important;
}

html body.page-1 .history-page > div[style*="height: 500px"] > img,
html body.page-1 .history-page > div[style*="height:500px"] > img,
html body.page-10 .public-green-page > div[style*="height: 500px"] > img,
html body.page-10 .public-green-page > div[style*="height:500px"] > img,
html body.page-9 .private-gardens-hero img,
html body.not-home .professional-services-hero img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    object-fit: cover !important;
    object-position: center center !important;
}

/* =========================================================
   MOBIL <= 700 PX
   ========================================================= */
@media screen and (max-width: 700px) {

    /* jednotná šířka vnitřních obsahových bloků – 12 px od kraje */
    html body.not-home div[style*="width: 1100px"][style*="translateX(calc(-50% - 160px))"],
    html body.not-home .history-page,
    html body.not-home .history-intro,
    html body.not-home .history-projects,
    html body.not-home .public-green-page,
    html body.not-home .public-green-services,
    html body.not-home .public-projects,
    html body.not-home .private-gardens-hero,
    html body.not-home .private-gardens-when,
    html body.not-home .service-projects,
    html body.not-home .professional-services-hero,
    html body.not-home .kokorinsko-detail {
        width: calc(100vw - 24px) !important;
        max-width: calc(100vw - 24px) !important;
        position: relative !important;
        left: 50% !important;
        transform: translateX(-50%) !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        box-sizing: border-box !important;
    }

    /* hlavní fotografie všech landingů – jedna mobilní výška */
    html body.page-1 .history-page > div[style*="height: 500px"],
    html body.page-1 .history-page > div[style*="height:500px"],
    html body.page-10 .public-green-page > div[style*="height: 500px"],
    html body.page-10 .public-green-page > div[style*="height:500px"],
    html body.page-9 .private-gardens-hero,
    html body.not-home .professional-services-hero {
        width: 100% !important;
        height: 250px !important;
        min-height: 250px !important;
        max-height: 250px !important;
    }

    /* soukromé zahrady – lehce nižší ohnisko fotografie */
    html body.page-9 .private-gardens-hero img {
        object-position: center 55% !important;
    }
    /* Soukromé zahrady – skutečný hero wrapper je v některých verzích bez třídy */
    html body.page-9 .article-content div[style*="height: 500px"]:has(> img),
    html body.page-9 .article-content div[style*="height:500px"]:has(> img),
    html body.page-9 .article-content div:has(> img[style*="height: 100%"][style*="object-fit"]),
    html body.page-9 .article-content div:has(> img[style*="height:100%"][style*="object-fit"]) {
        width: 100% !important;
        height: 250px !important;
        min-height: 250px !important;
        max-height: 250px !important;
        overflow: hidden !important;
    }

    html body.page-9 .article-content div[style*="height: 500px"]:has(> img) > img,
    html body.page-9 .article-content div[style*="height:500px"]:has(> img) > img,
    html body.page-9 .article-content div:has(> img[style*="height: 100%"][style*="object-fit"]) > img,
    html body.page-9 .article-content div:has(> img[style*="height:100%"][style*="object-fit"]) > img {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
        object-position: center 55% !important;
    }

    /* SOUKROMÉ ZAHRADY – přesné hero podle alt/src */
    html body.page-9 .article-content div[style*="height"]:has(img[alt*="Soukromé zahrady"]),
    html body.page-9 .article-content div[style*="min-height"]:has(img[alt*="Soukromé zahrady"]),
    html body.page-9 .article-content div[style*="height"]:has(img[src*="03_soukrome-zahrady"]),
    html body.page-9 .article-content div[style*="min-height"]:has(img[src*="03_soukrome-zahrady"]) {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
    }

    html body.page-9 .article-content div:has(> div > img[alt*="Soukromé zahrady"]),
    html body.page-9 .article-content div:has(> div > img[src*="03_soukrome-zahrady"]) {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        padding-bottom: 0 !important;
    }

    html body.page-9 .article-content div:has(> img[alt*="Soukromé zahrady"]),
    html body.page-9 .article-content div:has(> img[src*="03_soukrome-zahrady"]) {
        width: 100% !important;
        height: 250px !important;
        min-height: 250px !important;
        max-height: 250px !important;
        overflow: hidden !important;
    }

    html body.page-9 .article-content img[alt*="Soukromé zahrady"],
    html body.page-9 .article-content img[src*="03_soukrome-zahrady"] {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
        object-position: center 55% !important;
    }

    /* ODBORNÉ SLUŽBY – HERO / MOBIL
       zrušit vysoké anonymní rodiče a řídit pouze skutečné hero */
    html body.page-11 .article-content div[style*="height"]:has(img[alt*="Odborné služby"]),
    html body.page-11 .article-content div[style*="min-height"]:has(img[alt*="Odborné služby"]),
    html body.page-11 .article-content div[style*="height"]:has(img[src*="04_odborne-sluzby"]),
    html body.page-11 .article-content div[style*="min-height"]:has(img[src*="04_odborne-sluzby"]) {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
    }

    html body.page-11 .article-content div:has(> div > img[alt*="Odborné služby"]),
    html body.page-11 .article-content div:has(> div > img[src*="04_odborne-sluzby"]) {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        padding-bottom: 0 !important;
    }

    html body.page-11 .article-content div:has(> img[alt*="Odborné služby"]),
    html body.page-11 .article-content div:has(> img[src*="04_odborne-sluzby"]) {
        width: 100% !important;
        height: 250px !important;
        min-height: 250px !important;
        max-height: 250px !important;
        margin-bottom: 24px !important;
        padding: 0 !important;
        overflow: hidden !important;
        line-height: 0 !important;
        box-sizing: border-box !important;
    }

    html body.page-11 .article-content img[alt*="Odborné služby"],
    html body.page-11 .article-content img[src*="04_odborne-sluzby"] {
        display: block !important;
        width: 100% !important;
        height: 100% !important;
        max-height: none !important;
        margin: 0 !important;
        object-fit: cover !important;
        object-position: center center !important;
    }


    /* společná mobilní typografie odborných textů */
    html body.not-home .article-content div[style*="font-size: 14px"]:not([style*="letter-spacing"]),
    html body.not-home .article-content div[style*="font-size:14px"]:not([style*="letter-spacing"]) {
        font-size: 15.5px !important;
        line-height: 1.62 !important;
    }

    html body.not-home .article-content div[style*="font-size: 15px"]:not([style*="letter-spacing"]),
    html body.not-home .article-content div[style*="font-size:15px"]:not([style*="letter-spacing"]) {
        font-size: 15.5px !important;
        line-height: 1.60 !important;
    }

    html body.not-home .article-content div[style*="font-size: 10px"][style*="letter-spacing"],
    html body.not-home .article-content div[style*="font-size:10px"][style*="letter-spacing"],
    html body.not-home .article-content div[style*="font-size: 11px"][style*="letter-spacing"],
    html body.not-home .article-content div[style*="font-size:11px"][style*="letter-spacing"] {
        font-size: 10.5px !important;
        line-height: 1.35 !important;
    }

    html body.not-home .article-content h1 {
        font-size: 34px !important;
        line-height: 1.08 !important;
    }

    html body.not-home .article-content h2 {
        font-size: 29px !important;
        line-height: 1.12 !important;
    }

    html body.not-home .article-content h3 {
        font-size: 21px !important;
        line-height: 1.20 !important;
    }

    /* -----------------------------------------------------
       HISTORICKÉ ZAHRADY – VYBRANÉ PROJEKTY / MOBIL
       skutečný anonymní kontejner: 3 projektové děti
       ----------------------------------------------------- */
    html body.page-1 .article-content div:has(> div:nth-child(3)) {
        box-sizing: border-box!important;
    }

    html body.page-1 .article-content div:has(> div:nth-child(1) a[href*="/1-HISTORICKE-ZAHRADY-A-PARKY/"]):has(> div:nth-child(2) a[href*="/1-HISTORICKE-ZAHRADY-A-PARKY/"]):has(> div:nth-child(3) a[href*="/1-HISTORICKE-ZAHRADY-A-PARKY/"]) {
        display: grid !important;
        grid-template-columns: 1fr !important;
        width: 100% !important;
        max-width: none !important;
        height: auto !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: visible !important;
        align-items: start !important;
    }

    html body.page-1 .article-content div:has(> div:nth-child(1) a[href*="/1-HISTORICKE-ZAHRADY-A-PARKY/"]):has(> div:nth-child(2) a[href*="/1-HISTORICKE-ZAHRADY-A-PARKY/"]):has(> div:nth-child(3) a[href*="/1-HISTORICKE-ZAHRADY-A-PARKY/"]) > div {
        width: 100% !important;
        max-width: none !important;
        height: auto !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        overflow: visible !important;
        box-sizing: border-box !important;
    }

    html body.page-1 .article-content div:has(> div:nth-child(1) a[href*="/1-HISTORICKE-ZAHRADY-A-PARKY/"]):has(> div:nth-child(2) a[href*="/1-HISTORICKE-ZAHRADY-A-PARKY/"]):has(> div:nth-child(3) a[href*="/1-HISTORICKE-ZAHRADY-A-PARKY/"]) > div img {
        display: block !important;
        width: 100% !important;
        height: 220px !important;
        object-fit: cover !important;
        object-position: center center !important;
    }

    /* -----------------------------------------------------
       VEŘEJNÁ ZELEŇ – referenční systém / 1 karta na řádek
       ----------------------------------------------------- */
    html body.page-10 .public-green-services {
        margin-top: 38px !important;
        margin-bottom: 44px !important;
        overflow: visible !important;
    }

    html body.page-10 .public-green-services h2 {
        margin: 0 0 24px 0 !important;
        font-size: 29px !important;
        line-height: 1.14 !important;
    }

    html body.page-10 .public-green-services-grid {
        display: block !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    html body.page-10 .public-green-services-grid > div {
        display: block !important;
        width: 100% !important;
        margin: 0 0 22px 0 !important;
        padding: 0 !important;
    }

    html body.page-10 .public-green-services-grid > div > div:first-child {
        font-size: 10.5px !important;
        line-height: 1.35 !important;
    }

    html body.page-10 .public-green-services-grid > div > div:nth-child(2) {
        font-size: 15.5px !important;
        line-height: 1.58 !important;
    }

    html body.page-10 .public-projects {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        margin: 20px 0 46px 0 !important;
        padding: 0 !important;
        overflow: visible !important;
    }

    html body.page-10 .public-projects-row {
        display: grid !important;
        grid-template-columns: 1fr !important;
        width: 100% !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: visible !important;
    }

    html body.page-10 .public-projects-row > div {
        width: 100% !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: visible !important;
    }

    html body.page-10 .public-projects-row > div > div:first-child {
        position: relative !important;
        display: grid !important;
        grid-template-columns: minmax(0,1fr) 28px !important;
        grid-template-rows: auto auto auto !important;
        align-items: center !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        overflow: visible !important;
    }

    html body.page-10 .public-projects-row > div > div:first-child > div:first-child {
        grid-column: 1 / 3 !important;
        grid-row: 1 !important;
        width: 100% !important;
        height: 220px !important;
        min-height: 220px !important;
        max-height: 220px !important;
        overflow: hidden !important;
    }

    html body.page-10 .public-projects-row > div > div:first-child > div:first-child img {
        display: block !important;
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
        object-position: center center !important;
    }

    html body.page-10 .public-projects-row > div > div:first-child > div:nth-child(2) {
        grid-column: 1 !important;
        grid-row: 2 !important;
        min-width: 0 !important;
        height: auto !important;
        margin-top: 14px !important;
        font-size: 21px !important;
        line-height: 1.22 !important;
        overflow: visible !important;
    }

    html body.page-10 .public-projects-row > div > div:first-child > div:nth-child(3) {
        grid-column: 1 !important;
        grid-row: 3 !important;
        min-width: 0 !important;
        height: auto !important;
        margin-top: 6px !important;
        font-size: 12.5px !important;
        line-height: 1.45 !important;
        overflow: visible !important;
    }
    /* -----------------------------------------------------
       SOUKROMÉ ZAHRADY – 1 karta na řádek
       nejnovější HTML má anonymní flex grid margin:0 -12px
       ----------------------------------------------------- */
    html body.page-9 .private-gardens-when {
        margin-top: 38px !important;
        margin-bottom: 40px !important;
    }

    html body.page-9 .private-gardens-when h2 {
        font-size: 29px !important;
        line-height: 1.14 !important;
        margin: 0 0 24px 0 !important;
    }

    html body.page-9 .private-gardens-when-grid {
        display: block !important;
    }

    html body.page-9 .private-gardens-when-grid > div {
        width: 100% !important;
        margin: 0 0 22px 0 !important;
        padding-top: 11px !important;
        box-sizing: border-box !important;
    }

    html body.page-9 .article-content div[style*="display:flex"][style*="flex-wrap:wrap"][style*="margin:0 -12px"],
    html body.page-9 .article-content div[style*="display: flex"][style*="flex-wrap: wrap"][style*="margin: 0 -12px"] {
        display: grid !important;
        grid-template-columns: 1fr !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    html body.page-9 .article-content div[style*="display:flex"][style*="flex-wrap:wrap"][style*="margin:0 -12px"] > div,
    html body.page-9 .article-content div[style*="display: flex"][style*="flex-wrap: wrap"][style*="margin: 0 -12px"] > div {
        width: 100% !important;
        max-width: none !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        overflow: visible !important;
        margin: 0 0 28px 0 !important;
        padding: 0 !important;
        box-sizing: border-box !important;
    }

    html body.page-9 .article-content div[style*="display:flex"][style*="flex-wrap:wrap"][style*="margin:0 -12px"] > div:last-child,
    html body.page-9 .article-content div[style*="display: flex"][style*="flex-wrap: wrap"][style*="margin: 0 -12px"] > div:last-child {
        margin-bottom: 0 !important;
    }

    html body.page-9 .article-content div[style*="display:flex"][style*="flex-wrap:wrap"][style*="margin:0 -12px"] > div > img,
    html body.page-9 .article-content div[style*="display: flex"][style*="flex-wrap: wrap"][style*="margin: 0 -12px"] > div > img {
        display: block !important;
        width: 100% !important;
        height: 220px !important;
        object-fit: cover !important;
        object-position: center center !important;
    }

    /* -----------------------------------------------------
       DETAILY – jeden sloupec a plný konec navigace
       ----------------------------------------------------- */
    html body.not-home .nd-project-feature {
        flex-direction: column !important;
        flex-wrap: nowrap !important;
        align-items: stretch !important;
    }

    html body.not-home .nd-project-feature > div {
        flex: 0 0 auto !important;
        width: 100% !important;
        max-width: none !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    html body.not-home .nd-project-feature > div + div {
        margin-top: 24px !important;
    }

    /* ODBORNÉ SLUŽBY – oba 4sloupcové bloky na mobilu pod sebe */
    html body.page-11 .article-content div[style*="grid-template-columns"]:has(> div:nth-child(4)),
    html body.page-11 .article-content div[style*="display: grid"]:has(> div:nth-child(4)),
    html body.page-11 .article-content div[style*="display:grid"]:has(> div:nth-child(4)),
    html body.page-11 .article-content div[style*="display: flex"]:has(> div:nth-child(4)),
    html body.page-11 .article-content div[style*="display:flex"]:has(> div:nth-child(4)),
    html body.page-11 .service-projects > div:nth-child(2) {
        display: grid !important;
        grid-template-columns: 1fr !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        align-items: stretch !important;
    }

    html body.page-11 .article-content div[style*="grid-template-columns"]:has(> div:nth-child(4)) > div,
    html body.page-11 .article-content div[style*="display: grid"]:has(> div:nth-child(4)) > div,
    html body.page-11 .article-content div[style*="display:grid"]:has(> div:nth-child(4)) > div,
    html body.page-11 .article-content div[style*="display: flex"]:has(> div:nth-child(4)) > div,
    html body.page-11 .article-content div[style*="display:flex"]:has(> div:nth-child(4)) > div,
    html body.page-11 .service-projects > div:nth-child(2) > div {
        width: 100% !important;
        max-width: none !important;
        flex: none !important;
        margin: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        box-sizing: border-box !important;
    }

    html body.page-11 .article-content div[style*="grid-template-columns"]:has(> div:nth-child(4)) > div,
    html body.page-11 .article-content div[style*="display: grid"]:has(> div:nth-child(4)) > div,
    html body.page-11 .article-content div[style*="display:grid"]:has(> div:nth-child(4)) > div,
    html body.page-11 .article-content div[style*="display: flex"]:has(> div:nth-child(4)) > div,
    html body.page-11 .article-content div[style*="display:flex"]:has(> div:nth-child(4)) > div {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
    }

    html body.page-11 .article-content div[style*="grid-template-columns"]:has(> div:nth-child(4)) > div > div,
    html body.page-11 .article-content div[style*="display: grid"]:has(> div:nth-child(4)) > div > div,
    html body.page-11 .article-content div[style*="display:grid"]:has(> div:nth-child(4)) > div > div,
    html body.page-11 .article-content div[style*="display: flex"]:has(> div:nth-child(4)) > div > div,
    html body.page-11 .article-content div[style*="display:flex"]:has(> div:nth-child(4)) > div > div {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
    }

    html body.page-11 .service-projects > div:nth-child(2) > div > div {
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        padding: 26px 24px !important;
        box-sizing: border-box !important;
    }

    /* konec článku nesmí být oříznut */
    html body.not-home .article-content,
    html body.not-home .article-content:has(.public-projects),
    html body.not-home .article-content:has(.history-projects) {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        overflow: visible !important;
    }
}

/* =========================================================
   TABLET 701–1100 PX
   ========================================================= */
@media screen and (min-width: 701px) and (max-width: 1100px) {

    /* jednotná šířka a osa */
    html body.not-home div[style*="width: 1100px"][style*="translateX(calc(-50% - 160px))"],
    html body.not-home .history-page,
    html body.not-home .history-intro,
    html body.not-home .history-projects,
    html body.not-home .public-green-page,
    html body.not-home .public-green-services,
    html body.not-home .public-projects,
    html body.not-home .private-gardens-hero,
    html body.not-home .private-gardens-when,
    html body.not-home .service-projects,
    html body.not-home .professional-services-hero,
    html body.not-home .kokorinsko-detail {
        width: calc(100vw - 56px) !important;
        max-width: calc(100vw - 56px) !important;
        position: relative !important;
        left: 50% !important;
        transform: translateX(-50%) !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        box-sizing: border-box !important;
    }

    /* hero */
    html body.page-1 .history-page > div[style*="height: 500px"],
    html body.page-1 .history-page > div[style*="height:500px"],
    html body.page-10 .public-green-page > div[style*="height: 500px"],
    html body.page-10 .public-green-page > div[style*="height:500px"],
    html body.page-9 .private-gardens-hero,
    html body.not-home .professional-services-hero {
        width: 100% !important;
        height: 360px !important;
        min-height: 360px !important;
        max-height: 360px !important;
    }

    /* projekty – 2 sloupce */
    html body.page-1 .history-projects > div:nth-child(2) {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0,1fr)) !important;
        margin: 0 !important;
    }

    html body.page-1 .history-projects .history-project-item,
    html body.page-1 .history-projects > div:nth-child(2) > div {
        width: auto !important;
        padding: 0 !important;
    }

    html body.page-10 .public-projects-row {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0,1fr)) !important;
        margin: 0 !important;
    }

    html body.page-10 .public-projects-row > div {
        width: auto !important;
        padding: 0 !important;
    }

    html body.page-9 .article-content div[style*="display:flex"][style*="flex-wrap:wrap"][style*="margin:0 -12px"],
    html body.page-9 .article-content div[style*="display: flex"][style*="flex-wrap: wrap"][style*="margin: 0 -12px"] {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0,1fr)) !important;
        margin: 0 !important;
    }

    html body.page-9 .article-content div[style*="display:flex"][style*="flex-wrap:wrap"][style*="margin:0 -12px"] > div,
    html body.page-9 .article-content div[style*="display: flex"][style*="flex-wrap: wrap"][style*="margin: 0 -12px"] > div {
        width: auto !important;
        padding: 0 !important;
    }

    /* karty služeb */
    html body.not-home .service-projects > div:nth-child(2) {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0,1fr)) !important;
        margin: 0 !important;
    }

    html body.not-home .service-projects > div:nth-child(2) > div {
        width: auto !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    html body.not-home .service-projects > div:nth-child(2) > div > div {
        height: auto !important;
        min-height: 0 !important;
        padding: 26px 24px !important;
    }

    /* Soukromé zahrady – hero bez závislosti na třídě */
    html body.page-9 .article-content div[style*="height: 500px"]:has(> img),
    html body.page-9 .article-content div[style*="height:500px"]:has(> img),
    html body.page-9 .article-content div:has(> img[style*="height: 100%"][style*="object-fit"]),
    html body.page-9 .article-content div:has(> img[style*="height:100%"][style*="object-fit"]) {
        height: 360px !important;
        min-height: 360px !important;
        max-height: 360px !important;
        overflow: hidden !important;
    }

    html body.page-9 .article-content div[style*="height: 500px"]:has(> img) > img,
    html body.page-9 .article-content div[style*="height:500px"]:has(> img) > img,
    html body.page-9 .article-content div:has(> img[style*="height: 100%"][style*="object-fit"]) > img,
    html body.page-9 .article-content div:has(> img[style*="height:100%"][style*="object-fit"]) > img {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
        object-position: center 55% !important;
    }

    /* SOUKROMÉ ZAHRADY – tablet hero přesně */
    html body.page-9 .article-content div[style*="height"]:has(img[alt*="Soukromé zahrady"]),
    html body.page-9 .article-content div[style*="min-height"]:has(img[alt*="Soukromé zahrady"]),
    html body.page-9 .article-content div[style*="height"]:has(img[src*="03_soukrome-zahrady"]),
    html body.page-9 .article-content div[style*="min-height"]:has(img[src*="03_soukrome-zahrady"]) {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
    }

    html body.page-9 .article-content div:has(> div > img[alt*="Soukromé zahrady"]),
    html body.page-9 .article-content div:has(> div > img[src*="03_soukrome-zahrady"]) {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        padding-bottom: 0 !important;
    }

    html body.page-9 .article-content div:has(> img[alt*="Soukromé zahrady"]),
    html body.page-9 .article-content div:has(> img[src*="03_soukrome-zahrady"]) {
        height: 360px !important;
        min-height: 360px !important;
        max-height: 360px !important;
        overflow: hidden !important;
    }

    html body.page-9 .article-content img[alt*="Soukromé zahrady"],
    html body.page-9 .article-content img[src*="03_soukrome-zahrady"] {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
        object-position: center 55% !important;
    }

    html body.page-11 .article-content div[style*="height"]:has(img[alt*="Odborné služby"]),
    html body.page-11 .article-content div[style*="min-height"]:has(img[alt*="Odborné služby"]),
    html body.page-11 .article-content div[style*="height"]:has(img[src*="04_odborne-sluzby"]),
    html body.page-11 .article-content div[style*="min-height"]:has(img[src*="04_odborne-sluzby"]) {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
    }

    html body.page-11 .article-content div:has(> div > img[alt*="Odborné služby"]),
    html body.page-11 .article-content div:has(> div > img[src*="04_odborne-sluzby"]) {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        padding-bottom: 0 !important;
    }

    html body.page-11 .article-content div:has(> img[alt*="Odborné služby"]),
    html body.page-11 .article-content div:has(> img[src*="04_odborne-sluzby"]) {
        height: 360px !important;
        min-height: 360px !important;
        max-height: 360px !important;
        overflow: hidden !important;
    }

    html body.page-11 .article-content img[alt*="Odborné služby"],
    html body.page-11 .article-content img[src*="04_odborne-sluzby"] {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
        object-position: center center !important;
    }

    /* HISTORICKÉ ZAHRADY – tablet 2 sloupce */
    html body.page-1 .article-content div:has(> div:nth-child(1) a[href*="/1-HISTORICKE-ZAHRADY-A-PARKY/"]):has(> div:nth-child(2) a[href*="/1-HISTORICKE-ZAHRADY-A-PARKY/"]):has(> div:nth-child(3) a[href*="/1-HISTORICKE-ZAHRADY-A-PARKY/"]) {
        display: grid !important;
        grid-template-columns: repeat(2,minmax(0,1fr)) !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    /* Odborné služby – tablet 2 + 2 */
    html body.page-11 .article-content div[style*="grid-template-columns"]:has(> div:nth-child(4)),
    html body.page-11 .article-content div[style*="display: grid"]:has(> div:nth-child(4)),
    html body.page-11 .article-content div[style*="display:grid"]:has(> div:nth-child(4)),
    html body.page-11 .article-content div[style*="display: flex"]:has(> div:nth-child(4)),
    html body.page-11 .article-content div[style*="display:flex"]:has(> div:nth-child(4)) {
        display: grid !important;
        grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    }

    html body.page-11 .article-content div[style*="grid-template-columns"]:has(> div:nth-child(4)) > div,
    html body.page-11 .article-content div[style*="display: grid"]:has(> div:nth-child(4)) > div,
    html body.page-11 .article-content div[style*="display:grid"]:has(> div:nth-child(4)) > div,
    html body.page-11 .article-content div[style*="display: flex"]:has(> div:nth-child(4)) > div,
    html body.page-11 .article-content div[style*="display:flex"]:has(> div:nth-child(4)) > div {
        width: auto !important;
        max-width: none !important;
        flex: none !important;
        margin: 0 !important;
    }

    /* projektové dvousloupce mohou zůstat vedle sebe, ale bez posunů mimo viewport */
    html body.not-home .nd-project-feature {
        max-width: 100% !important;
    }
}

/* =========================================================
   PC >= 1101 PX
   ========================================================= */
@media screen and (min-width: 1101px) {

    /* historické landing bloky – zachování schválené desktopové osy */
    html body.page-1 .history-intro,
    html body.page-1 .history-projects {
        transform: translateX(-60%) !important;
    }

    /* landing hero se vrací na desktopovou výšku */
    html body.page-1 .history-page > div[style*="height: 500px"],
    html body.page-1 .history-page > div[style*="height:500px"],
    html body.page-10 .public-green-page > div[style*="height: 500px"],
    html body.page-10 .public-green-page > div[style*="height:500px"],
    html body.page-9 .private-gardens-hero {
        height: 500px !important;
        min-height: 500px !important;
        max-height: 500px !important;
    }

    html body.not-home .professional-services-hero {
        height: 500px !important;
        min-height: 500px !important;
        max-height: 500px !important;
    }

    /* desktop: 3 projektové karty */
    html body.page-1 .history-projects > div:nth-child(2) {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0,1fr)) !important;
    }

    html body.page-10 .public-projects-row {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0,1fr)) !important;
    }

    html body.page-9 .article-content div[style*="display:flex"][style*="flex-wrap:wrap"][style*="margin:0 -12px"],
    html body.page-9 .article-content div[style*="display: flex"][style*="flex-wrap: wrap"][style*="margin: 0 -12px"] {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0,1fr)) !important;
        margin: 0 !important;
    }

    html body.page-1 .history-projects > div:nth-child(2) > div,
    html body.page-10 .public-projects-row > div,
    html body.page-9 .article-content div[style*="display:flex"][style*="flex-wrap:wrap"][style*="margin:0 -12px"] > div,
    html body.page-9 .article-content div[style*="display: flex"][style*="flex-wrap: wrap"][style*="margin: 0 -12px"] > div {
        width: auto !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    /* Soukromé zahrady – desktop hero bez závislosti na třídě */
    html body.page-9 .article-content div[style*="height: 500px"]:has(> img),
    html body.page-9 .article-content div[style*="height:500px"]:has(> img),
    html body.page-9 .article-content div:has(> img[style*="height: 100%"][style*="object-fit"]),
    html body.page-9 .article-content div:has(> img[style*="height:100%"][style*="object-fit"]) {
        height: 500px !important;
        min-height: 500px !important;
        max-height: 500px !important;
        overflow: hidden !important;
    }

    html body.page-11 .article-content img[alt*="Odborné služby"],
    html body.page-11 .article-content img[src*="04_odborne-sluzby"] {
        width: 100% !important;
        height: 500px !important;
        object-fit: cover !important;
        object-position: center center !important;
    }

    /* Historické projekty – desktop 3 sloupce */
    html body.page-1 .history-projects div[style*="grid-template-columns"],
    html body.page-1 .history-projects div[style*="display: grid"]:has(> div:nth-child(3)),
    html body.page-1 .history-projects div[style*="display:grid"]:has(> div:nth-child(3)),
    html body.page-1 .history-projects div[style*="display: flex"]:has(> div:nth-child(3)),
    html body.page-1 .history-projects div[style*="display:flex"]:has(> div:nth-child(3)) {
        display: grid !important;
        grid-template-columns: repeat(3,minmax(0,1fr)) !important;
        margin: 0 !important;
    }

    /* Odborné služby – desktop 4 sloupce */
    html body.page-11 .article-content div[style*="grid-template-columns"]:has(> div:nth-child(4)),
    html body.page-11 .article-content div[style*="display: grid"]:has(> div:nth-child(4)),
    html body.page-11 .article-content div[style*="display:grid"]:has(> div:nth-child(4)),
    html body.page-11 .article-content div[style*="display: flex"]:has(> div:nth-child(4)),
    html body.page-11 .article-content div[style*="display:flex"]:has(> div:nth-child(4)) {
        display: grid !important;
        grid-template-columns: repeat(4,minmax(0,1fr)) !important;
    }

    /* odborné služby – desktopová stejná výška karet */
    html body.not-home .service-projects > div:nth-child(2) > div > div {
        height: 285px !important;
        min-height: 285px !important;
    }

    html body.not-home .article-content:has(.service-projects) {
        margin-bottom: 0 !important;
        padding-bottom: 0 !important;
    }

    html body.not-home .service-projects {
        margin-bottom: 14px !important;
    }

    html body.not-home .article-content:has(.professional-cooperation) {
        margin-top: 0 !important;
        padding-top: 0 !important;
    }

    html body.not-home .professional-cooperation {
        margin-top: 0 !important;
        padding-top: 22px !important;
    }
}

/* =========================================================
   KLIKACÍ KARTY – JEDNOTNÝ SIGNÁL ODKAZU
   prázdný celoplošný odkaz / cursor:pointer karta = malá →
   běžné textové odkazy, menu a DALŠÍ PROJEKT se nemění
   ========================================================= */
html body.not-home .article-content div[style*="cursor: pointer"]:has(> a[href]),
html body.not-home .article-content div[style*="cursor:pointer"]:has(> a[href]),
html body.not-home .article-content div:has(> a[href][style*="position: absolute"]),
html body.not-home .article-content div:has(> a[href][style*="position:absolute"]) {
    position: relative !important;
}

html body.not-home .article-content div[style*="cursor: pointer"]:has(> a[href])::after,
html body.not-home .article-content div[style*="cursor:pointer"]:has(> a[href])::after,
html body.not-home .article-content div:has(> a[href][style*="position: absolute"])::after,
html body.not-home .article-content div:has(> a[href][style*="position:absolute"])::after {
    content: "→"!important;
    position: absolute!important;
    right: 11px!important;
    bottom: 10px!important;
    z-index: 20!important;
    font-family: Arial, Helvetica, sans-serif!important;
    font-size: 18px!important;
    font-weight: 400!important;
    line-height: 1!important;
    color: #6f795b!important;
    pointer-events: none!important;
}

@media screen and (max-width:700px) {
    html body.not-home .article-content div[style*="cursor: pointer"]:has(> a[href])::after,
    html body.not-home .article-content div[style*="cursor:pointer"]:has(> a[href])::after,
    html body.not-home .article-content div:has(> a[href][style*="position: absolute"])::after,
    html body.not-home .article-content div:has(> a[href][style*="position:absolute"])::after {
        right: 10px!important;
        bottom: 9px!important;
        font-size: 19px!important;
    }
}

@media screen and (max-width:700px) {
    /* Veřejná zeleň – šipka ve stejné textové zóně jako Historické zahrady */
    html body.page-10 .public-projects-row > div > div:first-child::after {
        position: static !important;
        grid-column: 2 !important;
        grid-row: 2 / 4 !important;
        align-self: center !important;
        justify-self: end !important;
        right: auto !important;
        bottom: auto !important;
        transform: none !important;
        margin: 0 !important;
        font-size: 17px !important;
        line-height: 1 !important;
        color: #6f795b !important;
        text-align: right !important;
    }
}

@media (hover:hover) and (pointer:fine) {
    html body.not-home .article-content div[style*="cursor: pointer"]:has(> a[href])::after,
    html body.not-home .article-content div[style*="cursor:pointer"]:has(> a[href])::after,
    html body.not-home .article-content div:has(> a[href][style*="position: absolute"])::after,
    html body.not-home .article-content div:has(> a[href][style*="position:absolute"])::after {
        transition: transform 160ms ease!important;
    }

    html body.not-home .article-content div[style*="cursor: pointer"]:has(> a[href]):hover::after,
    html body.not-home .article-content div[style*="cursor:pointer"]:has(> a[href]):hover::after,
    html body.not-home .article-content div:has(> a[href][style*="position: absolute"]):hover::after,
    html body.not-home .article-content div:has(> a[href][style*="position:absolute"]):hover::after {
        transform: translateX(3px)!important;
    }
}

/* =========================================================
   DETAILOVÉ STRÁNKY – RELEASE FIX 2026-10-22
   Zdroj: audit skutečného HTML detailů + mobil 390 px.
   Řeší pouze detailové stránky (page-X-Y), nikoli rozcestníky.
   ========================================================= */

/* Detail nesmí ořezávat poslední obsah. Inline -52px dole je na mobile/tabletu zrušen. */
@media screen and (max-width: 1100px) {
    html body[class*="page-1-"] .article-content,
    html body[class*="page-9-"] .article-content,
    html body[class*="page-10-"] .article-content,
    html body[class*="page-11-"] .article-content {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        overflow: visible !important;
    }

    html body[class*="page-1-"] .article-content div[style*="width: 1100px"][style*="translateX(calc(-50% - 160px))"],
    html body[class*="page-9-"] .article-content div[style*="width: 1100px"][style*="translateX(calc(-50% - 160px))"],
    html body[class*="page-10-"] .article-content div[style*="width: 1100px"][style*="translateX(calc(-50% - 160px))"],
    html body[class*="page-11-"] .article-content div[style*="width: 1100px"][style*="translateX(calc(-50% - 160px))"] {
        margin-bottom: 28px !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        overflow: visible !important;
    }

    /* DALŠÍ PROJEKT / DALŠÍ ODBORNÁ SLUŽBA – plná výška a bezpečný konec. */
    html body[class*="page-1-"] .article-content div[style*="padding-bottom: 3px"]:has(> a[style*="font-family: Constantia"]),
    html body[class*="page-9-"] .article-content div[style*="padding-bottom: 3px"]:has(> a[style*="font-family: Constantia"]),
    html body[class*="page-10-"] .article-content div[style*="padding-bottom: 3px"]:has(> a[style*="font-family: Constantia"]),
    html body[class*="page-11-"] .article-content div[style*="padding-bottom: 3px"]:has(> a[style*="font-family: Constantia"]) {
        width: 100% !important;
        max-width: 800px !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        margin-top: 20px !important;
        margin-bottom: 0 !important;
        padding-bottom: 18px !important;
        overflow: visible !important;
        box-sizing: border-box !important;
        position: relative !important;
        z-index: 2 !important;
    }

    html body[class*="page-1-"] .article-content div[style*="padding-bottom: 3px"] > a[style*="font-family: Constantia"],
    html body[class*="page-9-"] .article-content div[style*="padding-bottom: 3px"] > a[style*="font-family: Constantia"],
    html body[class*="page-10-"] .article-content div[style*="padding-bottom: 3px"] > a[style*="font-family: Constantia"],
    html body[class*="page-11-"] .article-content div[style*="padding-bottom: 3px"] > a[style*="font-family: Constantia"] {
        display: block !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        overflow: visible !important;
        white-space: normal !important;
        text-wrap: pretty !important;
        line-height: 1.25 !important;
        padding: 1px 0 3px 0 !important;
        box-sizing: border-box !important;
    }

    /* Sekundární návrat na výpis – stejné vizuální značení odkazu. */
    html body[class*="page-1-"] .article-content div[style*="padding-bottom: 3px"] > div[style*="margin-top: 8px"] > a::after,
    html body[class*="page-9-"] .article-content div[style*="padding-bottom: 3px"] > div[style*="margin-top: 8px"] > a::after,
    html body[class*="page-10-"] .article-content div[style*="padding-bottom: 3px"] > div[style*="margin-top: 8px"] > a::after,
    html body[class*="page-11-"] .article-content div[style*="padding-bottom: 3px"] > div[style*="margin-top: 8px"] > a::after {
        content: "  →"!important;
        color: #6f795b!important;
    }
}

/* =========================================================
   MOBIL – DETAILY <= 700 PX
   ========================================================= */
@media screen and (max-width: 700px) {

    /* Veřejná zeleň – údaje projektu: z pěti úzkých sloupců na čitelnou 2sloupcovou mřížku. */
    html body[class*="page-10-"] .public-project-detail > div[style*="padding: 24px 0"] > div[style*="flex-wrap: nowrap"] {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        align-items: start !important;
    }

    html body[class*="page-10-"] .public-project-detail > div[style*="padding: 24px 0"] > div[style*="flex-wrap: nowrap"] > div {
        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;
        padding: 0 !important;
        margin: 0 !important;
        box-sizing: border-box !important;
    }

    /* Dlouhá odborná spolupráce na Hradci dostane celý řádek. */
    html body.page-10-21 .public-project-detail > div[style*="padding: 24px 0"] > div[style*="flex-wrap: nowrap"] > div:nth-child(4) {
        grid-column: 1 / -1 !important;
    }

    /* KOKOŘÍNSKO – aktuální HTML pořadí: 1 úvod / 2 info / 3 hero / 4 koncepce */

    /* hlavní fotografie – třetí top-level blok */
    html body.page-9-18 .kokorinsko-detail > div:nth-of-type(3) {
        width: 100% !important;
        height: 300px !important;
        min-height: 300px !important;
        max-height: 300px !important;
        overflow: hidden !important;
    }

    html body.page-9-18 .kokorinsko-detail > div:nth-of-type(3) img {
        display: block !important;
        width: 100% !important;
        height: 100% !important;
        max-width: none !important;
        object-fit: cover !important;
        object-position: center 55% !important;
    }

    /* KONCEPCE ZAHRADY – čtvrtý top-level blok!important; uvnitř text + půdorys */
    html body.page-9-18 .kokorinsko-detail > div:nth-of-type(4) > div[style*="display: flex"],
    html body.page-9-18 .kokorinsko-detail > div:nth-of-type(4) > div[style*="display:flex"] {
        display: block !important;
        width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    html body.page-9-18 .kokorinsko-detail > div:nth-of-type(4) > div[style*="display: flex"] > div,
    html body.page-9-18 .kokorinsko-detail > div:nth-of-type(4) > div[style*="display:flex"] > div {
        display: block !important;
        width: 100% !important;
        max-width: none !important;
        flex: none !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        box-sizing: border-box !important;
    }

    html body.page-9-18 .kokorinsko-detail > div:nth-of-type(4) > div[style*="display: flex"] > div:first-child,
    html body.page-9-18 .kokorinsko-detail > div:nth-of-type(4) > div[style*="display:flex"] > div:first-child {
        margin-bottom: 24px !important;
    }

    html body.page-9-18 .kokorinsko-detail > div:nth-of-type(4) img {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
    }

    /* Mobilní konec detailů – bez záporného spodního marginu a bez zbytečné díry. */
    html body[class*="page-1-"] .article-content div[style*="width: 1100px"][style*="translateX(calc(-50% - 160px))"],
    html body[class*="page-9-"] .article-content div[style*="width: 1100px"][style*="translateX(calc(-50% - 160px))"],
    html body[class*="page-10-"] .article-content div[style*="width: 1100px"][style*="translateX(calc(-50% - 160px))"],
    html body[class*="page-11-"] .article-content div[style*="width: 1100px"][style*="translateX(calc(-50% - 160px))"] {
        margin-bottom: 18px !important;
    }
}

/* =========================================================
   TABLET – DETAILY 701–1100 PX
   ========================================================= */
@media screen and (min-width: 701px) and (max-width: 1100px) {
    html body[class*="page-10-"] .public-project-detail > div[style*="padding: 24px 0"] > div[style*="flex-wrap: nowrap"] {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        align-items: start !important;
    }

    html body[class*="page-10-"] .public-project-detail > div[style*="padding: 24px 0"] > div[style*="flex-wrap: nowrap"] > div {
        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;
        padding: 0 !important;
    }
}







/* =========================================================
   ODBORNÉ SLUŽBY – 4 HLAVNÍ KARTY
   skutečný klikací prvek = div[role="link"]
   ========================================================= */

html body.page-11 .professional-services-page div[role="link"] {
    position: relative !important;
}

html body.page-11 .professional-services-page div[role="link"]::after {
    content: "→" !important;
    position: absolute !important;
    right: 22px !important;
    top: 28px !important;

    font-family: Arial, Helvetica, sans-serif !important;
    font-size: 18px !important;
    font-weight: 400 !important;
    line-height: 1 !important;
    color: #6f795b !important;

    pointer-events: none !important;
}

/* mobil – stejná logika, o něco kompaktnější */
@media screen and (max-width: 700px) {
    html body.page-11 .professional-services-page div[role="link"]::after {
        right: 22px !important;
        top: 26px !important;
        font-size: 17px !important;
    }
}

/* ODBORNÉ SLUŽBY – bezpečný konec landing page */
@media screen and (max-width: 1100px) {
    html body.page-11 .professional-services-page {
        margin-bottom: 0 !important;
        padding-bottom: 28px !important;
        overflow: visible !important;
    }
}

/* =========================================================
   SOUKROMÉ ZAHRADY – BEZPEČNÝ KONEC LANDING PAGE
   ruší inline margin-bottom:-52px, který překrývá poslední kartu
   ========================================================= */

@media screen and (max-width: 1100px) {
    html body.page-9 .private-gardens-page {
        margin-bottom: 0 !important;
        padding-bottom: 28px !important;
        overflow: visible !important;
    }

    html body.page-9 .private-gardens-page > div:last-child,
    html body.page-9 .private-gardens-page > div:last-child > div:last-child,
    html body.page-9 .private-gardens-page > div:last-child > div:last-child > div:last-child {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        overflow: visible !important;
    }
}

/* =========================================================
   HISTORICKÉ ZAHRADY – BEZPEČNÝ KONEC LANDING PAGE
   ruší inline margin-bottom:-52px, který překrývá poslední kartu
   ========================================================= */

@media screen and (max-width: 1100px) {
    html body.page-1 .history-page {
        margin-bottom: 0 !important;
        padding-bottom: 28px !important;
        overflow: visible !important;
    }

    html body.page-1 .history-project-item:last-child {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        overflow: visible !important;
    }
}

/* =========================================================
   VEŘEJNÁ ZELEŇ – BEZPEČNÝ KONEC LANDING PAGE
   ruší inline margin-bottom:-52px, který překrývá poslední kartu
   ========================================================= */

@media screen and (max-width: 1100px) {
    html body.page-10 .public-green-page {
        margin-bottom: 0 !important;
        padding-bottom: 28px !important;
        overflow: visible !important;
    }

    html body.page-10 .public-projects-row > div:last-child,
    html body.page-10 .public-projects-row > div:last-child > div:first-child {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        overflow: visible !important;
    }
}


/* =========================================================
   BENEŠOV + VYSOKÁ – MOBILNÍ DVOJICE OBRÁZKŮ POD SEBE
   pouze page-10-31 a page-10-20, pouze konkrétní dvouobrázkový flex blok
   ========================================================= */

@media screen and (max-width: 700px) {

    html body.page-10-31 .public-project-detail div[style*="display: flex"]:has(> div:nth-child(1) img):has(> div:nth-child(2) img):not(:has(> div:nth-child(3))),
    html body.page-10-31 .public-project-detail div[style*="display:flex"]:has(> div:nth-child(1) img):has(> div:nth-child(2) img):not(:has(> div:nth-child(3))),
    html body.page-10-20 .public-project-detail div[style*="display: flex"]:has(> div:nth-child(1) img):has(> div:nth-child(2) img):not(:has(> div:nth-child(3))),
    html body.page-10-20 .public-project-detail div[style*="display:flex"]:has(> div:nth-child(1) img):has(> div:nth-child(2) img):not(:has(> div:nth-child(3))) {
        display: block !important;
        width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        overflow: visible !important;
    }

    html body.page-10-31 .public-project-detail div[style*="display: flex"]:has(> div:nth-child(1) img):has(> div:nth-child(2) img):not(:has(> div:nth-child(3))) > div,
    html body.page-10-31 .public-project-detail div[style*="display:flex"]:has(> div:nth-child(1) img):has(> div:nth-child(2) img):not(:has(> div:nth-child(3))) > div,
    html body.page-10-20 .public-project-detail div[style*="display: flex"]:has(> div:nth-child(1) img):has(> div:nth-child(2) img):not(:has(> div:nth-child(3))) > div,
    html body.page-10-20 .public-project-detail div[style*="display:flex"]:has(> div:nth-child(1) img):has(> div:nth-child(2) img):not(:has(> div:nth-child(3))) > div {
        display: block !important;
        width: 100% !important;
        max-width: none !important;
        flex: none !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        box-sizing: border-box !important;
    }

    html body.page-10-31 .public-project-detail div[style*="display: flex"]:has(> div:nth-child(1) img):has(> div:nth-child(2) img):not(:has(> div:nth-child(3))) > div:first-child,
    html body.page-10-31 .public-project-detail div[style*="display:flex"]:has(> div:nth-child(1) img):has(> div:nth-child(2) img):not(:has(> div:nth-child(3))) > div:first-child,
    html body.page-10-20 .public-project-detail div[style*="display: flex"]:has(> div:nth-child(1) img):has(> div:nth-child(2) img):not(:has(> div:nth-child(3))) > div:first-child,
    html body.page-10-20 .public-project-detail div[style*="display:flex"]:has(> div:nth-child(1) img):has(> div:nth-child(2) img):not(:has(> div:nth-child(3))) > div:first-child {
        margin-bottom: 20px !important;
    }

    html body.page-10-31 .public-project-detail div[style*="display: flex"]:has(> div:nth-child(1) img):has(> div:nth-child(2) img):not(:has(> div:nth-child(3))) img,
    html body.page-10-31 .public-project-detail div[style*="display:flex"]:has(> div:nth-child(1) img):has(> div:nth-child(2) img):not(:has(> div:nth-child(3))) img,
    html body.page-10-20 .public-project-detail div[style*="display: flex"]:has(> div:nth-child(1) img):has(> div:nth-child(2) img):not(:has(> div:nth-child(3))) img,
    html body.page-10-20 .public-project-detail div[style*="display:flex"]:has(> div:nth-child(1) img):has(> div:nth-child(2) img):not(:has(> div:nth-child(3))) img {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
    }
}

/* =========================================================
   WEBARREAL KOMPATIBILITA – BEZ GAP / ROW-GAP / COLUMN-GAP
   2026-10-22
   Rozestupy jsou řešeny pouze přes margin / padding.
   ========================================================= */

/* Homepage hero – původní desktopový odstup mezi sloupci 76 px */
@media screen and (min-width: 901px) {
    html body .hp-hero-side {
        margin-left: 76px !important;
    }
}

/* ---------------------------------------------------------
   MOBIL <= 700 px – jedno-sloupcové seznamy
   --------------------------------------------------------- */
@media screen and (max-width: 700px) {

    /* Historické zahrady – projekty */
    html body.page-1 .article-content div:has(> div:nth-child(1) a[href*="/1-HISTORICKE-ZAHRADY-A-PARKY/"]):has(> div:nth-child(2) a[href*="/1-HISTORICKE-ZAHRADY-A-PARKY/"]):has(> div:nth-child(3) a[href*="/1-HISTORICKE-ZAHRADY-A-PARKY/"]) > div:not(:last-child) {
        margin-bottom: 34px !important;
    }

    /* Veřejná zeleň – projekty */
    html body.page-10 .public-projects-row > div:not(:last-child) {
        margin-bottom: 38px !important;
    }

    /* Soukromé zahrady – projekty */
    html body.page-9 .article-content div[style*="display:flex"][style*="flex-wrap:wrap"][style*="margin:0 -12px"] > div:not(:last-child),
    html body.page-9 .article-content div[style*="display: flex"][style*="flex-wrap: wrap"][style*="margin: 0 -12px"] > div:not(:last-child) {
        margin-bottom: 34px !important;
    }

    /* Odborné služby – 4 karty */
    html body.page-11 .service-projects > div:nth-child(2) > div:not(:last-child) {
        margin-bottom: 18px !important;
    }

    /* Detail veřejné zeleně – metadata 2 sloupce: 20 px vodorovně / 18 px svisle */
    html body[class*="page-10-"] .public-project-detail > div[style*="padding: 24px 0"] > div[style*="flex-wrap: nowrap"] {
        width: calc(100% + 20px) !important;
        margin-left: -10px !important;
        margin-right: -10px !important;
    }

    html body[class*="page-10-"] .public-project-detail > div[style*="padding: 24px 0"] > div[style*="flex-wrap: nowrap"] > div {
        padding-left: 10px !important;
        padding-right: 10px !important;
        margin-bottom: 18px !important;
    }

    html body[class*="page-10-"] .public-project-detail > div[style*="padding: 24px 0"] > div[style*="flex-wrap: nowrap"] > div:nth-last-child(-n+2) {
        margin-bottom: 0 !important;
    }
}

/* ---------------------------------------------------------
   TABLET 701–1100 px
   --------------------------------------------------------- */
@media screen and (min-width: 701px) and (max-width: 1100px) {

    /* Historické zahrady – 2 sloupce, 22 px mezi sloupci */
    html body.page-1 .history-projects > div:nth-child(2),
    html body.page-1 .article-content div:has(> div:nth-child(1) a[href*="/1-HISTORICKE-ZAHRADY-A-PARKY/"]):has(> div:nth-child(2) a[href*="/1-HISTORICKE-ZAHRADY-A-PARKY/"]):has(> div:nth-child(3) a[href*="/1-HISTORICKE-ZAHRADY-A-PARKY/"]) {
        width: calc(100% + 22px) !important;
        margin-left: -11px !important;
        margin-right: -11px !important;
    }

    html body.page-1 .history-projects > div:nth-child(2) > div,
    html body.page-1 .article-content div:has(> div:nth-child(1) a[href*="/1-HISTORICKE-ZAHRADY-A-PARKY/"]):has(> div:nth-child(2) a[href*="/1-HISTORICKE-ZAHRADY-A-PARKY/"]):has(> div:nth-child(3) a[href*="/1-HISTORICKE-ZAHRADY-A-PARKY/"]) > div {
        padding-left: 11px !important;
        padding-right: 11px !important;
    }

    html body.page-1 .history-projects > div:nth-child(2) > div:nth-child(-n+2),
    html body.page-1 .article-content div:has(> div:nth-child(1) a[href*="/1-HISTORICKE-ZAHRADY-A-PARKY/"]):has(> div:nth-child(2) a[href*="/1-HISTORICKE-ZAHRADY-A-PARKY/"]):has(> div:nth-child(3) a[href*="/1-HISTORICKE-ZAHRADY-A-PARKY/"]) > div:nth-child(-n+2) {
        margin-bottom: 28px !important;
    }

    /* Veřejná zeleň – 2 sloupce */
    html body.page-10 .public-projects-row {
        width: calc(100% + 22px) !important;
        margin-left: -11px !important;
        margin-right: -11px !important;
    }

    html body.page-10 .public-projects-row > div {
        padding-left: 11px !important;
        padding-right: 11px !important;
    }

    html body.page-10 .public-projects-row > div:nth-child(-n+2) {
        margin-bottom: 30px !important;
    }

    /* Soukromé zahrady – 2 sloupce */
    html body.page-9 .article-content div[style*="display:flex"][style*="flex-wrap:wrap"][style*="margin:0 -12px"],
    html body.page-9 .article-content div[style*="display: flex"][style*="flex-wrap: wrap"][style*="margin: 0 -12px"] {
        width: calc(100% + 22px) !important;
        margin-left: -11px !important;
        margin-right: -11px !important;
    }

    html body.page-9 .article-content div[style*="display:flex"][style*="flex-wrap:wrap"][style*="margin:0 -12px"] > div,
    html body.page-9 .article-content div[style*="display: flex"][style*="flex-wrap: wrap"][style*="margin: 0 -12px"] > div {
        padding-left: 11px !important;
        padding-right: 11px !important;
    }

    html body.page-9 .article-content div[style*="display:flex"][style*="flex-wrap:wrap"][style*="margin:0 -12px"] > div:nth-child(-n+2),
    html body.page-9 .article-content div[style*="display: flex"][style*="flex-wrap: wrap"][style*="margin: 0 -12px"] > div:nth-child(-n+2) {
        margin-bottom: 30px !important;
    }

    /* Odborné služby – 2 + 2 */
    html body.not-home .service-projects > div:nth-child(2),
    html body.page-11 .article-content div[style*="grid-template-columns"]:has(> div:nth-child(4)),
    html body.page-11 .article-content div[style*="display: grid"]:has(> div:nth-child(4)),
    html body.page-11 .article-content div[style*="display:grid"]:has(> div:nth-child(4)),
    html body.page-11 .article-content div[style*="display: flex"]:has(> div:nth-child(4)),
    html body.page-11 .article-content div[style*="display:flex"]:has(> div:nth-child(4)) {
        width: calc(100% + 20px) !important;
        margin-left: -10px !important;
        margin-right: -10px !important;
    }

    html body.not-home .service-projects > div:nth-child(2) > div,
    html body.page-11 .article-content div[style*="grid-template-columns"]:has(> div:nth-child(4)) > div,
    html body.page-11 .article-content div[style*="display: grid"]:has(> div:nth-child(4)) > div,
    html body.page-11 .article-content div[style*="display:grid"]:has(> div:nth-child(4)) > div,
    html body.page-11 .article-content div[style*="display: flex"]:has(> div:nth-child(4)) > div,
    html body.page-11 .article-content div[style*="display:flex"]:has(> div:nth-child(4)) > div {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }

    html body.not-home .service-projects > div:nth-child(2) > div:nth-child(-n+2),
    html body.page-11 .article-content div[style*="grid-template-columns"]:has(> div:nth-child(4)) > div:nth-child(-n+2),
    html body.page-11 .article-content div[style*="display: grid"]:has(> div:nth-child(4)) > div:nth-child(-n+2),
    html body.page-11 .article-content div[style*="display:grid"]:has(> div:nth-child(4)) > div:nth-child(-n+2),
    html body.page-11 .article-content div[style*="display: flex"]:has(> div:nth-child(4)) > div:nth-child(-n+2),
    html body.page-11 .article-content div[style*="display:flex"]:has(> div:nth-child(4)) > div:nth-child(-n+2) {
        margin-bottom: 20px !important;
    }

    /* Detail veřejné zeleně – metadata 3 sloupce: 26 px vodorovně / 20 px svisle */
    html body[class*="page-10-"] .public-project-detail > div[style*="padding: 24px 0"] > div[style*="flex-wrap: nowrap"] {
        width: calc(100% + 26px) !important;
        margin-left: -13px !important;
        margin-right: -13px !important;
    }

    html body[class*="page-10-"] .public-project-detail > div[style*="padding: 24px 0"] > div[style*="flex-wrap: nowrap"] > div {
        padding-left: 13px !important;
        padding-right: 13px !important;
        margin-bottom: 20px !important;
    }

    html body[class*="page-10-"] .public-project-detail > div[style*="padding: 24px 0"] > div[style*="flex-wrap: nowrap"] > div:nth-last-child(-n+3) {
        margin-bottom: 0 !important;
    }
}

/* ---------------------------------------------------------
   DESKTOP >= 1101 px – 3 projektové sloupce bez gap
   --------------------------------------------------------- */
@media screen and (min-width: 1101px) {
    html body.page-1 .history-projects > div:nth-child(2),
    html body.page-10 .public-projects-row,
    html body.page-9 .article-content div[style*="display:flex"][style*="flex-wrap:wrap"][style*="margin:0 -12px"],
    html body.page-9 .article-content div[style*="display: flex"][style*="flex-wrap: wrap"][style*="margin: 0 -12px"],
    html body.page-1 .history-projects div[style*="grid-template-columns"],
    html body.page-1 .history-projects div[style*="display: grid"]:has(> div:nth-child(3)),
    html body.page-1 .history-projects div[style*="display:grid"]:has(> div:nth-child(3)),
    html body.page-1 .history-projects div[style*="display: flex"]:has(> div:nth-child(3)),
    html body.page-1 .history-projects div[style*="display:flex"]:has(> div:nth-child(3)) {
        width: calc(100% + 24px) !important;
        margin-left: -12px !important;
        margin-right: -12px !important;
    }

    html body.page-1 .history-projects > div:nth-child(2) > div,
    html body.page-10 .public-projects-row > div,
    html body.page-9 .article-content div[style*="display:flex"][style*="flex-wrap:wrap"][style*="margin:0 -12px"] > div,
    html body.page-9 .article-content div[style*="display: flex"][style*="flex-wrap: wrap"][style*="margin: 0 -12px"] > div,
    html body.page-1 .history-projects div[style*="grid-template-columns"] > div,
    html body.page-1 .history-projects div[style*="display: grid"]:has(> div:nth-child(3)) > div,
    html body.page-1 .history-projects div[style*="display:grid"]:has(> div:nth-child(3)) > div,
    html body.page-1 .history-projects div[style*="display: flex"]:has(> div:nth-child(3)) > div,
    html body.page-1 .history-projects div[style*="display:flex"]:has(> div:nth-child(3)) > div {
        padding-left: 12px !important;
        padding-right: 12px !important;
        box-sizing: border-box !important;
    }
}
/* =========================================================
   HOŠTKA – DETAIL PROJEKTU / MOBIL
   JEDINÝ AUTORITATIVNÍ BLOK
   page-9-30
   ========================================================= */
@media screen and (max-width: 700px) {

    /* Hlavní hero */
    html body.page-9-30 .article-content img[src*="hostka-01-hlavni.jpg"] {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        height: 320px !important;
        max-height: 320px !important;
        object-fit: cover !important;
        object-position: center center !important;
        margin: 0 !important;
    }

    /* Dvojice vizualizací – na mobilu pod sebe, každá přes celou šířku */
    html body.page-9-30 .article-content div[style*="display: flex"]:has(> div:nth-child(2)):has(img),
    html body.page-9-30 .article-content div[style*="display:flex"]:has(> div:nth-child(2)):has(img) {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        overflow: visible !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    html body.page-9-30 .article-content div[style*="display: flex"]:has(> div:nth-child(2)):has(img) > div,
    html body.page-9-30 .article-content div[style*="display:flex"]:has(> div:nth-child(2)):has(img) > div {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        flex: none !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        overflow: visible !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        box-sizing: border-box !important;
    }

    html body.page-9-30 .article-content div[style*="display: flex"]:has(> div:nth-child(2)):has(img) > div:first-child,
    html body.page-9-30 .article-content div[style*="display:flex"]:has(> div:nth-child(2)):has(img) > div:first-child {
        margin-bottom: 20px !important;
    }

    html body.page-9-30 .article-content div[style*="display: flex"]:has(> div:nth-child(2)):has(img) > div img,
    html body.page-9-30 .article-content div[style*="display:flex"]:has(> div:nth-child(2)):has(img) > div img {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        max-height: none !important;
        object-fit: contain !important;
        margin: 0 !important;
    }

    /* Pozdější samostatná vysoká vizualizace */
    html body.page-9-30 .article-content img[src*="hostka-04-zahrada-deti-pes.jpg"] {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        height: 300px !important;
        max-height: 300px !important;
        object-fit: cover !important;
        object-position: center center !important;
        margin: 0 !important;
    }

    html body.page-9-30 .article-content div:has(> img[src*="hostka-04-zahrada-deti-pes.jpg"]) {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        overflow: visible !important;
    }
}

/* =========================================================
   O MNĚ – MOBIL
   page-8
   ========================================================= */
@media screen and (max-width: 700px) {

    /* Celá stránka – čistý mobilní obal */
    html body.page-8 .zd-about-page {
        width: calc(100vw - 24px) !important;
        max-width: none !important;
        left: auto !important;
        transform: none !important;
        margin: 0 auto !important;
        padding: 0 !important;
        box-sizing: border-box !important;
        overflow: visible !important;
    }

    /* Profil – foto nad textem */
    html body.page-8 .zd-about-profile {
        display: block !important;
        width: 100% !important;
        min-height: 0 !important;
        height: auto !important;
        overflow: visible !important;
    }

    html body.page-8 .zd-about-photo {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        height: 220px !important;
        min-height: 0 !important;
        flex: none !important;
        overflow: hidden !important;
    }

    html body.page-8 .zd-about-photo img {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
        object-position: center 55% !important;
        margin: 0 !important;
    }

    html body.page-8 .zd-about-profile-text {
        display: block !important;
        width: 100% !important;
        max-width: none !important;
        flex: none !important;
        padding: 24px 20px 26px 20px !important;
        box-sizing: border-box !important;
    }

    html body.page-8 .zd-about-profile-text h2 {
        font-size: 28px !important;
        line-height: 1.12 !important;
        margin-bottom: 14px !important;
    }

    html body.page-8 .zd-about-profile-text > div:last-child {
        max-width: none !important;
        font-size: 15px !important;
        line-height: 1.65 !important;
    }

    /* Čemu se věnuji – jeden čitelný sloupec */
    html body.page-8 .zd-about-services {
        display: block !important;
        width: 100% !important;
        max-width: none !important;
    }

    html body.page-8 .zd-about-services > div {
        width: 100% !important;
        max-width: none !important;
        margin: 0 0 10px 0 !important;
        box-sizing: border-box !important;
    }

    html body.page-8 .zd-about-services > div:last-child {
        margin-bottom: 0 !important;
    }

    /* Spolupráce + Vzdělání – pod sebe */
    html body.page-8 .zd-about-bottom {
        display: block !important;
        width: 100% !important;
        max-width: none !important;
    }

    html body.page-8 .zd-about-bottom > div {
        width: 100% !important;
        max-width: none !important;
        min-width: 0 !important;
        margin: 0 !important;
        box-sizing: border-box !important;
    }

    html body.page-8 .zd-about-bottom > div + div {
        margin-top: 32px !important;
        padding-top: 26px !important;
        border-top: 1px solid rgba(111,121,91,0.22) !important;
    }

    /* Vybrané reference – oba desktopové sloupce pod sebe */
    html body.page-8 .zd-reference-columns {
        display: block !important;
        width: 100% !important;
        max-width: none !important;
        align-items: initial !important;
    }

    html body.page-8 .zd-reference-column {
        display: block !important;
        width: 100% !important;
        max-width: none !important;
        min-width: 0 !important;
        flex: none !important;
    }

    html body.page-8 .zd-reference-column + .zd-reference-column {
        margin-top: 30px !important;
    }

    html body.page-8 .zd-reference-column > div {
        width: 100% !important;
        max-width: none !important;
        margin-bottom: 28px !important;
        box-sizing: border-box !important;
    }

    html body.page-8 .zd-reference-column > div:last-child {
        margin-bottom: 0 !important;
    }

    /* Konec stránky bez záporného přesahu do patičky */
    html body.page-8 .zd-references-section {
        margin-bottom: 0 !important;
        padding-bottom: 28px !important;
    }
}
