/* Společné díly návrhů od nuly 3–7: ZandaBot průvodce + chat, kruh Reels, hravá sekce s filmem.
   Používá tokeny stránky (--papir, --inkoust, --ruzova, --svetla, --linka, --text2, --e-out …) z návrhu 2. */

/* ===== ZandaBot ===== */
.zb-bot{position:fixed;left:0;top:0;z-index:80;width:76px;height:76px;will-change:transform;pointer-events:auto}
.zb-bot svg:focus-visible{outline:2px solid var(--inkoust);outline-offset:2px;border-radius:50%}
.bot-misto{display:block;width:var(--vel,120px);height:var(--vel,120px);flex:none;pointer-events:none}
.zb-bublina{position:fixed;left:0;top:0;z-index:79;max-width:240px;background:var(--bila,#fff);color:var(--inkoust);font-size:14px;font-weight:560;line-height:1.35;letter-spacing:-.005em;padding:9px 13px;border-radius:14px;box-shadow:0 0 0 1px var(--linka),var(--stin-mal,0 6px 18px rgba(37,33,37,.08));opacity:0;pointer-events:none;cursor:pointer;transition:opacity .22s ease-out;white-space:normal}
.zb-bublina.vidim{opacity:1;pointer-events:auto}
.zb-bublina[data-strana=l]{border-bottom-right-radius:5px}
.zb-bublina[data-strana=p]{border-bottom-left-radius:5px}

/* ===== Chat ===== */
.zb-chat{position:fixed;right:22px;bottom:22px;z-index:78;width:380px;max-height:min(620px,calc(100svh - 110px));display:flex;flex-direction:column;background:var(--bila,#fff);color:var(--inkoust);border-radius:var(--r-karta,20px);overflow:hidden;box-shadow:0 0 0 1px var(--linka),var(--stin-vel,0 12px 32px rgba(37,33,37,.12));opacity:0;transform:translateY(10px) scale(.97);transform-origin:100% 100%;transition:opacity .2s ease-out,transform .26s var(--e-out,cubic-bezier(.2,.8,.2,1));font-size:15px}
.zb-chat.ot{opacity:1;transform:none}
.zb-chat[hidden]{display:none}
.zb-hlava,.zb-volby,.zb-pis{flex:none}
.zb-hlava{display:flex;align-items:center;gap:10px;padding:12px 12px 12px 14px;border-bottom:1px solid var(--linka)}
.zb-hlava-misto{display:block;width:46px;height:46px;flex:none}
.zb-kdo{flex:1;min-width:0;line-height:1.25}
.zb-kdo b{display:block;font-weight:650;font-size:15px}
.zb-kdo span{display:block;font-size:13px;color:var(--text2)}
.zb-zavri{width:44px;height:44px;flex:none;border-radius:var(--r-prvek,10px);display:grid;place-items:center;color:var(--text2);transition:background-color .15s}
.zb-zavri:hover{background:rgba(37,33,37,.06);color:var(--inkoust)}
.zb-zavri svg{width:18px;height:18px}
.zb-zpravy{flex:1 1 auto;min-height:0;overflow-y:auto;padding:16px 14px 6px;display:flex;flex-direction:column;gap:10px;overscroll-behavior:contain}
.zb-zprava{max-width:88%;overflow-wrap:anywhere;padding:10px 13px;border-radius:14px;line-height:1.45;animation:zb-vstup .28s var(--e-out,cubic-bezier(.2,.8,.2,1)) both}
.zb-zprava p+p{margin-top:6px}
.zb-zprava b{font-weight:650}
.zb-zprava a:not(.tl){text-decoration:underline}
.zb-od-bota{align-self:flex-start;background:var(--karta,#F4F1EC);border-bottom-left-radius:5px}
.zb-ode-me{align-self:flex-end;background:var(--inkoust);color:var(--papir);border-bottom-right-radius:5px}
.zb-akce{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.zb-akce .tl{height:36px;padding:0 13px;font-size:14px}
@keyframes zb-vstup{from{opacity:0;transform:translateY(6px)}}
.zb-tecky{display:inline-flex;gap:4px;padding:4px 0}
.zb-tecky i{width:6px;height:6px;border-radius:50%;background:var(--text3,#6F686D);animation:zb-tecka 1.2s ease-in-out infinite}
.zb-tecky i:nth-child(2){animation-delay:.18s}.zb-tecky i:nth-child(3){animation-delay:.36s}
@keyframes zb-tecka{0%,100%{opacity:.3}50%{opacity:1}}
.zb-volby{display:flex;flex-wrap:wrap;gap:6px;padding:8px 14px 10px}
.zb-volba{min-height:40px;font-size:14px;font-weight:560;padding:7px 12px;border-radius:999px;background:var(--svetla);color:var(--inkoust);transition:background-color .16s ease-in,transform .16s var(--e-out,ease)}
.zb-volba:hover{background:#EEDDE3}
.zb-volba:active{transform:scale(.96)}
.zb-dalsi{background:transparent;box-shadow:inset 0 0 0 1px var(--linka2,rgba(37,33,37,.18))}
.zb-pis{display:flex;gap:6px;padding:10px 12px 12px;border-top:1px solid var(--linka)}
.zb-pis input{flex:1;min-width:0;height:40px;border:0;border-radius:10px;background:var(--papir);box-shadow:inset 0 0 0 1px var(--linka);padding:0 12px;font:inherit;font-size:15px;color:var(--inkoust)}
.zb-pis input:focus{outline:none;box-shadow:inset 0 0 0 1.5px var(--inkoust)}
.zb-pis .tl{height:40px;padding:0 14px;font-size:14px}
@media (max-width:759px){
  .zb-chat{left:10px;right:10px;bottom:10px;width:auto;max-height:min(560px,calc(100svh - 84px))}
  .zb-bublina{max-width:200px;font-size:14px}
  .zb-pis input{font-size:16px} /* iOS jinak při psaní přiblíží stránku */
}
/* Telefon na šířku: chat přes celou plochu (nad lištou), zprávy se posouvají, hlava a pole zůstávají */
@media (max-height:500px) and (orientation:landscape) and (max-width:1000px){
  .zb-chat{inset:0;width:auto;max-height:none;height:100%;border-radius:0}
  html.zb-otevreno .lista{z-index:1} /* lišta pod chatem, bot (80) zůstává v hlavě chatu nad ním */
  .zb-hlava{padding-block:6px}
  .zb-hlava-misto{width:36px;height:36px}
  .zb-zpravy{padding-top:10px}
  .zb-volby{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding-block:6px}
  .zb-volby::-webkit-scrollbar{display:none}
  .zb-volba{flex:none;white-space:nowrap}
  .zb-pis{padding-block:6px}
  .zb-pis input{font-size:16px}
}

/* ===== Kruh Reels (z návrhu 51) ===== */
.kruh{position:absolute;inset:0;overflow:hidden;pointer-events:none;--rw:clamp(64px,6vw,112px)}
.kruh-svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.kruh-svg path{fill:none;stroke:var(--inkoust)}
.k-front{stroke-opacity:.32;stroke-width:1.25}
.k-back{stroke-opacity:.14;stroke-width:1}
.k-far{stroke-opacity:.12;stroke-width:1;stroke-dasharray:2 9;stroke-linecap:round}
.kruh .k-front,.kruh .k-back{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.2s cubic-bezier(.6,0,.2,1) .15s}
.kruh .k-far{opacity:0;transition:opacity .9s ease .7s}
.kruh.ready .k-front,.kruh.ready .k-back{stroke-dashoffset:0}
.kruh.ready .k-far{opacity:1}
.kruh-rl{position:absolute;left:0;top:0;z-index:10;will-change:transform,opacity;visibility:hidden;pointer-events:auto}
.kruh.placed .kruh-rl{visibility:visible}
.kruh-in{width:var(--rw);aspect-ratio:9/16;border-radius:calc(var(--rw)*.14);overflow:hidden;background:#EDE9E4;box-shadow:0 0 0 1px var(--linka),var(--stin-mal,0 6px 16px rgba(37,33,37,.10));transition:transform .25s var(--e-out,ease),box-shadow .25s var(--e-out,ease)}
.kruh-in video{width:100%;height:100%;object-fit:cover}
@media (hover:hover) and (pointer:fine){.kruh-rl:hover .kruh-in{transform:scale(1.06);box-shadow:0 0 0 1px var(--linka2,rgba(37,33,37,.18)),0 10px 26px rgba(37,33,37,.16)}}
@media (max-width:999px){.kruh{--rw:clamp(58px,15vw,84px)}}

/* ===== Hravá sekce s filmem (Duolingo, 2D) ===== */
[data-hriste]{position:relative;overflow:hidden}
.h-scena{position:relative}
.h-prvek{position:absolute;z-index:2;will-change:transform,opacity;cursor:pointer;-webkit-tap-highlight-color:transparent}
[data-hriste]:not(.h-ready) .h-prvek{opacity:0}
.h-prvek>*{display:block}
.h-telefon{width:var(--w,120px);aspect-ratio:9/19;border-radius:calc(var(--w,120px)*.17);background:var(--inkoust);padding:calc(var(--w,120px)*.045);box-shadow:0 10px 26px rgba(37,33,37,.16)}
.h-telefon video,.h-telefon img{width:100%;height:100%;object-fit:cover;border-radius:calc(var(--w,120px)*.13);background:#EDE9E4}
.h-nalepka{width:var(--w,64px);height:auto}
.h-3d{filter:drop-shadow(0 12px 16px rgba(37,33,37,.14))}
.h-ikona{width:var(--w,58px);height:var(--w,58px);border-radius:16px;display:grid!important;place-items:center;background:var(--bila,#fff);box-shadow:0 0 0 1px var(--linka),0 6px 14px rgba(37,33,37,.08)}
.h-ikona img{width:56%;height:56%}
.h-ikona.ruz{background:var(--ruzova)}
.h-ikona.svetla{background:var(--svetla);box-shadow:none}
.h-film{position:relative;z-index:3;border-radius:16px;overflow:hidden;background:var(--inkoust);box-shadow:0 0 0 1px var(--linka),0 18px 40px rgba(37,33,37,.14)}
.h-film video{width:100%;aspect-ratio:16/9;object-fit:cover}
.h-film-tl{position:absolute;left:14px;bottom:14px;z-index:2;height:38px;padding:0 14px;border-radius:10px;background:rgba(255,255,255,.94);font-size:14px;font-weight:600;color:var(--inkoust);display:inline-flex;align-items:center;gap:7px;transition:background-color .16s ease-in,transform .16s var(--e-out,ease)}
.h-film-tl:hover{background:#fff}.h-film-tl:active{transform:scale(.96)}
.h-film-tl svg{width:16px;height:16px}
@media (prefers-reduced-motion:reduce){
  [data-hriste] .h-prvek{opacity:1!important}
  .zb-chat,.zb-bublina{transition:none}
  .zb-zprava{animation:none}
}

/* ===== Klienti: hledání, Jev, panel, mřížka (klienti.js) ===== */
.skryte{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.kl{display:grid;grid-template-columns:minmax(0,1fr);gap:16px}
.kl>*{min-width:0}
.kl-ovl{display:grid;gap:12px}
.kl-hledat{display:flex;align-items:center;gap:10px;height:52px;padding:0 16px;border-radius:14px;background:var(--bila,#fff);box-shadow:0 0 0 1px var(--linka);transition:box-shadow .2s var(--e-out,ease);cursor:text}
.kl-hledat:focus-within{box-shadow:0 0 0 1.5px var(--inkoust),0 6px 18px rgba(37,33,37,.06)}
.kl-hledat svg{width:20px;height:20px;flex:none;color:var(--text2)}
.kl-hledat input{flex:1;min-width:0;border:0;background:transparent;font:inherit;font-size:16px;color:var(--inkoust);outline:none}
.kl-hledat input::-webkit-search-cancel-button{cursor:pointer}
.kl-cipy{display:flex;gap:6px;flex-wrap:wrap}
.kl-cip{min-height:44px;font-size:14px;font-weight:560;padding:8px 14px;border-radius:999px;background:var(--bila,#fff);box-shadow:inset 0 0 0 1px var(--linka);color:var(--text2);transition:background-color .16s ease-in,color .16s,box-shadow .16s,transform .16s var(--e-out,ease)}
.kl-cip span{font-weight:500;opacity:.6;margin-left:2px}
.kl-cip:hover{color:var(--inkoust);box-shadow:inset 0 0 0 1px var(--linka2,rgba(37,33,37,.18))}
.kl-cip:active{transform:scale(.97)}
.kl-cip[aria-pressed=true]{background:var(--inkoust);color:var(--papir);box-shadow:none}
.kl-jev{background:var(--svetla);border-radius:var(--r-karta,20px);padding:18px;display:grid;gap:12px}
.kl-jev-hl{display:flex;gap:12px;align-items:center}
.kl-jev-hl b{display:block;font-size:17px;font-weight:650;letter-spacing:-.01em}
.kl-jev-hl span{display:block;font-size:14px;color:var(--text2)}
.kl-jev-hl .kl-jev-ik{width:40px;height:40px;border-radius:12px;background:var(--bila,#fff);display:grid;place-items:center;flex:none}
.kl-jev-ik svg{width:20px;height:20px}
.kl-jev-rada{display:flex;gap:8px}
.kl-jev-rada input{flex:1;min-width:0;height:44px;border:0;border-radius:10px;background:var(--bila,#fff);box-shadow:inset 0 0 0 1px var(--linka);padding:0 14px;font:inherit;font-size:15px;color:var(--inkoust)}
.kl-jev-rada input:focus{outline:none;box-shadow:inset 0 0 0 1.5px var(--inkoust)}
.kl-jev-vysl:empty{display:none}
.kl-jev-vysl p{font-size:15px;color:var(--text2)}
.kl-jev-uvod{margin-bottom:8px;font-weight:600;color:var(--inkoust)!important}
.kl-jev-karty{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.kl-jev-karta{display:flex;align-items:center;gap:10px;text-align:left;background:var(--bila,#fff);border-radius:var(--r-prvek,10px);padding:10px 12px;box-shadow:0 0 0 1px var(--linka);animation:zb-vstup .3s var(--e-out,ease) both;transition:box-shadow .2s}
.kl-jev-karta:nth-child(2){animation-delay:.06s}.kl-jev-karta:nth-child(3){animation-delay:.12s}
.kl-jev-karta:hover{box-shadow:0 0 0 1px var(--linka2,rgba(37,33,37,.18)),var(--stin-mal,0 6px 16px rgba(37,33,37,.07))}
.kl-jev-karta small{display:block;font-size:12px;color:var(--text3,#6F686D);margin-top:2px}
.kl-av{width:40px;height:40px;border-radius:50%;object-fit:cover;flex:none;background:var(--karta,#F4F1EC);box-shadow:0 0 0 1px var(--linka)}
.kl-av-i{display:grid;place-items:center;font-size:13px;font-weight:700;color:var(--inkoust);background:var(--svetla)}
.kl-t{min-width:0;line-height:1.25}
.kl-t b{display:block;font-size:15px;font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kl-t>span{display:block;font-size:13px;color:var(--text2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kl-panel{background:var(--bila,#fff);border-radius:var(--r-panel,18px);box-shadow:0 0 0 1px var(--linka);padding:clamp(22px,3.5vw,40px);display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(22px,4vw,56px);align-items:center;min-height:460px;transition:opacity .16s ease-out}
.kl-panel.mizi{opacity:0}
.kl-text .h2{font-size:clamp(26px,2.6vw,34px);letter-spacing:-.03em;line-height:1.12;margin-top:8px}
.kl-text p{color:var(--text2);margin-top:12px;max-width:36ch}
.kl-text .role{display:flex;flex-wrap:wrap;gap:6px;margin-top:20px}
.kl-av-velky{width:52px;height:52px;margin-bottom:16px}
.kl-videa{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.kl-videa.jedno{grid-template-columns:minmax(0,260px);justify-content:center}
.kl-videa.siroka{grid-template-columns:1fr 1fr}
.kl-videa .video{position:relative;aspect-ratio:9/16;border-radius:10px;overflow:hidden;background:#EDE9E4}
.kl-videa .video video{width:100%;height:100%;object-fit:contain;background:var(--inkoust,#252125)}
.kl-videa .zvuk{position:absolute;left:8px;bottom:8px;min-height:44px;min-width:44px;padding:0 12px;border-radius:var(--r-prvek,10px);display:inline-flex;align-items:center;justify-content:center;background:rgba(255,255,255,.92);font-size:12px;font-weight:600}
.kl-stream{position:relative;aspect-ratio:16/9;border-radius:10px;overflow:hidden;background:var(--inkoust)}
.kl-stream img{width:100%;height:100%;object-fit:cover;opacity:.9;transition:opacity .2s,transform .4s var(--e-karta,ease)}
.kl-stream:hover img{opacity:1;transform:scale(1.02)}
.kl-stream span{position:absolute;left:10px;bottom:10px;background:rgba(255,255,255,.94);font-size:13px;font-weight:600;padding:6px 10px;border-radius:8px}
.kl-iframe{width:100%;aspect-ratio:16/9;border:0;border-radius:10px;background:var(--inkoust)}
.kl-prazdne{aspect-ratio:16/10;border-radius:var(--r-prvek,10px);background:var(--karta,#F4F1EC);display:grid;place-items:center;align-content:center;gap:12px;color:var(--text3,#6F686D);font-size:14px;font-weight:560}
.kl-av-obri{width:96px;height:96px}
.kl-pocet{margin-top:4px}
.kl-mrizka{list-style:none;display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:8px}
.kl-mrizka li[hidden]{display:none}
.kl-karta{width:100%;display:flex;align-items:center;gap:10px;text-align:left;background:var(--bila,#fff);border-radius:var(--r-prvek,10px);padding:10px 12px;box-shadow:0 0 0 1px var(--linka);transition:box-shadow .2s var(--e-karta,ease),transform .2s var(--e-out,ease)}
.kl-karta:hover{box-shadow:0 0 0 1px var(--linka2,rgba(37,33,37,.18)),var(--stin-mal,0 6px 16px rgba(37,33,37,.07));transform:translateY(-1px)}
.kl-karta[aria-pressed=true]{box-shadow:0 0 0 1.5px var(--inkoust)}
.kl-karta .kl-t{flex:1}
.kl-video{font-style:normal;font-size:12px;font-weight:650;background:var(--svetla);border-radius:6px;padding:2px 7px;flex:none}
@media (max-width:900px){
  .kl-panel{grid-template-columns:1fr;min-height:0}
  .kl-jev-karty{grid-template-columns:1fr}
  .kl-cipy{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-right:calc(-1*var(--okraj,20px));padding-right:var(--okraj,20px)}
  .kl-cipy::-webkit-scrollbar{display:none}
  .kl-cip{white-space:nowrap}
  .kl-videa{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
  .kl-videa .video{flex:0 0 58%;scroll-snap-align:start}
  .kl-videa.jedno{display:grid}
  .kl-videa .kl-prazdne{flex:1 1 100%;aspect-ratio:16/9}
  .kl-mrizka{grid-template-columns:1fr 1fr}
  .kl-karta{padding:8px 10px;gap:8px}
  .kl-av{width:32px;height:32px}
}
@media (max-width:420px){.kl-mrizka{grid-template-columns:1fr}}

/* ===== Kruh přes VSL (kruh.js, volba stred) ===== */
.kruh.stred{--rw:clamp(72px,7vw,128px)}
@media (max-width:999px){.kruh.stred{--rw:clamp(58px,15vw,84px)}}
.kruh-svg.predni{z-index:21} /* přední čára: nad videem (20), pod předními Reels (22+) */
.kruh-svg.zadni{z-index:4}
.kl-vse{justify-self:center;margin-top:4px}

/* Adresář v2 (Žanek 9. 10.): jedno pole, obory na jednom řádku, nejvýš 4 karty místo velké mřížky */
.kl-hledani{display:block}
.kl-hledat{height:60px;padding:0 8px 0 18px}
.kl-hledat input{font-size:17px}
.kl-hledat .tl{height:44px;flex:none}
/* Obory: pod 700 px jeden řádek s posunem a jemným zmizením u pravého okraje (je vidět, že pokračují), od 700 px se zalamují */
.kl .kl-cipy{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;gap:6px;-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 40px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 40px),transparent)}
@media (min-width:700px){.kl .kl-cipy{flex-wrap:wrap;overflow:visible;-webkit-mask-image:none;mask-image:none;margin-right:0;padding-right:0}}
.kl .kl-cipy::-webkit-scrollbar{display:none}
.kl .kl-cip{white-space:nowrap;flex:none}
.kl-vysl{display:grid;grid-template-columns:minmax(0,1fr);gap:8px}
.kl-titulek{font-size:14px;color:var(--text2);min-height:1.4em}
.kl-karty{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.kl-karty:empty{display:none}
.kl-karty .kl-karta{animation:zb-vstup .3s var(--e-out,ease) both}
.kl-karty .kl-karta:nth-child(2){animation-delay:.04s}.kl-karty .kl-karta:nth-child(3){animation-delay:.08s}.kl-karty .kl-karta:nth-child(4){animation-delay:.12s}
@media (max-width:900px){.kl-karty{grid-template-columns:repeat(2,minmax(0,1fr))}.kl-hledat{height:56px;padding-left:14px}.kl-hledat input{font-size:16px}}
@media (max-width:480px){.kl-hledat input::placeholder{font-size:14px}}
.kl-karty .kl-karta{min-width:0}
.kl-videa>.kl-prazdne{grid-column:1/-1}
.kl-videa .video.sirsi{aspect-ratio:16/9;grid-column:1/-1}
.kl-videa .video.sirsi video{object-fit:contain;background:var(--inkoust,#252125)}
.kl-videa .zvuk[hidden]{display:none}
.kl-videa.jen-siroka{grid-template-columns:1fr}
@media (max-width:760px){.kl-videa .video.sirsi{flex:0 0 100%}}
@media (max-width:900px){.kl-karty .kl-video{display:none}}

/* Přelet ZandaBota: kulička s ocáskem (pravidla kolečka z filmu v08) */
.zb-ocas{position:fixed;left:0;top:0;width:100vw;height:100vh;z-index:79;pointer-events:none;overflow:visible}
.zb-kulicka{position:fixed;left:0;top:0;z-index:80;pointer-events:none;opacity:0;will-change:transform,opacity}
.zb-kulicka i{display:block;width:100%;height:100%;border-radius:50%;background:#E8B5CE;border:1.5px solid rgba(117,67,86,.2);box-shadow:0 1px 2px rgba(37,33,37,.12);box-sizing:border-box}

/* Telefony na hřišti jako iPhone 17 Pro: titanový rámeček, tenký černý okraj, Dynamic Island, boční tlačítka */
.h-telefon{position:relative;width:var(--w,120px);aspect-ratio:71.5/150;border-radius:calc(var(--w,120px)*.2);padding:calc(var(--w,120px)*.035);
  background:linear-gradient(145deg,#4a4549 0%,#2e2a2e 38%,#3b373b 62%,#252125 100%);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.14),0 0 0 1px rgba(37,33,37,.25),0 14px 30px rgba(37,33,37,.18)}
.h-telefon::before{content:"";position:absolute;inset:calc(var(--w,120px)*.018);border-radius:calc(var(--w,120px)*.185);background:#0f0d0f}
.h-telefon video,.h-telefon img{position:relative;z-index:1;width:100%;height:100%;object-fit:cover;border-radius:calc(var(--w,120px)*.165);background:#EDE9E4}
.h-telefon::after{content:"";position:absolute;z-index:2;left:50%;top:calc(var(--w,120px)*.07);width:calc(var(--w,120px)*.3);height:calc(var(--w,120px)*.085);border-radius:999px;background:#0f0d0f;transform:translateX(-50%)}
.h-telefon i.tl-bok{position:absolute;right:calc(var(--w,120px)*-.022);top:28%;width:calc(var(--w,120px)*.025);height:16%;border-radius:0 3px 3px 0;background:#3b373b}

/* Hover na videu aplikace: prvky zajedou do středu za video, video se zvětší a pustí se zvukem */
.h-film{transition:transform .6s cubic-bezier(.2,.8,.2,1),box-shadow .6s cubic-bezier(.2,.8,.2,1);cursor:pointer}
.h-zoom .h-film{box-shadow:0 0 0 1px var(--linka),0 30px 70px rgba(37,33,37,.22)}
.h-obal-filmu{position:relative;z-index:6!important;transition:width .6s cubic-bezier(.2,.8,.2,1),margin-left .6s cubic-bezier(.2,.8,.2,1)}
.h-bot-roh{position:absolute!important;right:-46px!important;top:-52px!important;left:auto!important;bottom:auto!important;margin:0!important;z-index:7}
[data-hriste] .h-text,[data-hriste] .std-kroky{transition:transform .6s cubic-bezier(.2,.8,.2,1),opacity .4s ease}
[data-hriste] .h-text{transform-origin:50% 100%}
[data-hriste] .std-kroky{transform-origin:50% 0}
.h-zoom .h-text{transform:translateY(-6px) scale(.86)}
.h-zoom .std-kroky{transform:scale(.88);opacity:.85}
.h-film .h-plakat{position:absolute;inset:0;z-index:1;background:center/cover;transition:opacity .35s ease-out;pointer-events:none}
.h-zoom .h-film .h-plakat,.h-film.hraje .h-plakat{opacity:0}
.h-zvuk-tip{position:absolute;right:14px;bottom:14px;z-index:2;background:rgba(255,255,255,.94);font-size:13px;font-weight:600;padding:6px 10px;border-radius:8px;opacity:0;transition:opacity .2s}
.h-film.bez-zvuku .h-zvuk-tip{opacity:1}
@media (prefers-reduced-motion:reduce){.h-zoom .h-text,.h-zoom .std-kroky{transform:none}.h-obal-filmu{transition:none}}
.h-zoom .h-bot-roh{right:18px!important;top:18px!important}
@media (max-width:759px){.h-bot-roh{right:-8px!important;top:-40px!important}}

/* Místa bota v každé sekci (Žanek 9. 10.: „v každé sekci musí být nastavené kde bot bude“) */
.kl-hledat .kl-bot{--vel:46px;flex:none}
.bm-zakl{--vel:76px;margin-bottom:14px}
.prokoho{position:relative}
.bm-prokoho{--vel:76px;position:absolute;right:22px;bottom:20px}
.prokoho .tint .h3{padding-right:84px}
.bm-pata{--vel:92px;position:absolute;right:var(--okraj,24px);top:-6px}
@media (max-width:900px){.bm-prokoho{--vel:56px;right:14px;bottom:14px}.prokoho .tint .h3{padding-right:60px}.bm-pata{--vel:72px;top:-10px}.kl-hledat .kl-bot{--vel:40px}}
/* Plynulý scroll (Lenis, spolecne/plynuly-scroll.js) — povinné styly knihovny */
html.lenis,html.lenis body{height:auto}
.lenis:not(.lenis-autoToggle).lenis-stopped{overflow:clip}
.lenis [data-lenis-prevent],.lenis .zb-chat{overscroll-behavior:contain}
.lenis.lenis-smooth iframe{pointer-events:none}

/* ===== Návrh 9: mobil a tablet (přístupnost a dotyk) ===== */
/* Obor pod jménem klienta: na úzké šířce dva řádky místo useknutí třemi tečkami */
@media (max-width:900px){
  .kl-t>span{white-space:normal;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2}
}
/* Videa klienta na tabletu a telefonu na šířku: výška podle obrazovky, celé video je vidět */
@media (min-width:600px) and (max-width:900px),(max-height:500px) and (orientation:landscape) and (max-width:1000px){
  .kl-videa .video{flex:0 0 auto;height:min(70svh,560px);width:auto;aspect-ratio:9/16}
  .kl-videa .video.sirsi{height:auto;width:100%;flex:0 0 100%;aspect-ratio:16/9}
}

/* Žanek 12. 10.: vybraný návrh klientů 10 / Rozdělená scéna. */
.kl-panel.kl-scena{padding:0;grid-template-columns:minmax(0,1fr) minmax(0,2.2fr);gap:0;align-items:stretch;min-height:0;border-radius:12px;overflow:hidden}
.kl-scena .kl-text{background:var(--inkoust,#252125);color:var(--papir,#FAF8F4);padding:36px 30px;display:flex;flex-direction:column;gap:30px;justify-content:space-between;min-width:0}
.kl-scena .kl-av-velky{width:44px;height:44px;margin:0}
.kl-scena .kl-text .nad{font-size:12px;color:#c7bec4}
.kl-scena .kl-text .h2{font-size:clamp(32px,3.2vw,46px);font-weight:700;letter-spacing:-.06em;line-height:1.1;margin:8px 0 0;overflow-wrap:anywhere}
.kl-scena .kl-text .kl-veta{color:var(--papir,#FAF8F4);font-size:clamp(23px,2vw,28px);font-weight:700;letter-spacing:-.035em;line-height:1.2;margin:0;max-width:28ch}
.kl-scena .kl-text .role{margin:0;gap:6px;display:flex;flex-wrap:wrap}
.kl-scena .kl-text .stitek{background:transparent;color:var(--papir,#FAF8F4);border:1px solid #ffffff40;font-size:11px;padding:5px 10px}
.kl-scena-media{padding:26px;display:flex;flex-direction:column;justify-content:center;gap:24px;min-width:0;background:var(--bila,#fff)}
.kl-scena .kl-videa{gap:10px;min-width:0;align-items:start}
.kl-scena .kl-videa .video{border-radius:10px;min-width:0}
.kl-scena .kl-poznamka{font-size:13px;color:var(--text2,#6B6469);max-width:52ch;line-height:1.5;margin:0}
.kl-scena .video .zvuk{top:12px;left:12px;bottom:auto;width:44px;height:44px;min-width:44px;min-height:44px;padding:0;border-radius:50%;color:var(--inkoust,#252125);background:#FAF8F4ee}
.kl-scena .zvuk svg{width:20px;height:20px;margin-left:2px}
.kl-scena .video .zvuk.chyba{width:auto;border-radius:8px;padding:0 12px;font-size:12px}
.kl-video-popis{position:absolute;inset:auto 0 0;display:flex;align-items:end;justify-content:space-between;gap:8px;padding:44px 12px 14px;pointer-events:none;color:white;background:linear-gradient(transparent,#000a);font-size:12px;font-weight:700}
.kl-video-popis small{font-size:11px;font-weight:400;background:#0006;border-radius:4px;padding:2px 6px;white-space:nowrap}
.video.prehrava .kl-video-popis{display:none}
@media(max-width:900px){.kl-panel.kl-scena{grid-template-columns:1fr}.kl-scena .kl-text{padding:30px;display:grid;grid-template-columns:auto 1fr;gap:24px;align-items:center}.kl-scena .kl-text .h2{font-size:42px}.kl-scena .kl-text .kl-veta{grid-column:2;font-size:24px}.kl-scena .kl-text .role{grid-column:2}.kl-scena .kl-videa{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));overflow:visible;scroll-snap-type:none}.kl-scena .kl-videa .video{width:100%;height:auto;aspect-ratio:9/16}.kl-scena .kl-videa .video.sirsi{width:100%;height:auto;aspect-ratio:16/9}.kl-scena .kl-videa.jedno{grid-template-columns:minmax(0,260px)}.kl-scena .kl-videa.jen-siroka{grid-template-columns:1fr}}
@media(max-width:600px){.kl-scena .kl-text{padding:24px 20px;gap:16px}.kl-scena .kl-text .h2{font-size:36px}.kl-scena .kl-text .kl-veta{grid-column:1/-1;font-size:24px}.kl-scena .kl-text .role{grid-column:1/-1}.kl-scena-media{padding:18px;gap:20px}.kl-scena .kl-video-popis{font-size:10px;padding:34px 8px 10px;display:block}.kl-scena .kl-video-popis small{display:block;width:max-content;margin-top:4px;font-size:9px}.kl-scena .video.prehrava .kl-video-popis{display:none}.kl-scena .video .zvuk{width:44px;height:44px;left:4px;top:4px}.kl-scena .zvuk svg{width:18px;height:18px}.kl-scena .kl-poznamka{font-size:12px}}
/* Šířka scény podle počtu ukázek: jeden Reel nemá kolem sebe prázdnou galerii. */
.kl-panel.kl-scena{width:100%;margin-inline:auto;transition:none;overflow-anchor:none;scroll-margin-top:100px}
.kl-scena .kl-videa:has(>.video:nth-child(2):last-child:not(.sirsi)){grid-template-columns:repeat(2,minmax(0,1fr))}
@media(min-width:901px){
  .kl-panel.kl-scena:has(.kl-videa.jedno){max-width:760px;grid-template-columns:minmax(0,1fr) 312px}
  .kl-panel.kl-scena:has(.kl-videa:not(.mix)>.video:nth-child(2):last-child:not(.sirsi)){max-width:1100px;grid-template-columns:minmax(0,1fr) minmax(0,1.6fr)}
}
@media(max-width:900px){.kl-panel.kl-scena:has(.kl-videa.jedno){max-width:400px}}