.banner-hero .text {
    max-width: 700px !important;
    
}
  .content-wrapper{
    background-color:transparent !important;
  }
  .breadcrumbs{
    background-color:transparent !important;
  }
.id-717, .id-705, .id-746, .id-720, .id-711, .id-29{
  background-image: url(https://693653.myshoptet.com/user/documents/upload/Banners02/listy-pozadi.png);
  background-size: cover;
 
  
}
.site-msg{
background-color:#EA518E !important;
}

article header h1{
display:none !important;
}

html[lang="cs"] .in-nas-blog h1,
html[lang="sk"] .in-blog h1 {
  display: none !important;
}

.reverse-text{
color:white !important;
}

.banner-custom h3{
font-size:35px !important;
}

.btn-white{
background-color:white; color:black !important;
border:none  !important;
}

.btn-white:hover{
color:#496A28 !important;
background-color:#E9EDE5;
}

.splide__arrow{
  background-color:transparent !important;
  border: 2px solid #87B158;
}

.splide__arrow--next::before, .splide__arrow--prev::before{
color: #87B158
}

.banner-custom, .image img{
  border-radius:40px !important;
}

.banner-hero{
margin-top:80px;
}

.banner-hero img{
margin-top:-40px;
}

.banner-hero h2 {

 margin-top:50px;
  font-size:50px;
  margin-bottom:10px !important;
}

.banner-hero p{
  color:black;
  font-size:18px;
  margin-bottom:30px;
}
.banner-hero .btns{
  
  margin-bottom:50px;
}


@media (max-width: 768px) {
  

  .banner-custom--reverse img {
    order: 2;
  }

  .banner-custom--reverse .blok {
    order: 1;
  }

  .banner-hero .btns {
    margin-bottom:30px;
  }
  .banner-hero h2{
  font-size:35px;
  line-height:auto;
  
}
}
@media (max-width: 767px) {
    #header .header-top>div .site-name a img {
        
        max-height: 70px;
    }
}

.news-item .description{display:none !important;}

#footer{
  margin-top:0px !important;
}
.odber{
  background-color: #87B158;
  padding: 5px 0px 0px;
}
#formNewsletterWidget{
padding-top:5px;
}
.subscribe-form .btn{
  background-color: #496A28;
}
.subscribe-form .btn:hover{
  border: 1px solid #496A28;
  background-color: #87B158;
}
.odber h4{
  text-transform: none !important;
  text-align:right !important;
  color:white;
}
.subscribe-form input[type=email].form-control{
border-radius:30px;

}
.subscribe-form .btn{
  border-radius: 0 30px 30px 0;
}

#dklab_instagram_widget{
  margin-top:150px;
}
@media (max-width: 780px) {
#dklab_instagram_widget{
  margin-top:10px;
}
  }
.dklab_instagram_widget_box{
  border-radius:30px;

}

#dklab_instagram_widget_in{
  padding:50px 100px;
}

@media (min-width: 1024px) {
.banner-custom--map{
  height:450px !important;}
  }
  #dklab_instagram_widget_in{
  padding:20px 0px;
}
.dklab_instagram_widget_box{
  border-radius:5px;
}
.odber h4{
  text-align:center !important;
}
.odber{
  padding: 20px 0px;
}

.p-detail-tabs-wrapper{
   display:none!important;
}

#formContact .form-group>input.form-control, #formContact .form-group>select.form-control{
width:100% !important;
}

.formular {
  max-width: 600px; /* Nebo šířku, která ti vyhovuje */
  margin: 0 auto; /* Vycentrování na střed */
  padding: 20px; /* Odsazení od okrajů */
 
}

.formular form {
  display: flex;
  flex-direction: column;
  gap: 15px; /* Rozestupy mezi položkami */
}

.formular label {
  margin-bottom: 5px;
  font-size: 14px;
}

.formular .form-group {
  display: flex;
  flex-direction: column;
}

.formular .submit-wrapper {
  text-align: center;
}

.formular input[type=submit].btn {
  background-color: #87B158;
  color: white;
  padding: 10px 30px;
  border: none;
  border-radius: 50px;
  cursor: pointer;
  width:100%;
}

.formular input[type="submit"]:hover {
  background-color: #6a944a;
}






/* =========================
   HOMEPAGE HEADER
   ========================= */

body.is-homepage #header,
body.is-homepage #header .navigation-wrapper,
body.is-homepage #header .header-top,
body.is-homepage #header .navigation-in,
body.is-homepage #header #navigation,
body.is-homepage #header .container {
  background: transparent !important;
  background-image: none !important;
}

/* ✅ výjimka: po scrollu dovol tmavé pozadí */
body.is-homepage #header.scrolling,
body.is-homepage #header.scrolling .navigation-wrapper,
body.is-homepage #header.scrolling .header-top,
body.is-homepage.scrolling #header,
body.is-homepage.scrolling #header .navigation-wrapper,
body.is-homepage.scrolling #header .header-top{
  background: rgba(0,0,0,.55) !important;
  background-image: none !important;
}

/* pojistka – Shoptet light header */
body.is-homepage.header-background-light #header,
body.is-homepage.header-background-light #header .navigation-wrapper,
body.is-homepage.header-background-light #header .header-top {
  background: transparent !important;
  background-image: none !important;
}

@media (min-width: 768px){
  body.is-homepage #header,
  body.is-homepage #header .navigation-wrapper,
  body.is-homepage #header .header-top{
    background: transparent !important;
    background-image: none !important;
  }
}


/* =========================
   NON-HOMEPAGE HEADER
   ========================= */

body.is-not-homepage #header,
body.is-not-homepage #header .navigation-wrapper,
body.is-not-homepage #header .header-top,
body.is-not-homepage #header .navigation-in,
body.is-not-homepage #header .container {
  background: #4A6F2C !important;
  background-image: none !important;
}

/* i kdyby Shoptet přidal .scrolling – drž zelenou */
body.is-not-homepage #header.scrolling,
body.is-not-homepage.scrolling #header,
body.is-not-homepage.scrolling #header .navigation-wrapper,
body.is-not-homepage.scrolling #header .header-top{
  background: #4A6F2C !important;
  background-image: none !important;
}

/* light-header pojistka */
body.is-not-homepage.header-background-light #header,
body.is-not-homepage.header-background-light #header .navigation-wrapper,
body.is-not-homepage.header-background-light #header .header-top {
  background: #4A6F2C !important;
  background-image: none !important;
}


/* =========================
   TOP NAV BAR – HOMEPAGE
   ========================= */

body.is-homepage .top-navigation-bar{
  position: relative;
  z-index: 10;
  background: transparent !important;
  background-image: none !important;
}

/* =========================
   TOP NAV BAR – NON-HOMEPAGE
   ========================= */

body.is-not-homepage .top-navigation-bar{
  position: relative;
  z-index: 1000;
  background: #4A6F2C !important;
  background-image: none !important;
}


/* HEADER musí být nad HERO */
#header{
  position: relative;
  z-index: 1000;
}

/* kdyby byl wrapper absolutní */
#header .navigation-wrapper{
  position: relative;
  z-index: 1000;
}

/* HERO má být POD headerem */
.ms-hero{
  position: relative;
  z-index: 1;
}

/* =================================================
   UNIVERSAL DECOR IMAGE SYSTEM
   ================================================= */
/* základ dekorace */
.ms-decor{
  position: absolute;
  z-index: 1;
  pointer-events: none;
  user-select: none;

  max-width: 100%;
  height: auto;
}

/* pokud chceš nad obsahem */
.ms-decor--top{
  z-index: 5;
}

/* větší */
.ms-decor--lg{
  width: 420px;
}

/* menší */
.ms-decor--sm{
  width: 220px;
}

/* otočení */
.ms-decor--rot-15{
  transform: rotate(15deg);
}
.ms-decor--rot--15{
  transform: rotate(-15deg);
}

/* mobil default skryt */
@media (max-width: 900px){
  .ms-decor{
    display: none;
  }
}

/* když chceš zobrazit i na mobilu */
.ms-decor--mobile{
  display: block;
}

/* =================================================
   HEADER – VŠECHNY TEXTY BÍLÉ
   ================================================= */

/* základ */
#header,
#header *{
  color: #fff;
}

/* odkazy */
#header a{
  color: #fff;
}

/* hlavní menu */
#header .menu-level-1 > li > a,
#header .menu-level-1 > li > a b{
  color: #fff;
}

/* submenu */
#header .menu-level-2 a,
#header .menu-level-2 span{
  color: #fff;
}

/* submenu background */
#header .menu-level-2{
  background: rgba(0,0,0,.18);
  backdrop-filter: blur(6px);
}

/* hover */
#header a:hover,
#header .menu-level-1 > li > a:hover{
  opacity: 0.85;
}

/* aktivní položky */
#header .menu-item--active > a,
#header .menu-item--active > a b{
  color: #fff;
}

/* submenu arrow */
#header .submenu-arrow{
  border-top-color: #fff;
}

/* navigationActions (měna / jazyk) */
#header .navigationActions,
#header .navigationActions a,
#header .navigationActions span{
  color: #fff;
}

/* SVG ikonky (vlajky, šipky) */
#header svg,
#header svg *{
  fill: #fff;
}

/* login / košík text (pokud někde zůstane) */
#header .navigation-buttons span,
#header .cart-price{
  color: #fff;
}

