/* CSS Document */
/* =============== resetovani css =============== */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, menu, nav, section {
    display: block;
}
body {
    line-height: 1;
}
ol, ul {
    list-style: none;
}
blockquote, q {
    quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
    content: '';
    content: none;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}
/* =============== Hlavni =============== */

/* =========================================================
   Design tokens 2026
   Jediné místo pro sdílenou paletu a fonty upravovaných částí webu.
   Navigace tyto proměnné pouze používá a znovu je nedefinuje.
   ========================================================= */
:root {
    --site-brand-green: #2a6049;
    --site-brand-green-rgb: 42, 96, 73;
    --site-brand-green-soft: #b3c8bf;
    --site-footer-green: #356b59;
    --site-brand-orange-soft: #f3a462;
    --site-brand-orange-display: #b94f1c;
    --site-brand-orange-ui: #c64e12;
    --site-surface-warm: #fffaf6;
    --site-surface-warm-rgb: 255, 250, 246;
    --site-page-background: #fcf2e9;
    --site-text: #2b2a2a;
    --site-font-body: "Open Sans", sans-serif;
    --site-font-brand: "DM Sans", "Open Sans", sans-serif;
    --site-font-script: "Charmonman", cursive;
}

html {height: 100%; font-size: 62.5%; color:var(--site-text); font-family: var(--site-font-body); font-weight: 400;
    background-color: white;}
body {height: 100%; text-align: center; margin: 0; padding: 0;}

