/* kávovary.cz — výloha, redesign „Showroom" (b0.34)
   Vrstva nad design systémem public/assets/css/kv.css (tokeny + komponenty kv-*).
   Tady jsou: (1) aliasy starých tokenů, aby všechny šablony a inline styly padly do nového systému,
   (2) přestylování starších tříd (.btn, .alert, .section, formuláře, košík, pokladna, služby…),
   (3) hlavička s mega menu, mobilní menu, hledání, (4) pohyb — pomalý, klidný, jen prolínání a měkké posuny. */

/* ═══ 1. Aliasy starých tokenů → design systém ═══════════════════════════ */
:root {
    --brand: var(--ink-900); --brand-2: var(--ink-800); --brand-ink: var(--text-strong);
    --accent-2: var(--signal-400); --accent-text: var(--accent);
    --bg: var(--bg-page); --bg-soft: var(--surface-well); --bg-mute: var(--surface-well);
    --ink: var(--text-body); --muted: var(--text-muted); --line: var(--border-hairline);
    --ok: var(--state-ok); --warn: var(--state-wait); --err: var(--state-bad);
    --ok-text: var(--state-ok); --warn-text: var(--state-wait);
    --ok-soft: var(--state-ok-soft); --ok-soft-ink: var(--state-ok);
    --err-soft: var(--state-bad-soft); --err-soft-ink: var(--state-bad);
    --surface: var(--surface-card); --surface-2: var(--surface-raised); --on-accent: var(--text-on-accent);
    --header-bg: var(--bg-page); --footer-bg: var(--bg-page); --footer-ink: var(--text-body); --footer-muted: var(--text-faint);
    --hero-glow: transparent; --dark-band: var(--bg-inverse);
    --radius: 0px; --radius-sm: 0px; --radius-xs: 0px;
    --shadow: none; --shadow-lg: none;
    --font: var(--font-text); --font-head: var(--font-display);
    --text-3xl: 64px;
}

/* ═══ 2. Základ ══════════════════════════════════════════════════════════ */
html { scroll-behavior: smooth; scrollbar-gutter: stable; }
html, body { overflow-x: clip; }
/* Zamčení scrollu (mobilní menu, šuplík košíku, modal) — window.kvScrollLock(klíč, true/false) z layout.twig.
   Díky scrollbar-gutter: stable se po skrytí posuvníku layout neposune. */
html.is-locked { overflow: hidden; }
html.is-locked body { overscroll-behavior: none; }
[hidden] { display: none !important; }
body { background: var(--bg-page); color: var(--text-body); font: var(--type-body); }
h1, h2, h3, h4 { text-wrap: balance; }
:is(.kv-kicker, .kicker) + :is(h1, h2) { margin-top: var(--space-3); }
h1 { font: var(--type-h1); letter-spacing: var(--tracking-display); }
h2 { font: var(--type-h2); letter-spacing: var(--tracking-display); }
h3 { font: var(--type-h3); }
h1 em, h2 em, h3 em { font-style: italic; color: var(--accent); }
.container { max-width: var(--container); margin: 0 auto; padding: 0 var(--gutter); }
.muted { color: var(--text-muted); }
.ico { flex: none; vertical-align: -0.125em; }
:focus-visible { outline: none; box-shadow: var(--ring); }
img { max-width: 100%; height: auto; }
main.container { min-height: 40vh; }

/* Verzálkový UI hlas (navigace, štítky, popisky) */
.kicker, .label { font: var(--type-kicker); letter-spacing: var(--tracking-kicker); text-transform: uppercase; color: var(--text-muted); }

/* Tlačítka — plný inkoust, hover invertuje, press = opacity .7 (žádný scale ani posun) */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: var(--space-3); background: var(--ink-900); color: var(--paper-50); border: 1px solid var(--ink-900); border-radius: 0;
    padding: 15px 24px; font: var(--weight-semibold) var(--text-sm)/1 var(--font-text); letter-spacing: .05em; text-transform: uppercase; cursor: pointer; transition: var(--transition-control); text-decoration: none; white-space: nowrap; }
.btn:hover { background: var(--paper-50); color: var(--ink-900); text-decoration: none; }
.btn:active { opacity: .7; }
.btn[disabled] { opacity: .35; cursor: not-allowed; }
.btn--lg { padding: 19px 30px; font-size: var(--text-base); }
.btn--sm { padding: 10px 14px; font-size: var(--text-xs); }
.btn--block { width: 100%; }
.btn--ghost { background: transparent; color: var(--text-strong); border-color: var(--border-strong); }
.btn--ghost:hover { background: var(--ink-900); color: var(--paper-50); }
.btn--accent { background: var(--accent); border-color: var(--accent); color: var(--text-on-accent); }
.btn--accent:hover { background: transparent; color: var(--accent); }

/* Zprávy — blok textu (odkazy a tučné uvnitř věty netrhat do sloupců); s ikonou na začátku jako řádek */
.alert { display: block; padding: 14px 16px; font: var(--type-body-sm); border: 1px solid var(--border-strong); background: var(--surface-card); color: var(--text-body); margin: var(--space-4) 0; animation: fadeIn var(--dur-base) var(--ease-out); }
.alert:has(> .ico:first-child) { display: flex; gap: var(--space-3); align-items: flex-start; }
.alert > .ico:first-child { flex: none; margin-top: 2px; }
.alert a { text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
.alert--success { border-color: var(--state-ok); color: var(--state-ok); }
.alert--error { border-color: var(--state-bad); color: var(--state-bad); }
.alert--info { border-color: var(--border-strong); }
.alert--flush { margin: 0; }

/* Formuláře — rámované pole (boxed), pravé úhly, inkoustový rám */
input[type=text], input[type=email], input[type=password], input[type=search], input[type=tel], input[type=number], input[type=date], input[type=time], input:not([type]), textarea, select {
    width: 100%; max-width: 100%; background: var(--surface-card); color: var(--text-body); border: 1px solid var(--border-strong); border-radius: 0; padding: 12px 14px;
    font: var(--weight-regular) var(--text-base)/1.3 var(--font-text); transition: var(--transition-control); }
input:hover, textarea:hover, select:hover { border-color: var(--text-strong); }
input:focus, textarea:focus, select:focus { outline: none; box-shadow: var(--ring); }
input::placeholder, textarea::placeholder { color: var(--text-faint); }
/* zaškrtávátka a přepínače: čtvercové, linka, plný inkoust při výběru (v tmavém režimu papír) — stejné jako .kv-check */
input[type=checkbox], input[type=radio] { appearance: none; -webkit-appearance: none; width: 16px; height: 16px; flex: none; margin: 0; border: 1px solid var(--border-strong); border-radius: 0; background: transparent; display: inline-grid; place-items: center; vertical-align: -3px; cursor: pointer; transition: var(--transition-control); }
input[type=checkbox]:checked, input[type=radio]:checked { background: var(--text-strong); border-color: var(--text-strong); }
input[type=checkbox]:checked::after { content: ""; width: 8px; height: 4px; border-left: 1.5px solid var(--bg-page); border-bottom: 1.5px solid var(--bg-page); transform: rotate(-45deg) translate(1px, -1px); }
/* přepínač (jedna volba ze skupiny) je kulatý — jediná výjimka z pravých úhlů vedle stavové tečky, ať se na první pohled
   liší od zaškrtávátka (víc voleb) */
input[type=radio] { border-radius: 50%; }
input[type=radio]:checked { background: transparent; border-color: var(--text-strong); box-shadow: inset 0 0 0 1px var(--text-strong); }
input[type=radio]:checked::after { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--text-strong); }
input[type=checkbox]:focus-visible, input[type=radio]:focus-visible { box-shadow: var(--ring); outline: none; }
input[type=checkbox]:disabled, input[type=radio]:disabled { opacity: .4; cursor: not-allowed; }
label { font: var(--type-kicker); letter-spacing: .08em; text-transform: uppercase; color: var(--text-muted); }
/* zaškrtávátko/přepínač a jeho text vždy s mezerou (i když šablona vloží input bez obalu) */
/* (nulová specificita přes :where — komponenty s vlastním rozložením, např. .kv-check nebo .facet-opt, mají přednost) */
:where(label:has(> input[type=checkbox]), label:has(> input[type=radio])) { display: inline-flex; align-items: flex-start; gap: var(--space-3); }
:where(label:has(> input[type=checkbox]), label:has(> input[type=radio])) > :is(input[type=checkbox], input[type=radio]) { margin-top: 1px; }
/* Kontrakt formulářů: na telefonu mají pole aspoň 16 px, jinak iOS Safari při fokusu přiblíží stránku */
@media (max-width: 760px) {
    :root:root:root :is(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=hidden]), select, textarea) { font-size: 16px; }
}
/* popisek u zaškrtávátka/přepínače je věta, ne štítek pole */
label:has(> input[type=checkbox]), label:has(> input[type=radio]) { font: var(--type-body-sm); letter-spacing: 0; text-transform: none; color: var(--text-body); }
select { appearance: none; -webkit-appearance: none; padding-right: 36px; cursor: pointer;
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23111111' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 12px center; }
:root[data-theme="dark"] select { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23F3F2EE' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E"); }
select.sort { width: auto; font: var(--weight-semibold) var(--text-xs)/1.3 var(--font-text); letter-spacing: .06em; text-transform: uppercase; padding: 11px 36px 11px 14px; }
/* krokovač množství: vnitřní pole bez vlastního rámu (globální pravidlo pro input[type=number] ho jinak orámuje) */
.kv-qty input, .qty-stepper input { width: 52px; border: 0; border-left: 1px solid var(--border-strong); border-right: 1px solid var(--border-strong); padding: 0; background: transparent; text-align: center; font: var(--weight-regular) var(--text-md)/1 var(--font-display); color: var(--text-strong); box-shadow: none; -moz-appearance: textfield; }
.kv-qty input:focus, .qty-stepper input:focus { box-shadow: inset 0 0 0 1px var(--border-strong); }

/* Sekce a nadpisy sekcí */
.section { padding: var(--gap-section) 0; }
.section + .section { border-top: 1px solid var(--border-strong); }
.section__head { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--space-6); margin-bottom: var(--space-7); }
.section__head h1, .section__head h2 { margin: 0; }
.section__head > a { font: var(--type-label); letter-spacing: .04em; text-transform: uppercase; white-space: nowrap; border-bottom: 1px solid var(--border-strong); padding-bottom: 2px; }
.section__head > a:hover { text-decoration: none; color: var(--accent); border-color: var(--accent); }
.card { background: var(--surface-card); }
.content { font: var(--type-body); max-width: 70ch; }
/* Odkaz uvnitř textu musí jít poznat i bez barvy: tenké podtržení v barvě linky, při najetí červené */
:is(.content, .kv-note, .check-list, .feat p, .lead-text, .page-head__sub, .kv-hero__lead, .home-info p, .home-index__side p) a:not(.btn):not(.kv-btn) { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; text-decoration-color: var(--border-hairline); }
:is(.content, .kv-note, .check-list, .feat p, .lead-text, .page-head__sub, .kv-hero__lead, .home-info p, .home-index__side p) a:not(.btn):not(.kv-btn):hover { color: var(--accent); text-decoration-color: currentColor; }
.content h2 { font: var(--type-h2); margin: var(--space-8) 0 var(--space-3); }
.content h3 { font: var(--type-h3); margin: var(--space-6) 0 var(--space-2); }
.content table { width: 100%; border-collapse: collapse; font: var(--type-body-sm); margin: var(--space-4) 0; }
.content th, .content td { border-bottom: 1px solid var(--border-hairline); padding: 9px 12px; text-align: left; vertical-align: top; }
.content th { font: var(--type-spec); text-transform: uppercase; letter-spacing: .08em; color: var(--text-muted); border-bottom: 2px solid var(--border-strong); }
.content pre { font: var(--type-body-sm); background: var(--surface-well); padding: var(--space-4); overflow: auto; }
.content .alert { max-width: none; }

/* Mřížky */
.grid { display: grid; gap: var(--gap-grid); }
.grid--products, .grid--products-narrow, .kv-grid--products, .grid--cats, .grid--cats-3 { gap: 0; background: transparent; border: 0; border-top: 1px solid var(--border-strong); border-left: 1px solid var(--border-strong); }
.grid--products, .grid--cats { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.grid--products-narrow, .grid--cats-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid--products > *, .grid--products-narrow > *, .kv-grid--products > *, .grid--cats > *, .grid--cats-3 > * { background: var(--surface-card); min-width: 0; border-right: 1px solid var(--border-strong); border-bottom: 1px solid var(--border-strong); }
.grid--products > .reveal > .kv-product, .grid--products-narrow > .reveal > .kv-product, .kv-grid--products > .reveal > .kv-product { height: 100%; }
@media (max-width: 1100px) { .grid--products, .kv-grid--products { grid-template-columns: repeat(3, minmax(0, 1fr)); } .grid--cats { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 760px) { .grid--products, .grid--products-narrow, .kv-grid--products, .grid--cats-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 480px) { .grid--products, .grid--products-narrow, .kv-grid--products, .grid--cats, .grid--cats-3 { grid-template-columns: 1fr; } }

/* Dostupnost, štítky, cena (staré třídy) */
.avail { display: inline-flex; align-items: center; gap: 8px; font: var(--weight-semibold) var(--text-xs)/1 var(--font-text); letter-spacing: .08em; text-transform: uppercase; }
.avail::before { content: ""; width: 6px; height: 6px; border-radius: var(--radius-pill); background: currentColor; flex: none; box-shadow: none; }
.omnibus { font: var(--type-body-sm); color: var(--text-faint); }
.badges { display: flex; gap: 6px; flex-wrap: wrap; }

/* ═══ 3. Hlavička, mega menu, mobilní menu ═══════════════════════════════ */
/* v1.0: Na desktopu dva řádky — logo + akce (64 px) a řádek navigace (48 px); do 1180 px jen řádek 64 px a navigace
   je šuplík pod ním. Akce: od 900 px slova (Hledat · Oblíbené · Účet · Košík · Menu), pod 900 px ikony 44 × 44 px;
   na telefonu jen Hledat · Účet · Košík · Menu (Oblíbené a přepínač režimu jsou v menu), pod 380 px i Účet v menu.
   Linka pod hlavičkou je přes celou šířku okna; mega menu a šuplík se zarovnávají k celé hlavičce (.kv-header je sticky). */
.kv-header { border-bottom: 1px solid var(--border-strong); }
.kv-header__bar { position: static; border-bottom: 0; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; grid-template-rows: var(--header-h) auto; grid-template-areas: "logo spacer actions" "nav nav nav"; height: auto; align-items: center; gap: 0 var(--space-6); }
.kv-header__bar > .logo { grid-area: logo; }
.kv-header__bar > .kv-header__actions { grid-area: actions; }
.kv-header__bar > .kv-nav { grid-area: nav; height: 48px; justify-content: flex-start; gap: clamp(16px, 2vw, 32px); border-top: 1px solid var(--border-hairline); }
.kv-nav a { white-space: nowrap; }
.kv-nav .nav__item { position: static; display: inline-flex; align-items: center; align-self: stretch; height: 100%; }
.kv-nav .nav__item > a { display: inline-flex; align-items: center; height: 100%; padding: 0; }
.kv-nav .nav__item > a::after { bottom: 0; height: 2px; }
.kv-nav .nav__item.is-open > a::after { transform: scaleX(1); }
.logo { display: inline-flex; align-items: center; gap: 10px; color: var(--text-strong); height: var(--logo-h, 28px); }
.logo:hover { color: var(--text-strong); text-decoration: none; }
.logo svg { display: block; flex: none; }
.logo__mark { width: var(--logo-h, 28px); height: var(--logo-h, 28px); }
.logo__word { height: calc(var(--logo-h, 28px) * .52); width: calc(var(--logo-h, 28px) * .52 * 8.96); margin-top: 1px; }
.logo--mark .logo__word { display: none; }
.logo--inverse { color: var(--paper-50); }
.logo img { height: 100%; width: auto; display: block; }

/* akce v hlavičce: tlačítka i odkazy stejně — verzálkové slovo, dotyková plocha 44 px */
.kv-header__actions { gap: 0 clamp(16px, 1.6vw, 26px); }
.kv-headerlink { position: relative; background: none; border: 0; padding: 0; cursor: pointer; }
.kv-headerlink .ico { display: none; flex: none; }
.kv-headerlink:hover { color: var(--accent); }
.kv-headerlink__name { max-width: 16ch; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding: 4px 0; margin: -4px 0; } /* padding: háček nad „Ú" se neořízne */
/* počet v košíku písmem textu („Košík (1)" jako v design systému): serifová „1" Instrument Serif vypadala jako „l" nebo „]" */
.kv-headerlink .cart-count, .kv-cartcount { font: var(--weight-semibold) var(--text-sm)/1 var(--font-text); color: var(--accent); text-transform: none; letter-spacing: 0; font-variant-numeric: tabular-nums lining-nums; }
.kv-cartcount::before { content: "("; }
.kv-cartcount::after { content: ")"; }
.kv-headerlink--b2b { font-size: var(--text-2xs); letter-spacing: .1em; color: var(--accent); }
.search-toggle[aria-expanded="true"] { color: var(--accent); }
/* menu: hamburger ↔ křížek prolnutím, slovo Menu ↔ Zavřít */
.nav-toggle { display: none; }
.nav-toggle__icon { display: none; place-items: center; }
.nav-toggle__icon > span { grid-area: 1 / 1; display: grid; transition: opacity var(--dur-fast) var(--ease-out); }
.nav-toggle__close { opacity: 0; }
.nav-toggle.is-open .nav-toggle__open { opacity: 0; }
.nav-toggle.is-open .nav-toggle__close { opacity: 1; }
.nav-toggle__word--close { display: none; }
.nav-toggle.is-open .nav-toggle__word--open { display: none; }
.nav-toggle.is-open .nav-toggle__word--close { display: inline; }
.nav-toggle.is-open { color: var(--accent); }
/* přepínač režimu (proužek, mobilní menu): ikona a slovo podle toho, KAM se přepne */
.theme-toggle__sun, .theme-word--to-light { display: none; }
.theme-toggle__moon { display: block; }
:root[data-theme="dark"] .theme-toggle__sun, :root[data-theme="dark"] .theme-word--to-light { display: inline; }
:root[data-theme="dark"] .theme-toggle__moon, :root[data-theme="dark"] .theme-word--to-dark { display: none; }
@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) .theme-toggle__sun, :root:not([data-theme="light"]) .theme-word--to-light { display: inline; }
    :root:not([data-theme="light"]) .theme-toggle__moon, :root:not([data-theme="light"]) .theme-word--to-dark { display: none; }
}

/* Hledání — řádek pod hlavičkou: výška se rozbalí plynule (grid 0fr → 1fr), přesah pro našeptávač až po dojetí */
.kv-header__search { display: grid; grid-template-rows: 0fr; background: var(--bg-page); transition: grid-template-rows var(--dur-base) var(--ease-in-out); }
.kv-header__search.open { grid-template-rows: 1fr; }
.kv-header__searchin { min-height: 0; overflow: hidden; visibility: hidden; transition: visibility 0s linear var(--dur-base); }
.kv-header__search.open .kv-header__searchin { visibility: visible; transition-delay: 0s; border-top: 1px solid var(--border-hairline); }
.kv-header__search.is-settled .kv-header__searchin { overflow: visible; }
.kv-header__searchbox { position: relative; padding-top: var(--space-4); padding-bottom: var(--space-4); }
.kv-header__search .kv-search { border: 1px solid var(--border-strong); max-width: 640px; }
.kv-search .kv-search__input, .kv-search input[type=search] { border: 0; background: transparent; padding: 13px 0; box-shadow: none; min-height: 44px; }
.kv-search .kv-search__input:focus, .kv-search input[type=search]:focus { box-shadow: none; }
.kv-search input[type=search]::-webkit-search-cancel-button { -webkit-appearance: none; }
/* našeptávač */
.kv-suggest { position: absolute; left: var(--gutter); top: calc(100% - var(--space-4) - 1px); width: min(640px, calc(100% - 2 * var(--gutter))); max-height: min(70vh, 560px); overflow-y: auto; overscroll-behavior: contain;
    background: var(--surface-card); border: 1px solid var(--border-strong); z-index: var(--z-dropdown); opacity: 0; translate: 0 -4px; transition: opacity var(--dur-fast) var(--ease-out), translate var(--dur-fast) var(--ease-out); }
.kv-suggest.is-open { opacity: 1; translate: none; }
.kv-suggest[aria-busy="true"] { cursor: progress; }
.kv-suggest__group + .kv-suggest__group { border-top: 1px solid var(--border-hairline); }
.kv-suggest__title { padding: 12px 14px 6px; font: var(--type-kicker); letter-spacing: var(--tracking-kicker); text-transform: uppercase; color: var(--text-muted); }
.kv-suggest__opt { display: flex; gap: 12px; align-items: center; min-height: 44px; padding: 8px 14px; font: var(--type-body-sm); color: var(--text-body); border-left: 2px solid transparent; transition: background-color var(--dur-fast) var(--ease-out); }
.kv-suggest__opt:hover { text-decoration: none; color: var(--text-strong); }
.kv-suggest__opt.is-active { background: var(--surface-well); border-left-color: var(--text-strong); color: var(--text-strong); }
.kv-suggest__opt img, .kv-suggest__ph { width: 40px; height: 40px; flex: none; object-fit: contain; background: var(--img-well); mix-blend-mode: multiply; }
.kv-suggest__name { flex: 1; min-width: 0; }
.kv-suggest__name mark { background: none; color: inherit; font-weight: var(--weight-semibold); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.kv-suggest__price { margin-left: auto; font: var(--weight-regular) var(--text-base)/1 var(--font-display); color: var(--text-strong); white-space: nowrap; }
.kv-suggest__opt--all { border-top: 1px solid var(--border-strong); font: var(--type-label); letter-spacing: .05em; text-transform: uppercase; color: var(--text-strong); }
.kv-suggest__arrow { margin-left: auto; }
.kv-suggest__note { margin: 0; padding: 10px 14px; border-bottom: 1px solid var(--border-hairline); font: var(--type-body-sm); color: var(--text-muted); }
.kv-suggest__empty, .kv-suggest__loading { padding: 16px 14px; font: var(--type-body-sm); color: var(--text-muted); }
.kv-suggest__empty strong { display: block; color: var(--text-strong); font-weight: var(--weight-semibold); margin-bottom: 4px; }
.kv-suggest__msg:empty, .kv-suggest__list:empty { display: none; }
.kv-suggest__msg:has(.kv-suggest__empty) + .kv-suggest__list .kv-suggest__opt--all { border-top-color: var(--border-hairline); }
.kv-suggest__loading::before { content: ""; display: block; height: 1px; margin: -16px -14px 15px; background: var(--text-strong); transform-origin: left; animation: kvRule calc(var(--dur-slow) * 2) var(--ease-in-out) infinite alternate; }

/* Mega menu (desktop) — panel pod linkou hlavičky; buňky dělí 1px linky (mezera 1px na kamenném podkladu, žádné
   zdvojené ani chybějící linky). Otevírá ho kv-ui.js třídou .is-open (prodleva 120 ms, Esc, ▾ pro klávesnici). */
.nav__expand { display: none; }
.nav__plus { display: none; }
.mega { position: absolute; left: 0; right: 0; top: 100%; z-index: var(--z-dropdown); background: var(--bg-page); border-bottom: 1px solid var(--border-strong); padding: var(--space-7) var(--gutter) var(--space-8);
    visibility: hidden; opacity: 0; translate: 0 -4px; transition: opacity var(--dur-fast) var(--ease-out), translate var(--dur-fast) var(--ease-out), visibility 0s linear var(--dur-fast); }
.nav__item.is-open > .mega { visibility: visible; opacity: 1; translate: none; transition-delay: 0s; }
html:not(.js) .nav__item.has-mega:hover > .mega { visibility: visible; opacity: 1; translate: none; transition-delay: 0s; }
/* šířka panelu podle počtu sloupců (málo podkategorií = užší panel u levého okraje, ne prázdná plocha přes celou šířku) */
/* nikdy širší než obsah kontejneru (panel Služby dřív přetekl o ~40 px za pravý okraj okna) */
.mega__inner { width: min(100%, calc(var(--mega-cols, 4) * 300px + 340px)); max-width: calc(var(--container) - 2 * var(--gutter)); margin: 0 0 0 max(0px, calc((100% - var(--container)) / 2 + var(--gutter))); display: grid; grid-template-columns: repeat(var(--mega-cols, 4), minmax(0, 1fr)) minmax(260px, 340px); gap: 1px; background: var(--border-hairline); border: 1px solid var(--border-hairline); align-items: stretch; }
.mega__inner > * { background: var(--bg-page); padding: var(--space-5) var(--space-5) var(--space-6); min-width: 0; }
/* Kategorie (N6): rejstřík — řádky 01, 02… s počtem položek kurzívou, pod nimi podkategorie; vpravo náhled, ve kterém
   se při najetí nebo fokusu na řádek prolne obrázek podkategorie. Řádek se posune o 8 px a zčervená (jako rejstřík
   na úvodu). Šířka podle počtu sloupců rejstříku (1–3), ne přes celou obrazovku. */
.mega--index .mega__inner { width: min(100%, calc(var(--mega-cols, 1) * 340px + 400px)); grid-template-columns: minmax(0, 1fr) minmax(280px, 360px); }
.mega--index .mega__index { padding: var(--space-6) var(--space-7) var(--space-7); }
.mega__rows { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(var(--mega-cols, 1), minmax(0, 1fr)); column-gap: var(--space-8); align-content: start; border-top: 1px solid var(--border-strong); }
.mega__row { padding: 14px 0; border-bottom: 1px solid var(--border-hairline); min-width: 0; }
.kv-nav .mega .mega__cat { display: grid; grid-template-columns: 30px minmax(0, 1fr) auto; align-items: baseline; gap: var(--space-3); padding: 0; font: var(--weight-regular) var(--text-md)/1.3 var(--font-text); letter-spacing: var(--tracking-tight); text-transform: none; color: var(--text-strong); white-space: normal; }
.kv-nav .mega .mega__cat:hover, .kv-nav .mega .mega__cat:focus-visible { text-decoration: none; }
.mega__num { font: var(--type-kicker); letter-spacing: .1em; color: var(--text-faint); }
.mega__name { transition: translate var(--dur-base) var(--ease-out), color var(--dur-fast) var(--ease-out); }
/* počet se slovem („1 položka" jako v rejstříku na úvodu) — holá kurzívní „1" vypadala jako lomítko */
.mega__count { font: italic 400 var(--text-base)/1 var(--font-display); color: var(--accent); white-space: nowrap; }
.mega__row.is-peek .mega__name, .mega__cat:hover .mega__name, .mega__cat:focus-visible .mega__name { translate: var(--space-2) 0; color: var(--accent); }
.kv-nav .mega .mega__subs { display: flex; flex-wrap: wrap; gap: 0; margin: 6px 0 0 calc(30px + var(--space-3)); }
.kv-nav .mega .mega__subs li + li::before { content: "·"; margin: 0 8px; color: var(--text-faint); }
.kv-nav .mega .mega__subs li a { display: inline; padding: 2px 0 !important; }
/* náhled: obrázek na kamenném poli, prolnutí 200 ms (druhá vrstva vzniká v kv-ui.js), popiska verzálkami s počtem */
.mega__peekimg { position: relative; aspect-ratio: 16 / 10; background: var(--img-well); overflow: hidden; }
.mega__side .mega__peekimg img { position: absolute; inset: 0; width: 100%; height: 100%; aspect-ratio: auto; object-fit: contain; padding: 6%; background: none; mix-blend-mode: multiply; opacity: 0; transition: opacity var(--dur-fast) var(--ease-out); }
.mega__side .mega__peekimg img.is-on { opacity: 1; }
.mega__peekblank { position: absolute; inset: 0; display: grid; place-items: center; color: var(--stone-300); }
.mega__peekcap { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px var(--space-3); margin: var(--space-1) 0 0; }
.mega__side .mega__peekcap { display: flex; -webkit-line-clamp: none; overflow: visible; }
.mega__peekname { font: var(--type-kicker); letter-spacing: var(--tracking-kicker); text-transform: uppercase; color: var(--text-strong); }
.mega__peekcount { font: italic 400 var(--text-base)/1 var(--font-display); color: var(--accent); }
.mega__peekcap.is-swap { animation: kvFade var(--dur-fast) var(--ease-out); }
.mega__label { display: block; font: var(--type-kicker); letter-spacing: var(--tracking-kicker); text-transform: uppercase; color: var(--text-muted); margin-bottom: var(--space-3); }
.mega ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
.mega ul.mega__list { display: block; }
.mega ul li { break-inside: avoid; }
.mega ul li a { display: block; padding: 5px 0 !important; font: var(--type-body-sm) !important; text-transform: none !important; letter-spacing: 0 !important; color: var(--text-muted) !important; white-space: normal; }
.mega ul li a:hover { color: var(--accent) !important; text-decoration: none; }
.mega ul li a::after, .mega__link::after { display: none !important; }
.mega__side { display: flex; flex-direction: column; gap: var(--space-3); background: var(--surface-well) !important; }
.kv-nav .mega a { position: static; height: auto; text-transform: none; letter-spacing: 0; }
.kv-nav .mega a::after { display: none; }
.kv-nav .mega .btn, .kv-nav .mega .kv-btn { display: flex; width: 100%; max-width: 100%; justify-content: center; align-items: center; gap: 8px; padding: 12px 14px; font: var(--weight-semibold) var(--text-xs)/1.2 var(--font-text); letter-spacing: .06em; text-transform: uppercase; white-space: normal; text-align: center; color: var(--btn-fg); background: var(--btn-bg); border: 1px solid var(--btn-bg); }
.kv-nav .mega .btn:hover, .kv-nav .mega .kv-btn:hover { color: var(--btn-bg); background: var(--btn-fg); }
.mega__side img { width: 100%; aspect-ratio: 16/10; object-fit: contain; background: var(--img-well); padding: 6%; mix-blend-mode: multiply; }
.mega__side p { margin: 0; font: var(--type-body-sm); color: var(--text-muted); display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
.mega__side .btn { align-self: flex-start; margin-top: auto; padding: 12px 16px; font-size: var(--text-xs); }
.mega--links .mega__inner { grid-template-columns: repeat(3, minmax(0, 1fr)) minmax(260px, 340px); }
.mega__link { display: flex !important; flex-direction: column; gap: 8px; padding: var(--space-5) !important; font: var(--type-label) !important; letter-spacing: .04em !important; text-transform: uppercase !important; color: var(--text-strong) !important; transition: background-color var(--dur-fast) var(--ease-out); }
.mega__link:hover { background: var(--surface-raised); text-decoration: none; color: var(--accent) !important; }
.mega__link .ico { color: var(--text-strong); }
.mega__link span { font: var(--type-body-sm); text-transform: none; letter-spacing: 0; color: var(--text-muted); }
.mega__more { grid-column: 4; grid-row: 1 / span 2; background: var(--surface-well) !important; }
/* desktop: tlačítko ▾ za položkou s panelem — pro klávesnici (objeví se při fokusu) a dotykové displeje */
@media (min-width: 1181px) {
    .kv-nav .nav__expand { display: inline-grid; place-items: center; width: 24px; height: 44px; margin-left: -4px; border: 0; background: none; color: var(--text-strong); cursor: pointer; padding: 0; }
    .kv-nav .nav__expand .ico { transition: rotate var(--dur-fast) var(--ease-out); }
    .kv-nav .nav__item.is-open .nav__expand .ico { rotate: 180deg; }
    .kv-nav .nav__expand:not(:focus-visible) { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip-path: inset(50%); }
    .kv-nav .nav__item.has-mega > a { gap: 6px; }
    .nav__foot { display: none !important; }
    .kv-header__bar > .kv-nav { display: flex !important; }
}
@media (min-width: 1181px) and (hover: none) {
    .kv-nav .nav__expand:not(:focus-visible) { position: static; width: 24px; height: 44px; margin: 0 0 0 -4px; overflow: visible; clip-path: none; }
}
/* Kompaktní lepicí hlavička (desktop): při scrollu dolů se řádek navigace schová pod řádek s logem, při scrollu nahoru
   se vrátí (kv-ui.js, třída .is-tucked). Celá hlavička se posune o výšku navigace nahoru a řádek s logem a akcemi
   (včetně plné vrstvy ::before přes celou šířku) se posune o stejný kus zpět — logo stojí, linka pod hlavičkou dojede
   pod řádek s logem a v toku stránky se nic nehne (žádný poskok obsahu). Vrstva ::before je o 1 px nižší než řádek s logem,
   ať ve schovaném stavu nezakryje spodní linku hlavičky (obsah by jinak tekl pod logo bez oddělení). */
@media (min-width: 1181px) {
    .kv-header { --tuck: 0px; translate: 0 calc(-1 * var(--tuck)); transition: translate var(--dur-base) var(--ease-in-out); }
    .kv-header.is-tucked { --tuck: 49px; }
    .kv-header::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: calc(var(--header-h) - 1px); background: var(--bg-page); z-index: 1; pointer-events: none; translate: 0 var(--tuck); transition: translate var(--dur-base) var(--ease-in-out); }
    .kv-header__bar > .logo, .kv-header__bar > .kv-header__actions { position: relative; z-index: 2; translate: 0 var(--tuck); transition: translate var(--dur-base) var(--ease-in-out); }
    /* navigace zůstává bez pozicování (mega menu se měří od celé hlavičky) — vrstva ::before (z-index 1) ji překryje */
    .kv-header.is-tucked .kv-header__bar > .kv-nav { visibility: hidden; transition: visibility 0s linear var(--dur-base); }
}

/* Mobilní a tabletové menu (do 1180 px): šuplík pod hlavičkou přes celou výšku, zamčený scroll, Esc, fokus,
   akordeony se plynule rozbalí; dole účet, oblíbené, kontakt, dnešní otevírací doba a přepínač režimu */
.nav__foot { display: none; } /* jen v mobilním menu (media blok níže) */
@keyframes kvSheetIn { from { opacity: 0; translate: 0 -8px; } to { opacity: 1; translate: none; } }
@keyframes kvSheetOut { from { opacity: 1; } to { opacity: 0; } }
/* ztmavení pod hlavičkou (hlavička je vlastní vrstva z-index 50 a šuplík menu je v ní — ztmavení musí být pod ní) */
.nav-scrim { position: fixed; left: 0; right: 0; bottom: 0; top: var(--menu-top, 64px); z-index: calc(var(--z-header) - 1); background: var(--overlay); opacity: 0; transition: opacity var(--dur-base) var(--ease-out); }
.nav-scrim.is-on { opacity: 1; }
@media (max-width: 1180px) {
    .nav-toggle { display: inline-flex; }
    .kv-header__bar { grid-template-columns: auto minmax(0, 1fr) auto; grid-template-rows: var(--header-h); grid-template-areas: "logo spacer actions"; }
    .kv-header__bar > .kv-nav { display: none; border-top: 0; height: auto; }
    .kv-header__bar > .kv-nav.open { display: flex; flex-direction: column; align-items: stretch; gap: 0; position: fixed; left: 0; right: 0; top: var(--menu-top, 64px); bottom: 0; z-index: var(--z-dropdown);
        background: var(--bg-page); border-top: 1px solid var(--border-strong); padding: var(--space-2) var(--gutter) calc(var(--space-8) + env(safe-area-inset-bottom)); overflow-y: auto; overscroll-behavior: contain;
        animation: kvSheetIn var(--dur-base) var(--ease-out) both; }
    .kv-header__bar > .kv-nav.open.is-closing { animation: kvSheetOut var(--dur-fast) var(--ease-out) both; pointer-events: none; }
    .kv-nav.open > * { animation: kvRise var(--dur-base) var(--ease-out) backwards; animation-delay: calc(var(--enter-step) + var(--n, 0) * var(--enter-step) / 2); }
    .kv-nav .nav__item { position: relative; display: flex; flex-wrap: wrap; align-items: center; height: auto; border-bottom: 1px solid var(--border-hairline); }
    .kv-nav .nav__item > a { flex: 1; min-height: 52px; padding: 14px 0; height: auto; font-size: var(--text-sm); }
    .kv-nav .nav__item > a::after { display: none; }
    .kv-nav a.is-active { color: var(--accent); }
    .nav__expand { display: inline-grid; place-items: center; width: 52px; height: 52px; margin-right: -12px; border: 0; background: none; color: var(--text-strong); cursor: pointer; }
    .nav__expand .ico { display: none; }
    /* plus ↔ mínus z linek: svislá linka se při otevření stáhne */
    .nav__plus { display: block; position: relative; width: 14px; height: 14px; }
    .nav__plus::before, .nav__plus::after { content: ""; position: absolute; background: currentColor; }
    .nav__plus::before { left: 0; right: 0; top: 50%; height: 1px; translate: 0 -.5px; }
    .nav__plus::after { top: 0; bottom: 0; left: 50%; width: 1px; translate: -.5px 0; transition: scale var(--dur-base) var(--ease-out); }
    .nav__item.open .nav__plus::after { scale: 1 0; }
    .mega, .nav__item.has-mega:hover .mega { position: static; flex-basis: 100%; display: grid; grid-template-rows: 0fr; padding: 0; border: 0; background: none;
        visibility: hidden; opacity: 1; translate: none; transition: grid-template-rows var(--dur-base) var(--ease-in-out), visibility 0s linear var(--dur-base); }
    .nav__item.open > .mega { grid-template-rows: 1fr; visibility: visible; transition-delay: 0s; }
    .mega__inner, .mega--links .mega__inner { display: block; width: auto; min-height: 0; overflow: hidden; max-width: none; margin: 0; padding: 0; gap: 0; background: transparent; border: 0; }
    .mega__inner > * { padding: var(--space-3) 0 var(--space-3) var(--space-4); border: 0; border-top: 1px solid var(--border-hairline); background: transparent; }
    .mega__inner > :last-child { margin-bottom: var(--space-3); }
    .mega__side { display: none; }
    /* rejstřík kategorie v šuplíku: řádky 48 px (číslo, název, počet), podkategorie pod nimi jako řádky 44 px */
    .mega--index .mega__inner > .mega__index { padding: 0; border-top: 0; margin-bottom: 0; }
    .mega__rows { display: block; border-top: 0; }
    .mega__row { padding: 0; border-bottom: 0; border-top: 1px solid var(--border-hairline); }
    .kv-nav .mega .mega__cat { grid-template-columns: 26px minmax(0, 1fr) auto; align-items: center; min-height: 48px; padding: 8px 0 8px var(--space-4); font-size: var(--text-base); }
    .kv-nav .mega .mega__subs { display: block; margin: -4px 0 var(--space-2) calc(var(--space-4) + 26px + var(--space-3)); }
    .kv-nav .mega .mega__subs li + li::before { display: none; }
    .kv-nav .mega .mega__subs li a { display: flex; align-items: center; min-height: 44px; padding: 0 !important; }
    .mega ul li a { padding: 9px 0 !important; font-size: var(--text-base) !important; }
    .mega__link { flex-direction: row; align-items: center; padding: 12px 0 12px var(--space-4) !important; gap: 12px; font-size: var(--text-xs) !important; }
    .mega__link span { display: none; }
    .mega__more { background: transparent !important; }
    .nav__foot { display: flex; flex-direction: column; align-items: stretch; gap: var(--space-5); padding: var(--space-6) 0 0; border: 0; }
    .nav__links { display: flex; flex-direction: column; border-top: 1px solid var(--border-strong); }
    .kv-nav .nav__links a { display: flex; align-items: center; gap: 12px; min-height: 48px; padding: 0; border-bottom: 1px solid var(--border-hairline); font: var(--weight-semibold) var(--text-sm)/1 var(--font-text); letter-spacing: .05em; text-transform: uppercase; }
    .kv-nav .nav__links a::after { display: none; }
    .nav__contact { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; }
    .kv-nav .nav__contact a { padding: 6px 0; text-transform: none; letter-spacing: 0; font: var(--type-body); color: var(--text-body); }
    .kv-nav .nav__contact a::after { display: none; }
    .kv-nav .nav__contact .nav__tel { font: var(--weight-regular) var(--text-xl)/1 var(--font-display); color: var(--text-strong); letter-spacing: var(--tracking-display); }
    .nav__hours .hours-pill { font: var(--type-kicker); letter-spacing: .06em; }
    .nav__theme { display: inline-flex; align-items: center; gap: 10px; align-self: flex-start; min-height: 44px; background: none; border: 0; border-bottom: 1px solid var(--border-strong); padding: 0; cursor: pointer; color: var(--text-strong); font: var(--weight-semibold) var(--text-xs)/1 var(--font-text); letter-spacing: .08em; text-transform: uppercase; }
    .nav__theme:hover { color: var(--accent); border-bottom-color: var(--accent); }
}
@media (min-width: 641px) and (max-width: 1180px) {
    /* tablet: šuplík zprava (420 px) se ztmavením zbytku stránky */
    .kv-header__bar > .kv-nav.open { left: auto; width: min(420px, 100%); border-left: 1px solid var(--border-strong); padding-left: var(--space-7); padding-right: var(--space-7); }
}
@media (max-width: 640px) { .nav-scrim { display: none; } }
/* Bez JavaScriptu (zablokovaný nebo spadlý skript): hledání je rovnou rozbalené a odešle se formulářem, do 1180 px
   vede „Menu" odkazem na navigaci, která se ukáže pod hlavičkou (:target; hlavička přestane lepit, ať jde celá projít) */
.nav-nojs { display: none; }
html:not(.js) .kv-header__search { grid-template-rows: 1fr; }
html:not(.js) .kv-header__searchin { visibility: visible; border-top: 1px solid var(--border-hairline); }
html:not(.js) .search-toggle, html:not(.js) [data-theme-toggle] { display: none; }
@media (max-width: 1180px) {
    html:not(.js) .nav-toggle, html:not(.js) .nav__expand { display: none; }
    html:not(.js) .nav-nojs { display: inline-flex; align-items: center; justify-content: center; }
    html:not(.js) .kv-header:has(.kv-nav:target) { position: static; }
    html:not(.js) .kv-header__bar > .kv-nav:target { display: flex; flex-direction: column; align-items: stretch; gap: 0; grid-column: 1 / -1; padding-bottom: var(--space-6); border-top: 1px solid var(--border-strong); }
}

/* Akce: od 900 px slova bez ikon (design systém), pod 900 px ikony 44 × 44 px */
@media (min-width: 900px) {
    .kv-headerlink .nav-toggle__icon { display: none; }
}
@media (max-width: 899px) {
    .kv-header__actions { gap: 0; margin-right: -10px; }
    .kv-headerlink { width: 44px; height: 44px; min-height: 44px; }
    .kv-headerlink .ico { display: block; }
    .kv-headerlink .nav-toggle__icon { display: grid; }
    .kv-headerlink__word { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
    .kv-headerlink .b2b-badge { position: absolute; top: 4px; left: 0; font-size: 9px; }
    /* počet kusů v košíku v rohu ikony */
    #cart-link .kv-cartcount { position: absolute; top: 5px; right: 0; min-width: 0; font: var(--weight-semibold) 11px/1 var(--font-text); }
    #cart-link .kv-cartcount::before, #cart-link .kv-cartcount::after { content: none; } /* u ikony jen číslo v rohu */
}
@media (max-width: 640px) {
    .kv-headerlink--wish { display: none; }
    .kv-header .logo { --logo-h: 24px !important; }
}
@media (max-width: 380px) {
    .kv-headerlink--account { display: none; }
    .kv-header__bar { gap: 0 var(--space-3); }
}
@media (max-width: 340px) {
    .kv-header .logo { --logo-h: 22px !important; }
}

/* ═══ 4. Patička (kv-footer) ════════════════════════════════════════════ */
.kv-footer { padding-bottom: calc(var(--space-6) + 76px); }
.kv-footer .logo { margin-bottom: var(--space-4); }
.kv-footer__hours { display: grid; gap: 6px; font: var(--type-body-sm); color: var(--text-muted); }
.kv-footer__hours a { font-size: var(--text-sm); }
/* nadpisy sloupců: h2 (ne h4 — žádná přeskočená úroveň) ve stylu kickeru */
.kv-footer .kv-footer__title { font: var(--type-kicker); text-transform: uppercase; letter-spacing: .1em; color: var(--text-muted); margin: 0 0 var(--space-4); }
.kv-footer .kv-footer__subhead { margin-top: var(--space-6); }
.kv-footer ul { gap: 2px; }
.kv-footer li a, .kv-footer__linkbtn { display: inline-block; padding: 4px 0; }
.kv-footer__linkbtn { background: none; border: 0; cursor: pointer; color: var(--text-body); font: var(--weight-regular) var(--text-sm)/1.4 var(--font-text); text-align: left; transition: color var(--dur-fast) var(--ease-out); }
.kv-footer__linkbtn:hover { color: var(--accent); text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 1px; }
.kv-footer__addr { line-height: 1.5; }
.kv-footer form { display: flex; border: 1px solid var(--border-strong); margin-top: var(--space-3); transition: box-shadow var(--dur-fast) var(--ease-out); }
.kv-footer form:focus-within { box-shadow: inset 0 0 0 1px var(--border-strong); }
.kv-footer form input { border: 0; flex: 1; min-width: 0; padding: 10px 12px; font-size: var(--text-sm); min-height: 44px; }
.kv-footer form input:focus { box-shadow: none; }
.kv-footer form button { border: 0; border-left: 1px solid var(--border-strong); background: var(--ink-900); color: var(--paper-50); padding: 0 14px; cursor: pointer; font: var(--weight-semibold) var(--text-xs)/1 var(--font-text); letter-spacing: .08em; text-transform: uppercase; transition: var(--transition-control); }
.kv-footer form button:hover { background: var(--paper-50); color: var(--ink-900); }
:root[data-theme="dark"] .kv-footer form button { background: var(--paper-50); color: var(--ink-900); }
.kv-footer__bottom { align-items: center; }
.kv-footer__about { font: var(--type-body-sm); color: var(--text-muted); max-width: 320px; margin: 0 0 var(--space-5); }
.kv-footer__fine { font: var(--type-body-sm); color: var(--text-muted); margin: 8px 0 0; }
.kv-footer__fine a { font-size: inherit; text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--border-hairline); }
/* kredit RAPL Group — jeden český řádek + malé logo v odstínech šedi */
.powered { display: inline-flex; align-items: center; gap: 12px; min-height: 44px; color: var(--text-faint); }
.powered:hover { color: var(--text-strong); text-decoration: none; }
.powered__text { font: var(--type-kicker); letter-spacing: .06em; }
.powered img { height: 18px; width: auto; display: block; filter: grayscale(1); opacity: .9; transition: filter var(--dur-base) var(--ease-out), opacity var(--dur-base) var(--ease-out); }
.powered:hover img { filter: none; opacity: 1; }
:root[data-theme="dark"] .powered img { filter: grayscale(1) invert(1); }
@media (max-width: 900px) { .kv-footer__cols { grid-template-columns: 1fr 1fr; } .kv-footer__cols > div:first-child { grid-column: 1 / -1; } }
@media (max-width: 760px) {
    /* telefon: odkazy jako řádky 44 px (dotykové cíle), sloupce těsněji */
    .kv-footer { padding-top: var(--space-8); }
    .kv-footer__cols { gap: var(--space-6) var(--space-5); }
    .kv-footer ul { gap: 0; }
    .kv-footer li a, .kv-footer__linkbtn { display: flex; align-items: center; min-height: 44px; padding: 0; }
    .kv-footer__hours a { display: inline-flex; align-items: center; min-height: 44px; }
}
@media (max-width: 520px) { .kv-footer__cols { grid-template-columns: 1fr 1fr; } .kv-footer__cols > div:last-child { grid-column: 1 / -1; } .kv-footer__bottom { flex-direction: column; align-items: flex-start; } }
/* Telefon (s JS, kv-ui.js → .is-folding / .is-foldable): Nákup, Služby a Informace jako akordeony — nadpis je tlačítko
   přes celou šířku (52 px) s plus ↔ mínus z linek, seznam se rozbalí plynule (grid 0fr → 1fr). Dřív ~1 000 px odkazů
   pod sebou. Kontakt zůstává otevřený. */
.kv-footer__cols.is-folding { grid-template-columns: minmax(0, 1fr); gap: 0; }
.kv-footer__cols.is-folding > * { grid-column: auto; }
.kv-footer__cols.is-folding .kv-footer__brand { padding-bottom: var(--space-7); }
.kv-footer__col.is-foldable { border-top: 1px solid var(--border-hairline); }
.kv-footer .kv-footer__col.is-foldable .kv-footer__title { margin: 0; }
.kv-footer__toggle { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); width: 100%; min-height: 52px; padding: 0; background: none; border: 0; cursor: pointer; font: inherit; letter-spacing: inherit; text-transform: inherit; color: var(--text-strong); text-align: left; transition: color var(--dur-fast) var(--ease-out); }
.kv-footer__toggle:hover { color: var(--accent); }
.kv-footer__plus { position: relative; flex: none; width: 14px; height: 14px; }
.kv-footer__plus::before, .kv-footer__plus::after { content: ""; position: absolute; background: currentColor; }
.kv-footer__plus::before { left: 0; right: 0; top: 50%; height: 1px; translate: 0 -.5px; }
.kv-footer__plus::after { top: 0; bottom: 0; left: 50%; width: 1px; translate: -.5px 0; transition: scale var(--dur-base) var(--ease-out); }
.kv-footer__col.is-open .kv-footer__plus::after { scale: 1 0; }
.kv-footer__col.is-foldable .kv-footer__fold { display: grid; grid-template-rows: 0fr; visibility: hidden; transition: grid-template-rows var(--dur-base) var(--ease-in-out), visibility 0s linear var(--dur-base); }
.kv-footer__col.is-foldable .kv-footer__fold > ul { min-height: 0; overflow: hidden; }
.kv-footer__col.is-foldable .kv-footer__fold > ul > li:last-child { margin-bottom: var(--space-3); }
.kv-footer__col.is-foldable.is-open .kv-footer__fold { grid-template-rows: 1fr; visibility: visible; transition-delay: 0s; }
.kv-footer__cols.is-folding .kv-footer__col--contact { border-top: 1px solid var(--border-hairline); padding-top: var(--space-6); }

/* ═══ 5. Pohyb ═══════════════════════════════════════════════════════════
   „Galerijní světlo" (v1.0) — pomalé prolnutí a měkký posun, žádné odskoky. Pravidla:
   • Skrytý výchozí stav platí JEN s html.js-reveal (nastaví inline skript v <head>; ne při reduced-motion, ne při tisku,
     a když skript odhalování do 2,5 s nenaběhne, třída se zase sundá — obsah nikdy nezůstane neviditelný).
   • Odhalení je @keyframes (ne transition), takže ho žádný komponentový `transition` nepřepíše. Skryto se drží
     pozastavenou animací (animation-play-state: paused) — základní opacity prvku se nikdy nemění, a tak se nespustí
     ani komponentové přechody na opacity. Posun jde přes vlastnost `translate` (ne transform), hover s transform se nebije.
   • Značení: class="reveal" (jeden prvek) · data-reveal-group na kontejneru (přímé děti postupně, krok 70 ms, max 6)
     · .kv-section, .section (mimo košík a pokladnu) a [data-reveal-section] se „rozsvítí" samy — linka kickeru, titulek,
       podtitul a odkaz v hlavičce sekce (.kv-section-head / .section__head); obsah sekce se značí zvlášť.
   • V mřížkách z linek (níže výčet + [data-reveal-cells]) buňka i její linky stojí a animuje se jen obsah buňky (.rv-cell > *).
   • Co je vidět už při načtení, ukáže skript hned bez animace (.rv-now). Líné obrázky se po načtení jemně prolnou.
   • Odhalení startuje před vjezdem do okna (rootMargin +20 %); co do okna skočí nebo přijíždí při rychlém scrollu,
     dostane .rv-quick (poloviční délka). Vodorovné police se odhalují jako celek — karty schované za okrajem police jsou hned hotové (.rv-now). */
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes fadeUp { from { opacity: 0; translate: 0 12px; } to { opacity: 1; translate: none; } }
@keyframes kvReveal { from { opacity: 0; translate: 0 var(--reveal-y, 20px); } to { opacity: 1; translate: none; } }
@keyframes kvFade { from { opacity: 0; } to { opacity: 1; } }
@keyframes kvRule { from { scale: 0 1; } to { scale: 1 1; } }
@keyframes kvRise { from { opacity: 0; translate: 0 8px; } to { opacity: 1; translate: none; } }
@view-transition { navigation: auto; }
::view-transition-old(root) { animation: fadeIn var(--dur-fast) var(--ease-out) reverse both; }
::view-transition-new(root) { animation: fadeIn var(--dur-base) var(--ease-out) both; }
.kv-header { view-transition-name: site-header; }
/* Vstup stránky: v prohlížečích s přechodem mezi dokumenty (View Transitions) stačí jemné prolnutí celé stránky;
   jen tam, kde ho prohlížeč neumí, se prolne obsah — bez posunu (transform na <main> by rozbil position: fixed). */
@supports not (view-transition-name: none) { main { animation: fadeIn var(--dur-base) var(--ease-out) backwards; } }
/* Detail produktu (.page-enter): kicker, titulek a meta po 60 ms, zbytek (cena, tlačítko Do košíku) nejpozději ve
   180 ms a kratší animací — cena a CTA jsou plně vidět do ~0,5 s (dřív až po ~0,85 s ze 600ms animace s 240ms zpožděním) */
.page-enter > * { animation: kvRise var(--dur-base) var(--ease-reveal) backwards; }
.page-enter > *:nth-child(2) { animation-delay: var(--enter-step); } .page-enter > *:nth-child(3) { animation-delay: calc(2 * var(--enter-step)); } .page-enter > *:nth-child(n+4) { animation-delay: calc(3 * var(--enter-step)); }
.product__gallery { animation: fadeIn var(--dur-base) var(--ease-out) both; }
/* Hero: titulek → perex → tlačítka po 60 ms (CTA plně vidět do ~0,45 s), fakta jen prolnutí; fotka se prolne a velmi
   pomalu „usadí" (1,03 → 1 za 1,6 s — jako když v galerii dosvítí světlo; posun ani pružení žádné) */
.kv-hero__content > * { animation: kvRise var(--dur-base) var(--ease-reveal) backwards; }
.kv-hero__content > :nth-child(3) { animation-delay: var(--enter-step); } .kv-hero__content > :nth-child(4) { animation-delay: calc(2 * var(--enter-step)); }
.kv-hero__content > .kv-hero__footer { animation-name: kvFade; animation-delay: 0ms; }
.kv-hero__media { animation: fadeIn var(--dur-base) var(--ease-out) both; }
@keyframes kvSettle { from { scale: 1.03; } to { scale: 1; } }
.home-hero .kv-hero__media > img { animation: kvSettle calc(var(--dur-reveal) + var(--dur-slow) + 100ms) var(--ease-reveal) both; }

/* — odhalování při scrollu — */
html.js-reveal :is(.reveal, [data-reveal-group] > *):not(.rv-cell),
html.js-reveal .rv-cell > * {
    animation: kvReveal var(--dur-reveal) var(--ease-reveal) backwards paused;
    animation-delay: calc(var(--i, 0) * var(--reveal-step));
}
html.js-reveal :is(.reveal, [data-reveal-group] > *).in:not(.rv-cell),
html.js-reveal .rv-cell.in > * { animation-play-state: running; }
/* do okna „skočilo" (rychlý scroll, PageDown, kotva): poloviční délka, kratší rozestup i posun — žádné dlouhé prázdno */
html.js-reveal :is(.reveal, [data-reveal-group] > *).rv-quick:not(.rv-cell),
html.js-reveal .rv-cell.rv-quick > * { --reveal-y: 10px; animation-duration: calc(var(--dur-reveal) / 2); animation-delay: calc(var(--i, 0) * var(--reveal-step) / 2); }
/* buňka mřížky z linek stojí; během odhalení ořízne obsah, aby posunutá deska nepřekryla linku pod sebou */
html.js-reveal .rv-cell:not(.rv-done) { overflow: clip; }
/* nadpis sekce: linka kickeru se vykreslí zleva, pak titulek, pak podtitul a odkaz */
html.js-reveal :is(.kv-section, .section:not(.co), [data-reveal-section]) :is(.kv-section-head, .section__head) :is(.kv-kicker, .kicker) { animation: kvFade var(--dur-reveal) var(--ease-reveal) backwards paused; }
html.js-reveal :is(.kv-section, .section:not(.co), [data-reveal-section]) :is(.kv-section-head, .section__head) .kv-kicker::before { transform-origin: left center; animation: kvRule var(--dur-reveal) var(--ease-reveal) backwards paused; }
html.js-reveal :is(.kv-section, .section:not(.co), [data-reveal-section]) :is(.kv-section-head__title, .section__head h1, .section__head h2) { animation: kvReveal var(--dur-reveal) var(--ease-reveal) backwards paused; animation-delay: var(--reveal-step); }
html.js-reveal :is(.kv-section, .section:not(.co), [data-reveal-section]) :is(.kv-section-head__sub, .kv-section-head__link, .section__head > a, .section__head p, [data-reveal-head]) { animation: kvReveal var(--dur-reveal) var(--ease-reveal) backwards paused; animation-delay: calc(2 * var(--reveal-step)); }
html.js-reveal :is(.kv-section, .section:not(.co), [data-reveal-section]).in :is(.kv-section-head, .section__head) :is(.kv-kicker, .kicker, .kv-section-head__title, h1, h2, .kv-section-head__sub, .kv-section-head__link, a, p, [data-reveal-head]),
html.js-reveal :is(.kv-section, .section:not(.co), [data-reveal-section]).in :is(.kv-section-head, .section__head) .kv-kicker::before { animation-play-state: running; }
/* rychlé listování: hlavička sekce poloviční délkou a s polovičními rozestupy (jako .rv-quick u obsahu) */
html.js-reveal :is(.kv-section, .section:not(.co), [data-reveal-section]).rv-quick :is(.kv-section-head, .section__head) :is(.kv-kicker, .kicker, .kv-section-head__title, h1, h2, .kv-section-head__sub, .kv-section-head__link, a, p, [data-reveal-head]),
html.js-reveal :is(.kv-section, .section:not(.co), [data-reveal-section]).rv-quick :is(.kv-section-head, .section__head) .kv-kicker::before { --reveal-y: 10px; animation-duration: calc(var(--dur-reveal) / 2); }
html.js-reveal :is(.kv-section, .section:not(.co), [data-reveal-section]).rv-quick :is(.kv-section-head__title, .section__head h1, .section__head h2) { animation-delay: calc(var(--reveal-step) / 2); }
html.js-reveal :is(.kv-section, .section:not(.co), [data-reveal-section]).rv-quick :is(.kv-section-head__sub, .kv-section-head__link, .section__head > a, .section__head p, [data-reveal-head]) { animation-delay: var(--reveal-step); }
/* co bylo vidět už při načtení: rovnou, bez animace */
html.js-reveal .rv-now, html.js-reveal .rv-now > *, html.js-reveal .rv-now :is(.kv-section-head, .section__head) *, html.js-reveal .rv-now .kv-kicker::before { animation: none; }
/* líné obrázky: po načtení prolnutí (pozastavená animace drží obrázek průhledný jen do načtení) */
img.img-fade { animation: kvFade var(--dur-slow) var(--ease-out) backwards paused; }
img.img-fade.is-loaded { animation-play-state: running; }

.toast { position: fixed; bottom: calc(var(--fx-buy, 0px) + 76px); right: 20px; z-index: var(--z-toast); display: inline-flex; align-items: center; gap: var(--space-5); background: var(--ink-900); color: var(--paper-50); padding: 16px 20px; box-shadow: var(--shadow-3); font: var(--type-body-sm); animation: fadeUp var(--dur-base) var(--ease-out); }
.toast a { color: var(--paper-50); font: var(--weight-semibold) var(--text-xs)/1 var(--font-text); letter-spacing: .05em; text-transform: uppercase; white-space: nowrap; border-bottom: 1px solid var(--paper-50); }
.toast.out { opacity: 0; transition: opacity var(--dur-base) var(--ease-out); }
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; } /* kotvy (#poptavka, #cenik…) skočí, neposouvají se */
    .reveal, [data-reveal-group] > * { opacity: 1; translate: none; }
    .kv-hero__content > *, .kv-hero__media, .kv-hero__media > img, main, .alert, .toast, .mega, .page-enter > *, .product__gallery, #cookie-bar, #compare-bar, #chat-panel, img.img-fade { animation: none !important; }
    ::view-transition-old(root), ::view-transition-new(root), ::view-transition-group(*), ::view-transition-image-pair(*) { animation: none !important; }
}
/* Tisk: nic neodhalené nesmí chybět, plovoucí prvky pryč */
@media print {
    *, *::before, *::after { animation: none !important; transition: none !important; }
    .kv-strip, #chat-bubble, #chat-panel, #cookie-bar, #compare-bar, .toast, .nav-toggle, .kv-header__search, .kv-drawer { display: none !important; }
    .kv-header { position: static; }
}