/* hamburger */
#header [data-testid="hamburgerMenu"],
#header [data-testid="hamburgerMenu"]::before,
#header [data-testid="hamburgerMenu"]::after{
  color: #fff;
}

/* =================================================
   HEADER – submenu text černý
   ================================================= */

/* =================================================
   HEADER – správné oddělení barev
   ================================================= */

/* ===== LEVEL 1 – hlavní horní menu (bílé) ===== */
#header .menu-level-1 > li > a,
#header .menu-level-1 > li > a b,
#header .menu-level-1 > li > a span{
  color: #fff !important;
}

/* šipka u level 1 */
#header .menu-level-1 > li > a .submenu-arrow{
  border-top-color: #fff !important;
}

/* ===== LEVEL 2 – dropdown submenu (černé) ===== */
#header .menu-level-2{
  background: #fff !important;
  backdrop-filter: none !important;
}

#header .menu-level-2 a,
#header .menu-level-2 span,
#header .menu-level-2 b{
  color: #000 !important;
}

/* šipka uvnitř submenu */
#header .menu-level-2 .submenu-arrow{
  border-top-color: #000 !important;
}

/* SVG v dropdownu */
#header .menu-level-2 svg,
#header .menu-level-2 svg *{
  fill: #000 !important;
}


/* =================================================
   MENU-HELPER ("Více")
   ================================================= */

/* !!! wrapper NEBARVIT – jinak zmizí hamburger */
#header .menu-helper{
  background: transparent !important;
}

/* dropdown v helperu bílé pozadí */
#header .menu-helper > ul.menu-level-1,
#header .menu-helper .menu-level-2{
  background: #fff !important;
}

/* text v helper dropdownu černý */
#header .menu-helper > ul.menu-level-1 > li > a,
#header .menu-helper > ul.menu-level-1 > li > a b,
#header .menu-helper > ul.menu-level-1 > li > a span,
#header .menu-helper .menu-level-2 a,
#header .menu-helper .menu-level-2 span,
#header .menu-helper .menu-level-2 b{
  color: #000 !important;
}

/* šipky v helperu */
#header .menu-helper .submenu-arrow{
  border-top-color: #000 !important;
}

/* SVG v helper dropdownu */
#header .menu-helper ul svg,
#header .menu-helper ul svg *{
  fill: #000 !important;
}


/* =================================================
   HAMBURGER – zachovat bílé čáry
   ================================================= */

#header [data-testid="hamburgerMenu"]{
  color: #fff !important;
}

#header [data-testid="hamburgerMenu"]::before,
#header [data-testid="hamburgerMenu"]::after{
  background-color: #fff !important;
}



/* =================================================
   HAMBURGER – vždy bílý (override mobile menu)
   ================================================= */

/* samotný toggle */
#header [data-testid="hamburgerMenu"]{
  color: #fff !important;
}

/* pokud je hamburger řešen pseudo-elementy */
#header [data-testid="hamburgerMenu"]::before,
#header [data-testid="hamburgerMenu"]::after{
  color: #fff !important;
}

/* SVG varianta (některé šablony) */
#header [data-testid="hamburgerMenu"] svg,
#header [data-testid="hamburgerMenu"] svg *{
  fill: #fff !important;
}


/* =================================================
   MOBILE MENU PANEL (hamburger) – bílé pozadí + černý text
   ================================================= */
@media (max-width: 767px){

  #header #navigation{
    z-index: 9999;
    position: absolute;
  }

  /* nejdůležitější: barvi i samotný #navigation (ty ho máš globálně transparent !important) */
  
  #header #navigation .navigation-in{
    background: #fff !important;
    background-image: none !important;
    color: #111 !important;
  }

  #header #navigation{
    background: none !important;
    background-image: none !important;
  }

  /* vše uvnitř menu černě (přebije tvoje #header * {color:#fff}) */
  #header #navigation,
  #header #navigation *{
    color: #111 !important;
  }

  /* šipky v menu */
  #header #navigation .submenu-arrow{
    border-top-color: #111 !important;
  }

  /* submenu (level 2) */
  #header #navigation .menu-level-2{
    background: #fff !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }

  #header [data-testid="hamburgerMenu"]::before{
  background: transparent !important;
  box-shadow: none !important;
}

  /* svg */
  #header #navigation svg,
  #header #navigation svg *{
    fill: #111 !important;
  }
}

/* =================================================
   HAMBURGER + MENU-HELPER – odstranit bílé ::before boxy
   ================================================= */

/* hamburger tlačítko (a.toggle-window) */
#header a.toggle-window[data-testid="hamburgerMenu"]::before{
  background: transparent !important;
  box-shadow: none !important;
}

/* menu-helper "Více" (div) – pokud má taky ::before */
#header .menu-helper[data-testid="hamburgerMenu"]::after{
  background: transparent !important;
  box-shadow: none !important;
}



/* =====================================
   HEADER – JS řízený scroll stav
   ===================================== */

#header{
  transition: background-color .22s ease, backdrop-filter .22s ease, -webkit-backdrop-filter .22s ease;
}

/* aktivní stav po scrollu */
#header.is-scrolled,
#header.is-scrolled .navigation-wrapper{
  background: rgba(0,0,0,.0) !important;
  background-image: none !important;
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  visibility: hidden;
}


/* =====================================
   TOP BAR – všechny texty bílé
   ===================================== */

.top-navigation-bar,
.top-navigation-bar *{
  color: #fff !important;
}

/* odkazy */
.top-navigation-bar a{
  color: #fff !important;
}

/* silné texty (Zákaznická podpora apod.) */
.top-navigation-bar strong{
  color: #fff !important;
}

/* dropdown caret / šipky */
.top-navigation-bar .caret{
  border-top-color: #fff !important;
}

.languagesMenu .languagesMenu__list__link{
  color: #000 !important;
}

/* jazyk + měna */
.top-navigation-bar .languagesMenu__header,
.top-navigation-bar .languagesMenu__list__item,
.top-navigation-bar .languagesMenu__list__name{
  color: #000 !important;
}

.top-navigation-bar .languagesMenu__header--actual{
  color: #fff !important;
}

.languagesMenu__list--language .shp-flag,
.languagesMenu__list--language .shp-flag *{
  fill: initial !important;
}

/* hover – lehce průhledné, ať to není mrtvé */
.top-navigation-bar a:hover{
  opacity: 0.85;
}

/* ikonky (svg) */



/* === KOŠÍK – růžový čtverec + reálný badge (Shoptet) === */

/* === KOŠÍK – růžový čtverec + reálný badge (Shoptet) + SVG ikonka === */

#header .header-top .navigation-buttons a.cart-count{
  width: 56px !important;
  height: 56px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 14px !important;
  background: #ff4fa0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: relative !important;
  line-height: 1 !important;
  overflow: visible !important;            /* aby badge mohl ven */
}

/* schovej text ceny */
#header .header-top .navigation-buttons a.cart-count .cart-price{
  display: none !important;
}

/* SVG ikonka košíku místo Shoptet ::before font-ikony */
#header .header-top .navigation-buttons a.cart-count::before{
  content: "" !important;
  position: absolute !important;
  width: 28px !important;
  height: 28px !important;
  background: url("https://693653.myshoptet.com/user/documents/upload/icon/cart.svg") center/contain no-repeat !important;
  margin: 0 !important;
}

/* vypni jakýkoliv fake badge */
#header .header-top .navigation-buttons a.cart-count::after{
  content: none !important;
}

/* ❗ JEDINÝ badge – napojený na <i data-testid="headerCartCount"> */
#header .header-top .navigation-buttons a.cart-count > i[data-testid="headerCartCount"]{
  all: unset !important;                   /* brutální reset */
  position: absolute !important;
  inset: -12px -12px auto auto !important; /* top right */
  width: 30px !important;
  height: 30px !important;
  background: #ffffff !important;
  color: #111 !important;
  border-radius: 999px !important;
  display: grid !important;
  place-items: center !important;
  font-weight: 800 !important;
  font-size: 13px !important;
  line-height: 1 !important;
  z-index: 5 !important;
  pointer-events: none !important;
}

/* FIX: vypni modrý focus/outline ring + shadow na košíku */
#header .header-top .navigation-buttons a.cart-count,
#header .header-top .navigation-buttons a.cart-count:hover,
#header .header-top .navigation-buttons a.cart-count:focus,
#header .header-top .navigation-buttons a.cart-count:focus-visible,
#header .header-top .navigation-buttons a.cart-count:active{
  outline: none !important;
  box-shadow: none !important;
}

/* někdy Shoptet dává focus ring přes pseudo – vypnout i tam */
#header .header-top .navigation-buttons a.cart-count::before,
#header .header-top .navigation-buttons a.cart-count::after{
  outline: none !important;
  box-shadow: none !important;
}


/* =================================================
   MOBILE – košík + hamburger na jednu osu (stejný box)
   ================================================= */
@media (max-width: 767px){

  /* řádek tlačítek: jistota, že se zarovnává na střed */
  #header .navigation-buttons{
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
  }

  /* hamburger: dej mu stejný box jako košík (56x56) */
  #header .navigation-buttons a[data-testid="hamburgerMenu"][data-target="navigation"]{
    width: 56px !important;
    height: 56px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    line-height: 1 !important;
    margin: 0 !important;
  }

  /* Shoptet někdy kreslí ikonku přes pseudo */
  #header .navigation-buttons a[data-testid="hamburgerMenu"][data-target="navigation"]::before,
  #header .navigation-buttons a[data-testid="hamburgerMenu"][data-target="navigation"]::after{
    line-height: 1 !important;
  }
}