img { border:0; }
h1 { font-size: 3em; color: var(--site-text); line-height: 120%;  font-weight: 700; margin-bottom: 1em; margin-top: 1em;}
h2 {font-size: 3em;font-weight: 700; margin-top: 2em;  margin-bottom: 1em; color:var(--site-text); line-height: 150%;}
.np h2 {font-size: 2em;font-weight: 700; margin-top: 2em;  margin-bottom: 1em; color:var(--site-text);}
h3 { color:var(--site-text); font-size: 1.6em; margin-top: 2em;  margin-bottom: 1em; font-weight: 700; line-height: 150%;}
p {margin-top: 1em; margin-bottom: 2em; font-size:1.6em; line-height: 150%;}
h1, h2, h3 {
    font-family:  var(--site-font-body);
    font-weight: 900;
    font-style: normal;
    text-transform: uppercase;
    color: var(--site-brand-green);
}
ol li { /*margin-bottom: 7px; margin-top:7px; font-size:16px; line-height: 20px;*/}
ul li {/*padding-left:15px; font-size: 14px; line-height: 28px;*/}
strong {font-weight:bold;}
b {font-weight: bold; color: #2d2d2e }
em {font-style:italic;}
p.title {font-weight: bold; margin-top: 0;}

.cleaner {clear: both; height: 0; font-size: 0; visibility: hidden;}
.content {padding-left:7.083333333333333%; padding-right:7.083333333333333%;}
.content_container {padding-left:15px; padding-right:15px;}
.vcontent {padding-top: 6em;  padding-bottom: 6em;}
.vcontent2 {padding-top: 10em;  padding-bottom: 10em;}
.vcontent_top {padding-top: 6em;}
.vcontent_bottom {padding-bottom: 6em;}
.right {float:right;}
.left {float:left;}
.center {text-align: center;}
img.imgefekt {
    height:auto;
    width: 100%;
    max-width: 100%;
    object-fit: cover;
    object-position: top;
    transition: all 0.74s cubic-bezier(0.23, 1, 0.32, 1);
}

.obal:hover img {
    transform: scale(1.05);
    filter: saturate(1.05) brightness(1.05) contrast(1.05);
    /*object-position: bottom;*/
}


a:link, a:visited {color: #1c5c8e;}
a:hover{color: #3972a5}
.container {max-width: 1400px; width: 90%;  padding-left: 5%; padding-right: 5%; margin: 0 auto;}
.container2 {max-width: 14400px; width: 100%;  padding-left: 0; padding-right: 0; margin: 0 auto; text-align: center;}

.wrap {/*obal*/ text-align: left; margin: 0 auto; background-color: var(--site-page-background); box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); }
@media screen and (max-width: 1599px) {.wrap{width: 100%}}
@media screen and (min-width: 1600px) {.wrap{width:100%}}

a.button1 {
    color:white!important;
    text-decoration: none;
    background-color:#0b7099;
    text-align:center;
    line-height: 250% !important;
    /*padding-top: 0.7em;
    padding-bottom: 0.7em;*/
    cursor: pointer;
    padding-left: 1.5em!important;
    padding-right: 1.5em!important;
    font-weight: 900;
    border-radius: 20px;
}
a.button1:hover {background: #8cb3fe; }
a.button { text-decoration: none; text-align:center; width: 41px; height: 41px; background-image:url("../images/arrow.png"); display: block; background-repeat: no-repeat; background-color: transparent; cursor: pointer;}
a.button:hover {}
.button2 {
    color:var(--site-text)!important;
    font-weight: 700;
    text-decoration: none;
    background:var(--site-brand-orange-soft);
    text-align:center;
    line-height: 250%;
    padding-top: 0.5em;
    padding-bottom: 0.5em;
    padding-left: 1em;
    padding-right: 1em;
    border-radius: 20px;
    cursor: pointer;
    border: 1px solid var(--site-text);
}
a.button2:hover {
    color: var(--site-text);
    background-color:var(--site-brand-orange-soft);
}
.button3 {
    color:var(--site-text);
    font-weight: 700;
    text-decoration: none;
    background:#f7d98c;
    text-align:center;
    line-height: 250%;
    padding-top: 0.5em;
    padding-bottom: 0.5em;
    padding-left: 1em;
    padding-right: 1em;
    border-radius: 20px;
    cursor: pointer;
}
a.button3:hover, a.button3:link, a.button3:visited {
  /*  background-image: url("../images/tlacitko-sipka-hover2.png");*/
    color:var(--site-text);
    background-color:#f7d98c;
}
.zvyrazneni, .zvyrazneni strong {color: #0c64e3;}
#header {
    padding: 0;
    text-align: center;
    min-height: 40px;
    padding-top: 30px;
    background-color: var(--site-page-background);
    padding-bottom: 30px;
    max-width: 1600px;
    margin: auto;
}
#header img {margin: 0; padding: 0; }
.np #header {background-color: #f5f5f5;/* border-bottom: 1px solid #dbdcdc; */position: relative; z-index: 500;
    box-shadow: rgba(17, 17, 26, 0.05) 0px 1px 0px, rgba(17, 17, 26, 0.1) 0px 0px 8px;}



p.motto {
    text-align: center;
    font-family: var(--site-font-script);
    font-weight: 600;
    font-style: normal;
    color: var(--site-brand-green);
    font-size: 4em!important;
}
@media screen and (max-width: 1230px){
    #nav ul {justify-content: center!important;}
}
@media screen and (max-width: 1200px){
      ul.box-4 li.ramecek {width: 17% !important; margin-left: 4% !important;}

}
@media screen and (max-width: 910px){
    ul.box-4 li.ramecek {width: 18% !important; margin-left: 2% !important;}
    ul.box-4 li.ramecek p {font-size: 1.2em;}

}

/* Organické podklady pod obsahovými fotografiemi.
   Klientská revize 2026: podklad je jen v jemné zelené z loga;
   tělový list zůstává samostatným akcentem přes okraj fotografie. */
.img1,
.img2 {
    min-width: 174px;
    min-height: 178px;
    padding: 20px 0 42px;
    text-align: center;
}

.img1 > a,
.img2 > a {
    position: relative;
    display: inline-block;
    max-width: 100%;
}

.img1 > a::before,
.img2 > a::before {
    content: "";
    position: absolute;
    width: 96%;
    aspect-ratio: 300 / 257;
    top: 5%;
    z-index: 0;
    pointer-events: none;
    background: url("../images/17.png") center / contain no-repeat;
}

.img1 > a::before {
    left: -15%;
    top: 9%;
}

.img2 > a::before {
    right: -15%;
}

.img1 > a::after,
.img2 > a::after {
    content: "";
    position: absolute;
    z-index: 2;
    bottom: -7%;
    width: 28%;
    aspect-ratio: 1 / 1;
    pointer-events: none;
    background: url("../images/list-3.png") center / contain no-repeat;
}

.img1 > a::after {
    right: -6%;
}

.img2 > a::after {
    left: -6%;
    transform: scaleX(-1);
}

.img1 > a img,
.img2 > a img {
    position: relative;
    z-index: 1;
}

.page {
    background-color:var(--site-page-background);
  /*  background-image: url("../images/bg-page-bottom.png");
    background-repeat: no-repeat;
    background-position: bottom center;
    background-size: contain;*/
}
.img-bottom {text-align: center; width: 100%;}
.img-bottom img{max-width: 100%;}
.page .left {width: 50%; }
.page .right {width: 50%; text-align: left;}
.hp .page .left { width: 49.2%;}
.hp .page .right {width: 49.2%;}
.page .obr img{ max-width: 100%; height: auto;}
.page .right.obr {min-height: 250px;}
.page .left.obr {min-height: 230px;}
.page-text {}
.page .page-text p {font-size: 1.4em;}
.page .page-text a {/*text-decoration: none;*/}
.page-text ul {list-style-type: disc; margin-top: 1em; margin-bottom: 2em;}
.page-text ul li{margin-left: 40px; line-height: 180%; font-size: 1.6em; }
.page-text ol {list-style-type: decimal; margin-top: 1em; margin-bottom: 1em;}
.page-text ol li{margin-left: 40px; line-height: 150%; font-size: 1.6em; }
.page-text ul li.noli p {font-size:1em;}
.page-text ul li.noli {list-style-type: none;}
.page-text img {max-width:100%;height:auto; border-radius: 10px;}
.page-text .left {width: 48%;}
.page-text .right {width: 48%;}
.page .page-text table tbody td p {margin: 0; padding: 0; font-size: 1em; line-height: 21px;}
.page .page-text table tbody td {border: 1px solid var(--site-brand-green);padding:5px; padding-left: 15px; padding-right: 15px;}
.page table tbody td {padding:5px;}
.page table.tab1 tbody td {border: 1px solid #d1d2cd;padding:5px;}
.page table tbody td, .table_1 thead th {font-size: 1.4em; }
.page table tbody td a:link {font-size: 1em;}
.page table tbody td a.download:link {margin: 0; padding: 0; font-size: 0;}
.page table tbody td ul li {font-size: 1em;}
.page table img {max-width:100%;height:auto;}


ul.box {list-style-type: none;}
ul.box h2 {font-size: 1.6em;}
ul.box .img_produkt {max-height: 210px; text-align: center;}
ul.box .img_produkt img {max-height:  210px; max-width: 100%;}
ul.box li {float: left; display: inline-block; margin-top: 0;}
ul.box li.ramecek {float: left; display: inline-block; margin-top: 3%;}
ul.box li img {max-width: 100%;}
.np ul.box li img {/*max-width: 100%; width: 100%; border-radius: 10px;border: 1px solid;
    color: #89888873;
    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;*/}

ul.box-2 li { width: 48.2%; padding:3%; margin-left: 0; padding-bottom: 0;}
ul.box-2 li.ramecek { width: 42%; padding:3%; margin-left: 3%;}
ul.box-2 li:nth-child(1n){}
ul.box-2 li:nth-child(2n+1){clear: both; margin-left: 0; padding-left: 0; padding-right:2px;}
ul.box-2 li:nth-child(2n){margin-right: 0; padding-right: 0;}
ul.box-2 li:first-child{}

ul.box-3 li { width: 32.2%; margin:20px; margin-left: 0;}
ul.box-3 li.ramecek { width: 25%; padding:2%; margin-left: 3%;}
ul.box-3 li:nth-child(1n){}
ul.box-3 li:nth-child(3n+1){clear: both; margin-left: 0;}
ul.box-3 li:nth-child(3n){margin-right: 0;}
ul.box-3 li:first-child{}

ul.box-4 li { width: 22%; margin:2%; }
ul.box-4 li.ramecek { width: 16%; padding:1%; margin-left: 7%;}
ul.box-4 li:nth-child(1n){}
ul.box-4 li:nth-child(4n+1){clear: both; margin-left: 0;}
ul.box-4 li:nth-child(4n){margin-right: 0;}
ul.box-4 li:first-child{}

ul.box-5 li { width: 16%; padding:2%; margin-left: 0;}
ul.box-5 li.ramecek { width: 15%; padding:2%; margin-left: 2%;}
ul.box-5 li:nth-child(1n){}
ul.box-5 li:nth-child(5n+1){clear: both; margin-left: 0;}
ul.box-5 li:nth-child(5n){margin-right: 0;}
ul.box-5 li:first-child{}


@media screen and (max-width: 870px){
    ul.box-4 li { width: 40% !important; margin:4% !important; }
    ul.box-4 li.ramecek { width: 40% !important; margin-left:3% !important; padding:1%;}
    ul.box-4 li:nth-child(1n){}
    ul.box-4 li:nth-child(2n+1){clear: both; margin-left: 0;}
    ul.box-4 li:nth-child(2n){margin-right: 0;}
    ul.box-4 li:first-child{}
}

@media screen and (max-width: 650px){
    ul.box-3 li { width: 93%; padding:3%; margin: 0; float: none; clear: both; margin-bottom: 2em; text-align: center;}
    ul.box-3 li.ramecek { width: 93%; padding:3%; margin: 0; float: none; clear: both; margin-bottom: 2em;}
    ul.box-3 li:nth-child(2n){margin-left:0; }
    ul.box-3 li p {text-align: center;}

    ul.box-4 li {width: 93% !important; padding:3% !important; margin: 0!important; float: none; clear: both; margin-bottom: 2em; text-align: center;}
}

@media screen and (max-width: 480px){
    ul.box-3 li { width: 93%; padding:3%; margin: 0; float: none; clear: both; margin-bottom: 2em;}
    ul.box-3 li.ramecek { width: 93%; padding:3%; margin: 0; float: none; clear: both; margin-bottom: 2em;}
    ul.box-3 li:nth-child(2n){margin-left:0; }

    ul.box-2 li { width: 100%; padding:0%; margin: 0; float: none; clear: both; margin-bottom: 0;}
    ul.box-2 li.ramecek { width: 93%; padding:3%; margin: 0; float: none; clear: both; margin-bottom: 2em;}
    ul.box-2 li:nth-child(2n){margin-left:0; }

}

@media screen and (max-width: 450px){
    ul.box-4 li.ramecek { width: 93% !important; margin-left:0 !important; padding:3%;}
}

.icons {background-color: #9dcb7b; text-align: center;}
.icons li p{ margin-bottom: 0; text-transform: uppercase; font-weight: 700; }
.icons li img {max-width: 100%; height: auto;}


.blok-foto {position: relative;}
.blok-foto .kolecko-sipka {position: absolute; right: 0; top: 100px;}
.blok-foto img{ max-width: 100%; border-radius: 20px;}
.blok-foto1 .mr-4  {position: relative;}
.blok-foto1 .mr-4 a  {position: absolute; right: 20px; bottom: 20px;}
.blok-foto2 {}
.blok-foto2 .certifikaty-text .left {width: 40%!important;}
.blok-foto2 certifikaty-text .right {width: 40% !important;}
.blok-foto2 p {margin-top: 1em;}
.blok-foto2 h3  {margin-top: 1em; color: #222222;}


.galerie ul {list-style-type: none; margin-bottom: 0;}
.galerie ul li {float: left; display: inline-block; width: 23.5%; padding:1%;}
.galerie ul li:nth-child(1n){}
.galerie ul li:nth-child(4n+1){clear: both; padding-left: 0;}
.galerie ul li:nth-child(4n){padding-right: 0;}
.galerie ul li:first-child{}

.galerie h1, .galerie h2 {margin: 0;}
.fotogalerie img {border-radius: 10px;}


.grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    grid-auto-rows: 300px;
    grid-auto-flow: dense;
    grid-gap: 20px;
    justify-content: center;
    margin: 16px 16px 10px;
    margin-top: 7em;
    margin-bottom: 7em;
}
.grid .photo {
    background-size: cover;
    background-position: center;
    box-sizing: border-box;
    width: 100%;
    background-color: lightgrey;
    overflow: hidden;
    position: relative;
    box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.4);
    border-radius: 20px;
}

.grid .photo::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: inherit;
    background-size: cover;
    transform-origin: center;
    filter: saturate(1) brightness(1) contrast(1);
    transition: all 0.74s cubic-bezier(0.23, 1, 0.32, 1);
}
.grid .photo:focus::after, .grid .photo:hover::after {
    filter: saturate(1.05) brightness(1.05) contrast(1.05);
    transform: scale(1.05);
}
.grid .photo:nth-of-type(5n) {
    grid-row: span 2;

}
.grid .photo:nth-of-type(11n+1) {
    grid-row: span 2;

}
.grid .photo:nth-of-type(6n) {
    grid-column: span 2;

}
.grid .photo:nth-of-type(60n) {
    grid-column: span 2;
    grid-row: span 2;

}
@media screen and (max-width: 770px){

    .grid .photo:nth-of-type(5n) {
        grid-row: span 1;
        grid-column: span 1 ;

    }
    .grid .photo:nth-of-type(11n+1) {
        grid-row: span 1;

    }
    .grid .photo:nth-of-type(6n) {
        grid-column: span 1 ;

    }
    .grid .photo:nth-of-type(60n) {
        grid-column: span 1;
        grid-row: span ;

    }


}

@media screen and (max-width: 768px) {
    .galerie ul li {width: 48%; }
}

@media screen and (max-width: 400px) {
    .galerie ul li {width: 100%; }
}
@media screen and (max-width: 600px) {
    .page .left, .page .right {float: none; width: 100%;}
    .page .right .news {max-width: 230px;}
}

@media screen and (max-width: 1200px) {
     .servis-eshop { background-size: 60%;}
}
@media screen and (max-width: 946px) {
    .hp .page .servis-eshop .right { width: 100%; display: block; float: none;

    }
    .hp .page .servis-eshop .left { width: 100%; display: block; float: none;}
    .servis-eshop .left h3 {margin-left: 0;}
    .servis-eshop { background-image: none;   background-position: right bottom; background-size: cover;}
}
@media screen and (max-width: 513px) {
    #footer h3 {font-size: 1.2em;}
    .kontakt-bottom p, .top p {font-size: 1.2em;}
    .top p {display: none;}
}

@media screen and (max-width: 400px) {
    #footer h3 {font-size: 1.2em;}

}

.news_all ul {list-style-type: none;}
.news_all ul li {float: left; display: inline-block; width: 25%; padding:3em; margin-left: 3em;
    border-radius: 20px; border: 1px solid #edefef; margin-top: 1.5em; /*min-height: 47em;*/ }
.news_all ul li:nth-child(1n){}
.news_all ul li:nth-child(3n+1){clear: both; margin-left: 0;}
.news_all ul li:nth-child(3n){margin-right: 0;}
.news_all ul li:first-child{}
.news_all a h2 {font-size: 2em;  font-weight: 700; text-transform: uppercase; margin-top: 1em; margin-bottom: 1em;}
.news_all ul li a {text-decoration: none;}



.news {/*background-color: #e8d5a0; */padding: 3em; margin-left: 5em; border: 10px solid #edefef; margin-top: 1.5em;}
.news h2 {color: #da251c; font-family: 'Oswald', sans-serif; font-weight: 700; margin-top: 0; font-size: 1.8em; text-transform: uppercase; text-align: center; border-bottom: 1px solid;}
.news h3 {color: #1f1f1f; font-size: 1.4em; font-family: 'Oswald', sans-serif; font-weight: 700; text-transform: uppercase;}
.news p {color: #1f1f1f; font-size: 1.2em; }
.news img {margin-top: 1em;}


/* Aktuality jsou stylované v konsolidovaném redesign bloku níže. */

@media screen and (max-width: 768px) {
    .blok-foto2 .certifikaty-text .left {width: auto!important;}
    .hp .page .left, .hp .page .right {float: none; width: 100%;}
    .hp .page .right .news {max-width: 230px; margin: auto;}
    .certifikaty .right {padding-top: 0; text-align: center;}
     .certifikaty .right img, .certifikaty .left img{ margin: auto; margin-bottom: 2em;}
    .certifikaty {text-align: center; background-size: cover;}
    #footer .left, #footer .right {float: none; width: 100%; display: block; text-align: center!important;}
    #footer h2,  #footer h3 {text-align: center!important;}
    .social ul li {float: none; margin-bottom: 6em;}
    .blok-foto1 img {
        margin-bottom: 2em;
    }
    .vcontent {
        padding-top: 3em;
        padding-bottom: 3em;
    }
    .blok-foto5.vcontent {padding-top: 6em!important;}
}


.galerie ul {list-style-type: none; margin-bottom: 0;}
.galerie ul li {float: left; display: inline-block; width: 23.5%; padding:1%;}
.galerie ul li:nth-child(1n){}
.galerie ul li:nth-child(4n+1){clear: both; padding-left: 0;}
.galerie ul li:nth-child(4n){padding-right: 0;}
.galerie ul li:first-child{}

.galerie h1, .galerie h2 {margin: 0;}

@media screen and (max-width: 768px) {
    .galerie ul li {width: 48%; }
 }

@media screen and (max-width: 400px) {
    .galerie ul li {width: 100%; }
   }



#footer {
    width: 100%;
    background-color: transparent;
    color: #fff;
    position: relative;
    z-index: 2;
}

.bg-footer {
    background-color: var(--site-footer-green);
    position: relative;
    z-index: 100;
    overflow: hidden;
    isolation: isolate;
}

/* Decentní dekorace patičky: zůstává jen jeřabina vpravo dole. */
.bg-footer::after {
    content: "";
    position: absolute;
    pointer-events: none;
    background-repeat: no-repeat;
    background-size: contain;
    z-index: -1;
    width: 155px;
    height: 180px;
    right: -24px;
    bottom: -34px;
    background-image: url("../images/13.png");
    background-position: right bottom;
    opacity: 0.58;
}

.footer-content {
    position: relative;
    z-index: 1;
}

.footer-columns,
.footer-column__items {
    list-style: none;
    margin: 0;
    padding: 0;
}

.footer-columns {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 2rem 4rem;
    align-items: start;
}

.footer-columns--4 {
    grid-template-columns: 1fr 1.2fr 0.9fr 1.1fr;
}

.footer-column {
    min-width: 0;
}

.footer-column__title {
    margin: 0 0 1rem;
    padding: 0;
    color: #fff;
    font-family: var(--site-font-brand);
    font-size: 1.2em;
    font-weight: 700;
    line-height: 1.35;
    text-transform: uppercase;
}

.footer-column__items li {
    margin: 0 0 0.28rem;
    color: #fff;
    font-size: 1.4em;
    line-height: 1.5;
}

.footer-column__items a {
    color: #fff;
    font-size: 1em;
    font-weight: 400;
    text-decoration: none;
    overflow-wrap: anywhere;
}

.footer-column__items a:hover {
    text-decoration: underline;
    text-underline-offset: 0.18em;
}

#footer a:focus-visible,
.webdesign a:focus-visible {
    outline: 3px solid var(--site-brand-orange-soft);
    outline-offset: 3px;
}

@media screen and (max-width: 900px) {
    .footer-columns,
    .footer-columns--4 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 2.4rem 3rem;
    }


    .bg-footer::after {
        width: 130px;
        height: 150px;
    }
}

@media screen and (max-width: 600px) {
    .footer-columns,
    .footer-columns--4 {
        grid-template-columns: 1fr;
        gap: 1.8rem;
    }

    .footer-column {
        text-align: center;
    }

    .footer-column__title {
        margin-bottom: 0.65rem;
    }


    .bg-footer::after {
        width: 105px;
        height: 122px;
        right: -30px;
        bottom: -22px;
        opacity: 0.42;
    }
}

.webdesign {
    width: 100%;
    padding-top: 2em;
    padding-bottom: 2em;
    background-color: transparent;
    text-align: left;
    position: relative;
    z-index: 2;
}

.webdesign,
.webdesign a {
    color: #fff;
    text-decoration: none;
}

.webdesign p {
    margin: 0;
    font-size: 1.4em;
    color: #fff !important;
}



.table_1{
    width: 100%;
    border-collapse:collapse;
    border-spacing: 0;
    height: 100%;
    width: 100%;
    border: 1px solid var(--site-brand-orange-soft);
    }
.table_1 tbody tr:hover {background: #fad9bd;}
.table_1 thead tr { background: #fad9bd; }
.table_1 thead th {  padding: 10px; height: 25px; white-space: nowrap; line-height: 150%;}
.table_1{ border: none;}
.table_1 tbody tr { cursor: pointer; }
.table_1 tbody td { text-align:left; padding: 15px!important; vertical-align: middle; border: 1px solid var(--site-brand-orange-soft); line-height: 150%;}
.table_1 tbody td.top {vertical-align: text-top;}
.table_1 tbody td p {margin: 0; padding: 0; font-size: 1.4em; line-height: 21px;}
.table_1 tbody td, .table_1 thead th {font-size: 1.4em; }
.table_1 tbody td a:link {font-size: 1em;}
.table_1 tbody td a.download:link {margin: 0; padding: 0; font-size: 0;}

.prilohy a.button2 {white-space: nowrap;}
.prilohy {margin-bottom: 3em;}

/* =============== flashMessage =============== */
#flashmessage {color: black; background: #a09f43;}
div.flash { color: black; text-align: center; width: 100%; font-size: 1.4em; line-height: 150%; padding-top: 1em; padding-bottom: 1em;}

/* =============== KONEC flashMessage =============== */

@media print
{
    .noprint {display:none;}
}








/* MŠ / Dětská skupina: rozcestníky přímých podstránek */
.subpage-crossroads {
    margin: 0 0 3.4rem;
}

.subpage-group {
    margin: 0;
}

.subpage-group h2 {
    margin: 0 0 0.9rem;
    font-family: var(--site-font-brand);
    font-size: 2.1em;
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: 0.03em;
}

.subpage-group--common h2 {
    color: var(--site-text);
}

.subpage-group--ms h2 {
    color: var(--site-brand-green);
}

.subpage-group--ds h2 {
    /* Stejná čistá oranžová jako ovládací trojúhelníky v navigaci. */
    color: var(--site-brand-orange-ui);
}

.subpage-list {
    margin: 0;
    padding: 0 0 0 1.8rem;
    list-style: disc;
}

.subpage-list li {
    margin: 0;
    font-size: 1.6em;
    line-height: 1.55;
}

.subpage-list li + li {
    margin-top: 0.25rem;
}

.subpage-list a {
    display: inline;
    padding: 0.1rem 0;
    font-size: 1em;
    font-weight: 600;
    text-decoration-thickness: 0.08em;
    text-underline-offset: 0.2em;
}

.subpage-list a:hover {
    text-decoration-thickness: 0.12em;
}

.subpage-list a:focus-visible {
    outline: 3px solid currentColor;
    outline-offset: 3px;
}

.subpage-group--common {
    margin-bottom: 0;
}

/* Mezera vzniká jen tehdy, když za společnými odkazy skutečně následuje MŠ/DS část. */
.subpage-group--common + .subpage-target-groups {
    margin-top: 2.6rem;
}

.subpage-target-groups {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 2rem;
}

@media (min-width: 48em) {
    .subpage-target-groups--two {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: clamp(4rem, 8vw, 10rem);
    }
}

@media (max-width: 47.99em) {
    .subpage-crossroads {
        margin-bottom: 2.8rem;
    }

    .subpage-group h2 {
        font-size: 1.9em;
    }

    .subpage-target-groups {
        gap: 0;
    }

    .subpage-target-groups > .subpage-group + .subpage-group {
        margin-top: 2.2rem;
    }
}

/* =========================================================
   Redesign 2026 — fáze 1: společná hlavička + homepage hero
   ========================================================= */
#header,
.np #header {
    max-width: none;
    min-height: 0;
    margin: 0;
    padding: 0;
    background-color: var(--site-surface-warm);
}

#header .site-header__inner {
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: clamp(2rem, 3vw, 5rem);
    width: 100%;
    max-width: 1600px;
    margin: 0 auto;
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
}

.site-brand {
    flex: 0 1 48rem;
    min-width: 31rem;
    text-align: left;
}

.site-brand__link {
    display: inline-flex;
    flex-direction: column;
    gap: 0.55rem;
    max-width: 100%;
    text-decoration: none;
}

.site-brand__link:hover,
.site-brand__link:focus-visible {
    text-decoration: none;
}

.site-brand__link:focus-visible {
    outline: 3px solid var(--site-brand-green);
    outline-offset: 5px;
}

.site-brand__ms,
.site-brand__ds {
    display: block;
    font-family: var(--site-font-brand);
    line-height: 1.15;
    text-transform: uppercase;
    white-space: nowrap;
}

.site-brand__ms {
    color: var(--site-brand-green);
    font-size: clamp(2.1rem, 2vw, 3rem);
    font-weight: 700;
    letter-spacing: 0.035em;
}

.site-brand__ds {
    color: var(--site-brand-orange-display);
    font-size: clamp(1.55rem, 1.55vw, 2.2rem);
    font-weight: 500;
    letter-spacing: 0.145em;
}

.site-header__nav {
    flex: 1 1 auto;
    min-width: 0;
    text-align: right;
}

.site-header__nav #nav {
    width: 100%;
}

.homepage-hero {
    position: relative;
    overflow: hidden;
    background-color: var(--site-page-background);
}

.homepage-hero__inner {
    position: relative;
    box-sizing: border-box;
    display: grid;
    grid-template-columns: minmax(28rem, 0.8fr) minmax(48rem, 1.35fr);
    align-items: center;
    gap: clamp(4rem, 7vw, 10rem);
    width: 100%;
    max-width: 1500px;
    min-height: 56rem;
    margin: 0 auto;
    padding: clamp(4rem, 6vw, 8rem) 7.0833333333% clamp(5rem, 7vw, 9rem);
}

.homepage-hero__brand,
.homepage-hero__media {
    position: relative;
    z-index: 2;
}

.homepage-hero__brand {
    display: flex;
    align-items: center;
    justify-content: center;
}

.homepage-hero__brand-image {
    display: block;
    width: min(108%, 49rem);
    height: auto;
}

.homepage-hero__media {
    isolation: isolate;
}

.homepage-hero__carousel {
    position: relative;
    z-index: 3;
    width: 100%;
    aspect-ratio: 673 / 464;
    overflow: hidden;
    border-radius: 2.2rem;
    background: #e7eee8;
}

.homepage-hero__slides {
    position: absolute;
    inset: 0;
}

.homepage-hero__photo {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0;
    transition: opacity 0.7s ease;
}

.homepage-hero__photo.is-active {
    opacity: 1;
}

.homepage-hero__carousel-toggle {
    position: absolute;
    left: 1.2rem;
    bottom: 1.2rem;
    z-index: 5;
    min-height: 4.4rem;
    padding: 0.75rem 1.15rem;
    border: 1px solid rgba(var(--site-brand-green-rgb), 0.7);
    border-radius: 1rem;
    background: rgba(var(--site-surface-warm-rgb), 0.94);
    color: var(--site-brand-green);
    font-family: var(--site-font-brand);
    font-size: 1.25em;
    font-weight: 700;
    line-height: 1.2;
    cursor: pointer;
    box-shadow: 0 0.35rem 1.2rem rgba(var(--site-brand-green-rgb), 0.12);
}

.homepage-hero__carousel-toggle:hover {
    background: var(--site-brand-green);
    color: var(--site-surface-warm);
}

.homepage-hero__carousel-toggle:focus-visible {
    outline: 3px solid var(--site-brand-orange-ui);
    outline-offset: 3px;
}

.homepage-hero__shape,
.homepage-hero__decor {
    position: absolute;
    display: block;
    height: auto;
    max-width: none;
    pointer-events: none;
    user-select: none;
}

.homepage-hero__shape {
    z-index: 1;
}

.homepage-hero__shape--green {
    right: -7%;
    bottom: -17%;
    width: clamp(24rem, 34vw, 48rem);
    opacity: 0.98;
}

.homepage-hero__decor {
    z-index: 4;
}

.homepage-hero__decor--list-1 {
    top: 3%;
    left: 38%;
    width: clamp(9rem, 9vw, 14rem);
}

.homepage-hero__decor--list-2 {
    top: 49%;
    right: -13%;
    width: clamp(11rem, 12vw, 18rem);
}

.homepage-hero__decor--list-3 {
    right: 3%;
    bottom: -10%;
    width: clamp(10rem, 10vw, 15rem);
}


.homepage-motto {
    position: relative;
    box-sizing: border-box;
    width: 100%;
    min-height: clamp(12rem, 11vw, 17rem);
    padding: clamp(2.5rem, 4vw, 4.5rem) 7.0833333333%;
    overflow: visible;
    background: rgba(var(--site-surface-warm-rgb), 0.68);
    text-align: center;
}

.homepage-motto__decor-wrap {
    position: absolute;
    top: 50%;
    left: clamp(2rem, 6vw, 9rem);
    display: flex;
    align-items: center;
    justify-content: center;
    width: clamp(11rem, 12vw, 17rem);
    height: clamp(10rem, 10vw, 15rem);
    transform: translateY(-50%);
    pointer-events: none;
    user-select: none;
}

.homepage-motto__decor {
    display: block;
    width: 100%;
    height: 100%;
    max-width: none;
    object-fit: contain;
    object-position: center;
}

.homepage-motto__accent {
    position: absolute;
    top: -3.8rem;
    left: clamp(18rem, 22vw, 35rem);
    z-index: 2;
    width: clamp(8rem, 8.5vw, 12rem);
    pointer-events: none;
    user-select: none;
}

.homepage-motto__accent img {
    display: block;
    width: 100%;
    height: auto;
}

.homepage-motto p.motto {
    position: relative;
    z-index: 1;
    width: min(100%, 105rem);
    margin: 0 auto;
    font-size: clamp(2.15em, 2.25vw, 3.15em) !important;
    line-height: 1.32;
}

.homepage-motto__label,
.homepage-motto__line {
    display: block;
}

.homepage-motto__label {
    margin-bottom: 0.15em;
}

.hp .page.vcontent {
    padding-top: 4em;
}

@media screen and (max-width: 1230px) {
    #header .site-header__inner {
        flex-direction: column;
        align-items: center;
        gap: 1.8rem;
    }

    .site-brand {
        flex: 0 1 auto;
        min-width: 0;
        width: 100%;
        text-align: center;
    }

    .site-header__nav {
        width: 100%;
        text-align: center;
    }

    .homepage-hero__inner {
        grid-template-columns: minmax(25rem, 0.75fr) minmax(42rem, 1.25fr);
        gap: clamp(3rem, 5vw, 6rem);
    }
}

@media screen and (max-width: 900px) {
    .homepage-hero__inner {
        grid-template-columns: 1fr;
        gap: 3rem;
        min-height: 0;
        padding-top: 4rem;
        padding-bottom: 7rem;
    }

    .homepage-hero__brand-image {
        width: min(76vw, 44rem);
    }

    .homepage-hero__media {
        width: min(100%, 72rem);
        margin: 0 auto;
    }

    .homepage-hero__decor--list-1 {
        top: 2rem;
        right: 5%;
        left: auto;
        width: 12rem;
    }


    .homepage-hero__decor--list-2 {
        top: 50%;
        right: -6%;
        width: 15rem;
    }

    .homepage-hero__decor--list-3 {
        right: 2%;
        bottom: -8%;
        width: 12rem;
    }

    .homepage-hero__shape--green {
        right: -5%;
        bottom: -13%;
        width: 48%;
    }

    .homepage-motto__decor-wrap {
        left: 3%;
        width: 12rem;
        height: 11rem;
    }

    .homepage-motto__accent {
        top: -3rem;
        left: 22%;
        width: 7.5rem;
    }
}

@media screen and (max-width: 48em) {
    #header .site-header__inner {
        padding-top: 1.8rem;
        padding-bottom: 1.8rem;
    }

    .site-brand__ms,
    .site-brand__ds {
        white-space: normal;
    }

    .site-brand__ms {
        font-size: clamp(1.8rem, 6vw, 2.4rem);
    }

    .site-brand__ds {
        font-size: clamp(1.35rem, 4.5vw, 1.8rem);
        letter-spacing: 0.1em;
    }

    .homepage-hero__inner {
        padding-right: 5%;
        padding-left: 5%;
    }

    .homepage-hero__carousel {
        border-radius: 1.5rem;
    }

    .homepage-hero__carousel-toggle {
        left: 0.8rem;
        bottom: 0.8rem;
        min-height: 4.4rem;
        padding: 0.65rem 0.9rem;
        font-size: 1.15em;
    }

    .homepage-hero__decor--list-1 {
        width: 9rem;
        opacity: 0.75;
    }

    .homepage-hero__decor--list-2,
    .homepage-hero__decor--list-3 {
        display: none;
    }

    .homepage-hero__shape--green {
        right: -4%;
        bottom: -8%;
        width: 42%;
    }

    .homepage-motto {
        min-height: 0;
        padding: 8.5rem 5% 3rem;
    }

    .homepage-motto__decor-wrap {
        top: 1.5rem;
        left: 5%;
        width: 8rem;
        height: 7rem;
        transform: none;
        opacity: 0.8;
    }

    .homepage-motto__accent {
        display: none;
    }

    .homepage-motto p.motto {
        font-size: clamp(2em, 7vw, 2.7em) !important;
        line-height: 1.35;
    }
}

/* Jemné listy v prázdných místech homepage podle klientské revize.
   Na menších šířkách se skrývají, aby nekolidovaly s obsahem. */
.hp .galerie2 {
    position: relative;
    overflow: visible;
}

.hp .galerie2::before {
    content: "";
    position: absolute;
    top: -11rem;
    right: 7%;
    width: clamp(9rem, 9.5vw, 13rem);
    aspect-ratio: 1 / 1;
    z-index: 2;
    pointer-events: none;
    background: url("../images/list-1.png") center / contain no-repeat;
    transform: rotate(8deg);
    opacity: 0.85;
}

.hp .galerie2 .box-4 > li:first-child {
    position: relative;
}

.hp .galerie2 .box-4 > li:first-child::after {
    content: "";
    position: absolute;
    left: 45%;
    bottom: -5rem;
    width: clamp(8rem, 8.5vw, 12rem);
    aspect-ratio: 1 / 1;
    z-index: 3;
    pointer-events: none;
    background: url("../images/list-2.png") center / contain no-repeat;
    transform: rotate(-12deg);
    opacity: 0.82;
}

@media screen and (max-width: 900px) {
    .hp .galerie2::before,
    .hp .galerie2 .box-4 > li:first-child::after {
        display: none;
    }
}

/* =========================================================
   Redesign 2026 — spodní botanické dekorace homepage
   Menší jeřabiny, více motivů a nepravidelné, opticky vyvážené rozmístění.
   ========================================================= */
.site-bottom-decor {
    position: relative;
    box-sizing: border-box;
    width: 100%;
    height: clamp(18rem, 20vw, 27rem);
    margin-top: clamp(2.5rem, 4vw, 5.5rem);
    margin-bottom: -4em;
    overflow: hidden;
    pointer-events: none;
    user-select: none;
}

.site-bottom-decor__inner {
    position: relative;
    width: min(100%, 1500px);
    height: 100%;
    margin: 0 auto;
}

.site-bottom-decor__item {
    position: absolute;
    display: block;
    height: auto;
    max-width: none;
    pointer-events: none;
    user-select: none;
}

.site-bottom-decor__rowan,
.site-bottom-decor__leaf {
    opacity: 0.72;
}

.site-bottom-decor__rowan {
    z-index: 1;
    width: clamp(6.4rem, 6.7vw, 8.9rem);
}

.site-bottom-decor__leaf {
    z-index: 2;
    width: clamp(8rem, 8.4vw, 11rem);
}

/* Dvě nepravidelné řady bez geometrické symetrie. */
.site-bottom-decor__item--01 {
    left: 4%;
    top: 14%;
    transform: rotate(-10deg);
}

.site-bottom-decor__item--02 {
    left: 17%;
    top: 12%;
    transform: rotate(-8deg);
}

.site-bottom-decor__item--03 {
    left: 36%;
    top: 27%;
    transform: rotate(47deg);
}

.site-bottom-decor__item--04 {
    left: 46%;
    top: 57%;
    transform: rotate(24deg);
}

.site-bottom-decor__item--05 {
    left: 58%;
    top: 21%;
    transform: rotate(-95deg);
}

.site-bottom-decor__item--06 {
    left: 70%;
    top: 14%;
    transform: rotate(9deg);
}

.site-bottom-decor__item--07 {
    right: 4%;
    top: 9%;
    transform: rotate(260deg);
}

.site-bottom-decor__item--08 {
    left: 0%;
    bottom: 3%;
    transform: rotate(4deg);
}

.site-bottom-decor__item--09 {
    left: 25%;
    bottom: 8%;
    transform: rotate(-7deg);
}

.site-bottom-decor__item--10 {
    left: 48%;
    bottom: 4%;
    transform: rotate(160deg);
}

.site-bottom-decor__item--11 {
    right: 22%;
    bottom: 2%;
    transform: rotate(-6deg);
}

.site-bottom-decor__item--12 {
    right: 8%;
    bottom: 9%;
    transform: rotate(83deg);
}

@media screen and (max-width: 900px) {
    .site-bottom-decor {
        height: 20rem;
        margin-top: 3.5rem;
        margin-bottom: -3em;
    }

    .site-bottom-decor__rowan {
        width: 6.1rem;
    }

    .site-bottom-decor__leaf {
        width: 7.6rem;
    }

    .site-bottom-decor__item--01 { left: 2%; top: 45%; }
    .site-bottom-decor__item--02 { left: 15%; top: 10%; }
    .site-bottom-decor__item--03 { left: 31%; top: 31%; }
    .site-bottom-decor__item--04 { left: 44%; top: 5%; }
    .site-bottom-decor__item--05 { left: 58%; top: 34%; }
    .site-bottom-decor__item--06 { left: 71%; top: 12%; }
    .site-bottom-decor__item--07 { right: 2%; top: 42%; }
    .site-bottom-decor__item--08 { left: 7%; bottom: 1%; }
    .site-bottom-decor__item--09 { left: 27%; bottom: 6%; }
    .site-bottom-decor__item--10 { left: 50%; bottom: 1%; }
    .site-bottom-decor__item--11 { right: 19%; bottom: 0; }
    .site-bottom-decor__item--12 { right: 5%; bottom: 7%; }
}

@media screen and (max-width: 48em) {
    .site-bottom-decor {
        height: 14rem;
        margin-top: 2.5rem;
        margin-bottom: -2em;
    }

    .site-bottom-decor__rowan {
        width: 5rem;
    }

    .site-bottom-decor__leaf {
        width: 6.1rem;
    }

    .site-bottom-decor__item--01 {
        left: -0.8rem;
        top: 50%;
    }

    .site-bottom-decor__item--02 {
        left: 23%;
        top: 1rem;
    }

    .site-bottom-decor__item--05 {
        left: 55%;
        top: 42%;
    }

    .site-bottom-decor__item--06 {
        right: 4%;
        left: auto;
        top: 1.4rem;
    }

    .site-bottom-decor__item--12 {
        right: -0.5rem;
        bottom: 0.3rem;
    }

    .site-bottom-decor__item--03,
    .site-bottom-decor__item--04,
    .site-bottom-decor__item--07,
    .site-bottom-decor__item--08,
    .site-bottom-decor__item--09,
    .site-bottom-decor__item--10,
    .site-bottom-decor__item--11 {
        display: none;
    }
}


/* =========================
   Redesign 2026: Aktuality
   ========================= */
.aktuality ul.box > li {
    overflow: hidden;
    border-radius: 14px;
    background: var(--site-surface-warm);
    box-shadow: 0 8px 24px rgba(var(--site-brand-green-rgb), 0.08);
}

.aktuality ul li header,
.aktuality ul li header img {
    border-top-left-radius: 14px;
    border-top-right-radius: 14px;
}

.aktuality ul li header img {
    display: block;
}

.aktuality ul li footer {
    padding: 1.6rem 1.5rem 1.8rem;
    border-bottom-left-radius: 14px;
    border-bottom-right-radius: 14px;
    background-color: var(--site-brand-green-soft);
    color: var(--site-text);
}

.aktuality ul li footer h2,
.aktuality ul li footer h2 a,
.aktuality ul li footer p,
.aktuality ul li footer a {
    color: var(--site-text);
}

.aktuality ul li footer h2 {
    margin-top: 0.45rem;
    margin-bottom: 0.75rem;
}

.aktuality ul li footer p {
    margin-top: 0.7rem;
    margin-bottom: 0.9rem;
}

.aktuality .button_slide {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    font-family: var(--site-font-brand);
    font-weight: 600;
    text-decoration: none;
    text-underline-offset: 0.2em;
}

.aktuality .button_slide::after {
    content: "→";
    font-size: 1.05em;
    line-height: 1;
    transition: transform 0.16s ease;
}

.aktuality .button_slide:hover::after,
.aktuality .button_slide:focus-visible::after {
    transform: translateX(0.18rem);
}

.news-nav-button,
a.news-nav-button:link,
a.news-nav-button:visited {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.7rem;
    min-height: 44px;
    padding: 0.7rem 1.15rem !important;
    border: 2px solid var(--site-brand-green);
    border-radius: 12px;
    background: transparent;
    color: var(--site-brand-green) !important;
    font-family: var(--site-font-brand);
    font-size: 1.4em;
    font-weight: 700;
    line-height: 1.25 !important;
    text-decoration: none;
    box-sizing: border-box;
    transition: background-color 0.16s ease, color 0.16s ease, transform 0.16s ease;
}

.news-nav-button--forward::after {
    content: "→";
    font-size: 1.15em;
    line-height: 1;
}

.news-nav-button--back::before {
    content: "←";
    font-size: 1.15em;
    line-height: 1;
}

.news-nav-button:hover,
a.news-nav-button:hover {
    background: var(--site-brand-green);
    color: #fff !important;
    transform: translateY(-1px);
}

.news-nav-button:focus-visible {
    outline: 3px solid var(--site-brand-orange-ui);
    outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
    .aktuality .button_slide::after,
    .news-nav-button {
        transition: none;
    }

    .aktuality .button_slide:hover::after,
    .aktuality .button_slide:focus-visible::after,
    .news-nav-button:hover,
    a.news-nav-button:hover {
        transform: none;
    }
}

/* =========================================================
   Redesign 2026 — fáze 2H: responzivní stabilizace
   - hlavička dostane více prostoru na středních šířkách
   - Aktuality používají předvídatelný grid 3 / 2 / 1
   - patička má stejné nadpisy i na .np/detailních stránkách
   ========================================================= */

/* Nadpisy patičky musí přebít starší obecné pravidlo .np h2. */
#footer .footer-column__title {
    margin: 0 0 1rem;
    padding: 0;
    color: #fff;
    font-family: var(--site-font-brand);
    font-size: 1.2em;
    font-weight: 700;
    line-height: 1.35;
    text-transform: uppercase;
}

/* Aktuality: starý float layout se na užších monitorech lámal nahodile.
   Grid zachová stejné karty, ale skládání je nyní záměrné. */
.aktuality ul.box {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 2.4rem;
    align-items: stretch;
}

.aktuality ul.box > li {
    float: none;
    display: flex;
    flex-direction: column;
    width: auto;
    min-width: 0;
    margin: 0;
}

.aktuality ul.box > li > footer {
    flex: 1 1 auto;
}

.aktuality ul.box > .cleaner {
    display: none;
}

/* Na středně širokých displejích necháme dvě pohodlné karty.
   Je-li počet karet lichý, poslední karta se záměrně vycentruje. */
@media screen and (max-width: 1050px) {
    .aktuality ul.box {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 2rem;
    }

    .aktuality ul.box > li:last-of-type:nth-child(odd) {
        grid-column: 1 / -1;
        width: min(100%, 36rem);
        justify-self: center;
    }

    .footer-columns,
    .footer-columns--4 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 2.4rem 3rem;
    }
}