/* ═══ 6. Cookies, porovnání, chat ═══════════════════════════════════════
   Vrstvy (z-index) plovoucích prvků — jedna stupnice, ať se nic nepřekrývá náhodou:
     lišta „Do košíku" (mobil) 90 · chat 170 · porovnání 180 · cookies 200 · toast 300 · let do košíku 350 · šuplík 400 · linka načítání 1000
   Spodní odsazení (kontrakt v1.0): cart-fx.js (layoutFloats) nastaví --fx-buy = kolik px spodku obrazovky zakrývají lepicí
   lišty (#sticky-buy, #co-sticky a cokoli s atributem data-float-bar) a --fx-compare (lišta porovnání + 8 px);
   chat, toast a cookies se podle nich skládají nad sebe místo překrývání. Na košíku a v pokladně chat není (html.no-chat). */
:root { --z-sticky-buy: 90; --z-chat: 170; --z-comparebar: 180; --z-cookie: 200; --z-fly: 350; --z-drawer: var(--z-modal); --z-progress: 1000; }
@keyframes kvFloatOut { from { opacity: 1; translate: none; } to { opacity: 0; translate: 0 8px; } }
#cookie-bar { display: none; position: fixed; bottom: calc(var(--fx-buy, 0px) + var(--fx-compare, 0px) + 16px); left: 16px; right: auto; width: min(560px, calc(100vw - 32px)); margin: 0; background: var(--ink-900); color: var(--paper-50); padding: 18px 20px; box-shadow: var(--shadow-3); z-index: var(--z-cookie); font: var(--type-body-sm); animation: fadeUp var(--dur-base) var(--ease-out); }
#cookie-bar.is-out { animation: kvFloatOut var(--dur-fast) var(--ease-out) both; pointer-events: none; }
.cookie-bar__text { margin: 0 0 12px; }
.cookie-bar__actions { display: flex; gap: 8px; justify-content: flex-end; flex-wrap: wrap; }
#cookie-bar a { color: var(--paper-50); text-decoration: underline; text-underline-offset: 3px; }
#cookie-bar .btn { padding: 10px 14px; min-height: 44px; font-size: var(--text-xs); }
#cookie-bar .btn--onDark { background: var(--paper-50); color: var(--ink-900); border-color: var(--paper-50); }
#cookie-bar .btn--onDark:hover { background: transparent; color: var(--paper-50); }
#cookie-bar .btn--outlineDark { background: transparent; color: var(--paper-50); border-color: var(--ash-700); }
#cookie-bar .btn--outlineDark:hover { border-color: var(--paper-50); }
/* úvodní stránka na širokém displeji: lišta vpravo, ať nezakrývá hlavní tlačítka hero vlevo */
@media (min-width: 761px) { #cookie-bar { left: auto; right: 16px; } }
#compare-bar { display: none; position: fixed; bottom: calc(var(--fx-buy, 0px) + 16px); left: 50%; transform: translateX(-50%); z-index: var(--z-comparebar); align-items: center; gap: var(--space-5); background: var(--ink-900); color: var(--paper-50); padding: 12px 12px 12px 20px; box-shadow: var(--shadow-3); font: var(--type-body-sm); animation: fadeUp var(--dur-base) var(--ease-out); }
#compare-bar .btn { background: var(--paper-50); color: var(--ink-900); border-color: var(--paper-50); padding: 10px 14px; font-size: var(--text-xs); }
#compare-bar .btn:hover { background: transparent; color: var(--paper-50); }
#compare-bar button { background: none; border: 0; color: var(--text-inverse-muted); cursor: pointer; font: var(--type-spec); letter-spacing: .06em; text-transform: uppercase; min-height: 44px; padding: 0 8px; }
:root:root #compare-bar button { color: var(--stone-400); }
/* chat: bublina ↔ křížek prolnutím, panel s vlastním tlačítkem Zavřít */
html.no-chat #chat-bubble, html.no-chat #chat-panel { display: none !important; }
html:not(.js) #chat-bubble { display: none; } /* bez skriptu by bublina byla mrtvé tlačítko */
#chat-bubble { position: fixed; right: 20px; bottom: calc(var(--fx-buy, 0px) + 16px); z-index: var(--z-chat); display: inline-flex; align-items: center; gap: 10px; min-height: 44px; background: var(--ink-900); color: var(--paper-50); border: 1px solid var(--ink-900); padding: 13px 18px; cursor: pointer; font: var(--weight-semibold) var(--text-xs)/1 var(--font-text); letter-spacing: .08em; text-transform: uppercase; transition: var(--transition-control); }
#chat-bubble:hover { background: var(--paper-50); color: var(--ink-900); }
:root[data-theme="dark"] #chat-bubble { background: var(--paper-50); color: var(--ink-900); border-color: var(--paper-50); }
:root[data-theme="dark"] #chat-bubble:hover { background: var(--ink-900); color: var(--paper-50); }
.chat-bubble__icon { display: grid; }
.chat-bubble__icon > span { grid-area: 1 / 1; display: grid; transition: opacity var(--dur-fast) var(--ease-out); }
.chat-bubble__close { opacity: 0; }
#chat-bubble.open .chat-bubble__open { opacity: 0; }
#chat-bubble.open .chat-bubble__close { opacity: 1; }
#chat-bubble.open .chat-bubble__label { display: none; }
.chat-bubble__label { display: inline-block; max-width: 24ch; overflow: hidden; white-space: nowrap; vertical-align: middle; transition: max-width var(--dur-base) var(--ease-in-out), opacity var(--dur-fast) var(--ease-out); }
/* po odscrollování se bublina na desktopu stáhne na ikonu (méně zakrývá obsah); při najetí nebo fokusu se rozbalí */
html.is-scrolled #chat-bubble:not(.open):not(:hover):not(:focus-visible) { gap: 0; }
html.is-scrolled #chat-bubble:not(.open):not(:hover):not(:focus-visible) .chat-bubble__label { max-width: 0; opacity: 0; }
#chat-panel[hidden] { display: none !important; }
#chat-panel { position: fixed; right: 20px; bottom: calc(var(--fx-buy, 0px) + 72px); width: 360px; max-width: calc(100vw - 32px); max-height: calc(100dvh - var(--fx-buy, 0px) - 96px); overflow: auto; overscroll-behavior: contain; background: var(--surface-card); border: 1px solid var(--border-strong); z-index: var(--z-chat); display: flex; flex-direction: column; font: var(--type-body-sm); animation: fadeUp var(--dur-base) var(--ease-out); }
#chat-panel.is-out { animation: kvFloatOut var(--dur-fast) var(--ease-out) both; pointer-events: none; }
.chat-panel__head { background: var(--ink-900); color: var(--paper-50); padding: 14px 12px 14px 16px; display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.chat-panel__titles { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.chat-panel__head strong { font: var(--type-h3); font-size: var(--text-xl); color: var(--paper-50); }
.chat-panel__close { flex: none; display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 0 6px; background: none; border: 0; color: var(--paper-50); cursor: pointer; font: var(--weight-semibold) var(--text-2xs)/1 var(--font-text); letter-spacing: .1em; text-transform: uppercase; }
.chat-panel__close:hover { color: var(--signal-300); }
.chat-panel__close:focus-visible { box-shadow: 0 0 0 1px var(--paper-50); }
.chat-panel__body { padding: 14px 16px; display: flex; flex-direction: column; gap: 8px; max-height: 60vh; overflow: auto; }
.chat-panel__label { font: var(--type-kicker); letter-spacing: .08em; text-transform: uppercase; color: var(--text-muted); margin-top: 4px; }
.chat-panel__label span { text-transform: none; letter-spacing: 0; font-weight: var(--weight-regular); }
.chat-msg { display: flex; flex-direction: column; gap: 2px; max-width: 88%; }
.chat-msg--customer { align-self: flex-end; align-items: flex-end; }
.chat-msg--admin { align-self: flex-start; align-items: flex-start; }
#chat-messages { display: flex; flex-direction: column; gap: 8px; }
.chat-msg__bubble { padding: 8px 12px; border: 1px solid var(--border-hairline); background: var(--surface-card); }
.chat-msg--customer .chat-msg__bubble { background: var(--text-strong); color: var(--bg-page); border-color: var(--text-strong); }
.chat-msg__meta, .chat-system, .chat-status { font: var(--type-kicker); letter-spacing: .04em; color: var(--text-faint); }
.chat-status { font: var(--type-body-sm); color: var(--text-muted); }
.chat-system { text-align: center; padding: 4px 0; }
.chat-rate__label { margin-bottom: 6px; }
.chat-rate__stars { display: flex; gap: 4px; }
.chat-rate__stars button { display: inline-grid; place-items: center; background: none; border: 1px solid var(--border-hairline); width: 44px; height: 44px; cursor: pointer; color: var(--text-strong); }
.chat-rate__stars button:hover, .chat-rate__stars button.on, .chat-rate__stars button.lit { background: var(--text-strong); color: var(--bg-page); border-color: var(--text-strong); }
.chat-rate__stars button.on .ico, .chat-rate__stars button.lit .ico { fill: currentColor; }
.chat-panel__sub { font: var(--type-body-sm); color: var(--stone-400); }
.chat-panel__err { color: var(--state-bad); font: var(--type-body-sm); }
.chat-panel__err:empty { display: none; }
.chat-send { margin-top: 10px; max-width: none; }
.chat-new { margin-top: 10px; }
@media (max-width: 600px) { .chat-bubble__label { display: none; } #chat-bubble { width: 48px; height: 48px; padding: 0; justify-content: center; } }
/* úzké obrazovky: porovnání přes celou šířku, chat nad ním, cookies nad lištou Do košíku; dokud je vidět cookie lišta, chat a porovnání čekají */
@media (max-width: 760px) {
    #compare-bar { left: 12px; right: 12px; transform: none; justify-content: space-between; bottom: calc(var(--fx-buy, 0px) + 12px); }
    #chat-bubble { right: 12px; bottom: calc(var(--fx-buy, 0px) + var(--fx-compare, 0px) + 12px); }
    #chat-panel { right: 12px; left: 12px; width: auto; max-width: none; bottom: calc(var(--fx-buy, 0px) + var(--fx-compare, 0px) + 68px); max-height: calc(100dvh - var(--fx-buy, 0px) - var(--fx-compare, 0px) - 140px); }
    .toast { left: 12px; right: 12px; bottom: calc(var(--fx-buy, 0px) + var(--fx-compare, 0px) + 68px); justify-content: space-between; }
    #cookie-bar { left: 12px; width: auto; right: 12px; bottom: calc(var(--fx-buy, 0px) + 12px); }
    body.has-cookiebar #chat-bubble, body.has-cookiebar #compare-bar { visibility: hidden; }
}
/* dokud je vidět cookie lišta (vpravo dole), bublina chatu počká — nepřekrývají se */
body.has-cookiebar #chat-bubble { visibility: hidden; }
/* bublina se kříží s hlavním tlačítkem (data-float-avoid, cart-fx.js) — na tu dobu se prolne pryč */
#chat-bubble { transition: var(--transition-control), visibility 0s; }
body.has-float-under #chat-bubble:not(.open) { opacity: 0; visibility: hidden; pointer-events: none; transition: opacity var(--dur-base) var(--ease-out), visibility 0s linear var(--dur-base); }
/* otevřené mobilní menu: plovoucí prvky stranou */
html.has-menu #chat-bubble, html.has-menu #chat-panel, html.has-menu #compare-bar, html.has-menu .toast { visibility: hidden; }

/* ═══ 7. Výpis a filtr ═══════════════════════════════════════════════════ */
/* v1.0 (A2): hlavička výpisu přes celou šířku (titulek se už nemačká vedle řazení), lišta nad výsledky
   (Filtr · počet · Řadit), filtr bez přenačítání stránky (kv-catalog.js), na ≤ 900 px spodní šuplík
   se živým počtem „Zobrazit N produktů". */
.listing-head { display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-3); margin: 0 0 var(--space-7); }
.listing-head__title { margin: 0; overflow-wrap: anywhere; }
.listing-head__sub { margin: 0; font: var(--type-body); color: var(--text-muted); max-width: 60ch; }
.listing-head__note { margin: var(--space-2) 0 0; padding-left: var(--space-3); border-left: 2px solid var(--border-strong); font: var(--type-body-sm); color: var(--text-muted); }
.listing-head__note strong { color: var(--text-strong); }

.catalog { display: grid; grid-template-columns: 248px minmax(0, 1fr); gap: var(--space-7); align-items: start; }
.facets { position: sticky; top: calc(var(--header-total, 113px) - var(--tuck-off, 0px) + 16px); display: flex; flex-direction: column; border: 1px solid var(--border-strong); background: var(--surface-card); max-height: calc(100vh - var(--header-total, 113px) + var(--tuck-off, 0px) - 32px); transition: top var(--dur-base) var(--ease-in-out), max-height var(--dur-base) var(--ease-in-out); }
/* desktop: když se navigace hlavičky při scrollu dolů schová (A1, .is-tucked = o 49 px), lepicí panely katalogu
   (filtr, galerie detailu, hlavička porovnání) dojedou pod ni stejným pohybem — žádná mezera nad nimi */
@media (min-width: 1181px) { html:has(.kv-header.is-tucked) :is(.facets, .product__gallery, .compare-sticky) { --tuck-off: 49px; } }
@media (prefers-reduced-motion: reduce) { .facets, .product__gallery, .compare-sticky { transition: none; } }
.facets__form { display: flex; flex-direction: column; min-height: 0; flex: 1; margin: 0; }
.facets__head { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); padding: var(--space-5) var(--space-5) var(--space-3); }
.facets__title { margin: 0; font: var(--type-kicker); letter-spacing: .08em; text-transform: uppercase; color: var(--text-strong); }
.facets__close { display: none; }
.facets__body { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 0 var(--space-5) var(--space-3); }
.facets__foot { display: grid; gap: var(--space-3); padding: var(--space-4) var(--space-5) var(--space-5); border-top: 1px solid var(--border-hairline); }
.facets__reset { justify-self: center; font: var(--type-body-sm); color: var(--text-muted); text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 1px; padding: 6px 0; }
.facets__reset:hover { color: var(--accent); }
/* se skriptem se filtr na počítači použije hned po změně — tlačítko jen na mobilu (a bez skriptu) */
@media (min-width: 901px) {
    html.js .facets__apply { display: none; }
    html.js .facets__foot:not(:has(.facets__reset)) { display: none; }
}
.facet-group { min-width: 0; margin: 0; padding: 12px 0; border: 0; border-top: 1px solid var(--border-hairline); }
.facet-group:first-child { border-top: 0; padding-top: 0; }
/* počítač: nadpis „Filtr" oddělený od první skupiny linkou (jako každá další skupina) — dřív splýval s „Dostupnost" */
@media (min-width: 901px) { .facets__body > .facet-group:first-child { border-top: 1px solid var(--border-hairline); padding-top: 12px; } .facets__head { padding-bottom: var(--space-2); } }
.facet-group__title { display: flex; align-items: center; gap: 8px; width: 100%; padding: 0; margin: 0 0 6px; font: var(--type-spec); color: var(--text-muted); text-transform: uppercase; letter-spacing: .1em; }
/* legenda fieldsetu by jinak „sedla" do horní linky skupiny a linku schovala */
legend.facet-group__title { float: left; }
legend.facet-group__title + * { clear: both; }
.facet-group__n { display: inline-grid; place-items: center; min-width: 18px; height: 18px; padding: 0 4px; background: var(--text-strong); color: var(--bg-page); font: var(--weight-semibold) var(--text-2xs)/1 var(--font-text); letter-spacing: 0; }
.facet-group--collapsible summary { cursor: pointer; list-style: none; position: relative; min-height: 32px; margin: 0; padding-right: 20px; }
.facet-group--collapsible summary::-webkit-details-marker { display: none; }
.facet-group--collapsible summary::after { content: ""; position: absolute; right: 4px; top: 50%; width: 7px; height: 7px; margin-top: -6px; border-right: 1px solid var(--text-muted); border-bottom: 1px solid var(--text-muted); transform: rotate(45deg); transition: transform var(--dur-fast) var(--ease-out); }
.facet-group--collapsible:not([open]) summary::after { transform: rotate(-45deg); }
.facet-group--collapsible[open] summary { margin-bottom: 6px; }
/* plynulé rozbalení (prohlížeče s ::details-content), jinak se otevře hned */
.facet-group--collapsible { interpolate-size: allow-keywords; }
.facet-group--collapsible::details-content { block-size: 0; overflow: clip; transition: block-size var(--dur-base) var(--ease-out), content-visibility var(--dur-base) var(--ease-out) allow-discrete; }
.facet-group--collapsible[open]::details-content { block-size: auto; }
.facet-opt { display: flex; align-items: center; gap: var(--space-3); min-height: 36px; padding: 4px 0; font: var(--type-body-sm); color: var(--text-body); cursor: pointer; text-transform: none; letter-spacing: 0; }
.facet-opt input { appearance: none; width: 18px; height: 18px; flex: none; border: 1px solid var(--border-strong); background: transparent; display: grid; place-items: center; cursor: pointer; }
.facet-opt input:checked { background: var(--text-strong); border-color: var(--text-strong); }
.facet-opt input:checked::after { content: ""; width: 8px; height: 4px; border-left: 1.5px solid var(--bg-page); border-bottom: 1.5px solid var(--bg-page); transform: rotate(-45deg) translate(1px, -1px); }
.facet-opt > span:first-of-type { display: flex; align-items: center; gap: 8px; min-width: 0; }
.facet-opt:hover > span:first-of-type { color: var(--text-strong); }
.facet-count { margin-left: auto; font: var(--type-body-sm); color: var(--text-faint); font-variant-numeric: tabular-nums; }
.facet-price { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto; align-items: center; gap: 6px; }
.facet-price input { padding: 9px 10px; font-size: var(--text-sm); }
.facet-price__unit { font: var(--type-kicker); letter-spacing: .06em; color: var(--text-muted); }

/* lišta nad výsledky: Filtr (mobil) · počet · řazení */
.listing-bar { display: flex; align-items: center; gap: var(--space-4); margin-bottom: var(--space-5); min-height: 44px; }
.listing-bar__filters { display: none; }
.listing-bar__count { margin-right: auto; font: var(--type-spec); color: var(--text-faint); letter-spacing: .06em; text-transform: uppercase; }
.listing-bar__badge { display: inline-grid; place-items: center; min-width: 20px; height: 20px; padding: 0 5px; margin-left: 2px; background: var(--accent); color: var(--text-on-accent); font: var(--weight-semibold) var(--text-2xs)/1 var(--font-text); letter-spacing: 0; }
.listing-sort { display: flex; align-items: center; gap: 10px; margin: 0; }
.listing-sort__label { font: var(--type-kicker); letter-spacing: .08em; text-transform: uppercase; color: var(--text-muted); white-space: nowrap; }
.listing-sort select.sort { min-height: 44px; }

/* čipy aktivních filtrů (z adresy — nezmizí ani při nulovém výsledku) */
.facet-chips { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin-bottom: var(--space-5); }
.facet-chip { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; font: var(--weight-medium) var(--text-sm)/1 var(--font-text); padding: 9px 14px; border: 1px solid var(--text-strong); background: var(--text-strong); color: var(--bg-page); cursor: pointer; transition: var(--transition-control); }
/* barvy jen z tokenů (fungují i v tmavém režimu bez zrcadla); :root:root, aby najetí nepřebila obecná pravidla odkazů a tlačítek */
:root:root .facet-chip:hover { background: transparent; color: var(--text-strong); border-color: var(--text-strong); }
.facet-chips__reset { font: var(--type-body-sm); color: var(--text-muted); text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 1px; padding: 8px 4px; }
.facet-chips__label { font: var(--type-kicker); letter-spacing: .08em; text-transform: uppercase; color: var(--text-muted); margin-right: 4px; }

/* výsledky během načítání: tiché ztlumení, žádný skok (kv-catalog.js) */
/* načítání výsledků: tiché ztlumení až po prodlevě záměru (rychlá odpověď nebliká), návrat bez zpoždění */
.catalog-results { min-width: 0; transition: opacity var(--dur-base) var(--ease-out); }
.catalog-results.is-busy { opacity: .45; pointer-events: none; cursor: progress; transition-delay: var(--dur-intent); }
@media (prefers-reduced-motion: reduce) { .catalog-results { transition: none; } }

/* prázdný výsledek: rozcestí místo slepé uličky */
.listing-empty { padding-top: var(--space-8); }
.listing-empty__tips { margin: 0; padding: 0; list-style: none; display: grid; gap: 6px; font: var(--type-body); color: var(--text-muted); max-width: 60ch; }
.listing-empty__tips li { position: relative; padding-left: 22px; }
.listing-empty__tips li::before { content: ""; position: absolute; left: 0; top: .8em; width: 12px; height: 1px; background: var(--text-strong); }
.listing-empty__cats { display: grid; gap: var(--space-3); margin-top: var(--space-4); width: 100%; }
.listing-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.listing-relax { list-style: none; margin: 0; padding: 0; width: 100%; max-width: 560px; border-top: 1px solid var(--border-hairline); }
.listing-relax a { display: flex; align-items: baseline; justify-content: space-between; gap: var(--space-4); padding: 12px 0; min-height: 44px; border-bottom: 1px solid var(--border-hairline); color: var(--text-strong); transition: padding-left var(--dur-base) var(--ease-out), color var(--dur-fast) var(--ease-out); }
.listing-relax a:hover { padding-left: var(--space-2); color: var(--accent); text-decoration: none; }
.listing-relax span { font: italic 400 var(--text-md)/1 var(--font-display); color: var(--accent); white-space: nowrap; }
.listing-fallback { border-bottom: 0; padding-bottom: 0; }

.pagination { display: flex; justify-content: center; margin-top: var(--space-8); }
.pagination .kv-pager a, .pagination .kv-pager span { transition: var(--transition-control); }

/* podkategorie: rovnoměrná mřížka (dřív druhá řada širší než první), na mobilu vodorovný pás */
/* každá buňka má vlastní rámeček (sousední linky se překrývají) — ani jedna podkategorie nenechá linku přes prázdno */
.subcats { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); padding: 1px 0 0 1px; margin: 0 0 var(--space-7); }
.subcat { display: flex; align-items: center; gap: 12px; min-width: 0; min-height: 64px; margin: -1px 0 0 -1px; padding: 12px 14px; background: var(--bg-page); color: var(--text-strong); font: var(--weight-medium) var(--text-sm)/1.3 var(--font-text); border: 1px solid var(--border-hairline); transition: var(--transition-control); }
.subcat:hover { background: var(--surface-raised); color: var(--accent); text-decoration: none; }
.subcat__text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.subcat__pic { width: 40px; height: 40px; object-fit: contain; flex: none; background: var(--img-well); }
.subcat__ico { display: grid; place-items: center; width: 40px; height: 40px; background: var(--img-well); color: var(--ink-900); flex: none; }
.subcat small { display: block; font: var(--type-kicker); letter-spacing: .06em; text-transform: uppercase; color: var(--text-faint); }
.seo-text { border-top: 1px solid var(--border-strong); margin-top: var(--space-9); padding-top: var(--space-6); max-width: 70ch; color: var(--text-muted); font: var(--type-body-sm); }

/* šuplík filtru — překryv stejný jako u šuplíku košíku (--overlay) */
.facets-scrim { position: fixed; inset: 0; z-index: calc(var(--z-modal) - 1); background: var(--overlay); opacity: 0; transition: opacity var(--dur-base) var(--ease-out); }
.facets-scrim.is-on { opacity: 1; }
@media (min-width: 901px) { .facets-scrim { display: none; } }

@media (max-width: 900px) {
    .catalog { display: block; }
    .facets { position: fixed; inset: auto 0 0 0; z-index: var(--z-modal); max-height: min(86dvh, calc(100dvh - 40px)); border: 0; border-top: 1px solid var(--border-strong); background: var(--bg-page);
        transform: translateY(100%); visibility: hidden; transition: transform var(--dur-base) var(--ease-out), visibility 0s linear var(--dur-base); }
    .facets.is-open, .facets:target { transform: none; visibility: visible; transition: transform var(--dur-base) var(--ease-out), visibility 0s; }
    .facets__head { padding: 8px 8px 8px var(--gutter); border-bottom: 1px solid var(--border-hairline); }
    .facets__title { font: var(--type-h3); letter-spacing: var(--tracking-display); text-transform: none; }
    .facets__close { display: inline-grid; }
    .facets__body { padding: var(--space-4) var(--gutter) var(--space-3); }
    .facets__foot { grid-template-columns: 1fr auto; align-items: center; padding: 12px var(--gutter) calc(12px + env(safe-area-inset-bottom)); background: var(--bg-page); }
    .facets__foot .facets__reset { grid-column: 2; grid-row: 1; padding: 12px 4px; }
    .facet-opt { min-height: 44px; }
    .facet-price input { font-size: 16px; min-height: 44px; }
    .listing-bar { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 8px; }
    .listing-bar__filters { display: inline-flex; min-height: 52px; padding-top: 10px; padding-bottom: 10px; }
    .listing-bar__count { grid-column: 1 / -1; grid-row: 2; }
    .listing-sort { min-width: 0; position: relative; }
    /* popisek „Řadit" nad hodnotou uvnitř rámečku — hodnota má celou šířku a nic se neuřízne */
    .listing-sort__label { position: absolute; left: 14px; top: 9px; pointer-events: none; font-size: 10px; line-height: 1; color: var(--text-faint); }
    .listing-sort select.sort { width: 100%; min-width: 0; min-height: 52px; padding: 22px 30px 6px 14px; background-position: right 10px center; font-size: 16px; line-height: 1.2; text-transform: none; letter-spacing: 0; font-weight: var(--weight-medium); }
}
@media (max-width: 760px) {
    .subcats { display: flex; gap: 8px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; border: 0; margin: 0 calc(-1 * var(--gutter)) var(--space-5); padding: 0 var(--gutter); scroll-padding-inline: var(--gutter); }
    .subcats::-webkit-scrollbar { display: none; }
    .subcat { flex: 0 0 auto; min-height: 48px; margin: 0; padding: 6px 14px 6px 6px; border: 1px solid var(--border-hairline); scroll-snap-align: start; white-space: nowrap; }
    .subcat__pic, .subcat__ico { width: 34px; height: 34px; }
    .listing-head { margin-bottom: var(--space-5); }
}

/* Kávová karta v mřížce výpisu */
.coffee-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--gap-grid); }
@media (max-width: 900px) { .coffee-grid { grid-template-columns: 1fr; } }
/* fotka balíčku celá a vycentrovaná: procentní výška v mřížce s auto řádkem se počítala ze šířky
   (balíček přetékal a spodek se ořízl) — absolutně usazená fotka bere výšku z pole */