/* STEP 3 – Login ikonka vedle košíku v #header + schovej původní login v topbaru */

@media (min-width: 992px) {
    .popup-widget.login-widget {
        top: 110px !important;
    }
}

/* schovej původní "Přihlášení" v top baru (nepřijdeš o funkci, jen UX) */
.top-navigation-bar .top-nav-button-login{
  display: none !important;
}

/* layout tlačítek v headeru */
#header .navigation-buttons{
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
}

/* login tlačítko – stejné rozměry jako košík */
#header .navigation-buttons .ms-login-btn{
  width: 56px !important;
  height: 56px !important;
  padding: 0 !important;
  border: 2px solid #ffffff !important;
  border-radius: 14px !important;
  background: transparent !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: relative !important;
  line-height: 1 !important;
  outline: none !important;
  box-shadow: none !important;
  font-size: 0 !important; /* zabije případný text/ikon-font */
}


/* hover + vypnutí modrého focus ringu */
#header .navigation-buttons .ms-login-btn:hover{
  background: rgba(255,255,255,.08) !important;
}
#header .navigation-buttons .ms-login-btn:focus,
#header .navigation-buttons .ms-login-btn:focus-visible,
#header .navigation-buttons .ms-login-btn:active{
  outline: none !important;
  box-shadow: none !important;
}

/* =========================================================
   HEADER BUTTONS: SEARCH + LOGIN – úprava
   - bez borderu
   - větší ikonky (škáluj přes --ms-icon-size)
   ========================================================= */

:root{
  --ms-icon-size: 34px; /* ← zvětši/zmenši ikonky */
}

/* Skryj původní Shoptet search (ponech v DOM kvůli modalu) */
.top-navigation-bar .search{
  display: none !important;
}

/* skryj search a login v TOP BARU */
.top-navigation-bar a.toggle-window[data-target="search"],
.top-navigation-bar .top-nav-button-login{
  display: none !important;
}

/* header tlačítka vedle sebe */
#header .navigation-buttons{
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
}

/* vypni focus ring */
#header .navigation-buttons a:focus,
#header .navigation-buttons a:focus-visible,
#header .navigation-buttons a:active,
#header .navigation-buttons button:focus,
#header .navigation-buttons button:focus-visible,
#header .navigation-buttons button:active{
  outline: none !important;
  box-shadow: none !important;
}

/* SPOLEČNÝ STYL TLAČÍTEK (bez borderu) */
#header .navigation-buttons .ms-search-btn,
#header .navigation-buttons .ms-login-btn{
  width: 56px !important;
  height: 56px !important;
  padding: 0 !important;

  border: 0 !important;              /* ✅ pryč border */
  border-radius: 14px !important;

  background: transparent !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  position: relative !important;
  font-size: 0 !important;
  line-height: 1 !important;
}

#header .navigation-buttons .ms-search-btn:hover,
#header .navigation-buttons .ms-login-btn:hover{
  background: rgba(255,255,255,.08) !important;
}

/* SVG ICONS */
#header .navigation-buttons .ms-search-btn::before,
#header .navigation-buttons .ms-login-btn::before{
  content: "" !important;
  position: absolute !important;
  width: var(--ms-icon-size) !important;   /* ✅ větší ikonky */
  height: var(--ms-icon-size) !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: contain !important;
}

/* SEARCH */
#header .navigation-buttons .ms-search-btn::before{
  background-image: url("https://693653.myshoptet.com/user/documents/upload/icon/search.svg") !important;
}

/* LOGIN */
#header .navigation-buttons .ms-login-btn::before{
  background-image: url("https://693653.myshoptet.com/user/documents/upload/icon/user.svg") !important;
}

/* zruš staré kreslení */
#header .navigation-buttons .ms-search-btn::after,
#header .navigation-buttons .ms-login-btn::after{
  content: none !important;
}


/* =========================================================
   VOLITELNÉ: hover barva ikon
   ========================================================= */

/*
#header .navigation-buttons .ms-search-btn:hover::before,
#header .navigation-buttons .ms-login-btn:hover::before{
  background: #6FA641 !important;
}
*/




/* =========================================================
   SEARCH MODAL – FIX + lepší spacing
   ========================================================= */

#ms-search-modal{
  position: fixed;
  inset: 0;
  z-index: 999999;
  display: none;
}

#ms-search-modal.is-open{
  display: block;
}

#ms-search-modal .ms-search-modal__backdrop{
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.6);
}

/* PANEL */
#ms-search-modal .ms-search-modal__panel{
  position: absolute;
  left: 50%;
  top: 10vh;
  transform: translateX(-50%);
  width: min(900px, calc(100% - 32px));
  background: #ffffff;
  border-radius: 22px;
  box-shadow: 0 30px 80px rgba(0,0,0,.35);
}

/* VNITŘNÍ OBSAH */
#ms-search-modal .ms-search-modal__content{
  padding: 28px 28px 32px;
}

/* HLAVIČKA */
#ms-search-modal .ms-search-modal__head{
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 18px;
}

#ms-search-modal .ms-search-modal__title{
  font-weight: 900;
  font-size: 20px;
  color: #111;
}

/* CLOSE */
#ms-search-modal .ms-search-modal__close{
  position: absolute;
  top: 18px;
  right: 18px;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  border: 0;
  background: #f1f1f1;
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
}

/* SLOT */
#ms-search-modal .ms-search-modal__formSlot{
  padding-top: 8px;
}

/* FORM */
#ms-search-modal form.search-form{
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 14px;
  align-items: center;
}

#ms-search-modal input.search-input{
  height: 58px;
  border-radius: 16px;
  border: 2px solid #e7e7e7;
  padding: 0 18px;
  font-size: 16px;
}

#ms-search-modal input.search-input:focus{
  border-color: #ff4fa0;
}

#ms-search-modal button[data-testid="searchBtn"]{
  height: 58px;
  border-radius: 16px;
  border: 0;
  padding: 0 2px;
  background: #ff4fa0;
  color: #fff;
  font-weight: 900;
  cursor: pointer;
}

#header .navigation-buttons .top-nav-delivery{
  display: none !important;
}


/* MOBILE */
@media (max-width: 560px){
  #ms-search-modal .ms-search-modal__panel{
    top: 6vh;
  }

  #ms-search-modal .ms-search-modal__content{
    padding: 22px 20px 26px;
  }

  #ms-search-modal form.search-form{
    grid-template-columns: 1fr;
  }
}


/* =========================================
   MOBILE – skrýt search + login
   ponechat košík + hamburger
   ========================================= */

@media (max-width: 767px){

  /* schovej search */
  #header .navigation-buttons .ms-search-btn{
    display: none !important;
  }

  /* schovej login */
  #header .navigation-buttons .ms-login-btn{
    display: none !important;
  }

  /* schovej cenu u košíku (ponech ikonku + badge) */
  #header .navigation-buttons .cart-price{
    display: none !important;
  }

  /* zajisti, že košík + hamburger zůstanou vedle sebe */
  #header .navigation-buttons{
    display: flex !important;
    align-items: center;
    gap: 12px;
  }

  #header .navigation-buttons{
    flex-wrap: wrap !important;
    justify-content: flex-end !important;
  }

  #header .navigation-buttons a[data-testid="hamburgerMenu"][data-target="navigation"]{
    order: 1;
  }

  #header .navigation-buttons a.cart-count[data-testid="headerCart"]{
    order: 2;
    width: 56px !important;
  }

  /* vynutí nový řádek před košíkem */
  #header .navigation-buttons a.cart-count[data-testid="headerCart"]{
    flex-basis: 100% !important;
    margin-top: 10px !important;
    margin-left: auto !important;
    right: 53px !important;
    top: 1px !important;
  }

  #header .cart-count {
      right: 53px !important;
      top: 1px !important;
    }
}






:root{
  --ms-header-h: 135px;

  --ms-hero-h: 850px;                 /* výška celé hero sekce */
  --ms-hero-chef-bottom-gap: 120px;   /* dole prázdný prostor bez kuchaře */

  --ms-hero-container: 1364px;        /* stejné jako ms-hero__inner max-width */
  --ms-hero-pad-x: 32px;              /* stejné jako ms-hero__inner padding */
}

/* =========================================
   HEADER – nad hero
   ========================================= */

#header{
  position: relative;
  z-index: 9;
}

/* přepiš Shoptet wrapper background */
@media (min-width: 768px){
  html body #header .navigation-wrapper{
    background: transparent !important;
  }
}


/* =========================================
   HERO – pevná výška + bg + kuchař ukotvený na container
   ========================================= */

