/*
    Kampaňové bloky editoru stránky (PageBuilder/components/_kampan_*.latte).

    Převzato ze vzorové vánoční landing page Toma Brychty (sufan-vanoce-kategorie_v18.html), třídy sx-
    nechány 1:1, aby šly přenášet další verze. Vynechané je jen to, co patřilo k vlastnímu košíku vzorové
    stránky (toast, stav tlačítka). Nákup obsluhuje komponenta RychlyNakupKampan, úpravy pro ni jsou na konci.
*/
/* ===== ŠUFAN Vánoce – scoped styles ===== */
.sx{
  --sx-ink:#3B2C2F; --sx-ink-2:#3B2C2F; --sx-muted:#6E5C5F;
  --sx-cream:#EDE2DA; --sx-paper:#F5F1ED; --sx-line:#D8C6B7;
  --sx-gold:#C6A25F; --sx-gold-text:#8A6A2E; --sx-olive:#EBECC3;
  --sx-accent:#9C2D32; --sx-on-dark:#E3D6CC;
  --sx-radius:10px;
  --sx-font-sans:"Euclidsquare webs",system-ui,-apple-system,"Segoe UI",sans-serif;
  --sx-font-script:benda,"Euclidsquare webs",sans-serif;
  font-family:var(--sx-font-sans);
  color:var(--sx-ink); -webkit-font-smoothing:antialiased; line-height:1.5;
}
.sx *,.sx *::before,.sx *::after{box-sizing:border-box}
.sx img{max-width:100%;display:block}
.sx h1,.sx h2,.sx h3,.sx p{margin:0}
.sx h1,.sx h2,.sx h3{font-family:var(--sx-font-sans);line-height:1.15;letter-spacing:normal}
.sx ul{margin:0}
.sx a{color:inherit}
.sx-wrap{max-width:1280px;margin:0 auto;padding:0 24px}
.sx-section{margin-top:88px}
.sx-script{font-family:var(--sx-font-script);font-weight:400;line-height:1.1}
.sx h2 .sx-script{font-family:var(--sx-font-script)}
.sx-eyebrow{font-size:30px;color:var(--sx-gold-text)}
.sx-h2{font-size:36px;font-weight:700;letter-spacing:-.01em;line-height:1.1}
.sx-lead{font-size:16px;color:var(--sx-muted)}
.sx-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:16px}
.sx-head-col{display:flex;flex-direction:column;gap:6px}

/* buttons */
.sx-btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 24px;border-radius:4px;
  font:inherit;font-weight:700;font-size:15px;text-decoration:none;cursor:pointer;border:1.5px solid transparent;transition:transform .15s,background .2s}