@media screen and (max-width: 650px) {
    .aktuality ul.box {
        grid-template-columns: 1fr;
        gap: 2rem;
    }

    .aktuality ul.box > li:last-of-type:nth-child(odd) {
        grid-column: auto;
        width: auto;
        justify-self: stretch;
    }
}

/* Hlavička: na běžném notebooku už nesoutěží značka s navigací o jeden řádek. */
@media screen and (max-width: 1450px) {
    #header .site-header__inner {
        flex-direction: column;
        align-items: stretch;
        gap: 1.4rem;
    }

    .site-brand {
        flex: 0 1 auto;
        min-width: 0;
        width: 100%;
        text-align: left;
    }

    .site-header__nav {
        width: 100%;
        text-align: left;
    }
}

@media screen and (max-width: 1050px) {
    #header .site-header__inner {
        gap: 1rem;
        padding-top: 1.8rem;
        padding-bottom: 1.8rem;
    }

    .site-brand__ms {
        font-size: clamp(1.9rem, 3.3vw, 2.6rem);
    }

    .site-brand__ds {
        font-size: clamp(1.4rem, 2.6vw, 1.9rem);
        letter-spacing: 0.11em;
    }
}


/* =========================================================
   Redesign 2026 — fáze 2I: mobilní patička
   Pozdější breakpoint 1050 px ve fázi 2H přepisoval starší
   jednosloupcové pravidlo pro malé displeje. Toto pravidlo je
   záměrně až na konci souboru, aby se footer na mobilu skládal
   do jednoho čitelného sloupce.
   ========================================================= */
