/* 21art.cz — úvodní stránka: vzhled sekcí pod hledáčkem (přesunuto z index.html, ať se drží v cache prohlížeče).
   Načítá se v <head> hned za vloženým stylem hledáčku (index.html), pořadí pravidel zůstává stejné jako dřív. */
/* ---------- SLUŽBY: klipy na stopách + inspektor ---------- */
.sl-mriz{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:10px;align-items:start}
@media (max-width:960px){.sl-mriz{grid-template-columns:minmax(0,1fr)}}
.sl-skrol{overflow-x:auto;overscroll-behavior-x:contain;border-radius:0 0 var(--r3) var(--r3)}
.sl-stopy{min-width:640px;border:0;border-radius:0;--jm:76px}
.sl-stopy .stopa-plocha{height:68px}
.sl-stopy .stopy-pravitko .stopa-plocha{height:26px}
.sl-stopy .klip{top:8px;bottom:8px;padding:7px 9px;font:500 var(--p5)/1.2 var(--f-txt)}
.sl-stopy .klip small{font:400 var(--p6)/1.4 var(--f-mono)}
.sl-stopy .klip.sl-a1{flex-direction:row;justify-content:flex-start;align-items:baseline;gap:12px;background-repeat:repeat-x;background-position:0 calc(100% - 3px);background-size:auto 22px}
.sl-stopy .stopy-hlava{transition:left .45s var(--ease)}
.sl-tip{padding:8px 12px;border-top:1px solid var(--linka);font-size:var(--p6);color:var(--hloubka)}
@media (min-width:760px){.sl-tip{display:none}}
.sl-hl{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}
.sl-tvar{display:grid;place-items:center;align-content:center;gap:5px;width:72px;height:60px;flex:none;border:1px solid var(--linka);border-radius:var(--r1);background:var(--tubus)}
.sl-tvar i{display:block;border:1.5px solid var(--rytina);border-radius:2px;transition:width .3s,height .3s,transform .3s}
.sl-tvar small{font:500 var(--p6)/1 var(--f-mono);color:var(--elox)}
.sl-popis{font-size:var(--p5);line-height:1.55;margin-bottom:12px}

