/* MONOFORM — „space, proportion, light“. Tokeny a pravidla: ART_DIRECTION.md. Jeden motiv: kótovací linka .dim */
:root{--chalk:#f3f1ec;--chalk-2:#e9e6df;--concrete:#b9b4ab;--graphite:#1e1e1d;--graphite-2:#4a4846;--line-ui:#86817a;--brick:#a3452a;--brick-ink:#7f3420;
--sans:"Manrope",system-ui,-apple-system,"Segoe UI",sans-serif;--mono:"DM Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
--gut:24px;--pad:clamp(20px,4vw,64px);--max:1440px;--hdr:72px;--t:300ms}
*,*::before,*::after{box-sizing:border-box}
html{background:var(--chalk);color:var(--graphite);font:400 16px/1.5 var(--sans);-webkit-text-size-adjust:100%;overflow-wrap:break-word}
@media(min-width:768px){html{font-size:17px;line-height:1.55}}
body{margin:0;min-height:100vh;background:var(--chalk)}
[hidden]{display:none!important}
img,picture,svg{display:block;max-width:100%}
img{height:auto}
figure{margin:0}
a{color:inherit}
p,h1,h2,h3,ul,ol,dl{margin:0}
:focus-visible{outline:2px solid var(--brick);outline-offset:3px}
.defs{position:absolute;width:0;height:0;overflow:hidden}
.skip{position:absolute;left:var(--pad);top:-80px;z-index:20;padding:10px 14px;background:var(--graphite);color:var(--chalk);text-decoration:none}
.skip:focus{top:8px}
.wrap{width:100%;max-width:var(--max);margin-inline:auto;padding-inline:var(--pad)}
.mono{font-family:var(--mono);font-size:12px;line-height:1.5;letter-spacing:.08em;text-transform:uppercase;font-weight:400;font-variant-numeric:tabular-nums;color:var(--graphite-2)}
.h1{font-weight:200;font-size:clamp(40px,6vw,88px);line-height:.98;letter-spacing:-.02em;text-wrap:balance}
.h2{font-weight:200;font-size:clamp(32px,4.2vw,60px);line-height:1;letter-spacing:-.02em;text-wrap:balance}
.h3{font-weight:500;font-size:clamp(20px,2vw,26px);line-height:1.2;letter-spacing:-.01em;margin-bottom:.6em;text-wrap:balance} /* česká slova jsou delší: vyvážené řádky, žádné osamělé slovo */
p,li,dd,figcaption{text-wrap:pretty} /* běžný text: poslední řádek odstavce nekončí jedním slovem */
.lede{font-size:clamp(17px,1.4vw,21px);line-height:1.5;max-width:40em;color:var(--graphite-2)}
.note{font-size:15px;color:var(--graphite-2);max-width:60em;margin-top:32px;padding-top:16px;border-top:1px solid var(--concrete)}

/* kótovací linka — jeden motiv webu */
.dim{display:flex;align-items:center;gap:10px;margin:0;font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--graphite-2)}
.dim__l{flex:1;height:1px;background:var(--concrete);position:relative}
.dim__l::before,.dim__l::after{content:"";position:absolute;top:-4px;width:1px;height:9px;background:var(--concrete)}
.dim__l::before{left:0}.dim__l::after{right:0}
.dim--brick .dim__l,.dim--brick .dim__l::before,.dim--brick .dim__l::after{background:var(--brick)}
.dim--brick{color:var(--brick-ink)}