@media screen and (max-width: 650px) {
    .footer-columns,
    .footer-columns--4 {
        grid-template-columns: minmax(0, 1fr);
        gap: 1.9rem;
    }

    .footer-column {
        min-width: 0;
        text-align: center;
    }

    .footer-column__title {
        margin-bottom: 0.55rem;
        text-align: center !important;
    }

    .footer-column__items,
    .footer-column__items li {
        text-align: center;
    }

    .footer-column__items li {
        line-height: 1.45;
    }

    .webdesign {
        text-align: center;
    }

    .webdesign p {
        max-width: 30rem;
        margin-left: auto;
        margin-right: auto;
        line-height: 1.5;
    }
}


@media (prefers-reduced-motion: reduce) {
    .homepage-hero__photo {
        transition: none;
    }
}

/* =========================================================
   Redesign 2026 — fáze 4D: univerzální článková podstránka
   Systémové H1 + jemný nepravidelný „tapetový“ podkres.
   ========================================================= */
.np .page {
    position: relative;
    isolation: isolate;
    min-height: clamp(38rem, 55vh, 50rem);
}

/* Veškerý skutečný obsah zůstává vždy nad dekorativní vrstvou. */
.np .page > *:not(.subpage-decor) {
    position: relative;
    z-index: 1;
}