/* ---------- SPOT: střižna ---------- */
.spot{display:grid;grid-template-columns:232px minmax(0,1fr) 300px;grid-template-areas:"pool viewer info" "tl tl info";gap:10px}
.sp-pool{grid-area:pool}.sp-viewer{grid-area:viewer;display:flex;flex-direction:column}.sp-info{grid-area:info;display:flex;flex-direction:column}.sp-tl{grid-area:tl}
@media (max-width:1120px){.spot{grid-template-columns:214px minmax(0,1fr);grid-template-areas:"pool viewer" "tl tl" "info info"}}
@media (max-width:760px){.spot{grid-template-columns:minmax(0,1fr);grid-template-areas:"viewer" "pool" "tl" "info"}}
.pk-seznam{display:grid;gap:6px;padding:10px}
.pk{display:grid;grid-template-columns:18px 52px minmax(0,1fr);align-items:center;gap:8px;min-height:46px;padding:5px 8px 5px 2px;border:1px solid var(--linka);border-radius:var(--r2);background:var(--vrstva);color:var(--rytina);font:500 var(--p5)/1.25 var(--f-txt);text-align:left;cursor:grab;-webkit-user-select:none;user-select:none;transition:border-color .15s,transform .15s}
.pk:hover{border-color:var(--linka2)}.pk:active{transform:scale(.98)}
.pk small{display:block;font:400 var(--p6)/1.3 var(--f-mono);color:var(--elox)}
.chyt{height:34px;padding:5px 3px;touch-action:none;background:radial-gradient(circle,var(--hloubka) 1.2px,transparent 1.6px) 0 0/6px 6px content-box}
.pk-n,.duch-n{position:relative;width:52px;aspect-ratio:16/9;border-radius:3px;overflow:hidden;background:var(--obraz) center/cover no-repeat}
.pk-n canvas{position:absolute;inset:0;width:100%;height:100%}
.pk-n::after{content:"";position:absolute;inset:0 auto 0 0;width:3px;background:var(--k)}
.pk-tip{padding:0 12px 12px;font-size:var(--p6);line-height:1.45;color:var(--hloubka)}
@media (max-width:760px){.pk-seznam{grid-template-columns:1fr 1fr}.pk{grid-template-columns:16px 40px minmax(0,1fr);gap:6px}.pk-n{width:40px}.pk-tip{display:none}}
.sp-viewer .panel-hlava{flex-wrap:wrap;text-transform:none;letter-spacing:.02em;padding:7px 10px}
.sp-pomery i{display:block;border:1.5px solid currentColor;border-radius:2px}
.sp-pomery button[aria-checked="true"] i{border-color:var(--ryska)}
.sp-zona{display:inline-flex;align-items:center;gap:6px;min-height:32px;cursor:pointer;color:var(--elox);font:500 var(--p6)/1 var(--f-mono)}
.sp-zona input{accent-color:var(--ryska);width:15px;height:15px;margin:0}
.sp-plocha{position:relative;height:clamp(236px,29vw,420px);display:grid;place-items:center;background:var(--tubus) radial-gradient(var(--linka) 1px,transparent 1px) 0 0/14px 14px;flex:1 0 auto}
.sp-ramec{position:relative;width:320px;height:180px;background:var(--obraz);box-shadow:0 0 0 1px var(--linka2),var(--stin);transition:width .55s cubic-bezier(.65,0,.35,1),height .55s cubic-bezier(.65,0,.35,1)}
.sp-ramec canvas{position:absolute;inset:0;width:100%;height:100%}
.sp-bz{position:absolute;inset:5%;border:1px dashed var(--bezp);pointer-events:none}
.sp-bz::after{content:"";position:absolute;inset:5.5%;border:1px solid var(--bezp2)}
.sp-bz span{position:absolute;left:4px;top:3px;font:500 var(--p6)/1 var(--f-mono);color:var(--bezp)}
.sp-ui{position:absolute;inset:0;pointer-events:none;display:none}
.sp-ui i{position:absolute;left:0;right:0;background:repeating-linear-gradient(135deg,var(--srafa) 0 6px,transparent 6px 12px);border:0 solid var(--bezp2)}
.sp-ui i:nth-child(1){top:0;height:13%;border-bottom-width:1px}
.sp-ui i:nth-child(2){bottom:0;height:21%;border-top-width:1px}
.sp-ui i:nth-child(3){top:13%;bottom:21%;left:auto;width:15%;border-left-width:1px}
.sp-ui span{position:absolute;bottom:22%;left:6px;font:500 var(--p6)/1 var(--f-mono);color:var(--bezp)}
.sp-ramec[data-pomer="9:16"] .sp-ui{display:block}
.sp-ramec.bez-zony .sp-bz,.sp-ramec.bez-zony .sp-ui{display:none}
.sp-prazdna{position:absolute;inset:0;z-index:1;display:grid;place-items:center;margin:0;background:var(--obraz);font:500 var(--p6)/1 var(--f-mono);letter-spacing:.12em;color:var(--hloubka)}
.sp-pata{display:grid;grid-template-columns:auto auto minmax(0,1fr) auto;align-items:center;gap:8px;padding:8px 10px;border-top:1px solid var(--linka)}
.sp-popis{min-width:0;font-size:var(--p5);line-height:1.35}
.sp-popis b{display:block;font:500 var(--p6)/1.3 var(--f-mono);color:var(--rytina);letter-spacing:.04em}
.sp-popis b,.sp-popis span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sp-popis span{display:block;color:var(--elox)}
.sp-tc{font:500 var(--p5)/1.2 var(--f-mono);font-variant-numeric:tabular-nums;color:var(--rytina);text-align:right}
.sp-tc small{display:block;font-size:var(--p6);color:var(--hloubka)}
@media (max-width:560px){.sp-pata{grid-template-columns:auto auto minmax(0,1fr)}.sp-popis{grid-column:1/-1;order:3}}
.sp-tl{display:grid;grid-template-columns:48px minmax(0,1fr);overflow:hidden}
.sp-stitky,.sp-osa{display:grid;grid-template-rows:26px 64px 38px}
.sp-stitky{border-right:1px solid var(--linka);background:var(--tubus)}
.sp-stitky span{display:flex;align-items:center;justify-content:center;border-bottom:1px solid var(--linka);font:500 var(--p6)/1 var(--f-mono);color:var(--elox)}
.sp-stitky span:last-child{border-bottom:0}
.sp-osa{position:relative;padding:0 10px}
.sp-prav{position:relative;border-bottom:1px solid var(--linka);cursor:ew-resize;touch-action:none}
.sp-prav i{position:absolute;bottom:0;width:1px;height:5px;background:var(--linka2)}
.sp-prav i.v{height:10px;background:var(--hloubka)}
.sp-prav b{position:absolute;bottom:11px;left:3px;font:400 var(--p6)/1 var(--f-mono);color:var(--hloubka);white-space:nowrap}
.sp-v1{position:relative;border-bottom:1px solid var(--linka)}
.sp-a1{position:relative}
.sp-vlna{position:absolute;left:0;top:5px;bottom:5px;border-radius:3px;background:var(--k7) 0 50%/auto 100% repeat-x;transition:width .25s}
.sp-a1 span{position:absolute;left:6px;top:50%;transform:translateY(-50%);padding:3px 6px;border-radius:3px;background:var(--clona);font:500 var(--p6)/1 var(--f-mono);color:var(--text2);pointer-events:none}
.sp-prazdna-tl{position:absolute;inset:26px 0 38px;display:grid;place-items:center;margin:0;padding:0 8px;font-size:var(--p5);color:var(--hloubka);text-align:center;pointer-events:none}
.sp-klip{position:absolute;top:6px;bottom:6px;display:flex;border-radius:var(--r1);background:var(--k);box-shadow:inset 0 1px 0 var(--hrana),inset 0 0 0 1px var(--clona2);touch-action:none;cursor:grab;-webkit-user-select:none;user-select:none;transition:left .25s ease,width .25s ease,opacity .2s,filter .2s;overflow:hidden}
.sp-klip-b{position:relative;flex:1;min-width:0;display:flex;flex-direction:column;justify-content:space-between;align-items:flex-start;padding:5px 6px;border:0;background:transparent;font:500 var(--p6)/1.2 var(--f-mono);color:var(--rytina);text-align:left;cursor:inherit}
.sp-klip-b:focus-visible{outline-offset:-2px}
.sp-pas{position:absolute;inset:0;background-size:auto 100%;background-repeat:repeat-x;opacity:.32;pointer-events:none}
.sp-jm,.sp-d{position:relative;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-shadow:0 1px 2px var(--obraz)}
.sp-d{color:var(--text2)}
.sp-x{position:absolute;top:3px;right:3px;z-index:1;width:24px;height:24px;border:0;border-radius:var(--r1);background:var(--clona);color:var(--rytina);display:none;place-items:center;cursor:pointer}
.sp-klip:hover .sp-x,.sp-klip.vybrany .sp-x{display:grid}
.sp-klip.vybrany{box-shadow:inset 0 0 0 2px var(--rytina)}
.sp-klip.hraje{filter:brightness(1.22)}
.sp-klip.tazeny{opacity:.3}
.sp-klip.uzky .sp-jm{display:none}
.sp-klip.uzky .sp-klip-b{padding:5px 3px}
.sp-klip.uzky .sp-x{display:none!important}
.sp-hlava{position:absolute;top:0;bottom:0;left:0;z-index:3;width:2px;margin-left:-1px;background:var(--ryska);pointer-events:none}
.sp-hlava::before{content:"";position:absolute;top:0;left:-5px;width:12px;height:10px;background:var(--ryska);clip-path:polygon(0 0,100% 0,100% 55%,50% 100%,0 55%)}
.sp-vloz{position:absolute;top:26px;height:64px;width:3px;margin-left:-1px;border-radius:2px;background:var(--rytina);display:none;z-index:4;pointer-events:none}
.sp-vloz.vid{display:block}
.sp-tip{grid-column:1/-1;padding:8px 12px;border-top:1px solid var(--linka);font-size:var(--p6);color:var(--hloubka)}
.duch{position:fixed;left:0;top:0;z-index:120;display:none;align-items:center;gap:8px;padding:6px 10px 6px 6px;border:1px solid var(--elox);border-radius:var(--r2);background:var(--vrstva);color:var(--rytina);font:500 var(--p5)/1.2 var(--f-txt);box-shadow:var(--stin);pointer-events:none;transform:translate(-50%,-130%);white-space:nowrap}
.duch.vid{display:flex}.duch-n{width:44px}
.duch.ven{border-color:var(--chyba)}
.duch em{display:none;font:400 var(--p6)/1 var(--f-mono);font-style:normal;color:var(--chyba)}
.duch.ven em{display:inline}
body.tahne,body.tahne *{cursor:grabbing!important;-webkit-user-select:none;user-select:none}
.sp-info .insp-radky{margin-top:12px}
.sp-info .vyber{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.sp-info>.btn{margin:auto 14px 14px;width:calc(100% - 28px);white-space:normal;text-align:center;padding-block:10px}

/* ---------- BARVY: grading stůl ---------- */
.gr{display:grid;grid-template-columns:minmax(0,1.9fr) minmax(280px,1fr);gap:10px}
@media (max-width:960px){.gr{grid-template-columns:minmax(0,1fr)}}
.gr-obraz{position:relative;align-self:start;aspect-ratio:16/9;border-radius:var(--r3);overflow:hidden;background:var(--obraz);touch-action:pan-y;-webkit-user-select:none;user-select:none;cursor:ew-resize}
.gr-obraz canvas{position:absolute;left:0;top:0;width:100%;height:100%}
.gr-obraz .gr-zdroj{visibility:hidden;pointer-events:none}
.gr-st{position:absolute;top:12px;z-index:2;padding:6px 8px;border-radius:var(--r1);background:var(--clona);font:500 var(--p6)/1 var(--f-mono);letter-spacing:.1em;color:var(--rytina);pointer-events:none}
.gr-st.l{left:12px}.gr-st.p{right:12px}
.predel{position:absolute;z-index:2;top:0;bottom:0;left:50%;width:44px;margin-left:-22px;display:flex;justify-content:center;touch-action:none}
.predel::before{content:"";width:2px;height:100%;background:var(--rytina);box-shadow:0 0 0 1px var(--clona2)}
.predel span{position:absolute;top:50%;width:40px;height:40px;margin-top:-20px;border-radius:50%;background:var(--ryska);color:var(--ink);display:grid;place-items:center}
.gr-panel{padding:18px;display:flex;flex-direction:column;gap:16px}
.gr-pred{display:grid;width:100%;grid-template-columns:repeat(4,minmax(0,1fr))}
.gr-pred button{justify-content:center;padding:0 4px}
.gr-pos{display:grid;grid-template-columns:1fr auto;gap:2px 12px;align-items:center}
.gr-pos label{font-size:var(--p5);color:var(--text2)}
.gr-pos output{font:500 var(--p5)/1 var(--f-mono);color:var(--rytina);min-width:5ch;text-align:right}
.gr-pos input{grid-column:1/-1;width:100%;height:28px;margin:0;background:transparent;-webkit-appearance:none;appearance:none;cursor:pointer}
.gr-pos input::-webkit-slider-runnable-track{height:2px;background:var(--linka2)}
.gr-pos input::-moz-range-track{height:2px;background:var(--linka2)}
.gr-pos input::-webkit-slider-thumb{-webkit-appearance:none;width:18px;height:18px;margin-top:-8px;border-radius:50%;background:var(--rytina);border:3px solid var(--plech)}
.gr-pos input::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:var(--rytina);border:3px solid var(--plech)}
.gr-pos input:focus-visible{outline:0}
.gr-pos input:focus-visible::-webkit-slider-thumb{background:var(--ryska)}
.gr-pos input:focus-visible::-moz-range-thumb{background:var(--ryska)}
.gr-lut{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px;margin-top:auto;padding-top:14px;border-top:1px solid var(--linka)}