/* hlavička */
.hdr{border-bottom:1px solid var(--concrete);background:var(--chalk)}
.hdr__in{display:grid;grid-template-columns:1fr auto;align-items:center;gap:4px 16px;min-height:var(--hdr);padding-block:10px}
.brand{grid-column:1;grid-row:1}.nav{grid-row:2}
.brand{display:inline-flex;align-items:center;gap:12px;min-height:44px;text-decoration:none;color:var(--graphite)}
.brand__mono{width:26px;height:26px;color:var(--brick)}
.brand__word{font-weight:500;font-size:14px;letter-spacing:.32em;text-transform:uppercase}
.nav{grid-column:1/-1}
.nav ul,.ftr__nav ul{list-style:none;padding:0;display:flex;gap:4px}
.nav ul{margin-left:-12px}
.nav a{position:relative;display:inline-flex;align-items:center;min-height:44px;padding:0 12px;text-decoration:none;font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--graphite)}
.nav a::after{content:"";position:absolute;left:12px;right:12px;bottom:8px;height:1px;background:transparent;transition:background var(--t)}
.nav a:hover::after{background:var(--concrete)}
.nav a[aria-current]::after{background:var(--brick)}
@media(min-width:700px){.hdr__in{grid-template-columns:1fr auto 1fr}.brand{justify-self:start}.nav{grid-column:2;grid-row:1;justify-self:center}.nav ul{margin:0}}

/* tlačítka a odkazy */
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 24px;border:1px solid var(--graphite);border-radius:2px;background:none;color:var(--graphite);font:500 15px/1 var(--sans);letter-spacing:.01em;text-decoration:none;cursor:pointer;transition:background var(--t),color var(--t),border-color var(--t)}
.btn--brick{background:var(--brick);border-color:var(--brick);color:#fff}
.btn--brick:hover{background:var(--brick-ink);border-color:var(--brick-ink)}
.btn--ghost:hover{background:var(--graphite);color:var(--chalk)}
.btn[disabled]{opacity:.45;cursor:not-allowed}
.btn--brick:focus-visible{outline-color:var(--graphite)}
.link{color:var(--graphite);text-decoration-thickness:1px;text-underline-offset:4px}
.link--arrow::after{content:" →"}
.link--light{color:var(--chalk)}

/* hero — dvojlist; mobil = vlastní pořadí: kóta → titulek → legenda → CTA → obraz (4:5) → text */
.hero{display:grid;grid-template-columns:100%;gap:18px;padding:24px var(--pad) 40px}
.hero__panel{display:contents}
.hero>.hero__panel>.dim{order:1}
.hero__h{order:2;font-weight:200;font-size:clamp(44px,13vw,64px);line-height:.95;letter-spacing:-.02em}
.hero__legend{order:3;white-space:nowrap} /* legenda se neláme uvnitř skupin: „·“ nikdy nezačíná ani nekončí řádek */
.hero__cta{order:4;display:flex;gap:12px;flex-wrap:wrap}
.hero__cta .btn{flex:1 1 200px}
.hero__plate{order:6;margin-inline:calc(-1 * var(--pad));background:var(--chalk-2)}
.hero__lede{order:7;font-size:clamp(17px,1.3vw,20px);color:var(--graphite-2);max-width:30em}
.lg-br{display:none}
@media(max-width:767px){.lg-sep{display:none}.lg-br{display:inline}} /* mobil: legenda na dvou řádcích – žádný visící oddělovač */
@container (max-width:420px){.lg-sep{display:none}.lg-br{display:inline}} /* úzký panel hera (≥ 1000 px): legenda na jednom řádku měří 406 px → pod 420 px dvě skupiny pod sebou jako na mobilu */
.hero__pic{display:block;aspect-ratio:4/5;max-height:min(70vh,940px)} /* strop 940: zdroj hero-m má 941 px na výšku → žádné zvětšení ani na 912–999 px */
.hero__pic img{width:100%;height:100%;object-fit:cover}
@media(min-width:1000px){
.hero{grid-template-columns:min(58%,1255px) minmax(0,1fr);gap:0;padding:0 var(--pad);max-width:var(--max);margin-inline:auto;min-height:min(calc(100vh - var(--hdr)),900px)} /* hero v témže kontejneru jako hlavička (1440); deska nikdy širší než zdroj hera (1255 px) ani vyšší než 900 px → při DPR 1 bez zvětšení v každém okně */
.hero__panel{display:flex;flex-direction:column;gap:20px;justify-content:space-between;padding:40px 0 48px clamp(32px,3vw,56px);border-left:1px solid var(--concrete);container-type:inline-size} /* vpravo 0: text panelu končí na pravém okraji rastru hlavičky, vlevo mezera od fotky */
.hero__plate{order:0;margin:0;min-height:560px}
.hero__pic{height:100%;aspect-ratio:auto;max-height:none}
.hero__h{font-size:clamp(64px,7.2vw,112px);font-size:clamp(48px,calc(100cqi / 5.25),112px);margin-block:auto;overflow-wrap:normal;hyphens:none} /* nejdelší slovo „Domyšlený“ = 4,7 em (anglické „considered.“ mělo 5,0 em, rezerva zůstává) → velikost z obsahové šířky panelu (cqi), nikdy zlom uvnitř slova; starší prohlížeče bez cqi drží vw variantu */
.hero__cta .btn{flex:0 1 auto}
.hero__cta{margin-top:8px}
}

/* sekce */
.sec{padding-block:clamp(56px,8vw,120px)}
.sec--first{padding-top:clamp(32px,5vw,72px)}
.sec__head{display:grid;gap:20px;margin-bottom:clamp(32px,4vw,56px)}
.sec__head .dim{margin-top:8px}
.sec__more{margin-top:48px}
.sec__more a{display:inline-flex;align-items:center;min-height:44px} /* samostatný odkaz = dotykový cíl ≥ 44 px */
@media(min-width:1000px){.sec__head{grid-template-columns:7fr 5fr;column-gap:var(--gut);align-items:end}.sec__head .dim,.sec__head .mono{grid-column:1/-1}.sec__head .mono{order:-1}}

/* obrazový index projektů — různá měřítka */
.pindex{list-style:none;padding:0;display:grid;gap:48px var(--gut)}
.pi__link{display:block;text-decoration:none;color:inherit}
.pi__plate{display:block;background:var(--chalk-2);overflow:hidden}
.pi__plate img{width:100%}
.pi__plate--dg{display:grid;gap:12px;align-content:start;padding:clamp(16px,3vw,40px)}
.pi__plate--dg .dg{width:100%}
.pi__dglabel{font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--graphite-2)}
.pi__meta{display:grid;gap:4px;margin-top:14px;padding-top:14px;border-top:1px solid var(--concrete)}
.pi__name{font-weight:300;font-size:clamp(24px,2.4vw,34px);line-height:1.1;letter-spacing:-.01em;transition:color var(--t)}
.pi__typ{font-size:15px;color:var(--graphite-2)}
.pi__link:hover .pi__name{color:var(--brick-ink)}
.pindex__empty{padding:40px 0}
@media(min-width:1000px){
.pindex{grid-template-columns:repeat(12,1fr);gap:72px var(--gut)}
.pi--7{grid-column:span 7}.pi--5{grid-column:span 5;align-self:end}
.pi:nth-child(2){margin-top:clamp(40px,8vw,120px)}
.pindex[data-filtered] .pi{grid-column:span 6;margin-top:0;align-self:start}
.pindex[data-filtered][data-visible="1"] .pi{grid-column:1/7} /* jediná karta drží levou osu nadpisu a filtrů a šířku dvojice (span 6) */
}