.subpage-title {
    margin: 0 0 clamp(2.2rem, 3vw, 3.6rem);
    color: var(--site-brand-green);
    font-family: var(--site-font-brand);
    font-size: clamp(2.8rem, 2.6vw, 3.8rem);
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: 0.025em;
    text-transform: uppercase;
}

.subpage-decor {
    --subpage-decor-leaf-opacity: 0.92;
    --subpage-decor-rowan-opacity: 0.88;
    position: absolute;
    inset: 0;
    z-index: 0;
    overflow: hidden;
    pointer-events: none;
    user-select: none;
}

.subpage-decor__item {
    position: absolute;
    display: block;
    height: auto;
    max-width: none;
    pointer-events: none;
    user-select: none;
}

/*
 * Vizuální princip: lehce nepravidelná tapeta, nikoli boční bordura.
 * Listy a jeřabiny mají podobnou vizuální váhu; jeřabiny jsou už jen
 * o málo menší. Dekorace zůstávají pod obsahem a jejich světlá kresba
 * nesmí být nositelem žádné informace.
 */
.subpage-decor__item--leaf-a,
.subpage-decor__item--leaf-b,
.subpage-decor__item--leaf-c,
.subpage-decor__item--leaf-d,
.subpage-decor__item--leaf-e,
.subpage-decor__item--leaf-f,
.subpage-decor__item--leaf-g,
.subpage-decor__item--leaf-h {
    width: clamp(5.8rem, 6.2vw, 8.6rem);
    opacity: var(--subpage-decor-leaf-opacity);
}

