/* písma jsou součástí složky (bez Google Fonts za běhu), SIL Open Font License */
@font-face{font-family:'DM Serif Display';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/dm-serif-display-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:'DM Serif Display';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/dm-serif-display-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:'DM Serif Display';font-style:italic;font-weight:400;font-display:swap;src:url(fonts/dm-serif-display-italic-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:'DM Serif Display';font-style:italic;font-weight:400;font-display:swap;src:url(fonts/dm-serif-display-italic-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:'Outfit';font-style:normal;font-weight:400 600;font-display:swap;src:url(fonts/outfit-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:'Outfit';font-style:normal;font-weight:400 600;font-display:swap;src:url(fonts/outfit-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}
:root{
  --paper:#f7f3ec;
  --sand:#efe7da;
  --line:#e0d6c6;
  --ink:#12343b;
  --petrol:#1f5c63;
  --muted:#4d6468;
  --coral:#ee8269;
  --coral-soft:#f8d9cf;
  --stena:#2b5d62;
  --tyrkys:#86b5ad;
  --lista:3.95rem;
  --f-head:'DM Serif Display',Georgia,serif;
  --f-body:'Outfit',system-ui,sans-serif;
  --delka:1;
}
/* délka vlasů žije na celé stránce: přepínač pod úvodem řídí i ceník za rohem, a to bez JavaScriptu */
html:has(#len-k:checked){--delka:0}
html:has(#len-d:checked){--delka:2}
*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{background:var(--paper);color:var(--ink);font:400 1.0625rem/1.6 var(--f-body)}
img{max-width:100%;display:block;height:auto}
a{color:inherit}
h1,h2,h3{font-family:var(--f-head);font-weight:400;line-height:1.08;letter-spacing:-.005em}
em{font-style:normal;color:var(--petrol)}
.skip{position:absolute;left:-999px;top:0;background:var(--ink);color:#fff;padding:.6rem 1rem;z-index:20}
.skip:focus{left:.5rem;top:.5rem}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
:focus-visible{outline:3px solid var(--ink);outline-offset:3px}
.stena-a :focus-visible,.stena-c :focus-visible,footer :focus-visible{outline-color:var(--coral)}
section{padding:4.5rem 1.25rem}
h2{font-size:clamp(2.1rem,7vw,3.4rem);margin-bottom:1.6rem}

/* buttons */
.btn{font:inherit;font-weight:600;cursor:pointer;border:0;color:inherit;background:none;display:inline-flex;align-items:center;justify-content:center;min-height:3.25rem;padding:.8rem 1.5rem;border-radius:999px;text-decoration:none;transition:transform .2s,background .2s,color .2s}
.btn:hover{transform:translateY(-2px)}
.btn:active{transform:translateY(0)}
.btn-coral{background:var(--coral);color:var(--ink)}
.btn-coral:hover{background:#f29680}
.btn-line{box-shadow:inset 0 0 0 1.5px var(--ink)}
.btn-line:hover{background:var(--ink);color:var(--paper)}
.btn-ink{background:var(--ink);color:var(--paper)}
.btn-ink:hover{background:var(--petrol)}
.more{display:inline-flex;align-items:center;min-height:44px;font-weight:600;color:var(--petrol);text-underline-offset:3px}
.plain{display:inline-flex;align-items:center;min-height:44px;padding:0;border:0;background:none;font:inherit;font-weight:600;color:inherit;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.plain:hover{text-decoration-thickness:2px}
.cta-pair{display:grid;gap:.75rem}

/* header: plný papír, rozostření pozadí by brzdilo otáčení domu pod ním */
.top{position:sticky;top:0;z-index:10;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.7rem 1.25rem;background:var(--paper);border-bottom:1px solid var(--line)}
.brand{text-decoration:none;display:flex;flex-direction:column;justify-content:center;min-height:44px;line-height:1.05}
.brand-name{font-family:var(--f-head);font-size:1.3rem}
.brand-sub{font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--petrol);font-weight:600}
.top nav{display:none}
.top-call{min-height:2.75rem;padding:.5rem 1.2rem}

/* hero */
.hero{display:grid;gap:2.25rem;padding-top:2.75rem;padding-bottom:3rem}
.hero h1{font-size:clamp(2.4rem,12vw,5.6rem);margin-bottom:1.2rem}
.hero h1 em{display:block}
.lead{font-size:1.15rem;color:var(--muted);max-width:34rem}
.cta{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:1.75rem}
.hint{margin-top:1rem;font-size:1rem;color:var(--muted)}

/* pás pod úvodem: přepínač délky a velké ceny, korál pokračuje do nebe nad domem */
.delka{scroll-margin-top:var(--lista);background:var(--coral);padding:3.25rem 1.25rem 2.5rem}
.delka :focus-visible{outline-color:var(--ink)}
.delka h2{font-size:clamp(2.75rem,12.6vw,6.6rem);line-height:1;margin-bottom:1.5rem}
.lenset{border:0;padding:0;min-width:0}
.len{position:absolute;opacity:0;pointer-events:none}
.switch{position:relative;display:grid;grid-template-columns:repeat(3,1fr);padding:.35rem;background:var(--ink);border-radius:999px}
.jezdec{position:absolute;top:.35rem;bottom:.35rem;left:.35rem;width:calc((100% - .7rem)/3);background:var(--paper);border-radius:999px;transform:translateX(calc(var(--delka)*100%));transition:transform .36s cubic-bezier(.65,0,.2,1)}
.switch label{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:4.1rem;padding:.3rem .25rem;border-radius:999px;color:var(--paper);font-weight:600;font-size:1.125rem;line-height:1.15;text-align:center;cursor:pointer;user-select:none;transition:color .2s}
.switch small{font-size:.9rem;font-weight:400;opacity:.82}
.switch label:hover{color:var(--coral-soft)}
.stena-c .switch label:hover{color:var(--paper)}
html:has(#len-k:checked) .switch [for=len-k],html:has(#len-s:checked) .switch [for=len-s],html:has(#len-d:checked) .switch [for=len-d]{color:var(--ink)}
html:has(#len-k:checked) .switch [for=len-k] small,html:has(#len-s:checked) .switch [for=len-s] small,html:has(#len-d:checked) .switch [for=len-d] small{opacity:1}
#len-k:focus-visible~.switch [for=len-k],#len-s:focus-visible~.switch [for=len-s],#len-d:focus-visible~.switch [for=len-d]{outline:3px solid var(--ink);outline-offset:4px}
.velke{list-style:none;padding:0;margin-top:2rem}
.velke li{padding:.75rem 0 .7rem;border-top:2px solid var(--ink)}
.velke-co{display:block;font-size:1.125rem;font-weight:500}
.c3{white-space:nowrap}
.c3 i{display:none;font-style:normal}
html:has(#len-k:checked) .c3 i.k,html:has(#len-s:checked) .c3 i.s,html:has(#len-d:checked) .c3 i.d{display:inline-block}
.velka{display:inline-flex;align-items:baseline;font-family:var(--f-head);font-weight:400;font-size:clamp(5rem,27vw,7rem);line-height:1.06}
.velka .kc{font-size:.36em}
.cif{position:relative;display:inline-block;width:.565em;text-align:center;justify-content:center}
.delka-dal{margin-top:1.1rem;font-size:1.1875rem;font-weight:600}
.delka-dal a{display:inline-flex;align-items:center;min-height:44px;text-decoration-thickness:2px;text-underline-offset:.22em}
.delka-dal a:hover{text-decoration-thickness:3px}

/* cena, která zahne za roh: krabička z dvou stran, po dobu otočení překryje číslo */
.plocha{position:relative;display:inline-block}
.kost{position:absolute;inset:0;transform-style:preserve-3d;pointer-events:none}
.kost span{position:absolute;inset:0;display:flex;align-items:center;justify-content:inherit;padding:inherit;border-radius:inherit;background:inherit;color:var(--kost-barva,inherit);backface-visibility:hidden;-webkit-backface-visibility:hidden}
.toci{color:transparent;perspective:7em;--kost-barva:var(--ink)}
.plocha.toci{--kost-barva:var(--paper)}
.toci>i{color:transparent}

/* scéna: bez JavaScriptu a při omezeném pohybu stěny leží pod sebou jako hotové pásy */
.scena{position:relative}
.kotva{position:absolute;left:0;width:1px;height:1px}
.zem,.pudorys,.sero,.zona-hem,.stena-a .cedule,.lampa,.stit{display:none}
section.stena{padding:0}
.stena{position:relative;overflow:clip}
.stena-a{background:var(--stena);color:var(--paper)}
section.stena-a{padding:3.5rem 1.25rem 2.5rem}
.stena-text h2{font-size:clamp(2.6rem,10vw,4.6rem);margin:0}
.ulice-veta{margin-top:.3rem;font-size:1.25rem;color:#d6e4e1}
.slovo{margin-top:1.6rem;font-family:var(--f-head);font-size:20vw;line-height:1;letter-spacing:-.012em;white-space:nowrap}

/* ulička se salonem: tři výlohy pod markýzou */
.stena-b{background:var(--sand)}
.zona-salon .stena-obsah{padding-top:3.5rem;padding-bottom:3rem}
.stena-b h2{padding:0 1.25rem;margin-bottom:1.4rem;font-size:clamp(2.6rem,11.4vw,5.2rem);line-height:1.02}
.markyza{position:relative;height:3rem;margin-bottom:2.6rem;filter:drop-shadow(0 .45rem .3rem rgba(18,52,59,.16));background:repeating-linear-gradient(90deg,var(--coral) 0 2.75rem,var(--paper) 0 5.5rem)}
.markyza::before{content:"";position:absolute;left:0;right:0;top:100%;height:1.375rem;background:radial-gradient(circle at 1.375rem 0,var(--coral) 1.375rem,transparent 1.39rem) 0 0/5.5rem 1.375rem repeat-x,radial-gradient(circle at 1.375rem 0,var(--paper) 1.375rem,transparent 1.39rem) 2.75rem 0/5.5rem 1.375rem repeat-x}
.vylohy{display:grid;gap:2.25rem;padding:0 1.25rem}
.okno{padding:.55rem;background:var(--petrol)}
.okno img{width:100%;aspect-ratio:14/9;object-fit:cover}
.okno{position:relative}
.okno::after{content:"";position:absolute;inset:.55rem;background:linear-gradient(180deg,rgba(18,52,59,.38),rgba(18,52,59,0) 26%)}
.vyloha h3{margin-top:.9rem;font-size:2.4rem}
.vyloha p{margin-top:.2rem}
.vyloha .od{margin-top:.6rem;font-weight:500}
.od b{font-weight:600;font-variant-numeric:tabular-nums}
.od .plocha{padding:0 .4em;background:var(--ink);color:var(--paper);border-radius:.3em;min-width:2.6em;text-align:center;justify-content:center}

/* ceník: tmavá stěna, ceny závislé na délce leží na vlastních destičkách a otáčejí se */
.stena-c{background:var(--ink);color:var(--paper)}
.stena-c .stena-obsah{padding:3.5rem 1.25rem 3rem}
.stena-c h2{margin:0;font-size:clamp(2.75rem,12vw,5.6rem);line-height:1}
.sec-lead{margin-top:.5rem;font-size:1.1875rem;color:#c9d8d6}
.cenik-hlava{display:grid;gap:1.25rem;margin-bottom:2.25rem}
.stena-c .switch{display:none;z-index:3;background:#245660}
.sjs .stena-c .switch{display:grid}
.stena-c .switch.pripnuty::before{content:"";position:absolute;z-index:-1;left:-1.25rem;right:-1.25rem;top:-9rem;bottom:-.6rem;background:var(--ink)}
.stena-c .jezdec{background:var(--coral)}
.groups{display:grid;gap:2rem}
.sloupec{display:grid;gap:2rem;align-content:start}
.group h3{font-size:2rem;color:var(--coral);margin-bottom:.3rem}
.list{list-style:none;padding:0}
.list li{display:flex;justify-content:space-between;align-items:center;gap:1rem;min-height:2.75rem;padding:.2rem 0;border-bottom:1px solid rgba(247,243,236,.14)}
.list small{color:#b9cbc9;font-size:1em}
.list b{font-weight:600;white-space:nowrap;font-size:1.125rem;font-variant-numeric:tabular-nums}
.list .plocha,.pevna{display:inline-block;min-width:3em;padding:0 .4em;line-height:1.7;text-align:right}
.list .plocha{justify-content:flex-end;background:#245660;border-radius:.3em}
.note{font-size:1.0625rem;color:#c9d8d6}

/* rodina: světlá stěna, nika se dvěma stoličkami z úvodu */
.stena-d{background:var(--paper)}
.stena-d .stena-obsah{display:grid;gap:2rem;padding:3.5rem 1.25rem 3rem}
.stena-d h2{margin:0;font-size:clamp(2.9rem,13.4vw,7rem);line-height:1}
.rodina-lead{margin-top:1rem;font-size:clamp(1.25rem,1.7vw,1.5rem);color:var(--muted);max-width:36rem}
.stena-d blockquote{margin-top:1.4rem;font-family:var(--f-head);font-size:clamp(1.6rem,6.4vw,2.5rem);line-height:1.18;color:var(--petrol);max-width:38rem}
.nika{margin:0}
.nika img{width:100%;aspect-ratio:4/4.6;object-fit:cover;object-position:60% 80%;border-radius:999px 999px 0 0}
.points{display:grid;gap:1.25rem}
.points h3{font-size:1.6rem;margin-bottom:.2rem}
.points p{color:var(--muted)}

/* konec */
.konec{scroll-margin-top:var(--lista);background:var(--coral);padding:4.5rem 1.25rem 3.5rem}
.konec :focus-visible{outline-color:var(--ink)}
.konec h2{margin:0;font-size:clamp(3.4rem,17.4vw,11.2rem);line-height:.98}
.roh{display:inline-block;white-space:nowrap}
.ohyb{display:inline-block;transform-origin:0 62%;transform:perspective(3.4em) rotateY(46deg)}
.konec-radek{display:grid;gap:2.5rem;margin-top:2.5rem}
.phone-link{display:block;padding:0;border:0;background:none;min-height:44px;font-family:var(--f-head);font-size:clamp(2.6rem,12vw,6.2rem);line-height:1.05;color:var(--ink);text-align:left;cursor:pointer}
.phone-link:hover{color:var(--petrol)}
.konec .demo-note{margin:.35rem 0 1.5rem;font-size:1.0625rem;color:var(--ink)}
.konec-info{display:grid;gap:1.25rem}
.konec-info dt{font-family:var(--f-head);font-size:1.5rem;line-height:1.2}
.konec-info dd{margin:0}

footer{display:grid;gap:1.1rem;padding:2.25rem 1.25rem calc(2rem + env(safe-area-inset-bottom));background:var(--ink);color:#d3dfdd;font-size:1.0625rem}
.foot-brand{font-family:var(--f-head);font-size:1.35rem;color:var(--paper)}
.foot-back a{display:inline-flex;align-items:center;min-height:44px;font-weight:600;color:var(--paper);text-underline-offset:3px}
.foot-back a:hover{color:var(--coral)}

/* smaltovaná uliční cedule */
.cedule{display:inline-block;justify-self:start;padding:.32rem;background:var(--paper);border-radius:.3rem;box-shadow:0 1px 0 rgba(18,52,59,.45)}
.cedule span{display:block;padding:.34rem 1rem .3rem;background:var(--petrol);color:var(--paper);border-radius:.14rem;font-weight:600;font-size:1rem;line-height:1.2;letter-spacing:.09em;text-transform:uppercase;white-space:nowrap}

/* floating call (mobile) */
.float-call{position:fixed;left:.75rem;right:.75rem;bottom:max(.75rem,env(safe-area-inset-bottom));z-index:15;display:flex;gap:.5rem;transition:transform .3s,opacity .3s,visibility .3s}
.float-call button{flex:1;display:flex;justify-content:center;align-items:center;min-height:3.4rem;border-radius:999px;border:0;font:inherit;font-weight:600;text-decoration:none;cursor:pointer;box-shadow:0 10px 30px rgba(18,52,59,.3)}
.float-call .fc-call{background:var(--coral);color:var(--ink)}
.float-call .fc-online{background:var(--ink);color:var(--paper)}
.pop{width:min(100% - 2rem,26rem);margin:auto;border:0;border-radius:24px;padding:2rem 1.5rem 1.25rem;background:var(--paper);color:var(--ink);box-shadow:0 30px 60px -20px rgba(18,52,59,.5)}
.pop::backdrop{background:rgba(18,52,59,.45)}
.pop h2{font-size:1.9rem;margin-bottom:.75rem}
.pop p{color:var(--muted);margin-bottom:1.4rem}
.pop .btn{width:100%}
.pop-close{display:flex;align-items:center;justify-content:center;width:max-content;margin:.5rem auto 0;min-height:44px;padding:0 1rem;font:inherit;color:var(--petrol);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.float-call.hide{transform:translateY(160%);opacity:0;visibility:hidden;pointer-events:none}

.demo-note{flex-basis:100%;margin:-.3rem 0 0;font-size:.875rem;color:var(--muted)}

@media (min-width:760px){
  :root{--lista:4.6rem}
  section{padding:6.5rem 2.5rem}
  .top{padding:.9rem 2.5rem}
  .top nav{display:flex;gap:2rem;margin-left:auto}
  .top nav a{text-decoration:none;font-weight:500}
  .top nav a:hover{color:var(--petrol)}
  .hero{grid-template-columns:1.1fr .9fr;align-items:center;gap:4rem;padding-top:4rem;padding-bottom:5rem;max-width:1200px;margin:0 auto}
  .hero h1{font-size:4.4rem}

  .delka{padding:clamp(4rem,6.6vw,6rem) 2.5rem clamp(2.5rem,4.4vw,4rem)}
  .delka-hlava{display:grid;grid-template-columns:minmax(0,1fr) minmax(24rem,31rem);align-items:end;gap:3rem}
  .delka h2{margin:0;font-size:clamp(3.2rem,6.6vw,6.8rem)}
  .switch{padding:.4rem}
  .jezdec{top:.4rem;bottom:.4rem;left:.4rem;width:calc((100% - .8rem)/3)}
  .switch label{min-height:4.75rem;font-size:1.3125rem}
  .switch small{font-size:1.0625rem}
  .velke{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 2.5rem;margin-top:clamp(2.5rem,4.6vw,4.25rem)}
  .velke-co{font-size:1.25rem}
  .velka{font-size:clamp(5rem,11.4vw,11.5rem)}

  section.stena-a{padding:5rem 2.5rem 3.5rem}
  .slovo{font-size:19.5vw}
  .zona-salon .stena-obsah{padding-top:5rem;padding-bottom:3.5rem}
  .stena-b h2{padding:0 2.5rem;margin-bottom:1.6rem}
  .vylohy{grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(1.25rem,2.6vw,2.5rem);padding:0 2.5rem}
  .okno img{aspect-ratio:1/1.02}
  .vyloha h3{font-size:2.75rem}
  .vyloha p{font-size:1.125rem}
  .stena-c .stena-obsah{padding:5rem 2.5rem 3.5rem}
  .cenik-hlava{margin-bottom:2.5rem}
  .groups{grid-template-columns:repeat(2,minmax(0,1fr));gap:2.25rem 3rem}
  .stena-d .stena-obsah{padding:5rem 2.5rem 3.5rem}
  .konec{padding:clamp(5rem,8vw,7.5rem) 2.5rem clamp(4rem,6vw,5.5rem)}
  .konec h2{font-size:clamp(4rem,10.2vw,11.2rem)}
  .konec-radek{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:4rem;margin-top:clamp(3rem,5vw,4.5rem)}
  .phone-link{font-size:clamp(2.6rem,6.1vw,6.2rem)}
  .konec .btn{white-space:nowrap}
  .konec .cta-pair{flex-wrap:wrap}
  .konec-info{grid-template-columns:repeat(2,minmax(0,1fr));gap:1.5rem 2.5rem}
  .konec-info>div:last-child{grid-column:1/-1}
  .konec-info dt{font-size:1.75rem}
  .cta-pair{display:flex;gap:.75rem}
  .float-call{display:none}
  footer{grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:1.75rem;padding:2rem 2.5rem}
}
@media (min-width:900px){
  .cenik-hlava{grid-template-columns:minmax(0,1fr) minmax(24rem,31rem);align-items:end;gap:3rem}
  .stena-c h2{font-size:clamp(3rem,min(5.6vw,11.5svh),6rem)}
  .groups{grid-template-columns:repeat(3,minmax(0,1fr));gap:0 clamp(2rem,3.6vw,4.5rem)}
  .group h3{font-size:clamp(1.75rem,2.3vw,2.5rem)}
  .list li{min-height:clamp(2.35rem,5svh,3.5rem)}
  .list b{font-size:clamp(1.125rem,1.3vw,1.4rem)}
  .list li>span:first-child{font-size:clamp(1.0625rem,1.25vw,1.3rem)}
  .okno img{aspect-ratio:auto;height:clamp(12rem,calc(100svh - 34.5rem),30rem)}
  .stena-d .stena-obsah{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:2.5rem 4.5rem;align-items:start}
  .rodina-text{grid-column:1;grid-row:1}
  .nika{grid-column:2;grid-row:1}
  .points{grid-column:1/-1;grid-row:2;grid-template-columns:repeat(3,minmax(0,1fr));gap:2rem}
}
@media (min-width:1100px){
  .nika{grid-row:1/3}
  .points{grid-column:1}
}

/* TŘI ROZMĚRY: třídu scena3d zapíná script.js, jen když je dovolený pohyb. Velikosti --V, --H, --L, --F, --P, --G dopočítá script.js */
.scena3d .scena{height:var(--scena,640svh)}
.scena3d .podium{position:sticky;top:0;height:100lvh;overflow:hidden;background:var(--coral);perspective:var(--P);perspective-origin:50% 50%}
.scena3d .svet{position:absolute;left:50%;top:50%;width:1px;height:1px;transform-origin:0 0;transform-style:preserve-3d;will-change:transform}
.scena3d .stena{position:absolute;left:0;top:calc(var(--H)/-2);height:var(--H);transform-origin:0 0;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.scena3d .stena-a,.scena3d .stena-c{width:var(--V)}
.scena3d .stena-b,.scena3d .stena-d{width:var(--L)}
.scena3d .stena::before,.scena3d .stena::after{content:"";position:absolute;left:0;right:0;z-index:2;background:rgba(10,36,42,.34)}
.scena3d .stena::before{top:0;height:calc(var(--H)*.028)}
.scena3d .stena::after{bottom:0;height:calc(var(--H)*.034)}
.scena3d .stena-d::after{background:#d8ccb7}
.scena3d .zona-salon::after{content:"";position:absolute;z-index:2;left:0;right:0;bottom:0;height:calc(var(--H)*.034);background:var(--petrol)}
.scena3d .sero{display:block;position:absolute;inset:0;z-index:3;background:#0b2a30;opacity:0;pointer-events:none}
.scena3d .stena-b .sero{background:linear-gradient(90deg,#0b2a30 calc(var(--L) - var(--V)),#6a4a30 0)}
.scena3d .stena-d .sero{background:#6a4a30}

/* silnice je jednolitá plocha bez obsahu, kreslený půdorys má vlastní menší vrstvu (kvůli paměti na telefonu) */
.scena3d .zem{display:block;position:absolute;left:0;top:0;width:var(--G);height:var(--G);background:#5f8483}
.scena3d .pudorys{display:block;position:absolute;left:0;top:0}
.scena3d .chodnik{position:absolute;background:#e9dcc6;border-radius:calc(var(--V)*.09);box-shadow:0 0 0 .55rem #f6efe1}
.scena3d .stin{position:absolute;background:linear-gradient(90deg,rgba(18,52,59,.42),rgba(18,52,59,0))}
.scena3d .lampa,.scena3d .stit{display:block;position:absolute;left:0;top:0;overflow:visible}
.scena3d .lampa{transform-origin:50% 100%}
.scena3d .skryta{visibility:hidden}
.lampa .kov,.stit .kov{fill:none;stroke:var(--ink);stroke-width:8}
.lampa .pata,.stit .pata{fill:var(--ink)}
.lampa .sklo{fill:var(--paper)}
.stit .nuzky{fill:none;stroke:var(--coral);stroke-width:8;stroke-linecap:round}
.scena3d .prechod{position:absolute;background:repeating-linear-gradient(90deg,var(--paper) 0 3.4rem,transparent 0 6.8rem)}

.scena3d section.stena-a{padding:0}
.scena3d .stena-text{position:absolute;z-index:1;left:clamp(1.25rem,3vw,3rem);top:calc(var(--lista) + clamp(1.2rem,5svh,3rem))}
.scena3d .stena-text h2{font-size:clamp(2.6rem,6vw,5.4rem)}
.scena3d .ulice-veta{font-size:clamp(1.25rem,2vw,1.75rem)}
.scena3d .stena-a .cedule{display:block;position:absolute;z-index:1;right:calc(var(--V)*.035);top:calc(var(--lista) + clamp(1.2rem,5svh,3rem))}
.scena3d .slovo{position:absolute;bottom:calc(var(--H)*.085);margin:0;font-size:var(--F);line-height:.84}
.scena3d .stena-a .slovo{right:0;padding-right:calc(var(--F)*.02);text-align:right;color:var(--paper)}
.scena3d .stena-a .sl3{display:none}
.scena3d .stena-b{display:flex}
.scena3d .zona-hem{display:block;position:relative;flex:0 0 calc(var(--L) - var(--V));height:100%;background:var(--tyrkys);color:var(--ink)}
.scena3d .zona-hem .slovo{left:0;padding-left:calc(var(--F)*.02)}
.scena3d .zona-salon{position:relative;flex:0 0 var(--V);height:100%;overflow:clip;background:var(--sand)}
.scena3d .stena-obsah{position:relative;width:var(--V);min-height:100%}
.scena3d .zona-salon .stena-obsah{padding-top:calc(var(--lista) + 1.25rem);padding-bottom:calc(var(--H)*.06)}
.scena3d .stena-c .stena-obsah{padding-top:calc(var(--lista) + 1.5rem)}
.scena3d .stena-d .stena-obsah{padding-top:calc(var(--lista) + 2rem)}
@media (max-width:759px){
  .scena3d .stena-text{left:1.25rem}
  .scena3d .sl1{display:block;text-align:left;padding-left:calc(var(--F)*.03)}
  .scena3d .stena-a .slovo{left:0;bottom:calc(var(--H)*.13)}
  .scena3d .zona-hem .slovo{bottom:calc(var(--H)*.13)}
  .scena3d .stena-a .cedule{display:none}
  .scena3d .stena-text h2{font-size:min(3.3rem,13.2vw)}
  .scena3d .zona-salon .stena-obsah,.scena3d .stena-c .stena-obsah,.scena3d .stena-d .stena-obsah{padding-bottom:6.5rem}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.btn,.float-call,.switch label,.jezdec{transition:none}}
p,li{text-wrap:pretty}
h1,h2,h3{text-wrap:balance}
/* HERO-OBRAZ (generuje vizitka/tools/hero_obraz.py) */
.hero-obraz{--ho-h:max(34rem,min(calc(100svh - 4.5rem),56.25vw))}
.ho-obraz{position:relative;margin:0;overflow:hidden}
.ho-obraz img{display:block;width:100%;height:auto;aspect-ratio:4/5;max-height:max(20rem,48svh);object-fit:cover;object-position:50% 80%}
@media (prefers-reduced-motion:no-preference){.ho-obraz img{animation:ho-zoom 1.2s cubic-bezier(.16,1,.3,1) both}}
@keyframes ho-zoom{from{transform:scale(1.04)}}
@media (max-width:1099px){
.hero-obraz{overflow-x:clip;padding-top:0}
.hero-obraz>.ho-obraz{grid-column:1/-1;width:100vw;max-width:none;margin:0 calc(50% - 50vw) 1.4rem}
}
@media (min-width:760px) and (max-width:1099px){
.ho-obraz img{aspect-ratio:16/9;max-height:60svh;object-position:50% 50%}
}
@media (min-width:1100px){
.hero-obraz{position:relative;isolation:isolate}
.hero-obraz>.ho-obraz{position:absolute;top:0;left:0;right:0;height:var(--ho-h);z-index:-1;margin:0}
.ho-obraz picture{display:contents}
.ho-obraz img{width:100%;height:100%;max-height:none;aspect-ratio:auto;object-position:var(--ho-pos,50% 50%)}
.ho-obraz::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,rgb(var(--ho-t) / .9) 0,rgb(var(--ho-t) / .72) 30%,rgb(var(--ho-t) / .25) 52%,rgb(var(--ho-t) / 0) 66%)}
}
@media (min-width:760px) and (max-width:1099px){.hero-obraz{grid-template-columns:minmax(0,1fr);padding-top:0}}
@media (min-width:1100px){
.hero-obraz{--ho-t:18 52 59;grid-template-columns:minmax(0,1fr);max-width:none;min-height:var(--ho-h);align-content:center;padding-top:0;padding-bottom:0}
.hero-obraz .hero-text{--ink:#f7f3ec;--muted:#dce7e5;--petrol:#f7f3ec;--paper:#12343b;color:#f7f3ec;max-width:36rem}
.hero-obraz .hero-text h1{color:#f7f3ec}
.hero-obraz .btn-coral{color:#12343b}
}
/* /HERO-OBRAZ */
/* FORMA-POLISH (generuje vizitka/tools/ukazky-polish.py) */
::selection{background:#ee8269;color:#111111}
:where(html){scrollbar-color:#12343b #f7f3ec}
:where(input,textarea){caret-color:#12343b}
:where(a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible,[tabindex]:focus-visible){outline:3px solid #12343b;outline-offset:3px}
:where(a){text-underline-offset:.2em}
:where(table,dd,time,data,[class*=cen],[class*=price],[class*=hod],[class*=hours],[class*=doba],[class*=kc]){font-variant-numeric:tabular-nums}
.float-call{bottom:calc(12px + env(safe-area-inset-bottom))}
/* /FORMA-POLISH */
