/* ================================================================
   PART 01 — Proměnné, základ, produkty
   ================================================================ */

/* -------------------- PROMĚNNÉ -------------------- */
:root {
  --green:            #43B047;
  --green-d:          #388E3C;
  --text:             #111;
  --muted:            #555;
  --line:             #e0e0e0;
  --bg:               #f5f5f5;
  --bg-cream:         #ffffff;
  --coffee-brown:     var(--green-d);
  --coffee-light:     #eaf7ea;
  --focus-ring:       0 0 0 3px rgba(67,176,71,.22);
  --headerH:          64px;
  --headerHcompact:   48px;
  --headerH-current:  var(--headerH);
  --promo-h:          28px;

  /* Cart drawer */
  --cart-width:           440px;
  --cart-radius:          16px;
  --cart-z-overlay:       1500;
  --cart-z-panel:         1510;
  --h-cart-banner:        72px;
  --h-cookie:             72px;
  --cart-bottom-offset:   0px;

  /* Slider */
  --slider-h-desktop: clamp(280px, 35vw, 520px);
  --slider-h-mobile:  240px;
  --slider-radius:    20px;
  --slider-gap:       12px;

  /* Bannery */
  --banner-green-bg:      #eaf8ed;
  --banner-green-border:  #c7ecd1;
  --banner-green-accent:  #2e7d32;
  --tile-shadow:          0 1px 2px rgba(0,0,0,.04), 0 8px 24px rgba(0,0,0,.06);
  --banner-yellow-bg:     #fff8dc;
  --banner-yellow-border: #f3e6a9;
  --banner-yellow-accent: #9a7b00;
  --help-purple-bg:       #FEE8DF;
  --help-purple-border:   #E8B8A0;
  --help-purple-accent:   #C05530;
}

body.header-compact { --headerH-current: var(--headerHcompact); }

/* -------------------- RESET / ZÁKLAD -------------------- */
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
  font-family: 'Inter', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  background: var(--bg-cream);
  color: var(--text);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

[hidden] { display: none !important; }
.mega[aria-hidden="true"] { display: none; }

.container { max-width: 1100px; margin: 0 auto; padding: 0 1rem; }
.section   { padding: 2rem; display: block; }
.section.hidden { display: none; }

@media (max-width: 768px) {
  main.section { padding-left: 0; padding-right: 0; padding-top: 0.4rem; }
}

header:not(.seo-infobox) { padding: 2rem 0 0; text-align: center; }
header.seo-infobox { text-align: left; }
.intro { max-width: 600px; margin: 0 auto 2rem; font-size: 1.2rem; }

/* -------------------- IKONY NAVIGACE (DOMOVSKÁ) -------------------- */
.nav-icons {
  display: flex; justify-content: center; gap: 2rem;
  margin-bottom: 2rem; flex-wrap: wrap;
}
.nav-icon {
  text-align: center; cursor: pointer;
  transition: transform .3s ease, background-color .3s ease;
  padding: 1rem; border-radius: 1.05rem;
}
.nav-icon span  { display: block; margin-top: .5rem; }
.nav-icon img   { transition: transform .3s ease; }
.nav-icon:hover { background-color: rgba(255,200,200,.3); transform: scale(1.05); }
.nav-icon:hover img { transform: scale(1.1); }

/* -------------------- SEKČNÍ BARVY -------------------- */
#automat       { background-color: rgba(190,235,200,.15); }
#paka          { background-color: rgba(200,220,255,.15); }
#filtr         { background-color: rgba(255,245,200,.15); }
#prislusenstvi { background-color: rgba(245,210,255,.15); }
#kapsle        { background-color: rgba(255,220,190,.15); }

/* -------------------- PRODUKTY -------------------- */
.products {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(229px, 1fr));
  gap: 2rem;
}
.product {
  border: 1px solid #eee; background: #fff;
  padding: 1rem; border-radius: 8px; text-align: center; cursor: pointer;
  transition: box-shadow .15s ease, transform .05s ease;
}
.product:hover { box-shadow: 0 4px 12px rgba(0,0,0,.06); transform: translateY(-1px); }
.product img   { max-width: 100%; height: auto; border-radius: 4px; }