.subpage-decor__item--rowan-a,
.subpage-decor__item--rowan-b,
.subpage-decor__item--rowan-c,
.subpage-decor__item--rowan-d,
.subpage-decor__item--rowan-e,
.subpage-decor__item--rowan-f,
.subpage-decor__item--rowan-g,
.subpage-decor__item--rowan-h {
    width: clamp(4.7rem, 5.2vw, 7.1rem);
    opacity: var(--subpage-decor-rowan-opacity);
}

/* Horní pás: záměrně nechává klidnější oblast pod H1 a rozcestníkem. */
.subpage-decor__item--rowan-a {
    top: 2.2rem;
    left: 2.8%;
    transform: rotate(-12deg) scale(0.88);
}

.subpage-decor__item--leaf-a {
    top: 5.3rem;
    left: 31.5%;
    transform: rotate(14deg);
}

.subpage-decor__item--rowan-b {
    top: 3.8rem;
    left: 57%;
    transform: rotate(8deg) scale(0.92);
}

.subpage-decor__item--leaf-b {
    top: 4rem;
    right: 8.5%;
    transform: rotate(-12deg) scaleX(-1);
}

.subpage-decor__item--rowan-c {
    top: 13rem;
    left: 44.5%;
    transform: rotate(-9deg);
}