.kv-coffee__media img { position: absolute; inset: 0; margin: auto; width: auto; height: 80%; max-width: 86%; object-fit: contain; mix-blend-mode: multiply; transition: opacity var(--dur-base) var(--ease-out); }
.kv-coffee__media .ph-bag { color: var(--stone-300); }
/* káva bez chuťového profilu a s jedním balením (např. Italcaffé z ERP): kompaktní karta na šířku —
   fotka vlevo, text vpravo; ve výpisu nezabírá prázdné kamenné pole přes celou šířku */
.coffee-grid .kv-coffee--plain { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); }
.coffee-grid .kv-coffee--plain .kv-coffee__media { aspect-ratio: auto; min-height: 240px; border-bottom: 0; border-right: 1px solid var(--border-strong); }
.coffee-grid .kv-coffee--plain .kv-coffee__body { justify-content: space-between; }
/* úzké pole na výšku: fotka (čtverec s bílými okraji) smí přesáhnout do stran — ořízne se jen bílé pozadí, balíček zůstane celý */
.coffee-grid .kv-coffee--plain .kv-coffee__media img { height: 86%; max-width: none; }
@media (max-width: 640px) {
    .coffee-grid .kv-coffee--plain { grid-template-columns: minmax(0, 9fr) minmax(0, 11fr); }
    .coffee-grid .kv-coffee--plain .kv-coffee__media { min-height: 0; }
    .coffee-grid .kv-coffee--plain .kv-coffee__media img { height: 92%; }
    .coffee-grid .kv-coffee--plain .kv-coffee__body { padding: var(--space-4); gap: var(--space-3); }
    .coffee-grid .kv-coffee--plain .kv-coffee__title { font-size: var(--text-lg); line-height: 1.15; }
    .coffee-grid .kv-coffee--plain .kv-coffee__foot { flex-direction: column; align-items: stretch; gap: var(--space-3); }
    /* celý název je odkaz na detail — tlačítko přes celou šířku místo dvojice „Detail" + úzké tlačítko */
    .coffee-grid .kv-coffee--plain .kv-coffee__more { display: none; }
    .coffee-grid .kv-coffee--plain .kv-coffee__actions form { flex: 1; }
    .coffee-grid .kv-coffee--plain .kv-coffee__actions .kv-btn { width: 100%; padding-inline: 12px; }
}
.kv-coffee__foot { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; border-top: 1px solid var(--border-hairline); padding-top: var(--space-4); flex-wrap: wrap; margin-top: auto; }
.kv-coffee__foot form { margin: 0; }
/* spodní blok karty (profil, balení, cena) se v řadě karet srovná: volné místo jde mezi text a profil, ne pod cenu —
   jinak by delší původ nebo popis v jedné kartě posunul přepínač balení a cenu níž než u sousední */
.kv-coffee__body > .kv-bars, .kv-coffee__body > :not(.kv-bars) + .kv-pack { margin-top: auto; }
.kv-coffee__body > :is(.kv-bars, .kv-pack) ~ .kv-coffee__foot { margin-top: 0; }
.kv-coffee__actions { display: flex; gap: 16px; align-items: center; flex-wrap: wrap; }
.kv-coffee__desc { font: var(--type-body-sm); color: var(--text-muted); margin: 0; }
.kv-coffee__more { font: var(--type-label); letter-spacing: .04em; text-transform: uppercase; border-bottom: 1px solid var(--border-strong); padding: 12px 0 2px; }
.kv-coffee__more:hover { color: var(--accent); border-color: var(--accent); text-decoration: none; }
.kv-coffee .kv-avail { margin-top: 6px; }
.kv-price__main { transition: opacity var(--dur-fast) var(--ease-out); }
.kv-price__main.swap { opacity: 0; }
/* detail kávy: balení nad cenou (cena a „Do košíku" zůstávají nad ohybem), chuťový profil až pod tlačítky */
.coffee-packs { margin-top: var(--space-6); }
.coffee-packs .kv-field__label { display: block; margin-bottom: 8px; }
.coffee-packs + .product__pricebox { margin-top: var(--space-5); }
/* chuťový profil: linky místo boxu (stejný jazyk jako parametry a doručení pod ním) */
.coffee-profile { display: grid; gap: var(--space-4); margin: var(--space-6) 0 0; padding: var(--space-5) 0; border-top: 1px solid var(--border-strong); border-bottom: 1px solid var(--border-hairline); }
.coffee-profile .kv-bar { grid-template-columns: 124px minmax(0, 1fr); gap: var(--space-4); }
@media (max-width: 760px) { .coffee-profile .kv-bar { grid-template-columns: 118px minmax(0, 1fr); gap: var(--space-3); } }
.coffee-profile__head { display: flex; gap: 8px; flex-wrap: wrap; }
.coffee-profile .kv-field__label { margin-bottom: 8px; }
.coffee-chip { display: inline-flex; align-items: center; gap: 6px; font: var(--type-kicker); letter-spacing: .06em; text-transform: uppercase; padding: 6px 10px; border: 1px solid var(--border-hairline); color: var(--text-body); }
.coffee-chip--roast { border-color: var(--border-strong); }
.kv-pack--links { display: grid; }
.kv-pack--links a { text-decoration: none; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; min-height: 64px; padding: 10px 6px; border-right: 1px solid var(--border-strong); font: var(--weight-semibold) var(--text-xs)/1 var(--font-text); letter-spacing: .06em; color: var(--text-muted); transition: var(--transition-control); }
.kv-pack--links a:last-child { border-right: 0; }
.kv-pack--links a:hover { color: var(--text-strong); background: var(--surface-raised); }
.kv-pack--links .kv-pack__u { font: var(--weight-regular) var(--text-2xs)/1.2 var(--font-text); letter-spacing: .02em; text-transform: none; opacity: 1; }
.kv-pack--links a.is-active { background: var(--text-strong); color: var(--bg-page); }
.kv-pack--links a.is-out .kv-pack__w { text-decoration: line-through; text-decoration-thickness: 1px; }

/* ═══ 8. Detail produktu ═════════════════════════════════════════════════ */
/* v1.0 (A2): galerie exponátu — na počítači svislý pás náhledů vlevo (vejde se nad ohyb), na mobilu pás fotek
   posouvaný prstem s počítadlem „1 / 4"; klik otevře fotku přes celou obrazovku. Na tabletu dva sloupce,
   ať je nad ohybem i název a cena. Krokovač a „Do košíku" vždy na jednom řádku, ovládání ≥ 44 px. */
.product { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--space-9); align-items: start; }
.product__gallery { display: grid; grid-template-columns: 72px minmax(0, 1fr); gap: 12px; align-items: start; position: sticky; top: calc(var(--header-total, 113px) - var(--tuck-off, 0px) + 24px); transition: top var(--dur-base) var(--ease-in-out); }
.product__gallery:not(:has(.product__thumbs)) { grid-template-columns: minmax(0, 1fr); }
.product__thumbs { display: flex; flex-direction: column; gap: 8px; max-height: 100%; overflow-y: auto; scrollbar-width: none; }
.product__thumbs::-webkit-scrollbar { display: none; }
.product__thumbs button { flex: none; width: 72px; height: 72px; border: 1px solid var(--border-hairline); background: var(--img-well); padding: 0; cursor: pointer; display: grid; place-items: center; overflow: hidden; transition: var(--transition-control); }
.product__thumbs button:hover { border-color: var(--border-strong); }
.product__thumbs button.is-active { border-color: var(--border-strong); box-shadow: inset 0 0 0 1px var(--border-strong); }
.product__thumbs img { width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; }
.product__stage { position: relative; aspect-ratio: 1; background: var(--img-well); border: 1px solid var(--border-strong); overflow: hidden; }
.product__slides { display: flex; width: 100%; height: 100%; overflow-x: auto; overflow-y: hidden; scroll-snap-type: x mandatory; scrollbar-width: none; overscroll-behavior-x: contain; }
.product__slides::-webkit-scrollbar { display: none; }
.product__slides:focus { outline: none; }
.product__slide { flex: 0 0 100%; height: 100%; margin: 0; scroll-snap-align: start; scroll-snap-stop: always; display: grid; place-items: center; }
.product__zoom { display: grid; place-items: center; width: 100%; height: 100%; padding: 0; border: 0; background: transparent; cursor: zoom-in; }
.product__zoom:focus-visible { box-shadow: inset 0 0 0 2px var(--ink-900); }
.product__hero-img { max-height: 80%; max-width: 86%; width: auto; height: auto; object-fit: contain; mix-blend-mode: multiply; }
.product__hero-img.is-hero { view-transition-name: product-hero; }
.product__hero-img--placeholder { mix-blend-mode: normal; max-width: 40%; opacity: .55; }
.product__counter { position: absolute; left: 12px; bottom: 12px; padding: 6px 10px; background: var(--paper-50); color: var(--ink-900); font: italic 400 var(--text-md)/1 var(--font-display); font-variant-numeric: tabular-nums; pointer-events: none; }
.product__counter b { font-weight: 400; font-style: normal; }
.product__zoomhint { position: absolute; right: 12px; bottom: 12px; display: inline-flex; align-items: center; gap: 6px; padding: 8px 10px; background: var(--paper-50); color: var(--ink-900); font: var(--type-kicker); letter-spacing: .08em; text-transform: uppercase; pointer-events: none; opacity: 0; transition: opacity var(--dur-base) var(--ease-out); }
.product__stage:hover .product__zoomhint { opacity: 1; }

.product__eyebrow { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; }
.product__brand { font: var(--type-kicker); letter-spacing: .1em; text-transform: uppercase; color: var(--text-strong); }
.product__cat { font: var(--type-kicker); letter-spacing: .1em; text-transform: uppercase; color: var(--text-muted); }
.product__brand + .product__cat::before { content: "·"; margin-right: 14px; color: var(--text-faint); }
.product__meta { display: flex; gap: 16px; align-items: center; flex-wrap: wrap; font: var(--type-spec); color: var(--text-faint); letter-spacing: .06em; text-transform: uppercase; }
.product__meta .kv-rating { text-transform: none; letter-spacing: 0; }
.product__title { margin: var(--space-3) 0 var(--space-4); overflow-wrap: anywhere; text-wrap: balance; }
/* dlouhý název z ERP („Sálek+podsálek Latté Macchiato 1750050022 STRIPES (2 ks)") o stupeň menší — cena zůstane nad ohybem */
.product__title--long { font-size: clamp(32px, 1.6vw + 18px, 46px); line-height: 1.06; }
.product__lead { font: var(--type-body); color: var(--text-muted); margin: var(--space-5) 0 0; max-width: 52ch; }
.product__pricebox { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--space-4) var(--space-5); flex-wrap: wrap; padding: var(--space-5) 0; margin-top: var(--space-6); border-top: 1px solid var(--border-strong); border-bottom: 1px solid var(--border-strong); }
.product__pricebox--ask { flex-direction: column; align-items: flex-start; gap: var(--space-3); }
.product__avail { display: flex; flex-direction: column; gap: 8px; align-items: flex-end; }
.product__ship { display: inline-flex; align-items: center; gap: 6px; font: var(--type-kicker); letter-spacing: .06em; text-transform: uppercase; color: var(--text-muted); }
.product__note { margin: 0; font: var(--type-body-sm); color: var(--text-muted); max-width: 52ch; }
.product__alt { display: inline-block; margin-top: var(--space-3); font: var(--type-body-sm); color: var(--text-muted); }
.product__alt a { text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
.product__form { margin-top: var(--space-6); }
.product__buy { display: flex; gap: 12px; align-items: stretch; flex-wrap: nowrap; }
.product__buy .kv-qty { flex: none; height: 58px; }
.product__buy .kv-qty button { width: 46px; }
.product__buy .kv-qty input { width: 50px; font: var(--weight-semibold) var(--text-md)/1 var(--font-text); font-variant-numeric: tabular-nums; }
.product__cta { flex: 1 1 auto; min-width: 0; }
.product__form > .product__cta { width: 100%; }
/* nedostupné: hlídání jako hlavní akce */
.product__watch { padding: var(--space-5) 0 0; }
.product__watch-title { margin: 0 0 var(--space-3); font: var(--type-h3); }
.product__watch-form { display: grid; gap: var(--space-3); }
.product__watch-row { max-width: none; }
.product__watch-row input { font-size: 16px; min-height: 52px; }
.product__watch-row .kv-btn { white-space: nowrap; }
.product__watch-done { display: flex; align-items: center; gap: 10px; margin: 0; padding: 14px 16px; border: 1px solid var(--state-ok); color: var(--state-ok); font: var(--type-body-sm); }
.product__watch-done:focus { outline: none; }
[data-watch-state].is-in, [data-watch-form].is-in { animation: kvFade var(--dur-base) var(--ease-out); }
.product__watch-cancel { display: flex; flex-wrap: wrap; gap: 4px 20px; margin: var(--space-2) 0 0; }
.product__watch-undo { display: inline-flex; align-items: center; min-height: 44px; padding: 0; border: 0; background: transparent; color: var(--text-muted); font: var(--weight-semibold) var(--text-2xs)/1 var(--font-text); letter-spacing: .08em; text-transform: uppercase; text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 1px; cursor: pointer; transition: color var(--dur-fast) var(--ease-out); }
.product__watch-undo:hover { color: var(--accent); }
.product__secondary { display: flex; gap: var(--space-6); align-items: center; flex-wrap: wrap; margin-top: var(--space-5); }
.product__secondary form { margin: 0; }
.product__secondary .kv-btn--quiet { min-height: 44px; }
.product__secondary .kv-btn--quiet .ico { flex: none; transition: fill var(--dur-fast) var(--ease-out); }
.product__compare.is-comparing, .product__wish.is-active { color: var(--accent); border-bottom-color: var(--accent); }
.product__wish.is-active .ico { fill: currentColor; }
.product__wish-note { font: var(--type-body-sm); color: var(--state-ok); }
.product__wish-note a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
.product__specs { margin-top: var(--space-6); display: grid; gap: var(--space-3); justify-items: start; }
.product__specs .spec-list { width: 100%; }
.product__specs-more { display: inline-flex; align-items: center; gap: 8px; font: var(--type-label); letter-spacing: .05em; text-transform: uppercase; border-bottom: 1px solid var(--border-strong); padding: 10px 0 2px; }
.product__specs-more:hover { color: var(--accent); border-color: var(--accent); text-decoration: none; }
/* trojice přes celou šířku linky záložek (dřív 960 px a vpravo prázdná čtvrtina) */
.product__service .kv-feature { padding: var(--space-6); border-top: 0; }
.product-ask { padding-top: 0; }
.review__meta { font: var(--type-kicker); letter-spacing: .04em; color: var(--text-muted); }
.review__text { margin: 10px 0 0; font: var(--type-body); }
/* parametry: linky místo boxu (stejný rytmus a sloupec popisků jako „Doručení a platba" pod nimi) */
.spec-list { display: grid; border-top: 1px solid var(--border-strong); }
.spec-list > div { display: grid; grid-template-columns: 124px minmax(0, 1fr); gap: var(--space-4); align-items: baseline; padding: 11px 0; border-bottom: 1px solid var(--border-hairline); font: var(--type-body-sm); }
.spec-list > div span:first-child { font: var(--type-kicker); color: var(--text-faint); text-transform: uppercase; letter-spacing: .08em; }
.spec-list > div span:last-child { color: var(--text-strong); }
.tab-panel .spec-list > div { grid-template-columns: minmax(140px, 240px) minmax(0, 1fr); }
/* záložky: úplná ARIA, šipky (kv-catalog.js), dotyková výška 44 px; na mobilu sekce pod sebou */
.tabs { display: flex; gap: 4px; border-bottom: 2px solid var(--bg-inverse); margin-bottom: var(--space-6); flex-wrap: wrap; }
.tabs button { min-height: 44px; border: 0; cursor: pointer; padding: 12px 18px; text-transform: uppercase; font: var(--weight-bold) var(--text-sm)/1 var(--font-text); letter-spacing: .04em; background: transparent; color: var(--text-muted); transition: var(--transition-control); }
.tabs button:hover { color: var(--text-strong); }
.tabs button.is-active { background: var(--bg-inverse); color: var(--text-inverse); }
.tab-panel { display: none; animation: kvFade var(--dur-base) var(--ease-out); }
.tab-panel:focus { outline: none; }
.tab-panel:focus-visible { box-shadow: var(--ring); }
.tab-panel.is-active { display: block; }
.tab-panel__title { display: none; }
/* jediná sekce bez záložek: jen nadpis (linku nad ní dává oddělení sekcí) */
@media (min-width: 761px) { .product-tabs--single .tab-panel__title { display: block; margin: 0 0 var(--space-4); font: var(--type-h3); } }
.review { border-bottom: 1px solid var(--border-hairline); padding: var(--space-4) 0; }
.review__head { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; }
.review__reply { border-left: 2px solid var(--border-strong); padding: 8px 14px; margin-top: 10px; font: var(--type-body-sm); color: var(--text-muted); }
.stars { display: inline-flex; gap: 1px; color: var(--text-strong); }
.stars svg { width: 13px; height: 13px; fill: currentColor; }
.stars .is-empty { color: var(--stone-300); }
.qty-stepper { display: inline-flex; align-items: stretch; border: 1px solid var(--border-strong); background: transparent; height: 52px; }
.qty-stepper button { width: 44px; border: 0; background: transparent; color: var(--text-strong); font: var(--weight-regular) var(--text-lg)/1 var(--font-text); cursor: pointer; transition: var(--transition-control); }
.qty-stepper button:hover { background: var(--ink-900); color: var(--paper-50); }
.qty-stepper input { width: 56px; border: 0; border-left: 1px solid var(--border-strong); border-right: 1px solid var(--border-strong); text-align: center; font: var(--weight-regular) var(--text-md)/1 var(--font-display); background: transparent; color: var(--text-strong); -moz-appearance: textfield; padding: 0; }
.qty-stepper input::-webkit-outer-spin-button, .qty-stepper input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.qty-stepper input:focus { box-shadow: none; }
.sticky-buy { display: none; }
@media (max-width: 1100px) and (min-width: 901px) { .product { gap: var(--space-7); } }
/* užší sloupec (tablet, malý notebook): cena nahoře, dostupnost pod ní v řádku — nic se neodsazuje doprava */
@media (max-width: 1100px) {
    .product__pricebox { flex-direction: column; align-items: flex-start; gap: var(--space-3); }
    .product__avail { flex-direction: row; flex-wrap: wrap; align-items: center; gap: 8px 16px; }
}
@media (max-width: 900px) {
    /* tablet na výšku: dva sloupce, náhledy pryč (posun prstem + počítadlo), nad ohybem název i cena */
    .product { gap: var(--space-6); }
    .product__gallery { grid-template-columns: minmax(0, 1fr); position: static; }
    /* tablet na výšku (dva sloupce): fotka jede s dlouhým pravým sloupcem, vlevo nezeje prázdný papír */
    @media (min-width: 761px) { .product__gallery { position: sticky; } }
    .product__thumbs { display: none; }
    .product__zoomhint { display: none; }
    /* lišta se vysune, až když formulář „Do košíku" odjede nahoru z obrazovky (kv-catalog.js) */
    .sticky-buy { display: flex; position: fixed; bottom: 0; left: 0; right: 0; z-index: var(--z-sticky-buy, 90); background: var(--bg-page); border-top: 1px solid var(--border-strong); padding: 10px 16px calc(10px + env(safe-area-inset-bottom)); align-items: center; gap: 14px; transform: translateY(100%); visibility: hidden; transition: transform var(--dur-base) var(--ease-out), visibility 0s linear var(--dur-base); }
    .sticky-buy.is-on { transform: none; visibility: visible; transition: transform var(--dur-base) var(--ease-out), visibility 0s; }
    .sticky-buy__price { font: var(--type-price); color: var(--text-strong); white-space: nowrap; }
    .sticky-buy__btn { flex: 1; min-height: 48px; }
    body.has-sticky-buy { padding-bottom: 72px; }
    .tab-panel .spec-list > div { grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); }
    .product .kv-price--xl .kv-price__main { font-size: var(--text-xl); }
}
@media (max-width: 760px) {
    .product { grid-template-columns: minmax(0, 1fr); }
    .product__stage { margin: 0 calc(-1 * var(--gutter)); border-left: 0; border-right: 0; }
    .product__pricebox { align-items: flex-start; }
    .product__avail { align-items: flex-start; }
    .product .kv-price--xl .kv-price__main { font-size: 40px; }
    .product__buy { gap: 8px; }
    .product__buy .kv-qty { height: 56px; }
    .product__buy .kv-qty button { width: 44px; }
    .product__buy .kv-qty input { width: 44px; }
    .product__watch-row { flex-direction: column; border: 0; gap: 8px; }
    .product__watch-row input { border: 1px solid var(--border-strong); }
    :root:root .product__watch-row .kv-btn { border: 1px solid var(--btn-bg); min-height: 52px; }
    .spec-list > div, .tab-panel .spec-list > div { grid-template-columns: 118px minmax(0, 1fr); gap: var(--space-3); }
    /* záložky → sekce pod sebou (na telefonu se lépe scrolluje než přepíná) */
    .product-tabs .tabs { display: none; }
    .product-tabs .tab-panel { display: block; animation: none; padding-top: var(--space-6); margin-top: var(--space-6); border-top: 1px solid var(--border-strong); }
    .product-tabs .tabs + .tab-panel { margin-top: 0; padding-top: 0; border-top: 0; }
    .tab-panel__title { display: block; margin: 0 0 var(--space-4); font: var(--type-h3); }
}
/* bez skriptu záložky nepřepnou → všechny sekce pod sebou (jako na telefonu), ať je obsah dostupný;
   náhledy a „Zvětšit" bez skriptu nic nedělají (fotky jdou posouvat v pásu) */
html:not(.js) .product-tabs .tabs, html:not(.js) .product__thumbs, html:not(.js) .product__zoomhint { display: none; }
html:not(.js) .product__gallery { grid-template-columns: minmax(0, 1fr); }
html:not(.js) .product-tabs .tab-panel { display: block; animation: none; padding-top: var(--space-6); margin-top: var(--space-6); border-top: 1px solid var(--border-strong); }
html:not(.js) .product-tabs :is(.tabs + .tab-panel, .tab-panel:first-child) { margin-top: 0; padding-top: 0; border-top: 0; }
html:not(.js) .tab-panel__title { display: block; margin: 0 0 var(--space-4); font: var(--type-h3); }

/* přepnutí balení kávy bez přenačtení (kv-catalog.js): během načítání tiché ztlumení ceny (až po 120 ms),
   nová cena se prolne; aktivní balení se přebarví hned po kliknutí */
.product__detail .product__pricebox, .product__detail .product__form { transition: opacity var(--dur-base) var(--ease-out); }
.product__detail.is-switching .product__pricebox, .product__detail.is-switching .product__form { opacity: .5; transition-delay: var(--dur-intent); }
.product__pricebox.is-fresh .kv-price, .product__pricebox.is-fresh .product__avail { animation: kvFade var(--dur-base) var(--ease-out); }
.kv-pack--links a.is-pending { background: var(--surface-raised); color: var(--text-strong); }
@media (prefers-reduced-motion: reduce) { .product__detail .product__pricebox, .product__detail .product__form { transition: none; } .product__pricebox.is-fresh .kv-price, .product__pricebox.is-fresh .product__avail { animation: none; } }

/* podobné skladem (u dostupného „pro srovnání", u nedostupného náhrada): dva odkazy v hlavičce sekce */
.product-similar__links { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 28px; }

/* Slib doručení u tlačítka (N8) — jen reálná data: odeslání podle dostupnosti, způsoby dopravy s cenou pro tento kus,
   zapnuté platby a skutečná sleva za převod. Linky místo boxů, verzálkové popisky, ceny serifem vpravo. */
