:root {
    /* Brand palette */
    --color-cold-foam:   #F4F2E4;
    --color-hide:        #DED2B6;
    --color-soft-dune:   #AEA08B;
    --color-sage:        #847C63;
    --color-aged-walnut: #432720;
    --color-ash-brown:   #241F14;

    /* Semantic aliases */
    --colors-surface-primary:   var(--color-cold-foam);
    --colors-surface-secondary: var(--color-hide);
    --colors-accent:            var(--color-soft-dune);
    --colors-text:              var(--color-ash-brown);
    --colors-text-muted:        var(--color-sage);

    --template-font: 'InterFace', sans-serif;
    --template-headings-font: 'Beaufort', serif;
}

ol.cart-header li.completed a, ol.cart-header li.completed strong {
    color: var(--color-soft-dune)
}
ol.cart-header li a, ol.cart-header li strong {
    color: var(--color-hide);
    font-family: var(--template-headings-font);
}
.ordering-process .co-box {
    background: var(--color-hide);
}
:where(.ums_forms_redesign--off) .form-control, :where(.ums_forms_redesign--off) select {
    background: var(--colors-surface-primary);
}
.form-group [type="checkbox"] + label, .form-group [type="hidden"] + label, .form-group [type="radio"] + label {
    font-weight: 400;
}
.co-billing-address #note, .co-billing-address .form-group, .co-box-additional #note, .co-box-additional .form-group,
.co-contact-information #note, .co-contact-information .form-group, .co-shipping-address #note,
.co-shipping-address .form-group { margin-bottom: 12px; }
.order-button-text { font-size: 28px; letter-spacing: 1px; }
.order-button-suffix { margin-top: 0; opacity: 0.6; }
.next-step .btn.btn-lg { padding: 10px 32px; }

.entrance-protection-inner .site-name::after {
  content: "Otevíráme novou kapitolu. Již brzy.";
  display: block;
  font-size: 20px;
  font-family: 'Beaufort', serif;
  margin: 0;
  margin-top: 3em
 }
#verifyPageForm { display: none; }
@media (min-width: 768px) {
    .entrance-protection .form-group>input, .entrance-protection .site-name {
        max-width: 100%;
    }
}
.entrance-protection {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
}
.entrance-protection .site-name {
   padding: 0;
}
.entrance-protection-inner { background: transparent; }


body { color: var(--colors-text); }

/* Footer — compensate for scrollbar so left and right gaps match */
#footer .row.custom-footer { padding-left: 20px; }
#footer { font-size: 14px; line-height: 1.4; }

/* Top site message (.site-msg.information) — Beaufort, prominent but not bold */
.site-msg.information,
.site-msg--information,
.site-msg.information *,
.site-msg--information * {
    font-family: var(--template-headings-font);
    font-weight: 400;
    letter-spacing: 0.04em;
}
.price-wrapper .price.price-primary {
    font-family: var(--template-headings-font);
    font-weight: 400;
}
.site-msg.information,
.site-msg--information {
    font-size: clamp(15px, 1.2vw, 18px);
    padding: 12px 16px;
    text-align: center;
}

#header, .top-navigation-bar { background: var(--colors-surface-primary); }
@media (min-width: 768px) {
    .navigation-in {
        background-color: var(--color-hide);
    }
}
.subcategories li a:focus-visible, .subcategories li a:hover {
   background-color: var(--color-hide);
}
.top-nav-button-login, .top-nav-button-login:focus-visible, .top-nav-button-login:hover,
.navigation-buttons a[data-target=navigation], .navigation-buttons a[data-target=navigation]:hover,
.navigation-buttons a[data-target=search], .navigation-buttons a[data-target=search]:hover,
.navigation-window-visible .navigation-buttons a[data-target=navigation], .navigation-window-visible .navigation-buttons a[data-target=navigation]:hover {
 background: var(--colors-surface-primary); 
}