/* filtry */
.filters ul{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:4px 24px;margin-bottom:8px}
.filters a{position:relative;display:inline-flex;align-items:center;min-height:44px;min-width:44px;padding:0 8px;margin-inline:-8px;text-decoration:none;font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--graphite-2);transition:color var(--t)}
.filters a:hover{color:var(--graphite)}
.filters a[aria-current]{color:var(--graphite)}
.filters a::after,.filters a::before{content:"";position:absolute;left:8px;right:8px;bottom:6px;height:1px;background:transparent}
.filters a[aria-current]::after{background:var(--brick)}
.filters a[aria-current]::before{left:8px;right:auto;width:1px;height:7px;bottom:3px;background:var(--brick)}
.filters__count{margin-bottom:40px;min-height:18px}
@media (max-width:419.98px){.filters ul{column-gap:16px}} /* „Komerční prostory“ jsou delší než „Commercial“: filtr zůstane v jedné řadě všude, kde v originálu (od 380 px) */

/* přístup · služby */
.appr__grid{display:grid;gap:32px;margin-top:40px}
.appr__item h3{font-weight:500;font-size:20px;margin-bottom:10px}
.appr__item p{color:var(--graphite-2)}
@media(min-width:768px){.appr__grid{grid-template-columns:repeat(3,1fr);gap:var(--gut)}.appr__item{padding-right:24px;border-right:1px solid var(--concrete)}.appr__item:last-child{border-right:0;padding-right:0}}
.svcs__list{list-style:none;padding:0;border-top:1px solid var(--concrete)}
.svc{display:grid;gap:8px;padding:28px 0;border-bottom:1px solid var(--concrete)}
.svc h3{font-weight:300;font-size:clamp(24px,2.4vw,34px);letter-spacing:-.01em;line-height:1.1}
.svc p{color:var(--graphite-2);max-width:38em}
@media(min-width:768px){.svc{grid-template-columns:80px 4fr 7fr;gap:var(--gut);align-items:baseline}}