/* ---------- 3D SKEN ---------- */
.sken{display:grid;grid-template-columns:minmax(0,2.2fr) minmax(250px,1fr);gap:10px}
@media (max-width:960px){.sken{grid-template-columns:minmax(0,1fr)}}
.sken-obraz{position:relative;align-self:start;aspect-ratio:16/10;border-radius:var(--r3);overflow:hidden;background:var(--obraz);cursor:grab;touch-action:pan-y}
.sken-obraz:active{cursor:grabbing}
@media (max-width:960px){.sken-obraz{aspect-ratio:4/3.4}}
.sken-obraz canvas{position:absolute;inset:0;width:100%;height:100%}
.sken-hud{position:absolute;left:14px;top:14px;right:14px;z-index:2;display:flex;justify-content:space-between;gap:12px;pointer-events:none;font:500 var(--p6)/1.6 var(--f-mono);letter-spacing:.08em;color:var(--text2)}
.sken-hud b{font-weight:500;color:var(--rytina)}
.sken-tip{position:absolute;left:14px;right:14px;bottom:12px;z-index:2;font:400 var(--p6)/1.3 var(--f-mono);color:var(--elox);pointer-events:none}
.sken-prubeh{position:absolute;left:0;right:0;bottom:0;z-index:2;height:2px;background:var(--linka)}
.sken-prubeh span{display:block;height:100%;width:0;background:var(--ryska)}
.sken-ovl{padding:18px;display:flex;flex-direction:column;gap:16px}
.faze{list-style:none;margin:0;padding:0}
.faze li{position:relative;display:grid;grid-template-columns:28px 1fr;gap:2px 10px;padding:11px 0 11px 14px;border-bottom:1px solid var(--linka);color:var(--elox);transition:color .3s}
.faze li::before{content:"";position:absolute;left:0;top:17px;width:6px;height:7px;background:var(--linka2);clip-path:polygon(0 0,100% 50%,0 100%)}
.faze li.ted{color:var(--rytina)}.faze li.ted::before{background:var(--ryska)}
.faze li.hotovo{color:var(--text2)}
.faze .c{font:500 var(--p6)/1.7 var(--f-mono)}
.faze small{grid-column:2;font-size:var(--p5);color:var(--elox)}
.sken-ovl .akce{margin-top:auto}