.subpage-decor__item--rowan-d {
    top: 12.5rem;
    right: 18%;
    transform: rotate(10deg) scale(0.92);
}

/* Střední pás: motivy se střídají přes celou šířku a nejsou symetrické. */
.subpage-decor__item--leaf-c {
    top: 21rem;
    left: 3.8%;
    transform: rotate(-16deg);
}

.subpage-decor__item--rowan-e {
    top: 23rem;
    left: 27.5%;
    transform: rotate(8deg) scale(0.9);
}

.subpage-decor__item--leaf-d {
    top: 20rem;
    left: 59%;
    transform: rotate(11deg) scaleX(-1);
}

.subpage-decor__item--leaf-e {
    top: 25.5rem;
    right: 4.5%;
    transform: rotate(-14deg);
}

.subpage-decor__item--rowan-f {
    top: 34rem;
    left: 16.5%;
    transform: rotate(-7deg) scale(0.92);
}

.subpage-decor__item--leaf-f {
    top: 36.5rem;
    left: 31%;
    transform: rotate(18deg);
}

.subpage-decor__item--rowan-g {
    top: 33rem;
    right: 25%;
    transform: rotate(11deg) scale(0.9);
}

.subpage-decor__item--rowan-h {
    top: 36rem;
    right: 5.5%;
    transform: rotate(-11deg) scale(0.88);
}