/* proces — jediná tmavá sekce */
.procs{background:var(--graphite);color:var(--chalk)}
.procs .h2{color:var(--chalk)}
.procs .lede,.procs .mono,.procs p{color:var(--concrete)}
.procs :focus-visible{outline-color:var(--chalk)}
.procs__list{list-style:none;padding:0;display:grid;gap:32px}
.proc__item{display:grid;gap:10px;align-content:start;padding-top:20px;border-top:1px solid var(--graphite-2)}
.proc__item h3{font-weight:300;font-size:clamp(26px,2.6vw,38px);letter-spacing:-.01em;line-height:1.05;color:var(--chalk)}
.proc__out{margin-top:8px}
@media(min-width:768px){.procs__list{grid-template-columns:repeat(3,1fr);gap:var(--gut)}}

/* cta */
.cta{border-top:1px solid var(--concrete)}
.cta__in{display:grid;gap:20px;justify-items:start}

/* detail projektu — hlavička (meta · H1 · štítek Concept) je na desktopu NAD deskou, aby byla v první obrazovce */
.pd__top{display:grid;gap:24px;padding-top:clamp(20px,3vw,48px)}
.pd__plate{background:var(--chalk-2)}
.pd__hero img{width:100%}
.pd__hero--dg{display:grid;place-items:center;aspect-ratio:3/2;padding:clamp(20px,4vw,56px)}
.pi__plate--dg,.pd__hero--dg,.dgfig{container-type:inline-size} /* popisky diagramu se řídí šířkou svého rámu (viz .dg text) */
.pd__head{display:grid;order:-1;gap:12px;justify-items:start;padding-bottom:8px} /* hlavička nad deskou na všech šířkách */
.pd__head .dim{justify-self:stretch;margin-bottom:8px}
.pd__typ{font-size:18px;color:var(--graphite-2)}
.tag{display:inline-flex;align-items:center;gap:10px;margin-top:8px;padding:8px 12px;border:1px solid var(--brick);border-radius:2px;font-size:14px;color:var(--brick-ink)}
.tag .mono{color:var(--brick)}
.pd__body{display:grid;gap:40px;padding-block:clamp(40px,5vw,80px)}
.pd__sec{margin-bottom:32px;max-width:38em}
.pd__sec p{line-height:1.6}
.mats{list-style:none;padding:0;border-top:1px solid var(--concrete)}
.mats li{padding:10px 0;border-bottom:1px solid var(--concrete)}
.pd__sticky{position:sticky;top:24px;border-top:1px solid var(--graphite);padding-top:14px}
.ddata{margin-top:16px}
.ddata div{display:grid;grid-template-columns:100px 1fr;gap:12px;padding:10px 0;border-bottom:1px solid var(--concrete)}
.ddata dt{font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--graphite-2);padding-top:3px}
.ddata dd{font-variant-numeric:tabular-nums}
.pd__dnote{margin-top:12px}
.pd__nophoto{max-width:38em;padding:16px 20px;background:var(--chalk-2);border-left:2px solid var(--brick);font-size:15px;color:var(--graphite-2)}
.gal{display:grid;gap:40px var(--gut);margin-bottom:clamp(40px,5vw,80px)}
.gal__item img{width:100%;display:block}
.dgfig{max-width:900px;padding-top:32px;border-top:1px solid var(--concrete)}
.dgfig figcaption{margin-top:12px}
.dg{width:100%;height:auto}
.dg text{font-family:var(--mono);font-size:11px;/* svg ≥ 680 px: 11,7–15 px */letter-spacing:.06em;text-transform:uppercase;fill:var(--graphite-2)}
/* popisky diagramu: viewBox 640, písmo v jednotkách viewBoxu → fyzicky = font × (šířka svg / 640); stupně podle šířky RÁMU (container query), všude ≥ 11 px při DPR 1 */
.dg .dg-s,.dg .dg-k,.dg .dg-m,.dg .dg-w,.dg .dg-n{fill:#64605a} /* vedlejší popisky světlejší než hlavní, 5:1 na desce chalk-2; dg-s jen široký rám · dg-k vždy · dg-m jen úzký rám (kratší varianta) */
.dg .dg-m{display:none}
.dg .dg-n{display:none} /* dg-w = jen široký rám (≥ 680 px), dg-n = jen užší rám (otočená varianta popisku) */
@container (max-width:679.98px){.dg text{font-size:13px}.dg .dg-w{display:none}.dg .dg-n{display:block}} /* svg 560–680: 11,4–13,8 px */
@container (max-width:559.98px){.dg text{font-size:15px}.dg .dg-s{display:none}.dg .dg-m{display:block}} /* svg 480–560: 11,25–13,1 px; dlouhé popisky se už nevejdou → krátké varianty */
@container (max-width:479.98px){.dg text{font-size:18px}} /* svg 400–480: 11,25–13,5 px (karta span 5 na 1440 = 458) */
@container (max-width:399.98px){.dg text{font-size:23px}} /* svg 320–400: 11,5–14,4 px (mobil 361–430) */
@container (max-width:319.98px){.dg text{font-size:27px}} /* svg 268–320: 11,3–13,5 px (okno 320) */
@media(max-width:767px){.pi__plate--dg,.pd__hero--dg{padding:12px 6px}} /* na mobilu úzký rám desky, aby popisky diagramu zůstaly ≥ 11 px (okraj má diagram sám ve viewBoxu) */
.dg .dg-b{fill:var(--brick-ink)}
.dg .dg-wall{fill:none;stroke:var(--graphite);stroke-width:2}
.dg .dg-fill{fill:var(--chalk-2);stroke:var(--graphite);stroke-width:1}
.dg .dg-thin{stroke:var(--concrete);stroke-width:1}
.dg .dg-dash{fill:none;stroke:var(--concrete);stroke-width:1;stroke-dasharray:4 4}
.dg .dg-glass{stroke:var(--brick);stroke-width:1.5}
.dg .dg-gap{stroke:var(--chalk-2);stroke-width:4} /* dveřní otvor = přerušení stěny barvou desky */
.dg .dg-dim line{stroke:var(--brick);stroke-width:1}
.dg .dg-dim text{fill:var(--brick-ink);text-transform:none} /* „~12 m“, ne „~12 M“ */
.pd__foot{display:grid;gap:24px;align-items:center;padding-block:clamp(40px,5vw,72px);border-top:1px solid var(--concrete)}
.pd__next{display:grid;gap:6px;text-decoration:none;color:inherit}
.pd__next strong{font-weight:300;font-size:clamp(28px,3vw,44px);line-height:1.05;letter-spacing:-.01em;transition:color var(--t)}
.pd__next:hover strong{color:var(--brick-ink)}
@media(min-width:1000px){
.pd__top{grid-template-columns:repeat(12,1fr);gap:24px var(--gut)}
.pd__head{grid-column:1/-1;grid-row:1;grid-template-columns:auto 1fr;align-items:end;column-gap:var(--gut)}
.pd__head .dim,.pd__head .pd__meta{grid-column:1/-1}.pd__head .h1{grid-column:1}.pd__head .pd__typ{grid-column:1}.pd__head .tag{grid-column:2;grid-row:3/5;justify-self:end;align-self:end}
.pd__plate{grid-column:1/9;grid-row:2}
.pd__body{grid-template-columns:7fr 4fr;column-gap:calc(var(--gut) + 8.33%)}
.gal{grid-template-columns:repeat(12,1fr)}.gal__item--7{grid-column:span 7;align-self:end}.gal__item--5{grid-column:span 5;align-self:end} /* dvojice v galerii: obě spodní hrany na jedné lince (oči eyes-15: rozdíl 17–26 px) */
}
@media(min-width:768px){.pd__foot{grid-template-columns:1fr auto}}
@media(min-width:768px) and (max-width:999px){.gal{grid-template-columns:1fr 1fr}.gal__item--5{align-self:end}} /* tablet: dva sloupce, aby se žádný záběr galerie nezvětšoval nad své pixely */

/* proces — stránka */
.stages{list-style:none;padding:0;border-top:1px solid var(--concrete)}
.stage{display:grid;gap:10px;padding:32px 0;border-bottom:1px solid var(--concrete)}
.stage h2{font-weight:300;font-size:clamp(28px,3vw,44px);letter-spacing:-.01em;line-height:1.05}
.stage p{max-width:38em;color:var(--graphite-2)}
@media(min-width:768px){.stage{grid-template-columns:80px 1fr;column-gap:var(--gut)}.stage>.mono:first-child{grid-row:1/4}}
.procp__notes{display:grid;gap:12px;max-width:40em;margin-block:48px 40px}
.procp__notes p{color:var(--graphite-2)}

/* poptávka */
.enq__wrap{max-width:calc(640px + 2 * var(--pad))}
.enq .sec__head{grid-template-columns:1fr}
.enq .h1{font-size:clamp(36px,5vw,56px)}
.prog{display:grid;margin:32px 0 28px}
.prog__bar{display:block;height:2px;background:var(--concrete);position:relative}
.prog__bar::before{content:"";position:absolute;left:0;top:0;height:2px;width:var(--p,0%);background:var(--brick);transition:width var(--t)}
.prog__bar::after{content:"";position:absolute;left:var(--p,0%);top:-4px;width:1px;height:9px;background:var(--brick)}
.enq__nojs{padding:12px 16px;background:var(--chalk-2);font-size:14px;margin-bottom:24px}
html.js .enq__nojs{display:none}
html:not(.js) .prog,html:not(.js) [data-next],html:not(.js) [data-back],html:not(.js) .enq__store{display:none} /* bez JS: žádná mrtvá tlačítka kroků, postup ani věta o uložených odpovědích */
.enq__form{display:grid;gap:48px}
.step{display:grid;gap:20px;min-width:0;margin:0;padding:0;border:0}
html.js .step:not(.is-active){display:none}
.step__legend{display:flex;flex-wrap:wrap;gap:4px 14px;align-items:baseline;padding:0;margin-bottom:8px}
.step__title{font-weight:300;font-size:clamp(26px,3vw,36px);letter-spacing:-.01em;line-height:1.1}
.step__q{font-size:18px;color:var(--graphite-2)}
.fld{display:grid;gap:8px;min-width:0;margin:0;padding:0;border:0}
.fld>label,.fld>legend{font-weight:500;font-size:15px;padding:0}
.fld>legend{margin-bottom:8px}
.opts{display:grid;gap:8px}
.opt{display:flex;align-items:center;gap:12px;min-height:48px;padding:0 14px;border:1px solid var(--line-ui);border-radius:2px;background:#fff;font-weight:400;cursor:pointer;transition:border-color var(--t),box-shadow var(--t)}
.opt:hover{border-color:var(--graphite-2)}
.opt:has(input:checked){border-color:var(--brick);box-shadow:inset 0 0 0 1px var(--brick)}
.opt:focus-within{outline:2px solid var(--brick);outline-offset:2px}
.opt input{width:18px;height:18px;margin:0;flex:none;accent-color:var(--brick)}
.opt--check{margin-top:4px;background:none}
input[type=text],input[type=email],input[type=tel],textarea{width:100%;min-height:48px;padding:10px 14px;border:1px solid var(--line-ui);border-radius:2px;background:#fff;color:inherit;font:inherit}
textarea{resize:vertical;min-height:120px}
input:focus-visible,textarea:focus-visible{outline:2px solid var(--brick);outline-offset:1px;border-color:var(--brick)}
input[disabled]{background:var(--chalk-2);color:var(--graphite-2)}
.fld.is-invalid>label,.fld.is-invalid>legend{color:var(--brick-ink)}
.fld.is-invalid input[type=text],.fld.is-invalid input[type=email],.fld.is-invalid input[type=tel],.fld.is-invalid .opts{border-color:var(--brick);box-shadow:0 0 0 1px var(--brick)}
.fld.is-invalid .opts{padding:8px;border:1px solid var(--brick);border-radius:2px}
.err{font-size:14px;color:var(--brick-ink)}
.step__btns{display:flex;flex-wrap:wrap;gap:12px;padding-top:16px;border-top:1px solid var(--concrete)}
.step__btns .btn{flex:1 1 160px}
@media(min-width:500px){.step__btns .btn{flex:0 1 auto}.step__btns [data-next],.step__btns [data-submit]{margin-left:auto}}
.recap{border-top:1px solid var(--concrete)}
.recap div{display:grid;grid-template-columns:150px 1fr;gap:12px;padding:10px 0;border-bottom:1px solid var(--concrete)}
.recap dt{font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--graphite-2);padding-top:3px}
.recap dd{overflow-wrap:anywhere;white-space:pre-line}
.recap__note{font-size:14px;color:var(--graphite-2)}
.done{display:grid;gap:16px;margin-top:24px;padding:24px;border:1px solid var(--graphite);border-radius:2px} /* karta jako v originálu, linka grafitová, ne cihlová (chybová) */
@media (max-width:359.98px){.done{padding-inline:16px}} /* 320 px: nezalomitelný odkaz „Chcete takový web? Napište nám“ (241 px) se do karty vejde */
.done__msg{display:grid;gap:12px;scroll-margin-block:48px 24px} /* nadpis karty je první; po dokončení je ve výřezu i horní hrana karty (24 px odsazení + 24 px vzduch) */
.done__msg:focus{outline:none}.done__msg .h3{margin-bottom:0}
.done__cta .link{white-space:nowrap} /* odkaz na vlastním řádku, nikdy zalomený */
.done__tag{margin-top:16px;color:var(--graphite-2)}
.enq__store{margin-top:32px}
@media(max-width:480px){.recap div,.ddata div{grid-template-columns:1fr;gap:2px}}

/* patička */
.ftr{border-top:1px solid var(--concrete);padding-block:48px 32px}
.ftr__in{display:grid;gap:28px}
.ftr__brand{display:grid;gap:8px;justify-items:start}
.ftr__nav ul{flex-direction:column;gap:0}
.ftr__nav a{display:inline-flex;align-items:center;min-height:44px;text-decoration:none;font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase}
.ftr__note{max-width:60em;padding-top:16px;border-top:1px solid var(--concrete);font-size:14px;color:var(--graphite-2)}
@media(min-width:768px){.ftr__in{grid-template-columns:2fr 1fr}.ftr__note,.ftr__copy{grid-column:1/-1}}

/* pohyb — reveal; reduced motion = nic */
html.js .rv{opacity:0;transform:translateY(10px);transition:opacity var(--t) ease,transform var(--t) ease}
html.js .rv.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){
html.js .rv{opacity:1;transform:none;transition:none}
*,*::before,*::after{transition:none!important;animation:none!important;scroll-behavior:auto!important}
}
/* postup poptávky: krok → vyplněná část kóty (bez inline style) */
.prog[data-step="1"]{--p:20%}.prog[data-step="2"]{--p:40%}.prog[data-step="3"]{--p:60%}.prog[data-step="4"]{--p:80%}.prog[data-step="5"]{--p:100%}

/* generováno build.py z manifestu: obrazy s jediným zdrojem nikdy širší než vlastní pixely */