/* ---------- POSTUP: call sheet ---------- */
.callsheet{position:relative;overflow:hidden}
.cs-hlava{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-bottom:1px solid var(--linka)}
.cs-hlava div{padding:14px 18px;border-right:1px solid var(--linka)}
.cs-hlava div:last-child{border-right:0}
.cs-hlava small{display:block;margin-bottom:6px;font:500 10px/1 var(--f-mono);letter-spacing:.16em;color:var(--elox)}
.cs-hlava b{font:500 var(--p5)/1.3 var(--f-mono);color:var(--rytina)}
.kroky{list-style:none;margin:0;padding:0}
.krok{display:grid;grid-template-columns:72px minmax(0,1.1fr) minmax(0,2fr) minmax(0,1fr);gap:12px 24px;padding:24px 24px 24px 40px;border-bottom:1px solid var(--linka);transition:background .35s var(--ease)}
.krok:last-child{border-bottom:0}
.krok .c{font:500 var(--p2)/1 var(--f-mono);color:var(--hloubka);transition:color .3s}
.krok h3{font-size:var(--p2);line-height:1.05}
.krok h3 small{display:block;margin-bottom:8px;font:500 var(--p6)/1 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--elox)}
.krok .vystup{font:500 var(--p5)/1.5 var(--f-mono);color:var(--elox)}
.krok .vystup b{display:block;font-weight:500;color:var(--rytina)}
.krok.ted{background:var(--vrstva)}
.krok.ted .c{color:var(--ryska)}
.ukazatel{position:absolute;left:16px;top:0;width:9px;height:9px;background:var(--ryska);clip-path:polygon(0 0,100% 50%,0 100%);transition:transform .45s var(--ease)}
@media (max-width:860px){
  .cs-hlava{grid-template-columns:1fr 1fr}.cs-hlava div:nth-child(2){border-right:0}.cs-hlava div:nth-child(-n+2){border-bottom:1px solid var(--linka)}
  .krok{grid-template-columns:44px minmax(0,1fr);padding:20px 16px 20px 34px}.krok p,.krok .vystup{grid-column:2}.krok .c{font-size:var(--p3)}
  .ukazatel{left:12px}}