.product__delivery { margin-top: var(--space-7); }
.product__delivery-title { margin: 0 0 var(--space-3); font: var(--type-kicker); letter-spacing: .1em; text-transform: uppercase; color: var(--text-strong); }
.delivery { margin: 0; border-top: 1px solid var(--border-strong); }
.delivery__row { display: grid; grid-template-columns: 124px minmax(0, 1fr); gap: var(--space-4); align-items: baseline; padding: 11px 0; border-bottom: 1px solid var(--border-hairline); }
.delivery dt { font: var(--type-kicker); letter-spacing: .08em; text-transform: uppercase; color: var(--text-faint); }
.delivery dd { margin: 0; display: flex; align-items: baseline; justify-content: space-between; gap: var(--space-4); min-width: 0; font: var(--type-body-sm); color: var(--text-body); }
.delivery__text { min-width: 0; }
.delivery__sub { display: block; margin-top: 2px; color: var(--text-muted); }
.delivery__sub strong { color: var(--text-strong); font-weight: var(--weight-semibold); white-space: nowrap; }
.delivery__price { flex: none; font: 400 var(--text-md)/1 var(--font-display); color: var(--text-strong); white-space: nowrap; font-variant-numeric: tabular-nums; }
.delivery__price small { font: var(--weight-semibold) var(--text-2xs)/1 var(--font-text); letter-spacing: .08em; text-transform: uppercase; color: var(--text-muted); }
.delivery__price.is-free { font-style: italic; }
.delivery a, .delivery__note a { color: inherit; text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; transition: color var(--dur-fast) var(--ease-out); }
.delivery a:hover, .delivery__note a:hover { color: var(--accent); }
.delivery__note { margin: var(--space-3) 0 0; font: var(--type-body-sm); color: var(--text-muted); }
@media (max-width: 760px) { .delivery__row { grid-template-columns: 118px minmax(0, 1fr); gap: var(--space-3); } }

/* Galerie fotek stránky (_gallery.twig) — rozvržení podle počtu fotek, žádná prázdná buňka v mřížce z linek */
.gallery.gallery--n1 { grid-template-columns: minmax(0, 1fr); }
.gallery.gallery--n1 a { aspect-ratio: 16 / 9; }
.gallery.gallery--n2, .gallery.gallery--n4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.gallery.gallery--n3, .gallery.gallery--n6 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.gallery.gallery--n3h { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); }
.gallery.gallery--n5 { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1fr); }
.gallery.gallery--n3h a:first-child, .gallery.gallery--n5 a:first-child { grid-row: span 2; aspect-ratio: auto; }
.gallery.gallery--n6 a:last-child:nth-child(3n + 1) { grid-column: 1 / -1; aspect-ratio: 3 / 1; }
.gallery.gallery--n6 a:last-child:nth-child(3n + 2) { grid-column: span 2; aspect-ratio: auto; }
.gallery[class*="gallery--n"] a { cursor: zoom-in; }
@media (max-width: 720px) {
    .gallery[class*="gallery--n"] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .gallery[class*="gallery--n"] a { grid-row: auto; grid-column: auto; aspect-ratio: 4 / 3; }
    .gallery[class*="gallery--n"] a:first-child, .gallery[class*="gallery--n"] a:last-child:nth-child(even) { grid-column: 1 / -1; aspect-ratio: 16 / 10; }
}

/* Prohlížeč fotek přes celou obrazovku — plný inkoust, fotka uprostřed, počítadlo serifem, šipky, Esc, posun prstem */
.kv-lightbox { position: fixed; inset: 0; width: 100%; height: 100%; max-width: none; max-height: none; margin: 0; padding: 0; border: 0; background: var(--ink-950); color: var(--paper-50); display: none; grid-template-rows: minmax(0, 1fr) auto; overflow: hidden; }
.kv-lightbox[open] { display: grid; animation: kvFade var(--dur-base) var(--ease-out); }
.kv-lightbox::backdrop { background: var(--ink-950); }
.kv-lightbox__stage { display: grid; place-items: center; min-height: 0; padding: clamp(12px, 3vw, 40px); overflow: hidden; touch-action: pan-y pinch-zoom; }
.kv-lightbox__img { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; background: var(--paper-0); transition: opacity var(--dur-fast) var(--ease-out), transform var(--dur-base) var(--ease-out); }
.kv-lightbox.is-swapping .kv-lightbox__img { opacity: 0; }
.kv-lightbox.can-zoom .kv-lightbox__img { cursor: zoom-in; }
.kv-lightbox.is-zoomed .kv-lightbox__img { transform: scale(2); cursor: zoom-out; }
.kv-lightbox__bar { display: flex; align-items: center; gap: var(--space-4); padding: 10px var(--gutter) calc(10px + env(safe-area-inset-bottom)); border-top: 1px solid var(--ash-700); }
.kv-lightbox__count { font: italic 400 var(--text-lg)/1 var(--font-display); font-variant-numeric: tabular-nums; }
.kv-lightbox__count b { font-weight: 400; font-style: normal; }
.kv-lightbox__hint { font: var(--type-kicker); letter-spacing: .08em; text-transform: uppercase; color: var(--stone-400); }
.kv-lightbox__nav { display: flex; gap: 8px; margin-left: auto; }
:root:root .kv-lightbox__btn { background: transparent; color: var(--paper-50); border-color: var(--ash-700); }
:root:root .kv-lightbox__btn:hover { border-color: var(--paper-50); }
.kv-lightbox__btn:focus-visible { box-shadow: 0 0 0 2px var(--ink-950), 0 0 0 3px var(--paper-50); }
@media (max-width: 640px) { .kv-lightbox__hint { display: none; } }
@media (prefers-reduced-motion: reduce) { .kv-lightbox[open], [data-watch-state].is-in, [data-watch-form].is-in { animation: none; } .kv-lightbox__img { transition: none; } }

/* ═══ 9. Košík, pokladna, účet, poukazy ═════════════════════════════════ */
/* Košík, pokladna a detail objednávky mají vlastní vrstvu checkout.css (v1.0); tady zůstává našeptávač adres a poukazy. */
.addr-wrap { position: relative; }
.addr-suggest { position: absolute; left: 0; right: 0; top: 100%; background: var(--surface-card); border: 1px solid var(--border-strong); z-index: var(--z-dropdown); max-height: 260px; overflow: auto; }
.addr-suggest div, .addr-suggest button { display: block; width: 100%; min-height: 44px; padding: 10px 14px; background: none; border: 0; border-bottom: 1px solid var(--border-hairline); text-align: left; color: var(--text-body); font: var(--type-body-sm); cursor: pointer; }
.addr-suggest div:hover, .addr-suggest button:hover, .addr-suggest button:focus-visible { background: var(--surface-well); outline: none; }
.addr-suggest > :last-child { border-bottom: 0; }
.voucher-page { display: grid; grid-template-columns: 1.2fr 1fr; gap: var(--space-9); align-items: start; }
.voucher-buy { border: 1px solid var(--border-strong); padding: var(--space-6); }
.voucher-label { display: block; font: var(--type-kicker); letter-spacing: .08em; text-transform: uppercase; color: var(--text-muted); margin: var(--space-4) 0 var(--space-2); }
.voucher-label:first-child { margin-top: 0; }
.voucher-presets { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; background: var(--border-strong); border: 1px solid var(--border-strong); }
.voucher-preset { padding: 12px 6px; border: 0; background: var(--surface-card); color: var(--text-body); font: var(--weight-semibold) var(--text-sm)/1 var(--font-text); cursor: pointer; transition: var(--transition-control); }
.voucher-preset:hover { background: var(--surface-well); }
.voucher-custom { display: flex; align-items: center; gap: 8px; }
.voucher-custom input { font: var(--weight-regular) var(--text-lg)/1 var(--font-display); }
@media (max-width: 860px) { .voucher-page { display: block; } .voucher-buy { margin-top: var(--space-5); } }

/* ═══ 10. Stránky služeb ═════════════════════════════════════════════════ */
/* — Hlavička stránky (_page_header.twig): jedna komponenta pro služby, kurzy, magazín, kontakt, poukazy i právní stránky.
     Titulek je na všech šířkách aspoň 1,25× větší než H2 sekcí (H2 = --type-h2, kv.css). Varianty: s exponátem vpravo
     (služby, kurzy), „plain" (CMS, magazín, kontakt) a inkoustový pás (EKO). Je nad ohybem — neodhaluje se. — */
.pagehead { display: grid; grid-template-columns: minmax(0, 1fr); border-top: 1px solid var(--border-strong); border-bottom: 1px solid var(--border-strong); margin: 0 0 var(--space-9); }
.pagehead--media { grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); min-height: 520px; }
.pagehead__text { display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-5); padding: var(--space-10) var(--space-9) var(--space-9) 0; min-width: 0; }
.pagehead--plain .pagehead__text { padding: var(--space-8) 0 var(--space-8); }
.pagehead__kicker + .pagehead__title { margin-top: var(--space-1); }
.pagehead__title { font: var(--weight-regular) clamp(44px, 3.4vw + 30px, 76px)/1.0 var(--font-display); letter-spacing: var(--tracking-display); color: var(--text-strong); margin: 0; max-width: 15ch; text-wrap: balance; }
.pagehead--plain .pagehead__title { font-size: clamp(40px, 2.4vw + 30px, 64px); max-width: 22ch; }
.pagehead__title em { font-style: italic; color: var(--accent); }
.pagehead__lead { font: var(--weight-regular) var(--text-md)/1.55 var(--font-text); color: var(--text-muted); margin: 0; max-width: 52ch; }
.pagehead__cta { display: flex; gap: var(--space-3); flex-wrap: wrap; margin-top: var(--space-1); }
.pagehead__facts { list-style: none; margin: auto 0 0; padding: var(--space-6) 0 0; width: 100%; border-top: 1px solid var(--border-strong); display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-5); }
.pagehead__facts li { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.pagehead__facts strong { font: var(--weight-regular) clamp(26px, 1.1vw + 18px, 40px)/1 var(--font-display); color: var(--text-strong); letter-spacing: var(--tracking-display); white-space: nowrap; }
.pagehead__facts span { font: var(--type-body-sm); color: var(--text-muted); }
.pagehead__price { margin: 0; font: var(--type-body-sm); color: var(--text-muted); max-width: 48ch; }
.pagehead__price strong { font: var(--weight-regular) var(--text-xl)/1 var(--font-display); color: var(--text-strong); letter-spacing: var(--tracking-display); }
.pagehead__meta { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2) var(--space-5); margin: 0; font: var(--type-kicker); letter-spacing: .06em; text-transform: uppercase; color: var(--text-muted); }
.pagehead__media { position: relative; background: var(--img-well); border-left: 1px solid var(--border-strong); display: grid; place-items: center; overflow: hidden; min-height: 320px; }
.pagehead__media img { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; object-fit: cover; }
.pagehead__media--contain img { object-fit: contain; padding: 8%; mix-blend-mode: multiply; }
.pagehead__media--icon { color: var(--stone-400); }
/* inkoustový pás (EKO): zvýraznění červeně jako všude, zelená jen jako stavová tečka v kickeru;
   v tmavém režimu pás neoslňuje papírem — je to tmavší plocha s linkami */
.pagehead--ink { --ph-bg: var(--ink-900); --ph-fg: var(--paper-50); --ph-muted: var(--stone-400); --ph-line: var(--ash-700); --ph-em: var(--signal-400);
    --btn-bg: var(--ph-fg); --btn-fg: var(--ph-bg); --btn-outline: var(--ph-fg);
    background: var(--ph-bg); color: var(--ph-fg); border: 0; padding: 0 0 0 var(--space-9); }
.pagehead--ink.pagehead--plain { padding-right: var(--space-9); }
.pagehead--ink .pagehead__title { color: var(--ph-fg); }
.pagehead--ink .pagehead__title em { color: var(--ph-em); }
.pagehead--ink .pagehead__lead, .pagehead--ink .pagehead__facts span, .pagehead--ink .pagehead__kicker { color: var(--ph-muted); }
.pagehead--ink .pagehead__facts { border-top-color: var(--ph-line); }
.pagehead--ink .pagehead__facts strong { color: var(--ph-fg); }
.pagehead--ink .pagehead__kicker::before { width: 6px; height: 6px; border-radius: var(--radius-pill); background: var(--state-ok); }
.pagehead--ink .pagehead__media { border-left: 0; }
:root[data-theme="dark"] .pagehead--ink { --ph-bg: var(--surface-raised); --ph-fg: var(--text-strong); --ph-muted: var(--text-muted); --ph-line: var(--border-hairline); --ph-em: var(--accent); border-top: 1px solid var(--border-strong); border-bottom: 1px solid var(--border-strong); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .pagehead--ink { --ph-bg: var(--surface-raised); --ph-fg: var(--text-strong); --ph-muted: var(--text-muted); --ph-line: var(--border-hairline); --ph-em: var(--accent); border-top: 1px solid var(--border-strong); border-bottom: 1px solid var(--border-strong); } }
@media (max-width: 900px) {
    .pagehead--media { grid-template-columns: minmax(0, 1fr); min-height: 0; }
    .pagehead__text, .pagehead--plain .pagehead__text { padding: var(--space-7) 0 var(--space-8); }
    /* exponát nad titulkem jako nízký pás (na mobilu nesmí odsunout titulek a tlačítka pod ohyb) */
    .pagehead__media { order: -1; width: 100%; border-left: 0; border-bottom: 1px solid var(--border-strong); min-height: 0; height: clamp(180px, 50vw, 300px); }
    .pagehead--ink { padding: 0 var(--space-5); }
    .pagehead--ink .pagehead__media { margin: 0 calc(-1 * var(--space-5)); border-bottom: 0; }
}
@media (max-width: 600px) {
    .pagehead { margin-bottom: var(--space-7); }
    .pagehead + .svc-contact, .pagehead + .article-feature { margin-top: calc(-1 * var(--space-7)); }
    .pagehead--plain .pagehead__text { padding-bottom: var(--space-6); }
    .pagehead__cta { flex-direction: column; align-items: stretch; width: 100%; }
    .pagehead__cta .btn { width: 100%; white-space: normal; }
    /* fakta jako řádky „hodnota · popis" s linkami — ve třech úzkých sloupcích se lámala */
    .pagehead__facts { grid-template-columns: minmax(0, 1fr); gap: 0; padding-top: 0; }
    .pagehead__facts li { flex-direction: row; align-items: baseline; gap: var(--space-4); padding: 12px 0; border-bottom: 1px solid var(--border-hairline); }
    .pagehead__facts li:last-child { border-bottom: 0; }
    .pagehead__facts strong { flex: none; min-width: 5.2em; font-size: 26px; }
    .pagehead--ink .pagehead__facts li { border-bottom-color: var(--ph-line); }
}

/* — Hlavičky sekcí: kicker + H2 (+ podtitul); --col = nadpis ve sloupci .split — */
.section__head > div > .kv-kicker + :is(h1, h2) { margin-top: var(--space-3); }
.section__head > div { min-width: 0; }
.section__head--col { margin-bottom: var(--space-5); }
.section__sub { margin: var(--space-3) 0 0; font: var(--type-body); color: var(--text-muted); max-width: 60ch; }
.section__text { margin: 0 0 var(--space-5); font: var(--type-body); color: var(--text-muted); max-width: 60ch; }
.section__count { margin-left: var(--space-2); font: italic var(--weight-regular) var(--text-lg)/1 var(--font-display); color: var(--accent); letter-spacing: 0; }
@media (max-width: 600px) { .section__head { flex-wrap: wrap; align-items: flex-start; } }
/* odkaz v hlavičce sekce („Celá nabídka"): šipka z ikonové sady (ne znak „→"), při najetí měkce popojede;
   na telefonu stojí pod nadpisem (jako na úvodu), ne nad ním vpravo vedle kickeru */
.section__head > a { display: inline-flex; align-items: center; gap: 8px; }
.section__head > a .ico { flex: none; transition: translate var(--dur-base) var(--ease-out); }
.section__head > a:hover .ico { translate: 3px 0; }
@media (max-width: 640px) { .section__head > div { flex: 1 1 100%; } .section__head > a { min-height: 32px; } }
@media (prefers-reduced-motion: reduce) { .section__head > a .ico { transition: none; } }

/* — Vlastnosti, kroky, rejstřík — */
.feat-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); gap: var(--space-7) var(--space-6); }
.feat-grid--wide { grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); }
.feat { display: flex; flex-direction: column; gap: var(--space-3); padding: var(--space-6) 0; border-top: 1px solid var(--border-strong); background: transparent; border-left: 0; border-right: 0; border-bottom: 0; }
.feat:hover { transform: none; box-shadow: none; }
.feat__icon { color: var(--text-strong); display: block; }
.feat__icon--ok { color: var(--state-ok); }
.feat h3 { margin: 0; font: var(--type-h3); }
.feat p { margin: 0; font: var(--type-body-sm); color: var(--text-muted); }
/* kroky: rámečky na buňkách (ne gap + pozadí) — neúplný poslední řádek nevykreslí plný inkoustový blok */
.steps { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr)); gap: 0; background: transparent; border-top: 1px solid var(--border-strong); border-left: 1px solid var(--border-strong); counter-reset: step; }
.step { position: relative; background: var(--surface-card); padding: var(--space-6) var(--space-5) var(--space-5); counter-increment: step; border-right: 1px solid var(--border-strong); border-bottom: 1px solid var(--border-strong); }
.steps--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.steps--1 { grid-template-columns: 1fr; }
@media (max-width: 520px) { .steps--2 { grid-template-columns: 1fr; } }
/* čtyři kroky na tabletu: 2 × 2 místo řady tří a jednoho osamělého kroku pod nimi (catering, poukazy) */
@media (min-width: 521px) and (max-width: 860px) { .steps:not(.steps--1):has(> .step:nth-child(4):last-child) { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.step::before { content: "0" counter(step); display: block; font: var(--type-kicker); letter-spacing: .1em; color: var(--text-faint); margin-bottom: var(--space-4); }
.step h3 { margin: 0 0 6px; font: var(--type-h3); }
.step p { margin: 0; font: var(--type-body-sm); color: var(--text-muted); }
/* rejstřík kategorií (gastro) — očíslované řádky ve dvou sloupcích, číslování po sloupcích */
.svc-index { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: repeat(var(--rows, 4), auto); grid-auto-flow: column; column-gap: var(--space-9); border-top: 1px solid var(--border-strong); }
.svc-index .kv-cat, .svc-index .kv-cat:last-child { border-bottom: 1px solid var(--border-hairline); }
/* jediná položka rejstříku nezůstane v půlce řádku vedle prázdného sloupce */
.svc-index > .kv-cat:only-child { grid-column: 1 / -1; }
@media (max-width: 760px) { .svc-index { grid-template-columns: minmax(0, 1fr); grid-template-rows: none; grid-auto-flow: row; } }
/* rejstříky služeb a informací drží na telefonu řádek „01  Název ……… počet" (globální .kv-cat se na úvodu láme do dvou řádků) */
@media (max-width: 760px) { :is(.svc-index, .doc-related) .kv-cat { grid-template-columns: 32px minmax(0, 1fr) auto; gap: var(--space-4); padding: var(--space-4) 0; } :is(.svc-index, .doc-related) .kv-cat__meta { grid-column: auto; } }
/* příležitosti (catering) — statický výčet v mřížce z linek, nadpis hned pod číslem, bez hoveru (nejsou to odkazy) */
.svc-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; background: transparent; border-top: 1px solid var(--border-strong); border-left: 1px solid var(--border-strong); }
.svc { position: relative; display: flex; flex-direction: column; gap: var(--space-3); padding: var(--space-6); background: var(--surface-card); color: inherit; border-right: 1px solid var(--border-strong); border-bottom: 1px solid var(--border-strong); }
.svc__num { font: var(--type-kicker); letter-spacing: .1em; color: var(--text-faint); }
.svc__icon { position: absolute; top: var(--space-6); right: var(--space-6); color: var(--text-strong); }
.svc__title { margin: var(--space-3) 0 0; font: var(--type-h3); color: var(--text-strong); padding-right: var(--space-6); }
.svc p { margin: 0; font: var(--type-body-sm); color: var(--text-muted); }
@media (max-width: 1000px) { .svc-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 520px) { .svc-grid { grid-template-columns: minmax(0, 1fr); } .svc { padding: var(--space-5); } .svc__icon { top: var(--space-5); right: var(--space-5); } }

/* — Kontakt na servis: pás čtyř údajů pod hlavičkou (linky místo karty) — */
.svc-contact { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-bottom: 1px solid var(--border-strong); margin: calc(-1 * var(--space-9)) 0 0; }
.svc-contact__cell { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; padding: var(--space-5); border-left: 1px solid var(--border-hairline); min-width: 0; }
.svc-contact__cell:first-child { border-left: 0; padding-left: 0; }
.svc-contact__label { display: inline-flex; align-items: center; gap: 8px; font: var(--type-kicker); letter-spacing: var(--tracking-kicker); text-transform: uppercase; color: var(--text-muted); }
.svc-contact__value { font: var(--weight-regular) var(--text-lg)/1.25 var(--font-display); color: var(--text-strong); overflow-wrap: anywhere; }
a.svc-contact__value:hover { color: var(--accent); text-decoration: none; }
.svc-contact__value .hours-pill { font-size: var(--text-xs); }
.svc-contact__cell small { font: var(--type-body-sm); color: var(--text-muted); }
.svc-contact__more { display: inline-flex; align-items: center; gap: 6px; margin-top: auto; padding-top: 2px; font: var(--type-label); letter-spacing: .04em; text-transform: uppercase; color: var(--text-strong); border-bottom: 1px solid var(--border-strong); }
.svc-contact__more:hover { color: var(--accent); border-color: var(--accent); text-decoration: none; }
@media (max-width: 1000px) {
    .svc-contact { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .svc-contact__cell:nth-child(odd) { border-left: 0; padding-left: 0; }
    .svc-contact__cell:nth-child(n+3) { border-top: 1px solid var(--border-hairline); }
}
@media (max-width: 520px) {
    .svc-contact { grid-template-columns: minmax(0, 1fr); }
    .svc-contact__cell { border-left: 0; padding: var(--space-4) 0; }
    .svc-contact__cell + .svc-contact__cell { border-top: 1px solid var(--border-hairline); }
}

/* — Ceníky a tabulky — */
.pricelist-wrap { overflow-x: auto; }
.pricelist, .spec-table, .hours-table { width: 100%; border-collapse: collapse; font: var(--type-body-sm); background: var(--surface-card); border: 1px solid var(--border-strong); }
.pricelist th, .spec-table th, .hours-table th { text-align: left; font: var(--type-spec); text-transform: uppercase; letter-spacing: .1em; color: var(--text-muted); padding: 12px 18px; border-bottom: 2px solid var(--border-strong); }
.pricelist td, .spec-table td, .spec-table tbody th, .hours-table td { padding: 13px 18px; border-bottom: 1px solid var(--border-hairline); vertical-align: top; }
.pricelist tr:last-child td, .spec-table tr:last-child :is(td, th), .hours-table tr:last-child td { border-bottom: 0; }
/* ceník servisu: hlavní cena s DPH (spotřebitel), vedle menší bez DPH */
.pricelist th.text-right { text-align: right; white-space: nowrap; }
.pricelist__price { text-align: right; white-space: nowrap; font: var(--weight-regular) var(--text-lg)/1 var(--font-display); color: var(--text-strong); font-variant-numeric: tabular-nums; }
.pricelist__excl { text-align: right; white-space: nowrap; width: 1%; color: var(--text-muted); font-variant-numeric: tabular-nums; }
.spec-table tbody th { width: 36%; font: var(--type-spec); text-transform: uppercase; letter-spacing: .08em; color: var(--text-muted); border-bottom-width: 1px; }
.hours-table td:last-child { text-align: right; white-space: nowrap; font-weight: var(--weight-semibold); font-variant-numeric: tabular-nums; }
.hours-table tbody th { font: var(--type-body-sm); text-transform: none; letter-spacing: 0; color: var(--text-body); padding: 13px 18px; border-bottom: 1px solid var(--border-hairline); }
.hours-table tr:last-child th { border-bottom: 0; }
.hours-table tr.is-today :is(td, th) { background: var(--surface-well); color: var(--text-strong); }
.hours-table__today { margin-left: 6px; font: var(--type-kicker); letter-spacing: .1em; text-transform: uppercase; color: var(--accent); }
.hours-table tr.is-closed td:last-child { color: var(--state-bad); }
.hours-table tr.is-special :is(td, th):first-child::after { content: "změna"; display: inline-block; margin-left: 8px; font: var(--type-kicker); letter-spacing: .1em; text-transform: uppercase; color: var(--state-wait); }
@media (max-width: 520px) { .pricelist th, .pricelist td { padding: 12px 10px; } .pricelist th:first-child, .pricelist td:first-child { padding-left: 14px; } .spec-table tbody th, .spec-table td { display: block; width: auto; } .spec-table tbody th { padding-bottom: 2px; border-bottom: 0; } .spec-table td { padding-top: 0; } }
.hours-note { display: block; font: var(--type-body-sm); color: var(--text-muted); margin-top: 2px; }
/* výjimky (svátky, inventura): řádky s linkou „datum · poznámka ……… 9:00–12:00" */
.hours-specials { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--border-strong); }
.hours-specials li { display: flex; justify-content: space-between; align-items: baseline; gap: var(--space-4); padding: 12px 0; border-bottom: 1px solid var(--border-hairline); font: var(--type-body-sm); }
.hours-specials strong { font: var(--weight-regular) var(--text-md)/1 var(--font-display); color: var(--state-wait); white-space: nowrap; font-variant-numeric: tabular-nums; }
.hours-specials li.is-closed strong { color: var(--state-bad); }
.hours-none { display: flex; gap: var(--space-3); align-items: flex-start; margin: 0; padding: var(--space-5) 0; border-top: 1px solid var(--border-strong); border-bottom: 1px solid var(--border-hairline); font: var(--type-body-sm); color: var(--text-muted); }
.hours-none .ico { color: var(--state-ok); flex: none; margin-top: 2px; }
.hours-eshop { margin: var(--space-6) 0 0; padding-left: var(--space-5); border-left: 2px solid var(--border-strong); font: var(--type-body-sm); color: var(--text-muted); max-width: 52ch; }
.hours-alert { margin: calc(-1 * var(--space-6)) 0 var(--space-8); }
.pagehead__status { display: flex; flex-wrap: wrap; align-items: center; gap: 4px var(--space-4); }
.pagehead__status .hours-note { margin: 0; }
.hours-pill { display: inline-flex; align-items: center; gap: 8px; padding: 0; font: var(--weight-semibold) var(--text-xs)/1.2 var(--font-text); letter-spacing: .08em; text-transform: uppercase; color: var(--text-strong); white-space: nowrap; }
.hours-pill .dot { width: 6px; height: 6px; border-radius: var(--radius-pill); background: currentColor; flex: none; }
.hours-pill.is-open { color: var(--state-ok); } .hours-pill.is-closed { color: var(--state-bad); } .hours-pill.is-later { color: var(--state-wait); }
/* přehled 7 dní: na desktopu řada buněk, na mobilu svislý seznam „DNES pá 16. 10. ……… 9:00–16:00" */
.day-strip { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 0; background: transparent; border-top: 1px solid var(--border-strong); border-left: 1px solid var(--border-strong); }
.day-strip > li { background: var(--surface-card); padding: 14px 10px; text-align: center; font: var(--type-body-sm); border-right: 1px solid var(--border-strong); border-bottom: 1px solid var(--border-strong); min-width: 0; }
.day-strip__day { display: block; font: var(--type-kicker); letter-spacing: .1em; text-transform: uppercase; color: var(--text-muted); margin-bottom: 4px; }
.day-strip__date { display: block; font: var(--type-kicker); letter-spacing: .04em; color: var(--text-muted); margin-bottom: 8px; }
.day-strip b { font: var(--weight-regular) var(--text-md)/1 var(--font-display); color: var(--text-strong); white-space: nowrap; font-variant-numeric: tabular-nums; }
.day-strip .is-today { background: var(--surface-well); }
.day-strip .is-today .day-strip__day { color: var(--text-strong); }
.day-strip .is-closed b { color: var(--state-bad); }
.day-strip .is-special b { color: var(--state-wait); }
.day-strip small { display: block; font: var(--type-kicker); letter-spacing: .04em; color: var(--state-wait); margin-top: 6px; text-transform: none; }
@media (max-width: 1000px) and (min-width: 601px) { .day-strip b { font-size: var(--text-base); } .day-strip > li { padding: 12px 6px; } }
@media (max-width: 600px) {
    .day-strip { grid-template-columns: minmax(0, 1fr); border-left: 0; }
    .day-strip > li { display: grid; grid-template-columns: 3.4em minmax(0, 1fr) auto; align-items: baseline; gap: var(--space-3); text-align: left; padding: 13px 0; border-right: 0; border-bottom: 1px solid var(--border-hairline); }
    .day-strip > li:last-child { border-bottom-color: var(--border-strong); }
    .day-strip .is-today { padding-left: var(--space-3); padding-right: var(--space-3); }
    .day-strip__day, .day-strip__date { margin: 0; }
    .day-strip small { grid-column: 2 / -1; margin: 0; }
}

/* — Poptávkový formulář (_inquiry_form.twig) — stav odeslání u formuláře, chyby u polí — */
.inquiry { border: 1px solid var(--border-strong); background: var(--surface-card); padding: var(--space-9); scroll-margin-top: calc(var(--header-total, 113px) + 16px); }
.inquiry__head { margin: 0 0 var(--space-7); max-width: 64ch; }
.inquiry__head h2 { margin: var(--space-3) 0; }
.inquiry__head p { margin: 0; color: var(--text-muted); font: var(--type-body); }
.inquiry__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-6) var(--space-5); }
.inquiry__grid .full { grid-column: 1 / -1; }
.inquiry__field > label { margin: 0; }
.inquiry__req { color: var(--accent); }
.inquiry textarea { min-height: 140px; resize: vertical; }
.inquiry__foot { display: flex; align-items: center; gap: var(--space-5) var(--space-6); flex-wrap: wrap; margin-top: var(--space-7); padding-top: var(--space-6); border-top: 1px solid var(--border-hairline); }
.inquiry__legal { flex: 1 1 260px; margin: 0; font: var(--type-body-sm); color: var(--text-muted); max-width: 54ch; }
.inquiry__legal a { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; text-decoration-color: var(--border-hairline); }
.inquiry__legal a:hover { color: var(--accent); text-decoration-color: currentColor; }
.inquiry .hp, .hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
/* chybné pole má červený rám i tady: základní styl polí (sekce 2, input[type=…]) má stejnou specifičnost jako kontrakt
   v kv.css a přebíjel ho — „zvýrazněná pole" z hlášky nebyla zvýrazněná */
:is(.inquiry, .course-form, .voucher-buy, .news-result) :is(input, select, textarea)[aria-invalid="true"] { border-color: var(--state-bad); }
.kv-form-status { margin: 0 0 var(--space-6); }
.kv-form-status:empty { display: none; }
.kv-form-status .kv-alert { outline: none; animation: kvFade var(--dur-base) var(--ease-out); }
.kv-form-status .kv-alert--success { color: var(--state-ok); }
form.is-busy .inquiry__grid, form.is-busy .course-form__fields { opacity: .55; pointer-events: none; transition: opacity var(--dur-base) var(--ease-out); }
form [type=submit][aria-busy="true"] { cursor: progress; }
/* potvrzení místo formuláře: prolnutí a měkký posun (ne skok) */
.inquiry__done { display: grid; gap: var(--space-5); max-width: 820px; outline: none; transition: opacity var(--dur-slow) var(--ease-reveal, var(--ease-out)), translate var(--dur-slow) var(--ease-reveal, var(--ease-out)); }
.inquiry__done.is-entering { opacity: 0; translate: 0 12px; }
.inquiry__done-state { display: inline-flex; align-items: center; gap: 8px; margin: 0; font: var(--type-kicker); letter-spacing: var(--tracking-kicker); text-transform: uppercase; color: var(--state-ok); }
.inquiry__done h2 { margin: 0; }
.inquiry__done-lead { margin: 0; font: var(--type-body); color: var(--text-body); max-width: 62ch; }
.inquiry__done-lead strong { overflow-wrap: anywhere; }
.inquiry__next { list-style: none; margin: var(--space-3) 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid var(--border-strong); border-bottom: 1px solid var(--border-hairline); }
.inquiry__next li { display: flex; gap: var(--space-4); padding: var(--space-5) var(--space-5) var(--space-5) 0; min-width: 0; }
.inquiry__next li + li { padding-left: var(--space-5); border-left: 1px solid var(--border-hairline); }
.inquiry__num { flex: none; font: var(--type-kicker); letter-spacing: .1em; color: var(--text-faint); padding-top: 3px; }
.inquiry__next strong { display: block; font: var(--type-label); color: var(--text-strong); margin-bottom: 4px; }
.inquiry__next div > span { font: var(--type-body-sm); color: var(--text-muted); }
.inquiry__done-actions { display: flex; gap: var(--space-4) var(--space-6); align-items: center; flex-wrap: wrap; }
.split .inquiry { padding: var(--space-7); }
@media (max-width: 720px) {
    .inquiry, .split .inquiry { padding: var(--space-6) var(--space-5); } /* rámeček v ose s ostatními bloky (okraj stránky 16 px), bez přesahu */
    .inquiry__grid { grid-template-columns: minmax(0, 1fr); gap: var(--space-5); }
    .inquiry__foot .btn { width: 100%; }
    .inquiry__next { grid-template-columns: minmax(0, 1fr); }
    .inquiry__next li { padding: var(--space-4) 0; }
    .inquiry__next li + li { padding-left: 0; border-left: 0; border-top: 1px solid var(--border-hairline); }
}
@media (prefers-reduced-motion: reduce) { .inquiry__done { transition: none; } }
/* výběr předmětu poptávky (např. co si půjčit): přepínače jako buňky v mřížce z linek, vybraná buňka inkoustová */
.inquiry__choices { border: 0; margin: 0 0 var(--space-7); padding: 0; min-width: 0; }
.inquiry__choices > legend { padding: 0; margin-bottom: var(--space-3); }
.inquiry__choice-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 1px; background: var(--border-strong); border: 1px solid var(--border-strong); }
.inquiry__choice { position: relative; display: flex; flex-direction: column; justify-content: center; gap: 4px; min-height: 64px; padding: 12px 16px; background: var(--surface-card); color: var(--text-strong); cursor: pointer; transition: background-color var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out); }
.inquiry__choice input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.inquiry__choice:hover { background: var(--surface-well); }
.inquiry__choice-label { font: var(--type-label); letter-spacing: 0; }
.inquiry__choice-meta { font: var(--type-body-sm); color: var(--text-muted); }
.inquiry__choice:has(input:checked) { background: var(--bg-inverse); color: var(--text-inverse); }
.inquiry__choice:has(input:checked) .inquiry__choice-meta { color: var(--text-inverse-muted); }
.inquiry__choice:has(input:focus-visible) { box-shadow: var(--ring); z-index: 1; }
@media (max-width: 720px) { .inquiry__choice-grid { grid-template-columns: minmax(0, 1fr); } .inquiry__choice { min-height: 52px; } }

/* — Galerie fotek stránky (_gallery.twig) — mřížka linek „rámečky na buňkách" — */
.gallery { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); gap: 0; background: transparent; border-top: 1px solid var(--border-strong); border-left: 1px solid var(--border-strong); }
.gallery a { position: relative; display: block; aspect-ratio: 4/3; overflow: hidden; background: var(--img-well); border-right: 1px solid var(--border-strong); border-bottom: 1px solid var(--border-strong); }
.gallery--single { grid-template-columns: 1fr; max-width: 880px; }
.gallery--single a { aspect-ratio: 16/9; }
.gallery img { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; object-fit: cover; transition: transform var(--dur-slow) var(--ease-out); }
.gallery a:hover img { transform: scale(1.04); }
.gallery--hero { grid-template-columns: 2fr 1fr 1fr; }
.gallery--hero a:first-child { grid-row: span 2; aspect-ratio: auto; }
@media (max-width: 720px) { .gallery--hero { grid-template-columns: 1fr 1fr; } .gallery--hero a:first-child { grid-column: 1 / -1; grid-row: auto; aspect-ratio: 16/10; } }
.gallery-empty { display: flex; align-items: center; gap: var(--space-3); border: 1px solid var(--border-hairline); padding: var(--space-6); color: var(--text-muted); font: var(--type-body-sm); background: var(--surface-well); }