.sx-btn:hover{transform:translateY(-1px)}
.sx-btn--accent{background:var(--sx-accent);color:#fff}
.sx-btn--dark{background:var(--sx-gold);color:var(--sx-ink)}
.sx-btn--gold{background:var(--sx-gold);color:var(--sx-ink)}
.sx-btn--ghost-light{border-color:var(--sx-ink);color:var(--sx-ink);background:transparent}
.sx-btn--outline{border-color:var(--sx-ink);color:var(--sx-ink);background:#fff}
.sx-btn--white{background:#fff;color:var(--sx-ink)}
.sx-btn--lg{min-height:52px;font-size:16px;padding:0 28px}
.sx-btn--sm{min-height:44px;padding:0 16px;font-size:14px}
.sx a.sx-btn--accent{color:#fff}
.sx a.sx-btn--dark{color:var(--sx-ink)}

.sx-btn:focus-visible,.sx-chip:focus-visible{outline:2px solid var(--sx-ink);outline-offset:2px}

/* badges */
.sx-badge{display:inline-block;font-size:11px;font-weight:500;padding:4px 8px;border-radius:3px;line-height:1.2}
.sx-badge--new{background:var(--sx-accent);color:#fff}
.sx-badge--lim{background:var(--sx-gold);color:var(--sx-ink)}
.sx-badge--only{background:var(--sx-gold);color:var(--sx-ink)}
.sx-badge--soon{background:#fff;color:var(--sx-ink)}

/* ===== HERO ===== */
.sx-hero{margin-top:16px}
.sx-hero-box{background:var(--sx-gold);border-radius:12px;overflow:hidden;display:flex;flex-wrap:wrap;position:relative}
.sx-hero-copy{flex:1 1 460px;padding:64px 56px 56px;color:var(--sx-ink);display:flex;flex-direction:column;gap:22px;position:relative;z-index:1}
.sx-hero-copy .sx-script{font-size:44px;color:var(--sx-ink)}
.sx-hero h1{font-size:58px;line-height:1.03;font-weight:700;letter-spacing:-.02em;color:var(--sx-ink)}
.sx-hero p{font-size:19px;line-height:1.55;color:var(--sx-ink);max-width:470px}
.sx-hero-ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:6px}
.sx-usp{display:flex;flex-wrap:wrap;gap:10px 28px;margin-top:14px;padding-top:22px;border-top:1px solid rgba(17,17,17,.2);font-size:14px;color:var(--sx-ink);list-style:none;padding-left:0;margin-bottom:0}
.sx-usp li{display:flex;align-items:center;gap:8px}
.sx-star{position:absolute;fill:#fff}

/* ===== QUICK NAV ===== */
.sx-quick{margin-top:40px;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:16px}
.sx-tile{text-decoration:none;background:var(--sx-paper);border-radius:10px;padding:18px 16px 16px;display:flex;flex-direction:column;gap:8px;align-items:center;text-align:center;transition:transform .25s}
.sx-tile:hover{transform:translateY(-3px)}
.sx-tile img,.sx-tile .sx-tile-ico{width:104px;height:104px;object-fit:contain;display:flex;align-items:center;justify-content:center}
.sx-tile span{font-weight:700;font-size:16px}
.sx-tile--dark{background:var(--sx-gold);color:var(--sx-ink)}
.sx a.sx-tile--dark{color:var(--sx-ink)}

/* ===== SPOTLIGHT ===== */
.sx-spot{background:var(--sx-cream);border-radius:12px;padding:48px;display:flex;flex-wrap:wrap;gap:40px;align-items:center}
.sx-spot-copy{flex:1 1 340px;display:flex;flex-direction:column;gap:16px;align-items:flex-start}
.sx-spot h2{font-size:44px;line-height:1.05;font-weight:700;letter-spacing:-.015em}
.sx-spot h2 .sx-script{display:block;font-size:52px;color:var(--sx-gold-text)}
.sx-spot p{font-size:17px;line-height:1.6;color:var(--sx-ink-2);max-width:420px}
.sx-spot-buy{display:flex;flex-wrap:wrap;align-items:center;gap:14px 20px;margin-top:8px}
.sx-spot-buy small{font-size:14px;color:var(--sx-ink-2)}
.sx-spot-grid{flex:2 1 560px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.sx-mini{background:#fff;border-radius:10px;padding:18px;display:flex;flex-direction:column;gap:6px;text-decoration:none}
.sx-mini img{width:100%;height:180px;object-fit:contain}
.sx-mini-kind{font-size:12px;color:var(--sx-gold-text);font-weight:700;text-transform:uppercase;letter-spacing:.06em}
.sx-mini h3{font-size:17px;font-weight:700}
.sx-mini-row{display:flex;justify-content:space-between;align-items:baseline;font-size:14px;color:var(--sx-muted)}
.sx-mini-row strong{font-size:18px;color:var(--sx-ink)}

/* set rohlíčků (převzato z Jirkovy verze) */
.sx-bundle{margin-top:12px;background:var(--sx-accent);color:#fff;border-radius:10px;padding:14px 20px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 24px;position:relative}
.sx-bundle::before{content:"";position:absolute;top:-6px;left:50%;width:12px;height:12px;background:var(--sx-accent);transform:translateX(-50%) rotate(45deg)}
.sx-bundle-copy{flex:1 1 260px;display:flex;flex-direction:column;gap:2px}
.sx-bundle-copy .sx-script{font-size:24px;color:#fff;line-height:1.15}
.sx-bundle-price{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.sx-bundle-price s{font-size:15px;color:#F6E3E3}
.sx-bundle-price strong{font-size:26px;line-height:1;font-weight:700}
.sx-bundle-price em{font-style:normal;font-size:13px;font-weight:700;background:var(--sx-olive);color:var(--sx-ink);border-radius:4px;padding:5px 9px}
.sx-bundle .sx-btn{white-space:nowrap;min-height:44px;font-size:15px;padding:0 20px}
.sx-spot>.sx-bundle{flex:1 1 100%;margin-top:-28px}

/* ===== LISTING ===== */
.sx-sort{display:flex;align-items:center;gap:10px}
.sx-sort label{font-size:14px;color:var(--sx-muted);margin:0;display:inline}
.sx-sort select{min-height:44px;padding:0 14px;border:1px solid var(--sx-line);border-radius:12px;background:#fff;color:var(--sx-ink);font:inherit;font-size:15px}
.sx-chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.sx-chip{min-height:44px;padding:0 20px;border-radius:4px;font:inherit;font-size:15px;font-weight:600;cursor:pointer;background:#fff;color:var(--sx-ink);border:1.5px solid var(--sx-line);transition:background .2s,color .2s,border-color .2s}
.sx-chip[aria-pressed="true"]{background:var(--sx-gold);color:var(--sx-ink);border-color:var(--sx-gold)}
.sx-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px 18px;margin-top:28px}
.sx-card{display:flex;flex-direction:column;gap:10px}
.sx-card[hidden]{display:none}
.sx-card-img{position:relative;background:var(--sx-paper);border-radius:10px;aspect-ratio:1/1;overflow:hidden;display:flex;align-items:center;justify-content:center}
.sx-card-img img{width:86%;height:86%;object-fit:contain;transition:transform .35s ease}
.sx-card:hover .sx-card-img img{transform:scale(1.04)}
.sx-card-img .sx-badge{position:absolute;top:12px;left:12px}
.sx-card-body{display:flex;flex-direction:column;gap:4px;padding:0 4px}
.sx-rating{font-size:13px;color:var(--sx-muted);display:flex;align-items:center;gap:4px}
.sx-rating span:first-child{color:var(--sx-gold);letter-spacing:1px}
.sx-card h3{font-size:16px;font-weight:700;line-height:1.3}
.sx-card h3 a{text-decoration:none}
.sx-card-weight{font-size:14px;color:var(--sx-muted)}
.sx-card-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:0 4px;margin-top:auto}
.sx-price{font-size:19px;font-weight:700}
.sx-promo{text-decoration:none;background:var(--sx-accent);border-radius:10px;padding:28px 24px;display:flex;flex-direction:column;justify-content:space-between;gap:18px;min-height:340px}
.sx a.sx-promo{color:#fff}
.sx-promo .sx-script{font-size:34px}
.sx-promo strong{display:block;font-size:26px;line-height:1.1}
.sx-promo-desc{display:block;font-size:15px;line-height:1.5;color:#F6E3E3;margin-top:10px}
.sx-promo .sx-btn{align-self:flex-start}
.sx-promo--all{background:#EDE2DA}
.sx a.sx-promo--all{color:var(--sx-ink)}
.sx-promo--all .sx-promo-desc{color:var(--sx-ink)}
.sx-empty{display:none;margin-top:24px;color:var(--sx-muted)}

/* ===== PRO KOHO ===== */
.sx-center{text-align:center;display:flex;flex-direction:column;gap:6px;align-items:center}
.sx-who{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin-top:32px}
.sx-who a{text-decoration:none;border-radius:var(--sx-radius);padding:26px 24px 0;display:flex;flex-direction:column;gap:6px;overflow:hidden;transition:transform .25s}
.sx-who a:hover{transform:translateY(-3px)}
.sx-who strong{font-size:22px}
.sx-who span{font-size:15px;color:var(--sx-ink-2)}
.sx-who-img{display:flex;justify-content:center;align-items:flex-end;height:190px;margin-top:10px}
.sx-who-img img{width:160px;height:160px;object-fit:contain}
.sx-who-img img+img{margin-left:-28px}
.sx-who .w1{background:var(--sx-olive)} .sx-who .w2{background:var(--sx-cream)} .sx-who .w3{background:var(--sx-paper)}
.sx-who .w4{background:var(--sx-gold);color:var(--sx-ink)} .sx-who .w4 span{color:var(--sx-ink)}
.sx-who .w4 img{width:190px;height:170px;border-radius:8px 8px 0 0}

/* ===== BOXY ===== */
.sx-boxes{background:var(--sx-gold);color:var(--sx-ink);margin-top:88px}
.sx-boxes .sx-wrap{padding-top:72px;padding-bottom:72px}
.sx-boxes .sx-script{font-size:36px;color:var(--sx-ink)}
.sx-boxes h2{color:var(--sx-ink);font-size:40px}
.sx-boxes p{color:var(--sx-ink);font-size:17px;max-width:560px}
.sx-boxes-link{color:var(--sx-ink)!important;font-weight:700;font-size:15px}
.sx-boxes-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin-top:36px}
.sx-box{background:#fff;border-radius:12px;padding:18px 18px 22px;display:flex;flex-direction:column;gap:10px}
.sx-box-img{background:var(--sx-cream);border-radius:10px;aspect-ratio:4/3.4;display:flex;align-items:center;justify-content:center;position:relative}
.sx-box-img img{width:82%;height:88%;object-fit:contain}
.sx-box-img .sx-badge{position:absolute;top:12px;left:12px;background:var(--sx-gold);color:var(--sx-ink)}
.sx-box h3{font-size:20px;color:var(--sx-ink);margin-top:4px}
.sx-box h3 a{text-decoration:none}
.sx-box .sx-rating{color:var(--sx-muted)}
.sx-box-foot{display:flex;justify-content:space-between;align-items:center;margin-top:auto;gap:8px}
.sx-box-foot strong{font-size:20px;color:var(--sx-ink)}

/* ===== BRZY SKLADEM ===== */
.sx-soon .sx-script{font-size:32px;color:var(--sx-accent)}
.sx-soon-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:28px}
.sx-soon-item{display:flex;flex-direction:column;gap:10px}
.sx-soon-img{background:var(--sx-paper);border-radius:10px;aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;position:relative}
.sx-soon-img img{width:84%;height:84%;object-fit:contain}
.sx-soon-img .sx-badge{position:absolute;top:10px;left:10px}
.sx-soon-item h3{font-size:15px;line-height:1.3;padding:0 4px;flex:1}
.sx-soon-status{display:flex;align-items:center;justify-content:center;min-height:44px;border-radius:4px;background:var(--sx-paper);color:var(--sx-muted);font-size:14px;font-weight:600;cursor:default;user-select:none}

/* ===== PEČENÍ + FIREMNÍ ===== */
.sx-duo{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.sx-panel{border-radius:12px;padding:40px;display:flex;flex-wrap:wrap;gap:20px;align-items:center;overflow:hidden}
.sx-panel--cream{background:var(--sx-cream)}
.sx-panel--paper{background:var(--sx-paper);border:1.5px solid var(--sx-cream)}
.sx-panel-copy{flex:1 1 240px;display:flex;flex-direction:column;gap:12px;align-items:flex-start}
.sx-panel .sx-script{font-size:30px;color:var(--sx-gold-text)}
.sx-panel h2{font-size:30px;font-weight:700;line-height:1.1}
.sx-panel p{font-size:16px;line-height:1.55;color:var(--sx-ink-2)}
.sx-panel-img{flex:1 1 200px;display:flex;justify-content:center}
.sx-panel-img img{width:170px;height:220px;object-fit:contain}
.sx-panel-img img+img{margin-left:-30px}
.sx-panel-note{font-size:14px;color:var(--sx-muted);align-self:center}
.sx-panel-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:6px}

/* ===== FAQ ===== */
.sx-faq{max-width:880px}
.sx-faq h2{text-align:center;margin-bottom:20px;font-size:32px}
.sx-faq details{background:var(--sx-paper);border-radius:10px;padding:0 22px;margin-bottom:10px}
.sx-faq summary{list-style:none;cursor:pointer;min-height:60px;display:flex;align-items:center;justify-content:space-between;gap:16px;font-size:17px;font-weight:700}
.sx-faq summary::-webkit-details-marker{display:none}
.sx-faq summary::after{content:"+";font-size:26px;font-weight:400;transition:transform .2s}
.sx-faq details[open] summary::after{transform:rotate(45deg)}
.sx-faq details p{padding-bottom:20px;font-size:15px;line-height:1.6;color:var(--sx-ink-2)}

/* ===== SEO ===== */
.sx-seo{max-width:880px;margin-top:72px;margin-bottom:88px}
.sx-seo-in{border-top:1px solid var(--sx-cream);padding-top:40px;display:flex;flex-direction:column;gap:14px;font-size:15px;line-height:1.7;color:var(--sx-ink-2)}
.sx-seo h2{font-size:22px;color:var(--sx-ink)}

/* ===== RESPONSIVE ===== */
@media (max-width:1100px){
  .sx-quick{grid-template-columns:repeat(3,minmax(0,1fr))}
  .sx-grid,.sx-boxes-grid,.sx-who{grid-template-columns:repeat(3,minmax(0,1fr))}
  .sx-soon-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sx-duo{grid-template-columns:1fr}
}
@media (max-width:767px){
  .sx-wrap{padding:0 16px}
  .sx-section{margin-top:64px}
  .sx-h2{font-size:28px}
  .sx-hero-copy{padding:40px 24px 32px;flex-basis:100%}
  .sx-hero h1{font-size:38px}
  .sx-hero p{font-size:17px}
  .sx-quick{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .sx-tile img,.sx-tile .sx-tile-ico{width:80px;height:80px}
  .sx-spot{padding:28px 20px}
  .sx-spot h2{font-size:32px} .sx-spot h2 .sx-script{font-size:40px}
  .sx-spot-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
  .sx-mini{padding:10px} .sx-mini img{height:110px} .sx-mini h3{font-size:14px} .sx-mini-kind{display:none}
  .sx-chips{flex-wrap:nowrap;overflow-x:auto;margin-left:-16px;margin-right:-16px;padding:0 16px 4px}
  .sx-chip{flex:0 0 auto}
  .sx-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 12px}
  .sx-card-foot{flex-direction:column;align-items:stretch}
  .sx-card-foot .sx-btn{width:100%}
  .sx-who{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .sx-who a{padding:18px 16px 0} .sx-who strong{font-size:18px} .sx-who span{font-size:13px}
  .sx-who-img{height:130px} .sx-who-img img{width:110px;height:110px} .sx-who .w4 img{width:130px;height:120px}
  .sx-boxes .sx-wrap{padding-top:48px;padding-bottom:48px}
  .sx-boxes h2{font-size:30px}
  .sx-boxes-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .sx-box{padding:12px 12px 16px} .sx-box h3{font-size:16px}
  .sx-box-foot{flex-direction:column;align-items:stretch}
  .sx-soon-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .sx-panel{padding:28px 20px}
  .sx-promo{min-height:0}
}
@media (prefers-reduced-motion:reduce){.sx *{transition:none!important}}

/* ===== BAREVNÉ MOTIVY =====
   Brandbook: #A98544 bronz, #E1D1A2 písek, #5A8427 zelená, #AB1E2E červená
   Z webu sufan.cz: #3B2C2F text, #C1C468 limetková tlačítka, #C6A25F zlatá lišta menu,
   #F2EFEF / #EDE2DA / #D8C6B7 světlé plochy, #BE4247 a #DCDE8F štítky.
   Motiv je nastavený přes data-theme="c" na <div class="sx">. */
.sx{
  --sx-paper:#F2EFEF; --sx-cream:#EDE2DA; --sx-line:#D8C6B7; --sx-olive:#DCDE8F;
}
.sx-badge--lim,.sx-badge--new{background:rgba(190,66,71,.9);color:#F2EFEF}
.sx-badge--new{background:#DCDE8F;color:var(--sx-ink)}
.sx-badge--only{background:#D8C6B7;color:var(--sx-ink)}
.sx-box-img .sx-badge{background:#D8C6B7;color:var(--sx-ink)}

.sx[data-theme="c"]{ /* Zelená a zlato */
  --t-hero-bg:#C6A25F; --t-hero-fg:#3B2C2F; --t-hero-script:#3B2C2F; --t-hero-line:rgba(59,44,47,.22);
  --t-circle:#F2EFEF; --t-star:#fff;
  --t-cta-bg:#AB1E2E; --t-cta-fg:#fff;
  --t-btn-bg:#C6A25F; --t-btn-fg:#3B2C2F;
  --t-band-bg:#EDE2DA; --t-band-fg:#3B2C2F; --t-band-script:#A98544;
  --t-tile-bg:#AB1E2E; --t-tile-fg:#fff;
  --t-chip-bg:#5A8427; --t-chip-fg:#fff;
  --sx-gold-text:#A98544; --sx-accent:#AB1E2E;
}
.sx-hero-copy,.sx-hero h1,.sx-hero p,.sx-usp{color:var(--t-hero-fg)}
.sx-usp{border-top-color:var(--t-hero-line)}
.sx-hero-copy .sx-script{color:var(--t-hero-script)}
.sx-star{fill:var(--t-star)}
.sx-btn--ghost-light{border-color:var(--t-hero-fg);color:var(--t-hero-fg)}
.sx-btn--accent,.sx a.sx-btn--accent{background:var(--t-cta-bg);color:var(--t-cta-fg)}
.sx-btn--dark,.sx-btn--gold,.sx a.sx-btn--dark,.sx a.sx-btn--gold{background:var(--t-btn-bg);color:var(--t-btn-fg)}
.sx-tile--dark,.sx a.sx-tile--dark,.sx-who .w4,.sx-who .w4 span{background-color:var(--t-tile-bg);color:var(--t-tile-fg)}
.sx-who .w4 span{background:none}
.sx-chip[aria-pressed="true"]{background:var(--t-chip-bg);color:var(--t-chip-fg);border-color:var(--t-chip-bg)}
.sx-boxes{background:var(--t-band-bg);color:var(--t-band-fg)}
.sx-boxes h2,.sx-boxes p,.sx .sx-boxes-link{color:var(--t-band-fg)!important}
.sx-boxes .sx-script{color:var(--t-band-script)}

/* obrázek, který se nenačte → štítek s názvem místo rozbité ikony */
.sx-tile .sx-noimg{width:104px;height:104px;font-size:11px}
.sx-noimg{display:flex;align-items:center;justify-content:center;text-align:center;padding:12px;font-size:13px;font-weight:600;color:var(--sx-muted);background:var(--sx-paper);border-radius:8px;width:100%;height:100%}


/* ===== RESPONZIVITA – opravy pro tablet a mobil ===== */
.sx{display:block;width:100%;max-width:100%;min-width:0;text-align:left;overflow-x:hidden;overflow-x:clip}
.sx-hero-copy,.sx-spot-copy,.sx-spot-grid{min-width:0}
.sx-who a{overflow:hidden}
@media (max-width:1100px){
  .sx-who-img{height:auto;min-height:120px}
  .sx-who-img img{width:50%;max-width:150px;height:auto;aspect-ratio:1/1}
  .sx-who-img img+img{margin-left:-12%}
}
@media (max-width:767px){
  .sx-hero{margin-top:8px}
  .sx-hero-copy{padding:32px 20px 8px;gap:16px}
  .sx-hero-copy .sx-script{font-size:34px}
  .sx-hero h1{font-size:34px}
  .sx-hero p{font-size:16px}
  .sx-hero-ctas{flex-direction:column}
  .sx-hero-ctas .sx-btn{width:100%}
  .sx-usp{gap:8px 18px;font-size:13px;padding-top:16px}

  .sx-bundle{padding:16px;flex-direction:column;align-items:stretch;gap:10px}
  .sx-bundle-copy{flex-basis:auto}
  .sx-bundle-copy .sx-script{font-size:22px}
  .sx-bundle-price strong{font-size:26px}
  .sx-bundle .sx-btn{width:100%}
  .sx-spot>.sx-bundle{margin-top:-24px}
  .sx-spot-copy .sx-btn{width:100%}
  .sx-spot-grid{flex-basis:100%;display:flex;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;
    margin:0 -20px;padding:0 20px 6px;gap:10px;scrollbar-width:none}
  .sx-spot-grid::-webkit-scrollbar{display:none}
  .sx-mini{flex:0 0 46%;scroll-snap-align:start}
  .sx-mini-row{flex-wrap:wrap;gap:2px 8px}

  .sx-btn{white-space:normal;text-align:center;line-height:1.2}
  .sx-btn--sm{font-size:13px;padding:0 10px}
  .sx-head{align-items:flex-start}
  .sx-panel .sx-btn,.sx-promo .sx-btn{max-width:100%}
}
@media (max-width:380px){
  .sx-wrap{padding:0 12px}
  .sx-hero h1{font-size:30px}
  .sx-grid,.sx-boxes-grid,.sx-soon-grid,.sx-who{gap:10px}
  .sx-mini{flex-basis:58%}
}

/* kotvy (Vybrat dárek, rychlá navigace) nesmí skončit pod lepicí hlavičkou webu */
.sx [id]{scroll-margin-top:140px}
@media (max-width:767px){.sx [id]{scroll-margin-top:130px}}

/* ===== HERO S FOTKOU V POZADÍ ===== */
.sx-hero-box{position:relative;min-height:600px;align-items:stretch;
  background:linear-gradient(180deg,#EBD2AE 0%,#E8D3B6 55%,#E6D6C6 100%)}
.sx-hero-box::before{content:"";position:absolute;top:0;right:0;bottom:0;width:64%;
  background:var(--sx-hero-photo) 0 -170px/100% auto no-repeat;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 30%);mask-image:linear-gradient(90deg,transparent 0,#000 30%)}
.sx-hero-copy{flex:0 1 540px;padding:64px 56px;justify-content:center}
.sx-hero p{max-width:440px}
.sx-btn--ghost-light{background:rgba(255,255,255,.35)}
@media (max-width:900px){
  .sx-hero-box{min-height:0;--ph:clamp(340px,68vw,560px)}
  .sx-hero-box::before{left:0;width:100%;height:var(--ph);bottom:auto;
    background-position:50% calc(var(--ph) / 2 - .571 * (100vw - 32px));
    -webkit-mask-image:linear-gradient(180deg,#000 0,#000 74%,transparent 100%);mask-image:linear-gradient(180deg,#000 0,#000 74%,transparent 100%)}
  .sx-hero-copy{flex:1 1 100%;padding:calc(var(--ph) - 30px) 24px 32px}
  .sx-hero p{max-width:none}
}
@media (max-width:767px){
  .sx-hero-copy{padding:calc(var(--ph) - 30px) 20px 28px}
}

/* počítadlo kusů v košíku (nahrazuje „Do košíku“, když je produkt v košíku) */
.sx [hidden]{display:none!important}
.sx-qty{display:inline-flex;align-items:center;justify-content:space-between;min-height:44px;min-width:120px;border-radius:4px;
  background:#DCDE8F;color:var(--sx-ink);font-weight:700}
.sx-qty-btn{width:44px;height:44px;border:0;background:transparent;color:inherit;font:inherit;font-size:20px;line-height:1;cursor:pointer;border-radius:4px}
.sx-qty-btn:hover{background:rgba(0,0,0,.08)}
.sx-qty-btn:focus-visible{outline:2px solid var(--sx-ink);outline-offset:-2px}
.sx-qty-n{min-width:24px;text-align:center;font-size:16px}
@media (max-width:767px){.sx-card-foot .sx-qty,.sx-box-foot .sx-qty,.sx-bundle .sx-qty{width:100%}}

/* ===== NÁKUP PŘES KOMPONENTU WEBU ===== */
/* obal s data-key/data-step pro měření nesmí měnit rozložení patičky karty */
.sx .cena-plus-minus{display:contents}
.sx a.sx-qty-btn{display:flex;align-items:center;justify-content:center;text-decoration:none;color:inherit}
/* tlačítko setu je odkaz (ve vzoru <button>), .sx a{color:inherit} by mu dalo bílou barvu lišty */
.sx a.sx-btn--white{color:var(--sx-ink)}
.sx-price s,.sx-box-foot s{font-size:14px;font-weight:400;color:var(--sx-muted);margin-right:4px}
.sx-card-foot .sx-soon-status,.sx-box-foot .sx-soon-status,.sx-bundle .sx-soon-status{padding:0 14px;text-align:center}

/* ===== ÚPRAVY PRO EDITOR ===== */
/* hero bez fotky: na mobilu nenechávat nahoře prázdné místo pro fotku */
@media (max-width:900px){.sx-hero-box:not(.sx-hero-box--foto) .sx-hero-copy{padding-top:40px}}
/* posuvník karet ve spotlightu: přichycení karty respektuje odsazení, jinak první karta skončí na hraně boxu */
@media (max-width:767px){.sx-spot-grid{scroll-padding:0 20px}}
/* kotvy i nabídka bez kotvy (posun z dlaždice s filtrem) pod lepicí hlavičkou (143 px, na mobilu 120 px) */
.sx [id],.sx [data-sx-nabidka]{scroll-margin-top:156px}
@media (max-width:767px){.sx [id],.sx [data-sx-nabidka]{scroll-margin-top:132px}}
/* psací nadpis promo dlaždice se na úzkém mobilu nevešel do sloupce */
@media (max-width:380px){.sx-promo .sx-script{font-size:28px}}

/* ===== HABITÉ =====
   Na habite.cz (body.habite) stejné bloky v barvách a písmech webu Habité: terakota #b15849, teplá šedá #f1efeb,
   text #3c3c3b. Místo psacího písma benda je serif Romie, kterým má Habité nadpisy. */
.habite .sx,.habite .sx[data-theme="c"]{
  --sx-ink:#3C3C3B; --sx-ink-2:#3C3C3B; --sx-muted:#77716B;
  --sx-cream:#F1EFEB; --sx-paper:#F1EFEB; --sx-line:#CFC7BC;
  --sx-gold:#F1EFEB; --sx-gold-text:#B15849; --sx-olive:#E9E4DD; --sx-accent:#B15849; --sx-on-dark:#F1EFEB;
  --sx-font-script:Romie,"Times New Roman",serif;
  --t-hero-fg:#3C3C3B; --t-hero-script:#B15849; --t-hero-line:rgba(60,60,59,.18);
  --t-cta-bg:#B15849; --t-cta-fg:#fff;
  --t-btn-bg:#B15849; --t-btn-fg:#fff;
  --t-band-bg:#F1EFEB; --t-band-fg:#3C3C3B; --t-band-script:#B15849;
  --t-tile-bg:#B15849; --t-tile-fg:#fff;
  --t-chip-bg:#B15849; --t-chip-fg:#fff;
}
.habite .sx h1,.habite .sx h2{font-family:var(--sx-font-script);font-weight:400}
/* názvy produktů tučně jako na Šufanu, kde to dědí z h3 webu (Habité má h3 tenké) */
.habite .sx-box h3,.habite .sx-soon-item h3{font-weight:700}
/* fotky Habité mají často bílý podklad: multiply je spojí se světlou dlaždicí, na barevné by bílý produkt zmizel */
.habite .sx-card-img img,.habite .sx-box-img img,.habite .sx-soon-img img,.habite .sx-panel-img img,
.habite .sx-tile:not(.sx-tile--dark) img,.habite .sx-who a:not(.w4) img{mix-blend-mode:multiply}
.habite .sx-hero-box{background:linear-gradient(180deg,#F1EFEB 0%,#ECE8E2 55%,#E7E1D9 100%)}
.habite .sx-badge--lim{background:#B15849;color:#fff}
.habite .sx-badge--new,.habite .sx-box-img .sx-badge{background:#fff;color:#B15849}
.habite .sx-badge--only{background:#CFC7BC;color:#3C3C3B}
.habite .sx-qty{background:#F1EFEB}
.habite .sx-rating span:first-child{color:#B15849}
/* světlý text na terakotě místo šufanské růžové */
.habite .sx-promo:not(.sx-promo--all) .sx-promo-desc,.habite .sx-bundle-price s{color:#F4E4DF}
.habite .sx-promo--all{background:#F1EFEB}
.habite .sx-who .w1{background:#EADFD7} .habite .sx-who .w3{background:#F7F5F2}
.habite .sx-panel--paper{background:#F7F5F2}