/* ---------- PŘEDÁNÍ ---------- */
.pr-mriz{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(20px,4vw,48px);align-items:start}
@media (max-width:960px){.pr-mriz{grid-template-columns:minmax(0,1fr)}}
.pr-body{list-style:none;margin:0;padding:0;display:grid;gap:20px}
.pr-body li{display:grid;grid-template-columns:34px minmax(0,1fr);gap:4px 10px}
.pr-body .c{grid-row:span 2;font:500 var(--p6)/1.7 var(--f-mono);color:var(--hloubka)}
.pr-body p{font-size:var(--p5);line-height:1.55}
.pr-adresa{display:flex;align-items:center;gap:10px;padding:10px 14px;border-bottom:1px solid var(--linka)}
.pr-adresa code{flex:1;min-width:0;padding:6px 10px;font-size:var(--p5);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.2}
.pr-adresa code b{font-weight:500;color:var(--rytina)}
.pr-sb{list-style:none;margin:0;padding:6px 14px}
.pr-sb li{display:grid;grid-template-columns:40px minmax(0,1fr) auto;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--linka)}
.pr-sb li:last-child{border-bottom:0}
.pr-sb i{display:grid;place-items:center;height:26px;border-radius:var(--r1);background:var(--k);color:var(--rytina)}
.pr-sb b{display:block;font-weight:500;color:var(--rytina);font-size:var(--p5)}
.pr-sb small{display:block;font:400 var(--p6)/1.4 var(--f-mono);color:var(--elox)}
.pr-panel .stupnice{margin:8px 14px 0}
.pr-panel .btn{margin:20px 14px 14px;width:calc(100% - 28px);min-height:52px;font-size:var(--p3);border-color:var(--elox)}
@media (max-width:480px){.pr-sb li{grid-template-columns:32px minmax(0,1fr)}.pr-sb .stav{grid-column:2;justify-self:start}}