/* — Eko, sloupce, FAQ, seznamy — */
.split { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: var(--space-9); align-items: start; }
.split--even { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.split--form { grid-template-columns: minmax(0, 1.3fr) minmax(0, .7fr); }
@media (max-width: 1100px) { .split--form { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 860px) { .split, .split--even { grid-template-columns: minmax(0, 1fr); gap: var(--space-8); } }
/* FAQ: plynulé rozbalení výšky (kde to prohlížeč umí), „+" se prolne na „–" — žádná rotace (DS) */
.faq { interpolate-size: allow-keywords; }
.faq details { border-top: 1px solid var(--border-hairline); }
.faq details:last-child { border-bottom: 1px solid var(--border-hairline); }
.faq summary { cursor: pointer; min-height: 48px; padding: 14px 0; font: var(--type-label); text-transform: none; list-style: none; display: flex; justify-content: space-between; align-items: center; gap: 12px; color: var(--text-strong); transition: color var(--dur-fast) var(--ease-out); }
.faq summary:hover { color: var(--accent); }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; flex: none; width: 1ch; text-align: center; font: var(--weight-regular) var(--text-lg)/1 var(--font-display); color: var(--text-muted); }
.faq details[open] summary::after { content: "–"; }
.faq details p { margin: 0; padding: 0 0 16px; color: var(--text-muted); font: var(--type-body-sm); max-width: 62ch; }
/* odkaz v odpovědi, v kroku postupu nebo v textu vlastnosti (.kv-feature) je vidět i bez najetí (jinak splývá s textem) */
:is(.faq details p, .step p, .kv-feature__text) a:not(.btn):not(.kv-btn) { color: var(--text-strong); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; text-decoration-color: var(--text-faint); }
:is(.faq details p, .step p, .kv-feature__text) a:not(.btn):not(.kv-btn):hover { color: var(--accent); text-decoration-color: currentColor; }
.faq details::details-content { block-size: 0; overflow: clip; transition: block-size var(--dur-base) var(--ease-out), content-visibility var(--dur-base) allow-discrete; }
.faq details[open]::details-content { block-size: auto; }
.check-list { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; }
.check-list li { display: flex; gap: 12px; align-items: flex-start; font: var(--type-body); }
.check-list li .ico { color: var(--state-ok); margin-top: 4px; }
.svc-aside-note { margin: var(--space-6) 0 0; padding-top: var(--space-4); border-top: 1px solid var(--border-hairline); font: var(--type-body-sm); color: var(--text-muted); }
.svc-aside-note a, .svc-pricebox a { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; text-decoration-color: var(--border-hairline); }
.svc-pricebox { margin-top: var(--space-7); padding: var(--space-6); background: var(--surface-well); }
.svc-pricebox h3 { font: var(--type-h3); margin: 0 0 var(--space-3); }
.svc-pricebox ul { list-style: none; margin: 0 0 var(--space-3); padding: 0; display: grid; gap: 6px; }
.svc-pricebox li { display: flex; gap: 10px; font: var(--type-body-sm); color: var(--text-body); }
.svc-pricebox li::before { content: "—"; color: var(--text-faint); }
.svc-pricebox p { margin: 0; font: var(--type-body-sm); color: var(--text-muted); }
/* tlačítko, které vypadá jako odkaz v textu (např. „chat vpravo dole") */
.linkbtn { display: inline; padding: 0; border: 0; background: none; font: inherit; color: var(--text-link); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; text-decoration-color: var(--border-hairline); cursor: pointer; }
.linkbtn:hover { color: var(--accent); text-decoration-color: currentColor; }
.contact-card { list-style: none; margin: 0; border: 0; border-top: 1px solid var(--border-strong); border-bottom: 1px solid var(--border-strong); background: transparent; display: grid; gap: 0; padding: 0; }
.contact-card__row { display: flex; gap: var(--space-4); align-items: flex-start; padding: var(--space-5) 0; border-bottom: 1px solid var(--border-hairline); }
.contact-card__row > div { display: flex; flex-direction: column; align-items: flex-start; min-width: 0; }
.contact-card__addr { font: var(--type-body); color: var(--text-body); margin-top: 4px; }
.contact-card__chat { font-weight: var(--weight-semibold); color: var(--text-strong); }
.contact-card__row > div > a { font: var(--weight-regular) var(--text-lg)/1.25 var(--font-display); color: var(--text-strong); overflow-wrap: anywhere; }
.contact-card__row > div > a:hover { color: var(--accent); text-decoration: none; }
.contact-card__row:last-child { border-bottom: 0; }
.contact-card__row .ico { color: var(--text-strong); margin-top: 3px; flex: none; }
.contact-card__row strong { font: var(--type-h3); color: var(--text-strong); }
.contact-card__row small { display: block; color: var(--text-muted); font: var(--type-body-sm); margin-top: 4px; }
.contact-card__row small a { font-weight: inherit; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; text-decoration-color: var(--border-hairline); }
.map-embed { width: 100%; height: 360px; border: 1px solid var(--border-strong); overflow: hidden; background: var(--surface-well); }
.map-embed iframe { width: 100%; height: 100%; border: 0; display: block; filter: grayscale(1) contrast(1.05); }
:root[data-theme="dark"] .map-embed iframe { filter: grayscale(1) invert(.9) hue-rotate(180deg); }
/* — Pronájem: karty v mřížce z linek, cena (nebo „na dotaz") vždy na stejném místě — */
.rental-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid var(--border-strong); border-left: 1px solid var(--border-strong); }
.rental-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.rental-card { display: grid; grid-template-rows: auto 1fr auto auto; min-width: 0; background: var(--surface-card); border-right: 1px solid var(--border-strong); border-bottom: 1px solid var(--border-strong); transition: background-color var(--dur-base) var(--ease-out); }
.rental-card:hover { background: var(--surface-raised); }
.rental-card__pic { aspect-ratio: 16/10; background: var(--img-well); display: grid; place-items: center; color: var(--stone-400); overflow: hidden; border-bottom: 1px solid var(--border-strong); }
.rental-card__pic img { width: 100%; height: 100%; max-width: none; object-fit: cover; transition: transform var(--dur-slow) var(--ease-out); }
.rental-card:hover .rental-card__pic img { transform: scale(1.04); }
.rental-card__body { display: flex; flex-direction: column; gap: var(--space-2); padding: var(--space-6) var(--space-6) var(--space-5); min-width: 0; }
.rental-card__body h3 { margin: 0; font: var(--type-h3); text-transform: none; }
.rental-card__body h3 a { color: inherit; }
.rental-card__body h3 a:hover { color: var(--accent); text-decoration: none; }
.rental-card__body p { margin: 0; color: var(--text-muted); font: var(--type-body-sm); }
.rental-card__body .kv-btn--quiet { align-self: flex-start; margin-top: var(--space-2); }
.rental-card__clamp { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.rental-card__price { margin: 0 var(--space-6); padding: var(--space-4) 0; border-top: 1px solid var(--border-hairline); font: var(--type-body-sm); color: var(--text-muted); }
.rental-card__price strong { font: var(--weight-regular) var(--text-xl)/1 var(--font-display); color: var(--text-strong); letter-spacing: var(--tracking-display); }
.rental-card__price .rental-card__ask { font: var(--type-label); letter-spacing: 0; }
.rental-card__foot { padding: 0 var(--space-6) var(--space-6); display: flex; gap: var(--space-3) var(--space-5); align-items: center; flex-wrap: wrap; }
.rental-card--row { grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); grid-template-rows: auto; }
.rental-card--row .rental-card__pic { aspect-ratio: auto; height: 100%; min-height: 200px; border-bottom: 0; border-right: 1px solid var(--border-strong); }
.num { font: var(--type-kicker); letter-spacing: .1em; color: var(--text-faint); }
@media (max-width: 1000px) { .rental-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .rental-grid, .rental-grid--2 { grid-template-columns: minmax(0, 1fr); } .rental-card--row { grid-template-columns: 112px minmax(0, 1fr); } .rental-card--row .rental-card__pic { min-height: 0; } .rental-card__body { padding: var(--space-5); } .rental-card__price { margin: 0 var(--space-5); } .rental-card__foot { padding: 0 var(--space-5) var(--space-5); } }
/* mobil: lepicí lišta „Poptat termín" na detailu pronájmu (data-float-bar — skládá se s chatem a cookies) */
.svc-stickybar { position: fixed; left: 0; right: 0; bottom: 0; z-index: var(--z-sticky-buy, 90); display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); padding: 12px var(--space-4) calc(12px + env(safe-area-inset-bottom)); background: var(--bg-page); border-top: 1px solid var(--border-strong); visibility: hidden; translate: 0 100%; transition: translate var(--dur-base) var(--ease-out), visibility 0s linear var(--dur-base); }
.svc-stickybar.is-shown { visibility: visible; translate: none; transition-delay: 0s; }
.svc-stickybar__text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.svc-stickybar__text strong { font: var(--weight-semibold) var(--text-base)/1.25 var(--font-text); color: var(--text-strong); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.svc-stickybar__text span { font: var(--type-body-sm); color: var(--text-muted); }
.svc-stickybar .btn { flex: none; }
@media (min-width: 761px) { .svc-stickybar { display: none; } }
/* — Káva v postranním sloupci (catering): kompaktní řádky místo velkých karet — */
.mini-products { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--border-strong); }
.mini-product { display: grid; grid-template-columns: 64px minmax(0, 1fr) auto; gap: var(--space-4); align-items: center; padding: var(--space-3) 0; border-bottom: 1px solid var(--border-hairline); color: inherit; }
.mini-product:hover { text-decoration: none; color: inherit; }
.mini-product:hover .mini-product__name { color: var(--accent); }
.mini-product__pic { width: 64px; height: 64px; background: var(--img-well); display: grid; place-items: center; overflow: hidden; }
.mini-product__pic img { max-width: 82%; max-height: 82%; width: auto; height: auto; object-fit: contain; mix-blend-mode: multiply; }
.mini-product__name { font: var(--weight-semibold) var(--text-base)/1.3 var(--font-text); color: var(--text-strong); transition: color var(--dur-fast) var(--ease-out); }
.mini-product__price { font: var(--weight-regular) var(--text-lg)/1 var(--font-display); color: var(--text-strong); white-space: nowrap; }
.mini-product__price small { font: var(--type-body-sm); color: var(--text-muted); }
.mini-product__text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.mini-product__meta { font: var(--type-body-sm); color: var(--text-muted); }

/* ═══ 11. Kurzy ══════════════════════════════════════════════════════════ */
/* karty kurzů: počet sloupců podle počtu kurzů (2 → 2, 3 → 3, 4 → 2 × 2), poslední lichá přes celý řádek */
.course-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; background: transparent; border-top: 1px solid var(--border-strong); border-left: 1px solid var(--border-strong); margin-bottom: var(--space-8); }
.course-grid--n1 { grid-template-columns: minmax(0, 1fr); }
.course-grid--n2, .course-grid--n4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.course-card { display: flex; flex-direction: column; gap: var(--space-3); padding: var(--space-7) var(--space-7) var(--space-5); background: var(--surface-card); color: var(--text-body); border-right: 1px solid var(--border-strong); border-bottom: 1px solid var(--border-strong); transition: background-color var(--dur-base) var(--ease-out); min-width: 0; }
.course-card:hover { background: var(--surface-raised); color: var(--text-body); text-decoration: none; transform: none; box-shadow: none; }
.course-card.is-selected { background: var(--surface-well); }
.course-card__top { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.course-badge { font: var(--weight-semibold) var(--text-2xs)/1 var(--font-text); letter-spacing: .1em; text-transform: uppercase; padding: 6px 8px; background: var(--bg-inverse); color: var(--text-inverse); }
.course-card__price { font: var(--type-price); color: var(--text-strong); white-space: nowrap; }
.course-card__title { margin: 0; font: var(--type-h3); color: var(--text-strong); }
.course-card p { margin: 0; color: var(--text-muted); font: var(--type-body-sm); }
.course-card__meta { display: flex; gap: var(--space-2) var(--space-5); flex-wrap: wrap; font: var(--type-spec); color: var(--text-muted); text-transform: uppercase; letter-spacing: .06em; }
.course-card__meta span { display: inline-flex; align-items: center; gap: 6px; }
.course-card__foot { margin-top: auto; padding-top: var(--space-4); border-top: 1px solid var(--border-hairline); display: flex; justify-content: space-between; align-items: center; font: var(--weight-semibold) var(--text-xs)/1 var(--font-text); letter-spacing: .1em; text-transform: uppercase; color: var(--text-strong); }
.course-card:hover .course-card__foot, .course-card.is-selected .course-card__foot { color: var(--accent); }
.course-detail { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); border: 1px solid var(--border-strong); scroll-margin-top: calc(var(--header-total, 113px) + 16px); }
.course-detail__content { padding: var(--space-8); background: var(--surface-card); min-width: 0; }
.course-detail__content h2 { margin: var(--space-3) 0 var(--space-4); }
.course-detail .content { font-size: var(--text-base); }
.outline { list-style: none; margin: 0; padding: 0; display: grid; gap: 0; border-top: 1px solid var(--border-hairline); }
.outline li { display: grid; grid-template-columns: 48px 1fr; gap: 16px; padding: 12px 0; border-bottom: 1px solid var(--border-hairline); font: var(--type-body); }
.outline li span { font: var(--type-kicker); letter-spacing: .1em; color: var(--text-faint); padding-top: 4px; width: auto; height: auto; background: none; border-radius: 0; display: block; }
.course-note { border-left: 2px solid var(--accent); padding: 4px 0 4px 18px; font: var(--type-body-sm); color: var(--text-muted); margin-top: var(--space-6); display: flex; gap: 10px; }
.course-note .ico { display: none; }
.course-facts { list-style: none; margin: var(--space-6) 0 0; padding: var(--space-5) 0 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 140px), 1fr)); gap: var(--space-5); border-top: 1px solid var(--border-strong); }
.course-facts li { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.course-facts strong { font: var(--weight-regular) var(--text-xl)/1 var(--font-display); color: var(--text-strong); white-space: nowrap; }
.course-facts span { font: var(--type-body-sm); color: var(--text-muted); }
.course-book { padding: var(--space-8); background: var(--surface-well); border-left: 1px solid var(--border-strong); min-width: 0; --btn-fg: var(--surface-well); }
.course-book > h2 { margin: var(--space-3) 0 4px; font: var(--type-h3); }
.course-book > p { margin: 0 0 var(--space-5); color: var(--text-muted); font: var(--type-body-sm); }
.course-form__fields { display: grid; gap: var(--space-5); }
.course-form .grid2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-5) 12px; }
.course-form .kv-field > label, .course-form legend { margin: 0; }
.course-qty { display: flex; gap: 14px; align-items: center; flex-wrap: wrap; }
.course-qty small { font: var(--type-body-sm); color: var(--text-muted); }
/* výběr termínu: řádky s linkou místo oříznutého selectu („ne 25. 10. 2026 · 9:00 — 6 volných míst") */
.date-pick { border: 0; margin: 0; padding: 0; min-width: 0; }
.date-pick > legend { display: block; padding: 0; margin: 0 0 8px; }
.date-pick__list { border-top: 1px solid var(--border-strong); }
.date-pick__opt { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 4px 12px; min-height: 52px; padding: 10px 10px 10px 8px; border-bottom: 1px solid var(--border-hairline); cursor: pointer; font: var(--type-body-sm); color: var(--text-body); transition: background-color var(--dur-fast) var(--ease-out), box-shadow var(--dur-fast) var(--ease-out); }
.date-pick__opt:hover { background: var(--surface-raised); }
.date-pick__opt:has(input:checked) { background: var(--surface-card); box-shadow: inset 2px 0 0 var(--text-strong); }
.date-pick__when { display: flex; align-items: baseline; flex-wrap: wrap; gap: 0 10px; min-width: 0; }
.date-pick__when strong { font: var(--weight-semibold) var(--text-base)/1.3 var(--font-text); color: var(--text-strong); white-space: nowrap; }
.date-pick__when span { font: var(--weight-regular) var(--text-md)/1.2 var(--font-display); color: var(--text-strong); white-space: nowrap; }
.date-pick__free { font: var(--type-kicker); letter-spacing: .06em; text-transform: uppercase; color: var(--state-ok); white-space: nowrap; text-align: right; }
.date-pick__opt small { grid-column: 2 / -1; font: var(--type-body-sm); color: var(--text-muted); }
.date-pick__opt.is-full { cursor: not-allowed; }
.date-pick__opt.is-full:hover { background: transparent; }
.date-pick__opt.is-full .date-pick__when { text-decoration: line-through; text-decoration-thickness: 1px; }
.date-pick__opt.is-full .date-pick__when :is(strong, span) { color: var(--text-muted); }
.date-pick__opt.is-full .date-pick__free { color: var(--state-bad); }
.date-pick__opt.is-almost .date-pick__free { color: var(--state-wait); }
.date-pick__list:has([aria-invalid="true"]) { border-top-color: var(--state-bad); }
/* dárkový poukaz při rezervaci */
.course-voucher .kv-inlineform { max-width: none; }
.course-voucher input { text-transform: uppercase; letter-spacing: .04em; }
.course-voucher input::placeholder { text-transform: none; letter-spacing: 0; }
.course-voucher__note { margin: 0; color: var(--text-muted); }
.course-voucher .kv-field__hint { margin: 0; }
.course-voucher__note.is-ok { color: var(--state-ok); }
.course-total { margin: var(--space-6) 0 var(--space-4); padding-top: var(--space-4); border-top: 1px solid var(--border-strong); }
.course-total__sum { display: flex; justify-content: space-between; align-items: baseline; gap: var(--space-4); font: var(--type-kicker); letter-spacing: .08em; text-transform: uppercase; color: var(--text-muted); }
.course-total__sum strong { font: var(--weight-regular) clamp(30px, 2vw + 20px, 44px)/1 var(--font-display); letter-spacing: var(--tracking-display); color: var(--text-strong); text-transform: none; white-space: nowrap; font-variant-numeric: tabular-nums; }
.course-form__fine { display: block; margin-top: var(--space-4); font: var(--type-body-sm); color: var(--text-muted); }
.course-form__fine a { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; text-decoration-color: var(--border-hairline); }
/* poznámka: tři řádky, ať se nápověda v poli na telefonu neusekne */
.course-form textarea { min-height: 96px; resize: vertical; }
.course-success { background: var(--surface-card); border: 1px solid var(--state-ok); padding: var(--space-6); display: grid; gap: var(--space-4); outline: none; }
.course-success h3 { margin: 0; color: var(--state-ok); display: flex; align-items: center; gap: 8px; font: var(--type-h3); }
.course-success .spec-table { font-size: var(--text-sm); }
.course-success .spec-table tbody th { width: 40%; }
@media (max-width: 1000px) { .course-grid, .course-grid--n4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .course-grid > :last-child:nth-child(odd) { grid-column: 1 / -1; } }
@media (max-width: 900px) { .course-detail { grid-template-columns: minmax(0, 1fr); } .course-book { border-left: 0; border-top: 1px solid var(--border-strong); } .course-detail__content, .course-book { padding: var(--space-6) var(--space-5); } }
@media (max-width: 640px) { .course-grid, .course-grid--n2, .course-grid--n4 { grid-template-columns: minmax(0, 1fr); } .course-grid > :last-child:nth-child(odd) { grid-column: auto; } .course-card { padding: var(--space-6) var(--space-5) var(--space-5); } .course-form .grid2 { grid-template-columns: minmax(0, 1fr); } }

/* ═══ 12. 404, drobnosti ═════════════════════════════════════════════════ */
.err-code { font: var(--weight-regular) 120px/1 var(--font-display); color: var(--text-strong); margin: 0; letter-spacing: var(--tracking-display); }
.err-code .err-zero { color: var(--accent); font-style: italic; }
/* (newsletterový pás .news-cta stylují pravidla úvodní stránky v sekci 13) */
.b2b-badge { font: var(--weight-semibold) var(--text-2xs)/1 var(--font-text); letter-spacing: .1em; text-transform: uppercase; color: var(--accent); }

/* ═══ 13. Úvodní stránka (showroom) ═════════════════════════════════════ */
/* v1.0: Hero — fotka (nebo exponát) vpravo přes celou výšku; do 900 px fotka nahoře (16 : 9), na telefonu přes celou
   šířku, tlačítka přes celou šířku a fakta jako řádky s linkami (dřív tři stísněné sloupce). */
.home-hero .kv-hero__media--exhibit { background: var(--img-well); }
@media (max-width: 900px) {
    .home-hero .kv-hero__media { order: -1; aspect-ratio: 16 / 9; min-height: 0; border-top: 0; border-bottom: 1px solid var(--border-strong); }
    .home-hero .kv-hero__media--exhibit { aspect-ratio: 4 / 3; }
    .home-hero .kv-hero__content { padding: var(--space-7) 0 var(--space-8); gap: var(--space-5); }
}
@media (max-width: 640px) {
    .home-hero .kv-hero__media { margin-inline: calc(-1 * var(--gutter)); }
    .home-hero .kv-hero__cta { flex-direction: column; align-items: stretch; width: 100%; }
    .home-hero .kv-hero__cta .kv-btn { width: 100%; }
    .home-hero .kv-facts { flex-direction: column; gap: 0; padding-top: 0; }
    .home-hero .kv-facts div { flex-direction: row; align-items: baseline; gap: var(--space-4); padding: var(--space-3) 0; border-bottom: 1px solid var(--border-hairline); }
    .home-hero .kv-facts strong { flex: none; min-width: 3.4em; font-size: var(--text-xl); }
    .home-hero a.kv-hero__tag { left: var(--space-4); bottom: var(--space-4); max-width: calc(100% - 2 * var(--space-4)); padding: 10px 12px; }
}

/* Rejstřík kategorií + boční deska „Poradíme vám osobně" (do 1000 px vodorovně, na telefonu bez obrázku) */
.home-index { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, .6fr); gap: var(--space-9); align-items: start; }
.home-index__list { border-top: 1px solid var(--border-strong); }
.kv-cat__sub { display: block; font: var(--type-body-sm); color: var(--text-faint); margin-top: 4px; }
.home-index__side { display: flex; flex-direction: column; gap: var(--space-4); padding: var(--space-6); border: 1px solid var(--border-strong); background: var(--surface-card); position: sticky; top: calc(var(--header-total, 113px) + 24px); }
.home-index__media { position: relative; aspect-ratio: 4 / 3; background: var(--img-well); overflow: hidden; }
.home-index__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; padding: 6%; mix-blend-mode: multiply; opacity: 0; transition: opacity var(--dur-base) var(--ease-out); }
.home-index__media img.is-on { opacity: 1; }
.home-index__sidetext { display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-3); }
.home-index__side p { margin: 0; font: var(--type-body-sm); color: var(--text-muted); }
.home-index__blank { aspect-ratio: 4/3; background: var(--img-well); display: grid; place-items: center; color: var(--stone-300); }
@media (max-width: 1000px) {
    .home-index { grid-template-columns: 1fr; gap: var(--space-7); }
    .home-index__side { position: static; display: grid; grid-template-columns: 160px minmax(0, 1fr); align-items: center; gap: var(--space-6); }
    .home-index__media, .home-index__blank { aspect-ratio: 1; }
}
@media (max-width: 640px) {
    .home-index__side { grid-template-columns: 1fr; padding: var(--space-5); }
    .home-index__media, .home-index__blank { display: none; }
    .kv-cat { grid-template-columns: 32px minmax(0, 1fr); gap: 4px var(--space-3); }
    .kv-cat__meta { grid-column: 2; }
    /* telefon (N3): rejstřík jako mřížka 2 × n — číslo, název, počet; podkategorie až ve výpisu (dřív ~700 px řádků) */
    .home-index__list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .home-index__list .kv-cat { grid-template-columns: minmax(0, 1fr); align-content: start; gap: 6px; min-height: 104px; padding: var(--space-4) var(--space-4) var(--space-4) 0; border-bottom: 1px solid var(--border-hairline); }
    .home-index__list .kv-cat:nth-child(even) { padding-left: var(--space-4); padding-right: 0; border-left: 1px solid var(--border-hairline); }
    .home-index__list .kv-cat__sub { display: none; }
    .home-index__list .kv-cat__name { font-size: var(--text-md); line-height: 1.25; }
    .home-index__list .kv-cat__meta { grid-column: auto; font-size: var(--text-base); }
}

/* Bloky produktů. Desktop: mřížka 4 sloupce, dlaždice „Celá nabídka" doplní neúplnou řadu (žádné prázdné pole).
   Do 1100 px vodorovná police — karty se posouvají prstem nebo šipkami, další karta je vidět na okraji obrazovky,
   poslední dlaždice vede na celou nabídku. */
.home-products__nav { display: flex; align-items: center; gap: var(--space-5); }
.home-shelf__btns { display: none; }
.home-shelf__btns .kv-iconbtn + .kv-iconbtn { margin-left: -1px; }
.kv-grid.home-shelf { grid-template-columns: repeat(4, minmax(0, 1fr)); } /* (0,2,0): přebije obecná pravidla mřížky karet */
.home-shelf__all { display: none; flex-direction: column; justify-content: flex-end; align-items: flex-start; gap: var(--space-3); min-height: 180px; padding: var(--pad-card); background: var(--surface-card); color: var(--text-strong); font: var(--type-h3); text-decoration: none; transition: background-color var(--dur-base) var(--ease-out), color var(--dur-fast) var(--ease-out); }
.home-shelf__all--fill { display: flex; grid-column: span var(--fill, 1); }
/* karty v mřížce sdílí výšky řádků přes subgrid (3 řádky, app.css níže) — dlaždice musí zabrat stejnou výšku */
@supports (grid-template-rows: subgrid) { .kv-grid.home-shelf > .home-shelf__all { grid-row: span 3; } }
.home-shelf__all:hover { background: var(--surface-raised); color: var(--accent); text-decoration: none; }
/* dlaždice přes 2–3 sloupce: popiska velkým serifem, ať prázdná plocha působí jako záměr (výstavní cedulka), ne díra */
@media (min-width: 1101px) {
    .home-shelf__all--wide { flex-direction: row; align-items: flex-end; justify-content: flex-start; gap: var(--space-4); padding: var(--space-8); font: var(--weight-regular) var(--text-2xl)/1 var(--font-display); letter-spacing: var(--tracking-display); }
    .home-shelf__all--wide .ico { width: 28px; height: 28px; margin-bottom: 6px; }
}
.home-shelf__all .ico { transition: translate var(--dur-base) var(--ease-out); }
.home-shelf__all:hover .ico { translate: var(--space-2) 0; }
@media (max-width: 1100px) {
    .kv-grid.home-shelf { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: calc((100% - 3px) / 2.6); overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scrollbar-width: none; margin-right: calc(-1 * var(--gutter)); border-right: 0; }
    .home-shelf::-webkit-scrollbar { display: none; }
    .home-shelf > * { scroll-snap-align: start; }
    .home-shelf__all, .home-shelf__all--fill { display: flex; grid-column: auto; }
    [data-shelf].is-scrollable .home-shelf__btns { display: inline-flex; }
}
@media (max-width: 640px) {
    .kv-grid.home-shelf { grid-auto-columns: 76%; }
    .home-products__nav { width: 100%; justify-content: space-between; }
    .home-shelf .kv-product { padding: var(--space-4); gap: var(--space-3); }
}
@media (prefers-reduced-motion: reduce) { .home-shelf { scroll-behavior: auto; } }

/* Služby: fotka dosedá na horní linku desky, číslo leží na papírovém štítku v rohu fotky; nadpisy začínají na stejné
   lince a odkazy stojí dole. Na telefonu kompaktní řádky (fotka 104 px vlevo). */
.home-service { gap: var(--space-3); min-height: 0; }
.home-service__media { position: relative; display: block; margin: calc(-1 * var(--space-7)) calc(-1 * var(--space-7)) var(--space-3); aspect-ratio: 4 / 3; background: var(--img-well); overflow: hidden; }
.home-service__media .kv-service__pic { width: 100%; height: 100%; max-width: none; margin: 0; aspect-ratio: auto; object-fit: cover; display: block; transition: scale var(--dur-slow) var(--ease-out); }
.home-service:hover .kv-service__pic { scale: 1.04; }
.home-service__media .kv-service__num { position: absolute; left: var(--space-3); top: var(--space-3); padding: 6px 8px; background: var(--bg-page); color: var(--text-strong); line-height: 1; }
.home-service:not(.home-service--photo) .home-service__media { display: flex; align-items: center; justify-content: space-between; aspect-ratio: auto; margin: 0 0 var(--space-3); background: none; overflow: visible; }
.home-service:not(.home-service--photo) .home-service__media .kv-service__num { position: static; padding: 0; background: none; color: var(--text-faint); }
.home-service .kv-service__title { margin-top: 0; }
.home-service__short { display: none; }
.home-service .kv-service__more { margin-top: auto; padding-top: var(--space-2); }
@media (max-width: 640px) {
    .home-service { display: grid; grid-template-columns: 104px minmax(0, 1fr); align-content: start; column-gap: var(--space-4); row-gap: 6px; padding: var(--space-4); }
    .home-service__media { grid-row: 1 / span 3; margin: 0; aspect-ratio: 1; align-self: start; }
    .home-service:not(.home-service--photo) .home-service__media { aspect-ratio: 1; justify-content: center; background: var(--surface-well); }
    .home-service .kv-service__title { font-size: var(--text-lg); }
    .home-service .kv-service__text { display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
    .home-service__long { display: none; }
    .home-service__short { display: inline; }
    .home-service .kv-service__more { margin-top: 4px; padding-top: 0; }
}

/* Pražírna: inverzní pás — nahoře titulek a perex, pod nimi tři kávy vedle sebe (do 1000 px police) */
.home-band { border-bottom: 1px solid var(--border-strong); padding-left: var(--space-8); padding-right: var(--space-8); }
.home-band__inner { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-8); }
.home-band__text { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: var(--space-5) var(--space-9); align-items: end; }
.home-band__head { display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-3); }
.home-band__text h2 { margin: 0; font: var(--type-h2); letter-spacing: var(--tracking-display); }
.home-band__lead { display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-5); }
.home-band__text p { margin: 0; font: var(--type-body); color: var(--text-inverse-muted); max-width: 46ch; }
.home-band__cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gap-grid); align-items: stretch; }
.home-band__cards--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: calc((100% + var(--gap-grid)) * 2 / 3); }
.home-band__cards--1 { grid-template-columns: minmax(0, 1fr); max-width: calc((100% - 2 * var(--gap-grid)) / 3); }
.home-band .kv-coffee { border-color: var(--border-inverse); background: var(--surface-card); color: var(--text-body); height: 100%; }
.home-band .kv-coffee a { color: var(--text-strong); }
.home-band .kv-coffee h3 { color: var(--text-strong); }
@media (max-width: 1000px) {
    .home-band__text { grid-template-columns: 1fr; align-items: start; }
    .home-band__cards, .home-band__cards--2, .home-band__cards--1 { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: calc((100% - var(--gap-grid)) / 1.6); max-width: none; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scrollbar-width: none; margin-right: calc(-1 * var(--space-8)); padding-right: var(--space-8); }
    .home-band__cards::-webkit-scrollbar { display: none; }
    .home-band__cards > * { scroll-snap-align: start; }
}
@media (max-width: 720px) {
    .home-band { padding-left: var(--space-5); padding-right: var(--space-5); }
    .home-band__cards, .home-band__cards--2, .home-band__cards--1 { grid-auto-columns: 84%; margin-right: calc(-1 * var(--space-5)); padding-right: var(--space-5); }
    /* v polici jen to podstatné (původ, chuť, profil, balení, cena) — popis je na detailu */
    .home-band .kv-coffee__desc { display: none; }
}

/* Důvěra (N5): průměr serifem (od 3 hodnocení), citace z ověřených nákupů v mřížce linek, doprava a platba — jen skutečná
   data. Při 1–2 citacích stojí doprava a platba jako sloupec vedle nich (dřív prázdná třetina řádku), při 3 citacích
   řádek pod nimi; bez recenzí jen doprava a platba. Popisky verzálkami nad textem, linky místo boxů. */