/* Spodní kotvy pomáhají i delším článkům; na krátké stránce jsou stále rozptýlené. */
.subpage-decor__item--leaf-g {
    left: 20%;
    bottom: 2.8rem;
    transform: rotate(-8deg) scaleX(-1);
}

.subpage-decor__item--leaf-h {
    right: 15.5%;
    bottom: 3.8rem;
    transform: rotate(16deg);
}

@media screen and (max-width: 1050px) {
    .np .page {
        min-height: clamp(36rem, 58vh, 44rem);
    }

    .subpage-decor__item--rowan-a {
        left: 1%;
    }

    .subpage-decor__item--leaf-a {
        left: 38%;
    }

    .subpage-decor__item--leaf-b {
        right: 1%;
    }

    .subpage-decor__item--rowan-d {
        right: 8%;
    }

    .subpage-decor__item--leaf-d {
        left: 54%;
    }

    .subpage-decor__item--leaf-e {
        right: -1rem;
    }
}

@media screen and (max-width: 48em) {
    .np .page {
        min-height: 34rem;
    }

    .subpage-decor {
        --subpage-decor-leaf-opacity: 0.45;
        --subpage-decor-rowan-opacity: 0.42;
    }

    .subpage-title {
        margin-bottom: 2.4rem;
        font-size: clamp(2.5rem, 8vw, 3.1rem);
    }

    /* Mobil: méně prvků a větší klid pod textem. */
    .subpage-decor__item--rowan-a,
    .subpage-decor__item--leaf-a,
    .subpage-decor__item--rowan-c,
    .subpage-decor__item--rowan-d,
    .subpage-decor__item--leaf-e,
    .subpage-decor__item--rowan-f,
    .subpage-decor__item--leaf-g,
    .subpage-decor__item--rowan-h {
        display: none;
    }

    .subpage-decor__item--leaf-b {
        top: 4.5rem;
        right: -2.1rem;
        width: 6.8rem;
    }

    .subpage-decor__item--rowan-b {
        top: 13rem;
        left: auto;
        right: 18%;
        width: 4.3rem;
    }

    .subpage-decor__item--leaf-c {
        top: 45%;
        left: -2rem;
        width: 6.8rem;
    }

    .subpage-decor__item--rowan-e {
        top: auto;
        left: 58%;
        bottom: 11rem;
        width: 4.2rem;
    }

    .subpage-decor__item--leaf-d {
        top: 57%;
        left: auto;
        right: -2.4rem;
        width: 6.4rem;
    }

    .subpage-decor__item--leaf-f {
        top: auto;
        left: 8%;
        bottom: 3rem;
        width: 5.8rem;
    }

    .subpage-decor__item--rowan-g {
        top: auto;
        right: 8%;
        bottom: 4rem;
        width: 4.4rem;
    }

    .subpage-decor__item--leaf-h {
        display: none;
    }
}