.product-name  { font-weight: 600; margin: .5rem 0; }
.product-description {
  font-size: .9rem; color: #555; margin-top: .5em; line-height: 1.5;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.product-price { color: #111; font-weight: 700; margin: .75rem 0 .25rem; font-size: 1.05rem; }
.product-stock { font-size: .85rem; font-weight: 600; margin-bottom: .5rem; }
.in-stock      { color: var(--green); font-weight: 600; }
.out-of-stock  { color: #d32f2f; font-weight: 700; }
.out-of-stock-visual { opacity: .6; }

.add-to-cart {
  background: linear-gradient(145deg, var(--green), var(--green-d));
  color: #fff; border: 0; padding: .5rem 1.2rem; border-radius: 6px; cursor: pointer;
  font-weight: 600; font-size: 1rem;
  box-shadow: 0 4px 10px rgba(0,0,0,.1);
  transition: background .3s ease, transform .1s ease, filter .1s ease;
}
.add-to-cart:hover    { background: linear-gradient(145deg, var(--green-d), #2e7031); transform: scale(1.03); }
.add-to-cart:disabled { background: #e0e0e0; color: #777; cursor: not-allowed; opacity: .7; border: 1px solid #ccc; }

/* Obrázek na kartě */
.product .product-image-wrapper {
  position: relative;
  width: 100%; height: 220px;
  overflow: hidden; background: #fff; border-radius: 6px;
  display: flex; align-items: center; justify-content: center;
}
.product .product-image-wrapper img {
  width: 100%; height: 100%;
  object-fit: contain; object-position: center;
  display: block; padding: 8px;
  transition: transform .25s ease;
}
.product:hover .product-image-wrapper img { transform: scale(1.05); }

.product .product-overlay {
  position: absolute; inset: 0; display: grid; place-items: center;
  background: linear-gradient(180deg, rgba(0,0,0,0), rgba(0,0,0,.08));
  color: #fff; font-weight: 700; letter-spacing: .02em; font-size: .95rem;
  opacity: 0; transition: opacity .2s ease;
}
.product:hover .product-overlay { opacity: 1; }

/* Skupiny v gridu */
.products h3,
.products .roaster-heading,
.products .roaster-label,
.products .brand-label {
  grid-column: 1 / -1;
  margin: 0 0 .5rem;
  font-size: 1.1rem; font-weight: 700; color: #111;
}
.products .roaster-group,
.products .brand-group,
.products .group { display: contents; }

/* Nadpis sekce */
.section h2 { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; margin-bottom: 1rem; }
.section .section-title-text { font-weight: 700; }
.section .section-sublabels {
  display: inline-flex; flex-wrap: wrap; gap: 10px 14px;
  font-size: .95rem; font-weight: 600; color: #333;
}
.section .section-sublabel { white-space: nowrap; }
.section .section-sublabel::before { content: "— "; color: #9aa59a; }

@media (max-width: 640px) {
  .section .section-sublabels { width: 100%; font-size: .9rem; color: #555; }
}

/* Výsledky hledání */
#listing.section    { padding-top: 1rem; }
#listing-title      { font-size: 1.6rem; font-weight: 800; margin: 0 0 .25rem; }
#listing-intro      { color: #555; margin: 0 0 1rem; }
#listing-products   {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 1.5rem;
}

/* Badges na kartách */
.product .product-badges {
  position: absolute; top: 8px; left: 8px;
  display: flex; flex-direction: column; gap: 4px; z-index: 2;
}
.product-badge {
  display: inline-flex; align-items: center; justify-content: center;
  padding: 4px 9px; border-radius: 999px;
  font-size: .72rem; font-weight: 700; letter-spacing: .03em; text-transform: uppercase;
  background: #fff7e6; color: #4a3b22;
  border: 1px solid rgba(0,0,0,.04); box-shadow: 0 1px 3px rgba(0,0,0,.08);
}
.product-badge.badge--new        { background: #e0f7f1; border-color: #c5ece1; color: #166a52; }
.product-badge.badge--sale       { background: #ffe0e5; border-color: #ffc2cf; color: #a02238; }
.product-badge.badge--bestseller {
  background: linear-gradient(135deg, #FFF7B2, #FFD85A);
  border-color: #F2CF68; color: #5A3B00; box-shadow: 0 2px 10px rgba(0,0,0,.10);
}
.product-badge.badge--bestseller::before { content: "★"; margin-right: 4px; font-size: .9em; }
.product-badge.badge--rescue     { background: linear-gradient(135deg, #d32f2f, #ff6f3c); color: #fff; border-color: transparent; }
.product-badge.badge__percent    { margin-left: 4px; }

.product-badge.badge--espresso,
.product-badge.badge--automat,
.product-badge.badge--filtr,
.product-badge.badge--bezkofein,
.product-badge.badge--kapsle {
  color: #fff; border-color: transparent; box-shadow: 0 4px 14px rgba(0,0,0,.18);
}
.product-badge.badge--espresso  { background: linear-gradient(135deg, #8d4b20, #d68b4a); }
.product-badge.badge--automat   { background: linear-gradient(135deg, #2e7d32, #43b047); }
.product-badge.badge--filtr     { background: linear-gradient(135deg, #1976d2, #42a5f5); }
.product-badge.badge--bezkofein { background: linear-gradient(135deg, #6a11cb, #4a66e8); }
.product-badge.badge--kapsle    { background: linear-gradient(135deg, #f9a825, #ffb74d); }

/* Chuťové ikony */
.product-flavour-icons {
  margin-top: .5rem; display: flex; flex-wrap: wrap;
  gap: .25rem .35rem; justify-content: flex-start;
}
.product-flavour-icons .tag-icon  { width: 24px; height: 24px; object-fit: contain; display: block; }
.product-flavour-icons .tag-label { display: inline; }

/* Chuťové ikony na kartách — pravý horní roh */
.product .product-image-wrapper .product-flavour-icons {
  position: absolute; top: 8px; right: 0; margin: 0; padding: 0;
  display: flex; flex-direction: column; gap: 4px; align-items: flex-end; z-index: 3;
}
.product .product-image-wrapper .product-flavour-icons .tag--flavour {
  padding: 0; background: transparent; border-radius: 0;
  display: flex; align-items: center; justify-content: center;
}
.product .product-image-wrapper .product-flavour-icons .tag-icon {
  width: 56px; height: 56px; object-fit: contain; display: block;
}
.product .product-image-wrapper .product-flavour-icons .tag-label { display: none; }

/* Cena se slevou */
.product-price { margin-top: .5rem; font-size: 15px; }
.sale-box {
  display: inline-block; background: #ffe5e5;
  border-radius: 6px; padding: 6px 10px 8px; line-height: 1.3;
}
.sale-box-label {
  font-size: 11px; font-weight: 600; text-transform: uppercase;
  letter-spacing: .03em; color: #b0121c; margin-bottom: 2px;
}
.sale-box-prices       { display: flex; align-items: baseline; gap: 6px; }
.price-discounted      { font-weight: 700; font-size: 15px; color: #d32f2f; }
.price-original        {
  font-size: 12px; text-decoration: line-through; color: #9e9e9e;
  font-weight: 600; opacity: 1; margin-left: 8px;
}
.sale-box .price-original { font-size: 1em; }

/* Utility */
.icon-50  { width: 50px; height: auto; }
.u-mt-0   { margin-top: 0; }
.u-mt-4   { margin-top: .25rem; }
.u-mb-16  { margin-bottom: 1rem; }
body.no-scroll { overflow: hidden; }

/* Focus */
a:focus-visible,
button:focus-visible,
.size-option-button:focus-visible,
.r-subnav__link:focus-visible,
.mega__list a:focus-visible {
  outline: none;
  box-shadow: var(--focus-ring);
  border-color: var(--green);
}

/* Touch bez delay */
button, a, .size-option-button, .menu-trigger, .m-cat, .tile {
  touch-action: manipulation;
}

/* Hover pouze na zařízeních co ho podporují */
@media (hover: hover) and (pointer: fine) {
  .btn, .btn-primary, .cta, .banner-link, .card-link {
    transition: transform .15s ease, box-shadow .15s ease;
  }
  .btn:hover, .btn-primary:hover, .cta:hover, .banner-link:hover, .card-link:hover {
    transform: scale(1.03);
  }
}
/* ================================================================
   PART 02 — Košík (stránka), detail produktu, food tabs, related
   ================================================================ */

/* -------------------- KOŠÍK STRÁNKA -------------------- */
.cart-section {
  padding: 2rem 2rem 10rem;
  text-align: left; max-width: 600px; margin: 0 auto;
}
.cart-section h2 {
  text-align: left; margin-bottom: 1.5rem; font-size: 2rem; color: #333;
  border-bottom: 2px solid #eee; padding-bottom: .5rem;
}
.cart-items {
  list-style: none; padding: 0; margin: 0;
  border: 1px solid var(--line); border-radius: 8px; background: #fff;
  box-shadow: 0 4px 12px rgba(0,0,0,.05);
}
.cart-item-row {
  display: flex; justify-content: space-between; align-items: center;
  padding: 1rem 1.5rem; border-bottom: 1px solid #f0f0f0;
  transition: background-color .2s ease;
}
.cart-item-row:not(.cart-summary-row):last-of-type { border-bottom: none; }
.cart-item-row:hover { background: #f9f9f9; }
.cart-item-name    { flex-basis: 50%; font-weight: 500; color: #333; font-size: 1.05rem; }
.cart-item-price   { flex-basis: 20%; text-align: right; font-weight: 600; color: #3aa15b; font-size: 1.05rem; }
.cart-item-controls { display: flex; align-items: center; gap: .75rem; flex-basis: 30%; justify-content: flex-end; }

.cart-item-row button {
  background: none; border: none; color: #000; font-size: 1.2rem; font-weight: 700;
  margin: 0 .3rem; cursor: pointer; padding: .2rem .4rem; transition: transform .1s ease;
}
.cart-item-row button:hover { transform: scale(1.2); }

.cart-item-row .qty-minus,
.cart-item-row .qty-plus {
  width: 36px; height: 36px; border-radius: 6px; background: #e8e8e8;
  font-size: 1.2rem; font-weight: 700; display: inline-flex; align-items: center; justify-content: center;
  margin: 0 .2rem; padding: 0; color: #555; cursor: pointer;
  transition: background-color .2s ease, transform .1s ease, box-shadow .2s ease;
  box-shadow: 0 2px 4px rgba(0,0,0,.05);
}
.cart-item-row .qty-minus:hover,
.cart-item-row .qty-plus:hover { background: #dcdcdc; transform: translateY(-1px); }
.cart-item-row .quantity {
  font-size: 1.1rem; font-weight: 600; color: #444; min-width: 25px; text-align: center;
}
.cart-item-row .remove-button {
  font-size: 1.5rem; color: #e74c3c; margin-left: 1rem; padding: .2rem; cursor: pointer;
  transition: color .2s ease, transform .1s ease;
}
.cart-item-row .remove-button:hover { color: #c0392b; transform: scale(1.1); }

.cart-summary-row {
  display: flex; flex-direction: column; align-items: flex-end;
  padding: 1.5rem 1.5rem 1rem; border-top: 2px dashed #eee; background: #fcfcfc;
  border-bottom-left-radius: 8px; border-bottom-right-radius: 8px;
}

#cart-summary,
.cart-footer .cart-summary,
.cart-summary-row .cart-summary {
  display: block; width: 100%; text-align: center;
  font-size: 1.4rem; font-weight: 700; line-height: 1.3; color: #222;
  margin: .75rem 0 .5rem; font-family: inherit;
}

#free-shipping {
  font-size: 1.1rem; font-weight: 600; color: #27ae60; margin: 0;
  display: flex; align-items: center; gap: .5rem;
  justify-content: center; text-align: center;
}
#free-shipping::before      { content: none; }
#free-shipping.is-free::before { content: '🎉'; font-size: 1.3rem; margin-right: .25rem; }

.checkout-button {
  margin: 1.5rem auto 0;
  background: linear-gradient(145deg, var(--green), var(--green-d));
  color: #fff; padding: 1rem 2rem; border: none; border-radius: 8px; font-size: 1.2rem;
  cursor: pointer; transition: background .3s ease, transform .1s ease, box-shadow .2s ease;
  box-shadow: 0 6px 15px rgba(0,0,0,.15);
  width: 100%; max-width: 400px; display: block;
}
.checkout-button:hover {
  background: linear-gradient(145deg, var(--green-d), #2e7031);
  transform: translateY(-2px); box-shadow: 0 8px 18px rgba(0,0,0,.2);
}

.cart-item-link       { color: inherit; text-decoration: none; }
.cart-item-link:hover { text-decoration: underline; }

.cart-item-price-old     { text-decoration: line-through; opacity: .7; margin-right: .35rem; }
.cart-item-price-current { font-weight: 600; }

@media (max-width: 768px) {
  .cart-section { padding-bottom: 12rem; }
  .cart-section h2 { font-size: 1.8rem; text-align: center; }

  .cart-summary-row { flex-direction: column; align-items: flex-start; padding: 1.5rem 1rem 1rem; }
  .cart-summary-row .cart-summary,
  .cart-summary-row #free-shipping { width: 100%; text-align: left; justify-content: flex-start; }

  .cart-item-row { flex-direction: column; align-items: flex-start; padding: 1rem; }
  .cart-item-name,
  .cart-item-price { flex-basis: auto; width: 100%; text-align: left; }
  .cart-item-price { margin-top: .5rem; }
  .cart-item-controls {
    flex-basis: auto; width: 100%; display: flex; justify-content: center;
    flex-direction: row; align-items: center; gap: .5rem; margin-top: 1rem;
  }
  .cart-item-row .qty-minus   { order: 1; }
  .cart-item-row .quantity    { order: 2; min-width: 30px; text-align: center; }
  .cart-item-row .qty-plus    { order: 3; }
  .cart-item-row .remove-button { order: 4; margin-left: .8rem; color: #e74c3c; }
}

/* -------------------- DETAIL PRODUKTU -------------------- */
.product-image img { max-width: 100%; max-height: 400px; object-fit: contain; display: block; margin: 0 auto; }
@media (max-width: 768px) { .product-image img { max-height: 250px; } }

.product-detail-container {
  display: flex; flex-direction: column; gap: 2rem;
  max-width: 1200px; margin: 0 auto; padding: 2rem 1rem;
}
.product-main-details { display: flex; flex-direction: column; gap: 2rem; width: 100%; }
@media (min-width: 768px) { .product-main-details { flex-direction: row; align-items: flex-start; gap: 3rem; } }

.product-detail-image       { flex: 1; text-align: center; position: relative; }
.product-detail-image > #detail-img {
  display: block; width: 100%; aspect-ratio: 1 / 1; object-fit: contain;
  border-radius: 12px; box-shadow: 0 4px 16px rgba(0,0,0,.1); background: #f8f8f8;
}
.product-detail-image img   { max-width: 100%; height: auto; border-radius: 12px; box-shadow: 0 4px 16px rgba(0,0,0,.1); }

.product-detail-info        { flex: 1; display: flex; flex-direction: column; gap: .8rem; }
.product-detail-title       { font-size: 2rem; font-weight: 600; margin: 0; }
.product-detail-flavor,
.product-detail-extra       { font-size: 1rem; line-height: 1.4; white-space: pre-wrap; margin: 0; }
.product-detail-info p      { margin: 0; padding: 0; }
.product-detail-price       { font-size: 1.6rem; font-weight: 700; margin: .5rem 0; color: #111; }
.product-detail-vat         { font-size: .8rem; color: #666; }
.product-detail-row         { margin: .2rem 0 0; }
.product-detail-row.hidden  { margin-bottom: 0; }
.section-label              { margin-bottom: .5rem; font-weight: 500; }
.product-detail-size .section-label { margin-bottom: .15rem; font-weight: 500; }

.product-detail-quantity        { display: flex; align-items: center; gap: .5rem; margin: .5rem 0; }
.product-detail-quantity button {
  padding: .5rem 1rem; font-size: 1.2rem; border: none; background: #f0f0f0;
  cursor: pointer; border-radius: 6px;
}
.product-detail-quantity input  {
  width: 60px; padding: .4rem; text-align: center; font-size: 1rem;
  border: 1px solid #ccc; border-radius: 6px;
}
.product-detail-quantity input[type="number"]::-webkit-outer-spin-button,
.product-detail-quantity input[type="number"]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.product-detail-quantity input[type="number"] { -moz-appearance: textfield; appearance: textfield; }

.product-detail-button {
  background: #4CAF50; color: #fff; padding: .8rem 1.5rem; font-size: 1rem;
  border: 0; border-radius: 6px; cursor: pointer;
  transition: background-color .2s ease, border-color .2s ease, color .2s ease;
  margin-top: .5rem;
}
.product-detail-button:hover        { background: #45a049; }
.product-detail-button.is-soldout   { background: #b00020; cursor: not-allowed; opacity: .9; }

.detail-buy-row { display: flex; gap: 10px; align-items: stretch; margin-top: 4px; }
.detail-buy-row .product-detail-quantity { margin: 0; flex-shrink: 0; }
.detail-buy-row .product-detail-button   { flex: 1; margin: 0; }

#product-detail { background: #fff; margin: 20px 0; border-radius: 8px; padding: 20px; }

/* Tagy */
.tag { display: inline-block; background: #f1f1f1; color: #333; padding: 4px 10px; margin: 3px 5px 3px 0; border-radius: 20px; font-size: .9em; }
.tag--link { text-decoration: none; cursor: pointer; transition: background .15s; }
.tag--link:hover { filter: brightness(.93); }
.tag--prep-filtr      { background: #e0f0ff; }
.tag--prep-v60        { background: #e8faf0; }
.tag--prep-aeropress  { background: #fff3e0; }
.tag--prep-frenchpress{ background: #f5ede0; }
.tag--prep-automat    { background: #e8eeff; }
.tag--prep-paka       { background: #ffe8e8; }
.tag--prep-moka       { background: #fdf0e0; }
.tag--prep-kapsle     { background: #f0e8ff; }
.tag--proc-naturalni  { background: #FFF0DC; }
.tag--proc-promyte    { background: #DCF0FF; }
.tag--proc-honey      { background: #FFF5C0; }
.tag--proc-anaerobni  { background: #F0DCFF; }
.tag--proc-karbonickamacerace { background: #FFE0E8; }
.tag-container { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 0; }

/* Volby velikosti */
.size-options-container { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: .5rem; }
.size-option-button {
  background: #fff; border: 1px solid #ccc; color: #333;
  padding: .6rem 1rem; font-size: .95rem; font-weight: 500;
  cursor: pointer; border-radius: 4px;
  transition: background-color .2s, border-color .2s, color .2s, transform .1s;
  min-width: 70px; text-align: center;
}
.size-option-button:hover        { border-color: var(--green); color: var(--green); transform: translateY(-1px); }
.size-option-button.active       { background: var(--green); border-color: var(--green); color: #fff; font-weight: 600; box-shadow: 0 2px 5px rgba(0,0,0,.1); }
.size-option-button.active:hover { background: var(--green-d); border-color: var(--green-d); }
.size-option-button[disabled]    { opacity: .5; cursor: not-allowed; background: #f5f5f5; border-color: #eee; color: #888; }
.size-option-button[disabled].active { background: #aaa; border-color: #999; }

/* Prvky detailu v2 */
.detail-roaster-link {
  display: inline-flex; align-items: center; gap: 6px;
  margin: 4px 0 12px; padding: 5px 12px 5px 8px;
  background: #f5f0e8; border: 1px solid #e0d5c0; border-radius: 20px;
  font-size: .9rem; font-weight: 600; color: #5a3e1b;
  text-decoration: none; transition: background .15s;
}
.detail-roaster-link:hover { background: #ede5d0; }
.detail-roaster-link img   { width: 22px; height: 22px; border-radius: 50%; object-fit: contain; background: #fff; border: 1px solid #ddd; }

.detail-flavour-icons      { display: flex; flex-wrap: wrap; gap: 10px; margin: 6px 0 4px; }
.detail-flavour-item       { display: flex; flex-direction: column; align-items: center; gap: 4px; min-width: 60px; }
.detail-flavour-item img   { width: 52px; height: 52px; object-fit: contain; }
.detail-flavour-item span  { font-size: .75rem; color: #555; text-align: center; line-height: 1.2; }

.detail-trust-block {
  display: flex; flex-direction: column; gap: 6px;
  margin: 12px 0 14px; padding: 12px 14px;
  background: #f6faf6; border: 1px solid #c8e6c9; border-radius: 10px; font-size: .9rem;
}
.detail-trust-row       { display: flex; align-items: center; gap: 8px; color: #2e6b30; font-weight: 500; }
.detail-trust-row--out  { color: #b71c1c; }
.detail-trust-row.muted { color: #555; font-weight: 400; }
.detail-trust-icon      { font-size: 1rem; flex-shrink: 0; }
.detail-trust-block--img { display: none; margin: 12px 0 0; }
.detail-trust-block--btn { display: flex; order: 10; }
@media (min-width: 768px) {
  .detail-trust-block--img { display: flex; }
  .detail-trust-block--btn { display: none; }
}

.detail-gallery             { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.detail-gallery__thumb      {
  width: 60px; height: 60px; border-radius: 6px; overflow: hidden;
  border: 2px solid transparent; cursor: pointer; flex-shrink: 0;
  transition: border-color .15s, opacity .15s; background: #f5f5f5;
}
.detail-gallery__thumb img  { width: 100%; height: 100%; object-fit: cover; display: block; }
.detail-gallery__thumb:hover { opacity: .85; }
.detail-gallery__thumb.is-active { border-color: var(--green); }

.detail-cupping-badge {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 3px 10px; margin: 0 0 10px;
  background: #fff8e1; border: 1px solid #ffe082; border-radius: 12px;
  font-size: .85rem; font-weight: 700; color: #8b6000;
}
.detail-barista-note {
  display: flex; align-items: flex-start; gap: 10px;
  margin: 12px 0 0; padding: 12px 14px;
  background: #fdfaf5; border-left: 3px solid #c8a96e; border-radius: 0 8px 8px 0;
  font-size: .9rem; line-height: 1.5; color: #444;
}
.detail-barista-note__avatar { font-size: 1.6rem; flex-shrink: 0; line-height: 1; }
.detail-barista-note__text   { font-style: italic; }
.detail-barista-note__author { display: block; margin-top: 4px; font-style: normal; font-size: .8rem; font-weight: 600; color: #888; }

.product-stock[data-stock-display] { display: none; }

/* Spec tabulka */
.product-spec-list {
  display: grid;
  grid-template-columns: max-content 1fr;
  gap: 6px 20px; align-items: baseline;
  margin: 0; padding: 1.2rem;
  background: #f9f9f9; border-radius: 8px; border: 1px solid #e8e8e8;
  font-size: .95rem; line-height: 1.5;
}
.product-spec-list dt { font-weight: 600; color: #555; white-space: nowrap; margin: 0; display: block; }
.product-spec-list dd { margin: 0; color: #111; display: block; }

.product-extra-details { display: flex; flex-direction: column; gap: 2rem; width: 100%; }
@media (min-width: 768px) {
  .product-extra-details { flex-direction: row; align-items: flex-start; }
  .product-extra-text-box,
  .product-spec-list,
  .product-extra-image-box { flex: 1; }
}
.product-extra-image-box {
  text-align: center; background: #fff; border-radius: 8px; border: 1px solid #eee;
  box-shadow: 0 2px 6px rgba(0,0,0,.05); padding: 1rem;
  display: flex; align-items: center; justify-content: center; overflow: hidden;
}
.product-extra-image-box img { max-width: 100%; height: auto; display: block; border-radius: 6px; }

/* Chuťové ikony v detailu */
#detail-flavour-tags .tag--flavour {
  display: inline-flex; align-items: center; justify-content: center;
  padding: 0; background: transparent; border-radius: 0; margin-right: 8px;
}
#detail-flavour-tags .tag-icon { width: 40px; height: 40px; object-fit: contain; display: block; }

/* Badges v detailu */
.product-detail-badges { position: absolute; top: 12px; left: 12px; z-index: 3; }
.product-detail-badges .product-badges { display: flex; flex-direction: column; gap: 6px; }
.product-detail-image.is-soldout img { filter: grayscale(0.2); }

/* -------------------- FOOD INFO TABS -------------------- */
.food-info-section { margin: 28px 0 8px; }
.food-tabs         { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
.food-tab-btn {
  display: inline-flex; align-items: center; gap: 6px;
  padding: .45rem 1.1rem;
  border: 1.5px solid #dde8dd; border-radius: 999px;
  background: #f4fbf4; font-size: .88rem; font-weight: 600; color: #2e6b30;
  cursor: pointer; transition: background .15s, border-color .15s, box-shadow .15s, color .15s;
  white-space: nowrap;
}
.food-tab-btn:hover    { background: #e8f5e9; border-color: var(--green); }
.food-tab-btn.is-active {
  background: var(--green); border-color: var(--green); color: #fff;
  box-shadow: 0 2px 8px rgba(67,176,71,.25);
}
.food-tabs-content  {
  background: #fff; border: 1px solid #e4efea; border-radius: 14px;
  padding: 22px 26px; box-shadow: 0 2px 10px rgba(0,0,0,.04);
}
.food-tab-panel           { display: none; }
.food-tab-panel.is-active { display: block; }
.food-section-title {
  font-size: .8rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em;
  color: var(--green); margin: 0 0 8px;
}
.food-section-title:not(:first-child) { margin-top: 22px; }
.ingredients-text { font-size: .92rem; line-height: 1.7; color: #333; margin: 0; }
.allergens-list {
  font-size: .92rem; line-height: 1.65; color: #333; margin: 0;
  padding: 10px 14px; background: #fff8e1;
  border-left: 3px solid #f9a825; border-radius: 0 8px 8px 0;
}
.nutrition-table         { width: 100%; border-collapse: collapse; font-size: .9rem; }
.nutrition-table caption { caption-side: top; text-align: left; font-size: .8rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--green); padding-bottom: 10px; }
.nutrition-table td      { padding: 9px 6px; border-bottom: 1px solid #f0f5f0; color: #444; vertical-align: middle; }
.nutrition-table tr:first-child td  { font-weight: 700; color: #111; }
.nutrition-table tr:last-child td   { border-bottom: none; }
.nutrition-table td:last-child      { text-align: right; font-weight: 600; color: #111; white-space: nowrap; }
.nutrition-table tr:nth-child(even) td { background: #f9fcf9; }
.food-info-list    { display: grid; grid-template-columns: max-content 1fr; gap: 10px 24px; font-size: .92rem; margin: 0; }
.food-info-list dt { font-weight: 600; color: #555; white-space: nowrap; }
.food-info-list dd { margin: 0; color: #111; line-height: 1.5; }

@media (max-width: 768px) {
  .food-tab-btn      { font-size: .82rem; padding: .4rem .9rem; }
  .food-tabs-content { padding: 16px 18px; }
  .food-info-list    { grid-template-columns: 1fr; gap: 2px 0; }
  .food-info-list dt { margin-top: 12px; color: var(--green); font-size: .78rem; text-transform: uppercase; letter-spacing: .05em; }
  .food-info-list dt:first-child { margin-top: 0; }
}

/* -------------------- SOUVISEJÍCÍ PRODUKTY -------------------- */
.related-products-section       { margin-top: 3rem; padding-top: 2rem; border-top: 1px solid #ddd; }
.related-products-section h3    { font-size: 1.4rem; margin-bottom: 1rem; color: #111; }
.related-products {
  display: flex; gap: 1.5rem; overflow-x: auto; padding-bottom: 1rem;
  scroll-snap-type: x mandatory; scroll-behavior: smooth; -webkit-overflow-scrolling: touch;
}
.related-products::-webkit-scrollbar        { height: 8px; }
.related-products::-webkit-scrollbar-thumb  { background: #ccc; border-radius: 4px; }
.related-products::-webkit-scrollbar-track  { background: transparent; }
.related-products .product {
  flex: 0 0 auto; width: 200px; scroll-snap-align: start;
  border: 1px solid #eee; border-radius: 6px; background: #fff; padding: 1rem; text-align: center;
  box-shadow: 0 2px 6px rgba(0,0,0,.05); transition: transform .2s, box-shadow .2s;
}
.related-products .product:hover { transform: scale(1.02); box-shadow: 0 4px 12px rgba(0,0,0,.1); }

.related-products-wrapper { position: relative; }
.scroll-btn {
  position: absolute; top: 50%; transform: translateY(-50%);
  background: rgba(255,255,255,.95); border: 1px solid #ddd; border-radius: 50%;
  width: 45px; height: 45px; font-size: 24px; line-height: 43px;
  text-align: center; color: var(--green); cursor: pointer; z-index: 10;
  box-shadow: 0 4px 12px rgba(0,0,0,.1); transition: all .2s; opacity: .9;
}
.scroll-btn:hover { background: var(--green); color: #fff; border-color: var(--green); transform: translateY(-50%) scale(1.1); opacity: 1; }
.scroll-btn.left  { left:  -25px; }
.scroll-btn.right { right: -25px; }

@media (max-width: 768px) {
  .scroll-btn { width: 30px; height: 30px; font-size: 18px; line-height: 28px; opacity: .8; }
  .scroll-btn.left  { left:  -15px; }
  .scroll-btn.right { right: -15px; }
  .scroll-btn:hover { transform: translateY(-50%) scale(1.05); }
}

/* Related produkty v detailu – větší */
#product-detail .related-products {
  gap: 1.5rem; overflow-x: auto; overflow-y: hidden;
  scroll-snap-type: x proximity; -webkit-overflow-scrolling: touch;
}
#product-detail .related-products .product { flex: 0 0 260px; scroll-snap-align: start; }
#product-detail .related-products .product-image-wrapper { width: 100%; height: 210px; overflow: hidden; border-radius: 14px; margin: 0 0 .75rem; }
#product-detail .related-products .product-image-wrapper img { width: 100%; height: 100%; object-fit: cover; display: block; }
#product-detail .related-products .product-flavour-icons { gap: 4px; }
#product-detail .related-products .product-image-wrapper .product-flavour-icons .tag-icon { width: 56px; height: 56px; object-fit: contain; }
#product-detail .related-products .product-image-wrapper .product-flavour-icons { gap: 2px; }

@media (max-width: 768px) {
  #product-detail .related-products .product          { flex: 0 0 56vw; }
  #product-detail .related-products .product-image-wrapper { height: 200px; }
  #product-detail .related-products .product-image-wrapper .product-flavour-icons .tag-icon { width: 56px; height: 56px; }
}
@media (min-width: 420px) and (max-width: 768px) {
  #product-detail .related-products .product { flex-basis: 44vw; }
}
/* ================================================================
   PART 03 — Cookie banner, promo topbar, desktop header, tlačítka
   ================================================================ */

/* -------------------- COOKIE BANNER -------------------- */
#cookie-banner {
  position: fixed; left: 0; right: 0; bottom: 0;
  background: #fff; border-top: 1px solid #ddd;
  padding: 14px 16px; text-align: center;
  font: 14px/1.5 'Inter', sans-serif; color: #111;
  z-index: 5000; box-shadow: 0 -2px 10px rgba(0,0,0,.08);
}
#cookie-banner[hidden] { display: none; }
#cookie-banner a       { color: var(--green); text-decoration: underline; }
#cookie-banner button  {
  padding: .6rem 1.2rem; margin-left: 10px; border-radius: 6px;
  font-weight: 600; cursor: pointer; border: 0;
  transition: transform .1s ease, background .2s ease, box-shadow .2s ease;
}
#cookie-decline { background: #eee; border: 1px solid #ccc; color: #333; }
#cookie-accept  {
  background: linear-gradient(145deg, var(--green), var(--green-d));
  color: #fff; box-shadow: 0 4px 10px rgba(0,0,0,.1);
}
#cookie-accept:hover { background: linear-gradient(145deg, var(--green-d), #2e7031); transform: translateY(-1px); }

body.cookie-open #cart-banner { bottom: 72px; }

/* -------------------- PROMO TOPBAR -------------------- */
/* Zobraz jen poslední instanci pokud je jich víc */
.promo-topbar:not(:last-of-type) { display: none; }

.promo-topbar {
  display: block;
  background: #CCEACA; color: #396839; text-decoration: none;
  font: 500 14px/1.4 'Inter', system-ui, sans-serif;
  position: sticky; top: 0; z-index: 1100;
  will-change: transform, opacity;
  transition: transform .28s ease, opacity .28s ease, height .28s ease, padding .28s ease, margin .28s ease;
}
.promo-topbar:focus-visible { outline: 2px solid #1b5e20; outline-offset: 2px; }
.promo-topbar + .top-nav    { border-top: 1px solid rgba(0,0,0,.04); }

.promo-topbar.is-collapsed {
  transform: translateY(-100%);
  opacity: 0; height: 0;
  padding-top: 0; padding-bottom: 0;
  margin: 0; border: 0;
  pointer-events: none;
}

.promo-topbar-row { max-width: 1100px; margin: 0 auto; padding: 8px 16px; display: flex; align-items: center; gap: 20px; }
.promo-desktop   { justify-content: space-between; }
.promo-mobile    { display: flex; justify-content: center; }

.promo-item, .promo-slide {
  color: #396839; display: inline-flex; align-items: center; gap: 6px; white-space: nowrap;
}
.promo-icon {
  width: 18px; height: 18px; display: inline-block; object-fit: contain; vertical-align: middle;
  filter: invert(23%) sepia(14%) saturate(1191%) hue-rotate(76deg) brightness(93%) contrast(85%);
}

.promo-rotator {
  position: relative; height: 20px; min-height: 22px; width: 100%;
  display: flex; align-items: center; justify-content: center; overflow: hidden;
}
.promo-slide {
  position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  opacity: 0; transform: translateY(8px);
  transition: opacity .36s ease, transform .36s ease;
}
.promo-slide.is-active { opacity: 1; transform: translateY(0); }

.promo-desktop { display: none; }
.promo-mobile  { display: flex; }
@media (min-width: 900px) {
  .promo-desktop { display: flex; }
  .promo-mobile  { display: none; }
}

@keyframes promoCycle {
  0%  { opacity: 1; transform: translateY(0); }
  27% { opacity: 1; transform: translateY(0); }
  33% { opacity: 0; transform: translateY(-6px); }
  94% { opacity: 0; transform: translateY(6px); }
  100%{ opacity: 1; transform: translateY(0); }
}
.promo-mobile .promo-rotator.css-fallback .promo-slide { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; opacity: 0; transform: translateY(6px); }
.promo-mobile .promo-rotator.css-fallback .promo-slide:first-child { opacity: 1; transform: translateY(0); }
.promo-mobile .promo-rotator.css-fallback .promo-slide:nth-child(1) { animation: promoCycle 9s infinite; }
.promo-mobile .promo-rotator.css-fallback .promo-slide:nth-child(2) { animation: promoCycle 9s infinite 3s; }
.promo-mobile .promo-rotator.css-fallback .promo-slide:nth-child(3) { animation: promoCycle 9s infinite 6s; }

@media (prefers-reduced-motion: reduce) {
  .promo-mobile .promo-rotator.css-fallback .promo-slide { animation: none; }
  .promo-slide { transition: none; }
}

/* Mobil — bez mezery mezi bannerem a headerem */
@media (max-width: 1024px) {
  .promo-topbar {
    position: sticky; top: 0;
    margin: 0; border: 0; padding-bottom: 0; border-bottom: 0;
  }
  .promo-topbar .promo-topbar-row { padding-block: 4px; }
  .promo-topbar.is-collapsed {
    transform: translateY(-100%); opacity: 0; height: 0;
    padding-top: 0; padding-bottom: 0; margin: 0; border: 0; pointer-events: none;
  }
  /* Skryj případný mezičlánek mezi bannerem a headerem */
  .promo-topbar + *:not(#m-header) { display: none; height: 0; }
  .promo-topbar + #m-header { margin-top: -1px; }
}

/* iOS Safari — banner static, žádné sticky glitchy */
@supports (-webkit-touch-callout: none) {
  @media (max-width: 1024px) {
    .promo-topbar {
      position: static;
      top: auto; margin: 0; border: 0;
      transform: none; opacity: 1; height: auto;
      padding-top: 4px; padding-bottom: 4px;
    }
    .promo-topbar.is-collapsed {
      transform: none; opacity: 1; height: auto;
      padding-top: 4px; padding-bottom: 4px;
      margin: 0; border: 0; pointer-events: auto;
    }
    #m-header {
      position: sticky; top: 0; margin: 0; border: 0;
    }
    .promo-topbar + #m-header { margin-top: 0; }
  }
}

/* Desktop z-index pojistky */
@media (min-width: 1025px) {
  .promo-topbar { z-index: 1100; }
  .r-header     { z-index: 1200; }
}

/* -------------------- TLAČÍTKA -------------------- */
.btn-primary {
  background: linear-gradient(145deg, var(--green), var(--green-d));
  color: #fff; border: none; padding: .8rem 1.1rem; border-radius: 10px;
  font-weight: 600; cursor: pointer;
  box-shadow: 0 4px 10px rgba(0,0,0,.1);
  transition: background .3s ease, transform .1s ease, box-shadow .2s ease;
}
.btn-primary:hover { background: linear-gradient(145deg, var(--green-d), #2e7031); transform: translateY(-1px); }

.btn-primary.btn-search {
  height: 36px; border-radius: 999px; flex-shrink: 0;
  display: inline-flex; align-items: center; justify-content: center;
  padding: 0 20px; font-size: 14px; font-weight: 700; line-height: 1;
  background: var(--green);
}
.btn-primary.btn-search:hover { background: var(--green-d); transform: none; }
.btn-search__label { pointer-events: none; }

.btn-primary-ghost {
  background: linear-gradient(145deg, var(--green), var(--green-d));
  border: none; color: #fff; padding: .8rem 1.2rem; border-radius: 8px;
  font-weight: 600; cursor: pointer;
  box-shadow: 0 4px 10px rgba(0,0,0,.1); transition: background .3s, transform .1s;
}
.btn-primary-ghost:hover { background: linear-gradient(145deg, var(--green-d), #2e7031); transform: scale(1.03); }

.btn-quiet       { background: #f5f5f5; border: 1px solid #e6e6e6; color: #111; padding: .8rem 1rem; border-radius: 10px; cursor: pointer; }
.btn-quiet:hover { background: #eee; }

/* -------------------- DESKTOP HEADER -------------------- */
.r-header {
  position: sticky; top: var(--promo-h, 28px); z-index: 1200;
  background: #fff; padding: 10px 24px !important;
  border-bottom: none; box-shadow: none;
  display: flex; align-items: center; gap: 24px; width: 100%;
  transition: all .25s ease;
}
.r-header-inner {
  width: 100%; margin: 0 auto;
  display: flex; align-items: center; gap: 12px;
  padding-inline: 16px; transition: all .25s ease;
}

/* Subnav inline (vedle loga) */
.subnav-inline { display: inline-flex; align-items: center; gap: 8px; margin-left: 8px; flex: 0 1 auto; }
.subnav-inline .r-subnav__link { padding: 8px 10px; border-radius: 6px; }
.subnav-inline .r-subnav__link[aria-expanded="true"] { background: var(--coffee-light); color: var(--coffee-brown); }

/* Logo */
.r-header-logo img { display: block; height: 40px; width: auto; }

/* Vyhledávání */
.r-header-search {
  flex: 1 1 600px; min-width: 220px; display: flex; align-items: center; position: relative;
  background: #fff; border: 2px solid var(--green); border-radius: 999px;
  box-shadow: 0 2px 10px rgba(0,0,0,.08);
  transition: box-shadow .2s, border-color .2s;
  padding: 0 6px 0 16px;
}
.r-header-search:focus-within { box-shadow: 0 2px 16px rgba(67,176,71,.18); border-color: var(--green-d); }
.r-search-icon { width: 18px; height: 18px; flex-shrink: 0; color: #999; margin-right: 8px; }
.r-header-search input[type="search"] {
  flex: 1; height: 44px; border: none; outline: none;
  padding: 0; font-size: 15px; background: transparent; color: var(--text);
}

/* Pravá navigace */
.r-header-nav { margin-left: auto; display: flex; align-items: center; gap: 10px; flex: 0 0 auto; }
.r-nav-link {
  display: inline-flex; align-items: center; gap: 8px;
  text-decoration: none; color: #333; font-weight: 600; font-size: 15px;
  white-space: nowrap; padding: 8px; border-radius: 6px; transition: background-color .2s;
}
.r-nav-link:hover { background: #f0f0f0; }
.r-nav-link .r-icon { width: 24px; height: 24px; }
.r-header .r-nav-link.login {
  background-color: #eaf7ea; border: 1px solid #cde7cd; border-radius: 6px;
  padding: 6px 12px; transition: background-color .2s ease;
}
.r-header .r-nav-link.login:hover { background-color: #d6f0d6; }

/* Košík v liště */
.r-cart {
  display: inline-flex; align-items: center; gap: .5rem; padding: 6px 12px;
  height: 40px; border: 2px solid var(--green); color: var(--green); background: transparent;
  border-radius: 999px; font-weight: 600; font-size: 15px; text-decoration: none;
  cursor: pointer; box-shadow: 0 2px 6px rgba(0,0,0,.05); line-height: 1;
  transition: background .2s ease, transform .1s ease, box-shadow .2s ease;
}
.r-cart:hover { background: #e9f9e9; transform: translateY(-1px); box-shadow: 0 4px 10px rgba(0,0,0,.08); }
.r-cart.bump  { animation: cart-bump .30s ease; }
@keyframes cart-bump { 0%{transform:scale(1)} 30%{transform:scale(1.2)} 60%{transform:scale(.95)} 100%{transform:scale(1)} }
.r-cart-badge { font-weight: 700; }

.order-cafe-logo    { height: 24px; width: auto; display: inline-block; vertical-align: middle; margin-left: 6px; }
.r-header .r-nav-link .nav-img-icon { height: 18px; width: auto; display: inline-block; vertical-align: middle; margin-left: 6px; flex-shrink: 0; }

@media (min-width: 1200px) {
  .r-header .r-header-inner { padding-inline: 32px; gap: 16px; }
  .r-header .r-header-search { max-width: 980px; }
}

/* Kompaktní header při scrollu */
body.header-compact .r-header              { padding: 8px 16px; box-shadow: 0 4px 16px rgba(0,0,0,.06); }
body.header-compact .r-header-inner        { gap: 10px; }
body.header-compact [data-compact-hide]    { display: none; }
body.header-compact .r-header-logo img    { height: 28px; transition: height .25s ease; }
body.header-compact .r-header-search input[type="search"] { height: 38px; }
body.header-compact .btn-primary.btn-search { height: 30px; padding: 0 14px; font-size: 13px; }
body.header-compact .promo-topbar          { display: none; }

/* Compact bar (rezervní) */
#compact-bar {
  position: fixed; top: 0; left: 0; right: 0; z-index: 1300;
  display: flex; align-items: center; gap: 12px; padding: 8px 16px;
  background: #fff; border-bottom: 1px solid #eee; box-shadow: 0 3px 12px rgba(0,0,0,.08);
  font: 600 15px/1 'Inter', system-ui, sans-serif; color: #333;
  opacity: 0; visibility: hidden; pointer-events: none;
  transform: translateY(-6px);
  transition: opacity .22s ease, transform .22s ease, visibility 0s .22s;
}
#compact-bar.is-visible {
  opacity: 1; visibility: visible; pointer-events: auto; transform: translateY(0);
  transition: opacity .22s ease, transform .22s ease;
}
#compact-bar .compact-left    { display: flex; align-items: center; gap: 10px; flex: 0 0 auto; }
#compact-bar .compact-nav     { display: flex; align-items: center; gap: 20px; }
#compact-bar .compact-right   { margin-left: auto; display: flex; align-items: center; gap: 12px; flex: 1 1 600px; }
#compact-bar .r-header-logo img { height: 28px; width: auto; display: block; }
#compact-bar .r-header-search { flex: 1 1 900px; min-width: 240px; max-width: none; }
#compact-bar .r-header-search input[type="search"] { height: 38px; }
#compact-bar .btn-primary.btn-search { height: 30px; padding: 0 14px; font-size: 13px; }
#compact-bar .r-cart { height: 38px; padding: 6px 12px; }
#compact-bar .r-subnav__inner { margin-left: 8px; padding-left: 0; gap: 14px; }
#compact-bar .compact-left    { gap: 8px; }
#compact-bar .compact-nav     { margin-left: 4px; }

body.compact-active .r-header .r-header-logo,
body.compact-active .r-header-nav [data-compact-hide],
body.compact-active #header-order-cafe { display: none; }

/* Desktop/mobil přepínání */
@media (max-width: 1024px) {
  #m-header { display: block; }
  .r-header, .r-subnav, #compact-bar { display: none; }
}
@media (min-width: 1025px) {
  #m-header, #m-fullscreen-menu { display: none; }
}

/* QXPAY logo */
.gateway-logo { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace; font-weight: 700; }
.gateway-logo .logo-x,
.gateway-logo span { color: #F7931A; }
/* ================================================================
   PART 04 — Mega menu, help panel, patička, search suggestions
   ================================================================ */

/* ================================================================
   MEGA MENU — Premium Coffee 2025
   Bílý panel · zelená linka · hover = zelený tint + icon slide
   ================================================================ */

/* Backdrop */
.mega-backdrop { position: fixed; inset: 0; background: rgba(0,0,0,.06); z-index: 1145; display: none; }
.mega-backdrop.is-visible,
.mega-backdrop.is-open { display: block; }
.mega-backdrop[hidden],
.mega-backdrop:not(.is-visible) { display: none; pointer-events: none; }

/* Skrytí mega — přebíjí řádek 64 */
.mega[aria-hidden="true"] { visibility: hidden; pointer-events: none; opacity: 0; }

/* ── Panel ── */
.r-subnav .mega {
  position: fixed;
  top: calc(var(--headerH-current) + 41px);
  left: 0; right: 0;
  display: block;
  background: #ffffff;
  border-top: 3px solid var(--green);
  box-shadow: 0 20px 60px rgba(0,0,0,.13), 0 4px 12px rgba(0,0,0,.06);
  z-index: 1150;
  visibility: hidden; pointer-events: none;
  opacity: 0; transform: translateY(-6px);
  transition: opacity .2s ease, transform .2s ease, visibility 0s .2s;
}
.r-subnav .mega[aria-hidden="false"],
.r-subnav .mega.is-open {
  visibility: visible; pointer-events: auto;
  opacity: 1; transform: translateY(0);
  transition: opacity .2s ease, transform .2s ease, visibility 0s 0s;
}

/* ── Nadpisy sloupců ── */
.mega__col-title,
.mega__section-title {
  font-size: 11px; font-weight: 700;
  text-transform: uppercase; letter-spacing: .1em;
  color: var(--green); margin: 0 0 14px; padding: 0;
}
.mega__col-title a,
.mega__section-title a { color: inherit; text-decoration: none; }
.mega__col-title a:hover,
.mega__section-title a:hover { color: var(--green-d); }

/* ── Textové linky (Původ, Pražírny) ── */
.mega__links { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; }
.mega__links li a {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 10px; border-radius: 10px;
  font-size: 15px; font-weight: 500; color: #222;
  text-decoration: none; transition: background .15s, color .15s;
}
.mega__links li a:hover { background: #f0fdf0; color: var(--green-d); }

.mega__links-more {
  font-size: 13px; font-weight: 600; color: var(--green-d);
  display: inline-flex; align-items: center; gap: 4px;
  padding: 8px 10px; border-radius: 8px;
  text-decoration: none; margin-top: 4px;
  transition: background .15s;
}
.mega__links-more:hover { background: #f0fdf0; }

/* ── Poradíme vám — karty ── */
.mega__col--help { display: flex; flex-direction: column; gap: 10px; }
.mega__help-link {
  display: flex; flex-direction: column; gap: 4px;
  padding: 16px 18px; border-radius: 14px;
  background: #fff; border: 1.5px solid #e8e8e8;
  text-decoration: none;
  transition: border-color .18s, box-shadow .18s;
}
.mega__help-link:hover { border-color: var(--green); box-shadow: 0 4px 20px rgba(67,176,71,.14); }
.mega__help-link--secondary { background: #fafafa; border-color: #ebebeb; }
.mega__help-link--secondary:hover { border-color: #aaa; box-shadow: 0 4px 16px rgba(0,0,0,.08); }
.mega__help-title { font-size: 14px; font-weight: 700; color: var(--green-d); }
.mega__help-link--secondary .mega__help-title { color: #333; }
.mega__help-sub { font-size: 12px; color: #999; margin-top: 1px; }

/* ── Pražírny hidden tiles ── */
#menu-prazirny-tiles > li        { flex: 0 0 140px; }
#menu-prazirny-tiles .tile       { aspect-ratio: 3 / 4; padding: 12px 8px 14px; }
#menu-prazirny-tiles .tile-icon  { width: 56px; height: 56px; object-fit: contain; display: block; margin-bottom: 6px; }
#menu-prazirny-tiles .tile-title { font-size: .9rem; -webkit-line-clamp: 4; min-height: calc(1.3em * 4); line-height: 1.3; }
@media (max-width: 640px) {
  #menu-prazirny-tiles > li        { flex: 0 0 120px; }
  #menu-prazirny-tiles .tile       { aspect-ratio: 1 / 1.25; }
  #menu-prazirny-tiles .tile-icon  { width: 48px; height: 48px; }
  #menu-prazirny-tiles .tile-title { -webkit-line-clamp: 3; min-height: calc(1.3em * 3); }
}
#ke-kave-brand-tiles .tile-icon { width: 72px; height: 72px; }

/* ────────────────────────────────────────────────
   MEGA: KÁVA — 4 sloupce
   ──────────────────────────────────────────────── */
#menu-kava {
  padding: 36px max(36px, calc((100vw - 1200px) / 2)) 40px;
  box-sizing: border-box;
  display: flex;
  align-items: flex-start;
  gap: 0;
}
#menu-kava .mega-kava__tiles-col {
  flex: 1.1; padding-right: 40px;
  border-right: 1px solid #f0f0f0;
}
#menu-kava .mega-kava__right {
  flex: 2.9; display: flex; align-items: flex-start; gap: 0;
}
#menu-kava .mega-kava__right .mega__col {
  flex: 1; padding: 0 32px; border-right: 1px solid #f0f0f0;
}
#menu-kava .mega-kava__right .mega__col:last-child { border-right: none; padding-right: 0; }

/* Nadpis levého sloupce */
#menu-kava .mega__section-title {
  font-size: 11px; font-weight: 700; text-transform: uppercase;
  letter-spacing: .1em; color: var(--green); margin: 0 0 14px;
}

/* Seznam dlaždic */
#menu-kava .mega__tiles {
  list-style: none; margin: 0; padding: 0;
  display: flex; flex-direction: column; gap: 2px;
}
#menu-kava .mega__tiles > li { list-style: none; }




/* Subnav lišta (desktop) */
.r-subnav {
  position: sticky; top: var(--headerH-current) !important; z-index: 1160;
  background: #fff; border-bottom: 1px solid var(--line);
}
.r-subnav__inner {
  display: flex; align-items: center; justify-content: flex-start;
  gap: 0; padding: 0 16px 0 220px;
  overflow-x: auto; scrollbar-width: none;
  position: relative; z-index: 1200;
}
.r-subnav__inner::-webkit-scrollbar { display: none; }
body:not(.sidebar-open) .r-subnav__inner { padding-left: 16px; }

.r-subnav__link {
  display: inline-block; padding: 10px 12px;
  font-size: 14px; font-weight: 600; color: #333;
  text-decoration: none; white-space: nowrap;
  border-bottom: 2px solid transparent;
  transition: color .15s, border-color .15s;
  background: none; border-top: none; border-left: none; border-right: none; cursor: pointer;
}
.r-subnav__link:hover         { color: var(--green-d); border-bottom-color: var(--green); }
.r-subnav__link--highlight    { margin-left: auto; color: var(--green-d); }
@media (max-width: 768px) { .r-subnav { display: none; } }

/* Topnav bar */
.topnav-bar { position: sticky; top: var(--headerH-current); z-index: 1100; background: #fff; border-bottom: 1px solid var(--line); }
.topnav-bar__inner {
  display: flex; align-items: center; gap: 4px; padding: 0 16px;
  max-width: 1100px; margin: 0 auto; overflow-x: auto; scrollbar-width: none;
}
.topnav-bar__inner::-webkit-scrollbar { display: none; }
.topnav-bar__inner a {
  display: inline-block; padding: 10px 12px; font-size: 14px; font-weight: 600;
  color: #333; text-decoration: none; white-space: nowrap;
  border-bottom: 2px solid transparent; transition: color .15s, border-color .15s;
}
.topnav-bar__inner a:hover       { color: var(--green-d); border-bottom-color: var(--green); }
.topnav-bar__highlight           { margin-left: auto; color: var(--green-d); }
@media (max-width: 768px) { .topnav-bar { display: none; } }

/* Subnav dropdowny */
.sn-item { position: relative; }
.sn-trigger { display: inline-flex; align-items: center; gap: 4px; }
.sn-arrow   { width: 14px; height: 14px; transition: transform .2s; flex-shrink: 0; }
.sn-trigger[aria-expanded="true"] .sn-arrow  { transform: rotate(180deg); }
.sn-trigger[aria-expanded="true"]             { color: var(--green-d); border-bottom-color: var(--green); }
.sn-dropdown {
  position: absolute; top: calc(100% + 1px); left: 0; min-width: 200px;
  background: #fff; border: 1px solid var(--line); border-top: 2px solid var(--green);
  border-radius: 0 0 10px 10px; box-shadow: 0 8px 24px rgba(0,0,0,.1);
  padding: 8px 0; z-index: 1200;
}
.sn-dropdown a {
  display: block; padding: 9px 18px; font-size: 14px; font-weight: 500;
  color: #222; text-decoration: none; transition: background .12s, color .12s;
}
.sn-dropdown a:hover { background: #f4faf4; color: var(--green-d); }
.sn-backdrop { position: fixed; inset: 0; z-index: 1199; }

/* Dlaždice (obecné) */
.tile {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  text-align: center; gap: 8px; padding: 10px 8px;
  width: 100%; aspect-ratio: 1 / 1;
  border: 1px solid #e7e7e7; border-radius: 12px; background: #fff;
  text-decoration: none; color: #111; font-weight: 600;
  transition: background .2s, border-color .2s, transform .1s, box-shadow .2s;
}
.tile-icon  { width: 64px; height: 64px; object-fit: contain; display: block; }
.tile-title {
  font-size: .88rem; line-height: 1.3; font-weight: 700;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.tile:hover { border-color: var(--green); transform: translateY(-3px); box-shadow: 0 6px 16px rgba(0,0,0,.12); }

/* -------------------- HELP PANEL -------------------- */
.help-trigger {
  max-width: 900px; margin: 10px auto 0; padding: 0 20px; text-align: center;
  background: linear-gradient(135deg, #fffdf6, #fff7e3);
  padding: 2.5rem 0; border-radius: 2rem;
  box-shadow: 0 4px 18px rgba(0,0,0,.05);
  margin: 2rem auto; width: min(90%, 700px);
}
.help-card {
  position: relative; border: 1px solid #ddd; border-radius: 8px; background: #fff;
  padding: 20px; box-shadow: 0 4px 8px rgba(0,0,0,.1); max-width: 800px; margin: 16px auto;
}
.help-title { margin: 0 0 .4rem; font-size: 1.6rem; font-weight: 600; color: #111; }
.help-sub   { color: #555; margin: .25rem 0 1rem; }
#help-form  { margin-top: .5rem; }
.help-label { display: block; font-weight: 600; margin: .6rem 0 .3rem; }
.help-actions { display: flex; gap: .6rem; justify-content: flex-end; margin: .75rem 0 .25rem; }

#help-message, #help-email,
#help-message-bottom, #help-email-bottom {
  width: 100%; font: inherit;
  border: 1px solid #e6e6e6; border-radius: 10px;
  padding: .75rem .9rem; outline: 0; background: #fff;
  transition: border-color .15s, box-shadow .15s;
  margin-bottom: .6rem;
}
#help-message, #help-message-bottom {
  resize: none; overflow: hidden; min-height: 96px; line-height: 1.45;
}
#help-message:focus, #help-email:focus,
#help-message-bottom:focus, #help-email-bottom:focus {
  border-color: #46a65a; box-shadow: 0 0 0 3px rgba(70,166,90,.12);
}
.help-close       { position: absolute; top: 10px; right: 12px; border: 0; background: transparent; font-size: 22px; cursor: pointer; opacity: .6; color: #333; line-height: 1; }
.help-close:hover { opacity: 1; color: #000; }
.help-status      { font-weight: 600; margin: .4rem 0 0; }
.help-status.ok   { color: #2b7a2b; }
.help-status.err  { color: #b20000; }
.hp-field         { display: none; }

@media (max-width: 768px) {
  .help-card  { margin: 10px auto; padding: 16px; }
  .help-title { font-size: 1.4rem; }
  .help-trigger { padding: 2rem 1rem; border-radius: 1.4rem; }
}

#open-help {
  display: inline-block; width: 100%; max-width: 420px;
  background: linear-gradient(135deg, #fff7e1, #ffe9b0);
  color: #4b2c00; font-family: 'Inter', sans-serif;
  font-size: 1.25rem; font-weight: 600; text-align: center;
  padding: 1.1rem 2.4rem; border: none; border-radius: 1.8rem;
  box-shadow: 0 6px 16px rgba(0,0,0,.08); cursor: pointer;
  transition: transform .25s ease, box-shadow .25s ease, background .25s ease;
  margin-inline: auto;
}
#open-help:hover, #open-help:focus-visible {
  background: linear-gradient(135deg, #fff1c8, #ffd879);
  transform: translateY(-3px); box-shadow: 0 8px 20px rgba(0,0,0,.12); outline: none;
}
#open-help:active { transform: translateY(0); box-shadow: 0 4px 10px rgba(0,0,0,.08); }
@media (max-width: 600px) { #open-help { font-size: 1.1rem; padding: 1rem 1.6rem; } }

/* -------------------- PATIČKA -------------------- */
.site-footer             { background: #fff; color: #222; border-top: 1px solid #e8e8e8; }
.site-footer a           { color: #333; text-decoration: none; }
.site-footer a:hover     { color: #2d6a2d; text-decoration: underline; }
.site-footer .wrap {
  max-width: 1200px; margin: 0 auto; padding: 56px 28px 44px;
  display: grid; gap: 48px; grid-template-columns: 1.6fr 1fr 1fr 1fr;
}
.site-footer .brand      { margin-bottom: .5rem; }
.site-footer .brand img  { height: 40px; width: auto; border-radius: 6px; }
.site-footer h4 {
  font-size: 12px; text-transform: uppercase; letter-spacing: .08em;
  margin: 1.4rem 0 .7rem; color: #888; font-weight: 700;
}
.site-footer h4:first-child { margin-top: 0; }
.site-footer ul  { list-style: none; padding: 0; margin: 0; }
.site-footer li  { margin: .45rem 0; font-size: .9rem; line-height: 1.4; }
.site-footer h4,
.site-footer address,
.site-footer ul  { text-align: left; }
.site-footer address { font-style: normal; line-height: 1.5; margin: 0 0 .5rem; display: block; }
.site-footer address strong { display: block; font-size: 1rem; margin-bottom: .3rem; }

.footer-networks { display: flex; gap: 12px; margin: 1.25rem 0 0; align-items: center; }
.footer-networks a {
  display: inline-flex; align-items: center; justify-content: center;
  width: 40px; height: 40px; border-radius: 50%;
  background: #f0f0f0; border: 1px solid #e0e0e0;
  text-decoration: none; transition: background .15s, opacity .15s; overflow: hidden; flex-shrink: 0;
}
.footer-networks a img   { width: 22px; height: 22px; object-fit: contain; display: block; }
.footer-networks a:hover { background: #e0e0e0; opacity: 1; text-decoration: none; }

.footer-newsletter      { margin-top: 1.5rem; }
.footer-newsletter-lead { font-size: .9rem; margin: 0 0 .75rem; color: #444; line-height: 1.45; }
.footer-newsletter-lead strong { color: #111; }
.footer-newsletter-form { display: flex; gap: 8px; }
.footer-newsletter-form input[type="email"] {
  flex: 1; padding: 10px 13px; border: 1px solid #ddd; border-radius: 6px;
  font-size: .875rem; font-family: inherit; outline: none; color: #222; transition: border-color .15s;
}
.footer-newsletter-form input[type="email"]:focus { border-color: #2d6a2d; }
.footer-newsletter-form button {
  padding: 10px 18px; background: #2d6a2d; color: #fff; border: none;
  border-radius: 6px; font-size: .875rem; cursor: pointer; white-space: nowrap; font-family: inherit;
}
.footer-newsletter-form button:hover { background: #1a5c1a; }
.footer-newsletter-note { font-size: .75rem; color: #bbb; margin: .5rem 0 0; }

.site-footer .footer-payment        { margin: 1.4rem 0 0; font-size: .9rem; color: #444; }
.site-footer .footer-payment .gateway-logo { font-size: 1.05rem; }

.site-footer .bottom {
  border-top: 1px solid #eee; padding: 16px 28px;
  display: flex; justify-content: space-between; align-items: center;
  flex-wrap: wrap; gap: 8px; max-width: 1200px; margin: 0 auto;
}
.site-footer .bottom .copyright      { margin: 0; font-size: .85rem; color: #999; }
.site-footer .bottom .developer-credit { margin: 0; font-size: .75rem; color: #ccc; font-style: italic; }

@media (max-width: 960px) { .site-footer .wrap { grid-template-columns: 1fr 1fr; gap: 32px; padding: 40px 20px 32px; } }
@media (max-width: 600px) {
  .site-footer .wrap { grid-template-columns: 1fr 1fr; gap: 24px 20px; padding: 32px 16px 24px; }
  .site-footer .wrap > div:first-child { grid-column: 1 / -1; border-bottom: 1px solid #eee; padding-bottom: 24px; margin-bottom: 4px; }
  .site-footer .bottom { flex-direction: column; text-align: center; padding: 14px 16px; gap: 4px; }
  .footer-networks     { margin-top: 1rem; }
  .footer-newsletter-form { flex-direction: column; }
  .footer-newsletter-form input[type="email"],
  .footer-newsletter-form button { width: 100%; box-sizing: border-box; }
}

/* -------------------- SEARCH SUGGESTIONS -------------------- */
.r-header-search, .m-search { position: relative; }

.search-suggestions {
  position: absolute; top: 100%; left: 0; right: 0; margin-top: 4px;
  background: #fff; border-radius: 12px; border: 1px solid #eee;
  box-shadow: 0 10px 30px rgba(0,0,0,.12);
  padding: 4px 0 0; max-height: 420px; overflow-y: auto; z-index: 1500;
  font-family: 'Inter', system-ui, sans-serif;
}
.search-suggestions[hidden]   { display: none; }
.search-suggestions ul        { list-style: none; margin: 0; padding: 0; }

.search-suggestion-item {
  display: flex; align-items: center; gap: 10px; padding: 8px 14px;
  cursor: pointer; transition: background .15s ease;
}
.search-suggestion-item:hover { background: #f5f5f5; }

.search-suggestion-thumb {
  flex: 0 0 42px; width: 42px; height: 42px;
  border-radius: 6px; overflow: hidden; background: #f3f3f3;
}
.search-suggestion-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }

.search-suggestion-main {
  flex: 1 1 auto; display: flex; flex-direction: column; justify-content: center; min-width: 0;
}
.search-suggestion-title {
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  font-size: 14px; font-weight: 500; color: #222; line-height: 1.3;
}
.search-suggestion-title .search-price { margin-left: auto; }
.search-suggestion-price     { font-size: 13px; font-weight: 600; white-space: nowrap; color: #444; }
.search-suggestion-desc      { font-size: 12px; color: #666; margin-top: 2px; }

.search-suggestion-footer {
  display: block; width: 100%; border: none; border-top: 1px solid #eee;
  padding: 10px 14px 11px; background: #fafafa;
  font-size: 13px; font-weight: 500; text-align: center; cursor: pointer; transition: background .15s ease;
}
.search-suggestion-footer:hover { background: #f0f0f0; }

/* Cena v našeptávání */
.search-price               { font-size: .9rem; white-space: nowrap; }
.search-price--sale         { display: inline-flex; align-items: center; gap: .35rem; }
.search-price-discounted    { font-weight: 700; padding: 2px 6px; border-radius: 999px; background-color: #ffe5e5; color: #c00000; }
.search-price-original      { font-size: .8rem; text-decoration: line-through; color: #c00000; opacity: .8; }
.search-price-badge         { font-size: .75rem; font-weight: 600; color: #c00000; }
.search-price-old           { text-decoration: line-through; opacity: .7; font-weight: 400; }

@media (max-width: 768px) {
  .m-search .search-suggestions { border-radius: 10px; margin-top: 6px; max-height: 65vh; }
  .search-suggestion-thumb { flex-basis: 36px; width: 36px; height: 36px; }
  .search-suggestion-title { font-size: 13px; }
  .search-suggestion-desc  { font-size: 11px; }
}

/* Account badge */
.account-badge {
  display: inline-block; margin-left: .5rem; padding: .1rem .4rem;
  font-size: .75rem; font-weight: 600; border: 1px solid #0a7; border-radius: .4rem; color: #0a7;
  vertical-align: middle;
}
/* ================================================================
   PART 05 — Mobilní header + fullscreen menu
   ================================================================ */

/* -------------------- MOBILNÍ HEADER -------------------- */
#m-header {
  position: sticky; top: 0; z-index: 1400;
  display: none; background: #fff; border-bottom: 1px solid #eee;
  max-width: 100%;
}
/* Horní "vzduchový polštář" nad obsahem headeru */
#m-header::before { content: ""; display: block; height: 12px; }

.m-header__bar { transition: opacity .25s ease, transform .25s ease; }
.m-header__bar.is-hidden { opacity: 0; transform: translateY(-100%); pointer-events: none; position: absolute; inset: auto 0 0 0; }
.m-header__bar.is-visible { opacity: 1; transform: translateY(0); position: relative; }

.m-row {
  display: flex; align-items: center; justify-content: space-between;
  gap: 10px; padding: 8px 12px; position: relative;
  max-width: 100%;
}

/* Logo absolutně na střed */
.m-logo { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); }
#m-header-full .m-logo img { height: 28px; }
#m-header-slim .m-logo img { height: 24px; }

/* Levá/pravá část nad logem */
.m-menu-toggle, .m-actions { z-index: 2; }

.m-btn        { display: inline-flex; align-items: center; gap: 6px; border: 0; background: transparent; padding: 6px 8px; cursor: pointer; }
.m-btn-label  { font: 600 14px/1 'Inter', sans-serif; color: #333; }
.m-ico        { width: 24px; height: 24px; stroke: currentColor; fill: none; stroke-width: 2; }

.m-actions    { display: inline-flex; align-items: center; gap: 10px; }
.m-link       { font: 600 14px/1 'Inter', sans-serif; color: #333; text-decoration: none; padding: 6px 8px; border-radius: 6px; }
.m-link:hover { background: #f5f5f5; }
.m-icon       { display: inline-flex; padding: 6px; color: #333; position: relative; }

/* Vyhledávání */
.m-search {
  display: flex; align-items: center; gap: 8px;
  padding: 0; width: 100%; flex: 1 1 auto;
}
#m-header-full .m-search { padding: 0 12px 10px; }

.m-search input {
  flex: 1 1 auto; min-width: 0; height: 40px; padding: 0 12px;
  border: 2px solid var(--green); border-radius: 8px;
  font: 16px/1 'Inter', sans-serif; background: #fff;
}
.m-search__btn {
  display: inline-flex; align-items: center; justify-content: center;
  width: 40px; height: 40px; border-radius: 8px; border: 0;
  background: linear-gradient(145deg, var(--green), var(--green-d));
  color: #fff; cursor: pointer; padding: 0;
}
.m-search__btn:hover { background: var(--green-d); }
.m-search__btn svg  { pointer-events: none; }
.m-search-icon      { width: 22px; height: 22px; object-fit: contain; pointer-events: none; }

/* Slim bar */
#m-header-slim .m-row          { padding: 4px 10px; gap: 8px; min-height: 44px; }
#m-header-slim .m-search input { height: 34px; padding: 0 10px; }
#m-header-slim .m-search .m-search__btn { width: 34px; height: 34px; }
#m-header-slim .m-ico          { width: 22px; height: 22px; }
#m-header-slim .m-icon-label   { font-size: 11px; }
#m-header-slim .m-search-icon  { width: 18px; height: 18px; }
#m-header-slim .m-search { flex: 1 1 auto; width: auto; min-width: 0; }

@media (max-width: 360px) { #m-header-slim .m-icon-label { display: none; } }

/* Ikonová tlačítka s popiskem */
.m-icon-btn {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 2px; text-decoration: none; color: #333; font-weight: 600; font-size: 12px;
  position: relative; cursor: pointer; flex: 0 0 auto;
}
button.m-icon-btn { background: transparent; border: 0; padding: 6px 8px; }
.m-icon-btn .m-ico   { width: 24px; height: 24px; }
.m-icon-label        { font-size: 12px; line-height: 1; white-space: nowrap; }
.m-icon-btn:hover    { color: var(--green-d); }
.m-icon-btn:focus-visible { outline: none; box-shadow: var(--focus-ring); border-radius: 8px; }
.m-menu-toggle[aria-expanded="true"],
.m-menu-toggle[aria-expanded="true"] .m-icon-label { color: var(--green-d); }
.m-icon-btn .m-cart-badge { position: absolute; top: -4px; right: -2px; }

/* Badge košíku */
.m-cart-badge,
[data-cart-count] {
  position: absolute; top: -6px; right: -6px;
  min-width: 1.25em; height: 1.25em; line-height: 1.25em;
  padding: 0 .25em; border-radius: 999px; text-align: center;
  font-size: 12px; font-weight: 600; color: #fff;
  background-color: #6bbf59; box-shadow: 0 0 0 2px #fff;
  display: inline-block;
}
[data-cart-count][hidden] { display: none; }

/* iOS Safari slim bar fix */
@supports (-webkit-touch-callout: none) {
  #m-header-slim.m-header__bar {
    padding-top: max(6px, calc(env(safe-area-inset-top, 0px) * 0.5));
    padding-bottom: 4px;
    transform: translateZ(0);
    will-change: transform;
  }
  #m-header-slim .m-row { min-height: 48px; padding-top: 0; padding-bottom: 0; }
  #m-header { margin-top: 0; border-top: 0; }
  .promo-topbar + #m-header { margin-top: 0; }
}

/* -------------------- FULLSCREEN MENU -------------------- */
.m-menu {
  position: fixed; inset: 0; z-index: 1400;
  background: #fff; display: none;
}
.m-menu.is-open { display: flex; flex-direction: column; }

/* Hlava */
.m-menu__head {
  flex: 0 0 auto; position: sticky; top: 0; z-index: 2;
  background: #fff; padding: 10px 12px; border-bottom: 1px solid #eee;
  display: grid; grid-template-columns: auto 1fr; gap: 8px 12px; align-items: center;
}
.m-menu__head .m-close {
  appearance: none; border: 0; background: transparent;
  width: 36px; height: 36px; border-radius: 10px; display: grid; place-items: center;
}
.m-menu__head .m-search { grid-column: 1 / -1; }

/* Zavírací tlačítko */
.m-close { border: 0; background: transparent; padding: 6px; cursor: pointer; }
.m-menu__head .m-close svg,
.m-menu__head .m-close path,
.m-menu__head .m-close line { stroke: #000; color: #000; fill: none; }

/* Fullscreen menu search */
.m-search--menu { flex: 1 1 auto; width: 100%; }
.m-search--menu input      { height: 40px; border-width: 2px; }
.m-search--menu .m-search__btn { width: 40px; height: 40px; }

/* TABBAR: 5 záložek */
.m-menu__grid {
  flex: 0 0 auto;
  display: grid; grid-template-columns: repeat(5, 1fr);
  align-items: center; padding: 4px 2px; border-bottom: 1px solid #eee;
  background: #fff; text-align: center; gap: 0;
}
.m-menu__grid .m-cat {
  -webkit-tap-highlight-color: transparent;
  border: 0; background: none; box-shadow: none; outline: none; border-radius: 0;
  min-height: 44px; display: flex; flex-direction: column; justify-content: center; align-items: center;
  gap: 4px; padding: 6px 2px; color: #2b2b2b; font-weight: 600;
  font-size: clamp(12px, 3vw, 16px); line-height: 1.1; white-space: nowrap;
}
.m-menu__grid .m-cat .m-cat-icon { width: clamp(18px, 4vw, 22px); height: clamp(18px, 4vw, 22px); object-fit: contain; }
.m-menu__grid .m-cat.is-active  { color: #1a7f37; }
.m-menu__grid .m-cat.is-active::after { display: none; }
.m-menu__grid .m-cat:focus-visible { outline: 2px solid #1a7f37; outline-offset: 2px; }
.m-cat.is-active span      { color: var(--green, #189a3d); }
.m-cat.is-active .m-cat-icon { filter: saturate(1.3) hue-rotate(-20deg); }

@media (max-width: 360px) {
  .mega__tiles { grid-template-columns: 1fr; }
  .m-menu__grid .m-cat { font-size: clamp(11px, 2.8vw, 14px); gap: 2px; }
}

/* Blog tab zvýraznění */
@media (max-width: 1024px) {
  #m-fullscreen-menu .m-menu__grid .m-cat[data-target="m-panel-blog"] { position: relative; isolation: isolate; }
  #m-fullscreen-menu .m-menu__grid .m-cat[data-target="m-panel-blog"]::before {
    content: ""; position: absolute; inset: 7px 6px; border-radius: 14px;
    background: #fff7d6; opacity: .55; box-shadow: inset 0 0 0 1px rgba(0,0,0,.035); z-index: -1;
  }
}

/* Panely */
.m-menu__panels { flex: 1 1 auto; min-height: 0; overflow: hidden; padding-bottom: env(safe-area-inset-bottom); }
.m-panel        { display: none; height: 100%; overflow: auto; -webkit-overflow-scrolling: touch; padding: 12px 10px 24px; }
.m-panel.is-active { display: block; }

/* Dlaždice v panelech — 1 sloupec, řádkový layout */
.m-menu .m-panel .mega__tiles {
  display: grid; grid-template-columns: 1fr; gap: 10px;
  list-style: none; margin: 0; padding: 0;
}
.m-menu .m-panel .mega__tiles > li,
.m-menu .m-panel .mega__tiles > li > a.tile { width: 100%; list-style: none; margin: 0; padding: 0; }

.m-menu .m-panel .mega__tiles > li > a.tile {
  aspect-ratio: auto;
  text-align: left; display: flex; flex-direction: row;
  align-items: center; justify-content: flex-start;
  gap: 12px; padding: 12px 16px;
}
.m-menu .m-panel .mega__tiles > li > a.tile .tile-icon {
  width: 28px; height: 28px; flex: 0 0 28px; object-fit: contain;
}
.m-menu .m-panel .mega__tiles > li > a.tile .tile-title {
  flex: 1 1 auto; font-weight: 700; font-size: clamp(16px, 4.3vw, 18px);
  line-height: 1.25; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.m-menu .m-panel .mega__tiles > li > a.tile::after { content: "›"; margin-left: auto; font-size: 18px; opacity: .35; }

@media (min-width: 600px) { .m-menu .m-panel .mega__tiles { grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (max-width: 380px) {
  .m-menu .m-panel .mega__tiles > li > a.tile { padding: 10px 12px; gap: 10px; }
  .m-menu .m-panel .mega__tiles > li > a.tile .tile-icon { width: 24px; height: 24px; flex-basis: 24px; }
}

/* Blog panel v mobilním menu */
.m-menu .m-panel #m-blog-tiles.blog-preview-list { display: block; padding: 8px 10px; margin: 6px 0; }
.m-menu .m-panel #m-blog-tiles.blog-preview-list > li { display: block; margin: 0 0 10px; border-radius: 14px; }
.m-menu .m-panel #m-blog-tiles.blog-preview-list > li > a.tile {
  flex-direction: row; align-items: center; justify-content: flex-start;
  gap: 12px; min-height: auto; padding: 12px 16px; text-align: left;
}
.m-menu .m-panel #m-blog-tiles.blog-preview-list > li > a.tile .tile-icon {
  width: 28px; height: 28px; flex: 0 0 28px; object-fit: contain;
  border-radius: 0; background: transparent;
}
.m-menu .m-panel #m-blog-tiles.blog-preview-list > li > a.tile::after { display: block; }
.m-menu .m-panel #m-blog-tiles.blog-preview-list > li > a.tile .tile-title {
  text-align: left; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
@media (max-width: 380px) {
  .m-menu .m-panel #m-blog-tiles.blog-preview-list > li > a.tile .tile-icon { width: 24px; height: 24px; flex-basis: 24px; }
}

/* Ke kávě submenu */
.m-menu .m-panel .mega__tiles > li.ke-kave-back-item,
.m-menu .m-panel .mega__tiles > li.ke-kave-heading,
.m-menu .m-panel .mega__tiles > li.ke-kave-view-all { grid-column: 1 / -1; }

.m-menu .m-panel .mega__tiles > li.ke-kave-type-item > a.tile {
  flex-direction: row; align-items: center; justify-content: flex-start; text-align: left; gap: 12px; padding: 12px 16px;
}
.m-menu .m-panel .mega__tiles > li.ke-kave-type-item > a.tile .tile-icon { width: 28px; height: 28px; flex: 0 0 28px; object-fit: contain; }
.m-menu .m-panel .mega__tiles > li.ke-kave-type-item > a.tile .tile-title {
  flex: 1 1 auto; font-size: clamp(16px, 4.3vw, 18px); font-weight: 700; text-align: left;
  line-height: 1.25; white-space: normal; overflow: visible; text-overflow: clip; -webkit-line-clamp: unset;
}
.m-menu .m-panel .mega__tiles > li.ke-kave-heading > a {
  display: flex; align-items: center; gap: 10px; text-decoration: none;
  color: #2a6e2a; font-size: clamp(17px, 4.5vw, 20px); font-weight: 700;
  background: #e8f5e9; border-color: #c8e6c9; border-radius: 12px;
  padding: 12px 16px; width: 100%;
}
.m-menu .m-panel .mega__tiles > li.ke-kave-heading > a img { width: 32px; height: 32px; object-fit: contain; flex-shrink: 0; }
.m-menu .m-panel .mega__tiles > li.ke-kave-view-all > a {
  display: flex; justify-content: flex-end; align-items: center;
  font-size: 13px; color: var(--green); text-decoration: none; font-weight: 600;
  padding: 10px 16px; background: #f0faf0; border-radius: 12px; border-color: #c8e6c9; width: 100%;
}

/* iOS/Safari — scroll lock při otevřeném menu */
html.m-menu-open,
body.m-menu-open { overscroll-behavior: none; height: 100%; }
body.m-menu-open { touch-action: none; }
body.m-menu-open #m-fullscreen-menu,
body.m-menu-open #m-fullscreen-menu * { touch-action: auto; }
#m-fullscreen-menu.m-menu { overscroll-behavior: contain; }
#m-fullscreen-menu .m-menu__panels { overflow-y: auto; -webkit-overflow-scrolling: touch; height: 100%; min-height: 0; }
body.m-menu-open > :not(#m-fullscreen-menu) { pointer-events: none; }
body.m-menu-open.no-scroll { overflow: hidden; }

@supports (-webkit-touch-callout: none) {
  html.m-menu-open, body.m-menu-open { position: relative; }
  #m-fullscreen-menu.m-menu { height: calc(var(--vh, 1vh) * 100); }
}

/* Vypnutí tap efektů v mobilním menu */
#m-fullscreen-menu,
#m-fullscreen-menu *,
#m-fullscreen-menu *::before,
#m-fullscreen-menu *::after {
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  outline: none; box-shadow: none; transition: none;
}
#m-fullscreen-menu a:hover, #m-fullscreen-menu a:active, #m-fullscreen-menu a:focus,
#m-fullscreen-menu button:hover, #m-fullscreen-menu button:active, #m-fullscreen-menu button:focus,
#m-fullscreen-menu .tile:hover, #m-fullscreen-menu .tile:active,
#m-fullscreen-menu .m-cat:hover, #m-fullscreen-menu .m-cat:active {
  background: inherit; border-color: inherit; color: inherit;
  transform: none; box-shadow: none; opacity: 1;
}
@supports (-webkit-touch-callout: none) {
  #m-fullscreen-menu a, #m-fullscreen-menu button,
  #m-fullscreen-menu .tile, #m-fullscreen-menu .m-cat {
    -webkit-tap-highlight-color: rgba(0,0,0,0);
    touch-action: manipulation;
  }
}

/* Mobilní menu zakryje cookie banner i cart banner */
body.m-menu-open #cart-banner { transform: translateY(120%); opacity: 0; pointer-events: none; transition: transform .24s ease, opacity .24s ease; }
body.m-menu-open #cookie-banner { transform: translateY(120%); opacity: 0; pointer-events: none; transition: transform .24s ease, opacity .24s ease; }

/* Tabbar rozšířený (5 kol + content row) */
@media (max-width: 1024px) {
  #m-fullscreen-menu .m-menu__grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 8px 10px; padding: 10px 12px; align-items: start;
    overflow-x: auto; overscroll-behavior-x: contain; -webkit-overflow-scrolling: touch; scrollbar-width: none;
  }
  #m-fullscreen-menu .m-menu__grid::-webkit-scrollbar { display: none; }
  #m-fullscreen-menu .m-menu__grid .m-cat {
    width: 100%; min-width: 0; margin: 0; padding: 8px 4px;
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    background: none; border: 0; box-shadow: none; border-radius: 12px;
  }
  #m-fullscreen-menu .m-menu__grid .m-cat .m-cat-icon { width: 22px; height: 22px; object-fit: contain; }
  #m-fullscreen-menu .m-menu__grid .m-cat span { white-space: nowrap; font-size: 12px; line-height: 1.05; }
  #m-fullscreen-menu .m-menu__grid .m-cat--content {
    grid-row: 2; flex-direction: row; justify-content: flex-start; gap: 8px; padding: 10px 12px;
    background: #fbf6e8; width: auto; flex: 0 0 auto; min-width: max-content;
  }
}
/* ================================================================
   PART 06 — Hero slider, bestsellery, rescue coffee, info ticker
   ================================================================ */

/* -------------------- HERO SLIDER (minimal) -------------------- */
#hero-slider { width: 100%; padding: 0; box-sizing: border-box; margin: 0 0 8px; }
@media (min-width: 601px) { #hero-slider { margin-top: 8px; } }

.slider-viewport { border-radius: 0; overflow: hidden; height: 340px; }
@media (max-width: 600px) { .slider-viewport { height: 275px; } }

.slider-track, #hero-track {
  list-style: none; display: block; margin: 0; padding: 0; overflow: hidden; height: 100%;
}

.slide {
  position: relative; height: var(--slider-h-desktop);
  scroll-snap-align: start; background: #111;
}
@media (max-width: 768px) { .slide { height: var(--slider-h-mobile); } }

.slide-link { display: block; height: 100%; color: inherit; text-decoration: none; }
.slide-img  { width: 100%; height: 100%; object-fit: cover; display: block; }
.slide-caption { display: none; }

/* ── YT slider ── */
.yt-slide {
  display: block; width: 100%; flex: 0 0 100%;
  scroll-snap-align: start; min-width: 0; height: 100%;
}
.yt-card-wrap {
  display: flex; flex-direction: column; width: 100%; height: 100%; min-height: 0;
  background: var(--slide-bg, linear-gradient(135deg,#833ab4,#fd1d1d,#fcb045));
  position: relative; overflow: hidden;
}
.yt-card-wrap::before {
  content: ''; position: absolute; inset: 0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)' opacity='0.05'/%3E%3C/svg%3E");
  opacity: .15; pointer-events: none; z-index: 0; mix-blend-mode: overlay;
}
.yt-card {
  display: flex; align-items: center; justify-content: space-between;
  color: #fff; flex: 1 1 0; min-height: 0; padding: 40px 48px; gap: 28px;
  position: relative; z-index: 1;
}
@media (max-width: 600px) { .yt-card { padding: 22px 18px; gap: 14px; } }

.yt-info { flex: 1; display: flex; flex-direction: column; gap: 10px; max-width: 600px; min-width: 0; }
.yt-meta-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.yt-badge {
  display: inline-block; background: rgba(255,255,255,.22);
  backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
  border: 1px solid rgba(255,255,255,.4); color: #fff; font-size: .72rem; font-weight: 800;
  padding: 4px 12px; border-radius: 999px; text-transform: uppercase; letter-spacing: .07em;
}
.yt-channel-name { font-size: .78rem; font-weight: 700; opacity: .8; text-transform: uppercase; letter-spacing: .07em; }
.yt-title {
  margin: 0; font-size: clamp(1.5rem, 4.5vw, 3rem); font-weight: 900;
  line-height: 1.05; letter-spacing: -0.02em; text-shadow: 0 2px 24px rgba(0,0,0,.25);
  overflow: hidden; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;
}
.yt-desc {
  margin: 0; font-size: clamp(.82rem, 1.3vw, .95rem); font-weight: 400;
  line-height: 1.55; opacity: .8;
  overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
}
.yt-cta-row { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 6px; }
.yt-cta {
  display: inline-block; padding: 11px 26px; border-radius: 999px;
  background: #fff; border: none; color: #111; font-size: .88rem; font-weight: 800;
  white-space: nowrap; cursor: pointer; box-shadow: 0 4px 16px rgba(0,0,0,.2);
  transition: transform .15s, box-shadow .15s; text-decoration: none;
}
.yt-cta:hover        { transform: translateX(3px); box-shadow: 0 6px 24px rgba(0,0,0,.25); }
.yt-cta--ghost       { background: transparent; border: 2px solid rgba(255,255,255,.6); color: #fff; box-shadow: none; font-weight: 600; }
.yt-cta--ghost:hover { background: rgba(255,255,255,.15); transform: none; box-shadow: none; }

.yt-thumb {
  position: relative; z-index: 1; flex-shrink: 0;
  border-radius: 14px; overflow: hidden; box-shadow: 0 12px 36px rgba(0,0,0,.35);
  width: clamp(140px, 22vw, 280px); aspect-ratio: 4/3;
}
.yt-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.yt-thumb--circle {
  background: none; box-shadow: none; border-radius: 0; overflow: visible; aspect-ratio: unset;
  width: clamp(130px, 18vw, 200px); height: clamp(130px, 18vw, 200px);
  display: flex; align-items: center; justify-content: center;
}
.yt-circle-wrap { position: relative; width: 160px; height: 160px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.yt-circle-ring { position: absolute; inset: 0; animation: yt-rotate 12s linear infinite; }
@keyframes yt-rotate { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
.yt-circle-img { width: 62%; height: 62%; border-radius: 50%; overflow: hidden; box-shadow: 0 8px 28px rgba(0,0,0,.4); z-index: 1; flex-shrink: 0; }
.yt-circle-img img { width: 100%; height: 100%; object-fit: cover; display: block; }

@media (max-width: 600px) {
  .yt-thumb { width: 110px; height: 110px; border-radius: 10px; aspect-ratio: unset; }
  .yt-thumb--circle { width: 110px; height: 110px; }
  .yt-title { font-size: clamp(1.2rem, 5.5vw, 1.6rem); letter-spacing: -0.01em; }
  .yt-cta   { padding: 9px 20px; font-size: .82rem; }
}

.yt-ticker { position: relative; z-index: 1; background: rgba(0,0,0,.2); border-top: 1px solid rgba(255,255,255,.12); padding: 7px 0; overflow: hidden; white-space: nowrap; flex-shrink: 0; }
.yt-ticker-inner { display: inline-flex; animation: yt-ticker 20s linear infinite; }
.yt-ticker-inner span { font-size: .73rem; font-weight: 700; color: rgba(255,255,255,.88); letter-spacing: .04em; text-transform: uppercase; padding: 0 24px; }
.yt-ticker-inner span::before { content: '·'; margin-right: 24px; opacity: .45; }
@keyframes yt-ticker { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } }

/* -------------------- INFO TICKER -------------------- */
.info-ticker {
  overflow: hidden; white-space: nowrap; background: #1a1a1a; color: #fff;
  font-size: .85rem; font-weight: 500; padding: 10px 0;
  border-top: 1px solid rgba(255,255,255,.08);
}
.info-ticker--green { background: #2d6a2d; }
.info-ticker--red   { background: #b91c1c; }
.info-ticker__track {
  display: inline-flex; gap: 0;
  animation: info-ticker-scroll 30s linear infinite; will-change: transform;
}
.info-ticker:hover .info-ticker__track { animation-play-state: paused; }
.info-ticker__item { display: inline-block; padding: 0 48px; }
.info-ticker__item::before { content: '✦'; margin-right: 48px; opacity: .5; font-size: .7rem; }
@keyframes info-ticker-scroll { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } }

/* -------------------- BESTSELLERY -------------------- */
#bestsellers {
  position: relative; padding: 2rem 0;
  background: rgba(245,230,200,.3); border-radius: 12px;
}
/* Pseudo-panel jen na desktopu */
@media (min-width: 769px) {
  #bestsellers { background: none; border-radius: 0; }
  #bestsellers::before {
    content: ""; position: absolute; inset: 0;
    left: 50%; transform: translateX(-50%);
    width: min(1100px, 100%); max-width: calc(1100px + 2rem);
    background: rgba(245,230,200,.3); border-radius: 12px; z-index: 0;
  }
}

#bestsellers > h2,
#bestsellers-products {
  position: relative; z-index: 1;
  max-width: 1100px; margin: 0 auto; padding-inline: 1rem;
}

#bestsellers-products {
  display: flex; flex-wrap: nowrap; gap: 1rem;
  overflow-x: auto; overflow-y: hidden;
  scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch;
  scrollbar-width: thin; padding: 0 1rem 0.5rem;
}
#bestsellers-products .product { flex: 0 0 260px; scroll-snap-align: start; }
#bestsellers-products .product:active { transform: scale(0.97); }
#bestsellers-products::-webkit-scrollbar       { height: 8px; }
#bestsellers-products::-webkit-scrollbar-thumb { border-radius: 999px; background: rgba(0,0,0,.15); }

@media (max-width: 768px) {
  #bestsellers-products {
    gap: .75rem; scroll-snap-type: x mandatory;
    scrollbar-width: none;
  }
  #bestsellers-products::-webkit-scrollbar { display: none; }
  #bestsellers-products .product { flex: 0 0 56vw; transition: transform .25s ease; }
}
@media (min-width: 420px) and (max-width: 768px) {
  #bestsellers-products .product { flex-basis: 44vw; }
}

/* -------------------- RESCUE COFFEE -------------------- */
#rescue-coffee { background: none; }
#rescue-coffee .rescue-coffee__panel { background: #fbeaea; border-radius: 16px; padding: 32px 32px 24px; }
#rescue-coffee h2 { margin-top: 0; }
.rescue-coffee__intro,
.rescue-coffee__hint { max-width: 720px; line-height: 1.6; }

#rescue-coffee .rescue-coffee__products {
  display: flex; gap: 1.5rem; overflow-x: auto; overflow-y: hidden;
  scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; padding-bottom: .5rem;
}
#rescue-coffee .rescue-coffee__products .product { flex: 0 0 260px; scroll-snap-align: start; }
#rescue-coffee .rescue-coffee__products::-webkit-scrollbar       { height: 8px; }
#rescue-coffee .rescue-coffee__products::-webkit-scrollbar-thumb { background: rgba(0,0,0,.2); border-radius: 999px; }

#rescue-products .product-image-wrapper { width: 100%; height: 210px; overflow: hidden; border-radius: 14px; }
#rescue-products .product-image-wrapper img { width: 100%; height: 100%; object-fit: cover; display: block; }

@media (max-width: 768px) {
  #rescue-coffee .rescue-coffee__panel { padding: 24px 16px; }
  #rescue-coffee .rescue-coffee__products { gap: .75rem; scrollbar-width: none; }
  #rescue-coffee .rescue-coffee__products::-webkit-scrollbar { display: none; }
  #rescue-coffee .rescue-coffee__products .product { flex: 0 0 56vw; }
}
@media (min-width: 420px) and (max-width: 768px) {
  #rescue-coffee .rescue-coffee__products .product { flex-basis: 44vw; }
}

/* Asistent – výsledky */
#assistant-results,
.assistant-results { display: flex; flex-wrap: wrap; gap: 1.5rem; justify-content: center; }
#assistant-results .product,
.assistant-results .product { flex: 0 0 260px; max-width: 260px; }
#assistant-results .product-image-wrapper,
.assistant-results .product-image-wrapper { width: 100%; height: 210px; overflow: hidden; border-radius: 14px; }
#assistant-results .product-image-wrapper img,
.assistant-results .product-image-wrapper img { width: 100%; height: 100%; object-fit: cover; display: block; }

@media (max-width: 768px) {
  #assistant-results, .assistant-results {
    flex-wrap: nowrap; overflow-x: auto; overflow-y: hidden;
    scroll-snap-type: x proximity; -webkit-overflow-scrolling: touch;
  }
  #assistant-results .product,
  .assistant-results .product { flex: 0 0 56vw; scroll-snap-align: start; }
}
@media (min-width: 420px) and (max-width: 768px) {
  #assistant-results .product,
  .assistant-results .product { flex-basis: 44vw; }
}
/* ================================================================
   PART 07 — Cart drawer (desktop) + mobilní bottom sheet + sticky banner
   ================================================================ */

/* -------------------- CART OVERLAY -------------------- */
.cart-overlay {
  position: fixed; inset: 0;
  background: rgba(0,0,0,.4); opacity: 0; pointer-events: none;
  transition: opacity .2s ease; z-index: 3000;
  touch-action: none;
}
.cart-overlay.is-visible { opacity: 1; pointer-events: auto; }
@media (prefers-reduced-motion: reduce) { .cart-overlay { transition: none; } }

/* Offset košíku kvůli spodním lištám */
body:has(#cart-banner.visible)              { --cart-bottom-offset: var(--h-cart-banner); }
body.cookie-open                            { --cart-bottom-offset: calc(var(--cart-bottom-offset) + var(--h-cookie)); }
body.cookie-open:has(#cart-banner.visible)  { --cart-bottom-offset: calc(var(--h-cart-banner) + var(--h-cookie)); }

/* -------------------- DESKTOP DRAWER (≥ 992px) -------------------- */
@media (min-width: 992px) {
  .cart-drawer {
    position: fixed; top: 0; right: 0;
    width: min(var(--cart-width), 100vw); height: 100vh;
    transform: translateX(100%);
    background: #fff;
    border-top-left-radius: var(--cart-radius); border-bottom-left-radius: var(--cart-radius);
    box-shadow: -8px 0 24px rgba(0,0,0,.14);
    display: flex; flex-direction: column;
    z-index: var(--cart-z-panel);
    transition: transform .28s cubic-bezier(.2,.8,.2,1);
    overflow: hidden;
    pointer-events: auto;
  }
  .cart-drawer.is-open { transform: translateX(0); }

  .cart-drawer__head {
    flex: 0 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 12px;
    padding: 20px 20px 20px 36px; border-bottom: 1px solid #eee; background: #fff;
    position: sticky; top: 0; z-index: 1;
  }
  .cart-title,
  .cart-drawer__head h3 {
    font: 700 1.1rem/1.2 'Inter', system-ui, sans-serif; color: #111;
    margin: 0; padding-left: 0;
  }
  .cart-close {
    border: 0; background: transparent; cursor: pointer;
    font-size: 18px; line-height: 1; color: #999;
    padding: 9px 14px; border-radius: 10px;
    margin-right: 4px;
    transition: color .15s;
    flex-shrink: 0;
  }
  .cart-close:hover { color: #111; }

  .cart-drawer__body {
    flex: 1 1 auto; min-height: 0;
    overflow-y: auto; -webkit-overflow-scrolling: touch;
    padding: 12px 20px 16px 24px; background: #fff;
  }

  .cart-drawer__foot {
    position: sticky; bottom: 0; z-index: 1;
    background: #fafafa; border-top: 1px solid #eaeaea;
    padding: 14px; box-shadow: 0 -4px 12px rgba(0,0,0,.06);
  }

  .m-cart { display: none; }
}

/* Desktop drawer body scroller */
#cart-drawer          { z-index: 3020; pointer-events: auto; }
#cart-drawer-body,
.cart-drawer__body,
.cart-body { overflow: auto; max-height: 100vh; overscroll-behavior: contain; }

/* Při otevřeném draweru schovej sticky banner */
body:has(.cart-drawer.is-open) #cart-banner { transform: translateY(120%); opacity: 0; pointer-events: none; transition: transform .22s ease, opacity .22s ease; }
body:has(.cart-drawer.is-open) #cookie-banner { transform: none; opacity: 1; pointer-events: auto; }

/* -------------------- MOBILNÍ BOTTOM SHEET (≤ 991.98px) -------------------- */
@media (max-width: 991.98px) {
  #cart-drawer { display: none; }

  .m-cart {
    position: fixed; left: 0; right: 0; bottom: 0;
    display: flex; flex-direction: column;
    /* Fullscreen výška */
    height: 100dvh;
    height: 100svh;
    height: calc(var(--vh, 1vh) * 100);
    border-radius: 0; margin-bottom: 0;
    background: #fff;
    box-shadow: 0 -10px 30px rgba(0,0,0,.16);
    /* Closed state */
    transform: translateY(100%); opacity: 0; pointer-events: none;
    transition: transform .28s ease, opacity .2s ease;
    z-index: 3010; will-change: transform;
  }
  .m-cart.is-open { transform: translateY(0); opacity: 1; pointer-events: auto; }

  .m-cart__head {
    position: sticky; top: 0; background: #fff; z-index: 1;
    padding: 10px 12px 8px; border-bottom: 1px solid #eee; flex: 0 0 auto;
  }
  .m-cart__grab   { display: grid; place-items: center; padding-top: 2px; }
  .m-cart__handle { width: 36px; height: 4px; border-radius: 999px; background: #d0d0d0; }
  .m-cart__bar    { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding-top: 6px; }
  .m-cart__title  { font: 700 1rem/1.1 'Inter', system-ui, sans-serif; color: #111; margin: 0; }
  .m-cart__close       { appearance: none; border: 0; background: transparent; padding: 6px 8px; border-radius: 8px; cursor: pointer; color: #777; font-size: 20px; }
  .m-cart__close:hover { color: #000; background: #f3f3f3; }

  .m-cart__body {
    flex: 1 1 auto; min-height: 0;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    touch-action: pan-y;
    padding: 8px 12px 16px;
    max-height: calc(
      100dvh
      - var(--cart-head-h, 0px)
      - var(--cart-foot-h, 0px)
      - env(safe-area-inset-bottom, 0px)
    );
  }

  .m-cart__foot {
    position: sticky; bottom: 0; background: #fff; z-index: 1;
    border-top: 1px solid #eee; padding: 12px;
    padding-bottom: calc(env(safe-area-inset-bottom, 0px) + 12px); flex: 0 0 auto;
  }

  body.cart-open { overflow: hidden; touch-action: auto; }
  body.cart-open #cart-banner { transform: translateY(120%); opacity: 0; pointer-events: none; }

  /* Na mobilu dovol interakce jen na sheet + overlay */
  body.cart-open > :not(.m-cart):not(.cart-overlay) { pointer-events: none; }
}

/* iPhone notch */
@supports (padding-top: env(safe-area-inset-top)) {
  .m-cart__head { padding-top: env(safe-area-inset-top); }
}

/* -------------------- SEZNAM POLOŽEK (sdíleno) -------------------- */
.cart-list              { list-style: none; margin: 0; padding: 0; }
.cart-empty {
  padding: 16px; text-align: center; color: #666; font-weight: 600;
  background: #fbfbfb; border: 1px dashed #e5e5e5; border-radius: 10px;
}

.cart-item {
  display: flex; gap: 12px; padding: 13px 0; border-bottom: 1px solid #f0f0f0;
}
.cart-item:last-child { border-bottom: none; }
/* Jemný hover — pouze světlé pozadí, žádný posun */
.cart-item:hover { background: #fafafa; border-radius: 8px; transition: background .18s ease; }

.cart-item-img {
  flex: 0 0 60px; width: 60px; height: 60px;
  border-radius: 8px; overflow: hidden; background: #f4f4f4;
}
.cart-item-img img { width: 100%; height: 100%; object-fit: cover; display: block; }

.cart-item-info { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; justify-content: flex-start; }

.cart-item-name {
  font-weight: 600; color: #222; font-size: .93rem; line-height: 1.35; margin: 0 0 2px;
  word-break: break-word;
  overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2;
}
.cart-item-variant {
  font-size: .82rem; color: #888; margin-bottom: 6px;
  line-height: 1.4;
}

.cart-item-bottom { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }

.cart-qty         { display: inline-flex; align-items: center; gap: 4px; }
.cart-qty button  { width: 26px; height: 26px; border: 1px solid #ddd; border-radius: 5px; background: #f8f8f8; color: #333; font-weight: 700; cursor: pointer; font-size: .85rem; }
.cart-qty button:hover { background: #eee; }
.cart-qty .qty, .cart-qty .quantity { min-width: 20px; text-align: center; font-weight: 600; color: #333; font-size: .9rem; }

.cart-item-right  { display: flex; align-items: center; gap: 6px; }
.cart-price       { display: inline-flex; align-items: center; gap: .25rem; font-weight: 700; color: #1a7f37; white-space: nowrap; font-size: .95rem; }
.cart-price-old   { text-decoration: line-through; opacity: .6; font-weight: 400; }
.cart-price-new   { font-weight: 700; }
.cart-remove      { appearance: none; border: 0; background: transparent; font-size: 18px; line-height: 1; color: #bbb; cursor: pointer; padding: 2px 4px; }
.cart-remove:hover { color: #d32f2f; }

/* Košíkové odkazy (na produkt) */
#cart-drawer .cart-item-name a,
.m-cart .cart-item-name a { color: inherit; text-decoration: none; }
#cart-drawer .cart-item-name a:focus-visible,
.m-cart .cart-item-name a:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }

@media (max-width: 768px) {
  .cart-item        { flex-direction: row; align-items: flex-start; }
  .cart-item-bottom { flex-direction: column; align-items: flex-start; gap: 6px; }
  .cart-item-right  { justify-content: flex-start; }
}

/* Košík drawer — globální padding hlavičky (pokryje různé HTML struktury) */
#cart-drawer,
.cart-drawer { padding-left: 0; }

#cart-drawer .cart-title,
#cart-drawer h3,
.cart-drawer .cart-title,
.cart-drawer h3 {
  padding-left: 20px;
}

#cart-drawer .cart-close,
.cart-drawer .cart-close {
  margin-right: 8px;
}

/* Varování o max. množství */
.cart-item-max-warning,
.cart-item .cart-max-note,
.cart-max-warning {
  font-size: .8rem; color: #b45309; font-weight: 600;
  background: #fef3c7; border-radius: 6px;
  padding: 3px 8px; margin-top: 4px;
  display: inline-block;
}

/* -------------------- ZÁPATÍ KOŠÍKU -------------------- */
.cart-foot__row {
  display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px;
  font: 700 1.05rem/1.2 'Inter', system-ui, sans-serif; color: #111;
}
.cart-foot__ship        { font: 600 .92rem/1.2 'Inter', system-ui, sans-serif; color: #666; margin-bottom: 10px; }
.cart-foot__ship.is-free { color: #1a7f37; }
.cart-foot__actions     { display: flex; gap: 10px; justify-content: flex-end; flex-wrap: wrap; }

.btn-cart, .btn-checkout {
  appearance: none; border: 0; cursor: pointer;
  padding: .8rem 1.1rem; border-radius: 10px; font-weight: 700;
  transition: transform .1s ease, box-shadow .2s ease, background .25s ease;
}
.btn-cart       { background: #f5f5f5; color: #111; border: 1px solid #e6e6e6; }
.btn-cart:hover { background: #eee; }
.btn-checkout   { background: linear-gradient(145deg, #43B047, #388E3C); color: #fff; box-shadow: 0 6px 14px rgba(0,0,0,.15); }
.btn-checkout:hover { background: linear-gradient(145deg, #388E3C, #2e7031); transform: translateY(-1px); }

@media (max-width: 991.98px) { .btn-cart, .btn-checkout { width: 100%; } }

.cart-note   { margin: 8px 0 0; font-size: .9rem; color: #666; }
.cart-saving { color: #1a7f37; font-weight: 700; }

/* Focus košík */
.cart-qty button:focus-visible,
.cart-remove:focus-visible,
.btn-cart:focus-visible,
.btn-checkout:focus-visible,
.cart-close:focus-visible,
.m-cart__close:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(67,176,71,.22); border-color: #43B047; }

/* Rozpis slev */
.discount-breakdown,
.cart-discounts {
  margin-top: .5rem; font-size: .95rem; line-height: 1.45;
  background: #f7f9f8; border: 1px solid #e4efea; border-radius: .5rem; padding: .75rem;
}
.discount-breakdown .row,
.cart-discounts .row { display: flex; justify-content: space-between; gap: 1rem; }
.discount-breakdown .muted { opacity: .75; }
.cart-discount-info { font-size: .9rem; background: #f7f9f8; border: 1px solid #e4efea; padding: .4rem .6rem; border-radius: .4rem; margin: .35rem 0; }

@media (max-width: 768px) {
  .discount-breakdown,
  .cart-discounts { display: block; }
}

/* -------------------- STICKY BANNER KOŠÍKU -------------------- */
#cart-banner {
  position: fixed; left: 0; right: 0; bottom: 0;
  background: #d5f7d5; color: #111;
  display: none; justify-content: space-between; align-items: center;
  padding: 1rem 2rem; font-weight: 600; z-index: 3000;
  flex-wrap: nowrap; gap: 1rem; box-shadow: 0 -2px 10px rgba(0,0,0,.05);
  transition: transform .24s ease, opacity .24s ease;
  will-change: transform, opacity;
}
#cart-banner.visible { display: flex; }
body.m-menu-open #cart-banner { transform: translateY(120%); opacity: 0; pointer-events: none; }

#cart-banner .cart-banner-top-row { display: flex; align-items: center; gap: .5rem; }
.cart-banner-close { display: none; background: transparent; border: 0; }
#cart-banner-discount { font-size: .9rem; }

#cart-banner button {
  background: linear-gradient(145deg, var(--green), var(--green-d)); color: #fff; border: none;
  padding: .6rem 1.4rem; border-radius: 6px; font-size: 1rem; font-weight: 600; cursor: pointer;
  transition: background .3s ease, transform .1s ease; box-shadow: 0 4px 10px rgba(0,0,0,.1);
}
#cart-banner button:hover { background: linear-gradient(145deg, var(--green-d), #2e7031); transform: scale(1.03); }
#cart-banner span { color: #111; font-weight: 500; font-size: .95rem; }

/* Pokud jsou GDPR + košík otevřeny současně */
body.cookie-open #cart-banner { bottom: 72px; }

/* Mobil */
@media (max-width: 768px) {
  #cart-banner {
    flex-direction: column; align-items: stretch; text-align: center;
    padding: .75rem 1rem 1.1rem; gap: .6rem;
  }
  #cart-banner .cart-banner-top-row {
    position: relative; width: 100%; display: flex; justify-content: center; align-items: center;
    padding-right: 2rem; background: none; border: 0; box-shadow: none; margin: 0;
  }
  #cart-banner .cart-banner-text { font-size: 1rem; font-weight: 600; margin: 0 auto; background: none; }
  #cart-banner .cart-banner-close,
  #cart-banner .cart-banner-close--mobile {
    all: unset; display: block;
    position: absolute; right: .6rem; top: 50%; transform: translateY(-50%);
    font-size: 24px; line-height: 1; color: #000; opacity: .75; cursor: pointer;
  }
  #cart-banner .cart-banner-close:active,
  #cart-banner .cart-banner-close--mobile:active { transform: translateY(-50%) scale(.9); }
  #cart-banner .banner-checkout-button { width: 100%; max-width: 320px; margin: 0 auto; }
  #cart-banner.is-collapsed .cart-banner-top-row,
  #cart-banner.is-collapsed .banner-checkout-button { display: none; }
}

/* Z-indexy */
.site-header, .header, .m-header { z-index: 2000; }
/* ================================================================
   PART 08 — Category bannery, help banner, blog teaser, asistent
   ================================================================ */

/* -------------------- CATEGORY BANNER (zelený) -------------------- */
.category-banner {
  display: flex; justify-content: center;
  margin: clamp(20px, 4vw, 40px) auto;
  padding: 0 clamp(16px, 3vw, 32px);
}
.category-banner > .category-banner__inner {
  max-width: 1600px; width: 100%;
  background: var(--banner-green-bg);
  border: 1px solid var(--banner-green-border); border-radius: 16px;
  box-shadow: 0 4px 12px rgba(0,0,0,.04), inset 0 1px 0 rgba(255,255,255,.6);
  padding: clamp(20px, 3vw, 32px); position: relative; background-clip: padding-box;
}
.category-banner__title {
  font-size: clamp(20px, 1.8vw, 24px); font-weight: 700;
  color: var(--banner-green-accent); margin: 0 0 clamp(12px, 1.5vw, 20px);
}
.category-tiles {
  --gap: clamp(10px, 2vw, 20px);
  display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: var(--gap); list-style: none; padding: 0; margin: 0;
}
.category-tiles .tile {
  display: grid; place-items: center; text-align: center;
  background: #fff; border-radius: 14px; border: 1px solid #eceff1;
  padding: 16px 8px; min-height: 132px; text-decoration: none; color: inherit;
  box-shadow: var(--tile-shadow);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
  outline-offset: 3px;
}
.category-tiles .tile:focus-visible { outline: 2px solid var(--banner-green-accent); }
@media (prefers-reduced-motion: no-preference) {
  .category-tiles .tile:hover {
    transform: translateY(-2px);
    box-shadow: 0 2px 6px rgba(0,0,0,.06), 0 10px 28px rgba(0,0,0,.08);
    border-color: #e0e0e0;
  }
}
.category-tiles .tile .tile-icon  { width: clamp(52px, 5vw, 72px); height: auto; margin-bottom: 8px; }
.category-tiles .tile .tile-title { font-weight: 700; font-size: clamp(14px, 1.2vw, 16px); line-height: 1.25; }

/* -------------------- ORIGIN BANNER (žlutý) -------------------- */
#origin-banner.category-banner {
  margin: clamp(20px, 4vw, 40px) auto; padding: 0 clamp(16px, 3vw, 32px);
  background: transparent; border: 0; width: auto;
}
#origin-banner .category-banner__inner {
  max-width: 1600px; width: 100%; margin: 0 auto;
  padding: clamp(20px, 3vw, 32px);
  background: var(--banner-yellow-bg); border: 1px solid var(--banner-yellow-border);
  border-radius: 16px; box-shadow: 0 4px 12px rgba(0,0,0,.04), inset 0 1px 0 rgba(255,255,255,.6);
}
#origin-banner .category-banner__title { text-align: center; color: var(--banner-yellow-accent); margin-bottom: 1.2rem; }

#origin-tiles.category-tiles--flags {
  display: flex; flex-wrap: nowrap; gap: 8px; padding: 4px 2px 10px; margin: 0;
  list-style: none; justify-content: center;
  overflow-x: auto; overflow-y: hidden;
  scroll-snap-type: x proximity; -webkit-overflow-scrolling: touch;
}
#origin-tiles::-webkit-scrollbar        { height: 8px; }
#origin-tiles::-webkit-scrollbar-thumb  { background: #e5e0b3; border-radius: 999px; }
#origin-tiles                           { scrollbar-color: #e5e0b3 transparent; scrollbar-width: thin; }

#origin-tiles > li { flex: 0 0 120px; }
#origin-tiles .tile {
  width: 100%; aspect-ratio: 1 / 1; padding: 10px 8px;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px;
  border: 1px solid #e7e7e7; border-radius: 12px; background: #fff;
  color: #111; text-decoration: none; font-weight: 600; scroll-snap-align: start;
  transition: background .2s ease, border-color .2s ease, transform .1s ease, box-shadow .2s ease;
}
#origin-tiles .tile:hover { border-color: var(--green); transform: translateY(-3px); box-shadow: 0 6px 16px rgba(0,0,0,.12); }
#origin-tiles .tile .tile-icon { width: 44px; height: 44px; object-fit: contain; display: block; }
#origin-tiles .tile .tile-icon[src$=".svg"] { background: transparent url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==") no-repeat -9999px -9999px; }
#origin-tiles .tile .tile-title {
  font-size: .88rem; line-height: 1.3;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
#origin-tiles .tile.no-flag { background: linear-gradient(0deg,#fff,#fff) padding-box, repeating-linear-gradient(45deg,#eee 0 8px,#f6f6f6 8px 16px) border-box; }
#origin-tiles .tile.no-flag::before { content: "🌍"; font-size: 34px; display: block; margin: 6px 0 8px; opacity: .75; }

@media (max-width: 640px) { #origin-tiles > li { flex: 0 0 110px; } }

/* -------------------- ROASTER BANNER -------------------- */
#roaster-banner.category-banner {
  margin: clamp(20px, 4vw, 40px) auto; padding: 0 clamp(16px, 3vw, 32px);
  background: transparent; border: 0; width: auto;
}
#roaster-banner .category-banner__inner {
  max-width: 1600px; width: 100%; margin: 0 auto;
  padding: clamp(16px, 2.5vw, 24px); background: transparent; border: 0; box-shadow: none;
}
#roaster-banner .category-banner__title { text-align: center; color: var(--green-d); margin: 0 0 1rem; }

#roaster-tiles.category-tiles--roasters {
  display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; padding: 4px; margin: 0; list-style: none;
}
#roaster-tiles > li { flex: 0 0 140px; }
#roaster-tiles .tile {
  width: 100%; aspect-ratio: 3 / 4; padding: 12px 8px 14px;
  display: flex; flex-direction: column; align-items: center; justify-content: flex-start; gap: 8px;
  border: 1px solid #e7e7e7; border-radius: 12px; background: #fff;
  color: #111; text-decoration: none; font-weight: 600;
  transition: background .2s ease, border-color .2s ease, transform .1s ease, box-shadow .2s ease;
}
#roaster-tiles .tile:hover { border-color: var(--green); transform: translateY(-2px); box-shadow: 0 6px 16px rgba(0,0,0,.12); }
#roaster-tiles .tile .tile-icon  { width: 56px; height: 56px; object-fit: contain; display: block; margin-top: 2px; }
#roaster-tiles .tile .tile-title {
  font-size: .9rem; line-height: 1.3; text-align: center;
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4; overflow: hidden;
  min-height: calc(1.3em * 4); color: var(--green-d);
}
@media (max-width: 640px) { #roaster-tiles > li { flex-basis: 120px; } }
@media (max-width: 768px) {
  #roaster-tiles.category-tiles--roasters {
    flex-wrap: nowrap; justify-content: flex-start;
    overflow-x: auto; overflow-y: hidden;
    scroll-snap-type: x proximity; -webkit-overflow-scrolling: touch;
  }
  #roaster-tiles > li { scroll-snap-align: start; }
  #roaster-tiles::-webkit-scrollbar       { height: 8px; }
  #roaster-tiles::-webkit-scrollbar-thumb { background: #d1d1d1; border-radius: 999px; }
  #roaster-tiles { scrollbar-color: #d1d1d1 transparent; scrollbar-width: thin; }
}

/* -------------------- HELP BANNER (lososový) -------------------- */
.help-banner {
  display: flex; justify-content: center;
  margin: clamp(40px, 6vw, 80px) auto; padding: 0 clamp(16px, 3vw, 32px);
}
.help-banner__inner {
  max-width: 1100px; width: 100%;
  background: linear-gradient(180deg, #FEE8DF 0%, #FDD4BF 100%);
  border: 1px solid var(--help-purple-border); border-radius: 16px;
  box-shadow: 0 4px 12px rgba(0,0,0,.04), inset 0 1px 0 rgba(255,255,255,.6);
  padding: clamp(28px, 4vw, 48px); text-align: center;
}
.help-banner__title { font-size: clamp(20px, 1.8vw, 24px); font-weight: 700; color: var(--help-purple-accent); margin: 0 0 8px; }
.help-banner__text  { color: #444; font-size: clamp(15px, 1.2vw, 17px); margin-bottom: 20px; }

.btn-help {
  background: var(--help-purple-accent); color: #fff; border: none;
  border-radius: 8px; padding: 12px 24px; font-weight: 600; font-size: 16px;
  cursor: pointer; transition: background .25s ease, transform .15s ease;
}
.btn-help:hover, .btn-help:focus-visible { background: #9A3E1E; transform: translateY(-1px); outline: none; }
@media (prefers-reduced-motion: reduce) { .btn-help { transition: none; } }

/* Formulář v banneru */
#help-sheet.help-sheet--in-banner { padding: 0; background: transparent; }
.help-banner__inner { padding-left: 0; padding-right: 0; }
#help-sheet.help-sheet--in-banner .container { max-width: none; padding: 0; margin: 0; }
#help-banner .help-sheet.help-sheet--in-banner,
.help-sheet--in-banner .help-card {
  width: 100%; max-width: none; margin: 0; padding: 0;
  border-radius: 0; background: transparent; box-shadow: none; border: 0;
}
.help-sheet--in-banner #help-form { width: 100%; padding: 0; margin: 0; }
.help-sheet--in-banner #help-message,
.help-sheet--in-banner #help-email {
  display: block; width: 100%; max-width: none; box-sizing: border-box;
  border-radius: 8px; border: 1px solid #ccc; padding: .75rem 1rem; font-size: 1rem;
}
.help-sheet--in-banner #help-message { min-height: 130px; resize: vertical; line-height: 1.5; }
.help-sheet--in-banner .help-close   { display: none; }
@media (max-width: 400px) { .help-sheet--in-banner .help-card { padding-inline: 8px; } }

.help-on-product .help-banner--purple { margin-bottom: 0; }
#help-sheet-product.section           { margin-top: 0; }

/* -------------------- BLOG TEASER -------------------- */
.blog-teaser {
  background: #f7f3ee; border-top: 1px solid #efe3d5; border-bottom: 1px solid #efe3d5;
  padding: 2.5rem 0 2.8rem;
}
.blog-teaser__inner {
  max-width: 1120px; margin: 0 auto; padding: 0 1.5rem;
  display: flex; align-items: stretch; justify-content: space-between; gap: 2.5rem;
}
.blog-teaser__text { flex: 1 1 50%; max-width: 520px; align-self: center; }
.blog-teaser__kicker  { margin: 0 0 .35rem; font-size: .8rem; letter-spacing: .16em; text-transform: uppercase; color: #9b8b7a; }
.blog-teaser__title   { margin: .1rem 0 .5rem; font-size: clamp(1.9rem, 3vw, 2.3rem); line-height: 1.2; color: #211811; }
.blog-teaser__subtitle { margin: 0 0 1.3rem; font-size: .98rem; line-height: 1.6; color: #4a4035; }
.blog-teaser__chips   { list-style: none; padding: 0; margin: 0 0 1.4rem; display: flex; flex-wrap: wrap; gap: .4rem; }
.blog-teaser__chips a {
  display: inline-flex; align-items: center; padding: .24rem .8rem; border-radius: 999px;
  font-size: .86rem; background: rgba(255,255,255,.9); border: 1px solid rgba(255,255,255,.95);
  color: #4b4138; text-decoration: none; line-height: 1.2;
  transition: background .18s ease, border-color .18s ease, color .18s ease, transform .16s ease;
}
.blog-teaser__chips a:hover { background: #fff; border-color: rgba(214,176,130,.7); color: #222; transform: translateY(-1px); }
.blog-teaser__cta { margin-top: .2rem; display: inline-flex; align-items: center; gap: .4rem; text-decoration: none; }

.blog-teaser__card {
  position: relative; flex: 1 1 50%; max-width: 420px;
  background: #fdf8f2; border-radius: 20px; overflow: hidden;
  box-shadow: 0 10px 26px rgba(15,23,42,.08); border: 1px solid rgba(15,23,42,.05);
  display: flex; flex-direction: column;
  transition: box-shadow .2s, border-color .2s, transform .2s;
}
.blog-teaser__card-img-wrap { position: relative; overflow: hidden; }
.blog-teaser__card-img-wrap img { width: 100%; height: 220px; object-fit: cover; display: block; transform: scale(1.02); transition: transform .45s ease; }
.blog-teaser__card-body    { padding: 1.15rem 1.4rem 1.4rem; }
.blog-teaser__card-eyebrow { font-size: .78rem; letter-spacing: .12em; text-transform: uppercase; color: #9b8b7a; margin: 0 0 .4rem; }
.blog-teaser__card-title   { margin: 0 0 .35rem; font-size: 1.1rem; color: #211811; }
.blog-teaser__card-meta    { margin: 0 0 .4rem; font-size: .9rem; color: #8d7f72; }
.blog-teaser__card-link    { margin: 0; font-size: .9rem; font-weight: 600; color: #2b2117; }
.blog-teaser__card-overlay { position: absolute; inset: 0; text-indent: -9999px; }

@media (hover: hover) {
  .blog-teaser__card:hover { box-shadow: 0 16px 40px rgba(15,23,42,.14); border-color: rgba(214,176,130,.7); transform: translateY(-2px); }
  .blog-teaser__card:hover img { transform: scale(1.06); }
}
@media (max-width: 899px) {
  .blog-teaser { padding: 2rem 0 2.3rem; }
  .blog-teaser__inner { padding: 0 1rem; flex-direction: column; gap: 1.6rem; }
  .blog-teaser__text  { max-width: none; text-align: left; }
  .blog-teaser__card  { margin-top: .4rem; }
}
@media (max-width: 480px) {
  .blog-teaser__card-body { padding: 1rem 1.1rem 1.2rem; }
  .blog-teaser__card-img-wrap img { height: 200px; }
}

/* -------------------- KÁVOVÝ ASISTENT -------------------- */
.assistant-sheet {
  position: fixed; inset: 0; background: rgba(0,0,0,.4); z-index: 2200;
  display: flex; align-items: center; justify-content: center; padding: 16px;
}
.assistant-sheet.hidden { display: none; }
.assistant-card {
  max-width: 640px; width: 100%; max-height: min(90vh, 720px);
  background: #fff; border-radius: 16px; box-shadow: 0 24px 60px rgba(0,0,0,.22);
  padding: 20px 22px 16px; display: flex; flex-direction: column; position: relative;
}
.assistant-close  { position: absolute; top: 10px; right: 12px; border: none; background: transparent; font-size: 24px; line-height: 1; cursor: pointer; }
.assistant-header h2 { margin: 0 0 .5rem; }
.assistant-subtitle  { margin: 0 0 .75rem; font-size: .95rem; color: #555; }
.assistant-steps { display: flex; gap: 6px; margin-bottom: 1rem; }
.step-dot        { width: 8px; height: 8px; border-radius: 999px; background: #ddd; }
.step-dot.is-active { width: 20px; background: #3c7cff; }
.assistant-step  { display: none; }
.assistant-step.is-active { display: block; }
.assistant-step h3        { margin: 0 0 .5rem; }
.assistant-step-sub       { margin: 0 0 1rem; font-size: .9rem; color: #555; }

.assistant-tiles { display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; }
@media (min-width: 640px) { .assistant-tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

.assistant-tile {
  text-align: left; border-radius: 12px; border: 1px solid #e3e5ea;
  padding: 10px 12px; background: #fafbff; cursor: pointer; font: inherit;
  display: flex; flex-direction: column; gap: 4px;
  transition: box-shadow .15s ease, border-color .15s ease, background .15s ease, transform .08s ease;
}
.assistant-tile strong { font-size: .95rem; }
.assistant-tile span   { font-size: .85rem; color: #555; }
.assistant-tile:hover  { box-shadow: 0 4px 16px rgba(0,0,0,.06); border-color: #c4d0ff; }
.assistant-tile.is-selected { border-color: #3c7cff; background: #f1f4ff; box-shadow: 0 4px 18px rgba(60,124,255,.28); transform: translateY(-1px); }

.assistant-footer { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin-top: 16px; }
.assistant-footer .btn-primary { min-width: 140px; }
.assistant-small { margin-top: 8px; font-size: .8rem; color: #666; }
.assistant-section.hidden { display: none; }
.assistant-intro { margin-bottom: 1rem; }
.assistant-empty { font-size: .95rem; color: #555; }

/* Homepage promo banner asistenta */
.home-assistant-promo      { margin: 2rem 0; }
.home-assistant-promo__link {
  display: block; text-decoration: none; color: inherit; cursor: pointer;
}
.home-assistant-promo__banner {
  flex: 1 1 auto; background: linear-gradient(135deg, #e9ffe9, #d6f5d6);
  padding: 1.8rem 1.2rem; border-radius: 18px; text-align: center;
  box-shadow: 0 6px 20px rgba(163,220,163,.35);
  display: flex; flex-direction: column; justify-content: center;
  transition: transform .18s ease, box-shadow .18s ease, background-color .18s ease;
}
.home-assistant-promo__link:hover .home-assistant-promo__banner { transform: translateY(-2px); }
.home-assistant-promo__title    { font-size: 1.7rem; font-weight: 700; margin-bottom: .4rem; color: #000; }
.home-assistant-promo__subtitle { font-size: 1rem; color: #000; opacity: .85; }
.home-assistant-promo__icon-card { display: none; }
.home-assistant-promo__cta {
  position: relative; display: inline-flex; align-items: center; justify-content: center;
  gap: 10px; margin-top: 18px; padding: 14px 28px; border-radius: 12px;
  background: #2f9e44; color: #fff; font-size: 1.2rem; font-weight: 600;
  letter-spacing: .04em; box-shadow: 0 8px 20px rgba(47,158,68,.18);
  transition: background .15s, gap .2s;
}
.home-assistant-promo__cta::after { content: '→'; display: inline-block; transition: transform .2s; }
.home-assistant-promo__microcopy  { margin-top: 10px; font-size: .95rem; opacity: .75; }
.home-assistant-promo__link:hover .home-assistant-promo__cta { background: #25833a; gap: 16px; }
.home-assistant-promo__link:hover .home-assistant-promo__cta::after { transform: translateX(3px); }

/* Sticky help tlačítko */
.sticky-help-wrap {
  position: fixed; bottom: 24px; right: 24px; z-index: 900;
  display: flex; flex-direction: column; align-items: flex-end; gap: 8px;
}
.sticky-help-btn {
  display: flex; align-items: center; gap: 8px; padding: 12px 20px;
  background: var(--green); color: #fff; border: none; border-radius: 999px;
  font-size: 15px; font-weight: 600; cursor: pointer;
  box-shadow: 0 4px 16px rgba(67,176,71,.35);
  transition: background .15s, transform .15s, box-shadow .15s;
}
.sticky-help-btn svg   { width: 18px; height: 18px; flex-shrink: 0; }
.sticky-help-btn:hover { background: var(--green-d); transform: translateY(-2px); box-shadow: 0 6px 20px rgba(67,176,71,.4); }

.sticky-help-menu {
  display: flex; flex-direction: column; gap: 6px; background: #fff; border-radius: 14px;
  box-shadow: 0 8px 32px rgba(0,0,0,.14); padding: 8px; min-width: 200px;
}
.sticky-help-option {
  display: flex; align-items: center; gap: 10px; padding: 11px 14px;
  border: none; background: transparent; border-radius: 10px;
  font-size: 14px; font-weight: 600; color: #111; cursor: pointer; text-align: left;
  transition: background .12s;
}
.sticky-help-option svg   { width: 18px; height: 18px; flex-shrink: 0; color: var(--green); }
.sticky-help-option:hover { background: #f4faf4; }

@media (max-width: 768px) {
  .sticky-help-btn span { display: none; }
  .sticky-help-btn      { padding: 14px; }
}
/* ================================================================
   PART 09 — Sidebar, ke kávě sekce, discount, misc
   ================================================================ */

/* -------------------- SIDEBAR -------------------- */
.site-layout { display: block; }
.sidebar-open .site-layout {
  display: grid; grid-template-columns: 220px 1fr; align-items: start;
}

.site-sidebar {
  display: none; flex-direction: column;
  position: sticky;
  top: calc(var(--headerH-current) + var(--promo-h, 28px) + 42px);
  background: #fff; border-right: 1px solid #f0f0f0; padding: 16px 0;
}
.sidebar-open .site-sidebar { display: flex; }
.sidebar-open .site-content  { min-width: 0; overflow: hidden; }

@media (max-width: 991px) {
  .site-sidebar { display: none; }
  .sidebar-open .site-layout { display: block; }
}

.sidebar-nav { display: flex; flex-direction: column; }
.sidebar-item__btn {
  display: flex; align-items: center; justify-content: space-between;
  width: 100%; padding: 10px 20px;
  background: none; border: none; font-size: 14px; font-weight: 600; color: #222;
  cursor: pointer; text-align: left; transition: background .12s, color .12s; border-radius: 0;
}
.sidebar-item__btn:hover { background: #f4faf4; color: var(--green-d); }
.sidebar-item__btn[aria-expanded="true"] { color: var(--green-d); }

.sidebar-item__arrow { width: 16px; height: 16px; flex-shrink: 0; transition: transform .2s; color: #bbb; }
.sidebar-item__btn[aria-expanded="true"] .sidebar-item__arrow { transform: rotate(90deg); color: var(--green); }

.sidebar-item__sub {
  list-style: none; margin: 0; padding: 0 0 4px;
  background: #fafafa; border-bottom: 1px solid #f0f0f0;
}
.sidebar-item__sub li a {
  display: flex; align-items: center; gap: 8px;
  padding: 7px 20px 7px 32px; font-size: 13px; color: #444;
  text-decoration: none; transition: background .1s, color .1s;
}
.sidebar-item__sub li a:hover { background: #f0f8f0; color: var(--green-d); }

.sidebar-item__icon { width: 20px; height: 20px; object-fit: contain; flex-shrink: 0; border-radius: 2px; }

.sidebar-help { padding: 16px 12px 8px; margin-top: 16px; border-top: 1px solid #f0f0f0; display: flex; flex-direction: column; gap: 6px; }
.sidebar-help__btn {
  display: flex; align-items: center; gap: 8px; padding: 9px 12px; border: none;
  border-radius: 8px; background: #f4faf4; color: var(--green-d);
  font-size: 13px; font-weight: 600; cursor: pointer; transition: background .12s; text-align: left;
}
.sidebar-help__btn svg     { width: 16px; height: 16px; flex-shrink: 0; }
.sidebar-help__btn:hover   { background: #e8f5e9; }
.sidebar-help__btn--secondary       { background: #f5f5f5; color: #444; }
.sidebar-help__btn--secondary:hover { background: #ebebeb; }

/* Sidebar toggle (skrytý pokud je sidebar otevřen) */
.sidebar-toggle-btn {
  display: none; align-items: center; gap: 8px; padding: 8px 14px; margin: 12px 0 0 16px;
  background: #f4faf4; border: 1px solid #d4edda; border-radius: 8px;
  font-size: 13px; font-weight: 600; color: var(--green-d); cursor: pointer; transition: background .12s;
}
.sidebar-toggle-btn svg   { width: 16px; height: 16px; }
.sidebar-toggle-btn:hover { background: #e8f5e9; }
.has-sidebar:not(.sidebar-open) .sidebar-toggle-btn { display: inline-flex; }

/* -------------------- KE KÁVĚ SEKCE -------------------- */
.ke-kave-section { margin: 0 0 36px; padding-left: 2rem; padding-right: 2rem; }
.ke-kave-featured-section { background: rgba(255,245,200,.15); border: none; border-radius: 0; }
.ke-kave-producer-block { margin-bottom: 36px; }
.ke-kave-producer-block:last-of-type { margin-bottom: 0; }
.ke-kave-producer-block .products { grid-template-columns: repeat(auto-fill, minmax(220px, 260px)); justify-content: start; }
.ke-kave-producer-more { margin-top: 10px; font-size: .9rem; }
.ke-kave-producer-more a { color: #2d6a2d; text-decoration: none; font-weight: 600; }
.ke-kave-producer-more a:hover { text-decoration: underline; }

/* Skupinové nadpisy */
.group-heading         { margin: 1.5rem 0 .75rem; }
.group-heading--linked { margin: 1.5rem 0 .75rem; padding-bottom: 9px; }
.group-heading--linked a {
  display: flex; align-items: center; gap: 10px;
  color: #1a1a1a; text-decoration: none; font-size: 1.1rem; font-weight: 700;
}
.group-heading--linked a::after {
  content: '→'; font-size: .85em; opacity: 0;
  transform: translateX(-4px); transition: opacity .15s, transform .15s; margin-left: auto;
}
.group-heading--linked a:hover             { color: #2d6a2d; }
.group-heading--linked a:hover::after      { opacity: 1; transform: translateX(0); }
.group-heading-logo { width: 36px; height: 36px; object-fit: contain; border-radius: 6px; background: #fff; border: 1px solid #f0ede6; padding: 3px; flex-shrink: 0; }

.ke-kave-more-link { margin-top: 24px; text-align: center; }
.ke-kave-more-btn {
  display: inline-block; min-width: 320px; max-width: 100%; font-size: 1.1rem;
  padding: 1rem 2.4rem; border-radius: 8px;
  background: linear-gradient(145deg, #F97316, #EA580C); border: none;
  color: #fff; font-weight: 700; text-align: center; text-decoration: none;
  box-shadow: 0 6px 16px rgba(234,88,12,.25);
  transition: transform .1s, box-shadow .2s, filter .15s;
}
.ke-kave-more-btn:hover { background: linear-gradient(145deg, #EA580C, #C2410C); color: #fff; transform: translateY(-2px); box-shadow: 0 8px 20px rgba(234,88,12,.35); }
@media (max-width: 480px) { .ke-kave-more-btn { min-width: 0; width: auto; font-size: 1rem; padding: .85rem 1.6rem; } }

/* -------------------- SEO INFOBOX -------------------- */
header.seo-infobox { text-align: left; }

/* -------------------- MISC PATCHY -------------------- */

/* Backdrop viditelný */
.mega-backdrop.is-visible { display: block; }

/* Slim lišta na mobilu — search flex */
.m-header__bar .m-row          { display: flex; align-items: center; }
.m-header__bar .m-search--slim { flex: 1 1 auto; width: auto; min-width: 0; }
.m-header__bar .m-icon-btn     { flex: 0 0 auto; }

/* Bestsellery — obrázek vyplní box */
#bestsellers-products .product-image-wrapper img { width: 100%; height: 100%; object-fit: cover; }
#bestsellers-products .product { flex: 0 0 var(--card-min, 240px); scroll-snap-align: start; }

/* Compact bar subnav */
body.compact-active .r-subnav {
  position: fixed; top: var(--compactH, 52px);
  left: 0; right: 0; height: 0; padding: 0; margin: 0; border: 0; background: transparent; z-index: 1100;
}
body.compact-active .r-subnav .mega {
  position: fixed; left: 0; right: 0; top: var(--compactH, 52px);
  border-top: 3px solid var(--coffee-brown); z-index: 1150;
}

/* ---- SIDEBAR FLYOUT (desktop hover) ---- */
/* ── SIDEBAR FLYOUT ─────────────────────────────────────────── */
#sidebar-flyout {
  display: none;
  position: fixed;
  background: #fff;
  border: 1px solid #e4e4e4;
  border-radius: 0 10px 10px 0;
  box-shadow: 6px 6px 24px rgba(0,0,0,.10);
  z-index: 300;
  padding: 8px 0 12px;
  width: 260px;
  pointer-events: auto;
  transition: opacity .12s ease;
  opacity: 0;
}
#sidebar-flyout.is-visible { display: block; opacity: 1; }
#sidebar-flyout ul { list-style: none; margin: 0; padding: 0; }
#sidebar-flyout .flyout-heading {
  padding: 10px 18px 8px;
  font-size: 10px; font-weight: 700; color: #bbb;
  text-transform: uppercase; letter-spacing: .1em;
  border-bottom: 1px solid #f0f0f0; margin-bottom: 4px;
}
#sidebar-flyout li a {
  display: flex; align-items: center; gap: 10px;
  padding: 8px 18px; font-size: 13.5px; color: #222;
  text-decoration: none; transition: background .1s, color .1s;
}
#sidebar-flyout li a:hover { background: #f4faf4; color: var(--green-d, #1b5e20); }
#sidebar-flyout .flyout-icon {
  width: 22px; height: 22px; object-fit: contain; flex-shrink: 0;
}

/* ── MEGA PANEL — 5 sloupců ─────────────────────────────────── */
#sidebar-flyout .flyout-mega {
  display: grid;
  grid-template-columns: 220px 230px 200px 230px 210px;
  gap: 0; width: 1090px;
}
#sidebar-flyout .flyout-col { border-right: 1px solid #f0f0f0; padding-bottom: 10px; }
#sidebar-flyout .flyout-col:last-child { border-right: none; }
#sidebar-flyout .flyout-col-heading {
  padding: 14px 16px 8px;
  font-size: 10px; font-weight: 700; color: #bbb;
  text-transform: uppercase; letter-spacing: .1em;
  border-bottom: 1px solid #f0f0f0; margin-bottom: 2px;
}
#sidebar-flyout .flyout-mega li a {
  padding: 7px 12px 7px 16px; font-size: 13px; gap: 9px; white-space: nowrap;
}
#sidebar-flyout .flyout-mega .flyout-icon { width: 20px; height: 20px; }

/* Nejprodávanější — číslo */
#sidebar-flyout .flyout-bs-num {
  display: inline-flex; align-items: center; justify-content: center;
  width: 17px; height: 17px; flex-shrink: 0;
  font-size: 10px; font-weight: 700; color: #fff;
  background: var(--green, #2e7d32); border-radius: 50%;
}
#sidebar-flyout .flyout-bs-name {
  flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

/* Sloupec Poradíme vám */
#sidebar-flyout .flyout-col--assistant { background: #f8fdf8; }
#sidebar-flyout .flyout-assistant-body {
  padding: 14px 16px; display: flex; flex-direction: column;
  align-items: center; gap: 10px; text-align: center;
}
#sidebar-flyout .flyout-assistant-icon { font-size: 28px; line-height: 1; }
#sidebar-flyout .flyout-assistant-text { font-size: 12.5px; color: #555; line-height: 1.5; margin: 0; }
#sidebar-flyout .flyout-assistant-btn {
  display: flex; align-items: center; justify-content: center; gap: 6px;
  padding: 9px 14px; border: none; border-radius: 8px;
  background: var(--green, #2e7d32); color: #fff;
  font-size: 13px; font-weight: 600; cursor: pointer; transition: background .12s; width: 100%;
}
#sidebar-flyout .flyout-assistant-btn:hover { background: var(--green-d, #1b5e20); }

/* Flyout se mega rozšíří přes grid */
#sidebar-flyout:has(.flyout-mega) { width: auto; padding: 0; }

@media (max-width: 991px) { #sidebar-flyout { display: none !important; } }


/* ================================================================
   MEGA MENU — .mnav-item (bez konfliktu s globálním .tile)
   Každá položka = mini karta: bílá, border, hover = zelený glow
   ================================================================ */

/* Panel */
.r-subnav .mega {
  position: fixed;
  top: calc(var(--headerH-current) + 41px);
  left: 0; right: 0;
  display: block;
  background: #ffffff;
  border-top: 3px solid var(--green);
  box-shadow: 0 20px 60px rgba(0,0,0,.12), 0 4px 16px rgba(0,0,0,.05);
  z-index: 1150;
  visibility: hidden; pointer-events: none;
  opacity: 0; transform: translateY(-8px);
  transition: opacity .22s ease, transform .22s ease, visibility 0s .22s;
}
.r-subnav .mega[aria-hidden="false"],
.r-subnav .mega.is-open {
  visibility: visible; pointer-events: auto;
  opacity: 1; transform: translateY(0);
  transition: opacity .22s ease, transform .22s ease, visibility 0s 0s;
}

/* Nadpisy sloupců */
.mega__col-title,
.mega__section-title {
  font-size: 11px; font-weight: 700;
  text-transform: uppercase; letter-spacing: .1em;
  color: var(--green); margin: 0 0 14px; padding: 0;
  border-bottom: none;
}
.mega__col-title a, .mega__section-title a { color: inherit; text-decoration: none; }
.mega__col-title a:hover, .mega__section-title a:hover { color: var(--green-d); }

/* Nadpis grid panelů */
.mega__title {
  font-size: 11px; font-weight: 700;
  text-transform: uppercase; letter-spacing: .1em;
  color: var(--green); margin: 0 0 18px;
}
.mega__title-link { color: inherit; text-decoration: none; }
.mega__title-link:hover { color: var(--green-d); }

/* Textové linky (Původ, Pražírny) */
.mega__links { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; }
.mega__links li a {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 12px; border-radius: 10px;
  font-size: 15px; font-weight: 500; color: #1a1a1a;
  text-decoration: none; transition: background .15s, color .15s;
}
.mega__links li a:hover { background: #f0fdf0; color: var(--green-d); }
.mega__links-more {
  font-size: 13px; font-weight: 600; color: var(--green-d);
  display: inline-flex; align-items: center; gap: 4px;
  padding: 8px 12px; border-radius: 8px; text-decoration: none;
  transition: background .15s;
}
.mega__links-more:hover { background: #f0fdf0; }

/* Poradíme vám — karty */
.mega__help-link {
  display: flex; flex-direction: column; gap: 4px;
  padding: 16px 18px; border-radius: 12px;
  background: #fff; border: 1.5px solid #e8e8e8;
  text-decoration: none;
  transition: border-color .18s, box-shadow .18s;
}
.mega__help-link:hover { border-color: var(--green); box-shadow: 0 4px 18px rgba(67,176,71,.14); }
.mega__help-link--secondary { background: #fafafa; border-color: #ebebeb; }
.mega__help-link--secondary:hover { border-color: #aaa; box-shadow: 0 4px 14px rgba(0,0,0,.08); }
.mega__help-title { font-size: 14px; font-weight: 700; color: var(--green-d); }
.mega__help-link--secondary .mega__help-title { color: #333; }
.mega__help-sub { font-size: 12px; color: #999; margin-top: 2px; }

/* ── Káva mega: 4 sloupce ── */
#menu-kava {
  padding: 36px max(36px, calc((100vw - 1200px) / 2)) 40px;
  box-sizing: border-box;
  display: flex;
  align-items: flex-start;
  gap: 0;
}
#menu-kava .mega-kava__tiles-col {
  flex: 1.1; padding-right: 36px;
  border-right: 1px solid #f0f0f0;
}
#menu-kava .mega-kava__right {
  flex: 2.9; display: flex; align-items: flex-start; gap: 0;
}
#menu-kava .mega-kava__right .mega__col {
  flex: 1; padding: 0 32px; border-right: 1px solid #f0f0f0;
}
#menu-kava .mega-kava__right .mega__col:last-child { border-right: none; padding-right: 0; }
#menu-kava .mega__col--help { margin-top: 26px; }

#menu-kava .mega__tiles {
  list-style: none; margin: 0; padding: 0;
  display: flex; flex-direction: column; gap: 4px;
}
#menu-kava .mega__tiles > li { list-style: none; }

/* ── Grid panely: Příslušenství, Pražírny, Ke kávě, Blog ── */
.r-subnav .mega.mega--grid {
  display: block;
  padding: 36px max(36px, calc((100vw - 1200px) / 2)) 40px;
  max-height: none; overflow: visible;
}
.r-subnav .mega.mega--grid .mega__tiles {
  list-style: none; margin: 0; padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
  gap: 6px;
}
.r-subnav .mega.mega--grid .mega__tiles > li { list-style: none; }

/* ══ CORE: .mnav-item — mini karta ══ */
.mnav-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 11px 14px;
  border-radius: 10px;
  background: #fff;
  border: 1px solid #ebebeb;
  text-decoration: none;
  color: #1a1a1a;
  font-size: 15px;
  font-weight: 500;
  line-height: 1.25;
  width: 100%;
  box-sizing: border-box;
  transition: border-color .16s, box-shadow .16s, color .16s;
  cursor: pointer;
}
.mnav-item:hover {
  border-color: var(--green);
  box-shadow: 0 2px 14px rgba(67,176,71,.13);
  color: var(--green-d);
}
.mnav-icon {
  width: 28px; height: 28px;
  object-fit: contain; flex-shrink: 0;
  display: block;
  transition: transform .16s ease;
}
.mnav-item:hover .mnav-icon { transform: translateX(2px); }
.mnav-label {
  font-size: 15px; font-weight: 500;
  display: block; line-height: 1.3;
}

/* Backdrop */
.mega-backdrop {
  position: fixed; inset: 0;
  background: rgba(0,0,0,.06); z-index: 1145;
}

/* Layout bez sidebaru */
.site-layout { display: block; }
.site-content { min-width: 0; width: 100%; }