.home-trust__grid { display: grid; gap: var(--space-8); align-items: start; }
.home-trust__grid.has-score { grid-template-columns: minmax(200px, 280px) minmax(0, 1fr); }
.home-trust__grid--1.has-ways, .home-trust__grid--2.has-ways { grid-template-columns: minmax(0, 2fr) minmax(260px, 1fr); align-items: stretch; }
.home-trust__score { display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-3); padding-top: var(--space-5); border-top: 1px solid var(--border-strong); }
.home-trust__score strong { font: var(--weight-regular) var(--text-4xl)/.9 var(--font-display); letter-spacing: var(--tracking-display); color: var(--text-strong); }
.home-trust__count { font: var(--type-kicker); letter-spacing: .08em; text-transform: uppercase; color: var(--text-muted); }
.home-trust__quotes { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.home-trust__quotes--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.home-trust__quotes--1 { grid-template-columns: minmax(0, 1fr); }
.home-quote { margin: 0; display: flex; flex-direction: column; gap: var(--space-4); padding: var(--space-7); }
.home-quote blockquote { margin: 0; font: italic 400 var(--text-xl)/1.3 var(--font-display); color: var(--text-strong); text-wrap: pretty; }
.home-trust__quotes--1 .home-quote { padding: var(--space-8) var(--space-9); gap: var(--space-5); }
.home-trust__quotes--1 .home-quote blockquote { font-size: clamp(30px, 3.2vw, 44px); line-height: 1.12; letter-spacing: var(--tracking-tight); }
.home-quote figcaption { margin-top: auto; display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 0; font: var(--type-body-sm); color: var(--text-muted); }
.home-quote figcaption > * + *::before { content: "·"; margin: 0 8px; color: var(--text-faint); }
.home-quote__who { font-weight: var(--weight-semibold); color: var(--text-strong); }
.home-quote figcaption a { color: var(--text-muted); text-decoration: underline; text-decoration-color: var(--border-hairline); text-underline-offset: 3px; }
.home-quote figcaption a:hover { color: var(--accent); text-decoration-color: currentColor; }
.home-ways { display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-5); }
.home-ways__list { width: 100%; margin: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: var(--space-5) var(--space-8); }
.home-ways__list > div { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.home-ways dt { font: var(--type-kicker); letter-spacing: var(--tracking-kicker); text-transform: uppercase; color: var(--text-muted); }
.home-ways dd { margin: 0; font: var(--type-body); color: var(--text-body); }
/* pod citacemi (3 recenze nebo průměr): řádek přes celou šířku nad tenkou linkou */
.home-trust__grid.has-score .home-ways, .home-trust__grid--3 .home-ways { grid-column: 1 / -1; padding-top: var(--space-6); border-top: 1px solid var(--border-hairline); }
/* vedle 1–2 citací: sloupec řádků s linkami */
.home-trust__grid--1 .home-ways, .home-trust__grid--2 .home-ways { padding-top: var(--space-5); border-top: 1px solid var(--border-strong); }
.home-trust__grid--1 .home-ways__list, .home-trust__grid--2 .home-ways__list { grid-template-columns: minmax(0, 1fr); gap: 0; }
.home-trust__grid--1 .home-ways__list > div, .home-trust__grid--2 .home-ways__list > div { padding: var(--space-4) 0; border-bottom: 1px solid var(--border-hairline); }
.home-trust__grid--1 .home-ways__list > div:first-child, .home-trust__grid--2 .home-ways__list > div:first-child { padding-top: 0; }
.home-ways__more { margin-top: auto; }
@media (max-width: 1000px) {
    .home-trust__grid.has-score, .home-trust__grid--1.has-ways, .home-trust__grid--2.has-ways { grid-template-columns: 1fr; gap: var(--space-6); }
    /* pod citací přes celou šířku: doprava a platba zase vedle sebe (na telefonu pod sebou) */
    .home-trust__grid--1 .home-ways, .home-trust__grid--2 .home-ways { border-top-color: var(--border-hairline); }
    .home-trust__grid--1 .home-ways__list, .home-trust__grid--2 .home-ways__list { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: var(--space-5) var(--space-8); }
    .home-trust__grid--1 .home-ways__list > div, .home-trust__grid--2 .home-ways__list > div { padding: 0; border-bottom: 0; }
    .home-trust__score { flex-direction: row; flex-wrap: wrap; align-items: baseline; gap: var(--space-3) var(--space-5); }
    .home-trust__score strong { font-size: var(--text-3xl); }
}
@media (max-width: 760px) {
    .home-trust__quotes, .home-trust__quotes--2 { grid-template-columns: 1fr; }
    .home-quote, .home-trust__quotes--1 .home-quote { padding: var(--space-5); gap: var(--space-4); }
    .home-quote blockquote { font-size: var(--text-lg); line-height: 1.3; }
    .home-trust__quotes--1 .home-quote blockquote { font-size: clamp(24px, 6.6vw, 30px); line-height: 1.15; }
}

/* Prodejna / gastro / EKO */
.home-info { display: flex; flex-direction: column; gap: var(--space-3); padding: var(--space-7); align-items: flex-start; }
.home-info strong { font: var(--type-h3); color: var(--text-strong); }
.home-info p { margin: 0; font: var(--type-body-sm); color: var(--text-muted); }
.home-info .kv-btn--quiet { margin-top: auto; padding-top: var(--space-3); }
/* EKO jako v navigaci: inkoust se zelenou tečkou (zelená je stav, ne druhá akcentová barva) */
.home-info__eko::before { width: 6px; height: 6px; border-radius: var(--radius-pill); background: var(--state-ok); }
/* (0,2,0): obecné .kv-lines--3 v sekci 16 stojí později — na tabletu by trojice zůstala stísněná ve 3 sloupcích */
@media (max-width: 1000px) { .kv-lines.home-infos { grid-template-columns: 1fr; } .home-info { padding: var(--space-6); } }

/* Magazín: řádky s datem; hover posune text o 8 px (translate — nepřepočítává layout) */
.home-articles { border-top: 1px solid var(--border-strong); }
.home-article { display: grid; grid-template-columns: 140px minmax(0, 1fr) auto; gap: var(--space-6); align-items: baseline; padding: var(--space-5) 0; border-bottom: 1px solid var(--border-hairline); color: inherit; }
.home-article:hover { text-decoration: none; color: inherit; }
.home-article > :not(.home-article__date) { transition: translate var(--dur-base) var(--ease-out); }
.home-article:hover > :not(.home-article__date) { translate: var(--space-2) 0; }
.home-article__date { font: var(--type-kicker); letter-spacing: .08em; text-transform: uppercase; color: var(--text-faint); }
.home-article__title { display: block; font: var(--type-h3); color: var(--text-strong); transition: color var(--dur-fast) var(--ease-out); }
.home-article:hover .home-article__title { color: var(--accent); }
.home-article__perex { display: block; font: var(--type-body-sm); color: var(--text-muted); margin-top: 4px; max-width: 70ch; }
.home-article__more { font: var(--type-label); letter-spacing: .05em; text-transform: uppercase; display: inline-flex; gap: 8px; align-items: center; white-space: nowrap; }
@media (max-width: 720px) { .home-article { grid-template-columns: 1fr; gap: 6px; } .home-article__more { display: none; } }

/* Newsletter: inverzní pás (v tmavém režimu tmavě šedý — role pásu z kv.css), odstup od patičky, viditelný fokus
   pole (linka zesílí), čitelný kicker i odkaz v drobném textu */
.kv-section--last { border-bottom: 0; padding-bottom: var(--gap-section); }
.news-cta { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--space-6) var(--space-9); align-items: end; background: var(--bg-inverse); color: var(--text-inverse); padding: var(--pad-band) var(--space-9); }
.news-cta .kv-kicker { color: var(--text-inverse-muted); }
.news-cta h2 { color: var(--text-inverse); margin: var(--space-3) 0 var(--space-3); }
.news-cta p { margin: 0; color: var(--text-inverse-muted); font: var(--type-body); max-width: 46ch; }
.news-cta form { display: flex; gap: 0; border-bottom: 1px solid var(--text-inverse); transition: box-shadow var(--dur-fast) var(--ease-out); }
.news-cta form:focus-within { box-shadow: 0 1px 0 var(--text-inverse); }
.news-cta input, .news-cta input[type=email] { flex: 1; min-width: 0; border: 0; background: transparent; color: var(--text-inverse); font: italic 400 var(--text-lg)/1 var(--font-display); padding: 12px 0; min-height: 48px; }
.news-cta input::placeholder { color: var(--text-inverse-muted); }
.news-cta input:focus, .news-cta input:focus-visible { box-shadow: none; outline: none; }
.news-cta button { border: 1px solid var(--btn-bg); padding: 15px 24px; min-height: 48px; font: var(--weight-semibold) var(--text-sm)/1 var(--font-text); letter-spacing: .05em; text-transform: uppercase; cursor: pointer; transition: var(--transition-control); }
.news-cta .news-cta__fine { margin-top: var(--space-3); font: var(--type-body-sm); color: var(--text-inverse-muted); }
.news-cta__fine a { color: var(--text-inverse); text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
.news-cta__fine a:hover { color: var(--text-inverse); text-decoration-thickness: 2px; }
@media (max-width: 900px) { .news-cta { grid-template-columns: 1fr; padding: var(--space-8) var(--space-6); } }
@media (max-width: 640px) { .news-cta { margin-inline: calc(-1 * var(--gutter)); padding: var(--space-8) var(--gutter); } .news-cta button { padding: 15px 16px; } }

/* Karta produktu: překryvný odkaz, rychlé přidání do košíku, druhá fotka při najetí, stav načítání */
/* v1.0 (A2): karty v mřížce sdílí výšky řádků (subgrid): fotka · text · cena. Dřív měla každá karta vlastní výšky
   a v řadě „skákaly" linky patiček i ceny. Rychlé přidání je podle DS „+" v patičce (dřív pruh přes fotku). */
.kv-product { position: relative; }
.kv-product__img { mix-blend-mode: multiply; }
.kv-product__link { position: absolute; inset: 0; z-index: 1; }
/* fokus z klávesnice: dvojitá linka uvnitř desky + zesvětlený podklad (1px ring splýval s linkami mřížky) */
.kv-product__link:focus-visible { outline: none; box-shadow: inset 0 0 0 2px var(--text-strong), inset 0 0 0 4px var(--bg-page); }
.kv-product:has(> .kv-product__link:focus-visible) { background: var(--surface-raised); }
.kv-product__flags { z-index: 2; pointer-events: none; }
.kv-product__compare, .kv-product__quick { z-index: 3; }
.kv-product__body, .kv-product__foot { pointer-events: none; position: relative; }
.kv-product__quick { position: relative; flex: none; margin: 0; pointer-events: auto; }
/* „Přidáno" od košíku se do čtverce nevejde — zůstane jen ikona fajfky */
.kv-product__add.is-added { font-size: 0; gap: 0; color: var(--state-ok); border-color: var(--state-ok); }
.kv-product__add::after { content: ""; position: absolute; inset: -2px; } /* dotyková plocha 44 × 44 */
/* druhá fotka se prolne (přechod opacity i zvětšení při najetí má .kv-product__media img v kv.css — vlastní
   transition by ho tu přebila a fotka by naskočila skokem) */
.kv-product__img--hover { position: absolute; inset: 0; margin: auto; opacity: 0; }
.kv-product.has-hover-img:hover .kv-product__img--hover { opacity: 1; }
.kv-product.has-hover-img:hover .kv-product__img:not(.kv-product__img--hover) { opacity: 0; }
.kv-product.is-loading .kv-product__media img, .kv-coffee.is-loading .kv-coffee__media img { opacity: .45; }
.is-loading { cursor: progress; }
.nav-progress { position: fixed; top: 0; left: 0; height: 2px; width: 0; background: var(--accent); z-index: 1000; opacity: 0; pointer-events: none; }
/* ukazatel přechodu na další stránku: tokeny pohybu (3 × pomalá délka, měkké doznění odhalování), žádné literály */
html.is-navigating .nav-progress { opacity: 1; animation: navProgress calc(var(--dur-slow) * 3) var(--ease-reveal) forwards; }
@keyframes navProgress { from { width: 0; } 60% { width: 70%; } to { width: 92%; } }
@media (prefers-reduced-motion: reduce) { .nav-progress { display: none; } }

/* mřížka karet: každá buňka má vlastní rámeček a sousední linky se překrývají o 1 px — při jednom či dvou
   výsledcích tak nevede horní linka přes prázdnou plochu (police na úvodu má vlastní pravidla) */
:is(.grid--products, .grid--products-narrow, .kv-grid--products):not(.home-shelf) { border: 0; padding: 1px 0 0 1px; background: transparent; }
:is(.grid--products, .grid--products-narrow, .kv-grid--products):not(.home-shelf) > * { border: 1px solid var(--border-strong); margin: -1px 0 0 -1px; }

/* mřížka karet: řádky karet v jedné řadě sdílí výšky (fotka · značka/název/dostupnost · cena) */
@supports (grid-template-rows: subgrid) {
    :is(.grid--products, .grid--products-narrow, .kv-grid--products) > :has(> .kv-product) { display: grid; grid-row: span 3; grid-template-rows: subgrid; row-gap: 0; }
    :is(.grid--products, .grid--products-narrow, .kv-grid--products) > :has(> .kv-product) > .kv-product { grid-row: 1 / -1; display: grid; grid-template-rows: subgrid; row-gap: var(--space-4); height: auto; }
    /* patička začíná hned pod tělem (auto okraj by ji v mřížce přitiskl dolů a linky by zase skákaly) */
    :is(.grid--products, .grid--products-narrow, .kv-grid--products) > :has(> .kv-product) > .kv-product > .kv-product__foot { margin-top: 0; }
    /* oblíbené: pod kartou řádek „Odebrat z oblíbených" */
    :is(.grid--products, .grid--products-narrow) > .wish-cell { grid-row: span 4; }
    :is(.grid--products, .grid--products-narrow) > .wish-cell > .kv-product { grid-row: 1 / 4; }
}
.wish-cell__btn { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 0; border: 0; background: transparent; color: var(--text-muted); font: var(--weight-semibold) var(--text-2xs)/1 var(--font-text); letter-spacing: .08em; text-transform: uppercase; cursor: pointer; transition: color var(--dur-fast) var(--ease-out); }
.wish-cell__btn:hover { color: var(--accent); }
/* dvě karty vedle sebe: jen „Odebrat" (celý text má aria-label), ať se popisek nezalomí na střed do dvou řádků */
@media (max-width: 480px) { .wish-cell__more { display: none; } }
/* účet → Oblíbené: hlídací pes (řádky z linek: fotka, název, dostupnost, od kdy, zrušit) */
.watch-list { margin-top: var(--space-9); }
.watch-list__head { margin-bottom: var(--space-5); }
.watch-list__title { margin: var(--space-3) 0 var(--space-2); font: var(--type-h2); }
.watch-list__sub { margin: 0; font: var(--type-body-sm); color: var(--text-muted); }
.watch-list__rows { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--border-strong); }
.watch-row { display: grid; grid-template-columns: 64px minmax(0, 1fr) auto; gap: var(--space-4); align-items: center; padding: var(--space-3) 0; border-bottom: 1px solid var(--border-hairline); }
.watch-row__pic { display: grid; place-items: center; width: 64px; height: 64px; background: var(--img-well); overflow: hidden; }
.watch-row__pic img { max-width: 86%; max-height: 86%; width: auto; height: auto; object-fit: contain; mix-blend-mode: multiply; }
.watch-row__body { display: grid; gap: 6px; min-width: 0; }
.watch-row__name { font: var(--weight-semibold) var(--text-md)/1.3 var(--font-text); color: var(--text-strong); text-decoration: none; }
.watch-row__name:hover { color: var(--accent); text-decoration: none; }
.watch-row__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 14px; }
.watch-row__since { font: var(--type-body-sm); color: var(--text-muted); }
.watch-row__cancel { margin: 0; }
@media (max-width: 640px) { .watch-row { grid-template-columns: 56px minmax(0, 1fr); } .watch-row__pic { width: 56px; height: 56px; } .watch-row__cancel { grid-column: 2; } }

.kv-product .kv-price__excl { white-space: nowrap; }
/* štítek se nikdy nepřekryje s tlačítkem porovnání — dlouhý se zkrátí */
.kv-product__flags .kv-badge { min-width: 0; max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
/* užší karty (3 sloupce vedle filtru, tablet): cena o stupeň menší, štítky úspornější */
@media (max-width: 1100px) {
    .kv-product .kv-price__main { font-size: 26px; }
    .kv-product__flags { right: 52px; }
    .kv-product__flags .kv-badge { padding: 5px 6px; letter-spacing: .06em; }
}
/* telefon: dvě karty vedle sebe (dřív jedna přes celou šířku, 24 produktů = 13 400 px) */
@media (max-width: 480px) {
    :is(.grid--products, .grid--products-narrow, .kv-grid--products) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    :is(.grid--products, .grid--products-narrow, .kv-grid--products) .kv-product { --pad-card: 12px; row-gap: 10px; gap: 10px; }
    .kv-product__name { font-size: var(--text-sm); }
    .kv-product__flags { top: 6px; left: 6px; right: 44px; }
    .kv-product__flags > :nth-child(n+2) { display: none; }
    .kv-product__flags .kv-badge { padding: 5px 6px; font-size: 10px; letter-spacing: .06em; }
    .kv-product__compare { top: 4px; right: 4px; width: 32px; height: 32px; }
    .kv-product__compare::after { content: ""; position: absolute; inset: -6px; }
    .kv-product__compare .ico { width: 14px; height: 14px; }
    .kv-product .kv-price__main { font-size: 22px; }
    .kv-product .kv-price__excl { display: none; }
    .kv-product .kv-price__unit, .kv-product .kv-price__omnibus { font-size: var(--text-xs); }
    .kv-product__foot { flex-wrap: wrap; gap: 8px; padding-top: 10px; }
    .kv-product__quick { margin-left: auto; }
    .kv-product__meta { gap: 4px 10px; }
    .kv-product .kv-avail, .kv-product__ship { font-size: 10px; letter-spacing: .06em; }
    .kv-product__packs { font-size: var(--text-xs); }
}

/* ═══ 14. Tmavý režim podle systému (zrcadlo pravidel :root[data-theme="dark"] pro prefers-color-scheme) ═══ */
@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) .kv-rating__stars { color: var(--paper-50); }
    :root:not([data-theme="light"]) .kv-rating__stars .is-empty { color: var(--ash-700); }
    :root:not([data-theme="light"]) .kv-bar__track i { background: var(--ash-700); }
    :root:not([data-theme="light"]) .kv-bar__track i.is-on { background: var(--paper-50); }
    :root:not([data-theme="light"]) .kv-pack button.is-active { background: var(--paper-50); color: var(--ink-900); }
    :root:not([data-theme="light"]) .kv-select { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23F3F2EE' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E"); }
    :root:not([data-theme="light"]) .kv-check input:checked { background: var(--paper-50); border-color: var(--paper-50); }
    :root:not([data-theme="light"]) .kv-check input:checked::after { border-color: var(--ink-900); }
    :root:not([data-theme="light"]) .kv-search button { background: var(--paper-50); color: var(--ink-900); }
    :root:not([data-theme="light"]) .kv-search button:hover { background: transparent; color: var(--paper-50); }
    :root:not([data-theme="light"]) .kv-pager .is-current { background: var(--paper-50); color: var(--ink-900); }
    :root:not([data-theme="light"]) select { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23F3F2EE' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E"); }
    :root:not([data-theme="light"]) .theme-toggle__sun { display: block; }
    :root:not([data-theme="light"]) .theme-toggle__moon { display: none; }
    :root:not([data-theme="light"]) .kv-footer form button { background: var(--paper-50); color: var(--ink-900); }
    :root:not([data-theme="light"]) .kv-footer__bottom img { filter: grayscale(1) invert(1); }
    :root:not([data-theme="light"]) #chat-bubble { background: var(--paper-50); color: var(--ink-900); border-color: var(--paper-50); }
    :root:not([data-theme="light"]) .map-embed iframe { filter: grayscale(1) invert(.9) hue-rotate(180deg); }
}

/* ═══ 15. Tlačítka — kontextové barvy ═══════════════════════════════════
   Primární tlačítko = barva textu kontextu na pozadí kontextu; hover invertuje. Díky tokenům funguje stejně na papíru,
   v inverzním pásu i v tmavém režimu (kde je pás papírový a karty tmavé) a žádný stav nemá text v barvě pozadí.
   Selektor :root:root má specificitu (0,3,0) jako pravidla :root[data-theme="dark"] v kv.css a je později, proto vítězí. */
:root { --btn-bg: var(--text-strong); --btn-fg: var(--bg-page); --btn-outline: var(--border-strong); }
.kv-band, .home-band, .news-cta, .chat-panel__head, #cookie-bar, #compare-bar, .toast { --btn-bg: var(--text-inverse); --btn-fg: var(--bg-inverse); --btn-outline: var(--text-inverse); }
#cookie-bar, #compare-bar, .toast, .chat-panel__head { --btn-bg: var(--paper-50); --btn-fg: var(--ink-900); --btn-outline: var(--paper-50); }
.kv-coffee, .kv-product, .kv-contact, .home-info, .panel, .inquiry, .course-book, .facets, .checkout fieldset { --btn-bg: var(--text-strong); --btn-fg: var(--surface-card); --btn-outline: var(--border-strong); }
:root:root .btn, :root:root .kv-btn, :root:root .btn--onDark, :root:root .kv-btn--onDark, :root:root .kv-btn--ink { background: var(--btn-bg); color: var(--btn-fg); border-color: var(--btn-bg); }
:root:root .btn:hover, :root:root .kv-btn:hover, :root:root .btn--onDark:hover, :root:root .kv-btn--onDark:hover, :root:root .kv-btn--ink:hover { background: var(--btn-fg); color: var(--btn-bg); border-color: var(--btn-bg); }
:root:root .btn--ghost, :root:root .kv-btn--outline, :root:root .btn--outlineDark { background: transparent; color: var(--btn-bg); border-color: var(--btn-outline); }
:root:root .btn--ghost:hover, :root:root .kv-btn--outline:hover, :root:root .btn--outlineDark:hover { background: var(--btn-bg); color: var(--btn-fg); border-color: var(--btn-bg); }
:root:root .btn--accent, :root:root .kv-btn--accent, :root:root .btn--danger { background: var(--accent); color: var(--text-on-accent); border-color: var(--accent); }
:root:root .btn--accent:hover, :root:root .kv-btn--accent:hover, :root:root .btn--danger:hover { background: transparent; color: var(--accent); border-color: var(--accent); }
:root:root .kv-btn--quiet { background: transparent; color: var(--btn-bg); border-color: transparent; border-bottom-color: var(--btn-bg); }
:root:root .kv-btn--quiet:hover { background: transparent; color: var(--accent); border-bottom-color: var(--accent); }
:root:root .btn[disabled], :root:root .kv-btn[disabled] { background: var(--btn-bg); color: var(--btn-fg); opacity: .35; }
.qty-stepper button:hover, .kv-qty button:hover, .kv-pack button.is-active, .kv-pack--links a.is-active, .kv-pager .is-current, .kv-search button, .kv-footer form button, .news-cta button, .tabs button.is-active { background: var(--btn-bg); color: var(--btn-fg); }
.kv-search button:hover, .kv-footer form button:hover, .news-cta button:hover { background: var(--btn-fg); color: var(--btn-bg); }

/* ═══ 16. v1 — výloha: proužek s kreditem, šuplík košíku, let do košíku, doprava zdarma, DS třídy pro starší šablony ═══ */
html { scroll-padding-top: calc(var(--header-total, 113px) + 16px); }
.visually-hidden { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.skip-link { position: absolute; left: var(--gutter); top: -60px; z-index: var(--z-progress); background: var(--text-strong); color: var(--bg-page); padding: 10px 16px; font: var(--type-label); letter-spacing: .05em; text-transform: uppercase; }
.skip-link:focus { top: 8px; color: var(--bg-page); text-decoration: none; }

/* Horní proužek (v1.0): vlevo dnešní otevírací doba a telefon, uprostřed výhody nákupu (dřív samostatná 48px lišta pod
   hlavičkou — teď ušetří místo nad obsahem), vpravo přepínač světlého/tmavého režimu. Neroluje s hlavičkou. */
.kv-strip { border-bottom: 1px solid var(--border-hairline); background: var(--bg-page); }
.kv-strip__in { display: flex; justify-content: space-between; align-items: center; gap: var(--space-5); min-height: 34px; font: var(--type-kicker); letter-spacing: .06em; color: var(--text-muted); }
.kv-strip__info { display: flex; align-items: center; gap: var(--space-5); min-width: 0; }
.kv-strip__info a { color: var(--text-muted); display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; min-height: 32px; }
.kv-strip__info a:hover { color: var(--text-strong); text-decoration: none; }
.kv-strip .hours-pill { font: var(--type-kicker); letter-spacing: .06em; }
.kv-strip .hours-note { display: none; }
.kv-strip__usp { list-style: none; margin: 0 auto; padding: 0; display: flex; align-items: center; gap: 0; text-transform: uppercase; color: var(--text-muted); white-space: nowrap; }
.kv-strip__usp li { display: inline-flex; align-items: center; }
.kv-strip__usp li + li::before { content: ""; width: 4px; height: 4px; margin: 0 14px; background: var(--border-hairline); flex: none; }
.kv-strip__theme { display: inline-flex; align-items: center; gap: 8px; min-height: 32px; padding: 0; background: none; border: 0; cursor: pointer; color: var(--text-muted); font: var(--type-kicker); letter-spacing: .06em; text-transform: uppercase; white-space: nowrap; transition: color var(--dur-fast) var(--ease-out); }
.kv-strip__theme:hover { color: var(--text-strong); }
.kv-strip__theme .ico { display: block; }
/* výhody podle místa: celé tři od 1340 px, dvě od 1101 px, jedna (doprava zdarma) od 861 px, na telefonu žádná —
   nic se neuseká ani nepřekryje telefon (dřív se mezi 1100 a 1300 px texty překrývaly) */
.kv-strip__info { flex: none; }
@media (max-width: 1339px) { .kv-strip__usp li:nth-child(n+3) { display: none; } }
@media (max-width: 1100px) { .kv-strip__usp li:nth-child(n+2) { display: none; } }
@media (max-width: 860px) { .kv-strip__usp { display: none; } }
@media (max-width: 640px) { .kv-strip__phone, .kv-strip__theme { display: none !important; } .kv-strip__info { flex: 0 1 auto; } }

/* Odkaz Košík: krátké podtržení po přidání (bez barvy a měřítka) */
#cart-link { position: relative; }
#cart-link .kv-headerlink__word { position: relative; }
#cart-link .kv-headerlink__word::after { content: ""; position: absolute; left: 0; right: 0; bottom: -4px; height: 1px; background: currentColor; transform: scaleX(0); transform-origin: left; transition: transform var(--dur-fast) var(--ease-out); }
#cart-link.is-ticked .kv-headerlink__word::after { transform: scaleX(1); }
.kv-cartcount { display: inline-block; min-width: 1ch; }

/* Let do košíku — v1.0 nahrazen klidným momentem „Přidáno": vysune se šuplík a nová položka v něm doznívá kamenem
   (cart-fx.js). Žádný létající obrázek. Tlačítko „Přidáno" (bez šuplíku) jen nereaguje na další klik. */
.kv-btn.is-added, .btn.is-added { pointer-events: none; }
/* „tady se něco změnilo": kamenné podbarvení doznívá do průhledna (600 ms, nová položka 1,2 s) */
@keyframes kvGlow { from { background-color: var(--surface-well); } to { background-color: transparent; } }
.kv-glow { animation: kvGlow var(--dur-slow) var(--ease-out); }
.kv-glow.kv-glow--long { animation-duration: calc(var(--dur-slow) * 2); }
@media (prefers-reduced-motion: reduce) { .kv-glow, .kv-drawer__skelrow b { animation: none; } } /* i „dýchání" kostry šuplíku (1,6 s) */

/* Šuplík košíku — zamčení scrollu přes html.is-locked (window.kvScrollLock); has-drawer jen jako záloha */
html.has-drawer:not(.is-locked) { overflow: hidden; }
.kv-drawer { position: fixed; inset: 0; z-index: var(--z-drawer); }
.kv-drawer__scrim { position: absolute; inset: 0; background: var(--overlay); opacity: 0; transition: opacity var(--dur-base) var(--ease-out); }
.kv-drawer__panel { position: absolute; top: 0; right: 0; bottom: 0; width: min(440px, 100vw); background: var(--bg-page); border-left: 1px solid var(--border-strong); display: flex; flex-direction: column; transform: translateX(100%); transition: transform var(--dur-base) var(--ease-out); outline: none; }
.kv-drawer.is-open .kv-drawer__scrim { opacity: 1; }
.kv-drawer.is-open .kv-drawer__panel { transform: none; }
.kv-drawer__head { flex: none; display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); min-height: var(--header-h); padding: 0 var(--space-6); border-bottom: 1px solid var(--border-strong); }
.kv-drawer__head h2 { font: var(--type-h3); margin: 0; }
/* počet kusů stejně jako v hlavičce „Košík (1)" — písmem textu, ne serifovou kurzívou (holá „1" vypadala jako lomítko) */
.kv-drawer__head h2 em { font: var(--weight-semibold) var(--text-sm)/1 var(--font-text); font-style: normal; color: var(--accent); font-variant-numeric: tabular-nums lining-nums; vertical-align: 2px; }
.kv-drawer__head h2 em:not(:empty)::before { content: "("; }
.kv-drawer__head h2 em:not(:empty)::after { content: ")"; }
.kv-drawer__close { display: inline-flex; align-items: center; gap: 8px; background: none; border: 0; border-bottom: 1px solid transparent; padding: 6px 0; cursor: pointer; color: var(--text-strong); font: var(--weight-semibold) var(--text-xs)/1 var(--font-text); letter-spacing: .08em; text-transform: uppercase; }
.kv-drawer__close:hover { color: var(--accent); border-bottom-color: var(--accent); }
.kv-drawer__close { min-height: 44px; }
.kv-drawer__notice { flex: none; margin: 0; padding: 12px var(--space-6); border-bottom: 1px solid var(--border-hairline); font: var(--type-body-sm); color: var(--state-ok); }
.kv-drawer__notice.is-error { color: var(--state-bad); }
.kv-drawer__body { flex: 1; min-height: 0; display: flex; flex-direction: column; transition: opacity var(--dur-fast) var(--ease-out); }
.kv-drawer__body[aria-busy="true"]:not(:empty):not(:has(> .kv-drawer__skel)) { opacity: .5; }
.kv-drawer__body[aria-busy="true"]:empty::before { content: "Načítám košík…"; padding: var(--space-6); font: var(--type-body-sm); color: var(--text-muted); }
.kv-drawer__items { flex: 1; min-height: 0; overflow-y: auto; list-style: none; margin: 0; padding: 0 var(--space-6); overscroll-behavior: contain; }
.kv-drawer__item { display: grid; grid-template-columns: 64px minmax(0, 1fr) auto; gap: var(--space-4); align-items: start; padding: var(--space-4) 0; border-bottom: 1px solid var(--border-hairline); transition: opacity var(--dur-fast) var(--ease-out); }
.kv-drawer__item:last-child { border-bottom: 0; }
.kv-drawer__item.is-busy .kv-drawer__total { opacity: .4; }
.kv-drawer__item.is-removing { opacity: .35; pointer-events: none; }
/* podbarvení řádku sahá až k okrajům šuplíku (obsah zůstává na místě) */
.kv-drawer__item.kv-glow { margin: 0 calc(-1 * var(--space-6)); padding-left: var(--space-6); padding-right: var(--space-6); }
.kv-drawer__thumb { width: 64px; height: 64px; display: grid; place-items: center; background: var(--img-well); overflow: hidden; color: var(--stone-400); }
.kv-drawer__thumb img { width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; padding: 6px; }
.kv-drawer__info { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.kv-drawer__name { font: var(--weight-semibold) var(--text-base)/1.3 var(--font-text); color: var(--text-strong); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.kv-drawer__unit { font: var(--type-body-sm); color: var(--text-faint); font-variant-numeric: tabular-nums; }
.kv-drawer__unit s { margin-right: 4px; }
.kv-drawer__avail { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px var(--space-2); }
.kv-drawer__avail .kv-avail { font-size: var(--text-2xs); }
.kv-drawer__lead { font: var(--type-body-sm); color: var(--text-muted); }
.kv-drawer__controls { display: flex; align-items: center; gap: var(--space-4); margin-top: 6px; flex-wrap: wrap; }
.kv-qty--sm { height: 32px; }
.kv-qty--sm button { width: 32px; font-size: var(--text-md); }
.kv-qty--sm input { width: 40px; font-size: var(--text-base); }
.kv-qty button[disabled] { opacity: .3; cursor: default; }
.kv-qty button[disabled]:hover { background: transparent; color: var(--text-strong); }
.kv-drawer__remove { position: relative; background: none; border: 0; border-bottom: 1px solid var(--border-hairline); padding: 2px 0; cursor: pointer; color: var(--text-muted); font: var(--weight-semibold) var(--text-2xs)/1.2 var(--font-text); letter-spacing: .1em; text-transform: uppercase; }
/* dotyk: plocha aspoň 44 × 44 px, vzhled zůstává tichý */
.kv-drawer__remove::after { content: ""; position: absolute; inset: -14px -8px; }
@media (pointer: coarse) {
    .kv-qty--sm { height: 44px; }
    .kv-qty--sm button { width: 44px; }
    .kv-qty--sm input { width: 44px; font-size: 16px; }
}
.kv-drawer__remove:hover { color: var(--accent); border-bottom-color: var(--accent); }
.kv-drawer__fixed { font: var(--type-body-sm); color: var(--text-muted); }
.kv-drawer__total { font: var(--weight-regular) var(--text-lg)/1 var(--font-display); color: var(--text-strong); white-space: nowrap; font-variant-numeric: tabular-nums; padding-top: 2px; }
.kv-drawer__foot { flex: none; display: grid; gap: var(--space-3); padding: var(--space-4) var(--space-6) calc(var(--space-6) + env(safe-area-inset-bottom)); border-top: 1px solid var(--border-strong); background: var(--bg-page); }
.kv-drawer__sum { display: flex; justify-content: space-between; align-items: baseline; gap: var(--space-4); font: var(--type-kicker); letter-spacing: .08em; text-transform: uppercase; color: var(--text-muted); }
.kv-drawer__sum strong { font: var(--weight-regular) var(--text-xl)/1 var(--font-display); letter-spacing: var(--tracking-display); color: var(--text-strong); text-transform: none; font-variant-numeric: tabular-nums; }
.kv-drawer__note { margin: 0; font: var(--type-body-sm); color: var(--text-faint); }
/* K pokladně (hlavní, širší) a Do košíku vedle sebe — patička šuplíku nebere telefonu půl obrazovky */
.kv-drawer__actions { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr); gap: var(--space-2); margin-top: var(--space-2); }
.kv-drawer__actions .kv-btn { padding-left: var(--space-3); padding-right: var(--space-3); }
.kv-drawer__empty { display: flex; flex-direction: column; gap: var(--space-4); padding: var(--space-8) var(--space-6); overflow-y: auto; }
.kv-drawer__emptytitle { font: var(--type-h2); font-size: var(--text-xl); margin: 0; }
.kv-drawer__empty p { margin: 0; font: var(--type-body-sm); color: var(--text-muted); }
.kv-drawer__index { display: flex; flex-direction: column; border-top: 1px solid var(--border-strong); }
.kv-drawer__index a { display: grid; grid-template-columns: 32px minmax(0, 1fr) auto; align-items: center; gap: var(--space-3); padding: 12px 0; border-bottom: 1px solid var(--border-hairline); color: var(--text-strong); font: var(--weight-medium) var(--text-base)/1.3 var(--font-text); }
.kv-drawer__index a:hover { color: var(--accent); text-decoration: none; }
.kv-drawer__error { padding: var(--space-6); font: var(--type-body-sm); color: var(--state-bad); }
/* „Odebráno: … · Vrátit zpět" — řádek místo odebrané položky, 5 s, pak se sbalí (šuplík i stránka košíku) */
.kv-cartundo { list-style: none; border-bottom: 1px solid var(--border-hairline); }
.kv-cartundo__in { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); padding: var(--space-3) 0; }
.kv-cartundo__text { margin: 0; min-width: 0; font: var(--type-body-sm); color: var(--text-muted); }
.kv-cartundo__text strong { color: var(--text-strong); font-weight: var(--weight-semibold); }
.kv-cartundo__btn { flex: none; display: inline-flex; align-items: center; min-height: 44px; padding: 0; background: none; border: 0; color: var(--text-strong);
    font: var(--weight-semibold) var(--text-2xs)/1.2 var(--font-text); letter-spacing: .1em; text-transform: uppercase; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 5px;
    cursor: pointer; transition: var(--transition-control); }
.kv-cartundo__btn:hover { color: var(--accent); }
.kv-cartundo__btn[disabled] { opacity: .4; cursor: default; }
.kv-cartundo--solo { flex: none; padding: 0 var(--space-6); }
@media (max-width: 480px) { .kv-drawer__head, .kv-drawer__notice { padding-left: var(--space-5); padding-right: var(--space-5); } .kv-drawer__items { padding: 0 var(--space-5); } .kv-drawer__foot { padding-left: var(--space-5); padding-right: var(--space-5); } }
/* položky a doporučení se rolují spolu (s jednou položkou nezůstává pod ní prázdná plocha — doplní ji doporučení) */
.kv-drawer__scroll { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; }
.kv-drawer__scroll > .kv-drawer__items { flex: none; overflow: visible; }
/* než přijdou data: dva kamenné řádky (ukážou se až po 150 ms — rychlé načtení neblikne), tiše „dýchají" */
.kv-drawer__skel { padding: 0 var(--space-6); animation: kvSkelIn var(--dur-base) var(--ease-out) 150ms backwards; }
.kv-drawer__skelrow { display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: var(--space-4); padding: var(--space-4) 0; border-bottom: 1px solid var(--border-hairline); }
.kv-drawer__skelrow i { display: block; width: 64px; height: 64px; background: var(--img-well); }
.kv-drawer__skelrow span { display: grid; gap: 10px; align-content: start; padding-top: 4px; }
.kv-drawer__skelrow b { display: block; height: 10px; background: var(--surface-well); animation: kvSkel 1.6s var(--ease-in-out) infinite alternate; }
.kv-drawer__skelrow b:nth-child(1) { width: 78%; }
.kv-drawer__skelrow b:nth-child(2) { width: 42%; }
.kv-drawer__skelrow b:nth-child(3) { width: 28%; margin-top: 8px; }
@keyframes kvSkelIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes kvSkel { from { opacity: 1; } to { opacity: .45; } }
/* Doporučení pod položkami (šuplík i stránka košíku): příslušenství, kupováno spolu, dorovnání na dopravu zdarma.
   Tichý blok — popisek verzálkami nad inkoustovou linkou, řádky s miniaturou 48 px, cenou serifem a „+" 44 × 44. */
.kv-cartsuggest { margin: var(--space-6) var(--space-6) var(--space-5); padding-top: var(--space-3); border-top: 1px solid var(--border-strong); }
.kv-cartsuggest__head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 2px var(--space-4); }
.kv-cartsuggest__title { margin: 0; font: var(--type-kicker); letter-spacing: .1em; text-transform: uppercase; color: var(--text-muted); }
.kv-cartsuggest__note { margin: 0; font: var(--type-body-sm); color: var(--text-faint); }
.kv-cartsuggest__list { list-style: none; margin: var(--space-2) 0 0; padding: 0; }
.kv-cartsuggest__item { display: grid; grid-template-columns: 48px minmax(0, 1fr) 44px; gap: var(--space-3); align-items: center; padding: var(--space-3) 0; border-bottom: 1px solid var(--border-hairline); }
.kv-cartsuggest__item:last-child { border-bottom: 0; }
.kv-cartsuggest__thumb { width: 48px; height: 48px; display: grid; place-items: center; background: var(--img-well); overflow: hidden; }
.kv-cartsuggest__thumb img { width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; padding: 4px; }
.kv-cartsuggest__info { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.kv-cartsuggest__name { font: var(--weight-medium) var(--text-sm)/1.3 var(--font-text); color: var(--text-strong); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.kv-cartsuggest__name:hover { color: var(--accent); text-decoration: none; }
.kv-cartsuggest__meta { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px var(--space-3); }
.kv-cartsuggest__price { font: var(--weight-regular) var(--text-md)/1.1 var(--font-display); letter-spacing: var(--tracking-display); color: var(--text-strong); white-space: nowrap; font-variant-numeric: tabular-nums; }
.kv-cartsuggest__price s { font: var(--weight-regular) var(--text-xs)/1 var(--font-text); letter-spacing: 0; color: var(--text-faint); }
.kv-cartsuggest__meta .kv-avail { font-size: var(--text-2xs); }
/* dostupnost v úzkém sloupci (šuplík, doporučení, řádek košíku, souhrn pokladny): tečka stojí u prvního řádku
   a delší text („Skladem u dodavatele · dodání 3–5 dní") se láme vedle ní — ne tečka sama na řádku a text pod ní */
:is(.kv-drawer__avail, .kv-cartsuggest__meta, .co-item__avail, .co-lines__info) .kv-avail { flex-wrap: nowrap; align-items: flex-start; }
:is(.kv-drawer__avail, .kv-cartsuggest__meta, .co-item__avail, .co-lines__info) .kv-avail::before { margin-top: calc((1.25em - 6px) / 2); }
.kv-cartsuggest__add { margin: 0; }
.kv-cartsuggest__btn:hover { border-color: var(--border-strong); color: var(--accent); }
.kv-cartsuggest__btn[aria-busy="true"] { opacity: .45; cursor: progress; }
.kv-cartsuggest__btn.is-added { border-color: var(--state-ok); color: var(--state-ok); }
@media (max-width: 480px) { .kv-cartsuggest { margin-left: var(--space-5); margin-right: var(--space-5); } .kv-drawer__skel { padding: 0 var(--space-5); } }
@media (prefers-reduced-motion: reduce) { .kv-drawer__skel, .kv-drawer__skelrow b { animation: none; } }

/* Doprava zdarma — 2px linka (ne pilulka), po dosažení zelená */
.kv-freeship { display: grid; gap: 8px; padding: var(--space-2) 0 var(--space-3); }
.kv-freeship__text { display: flex; align-items: center; gap: 8px; margin: 0; font: var(--type-body-sm); color: var(--text-muted); }
.kv-freeship__text strong { font: var(--weight-regular) var(--text-md)/1 var(--font-display); color: var(--text-strong); white-space: nowrap; }
.kv-freeship__track { height: 2px; background: var(--border-hairline); overflow: hidden; }
.kv-freeship__track i { display: block; height: 100%; width: var(--p, 0%); background: var(--text-strong); transition: width var(--dur-slow) var(--ease-out); }
.kv-freeship.is-done .kv-freeship__text { color: var(--state-ok); }
.kv-freeship.is-done .kv-freeship__track i { background: var(--state-ok); }
.kv-drawer__foot > .kv-freeship { padding-top: 0; }

/* Detail: tlačítka Porovnat / Do oblíbených (tiché) v aktivním stavu červeně */
:root:root .product__compare.is-comparing, :root:root .product__wish.is-active { color: var(--accent); border-bottom-color: var(--accent); }

/* Řádek „pole + tlačítko" v jednom rámu (hlídací pes, chat, hledání na 404) */
.kv-inlineform { display: flex; gap: 0; max-width: 460px; border: 1px solid var(--border-strong); background: var(--surface-card); }
.kv-inlineform input { border: 0; flex: 1; min-width: 0; background: transparent; }
.kv-inlineform:focus-within { box-shadow: inset 0 0 0 1px var(--border-strong); }
.kv-inlineform input:focus, .kv-inlineform input:focus-visible { box-shadow: none; }
:root:root .kv-inlineform .kv-btn, :root:root .kv-inlineform .btn { border: 0; border-left: 1px solid var(--border-strong); }

/* DS třídy pro starší šablony (účet, vrácení, recenze, porovnání, pokladna) — místo inline stylů */
.section--flush-top { padding-top: 0; }
.section--narrow { max-width: var(--container-narrow); margin-left: auto; margin-right: auto; }
.section--form { max-width: 460px; margin-left: auto; margin-right: auto; }
.measure { max-width: 720px; }
.page-head { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--space-4) var(--space-6); flex-wrap: wrap; margin: 0 0 var(--space-7); }
.page-head h1 { margin: 0; }
.page-head__sub { margin: var(--space-3) 0 0; font: var(--type-body); color: var(--text-muted); max-width: 60ch; }
.kv-section-head .kv-kicker + .kv-section-head__title { margin-top: var(--space-3); }
.kv-panel { border: 1px solid var(--border-strong); background: var(--surface-card); padding: var(--pad-card); }
.kv-panel + .kv-panel { margin-top: var(--space-5); }
.kv-panel--muted { background: var(--surface-well); }
.kv-panel__title { font: var(--type-h3); margin: 0 0 var(--space-4); }
.kv-panel .btn, .kv-panel .kv-btn { --btn-fg: var(--surface-card); }
.kv-panel--muted .btn, .kv-panel--muted .kv-btn { --btn-fg: var(--surface-well); }
.kv-form { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-4); align-content: start; }
.kv-form label { display: block; margin-bottom: 6px; }
.kv-form__row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4); }
.kv-form__actions { display: flex; gap: var(--space-3); flex-wrap: wrap; align-items: center; margin-top: var(--space-2); }
.kv-form__hint { font: var(--type-body-sm); color: var(--text-muted); margin: 0; }
.kv-option { display: flex; align-items: center; gap: 12px; padding: 14px 16px; border: 1px solid var(--border-hairline); background: var(--surface-card); cursor: pointer; transition: var(--transition-control); font: var(--type-label); letter-spacing: 0; text-transform: none; color: var(--text-strong); }
.kv-option:hover { border-color: var(--border-strong); }
.kv-option:has(input:checked) { border-color: var(--border-strong); background: var(--surface-well); }
.kv-options { display: grid; gap: var(--space-2); }
.kv-options--row { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.kv-sumrow { display: flex; justify-content: space-between; align-items: baseline; gap: var(--space-4); padding: 6px 0; font: var(--type-body-sm); color: var(--text-body); }
.kv-sumrow > :last-child { white-space: nowrap; font-variant-numeric: tabular-nums; }
.kv-sumrow--ok { color: var(--state-ok); }
.kv-sumrow--total { margin-top: var(--space-2); padding-top: var(--space-4); border-top: 1px solid var(--border-strong); font: var(--type-kicker); letter-spacing: .08em; text-transform: uppercase; color: var(--text-muted); }
.kv-sumrow--total > :last-child { font: var(--weight-regular) var(--text-xl)/1 var(--font-display); letter-spacing: var(--tracking-display); color: var(--text-strong); text-transform: none; }
.kv-table-wrap { overflow-x: auto; border: 1px solid var(--border-strong); background: var(--surface-card); }
.kv-table { width: 100%; border-collapse: collapse; font: var(--type-body-sm); }
.kv-table th { text-align: left; font: var(--type-spec); text-transform: uppercase; letter-spacing: .08em; color: var(--text-muted); padding: 12px 14px; border-bottom: 2px solid var(--border-strong); white-space: nowrap; }
.kv-table td { padding: 12px 14px; border-bottom: 1px solid var(--border-hairline); vertical-align: middle; }
.kv-table tr:last-child td { border-bottom: 0; }
.kv-table__actions { white-space: nowrap; text-align: right; }
.kv-table__actions .btn + .btn { margin-left: 6px; }
.kv-table small { display: block; color: var(--text-faint); font: var(--type-kicker); letter-spacing: .04em; margin-top: 2px; }
/* stav objednávky (badge z admin/_status_badge.twig) ve výloze — linka a barva stavu, žádná pilulka */
.badge { display: inline-flex; align-items: center; gap: 6px; font: var(--weight-semibold) var(--text-2xs)/1 var(--font-text); letter-spacing: .1em; text-transform: uppercase; padding: 6px 8px; box-shadow: inset 0 0 0 1px currentColor; color: var(--text-muted); }
.badge--ok { color: var(--state-ok); } .badge--warn { color: var(--state-wait); } .badge--err { color: var(--state-bad); } .badge--info { color: var(--text-strong); } .badge--mute { color: var(--text-faint); }
.b2b-tag { display: inline-flex; vertical-align: middle; margin-left: var(--space-3); }

/* Účet: záložky a rozložení (v1.0) — stejná hlavička na všech záložkách (stránka při přepínání neposkočí),
   záložky jako lepicí podnavigace pod hlavičkou webu s linkou vyjíždějící zleva, sloupce minmax(0, …) — obsah
   (tabulky, dlouhé texty) nikdy neroztáhne stránku do šířky. */
.section:has(> .acc-head) { padding-top: var(--gap-section); }
.acc-head { margin: 0 0 var(--space-7); }
.acc-head__top { display: flex; justify-content: space-between; align-items: flex-end; flex-wrap: wrap; gap: var(--space-3) var(--space-5); }
.acc-head__title { display: flex; flex-direction: column; gap: var(--space-3); }
.acc-head h1 { margin: 0; font: var(--type-h1); font-size: clamp(40px, 5vw, 64px); letter-spacing: var(--tracking-display); }
.acc-head__logout { margin: 0; }
/* tiché „Odhlásit se" (28 px vysoké) — dotyková plocha 44 px bez změny vzhledu */
.acc-head__logout .kv-btn { position: relative; }
.acc-head__logout .kv-btn::after { content: ""; position: absolute; inset: -8px -4px; }
.acc-tabs { position: sticky; top: var(--header-total, 112px); z-index: 5; margin-top: var(--space-6); background: var(--bg-page); border-bottom: 1px solid var(--border-strong); }
.acc-tabs ul { list-style: none; margin: 0; padding: 0; display: flex; gap: var(--space-6); overflow-x: auto; scrollbar-width: none; overscroll-behavior-x: contain; }
.acc-tabs ul::-webkit-scrollbar { display: none; }
.acc-tabs li { flex: none; }
.acc-tabs a { position: relative; display: inline-flex; align-items: center; min-height: 48px; font: var(--weight-semibold) var(--text-xs)/1 var(--font-text); letter-spacing: .08em; text-transform: uppercase; color: var(--text-muted); text-decoration: none; white-space: nowrap; transition: color var(--dur-fast) var(--ease-out); }
.acc-tabs a::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; background: var(--text-strong); scale: 0 1; transform-origin: left center; transition: scale var(--dur-fast) var(--ease-out); }
.acc-tabs a:hover { color: var(--text-strong); text-decoration: none; }
.acc-tabs a:hover::after { scale: 1 1; background: var(--border-strong); }
.acc-tabs a.is-active { color: var(--text-strong); }
.acc-tabs a.is-active::after { scale: 1 1; background: var(--text-strong); }
.acc-tabs__short { display: none; }
@media (max-width: 480px) { .acc-tabs ul { gap: var(--space-5); } .acc-tabs__full { display: none; } .acc-tabs__short { display: inline; } }
.acc-tabs a:focus-visible { outline: none; box-shadow: var(--ring); }
/* uvnitř účtu je linka nahoře už u záložek — prázdné stavy bez druhé linky */
.section:has(> .acc-head) .kv-empty { border-top: 0; padding-top: var(--space-5); }