/* ---------- POPTÁVKA: render queue ---------- */
.render{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:10px;align-items:start}
@media (max-width:960px){.render{grid-template-columns:minmax(0,1fr)}}
.nast fieldset{margin:0;padding:16px 14px;border:0;border-bottom:1px solid var(--linka);min-width:0}
.nast legend{float:left;width:100%;padding:0;margin-bottom:10px;font:500 var(--p6)/1.3 var(--f-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--elox)}
.nast legend span{margin-right:8px;color:var(--hloubka)}
.nast legend small{margin-left:8px;text-transform:none;letter-spacing:0;color:var(--hloubka)}
.nast .volby,.nast .pole-mrizka,.nast .termin{clear:both}
.nast .termin{margin-top:10px;max-width:320px}
.pozn-dole{padding:12px 14px;font-size:var(--p6);color:var(--hloubka)}
.fronta{position:sticky;top:calc(var(--hlava) + 12px)}
@media (max-width:960px){.fronta{position:static}}
.job{position:relative;margin:12px;border:1px solid var(--linka2);border-radius:var(--r2);background:var(--tubus)}
.klapka{position:relative;height:30px;border-bottom:1px solid var(--linka2);--uhel:-3deg}
.klapka i{position:absolute;left:0;right:0;height:15px;background:repeating-linear-gradient(-45deg,var(--elox) 0 14px,var(--vrstva) 14px 28px)}
.klapka i:last-child{bottom:0;border-radius:0;background:repeating-linear-gradient(45deg,var(--elox) 0 14px,var(--vrstva) 14px 28px)}
.klapka.klap i{background-image:repeating-linear-gradient(-45deg,var(--rytina) 0 14px,var(--vrstva) 14px 28px)}
.klapka.klap i:last-child{background-image:repeating-linear-gradient(45deg,var(--rytina) 0 14px,var(--vrstva) 14px 28px)}
.klapka i:first-child{top:0;border-radius:var(--r2) var(--r2) 0 0;transform-origin:6px 100%;transform:rotate(var(--uhel));transition:transform .2s}
.klapka.klap i:first-child{transform:rotate(0);transition:transform .32s cubic-bezier(.6,0,.9,.4)}
.job::after{content:"";position:absolute;inset:0;border-radius:inherit;background:var(--rytina);opacity:0;pointer-events:none}
.job.blesk::after{animation:blesk .45s ease-out}
@keyframes blesk{0%{opacity:.3}100%{opacity:0}}
.job-hlava{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 12px;border-bottom:1px solid var(--linka);font:500 var(--p5)/1.3 var(--f-mono);color:var(--rytina)}
.job-hlava span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.job-hlava small{flex:none;font-size:var(--p6);color:var(--hloubka)}
.job dl{display:grid;grid-template-columns:92px minmax(0,1fr);gap:7px 12px;margin:0;padding:12px;font-size:var(--p5);line-height:1.4}
.job dt{font:500 var(--p6)/1.6 var(--f-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--hloubka)}
.job dd{margin:0;color:var(--rytina);overflow-wrap:anywhere}
.job dd.prazdne{color:var(--hloubka)}
.job-prubeh{height:6px;margin:0 12px;border-radius:3px;background:var(--linka);overflow:hidden}
.job-prubeh i{display:block;height:100%;width:0;background:var(--ryska)}
.job.hotovo .job-prubeh i{background:var(--ok)}
.job-stav{display:flex;justify-content:space-between;gap:10px;padding:8px 12px 12px;font:500 var(--p6)/1.3 var(--f-mono);color:var(--elox)}
.job-stav .s-ok{color:var(--ok)}.job-stav .s-pozor{color:var(--pozor)}
.fronta>.btn{margin:0 12px 12px;width:calc(100% - 24px)}
.fronta .potvrzeni{margin:0 12px 12px}