/* Menu bar (navigation categories) — Interface Regular per brand spec */
.navigation-in { font-family: var(--template-font); }
.navigation-in>ul>li>a {
    font-size: 17px;
    font-weight: 400;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}
.navigation-in ul.menu-level-2 li a { text-transform: none; letter-spacing: 0.02em; }

/* Megamenu column headings — Beaufort, regular weight */
.navigation-in>ul>li.ext>ul>li>div>a {
    font-family: var(--template-headings-font);
    font-weight: 400;
    text-transform: none;
    letter-spacing: 0.02em;
    font-size: 20px;
    color: var(--color-ash-brown);
}

/* Megamenu & top-level hover share white surface; hovered item reads as a tab */
.navigation-in ul.menu-level-2,
.navigation-in .dropdown-menu,
html .dropdown-menu {
    background: #fff;
    border: 0;
    box-shadow: none;
}
.navigation-in > ul > li:hover > a,
.navigation-in > ul > li.open > a,
.navigation-in > ul > li.active > a,
.navigation-in > ul > li:focus-within > a,
.navigation-in > ul > li > a.active {
    background: var(--color-cold-foam);
    color: var(--colors-text);
}
.navigation-in ul.menu-level-2, .navigation-in .dropdown-menu, html .dropdown-menu {
    background-color: var(--color-cold-foam);
}
.navigation-in .has-third-level div>ul a, .navigation-in>ul>li>a, .navigation-in>ul>li>a:hover {
    color: var(--colors-text);
}
/* Only items with a megamenu lose their bottom radius — so they merge with the panel */
.navigation-in > ul > li.ext > a,
.navigation-in > ul > li > a { border-radius: 0; }

/* Top nav (Domů, O nás) — Interface Light uppercase per brand spec */
.top-navigation-bar, .top-nav, .top-nav a {
    font-family: var(--template-font);
    font-weight: 300;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    font-size: 13px;
}

.h4, h4,
:where(body.ums_page_element_headings--on) :where(.footer) .pageElement__heading {
    font-family: var(--template-headings-font);
    font-weight: 400;
    font-size: 24px;
    letter-spacing: 0.02em;
}

/* Emphasised labels inside the drawer (brand names) keep Beaufort */
.benefitBanner { align-items: start; }
.benefitBanner .benefitBanner__title,
.navigation-in ul li a b { font-family: var(--template-headings-font); }
.benefitBanner__data { color: inherit; }
.benefitBanner .benefitBanner__title {
    font-weight: 400;
    font-size: clamp(24px, 2.2vw, 28px);
    letter-spacing: 0.02em;
    line-height: 1.15;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    text-align: center;
    margin-bottom: 16px;
}

@media (min-width: 480px) {
    .benefitBanner {
        gap: clamp(32px, 4vw, 64px);
        padding-left: clamp(24px, 6vw, 80px);
        padding-right: clamp(24px, 6vw, 80px);
        max-width: 100%;
        margin-left: auto;
        margin-right: auto;
    }
}
.benefitBanner .benefitBanner__text,
.benefitBanner .benefitBanner__description,
.benefitBanner__content > p {
    max-width: 28ch;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

/* Category header — big elegant brand heading (PDF p.11) */
.category-header {
    background: transparent;
    text-align: center;
    padding: 40px 20px 30px;
    border: 0;
    justify-content: center;;
}
.category-header h1, #category-header h1 {
    font-family: var(--template-headings-font);
    font-weight: 400;
    font-size: clamp(40px, 6vw, 72px);
    letter-spacing: 0.04em;
    margin: 0;
    line-height: 1.05;
}
#category-header { padding-left: 0; }

.subcategories li a { color: var(--color-aged-walnut); }
.subcategories li a:hover { color: var(--color-ash-brown); }