.ms-hero{
  position: relative;
  overflow: visible;

  background: linear-gradient(135deg, #5f8f33, #6FA641);

/* ZÁKLADNÍ BARVA */
  background-color: #6FA641;

  /* SVG jako dekor */
  background-image: url("https://693653.myshoptet.com/user/documents/upload/HP/BG.svg");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;

  margin-top: calc(var(--ms-header-h) * -1);
  padding-top: calc(var(--ms-header-h) + 60px);

  height: var(--ms-hero-h);
}

/* BG vrstva */
.ms-hero__bg{
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
}

/* kuchař: odshora, končí 130px nad spodkem */
.ms-hero__chef{
  position: absolute;
  top: 0;
  bottom: var(--ms-hero-chef-bottom-gap);

  /* klíč: ukotvení k pravému okraji KONTEJNERU */
  right: max(
    var(--ms-hero-pad-x),
    calc((100vw - var(--ms-hero-container)) / 2 + var(--ms-hero-pad-x))
  );

  width: min(48vw, 820px);

  display: flex;
  align-items: flex-end;
  justify-content: flex-end;

  filter: drop-shadow(0 30px 70px rgba(0,0,0,.25));
}

.ms-hero__chef img{
  width: 100%;
  height: 100%;
  display: block;

  object-fit: contain;
  object-position: right bottom;
}

/* vnitřek hero nad bg */
.ms-hero__inner{
  position: relative;
  z-index: 2;

  max-width: var(--ms-hero-container);
  margin: 0 auto;
  padding: 0 var(--ms-hero-pad-x);

  height: 100%;
  display: flex;
  align-items: flex-start;   /* 🔥 místo center */
}


.ms-hero__content{
  max-width: 640px;
}

.ms-hero__title{
  color: #fff;
  font-size: clamp(42px, 5vw, 76px);
  font-weight: 900;
  line-height: 1.05;
  margin: 0 0 20px;
}

.ms-hero__lead{
  color: rgba(255,255,255,.9);
  font-size: 20px;
  margin: 0 0 28px;
}

.ms-hero__text{
  color: rgba(255,255,255,.9);
  font-size: 14px;
  margin: 0 0 28px;
}

@media (max-width: 1250px){
  .ms-hero__text{
    max-width: 400px;
  }
}

@media (max-width: 767px){
  .ms-hero__text{
    display: none;
  }
}

.ms-hero__buttons{
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
}

.ms-btn{
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  height: 46px;
  padding: 0 22px;

  border-radius: 5px;
  font-weight: 600;
  font-size: 14px;

  text-decoration: none !important;
  transition: transform .15s ease, opacity .15s ease, background .15s ease;

  color: #fff !important;
}

/* PRIMARY (růžové) */
.ms-btn--primary{
  background: #ff4fa0;
  color: #fff !important;
}

/* SECONDARY (zelené) */
.ms-btn--secondary{
  background: #87B158;
  color: #fff !important;
}

/* HOVER – text zůstává bílý */
.ms-btn:hover{
  transform: translateY(-1px);
  opacity: .95;
  color: #fff !important;
  text-decoration: none !important;
}

/* kdyby Shoptet přepisoval link state */
.ms-btn:focus,
.ms-btn:active,
.ms-btn:visited{
  color: #fff !important;
}

/* =========================================
   RESPONSIVE
   ========================================= */

@media (max-width: 1100px){
  .ms-hero__chef{
    width: min(58vw, 760px);
  }
}

@media (max-width: 900px){
  :root{
    --ms-hero-h: 760px;
    --ms-hero-chef-bottom-gap: 110px;
    --ms-hero-pad-x: 22px;
  }

  .ms-hero{
    padding-top: calc(var(--ms-header-h) + 40px);
  }

  .ms-hero__inner{
    align-items: flex-start;
    padding-top: 20px;
  }

  /* na mobilu kuchař vycentrovat */
  .ms-hero__chef{
    left: 0;
    right: 0;
    bottom: 40px;
    width: 100%;
    justify-content: center;
  }

  .ms-hero__chef img{
    width: min(92vw, 720px);
    height: 100%;
    object-position: center bottom;
  }
}

/* stůl */
.ms-hero__table{
  position: absolute;
  left: 50%;
  bottom: -28px;              /* lehce do další sekce (20–30px) */
  transform: translateX(-50%);
  width: 2500px;              /* obrázek je cca 2000px -> držíme šířku */
  max-width: none;            /* ať ho nic neomezuje */
  height: 300px;              /* uprav dle reálné výšky stolu */
  background: url("https://693653.myshoptet.com/user/documents/upload/HP/table.png") center bottom / contain no-repeat;
  z-index: 1;                 /* nad pozadím, ale pod textem */
  pointer-events: none;
}

/* obsah hero musí být nad stolem */
.ms-hero__inner{
  position: relative;
  z-index: 2;
}

/* responsive: ať to na menších šířkách pořád sedí */
@media (max-width: 1200px){
  .ms-hero__table{
    width: 1600px;
    height: 220px;
  }
}
@media (max-width: 900px){
  .ms-hero__table{
    width: 1300px;
	transform: translateX(-65%);
    height: 200px;
    bottom: -24px;
  }
}
@media (max-width: 560px){
  .ms-hero__table{
    width: 1100px;
    height: 180px;
    bottom: -20px;
  }
}




/* =========================================================
   MMWEBY / PAPAFOOD – PRODUCT CARD (Figma style) FINAL (v2)
   Cíl:
   - pořadí: NADPIS -> CENA -> POPIS
   - button "Detail" je úplně dole, skrytý
   - hover celé karty: text se posune nahoru + button se ukáže
   - vrstvy: Z-1 #3AC0A1, Z-2 woman, Z-3 gradient do #87B158
   - svislý text vlevo
   - rating wrapper pryč
   ========================================================= */

@media (min-width: 1400px){
  .products-block > div:nth-child(2n),
  .products-block > div:nth-child(odd),
  .products > div{
    padding: 12px !important;
  }
}

:root{
  --ms-card-radius: 24px;
  --ms-card-min-h: 560px;
  --ms-card-pad-x: 26px;
  --ms-card-pad-t: 26px;
  --ms-card-pad-b: 22px;

  --ms-z1: #3AC0A1;
  --ms-z3: #87B158;

  --ms-fade-at: 55%;
  --ms-woman-top: 5px;
  --ms-woman-bottom-cut: 130px;

  /* o kolik se zvedne text při hover celé karty */
  --ms-hover-lift: 78px;
}

/* scope */
.products .p,
.products-block .p{
  position: relative !important;
  overflow: hidden !important;
  border-radius: var(--ms-card-radius) !important;
  min-height: var(--ms-card-min-h);
  background: transparent !important;
  isolation: isolate;
  max-width: 306px;
    margin-right: auto;
    margin-left: auto;
}

/* Z-1 */
.products .p::before,
.products-block .p::before{
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  border-radius: var(--ms-card-radius);
  background: var(--ms-z1);
}

/* Z-3 overlay gradient */
.products .p::after,
.products-block .p::after{
  content: "";
  position: absolute;
  inset: 0;
  z-index: 3;
  pointer-events: none;
  border-radius: var(--ms-card-radius);
  background: linear-gradient(
    180deg,
    rgba(58,192,161,0) 0%,
    rgba(58,192,161,0) calc(var(--ms-fade-at) - 10%),
    rgba(135,177,88,.65) var(--ms-fade-at),
    rgba(135,177,88,1) 100%
  );
}

/* Z-2 woman layer (Shoptet image wrapper) */
.products .p > a.image,
.products-block .p > a.image{
  position: absolute !important;
  inset: 0 !important;
  z-index: 2 !important;
  display: block !important;
}

.products .p > a.image img,
.products-block .p > a.image img{
  position: absolute !important;
  left: 50% !important;
  top: var(--ms-woman-top) !important;
  transform: translateX(-50%) !important;

  height: calc(100% - var(--ms-woman-bottom-cut) + (var(--ms-woman-top) * -1)) !important;
  width: auto !important;
  max-width: none !important;

  object-fit: contain !important;
  object-position: center top !important;
  display: block !important;

  pointer-events: none !important;
  user-select: none !important;

  /* fade odspodu do ztracena */
  -webkit-mask-image: linear-gradient(
    to bottom,
    rgba(0,0,0,1) 0%,
    rgba(0,0,0,.95) 55%,
    rgba(0,0,0,.55) 65%,
    rgba(0,0,0,0) 78%
  ) !important;

  mask-image: linear-gradient(
    to bottom,
    rgba(0,0,0,1) 0%,
    rgba(0,0,0,.95) 55%,
    rgba(0,0,0,.55) 65%,
    rgba(0,0,0,0) 78%
  ) !important;

  -webkit-mask-repeat: no-repeat !important;
  mask-repeat: no-repeat !important;
  -webkit-mask-size: 100% 100% !important;
  mask-size: 100% 100% !important;
}

/* CONTENT AREA – absolutně přes celou kartu, obsah dole */
.products .p .p-in,
.products-block .p .p-in{
  position: absolute !important;
  inset: 0 !important;
  z-index: 4 !important;
  padding: var(--ms-card-pad-t) var(--ms-card-pad-x) var(--ms-card-pad-b) !important;
  background: transparent !important;

  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-end !important; /* drž dole */
  gap: 0 !important;
}

/* Textový blok (title / price / subtitle) – NATVRDO DOLE NAD BUTTON */
.products .p .p-in .p-in-in,
.products-block .p .p-in .p-in-in{
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  text-align: center !important;

  margin-top: auto !important;
  padding-bottom: 15px !important;

  transform: translateY(0) !important;
  transition: transform .2s ease !important;
}

/* HOVER CELÉ KARTY → text se zvedne */
.products .p:hover .p-in .p-in-in,
.products-block .p:hover .p-in .p-in-in{
  transform: translateY(-40px) !important;
}




/* schovej původní name link */
.products .p a.name,
.products-block .p a.name{
  display: none !important;
}

/* TITLES (vloží JS) */
.products .p .ms-card-title,
.products-block .p .ms-card-title{
  display: block;
  color: #fff;
  font-weight: 900;
  font-size: 38px;
  line-height: 1.05;
  margin: 0 0 10px;
}

.products .p .ms-card-subtitle,
.products-block .p .ms-card-subtitle{
  display: block;
  color: rgba(255,255,255,.92);
  font-weight: 400;
  font-size: 14px;
  line-height: 1.35;
  margin: 0 0 14px;
  max-width: 340px;
}

/* PRICE – mezi title a subtitle (přehodí JS) */
/* cena nesmí zabírat layoutový prostor pro button */
.products .p .price.price-final,
.products-block .p .price.price-final{
  position: relative !important;
  z-index: 1 !important;
  margin-bottom: 0 !important;
}


.products .p .price.price-final strong,
.products-block .p .price.price-final strong{
  color: #fff !important;
  font-weight: 900 !important;
  font-size: 22px !important;
}

.products .p .price.price-final small,
.products-block .p .price.price-final small{
  color: rgba(255,255,255,.92) !important;
  font-weight: 900 !important;
  font-size: 14px !important;
  margin-right: 6px !important;
}

/* BOTTOM area (button) – drž úplně dole */
.products .p .p-bottom,
.products-block .p .p-bottom{
  background: transparent !important;
  border: 0 !important;
  margin-top: 12px !important;
}

/* BUTTON – default skrytý, ukáže se na hover celé karty */
/* button area – natvrdo dole přes celou šířku */
.products .p .p-tools,
.products-block .p .p-tools{
  position: absolute !important;
  left: var(--ms-card-pad-x);
  right: var(--ms-card-pad-x);
  bottom: var(--ms-card-pad-b);
  z-index: 5 !important;

  display: flex !important;
}


.products .p .p-tools a.btn,
.products-block .p .p-tools a.btn{
  width: 100% !important;
  max-width: none !important;              /* full width */
  height: 52px !important;
  border-radius: 5px !important;           /* radius 5px */
  border: 0 !important;
  background: rgba(28, 77, 35, .65) !important;
  color: #fff !important;
  font-weight: 900 !important;
  text-transform: none !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 18px !important;
  line-height: 1 !important;

  opacity: 0 !important;
  transform: translateY(14px) !important;
  pointer-events: none !important;

  transition: opacity .18s ease, transform .18s ease, background .18s ease;
}

.products .p:hover .p-tools a.btn,
.products-block .p:hover .p-tools a.btn{
  opacity: 1 !important;
  transform: translateY(0) !important;
  pointer-events: auto !important;
}

/* Svislý bg title vlevo */
.products .p .ms-card-bgtitle,
.products-block .p .ms-card-bgtitle{
  position: absolute;
  left: 18px;
  top: 10px;
  z-index: 1; /* nad Z-1, pod ženou i overlayem */
  pointer-events: none;
  opacity: .22;

  color: #fff;
  font-weight: 900;
  font-size: 64px;
  letter-spacing: .06em;
  line-height: 1;

  writing-mode: vertical-rl;
  transform: rotate(180deg);
}

/* ZRUŠ rating gap */
.products .p .ratings-wrapper,
.products-block .p .ratings-wrapper{
  display: none !important;
}

/* top-right ikonka v kartě */
.products .p .ms-card-icon,
.products-block .p .ms-card-icon{
  position: absolute;
  top: 16px;
  right: 16px;
  z-index: 6;              /* nad overlayem */
  width: 44px;
  height: 44px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  pointer-events: none;
}

.products .p .ms-card-icon img,
.products-block .p .ms-card-icon img{
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}


/* mobil typography */
@media (max-width: 600px){
  .products .p .ms-card-title,
  .products-block .p .ms-card-title{ font-size: 34px; }

  .products .p .ms-card-bgtitle,
  .products-block .p .ms-card-bgtitle{ font-size: 52px; }
}







/* =========================================================
   PAPAFOOD – BENEFITY (pod ms-hero)
   ========================================================= */

:root{
  --ms-benefits-max: 1180px;
  --ms-benefits-pad: clamp(18px, 3vw, 34px);

  --ms-benefits-title: clamp(28px, 4vw, 44px);

  --ms-benefits-green: #87B158;   /* hlavní zelená */
  --ms-benefits-pink:  #EA518E;   /* růžová (pro 4. ikonku) */

  --ms-benefits-text: #1f1f1f;
  --ms-benefits-muted: #666;

  --ms-benefits-card-gap: clamp(16px, 2.2vw, 34px);
  --ms-benefits-icon: 80px;
}

.ms-benefits{
  position: relative;
  background: #fff;
  padding: clamp(44px, 6vw, 90px) 0;
}

.ms-benefits__inner{
  width: min(var(--ms-benefits-max), calc(100% - (var(--ms-benefits-pad) * 2)));
  margin: 0 auto;
}

.ms-benefits__head{
  text-align: center;
  margin-bottom: clamp(22px, 3vw, 34px);
}

.ms-benefits__pill{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 8px 14px;
  font-size: 13px;
  font-weight: 700;
  background: #f2f2f2;
  color: #2b2b2b;
  margin-bottom: 12px;
}

.ms-benefits__title{
  margin: 0;
  font-size: var(--ms-benefits-title);
  line-height: 1.1;
  font-weight: 800;
  color: #355a1f;
}

.ms-benefits__grid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  gap: clamp(22px, 4vw, 30px);
}

