/* LoderLand - wireframe fáze · paleta 1 (limetka) · Space Grotesk + Manrope */
/* @font-face START - kopie assets/fonts/fonts.css, needitovat zde (tools/seo-head.py) */
@font-face{font-family:'Space Grotesk';font-style:normal;font-weight:300 700;font-display:swap;
  src:url(/assets/fonts/space-grotesk-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-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Space Grotesk';font-style:normal;font-weight:300 700;font-display:swap;
  src:url(/assets/fonts/space-grotesk-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:'Manrope';font-style:normal;font-weight:200 800;font-display:swap;
  src:url(/assets/fonts/manrope-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-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Manrope';font-style:normal;font-weight:200 800;font-display:swap;
  src:url(/assets/fonts/manrope-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 END */
*{margin:0;padding:0;box-sizing:border-box}
:root{
  --paper:#FAF8F4;
  --ink:#1C1A16;
  --muted:#6F6A60;
  --line:#E7E3DB;
  --accent:#A6BC3F;
  --wf:#ECE9E2;
  --wf2:#DDD9CF;
}
body{font-family:'Manrope',sans-serif;background:var(--paper);color:var(--ink);
     font-size:16px;line-height:1.65;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.wrap{max-width:1360px;margin:0 auto;padding:0 48px}

/* ---------- navigace ---------- */
.nav{border-bottom:1px solid var(--line);background:var(--paper);position:sticky;top:0;z-index:20}
/* chytry header - pri scrollu dolu se schova, pri scrollu nahoru organicky vyjede */
.nav{transition:transform .65s cubic-bezier(.23,.86,.24,1)}
.nav.nav-hide{transform:translateY(-100%)}
.hero-dark .nav-f.nav-fly{position:fixed;left:0;right:0;top:0;z-index:30;background:var(--paper);
    border-bottom:1px solid var(--line);transition:transform .65s cubic-bezier(.23,.86,.24,1);
    animation:navfly .65s cubic-bezier(.23,.86,.24,1)}
@keyframes navfly{from{transform:translateY(-100%)}to{transform:none}}
.hero-dark .nav-f.nav-fly.nav-up{transform:translateY(-100%)}
.hero-dark .nav-f.nav-fly .menu a,.hero-dark .nav-f.nav-fly .mtoggle{color:var(--ink)}
.hero-dark .nav-f.nav-fly .b6{--b6-c:var(--ink);--b6-on:var(--paper)}
.nav-in{max-width:1360px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;
        height:80px;padding:0 48px;gap:24px}
.logo img{height:42px;width:auto}
.menu{display:flex;gap:36px;list-style:none}
.menu a{font-size:12px;font-weight:600;letter-spacing:.18em;text-transform:uppercase}
.menu a:hover{color:var(--muted)}
.menu a.on{color:var(--muted);border-bottom:2px solid var(--accent);padding-bottom:4px}

/* ---------- dropdown "Pro koho" ---------- */
.menu li{position:relative}
.mtoggle{display:inline-flex;align-items:center;gap:8px;font-size:12px;font-weight:600;
    letter-spacing:.18em;text-transform:uppercase;cursor:default}
.mtoggle::after{content:"";width:6px;height:6px;margin-top:-3px;
    border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;
    transform:rotate(45deg);transition:transform .2s ease,margin .2s ease}
/* otevřeno myší (hover) nebo klávesnicí (:focus-visible) - ne kliknutím myší, jinak by fokus
   držel podnabídku otevřenou i po odjetí kurzoru */
.has-drop:hover .mtoggle::after,.has-drop:has(:focus-visible) .mtoggle::after{transform:rotate(225deg);margin-top:3px}
.mtoggle.on{color:var(--muted);border-bottom:2px solid var(--accent);padding-bottom:4px}
.drop{position:absolute;top:calc(100% + 18px);left:50%;transform:translate(-50%,8px);min-width:250px;
    background:var(--paper);border:1px solid var(--line);box-shadow:0 20px 44px rgba(28,26,22,.1);
    padding:8px 0;list-style:none;opacity:0;visibility:hidden;z-index:30;
    /* zavírání s krátkou prodlevou - odpustí šikmý pohyb myši k položce */
    transition:opacity .2s ease .12s,transform .2s ease .12s,visibility 0s linear .32s}
.drop::before{content:"";position:absolute;top:-19px;left:0;right:0;height:19px}
.has-drop:hover .drop,.has-drop:has(:focus-visible) .drop{opacity:1;visibility:visible;transform:translate(-50%,0);
    transition:opacity .2s ease,transform .2s ease,visibility 0s}
.menu .drop a{display:block;padding:12px 22px;white-space:nowrap;color:var(--ink)}
.menu .drop a:hover{color:var(--ink);background:#F4F1EA;box-shadow:inset 3px 0 0 var(--accent)}
.menu .drop a.on{border-bottom:none;padding-bottom:12px;color:var(--muted);box-shadow:inset 3px 0 0 var(--accent)}
.hero-dark .mtoggle{color:#FAF8F4}
.hero-dark .menu .drop a{color:var(--ink)}
.hero-dark .menu .drop a.on{color:var(--muted)}

/* ---------- mobilní menu (hamburger) ----------
   Pod 1200 px se .menu a tlačítko v navigaci nevejdou (logo se smršťuje, tlačítko přetéká),
   proto je nahradí .burger. Panel .mm staví wf.js z položek desktopového menu (jediný zdroj
   pravdy v HTML). Odhalení clip-path shora, položky naskakují postupně (--i), linky
   hamburgeru se plynule promění v křížek. */
.logo{flex:0 0 auto}
.burger{display:none;align-items:center;gap:14px;height:44px;padding:0 0 0 10px;background:none;border:0;
    cursor:pointer;color:var(--ink);font:600 12px/1 'Manrope',sans-serif;letter-spacing:.18em;
    text-transform:uppercase;-webkit-tap-highlight-color:transparent}
.burger:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
.burger-ico{position:relative;width:26px;height:14px;flex:0 0 auto}
.burger-ico i{position:absolute;right:0;height:2px;background:currentColor;
    transition:top .55s cubic-bezier(.23,.86,.24,1),width .55s cubic-bezier(.23,.86,.24,1),
    transform .55s cubic-bezier(.23,.86,.24,1)}
.burger-ico i:first-child{top:0;width:26px}
.burger-ico i:last-child{top:12px;width:15px}
@media (hover:hover){.burger:hover .burger-ico i:last-child{width:26px}}
.burger.is-x .burger-ico i{top:6px;width:26px}
.burger.is-x .burger-ico i:first-child{transform:rotate(45deg)}
.burger.is-x .burger-ico i:last-child{transform:rotate(-45deg)}
.hero-dark .nav-f .burger{color:var(--paper)}
.hero-dark .nav-f.nav-fly .burger{color:var(--ink)}

.mm{--mm-px:48px;position:fixed;inset:0;z-index:80;display:flex;flex-direction:column;
    background:var(--paper);color:var(--ink);overflow-y:auto;overscroll-behavior:contain;
    clip-path:inset(0 0 100% 0);visibility:hidden;
    transition:clip-path .55s cubic-bezier(.23,.86,.24,1),visibility 0s linear .55s}
.mm.on{clip-path:inset(0 0 0 0);visibility:visible;
    transition:clip-path .75s cubic-bezier(.23,.86,.24,1),visibility 0s}
html.mm-lock,html.mm-lock body{overflow:hidden}
.mm-top{flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;gap:24px;
    height:var(--mm-h,80px);padding:0 var(--mm-px);border-bottom:1px solid var(--line)}
.mm-top .logo img{height:42px;width:auto}
.mm-list{flex:1 0 auto;list-style:none;padding:10px var(--mm-px) 0}
.mm-list>li{border-bottom:1px solid var(--line)}
.mm-a{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;padding:18px 0;
    background:none;border:0;cursor:pointer;text-align:left;color:var(--ink);
    font-family:'Space Grotesk',sans-serif;font-weight:400;font-size:clamp(26px,4.4vw,40px);
    line-height:1.1;letter-spacing:-.02em;-webkit-tap-highlight-color:transparent}
.mm-a:focus-visible,.mm-sub a:focus-visible,.mm-kontakt a:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.mm-t{transition:transform .45s cubic-bezier(.23,.86,.24,1)}
@media (hover:hover){.mm-a:hover .mm-t{transform:translateX(8px)}}
/* aktuální stránka - limetkové podtržení jako rukopisný akcent v sekci Ateliér */
.mm-a.on .mm-t{box-shadow:inset 0 -.14em 0 rgba(166,188,63,.6)}
.mm-plus{position:relative;width:16px;height:16px;flex:0 0 auto}
.mm-plus::before,.mm-plus::after{content:"";position:absolute;left:0;top:7px;width:16px;height:2px;
    background:currentColor;transition:transform .45s cubic-bezier(.23,.86,.24,1)}
.mm-plus::after{transform:rotate(90deg)}
.mm-grp.open .mm-plus::after{transform:rotate(0deg)}
.mm-sub{display:grid;grid-template-rows:0fr;transition:grid-template-rows .5s cubic-bezier(.23,.86,.24,1)}
.mm-grp.open .mm-sub{grid-template-rows:1fr}
.mm-sub>ul{min-height:0;overflow:hidden;list-style:none}
.mm-sub>ul::after{content:"";display:block;height:14px}
.mm-sub a{position:relative;display:block;padding:9px 0 9px 22px;font-size:15.5px;line-height:1.4;color:var(--muted);
    transition:color .2s ease}
.mm-sub a::before{content:"";position:absolute;left:0;top:50%;width:10px;height:2px;background:var(--accent);
    transition:width .3s cubic-bezier(.23,.86,.24,1)}
.mm-sub a.on,.mm-sub a:hover{color:var(--ink)}
.mm-sub a.on::before{width:14px}
.mm-foot{flex:0 0 auto;display:grid;gap:22px;padding:30px var(--mm-px) calc(30px + env(safe-area-inset-bottom))}
.mm-foot .b6{justify-content:center;width:100%}
.mm-kontakt{display:flex;flex-wrap:wrap;gap:6px 24px;font-size:14px;color:var(--muted)}
.mm-kontakt a:hover{color:var(--ink)}
/* postupné naskočení položek po odhalení panelu */
.mm-anim{opacity:0;transform:translateY(16px);transition:opacity .25s ease,transform .25s ease}
.mm.on .mm-anim{opacity:1;transform:none;
    transition:opacity .6s ease,transform .75s cubic-bezier(.23,.86,.24,1);
    transition-delay:calc(.18s + var(--i,0) * .05s)}
@media(max-width:1200px){
  .nav-in>.menu,.nav-in>.b6{display:none}
  .burger{display:inline-flex}
}
@media(min-width:1201px){.mm{display:none}}
@media(max-width:760px){.mm{--mm-px:22px}}
@media (prefers-reduced-motion: reduce){
  .mm{clip-path:none;opacity:0;transition:opacity .2s ease,visibility 0s linear .2s}
  .mm.on{clip-path:none;opacity:1;transition:opacity .2s ease,visibility 0s}
  .mm-anim,.mm.on .mm-anim{opacity:1;transform:none;transition:none}
  .burger-ico i,.mm-t,.mm-plus::before,.mm-plus::after,.mm-sub{transition:none}
}

/* ---------- tlačítka B6 - rámeček s mezerami, úvodní linka ----------
   .b6      = HLAVNÍ: limetková výplň uvnitř rámečku v tmavším odstínu limetky (tón v tónu)
   .b6-sec  = SEKUNDÁRNÍ: jen rámeček bez výplně
   hover obou = výplň --b6-c, text --b6-on, mezery v rámečku se zavřou
   Mezery jsou skutečné díry (maska na ::after), ne záplaty v barvě pozadí - fungují
   i přes fotku. Výplň končí uvnitř 2px rámečku (background-clip), takže díry ukazují pozadí.
   --b6-c/--b6-on přepínají tmavé kontexty (hero, band) - týkají se sekundárního. */
@property --b6-ta{syntax:'<length>';inherits:false;initial-value:8px}
@property --b6-tk{syntax:'<length>';inherits:false;initial-value:18px}
@property --b6-r1{syntax:'<length>';inherits:false;initial-value:22px}
@property --b6-k1{syntax:'<length>';inherits:false;initial-value:18px}
@property --b6-r2{syntax:'<length>';inherits:false;initial-value:8px}
@property --b6-k2{syntax:'<length>';inherits:false;initial-value:7px}
.b6{--b6-c:var(--ink);--b6-on:var(--paper);
    --b6-fill:var(--accent);--b6-f:color-mix(in srgb,var(--accent) 70%,var(--ink));--b6-t:var(--ink);--b6-line:var(--ink);
    position:relative;display:inline-flex;align-items:center;padding:12px 20px 12px 44px;
    font-family:'Manrope',sans-serif;font-size:11.5px;font-weight:600;letter-spacing:.16em;line-height:1.35;
    text-transform:uppercase;color:var(--b6-t);white-space:nowrap;cursor:pointer;
    background-color:var(--b6-fill);background-clip:padding-box;border:2px solid transparent;
    text-decoration:none;user-select:none;
    transition:background-color .3s ease-in-out,color .3s ease-in-out,padding .3s ease-in-out}
.b6:hover{--b6-fill:var(--b6-c);--b6-f:var(--b6-c);--b6-t:var(--b6-on);--b6-line:var(--accent);padding-left:36px;padding-right:28px}
.b6-sec{--b6-fill:transparent;--b6-f:var(--b6-c);--b6-t:var(--b6-c);--b6-line:var(--accent)}
/* úvodní linka */
.b6::before{content:"";position:absolute;left:16px;top:50%;width:18px;height:2px;background:var(--b6-line);
    transform:translateY(-50%);transition:width .3s linear,background-color .3s ease-in-out}
/* rámeček: 2px přes okraj tlačítka, mezera nahoře vlevo a dvě dole vpravo */
.b6::after{content:"";position:absolute;inset:-2px;border:2px solid var(--b6-f);pointer-events:none;
    -webkit-mask:linear-gradient(#000 0 0) left/2px 100% no-repeat,linear-gradient(#000 0 0) right/2px 100% no-repeat,
        linear-gradient(to right,#000 var(--b6-ta),#0000 0 calc(var(--b6-ta) + var(--b6-tk)),#000 0) top/100% 2px no-repeat,
        linear-gradient(to left,#000 var(--b6-r2),#0000 0 calc(var(--b6-r2) + var(--b6-k2)),#000 0 var(--b6-r1),#0000 0 calc(var(--b6-r1) + var(--b6-k1)),#000 0) bottom/100% 2px no-repeat;
    mask:linear-gradient(#000 0 0) left/2px 100% no-repeat,linear-gradient(#000 0 0) right/2px 100% no-repeat,
        linear-gradient(to right,#000 var(--b6-ta),#0000 0 calc(var(--b6-ta) + var(--b6-tk)),#000 0) top/100% 2px no-repeat,
        linear-gradient(to left,#000 var(--b6-r2),#0000 0 calc(var(--b6-r2) + var(--b6-k2)),#000 0 var(--b6-r1),#0000 0 calc(var(--b6-r1) + var(--b6-k1)),#000 0) bottom/100% 2px no-repeat;
    transition:--b6-tk .5s ease-out,--b6-ta .3s ease-out,--b6-k1 .5s ease-out,--b6-r1 .3s ease-out,
        --b6-k2 .5s ease-out,--b6-r2 .3s ease-out,border-color .3s ease-in-out}
/* CRM portál: zelené CTA (.of-green/.pk-green/.zs-green) = hlavní tlačítko; jejich inline
   styly (border:none, rámeček ink) se tady přebijí vyšší specifičností */
.b6.of-green,.b6.pk-green,.b6.zs-green{border:2px solid transparent;background-color:var(--b6-fill);background-clip:padding-box}
.b6.of-green::after,.b6.pk-green::after,.b6.zs-green::after{border-color:var(--b6-f)}
.b6:hover::before{width:11px}
.b6:hover::after{--b6-ta:0px;--b6-tk:0px;--b6-r1:0px;--b6-k1:0px;--b6-r2:0px;--b6-k2:0px}
.b6:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
@media (prefers-reduced-motion: reduce){.b6,.b6::before,.b6::after{transition:none}}

/* ---------- hero (homepage, tmavá verze z nástřelu) ---------- */
.hero-dark{position:relative}
.hero-dark .nav-f{position:absolute;top:0;left:0;right:0;z-index:6;background:transparent;
    border-bottom:1px solid rgba(250,248,244,.22)}
.hero-dark .nav-f .nav-in{height:88px}
.hero-dark .menu a{color:#FAF8F4}
.hero-dark .b6{--b6-c:var(--paper);--b6-on:var(--ink)}
.hero-dark .hero{position:relative;min-height:86vh;display:flex;flex-direction:column;justify-content:flex-end}
.hero-dark .hero-bg{position:absolute;inset:0;overflow:hidden}
.hero-dark .hero-bg img{width:100%;height:100%;object-fit:cover}
.hero-dark .hero-bg::after{content:"";position:absolute;inset:0;
    background:linear-gradient(180deg,rgba(20,19,15,.62) 0%,rgba(20,19,15,.2) 30%,rgba(20,19,15,.2) 62%,rgba(20,19,15,.5) 100%)}
.hero-dark .hero-content{position:relative;z-index:2;width:100%;max-width:1360px;margin:0 auto;padding:120px 48px 64px;
    background:radial-gradient(ellipse 62% 78% at 28% 72%,rgba(20,19,15,.6),rgba(20,19,15,0) 74%)}
.hero-dark .hero-h{font-family:'Space Grotesk',sans-serif;font-size:clamp(44px,6vw,80px);font-weight:300;
    line-height:1.02;letter-spacing:-.025em;max-width:14ch;margin-bottom:36px;
    color:#FAF8F4;text-shadow:0 2px 28px rgba(0,0,0,.35)}
.hero-dark .hero-foot{display:flex;justify-content:space-between;align-items:flex-end;gap:48px;flex-wrap:wrap}
.hero-dark .lede{color:rgba(250,248,244,.9)}

/* ---------- hlavička podstránky ---------- */
.phead{padding:104px 0 64px;border-bottom:1px solid var(--line)}
.phead h1{font-family:'Space Grotesk',sans-serif;font-size:clamp(38px,5vw,64px);font-weight:300;
    line-height:1.05;letter-spacing:-.025em;max-width:18ch;margin-bottom:24px}
.kick{font-size:11px;font-weight:600;letter-spacing:.3em;text-transform:uppercase;
    color:var(--muted);margin-bottom:20px;display:flex;align-items:center;gap:14px}
.kick::before{content:"";width:32px;height:2px;background:var(--accent);flex:0 0 auto}
.lede{font-size:17px;line-height:1.7;color:var(--muted);max-width:52ch}

/* ---------- sekce ---------- */
.sec{padding:88px 0;border-bottom:1px solid var(--line)}
.sec h2,.svc-pin h2{font-family:'Space Grotesk',sans-serif;font-size:clamp(26px,3vw,38px);font-weight:300;
    letter-spacing:-.02em;line-height:1.15;max-width:24ch;margin-bottom:14px}
.sec .lead,.svc-pin .lead{color:var(--muted);max-width:60ch;margin-bottom:44px}
.svc-pin .lead{margin-bottom:0}
.sec-head{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;flex-wrap:wrap;margin-bottom:44px}
.sec-head h2,.sec-head .lead{margin-bottom:0}

/* ---------- wireframe placeholder ---------- */
.ph{position:relative;background:repeating-linear-gradient(45deg,var(--wf),var(--wf) 9px,#F4F1EA 9px,#F4F1EA 18px);
    border:1px solid var(--wf2);display:flex;align-items:center;justify-content:center;text-align:center;
    color:var(--muted);font-family:ui-monospace,'SF Mono',Menlo,monospace;font-size:10px;
    letter-spacing:.16em;text-transform:uppercase;padding:12px;min-height:64px}
.r169{aspect-ratio:16/9}.r43{aspect-ratio:4/3}.r34{aspect-ratio:3/4}.r11{aspect-ratio:1/1}
.h120{min-height:120px}.h200{min-height:200px}.h320{min-height:320px}
/* aspect-ratio + min-height umi roztahnout sirku nad kontejner (mobil: 16/9 x 320 = 569 px) */
.ph,.fimg{max-width:100%}

/* ---------- mřížky a karty ---------- */
.g2{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.g3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.g4{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.card{border:1px solid var(--line);padding:32px 28px;display:flex;flex-direction:column;gap:14px;
      transition:border-color .2s ease}
a.card:hover{border-color:var(--ink)}
.card h3{font-family:'Space Grotesk',sans-serif;font-weight:500;font-size:19px;letter-spacing:-.01em}
.card p{font-size:14.5px;color:var(--muted)}
.card .ph{margin-bottom:6px}
.card .more{margin-top:auto;font-size:12px;font-weight:600;letter-spacing:.18em;text-transform:uppercase}
.card .more::after{content:" →"}
.num{font-family:'Space Grotesk',sans-serif;font-size:13px;color:var(--muted);letter-spacing:.1em}

/* ---------- kroky procesu ---------- */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;counter-reset:krok}
.step{border-top:2px solid var(--ink);padding-top:20px}
.step::before{counter-increment:krok;content:"0" counter(krok);
    font-family:'Space Grotesk',sans-serif;font-size:13px;letter-spacing:.14em;color:var(--muted);
    display:block;margin-bottom:12px}
.step h3{font-family:'Space Grotesk',sans-serif;font-weight:500;font-size:17px;margin-bottom:8px}
.step p{font-size:14px;color:var(--muted)}

/* ---------- čísla / statistiky ---------- */
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.stat{border:1px solid var(--line);padding:28px}
.stat b{font-family:'Space Grotesk',sans-serif;font-weight:300;font-size:40px;letter-spacing:-.02em;display:block}
.stat span{font-size:13px;color:var(--muted);text-transform:uppercase;letter-spacing:.14em}

/* ---------- FAQ ---------- */
.faq{border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;
    gap:24px;padding:22px 4px;font-family:'Space Grotesk',sans-serif;font-weight:500;font-size:17px}
.faq summary{position:relative;padding-right:38px}
.faq summary::before,.faq summary::after{content:"";position:absolute;right:8px;top:50%;width:16px;height:2px;
    background:var(--muted);transform:translateY(-50%);
    transition:transform .4s cubic-bezier(.23,.86,.24,1),background .25s ease}
.faq summary::after{transform:translateY(-50%) rotate(90deg)}
.faq details[open] summary::before,.faq details[open] summary::after{background:var(--accent)}
.faq details[open] summary::after{transform:translateY(-50%) rotate(0deg)}
@media (prefers-reduced-motion: reduce){.faq summary::before,.faq summary::after{transition:none}}
.faq .a{padding:0 4px 24px;color:var(--muted);max-width:70ch;font-size:15px}

/* ---------- formulářový wireframe ---------- */
.frm{display:grid;gap:14px;max-width:640px}
.fld{background:var(--wf);border:1px solid var(--wf2);min-height:54px;display:flex;align-items:center;
     padding:0 18px;color:var(--muted);font-family:ui-monospace,'SF Mono',Menlo,monospace;
     font-size:10px;letter-spacing:.16em;text-transform:uppercase}
.fld.ta{min-height:130px;align-items:flex-start;padding-top:16px}
.frm-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}

/* ---------- tabulka položek (klientská nabídka) ---------- */
.tbl{border:1px solid var(--line)}
.tbl .tr{display:grid;grid-template-columns:1fr auto;gap:24px;padding:18px 22px;border-bottom:1px solid var(--line);
     align-items:center}
.tbl .tr:last-child{border-bottom:none}
.tbl .tr.sum{background:var(--ink);color:var(--paper);font-family:'Space Grotesk',sans-serif;font-size:18px}
.tbl .tr small{display:block;color:var(--muted);font-size:13px}
.tbl .tr.sum small{color:rgba(250,248,244,.7)}
.price{font-family:'Space Grotesk',sans-serif;white-space:nowrap}

/* ---------- tagy / filtr ---------- */
.tags{display:flex;gap:10px;flex-wrap:wrap}
.tag{border:1px solid var(--line);padding:8px 16px;font-size:12px;letter-spacing:.1em;
     text-transform:uppercase;color:var(--muted);cursor:pointer;transition:border-color .2s ease,color .2s ease}
.tag:hover{border-color:var(--ink);color:var(--ink)}
.tag.on{border-color:var(--ink);color:var(--ink);box-shadow:inset 0 -2px 0 var(--accent)}

/* ---------- CTA pás - jediná centrovaná sekce webu (záměrně, ať přitáhne pozornost) ---------- */
.band{--band-img:url('/assets/foto/cta/tunel-2000.webp');
    background:
      radial-gradient(ellipse 70% 80% at 50% 50%,rgba(28,26,22,.42),rgba(28,26,22,0) 72%),
      linear-gradient(rgba(28,26,22,.74),rgba(28,26,22,.82)),
      var(--band-img) center 60%/cover no-repeat,var(--ink);
    color:var(--paper);padding:152px 0;text-align:center}
@media(max-width:1000px){.band{--band-img:url('/assets/foto/cta/tunel-1000.webp')}}
.band .wrap{display:flex;flex-direction:column;align-items:center}
.band h2{font-family:'Space Grotesk',sans-serif;font-weight:300;font-size:clamp(34px,4.6vw,64px);
    letter-spacing:-.02em;line-height:1.08;max-width:16ch;margin:0 auto;text-wrap:balance}
.band p{color:rgba(250,248,244,.75);max-width:52ch;margin:24px auto 0;text-wrap:balance}
.band .b6{--b6-c:var(--paper);--b6-on:var(--ink)}
.band-cta{display:flex;flex-direction:column;align-items:center;gap:24px;margin-top:48px}
.band-cta .b6{margin-top:0}
.band-cta .more{font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;
    color:rgba(250,248,244,.72);display:inline-flex;align-items:center;gap:10px;transition:color .2s ease}
.band-cta .more::after{content:"\2192";color:var(--accent);transition:transform .55s cubic-bezier(.23,.86,.24,1)}
.band-cta .more:hover{color:var(--paper)}
.band-cta .more:hover::after{transform:translateX(6px)}

/* ---------- poznámka wireframu ---------- */
.wf-note{background:var(--wf);border:1px dashed var(--wf2);padding:14px 18px;
    font-family:ui-monospace,'SF Mono',Menlo,monospace;font-size:10.5px;letter-spacing:.1em;
    text-transform:uppercase;color:var(--muted);margin-top:28px}

/* ---------- parametry (case study) ---------- */
.params{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;border:1px solid var(--line);padding:28px}
.params div b{font-family:'Space Grotesk',sans-serif;font-weight:500;font-size:15px;display:block}
.params div span{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}

/* ---------- patička ---------- */
.foot{border-top:1px solid var(--line);padding:72px 0 0;margin-top:0}
.foot-g{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:40px;padding-bottom:56px}
.foot .logo img{height:38px;margin-bottom:18px}
.foot p,.foot li,.foot a{font-size:14px;color:var(--muted)}
.foot ul{list-style:none;display:grid;gap:8px}
.foot h4{font-size:11px;letter-spacing:.24em;text-transform:uppercase;margin-bottom:16px}
.foot a:hover{color:var(--ink)}
.foot-b{border-top:1px solid var(--line);padding:22px 0;display:flex;justify-content:space-between;
    gap:24px;flex-wrap:wrap;font-size:12px;color:var(--muted)}

/* ---------- carousel realizací ---------- */
.car-track{display:flex;gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;
    scrollbar-width:none;-ms-overflow-style:none;padding-bottom:4px}
.car-track::-webkit-scrollbar{display:none}
.car-card{position:relative;flex:0 0 auto;width:min(640px,82%);aspect-ratio:16/10;
    scroll-snap-align:start;overflow:hidden;border:1px solid var(--wf2);
    background:repeating-linear-gradient(45deg,var(--wf),var(--wf) 9px,#F4F1EA 9px,#F4F1EA 18px)}
.car-tag{position:absolute;top:18px;left:20px;z-index:2;font-family:ui-monospace,'SF Mono',Menlo,monospace;
    font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.car-card::after{content:"";position:absolute;inset:0;
    background:linear-gradient(180deg,rgba(20,19,15,0) 36%,rgba(20,19,15,.45) 68%,rgba(20,19,15,.86) 100%);
    transition:opacity .3s ease}
.car-cap{position:absolute;left:0;right:0;bottom:0;z-index:3;padding:28px;color:var(--paper)}
.car-cap h3{font-family:'Space Grotesk',sans-serif;font-weight:500;font-size:23px;
    letter-spacing:-.01em;margin-bottom:6px}
.car-cap p{font-size:14.5px;line-height:1.55;color:rgba(250,248,244,.82);max-width:52ch;margin-bottom:14px}
.car-cap .more{font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;
    color:var(--paper);display:inline-flex;align-items:center;gap:10px}
.car-cap .more::after{content:"→";color:var(--accent);transition:transform .55s cubic-bezier(.23,.86,.24,1)}
.car-card:hover .more::after{transform:translateX(6px)}
/* ---------- sluzby na homepage - pinned sekce s horizontalnim posunem ---------- */
.svc-pin{position:relative;border-bottom:1px solid var(--line)}
.svc-sticky{position:sticky;top:0;height:100vh;overflow:hidden;
    display:flex;flex-direction:column;justify-content:center;gap:44px}
.svc-sticky .wrap{width:100%}
.svc-track{display:flex;gap:20px;will-change:transform;
    padding-left:calc((100vw - min(1360px,100vw))/2 + 48px);padding-right:48px}
.svc-prog{position:absolute;left:48px;right:48px;bottom:30px;height:2px;background:var(--line);
    opacity:0;transition:opacity .35s ease}
.svc-prog.vis{opacity:1}
.svc-prog span{display:block;height:100%;width:0;background:var(--accent)}
.svc-static{height:auto!important}
.svc-static .svc-sticky{position:static;height:auto;padding:96px 0;overflow:visible}
.svc-static .svc-track{overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;
    scroll-padding-left:calc((100vw - min(1360px,100vw))/2 + 48px)}
.svc-static .svc-track::-webkit-scrollbar{display:none}
.svc-static .svc-prog{display:none}
/* L-motiv z loga - fotka odsazena stridave dole/nahore, karta tvori pismeno L */
.svc-gap-b .svc-ph,.svc-gap-t .svc-ph{min-height:0}
.svc-gap-b .svc-ph{margin-bottom:72px}
.svc-gap-t .svc-ph{margin-top:72px}
.svc-img{background-size:cover;background-position:center}
/* sluzby - siroke barevne karty pod sebou, stridani strany fotky i L-mezery */
.svc-list{display:grid;gap:26px;margin-top:40px}
.svc-list .svc-card{width:100%;min-height:500px}
.svc-list .svc-card.rev{grid-template-columns:6fr 5fr}
.svc-list .svc-card.rev .svc-txt{grid-column:2;grid-row:1}
.svc-list .svc-card.rev .svc-ph{grid-column:1;grid-row:1;border-left:none;border-right:1px solid var(--line)}
.svc-list .svc-txt p{max-width:58ch}

/* akvarelova paleta pilir karet - lehke barevne prani z keyframovych ilustraci */
.svc-track .svc-card:nth-child(1),.svc-list .svc-card:nth-child(1){background:
    radial-gradient(90% 75% at 12% 8%,rgba(166,188,63,.20),transparent 62%),
    radial-gradient(75% 65% at 88% 90%,rgba(120,150,50,.12),transparent 58%),#F2F5E6}
.svc-track .svc-card:nth-child(2),.svc-list .svc-card:nth-child(2){background:
    radial-gradient(90% 75% at 85% 10%,rgba(96,140,170,.18),transparent 62%),
    radial-gradient(75% 65% at 10% 92%,rgba(96,140,170,.10),transparent 58%),#EAF0F3}
.svc-track .svc-card:nth-child(3),.svc-list .svc-card:nth-child(3){background:
    radial-gradient(90% 75% at 14% 90%,rgba(193,108,74,.16),transparent 62%),
    radial-gradient(75% 65% at 86% 8%,rgba(193,108,74,.09),transparent 58%),#F6ECE5}
.svc-track .svc-card:nth-child(4),.svc-list .svc-card:nth-child(4){background:
    radial-gradient(90% 75% at 88% 88%,rgba(196,158,72,.18),transparent 62%),
    radial-gradient(75% 65% at 12% 10%,rgba(196,158,72,.10),transparent 58%),#F7F1DF}
.fimg{border:1px solid var(--wf2)}
/* obsahove prvky kategorii */
.why{list-style:none;display:grid;gap:14px;margin-top:8px;padding:0}
.why li{position:relative;padding-left:26px;color:var(--muted);line-height:1.65}
.why li::before{content:"";position:absolute;left:0;top:9px;width:9px;height:9px;background:var(--accent)}
.why li b{color:var(--ink);font-weight:600}
.check{display:grid;gap:16px}
.check div{position:relative;padding-left:34px;color:var(--muted);line-height:1.6}
.check div b{color:var(--ink);font-weight:600}
.check svg{position:absolute;left:0;top:3px;width:19px;height:19px;stroke:var(--accent);stroke-width:2.6;fill:none}
.fcap{font-size:13px;color:var(--muted);margin-top:12px;max-width:76ch;line-height:1.6}
.steps{list-style:none;counter-reset:st;display:grid;gap:18px;padding:0}
.steps li{position:relative;padding-left:54px;color:var(--muted);line-height:1.6;counter-increment:st}
.steps li::before{content:counter(st,decimal-leading-zero);position:absolute;left:0;top:1px;
    font-family:'Space Grotesk',sans-serif;font-weight:500;font-size:16px;color:var(--accent)}
.steps li b{color:var(--ink);font-weight:600}

/* ---------- sluzby na homepage - velke split karty (text + foto) v horizontalnim scrollu ---------- */
.svc-card{flex:0 0 auto;width:min(980px,90%);min-height:430px;display:grid;grid-template-columns:5fr 6fr;
    scroll-snap-align:start;border:1px solid var(--line);background:var(--paper);transition:border-color .2s ease}
a.svc-card:hover{border-color:var(--ink)}
.svc-txt{padding:44px;display:flex;flex-direction:column;align-items:flex-start;gap:16px}
.svc-txt h3{font-family:'Space Grotesk',sans-serif;font-weight:400;font-size:clamp(22px,2.4vw,31px);
    letter-spacing:-.01em;max-width:15ch}
.svc-txt p{font-size:15px;line-height:1.6;color:var(--muted);max-width:42ch}
.svc-txt .more{margin-top:auto;font-size:12px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;
    display:inline-flex;align-items:center;gap:10px}
.svc-txt .more::after{content:"→";color:var(--accent);transition:transform .55s cubic-bezier(.23,.86,.24,1)}
a.svc-card:hover .more::after{transform:translateX(6px)}
.svc-ph{border:none;border-left:1px solid var(--line);min-height:100%}

/* ---------- ocard - sjednocena karta: fotka pres celou plochu + overlay + text (styl realizaci) ---------- */
.ocard{position:relative;display:block;aspect-ratio:4/3;overflow:hidden;border:1px solid var(--wf2);
    background:repeating-linear-gradient(45deg,var(--wf),var(--wf) 9px,#F4F1EA 9px,#F4F1EA 18px) center/cover;
    color:var(--paper)}
.ocard::after{content:"";position:absolute;inset:0;
    background:linear-gradient(180deg,rgba(20,19,15,0) 30%,rgba(20,19,15,.45) 60%,rgba(20,19,15,.88) 100%)}
a.ocard{transition:border-color .5s ease}
a.ocard:hover{border-color:var(--ink)}
.ocard .ph-note{position:absolute;top:14px;left:16px;z-index:2;font-family:ui-monospace,'SF Mono',Menlo,monospace;
    font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.ocap{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:22px 24px}
.ocap .ometa{font-family:ui-monospace,'SF Mono',Menlo,monospace;font-size:10px;letter-spacing:.16em;
    text-transform:uppercase;color:rgba(250,248,244,.72);margin-bottom:8px}
.ocap h3{font-family:'Space Grotesk',sans-serif;font-weight:500;font-size:20px;letter-spacing:-.01em;color:var(--paper)}
.ocap p{font-size:14px;line-height:1.55;color:rgba(250,248,244,.82);margin-top:8px;max-width:52ch}
.orev{max-height:0;opacity:0;transform:translateY(14px);overflow:hidden;
    transition:max-height .8s cubic-bezier(.23,.86,.24,1),opacity .6s ease .05s,transform .8s cubic-bezier(.23,.86,.24,1)}
a.ocard:hover .orev,a.ocard:focus-visible .orev{max-height:180px;opacity:1;transform:none}
.orev .more{font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--paper);
    display:inline-flex;align-items:center;gap:10px;margin-top:12px}
.orev .more::after{content:"\2192";color:var(--accent);transition:transform .55s cubic-bezier(.23,.86,.24,1)}
a.ocard:hover .orev .more::after{transform:translateX(6px)}
.g2 .ocard{aspect-ratio:16/9}
.g4 .ocard{aspect-ratio:3/4}
@media(max-width:760px){
  .orev{max-height:none;opacity:1;transform:none}
}

/* ---------- realizace - grid karty s overlay ---------- */
.rgrid{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:start}
.rcard{position:relative;display:block;aspect-ratio:6/4;overflow:hidden;border:1px solid var(--wf2);will-change:transform;
    background:repeating-linear-gradient(45deg,var(--wf),var(--wf) 9px,#F4F1EA 9px,#F4F1EA 18px)}
.rcard::after{content:"";position:absolute;inset:0;
    background:linear-gradient(180deg,rgba(20,19,15,0) 34%,rgba(20,19,15,.45) 62%,rgba(20,19,15,.88) 100%);
    transition:opacity .3s ease}
.rcap{position:absolute;left:0;right:0;bottom:0;z-index:3;padding:30px;color:var(--paper)}
.rcap h3{font-family:'Space Grotesk',sans-serif;font-weight:500;font-size:24px;letter-spacing:-.01em}
.rmeta{font-family:ui-monospace,'SF Mono',Menlo,monospace;font-size:10px;letter-spacing:.16em;
    text-transform:uppercase;color:rgba(250,248,244,.72);margin-bottom:8px}
.rreveal{max-height:0;opacity:0;transform:translateY(14px);overflow:hidden;
    transition:max-height .8s cubic-bezier(.23,.86,.24,1),opacity .6s ease .05s,transform .8s cubic-bezier(.23,.86,.24,1)}
.rcard:hover .rreveal,.rcard:focus-visible .rreveal{max-height:150px;opacity:1;transform:none}
.rreveal p{font-size:14.5px;line-height:1.55;color:rgba(250,248,244,.82);max-width:52ch;
    padding-top:10px;margin-bottom:12px}
.rreveal .more{font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;
    color:var(--paper);display:inline-flex;align-items:center;gap:10px}
.rreveal .more::after{content:"→";color:var(--accent);transition:transform .55s cubic-bezier(.23,.86,.24,1)}
.rcard:hover .rreveal .more::after{transform:translateX(6px)}
/* pastelově zelená dlaždice "Další realizace" - jemný tón brandové limetky */
.rcard-all{display:flex;align-items:center;justify-content:center;
    background:color-mix(in srgb,var(--accent) 16%,var(--paper));
    border:1px solid color-mix(in srgb,var(--accent) 34%,var(--paper));transition:border-color .2s ease,background-color .3s ease}
.rcard-all::after{display:none}
.rcard-all:hover{border-color:var(--ink);background:color-mix(in srgb,var(--accent) 24%,var(--paper))}
.rall{display:flex;flex-direction:column;align-items:center;gap:14px;text-align:center;color:var(--ink)}
.rall h3{font-family:'Space Grotesk',sans-serif;font-weight:500;font-size:26px;letter-spacing:-.01em}
.rall .more{font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;
    color:var(--muted);display:inline-flex;align-items:center;gap:10px}
.rall .more::after{content:"→";color:var(--accent);transition:transform .55s cubic-bezier(.23,.86,.24,1)}
.rcard-all:hover .rall .more::after{transform:translateX(6px)}

.car-nav{display:flex;gap:10px}
.car-btn{width:52px;height:52px;border:1px solid var(--line);background:transparent;cursor:pointer;
    display:inline-flex;align-items:center;justify-content:center;font-size:17px;color:var(--ink);
    transition:border-color .2s ease,background .2s ease}
.car-btn:hover{border-color:var(--ink)}
.car-btn:active{background:var(--wf)}

/* ---------- timeline procesu (vykreslovaná limetková linka) ---------- */
.tl{position:relative;max-width:780px;margin-top:52px}
.tl::before{content:"";position:absolute;left:11px;top:8px;bottom:8px;width:2px;background:var(--line)}
.tl-line{position:absolute;left:11px;top:8px;width:2px;height:0;background:var(--accent);z-index:1}
.tl-step{position:relative;padding:0 0 60px 60px}
.tl-step:last-child{padding-bottom:0}
.tl-dot{position:absolute;left:0;top:2px;width:24px;height:24px;border-radius:50%;z-index:2;
    border:2px solid var(--line);background:var(--paper);
    transition:border-color .35s ease,box-shadow .35s ease}
.tl-dot::after{content:"";position:absolute;inset:5px;border-radius:50%;background:var(--accent);
    transform:scale(0);transition:transform .35s cubic-bezier(.34,1.56,.64,1)}
.tl-step .num{display:block;margin-bottom:8px}
.tl-step h3{font-family:'Space Grotesk',sans-serif;font-weight:500;font-size:20px;
    letter-spacing:-.01em;margin-bottom:8px}
.tl-step p{font-size:15px;color:var(--muted);max-width:56ch}
.tl-body{opacity:.3;transform:translateY(12px);transition:opacity .45s ease,transform .45s ease}
.tl-step.done .tl-dot{border-color:var(--accent);box-shadow:0 0 0 4px rgba(166,188,63,.18)}
.tl-step.done .tl-dot::after{transform:scale(1)}
.tl-step.done .tl-body{opacity:1;transform:none}
@media (prefers-reduced-motion: reduce){
  .tl-line{height:100% !important}
  .tl-body{opacity:1;transform:none;transition:none}
  .tl-dot,.tl-dot::after{transition:none}
}

/* ---------- responzivita ---------- */
@media(max-width:1060px){
  .g4{grid-template-columns:1fr 1fr}
  .steps{grid-template-columns:1fr 1fr;gap:32px 20px}
  .params{grid-template-columns:1fr 1fr;gap:24px}
  .foot-g{grid-template-columns:1fr 1fr}
}
@media(max-width:760px){
  .wrap{padding:0 22px}
  .nav-in{padding:0 22px}
  .menu{display:none}
  .hero-dark .hero-content{padding:96px 22px 44px}
  .phead{padding:72px 0 48px}
  .sec{padding:64px 0}
  .g2,.g3,.g4,.steps,.stats,.frm-row{grid-template-columns:1fr}
  .params{grid-template-columns:1fr}
  .foot-g{grid-template-columns:1fr;gap:32px}
  .car-card{width:88%;aspect-ratio:4/3}
  .car-cap{padding:20px}
  .car-cap h3{font-size:19px}
  .svc-card{width:90%;grid-template-columns:1fr;min-height:0;scroll-snap-align:start}
  .svc-txt{padding:24px;gap:12px}
  .svc-ph{border-left:none;border-top:1px solid var(--line);min-height:220px}
  .svc-gap-b .svc-ph{margin-bottom:0;margin-right:48px}
  .svc-gap-t .svc-ph{margin-top:0;margin-left:48px}
  .svc-list .svc-card{width:100%}
  .svc-list .svc-card.rev .svc-txt{grid-column:1;grid-row:1}
  .svc-list .svc-card.rev .svc-ph{grid-column:1;grid-row:2;border-right:none}
  .svc-pin{height:auto!important}
  .svc-sticky{position:static;height:auto;padding:64px 0;overflow:visible}
  .svc-track{overflow-x:auto;padding-left:22px;padding-right:22px;transform:none!important;
      scroll-snap-type:x mandatory;scrollbar-width:none;scroll-padding-left:22px}
  .svc-track::-webkit-scrollbar{display:none}
  .svc-prog{display:none}
  .rgrid{grid-template-columns:1fr;gap:18px}
  .rcap{padding:20px}
  .rcap h3{font-size:20px}
  .rreveal{max-height:none;opacity:1;transform:none}
  .rreveal p{padding-top:8px}
  .tl-step{padding:0 0 48px 52px}
}

/* CTA band - mobil: tlačítko a odkaz pod sebou, stále na středu */
@media(max-width:760px){
  .band{padding:96px 0}
  .band-cta{gap:22px;margin-top:36px}
}

/* ---------- rezervační kalendář (konzultace) ---------- */
.bk{margin-top:36px;max-width:980px}
.bk-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:28px;align-items:stretch}
.bk-cal{border:1px solid var(--line);background:#fff;padding:22px 22px 18px}
.bk-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.bk-month{font-family:'Space Grotesk',sans-serif;font-size:18px;font-weight:500;letter-spacing:-.01em;text-transform:capitalize}
.bk-nav{background:none;border:1px solid var(--line);width:34px;height:34px;cursor:pointer;
    font-size:15px;color:var(--ink);transition:all .2s ease}
.bk-nav:hover:not(:disabled){border-color:var(--ink)}
.bk-nav:disabled{opacity:.3;cursor:default}
.bk-dow{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;margin-bottom:6px;
    font-family:'Manrope',sans-serif;font-size:10.5px;font-weight:700;letter-spacing:.12em;
    text-transform:uppercase;color:var(--muted);text-align:center}
.bk-days{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}
.bk-day{aspect-ratio:1;border:1px solid transparent;background:none;font-family:'Manrope',sans-serif;
    font-size:13.5px;color:var(--ink);cursor:pointer;position:relative;transition:all .15s ease}
.bk-day:disabled{color:var(--wf2);cursor:default}
.bk-day.av::after{content:"";position:absolute;left:50%;bottom:5px;transform:translateX(-50%);
    width:4px;height:4px;border-radius:50%;background:var(--accent)}
.bk-day.av:hover{border-color:var(--ink)}
.bk-day.sel{background:var(--ink);color:var(--paper)}
.bk-day.sel::after{background:var(--accent)}
.bk-legend{display:flex;align-items:center;gap:8px;margin-top:14px;
    font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.bk-dot{width:5px;height:5px;border-radius:50%;background:var(--accent);display:inline-block}
.bk-slots{border:1px solid var(--line);background:#fff;padding:22px;display:flex;flex-direction:column}
.bk-slots-h{font-family:'Space Grotesk',sans-serif;font-size:16px;font-weight:500;margin-bottom:14px}
.bk-slot-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(88px,1fr));gap:8px;align-content:start}
.bk-slot{border:1px solid var(--line);background:none;padding:11px 6px;font-family:'Manrope',sans-serif;
    font-size:13.5px;font-weight:600;color:var(--ink);cursor:pointer;transition:all .15s ease}
.bk-slot:hover{border-color:var(--ink)}
.bk-slot.sel{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.bk-empty{color:var(--muted);font-size:14px}
.bk-form{display:grid;gap:14px;margin-top:28px;max-width:640px}
.bk-sel{background:var(--wf);border:1px solid var(--wf2);padding:13px 18px;
    font-family:'Manrope',sans-serif;font-size:13px;font-weight:600;letter-spacing:.04em}
.bk-sel.on{background:#F4F7E6;border-color:var(--accent)}
.inp{background:#fff;border:1px solid var(--line);min-height:54px;padding:0 18px;width:100%;
    font-family:'Manrope',sans-serif;font-size:14.5px;color:var(--ink);transition:border-color .2s ease}
.inp:focus{outline:none;border-color:var(--ink)}
.inp::placeholder{color:var(--muted)}
textarea.inp.bk-ta{min-height:120px;padding:14px 18px;resize:vertical;line-height:1.55}
.bk-row{display:flex;gap:26px;flex-wrap:wrap}
.bk-type{display:flex;align-items:center;gap:8px;font-size:14px;cursor:pointer}
.bk-type input{accent-color:var(--accent)}
button.bk-submit{background:none;border:0;justify-self:start}
button.bk-submit:disabled{opacity:.35;cursor:default;pointer-events:none}
.bk-done{border:1px solid var(--accent);background:#F4F7E6;padding:28px 30px;margin-top:28px;max-width:640px}
.bk-done h3{font-family:'Space Grotesk',sans-serif;font-weight:500;font-size:20px;margin-bottom:8px}
.bk-done p{color:var(--muted);font-size:14.5px}
@media(max-width:760px){
  .bk-grid{grid-template-columns:1fr}
}

/* ===== proces "Jak spolupracujeme" - stridava osa, kroky kolem stredove linky s animovanou grafikou ===== */
.proc-sec{padding:112px 0 120px}
.proc-sec .lead{margin-bottom:0}
.proc-tl{position:relative;margin-top:76px}
.proc-rail{position:absolute;left:50%;top:0;bottom:0;width:2px;margin-left:-1px;background:var(--line)}
.proc-fill{position:absolute;left:50%;top:0;width:2px;margin-left:-1px;height:0;background:var(--accent);z-index:1}
.proc-step{position:relative;display:grid;grid-template-columns:1fr 120px 1fr;align-items:center;margin-bottom:132px}
.proc-step:last-child{margin-bottom:0}
.proc-a .proc-txt{grid-column:1;justify-self:end}
.proc-a .proc-media{grid-column:3}
.proc-b .proc-media{grid-column:1}
.proc-b .proc-txt{grid-column:3;justify-self:start}
.proc-dot{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:26px;height:26px;
    border-radius:50%;z-index:2;border:2px solid var(--line);background:var(--paper);
    transition:border-color .35s ease,box-shadow .35s ease}
.proc-dot::after{content:"";position:absolute;inset:5px;border-radius:50%;background:var(--accent);
    transform:scale(0);transition:transform .4s cubic-bezier(.34,1.56,.64,1)}
.proc-step:first-child .proc-dot{top:36%}
.proc-step.on .proc-dot{border-color:var(--accent);box-shadow:0 0 0 6px rgba(166,188,63,.16)}
.proc-step.on .proc-dot::after{transform:scale(1)}
.proc-txt{width:100%;max-width:520px;opacity:.25;transform:translateY(14px);
    transition:opacity .55s ease,transform .55s ease}
.proc-txt .num{display:block;margin-bottom:10px}
.proc-txt h3{font-family:'Space Grotesk',sans-serif;font-weight:500;font-size:27px;line-height:1.22;
    letter-spacing:-.015em;margin-bottom:14px}
.proc-txt p{font-size:16px;line-height:1.72;color:var(--muted);max-width:52ch;margin-bottom:24px}
.proc-chips{display:flex;flex-wrap:wrap;gap:8px}
.proc-chip{border:1px solid var(--line);padding:7px 14px;font-size:12.5px;line-height:1.2;
    letter-spacing:.03em;color:var(--muted);white-space:nowrap}
.proc-txt .b6{margin-top:28px}
.proc-cta{margin-top:28px;display:flex;align-items:center;gap:26px;flex-wrap:wrap}
.proc-txt .proc-cta .b6{margin-top:0}
.proc-cta .more{font-size:12px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;
    color:var(--muted);display:inline-flex;align-items:center;gap:10px;transition:color .2s ease}
.proc-cta .more::after{content:"\2192";color:var(--accent);transition:transform .55s cubic-bezier(.23,.86,.24,1)}
.proc-cta .more:hover{color:var(--ink)}
.proc-cta .more:hover::after{transform:translateX(6px)}
.proc-media{opacity:.25;transform:translateY(14px);mix-blend-mode:multiply;
    transition:opacity .55s ease .08s,transform .55s ease .08s}
.proc-step.on .proc-txt,.proc-step.on .proc-media{opacity:1;transform:none}
/* keyframova grafika - snimky prolinane scrollem, bile pozadi splyva s papirem diky multiply */
.proc-anim{position:relative;width:min(100%,380px);aspect-ratio:2/3;margin:0 auto;will-change:transform;
    -webkit-mask-image:radial-gradient(ellipse at center,#000 55%,transparent 92%);
    mask-image:radial-gradient(ellipse at center,#000 55%,transparent 92%)}
.proc-anim img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;
    opacity:0;transition:opacity .3s ease}
.proc-anim img.on{opacity:1}
@media(max-width:1060px){
  .proc-sec{padding:88px 0 96px}
  .proc-tl{margin-top:56px}
  .proc-step{grid-template-columns:1fr 76px 1fr;margin-bottom:96px}
  .proc-txt h3{font-size:23px}
  .proc-txt p{font-size:15px;margin-bottom:20px}
  .proc-anim{width:min(100%,320px)}
}
@media(max-width:760px){
  .proc-sec{padding:64px 0 72px}
  .proc-tl{margin-top:40px}
  .proc-rail,.proc-fill{left:11px;margin-left:0}
  .proc-step{grid-template-columns:1fr;align-items:start;padding-left:52px;margin-bottom:56px}
  .proc-dot,.proc-step:first-child .proc-dot{left:11px;top:4px;transform:translate(-50%,0);width:24px;height:24px}
  .proc-a .proc-txt,.proc-b .proc-txt{grid-column:1;grid-row:1;justify-self:start;max-width:none}
  .proc-a .proc-media,.proc-b .proc-media{grid-column:1;grid-row:2;margin-top:20px}
  .proc-txt h3{font-size:20px}
  .proc-txt p{margin-bottom:18px}
  .proc-anim{width:min(100%,280px);transform:none!important}
}
@media (prefers-reduced-motion: reduce){
  .proc-txt,.proc-media{opacity:1;transform:none;transition:none}
  .proc-anim{transform:none!important}
  .proc-anim img{opacity:0!important;transition:none}
  .proc-anim img:last-child{opacity:1!important}
  .proc-dot{border-color:var(--accent);transition:none}
  .proc-dot::after{transform:scale(1);transition:none}
}

/* ---------- cookie lišta ---------- */
.ck{position:fixed;left:16px;right:16px;bottom:20px;margin:0 auto;z-index:70;width:min(1060px,calc(100% - 32px));
    background:var(--paper);border:1px solid var(--ink);padding:14px 24px;
    box-shadow:0 24px 60px rgba(28,26,22,.16);
    display:grid;grid-template-columns:1fr auto;gap:12px 40px;align-items:center;
    opacity:0;transform:translateY(18px);pointer-events:none;
    transition:opacity .65s cubic-bezier(.23,.86,.24,1),transform .65s cubic-bezier(.23,.86,.24,1)}
.ck.on{opacity:1;transform:none;pointer-events:auto}
.ck .kick{display:none}
.ck h3{font-family:'Space Grotesk',sans-serif;font-weight:500;font-size:16.5px;letter-spacing:-.01em;margin-bottom:4px}
.ck p{font-size:13px;line-height:1.5;color:var(--muted);margin:0;max-width:580px}
.ck-txt{grid-column:1;grid-row:1}
.ck-akce{grid-column:2;grid-row:1;display:flex;gap:10px;flex-wrap:wrap;align-items:center;justify-content:flex-end}
.ck-btn{font-family:'Manrope',sans-serif;font-size:11.5px;font-weight:600;letter-spacing:.14em;
    text-transform:uppercase;padding:11px 18px;cursor:pointer;border:1px solid var(--ink);
    background:var(--ink);color:var(--paper);transition:all .25s ease}
.ck-btn:hover{background:var(--accent);border-color:var(--accent);color:var(--ink)}
.ck-btn.gh{background:none;color:var(--ink)}
.ck-btn.gh:hover{background:var(--ink);color:var(--paper)}
.ck-upravit{font-family:'Manrope',sans-serif;font-size:12.5px;color:var(--muted);margin-right:8px;
    text-decoration:underline;text-underline-offset:3px;background:none;border:0;cursor:pointer;padding:4px 0}
.ck-upravit:hover{color:var(--ink)}
/* nastavení - kategorie jako záhony */
.ck-rows{display:none;grid-column:1/-1;grid-row:2;margin:0;border-top:1px solid var(--line)}
.ck.detail .ck-rows{display:block}
.ck.detail .ck-intro{display:none}
.ck-row{display:flex;align-items:flex-start;gap:14px;padding:13px 0;border-bottom:1px solid var(--line);cursor:pointer}
.ck-row b{font-family:'Space Grotesk',sans-serif;font-weight:500;font-size:14px;display:block}
.ck-row small{font-size:12.5px;color:var(--muted);line-height:1.5;display:block;margin-top:2px}
.ck-row .vzdy{margin-left:auto;flex:0 0 auto;font-size:11px;font-weight:600;letter-spacing:.14em;
    text-transform:uppercase;color:var(--accent);padding-top:3px}
/* animovaný checkbox - kreslený limetkový check (sdílená komponenta) */
.lchk{position:relative;flex:0 0 auto;display:inline-block;width:22px;height:22px;cursor:pointer}
.lchk input{position:absolute;inset:0;opacity:0;margin:0;cursor:pointer}
.lchk .box{position:absolute;inset:0;border:1px solid var(--ink);background:var(--paper);
    display:grid;place-items:center;transition:border-color .3s ease;pointer-events:none}
.lchk svg{width:16px;height:16px;overflow:visible}
.lchk svg path{fill:none;stroke:var(--accent);stroke-width:3;stroke-linecap:round;stroke-linejoin:round;
    stroke-dasharray:26;stroke-dashoffset:26;
    transition:stroke-dashoffset .55s cubic-bezier(.23,.86,.24,1) .05s}
.lchk input:checked ~ .box{border-color:var(--accent)}
.lchk input:checked ~ .box path{stroke-dashoffset:0}
.lchk input:focus-visible ~ .box{outline:2px solid var(--accent);outline-offset:2px}
.ck-row .lchk{margin-left:auto}
@media(max-width:760px){
  .ck{bottom:16px;padding:20px 20px 18px;grid-template-columns:1fr;gap:14px}
  .ck-txt{grid-column:1;grid-row:auto}
  .ck-akce{grid-column:1;grid-row:auto;justify-content:flex-start}
  .ck-rows{grid-column:1;grid-row:auto}
}
@media (prefers-reduced-motion: reduce){
  .ck{transition:none;transform:none}
  .lchk svg path{transition:none}
}

/* ---------- kontaktní formulář (/kontakt) ----------
   Vstupy ve stejném jazyce jako rezervace (bílé pole, 1px linka, limetkový focus),
   ale s ostrými rohy jako zbytek webu. Odesílání řeší inline skript v kontakt.html. */
.kf{display:grid;gap:16px;max-width:640px;position:relative}
.kf[hidden],.kf-done[hidden]{display:none}
.kf-hp{position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden}
.kf-pole{min-width:0}
.kf-lbl{display:block;font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
    color:var(--muted);margin-bottom:7px}
.kf-lbl span{font-weight:600;letter-spacing:.06em;text-transform:none;color:#A39D90;margin-left:6px}
.kf-inp{display:block;width:100%;background:#fff;border:1px solid var(--line);border-radius:0;padding:14px 18px;
    font-family:'Manrope',sans-serif;font-size:16px;line-height:1.5;color:var(--ink);outline:none;
    -webkit-appearance:none;appearance:none;transition:border-color .2s ease,box-shadow .2s ease}
.kf-inp:hover{border-color:#CFC9BC}
.kf-inp:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(166,188,63,.18)}
.kf-inp[aria-invalid="true"]{border-color:#B4573F}
.kf-inp[aria-invalid="true"]:focus{box-shadow:0 0 0 3px rgba(180,87,63,.14)}
textarea.kf-inp{min-height:150px;resize:vertical}
.kf-err{color:#B4573F;font-size:13px;line-height:1.45;margin-top:7px}
.kf-err:empty{display:none}
.kf-souhlas{display:flex;gap:12px;align-items:flex-start;font-size:14px;line-height:1.55;color:var(--muted);cursor:pointer}
.kf-souhlas .lchk{margin-top:1px}
.kf-souhlas a{color:var(--ink);text-decoration:underline;text-underline-offset:3px}
.kf-akce{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-top:6px}
.kf.posila .b6{opacity:.55;pointer-events:none}
.kf-stav{font-size:14px;line-height:1.55;color:#B4573F}
.kf-stav:empty{display:none}
.kf-stav a{color:inherit;text-decoration:underline;text-underline-offset:3px}
.kf-stav a[href^="tel"]{white-space:nowrap}
.kf-done{border:1px solid var(--accent);background:#F4F7E6;padding:28px 30px;max-width:640px;outline:none}
.kf-done h3{font-family:'Space Grotesk',sans-serif;font-weight:500;font-size:20px;margin-bottom:8px}
.kf-done p{color:var(--muted);font-size:14.5px}
@media(max-width:760px){
  .kf-done{padding:22px 20px}
}