.acc-grid { display: grid; grid-template-columns: minmax(0, 8fr) minmax(0, 4fr); gap: var(--space-8); align-items: start; }
.acc-grid__main, .acc-grid__aside { min-width: 0; }
.acc-title { display: flex; align-items: baseline; gap: var(--space-3); margin: 0 0 var(--space-4); font: var(--type-h3); }
.acc-title__count { font: var(--type-body-sm); color: var(--text-faint); font-variant-numeric: tabular-nums; }
/* objednávky: řádky rejstříku, celý řádek je odkaz na detail; doklad PDF jako samostatný tichý odkaz */
.acc-orders { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--border-strong); }
.acc-order { position: relative; display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) minmax(0, 1fr) auto 20px; gap: var(--space-3) var(--space-5); align-items: center; padding: var(--space-4) 0; border-bottom: 1px solid var(--border-hairline); transition: background-color var(--dur-fast) var(--ease-out); }
.acc-order:hover { background: var(--surface-well); }
.acc-order__link { display: flex; flex-direction: column; gap: 4px; min-width: 0; color: var(--text-strong); text-decoration: none; padding-left: var(--space-2); }
.acc-order__link::after { content: ""; position: absolute; inset: 0; }
.acc-order__link:hover { text-decoration: none; }
.acc-order__link:focus-visible { outline: none; }
.acc-order__link:focus-visible::after { box-shadow: var(--ring); }
.acc-order__num { font: var(--weight-semibold) var(--text-base)/1.2 var(--font-text); font-variant-numeric: tabular-nums; }
.acc-order__date { font: var(--type-body-sm); color: var(--text-muted); }
.acc-order__total { font: var(--weight-regular) var(--text-lg)/1 var(--font-display); color: var(--text-strong); white-space: nowrap; }
.acc-order__pdf { position: relative; z-index: 1; display: inline-flex; align-items: center; gap: 6px; min-height: 44px; font: var(--weight-semibold) var(--text-2xs)/1.2 var(--font-text); letter-spacing: .1em; text-transform: uppercase; color: var(--text-muted); text-decoration: none; white-space: nowrap; }
.acc-order__pdf span { border-bottom: 1px solid var(--border-hairline); padding-bottom: 2px; }
.acc-order__pdf:hover { color: var(--accent); text-decoration: none; }
.acc-order__pdf:hover span { border-color: var(--accent); }
.acc-order__go { display: grid; place-items: center; color: var(--text-faint); transition: color var(--dur-fast) var(--ease-out), translate var(--dur-fast) var(--ease-out); }
.acc-order:hover .acc-order__go { color: var(--text-strong); translate: 3px 0; }
/* přehled vpravo: bloky oddělené linkou, žádné rámy */
.acc-card { padding: var(--space-5) 0 var(--space-6); border-top: 1px solid var(--border-strong); --btn-bg: var(--text-strong); --btn-fg: var(--bg-page); }
.acc-card + .acc-card { border-top-color: var(--border-hairline); }
.acc-grid__aside > .acc-card:first-child { border-top: 0; padding-top: var(--space-3); }
.acc-card__title { display: flex; align-items: baseline; gap: var(--space-3); margin: 0 0 var(--space-3); font: var(--type-kicker); letter-spacing: .1em; text-transform: uppercase; color: var(--text-muted); }
.acc-card__lead { margin: 0 0 var(--space-4); font: var(--type-body-sm); color: var(--text-muted); }
.acc-card__lead a { font-weight: var(--weight-semibold); color: var(--text-strong); }
.acc-card__text { margin: 0 0 var(--space-3); font: var(--type-body-sm); color: var(--text-body); }
.acc-card__text--muted { color: var(--text-muted); }
.acc-card__link { display: inline-flex; align-items: center; min-height: 44px; font: var(--weight-semibold) var(--text-2xs)/1.2 var(--font-text); letter-spacing: .1em; text-transform: uppercase; color: var(--text-strong); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 5px; }
.acc-card__link:hover { color: var(--accent); }
.acc-thumbs { list-style: none; margin: 0 0 var(--space-2); padding: 0; display: flex; gap: var(--space-3); }
.acc-thumbs a { display: grid; place-items: center; width: 72px; height: 72px; background: var(--img-well); overflow: hidden; color: var(--stone-400); transition: opacity var(--dur-fast) var(--ease-out); }
.acc-thumbs a:hover { opacity: .8; }
.acc-thumbs img { width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; padding: 6px; }
.acc-watch { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--space-3); }
.acc-watch li { display: flex; flex-direction: column; gap: 2px; font: var(--type-body-sm); }
.acc-watch a { color: var(--text-strong); }
.acc-watch span { color: var(--text-faint); font-size: var(--text-xs); }
@media (max-width: 960px) {
    .acc-grid { grid-template-columns: minmax(0, 1fr); gap: var(--space-7); }
}
@media (max-width: 640px) {
    .acc-order { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "link total" "state pdf"; gap: var(--space-2) var(--space-4); padding: var(--space-4) 0; }
    .acc-order__link { grid-area: link; padding-left: 0; }
    .acc-order__state { grid-area: state; }
    .acc-order__total { grid-area: total; justify-self: end; }
    .acc-order__pdf { grid-area: pdf; justify-self: end; min-height: 36px; }
    .acc-order__go { display: none; }
    .acc-order:hover { background: transparent; }
}

/* Moje údaje: sekce jako v pokladně, soukromí tiše na konci, potvrzovací dialog smazání účtu */
.acc-profile > .co-sec:first-of-type { border-top: 0; padding-top: var(--space-2); }
.co input:disabled:not([type=radio]):not([type=checkbox]) { color: var(--text-muted); background: transparent; border-color: var(--border-hairline); cursor: not-allowed; }
.acc-profile__actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3) var(--space-5); padding: var(--space-6) 0; border-top: 1px solid var(--border-strong); --btn-bg: var(--text-strong); --btn-fg: var(--bg-page); }
.acc-profile__actions .co-hint { margin: 0; }
.acc-privacy { margin-top: var(--space-8); padding-top: var(--space-5); border-top: 1px solid var(--border-hairline); max-width: 62ch; }
.acc-privacy__links { display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-6); }
.acc-card__link { background: none; border: 0; padding: 0; cursor: pointer; gap: 6px; }
.acc-card__reorder { margin: var(--space-2) 0 0; }
.acc-card__link[aria-busy="true"] { opacity: .5; cursor: progress; }
.acc-card__link--danger { color: var(--state-bad); }
.acc-card__link--danger:hover { color: var(--state-bad); text-decoration-thickness: 2px; }
.acc-card__label { display: block; margin-bottom: 4px; font: var(--type-kicker); letter-spacing: .08em; text-transform: uppercase; color: var(--text-faint); }
.acc-dialog { width: min(520px, calc(100vw - 32px)); max-height: calc(100dvh - 32px); margin: auto; padding: 0; border: 1px solid var(--border-strong); background: var(--bg-page); color: var(--text-body); }
.acc-dialog::backdrop { background: var(--overlay); }
/* bez JS se <dialog> neotevře — formulář smazání (s polem SMAZAT a kontrolou prohlížeče) stojí přímo na stránce */
html:not(.js) .acc-dialog { display: block; position: static; margin: var(--space-5) 0 0; }
.acc-dialog[open] { animation: accDialogIn var(--dur-base) var(--ease-out); }
@keyframes accDialogIn { from { opacity: 0; translate: 0 8px; } to { opacity: 1; translate: 0 0; } }
.acc-dialog__form { display: grid; gap: var(--space-4); padding: var(--space-7) var(--space-6); }
.acc-dialog__title { margin: 0; font: var(--type-h2); font-size: var(--text-xl); }
.acc-dialog p { margin: 0; font: var(--type-body-sm); color: var(--text-muted); }
.acc-dialog strong { color: var(--text-strong); }
.acc-dialog__actions { display: flex; flex-wrap: wrap; gap: var(--space-3) var(--space-5); align-items: center; margin-top: var(--space-2); }
:root:root:root .acc-dialog__danger { --btn-bg: transparent; --btn-fg: var(--state-bad); background: transparent; border: 1px solid var(--state-bad); color: var(--state-bad); }
:root:root:root .acc-dialog__danger:not([disabled]):hover { background: var(--state-bad-soft); color: var(--state-bad); }
.acc-dialog__danger[disabled] { opacity: .35; cursor: not-allowed; }
html:not(.js) .acc-dialog { display: block; position: static; margin: var(--space-5) 0 0; }
@media (prefers-reduced-motion: reduce) { .acc-dialog[open] { animation: none; } }

/* Přihlášení a registrace: dvě karty stejné váhy, zarovnané nahoře, pole jen tak vysoká, jak potřebují */
.auth-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-7); max-width: 960px; margin: 0 auto; align-items: start; }
:root .auth-grid > .kv-panel { margin: 0; padding: var(--space-8); }
.auth-grid .kv-form { align-content: start; }
.auth-grid .kv-kicker + h1, .auth-grid .kv-kicker + h2 { margin-top: var(--space-3); }
.auth-grid h1, .auth-grid h2 { font: var(--type-h2); font-size: var(--text-xl); margin: 0; }
.auth-head { margin-bottom: var(--space-2); }
.auth-head p { margin: var(--space-3) 0 0; font: var(--type-body-sm); color: var(--text-muted); }
/* jedna karta (sledování objednávky, zapomenuté a nové heslo, potvrzení registrace) — stejný jazyk jako přihlášení */
:root .auth-card { margin: 0; padding: var(--space-8); }
.auth-card .kv-kicker + h1, .auth-card .kv-kicker + h2 { margin-top: var(--space-3); }
.auth-card h1 { font: var(--type-h2); font-size: var(--text-2xl); margin: 0; }
.auth-card h2 { font: var(--type-h3); margin: 0; }
.auth-card p { margin: 0; }
.auth-card .auth-head p { margin-top: var(--space-3); }
.auth-card + .auth-card { margin-top: var(--space-5); }
.kv-form__hint--field, .auth-card .kv-form__hint--field { margin-top: 6px; } /* .auth-card p { margin: 0 } by ji jinak přebilo */
.auth-alt { margin: var(--space-2) 0 0; padding-top: var(--space-4); border-top: 1px solid var(--border-hairline); font: var(--type-body-sm); color: var(--text-muted); }
.auth-alt a, .auth-card .auth-head p a { color: var(--text-strong); text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
.auth-alt a:hover, .auth-card .auth-head p a:hover { color: var(--accent); }
.auth-back { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; margin: 0 0 var(--space-3); font: var(--weight-semibold) var(--text-2xs)/1.2 var(--font-text); letter-spacing: .1em; text-transform: uppercase; color: var(--text-muted); text-decoration: none; }
.auth-back svg { rotate: 180deg; transition: translate var(--dur-fast) var(--ease-out); }
.auth-back:hover { color: var(--text-strong); text-decoration: none; }
.auth-back:hover svg { translate: -3px 0; }
/* síla hesla: 1px linka pod polem se plní (200 ms) a pod ní krátká rada — bez barevných semaforů přes celé pole */
.kv-strength { display: grid; gap: 6px; margin-top: 8px; color: var(--text-faint); }
.kv-strength__track { height: 1px; background: var(--border-hairline); overflow: hidden; }
.kv-strength__track i { display: block; height: 100%; width: var(--s, 0%); background: currentColor; transition: width var(--dur-fast) var(--ease-out); }
.kv-strength__text { margin: 0; font: var(--type-body-sm); }
.kv-strength[data-level="1"] { color: var(--state-bad); }
.kv-strength[data-level="2"] { color: var(--state-wait); }
.kv-strength[data-level="3"], .kv-strength[data-level="4"] { color: var(--state-ok); }
.kv-strength.is-short { color: var(--text-muted); }
html:not(.js) .kv-strength { display: none; }
@media (max-width: 860px) { :root .auth-card { padding: var(--space-6) var(--space-5); } }
.kv-pass { position: relative; display: flex; }
.kv-pass input { flex: 1; min-width: 0; padding-right: 96px; }
.kv-pass__toggle { position: absolute; right: 0; top: 0; bottom: 0; min-width: 44px; padding: 0 14px; background: none; border: 0; cursor: pointer; color: var(--text-muted); font: var(--weight-semibold) var(--text-2xs)/1 var(--font-text); letter-spacing: .1em; text-transform: uppercase; }
.kv-pass__toggle:hover { color: var(--accent); }
.kv-pass__toggle:focus-visible { outline: none; box-shadow: var(--ring); }
html:not(.js) .kv-pass__toggle { display: none; } /* bez skriptu by „Zobrazit" nic neudělalo */
html:not(.js) .kv-pass__toggle { display: none; }
@media (max-width: 860px) {
    .auth-grid { grid-template-columns: minmax(0, 1fr); gap: var(--space-5); }
    :root .auth-grid > .kv-panel { padding: var(--space-6) var(--space-5); }
    .kv-form__row { grid-template-columns: minmax(0, 1fr); }
}

/* Stav objednávky ve výloze: verzálky s linkou v barvě stavu (ne pilulka) */
.kv-state { display: inline-flex; align-items: center; gap: 6px; padding: 5px 8px; font: var(--weight-semibold) var(--text-2xs)/1 var(--font-text); letter-spacing: .1em; text-transform: uppercase; white-space: nowrap; color: var(--text-strong); box-shadow: inset 0 0 0 1px currentColor; }
.kv-state--ok { color: var(--state-ok); }
.kv-state--wait { color: var(--state-wait); }
.kv-state--bad { color: var(--state-bad); }
.kv-state--mute { color: var(--text-faint); }

/* Vrácení / reklamace: vlákno zpráv */
.thread { display: flex; flex-direction: column; gap: 10px; margin-top: 12px; }
.thread__msg { display: flex; flex-direction: column; gap: 3px; max-width: 85%; align-self: flex-start; }
.thread__msg--me { align-self: flex-end; align-items: flex-end; }
.thread__bubble { padding: 10px 14px; border: 1px solid var(--border-hairline); background: var(--surface-card); color: var(--text-body); font: var(--type-body-sm); white-space: pre-wrap; }
.thread__msg--me .thread__bubble { background: var(--text-strong); color: var(--bg-page); border-color: var(--text-strong); }
.thread__meta { font: var(--type-kicker); letter-spacing: .04em; color: var(--text-faint); }
/* žádosti k objednávce: řádky rejstříku; v hlavičce typ, číslo, datum a štítek stavu, uvnitř co, proč a jak to dopadlo */
.ret-list { margin: 0 0 var(--space-8); }
.ret-list .acc-title, .ret-form .acc-title { margin-bottom: var(--space-3); }
.request { border-top: 1px solid var(--border-strong); padding: 0; }
.request + .request { border-top-color: var(--border-hairline); }
.request:last-child { border-bottom: 1px solid var(--border-hairline); }
.request summary { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: var(--space-2) var(--space-4); min-height: 56px; padding: var(--space-3) 0; cursor: pointer; list-style: none; font: var(--type-body-sm); color: var(--text-strong); }
.request summary::-webkit-details-marker { display: none; }
.request summary:hover .request__title strong { color: var(--accent); }
.request__title { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px var(--space-3); }
.request__title strong { font-weight: var(--weight-semibold); transition: color var(--dur-fast) var(--ease-out); }
.request__title span { color: var(--text-muted); }
.request__body { padding: 0 0 var(--space-5); }
.request__facts { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 0 var(--space-5); margin: 0 0 var(--space-4); }
.request__facts > div { display: contents; }
.request__facts dt { padding: var(--space-2) 0; font: var(--type-kicker); letter-spacing: .08em; text-transform: uppercase; color: var(--text-muted); }
.request__facts dd { margin: 0; padding: var(--space-2) 0; font: var(--type-body-sm); color: var(--text-body); overflow-wrap: anywhere; }
.request__items { list-style: none; margin: 0; padding: 0; }
.request__send { max-width: none; margin-top: var(--space-4); }
.ret-form { padding-top: var(--space-2); }
.ret-form .kv-option span { display: flex; flex-direction: column; gap: 2px; }
.ret-form .kv-option small { font: var(--type-body-sm); color: var(--text-muted); }
.ret-items { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--border-strong); }
.ret-item { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3) var(--space-5); padding: var(--space-3) 0; border-bottom: 1px solid var(--border-hairline); }
.ret-item.is-done { color: var(--text-faint); }
.ret-item__info { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.ret-item__name { font: var(--weight-semibold) var(--text-base)/1.3 var(--font-text); color: var(--text-strong); overflow-wrap: anywhere; }
.ret-item__meta { font: var(--type-body-sm); color: var(--text-muted); }
.ret-item__qty { display: flex; align-items: center; gap: var(--space-3); flex: none; }
.ret-item__qty label { margin: 0; font: var(--type-kicker); letter-spacing: .08em; text-transform: uppercase; color: var(--text-muted); }
.ret-item__qty select { min-height: 44px; }
.ret-none { margin-top: var(--space-5); }
.acc-returns .acc-order { grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr) auto; }
.acc-order__form { margin: 0; position: relative; z-index: 1; }
.acc-order__form button { background: none; border: 0; padding: 0; cursor: pointer; }
.acc-returns__hint { margin-top: var(--space-6); }
.acc-returns__hint a { color: var(--text-strong); text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
.acc-returns__hint a:hover { color: var(--accent); }
@media (max-width: 640px) {
    .acc-returns .acc-order { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "link link" "state form"; }
    .acc-order__form { grid-area: form; justify-self: end; }
    .request__facts { grid-template-columns: minmax(0, 1fr); }
    .request__facts dt { padding-bottom: 0; }
    .ret-item { flex-wrap: wrap; }
}

/* Hodnocení hvězdičkami (recenze) — radio vizuálně skryté, ale fokusovatelné */
/* hvězda 28 px + 8 px kolem = dotyková plocha 44 px; záporný okraj drží první hvězdu v ose s popisky */
.rating-input { position: relative; display: inline-flex; flex-direction: row-reverse; justify-content: flex-end; gap: 0; margin: 2px 0 2px -8px; border: 0; padding: 0; }
.rating-input + label { margin-top: var(--space-3); }
.rating-input input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.rating-input label { display: inline-block; cursor: pointer; color: var(--stone-300); padding: 8px; text-transform: none; letter-spacing: 0; transition: color var(--dur-fast) var(--ease-out); }
.rating-input label svg { width: 28px; height: 28px; fill: currentColor; stroke: none; }
.rating-input label:hover, .rating-input label:hover ~ label, .rating-input input:checked ~ label { color: var(--text-strong); }
.rating-input input:focus-visible + label { box-shadow: var(--ring); }

/* Porovnání — v1.0 (A2): pevné sloupce, „Zvýraznit rozdíly" bez skriptu (:has), na telefonu je vidět
   1,5 produktu a počítadlo „1 / 3" se šipkami; řádky, kde nemá hodnotu žádný produkt, se nevypisují. */
.compare__toggle { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; font: var(--type-body-sm); color: var(--text-body); cursor: pointer; text-transform: none; letter-spacing: 0; }
.compare__toggle input { appearance: none; width: 18px; height: 18px; flex: none; margin: 0; border: 1px solid var(--border-strong); background: transparent; display: grid; place-items: center; cursor: pointer; }
.compare__toggle input:checked { background: var(--text-strong); border-color: var(--text-strong); }
.compare__toggle input:checked::after { content: ""; width: 8px; height: 4px; border-left: 1.5px solid var(--bg-page); border-bottom: 1.5px solid var(--bg-page); transform: rotate(-45deg) translate(1px, -1px); }
.compare__nav { display: flex; align-items: center; gap: 8px; margin: 0 0 var(--space-3); }
.compare__nav[hidden] { display: none; }
.compare__pos { min-width: 64px; text-align: center; font: italic 400 var(--text-md)/1 var(--font-display); font-variant-numeric: tabular-nums; }
.compare__pos b { font-weight: 400; font-style: normal; }
.compare__wrap { overscroll-behavior-x: contain; scroll-snap-type: x proximity; scroll-padding-left: 160px; }
.compare__wrap:focus-visible { outline: none; box-shadow: var(--ring); }
.compare-table { table-layout: fixed; width: max(100%, calc(160px + var(--cols, 3) * 200px)); }
.compare-table th, .compare-table td { text-align: center; vertical-align: top; }
.compare-table tbody th, .compare-table tbody td { padding: 14px; }
.compare-table th:first-child, .compare-table td:first-child { text-align: left; position: sticky; left: 0; z-index: 1; width: 160px; background: var(--surface-card); color: var(--text-muted); font: var(--type-spec); text-transform: uppercase; letter-spacing: .08em; white-space: normal; box-shadow: inset -1px 0 0 var(--border-hairline); }
.compare-table__head { padding: 16px 14px 12px; scroll-snap-align: start; white-space: normal; text-transform: none; letter-spacing: 0; }
.compare-table__head a { display: block; color: inherit; text-decoration: none; }
.compare-table__head a:hover .compare-table__name { color: var(--accent); }
.compare-table__pic { display: grid; place-items: center; aspect-ratio: 1; max-width: 170px; margin: 0 auto 12px; background: var(--img-well); overflow: hidden; }
.compare-table__pic img { max-height: 80%; max-width: 86%; width: auto; height: auto; object-fit: contain; mix-blend-mode: multiply; }
.compare-table__name { display: block; font: var(--weight-semibold) var(--text-sm)/1.3 var(--font-text); color: var(--text-strong); transition: color var(--dur-fast) var(--ease-out); }
/* záhlaví sloupců: fotky na jedné lince nahoře (obecné „thead th { vertical-align: bottom }" by je u dvouřádkových
   názvů posunulo), název drží dva řádky, „Odebrat" pak v řadě na stejné výšce */
.compare-table thead th.compare-table__head { vertical-align: top; }
.compare-table__head .compare-table__name { min-height: calc(2 * 1.3em); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.compare-table__remove { display: inline-flex; align-items: center; gap: 6px; min-height: 40px; margin-top: 4px; padding: 6px 4px; border: 0; background: transparent; color: var(--text-muted); font: var(--weight-semibold) var(--text-2xs)/1 var(--font-text); letter-spacing: .08em; text-transform: uppercase; cursor: pointer; transition: color var(--dur-fast) var(--ease-out); }
.compare-table__remove:hover { color: var(--accent); }
.compare-table .kv-price { align-items: center; }
.compare-table .kv-price__main { font-size: var(--text-lg); }
.compare-table .kv-avail { justify-content: center; }
.compare-table__buy td { padding-top: 16px; padding-bottom: 18px; }
.compare-table__buy form { margin: 0; }
/* lepicí hlavička porovnání (kopie záhlaví: fotka + název), jede do stran s tabulkou; v toku nezabírá místo */
.compare-sticky { position: sticky; top: calc(var(--header-total, 0px) - var(--tuck-off, 0px)); z-index: 4; height: 64px; margin-bottom: -64px; visibility: hidden; opacity: 0; pointer-events: none; transition: opacity var(--dur-base) var(--ease-out), visibility 0s linear var(--dur-base), top var(--dur-base) var(--ease-in-out); }
.compare-sticky.is-on { visibility: visible; opacity: 1; pointer-events: auto; transition: opacity var(--dur-base) var(--ease-out), visibility 0s, top var(--dur-base) var(--ease-in-out); }
.compare-sticky__track { height: 100%; overflow: hidden; background: var(--bg-page); border-bottom: 1px solid var(--border-strong); }
.compare-sticky__row { display: grid; grid-template-columns: var(--first, 160px) repeat(var(--cols, 3), minmax(0, 1fr)); height: 100%; min-width: 100%; }
.compare-sticky__label { position: sticky; left: 0; z-index: 1; display: flex; align-items: center; padding: 0 14px; background: var(--bg-page); box-shadow: inset -1px 0 0 var(--border-hairline); font: var(--type-kicker); letter-spacing: .08em; text-transform: uppercase; color: var(--text-muted); }
.compare-sticky__item { display: flex; align-items: center; gap: 10px; min-width: 0; padding: 0 14px; color: var(--text-strong); text-decoration: none; }
.compare-sticky__item:hover { color: var(--accent); text-decoration: none; }
.compare-sticky__pic { flex: none; width: 40px; height: 40px; display: grid; place-items: center; background: var(--img-well); overflow: hidden; }
.compare-sticky__pic img { max-width: 88%; max-height: 88%; width: auto; height: auto; object-fit: contain; mix-blend-mode: multiply; }
.compare-sticky__name { min-width: 0; font: var(--weight-semibold) var(--text-sm)/1.25 var(--font-text); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
@media (max-width: 760px) { .compare-sticky__label { padding: 0 8px 0 10px; font-size: 10px; } .compare-sticky__item { padding: 0 10px; gap: 8px; } .compare-sticky__pic { width: 32px; height: 32px; } .compare-sticky__name { font-size: var(--text-xs); } }
@media (prefers-reduced-motion: reduce) { .compare-sticky, .compare-sticky.is-on { transition: none; } }
/* zvýraznit rozdíly: shodné řádky ustoupí, rozdílné dostanou červenou linku u názvu */
.compare:has(#cmp-diff:checked) .compare-table tbody tr[data-diff] th { color: var(--accent); box-shadow: inset 2px 0 0 var(--accent), inset -1px 0 0 var(--border-hairline); }
.compare:has(#cmp-diff:checked) .compare-table tbody tr[data-same] :is(th, td) { color: var(--text-faint); }
@media (max-width: 760px) {
    .compare__wrap { scroll-padding-left: 96px; }
    .compare-table { width: calc(96px + var(--cols, 3) * 44vw); }
    .compare-table th:first-child, .compare-table td:first-child { width: 96px; padding-left: 10px; padding-right: 8px; font-size: 10px; letter-spacing: .06em; }
    .compare-table__pic { max-width: 120px; }
    .compare-table tbody th, .compare-table tbody td { padding: 12px 10px; }
}

/* Magazín: řádkový rejstřík článků (stejný jazyk jako na úvodu), hlavní článek, detail a závěrečná výzva */
.article-list { border-top: 1px solid var(--border-strong); }
.article-row { display: grid; grid-template-columns: 200px minmax(0, 1fr); gap: var(--space-6); align-items: start; padding: var(--space-6) 0; border-bottom: 1px solid var(--border-hairline); color: inherit; }
.article-row:hover { text-decoration: none; color: inherit; }
.article-row:hover .article-row__title { color: var(--accent); }
.article-row__pic { aspect-ratio: 4/3; background: var(--img-well); overflow: hidden; }
.article-row__pic img { width: 100%; height: 100%; object-fit: cover; transition: scale var(--dur-slow) var(--ease-out); }
.article-row:hover .article-row__pic img { scale: 1.04; }
.article-row__body { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.article-row__title { margin: 0; font: var(--type-h3); color: var(--text-strong); transition: color var(--dur-fast) var(--ease-out); }
/* perex na dva řádky — zkrácený na hranici slova už v controlleru, line-clamp jen jako pojistka */
.article-row__perex { font: var(--type-body-sm); color: var(--text-muted); max-width: 70ch; margin: 0; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
/* šipka na konci řádku (rejstřík jako na úvodu): při najetí zčervená a popojede, titulek zčervená */
.article-row { grid-template-columns: 200px minmax(0, 1fr) auto; }
.article-row__go { align-self: center; padding-right: var(--space-2); color: var(--text-faint); transition: color var(--dur-fast) var(--ease-out), translate var(--dur-base) var(--ease-out); }
.article-row:hover .article-row__go { color: var(--accent); translate: 6px 0; }
.article-row:focus-visible .article-row__title { color: var(--accent); }
@media (prefers-reduced-motion: reduce) { .article-row__go { transition: none; } .article-row:hover .article-row__go { translate: none; } }
@media (max-width: 640px) {
    .article-row { grid-template-columns: 96px minmax(0, 1fr); gap: var(--space-4); padding: var(--space-4) 0; }
    .article-row__go { display: none; }
    .article-row__title { font-size: var(--text-lg); line-height: 1.25; }
    .article-row__perex { display: none; }
    /* rubrika a datum pod sebou — oddělovač „·" nezůstane viset na konci řádku */
    .article-row .home-article__date { flex-direction: column; row-gap: 2px; }
    .article-row .home-article__date .article-topic::after { content: none; }
}
/* hlavní článek výpisu: fotka 3:2 vlevo, text vpravo; linky nahoře a dole jako u hlavičky stránky */
.article-feature { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); border-bottom: 1px solid var(--border-strong); color: inherit; margin-top: calc(-1 * var(--space-9)); }
.article-feature:hover { text-decoration: none; color: inherit; }
.article-feature__pic { aspect-ratio: 3/2; background: var(--img-well); overflow: hidden; border-right: 1px solid var(--border-strong); }
.article-feature__pic img { width: 100%; height: 100%; object-fit: cover; transition: scale var(--dur-slow) var(--ease-out); }
.article-feature:hover .article-feature__pic img { scale: 1.03; }
.article-feature__body { display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-4); padding: var(--space-8) 0 var(--space-8) var(--space-8); min-width: 0; }
.article-feature__meta { display: flex; flex-wrap: wrap; gap: 4px 10px; font: var(--type-kicker); letter-spacing: .08em; text-transform: uppercase; color: var(--text-muted); }
.article-feature__new { color: var(--accent); }
.article-feature__title { margin: 0; font: var(--weight-regular) clamp(30px, 1.4vw + 22px, 44px)/1.05 var(--font-display); letter-spacing: var(--tracking-display); color: var(--text-strong); transition: color var(--dur-fast) var(--ease-out); }
.article-feature:hover .article-feature__title { color: var(--accent); }
.article-feature__perex { font: var(--type-body); color: var(--text-muted); max-width: 52ch; }
.article-feature__more { display: inline-flex; align-items: center; gap: 8px; margin-top: auto; padding-bottom: 2px; font: var(--type-label); letter-spacing: .05em; text-transform: uppercase; color: var(--text-strong); border-bottom: 1px solid var(--border-strong); }
.article-feature:hover .article-feature__more { color: var(--accent); border-color: var(--accent); }
@media (max-width: 900px) {
    .article-feature { grid-template-columns: minmax(0, 1fr); }
    .article-feature__pic { border-right: 0; border-bottom: 1px solid var(--border-strong); }
    .article-feature__body { padding: var(--space-6) 0 var(--space-7); }
}
/* detail článku: jeden sloupec — titulek, perex, fotka i text na stejné šířce */
.article { max-width: 720px; margin: 0 auto; padding: var(--space-7) 0 var(--space-9); }
.article__head { margin: 0 0 var(--space-7); }
.article__meta { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2) var(--space-4); margin: 0 0 var(--space-4); font: var(--type-kicker); letter-spacing: .08em; text-transform: uppercase; color: var(--text-muted); }
.article__title { margin: 0 0 var(--space-5); font: var(--weight-regular) clamp(38px, 2.6vw + 26px, 60px)/1.02 var(--font-display); letter-spacing: var(--tracking-display); text-wrap: balance; }
.article__perex { margin: 0; font: var(--weight-regular) var(--text-lg)/1.5 var(--font-text); color: var(--text-muted); max-width: none; }
.article__figure { margin: 0 0 var(--space-8); background: var(--img-well); border: 1px solid var(--border-hairline); }
.article__figure img { display: block; width: 100%; height: auto; }
.article__body { max-width: none; }
/* závěrečná výzva článku: inkoustový pás (servis / stánky / výběr podle tématu) */
.article-cta { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); gap: var(--space-6) var(--space-9); align-items: end; background: var(--bg-inverse); color: var(--text-inverse); padding: var(--pad-band, var(--space-10)) var(--space-9); margin: 0 0 var(--space-9); --btn-bg: var(--paper-50); --btn-fg: var(--ink-900); --btn-outline: var(--paper-50); }
.article-cta h2 { color: var(--text-inverse); margin: var(--space-3) 0 var(--space-3); }
.article-cta h2 em { color: var(--signal-400); }
.article-cta p { margin: 0; color: var(--text-inverse-muted); font: var(--type-body); max-width: 52ch; }
.article-cta .kv-kicker { color: var(--text-inverse-muted); }
.article-cta__actions { display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-4); }
.article-cta .btn { background: var(--paper-50); color: var(--ink-900); border-color: var(--paper-50); }
.article-cta .btn:hover { background: transparent; color: var(--paper-50); }
.article-cta .kv-btn--quiet { color: var(--text-inverse); border-bottom-color: var(--text-inverse-muted); }
.article-cta .kv-btn--quiet:hover { color: var(--text-inverse); border-bottom-color: var(--text-inverse); }
:root[data-theme="dark"] .article-cta { background: var(--surface-raised); color: var(--text-strong); border-top: 1px solid var(--border-strong); border-bottom: 1px solid var(--border-strong); }
:root[data-theme="dark"] .article-cta :is(h2, .kv-btn--quiet) { color: var(--text-strong); }
:root[data-theme="dark"] .article-cta :is(p, .kv-kicker) { color: var(--text-muted); }
:root[data-theme="dark"] .article-cta h2 em { color: var(--accent); }
@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) .article-cta { background: var(--surface-raised); color: var(--text-strong); border-top: 1px solid var(--border-strong); border-bottom: 1px solid var(--border-strong); }
    :root:not([data-theme="light"]) .article-cta :is(h2, .kv-btn--quiet) { color: var(--text-strong); }
    :root:not([data-theme="light"]) .article-cta :is(p, .kv-kicker) { color: var(--text-muted); }
    :root:not([data-theme="light"]) .article-cta h2 em { color: var(--accent); }
}
@media (max-width: 900px) { .article-cta { grid-template-columns: minmax(0, 1fr); padding: var(--space-8) var(--space-5); margin-left: calc(-1 * var(--gutter, 16px)); margin-right: calc(-1 * var(--gutter, 16px)); } .article-cta__actions .btn { width: 100%; } }
/* rubriky magazínu: řádek verzálkových odkazů s počtem, aktivní podtržený linkou (ne pilulky); na telefonu vodorovný posun */
.blog-topics { margin: calc(-1 * var(--space-6)) 0 var(--space-8); border-bottom: 1px solid var(--border-hairline); }
.blog-topics ul { display: flex; gap: var(--space-6); list-style: none; margin: 0; padding: 0; overflow-x: auto; scrollbar-width: none; }
.blog-topics ul::-webkit-scrollbar { display: none; }
.blog-topics li { flex: none; }
.blog-topics a { position: relative; display: inline-flex; align-items: baseline; gap: 6px; min-height: 44px; padding: 14px 0 12px; font: var(--type-label); letter-spacing: .06em; text-transform: uppercase; color: var(--text-muted); text-decoration: none; transition: color var(--dur-fast) var(--ease-out); }
.blog-topics a::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; background: var(--text-strong); scale: 0 1; transform-origin: left center; transition: scale var(--dur-base) var(--ease-out); }
.blog-topics a:hover { color: var(--text-strong); text-decoration: none; }
.blog-topics a[aria-current] { color: var(--text-strong); }
.blog-topics a[aria-current]::after { scale: 1 1; }
.blog-topics__count { font: italic 400 var(--text-md)/1 var(--font-display); letter-spacing: 0; text-transform: none; color: var(--text-faint); }
.blog-topics a[aria-current] .blog-topics__count { color: var(--accent); }
.blog-topics + .article-feature { margin-top: 0; border-top: 1px solid var(--border-strong); }
/* telefon: rubriky se zalomí do dvou řádků (vodorovný posun by schoval polovinu rubrik za okraj) */
@media (max-width: 640px) { .blog-topics ul { flex-wrap: wrap; column-gap: var(--space-5); overflow: visible; } .blog-topics a { min-height: 44px; padding: 12px 0 10px; } }
/* rubrika v metaúdajích řádku a detailu */
.article-topic { color: var(--text-strong); }
.home-article__date .article-topic::after { content: "·"; margin-left: 10px; color: var(--text-faint); }
.article-row .home-article__date { display: flex; flex-wrap: wrap; column-gap: 10px; }
a.article-topic { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; text-decoration-color: var(--border-strong); }
a.article-topic:hover { color: var(--accent); text-decoration-color: currentColor; }
/* kapitoly delšího článku pod fotkou: očíslované řádky s linkou ve dvou sloupcích */
.article-toc { margin: 0 0 var(--space-8); padding: var(--space-5) 0 var(--space-4); border-top: 1px solid var(--border-strong); border-bottom: 1px solid var(--border-hairline); }
.article-toc ol { list-style: none; margin: var(--space-3) 0 0; padding: 0; columns: 2; column-gap: var(--space-8); }
.article-toc li { break-inside: avoid; }
.article-toc a { display: grid; grid-template-columns: 2.4em minmax(0, 1fr); gap: var(--space-2); align-items: baseline; min-height: 44px; padding: 10px 0; font: var(--type-body-sm); color: var(--text-body); text-decoration: none; transition: color var(--dur-fast) var(--ease-out); }
.article-toc a:hover { color: var(--accent); }
.article-toc__num { font: var(--type-kicker); letter-spacing: .1em; color: var(--text-faint); font-variant-numeric: tabular-nums; }
@media (max-width: 640px) { .article-toc ol { columns: 1; } }
/* průběh čtení: 2px červená linka nahoře, kreslí se zleva podle scrollu stránky (jen kde to prohlížeč umí bez JS) */
.article-progress { display: none; }
@supports (animation-timeline: scroll()) {
    .article-progress { display: block; position: fixed; inset: 0 0 auto; height: 2px; z-index: calc(var(--z-header, 100) + 1); background: var(--accent); transform-origin: left center; scale: 0 1; pointer-events: none; animation: kv-read-progress linear both; animation-timeline: scroll(root block); }
    @keyframes kv-read-progress { to { scale: 1 1; } }
}
@media (prefers-reduced-motion: reduce) { .article-progress { display: none; } }
@media print { .article-progress, .article-toc, .blog-topics { display: none !important; } }

