/* Garden TIME, s.r.o., Praha 4 Michle: ostrý web gardentime.cz, MistrovskýWeb.cz (21. 10. 2026).
   Barvy z loga (zelená #82C345 ciferníku a grafit #3D4547 lopaty), krémový papír, mech. Písma Outfit (nadpisy, geometrické jako logo)
   a Public Sans (text). Ciferník a jezírko jsou vektorové scény (roční období mění třídy s-jaro, s-leto, s-podzim, s-zima),
   karty, hlavičky a galerie mají od 25. 10. 2026 fotky klienta z realizací.
   Obsah se nikdy neskrývá: animace jen přes transform, clip-path a stroke-dashoffset. */
:root{
  --ink:#23292B;--sed:#3D4547;--sed-2:#2B3234;--sed-3:#1F2426;
  --zel:#82C345;--zel-d:#3F7A1C;--zel-dd:#2E5A14;--zel-l:#C8E6A8;--mech:#5E8F38;
  --krem:#F6F4EC;--krem-2:#ECE8DB;--papir:#FBFAF4;--hlina:#7A5B3E;--muted:#596163;--line:#D9D4C4;
  --f1:"Outfit",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;--f2:"Public Sans",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --hd:84px;--r:14px;--sh:0 1px 2px rgba(35,41,43,.07),0 26px 46px -30px rgba(35,41,43,.5);--ease:cubic-bezier(.2,.8,.2,1);
}
*,*::before,*::after{box-sizing:border-box}
html{overflow-x:hidden;scroll-padding-top:calc(var(--hd) + 40px);-webkit-text-size-adjust:100%}
body{margin:0;background:var(--krem);color:var(--ink);font:400 17px/1.66 var(--f2)}
img{max-width:100%;height:auto;display:block}
a{color:var(--zel-d);text-underline-offset:3px}
a:hover{color:var(--ink)}
:focus-visible{outline:3px solid var(--zel-d);outline-offset:3px;border-radius:4px}
h1,h2,h3,h4{font-family:var(--f1);font-weight:700;line-height:1.06;letter-spacing:-.02em;margin:0 0 .5em;text-wrap:balance}
h1{font-size:clamp(2.4rem,4.8vw,4.3rem);font-weight:800;letter-spacing:-.03em}
h2{font-size:clamp(1.9rem,3.2vw,2.9rem)}
h3,.h3{font-size:1.3rem;line-height:1.2;letter-spacing:-.01em;margin:1.2em 0 .5em}
p{margin:0 0 1em}
.wrap{width:100%;max-width:1220px;margin:0 auto;padding:0 32px}
.skip{position:absolute;left:12px;top:12px;clip:rect(0 0 0 0);clip-path:inset(50%);width:1px;height:1px;overflow:hidden;background:var(--ink);color:#fff;padding:10px 16px;z-index:3000}
.skip:focus{clip:auto;clip-path:none;width:auto;height:auto}
.ic{width:20px;height:20px;flex:0 0 20px}
.kicker{display:inline-flex;align-items:center;gap:10px;font:600 .8rem/1.2 var(--f2);letter-spacing:.14em;text-transform:uppercase;color:var(--zel-dd);margin:0 0 1em}
.kicker::before{content:"";width:18px;height:18px;flex:0 0 18px;border-radius:50%;border:3px solid var(--zel);
  background:linear-gradient(var(--sed),var(--sed)) 50% 25%/2px 40% no-repeat,linear-gradient(var(--sed),var(--sed)) 70% 50%/40% 2px no-repeat}
.lead{font-size:1.16rem;line-height:1.62;color:var(--muted);max-width:56ch}
.big{font-size:1.1rem;line-height:1.68}
.small{font-size:.88rem;color:var(--muted)}
.mail-at::before{content:"@"}
a.mail-j{color:inherit;text-decoration:none;cursor:pointer}


/* tlačítka: zelená výplň vyroste odspodu jako tráva */
.btn{position:relative;overflow:hidden;isolation:isolate;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:50px;padding:12px 26px;border-radius:999px;
  font:600 1rem/1.2 var(--f2);text-decoration:none;border:2px solid transparent;cursor:pointer;max-width:100%;text-align:center;transition:color .25s,border-color .25s}
.btn::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--sed-2);transform:translateY(101%);transition:transform .45s var(--ease)}
.btn:hover::before{transform:none}
.btn .arr{transition:transform .2s}
.btn:hover .arr{transform:translateX(3px)}
.btn-lg{min-height:58px;padding:15px 30px;font-size:1.05rem}
.btn-main{background:var(--zel-d);color:#fff}
.btn-main:hover{color:#fff}
.cta .btn-main::before,.sec-dark .btn-main::before{background:#fff}
.cta .btn-main:hover,.sec-dark .btn-main:hover{color:var(--ink)}
.btn-line{border-color:var(--sed);color:var(--ink);background:transparent}
.btn-line:hover{color:#fff;border-color:var(--sed-2)}
.cta .btn-line,.sec-dark .btn-line{border-color:rgba(255,255,255,.7);color:#fff}
.cta .btn-line::before,.sec-dark .btn-line::before{background:#fff}
.cta .btn-line:hover,.sec-dark .btn-line:hover{color:var(--ink);border-color:#fff}
.btn-ghost{border-color:var(--line);color:var(--ink);background:#fff}
.btn-ghost:hover{color:#fff;border-color:var(--sed-2)}
.btns{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}

/* hlavička */
.hd{position:sticky;top:0;z-index:1000;background:var(--krem);border-bottom:1px solid transparent;transition:border-color .3s,box-shadow .3s}
.hd.is-scrolled{border-color:var(--line);box-shadow:0 10px 30px -22px rgba(35,41,43,.55)}
.hd-in{display:flex;align-items:center;gap:24px;min-height:var(--hd)}
.logo{display:block;flex:0 0 auto}.logo img{height:54px;width:auto}
.nav{display:flex;align-items:center;gap:18px;margin-left:auto}
.nav ul{display:flex;list-style:none;margin:0;padding:0;gap:2px}
.nav ul a{position:relative;display:block;padding:10px 12px;color:var(--ink);text-decoration:none;font:500 1.02rem/1.2 var(--f1)}
.nav ul a::after{content:"";position:absolute;left:12px;right:12px;bottom:3px;height:6px;
  background:radial-gradient(circle at 3px 3px,var(--zel) 2.4px,transparent 2.8px) 0 0/10px 6px repeat-x;transform:scaleX(0);transform-origin:left;transition:transform .35s var(--ease)}
.nav ul a:hover::after,.nav ul a[aria-current]::after{transform:scaleX(1)}
.nav ul a[aria-current]{color:var(--zel-d)}
.nav-tel,.hd-tel{display:inline-flex;min-height:44px;align-items:center;gap:8px;color:var(--ink);text-decoration:none;font:600 1rem var(--f2);white-space:nowrap}
.hd-tel{display:none;width:46px;height:46px;justify-content:center;border-radius:50%;border:2px solid var(--line)}
.nav-cta{min-height:46px;padding:10px 22px}
.burger{display:none;width:48px;height:48px;border:0;border-radius:50%;background:var(--sed);cursor:pointer;padding:0;position:relative}
.burger span{position:absolute;left:14px;right:14px;height:2.5px;border-radius:2px;background:#fff;transition:transform .3s var(--ease)}
.burger span:nth-child(1){top:16px}.burger span:nth-child(2){top:23px}.burger span:nth-child(3){top:30px}
.burger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.burger[aria-expanded="true"] span:nth-child(2){transform:scaleX(0)}
.burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.progress{position:absolute;left:0;right:0;bottom:-1px;height:3px;overflow:hidden}
.progress span{display:block;height:100%;background:linear-gradient(90deg,var(--zel-d),var(--zel));transform:scaleX(0);transform-origin:left}

/* ilustrované scény: roční období */
.scn{position:relative;overflow:hidden;--sky:#CDE7F2;--hill:#8BC34A;--lawn:#7DB843;--hedge:#4E7F2D;--crown:#5E9E34;--crown2:#4B8A2A;--trunk:#6B4E35;--sun:#F6C343;--tgrass:#6E9B3A;--bed:#6B4E35}
.scn svg{display:block;width:100%;height:100%}
.scn .sc-sky{fill:var(--sky);transition:fill .9s}
.scn .sc-sun{fill:var(--sun);transition:fill .9s,transform .9s var(--ease);transform-box:fill-box;transform-origin:center}
.scn .sc-cloud{fill:#fff}
.scn .sc-hill{fill:var(--hill);transition:fill .9s}
.scn .sc-lawn{fill:var(--lawn);transition:fill .9s}
.scn .sc-stripe{fill:#fff;fill-opacity:.07}
.scn .sc-hedge{fill:var(--hedge);transition:fill .9s}
.scn .sc-trunk,.scn .sc-branch{fill:var(--trunk);stroke:var(--trunk);stroke-width:5;stroke-linecap:round}
.scn .sc-crown{fill:var(--crown);transition:fill .9s,transform .9s var(--ease);transform-box:fill-box;transform-origin:50% 100%}
.scn .sc-crown circle:nth-child(2){fill:var(--crown2);transition:fill .9s}
.scn .sc-bloom{fill:#fff;transform-box:fill-box;transform-origin:center;transition:transform .7s var(--ease)}
.scn .sc-bloom circle:nth-child(3n){fill:#F6B8C8}
.scn .sc-fruit{fill:#D9472B;transform-box:fill-box;transform-origin:center;transition:transform .7s var(--ease)}
.scn .sc-bed{fill:var(--bed)}
.scn .sc-stem{stroke:#4B7A2A;stroke-width:3}
.scn .sc-fl{transform-box:fill-box;transform-origin:center;transition:transform .7s var(--ease),fill .9s}
.scn .sc-fl0{fill:#B26BD1}.scn .sc-fl1{fill:#F3C640}.scn .sc-fl2{fill:#E86A9A}
.scn .sc-grass{fill:none;stroke:var(--tgrass);stroke-width:4;stroke-linecap:round;transform-box:fill-box;transform-origin:50% 100%;transition:stroke .9s,transform .9s var(--ease)}
.scn .sc-leaves{fill:#D9832B;transform-box:fill-box;transform-origin:center;transition:transform .7s}
.scn .sc-leaves path:nth-child(3n){fill:#C4561E}
.scn .sc-frost{fill:#fff;transform-box:fill-box;transform-origin:center;transition:transform .7s}
.scn .sc-bld{fill:#C9C4B6}.scn .sc-win{fill:#A5B4BA}
.scn .sc-house rect:first-child{fill:#F1ECE0}.scn .sc-roof{fill:var(--sed)}.scn .sc-wnd{fill:#A5C4CF}.scn .sc-door{fill:var(--hlina)}
.scn .sc-path{fill:#D8CDB3}
.scn .sc-bench rect{fill:var(--hlina)}.scn .sc-bench path{stroke:var(--sed);stroke-width:4}
.scn .sc-pond-e{fill:#9C9584}.scn .sc-pond{fill:#6FB3D2;transition:fill .9s}.scn .sc-lily ellipse{fill:#4E8F2E}.scn .sc-lf{fill:#F6B8C8}
.scn .sc-reed path{fill:none;stroke:#5E7F35;stroke-width:3}
/* období */
.s-jaro{--sky:#DCEFF5;--hill:#A9D47A;--lawn:#93CB5A;--crown:#A7D873;--crown2:#93C962;--sun:#F8D877;--tgrass:#7FAE45}
.s-leto{--sky:#CDE7F2;--hill:#8BC34A;--lawn:#7DB843;--crown:#5E9E34;--crown2:#4B8A2A;--sun:#F6C343}
.s-podzim{--sky:#F3E3C8;--hill:#B9B064;--lawn:#9BAF4E;--hedge:#5F7A2E;--crown:#D9832B;--crown2:#C4561E;--sun:#F0A848;--tgrass:#C9A55A}
.s-zima{--sky:#E4E9EE;--hill:#D9E0DA;--lawn:#CFD8D2;--hedge:#7E8F80;--sun:#FFFFFF;--tgrass:#C2B48E}
.s-zima .sc-crown{transform:scale(0)}
.scn:not(.s-jaro) .sc-bloom{transform:scale(0)}
.scn:not(.s-leto) .sc-fruit{transform:scale(0)}
.s-zima .sc-fl{transform:scale(0)}
.s-podzim .sc-fl{transform:scale(.55);fill:#B49770}
.s-jaro .sc-grass{transform:scaleY(.3)}
.scn:not(.s-podzim) .sc-leaves{transform:scale(0)}
.scn:not(.s-zima) .sc-frost{transform:scale(0)}
.s-zima .sc-sun{transform:scale(.7)}
.s-zima .sc-pond{fill:#C5DDE6}
.anim .s-podzim .sc-leaves path{animation:list 6s linear infinite;animation-delay:calc(var(--l) * -.55s)}
@keyframes list{from{transform:translate(0,-40px) rotate(0)}to{transform:translate(30px,230px) rotate(320deg)}}
.anim .scn .sc-cloud{animation:mrak 40s ease-in-out infinite alternate}
@keyframes mrak{to{transform:translateX(60px)}}
.anim .scn .sc-grass path{animation:vitr 4s ease-in-out infinite alternate;transform-box:fill-box;transform-origin:50% 100%}
.anim .scn .sc-grass path:nth-child(odd){animation-delay:-2s}
@keyframes vitr{from{transform:rotate(-3deg)}to{transform:rotate(4deg)}}
@media(prefers-reduced-motion:reduce){.scn *{animation:none!important}}

/* signature: zahradní hodiny (ciferník z loga) */
.hod{position:relative;width:100%;max-width:540px;aspect-ratio:1;margin:0 auto;container-type:inline-size}
.hod-k{position:absolute;inset:12%;border-radius:50%;overflow:hidden;box-shadow:inset 0 0 0 4px rgba(35,41,43,.08)}
.hod-k .scn{width:100%;height:100%}
.hod-r{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}
.hod-b{fill:none;stroke:var(--sed);stroke-width:34}
.hod-o{fill:none;stroke:var(--zel);stroke-width:4}
.hod-ru,.hod-ru2{transform-origin:150px 150px;transition:transform .55s cubic-bezier(.3,1.4,.5,1)}
.hod-ru{transform:rotate(calc(var(--m) * 30deg + 15deg))}
.hod-ru path,.hod-ru2 path{stroke:var(--zel);stroke-width:9;stroke-linecap:round;fill:none}
.hod-ru2 path{stroke:var(--zel)}
.hod-ru path{filter:drop-shadow(0 2px 2px rgba(0,0,0,.25))}
.hod-c{fill:var(--sed);stroke:var(--zel);stroke-width:4}
.hd-m{position:absolute;left:50%;top:50%;width:13cqw;height:7.4cqw;min-height:26px;margin:0;padding:0;border:0;border-radius:999px;background:transparent;color:#D7DDD9;
  font:600 max(11px,3.3cqw)/1 var(--f1);letter-spacing:.02em;cursor:pointer;
  transform:translate(-50%,-50%) rotate(calc(var(--m) * 30deg + 15deg)) translateY(-44.3cqw) rotate(calc(var(--m) * -30deg - 15deg));transition:background .3s,color .3s}
.hd-m:hover{color:#fff;background:rgba(255,255,255,.12)}
.hd-m[aria-pressed="true"]{background:var(--zel);color:var(--ink)}
.hd-m:focus-visible{outline:3px solid #fff;outline-offset:1px}
html:not(.js) .hd-m{pointer-events:none}
.anim .hod.intro .hod-b{animation:prsten 1.2s var(--ease) both}
@keyframes prsten{from{stroke-dasharray:0 900}to{stroke-dasharray:900 0}}

/* úvod */
.hero{position:relative;background:var(--krem);overflow:hidden;isolation:isolate}
.hero::before{content:"";position:absolute;right:-12%;top:-20%;width:62%;aspect-ratio:1;border-radius:50%;z-index:-1;background:radial-gradient(circle,#E5EFD5 0,#EEF1E2 45%,rgba(246,244,236,0) 70%)}
.hero-g{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;padding-top:40px;padding-bottom:60px;min-height:min(80vh,720px)}
.hero-t{max-width:620px}
.hero h1{margin-bottom:.3em;font-size:clamp(2.4rem,4.3vw,3.8rem)}
.hero-btns{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.hero-f{margin:0;min-width:0}
.hero-cap{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 10px;margin:18px auto 0;max-width:520px;text-align:center;font-size:.95rem;color:var(--muted)}
.hero-cap b{font:700 1rem var(--f1);color:var(--zel-d)}
.hero-cap a{font-weight:600}
.ln{display:block;overflow:hidden;padding-bottom:.06em}.ln>span{display:inline-block}
.anim .hero h1 .ln>span{animation:ln .9s var(--ease) both}
.anim .hero h1 .ln:nth-child(2)>span{animation-delay:.12s}
@keyframes ln{from{transform:translateY(105%)}to{transform:none}}

/* čísla a pás služeb */
.facts-s{background:var(--sed);color:#fff}
.facts{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr)}
.facts li{padding:22px 20px;border-right:1px solid rgba(255,255,255,.12);display:flex;flex-direction:column;gap:4px}
.facts li:last-child{border-right:0}
.facts b{font:700 1.6rem/1.12 var(--f1);color:var(--zel)}.facts b a{color:var(--zel);text-decoration:none}
.facts li>span{font-size:.88rem;color:#D5DBD8;line-height:1.4}
.mq{overflow:hidden;display:flex;background:var(--zel)}
.mq-r{flex:0 0 auto;display:flex;list-style:none;margin:0;padding:12px 0;animation:mq 42s linear infinite}
.mq-r li{white-space:nowrap;font:600 1rem var(--f1);color:var(--ink);padding:0 26px;position:relative}
.mq-r li::after{content:"";position:absolute;right:-6px;top:50%;width:12px;height:12px;margin-top:-6px;border-radius:50% 0;background:var(--zel-dd);transform:rotate(45deg)}
@keyframes mq{to{transform:translateX(-100%)}}
@media(prefers-reduced-motion:reduce){.mq-r{animation:none}}

/* sekce */
.sec{padding:96px 0}.sec-tight{padding:48px 0}
.sec-alt{background:var(--krem-2)}
.sec-white{background:#fff}
.sec-dark{background:var(--sed-2);color:#E3E8E5}.sec-dark h2,.sec-dark h3{color:#fff}.sec-dark .kicker{color:var(--zel)}
.sec-dark .kicker::before{background:linear-gradient(#fff,#fff) 50% 25%/2px 40% no-repeat,linear-gradient(#fff,#fff) 70% 50%/40% 2px no-repeat}
.sec-head{max-width:760px;margin-bottom:44px}.sec-head p:last-child{color:var(--muted);font-size:1.08rem}
.split{display:grid;grid-template-columns:1.05fr .95fr;gap:64px;align-items:start}
.split-c{align-items:center}
.split-r>div:first-child{order:2}
.foto-r{margin:0}
.znak img{max-width:320px;margin:0 auto}
.znak-s{height:58px;width:auto;margin-top:18px}
.ticks{list-style:none;margin:18px 0;padding:0;display:grid;gap:10px}
.ticks li{display:flex;gap:12px;align-items:flex-start}.ticks .ck{color:var(--zel-d);margin-top:4px}
.ticks-w .ck{color:var(--zel)}
.ticks-s{gap:8px;margin:10px 0 0}
.scn-ph{border-radius:var(--r);aspect-ratio:16/10;box-shadow:var(--sh)}
.scn-ph svg{position:absolute;inset:0}

/* karty služeb */
.kars{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.kar{display:flex;flex-direction:column;background:#fff;border-radius:var(--r);overflow:hidden;color:var(--ink);text-decoration:none;box-shadow:var(--sh);transition:transform .35s var(--ease),box-shadow .35s}
.kar-f{position:relative;display:block;aspect-ratio:4/3}
.kar-f .scn{position:absolute;inset:0;transition:transform .6s var(--ease)}
.kar:hover .kar-f .scn{transform:scale(1.05)}
.kar-ic{position:absolute;left:16px;bottom:-22px;width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:var(--zel-d);color:#fff;box-shadow:0 8px 18px -8px rgba(0,0,0,.5);z-index:1}
.kar-ic .ic{width:23px;height:23px}
.kar-t{display:flex;flex-direction:column;gap:6px;padding:32px 20px 20px;flex:1}
.kar-t b{font:700 1.18rem/1.22 var(--f1)}
.kar-t>span{color:var(--muted);font-size:.95rem;line-height:1.55}
.kar-t em{margin-top:auto;padding-top:8px;display:inline-flex;align-items:center;gap:6px;font:600 .95rem var(--f2);font-style:normal;color:var(--zel-d)}
.box{background:#fff;border-radius:var(--r);padding:26px;box-shadow:var(--sh)}
.box h3,.box .h3{margin-top:0}
.box-dark{background:var(--sed-2);color:#E3E8E5}.box-dark .kicker{color:var(--zel)}
.box-dark a.mail-j{color:#fff;text-decoration:underline}
.box-dark .small{color:#BCC4C0}

/* kalendář péče */
.kal{display:grid;grid-template-columns:minmax(0,520px) 1fr;gap:56px;align-items:center}
.kal-p{background:#fff;border-radius:var(--r);padding:30px;box-shadow:var(--sh);min-width:0}
.kal-l{display:flex;flex-direction:column;margin:0 0 6px}
.kal-l span{font:600 .8rem var(--f2);letter-spacing:.14em;text-transform:uppercase;color:var(--zel-d)}
.kal-l b{font:800 clamp(2.2rem,4vw,3.2rem)/1.05 var(--f1);letter-spacing:-.03em}
.kal-list{list-style:none;margin:0;padding:0;display:grid;gap:18px}
.kal-list h3{margin:0;font-size:1.1rem}.kal-list h3 span{color:var(--zel-d)}
html.js .kal-list>li{display:none}
html.js .kal-list>li.is-cur{display:block}
html.js .kal-list>li.is-cur h3{display:none}
.anim .kal-list>li.is-cur{animation:kal .5s var(--ease) both}
@keyframes kal{from{transform:translateY(12px)}to{transform:none}}
.kal-pozn{margin-top:22px}

/* manifest */
.mf{padding:90px 0 40px;background:var(--krem)}
.mf-t{margin:0;font:800 clamp(2.8rem,8.6vw,7.2rem)/1 var(--f1);letter-spacing:-.04em;color:var(--ink)}
.mf-hl{color:var(--zel-d);font-weight:300;background:linear-gradient(var(--zel),var(--zel)) 0 90%/100% .12em no-repeat;transition:background-size 1.2s var(--ease) .3s}
.anim .mf.pre .mf-hl{background-size:0 .12em}
.mf-s{max-width:62ch;margin-top:26px;font-size:1.1rem;color:var(--muted)}

/* signature: sekačka srovná trávník */
.tr{padding:10px 0 0;overflow:hidden}
.tr-in{position:relative;display:flex;align-items:flex-end;gap:2px;height:58px;max-width:1220px;margin:0 auto;padding:0 32px}
.tr-in i{display:block;flex:1 1 0;height:calc(var(--h) * 22px);border-radius:60% 60% 0 0/100% 100% 0 0;background:linear-gradient(0deg,var(--zel-d),var(--zel));transform-origin:50% 100%}
.tr-in i:nth-child(3n){background:linear-gradient(0deg,var(--zel-dd),#6DAE38)}
.sk-m{position:absolute;bottom:0;left:-80px;width:70px;height:auto;z-index:2}
html:not(.anim) .sk-m{display:none}
.anim .tr.go i{transform:scaleY(calc(1.15 / var(--h)));transition:transform .25s ease-out;transition-delay:calc(var(--i) * 52ms + .15s)}
.anim .tr.go .sk-m{left:calc(100% + 10px);transition:left 3.6s linear}
.tr-top{position:absolute;left:0;right:0;top:-58px;padding:0}

/* signature: návrh a realizace */
.nr-wrap{display:grid;grid-template-columns:.8fr 1.2fr;gap:56px;align-items:center}
.nr{position:relative;aspect-ratio:3/2;border-radius:var(--r);overflow:hidden;box-shadow:var(--sh);background:var(--papir);touch-action:pan-y;user-select:none}
.nr-a,.nr-b{position:absolute;inset:0}
.nr-b{clip-path:inset(0 0 0 var(--p))}
.nr svg{display:block;width:100%;height:100%}
.pl-n .pl-bg{fill:var(--papir)}

.pl-n path,.pl-n circle,.pl-n ellipse,.pl-n rect:not(.pl-bg){fill:none;stroke:var(--sed);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.pl-n .pl-hedge{stroke:var(--zel-d);stroke-width:3;stroke-dasharray:none}
.pl-n .pl-fl circle{stroke:#B26BD1}
.pl-n .pl-grid path{stroke:#E3E8DA;stroke-width:1}
.pl-lab text{font:500 15px var(--f1);fill:var(--sed);text-anchor:middle}
.anim .nr.pre .pl-n [pathLength]{stroke-dasharray:1;stroke-dashoffset:1}
.anim .nr.go .pl-n [pathLength]{stroke-dasharray:1;stroke-dashoffset:0;transition:stroke-dashoffset 1.6s ease-in-out}
.pl-c .pl-bg{fill:#D9CDB2}
.pl-c .pl-house{fill:#A2ABAD;stroke:var(--sed);stroke-width:3}
.pl-c .pl-hedge{fill:none;stroke:#3E7A24;stroke-width:16;stroke-linecap:round}
.pl-c .pl-lawn{fill:#8BC34A}
.pl-c .pl-bed{fill:#6B4E35}
.pl-c .pl-pond{fill:#6FB3D2;stroke:#9C9584;stroke-width:6}
.pl-c .pl-stone ellipse{fill:#C9C1AF;stroke:#A39B88;stroke-width:1.5}
.pl-c .pl-grass circle{fill:#C9B36A;stroke:#A08A45;stroke-width:2}
.pl-c .pl-tree{fill:#4E8F2E;fill-opacity:.92;stroke:#2E5A14;stroke-width:3}
.pl-c .pl-trunk{fill:#6B4E35}
.pl-c .pl-fl circle:nth-child(odd){fill:#E86A9A}.pl-c .pl-fl circle:nth-child(even){fill:#F3C640}
.nr-tag{position:absolute;top:14px;z-index:3;padding:6px 12px;border-radius:999px;font:600 .82rem/1 var(--f2);pointer-events:none}
.nr-tag-a{left:14px;background:#fff;color:var(--sed);box-shadow:0 2px 6px rgba(0,0,0,.12)}
.nr-tag-b{right:14px;background:var(--zel-d);color:#fff}
.nr-in{position:absolute;inset:0;z-index:4;width:100%;height:100%;margin:0;background:transparent;-webkit-appearance:none;appearance:none;cursor:ew-resize;color:transparent}
.nr-in::-webkit-slider-runnable-track{height:100%;background:transparent}
.nr-in::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:52px;height:100%;background:transparent;border:0}
.nr-in::-moz-range-track{height:100%;background:transparent}
.nr-in::-moz-range-thumb{width:52px;height:100%;background:transparent;border:0}
.nr-in:focus-visible{outline:none}
.nr-in:focus-visible+.nr-h span{position:absolute;top:50%;left:50%;width:48px;height:48px;margin:-24px 0 0 -24px;border-radius:50%;background:#fff;box-shadow:0 6px 16px -4px rgba(0,0,0,.4);
  display:grid;place-items:center;font:700 22px/1 var(--f1);color:var(--sed);letter-spacing:6px;padding-left:6px}
.nr-h span::before{content:"‹›"}
html:not(.js) .nr-b{clip-path:inset(0 0 0 50%)}
html:not(.js) .nr-in,html:not(.js) .nr-h{display:none}

/* postup */
.pst{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:20px;counter-reset:p}
.pst li{position:relative;background:#fff;border-radius:var(--r);padding:26px 22px;box-shadow:var(--sh)}
.pst-n{display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:var(--zel);color:var(--ink);font:800 1.2rem var(--f1)}
.pst h3{margin:16px 0 6px;font-size:1.2rem}.pst p{margin:0;color:var(--muted);font-size:.96rem}
.pst-w{grid-template-columns:1fr;gap:12px}
.pst-w li{background:rgba(255,255,255,.05);box-shadow:none;border:1px solid rgba(255,255,255,.1);display:grid;grid-template-columns:46px 1fr;gap:4px 16px;padding:16px 18px}
.pst-w .pst-n{grid-row:span 2}.pst-w h3{margin:2px 0 0;color:#fff}.pst-w p{color:#BCC4C0}

/* výzva */
.cta{position:relative;background:var(--sed-2);color:#E3E8E5;padding:96px 0 80px}
.cta h2{color:#fff}.cta .kicker{color:var(--zel)}
.cta .kicker::before{background:linear-gradient(#fff,#fff) 50% 25%/2px 40% no-repeat,linear-gradient(#fff,#fff) 70% 50%/40% 2px no-repeat}
.cta-in{display:grid;grid-template-columns:1.2fr .8fr;gap:40px;align-items:center}
.cta-in p{color:#BCC4C0;max-width:56ch}
.cta-b{display:flex;flex-wrap:wrap;gap:12px;justify-content:flex-end}

/* patička */
.ft{background:var(--sed-3);color:#B9C1BD;font-size:.95rem}
.ft-in{display:grid;grid-template-columns:1.4fr .8fr 1fr 1.1fr;gap:40px;padding-top:64px;padding-bottom:48px}
.ft-logo img{height:54px;width:auto}.ft-brand p{margin-top:16px;max-width:38ch}
.ft-h{font:600 .82rem var(--f2);letter-spacing:.12em;text-transform:uppercase;color:#fff;margin:6px 0 14px}
.ft ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.ft a{color:#DCE2DF;text-decoration:none}.ft a:hover{color:#fff;text-decoration:underline}
.ft-k li,.ft-k a{display:flex;gap:10px;align-items:flex-start}.ft-k .ic{margin-top:3px;color:var(--zel)}
.ft-ico{line-height:1.6}
.ft-b{border-top:1px solid rgba(255,255,255,.08)}
.ft-b-in{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 24px;padding-top:18px;padding-bottom:22px;font-size:.86rem}

/* hlavička podstránky */
.phead{background:var(--krem);padding:34px 0 64px}
.phead-in{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.phead h1{margin-top:.15em;font-size:clamp(2.2rem,4vw,3.6rem)}
.phead-f{position:relative;margin:0}
.phead-simple{padding:34px 0 30px}.phead-simple .lead{margin-bottom:0}
.crumbs ol{list-style:none;margin:0 0 18px;padding:0;display:flex;flex-wrap:wrap;gap:6px;font-size:.88rem;color:var(--muted)}
.crumbs li+li::before{content:"/";margin-right:6px;color:var(--line)}
.crumbs a{color:var(--muted)}
.anim .phead-f .scn-ph{animation:otevri 1.1s var(--ease) both}
@keyframes otevri{from{clip-path:circle(8% at 70% 30%)}to{clip-path:circle(80% at 50% 50%)}}

/* kotvy, karty, kontakt */
.kotvy{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.kotvy a{display:flex;align-items:center;gap:12px;min-height:64px;padding:14px 18px;background:#fff;border-radius:var(--r);box-shadow:var(--sh);color:var(--ink);text-decoration:none;font:600 1.05rem/1.2 var(--f1)}
.kotvy a .ic{width:26px;height:26px;flex-basis:26px;color:var(--zel-d)}
.kotvy a:hover{box-shadow:0 0 0 2px var(--zel),var(--sh)}
.karta{background:#fff;border-radius:var(--r);padding:28px;box-shadow:var(--sh)}
.z-ic{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:var(--krem-2);color:var(--zel-d)}.z-ic .ic{width:26px;height:26px}
.kgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.kcard{display:flex;flex-direction:column;gap:6px;background:#fff;border-radius:var(--r);padding:26px;box-shadow:var(--sh);color:var(--ink);text-decoration:none;min-width:0}
.kcard small{color:var(--muted);font-size:.85rem;margin-top:10px}.kcard b{font:700 1.18rem/1.3 var(--f1);overflow-wrap:anywhere}
a.kcard:hover{box-shadow:0 0 0 2px var(--zel),var(--sh)}
.kcard a.mail-j{display:inline-block;min-height:30px;padding:2px 0}
.dl{margin:0}.dl div{display:grid;grid-template-columns:150px 1fr;gap:12px;padding:10px 0;border-bottom:1px solid var(--line)}
.dl dt{color:var(--muted);font-size:.92rem}.dl dd{margin:0;font-weight:600}
.prose{max-width:780px}.prose h2{font-size:1.45rem;margin-top:1.6em}
.onas-box{padding:32px}

/* poptávka */
.pp{display:grid;grid-template-columns:1.35fr .65fr;gap:44px;align-items:start}
.form{background:#fff;border-radius:var(--r);padding:34px;box-shadow:var(--sh);display:grid;gap:22px}
.fld{display:grid;gap:7px;min-width:0}
.fld label,.chips legend{font:600 1.02rem/1.2 var(--f1)}
.fld label i{color:var(--zel-d);font-style:normal}
.fld input,.fld select,.fld textarea{width:100%;font:400 16px/1.4 var(--f2);padding:13px 14px;border:2px solid var(--line);border-radius:10px;background:var(--krem);color:var(--ink)}
.fld input:focus,.fld select:focus,.fld textarea:focus{outline:none;border-color:var(--zel-d);background:#fff}
.fld.is-err input,.fld.is-err textarea{border-color:#B3261E;background:#FFF5F4}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.chips{border:0;margin:0;padding:0;min-width:0;display:flex;flex-wrap:wrap;gap:8px}
.chips legend{margin-bottom:10px;padding:0}
.chips small{font:400 .88rem var(--f2);color:var(--muted)}
.chip{position:relative;cursor:pointer}
.chip input{position:absolute;width:1px;height:1px;clip:rect(0 0 0 0);clip-path:inset(50%)}
.chip span{display:inline-flex;align-items:center;min-height:44px;padding:8px 16px;border-radius:999px;border:2px solid var(--line);background:var(--krem);font:500 .95rem/1.2 var(--f2)}
.chip input:checked+span{background:var(--zel-d);color:#fff;border-color:var(--zel-d)}
.chip input:focus-visible+span{outline:3px solid var(--ink);outline-offset:2px}
.kdy{display:flex;gap:14px;align-items:flex-start;background:#F0F6E6;border-radius:12px;padding:14px 16px;margin-top:-6px}
.kdy[hidden]{display:none}
.kdy>.ic{color:var(--zel-d);width:26px;height:26px;flex-basis:26px;margin-top:2px}
.kdy b{font:600 1rem var(--f1)}
.kdy ul{margin:4px 0 0;padding-left:18px;font-size:.94rem}
.anim .kdy.nove{animation:kal .45s var(--ease) both}
.f-hint{margin:-8px 0 0;font-size:.9rem;color:var(--muted)}
.hp{position:absolute;left:0;top:0;clip:rect(0 0 0 0);clip-path:inset(50%);width:1px;height:1px;overflow:hidden}
.msg{padding:14px 16px;border-radius:10px;font-weight:600}
.msg-ok{background:#E7F3EA;color:#1D5B2E}.msg-err{background:#FCE9E7;color:#8E1F17}
.f-uk{background:var(--krem);padding:10px 12px;border-radius:10px}
.form .btn{justify-self:start}
.pp-side{display:grid;gap:18px;position:sticky;top:calc(var(--hd) + 20px)}
.big-tel{display:block;font:700 1.9rem/1.2 var(--f1);color:#fff;text-decoration:none;margin:4px 0 12px}
.sec-form{padding-top:24px}

/* zpět nahoru */
.to-top{position:fixed;right:18px;bottom:18px;z-index:800;width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:var(--zel-d);color:#fff;transform:translateY(90px);transition:transform .3s var(--ease)}
.to-top.is-on{transform:none}
html.menu-open{overflow:hidden}

/* odhalování: jen transform a clip-path */
.anim .rv{transition:transform .8s var(--ease),clip-path .8s var(--ease)}
.anim .rv.rv-pre{transform:translateY(34px);clip-path:inset(0 0 12% 0 round 14px)}
@media(hover:none){.btn::before{display:none}.kar:hover .kar-f .scn{transform:none}.btn-ghost:hover,.btn-line:hover{color:var(--ink);border-color:var(--line)}.cta .btn-line:hover,.sec-dark .btn-line:hover{color:#fff;border-color:rgba(255,255,255,.7)}}

/* responzivita */
@media(min-width:1600px){.wrap,.tr-in{max-width:1320px}}
@media(max-width:1599px){.nav-tel{display:none}}
@media(max-width:1280px){.nav ul a{padding:10px 8px}.nav ul a::after{left:8px;right:8px}.nav{gap:10px}.logo img{height:48px}.kars{grid-template-columns:repeat(3,1fr)}}
@media(max-width:1180px){
  .burger{display:block}.hd-tel{display:inline-flex}
  .hd-in{gap:12px}.logo{margin-right:auto}
  .nav-tel{display:inline-flex}
  .nav{position:fixed;left:0;right:0;top:var(--hd);z-index:999;display:none;flex-direction:column;align-items:stretch;gap:14px;margin:0;padding:16px 24px 28px;background:var(--krem);box-shadow:0 24px 40px -20px rgba(0,0,0,.5);overflow-y:auto}
  .nav.is-open{display:flex}
  .nav ul{flex-direction:column;gap:0}
  .nav ul a{padding:14px 6px;font-size:1.2rem;border-bottom:1px solid var(--line)}
  .nav ul a::after{display:none}
  .kal,.nr-wrap,.phead-in,.split,.pp{grid-template-columns:1fr;gap:40px}
  .split-r>div:first-child{order:0}
  .pp-side{position:static}
  .ft-in{grid-template-columns:1fr 1fr}
  .cta-in{grid-template-columns:1fr}.cta-b{justify-content:flex-start}
  .phead-f,.split>.scn-ph,.split>.foto-r{max-width:680px}
  .kars{grid-template-columns:1fr 1fr}
  .pst{grid-template-columns:1fr 1fr}
  .hero-g{gap:36px}
  .kal .hod{max-width:480px}
}
html:not(.js) .burger{display:none!important}
html:not(.js) .nav{position:static;display:flex;flex-direction:row;flex-wrap:wrap;padding:0;background:none;box-shadow:none}
html:not(.js) .hd-in{flex-wrap:wrap;padding:10px 0}
html:not(.js) .nav ul{flex-direction:row;flex-wrap:wrap}
html:not(.js) .nav ul a{border:0;font-size:1rem;padding:8px}
@media(max-width:1000px){.kgrid,.kotvy{grid-template-columns:1fr 1fr}.hero-g{grid-template-columns:1fr;min-height:0}.hero-f .hod{max-width:460px}}
@media(max-width:820px){:root{--hd:72px}.logo img{height:44px}.sec{padding:72px 0}.facts{grid-template-columns:1fr 1fr}.facts li:nth-child(2){border-right:0}.facts li:nth-child(-n+2){border-bottom:1px solid rgba(255,255,255,.12)}}
@media(max-width:700px){
  .wrap,.tr-in{padding:0 20px}
  body{font-size:16px}
  .hero-g{gap:22px;padding-top:18px;padding-bottom:30px}
  .hero h1{font-size:2.3rem}
  .hero .kicker{margin-bottom:.6em}
  .hero .lead{font-size:1rem;line-height:1.52;margin-bottom:0}
  .hero-btns{gap:10px;margin-top:18px;flex-wrap:nowrap}
  .hero-btns .btn{flex:1 1 0;min-width:0;padding:12px 10px;font-size:.98rem}
  .hero-btns .arr{display:none}
  .hero-f .hod{max-width:380px}
  .facts li{padding:12px 10px}.facts b{font-size:1.22rem}.facts li>span{font-size:.8rem;line-height:1.3}
  .kars,.kgrid,.pst{grid-template-columns:1fr}
  .row2{grid-template-columns:1fr}
  .form{padding:22px 16px}
  .kal-p{padding:22px 18px}
  .ft-in{grid-template-columns:1fr}
  .dl div{grid-template-columns:1fr;gap:2px}
  .btns .btn,.cta-b .btn{flex:1 1 100%}
  .phead{padding:24px 0 48px}
  .mf{padding:64px 0 30px}
  .tr-in{height:44px}.tr-in i{height:calc(var(--h) * 16px)}.sk-m{width:54px}
  .tr-top{top:-44px}
  .nr{aspect-ratio:4/3}
  .nr-tag{top:10px;font-size:.76rem}
}
@media(max-width:480px){.kotvy{grid-template-columns:1fr}}
@media(max-width:380px){.wrap,.tr-in{padding:0 16px}.hero h1{font-size:2rem}.hero .lead{font-size:.95rem}.hd-tel{display:none}.logo img{height:40px}.big-tel{font-size:1.6rem}.to-top{width:40px;height:40px;right:10px;bottom:10px}.hero-btns .btn{font-size:.92rem;padding:12px 8px}}
@media(max-height:500px) and (orientation:landscape){.hero-g{padding-top:16px;padding-bottom:22px}.hero h1{font-size:2rem}.hero .lead{font-size:.95rem;line-height:1.45}.hero-btns{margin-top:12px}.hero-btns .btn{min-height:46px;padding:10px 14px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
.facts b a{display:inline-flex;align-items:center;min-height:32px}
.scn-plan svg{position:absolute;inset:0}

/* opravy po testerovi 21. 10. */
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
html:not(.js) .js-only,html:not(.js) .kal-l{display:none}
html:not(.js) .hd-tel,html:not(.js) .to-top{display:none}
html:not(.js) .hd-in{padding-left:4px}
.nr:focus-within .nr-h span{box-shadow:0 0 0 4px var(--zel-d),0 6px 16px -4px rgba(0,0,0,.4)}
.mq:hover .mq-r,.mq:focus-within .mq-r{animation-play-state:paused}
@media(max-width:480px){.hd-m{min-width:42px;min-height:40px;font-size:13px}}
@media(max-width:700px){
  .kar{flex-direction:row;align-items:stretch}
  .kar-f{flex:0 0 36%;aspect-ratio:auto;min-height:120px}
  .kar-ic{display:none}
  .kar-t{padding:14px 16px;gap:4px}
  .kar-t b{font-size:1.06rem}.kar-t>span{font-size:.9rem;line-height:1.45}
  .kars{gap:12px}
  .sec-form{padding-top:8px}
}

/* fotky klienta (25. 10. 2026): karty, hlavičky, pás v úvodu, galerie, plán, lightbox */
.kar-f>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.kar:hover .kar-f>img{transform:scale(1.05)}
.phead-foto{border-radius:var(--r);overflow:hidden;box-shadow:var(--sh);background:var(--krem-2)}
.ph-img{width:100%;aspect-ratio:16/10;object-fit:cover}
.anim .phead-foto{animation:otevri 1.1s var(--ease) both}
.phead-foto figcaption{position:absolute;left:14px;right:14px;bottom:14px;display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;width:fit-content;max-width:calc(100% - 28px);
  padding:8px 14px;border-radius:12px;background:rgba(31,36,38,.82);color:#E3E8E5;font:500 .86rem/1.35 var(--f2)}
.phead-foto figcaption span{font:600 .72rem/1.2 var(--f2);letter-spacing:.12em;text-transform:uppercase;color:var(--zel)}
.fx{margin:0;min-width:0}
.fx img{width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:var(--r);box-shadow:var(--sh)}
.fx figcaption{margin-top:10px;font-size:.88rem;color:var(--muted);padding-left:2px}
.fx-dark figcaption{color:#AEB7B3}
/* úvod: odkaz na realizace s kulatými náhledy (kruh jako ciferník) */
.hero-fot{display:inline-flex;align-items:center;gap:14px;margin-top:26px;padding:8px 18px 8px 8px;border-radius:999px;background:#fff;box-shadow:var(--sh);color:var(--ink);text-decoration:none;max-width:100%}
.hero-fot-i{display:flex;flex:0 0 auto}
.hero-fot-i img{width:52px;height:52px;border-radius:50%;object-fit:cover;border:3px solid #fff;box-shadow:0 0 0 2px var(--zel)}
.hero-fot-i img+img{margin-left:-14px}
.hero-fot-t{display:flex;flex-direction:column;line-height:1.25;min-width:0}
.hero-fot-t b{font:700 1rem var(--f1)}.hero-fot-t span{font-size:.84rem;color:var(--muted)}
.hero-fot .arr{color:var(--zel-d);transition:transform .2s}
.hero-fot:hover{box-shadow:0 0 0 2px var(--zel),var(--sh);color:var(--ink)}.hero-fot:hover .arr{transform:translateX(3px)}
.sec-head-r{max-width:none;display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:18px 40px}
.sec-head-r>div{max-width:720px}.sec-head-r>div>p:last-child{color:var(--muted);font-size:1.08rem;margin-bottom:0}
.sec-head-r h2{margin-bottom:.35em}
/* mozaika v úvodu */
.mz-sec{padding-bottom:72px}
.mz{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1.5fr 1fr 1fr;grid-template-rows:1fr 1fr;gap:16px}
.mz-big{grid-row:span 2}
.mz .gal-i,.mz .gal-i img{height:100%}
.mz .gal-i img{width:100%;object-fit:cover;aspect-ratio:auto}
.mz-big .gal-i img{min-height:100%}
/* galerie */
.gal{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.gal-p.gal-4{grid-template-columns:repeat(4,1fr)}
.gal-i{position:relative;display:block;border-radius:var(--r);overflow:hidden;box-shadow:var(--sh);color:#fff;text-decoration:none;background:var(--krem-2)}
.gal-i img{width:100%;aspect-ratio:4/3;object-fit:cover;transition:transform .6s var(--ease)}
.gal-i:hover img{transform:scale(1.04)}
.gal-i:hover{color:#fff}
.gal-cap{position:absolute;left:0;right:0;bottom:0;padding:26px 14px 12px;font:500 .88rem/1.35 var(--f2);background:linear-gradient(0deg,rgba(31,36,38,.88),rgba(31,36,38,.55) 60%,rgba(31,36,38,0))}
.gal-z{position:absolute;top:10px;right:10px;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.92);color:var(--zel-d);
  transform:scale(.8);transition:transform .3s var(--ease)}
.gal-z .ic{width:20px;height:20px}
.gal-i:hover .gal-z,.gal-i:focus-visible .gal-z{transform:none}
.gal-sec{padding-top:8px;padding-bottom:96px}
.flt{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px}
.flt button{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:8px 16px;border-radius:999px;border:2px solid var(--line);background:#fff;color:var(--ink);
  font:600 .95rem/1.2 var(--f2);cursor:pointer;transition:background .25s,border-color .25s,color .25s}
.flt button small{font:600 .78rem/1 var(--f2);padding:4px 7px;border-radius:999px;background:var(--krem-2);color:var(--muted)}
.flt button:hover{border-color:var(--zel-d)}
.flt button[aria-pressed="true"]{background:var(--zel-d);border-color:var(--zel-d);color:#fff}
.flt button[aria-pressed="true"] small{background:rgba(255,255,255,.2);color:#fff}
html:not(.js) .flt,html:not(.js) .gal-pocet{display:none}
.gal-pocet{margin:0 0 18px}
.gal>li[hidden]{display:none}
.anim .gal>li.gal-in{animation:galin .5s var(--ease) both}
@keyframes galin{from{transform:translateY(14px) scale(.97)}to{transform:none}}
/* ručně kreslený plán: list papíru s páskou */
.pr-sec{background:var(--krem)}
.pr-f{position:relative;margin:0 auto;max-width:480px;transform:rotate(-2deg)}
.pr-f::before{content:"";position:absolute;z-index:2;top:-14px;left:50%;width:120px;height:30px;margin-left:-60px;background:rgba(200,230,168,.85);transform:rotate(3deg);box-shadow:0 1px 3px rgba(0,0,0,.12)}
.pr-a{border-radius:4px;padding:14px;background:#fff;box-shadow:0 2px 4px rgba(35,41,43,.08),0 30px 50px -28px rgba(35,41,43,.55)}
.pr-a img{aspect-ratio:auto;border-radius:2px}
.pr-a:hover img{transform:none}
.pr-f figcaption{margin-top:14px;text-align:center;font-size:.88rem;color:var(--muted);transform:rotate(2deg)}
/* lightbox */
.lb{position:fixed;inset:0;z-index:2000;background:rgba(20,24,25,.96);display:flex;align-items:center;justify-content:center;padding:64px 76px 84px}
.lb[hidden]{display:none}
.lb-img{max-width:100%;max-height:calc(100vh - 210px);max-height:calc(100dvh - 210px);width:auto;height:auto;border-radius:6px;box-shadow:0 20px 60px -20px rgba(0,0,0,.8)}
.lb button{position:absolute;width:52px;height:52px;border-radius:50%;border:0;background:rgba(255,255,255,.14);color:#fff;font:400 2rem/1 var(--f2);cursor:pointer;transition:background .2s}
.lb button:hover{background:var(--zel-d)}
.lb button:focus-visible{outline:3px solid var(--zel);outline-offset:2px}
.lb-x{top:14px;right:14px}.lb-p{left:14px;top:50%;margin-top:-26px}.lb-d{right:14px;top:50%;margin-top:-26px}
.lb-1 .lb-p,.lb-1 .lb-d{display:none}
.lb-n{position:absolute;top:28px;left:22px;color:var(--zel);font:700 .95rem var(--f1);letter-spacing:.04em}
.lb-f{margin:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;max-width:100%;max-height:100%}
.lb-cap{pointer-events:none;margin:0;max-width:62ch;text-align:center;color:#E3E8E5;font:500 .98rem/1.4 var(--f2)}
html.lb-open{overflow:hidden}
@media(hover:none){.kar:hover .kar-f>img,.gal-i:hover img{transform:none}.gal-z{transform:none}}
@media(max-width:1180px){.split>.fx{max-width:680px}.gal-p.gal-4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:1000px){.gal{grid-template-columns:repeat(2,1fr)}.mz{grid-template-columns:1fr 1fr;grid-template-rows:auto}.mz-big{grid-column:span 2;grid-row:auto}.mz-big .gal-i img{aspect-ratio:4/3}}
@media(max-width:700px){
  .gal,.mz{gap:10px}
  .gal-cap{font-size:.78rem;padding:20px 9px 8px}
  .gal-z{width:32px;height:32px;top:7px;right:7px}.gal-z .ic{width:17px;height:17px}
  .hero-fot{margin-top:16px;gap:10px;padding:6px 14px 6px 6px}
  .hero-fot-i img{width:40px;height:40px}.hero-fot-i img+img{margin-left:-12px}
  .hero-fot-t b{font-size:.95rem}
  .sec-head-r .btn{flex:1 1 100%}
  .flt{gap:6px}.flt button{padding:6px 12px;font-size:.9rem}
  .lb{padding:64px 8px 84px}
  .lb-img{max-height:calc(100vh - 230px);max-height:calc(100dvh - 230px)}
  .lb-f{gap:10px}
  .lb-p,.lb-d{top:auto;bottom:12px;margin:0}
  .lb-cap{padding:0 8px;font-size:.9rem}
  .phead-foto figcaption{left:10px;bottom:10px;max-width:calc(100% - 20px);font-size:.8rem;padding:7px 11px}
  .pr-f{max-width:340px}
  .gal-sec{padding-bottom:72px}
}
@media(max-width:700px){.gal .gal-cap,.mz li:not(.mz-big) .gal-cap{display:none}}

/* Ostrý web gardentime.cz, SEO start 2. 11. 2026: časté dotazy, články, řádek Související, Rady v úvodu a v patičce.
   Připojuje se na konec style.css jen v ostrém buildu (MW_OSTRY=1). Barvy a písma z proměnných webu. */
.akt{margin:14px 0 0}
.kgrid-4{grid-template-columns:repeat(4,1fr)}
.kgrid-4 .kcard b{font-size:1.08rem}
.sv{padding:30px 0 92px;border-top:1px solid var(--line)}
.sv-p{margin:0;max-width:900px;line-height:1.9}
.sv-p b{font-family:var(--f1);margin-right:4px}
.ft-h2{margin-top:28px}
.faq-w .sec-head{margin-bottom:28px}
.faq{display:grid;gap:12px;max-width:860px}
.faq-i{background:#fff;border-radius:var(--r);box-shadow:var(--sh)}
.faq-i summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:56px;padding:16px 22px;cursor:pointer;border-radius:var(--r)}
.faq-i summary::-webkit-details-marker{display:none}
.faq-i summary h3{margin:0;font-size:1.12rem;line-height:1.3}
.faq-i summary:hover h3{color:var(--zel-d)}
.faq-z{position:relative;flex:0 0 28px;width:28px;height:28px;border-radius:50%;background:var(--krem-2)}
.faq-z::before,.faq-z::after{content:"";position:absolute;left:50%;top:50%;width:12px;height:2px;margin:-1px 0 0 -6px;background:var(--zel-d);transition:transform .3s var(--ease)}
.faq-z::after{transform:rotate(90deg)}
.faq-i[open] .faq-z::after{transform:rotate(0deg)}
.faq-a{padding:0 22px 18px}
.faq-a p:last-child{margin-bottom:0}
.sec-alt .faq-i{background:#fff}
.cl h2{font-size:1.5rem;margin-top:1.7em}
.cl h2:first-child{margin-top:0}
.cl ol,.cl ul{margin:0 0 1.2em;padding-left:1.3em;display:grid;gap:8px}
.cl li::marker{color:var(--zel-d);font-weight:700}
.cl-dl{margin:6px 0 16px;background:#fff;border-radius:var(--r);padding:8px 22px;box-shadow:var(--sh)}
.cl-dl div:last-child{border-bottom:0}
.cl-dl dt{font:700 1.02rem var(--f1);color:var(--zel-dd)}
.cl-dl dd{font-weight:400}
.cil-box{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);box-shadow:none;color:#E3E8E5}
.cil-box .kicker{color:var(--zel)}
.cil-box .small{color:#BCC4C0}
.cil-f{font-size:1.08rem;line-height:1.6}.cil-f b{color:#fff;font-family:var(--f1)}
.sec-dark a:not(.btn){color:var(--zel-l)}
@media(max-width:1180px){.kgrid-4{grid-template-columns:1fr 1fr}}
@media(max-width:700px){.sv{padding-bottom:64px}.kgrid-4{grid-template-columns:1fr}.faq-i summary{padding:14px 16px}.faq-a{padding:0 16px 16px}.faq-i summary h3{font-size:1.04rem}.cl-dl{padding:6px 16px}}
/* kontrast odkazů na krémovém podkladu sec-alt (zel-dd 6,6:1 místo zel-d 4,3:1) */
.sec-alt .sec-head a,.sec-alt .faq-a a{color:var(--zel-dd)}