/* List sorting — pill buttons, clear active state */
.listSorting__control {
    color: var(--color-sage);
    background: transparent;
    border: 1px solid transparent;
    border-radius: 999px;
    padding: 6px 16px;
    transition: color .2s ease, background-color .2s ease, border-color .2s ease;
}
.listSorting__control:hover,
.listSorting__control:focus-visible {
    color: var(--color-ash-brown);
    background: var(--colors-surface-primary);
    border-color: transparent;
}
.listSorting__control--current,
.listSorting__control--current:focus-visible,
.listSorting__control--current:hover {
    color: var(--color-ash-brown);
    background: var(--color-hide);
    border-color: var(--colors-accent);
    font-weight: 500;
}

.benefitBanner .benefitBanner__picture,
.benefitBanner .benefitBanner__picture img { width: 100%; }

.type-page.one-column-body #content { max-width: 62em; position: relative; margin-left: auto; margin-right: auto; }

.p-short-description p { margin-bottom: 5px; }

@media (min-width: 768px) {
   #header .header-top .header-top-wrapper {
      padding-top: 10px;
      padding-bottom: 6px;
   }
    #header .header-top .header-top-wrapper .site-name, #header .header-top .header-top-wrapper h1.site-name {
        width: 198px;
        margin-left: -15px;
        margin-right: 15px;
    }
   .benefitBanner .benefitBanner__data {
      line-height: 1.3; 
   }
}

#content .link-like, #content a { text-decoration: underline; }
.brand-wrapper a,
.shp-tabs-holder a, #content .shp-tab a,
#content a.btn, #content a.name,
#content .brand-wrapper a,
#content .subcategories a,
#content .link-icons .link-icon,
#content .main-link,
#content ol.cart-header li a { text-decoration: none; }

.cart-table .main-link,
.cart-table tr td.p-name a,
:where(body.ums_homepage_cart_checkout_headings--on) #checkoutSidebar .cart-content h2 { 
    font-size: 20px;
    font-weight: 400;
    color: var(--color-aged-walnut);
}
:where(body.ums_homepage_cart_checkout_headings--on) .checkout-box-wrapper h2, :where(body.ums_homepage_cart_checkout_headings--on) .order-summary-inner h2, :where(body.ums_homepage_cart_checkout_headings--on) .summary-wrapper h2 {
    font-size: 20px;
}
.continue-shopping { font-weight: 400; }
.extras-wrapper .discount-coupon input { background: transparent; }
.btn.btn-primary, a.btn.btn-primary { background: transparent; }

/* Homepage section titles (e.g. "OBJEVTE NAŠE BESTSELLERY") */
.homepage-group-title.h4 {
    font-family: var(--template-headings-font);
    text-transform: uppercase;
    font-weight: 400;
    font-size: clamp(22px, 2.4vw, 30px);
    letter-spacing: 0.14em;
    text-align: center;
    margin: 0;
    color: var(--color-aged-walnut);
}
.h1, h1,
.h2, h2,
.h3, h3,
.h4, h4,
.products-block > div .p .p-in .p-in-in .name,
#content .p-detail-inner h1,
.for-free {
   color: var(--color-aged-walnut);
}

.order-summary-item.helper > div:last-child { font-family: var(--template-headings-font); }

.shipping-billing-table .radio-wrapper input[type="radio"] + label {
  padding-bottom: 10px;
  padding-top: 10px;
}
.shipping-billing-table .radio-wrapper input[type="radio"] + label::before {
  top: calc(.77em + 2px);
}
.shipping-billing-table .radio-wrapper input[type="radio"] + label::after {
  top: calc(.77em + 6px);
}
.shipping-billing-table .radio-wrapper:hover { 
    background-color: var(--color-hide);
}

.link-icon.print,
#p-detail-tabs li:nth-child(2),
#signature a, body.in-kosik .cart-table + .delivery-time { display: none; }
.footer-bottom #signature::after { content: "Běží na systému Shoptet"; }

@media (min-width: 768px) {
    .p-detail-inner h1 {
        font-size: 42px;
        letter-spacing: 0;
        font-weight: 300;
        line-height: 1;
        color: var(--color-primary);
    }
}

