/* ==========================================================================
   TENTY.CZ – premium overlay (v4) pro Shoptet  |  brand limetka #c9ff0b
   1) styluje injektované sekce z tenty.js (.tt-*)  2) přebarvuje Shoptet chrome
   Vzhled = tenty_TOP. HTML se needituje, jen CSS + JS.
   ========================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;600;700&family=Manrope:wght@400;500;600;700&display=swap');

:root{
  /* ---- SJEDNOCENÍ FONTŮ NA CELÉM WEBU ----
     Shoptet řídí typografii šablony dvěma proměnnými:
       --template-font          → body (kaskádou tedy veškerý text)
       --template-headings-font → h1–h6, .btn, ceny, názvy produktů
     Přepsáním PROMĚNNÝCH (ne plošným font-family) se sjednotí i podstránky
     typu /jak-nakupovat/, /obchodni-podminky/ atd.
     ⚠️ NEDĚLAT přes `* {font-family:...}` – rozbil by se ikonový font Shoptetu,
     který jede přes vlastní `font-family:shoptet` na ::before pseudoprvcích
     (šipky v menu, ikony v košíku, zavírací křížky…).
     Původní hodnoty: "Source Sans 3" / "Exo 2". */
  --template-font:'Manrope';
  --template-headings-font:'Space Grotesk';

  --lime:#c9ff0b; --lime-deep:#aee600; --mint:#eefcc9;
  --ink:#0f1115; --ink-2:#171a20; --ink-3:#0a0c0f;
  --tt-bg:#ffffff; --tt-soft:#f4f6f0;
  --tt-text:#12141a; --tt-muted:#5f6771;
  --tt-line:rgba(16,17,21,.10);
  --tl:#f3f4ef; --tl-muted:rgba(243,244,239,.6);
}