.ms-benefits__left{
  position: relative;
}

.ms-benefits__img{
  width: 100%;
  height: auto;
  display: block;
  border-radius: 22px;
}

.ms-benefits__right{
  position: relative;
}

.ms-benefits__cards{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--ms-benefits-card-gap);
}

.ms-benefit-card{
  position: relative;
  text-align: center;
  padding: 6px 0;
}

.ms-benefit-card__icon{
  width: var(--ms-benefits-icon);
  height: var(--ms-benefits-icon);
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--ms-benefits-green);
  margin: 0 auto 30px;
}

.ms-benefit-card__icon img{
  width: 42px;
  height: 42px;
  display: block;
}

.ms-benefit-card__icon--pink{
  background: var(--ms-benefits-pink);
}

.ms-benefit-card__title{
  margin: 0 0 8px;
  font-size: 18px;
  line-height: 1.2;
  font-weight: 800;
  color: #111;
}

.ms-benefit-card__text{
  margin: 0;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.45;
  color: #444;
  max-width: 320px;
  margin-inline: auto;
}

/* =========================
   RESPONSIVE
   ========================= */
@media (max-width: 980px){
  .ms-benefits__grid{
    grid-template-columns: 1fr;
  }

  .ms-benefits__img{
    border-radius: 18px;
    display: none;
  }

  .ms-benefits__cards{
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 640px){
  .ms-benefits{
    padding: 44px 0;
  }

  .ms-benefits__cards{
    grid-template-columns: 1fr;
    gap: 22px;
  }

  .ms-benefit-card__icon{
    width: 62px;
    height: 62px;
     margin: 0 auto 15px;
  }

  
  .ms-benefit-card__icon img{
    width: 32px;
    height: 32px;
  }
}

/* =========================================================
   BENEFITY – ČÍSLO POD KARTOU (1–4)
   ========================================================= */

/* reset + inicializace čítače */
.ms-benefits__cards{
  counter-reset: benefit;
}

/* každá karta zvyšuje čítač */
.ms-benefit-card{
  counter-increment: benefit;
  position: relative;
  padding-bottom: 64px; /* místo pro číslo */
}

/* velké číslo – outline only */
.ms-benefit-card::after{
  content: counter(benefit);
  position: absolute;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%) translateY(-20%);

  font-size: clamp(90px, 14vw, 140px);
  font-weight: 900;
  line-height: 1;

  /* 👇 klíčová část */
  color: transparent;                 /* žádná výplň */
  -webkit-text-stroke: 2px rgba(0,0,0,.12); /* OKRAJ (změň 2–5px) */
  text-stroke: 2px rgba(0,0,0,.12);   /* fallback */

  pointer-events: none;
  user-select: none;
}

/* text nad číslem */
.ms-benefit-card__title,
.ms-benefit-card__text{
  position: relative;
  z-index: 1;
}

@media (max-width: 640px){
  .ms-benefit-card::after{
    transform: translateX(-50%) translateY(-50%);
    }
}



/* =========================================================
   MMWEBY / PAPAFOOD – MAP SECTION
   ========================================================= */

.ms-map{
  background: #87B158;
  padding: clamp(60px, 8vw, 120px) 0;
  position: relative;
}

.ms-map__inner{
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 24px;

  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  gap: clamp(40px, 6vw, 40px);
}

/* ================= LEFT ================= */

.ms-map__title{
  font-size: clamp(28px, 4vw, 40px);
  line-height: 1.15;
  font-weight: 900;
  margin: 0 0 24px;
  color: #ffffff;
}

.ms-map__title span{
  color: #476B2A;
}

.ms-map__text{
  font-size: 20px;
  color: white;
  margin: 0 0 32px;
}