body { overflow-x: hidden; }

.benefitBanner .benefitBanner__title, .navigation-in ul li a b, .menu-level-1 { color: var(--color-aged-walnut); }

.p-detail-inner .p-price-wrapper .price-final { font-weight: 400; color: inherit; }
@media (min-width: 768px) {
  .p-detail-inner .p-price-wrapper .price-final {
    font-size: 38px;
    line-height: 1;
  }
}

/* Product card hover — subtle lift, no partial background changes */
.products-block .product,
.products-block .product .p-in,
.products-block .product .name,
.products-block .product .name a {
    transition: transform .35s ease, box-shadow .35s ease, color .2s ease;
}
.products-block .product:hover {
    transform: translateY(-3px);
}
.products-block .product:hover .p-in {
    box-shadow: 0 10px 28px -16px rgba(36, 31, 20, 0.28);
}
.products-block .product:hover .name,
.products-block .product:hover .name a {
    color: var(--color-aged-walnut);
}

/* Product listing names — Beaufort, dark */
.products-block .product .name,
.products-block .product .name a,
.products-block .product h2,
.products-block .product h2 a,
.product-list .name,
.product-list .name a,
.p-name,
.p-name a,
.product .p .p-in .name,
.product .p .p-in .name a {
    font-family: var(--template-headings-font);
    font-weight: 400;
    color: var(--colors-text);
}

/* Product listing prices — match the detail page style (Beaufort, dark) */
.products-block .price,
.products-block .product .price,
.products-block .product .price-final,
.product-list .price,
.product-list .price-final,
.price-final,
.p-final-price,
.products-block>div .p .p-in .p-bottom>div .prices .price-final strong {
    font-family: var(--template-headings-font);
    font-weight: 400;
    color: var(--colors-text);
}

.products-block>div .p .p-in .p-in-in .name {
   letter-spacing: 0;
   font-size: 19px;
   font-weight: 400;
   height: auto;
}
.products-block>div .p .availability {
   text-transform: uppercase;
   font-size: 13px;
}


@media (min-width: 768px) {
    .navigation-in>ul>li.ext>ul>li>div>ul {
        font-size: 15px;
    }
}

.navigation-in>ul>li.ext>ul>li>div>ul>li>a {
   letter-spacing: 1px;
}

/* Footer links — darker */
#footer a,
.footer a,
#footer .pageElement a {
    color: var(--color-ash-brown);
}
#footer a:hover,
.footer a:hover {
    color: var(--color-aged-walnut);
    text-decoration: underline;
    text-underline-offset: 4px;
}
.footer .banner-wrapper h4 {
   margin-bottom: 16px;
}
.footer .banner-wrapper h4 {
    line-height: 1.4;
}
.footer .banner-wrapper h4::after {
    background-color: #fff;
    border: 2px solid #fff;
    border-radius: 8px;
    content: "";
    display: block;
    margin: 12px 0 16px;
    width: 40px;
}


body.id-908 .category-title,
body.id-923 .category-title,
body.id-917 .category-title,
body.id-920 .category-title,
body.in-znacka .category-title,
body.type-product .benefitBanner__data,
#nav-manufacturers {
   display: none;
}

.category-header { padding: 0; }

.breadcrumbs { padding: 20px 16px 12px 16px; text-align: center; font-weight: 400; }
.type-product .breadcrumbs { text-align: left; }

/* Product detail description/parameters block — lighter than footer, clearly separate */
.p-detail-full-width {
    background: var(--color-cold-foam);
    padding: 48px 0 64px;
    margin-bottom: 40px;
}

.shp-tabs, .shp-tabs-holder {
   background-color: transparent;
}

.full-width.benefit-banners-full-width {
   background: rgba(255,255,255,0.5);
   padding-bottom: clamp(32px, 4vw, 32px);
}