/* ---------- KONTAKT ---------- */
.kontakt{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(24px,5vw,72px)}
@media (max-width:900px){.kontakt{grid-template-columns:minmax(0,1fr)}}
.o-mne{display:grid;gap:14px;margin-top:18px}

/* ---------- díly jen pro živý web (nad rámec prototypu) ---------- */
/* staré kotvy (#nahore, #predavani, #studio) — odkazy z e-mailů a odjinud dál trefí správné místo */
.kotva{display:block;width:0;height:0;overflow:hidden}
/* osobní pozdrav z odkazu ?o= */
.pozdrav{max-width:46rem;margin:0 0 14px;padding:12px 16px;border:1px solid var(--linka);border-left:3px solid var(--ryska);border-radius:var(--r2);background:var(--ryska-slaba);color:var(--rytina);font-size:var(--p4);line-height:1.55}
.pozdrav b{display:block;margin-bottom:4px;font:500 var(--p6)/1.3 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--ryska)}
/* showreel v hlavním záběru: tlačítko v HUD a v textu, přehrávač místo objektivu */
.reel-tl{display:inline-flex;align-items:center;gap:6px;min-height:28px;padding:0 10px;border:1px solid var(--linka2);border-radius:var(--r1);background:transparent;color:var(--rytina);font:500 var(--p6)/1 var(--f-mono);letter-spacing:.1em;text-transform:uppercase;cursor:pointer}
.reel-tl:hover{border-color:var(--elox)}
.reel-tl .ik{width:12px;height:12px}
.hl-text .akce{margin-top:clamp(16px,2vw,26px)}
.hl-text .akce .btn{margin-top:0}
.hl-video{position:absolute;inset:0;z-index:1;width:100%;height:100%;object-fit:contain;background:var(--obraz)}
.hl-mon.reel .hl-obraz{--pomer:16/9;cursor:default}
.hl-mon.reel .hl-text,.hl-mon.reel .ostreni,.hl-mon.reel .hud-kriz,.hl-mon.reel #heroPauza,.hl-mon.reel #reelTl{display:none}
.hl-mon.reel .hl-obraz::after,.hl-mon.reel .hl-obraz::before{display:none}
.reel-ovl{display:flex;align-items:center;gap:10px 14px;flex-wrap:wrap;padding:8px 12px;background:var(--obraz);border-top:1px solid var(--linka);font:500 var(--p6)/1 var(--f-mono);letter-spacing:.08em;color:var(--text2)}
.reel-ovl .osa{flex:1 1 200px}
.reel-cas{font-variant-numeric:tabular-nums;color:var(--rytina);white-space:nowrap}
.reel-ovl .btn.mal{min-height:30px;font-size:var(--p6)}
@media (max-width:560px){.reel-ovl .osa{order:-1;flex-basis:100%}}
/* ukázky práce (portfolio z reference.php) */
.pr-obory{margin-bottom:14px}
.prace{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:10px;align-items:start}
.prace .ukazka-prace{display:flex;flex-direction:column;gap:10px;padding:0 0 16px;overflow:hidden}
.prace .obraz{position:relative;display:block;width:100%;aspect-ratio:16/9;padding:0;border:0;border-bottom:1px solid var(--linka);background:var(--obraz);cursor:pointer;overflow:hidden}
.prace .obraz img,.prace .obraz video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.prace .obraz .hraj-ik{position:absolute;left:50%;top:50%;width:52px;height:52px;margin:-26px 0 0 -26px;border-radius:50%;background:var(--clona);color:var(--rytina);display:grid;place-items:center;border:1px solid var(--linka2);transition:border-color .15s,color .15s}
.prace .obraz:hover .hraj-ik{border-color:var(--ryska);color:var(--ryska)}
.prace .rad{display:flex;justify-content:space-between;gap:10px;padding:0 16px;font:500 var(--p6)/1.4 var(--f-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--elox)}
.prace .obraz+.rad{margin-top:4px}
.prace .ukazka-prace>.rad:first-child{margin-top:16px}
.prace .hvezdy{color:var(--pozor);letter-spacing:.1em}
.prace h3{padding:0 16px;font-size:var(--p3);line-height:1.25}
.prace blockquote{margin:0 16px;padding-left:12px;border-left:2px solid var(--linka2);font-size:var(--p5);line-height:1.55;color:var(--text2)}
.prace cite{display:block;margin-top:6px;font:400 var(--p6)/1.4 var(--f-mono);font-style:normal;color:var(--hloubka)}
/* postup: delší text kroku sbalený pod „Víc“ */
.krok-vic{grid-column:3;margin-top:-4px}
.krok-vic summary{display:inline-flex;align-items:center;gap:6px;min-height:32px;cursor:pointer;list-style:none;font:500 var(--p6)/1 var(--f-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--elox)}
.krok-vic summary::-webkit-details-marker{display:none}
.krok-vic summary::after{content:"+"}
.krok-vic[open] summary::after{content:"−"}
.krok-vic summary:hover{color:var(--rytina)}
.krok-vic p{margin-top:6px;font-size:var(--p5);line-height:1.6;color:var(--text2)}
@media (max-width:860px){.krok-vic{grid-column:2}}
.krok .vystup a{color:var(--text2);text-underline-offset:3px}
/* poptávka: odhad (jen když je kalkulačka zapnutá) a výsledek odeslání */
.job-odhad{display:grid;grid-template-columns:92px minmax(0,1fr);gap:2px 12px;margin:0 12px 12px;padding:10px 12px;border:1px solid var(--linka);border-radius:var(--r1);font-size:var(--p5)}
.job-odhad span{grid-row:span 2;font:500 var(--p6)/1.6 var(--f-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--hloubka)}
.job-odhad b{font:500 var(--p4)/1.3 var(--f-mono);color:var(--rytina)}
.job-odhad small{color:var(--elox)}
.job-stav .s-chyba{color:var(--chyba)}
.potvrzeni.chyba{border-color:var(--chyba);background:var(--chyba-slaba)}
.potvrzeni a{color:var(--rytina)}
.past{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.pozn-dole a{color:inherit}
/* kontakt: kdo za tím stojí + vybavení */
.kontakt-radek dd a{color:inherit;text-decoration:none}
.kontakt-radek dd a:hover{text-decoration:underline;text-underline-offset:4px;text-decoration-color:var(--elox)}
.o-mne .velky{font-size:var(--p3);line-height:1.5;color:var(--rytina)}
.o-mne h3{margin-top:10px;font-size:var(--p3)}
.vybava{margin-top:22px}
.vybava .insp-radky{padding:14px}
.kontakt .akce{margin-top:22px}
/* patička: e-mail a telefon jako odkazy (kopírování zůstává vedle) */
.kopie-in>span a{color:inherit;text-decoration:none}
.kopie-in>span a:hover{text-decoration:underline;text-underline-offset:3px}
/* odkazy na samostatné stránky služeb (pod timeline služeb, v inspektoru a u 3D skenu) */
.sl-stranky{display:flex;flex-wrap:wrap;align-items:center;gap:6px 18px;margin-top:18px;font-size:var(--p5)}
.sl-stranky .mini{margin:0}
.sl-stranky a{color:var(--text2);text-decoration:underline;text-underline-offset:4px;text-decoration-color:var(--linka2)}
.sl-stranky a:hover{color:var(--rytina);text-decoration-color:var(--elox)}
#sVic{margin-top:6px;min-height:36px}
.sken-ovl .sken-odkazy{margin-top:0}
/* souhrnné hodnocení u ukázek práce (jen od 3 hodnocení) */
.pr-hodnoceni{display:flex;align-items:baseline;gap:6px;margin:0;font:500 var(--p5)/1.3 var(--f-mono);color:var(--elox)}
.pr-hodnoceni .hvezdy{color:var(--pozor)}
.pr-hodnoceni b{font-weight:500;color:var(--rytina)}
/* balíčky z aplikace (sekce se ukáže, jen když jsou zapnuté) */
.balicky{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,280px),1fr));gap:10px;align-items:stretch}
.balicek{display:flex;flex-direction:column}
.balicek .panel-telo{display:flex;flex-direction:column;gap:12px;flex:1}
.balicek .seznam{font-size:var(--p5);color:var(--text2)}
.balicek .btn{margin-top:auto}
.bl-cena{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 8px}
.bl-cena b{font:500 var(--p3)/1.2 var(--f-mono);color:var(--rytina)}
.bl-cena small{font-size:var(--p5);color:var(--elox)}