/* BUTTON */
.ms-map__btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;

  padding: 14px 28px;
  border-radius: 6px;

  background: #EA518E;
  color: #ffffff;
  font-weight: 700;
  font-size: 14px;
  text-decoration: none;

  transition: transform .2s ease, box-shadow .2s ease;
}

.ms-map__btn:hover{
  transform: translateY(-2px);
  box-shadow: 0 12px 30px rgba(0,0,0,.18);
}

/* ================= RIGHT ================= */

.ms-map__image{
  position: relative;
}

.ms-map__image img{
  width: 100%;
  height: auto;
  display: block;
}

/* ================= RESPONSIVE ================= */

@media (max-width: 900px){
  .ms-map__inner{
    grid-template-columns: 1fr;
    text-align: center;
  }

  .ms-map__text{
    margin-left: auto;
    font-size: 16px;
    margin-right: auto;
  }
}


.ms-programs-head{
  margin: 80px auto 48px;
  text-align: center;
  max-width: 820px;
}

.ms-programs-head .ms-benefits__pill{
  margin-bottom: 14px;
}

.ms-programs-head .ms-benefits__text{
  font-size: 18px;
  line-height: 1.5;
  color: #222;
  max-width: 640px;
  margin: 20px auto;
}


/* =========================================================
   HP – CALCULATOR SECTION (pod .ms-programs-head)
   ========================================================= */

.ms-calculator{
  background: #fff;
  padding: 40px 0;
  position: relative;
}

.ms-calculator__inner{
  max-width: 1350px;
  margin: 0 auto;
  padding: 0 24px;

  display: grid;
  grid-template-columns: 450px 1fr;
  gap: 56px;
  align-items: center;
}

.ms-calculator__media{
  position: relative;
}

.ms-calculator__media img{
  width: 100%;
  height: auto;
  display: block;
  filter: drop-shadow(0 22px 50px rgba(0,0,0,.18));
}

.ms-calculator__title{
  margin: 0 0 14px;
  font-size: clamp(28px, 3.3vw, 40px);
  line-height: 1.05;
  font-weight: 900;
  color: #476B2A;
}

.ms-calculator__title-strong{
  color: #000;
}

.ms-calculator__text{
  margin: 0 0 22px;
  font-size: 18px;
  line-height: 1.55;
  color: #222;
}

.ms-calculator__btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 46px;
  padding: 0 18px;
  border-radius: 8px;
  background: #6FA641; /* zelené tlačítko jako na screenshotu */
  color: #fff !important;
  font-weight: 800;
  font-size: 14px;
  text-decoration: none !important;
  transition: transform .15s ease, opacity .15s ease;
}

.ms-calculator__btn:hover{
  opacity: .92;
  transform: translateY(-1px);
}

/* responsive */
@media (max-width: 980px){
  .ms-calculator__inner{
    grid-template-columns: 1fr;
    gap: 32px;
    text-align: center;
  }
  .ms-calculator__text{
    margin-left: auto;
    margin-right: auto;
  }
}


/* =========================================================
   MMWEBY / PAPAFOOD – CTA (pod ms-calculator)
   BG: HP/cta_bg
   ========================================================= */

.ms-cta{
  position: relative;
  width: 100%;
  overflow: visible;
  border-radius: 0;
  margin: 0;
  padding: clamp(44px, 10vw, 150px) 0;
  background: #000; /* fallback když se bg nenačte */
}

.ms-cta__bg{
  position: absolute;
  inset: 0;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  z-index: 0;
  transform: translateZ(0);
}

/* tmavý overlay kvůli čitelnosti textu */
.ms-cta__bg::after{
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    90deg,
    rgba(0,0,0,.12) 0%,
    rgba(0,0,0,.14) 45%,
    rgba(0,0,0,.15) 100%
  );
}

/* vnitřek */
.ms-cta__inner{
  position: relative;
  z-index: 1;
  max-width: 1180px;
  margin: 0 auto;
  padding: 0 22px;
  text-align: center;
  color: #fff;
}

/* nadpis */
.ms-cta__title{
  margin: 0 0 14px;
  font-weight: 900;
  line-height: 1.05;
  font-size: clamp(28px, 4vw, 46px);
  color: #fff;
  text-shadow: 0 10px 35px rgba(0,0,0,.35);
}

/* text */
.ms-cta__text{
  margin: 0 auto 22px;
  max-width: 820px;
  font-size: clamp(14px, 1.7vw, 18px);
  line-height: 1.55;
  color: rgba(255,255,255,.92);
  text-shadow: 0 10px 30px rgba(0,0,0,.25);
}

/* button */
.ms-cta__btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0 22px;
  border-radius: 6px;
  border: 0;
  background: #87B158;
  color: #fff !important;
  font-weight: 800;
  text-decoration: none !important;
  transition: transform .18s ease, filter .18s ease, background .18s ease;
  box-shadow: 0 18px 50px rgba(0,0,0,.25);
}

.ms-cta__btn:hover{
  transform: translateY(-1px);
  filter: brightness(1.03);
}

.ms-cta__btn:focus,
.ms-cta__btn:focus-visible,
.ms-cta__btn:active{
  outline: none !important;
  box-shadow: none !important;
}

/* mobil */
@media (max-width: 768px){
  .ms-cta{
    padding: 44px 0;
  }
  .ms-cta__inner{
    padding: 0 16px;
  }
  .ms-cta__bg::after{
    background: linear-gradient(
      180deg,
      rgba(0,0,0,.55) 0%,
      rgba(0,0,0,.35) 60%,
      rgba(0,0,0,.20) 100%
    );
  }
}

/* =========================================================
   MMWEBY / PAPAFOOD – CO DĚLÁME JINAK
   ========================================================= */

.ms-different{
  padding: clamp(60px, 6vw, 90px) 0;
  background: #fff;
  overflow: hidden;
  position: relative;
}

.ms-different__inner{
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 22px;

  display: grid;
  grid-template-columns: 1.1fr .9fr;
  align-items: center;
  gap: clamp(32px, 6vw, 80px);
}

.ms-different__media{
  position: relative;
}

.ms-different__media img{
  width: 100%;
  height: auto;
  display: block;
  max-width: 720px;
}

/* text */
.ms-different__content{
  max-width: 460px;
}

.ms-different__title{
  margin: 0 0 14px;
  font-size: clamp(28px, 4vw, 44px);
  font-weight: 900;
  line-height: 1.1;
  color: #000;
}

.ms-different__text{
  margin: 0 0 22px;
  font-size: clamp(14px, 1.6vw, 18px);
  line-height: 1.55;
  color: #444;
}

/* button */
.ms-different__btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 0 20px;
  border-radius: 6px;
  background: #87B158;
  color: #fff !important;
  font-weight: 800;
  text-decoration: none !important;
  transition: transform .18s ease, filter .18s ease;
}

.ms-different__btn:hover{
  transform: translateY(-1px);
  filter: brightness(1.05);
}

/* mobil */
@media (max-width: 900px){
  .ms-different__inner{
    grid-template-columns: 1fr;
    text-align: center;
  }

  .ms-different__content{
    margin: 0 auto;
  }

  .ms-different__media img{
    margin: 0 auto;
  }
}

/* =========================================================
   MS VOUCHER (HP) – poukaz sekce s přesahem obrázku dolů
   Assets:
   - HP/poukaz_bg.png (pozadí)
   - HP/poukaz.png (poukaz vpravo)
   ========================================================= */

.ms-voucher{
  position: relative;
  isolation: isolate;
  overflow: visible; /* důležité pro přesah dolů */
}

/* background */
.ms-voucher__bg{
  position: absolute;
  inset: 0;
  z-index: 0;
  background: url("https://693653.myshoptet.com/user/documents/upload/HP/poukaz_bg.png") center/cover no-repeat;
}

/* tmavý overlay pro čitelnost */
.ms-voucher__bg::after{
  content:"";
  position:absolute;
  inset:0;
  background: rgba(0,0,0,.28);
}

/* vnitřek */
.ms-voucher__inner{
  position: relative;
  z-index: 2;
  max-width: 1320px;
  margin: 0 auto;
  padding: 70px;
  min-height: clamp(320px, 30vw, 430px);

  display: grid;
  grid-template-columns: 1fr 1.75fr;
  align-items: center;
  gap: clamp(16px, 3vw, 32px);
}

.ms-voucher__content{
  max-width: 560px;
  color: #fff;
}

.ms-voucher__title{
  margin: 0 0 30px;
  font-size: clamp(34px, 3.2vw, 40px);
  line-height: 1.05;
  font-weight: 900;
  color: #fff;
}

.ms-voucher__text{
  margin: 0 0 22px;
  font-size: 18px;
  line-height: 1.5;
  color: rgba(255,255,255,.92);
  font-weight: 400;
}

.ms-voucher__btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 44px;
  padding: 0 18px;
  border-radius: 5px;
  background: #87B158;
  color: #fff;
  font-weight: 800;
  text-decoration: none;
  transition: transform .15s ease, opacity .15s ease;
}

.ms-voucher__btn:hover{
  opacity: .95;
  transform: translateY(-1px);
}

/* pravá strana – poukaz, přetéká dolů o 100px */
.ms-voucher__img{
  position: relative;
  height: 100%;
  min-height: 240px;
  overflow: visible;
}

