/* Zahradnictví Vějíř – ukázkový web FORMA (smyšlený podnik). Motiv: vzorník barev, barvy odstínů jsou obsah stránky. */
@font-face{font-family:Literata;font-weight:400 700;font-style:normal;font-display:swap;src:url(fonts/literata-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:Literata;font-weight:400 700;font-style:normal;font-display:swap;src:url(fonts/literata-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Hanken Grotesk";font-weight:100 900;font-style:normal;font-display:swap;src:url(fonts/hanken-grotesk-latin-ext-wght.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Hanken Grotesk";font-weight:100 900;font-style:normal;font-display:swap;src:url(fonts/hanken-grotesk-latin-wght.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root{
  --bg:#E9EDE6; --card:#FAFBF8; --ink:#1E2A24; --ink2:#44524A; --hib:#A8174F; --hib-d:#8A1140; --list:#2F6B4F; --line:#C3CCC1; --ctl:#66766C; --kryt:#12332A; --mosaz:#D8C493;
  --serif:Literata,"Iowan Old Style",Georgia,serif; --sans:"Hanken Grotesk",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --h:4rem; --m:clamp(1rem,3.6vw,3.5rem);
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;text-size-adjust:100%}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--bg);color:var(--ink);font:400 1.0625rem/1.5 var(--sans);overflow-x:hidden}
h1,h2,h3,h4,p,dl,dd,ol,figure,address,ul{margin:0;padding:0}
ul,ol{list-style:none}
address{font-style:normal}
img,svg{display:block;max-width:100%}
a{color:inherit}
[hidden]{display:none!important}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
:focus-visible{outline:3px solid currentColor;outline-offset:2px;border-radius:3px}
.skip{position:absolute;left:1rem;top:-5rem;z-index:400;background:var(--ink);color:#fff;padding:.7rem 1rem;border-radius:8px;text-decoration:none}
.skip:focus{top:.5rem;outline-color:#fff}
.wrap{width:100%;padding:0 var(--m)}
[id]{scroll-margin-top:var(--h)}
h2:focus{outline:none}

/* ---------- barvy odstínů (barvy květů): jsou obsahem stránky ---------- */
.top{--c:var(--kryt);--t:#fff}
.c-bila{--c:#F7F6F0;--t:#1E2A24;--j:1}
.c-krem{--c:#EFDDA8;--t:#1E2A24;--j:2}
.c-zluta{--c:#F3C531;--t:#1E2A24;--j:3}
.c-oranzova{--c:#F08A2B;--t:#1E2A24;--j:4}
.c-losos{--c:#F29B84;--t:#1E2A24;--j:5}
.c-ruzova{--c:#E7739F;--t:#1E2A24;--j:6}
.c-cervena{--c:#D0262F;--t:#fff;--j:7}
.c-vinova{--c:#7B1230;--t:#fff;--j:8}
.c-fialova{--c:#7A3FA6;--t:#fff;--j:9}
.c-modra{--c:#6C9BE0;--t:#1E2A24;--j:10}
.c-bez{--c:#2F6B4F;--t:#fff}
.c-papir{--c:#E9EDE6;--t:#1E2A24}

/* ---------- tlačítka ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;min-height:2.75rem;padding:.55rem 1.2rem;border-radius:999px;border:2px solid transparent;font:600 1rem/1.2 var(--sans);text-decoration:none;cursor:pointer;text-align:center;transition:background-color .18s,color .18s,border-color .18s}
.btn-main{background:var(--hib);color:#fff}
.btn-main:hover{background:var(--hib-d)}
.btn-line{background:transparent;color:inherit;border-color:currentColor}
.btn-line:hover{background:#fff;color:var(--ink);border-color:#fff}
.btn-sm{min-height:2.75rem;padding:.4rem 1rem;font-size:1rem}
@media (min-width:56.25rem){.btn-sm{font-size:1.0625rem}}
.btn-lg{min-height:3.5rem;padding:.7rem 1.7rem;font-size:1.15rem}
.btn[disabled]{opacity:.55;cursor:not-allowed}

/* ---------- hlavička: pás v barvě aktuálního listu ---------- */
.top{position:fixed;top:0;left:0;right:0;z-index:300;background:var(--c);color:var(--t)}
.top-in{display:flex;align-items:center;gap:.6rem;min-height:var(--h)}
.brand{display:flex;align-items:center;gap:.55rem;text-decoration:none;margin-right:auto;min-width:0}
.mk{width:2.3rem;height:2.3rem;flex:none}
.mk rect{fill:var(--c);stroke:rgba(30,42,36,.55);stroke-width:.8}
.mk-r{fill:currentColor}
.brand-t{display:flex;flex-direction:column;line-height:1.1}
.brand-n{font:600 1.45rem/1 var(--serif);letter-spacing:-.01em}
.brand-s{font-size:.9rem;letter-spacing:.01em}
.nav{display:none;gap:1.6rem;margin-right:1rem}
.nav a{text-decoration:none;font-weight:600;padding:.5rem 0}
.nav a:hover{text-decoration:underline;text-underline-offset:.3em}
.top .btn-ghost{background:transparent;color:inherit;border-color:currentColor}
.top .btn-main{background:var(--t);color:var(--c)}
.top .btn-main:hover{opacity:.86}
.pocet{display:inline-block;margin-left:.4rem;min-width:1.45rem;padding:0 .35rem;border-radius:999px;background:var(--t);color:var(--c);font-size:.9rem;line-height:1.45rem;text-align:center}
@media (max-width:28rem){.brand-s{display:none}}
@media (max-width:23.5rem){.top-in{gap:.35rem}.btn-sm{padding:.35rem .7rem}.mk{width:1.8rem;height:1.8rem}.brand{gap:.35rem}.brand-n{font-size:1.2rem}}
@media (min-width:56.25rem){.nav{display:flex}}

/* ---------- scéna vzorníku ----------
   Bez skriptu a při omezeném pohybu: titulní list s rozevřeným vějířem a pod ním kapitoly jako barevné pásy.
   Se skriptem (.fan): pódium stojí a listy se otáčejí kolem nýtu. List je obří obdélník, pravá hrana míří od nýtu ven. */
.sc{position:relative;background:var(--bg)}
.pod{--px:44vw;--py:100vh;--L:calc(100vw + 100vh);--a0:10deg;--a1:33deg;--a9:98deg;--ao:-90deg;--g0:8.8deg;--b:clamp(7.5rem,23vmax,20rem);position:relative;overflow:hidden;overflow:clip;background:var(--bg)}
@supports (height:100lvh){.pod{--py:100lvh}}
@media (max-width:56.24rem){.pod{--px:0vw;--a0:49deg;--a1:61deg;--a9:96deg;--ao:-6deg;--g0:4.7deg}}
.ls{position:absolute;top:calc(var(--py) - var(--L));left:calc(var(--px) - var(--L));width:var(--L);height:calc(var(--L) * 2);z-index:calc(100 - 2 * var(--j));transform-origin:100% 50%;transform:rotate(calc(var(--a0) + var(--j) * var(--g0)));background:var(--c)}
.ls-o{--j:0;background:var(--kryt)}
.ls::after{content:"";position:absolute;top:0;bottom:0;left:100%;width:clamp(1.5rem,3vw,3rem);background:linear-gradient(90deg,rgba(14,22,18,.26),rgba(14,22,18,0));pointer-events:none}
.ls-pas{position:absolute;top:0;right:0;width:clamp(7rem,15vw,14rem);height:100%;display:block;color:var(--t);text-decoration:none}
.ls-pas i{position:absolute;left:0;right:0;height:calc(var(--b) - .2rem)}
.ls-pas .p0{bottom:calc(50% + var(--b) * .2);background:color-mix(in srgb,var(--c) 58%,#fff)}
.ls-pas .p1{bottom:calc(50% + var(--b) * 1.2);background:color-mix(in srgb,var(--c) 80%,#fff)}
.ls-pas .p2{bottom:calc(50% + var(--b) * 2.2);background:var(--c)}
.ls-pas .p3{bottom:calc(50% + var(--b) * 3.2);background:color-mix(in srgb,var(--c) 88%,#000)}
.ls-pas .p4{bottom:calc(50% + var(--b) * 4.2);background:color-mix(in srgb,var(--c) 74%,#000)}
.ls-nm{position:absolute;right:.55rem;bottom:calc(50% + var(--b) * 1.34);writing-mode:vertical-rl;transform:rotate(180deg);font:700 1.1rem/1 var(--sans);letter-spacing:.01em;white-space:nowrap}
.ls-pas:hover .ls-nm{text-decoration:underline;text-underline-offset:.25em}
.ls-pas:focus-visible{outline:none}
.ls-pas:focus-visible .ls-nm{outline:3px solid currentColor;outline-offset:4px}
.hub{--d:clamp(6.5rem,13vmin,9.5rem);position:absolute;left:var(--px);top:var(--py);z-index:150;width:var(--d);height:var(--d);margin:calc(var(--d) / -2);border-radius:50%;background:radial-gradient(circle,#f1e6c6 0 9%,#8d7a4c 10% 13%,var(--mosaz) 14% 40%,#a8945f 41% 44%,#2a2f27 45% 100%);box-shadow:0 0 0 .3rem rgba(255,255,255,.22),0 -.2rem 1.6rem rgba(0,0,0,.4)}

/* kapitoly: bez skriptu pásy pod sebou */
.kap{--ink2:currentColor;position:relative;z-index:200;background:var(--c);color:var(--t);padding:clamp(3rem,8vh,5rem) var(--m);overflow:hidden}
.kap-o{--j:0;--ink2:#CFDDD4;z-index:101;background:none;color:#fff;min-height:100vh;padding:calc(var(--h) + clamp(1rem,5vh,3.4rem)) var(--m) 1.5rem}
.uv{max-width:min(46.5vw,56rem)}
h1{font:600 clamp(2.6rem,min(5.8vw,10vh),7.4rem)/1.02 var(--serif);letter-spacing:-.022em;text-wrap:balance}
.lede{margin-top:1.2rem;font-size:clamp(1.0625rem,1.45vw,1.3rem);line-height:1.45;color:var(--ink2);max-width:34rem}
.cta{margin-top:1.5rem;display:flex;flex-wrap:wrap;gap:.7rem}
.hero-fake{margin-top:.6rem}
.hero-note{margin-top:.8rem;color:var(--ink2);max-width:32rem}
.fake{font-size:1.0625rem;color:var(--ink2)}
.uv-t{display:none}
.fan .uv-t{display:block;position:absolute;left:var(--m);bottom:1.4rem;color:var(--ink2);font-weight:600}
@media (max-height:52rem){.fan .uv-t{display:none}}
.kap-h{font:600 clamp(4.2rem,min(10vw,17.5vh),13rem)/.94 var(--serif);letter-spacing:-.035em;padding-bottom:.08em}
.kap-p{margin-top:.5rem;font:500 clamp(1.25rem,min(1.75vw,3vh),1.65rem)/1.28 var(--serif);max-width:25em;text-wrap:balance}
.kap-kv{--kf:color-mix(in srgb,var(--c) 82%,var(--t));--kf2:color-mix(in srgb,var(--c) 58%,var(--t));position:absolute;left:calc(var(--px) + 3.9vw);top:calc(var(--h) + 1.6vh);width:clamp(10rem,min(33vh,21vw),24rem);height:clamp(10rem,min(33vh,21vw),24rem);color:var(--t)}
.c-oranzova .kap-kv{transform:rotate(24deg)}
.c-losos .kap-kv{transform:rotate(-34deg)}
.c-vinova .kap-kv{transform:rotate(30deg)}
.kv{fill:none;stroke:currentColor;stroke-width:1.15;stroke-linecap:round;stroke-linejoin:round}
.kv .f{fill:var(--kf)}
.kv .s{fill:var(--kf2)}
.kv .t{fill:currentColor;stroke:none}
.kv .p{stroke-width:3.6;stroke:var(--t)}

.kl{margin:clamp(.8rem,2.6vh,1.8rem) 0 0 calc(var(--m) * -1);display:grid;gap:.35rem;width:calc(min(46rem,44vw) + var(--m))}
.kl-i{position:relative;display:grid;grid-template-columns:2.4rem minmax(0,1fr) auto auto;align-items:center;gap:.65rem;min-height:clamp(2.9rem,6.2vh,3.5rem);padding:.2rem 1.5rem .2rem var(--m);border-radius:0 999px 999px 0;background:var(--t);color:var(--c);transition:transform .22s cubic-bezier(.2,.8,.2,1)}
.kl-g svg{width:2.2rem;height:2.2rem}
.kl-n{font:600 1.1875rem/1.15 var(--serif);min-width:0}
.kl-c{font:600 1.1875rem/1 var(--serif);font-variant-numeric:tabular-nums lining-nums;white-space:nowrap}
.kl-add{min-width:4.9rem;min-height:2.75rem;padding:0;border:0;background:none;color:inherit;font:600 1.0625rem/1 var(--sans);text-align:right;cursor:pointer}
.kl-add::after{content:"";position:absolute;inset:0;border-radius:0 999px 999px 0}
.kl-add:focus-visible{outline:none}
.kl-add:focus-visible::after{outline:3px solid var(--t);outline-offset:2px}
@media (hover:hover){.kl-i:not(.je-vybrano):hover{transform:translateX(.7rem)}}
.kl-i.je-vybrano{transform:translateX(1.5rem)}
.kl-i.je-vybrano::after{content:"";position:absolute;right:.55rem;top:50%;width:.8rem;height:.8rem;margin-top:-.4rem;border-radius:50%;background:var(--mosaz);box-shadow:0 .08rem .2rem rgba(14,22,18,.5)}
.kap-m .kl-i{min-height:clamp(3.6rem,10vh,5.6rem);padding-left:var(--m)}
.kap-m .kl-g svg{width:2.8rem;height:2.8rem}
.kap-m .kl-i{grid-template-columns:3rem minmax(0,1fr) auto auto}
.kap-m .kl-n,.kap-m .kl-c{font-size:clamp(1.25rem,2.1vw,1.75rem)}
.kap-a{margin-top:clamp(.5rem,1.6vh,1rem)}
.kap-dal{display:inline-flex;align-items:center;min-height:2.75rem;font-weight:700;font-size:1.0625rem;text-underline-offset:.28em;text-decoration-thickness:2px}
.kap-dal:hover{text-decoration-thickness:4px}

/* se skriptem: pódium stojí, kapitoly leží na listech */
.fan .sc{height:calc(100vh + var(--krok) * 10.62);--krok:60vh}
.fan .pod{position:sticky;top:0;height:100vh}
@supports (height:100lvh){.fan .sc{height:calc(100lvh + var(--krok) * 10.62);--krok:60svh}.fan .pod{height:100lvh}}
@media (prefers-reduced-motion:no-preference){
  .ls{animation:rozevrit .95s cubic-bezier(.2,.8,.2,1) backwards;animation-delay:calc(var(--j) * 16ms)}
  @keyframes rozevrit{from{transform:rotate(var(--a0))}}
}
.fan .ls{will-change:transform}
.fan .ls.pryc{visibility:hidden}
.fan .kap{position:absolute;inset:0;z-index:calc(101 - 2 * var(--j));min-height:0;padding:calc(var(--h) + clamp(.6rem,3vh,2rem)) var(--m) 0;background:none;overflow:visible;transform-origin:var(--px) var(--py);visibility:hidden;will-change:transform}
.fan .kap-o{padding-top:calc(var(--h) + clamp(1rem,5vh,3.4rem))}
.fan .kap.vid{visibility:visible}
.fan .kap{pointer-events:none}
.fan .uv,.fan .kap-t{pointer-events:auto;width:fit-content;max-width:min(46.5vw,56rem)}
.fan .kap-kv{opacity:0}
.fan .kap.je .kap-kv{opacity:1;transition:opacity .3s}
.fan .kap:not(.kap-o) .kl-i{opacity:0;transform:translateX(-100%)}
.fan .kap.je .kl-i{opacity:1;transform:none;transition:transform .55s cubic-bezier(.16,1,.3,1),opacity .2s;transition-delay:calc(var(--n,0) * 70ms)}
.fan .kap.je .kl-i.je-vybrano{transform:translateX(1.5rem)}
@media (hover:hover){.fan .kap.je .kl-i:not(.je-vybrano):hover{transform:translateX(.7rem);transition-delay:0ms;transition-duration:.2s}}

/* ---------- katalog: stoh proužků ---------- */
.kat{--kbg:var(--c,var(--bg));position:relative;padding:clamp(3.5rem,9vh,6.5rem) 0 clamp(4rem,10vh,7rem);background:var(--kbg);color:var(--t,var(--ink));overflow-x:clip}
.kat-h h2{font:600 clamp(2.9rem,8vw,8rem)/.98 var(--serif);letter-spacing:-.03em;max-width:12em}
.sec-lede{margin-top:1rem;font-size:clamp(1.0625rem,1.5vw,1.3rem);max-width:44rem}
.nastroje{display:contents}
.n-pravitko{position:sticky;top:var(--h);z-index:30;margin-top:clamp(2rem,5vh,3.5rem)}
.n-barvy{display:flex;box-shadow:0 .5rem 1.2rem -.6rem rgba(14,22,18,.5)}
.n-barvy .pill{flex:1 1 0;min-width:0;min-height:4.4rem;padding:.55rem .35rem .55rem .75rem;display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;gap:.05rem;border:0;background:var(--c);color:var(--t);font:600 1.0625rem/1.1 var(--sans);text-align:left;cursor:pointer;transition:flex-grow .24s cubic-bezier(.2,.8,.2,1)}
.n-barvy .pill .n{font-weight:500;font-variant-numeric:tabular-nums}
.n-barvy .pill:hover{flex-grow:1.3}
.n-barvy .pill[aria-pressed="true"]{flex-grow:1.9;box-shadow:inset 0 -.4rem 0 var(--t)}
.n-barvy .pill:focus-visible{outline:3px solid var(--t);outline-offset:-6px}
.n-radek{display:grid;grid-template-columns:minmax(0,1fr) minmax(12rem,17rem) 11.5rem;gap:1rem 1.5rem;align-items:end;margin-top:clamp(1.5rem,4vh,2.5rem)}
.n-kat{display:flex;flex-wrap:wrap;gap:.1rem 1.2rem}
.n-kat .pill{min-height:2.75rem;padding:.2rem 0;border:0;border-bottom:.2rem solid transparent;background:none;color:inherit;font:600 clamp(1.15rem,1.5vw,1.4rem)/1.2 var(--serif);cursor:pointer}
.n-kat .pill .n{font:500 1.0625rem/1 var(--sans);opacity:.8}
.n-kat .pill:hover{border-bottom-color:currentColor}
.n-kat .pill[aria-pressed="true"]{border-bottom-color:currentColor}
.n-hled label,.n-raz label,.label{display:block;font-weight:600;margin-bottom:.3rem}
input[type=text],input[type=search],input[type=tel],input[type=email],select,textarea{width:100%;min-height:2.9rem;padding:.55rem .75rem;font:400 1.0625rem/1.4 var(--sans);color:var(--ink);background:#fff;border:1.5px solid var(--ctl);border-radius:8px}
.n-stav{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;gap:.5rem 1rem;min-height:2.75rem}
.pocet-v{font-weight:600}
.btn-line#reset:hover{background:var(--t,var(--ink));color:var(--c,var(--bg));border-color:var(--t,var(--ink))}
.seznam{margin-top:clamp(1rem,3vh,2rem)}
.sk{display:grid;grid-template-columns:minmax(15rem,23rem) minmax(0,1fr);gap:clamp(1.5rem,3.4vw,3.5rem);padding-left:var(--m);margin-top:clamp(2.5rem,7vh,5rem)}
.sk:first-child{margin-top:0}
.sk-h{position:sticky;top:calc(var(--h) + 5.6rem);align-self:start;padding-bottom:1rem}
.sk-h h3{font:600 clamp(2.4rem,4.3vw,4.2rem)/1 var(--serif);letter-spacing:-.022em}
.sk-n{margin-top:.5rem;font-weight:600}
.sk-p{margin-top:.5rem;max-width:21rem}
.sk.plochy{grid-template-columns:minmax(0,1fr)}
.vz-list{display:grid;min-width:0}
.vz{--kolej:clamp(4.2rem,6.2vw,5.6rem);position:relative;display:grid;grid-template-columns:var(--kolej) minmax(0,1fr);align-items:center;min-height:clamp(5rem,6.6vw,6rem);margin:0 -6rem -.4rem 0;padding-right:6rem;border-radius:999px 0 0 999px;background:var(--c);color:var(--t);box-shadow:0 -.1rem .7rem -.1rem rgba(14,22,18,.34);transition:transform .22s cubic-bezier(.2,.8,.2,1)}
.vz:last-child{margin-bottom:0}
.vz::before{content:"";position:absolute;left:1rem;top:50%;width:1.05rem;height:1.05rem;margin-top:-.52rem;border-radius:50%;background:var(--kbg);box-shadow:inset 0 .12rem .2rem rgba(14,22,18,.5)}
.vz-chip{display:flex;align-items:center;justify-content:flex-end;padding-right:.2rem}
.vz-chip svg{width:clamp(2.4rem,3.4vw,3rem);height:clamp(2.4rem,3.4vw,3rem)}
.vz-b{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) auto;align-items:center;gap:.15rem 1.5rem;padding:.6rem var(--m) .7rem .7rem;min-width:0}
.vz-n{font:600 clamp(1.45rem,2.1vw,1.95rem)/1.1 var(--serif);letter-spacing:-.01em;overflow-wrap:anywhere}
.vz-l{overflow-wrap:anywhere}
.vz-m{font-weight:600}
.vz-d{line-height:1.3}
.vz-f{display:flex;align-items:center;gap:1rem}
.vz-c{min-width:5.2rem;font:600 clamp(1.45rem,2.1vw,1.95rem)/1 var(--serif);font-variant-numeric:tabular-nums lining-nums;white-space:nowrap;text-align:right}
.vz-add{min-width:4.9rem;min-height:2.75rem;padding:0;border:0;background:none;color:inherit;font:600 1.0625rem/1 var(--sans);text-align:right;cursor:pointer}
.vz-add::after{content:"";position:absolute;inset:0;border-radius:inherit}
.vz-add:focus-visible{outline:none}
.vz-add:focus-visible::after{outline:3px solid currentColor;outline-offset:-7px}
.vz:hover{transform:translateX(-1rem)}
.vz.je-vybrano{transform:translateX(-2.6rem);z-index:2}
.vz.je-vybrano::before{background:var(--mosaz);box-shadow:0 0 0 .18rem var(--t),0 .1rem .3rem rgba(14,22,18,.5)}
.vz-kn{display:none;grid-column:1/-1;font-weight:600}
.je-plochy .vz-kn{display:block}
.vz.pr{animation:prijed .6s cubic-bezier(.16,1,.3,1) both;animation-delay:var(--d,0ms)}
@keyframes prijed{from{transform:translateX(104%)}}
.nic{margin-top:1.5rem;font:600 clamp(1.4rem,2.4vw,2rem)/1.25 var(--serif)}
.nic:focus{outline:none}

/* ---------- váš vzorník: tmavý pás, vybrané listy se sepnou do vějířku ---------- */
.pop{--ink2:#CFDDD4;padding:clamp(4rem,10vh,7rem) 0;background:var(--kryt);color:#fff}
.pop-in{display:grid;gap:2.5rem}
@media (min-width:60rem){.pop-in{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(3rem,6vw,6rem);align-items:start}}
.pop h2{font:600 clamp(3.2rem,8vw,8rem)/.96 var(--serif);letter-spacing:-.03em}
.pop-vyber .sec-lede{color:var(--ink2)}
.vejirek{--dl:clamp(13rem,23vw,20rem);--sl:clamp(3.4rem,5.4vw,4.8rem);position:relative;height:calc(var(--dl) + 1.5rem);margin-top:clamp(1.5rem,4vh,2.5rem);overflow:hidden}
.vj-l{position:absolute;left:calc(50% - var(--sl) / 2);bottom:.4rem;width:var(--sl);height:var(--dl);border-radius:.55rem;background:var(--c);transform-origin:50% calc(100% - 1.5rem);transform:rotate(var(--r,0deg));box-shadow:0 .1rem .6rem rgba(0,0,0,.34);transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.vj-l.prazdny{background:none;box-shadow:inset 0 0 0 2px rgba(255,255,255,.34)}
.vj-r{position:absolute;left:calc(50% - .95rem);bottom:.95rem;z-index:40;width:1.9rem;height:1.9rem;border-radius:50%;background:radial-gradient(circle,#f1e6c6 0 18%,var(--mosaz) 19% 62%,#8d7a4c 63% 100%);box-shadow:0 .1rem .35rem rgba(0,0,0,.5)}
.vyb-prazdny{margin-top:1.2rem;font-size:1.0625rem}
.vyb-prazdny:focus{outline:3px solid #fff;outline-offset:2px}
.vyb{margin-top:1.2rem;display:grid;gap:.35rem}
.vyb li{display:grid;grid-template-columns:1.1rem minmax(0,1fr) auto;gap:.1rem .7rem;align-items:center;padding:.6rem .7rem .6rem .9rem;background:var(--c);color:var(--t);border-radius:999px 0 0 999px}
.dot{width:1.05rem;height:1.05rem;border-radius:50%;background:var(--kryt)}
.vyb-n{font:600 1.1875rem/1.2 var(--serif);overflow-wrap:anywhere}
.vyb-c{grid-column:2}
.vyb-k{grid-column:3;grid-row:1 / span 2;display:flex;align-items:center;gap:.2rem}
.vyb-k button{width:2.75rem;height:2.75rem;border-radius:50%;border:2px solid currentColor;background:none;color:inherit;font:600 1.25rem/1 var(--sans);cursor:pointer}
.vyb-k button:hover{background:var(--t);color:var(--c);border-color:var(--t)}
.vyb-k output{min-width:2.4rem;text-align:center;font-weight:700;font-variant-numeric:tabular-nums}
.vyb-sum{margin-top:1rem;display:grid;gap:.3rem}
.vyb-sum p:first-child{font:600 clamp(1.5rem,2.4vw,2.1rem)/1.15 var(--serif)}
.vyb-sum p{color:var(--ink2)}
.vyb-sum p:first-child{color:#fff}
.vyb-ak{margin-top:1rem;display:flex;flex-wrap:wrap;gap:.6rem}
.stav{margin-top:.5rem;color:var(--ink2);min-height:1.4em}
.tel-velky{margin-top:1.5rem}
.tel-velky .btn{width:100%;max-width:24rem}
.tel-fake{margin-top:.5rem}
.tel-pozn{margin-top:.6rem;color:var(--ink2)}
.ns{margin-top:1rem}
.form{--ink2:#44524A;background:var(--bg);color:var(--ink);border-radius:.4rem;padding:clamp(1.2rem,3vw,2.4rem)}
.form-h{font:600 clamp(1.8rem,3vw,2.6rem)/1.1 var(--serif);letter-spacing:-.015em;margin-bottom:1.2rem}
.field{margin-bottom:1rem;border:0;padding:0;min-width:0}
.fs legend{padding:0}
.req{color:var(--hib)}
.hint{margin-top:.3rem;color:var(--ink2)}
.err{margin-top:.35rem;color:#9B1239;font-weight:600}
.field [aria-invalid="true"]{border-color:#9B1239;border-width:2px}
.radio,.check{display:flex;align-items:flex-start;gap:.65rem;padding:.4rem 0;cursor:pointer;line-height:1.4}
.radio input,.check input{width:1.4rem;height:1.4rem;margin:.1rem 0 0;flex:none;accent-color:var(--list)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.note{margin-top:.8rem;color:var(--ink2)}
.result{margin-top:1rem;padding:1rem 1.1rem;background:#fff;border:2px solid var(--list);border-radius:.4rem}
.result h3{font:600 1.25rem/1.3 var(--serif)}
.result p{margin-top:.3rem}
.form .btn-line:hover{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.vloz{margin-top:.5rem}

/* ---------- doprava: rok jako řada proužků, štítek zásilky ---------- */
.dop{padding:clamp(4rem,10vh,7rem) 0 clamp(4rem,10vh,7rem);background:var(--bg);color:var(--ink)}
.dop h2{font:600 clamp(3.1rem,9.4vw,9.8rem)/.96 var(--serif);letter-spacing:-.035em}
.dop .sec-lede{color:var(--ink2)}
.mes{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));align-items:end;gap:.25rem;margin-top:clamp(2rem,6vh,3.5rem);padding:0 var(--m)}
.mes li{display:flex;flex-direction:column;justify-content:flex-end;gap:.1rem;padding:.6rem .65rem;min-width:0;border-radius:.45rem .45rem 0 0}
.mes-s{height:clamp(6rem,15vh,9rem);background:#D5DCD2;color:var(--ink)}
.mes-r{height:clamp(11rem,34vh,20rem);background:var(--c);color:var(--t)}
.mes-n{font:600 clamp(1.1rem,1.5vw,1.4rem)/1.1 var(--serif)}
.mes-t{font-size:1.0625rem;line-height:1.2}
.stitek{position:relative;margin-top:clamp(2rem,6vh,3.5rem);background:#fff;color:var(--ink);border-radius:.45rem;box-shadow:0 1.4rem 2.6rem -1.6rem rgba(14,22,18,.5);overflow:hidden}
.stitek-h{display:flex;justify-content:space-between;gap:1rem;padding:.8rem clamp(1rem,2.4vw,2rem);background:var(--ink);color:#fff;font:600 clamp(1.2rem,1.9vw,1.6rem)/1.2 var(--serif)}
.stitek-dl{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.stitek-dl>div{padding:clamp(1rem,2.2vw,1.8rem) clamp(1rem,2.4vw,2rem);border-right:2px dashed var(--line);border-bottom:2px dashed var(--line)}
.stitek-dl>div:nth-child(3n){border-right:0}
.stitek-dl>div:nth-last-child(-n+3){border-bottom:0}
.stitek-dl dt{font:600 clamp(1.3rem,1.9vw,1.6rem)/1.15 var(--serif);margin-bottom:.3rem}
.stitek-dl dd{color:var(--ink2);font-variant-numeric:tabular-nums}

/* ---------- konec: velká věta a rozevřený vějíř ---------- */
.kon{--ink2:#CFDDD4;position:relative;overflow:hidden;background:var(--kryt);color:#fff;padding-top:clamp(4.5rem,12vh,8rem);text-align:center}
.kon-in{display:flex;flex-direction:column;align-items:center}
.kon h2{font:600 clamp(3.2rem,9.6vw,10rem)/.95 var(--serif);letter-spacing:-.035em;max-width:9.6em;text-wrap:balance}
.kon-tl{display:flex;flex-wrap:wrap;justify-content:center;gap:.7rem;margin-top:clamp(1.6rem,4vh,2.6rem)}
.kon-fake{margin-top:.6rem}
.kon-sl{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:1rem 3rem;margin-top:clamp(1.6rem,4vh,2.6rem);max-width:50rem;text-align:left}
.adr{font:500 clamp(1.25rem,1.8vw,1.5rem)/1.32 var(--serif)}
.kon-pozn{color:var(--ink2)}
.kon-fan{position:relative;width:min(100%,78rem);aspect-ratio:2/1;margin:clamp(2.5rem,7vh,4.5rem) auto 0;border-radius:999rem 999rem 0 0;background:conic-gradient(from -90deg at 50% 100%,#F7F6F0 0 18deg,#EFDDA8 0 36deg,#F3C531 0 54deg,#F08A2B 0 72deg,#F29B84 0 90deg,#E7739F 0 108deg,#D0262F 0 126deg,#7B1230 0 144deg,#7A3FA6 0 162deg,#6C9BE0 0 180deg,transparent 0)}
.kon-hub{position:absolute;left:50%;bottom:0;width:clamp(6rem,13vw,9.5rem);aspect-ratio:1;transform:translate(-50%,50%);border-radius:50%;background:radial-gradient(circle,#f1e6c6 0 9%,#8d7a4c 10% 13%,var(--mosaz) 14% 40%,#a8945f 41% 44%,#2a2f27 45% 100%)}

/* ---------- ukázka FORMA: vysvětlení ---------- */
.foot-back{font-weight:600}
.demo-pop{max-width:min(27rem,calc(100vw - 2rem));padding:1.4rem 1.4rem 1.5rem;border:2px solid var(--ink);border-radius:14px;color:var(--ink);background:var(--card);box-shadow:0 30px 60px -20px rgba(30,42,36,.6)}
.demo-pop::backdrop{background:rgba(30,42,36,.62)}
.demo-pop h2{font:600 clamp(1.5rem,6vw,1.9rem)/1.15 var(--serif);margin:0 0 .7rem}
.demo-pop p{margin:0 0 1.2rem}
.demo-pop .btn{width:100%}
/* náhrada bez popover (Safari < 17): okno a ztmavení přepíná třída is-open; bez :popover-open, aby starý prohlížeč pravidlo nezahodil */
.pop-fb{display:none;position:fixed;top:50%;left:50%;z-index:500;width:27rem;max-width:calc(100vw - 2rem);max-height:calc(100vh - 2rem);overflow:auto;margin:0;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}
.pop-fb.is-open{display:block}
.pop-shade{display:none;position:fixed;top:0;right:0;bottom:0;left:0;z-index:499;background:rgba(30,42,36,.62)}
.pop-shade.is-open{display:block}

/* ---------- patička ---------- */
.foot{background:#0C1411;color:#E7ECE5;padding:clamp(2rem,6vh,3.5rem) 0}
.foot-in{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:1rem 3rem;align-items:end}
.foot-b{font:600 clamp(2.6rem,5vw,4.4rem)/1 var(--serif);letter-spacing:-.025em}
.foot a{color:#fff;text-underline-offset:.25em}
.foot :focus-visible{outline-color:#fff}
.foot-z{color:#C9D2C7}

/* ---------- telefon a užší okna: vlastní kompozice ---------- */
@media (max-width:56.24rem){
  .uv,.fan .uv,.fan .kap-t{max-width:none;width:auto}
  .kap-kv{position:static;width:9rem;height:9rem;margin-bottom:.5rem}
  .fan .kap-kv{position:absolute;left:1.2vw;top:auto;bottom:6.5vh;margin:0;width:min(47vw,23vh);height:min(47vw,23vh)}
  .kap:not(.kap-o){min-height:0}
  .kl{width:100%}
  .n-radek{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .n-skup{grid-column:1/-1}
  .sk{grid-template-columns:minmax(0,1fr);gap:1rem;padding-left:0}
  .sk-h{position:static;padding:0 var(--m)}
  .sk-p{max-width:34rem}
  .vz{margin-left:var(--m)}
  .stitek-dl{grid-template-columns:repeat(2,minmax(0,1fr))}
  .stitek-dl>div:nth-child(3n){border-right:2px dashed var(--line)}
  .stitek-dl>div:nth-child(2n){border-right:0}
  .stitek-dl>div:nth-last-child(-n+3){border-bottom:2px dashed var(--line)}
  .stitek-dl>div:nth-last-child(-n+2){border-bottom:0}
}
@media (max-width:40rem){
  body{font-size:1.0625rem}
  h1{font-size:clamp(2.4rem,11.2vw,3rem);line-height:1.04}
  .lede{margin-top:.8rem}
  .cta .btn-line,.hero-note{display:none}
  .cta{margin-top:1rem}
  .cta .btn{flex:1 1 100%}
  .kap-h{font-size:clamp(3.3rem,18.4vw,5rem)}
  .kap-p{max-width:none}
  .ls-nm{bottom:calc(50% + var(--b) * 1.46);font-size:1rem}
  .fan .uv-t{display:none}
  .kap-p{font-size:1.1875rem;padding-right:0}
  .kl{gap:.3rem;margin-top:.8rem}
  .kl-i{grid-template-columns:1.9rem minmax(0,1fr) auto 1.5rem;min-height:3.25rem;padding-right:.7rem;gap:.15rem .45rem}
  .kl-i.je-vybrano::after{display:none}
  .kap-m .kl-i{grid-template-columns:2.4rem minmax(0,1fr) auto 1.5rem;min-height:4.2rem}
  .kap-m .kl-g svg{width:2.2rem;height:2.2rem}
  .kap-m .kl-n,.kap-m .kl-c{font-size:1.1875rem}
  .kl-g svg{width:1.8rem;height:1.8rem}
  .kl-n{font-size:1.0625rem}
  .kl-c{font-size:1.0625rem}
  .kl-add{position:static;min-width:0;min-height:0;font-size:0;text-align:center}
  .kl-add::before{content:"+";font:600 1.5rem/1 var(--sans)}
  .kl-add[aria-pressed="true"]::before{content:"×"}
  .n-pravitko{position:static}
  .n-barvy{flex-wrap:wrap}
  .n-barvy .pill{flex:1 1 22%;min-height:3.4rem;padding:.4rem .4rem .4rem .55rem;font-size:1rem}
  .n-barvy .pill:hover,.n-barvy .pill[aria-pressed="true"]{flex-grow:1}
  .n-radek{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .vz{--kolej:3.7rem;min-height:5.5rem;padding-right:6rem}
  .vz::before{left:.55rem;width:.8rem;height:.8rem;margin-top:-.4rem}
  .vz-chip svg{width:1.8rem;height:1.8rem}
  .vz-b{grid-template-columns:minmax(0,1fr) auto;gap:.1rem .7rem;padding:.65rem var(--m) .7rem .35rem}
  .vz-n{font-size:1.3rem}
  .vz-i{grid-column:1;grid-row:2;font-size:1rem}
  .vz-f{grid-column:2;grid-row:1 / span 2;flex-direction:column;align-items:flex-end;gap:.15rem}
  .vz-c{font-size:1.3rem;min-width:0}
  .vz-add{min-width:0;min-height:0;font-size:1rem}
  .vz:hover{transform:none}
  .vz.je-vybrano{transform:translateX(-.7rem)}
  .mes{gap:.15rem;padding:0 .5rem}
  .mes li{padding:.5rem 0;align-items:center}
  .mes-n{writing-mode:vertical-rl;transform:rotate(180deg);font-size:1.0625rem}
  .mes-t{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .mes-s{height:7.5rem}
  .mes-r{height:13rem}
  .stitek-dl{grid-template-columns:minmax(0,1fr)}
  .stitek-dl>div,.stitek-dl>div:nth-child(3n),.stitek-dl>div:nth-child(2n){border-right:0}
  .stitek-dl>div:nth-last-child(-n+2),.stitek-dl>div:nth-last-child(-n+3){border-bottom:2px dashed var(--line)}
  .stitek-dl>div:last-child{border-bottom:0}
  .kon-sl{grid-template-columns:minmax(0,1fr);text-align:center;justify-items:center}
  .kon-tl{width:100%}
  .kon-tl li{flex:1 1 100%}
  .kon-tl .btn{width:100%}
  .foot-in{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:40rem) and (max-height:42rem){
  .lede{display:none}
}
@media (max-width:56.24rem) and (max-height:44rem){
  .fan .kap-kv,.ls-nm{display:none}
  .kap-h{font-size:3rem}
  .fan .kap{padding-top:calc(var(--h) + .3rem)}
  .fan .kl-i{min-height:2.75rem}
  .fan .kap-a{margin-top:0}
}
@media (max-width:23.5rem){
  .vz-n{font-size:1.2rem}
  .vz-c{font-size:1.2rem}
}
@media print{.top,.skip,.ls,.hub,.nastroje,.kon-fan{display:none}.fan .sc{height:auto}.fan .pod{position:static;height:auto}.fan .kap{position:relative;visibility:visible}}
/* FORMA-POLISH (generuje vizitka/tools/ukazky-polish.py) */
::selection{background:#1e2a24;color:#ffffff}
:where(html){scrollbar-color:#1e2a24 #e9ede6}
:where(input,textarea){caret-color:#1e2a24}
:where(a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible,[tabindex]:focus-visible){outline:3px solid #1e2a24;outline-offset:3px}
:where(a){text-underline-offset:.2em}
:where(table,dd,time,data,[class*=cen],[class*=price],[class*=hod],[class*=hours],[class*=doba],[class*=kc]){font-variant-numeric:tabular-nums}
/* /FORMA-POLISH */