/* E-shop CAMEX: doplněk ke stylu webu (assets/css/site.css). Barvy, písmo a mezery bere odtud. */

/* ---------- Lišta: košík a počet kusů ---------- */
.kosik-odkaz .pocet, .lista-mobil .pocet { display: inline-grid; place-items: center; min-width: 1.6em; height: 1.6em; padding: 0 .4em; margin-left: .3em; border-radius: 99px; background: var(--cervena-tm); color: var(--bila); font-size: .8em; font-weight: 600; font-variant-numeric: tabular-nums; }
.lista-prava a[aria-current="page"]:not(.btn) { text-decoration-color: var(--cervena); }

/* ---------- Úvod: periodická tabulka s odkazy ---------- */
.eshop-tabulka a.p { color: var(--bila); background: #3A4459; text-decoration: none; transition: background-color .3s var(--ease), transform .3s var(--ease); }
.eshop-tabulka a.p span { color: #D3D7DE; }
.eshop-tabulka a.p b { font-size: clamp(1.0625rem, 1.9vw, 2rem); font-weight: 500; letter-spacing: -0.03em; line-height: 1; }
.eshop-tabulka a.p:hover { background: var(--cervena-tm); transform: translateY(-2px); }
.eshop-tabulka a.p:hover span { color: var(--bila); }
.eshop-tabulka a.p.na-popt { background: #252C3A; box-shadow: inset 0 0 0 1.5px #4B5771; } /* taste-skill-ignore: obrys buňky „na poptávku“ odliší kovy bez produktů */
.eshop-tabulka a.p.na-popt:hover { background: #283040; box-shadow: inset 0 0 0 1.5px var(--bila); } /* taste-skill-ignore: obrys buňky „na poptávku“ */
.eshop-tabulka a.p.mimo { background: #1C222D; color: #A3AABB; }
.eshop-tabulka a.p.mimo span { color: #8E96A9; }
.eshop-tabulka a.p.mimo b { font-size: clamp(1rem, 1.6vw, 1.6rem); }
.eshop-tabulka a.p.mimo:hover { background: #283040; color: var(--bila); transform: none; }
.eshop-tabulka a.p:focus-visible { outline: 2px solid var(--bila); outline-offset: 2px; }
.eshop-legenda { list-style: none; padding: 0; flex-wrap: wrap; gap: 10px 28px; }
.eshop-legenda li { display: flex; align-items: center; gap: 10px; }
.eshop-legenda i.na-popt { background: #252C3A; box-shadow: inset 0 0 0 1.5px #4B5771; } /* taste-skill-ignore: obrys buňky „na poptávku“ */
html:not(.js) .eshop-legenda { display: flex; }

.jak-nakupovat { grid-template-columns: repeat(3, 1fr); }
.jak-nakupovat .stroj { aspect-ratio: auto; min-height: 168px; justify-content: space-between; }
.jak-nakupovat .stroj p { margin-top: 0; font-size: var(--step-lead); }
.jak-nakupovat .stroj p span { font-size: var(--step-body); margin-top: 8px; }
.jak-nakupovat .stroj.dalsi p span { color: var(--bila); }
.jak-nakupovat .btn { align-self: flex-start; }

/* Kov bez fotky: velká buňka periodické tabulky */
.prvek-dlazdice { position: relative; width: 100%; height: 100%; aspect-ratio: 4 / 5; display: flex; flex-direction: column; justify-content: space-between; padding: clamp(16px, 1.6vw, 24px); background: var(--grafit-2); color: var(--ink-inv); border-radius: var(--r-dlazdice); }
.prvek-dlazdice .dl-cislo { font-size: var(--step-lead); font-weight: 500; color: var(--ink-inv-2); }
.prvek-dlazdice b { font-size: clamp(4rem, 9vw, 8rem); font-weight: 500; letter-spacing: -0.04em; line-height: .9; }
.prvek-dlazdice .dl-jm { font-weight: 500; }

/* ---------- Katalog kovu ---------- */
.katalog-kovu { background: var(--bila); padding: clamp(40px, 4.5vw, 72px) 0 var(--mezera); }
.filtr { display: grid; grid-template-columns: minmax(0, 1.6fr) repeat(3, minmax(0, 1fr)) auto; gap: 12px; align-items: end; margin-top: 28px; }
.filtr .pf-pole > label { font-size: var(--step-small); font-weight: 500; }
.filtr select, .ks-zmena input, .do-kosiku input { font: inherit; color: var(--ink); background: var(--svetla-2); border: 0; border-radius: var(--r-pole); min-height: 46px; width: 100%; transition: background-color .3s var(--ease); }
.filtr select { appearance: none; cursor: pointer; padding: 0 44px 0 14px; }
.filtr select:hover, .ks-zmena input:hover, .do-kosiku input:hover { background: #DCDFE3; }
.filtr select:disabled { cursor: not-allowed; color: var(--ink-2); background: var(--svetla); }
.filtr select:focus-visible, .ks-zmena input:focus-visible, .do-kosiku input:focus-visible { outline: 3px solid var(--cervena-tm); outline-offset: 0; }
.filtr-akce { display: flex; align-items: center; gap: 20px; min-height: 46px; }
.filtr-akce .btn { min-height: 46px; }
.zrusit, .dale, .cena-skryta, .odebrat { font-weight: 500; text-decoration: underline 2px var(--cervena); text-underline-offset: 5px; transition: text-decoration-color .3s var(--ease), color .3s var(--ease); }
.zrusit:hover, .dale:hover, .odebrat:hover { color: var(--cervena-tm); }
.pocet-radek { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 8px 24px; margin-top: 28px; }
.pocet { font-size: var(--step-small); color: var(--ink-2); }
.prazdne { margin-top: 20px; font-size: var(--step-lead); }

/* Katalog: nízký úvod se značkou prvku a společná informace o cenách */
.h1-znacka { color: var(--ink-inv-2); font-weight: 400; white-space: nowrap; }
.hero-pod:has(.h1-znacka) .pod-telo { padding-top: clamp(32px, 3.5vw, 56px); padding-bottom: clamp(28px, 3vw, 48px); }
.hero-pod h1:has(.h1-znacka) { font-size: clamp(2.5rem, 1.6rem + 3vw, 4.75rem); }
.ucet-info { display: flex; justify-content: space-between; align-items: center; gap: 16px 32px; padding: 20px 24px; border-radius: var(--r-dlazdice); background: var(--svetla); }
.ucet-info p { max-width: 68ch; }
.ucet-info div { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 24px; flex: none; }
.cena-ceka { font-size: var(--step-small); color: var(--ink-2); }

/* Tabulka produktů */
.produkty { width: 100%; margin-top: 12px; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.produkty thead th { padding: 0 16px 12px 0; text-align: left; font-size: var(--step-small); font-weight: 600; color: var(--ink-2); }
.produkty thead small { font-weight: 400; }
.produkty td, .produkty tbody th { padding: 12px 16px 12px 0; text-align: left; vertical-align: middle; font-weight: 400; border-top: 1px solid var(--svetla-2); } /* taste-skill-ignore: čáry řádků jako v tabulce */
.produkty tbody th a { font-weight: 500; text-decoration: underline 2px transparent; text-underline-offset: 5px; transition: text-decoration-color .3s var(--ease); }
.produkty tbody th a:hover { text-decoration-color: var(--cervena); }
.produkty tbody th small, .produkty td small { color: var(--ink-2); font-size: var(--step-small); }
.produkty tbody th small { display: block; margin-top: 2px; }
.produkty .skupina th { padding: 36px 0 12px; border-top: 0; font-size: var(--step-sub); font-weight: 500; letter-spacing: -0.02em; }
.produkty .skupina th small { font-size: var(--step-small); font-weight: 500; letter-spacing: 0; color: var(--ink-2); margin-left: 8px; display: inline; }
.produkty tbody:first-of-type .skupina th { padding-top: 16px; }
.produkty .sl-cena { text-align: right; white-space: nowrap; }
.produkty .sl-kosik { width: 1%; padding-right: 0; text-align: right; }
.produkty tbody tr:not(.skupina) { transition: background-color .25s var(--ease); }
.produkty tbody tr:not(.skupina):hover { background: var(--svetla); }
.cena b { font-weight: 600; font-size: 1.0625rem; }
.cena small { color: var(--ink-2); font-size: var(--step-small); margin-left: 2px; }
.cena-skryta { font-size: var(--step-small); text-decoration-thickness: 1.5px; text-underline-offset: 4px; }
.cena-skryta:hover { color: var(--cervena-tm); }
.do-kosiku { display: flex; gap: 6px; justify-content: flex-end; }
.do-kosiku input, .ks-zmena input { width: 68px; padding: 0 8px; text-align: center; min-height: 42px; }
.do-kosiku .btn { padding: 10px 16px; white-space: nowrap; }

/* Kov na poptávku */
.na-poptavku { grid-template-columns: 1fr; max-width: none; }
.na-poptavku .vlevo { min-height: 260px; }
.na-poptavku .vlevo p { max-width: 52ch; font-size: var(--step-lead); }

/* O kovu */
.o-kovu { background: var(--svetla); padding: var(--mezera) 0; }
.o-kovu .obal { display: grid; grid-template-columns: repeat(12, 1fr); gap: 24px; }
.o-kovu h2 { grid-column: 1 / 5; font-size: var(--step-sub); }
.o-kovu .obal > div { grid-column: 6 / 12; display: grid; gap: 14px; max-width: 68ch; color: var(--ink-2); }

/* ---------- Detail produktu ---------- */
.hero-pod h1:has(.h1-cistota) { font-size: clamp(2.25rem, 1.3rem + 2.8vw, 3.75rem); }
.h1-cistota { display: block; margin-top: 12px; font-size: var(--step-sub); color: var(--ink-inv-2); letter-spacing: -0.01em; }
.detail-produktu { background: var(--bila); padding: clamp(40px, 4.5vw, 72px) 0 var(--mezera); }
.detail-produktu .obal { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 40px 56px; align-items: start; }
.dp-obrazek { margin: 0; overflow: hidden; border-radius: var(--r-dlazdice); background: var(--svetla); }
.dp-foto { aspect-ratio: 1; overflow: hidden; background: var(--svetla); }
.dp-foto img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 48%; }
.dp-obrazek figcaption { padding: 14px 20px 16px; font-size: var(--step-small); color: var(--ink-2); }
.dp-foto .prvek-dlazdice { aspect-ratio: 1; }
.dp-info { display: grid; gap: 28px; }
.dp-hlava { display: grid; gap: 6px; }
.dp-kicker { font-size: var(--step-small); font-weight: 600; letter-spacing: .12em; text-transform: uppercase; }
.dp-hlava h2 { font-size: clamp(1.75rem, 1.4rem + 1vw, 2.25rem); font-weight: 500; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }
.dp-kod { font-size: var(--step-small); color: var(--ink-2); }
.dp-udaje { margin: 0; }
.dp-udaje div { display: grid; grid-template-columns: 105px minmax(0, 1fr); gap: 16px; padding: 12px 0; border-bottom: 1px solid var(--svetla-2); } /* taste-skill-ignore: čáry řádků parametrů jako v tabulce */
.dp-udaje dt { font-size: var(--step-small); color: var(--ink-2); align-self: center; }
.dp-udaje dd { margin: 0; font-weight: 500; font-variant-numeric: tabular-nums; }
.dp-udaje a { text-underline-offset: 4px; }
.dp-text { max-width: 62ch; color: var(--ink-2); }
.dp-text p { margin: 0 0 .75em; }
.dp-nakup { display: grid; gap: 16px; justify-items: start; padding: clamp(20px, 2vw, 28px); border-radius: var(--r-dlazdice); background: var(--svetla); }
.dp-nakup h3 { font-size: var(--step-body); font-weight: 600; letter-spacing: 0; }
.dp-vysvetleni { max-width: 60ch; font-size: var(--step-small); color: var(--ink-2); }
.dp-ucet { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 24px; }
.dp-ucet .btn { min-height: 50px; }
.btn-cervene { background: var(--cervena-tm); color: var(--bila); }
.btn-cervene:hover { background: var(--grafit); }
.dp-cena { display: grid; gap: 4px; }
.dp-cena > span { font-size: var(--step-small); color: var(--ink-2); }
.dp-cena .cena b { font-size: var(--step-sub); font-weight: 500; letter-spacing: -0.02em; }
.dp-cena .cena small { color: var(--ink-2); }
.do-kosiku.velky input { min-height: 50px; width: 76px; }
.do-kosiku.velky .btn { min-height: 50px; padding: 12px 22px; }
/* Bez ceny je košík až druhá volba za přihlášením */
.bez-ceny .do-kosiku.velky .btn { background: var(--svetla-2); color: var(--ink); }
.bez-ceny .do-kosiku.velky .btn:hover { background: var(--grafit); color: var(--bila); }
.bez-ceny .do-kosiku.velky input { background: var(--bila); }
.jine h2 { font-size: var(--step-small); font-weight: 600; letter-spacing: 0; line-height: 1.5; margin-bottom: 10px; }
.jine ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.jine a { display: flex; gap: 14px; align-items: baseline; padding: 10px 14px; border-radius: var(--r-pole); background: var(--svetla); text-decoration: none; font-weight: 500; transition: background-color .3s var(--ease); }
.jine a:hover { background: var(--svetla-2); }
.jine small { color: var(--ink-2); font-weight: 400; }
.jine b { font-weight: 600; font-variant-numeric: tabular-nums; }
.dp-poptavka { display: grid; gap: 8px; justify-items: start; padding-top: 24px; border-top: 1px solid var(--svetla-2); } /* taste-skill-ignore: oddělovací čára jako v návrhu */
.dp-poptavka a { color: var(--ink); }
.dp-prenos { font-size: var(--step-small); color: var(--ink-2); }

/* ---------- Košík ---------- */
.kosik td, .kosik tbody th { padding-top: 16px; padding-bottom: 16px; }
.ks-zmena { display: flex; gap: 6px; align-items: center; }
.btn-obrys-tm { padding: 9px 14px; background: var(--svetla-2); color: var(--ink); font-size: var(--step-small); }
.btn-obrys-tm:hover { background: var(--grafit); color: var(--bila); }
.odebrat { font: inherit; font-size: var(--step-small); background: none; border: 0; padding: 8px 0; cursor: pointer; color: var(--ink-2); text-decoration-thickness: 1.5px; }
.souhrn { margin: 32px 0 0 auto; max-width: 440px; display: grid; gap: 14px; padding: clamp(20px, 2vw, 28px); border-radius: var(--r-dlazdice); background: var(--svetla); }
.souhrn-radek { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; font-weight: 500; }
.souhrn-radek .cena b { font-size: var(--step-sub); font-weight: 500; letter-spacing: -0.02em; }
.souhrn-pozn { font-size: var(--step-small); color: var(--ink-2); }
.souhrn .btn { justify-content: space-between; min-height: 50px; }
.souhrn .btn[disabled] { cursor: not-allowed; background: var(--svetla-2); color: var(--ink-2); }
.souhrn .dale { justify-self: start; font-size: var(--step-small); }
.kosik-prazdny { display: grid; gap: 24px; justify-items: start; }
.kosik-prazdny p:not(.souhrn-pozn) { font-size: var(--step-lead); }

/* ---------- Zpráva po přidání do košíku ---------- */
.zprava { position: sticky; top: 0; z-index: 20; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 24px; padding: 14px var(--okraj); background: var(--cervena-tm); color: var(--bila); font-weight: 500; }
.zprava a { color: var(--bila); text-underline-offset: 4px; white-space: nowrap; }
.js .zprava { animation: okno-in .4s var(--ease) both; }

/* ---------- Účet, registrace, objednávka ---------- */
.ucet [hidden] { display: none !important; }
/* Pole ve stylu formuláře webu (.kupon v site.css) */
.ucet-form { display: grid; gap: 28px; }
.ucet-form.uzky { max-width: 460px; }
.ucet-form input:not([type="checkbox"]):not([type="radio"]), .ucet-form select, .ucet-form textarea { font: inherit; color: var(--ink); background: var(--svetla-2); border: 0; border-radius: var(--r-pole); padding: 0 14px; min-height: 46px; width: 100%; transition: background-color .3s var(--ease); }
.ucet-form textarea { padding: 12px 14px; min-height: 104px; resize: vertical; }
.ucet-form select { appearance: none; cursor: pointer; padding-right: 44px; }
.ucet-form input:hover, .ucet-form select:hover, .ucet-form textarea:hover { background: #DCDFE3; }
.ucet-form input:focus-visible, .ucet-form select:focus-visible, .ucet-form textarea:focus-visible { outline: 3px solid var(--cervena-tm); outline-offset: 0; }
.ucet-form [aria-invalid="true"] { outline: 3px solid var(--cervena-tm); outline-offset: -3px; }
.ucet-form .souhlas { display: flex; gap: 12px; align-items: flex-start; font-size: var(--step-small); cursor: pointer; }
.ucet-form .souhlas input { flex: none; width: 20px; height: 20px; margin: 2px 0 0; accent-color: var(--cervena-tm); }
.ucet-form .souhlas input[aria-invalid="true"] { outline-offset: 1px; }
.ucet-form .souhlas a { text-underline-offset: 3px; }
.pf-skupina { margin: 0; padding: 0; border: 0; min-width: 0; }
.pf-skupina legend { padding: 0; margin-bottom: 14px; font-size: var(--step-sub); font-weight: 500; letter-spacing: -0.02em; }
.ucet-form .pf-stav { margin: 0; }
.pf-stav.pf-ok { background: var(--svetla); color: var(--ink); box-shadow: inset 3px 0 0 var(--cervena-tm); } /* taste-skill-ignore: proužek odliší potvrzení od chyby */
.pf-stav.pf-ok a { color: var(--ink); }
.ares { margin-top: 8px; width: fit-content; }
.ares-stav { display: block; margin-top: 6px; }
.ucet-akce { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 28px; margin: 0; }
.ucet-akce .btn { min-height: 50px; }
.ucet-hotovo { display: grid; gap: 16px; max-width: 60ch; justify-items: start; }
.ucet-hotovo h2 { font-size: var(--step-sub); }
.ucet-dva { display: grid; grid-template-columns: minmax(0, 460px) minmax(0, 380px); gap: 40px clamp(40px, 8vw, 120px); align-items: start; }
.ucet-bok { display: grid; gap: 16px; justify-items: start; padding: clamp(20px, 2vw, 28px); border-radius: var(--r-dlazdice); background: var(--svetla); }
.ucet-bok h2 { font-size: var(--step-sub); }
.ucet-sekce { display: grid; gap: clamp(40px, 5vw, 64px); }
.ucet-blok { display: grid; gap: 16px; scroll-margin-top: 24px; }
.ucet-blok > h2 { font-size: var(--step-head); }
.ucet-stav { font-size: var(--step-small); color: var(--ink-2); }
.ucet-stav b, .ucet-stav strong { color: var(--ink); }
.ucet-blok { justify-items: start; }
.ucet-blok > .ucet-form, .ucet-blok > table, .ucet-blok > .pf-stav { justify-self: stretch; }

/* Objednávka */
.obj-kroky { list-style: none; display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 32px; padding: 0; font-size: var(--step-small); font-weight: 500; }
.obj-kroky li { padding: 8px 14px; border-radius: var(--r-pole); background: var(--svetla); color: var(--ink-2); }
.obj-kroky li[aria-current] { background: var(--grafit); color: var(--bila); }
.obj-kroky a { color: inherit; text-underline-offset: 4px; }
.obj-form { grid-template-columns: minmax(0, 1fr) minmax(0, 400px); gap: 40px clamp(32px, 5vw, 72px); align-items: start; }
.obj-form > .pf-stav { grid-column: 1 / -1; }
.obj-volby { display: grid; gap: 36px; }
.obj-bok { position: sticky; top: 24px; display: grid; gap: 14px; }
.obj-bok .souhrn, .obj-spodek .souhrn { margin: 0; max-width: none; }
.volby { display: grid; gap: 8px; }
.volba { display: flex; gap: 14px; align-items: flex-start; padding: 16px 18px; border-radius: var(--r-pole); background: var(--svetla); cursor: pointer; transition: background-color .3s var(--ease), box-shadow .3s var(--ease); }
.volba:hover { background: var(--svetla-2); }
.volba:has(input:checked) { background: var(--bila); box-shadow: inset 0 0 0 2px var(--grafit); } /* taste-skill-ignore: obrys zvolené možnosti */
.volba input { flex: none; width: 20px; height: 20px; margin: 2px 0 0; accent-color: var(--cervena-tm); }
.volba b { display: block; font-weight: 500; }
.volba small { display: block; margin-top: 2px; color: var(--ink-2); font-size: var(--step-small); }
.souhrn-radek.celkem { padding-top: 14px; border-top: 1px solid var(--svetla-2); } /* taste-skill-ignore: čára nad součtem */
.souhrn-radek small { color: var(--ink-2); font-size: var(--step-small); font-weight: 400; }
.obj-spodek { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 420px); gap: 32px clamp(32px, 5vw, 72px); align-items: start; margin-top: 32px; }
.obj-udaje { grid-template-columns: 1fr 1fr; }
.obj-udaje dd { font-weight: 400; line-height: 1.55; }
.obj-udaje .dale { font-size: var(--step-small); }
.kosik thead .dale { margin-left: 10px; font-weight: 500; }

/* Obchodní podmínky */
.podminky { display: grid; gap: 12px; max-width: 78ch; }
.podminky section { display: grid; gap: 12px; margin-top: 28px; }
.podminky h2 { font-size: var(--step-sub); }
.podminky h2 span { color: var(--ink-2); margin-right: 6px; }
.podminky p:not(.pf-stav) { color: var(--ink-2); }
.podminky .bez-odrazky { margin: 0; color: var(--ink); }

/* ---------- Tablet a telefon ---------- */
@media (max-width: 1100px) {
  .filtr { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .filtr-hledat { grid-column: 1 / -1; }
  .obj-form, .obj-spodek { grid-template-columns: 1fr; }
  .obj-bok { position: static; }
}
@media (max-width: 900px) {
  .ucet-dva, .obj-udaje { grid-template-columns: 1fr; }
  .eshop-tabulka a.p { grid-row: auto !important; grid-column: auto !important; padding: 6px 7px; }
  .eshop-tabulka a.p.mimo { display: none; }
  .eshop-tabulka a.p span { font-size: 11px; }
  .eshop-tabulka a.p b { font-size: 1.125rem; }
  .jak-nakupovat { grid-template-columns: 1fr; }
  .jak-nakupovat .stroj { min-height: 0; gap: 18px; }
  .jak-nakupovat .stroj p { text-align: left; }
  .filtr { gap: 10px; }
  .ucet-info { flex-direction: column; align-items: flex-start; }
  .o-kovu .obal { grid-template-columns: 1fr; }
  .o-kovu h2, .o-kovu .obal > div { grid-column: 1; }
  .detail-produktu .obal { gap: 32px; }
  /* Tabulka produktů jako karty */
  .produkty thead { display: none; }
  .produkty, .produkty tbody { display: block; }
  .produkty tbody tr:not(.skupina) { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px 16px; padding: 16px 0; border-top: 1px solid var(--svetla-2); } /* taste-skill-ignore: čáry řádků jako v tabulce */
  .produkty tbody tr:not(.skupina):hover { background: none; }
  .produkty tr:not(.skupina) > * { display: block; padding: 0; border: 0; }
  .produkty tr:not(.skupina) > th { grid-column: 1 / -1; }
  .produkty td[data-popis]::before { content: attr(data-popis) ": "; color: var(--ink-2); font-size: var(--step-small); }
  .produkty .sl-cena { text-align: left; white-space: normal; } /* „Přihlaste se pro zobrazení ceny“ se zalomí, řádek nepřeteče */
  .produkty td.sl-cena::before { display: none; }
  .produkty .sl-cena { grid-column: 1; align-self: center; }
  .produkty .sl-kosik { grid-column: 2; grid-row: span 2; align-self: end; width: auto; }
  .produkty .skupina, .produkty .skupina th { display: block; }
  .produkty .skupina th { padding: 28px 0 8px; }
  .kosik tbody tr:not(.skupina) { grid-template-columns: 1fr 1fr; }
  .kosik td.sl-cena::before { display: inline; }
  .kosik .sl-kosik { grid-row: auto; grid-column: 1 / -1; text-align: left; }
  .souhrn { max-width: none; }
}
@media (max-width: 560px) {
  .do-kosiku .btn { padding: 10px 12px; }
  .filtr > .pf-pole:has(#f-rozmer), .filtr-akce { grid-column: 1 / -1; }
  .filtr-akce .btn { flex: 1; justify-content: center; }
  .ucet-form .pf { grid-template-columns: 1fr; }
}

@media (max-width: 767px) {
  .detail-produktu .obal { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  .dp-foto { aspect-ratio: auto; height: 240px; }
  .dp-foto .prvek-dlazdice { aspect-ratio: auto; height: 100%; }
  .dp-nakup { justify-items: stretch; }
  .do-kosiku.velky .btn { flex: 1; justify-content: center; }
}

/* Hledání v katalogu kovu a kotva filtru (audit E) */
.filtr { scroll-margin-top: 16px; }
.filtr-hledat input { width: 100%; font: inherit; color: var(--ink); background: var(--svetla-2); border: 0; border-radius: var(--r-pole); min-height: 46px; padding: 0 14px; transition: background-color .3s var(--ease); }
.filtr-hledat input:hover { background: #DCDFE3; }
.filtr-hledat input:focus-visible { outline: 3px solid var(--cervena-tm); outline-offset: 0; }

/* Jak získat ceny (přihlášení, registrace) */
.kroky-ceny { display: grid; gap: 10px; max-width: 60ch; }
.kroky-ceny h2 { font-size: var(--step-body); font-weight: 600; }
.kroky-ceny ol { margin: 0; padding-left: 1.4em; display: grid; gap: 6px; font-size: var(--step-small); }
.kroky-ceny li::marker { color: var(--cervena-tm); font-weight: 600; }
.ucet > .obal > .kroky-ceny { margin-bottom: clamp(24px, 3vw, 40px); padding: clamp(16px, 2vw, 24px); border-radius: var(--r-dlazdice); background: var(--svetla); }