/* ---------- injektované sekce: základ ---------- */
.tt{font-family:'Manrope',system-ui,sans-serif;color:var(--tt-text);line-height:1.6;}
.tt *,.tt *::before,.tt *::after{box-sizing:border-box;}
.tt-wrap{max-width:1220px;margin:0 auto;padding:0 26px;}
.tt h1,.tt h2,.tt h3,.tt .tt-h1,.tt .tt-h2{font-family:'Space Grotesk','Manrope',sans-serif;font-weight:600;line-height:1.05;letter-spacing:-.02em;color:var(--ink);margin:0;}
.tt-eyebrow{display:inline-flex;align-items:center;gap:8px;font-family:'Space Grotesk',sans-serif;font-size:.78rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--tt-muted);}
.tt-eyebrow.tt-dk{color:var(--lime);}
.tt-peak{width:15px;height:12px;flex:none;color:var(--lime);}
.tt-stars{color:#f4c430;letter-spacing:1px;}
.tt-btn{display:inline-flex;align-items:center;gap:.5rem;font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:1rem;
  padding:.9rem 1.5rem;border-radius:12px;border:1.5px solid transparent;cursor:pointer;text-decoration:none;transition:transform .15s,background .15s,color .15s,border-color .15s;}
.tt-btn-lime{background:var(--lime);color:#12141a;}
.tt-btn-lime:hover{background:var(--lime-deep);transform:translateY(-2px);}
.tt-btn-out{background:transparent;border-color:var(--tt-line);color:var(--ink);}
.tt-btn-out:hover{border-color:var(--ink);}
.tt-btn-outd{background:transparent;border-color:rgba(18,20,26,.35);color:#12141a;}
.tt-btn-outd:hover{border-color:#12141a;}
.tt-btn-dark{background:#12141a;color:var(--lime);}
.tt-btn-dark:hover{transform:translateY(-2px);}
.tt-section{padding:86px 0;}
.tt-head{max-width:640px;margin:0 0 42px;}
.tt-head .tt-h2{font-size:clamp(2rem,4vw,3rem);margin:.7rem 0 .5rem;}
.tt-head-p{color:var(--tt-muted);font-size:1.08rem;margin:0;}
.tt-cta-row{display:flex;gap:12px;flex-wrap:wrap;} .tt-cta-row.tt-center{justify-content:center;}

/* ---------- HERO ---------- */
.tt-hero{background:var(--tt-soft);border-bottom:1px solid var(--tt-line);}
.tt-hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:50px;align-items:center;padding:66px 26px 74px;}
.tt-h1{font-size:clamp(2.6rem,5.4vw,4.5rem);margin:.9rem 0 1.1rem!important;}
/* zvýraznění musí končit nad dolním okrajem řádku – jinak při line-height:1.05
   a velkém fontu vyleze pod text a působí jako podtržítko, ne jako highlight */
.tt-hl{background:linear-gradient(transparent 56%,var(--lime) 56%,var(--lime) 90%,transparent 90%);padding:0 .06em;}
.tt-lead{font-size:1.2rem;color:var(--tt-muted);max-width:36ch;margin:0 0 26px;}
.tt-trust{display:flex;flex-wrap:wrap;gap:8px 24px;margin-top:28px;font-size:.92rem;color:var(--tt-muted);}
.tt-trust b{color:var(--ink);}
.tt-datecard{background:var(--ink);color:var(--tl);border-radius:20px;padding:28px;box-shadow:0 40px 70px -40px rgba(15,17,21,.6);}
.tt-datecard h3{color:var(--tl)!important;font-size:1.5rem;margin:0 0 4px!important;}
.tt-sub{color:var(--tl-muted);font-size:.92rem;margin:0 0 20px;}
.tt-fld{display:flex;flex-direction:column;gap:6px;margin-bottom:13px;}
.tt-fld label{font-size:.72rem;letter-spacing:.09em;text-transform:uppercase;color:var(--tl-muted);font-weight:600;font-family:'Space Grotesk';}
.tt-fld input,.tt-fld select{background:var(--ink-2);border:1px solid rgba(243,244,239,.14);color:var(--tl);border-radius:10px;padding:.78rem .9rem;font-family:inherit;font-size:1rem;width:100%;color-scheme:dark;}
.tt-fld input:focus,.tt-fld select:focus{outline:2px solid var(--lime);outline-offset:1px;border-color:transparent;}
.tt-datecard .tt-btn{width:100%;justify-content:center;margin-top:4px;}
.tt-fine{text-align:center;font-size:.8rem;color:var(--tl-muted);margin:12px 0 0;}
.tt-fine a{color:var(--tl);text-decoration:underline;text-underline-offset:2px;}
.tt-fine a:hover{color:var(--lime);}
/* rezervace: řádky po dvou polích */
.tt-fld2{display:flex;gap:12px;}
.tt-fld2 .tt-fld{flex:1;min-width:0;}
/* textarea (poznámka) – stejný vzhled jako input/select */
.tt-fld textarea{background:var(--ink-2);border:1px solid rgba(243,244,239,.14);color:var(--tl);border-radius:10px;padding:.78rem .9rem;font-family:inherit;font-size:1rem;width:100%;resize:vertical;min-height:60px;color-scheme:dark;}
.tt-fld textarea:focus{outline:2px solid var(--lime);outline-offset:1px;border-color:transparent;}
.tt-fld textarea::placeholder,.tt-fld input::placeholder{color:rgba(243,244,239,.35);}
/* povinné pole */
.tt-req{color:var(--lime);}
/* chybová hláška pod formulářem */
.tt-r-err{display:none;margin:0 0 12px;padding:.6rem .8rem;border-radius:10px;background:rgba(229,72,77,.14);border:1px solid rgba(229,72,77,.4);color:#ffb4b6;font-size:.88rem;}
/* přidávací řádek: produkt + počet kusů + tlačítko Přidat */
.tt-addrow{display:flex;gap:8px;margin-bottom:12px;}
/* select musí jít smrštit – jinak ho tlačítko vytlačí (.tt-datecard .tt-btn má width:100%) */
.tt-addrow .tt-r-product{flex:1 1 auto;min-width:0;width:auto;}
.tt-addrow .tt-r-amount{width:78px;flex:none;background:var(--ink-2);border:1px solid rgba(243,244,239,.14);color:var(--tl);border-radius:10px;padding:.72rem .8rem;font-family:inherit;font-size:1rem;}
/* width:auto přebíjí .tt-datecard .tt-btn{width:100%} – jinak tlačítko sežere celý řádek */
.tt-addrow .tt-r-add{flex:none;width:auto!important;margin-top:0!important;white-space:nowrap;justify-content:center;color:var(--tl)!important;border-color:rgba(243,244,239,.35);padding:.72rem 1rem;}
.tt-addrow .tt-r-add:hover{border-color:var(--lime);color:var(--lime)!important;}
.tt-addrow .tt-r-add:disabled{opacity:.5;cursor:not-allowed;}
/* seznam přidaných položek */
.tt-r-list{list-style:none;margin:0 0 14px;padding:0;display:flex;flex-direction:column;gap:6px;}
.tt-r-list:empty{display:none;}
.tt-r-item{display:flex;align-items:center;justify-content:space-between;gap:10px;background:var(--ink-2);border:1px solid rgba(243,244,239,.12);border-left:3px solid var(--lime);border-radius:10px;padding:.6rem .8rem;font-size:.92rem;color:var(--tl);}
.tt-r-item b{color:var(--lime);font-family:'Space Grotesk',sans-serif;}
.tt-r-del{flex:none;width:26px;height:26px;border:0;border-radius:8px;background:rgba(243,244,239,.1);color:var(--tl);font-size:1.1rem;line-height:1;cursor:pointer;transition:background .15s,color .15s;}
.tt-r-del:hover{background:#e5484d;color:#fff;}

/* ---------- MODAL: bezpečnostní kontrola (captcha) před odesláním poptávky ---------- */
.tt-noscroll{overflow:hidden!important;}
.tt-modal{position:fixed;inset:0;z-index:99999;display:flex;align-items:center;justify-content:center;padding:20px;font-family:'Manrope',system-ui,sans-serif;}
.tt-modal-back{position:absolute;inset:0;background:rgba(10,12,15,.8);backdrop-filter:blur(3px);}
.tt-modal-box{position:relative;background:var(--ink);color:var(--tl);border:1px solid rgba(243,244,239,.12);border-radius:20px;padding:30px;width:100%;max-width:420px;box-shadow:0 40px 80px -40px rgba(0,0,0,.8);animation:tt-pop .18s ease-out;}
@keyframes tt-pop{from{opacity:0;transform:translateY(10px) scale(.98);}to{opacity:1;transform:none;}}
.tt-modal-box h3{font-family:'Space Grotesk',sans-serif;font-weight:600;color:var(--tl)!important;font-size:1.4rem;margin:0 0 6px!important;line-height:1.15;}
.tt-modal-box .tt-sub{margin-bottom:18px;}
.tt-modal-x{position:absolute;top:12px;right:12px;width:32px;height:32px;border:0;border-radius:9px;background:rgba(243,244,239,.08);color:var(--tl);font-size:1.4rem;line-height:1;cursor:pointer;transition:background .15s;}
.tt-modal-x:hover{background:rgba(243,244,239,.18);}
/* captcha obrázek + tlačítko na nový kód */
.tt-cap{display:flex;align-items:center;gap:10px;margin-bottom:14px;}
/* captcha je nativně 150×40 – zvětšíme, ať je čitelná i na mobilu */
.tt-cap-img{background:#fff;border-radius:9px;padding:6px 10px;height:58px;width:auto;flex:1;object-fit:contain;max-width:230px;}
.tt-cap-new{flex:none;width:38px;height:38px;border:1px solid rgba(243,244,239,.2);border-radius:9px;background:transparent;color:var(--tl);font-size:1.15rem;line-height:1;cursor:pointer;transition:border-color .15s,color .15s;}
.tt-cap-new:hover{border-color:var(--lime);color:var(--lime);}
.tt-modal .tt-fld{margin-bottom:12px;}
.tt-modal .tt-btn{width:100%;justify-content:center;}
.tt-modal-err{display:none;margin:0 0 12px;padding:.6rem .8rem;border-radius:10px;background:rgba(229,72,77,.14);border:1px solid rgba(229,72,77,.4);color:#ffb4b6;font-size:.88rem;}
/* stav načítání captchy */
.tt-modal.tt-loading .tt-cap-img{opacity:.25;}
.tt-modal.tt-loading .tt-cap-send{opacity:.5;pointer-events:none;}
/* stav po úspěšném odeslání */
.tt-modal-done{display:none;text-align:center;}
.tt-modal.tt-sent .tt-modal-body{display:none;}
.tt-modal.tt-sent .tt-modal-done{display:block;}
.tt-done-ic{width:56px;height:56px;margin:4px auto 16px;border-radius:50%;background:var(--lime);color:var(--ink);font-size:1.9rem;line-height:56px;font-weight:700;}
.tt-modal-done p{color:var(--tl-muted);font-size:.95rem;margin:0 0 20px;}
.tt-modal-done a{color:var(--lime);}
.tt-modal-done .tt-btn-out{color:var(--tl)!important;border-color:rgba(243,244,239,.35);}
.tt-spin{width:18px;height:18px;flex:none;border:2px solid rgba(243,244,239,.3);border-top-color:var(--lime);border-radius:50%;animation:tt-spin .7s linear infinite;}
@keyframes tt-spin{to{transform:rotate(360deg);}}

/* ---------- KATEGORIE ---------- */
.tt-cats{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:205px;gap:16px;}
.tt-cat{position:relative;border-radius:16px;overflow:hidden;color:var(--tl);display:flex;align-items:flex-end;border:1px solid var(--tt-line);text-decoration:none;transition:transform .2s,box-shadow .2s;}
.tt-cat:hover{transform:translateY(-4px);box-shadow:0 28px 50px -32px rgba(15,17,21,.45);}
.tt-ph{position:absolute;inset:0;background:linear-gradient(150deg,#2a2f27,#12141a);}
/* fotka v dlaždici kategorie – vyplní ji a ořízne, ať drží mřížka */
.tt-cat picture{position:absolute;inset:0;display:block;background:linear-gradient(150deg,#2a2f27,#12141a);}
.tt-cat-img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .35s cubic-bezier(.4,0,.2,1);}
.tt-cat:hover .tt-cat-img{transform:scale(1.05);}
.tt-grad{position:absolute;inset:0;background:linear-gradient(to top,rgba(10,12,15,.85),transparent 60%);}
.tt-cat-body{position:relative;padding:20px;display:block;}
.tt-cat-h{color:var(--tl);font-family:'Space Grotesk';font-weight:600;font-size:1.45rem;display:block;}
.tt-cat-s{color:var(--tl-muted);font-size:.86rem;display:block;margin-top:2px;}
.tt-go{position:absolute;top:15px;right:15px;width:36px;height:36px;border-radius:10px;background:rgba(243,244,239,.12);display:flex;align-items:center;justify-content:center;transition:background .18s,color .18s;}
.tt-cat:hover .tt-go{background:var(--lime);color:#12141a;}
.tt-cat--stany{grid-column:span 2;grid-row:span 2;}
.tt-cat--vyb{grid-column:span 2;}

/* ---------- JAK FUNGUJE (dark) ---------- */
.tt-how{background:var(--ink);}
.tt-how .tt-h2{color:var(--tl);} .tt-how .tt-head-p{color:var(--tl-muted);}
.tt-how .tt-head{margin-bottom:54px;}
.tt-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:40px;}
/* Krok: jemná linka přes celou šířku + limetkový úsek jako akcent.
   Dřív byla linka celá limetková přes celou šířku – tři tlusté zelené čáry
   přetahovaly pozornost od nadpisů. */
.tt-step{position:relative;padding-top:30px;border-top:1px solid rgba(243,244,239,.16);}
.tt-step::before{content:"";position:absolute;left:0;top:-1px;width:58px;height:2px;background:var(--lime);}
/* číslo jako limetková destička – navazuje na ikonové chipy v benefit sekci */
.tt-n{display:inline-flex;align-items:center;justify-content:center;
  width:42px;height:42px;border-radius:12px;background:var(--lime);color:var(--ink);
  font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:1.25rem;line-height:1;
  margin-bottom:18px;}
.tt-step-h{color:var(--tl)!important;font-size:1.32rem;margin:0 0 .55rem;line-height:1.2;}
.tt-step p{color:var(--tl-muted);margin:0;font-size:.97rem;line-height:1.65;}

/* ---------- REFERENCE ---------- */
.tt-refs{display:grid;grid-template-columns:1.7fr 1fr;gap:20px;}
.tt-gallery{display:grid;grid-template-columns:repeat(3,1fr);grid-auto-rows:128px;gap:12px;}
.tt-gph{border-radius:12px;background:linear-gradient(150deg,#2e332a,#14161a);position:relative;display:block;overflow:hidden;}
.tt-gph picture{display:block;width:100%;height:100%;}
.tt-gph-img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .35s cubic-bezier(.4,0,.2,1);}
.tt-gph:hover .tt-gph-img{transform:scale(1.06);}
.tt-gph.tt-tall{grid-row:span 2;}
.tt-quote{background:var(--mint);border:1px solid var(--tt-line);border-radius:16px;padding:32px;display:flex;flex-direction:column;justify-content:center;}
.tt-quote .tt-stars{font-size:1.15rem;margin-bottom:12px;}
.tt-quote blockquote{font-family:'Space Grotesk';font-weight:500;font-size:1.4rem;line-height:1.3;margin:0 0 18px;color:var(--ink);}
.tt-quote cite{font-style:normal;font-size:.9rem;color:var(--tt-muted);}

/* ---------- CTA pásek ---------- */
.tt-cta{background:var(--lime);color:#12141a;text-align:center;padding:76px 0;}
.tt-cta .tt-h2{color:#12141a;font-size:clamp(2rem,4.2vw,3.1rem);margin:0 0 .5rem;}
.tt-cta-p{color:#2e3a06;font-size:1.14rem;margin:0 0 26px;}

/* ---------- FAQ ---------- */
.tt-faq{max-width:840px;}
.tt-q{border-bottom:1px solid var(--tt-line);}
.tt-q summary{list-style:none;cursor:pointer;padding:20px 44px 20px 0;position:relative;font-family:'Space Grotesk';font-size:1.2rem;font-weight:600;color:var(--ink);}
.tt-q summary::-webkit-details-marker{display:none;}
.tt-q summary::after{content:"+";position:absolute;right:6px;top:50%;transform:translateY(-50%);font-size:1.6rem;color:var(--ink);}
.tt-q[open] summary::after{content:"\2013";}
.tt-q p{margin:0 0 20px;color:var(--tt-muted);}

/* ---------- responsive injektovaných sekcí ---------- */
@media(max-width:960px){
  .tt-hero-grid{grid-template-columns:1fr;gap:32px;padding:44px 26px 56px;}
  /* 3 sloupce + Stany přes 2 → řádek 1: Stany|Stánky, řádek 2: Slunečníky|Vybavení|Podium.
     Při 2 sloupcích zbylo Podium samo na řádku a vedle něj díra. */
  .tt-cats{grid-template-columns:repeat(3,1fr);grid-auto-rows:190px;}
  .tt-cat--stany{grid-column:span 2;grid-row:span 1;}
  .tt-cat--vyb{grid-column:span 1;grid-row:span 1;}
  .tt-steps{grid-template-columns:1fr;gap:22px;}
  .tt-refs{grid-template-columns:1fr;}
}
@media(max-width:560px){
  /* 2 sloupce: Stany jako široká úvodní karta, pak 2×2. Vyjde přesně na 3 řádky
     bez děr a je to méně scrollování než 5 karet pod sebou. */
  .tt-cats{grid-template-columns:1fr 1fr;grid-auto-rows:168px;gap:12px;}
  .tt-cat--stany{grid-column:span 2;grid-row:span 1;}
  .tt-cat--vyb{grid-column:span 1;grid-row:span 1;}
  .tt-cat-h{font-size:1.2rem;}
  .tt-cat-body{padding:16px;}
  .tt-section,.tt-cta{padding:56px 0;}
  /* poptávkový formulář: na úzkém displeji dvojice polí pod sebe */
  .tt-fld2{flex-direction:column;gap:0;}
  .tt-datecard{padding:22px;}
  /* přidávací řádek: produkt na celou šířku, pod ním počet + tlačítko */
  .tt-addrow{flex-wrap:wrap;}
  .tt-addrow .tt-r-product{flex:1 0 100%;}
  .tt-addrow .tt-r-add{flex:1;}
}
@media(prefers-reduced-motion:reduce){.tt *{transition:none!important;}}

/* ==========================================================================
   PŘEBARVENÍ REÁLNÉHO SHOPTET CHROME (hlavička, nav, carousel, footer…)
   ========================================================================== */
body{background:var(--tt-bg)!important;color:var(--tt-text)!important;font-family:'Manrope',system-ui,sans-serif;}
.content-wrapper,main.content{background:transparent!important;}
.container{max-width:1220px;}
::selection{background:var(--lime);color:#12141a;}

/* Shoptet nadpisy (mimo .tt) */
.homepage-box h2,.welcome-wrapper h1,.welcome-wrapper h2{font-family:'Space Grotesk','Manrope',sans-serif!important;font-weight:600!important;color:var(--ink)!important;letter-spacing:-.02em;}

/* tlačítka Shoptet */
.btn,.btn-primary,button.add-to-cart,.add-to-cart .btn,.search-button,button[type="submit"].btn{
  border-radius:12px!important;font-family:'Space Grotesk',sans-serif!important;font-weight:600!important;
  background:var(--lime)!important;border-color:var(--lime)!important;color:#12141a!important;box-shadow:none!important;text-transform:none!important;}
.btn:hover,.search-button:hover,button.add-to-cart:hover{background:var(--lime-deep)!important;}

/* horní lišta + hlavička – tmavá PŘES CELOU ŠÍŘKU (full-bleed) */
/* overflow-x:clip (ne hidden) → ořízne 100vw full-bleed, ale NEROZBIJE position:sticky */
html,body{overflow-x:clip;}
/* JEN hlavička webu (obsahuje navigaci) – ne produktové/sekční <header> na jiných stránkách! */
header:has(.navigation-wrapper),header:has(.navigation-in){position:relative;background:var(--ink)!important;}
header:has(.navigation-wrapper)::before,header:has(.navigation-in)::before{content:"";position:absolute;top:0;bottom:0;left:50%;transform:translateX(-50%);width:100vw;background:var(--ink);z-index:0;pointer-events:none;}
header:has(.navigation-wrapper) > *,header:has(.navigation-in) > *{position:relative;z-index:1;}
.top-navigation-bar{background:transparent!important;color:var(--tl-muted)!important;border:0!important;border-bottom:1px solid rgba(243,244,239,.08)!important;position:relative;}
.top-navigation-bar::before{content:"";position:absolute;top:0;bottom:0;left:50%;transform:translateX(-50%);width:100vw;background:var(--ink);z-index:0;pointer-events:none;}
.top-navigation-bar > *{position:relative;z-index:1;}
.top-navigation-bar a{color:var(--tl)!important;font-weight:600;}
.top-navigation-bar a:hover{color:var(--lime)!important;}
.navigation-wrapper,.header-top{background:transparent!important;}
.header a{color:var(--tl)!important;} .header a:hover{color:var(--lime)!important;}
.header-top{border-bottom:1px solid rgba(243,244,239,.08)!important;}
/* pryč s „JAK NAKUPOVAT" dropdownem (podmínky/GDPR garbage) */
.top-navigation-menu{display:none!important;}
/* čistý status v horní liště (vkládá tenty.js) */
.tt-status{display:inline-flex;align-items:center;gap:8px;color:var(--tl)!important;font-weight:600;font-size:.85rem;}
.tt-status-dot{width:7px;height:7px;border-radius:50%;background:var(--lime);box-shadow:0 0 0 3px rgba(201,255,11,.2);}
.header-search input,.search-input,input[type="search"]{border-radius:12px!important;border:1px solid rgba(243,244,239,.16)!important;background:var(--ink-2)!important;color:var(--tl)!important;padding-left:14px!important;}
.header-search input::placeholder{color:rgba(243,244,239,.45)!important;}
.header .cart-count,.header-cart .price,.cart-widget-button .price{color:var(--lime)!important;}

/* navigace */
.navigation-in.menu{background:transparent!important;border-bottom:1px solid rgba(243,244,239,.08)!important;}
.navigation-in.menu > ul > li > a{color:var(--tl)!important;font-family:'Space Grotesk',sans-serif!important;font-weight:500!important;font-size:15px!important;text-transform:none!important;padding:15px 15px!important;background:transparent!important;position:relative;}
.navigation-in.menu > ul > li > a:hover,.navigation-in.menu > ul > li.active > a{color:var(--lime)!important;background:transparent!important;}
.navigation-in.menu > ul > li > a::after{content:"";position:absolute;left:15px;right:15px;bottom:8px;height:2px;background:var(--lime);transform:scaleX(0);transform-origin:left;transition:transform .18s;}
.navigation-in.menu > ul > li > a:hover::after,.navigation-in.menu > ul > li.active > a::after{transform:scaleX(1);}

/* carousel + boční bannery (zaoblení + stín, ŽÁDNÉ vlastní šipky) */
.carousel.slide,.carousel-inner,.carousel-inner .item,.carousel-inner .item img{border-radius:18px!important;overflow:hidden!important;}
.carousel-inner .item{box-shadow:0 26px 54px -34px rgba(15,17,21,.5);}
.next-to-carousel-banners .banner-wrapper,.next-to-carousel-banners .banner-wrapper img{border-radius:16px!important;overflow:hidden!important;}
.next-to-carousel-banners .banner-wrapper{box-shadow:0 18px 40px -30px rgba(15,17,21,.45);}
.banners-row{margin:0 -9px!important;} .banners-row .col-sm-8,.banners-row .col-sm-4{padding:0 9px!important;}

/* ── KONZISTENTNÍ VELIKOST BANNERŮ ──────────────────────────────────────────
   Problém: bannery jsou nahrané v různých poměrech stran (1376×768, 901×768,
   1152×768…), takže Shoptet dělal carousel různě vysoký a při přepnutí "skákal".
   Řešení: pevný poměr stran rámu + object-fit:cover → obrázek se vždy vyplní
   a ořízne (mírně "zoomne") do stejného rámu. Rám je pak vždy stejně velký,
   ať do něj Martin nahraje obrázek jakkoli velký. Ořez je veden na střed. */

/* Každý obrázek (carousel i boční bannery) vždy vyplní svůj rám a ořízne se */
.banners-row .carousel-inner .item > a,
.banners-row .col-sm-4 .banner-wrapper > a{display:block!important;width:100%!important;height:100%!important;}
.banners-row .carousel-inner .item img,
.banners-row .col-sm-4 .banner-wrapper img{
  width:100%!important;height:100%!important;object-fit:cover!important;object-position:center!important;
  display:block!important;max-width:none!important;}

/* Carousel: pevný poměr 16:9 (jako správné bannery 1376×768). Přebíjí inline min-height ze Shoptetu. */
.banners-row .col-sm-8 #carousel .carousel-inner{aspect-ratio:16/9!important;min-height:0!important;height:auto!important;}
.banners-row .col-sm-8 .carousel-inner .item{height:100%!important;}
.banners-row .col-sm-8 .carousel-control{max-height:none!important;height:100%!important;}

/* Boční bannery – mobil / fallback: každý má vlastní pevný poměr 16:9 */
.banners-row .col-sm-4 .banner-wrapper{aspect-ratio:16/9!important;overflow:hidden!important;}

/* Desktop (≥768): sloupce stejně vysoké (flex), 2 boční bannery dohromady = výška carouselu */
@media (min-width:768px){
  .banners-row{display:flex!important;align-items:stretch!important;flex-wrap:nowrap!important;}
  .banners-row > .col-sm-8,.banners-row > .col-sm-4{float:none!important;}
  .banners-row .col-sm-4 .next-to-carousel-banners{
    display:flex!important;flex-direction:column!important;gap:18px!important;height:100%!important;}
  .banners-row .col-sm-4 .banner-wrapper{flex:1 1 0!important;min-height:0!important;aspect-ratio:auto!important;}
}

/* benefit bannery – čisté karty s limetkovým proužkem */
.benefitBanner{background:transparent!important;margin:26px 0 6px!important;}
.benefitBanner__item{background:#fff!important;border:1px solid var(--tt-line)!important;border-radius:16px!important;
  padding:22px 20px!important;position:relative;overflow:hidden;display:flex!important;align-items:center;gap:16px!important;
  transition:transform .18s,box-shadow .18s,border-color .18s;}
.benefitBanner__item:hover{transform:translateY(-3px);border-color:rgba(16,17,21,.18)!important;
  box-shadow:0 26px 44px -30px rgba(15,17,21,.45);}
.benefitBanner__item::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--lime);}
/* ikonový chip – tmavý s limetkovou linkovou ikonou */
.benefitBanner__picture{width:52px!important;height:52px!important;flex:none;margin:0!important;
  background:var(--ink)!important;border-radius:14px!important;
  display:flex!important;align-items:center;justify-content:center;transition:transform .18s;}
.benefitBanner__item:hover .benefitBanner__picture{transform:scale(1.06) rotate(-3deg);}
.tt-ben-ic{width:25px;height:25px;color:var(--lime);}
/* skrýt původní PNG, pokud by JS nedoběhl */
.tt-ben .benefitBanner__img{display:none!important;}
.benefitBanner__content{font-family:'Space Grotesk',sans-serif!important;font-size:1.02rem!important;font-weight:600!important;line-height:1.3!important;color:var(--ink)!important;}
.benefitBanner__title{display:block;font-size:1.02rem;}
.benefitBanner__data{font-family:'Manrope',sans-serif!important;font-weight:400!important;font-size:.88rem!important;color:var(--tt-muted)!important;margin-top:2px;}

/* welcome – zviditelnit H1 (SEO) */
.welcome-wrapper h1.sr-only,.welcome-wrapper h1{position:static!important;width:auto!important;height:auto!important;clip:auto!important;overflow:visible!important;margin:0 0 .5rem!important;}

/* footer – tmavý s limetkovými akcenty */
.footer{background:var(--ink-3)!important;color:var(--tl-muted)!important;}
.footer a{color:var(--tl-muted)!important;} .footer a:hover{color:var(--lime)!important;}
/* POZOR: .pageElement__heading NENÍ jen v patičce – Shoptet ji používá i pro nadpis
   v postranním panelu („KATEGORIE") na SVĚTLÉM pozadí. Světlou barvu proto smí dostat
   jen uvnitř patičky, jinak je nadpis bílý na bílém a prakticky neviditelný. */
.footer h3,.footer h4,.footer .footer-title,.footer .pageElement__heading{color:var(--tl)!important;}
.footer h3,.footer h4,.footer .footer-title,.pageElement__heading{font-family:'Space Grotesk',sans-serif!important;font-weight:600!important;text-transform:uppercase;letter-spacing:.1em;}
.sidebar .pageElement__heading{color:var(--tt-muted)!important;font-size:.76rem!important;letter-spacing:.14em;}
.footer-bottom{border-top:1px solid rgba(243,244,239,.1)!important;}

/* ==========================================================================
   DOLADĚNÍ (v5) – horní lišta, košík, výška nav, kategorie, reference, FAQ
   ========================================================================== */

/* --- horní lišta: čistý layout jako base4bikes --- */
.top-navigation-bar .container{display:flex!important;align-items:center;gap:22px;min-height:44px;}
.top-navigation-contacts{display:flex!important;align-items:center;gap:8px 16px;flex-wrap:wrap;color:var(--tl-muted)!important;font-size:.86rem;}
.top-navigation-contacts strong{color:var(--tl)!important;font-weight:700;}
.top-navigation-contacts .project-phone,.top-navigation-contacts .project-phone span{color:var(--lime)!important;font-weight:700;}
.top-navigation-tools{margin-left:auto;display:flex;align-items:center;gap:10px;}
.top-nav-button,.top-nav-button-login,.top-nav-button-login span{color:var(--tl)!important;background:transparent!important;border:0!important;font-weight:600;font-size:.86rem;}
.top-nav-button:hover,.top-nav-button-login:hover span{color:var(--lime)!important;}

/* --- košík: ŽÁDNÝ lime ovál, čistá ikona + text --- */
a.cart-count,.btn.cart-count,.btn.btn-icon.cart-count,.header a.cart-count{
  background:transparent!important;border:0!important;box-shadow:none!important;color:var(--tl)!important;
  padding:8px 4px!important;border-radius:0!important;font-family:'Manrope',sans-serif!important;font-weight:600!important;transform:none!important;}
a.cart-count:hover,a.cart-count:hover .cart-price{background:transparent!important;color:var(--lime)!important;transform:none!important;}
.cart-price{color:var(--tl)!important;}

/* --- výška navigace 38px + VYCENTROVÁNÍ položek (desktop) --- */
/* Menu se lepilo doleva: ul je široké jako container (1220px na 1440px obrazovce),
   ale položky zabraly jen ~925px, takže vpravo zbývalo ~295px prázdna.

   ⚠️ KLÍČOVÉ: centrování MUSÍ být podmíněné třídou .fitted. Tady je proč –
   takhle vypadá Shoptetí shoptet.menu.splitMenu(), který běží při načtení i resize:

       $("#navigation").removeClass("fitted");        // ul se roztáhne na ~140 000 px
       i.each(function(){
         var e = t.outerWidth() + t.offset().left;    // ABSOLUTNÍ pozice položky
         s.unshift({ $el: t, elemPos: e });
       });
       for (t = 0; t < s.length && s[t].elemPos > n.left; t++)   // n = pozice .menu-helper
         s[t].$el.addClass("splitted");               // schová položku do burgeru
       if (0 === t) $("#navigation").addClass("fitted");

   Shoptet si tedy při měření ul dočasně roztáhne na ~140 000 px, aby zjistil
   přirozené šířky položek. Kdyby v tu chvíli platilo justify-content:center,
   položky se v té obří šířce vycentrují na x ≈ 69 531 – což je hluboko za
   burgerem (.menu-helper je na x ≈ 1291) – a podmínka elemPos > n.left pak
   platí pro VŠECHNY položky. Výsledek: celé menu spadne do burgeru i na desktopu.

   Navázáním na .fitted se centrování zapne až POTÉ, co měření doběhlo a Shoptet
   potvrdil, že se všechno vejde. Když se menu nevejde (úzké okno), .fitted se
   nepřidá, centrování se samo nezapne a burger funguje přesně jako dřív.

   Ověřeno na živém webu:
     1440px → fitted, 0/8 v burgeru, mezera 148px vlevo i vpravo (vycentrováno)
      850px → nefitted, 2/8 v burgeru – shodné chování jako bez tohoto CSS

   NEPŘIDÁVAT sem width, display ani flex – ty rozbijí měření úplně stejně. */
@media(min-width:768px){
  #navigation{height:38px!important;left:0;position:relative;}
  .navigation-in.menu > ul > li > a{display:flex;align-items:center;}
  #navigation.fitted .navigation-in.menu > ul.menu-level-1{justify-content:center;}
}

/* --- kategorie: vyvážené (Stany 2×2 + 4 stejné dlaždice) --- */
/* MUSÍ být uzavřené v min-width:961px. Bez toho tahle dvě !important pravidla
   přebila responzivní bloky výš (jsou v souboru dřív) a na mobilu vznikly
   4 sloupce po ~69 px – karty užší než jejich vlastní nadpis. */
@media(min-width:961px){
  .tt-cats{grid-template-columns:repeat(4,1fr)!important;grid-auto-rows:198px!important;}
  .tt-cat--vyb{grid-column:auto!important;grid-row:auto!important;}
}

/* --- reference galerie: čistá vyvážená mřížka --- */
.tt-gallery{grid-template-columns:repeat(3,1fr)!important;grid-auto-rows:158px!important;gap:12px!important;}
.tt-gph.tt-tall{grid-row:auto!important;}
.tt-refs{align-items:stretch;}
.tt-quote{height:100%;}

/* --- FAQ: karty + lime akcent, čistší --- */
.tt-faq .tt-q{border:1px solid var(--tt-line)!important;border-radius:14px;margin-bottom:12px;padding:2px 22px;background:#fff;transition:border-color .2s,box-shadow .2s;}
.tt-faq .tt-q[open]{border-color:var(--lime)!important;box-shadow:0 12px 28px -20px rgba(201,255,11,.4);}
.tt-faq .tt-q summary{padding:20px 40px 20px 0;}
.tt-faq .tt-q summary::after{color:var(--ink)!important;}
.tt-faq .tt-q[open] summary::after{color:var(--lime)!important;}

/* --- odkaz „celý postup rezervace" pod kroky --- */
.tt-how-link{margin-top:52px;text-align:center;}
.tt-how-link a{display:inline-flex;align-items:center;gap:.5rem;color:var(--lime)!important;font-family:'Space Grotesk',sans-serif;font-weight:600;text-decoration:none;border:1.5px solid rgba(201,255,11,.35);border-radius:12px;padding:.8rem 1.5rem;transition:border-color .15s,background .15s;}
.tt-how-link a:hover{border-color:var(--lime);background:rgba(201,255,11,.08);}

/* ==========================================================================
   DOLADĚNÍ (v6) – horní lišta (bílý pruh), footer text, vycentrované FAQ
   ========================================================================== */

/* horní lišta – pryč veškeré zbytky „menu" + žádné bílé pozadí */
.top-navigation-menu,.top-navigation-bar-menu,.top-navigation-bar-menu-helper,.top-navigation-menu-trigger{display:none!important;}
.top-navigation-bar,.top-navigation-bar .container,.top-navigation-contacts,.top-navigation-tools,.responsive-tools{background:transparent!important;}

/* footer – tmavý a čitelný na VŠECH stránkách (ne bílý text na bílé) */
.footer .container,.footer .footer-bottom,.footer-links-icons,.footer-rows,.footer .colorbox-html-content{background:transparent!important;}
.footer{background:var(--ink-3)!important;}
.footer,.footer p,.footer span,.footer li,.footer .footer-bottom,.footer .footer-bottom *{color:var(--tl-muted)!important;}
.footer a{color:var(--tl)!important;} .footer a:hover{color:var(--lime)!important;}

/* FAQ – vycentrované */
.tt-faqsec .tt-head{text-align:center;margin-left:auto;margin-right:auto;}
.tt-faqsec .tt-eyebrow{justify-content:center;}
.tt-faqsec .tt-faq{margin-left:auto;margin-right:auto;}

/* ==========================================================================
   DOLADĚNÍ (v7) – status na STŘED horní lišty + STICKY hlavička (desktop)
   ========================================================================== */

/* --- status („Půjčovna párty stanů Brno · doprava po celé ČR") na střed --- */
.top-navigation-bar .container{position:relative;}
.tt-status{margin:0;}

/* DESKTOP: status absolutně na STŘED, kontakty vlevo, PŘIHLÁŠENÍ+ikony VPRAVO */
@media(min-width:768px){
  .tt-status{
    position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
    white-space:nowrap;pointer-events:none;font-size:.85rem;
  }
  /* přihlášení + ikony NATVRDO úplně vpravo (absolutně, nezávisle na flexu) */
  .top-navigation-contacts{margin-right:auto;}
  .top-navigation-tools{position:absolute;right:0;top:50%;transform:translateY(-50%);margin:0!important;}

  /* STICKY hlavička (jezdí s uživatelem) – jen ≥768. Mobil má vlastní fixní header. */
  #header{
    position:sticky!important;top:0;z-index:901;
    background:var(--ink)!important;
    box-shadow:0 2px 16px rgba(0,0,0,.35);
  }
  .top-navigation-bar{position:relative;z-index:902;}
  /* popup widgety (mini-košík, přihlášení, hledání) nad navigaci */
  #cart-widget.cart-widget,#cart-widget.popup-widget,
  #login.login-widget,#login.popup-widget,
  .user-action-cart.popup-widget,.user-action-login.popup-widget,
  .user-action-search.popup-widget{z-index:10000!important;}
}

/* užší desktop: uvolnit místo pro vycentrovaný text skrytím popisku „Zákaznická podpora:" */
@media(min-width:768px) and (max-width:1100px){
  .top-navigation-contacts strong{display:none;}
  .tt-status{font-size:.8rem;}
}

/* ==========================================================================
   MOBIL (≤767) – vlastní připnutá lišta (.tt-mbar) + čitelné off-canvas menu
   Lišta: Logo | 🔍 | ☎ 🛒 ☰ ; hledání se rozbalí POD lištou. Staví tenty.js.
   ========================================================================== */
.tt-mbar{display:none;}   /* desktop: skrytá, tam běží nativní hlavička + CSS sticky */

@media(max-width:767px){
  /* tagline v liště skrýt */
  .tt-status{display:none!important;}

  /* skrýt nativní mobilní hlavičkové lišty – nahrazuje je .tt-mbar
     (#navigation NECHÁVÁME – off-canvas menu se z něj otevírá) */
  .top-navigation-bar{display:none!important;}
  #header .header-top{display:none!important;}
  #header .menu-helper{display:none!important;}
  #header{background:transparent!important;}
  #header::before{display:none!important;}

  /* ---------- vlastní připnutá lišta ---------- */
  .tt-mbar{
    display:block;position:fixed;top:0;left:0;right:0;z-index:900;
    background:var(--ink);border-bottom:1px solid rgba(243,244,239,.08);
    box-shadow:0 6px 18px rgba(0,0,0,.35);
  }
  .tt-mbar-row{display:flex;align-items:center;gap:6px;min-height:56px;padding:8px 12px;}
  .tt-mbar-l{display:flex;align-items:center;margin-right:auto;text-decoration:none;}
  .tt-mbar-l img{height:34px;width:auto;display:block;}
  .tt-mbar-logotext{font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:1.4rem;color:var(--lime);letter-spacing:.04em;}
  .tt-mbar-r{display:flex;align-items:center;gap:2px;}
  .tt-mi{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;
    border-radius:10px;color:var(--tl)!important;background:transparent!important;border:0;cursor:pointer;
    text-decoration:none;padding:0;transition:color .15s,background .15s;}
  .tt-mi:hover,.tt-mi:active{color:var(--lime)!important;background:rgba(243,244,239,.06)!important;}
  .tt-mbar .tt-mi svg{display:block;}
  .tt-mbar.tt-search-open .tt-mi-search{color:var(--lime)!important;background:rgba(201,255,11,.12)!important;}

  /* ---------- hledání rozbalené POD lištou ---------- */
  .tt-msearch{position:absolute;top:100%;left:0;right:0;background:var(--ink);
    border-bottom:1px solid rgba(243,244,239,.08);box-shadow:0 14px 22px -10px rgba(0,0,0,.55);
    max-height:0;overflow:hidden;padding:0 12px;transition:max-height .25s ease,padding .25s ease;}
  .tt-mbar.tt-search-open .tt-msearch{max-height:96px;padding:12px;}
  .tt-msearch-form{display:flex;gap:8px;}
  .tt-msearch-form input[type="search"]{flex:1;min-width:0;background:var(--ink-2)!important;
    border:1px solid rgba(243,244,239,.16)!important;color:var(--tl)!important;border-radius:10px;
    padding:.72rem .9rem;font-family:'Manrope',sans-serif;font-size:1rem;}
  .tt-msearch-form input[type="search"]::placeholder{color:rgba(243,244,239,.5);}
  .tt-msearch-form input[type="search"]:focus{outline:2px solid var(--lime);outline-offset:1px;border-color:transparent!important;}
  .tt-msearch-form button{flex:none;background:var(--lime)!important;color:#12141a!important;border:0;border-radius:10px;
    font-family:'Space Grotesk',sans-serif;font-weight:600;padding:0 1.1rem;cursor:pointer;}

  /* ---------- OFF-CANVAS MENU: tmavé + světlý čitelný text ---------- */
  #navigation,#navigation .navigation-in,#navigation .navigation-in.menu,
  #navigation .menu-level-1,#navigation .navigationActions{background:var(--ink)!important;}
  #navigation .menu-level-1>li{border-bottom:1px solid rgba(243,244,239,.12)!important;}
  #navigation .menu-level-1>li>a,#navigation .menu-level-1>li>a b,
  #navigation .navigationActions a{color:var(--tl)!important;background:transparent!important;}
  #navigation .menu-level-1>li>a:hover,#navigation .menu-level-1>li.active>a{color:var(--lime)!important;}
  #navigation .menu-level-1>li>a::after{display:none!important;}
  #navigation .navigation-close{color:var(--tl)!important;}
}

/* ==========================================================================
   PRODUKTOVÁ STRÁNKA – počitadlo množství + tlačítko Rezervovat
   ---------------------------------------------------------------------------
   Co dělá Shoptet nativně (main-11.less) a co proti tomu musíme přebít:
     .quantity            display:inline-block; padding-right:30px; position:relative
     .quantity input      height:46px; width:50px; text-align:right; font-family:Arial
     .increase/.decrease  position:absolute; right:0; width:20px; height:23px
                          (naskládané NAD SEBOU vpravo)
     .increase:before     content:"\e911"  ← ikonový font Shoptetu
     .decrease:before     content:"\e90e"
     .increase__sign,
     .decrease__sign      display:none      ← proto nebyla vidět naše +/−
   Přestavujeme to na vodorovné [−][1][+]. Znaménka bereme z VLASTNÍCH spanů
   (__sign) a ikonový font vypínáme – jinak zůstane závislost na fontu, který
   se nemusí načíst (pak se vykreslí prázdné čtverečky).
   POZOR: tlačítkům NESMÍ zůstat position:static – jejich :before je absolutní
   a bez kotvy odletí mimo počitadlo.
   ========================================================================== */
.p-detail .add-to-cart,
.p-info-wrapper .add-to-cart{display:flex!important;align-items:center;gap:12px;flex-wrap:wrap;}

/* kontejner: z inline-blocku s odsazením vpravo → flex řádek */
.add-to-cart .quantity{display:flex!important;align-items:stretch;position:relative;
  width:auto!important;padding:0!important;font-size:1rem!important;line-height:1!important;
  background:var(--tt-soft)!important;border:1px solid var(--tt-line)!important;
  border-radius:12px!important;overflow:hidden;vertical-align:middle;}

/* číslo uprostřed */
.add-to-cart .quantity label{order:2;margin:0!important;display:flex;}
.add-to-cart .quantity input.amount{order:2;
  width:52px!important;min-width:52px!important;height:44px!important;
  border:0!important;background:transparent!important;box-shadow:none!important;
  text-align:center!important;padding:0!important;margin:0!important;
  font-family:'Space Grotesk','Manrope',sans-serif!important;font-weight:600!important;
  font-size:1.05rem!important;color:var(--ink)!important;-moz-appearance:textfield;}
.add-to-cart .quantity input.amount::-webkit-outer-spin-button,
.add-to-cart .quantity input.amount::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;}
.add-to-cart .quantity input.amount:focus{outline:2px solid var(--lime);outline-offset:-2px;}

/* tlačítka: z absolutních naskládaných → segmenty vedle čísla */
.add-to-cart .quantity .decrease,
.add-to-cart .quantity .increase{position:relative!important;
  top:auto!important;right:auto!important;left:auto!important;bottom:auto!important;
  width:40px!important;height:44px!important;padding:0!important;margin:0!important;
  border:0!important;border-radius:0!important;background:transparent!important;
  display:flex!important;align-items:center;justify-content:center;cursor:pointer;
  color:var(--tt-muted)!important;transition:background .15s,color .15s;}
.add-to-cart .quantity .decrease{order:1;border-right:1px solid var(--tt-line)!important;}
.add-to-cart .quantity .increase{order:3;border-left:1px solid var(--tt-line)!important;}
.add-to-cart .quantity .decrease:hover,
.add-to-cart .quantity .increase:hover{background:var(--lime)!important;color:var(--ink)!important;}
.add-to-cart .quantity .decrease:active,
.add-to-cart .quantity .increase:active{background:var(--lime-deep)!important;}

/* vypnout ikonový font a zapnout vlastní znaménka */
.add-to-cart .quantity .decrease::before,
.add-to-cart .quantity .increase::before{content:none!important;display:none!important;}
.add-to-cart .quantity .decrease__sign,
.add-to-cart .quantity .increase__sign{display:block!important;
  font-family:'Space Grotesk','Manrope',sans-serif!important;font-weight:600!important;
  font-size:1.15rem!important;line-height:1!important;}

/* prázdné tooltip spany Shoptetu (position:absolute;right:0) nesmí zasahovat do layoutu */
.add-to-cart .quantity>.increase-tooltip,
.add-to-cart .quantity>.decrease-tooltip{position:absolute!important;right:0!important;top:0!important;
  width:0!important;height:0!important;overflow:hidden!important;opacity:0!important;pointer-events:none!important;}

/* hlavní CTA „Rezervovat" */
.add-to-cart .add-to-cart-button{flex:1;min-width:190px;height:46px;
  background:var(--lime)!important;color:var(--ink)!important;border:0!important;border-radius:12px!important;
  font-family:'Space Grotesk','Manrope',sans-serif!important;font-weight:600!important;font-size:1.02rem!important;
  text-transform:none!important;padding:0 1.6rem!important;cursor:pointer;
  display:inline-flex!important;align-items:center;justify-content:center;
  transition:background .15s,transform .12s,box-shadow .15s;box-shadow:0 12px 24px -14px rgba(160,200,0,.9);}
/* Shoptet lepí před text ikonu košíku (content:"\e910") – u pronájmu nedává smysl */
.add-to-cart .add-to-cart-button::before{content:none!important;display:none!important;margin:0!important;}
.add-to-cart .add-to-cart-button:hover{background:var(--lime-deep)!important;transform:translateY(-1px);
  box-shadow:0 16px 28px -14px rgba(160,200,0,1);}
.add-to-cart .add-to-cart-button:active{transform:translateY(0);}
.add-to-cart .add-to-cart-button:disabled{opacity:.5;cursor:not-allowed;transform:none;}

@media(max-width:520px){
  .add-to-cart .add-to-cart-button{flex:1 0 100%;}
}

/* ==========================================================================
   KONTAKTNÍ BANNER V BOČNÍM PANELU
   HTML se NEMĚNÍ – zůstává původní <div style="font-size:18px"> s <br> a emoji.
   Styluje se zvenčí přes obal banneru, takže Martin nemusí nic přepisovat.
   ========================================================================== */
.sidebar .banner-wrapper{background:var(--ink)!important;color:var(--tl)!important;
  border-radius:16px!important;padding:20px 18px!important;margin:0 0 18px!important;
  position:relative;overflow:hidden;border:0!important;
  box-shadow:0 24px 44px -30px rgba(15,17,21,.6);}
.sidebar .banner-wrapper::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--lime);}

/* typografie uvnitř – přebíjí inline font-size:18px z banneru */
.sidebar .banner-wrapper div[style]{font-size:.95rem!important;line-height:1.75!important;
  font-family:'Manrope',system-ui,sans-serif!important;color:var(--tl)!important;}

/* první řádek („KONTAKT - TENTY.CZ") udělat nadpisem */
.sidebar .banner-wrapper div[style]::first-line{font-family:'Space Grotesk',sans-serif;
  font-weight:600;font-size:.78rem;letter-spacing:.14em;color:var(--lime);}

/* telefony a e-mail zvýraznit – JS je obalí do odkazů (viz linkifySidebar) */
.sidebar .banner-wrapper a{color:var(--tl)!important;text-decoration:none!important;
  font-family:'Space Grotesk',sans-serif!important;font-weight:600!important;
  font-size:1.02rem!important;transition:color .15s;}
.sidebar .banner-wrapper a:hover{color:var(--lime)!important;}
.sidebar .banner-wrapper a[href^="mailto:"]{font-size:.95rem!important;word-break:break-all;}



/* ==========================================================================
   REFERENCE: pás s logy značek
   Do ~4 log se pás vycentruje; jakmile jich bude víc, sám se stane vodorovně
   posuvným (tah prstem / shift+kolečko). Schválně BEZ šipek – u krátkého pásu
   by byly zbytečné ovládání navíc.
   ========================================================================== */
.tt-logos-sec{background:var(--tt-soft);border-top:1px solid var(--tt-line);border-bottom:1px solid var(--tt-line);padding:64px 0;}
.tt-head-c{max-width:none;text-align:center;margin-bottom:34px;}
.tt-head-c .tt-eyebrow{justify-content:center;}

/* posuvná oblast + jemné zastínění okrajů, když obsah přetéká */
.tt-logos-scroll{overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;
  scrollbar-width:none;scroll-snap-type:x proximity;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 28px,#000 calc(100% - 28px),transparent);
          mask-image:linear-gradient(90deg,transparent,#000 28px,#000 calc(100% - 28px),transparent);}
.tt-logos-scroll::-webkit-scrollbar{display:none;}

.tt-logos{display:flex;align-items:stretch;gap:16px;list-style:none;margin:0;padding:4px 28px;
  justify-content:safe center;min-width:min-content;}
.tt-logo{flex:0 0 auto;scroll-snap-align:center;
  width:206px;height:116px;background:#fff;border:1px solid var(--tt-line);border-radius:16px;
  display:flex;align-items:center;justify-content:center;padding:12px 18px;
  transition:transform .18s,box-shadow .18s,border-color .18s;}
.tt-logo:hover{transform:translateY(-3px);border-color:rgba(16,17,21,.18);
  box-shadow:0 22px 38px -28px rgba(15,17,21,.45);}
/* loga mají různé poměry stran (1:1 i 1,9:1) → contain je srovná na stejnou výšku.
   mix-blend-mode:multiply „vypne" nečistě bílé pozadí (Heineken ho má lehce šedé,
   jinak se kolem loga rýsuje obdélník). Funguje jen na ČISTĚ bílé kartě – proto #fff výš. */
.tt-logo img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;display:block;
  mix-blend-mode:multiply;}

@media(max-width:560px){
  .tt-logos-sec{padding:48px 0;}
  .tt-logo{width:164px;height:96px;padding:10px 14px;}
}

/* ==========================================================================
   POPTÁVKA – dvoukrokový formulář
   ========================================================================== */
.tt-fstep[hidden]{display:none!important;}
.tt-fstep{animation:tt-fade .22s ease-out;}
@keyframes tt-fade{from{opacity:0;transform:translateY(6px);}to{opacity:1;transform:none;}}

/* ukazatel postupu */
.tt-prog{margin:0 0 20px;}
.tt-prog-bar{height:3px;border-radius:99px;background:rgba(243,244,239,.14);overflow:hidden;}
.tt-prog-bar span{display:block;height:100%;width:50%;background:var(--lime);border-radius:99px;
  transition:width .28s cubic-bezier(.4,0,.2,1);}
.tt-prog-txt{display:flex;align-items:baseline;gap:8px;margin:9px 0 0;
  font-family:'Space Grotesk',sans-serif;font-size:.72rem;letter-spacing:.09em;text-transform:uppercase;}
.tt-prog-n{color:var(--lime);font-weight:600;}
.tt-prog-l{color:var(--tl-muted);font-weight:500;letter-spacing:.06em;}

/* rekapitulace kroku 1 zobrazená v kroku 2 */
.tt-recap{display:flex;align-items:center;gap:10px;margin:0 0 18px;padding:.7rem .85rem;
  background:var(--ink-2);border:1px solid rgba(243,244,239,.12);border-left:3px solid var(--lime);
  border-radius:11px;font-size:.9rem;color:var(--tl-muted);}
.tt-recap b{color:var(--tl);font-family:'Space Grotesk',sans-serif;font-weight:600;}
.tt-recap-ic{flex:none;width:20px;height:20px;border-radius:50%;background:var(--lime);color:var(--ink);
  font-size:.72rem;font-weight:700;display:flex;align-items:center;justify-content:center;}
.tt-recap>span:nth-child(2){flex:1;min-width:0;}
.tt-recap-edit{flex:none;background:transparent;border:0;padding:0;cursor:pointer;
  font-family:'Space Grotesk',sans-serif;font-size:.78rem;font-weight:600;color:var(--lime);
  text-decoration:underline;text-underline-offset:2px;}
.tt-recap-edit:hover{color:var(--tl);}

/* dvojice tlačítek v kroku 2 – přebíjí .tt-datecard .tt-btn{width:100%} */
.tt-fbtns{display:flex;gap:10px;margin-top:4px;}
.tt-fbtns .tt-btn{margin-top:0!important;}
.tt-fbtns .tt-r-back{width:auto!important;flex:0 0 auto;color:var(--tl)!important;
  border-color:rgba(243,244,239,.35);padding:.9rem 1.1rem;}
.tt-fbtns .tt-r-back:hover{border-color:var(--lime);color:var(--lime)!important;}
.tt-fbtns .tt-r-submit{flex:1;width:auto!important;}

/* náhled poptávky v lokálním náhledu (na živém webu se nezobrazuje) */
.tt-prev-msg{background:var(--ink-2);border:1px solid rgba(243,244,239,.12);border-left:3px solid var(--lime);
  border-radius:11px;padding:.85rem 1rem;margin:0 0 16px;max-height:280px;overflow:auto;
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.78rem;line-height:1.6;
  color:var(--tl);white-space:pre-wrap;word-break:break-word;}
.tt-modal-body code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.85em;color:var(--lime);}

/* formulář bez captchy (přihlášený uživatel) – neukazovat prázdnou kontrolu */
.tt-modal.tt-sending .tt-cap,
.tt-modal.tt-sending .tt-fld,
.tt-modal.tt-sending .tt-cap-send{display:none!important;}
.tt-modal.tt-sending .tt-modal-body::after{content:"";display:block;width:22px;height:22px;margin:6px auto 4px;
  border:2px solid rgba(243,244,239,.25);border-top-color:var(--lime);border-radius:50%;animation:tt-spin .7s linear infinite;}

/* druhý řádek potvrzení („Spěchá to?…") – vlastní řádek s odsazením, ne nalepený text */
.tt-done-call{display:inline-block;margin-top:10px;}


/* ==========================================================================
   DOLADĚNÍ (v8) – mezera nad hero, posuvný pás log, zvýraznění poptávky
   ========================================================================== */

/* --- 1) bílá mezera nad hero na mobilu ---------------------------------
   Shoptet si na mobilu rezervuje místo pro SVOU fixní hlavičku: body dostane
   padding-top 58px a .overall-wrapper dalších 50px. My ale Shoptetí hlavičku
   skrýváme (#header .header-top) a nahrazujeme vlastní lištou .tt-mbar (59px).
   Těch 50px + 19px margin-bottom prázdného #headeru tak zůstalo jako bílý pruh.
   body padding-top 58px NECHÁVÁME – ten kryje právě naši .tt-mbar. */
@media(max-width:767px){
  .overall-wrapper{padding-top:0!important;}
  #header{margin-bottom:0!important;}
}

/* --- 2) pás log: na mobilu se sám posouvá -----------------------------
   Loga se na úzkém displeji nevejdou, takže se pás zastavil uprostřed
   (vidět kus prvního a kus druhého) a uživatel s ním musel tahat prstem.
   Když se obsah nevejde, tenty.js ho zdvojí a zabalí do .tt-logos-track –
   pás pak jede v plynulé smyčce. Když se vejde (desktop), zůstane statický
   a vycentrovaný, takže se na velkém displeji nic nehýbe zbytečně. */
.tt-logos-track{display:flex;width:max-content;will-change:transform;}
.tt-logos-scroll.tt-marquee{overflow-x:hidden;scroll-snap-type:none;}
/* pravý padding = mezera mezi logy, aby šev mezi kopiemi nebyl vidět;
   díky tomu je translateX(-50%) přesně šířka jedné kopie */
.tt-logos-scroll.tt-marquee .tt-logos{padding-left:0;padding-right:16px;justify-content:flex-start;min-width:0;}
.tt-logos-scroll.tt-marquee .tt-logos-track{animation-name:tt-marquee;animation-timing-function:linear;animation-iteration-count:infinite;}
@keyframes tt-marquee{from{transform:translateX(0);}to{transform:translateX(-50%);}}
/* pauza při najetí myší i při doteku – ať se dá logo v klidu prohlédnout */
.tt-logos-scroll.tt-marquee:hover .tt-logos-track,
.tt-logos-scroll.tt-marquee.tt-paused .tt-logos-track{animation-play-state:paused;}
@media(prefers-reduced-motion:reduce){
  .tt-logos-scroll.tt-marquee .tt-logos-track{animation:none;}
  .tt-logos-scroll.tt-marquee{overflow-x:auto;}
}

/* --- 3) poptávka: odsazení pod lištu + limetkové probliknutí ----------
   scroll-margin-top řeší i případ, kdy na stránku někdo přijde rovnou
   s #tt-poptavka v adrese (tam JS do skoku nezasahuje). */
#tt-poptavka{scroll-margin-top:96px;}
@media(max-width:767px){#tt-poptavka{scroll-margin-top:76px;}}

.tt-datecard{position:relative;}
.tt-datecard::after{content:"";position:absolute;inset:-4px;border-radius:24px;pointer-events:none;opacity:0;}
.tt-datecard.tt-glow::after{animation:tt-ring 1.45s cubic-bezier(.22,.61,.36,1) 2;}
@keyframes tt-ring{
  0%{opacity:0;box-shadow:0 0 0 0 rgba(201,255,11,.55),0 0 22px 2px rgba(201,255,11,.45);}
  12%{opacity:1;}
  100%{opacity:0;box-shadow:0 0 0 18px rgba(201,255,11,0),0 0 22px 2px rgba(201,255,11,0);}
}
@media(prefers-reduced-motion:reduce){.tt-datecard.tt-glow::after{animation:none;}}

/* --- 4) poptávka: datová pole přetékala doprava (iOS) ------------------
   Na iPhonu lezla pole „Termín akce od" a „Do" skoro k pravému okraji karty,
   zatímco select i textová pole končily správně na hraně vnitřního odsazení.

   iOS Safari dává input[type=date] vlastní vnitřní (min-content) šířku podle
   formátu data. Jenže nepřeteklo jen to pole – roztáhl se celý řetěz nad ním:
   .tt-fld → .tt-fld2 → .tt-datecard. Karta narostla z 323 na 464 px a vylezla
   ze stránky. Proto samotné max-width:100% na poli NESTAČÍ: procenta se počítají
   z rodiče, který je v tu chvíli taky nafouknutý.

   Viník je `grid-template-columns:1fr` na .tt-hero-grid. `1fr` totiž znamená
   `minmax(auto,1fr)` a to `auto` minimum = min-content, takže široké dítě umí
   sloupec roztáhnout. `minmax(0,1fr)` tohle minimum vynuluje a sloupec drží.
   K tomu min-width:0 na flex článcích řetězu, aby se směly smrštit – teprve
   pak má max-width:100% na poli o co se opřít.

   Ověřeno simulací (poli vnucena šířka 420px): bez fixu karta 464px a přetékala
   stránku, s fixem zůstala na 323px. V Chrome se původní chyba neprojeví,
   je to čistě iOS – proto to prosím zkontroluj na telefonu. */
.tt-hero-grid{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);}
@media(max-width:960px){.tt-hero-grid{grid-template-columns:minmax(0,1fr);}}
.tt-datecard{min-width:0;max-width:100%;}
.tt-fld,.tt-fld2{min-width:0;}
.tt-fld input,.tt-fld select,.tt-fld textarea{max-width:100%;min-width:0;box-sizing:border-box;}
.tt-addrow{min-width:0;}
.tt-addrow .tt-r-product,.tt-addrow .tt-r-amount{max-width:100%;min-width:0;}

/* --- 5) poptávka: datová pole na iOS – oprava PŘÍČINY -------------------
   v32 zkoušela max-width:100% + min-width:0 na poli a minmax(0,1fr) na gridu.
   Nepomohlo to a proč: naše CSS se načítá jako poslední (pravidla tedy platí),
   jenže iOS Safari drží u input[type=date] NATIVNÍ vzhled a v tom režimu si
   pole šířku počítá samo z obsahu – text data plus ikona kalendáře – a CSS
   omezení šířky prostě ignoruje. Proto pole leželo ~20 px za hranou odsazení,
   zatímco select i textová pole končila správně.

   Přepnout ho do normálního boxu umí jedině appearance:none. Teprve pak platí
   width/max-width jako u ostatních polí. K tomu srovnáváme vnitřní části pole
   (shadow DOM), které si nesou vlastní šířku a odsazení.

   Vedlejší efekt appearance:none: pole se zploští (v Chrome z 36 na 30 px,
   ostatní pole mají 33,6). Proto to line-height – root font je 62,5 %, takže
   1.6 × 10px = 16px řádek a s odsazením 2×7,8px a rámečkem vyjde přesně 33,6.
   min-height je pojistka, kdyby iOS řádek počítal jinak. */
.tt-fld input[type="date"],
.tt-fld input[type="time"],
.tt-fld input[type="datetime-local"]{
  -webkit-appearance:none;
  appearance:none;
  display:block;
  width:100%;
  min-width:0;
  max-width:100%;
  box-sizing:border-box;
  line-height:1.6;
  min-height:calc(1.6em + 1.56rem + 2px);
}
/* vnitřek pole: bez vlastního odsazení a zarovnaný vlevo jako ostatní pole */
.tt-fld input[type="date"]::-webkit-date-and-time-value{text-align:left;margin:0;min-width:0;width:100%;}
.tt-fld input[type="date"]::-webkit-datetime-edit{padding:0;}
.tt-fld input[type="date"]::-webkit-datetime-edit-fields-wrapper{padding:0;}
/* ikona kalendáře a čisticí křížek přidávaly šířku navíc */
.tt-fld input[type="date"]::-webkit-calendar-picker-indicator{margin:0;padding:0;}
.tt-fld input[type="date"]::-webkit-inner-spin-button,
.tt-fld input[type="date"]::-webkit-clear-button{-webkit-appearance:none;appearance:none;display:none;margin:0;}