.ms-voucher__img img{
  position: absolute;
  right: clamp(0px, 2vw, 12px);
  bottom: -70px;              /* ✅ přesah do další sekce */
  width: min(640px, 52vw);
  height: auto;
  max-width: none;
  pointer-events: none;
  user-select: none;
  filter: drop-shadow(0 26px 60px rgba(0,0,0,.35));
}

/* mobil */
/* mobil – jen úpravy dopasování */
@media (max-width: 820px){
  .ms-voucher__inner{
    grid-template-columns: 1fr;
    align-items: start;
    min-height: auto;

    /* nech 70px padding top/left/right jak chceš, ale mobilu dej menší */
    padding: 42px 20px 150px; /* spodní padding kvůli přesahu obrázku */
    gap: 34px;
  }

  .ms-voucher__content{
    max-width: 560px;
  }

  .ms-voucher__img{
    min-height: 220px;
  }

  .ms-voucher__img img{
    left: 50% !important;
    right: auto !important;
    transform: translateX(-50%) !important;

    width: min(520px, 92vw) !important; /* ať sedí hezky na mobilu */
    bottom: -150px !important;
  }
}

/* =================================================
   BLOG – CTA + hover odkazu
   ================================================= */

/* základ odkazu (celá karta) */
.news-item > a{
  color: inherit;
  text-decoration: none;
  transition: color .18s ease;
}

/* hover celé karty – text zezelená */
.news-item > a:hover{
  color: #476B2A;
}

/* tlačítko "Číst článek" */
.news-item .read-article{
  display: inline-flex;
  align-items: center;
  justify-content: center;

  margin-top: 14px;
  padding: 10px 16px;

  background: #87B158;
  border-color: #87B158;
  color: #fff;

  border-radius: 5px;
  font-weight: 700;
  line-height: 1;

  transition: background .18s ease, color .18s ease;
}

/* hover tlačítka */
.news-item > a:hover .read-article{
  background: #476B2A;
  color: #fff;
}

/* jistota – title a popis na hover */
.news-item > a:hover .title,
.news-item > a:hover .description{
  color: #476B2A;
  border-color: #476B2A;
}

/* =========================================
   INSTAGRAM WIDGET – CENTER + RESPONSIVE
   ========================================= */

#dklab_instagram_widget_heading{
  display: flex;
  justify-content: center;   /* ✅ celý blok doprostřed stránky */
  align-items: center;
  gap: 14px;
  text-align: center;
  margin: 0 auto;
  width: 100%;
}

/* text */
#dklab_instagram_widget_heading .text{
  font-size: clamp(20px, 3vw, 40px);
  font-weight: 800;
  line-height: 1.2;
  display: inline-flex;
  align-items: center;
}

/* logo */
#dklab_instagram_widget_heading .logo{
  width: clamp(32px, 4vw, 45px) !important;
  height: clamp(32px, 4vw, 45px) !important;
  font-size: clamp(32px, 4vw, 45px);
  line-height: 1;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  flex: 0 0 auto;
}

/* pojistka – pokud je logo přes ::before */
#dklab_instagram_widget_heading .logo::before{
  line-height: 1;
  display: block;
}

/* hover */
#dklab_instagram_widget_heading .text:hover{
  opacity: .85;
}

/* =========================================
   MOBIL – pod sebe (čistší layout)
   ========================================= */
@media (max-width: 640px){
  #dklab_instagram_widget_heading{
    flex-direction: column;
    gap: 10px;
  }
}

.dklab_instagram_widget_box{
    padding: 5px;
    overflow: hidden;
}

/* =========================================================
   MMWEBY / PAPAFOOD – NEWSLETTER SECTION REBUILD (CSS)
   Fix: grid jen pro email+button, reset Shoptet wrapperů
   ========================================================= */

.ms-newsletter{
  position: relative;
  overflow: hidden;
  background: #87B158;
  padding: clamp(48px, 6vw, 84px) 16px 0;
}

.ms-newsletter__bg{
  position: absolute;
  inset: 0;
  background: url("https://693653.myshoptet.com/user/documents/upload/HP/BG.svg") center/cover no-repeat;
  pointer-events: none;
}

.ms-newsletter__inner{
  position: relative;
  z-index: 2;
  max-width: 1180px;
  margin: 0 auto;
  text-align: center;
}

.ms-newsletter__title{
  margin: 0 0 10px;
  font-weight: 900;
  color: #fff;
  font-size: clamp(28px, 3.1vw, 44px);
  line-height: 1.1;
}

.ms-newsletter__subtitle{
  margin: 0 auto 22px;
  max-width: 720px;
  color: rgba(255,255,255,.92);
  font-size: 16px;
  line-height: 1.55;
}

/* FORM scope */
.ms-newsletter__form{
  margin: 0 !important;
}

/* ✅ GRID jen pro input+button */
.ms-newsletter__grid{
  display: grid !important;
  grid-template-columns: 1fr 160px;
  gap: 14px;
  max-width: 640px;
  margin: 0 auto;
  align-items: center;
  width: 100%;
}

.ms-newsletter__field{ min-width: 0; }
.ms-newsletter__submit{
  min-width: 0;
  display: flex;
  justify-content: flex-end;
}

/* ✅ Shoptet wrappery kolem inputu nesmí mít “divné” šířky/pozice */
.ms-newsletter__field .validator-msg-holder,
.ms-newsletter__field .js-validated-element-wrapper{
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  position: relative !important;
}

.ms-newsletter__field input[type="email"]{
  width: 100% !important;
  height: 46px !important;
  border-radius: 5px !important;
  border: 0 !important;
  padding: 0 16px !important;
  font-size: 14px !important;
  outline: none !important;
  box-shadow: none !important;
}

/* ✅ BUTTON hard reset */
.ms-newsletter__submit button[type="submit"]{
  position: static !important;
  inset: auto !important;
  float: none !important;
  margin: 0 !important;

  width: 100% !important;
  height: 46px !important;
  border-radius: 5px !important;
  border: 0 !important;
  background: #EA518E !important;
  color: #fff !important;
  font-weight: 800 !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  padding: 0 18px !important;
  box-shadow: none !important;
  outline: none !important;
}

/* zruš arrow pseudo prvky */
.ms-newsletter .btn-arrow-right::after,
.ms-newsletter .btn-arrow-right::before{
  content: none !important;
}

/* hover */
.ms-newsletter__submit button[type="submit"]:hover{
  filter: brightness(0.98);
  transform: translateY(-1px);
  transition: transform .12s ease, filter .12s ease;
  background: #EA518E !important;
}

/* consent pod gridem */
.ms-newsletter__consent{
  margin-top: 14px;
  font-size: 12px;
  color: rgba(255,255,255,.92);
}
.ms-newsletter__consent a{
  color: rgba(255,255,255,.98);
  text-decoration: underline;
}

/* spodní image */
.ms-newsletter__food{
  position: relative;
  z-index: 1;
  display: flex;
  justify-content: center;
  margin-top: clamp(16px, 3vw, 22px);
}
.ms-newsletter__food img{
  width: min(650px, 70vw);
  height: auto;
  transform: translateY(10px);
  filter: drop-shadow(0 18px 40px rgba(0,0,0,.28));
  pointer-events: none;
  user-select: none;
}

.form-group.consents label{
    font-size: 14px !important;
}

/* Mobil: button NAD inputem */
@media (max-width: 640px){
  .ms-newsletter__grid{
    grid-template-columns: 1fr;
  }
  .ms-newsletter__submit{ order: -1; justify-content: stretch; }
  .ms-newsletter__submit button[type="submit"]{ height: 52px !important; }
  .ms-newsletter__field input[type="email"]{ height: 52px !important; }
}


/* =========================================================
   PAPAFOOD – FOOTER (MATCH DESIGN v2) – CSS
   Pozadí: icon/footer1.svg footer2.svg footer3.svg
   ========================================================= */

#footer.msf-host{
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  border: 0 !important;
}

/* pokud by se něco z původního footeru propsalo */
#footer.msf-host .footer-rows,
#footer.msf-host .footer-bottom{
  display: none !important;
}

:root{
  --msf-bg: #0b0b0b;
  --msf-line: rgba(255,255,255,.10);
  --msf-text: rgba(255,255,255,.86);
  --msf-white: #fff;
  --msf-green: #87B158;

  --msf-container: 1240px;
  --msf-pad-x: 70px;

  /* paths k ikonám v pozadí */
  --msf-bg-1: url("https://693653.myshoptet.com/user/documents/upload/icon/footer1.svg");
  --msf-bg-2: url("https://693653.myshoptet.com/user/documents/upload/icon/footer2.svg");
  --msf-bg-3: url("https://693653.myshoptet.com/user/documents/upload/icon/footer3.svg");
}

/* WRAP */
#footer .msf{
  position: relative;
  background: var(--msf-bg);
  color: var(--msf-white);
  overflow: hidden;
}

/* BACKGROUND ICONS */
#footer .msf__bg{
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
}

#footer .msf__bgIcon{
  position: absolute;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  opacity: .35;               /* podle screenshotu */
  filter: grayscale(100%);    /* bílé linky */
  mix-blend-mode: screen;     /* jemnější na černé */
}

/* rozmístění podle screenshotu (můžeš doladit px) */
#footer .msf__bgIcon--1{
  left: 70px;
  top: 120px;
  width: 170px;
  height: 170px;
  background-image: var(--msf-bg-1);
  transform: rotate(-10deg);
}