/* Stránkování — DS pager uprostřed */
.kv-pager-wrap { display: flex; justify-content: center; margin-top: var(--space-8); }

/* Prázdné stavy v hlase značky */
.kv-empty { display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-4); padding: var(--space-9) 0; border-top: 1px solid var(--border-strong); }
.kv-empty__title { font: var(--type-h2); margin: 0; }
.kv-empty p { margin: 0; font: var(--type-body); color: var(--text-muted); max-width: 52ch; }
.kv-empty__actions { display: flex; gap: var(--space-3); flex-wrap: wrap; }

/* 404 / chyba */
.error-page { text-align: center; padding: var(--space-9) 0 var(--space-7); }
.error-page .err-code { font-size: clamp(88px, 14vw, 140px); }
.error-page h1:not(.err-code) { font: var(--weight-regular) clamp(38px, 2.4vw + 26px, 60px)/1.02 var(--font-display); letter-spacing: var(--tracking-display); margin: var(--space-4) 0 var(--space-4); }
.error-page p { font: var(--type-body); color: var(--text-muted); margin: 0 auto; max-width: 46ch; }
.error-page .kv-inlineform { margin: var(--space-6) auto 0; }
.error-page__actions { margin-top: var(--space-5); }
.error-page__actions--row { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: var(--space-4) var(--space-6); margin-top: var(--space-7); }
.error-page > .kv-kicker { margin-bottom: var(--space-4); }
.error-page p a { text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }

/* Mapa až po souhlasu: kamenná deska s adresou a tlačítkem */
.map-embed { position: relative; }
.map-embed--consent { display: grid; place-items: center; text-align: center; padding: var(--space-6); background: var(--surface-well); }
.map-embed--consent.is-loaded { padding: 0; display: block; }
.map-embed__ph { display: flex; flex-direction: column; align-items: center; gap: var(--space-3); max-width: 360px; }
.map-embed__ph .ico { color: var(--text-strong); }
.map-embed__addr { font: var(--type-h3); color: var(--text-strong); text-wrap: balance; }
.map-embed__addr > span { white-space: nowrap; }
.map-embed__note { font: var(--type-body-sm); color: var(--text-muted); margin: 0; }
.map-embed__links { display: flex; gap: var(--space-4); flex-wrap: wrap; justify-content: center; }
.map-embed--tall { height: 420px; }

/* Drobnosti ze služeb */
.feat__icon--ok { color: var(--state-ok); }
.kv-lines--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 720px) { .kv-lines--3 { grid-template-columns: 1fr; } }
.kv-facts strong { white-space: nowrap; }
.split h2:first-child, .split h3:first-child { margin-top: 0; }
.split__aside-title { margin-top: var(--space-7); }
.voucher-custom--qty { max-width: 140px; }
.text-faint { color: var(--text-faint); }
.stack-sm > * + * { margin-top: var(--space-3); }
.actions-row { display: flex; gap: var(--space-3); flex-wrap: wrap; align-items: center; }
.mt-6 { margin-top: var(--space-6); }
.kv-lines--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 1000px) { .kv-lines--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 720px) { .kv-lines--4 { grid-template-columns: 1fr; } }
.kv-hero__product { object-fit: contain !important; padding: 8%; mix-blend-mode: multiply; }
.kv-hero__blank { color: var(--stone-300); }
.kv-kicker--eko { color: var(--state-ok); }
.kv-section--last { border-bottom: 0; }
.compare-table thead th { white-space: normal; min-width: 180px; vertical-align: bottom; text-transform: none; letter-spacing: 0; }
.compare-table thead th a:hover { text-decoration: none; }
.compare-table tbody th { border-bottom: 1px solid var(--border-hairline); padding: 12px 14px; font-weight: var(--weight-semibold); }
.compare-table tbody tr:last-child th { border-bottom: 0; }
.compare-table .kv-drawer__remove { margin-top: var(--space-3); }
.compare-table form { margin: 0; display: flex; justify-content: center; }
fieldset.kv-panel { margin: 0; min-width: 0; }
fieldset.kv-panel > legend { float: left; width: 100%; padding: 0; }
fieldset.kv-panel > legend + * { clear: both; }
.kv-fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
.kv-fieldset > legend { padding: 0; margin-bottom: 8px; }
.kv-form .kv-field__label { display: block; margin-bottom: 8px; }
select.select--compact { width: auto; min-width: 72px; padding: 8px 32px 8px 10px; }
.kv-panel + .kv-form, .kv-panel + form.kv-panel { margin-top: var(--space-5); }
.actions-row form { margin: 0; }
hr.rule { margin: var(--space-3) 0; }
.kv-details { border-top: 1px solid var(--border-hairline); border-bottom: 1px solid var(--border-hairline); padding: 10px 0; }
.kv-details > summary { cursor: pointer; font: var(--type-label); color: var(--text-strong); }
.kv-details[open] > summary { margin-bottom: var(--space-4); }
.kv-table__actions form { margin: 0; display: inline; }
.wish-cell { display: flex; flex-direction: column; }
.wish-cell > .kv-product { flex: 1; }
.wish-cell__remove { margin: 0; padding: 0 var(--pad-card) var(--space-5); background: var(--surface-card); }
.voucher-preview__note { font: var(--type-body-sm); color: var(--text-muted); margin: var(--space-3) 0 0; text-align: center; }
.voucher-buy__submit { margin-top: var(--space-5); }
.voucher-steps-list { list-style: none; margin: 0; padding: 0; }
/* Dárkové poukazy (vouchers.twig): předvolby jako skupina přepínačů (radio vizuálně skryté, ale ovladatelné klávesnicí) */
.voucher-page { margin-bottom: var(--space-4); }
.voucher-presets-set { border: 0; margin: 0; padding: 0; min-width: 0; }
.voucher-presets-set > legend { padding: 0; }
label.voucher-preset { position: relative; display: grid; place-items: center; min-height: 52px; padding: 12px 6px; text-align: center; white-space: nowrap; font: var(--weight-semibold) var(--text-sm)/1 var(--font-text); letter-spacing: .02em; text-transform: none; color: var(--text-body); }
label.voucher-preset input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
label.voucher-preset:has(input:checked) { background: var(--btn-bg, var(--ink-900)); color: var(--btn-fg, var(--paper-50)); }
label.voucher-preset:has(input:focus-visible) { box-shadow: var(--ring); z-index: 1; }
.voucher-field { gap: 0; margin-top: var(--space-5); }
.voucher-field .voucher-label { margin-top: 0; }
.voucher-field .kv-field__hint { margin: 6px 0 0; }
.voucher-total { display: flex; justify-content: space-between; align-items: baseline; gap: var(--space-4); margin-top: var(--space-6); padding-top: var(--space-4); border-top: 1px solid var(--border-strong); font: var(--type-kicker); letter-spacing: .08em; text-transform: uppercase; color: var(--text-muted); }
.voucher-total strong { font: var(--weight-regular) clamp(28px, 1.6vw + 20px, 40px)/1 var(--font-display); letter-spacing: var(--tracking-display); color: var(--text-strong); text-transform: none; font-variant-numeric: tabular-nums; }
@media (max-width: 520px) { .voucher-presets { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
/* náhled poukazu jako dárek: tištěná karta s ústřižkem (kód, platnost, uplatnění) za čárkovanou linkou — stejné
   rozvržení jako PDF; hodnota serifem červeně. Na papírové desce v kamenném poli, bez stínů a zaoblení. */
.voucher-preview { display: flex; flex-direction: column; gap: 0; min-width: 0; }
.gift-card { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 15em); background: var(--surface-card); border: 1px solid var(--border-strong); outline: 1px solid var(--border-hairline); outline-offset: -8px; }
.gift-card__main { display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-2); padding: var(--space-8) var(--space-7) var(--space-7); min-width: 0; }
.gift-card__brand { font: var(--weight-regular) var(--text-xl)/1 var(--font-display); letter-spacing: var(--tracking-display); color: var(--text-strong); margin-bottom: var(--space-5); }
.gift-card__kicker { font: var(--type-kicker); letter-spacing: .2em; text-transform: uppercase; color: var(--text-muted); }
.gift-card__value { font: var(--weight-regular) clamp(48px, 3vw + 30px, 76px)/1 var(--font-display); letter-spacing: var(--tracking-display); color: var(--accent); font-variant-numeric: tabular-nums; white-space: nowrap; }
.gift-card__for { margin-top: var(--space-3); font: italic 400 var(--text-lg)/1.3 var(--font-display); color: var(--text-muted); }
.gift-card__stub { display: flex; flex-direction: column; justify-content: center; gap: 4px; padding: var(--space-7) var(--space-6); border-left: 1px dashed var(--border-strong); min-width: 0; }
.gift-card__label { font: var(--type-kicker); letter-spacing: .1em; text-transform: uppercase; color: var(--text-faint); margin-top: var(--space-3); }
.gift-card__label:first-child { margin-top: 0; }
.gift-card__code { font: var(--weight-semibold) var(--text-base)/1.2 var(--font-text); letter-spacing: .08em; color: var(--text-strong); white-space: nowrap; }
.gift-card__meta { font: var(--type-body-sm); color: var(--text-strong); }
/* nová hodnota se prolne a dosedne o 4 px (bez odskoku); totéž u Celkem */
:is(.gift-card__value, [data-voucher-total]).is-changing { animation: kv-value-in var(--dur-base) var(--ease-out); }
@keyframes kv-value-in { from { opacity: .25; translate: 0 4px; } to { opacity: 1; translate: none; } }
@media (prefers-reduced-motion: reduce) { :is(.gift-card__value, [data-voucher-total]).is-changing { animation: none; } }
@media (max-width: 1100px) and (min-width: 861px), (max-width: 560px) {
    .gift-card { grid-template-columns: minmax(0, 1fr); }
    .gift-card__stub { border-left: 0; border-top: 1px dashed var(--border-strong); display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: var(--space-4); row-gap: 6px; align-items: baseline; padding: var(--space-5) var(--space-7) var(--space-6); }
    .gift-card__label, .gift-card__label:first-child { margin-top: 0; }
}
@media (max-width: 560px) { .gift-card__main { padding: var(--space-6) var(--space-5) var(--space-5); } .gift-card__stub { padding: var(--space-4) var(--space-5) var(--space-5); } .gift-card__brand { margin-bottom: var(--space-3); } }
/* úzký telefon (≤ 380 px): popisek nad hodnotou, aby kód poukazu nepřetekl ústřižek */
@media (max-width: 380px) { .gift-card__stub { grid-template-columns: minmax(0, 1fr); row-gap: 2px; } .gift-card__stub .gift-card__label:not(:first-child) { margin-top: var(--space-3); } }
/* na co poukaz použít: rejstřík odkazů pod náhledem (vyplní sloupec vedle formuláře) */
.voucher-uses { margin-top: var(--space-8); border-top: 1px solid var(--border-strong); }
.voucher-uses__title { margin: var(--space-5) 0 var(--space-3); font: var(--type-kicker); letter-spacing: var(--tracking-kicker); text-transform: uppercase; color: var(--text-muted); }
.voucher-uses .kv-cat, .voucher-uses .kv-cat:last-child { border-bottom: 1px solid var(--border-hairline); }
.voucher-uses .kv-cat__meta { font-style: normal; }
@media (max-width: 760px) { .voucher-uses .kv-cat { grid-template-columns: 32px minmax(0, 1fr) auto; gap: var(--space-4); padding: var(--space-4) 0; } .voucher-uses .kv-cat__meta { grid-column: auto; } }
/* telefon a tablet: náhled → formulář → „na co ho použije" (nákup nesmí čekat pod rejstříkem) */
@media (max-width: 860px) { .voucher-page { display: flex; flex-direction: column; align-items: stretch; gap: 0; } .voucher-preview { display: contents; } .voucher-buy { order: 2; margin-top: var(--space-7); } .voucher-uses { order: 3; } }

/* ═══ 17. v1 — utility pro stránky služeb, informací, kurzů a magazínu (místo inline stylů) ═══ */
.subhead--kicker { font: var(--type-kicker); letter-spacing: var(--tracking-kicker); text-transform: uppercase; color: var(--text-muted); margin: var(--space-6) 0 var(--space-3); }
.kv-note { font: var(--type-body-sm); color: var(--text-muted); margin: var(--space-3) 0 0; }
.kv-note--fine { font: var(--type-kicker); letter-spacing: .02em; line-height: 1.5; color: var(--text-faint); }
.lead-text { font: var(--type-body); color: var(--text-muted); margin: var(--space-3) 0 var(--space-5); max-width: 60ch; }
.text-right, th.text-right, td.text-right { text-align: right; }
.qr-img { width: 150px; height: 150px; border: 1px solid var(--border-strong); background: #fff; padding: 6px; flex: none; }
.pay-box { display: flex; gap: var(--space-4); align-items: center; flex-wrap: wrap; }
.pay-box__text { font: var(--type-body-sm); line-height: 1.7; }
.ares-msg { font: var(--type-body-sm); color: var(--text-muted); }
/* nadpisy ve sloupcích .split (služby, kurzy) — odstup od obsahu pod nimi (kv.css nuluje okraje h1–h4) */
.split > div > h2, .split > div > h3 { margin-bottom: var(--space-4); }
.split > div > h3.split__aside-title { margin-top: var(--space-7); }
.split > div > p.muted { font: var(--type-body); margin: 0 0 var(--space-4); }
.profile-form { max-width: 680px; }

/* — Dlouhé texty (CMS stránky, VOP, články, popis kurzu): čitelná sazba 17/1,65, nadpisy střídmější než titulek stránky,
     styly pro seznamy, citace, obrázky a dělicí linku. Šířka sloupce ~68 znaků. — */
.longread { font: var(--weight-regular) var(--text-md)/1.65 var(--font-text); color: var(--text-body); max-width: 68ch; }
.longread > :first-child { margin-top: 0; }
.longread p { margin: 0 0 1em; }
.longread h2 { font: var(--weight-regular) clamp(26px, 1.1vw + 20px, 34px)/1.1 var(--font-display); letter-spacing: var(--tracking-display); color: var(--text-strong); margin: 2.2em 0 .6em; scroll-margin-top: calc(var(--header-total, 113px) + var(--space-5)); }
.longread h3 { font: var(--weight-regular) 22px/1.2 var(--font-display); letter-spacing: var(--tracking-display); color: var(--text-strong); margin: 1.8em 0 .5em; }
.longread h4 { font: var(--type-label); letter-spacing: .06em; text-transform: uppercase; color: var(--text-strong); margin: 1.6em 0 .5em; }
.longread :is(ul, ol) { margin: 0 0 1.1em; padding-left: 1.3em; }
.longread li + li { margin-top: 6px; }
.longread li::marker { color: var(--text-muted); font-variant-numeric: tabular-nums; }
.longread :is(ul, ol) :is(ul, ol) { margin: 6px 0 0; }
.longread strong { color: var(--text-strong); font-weight: var(--weight-semibold); }
/* odkazy v textu musí být vidět i bez najetí myší (dřív vlasová linka splývala s papírem) */
.longread a:not(.btn):not(.kv-btn) { color: var(--text-strong); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; text-decoration-color: var(--text-faint); transition: color var(--dur-fast) var(--ease-out), text-decoration-color var(--dur-fast) var(--ease-out); }
.longread a:not(.btn):not(.kv-btn):hover { color: var(--accent); text-decoration-color: currentColor; }
.longread blockquote { margin: 2em 0; padding: 0 0 0 var(--space-6); border-left: 1px solid var(--border-strong); font: italic 400 24px/1.3 var(--font-display); color: var(--text-strong); }
.longread blockquote p:last-child { margin-bottom: 0; }
.longread figure { margin: 2em 0; }
.longread img { display: block; max-width: 100%; height: auto; border: 1px solid var(--border-hairline); background: var(--img-well); }
.longread figcaption { font: var(--type-body-sm); color: var(--text-muted); margin-top: var(--space-2); }
.longread hr { border: 0; border-top: 1px solid var(--border-strong); margin: 3em 0; }
.longread pre { white-space: pre-wrap; font: var(--type-body-sm); background: var(--surface-well); padding: var(--space-5); border: 1px solid var(--border-hairline); margin: 0 0 1.2em; }
.longread .alert { margin: 1.6em 0; font: var(--type-body-sm); }
.longread .muted { color: var(--text-muted); }
.longread table { margin: 1.4em 0; }
/* právní texty: kapitola začíná linkou, nadpis je menší — každý odstavec práva nemá vypadat jako reklamní titulek */
.longread--legal h2 { font-size: clamp(22px, .6vw + 19px, 28px); margin-top: 2em; padding-top: 1em; border-top: 1px solid var(--border-hairline); }
.longread--legal h3 { font-size: 20px; }
/* obrázky ze studia (bílé pozadí) v tmavém režimu neoslňují */
:root[data-theme="dark"] :is(.longread img, .article__figure img, .article-feature__pic img, .article-row__pic img, .pagehead__media img) { filter: brightness(.88) contrast(1.02); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) :is(.longread img, .article__figure img, .article-feature__pic img, .article-row__pic img, .pagehead__media img) { filter: brightness(.88) contrast(1.02); } }

/* — Obsahová stránka (page.twig): obsah kapitol vlevo jako rejstřík (od 1100 px stálý sloupec, jinak sbalitelný), text vpravo — */
.pagehead__print { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 0; border: 0; background: none; font: inherit; letter-spacing: inherit; text-transform: inherit; color: var(--text-strong); cursor: pointer; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; text-decoration-color: var(--border-strong); transition: color var(--dur-fast) var(--ease-out); }
.pagehead__print:hover { color: var(--accent); text-decoration-color: currentColor; }
.docpage { padding: 0 0 var(--gap-section); }
.docpage--toc { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-6); align-items: start; }
.docpage__toc { min-width: 0; }
.doc-toc { border-top: 1px solid var(--border-strong); border-bottom: 1px solid var(--border-strong); }
.doc-toc__head { display: flex; align-items: center; gap: var(--space-4); min-height: 52px; cursor: pointer; list-style: none; }
.doc-toc__head::-webkit-details-marker { display: none; }
.doc-toc__head::after { content: "+"; flex: none; width: 1ch; text-align: center; font: var(--weight-regular) var(--text-lg)/1 var(--font-display); color: var(--text-muted); }
.doc-toc[open] .doc-toc__head::after { content: "–"; }
.doc-toc.is-static .doc-toc__head { cursor: default; }
.doc-toc.is-static .doc-toc__head::after { content: none; }
.doc-toc__count { margin-left: auto; font: italic 400 var(--text-md)/1 var(--font-display); color: var(--accent); }
.doc-toc__list { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--border-hairline); }
.doc-toc__list a { position: relative; display: grid; grid-template-columns: 2.4em minmax(0, 1fr); gap: var(--space-2); align-items: baseline; padding: 11px 0; border-bottom: 1px solid var(--border-hairline); font: var(--type-body-sm); color: var(--text-muted); text-decoration: none; transition: color var(--dur-fast) var(--ease-out), padding-left var(--dur-base) var(--ease-out); }
.doc-toc__list li:last-child a { border-bottom: 0; }
/* aktivní kapitola: linka vyjede zleva (stejný jazyk jako kicker), text ztmavne */
.doc-toc__list a::before { content: ""; position: absolute; left: 0; top: calc(11px + .72em); width: 16px; height: 1px; background: var(--accent); scale: 0 1; transform-origin: left center; transition: scale var(--dur-base) var(--ease-out); }
.doc-toc__list a:hover { color: var(--text-strong); text-decoration: none; }
.doc-toc__list a[aria-current] { color: var(--text-strong); padding-left: 24px; }
.doc-toc__list a[aria-current]::before { scale: 1 1; }
.doc-toc__num { font: var(--type-kicker); letter-spacing: .1em; color: var(--text-faint); font-variant-numeric: tabular-nums; }
.doc-toc__list a[aria-current] .doc-toc__num { color: var(--accent); }
@media (min-width: 1100px) {
    .docpage--toc { grid-template-columns: 300px minmax(0, 1fr); gap: var(--space-10); }
    .docpage__toc { position: sticky; top: calc(var(--header-total, 113px) + var(--space-6)); max-height: calc(100vh - var(--header-total, 113px) - var(--space-8)); overflow: auto; overscroll-behavior: contain; scrollbar-width: thin; }
    .doc-toc { border-bottom: 0; }
}
@media (max-width: 1099px) {
    .doc-toc__list { padding-bottom: var(--space-3); }
    /* sbalitelný obsah dosedne pod linku hlavičky jako lišta — ne dvě silné linky nad sebou s mezerou */
    .pagehead:has(+ .docpage--toc) { margin-bottom: 0; }
    .docpage--toc .doc-toc { border-top: 0; }
    .docpage--toc { gap: var(--space-7); }
}
.doc-related { border-top: 1px solid var(--border-strong); }
.doc-related .kv-cat, .doc-related .kv-cat:last-child { border-bottom: 1px solid var(--border-hairline); }
.doc-related .kv-cat__meta { font-style: normal; }
/* šipka v rejstříku odkazů (další informace, na co použít poukaz) — ikona ze sady místo znaku „→" */
.kv-cat__go { display: inline-flex; align-self: center; color: var(--text-faint); transition: color var(--dur-fast) var(--ease-out), translate var(--dur-base) var(--ease-out); }
.kv-cat:hover .kv-cat__go, .kv-cat:focus-visible .kv-cat__go { color: var(--accent); }
@media (prefers-reduced-motion: reduce) { .doc-toc__list a, .doc-toc__list a::before { transition: none; } }
/* tisk / PDF: jen titulek a text (bez obsahu, výzev a patičky) */
@media print {
    .docpage__toc, .docpage__related, .pagehead__print, .pagehead__cta, .kv-crumbs { display: none !important; }
    .docpage--toc { display: block; }
    .longread { max-width: none; font-size: 11pt; line-height: 1.5; }
    .longread h2 { break-after: avoid; }
    .longread a { text-decoration: none; }
    body:has(.docpage--legal) :is(.kv-footer, .kv-header) { display: none !important; }
    .pagehead { border: 0; margin-bottom: 12pt; }
}

/* — Newsletter: stránka výsledku (info/newsletter.twig) a hláška pod polem po odeslání bez přenačtení (newsletter.js) — */
.news-result { display: flex; flex-direction: column; gap: var(--space-7); padding: 0 0 var(--gap-section); max-width: 640px; }
.news-result__form { display: flex; flex-direction: column; gap: var(--space-3); }
.news-result__row { max-width: none; }
.news-result__row input { padding: 14px 16px; font: var(--weight-regular) var(--text-md)/1.3 var(--font-text); color: var(--text-body); }
.news-result__actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-4) var(--space-6); }
@media (max-width: 600px) { .news-result__actions { flex-direction: column; align-items: stretch; } .news-result__actions .btn { width: 100%; justify-content: center; } .news-result__actions .kv-btn--quiet { align-self: flex-start; } }
.news-status { margin: 10px 0 0; font: var(--type-body-sm); color: inherit; display: flex; align-items: baseline; gap: 8px; }
.news-status::before { content: ""; flex: none; width: 12px; height: 1px; background: currentColor; transform: translateY(-4px); }
.news-status.is-error { color: var(--state-bad); }
.news-status.is-shown { animation: kv-news-in var(--dur-base) var(--ease-out) both; }
@keyframes kv-news-in { from { opacity: 0; translate: 0 4px; } to { opacity: 1; translate: none; } }
.news-cta .news-status.is-error { color: inherit; font-weight: var(--weight-semibold); }
form.is-busy[action="/newsletter/prihlaseni"] button { cursor: progress; }
@media (prefers-reduced-motion: reduce) { .news-status.is-shown { animation: none; } }

/* — O nás (info/o-nas.twig): příběh z administrace s vizitkou firmy, služby pod jednou střechou, značky servisu, prodejna — */
.about-story { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-8); align-items: start; }
/* telefon a tablet: nejdřív příběh, vizitka až pod ním (nahoře by zdvojila linku hlavičky i její údaje) */
@media (max-width: 999px) { .about-card { order: 2; } }
@media (min-width: 1000px) {
    .about-story { grid-template-columns: 300px minmax(0, 1fr); gap: var(--space-10); }
    .about-card { position: sticky; top: calc(var(--header-total, 113px) + var(--space-6)); }
}
.about-card { border-top: 1px solid var(--border-strong); padding-top: var(--space-5); }
.about-card__name { margin: var(--space-3) 0 var(--space-4); font: var(--weight-regular) var(--text-2xl)/1.1 var(--font-display); letter-spacing: var(--tracking-display); color: var(--text-strong); }
.about-card__list { margin: 0; border-top: 1px solid var(--border-hairline); }
.about-card__list > div { display: grid; grid-template-columns: 9.5em minmax(0, 1fr); gap: var(--space-3); padding: 11px 0; border-bottom: 1px solid var(--border-hairline); font: var(--type-body-sm); }
.about-card__list dt { font: var(--type-kicker); letter-spacing: .08em; text-transform: uppercase; color: var(--text-muted); padding-top: 2px; }
.about-card__list dd { margin: 0; color: var(--text-strong); }
.about-card__list dd a { color: inherit; }
.about-card__today { display: flex; flex-direction: column; gap: 4px; margin-top: var(--space-4); }
.about-story__body { max-width: 68ch; }
/* údaj z dat pod textem karty (počet produktů, nejbližší kurz) — vyšší specifičnost než .rental-card__body p, bez !important */
.rental-card__body .about-grid__meta { margin-top: var(--space-2); font: var(--type-kicker); letter-spacing: .08em; text-transform: uppercase; color: var(--text-strong); }
.about-grid .rental-card__pic svg { color: var(--stone-400); }
/* značky servisu: jména serifem v řádku z linek (žádná loga) */
.about-brands { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-6); }
.about-brands__title { margin-top: var(--space-3); }
.about-brands__head .section__sub { margin-top: var(--space-4); max-width: 36ch; }
.about-brands__list { display: grid; grid-template-columns: repeat(var(--n-md, 3), minmax(0, 1fr)); gap: 1px; list-style: none; margin: 0; padding: 0; background: var(--border-hairline); border-top: 1px solid var(--border-strong); border-bottom: 1px solid var(--border-strong); }
.about-brands__list li { padding: var(--space-6) var(--space-4); background: var(--bg-page); font: var(--weight-regular) clamp(24px, 1.2vw + 18px, 34px)/1 var(--font-display); letter-spacing: var(--tracking-display); color: var(--text-strong); text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* lichý zbytek posledního řádku dosedne až k okraji (žádná prázdná šedá buňka) */
.about-brands__list li:last-child { grid-column: auto / -1; }
@media (min-width: 1200px) { .about-brands__list { grid-template-columns: repeat(var(--n, 6), minmax(0, 1fr)); } }
.about-brands__note { margin: var(--space-4) 0 0; font: var(--type-body-sm); color: var(--text-muted); }
.about-brands__note a { margin-left: 6px; color: var(--text-strong); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; text-decoration-color: var(--text-faint); }
.about-brands__note a:hover { color: var(--accent); text-decoration-color: currentColor; }
@media (min-width: 1000px) { .about-brands { grid-template-columns: 300px minmax(0, 1fr); gap: var(--space-10); align-items: center; } }
@media (max-width: 640px) { .about-brands__list { grid-template-columns: repeat(2, minmax(0, 1fr)); } .about-brands__list li { padding: var(--space-5) var(--space-3); font-size: 24px; } }
.about-shop__addr { margin: 0 0 var(--space-5); font: var(--weight-regular) var(--text-xl)/1.3 var(--font-display); color: var(--text-strong); }
/* právní stránky: „Nenašli jste odpověď?" pod rejstříkem dalších informací — telefon, e-mail, dnešní otevírací doba */
.doc-help { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--space-6) var(--space-9); align-items: center; margin-top: var(--space-9); padding: var(--space-7) 0; border-top: 1px solid var(--border-strong); border-bottom: 1px solid var(--border-strong); }
.doc-help__title { margin: 0 0 var(--space-3); font: var(--type-h2); }
.doc-help__text p { margin: 0; font: var(--type-body); color: var(--text-muted); max-width: 52ch; }
.doc-help__today { display: flex; flex-wrap: wrap; gap: 4px 12px; margin-top: var(--space-4); }
.doc-help__actions { display: flex; flex-direction: column; align-items: stretch; gap: var(--space-3); }
.doc-help__actions .kv-btn--quiet { align-self: flex-start; margin-top: var(--space-2); }
.doc-help__mail { text-transform: none; letter-spacing: .01em; }
@media (max-width: 860px) { .doc-help { grid-template-columns: minmax(0, 1fr); } .doc-help__actions .btn { width: 100%; justify-content: center; } }
@media print { .doc-help { display: none !important; } }
/* fotky v mřížce karet (pronájem, O nás) v tmavém režimu neoslňují */
:root[data-theme="dark"] .rental-card__pic img { filter: brightness(.88) contrast(1.02); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .rental-card__pic img { filter: brightness(.88) contrast(1.02); } }