/* Welcome claim — Beaufort italic, not bold */
.welcome { display: flex; flex-direction: column; }
.welcome .h1,
.welcome h1 {
    font-family: var(--template-headings-font);
    font-weight: 400;
    font-style: italic;
    text-align: center;
    order: 2;
    font-size: clamp(28px, 3.6vw, 38px);
    line-height: 1.25;
    letter-spacing: 0.01em;
    color: var(--color-aged-walnut);
    background: var(--color-hide);
    padding: clamp(28px, 4vw, 56px) 20px;
    width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    margin-top: clamp(22px, 3.5vw, 22px);
    margin-bottom: clamp(20px, 2.5vw, 16px);
}
.welcome .hp-signpost { order: 1; }

.manufacturerDetail { text-align: center; }

/* Homepage — welcome claim first inside #content */
body.type-index #content { display: flex; flex-direction: column; }
body.type-index #content .welcome-wrapper { order: -1; }
body.type-index #content .benefit-banners-full-width { order: 99; }

@media (min-width: 768px) {
    .welcome-wrapper {
        padding: 20px 0 0 0;
    }
}

/* Homepage signpost — 4 tile grid */
.hp-signpost {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: clamp(8px, 1.2vw, 16px);
    margin: 32px auto;
    padding: 0 47px;
}
.hp-signpost__tile {
    display: block;
    overflow: hidden;
    aspect-ratio: 3 / 4;
}
.hp-signpost__tile img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .5s ease;
}
.hp-signpost__tile:hover img { transform: scale(1.03); }
@media (max-width: 767px) {
    .hp-signpost { grid-template-columns: repeat(2, 1fr); }
}

@media (min-width: 768px) {
    .footer-rows .custom-footer {
        padding-bottom: 72px;
    }
} 

@supports (width:100svw) {
    @media (min-width: 768px) {
        .full-width {
            width: 100svw;
        }
    }
}

@media (min-width: 768px) {
    .container {
        width: 100%;
    }
}

@media (max-width: 768px) {
    .navigation-in>ul>li>a {
        font-size: 16px;
    }
   #header .header-top .header-top-wrapper .site-name, #header .header-top .header-top-wrapper h1.site-name {
      padding-bottom: 3px;
      padding-top: 8px;
   }
   #header .header-top .header-top-wrapper .site-name a {
      min-width: 120px;
   }
   .hp-signpost {
      padding: 0 8px;
      margin-top: 0;
      margin-bottom: 0;
   }
}

.close.js-close-information-msg,
.subcategories + .products-top-wrapper,
.category-top .products-top-wrapper { display: none !important; }

.product-slider-holder .product-slider-navigation {
   margin-top: -50px;
}
.footer-bottom { font-weight: 400; }

/* show all megamenu items on desktop — avoid "there are more items" state */
@media (min-width: 768px) {
  .navigation-in > ul > li.ext > ul > li > div > ul {
    max-height: 999px;
  }
  .navigation-in > ul > li.ext > ul > li > div > ul > li {
    padding: 3px 0;
  }
  .navigation-in > ul > li > ul > li {
    padding: 10px;
  }
}
@media (min-width: 768px) and (min-width: 768px) {
  .navigation-in > ul > li.ext > ul > li > div > ul.has-more-items li {
    display: block;
  }
}
.category-perex.empty-content,
.category-content-wrapper { padding-bottom: 50px; }
.products-block { justify-content: center; }
.category-perex, .category__secondDescription { margin-top: 16px; }

@media (max-width: 767px) { 
   #navigation {
    top: 110px;
   }
    .navigation-in .exp {
        background-color: var(--colors-surface-primary);
    }
    .product-slider-holder .product-slider-navigation {
        top: 100%;
    }
}

.popup-widget.search-widget form .search-form-input-group .search-input { outline: 0; }
.filters-wrapper .filters-unveil-button-wrapper .unveil-button {
   padding: 10px 32px 10px 16px;
   font-weight: 400;
}