#footer .msf__bgIcon--2{
  left: 38%;
  bottom: -30px;
  width: 300px;
  height: 230px;
  background-image: var(--msf-bg-2);
  transform: translateX(-50%) rotate(8deg);
  opacity: .28;
}

#footer .msf__bgIcon--3{
  right: 120px;
  top: -60px;
  width: 235px;
  height: 235px;
  background-image: var(--msf-bg-3);
  transform: rotate(10deg);
  opacity: .32;
}

/* INNER */
#footer .msf__inner{
  position: relative;
  z-index: 1;
  max-width: var(--msf-container);
  margin: 0 auto;
  padding: 38px var(--msf-pad-x) 28px;
}

/* TOP BAR */
#footer .msf__top{
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 18px;
  padding-bottom: 34px;
}

/* phone */
#footer .msf__phone{
  display: inline-flex;
  align-items: center;
  gap: 16px;
  text-decoration: none;
  color: var(--msf-white);
}

#footer .msf__phoneIco{
  width: 56px;
  height: 56px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--msf-green);
  color: #0b0b0b;
  flex: 0 0 auto;
}

#footer .msf__phoneSmall{
  display: block;
  font-size: 13px;
  color: var(--msf-text);
  line-height: 1.2;
  margin-bottom: 4px;
}

#footer .msf__phoneBig{
  display: block;
  font-size: 18px;
  font-weight: 900;
  letter-spacing: .01em;
  color: var(--msf-white);
}

/* logo center */
#footer .msf__brand{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
}

#footer .msf__logo{
  height: 80px;
  width: auto;
  display: block;
  filter: drop-shadow(0 10px 24px rgba(0,0,0,.35));
}

/* right text */
#footer .msf__topRight{
  text-align: right;
  font-size: 18px;
  color: var(--msf-text);
  white-space: nowrap;
}

/* divider */
#footer .msf__divider{
  height: 1px;
  background: var(--msf-line);
  width: 100%;
}

/* COLUMNS */
#footer .msf__cols{
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  gap: 56px;
  padding: 46px 0 38px;
}

#footer .msf__h{
  font-size: 18px;
  font-weight: 900;
  margin-bottom: 18px;
  color: var(--msf-white);
}

/* list */
#footer .msf__list{
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 12px;
}

#footer .msf__list a{
  color: var(--msf-text);
  text-decoration: none;
  font-size: 14px;
  font-weight: 600;
  transition: color .15s ease;
}

#footer .msf__list a:hover{
  color: var(--msf-green);
}

/* CONTACT column */
#footer .msf__contact{
  display: grid;
  gap: 14px;
  padding-top: 6px;
}

#footer .msf__contact a{
  color: var(--msf-text);
  text-decoration: none;
  font-size: 14px;
  font-weight: 600;
}

#footer .msf__contact a:hover{
  color: var(--msf-green);
}

/* SOCIAL */
#footer .msf__social{
  display: flex;
  gap: 16px;
  align-items: center;
  padding-top: 8px;
}

#footer .msf__soc{
  width: 60px;
  height: 60px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.12);
  color: var(--msf-white);
  transition: transform .12s ease, background .12s ease, border-color .12s ease, color .12s ease;
}

#footer .msf__soc svg{
  width: 26px;   /* bylo 18px */
  height: 26px;
  color: #fff;   /* jistota */
}

#footer .msf__soc:hover{
  transform: translateY(-1px);
  background: var(--msf-green);
  border-color: var(--msf-green);
  color: #fff;
}

#footer .msf__soc:hover svg{
  color: #fff !important;
  fill: currentColor;
}

/* BOTTOM */
#footer .msf__bottom{
  border-top: 1px solid var(--msf-line);
  padding: 22px 0 14px;
  text-align: center;
}


#footer .msf__copyright{
  font-size: 13px;
  color: rgba(255,255,255,.72);
  font-weight: 600;
  margin-bottom: 8px;
}

#footer .msf__made{
  display: flex;
  align-items: center;       /* vertikální centrování */
  justify-content: center;   /* horizontálně na střed */
  gap: 8px;
  font-size: 12px;
  color: rgba(255,255,255,.62);
  font-weight: 600;
}


#footer .msf__made a{
  color: rgba(255,255,255,.84);
  text-decoration: none;
  font-weight: 900;
}

#footer .msf__made a:hover{
  color: var(--msf-green);
}

/* marketsoul logo místo textu */
#footer .msf__marketsoul{
  display: inline-flex;
  align-items: center;
  line-height: 0; /* odstraní baseline offset */
}

#footer .msf__marketsoul img{
  height: 20px;     /* uprav dle potřeby */
  width: auto;
  display: block;
  opacity: .9;
  transition: opacity .15s ease;
}

#footer .msf__marketsoul:hover img{
  opacity: 1;
}


#footer .msf__dot{
  margin: 0 10px;
  opacity: .7;
}

/* RESPONSIVE */
@media (max-width: 1100px){
  :root{ --msf-pad-x: 34px; }

  #footer .msf__top{
    grid-template-columns: 1fr;
    gap: 16px;
    text-align: center;
  }

  #footer .msf__topRight{
    text-align: center;
    white-space: normal;
  }

  #footer .msf__cols{
    grid-template-columns: 1fr 1fr;
    gap: 34px;
  }

  /* pozadí ať nepřekáží */
  #footer .msf__bgIcon--2{
    left: 50%;
  }
}

@media (max-width: 640px){
  :root{ --msf-pad-x: 20px; }

  #footer .msf__cols{
    grid-template-columns: 1fr;
    gap: 28px;
  }

  #footer .msf__phone{
    justify-content: center;
  }

  #footer .msf__logo{
    height: 38px;
  }

  /* zmenšit pozadí na mobilu */
  #footer .msf__bgIcon--1,
  #footer .msf__bgIcon--3{
    width: 300px;
    height: 300px;
    opacity: .22;
  }

  #footer .msf__bgIcon--2{
    width: 420px;
    height: 420px;
    opacity: .18;
  }
}


#carousel {
  display: none;
}

.benefitBanner {
  display: none;
}

.banner-custom--map {
  display: none;
}


/* Pod 450px – 1 produkt */
@media (max-width: 450px) {
  .products-block > div {
    flex: 0 0 auto;
    width: 100% !important;
  }
}




















/* =========================================================
   MOBILE: vypnout scroll efekt headeru
   (transparent pořád + žádný blur)
   ========================================================= */
@media (max-width: 767px){

  #header{
    transition: none !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }

  #header {
        height: 72px;
        margin: 0;
    }

  /* HOMEPAGE: vždy transparent */
  body.is-homepage #header,
  body.is-homepage #header.scrolling,
  body.is-homepage.scrolling #header,
  #header.is-scrolled,
  #header.scrolling,
  body.scrolling #header,
  body.is-homepage #header.is-scrolled .navigation-wrapper,
  body.is-homepage #header.scrolling .navigation-wrapper,
  body.is-homepage.scrolling #header .navigation-wrapper{
    background: transparent !important;
    background-image: none !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }

  /* NON-HOMEPAGE: drž pořád zelenou (bez efektu) */
  body.is-not-homepage #header,
  body.is-not-homepage #header.scrolling,
  body.is-not-homepage.scrolling #header,
  body.is-not-homepage #header .navigation-wrapper,
  body.is-not-homepage #header.scrolling .navigation-wrapper,
  body.is-not-homepage.scrolling #header .navigation-wrapper{
    background: #4A6F2C !important;
    background-image: none !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }
}


/* =========================================================
   HEADER – MINIMAL MODE, když #header má .is-scrolled
   (schovej search + menu + akce, nech logo + cart + hamburger)
   ========================================================= */

/* schovej bloky */
#header.is-scrolled .search,
#header.is-scrolled #navigation,
#header.is-scrolled .menu-helper,
#header.is-scrolled .navigationActions,
#header.is-scrolled .top-navigation-bar-menu-helper{
  display: none !important;
}

/* schovej konkrétně search+login tlačítka (ty tvoje) */
#header.is-scrolled .navigation-buttons .ms-search-btn,
#header.is-scrolled .navigation-buttons .ms-login-btn{
  display: none !important;
}

/* nech cart + hamburger viditelné */
#header.is-scrolled .navigation-buttons a.cart-count,
#header.is-scrolled .navigation-buttons a[data-testid="hamburgerMenu"][data-target="navigation"]{
  display: inline-flex !important;
}

/* layout: logo vlevo, tlačítka vpravo */
#header.is-scrolled .header-top{
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}

/* zruš divné “wrap” chování z mobilních pravidel */
#header.is-scrolled .navigation-buttons{
  flex-wrap: nowrap !important;
  justify-content: flex-end !important;
  gap: 12px !important;
}

/* pojistka: neházej košík na nový řádek (ty máš flex-basis:100% v mobile) */
#header.is-scrolled .navigation-buttons a.cart-count[data-testid="headerCart"]{
  flex-basis: auto !important;
  margin-top: 0 !important;
  margin-left: 0 !important;
  right: auto !important;
  top: auto !important;
  position: relative !important;
}

/* volitelně: zmenši výšku headeru v scrolled stavu */
#header.is-scrolled{
  padding-top: 6px !important;
  padding-bottom: 6px !important;
}
#header.is-scrolled .site-name img{
  max-height: 40px !important; /* uprav dle potřeby */
  width: auto !important;
}