/* Salon Pastel (ukázkový web FORMA). Písma: DM Serif Display, Figtree a Kalam, Fontsource, SIL Open Font License 1.1 */
@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-20C0,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-20C0,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:'Figtree';font-style:normal;font-weight:300 900;font-display:swap;src:url(fonts/figtree-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-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Figtree';font-style:normal;font-weight:300 900;font-display:swap;src:url(fonts/figtree-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:'Kalam';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/kalam-400-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-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Kalam';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/kalam-400-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{--pine:#26211f;--pine2:#3a3330;--cream:#f6efe2;--paper:#fffaf0;--sand:#e8dcc4;--brick:#b4492f;--brick-d:#9a3b24;--ink:#221d1b;--mute:#625a55;
--serif:"DM Serif Display",Georgia,"Times New Roman",serif;--sans:"Figtree",system-ui,-apple-system,"Segoe UI",sans-serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:70px}
body{margin:0;background:var(--cream);color:var(--ink);font:400 17px/1.6 var(--sans);-webkit-text-size-adjust:100%;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
h1,h2,h3{font-family:var(--serif);font-weight:400;line-height:1.1;margin:0}
:focus-visible{outline:3px solid var(--brick);outline-offset:3px}
.skip{position:absolute;left:-999px;top:8px;background:var(--paper);padding:10px 14px;z-index:99}
.skip:focus{left:8px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.nw{white-space:nowrap}

.btn{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:0 24px;border-radius:999px;background:var(--brick);color:#fff;font:700 17px var(--sans);text-decoration:none;border:2px solid var(--brick);cursor:pointer;transition:background .2s}
.btn:hover{background:var(--brick-d);border-color:var(--brick-d)}
.btn-sm{min-height:44px;padding:0 18px;font-size:16px}
.btn-ghost{background:transparent;color:var(--cream);border-color:var(--cream)}
.btn-ghost:hover{background:var(--cream);color:var(--pine);border-color:var(--cream)}

.top{display:flex;align-items:center;gap:14px;padding:10px 16px;background:var(--cream);position:sticky;top:0;z-index:20;border-bottom:1px solid var(--sand)}
.brand{font:400 30px/1 var(--serif);text-decoration:none;color:var(--pine);margin-right:auto}
.top nav{display:none}
.top nav a{text-decoration:none;font-weight:500;padding:8px 10px}
.top nav a:hover{color:var(--brick)}

.hero{background:var(--pine);color:var(--cream);padding-bottom:44px}
.awning{height:40px;background:repeating-linear-gradient(90deg,var(--brick) 0 28px,var(--cream) 28px 56px);
-webkit-mask:linear-gradient(#000,#000) 0 0/100% 20px no-repeat,radial-gradient(circle at 28px 0,#000 27.5px,transparent 28.5px) 0 20px/56px 20px repeat-x;
mask:linear-gradient(#000,#000) 0 0/100% 20px no-repeat,radial-gradient(circle at 28px 0,#000 27.5px,transparent 28.5px) 0 20px/56px 20px repeat-x}
.hero-in{padding:28px 20px 0;display:grid;gap:30px;max-width:1120px;margin:0 auto}
.hero h1{font-size:clamp(36px,10.4vw,64px);letter-spacing:-.01em}
.hero h1 em{font-style:italic;color:#f1b99f}
.lead{font-size:19px;margin:18px 0 24px;max-width:34ch;color:#e9e2d2}
.cta{display:flex;flex-direction:column;gap:12px;max-width:340px}
.open-now{margin:22px 0 4px;font-weight:700}
.open-now.is-open::before{content:"";display:inline-block;width:10px;height:10px;border-radius:50%;background:#8fe0a6;margin-right:8px}
.place{margin:0;color:#e9e2d2}.place a,.place .as-link{color:#e9e2d2}
.photo{margin:0;transform:rotate(-1.5deg);background:var(--cream);padding:10px 10px 36px;box-shadow:0 14px 30px rgba(0,0,0,.3);width:100%;max-width:420px;justify-self:center}
.photo img{width:100%;aspect-ratio:8/9;object-fit:cover}

.facts{display:grid;gap:0;background:var(--sand);padding:6px 20px}
.facts p{margin:0;padding:12px 0;border-bottom:1px dotted var(--mute);font-weight:500;text-align:center}
.facts p:last-child{border:0}

section h2{font-size:clamp(30px,8vw,46px)}
.services,.about,.job{padding:56px 20px;max-width:900px;margin:0 auto}
.sec-lead{margin:12px 0 28px;color:var(--mute)}
.menu{background:var(--paper);border:2px solid var(--pine);border-radius:6px;padding:4px 18px}
.menu details{border-bottom:1px dotted var(--pine)}
.menu details:last-child{border:0}
summary{display:flex;flex-direction:column;gap:2px;padding:16px 36px 16px 0;cursor:pointer;position:relative;list-style:none;min-height:44px}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";position:absolute;right:2px;top:50%;transform:translateY(-50%);font:400 30px/1 var(--serif);color:var(--brick)}
details[open]>summary::after{content:"–"}
.n{font:400 24px/1.15 var(--serif);color:var(--pine)}
.s{font-size:15px;color:var(--mute)}
.body{padding:0 0 20px}
.body p{margin:0 0 12px}
.small{font-size:15px;color:var(--mute)}
.items{margin:0 0 14px;padding:0;list-style:none}
.items li{padding:7px 0 7px 22px;position:relative;border-top:1px solid #efe4cf;display:flex;justify-content:space-between;align-items:baseline;gap:14px}
.it em{display:block;font-style:normal;font-size:15px;line-height:1.4;color:var(--mute)}
.pr{flex:none;white-space:nowrap;font-weight:700;color:var(--pine)}
.price-note{margin:18px 0 0}
.items li::before{content:"";position:absolute;left:2px;top:17px;width:8px;height:8px;border-radius:50%;background:var(--brick)}
.call a,.call button{display:inline-flex;align-items:center;min-height:44px;font-weight:700;color:var(--brick-d)}
.call button{padding:0;border:0;background:none;font:700 17px var(--sans);text-decoration:underline;text-underline-offset:.18em;cursor:pointer}
.call button:hover{color:var(--brick)}

.gallery{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:0 6px}
.gallery figure{margin:0}
.gallery img{width:100%;aspect-ratio:1;object-fit:cover}

.quote{background:var(--brick);color:#fff;padding:56px 24px;text-align:center}
.quote blockquote{margin:0 auto;max-width:700px}
.quote p{font:400 clamp(24px,6.4vw,38px)/1.25 var(--serif);margin:0 0 14px}
.quote footer{background:none;padding:0;font-size:15px;opacity:.95}

.about h2{margin-bottom:22px}
.about-grid p{margin:0 0 16px}
.brands{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.brands li{border:1.5px solid var(--pine);border-radius:999px;padding:5px 14px;font-weight:500;font-size:15px}

.poukaz{background:var(--pine);color:var(--cream);padding:56px 20px}
.poukaz-in{max-width:960px;margin:0 auto;display:grid;gap:28px}
.poukaz h2{margin-bottom:14px}
.poukaz p{margin:0 0 12px}
.poukaz a{color:#f1b99f}
form{display:grid;gap:14px}
label{display:grid;gap:6px;font-weight:500}
input,textarea{font:inherit;color:var(--ink);background:var(--paper);border:2px solid transparent;border-radius:6px;padding:12px;min-height:48px;width:100%}
input:focus-visible,textarea:focus-visible{outline:3px solid #f1b99f}
.form-msg{margin:0;min-height:1.6em;font-weight:500}

.job{text-align:center;padding-bottom:48px}
.job h2{margin-bottom:10px}
.job a{font-weight:700;color:var(--brick-d)}

#kontakt{background:var(--ink);color:#e9e2d2;padding:48px 20px 100px}
.foot-grid{max-width:1000px;margin:0 auto;display:grid;gap:34px}
#kontakt h2{font-size:34px;margin-bottom:14px;color:var(--cream)}
#kontakt h3{font-size:22px;margin-bottom:10px;color:var(--cream)}
address{font-style:normal;display:grid;gap:6px}
address a,address span{padding:2px 0}
#kontakt a{color:#f1b99f}
table{border-collapse:collapse;width:100%;max-width:340px}
th,td{text-align:left;padding:5px 0;border-bottom:1px dotted #6a625c;font-weight:400}
td{text-align:right}
tr.today th,tr.today td{color:#fff;font-weight:700}
.phones{list-style:none;margin:0;padding:0}
.phones li{display:flex;justify-content:space-between;gap:12px;padding:6px 0;border-bottom:1px dotted #6a625c}
.phones a{text-decoration:none;font-weight:700;white-space:nowrap;min-height:24px}
.forma{max-width:1000px;margin:36px auto 0;font-size:14px;color:#c4bcb4}

.sticky{position:fixed;left:10px;right:10px;bottom:10px;z-index:30;display:flex;gap:8px;padding:8px;background:var(--pine);border-radius:999px;box-shadow:0 8px 24px rgba(0,0,0,.3);transform:translateY(140%);transition:transform .3s}
.sticky.is-shown{transform:none}
.sticky button{flex:1;min-height:48px;border-radius:999px;font:700 16px var(--sans);display:flex;align-items:center;justify-content:center;text-decoration:none;cursor:pointer}
.sticky .sc-call{background:var(--brick);color:#fff;border:0}
.sticky button{background:transparent;color:var(--cream);border:2px solid var(--cream)}

.pop{margin:auto;max-width:min(92vw,420px);border:0;border-radius:10px;padding:28px 24px;background:var(--paper);color:var(--ink);box-shadow:0 20px 50px rgba(0,0,0,.4)}
.pop::backdrop{background:rgba(30,24,22,.6)}
.pop h2{font-size:28px;margin-bottom:10px;color:var(--pine)}
.pop p{margin:0 0 18px}
.pop .btn{display:flex;width:100%}

@media(min-width:700px){
  .items.cols{columns:2;column-gap:28px}
  .items.cols li{break-inside:avoid}
  .cta{flex-direction:row;max-width:none}
  .facts{grid-template-columns:repeat(3,1fr);padding:14px 20px}
  .facts p{border:0;border-right:1px dotted var(--mute)}
  .facts p:last-child{border:0}
  .gallery{grid-template-columns:repeat(4,1fr);gap:8px;padding:0 8px}
  .foot-grid{grid-template-columns:1fr 1fr 1fr}
}
@media(min-width:860px){
  .top{padding:12px 40px}
  .top nav{display:flex;gap:6px}
  .awning{height:48px;-webkit-mask-size:100% 24px,68px 24px;mask-size:100% 24px,68px 24px;background:repeating-linear-gradient(90deg,var(--brick) 0 34px,var(--cream) 34px 68px);
  -webkit-mask:linear-gradient(#000,#000) 0 0/100% 24px no-repeat,radial-gradient(circle at 34px 0,#000 33.5px,transparent 34.5px) 0 24px/68px 24px repeat-x;
  mask:linear-gradient(#000,#000) 0 0/100% 24px no-repeat,radial-gradient(circle at 34px 0,#000 33.5px,transparent 34.5px) 0 24px/68px 24px repeat-x}
  .hero-in{grid-template-columns:1.2fr 1fr;align-items:center;padding:48px 40px 0;gap:60px}
  .poukaz-in{grid-template-columns:1fr 1fr;gap:56px}
  .sticky{display:none}
  #kontakt{padding-bottom:48px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

/* ukázka na vizitce FORMA: telefon, mapa, Instagram a objednání otevřou vysvětlení */
.as-link{padding:0;border:0;background:none;color:inherit;font:inherit;text-align:inherit;text-decoration:underline;text-underline-offset:.18em;cursor:pointer}
.as-link:hover{text-decoration-thickness:2px}
.poukaz .as-link{color:#f1b99f}
.job .as-link{font-weight:700;color:var(--brick-d)}
#kontakt .as-link{color:#f1b99f}
address .as-link{justify-self:start;padding:2px 0}
.fake{font-size:.85em;white-space:nowrap}
.hours-note{margin:12px 0 0;max-width:340px;font-size:15px;color:#c4bcb4}
.forma-back{max-width:1000px;margin:10px auto 0}
.foot-back{font-weight:700}
.pop .btn{margin-top:4px}
/* stav otevřeno/zavřeno má na telefonu místo na dva řádky, aby po doplnění skriptem neposkočila fotka pod ním (CLS) */
@media(max-width:699px){.open-now{min-height:3.2em}}
/* 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 .hero-in{grid-template-columns:minmax(0,1fr);padding-top:0}}
@media (min-width:1100px){
.hero-obraz{--ho-t:38 33 31;padding-bottom:0}
.hero-obraz .hero-in{grid-template-columns:minmax(0,1fr);min-height:var(--ho-h);align-content:center;padding-top:0}
.hero-obraz .hero-text{max-width:34rem}
}

.ho-v{display:none}
.ho-btn{position:absolute;z-index:3;display:none;align-items:center;justify-content:center;width:2.5rem;height:2.5rem;padding:0;border:1px solid rgb(255 255 255 / .6);border-radius:999px;background:rgb(0 0 0 / .55);color:#fff;cursor:pointer}
.ho-btn:hover{background:rgb(0 0 0 / .75)}
.ho-btn:focus-visible{outline:3px solid #fff;outline-offset:2px;box-shadow:0 0 0 6px #000}
.ho-btn{opacity:0;transition:opacity .2s}
.ho-btn:focus-visible{opacity:1}
@media (hover:hover){.hero-obraz:hover .ho-btn{opacity:1}}
.ho-ico{width:.72rem;height:.8rem;border-left:.24rem solid currentColor;border-right:.24rem solid currentColor;box-sizing:border-box}
.ho-btn[aria-pressed="true"] .ho-ico{width:0;height:0;border:0;border-top:.42rem solid transparent;border-bottom:.42rem solid transparent;border-left:.7rem solid currentColor;margin-left:.15rem}
@media (min-width:760px){
.ho-v{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 50%;opacity:0;transition:opacity .9s linear;pointer-events:none}
.ho-v.is-on{opacity:1}
.ho-btn.is-on{display:inline-flex}
}
@media (min-width:760px) and (max-width:1099px){
.hero-obraz{position:relative}
.ho-btn{top:calc(min(56.25vw,60svh) - 4.9rem);right:calc(50% - 50vw + .5rem)}
}
@media (min-width:1100px){
.ho-v{object-position:var(--ho-pos,50% 50%)}
.ho-btn{top:calc(var(--ho-h) - 4.9rem);right:.5rem}
}
/* /HERO-OBRAZ */
/* TUNING 30. 10. 2026: markýza, lístek, salon, poukaz, konec. Základ je hotová kompozice, vysokou scénu zapíná skript (html.scena-zap). */
:root{--peach:#f3c8b1;--pruh:#f4ebdc;--papir:#fffaf0;--linka:#eadfcb;--ruka:"Kalam","Segoe Print","Bradley Hand",cursive;
--hlava:65px;--okraj:20px;--okap:var(--okraj);--pr:38px;--pul:19px;--bar:24px;--role:46px;--kratka:22px;--vyhled:118px}
@media(min-width:860px){:root{--hlava:69px;--okraj:60px;--okap:max(60px,calc(50vw - 660px));--pr:72px;--pul:36px;--bar:38px;--role:66px;--kratka:40px;--vyhled:96px}}

/* látka: pruhy a lem; každý pruh končí vlastním obloučkem */
.pruhy{background-color:var(--brick);background-image:repeating-linear-gradient(90deg,var(--brick) 0 var(--pr),var(--pruh) var(--pr) calc(var(--pr)*2))}
.zoubky{-webkit-mask:linear-gradient(#000,#000) 0 0/100% calc(var(--bar) + 1px) no-repeat,radial-gradient(circle at 50% 0,#000 calc(var(--pul) - .5px),transparent calc(var(--pul) + .5px)) 0 var(--bar)/var(--pr) var(--pul) repeat-x;
mask:linear-gradient(#000,#000) 0 0/100% calc(var(--bar) + 1px) no-repeat,radial-gradient(circle at 50% 0,#000 calc(var(--pul) - .5px),transparent calc(var(--pul) + .5px)) 0 var(--bar)/var(--pr) var(--pul) repeat-x}

/* markýza v úvodu */
.awning{--pr:28px;--pul:14px;--bar:26px;position:relative;z-index:1;height:calc(var(--bar) + var(--pul));background:none;-webkit-mask:none;mask:none;filter:drop-shadow(0 7px 9px rgba(20,16,14,.42))}
.awning i{display:block;position:relative;height:100%}
.awning i::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,16,14,.34) 0,rgba(20,16,14,0) 42%),repeating-linear-gradient(90deg,rgba(38,33,31,.32) 0 6px,transparent 6px 11px) 0 calc(var(--bar) - 4px)/100% 1px no-repeat}
@media(min-width:860px){.awning{--pr:34px;--pul:17px;--bar:31px;height:calc(var(--bar) + var(--pul));background:none;-webkit-mask:none;mask:none}}
@media(max-width:1099px){.hero-obraz>.ho-obraz{margin-bottom:0}.scena-zap .hero-obraz{padding-bottom:0}}
@media(min-width:1100px){.scena-zap .scena{margin-top:-48px}}

/* roleta: role, plocha, záhyby, lem se stínem */
.ml{position:relative;height:calc(var(--role)*.8 + var(--kratka) + var(--bar) + var(--pul));pointer-events:none}
.ml-role{position:absolute;left:0;right:0;top:0;z-index:2;height:var(--role);transform-origin:50% 0}
.ml-role::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,16,14,.5) 0,rgba(20,16,14,.14) 16%,rgba(255,255,255,.16) 38%,rgba(255,255,255,.02) 56%,rgba(20,16,14,.2) 80%,rgba(20,16,14,.56) 100%)}
.ml-klip{position:absolute;left:0;right:0;top:calc(var(--role)*.8);bottom:calc(var(--vyhled)*-1);overflow:hidden}
.ml-latka{position:absolute;left:0;right:0;top:0;height:var(--kratka)}
.ml-plocha{position:absolute;inset:0;overflow:hidden}
.ml-plocha::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,16,14,.42) 0,rgba(20,16,14,0) 60px)}
.ml-stitek{display:none;position:absolute;z-index:1;left:50%;top:46%;transform:translate(-50%,-50%) rotate(-1deg);padding:.52em .95em .6em;background:var(--papir);color:var(--pine);font:italic 400 clamp(30px,4.4vw,64px)/1 var(--serif);white-space:nowrap;box-shadow:0 2px 0 rgba(38,33,31,.12),0 10px 22px rgba(38,33,31,.22);outline:1.5px dashed rgba(38,33,31,.4);outline-offset:-9px}
.ml-stin{position:absolute;left:0;right:0;top:100%;height:calc(var(--bar) + var(--pul) + 52px);background:linear-gradient(180deg,rgba(38,33,31,.34) 0,rgba(38,33,31,.34) var(--bar),rgba(38,33,31,.2) calc(var(--bar) + 26px),rgba(38,33,31,.07) calc(var(--bar) + 52px),rgba(38,33,31,0) 100%)}
.ml-lem{position:absolute;left:0;right:0;top:calc(100% - 1px);height:calc(var(--bar) + var(--pul));transform-origin:50% 0}
.ml-lem::after{content:"";position:absolute;inset:0;background:
linear-gradient(180deg,rgba(20,16,14,.34) 0,rgba(20,16,14,.05) 8px,rgba(20,16,14,0) 40%,rgba(20,16,14,.1) 100%),
repeating-linear-gradient(90deg,rgba(38,33,31,.42) 0 8px,transparent 8px 14px) 0 10px/100% 1.5px no-repeat}

/* scéna a věta */
.scena{position:relative;background:var(--peach);color:var(--pine)}
.pin{position:relative;display:flex;flex-direction:column;overflow:hidden;background:var(--peach)}
.pin .ml{order:-1}
.veta{position:relative;padding:clamp(44px,7vw,96px) var(--okraj) clamp(84px,9vw,128px)}
.veta-in{position:relative}
.veta h2{font-size:15.4vw;line-height:.98;letter-spacing:-.015em}
.veta .r1,.veta .r2{display:block}
.proc{margin-top:26px;max-width:21em;font:400 clamp(25px,2.7vw,40px)/1.28 var(--serif)}
.proc p{margin:0}
.deset{position:relative;display:inline-block;white-space:nowrap}
.deset svg{position:absolute;left:-.1em;top:100%;width:calc(100% + .2em);height:.36em;margin-top:-.08em;overflow:visible;fill:none;stroke:var(--brick);stroke-width:3.5;pointer-events:none}
.deset path{vector-effect:non-scaling-stroke;stroke-linecap:round}
.podpis{margin:.9em 0 0!important;font:400 21px/1.3 var(--ruka);color:#6d3b27}
.scena-zap .deset svg{clip-path:inset(-40% 100% -40% 0);transition:clip-path .9s cubic-bezier(.45,.05,.3,1)}
.scena-zap .deset.tah svg{clip-path:inset(-40% -2% -40% 0)}
.scena-zap .scena{height:300vh;height:300svh}
.scena-zap .scena .pin{position:sticky;top:0;height:100vh;height:100svh}
.scena-zap .scena .ml{position:absolute;inset:0;z-index:2;height:auto}
.ml-sero{display:none}
.scena-zap .ml-sero{display:block;position:absolute;inset:0;z-index:1;background:rgba(92,42,22,.44);will-change:opacity}
.scena-zap .scena .ml::before{content:"";position:absolute;left:0;right:0;top:0;height:var(--hlava);background:var(--pine)}
.scena-zap .scena .ml-role{top:var(--hlava);will-change:transform}
.scena-zap .scena .ml-klip{top:calc(var(--hlava) + var(--role)*.8);bottom:0}
.scena-zap .scena .ml-latka{height:calc(100vh - var(--hlava) - var(--role)*.8 - var(--bar) - var(--pul) - var(--vyhled));height:calc(100svh - var(--hlava) - var(--role)*.8 - var(--bar) - var(--pul) - var(--vyhled));will-change:transform}
.scena-zap .scena .ml-lem{will-change:transform}
.scena-zap .ml-stitek{display:block}
.scena-zap .scena .ml-plocha::after{background:
linear-gradient(180deg,rgba(20,16,14,.42) 0,rgba(20,16,14,0) 70px),
linear-gradient(180deg,transparent 21%,rgba(38,33,31,.07) 24%,rgba(255,255,255,.1) 25.2%,transparent 29%,transparent 52%,rgba(38,33,31,.06) 55%,rgba(255,255,255,.08) 56%,transparent 60%,transparent 79%,rgba(38,33,31,.06) 82%,rgba(255,255,255,.09) 83%,transparent 87%),
repeating-linear-gradient(0deg,rgba(38,33,31,.018) 0 1px,transparent 1px 3px),
repeating-linear-gradient(90deg,rgba(255,255,255,.025) 0 1px,transparent 1px 3px)}
.scena-zap .veta{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;padding:calc(var(--hlava) + var(--role) + var(--kratka) + var(--bar) + var(--pul) + 8px) var(--okraj) var(--vyhled)}
.scena-zap .veta-in{width:100%}
@media(min-width:860px){
.veta h2{font-size:14.6vw}
.scena-zap .veta h2{font-size:min(14.6vw,calc(50vh - 176px));font-size:min(14.6vw,calc(50svh - 176px))}
.podpis{white-space:nowrap}
.veta .r2{text-align:right}
.proc{position:absolute;right:0;top:.5em;margin:0;width:min(38vw,560px)}
}

@media(min-width:860px) and (max-height:700px),(min-width:860px) and (max-width:1000px){.podpis{display:none}}

/* ceník: lístek u pokladny */
.cenik{position:relative;background:var(--pine);color:var(--cream);padding:clamp(76px,10vw,150px) var(--okraj) 0}
.cenik-in{max-width:1320px;margin:0 auto}
.cenik-hlava{margin-bottom:clamp(40px,5vw,72px)}
.cenik h2{font-size:clamp(104px,18vw,256px);line-height:.84;letter-spacing:-.02em}
.cenik-hlava p{margin:24px 0 0;max-width:26em;font-size:clamp(19px,1.55vw,23px);line-height:1.45;color:#e9e2d2}
.list-obal{position:relative;z-index:2;margin-bottom:-104px;filter:drop-shadow(0 18px 26px rgba(10,8,7,.3))}
.list-obal::before{content:"";position:absolute;z-index:1;left:50%;top:-16px;width:176px;height:38px;margin-left:-88px;background:rgba(243,200,177,.88);transform:rotate(-1.6deg);clip-path:polygon(0 0,2% 12%,0 25%,2% 37%,0 50%,2% 62%,0 75%,2% 87%,0 100%,100% 100%,98% 87%,100% 75%,98% 62%,100% 50%,98% 37%,100% 25%,98% 12%,100% 0)}
.listek{--r:37px;position:relative;padding:calc(var(--r)*1.5) 18px var(--r);color:#2b2522;font:400 21px/var(--r) var(--ruka);word-spacing:-.08em;
background:var(--papir) repeating-linear-gradient(180deg,transparent 0 calc(var(--r) - 1px),var(--linka) calc(var(--r) - 1px) var(--r)) 0 8px;
-webkit-mask:radial-gradient(circle 6px at 12px 0,transparent 98%,#000) 0 0/24px 100%;mask:radial-gradient(circle 6px at 12px 0,transparent 98%,#000) 0 0/24px 100%}
.skup{border:0}
.skup+.skup{margin-top:var(--r)}
.listek summary{display:block;min-height:calc(var(--r)*2);padding:4px 34px 4px 0;position:relative;cursor:pointer;list-style:none;font-size:31px;line-height:var(--r)}
.listek summary::after{content:"+";position:absolute;right:0;top:0;transform:none;font:400 34px/calc(var(--r)*1.5) var(--ruka);color:var(--brick-d)}
.listek details[open]>summary::after{content:"–"}
.listek .n{display:inline-block;color:var(--brick-d);font:inherit;line-height:calc(var(--r) - 3px);background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 8' preserveAspectRatio='none'%3E%3Cpath d='M2 5.5c44-4 96-4.5 196-1.5' fill='none' stroke='%23b4492f' stroke-width='2' stroke-linecap='round' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E") 0 100%/100% 7px no-repeat}
.listek .s{display:block;margin-top:2px;font:400 18px/26px var(--ruka);color:#6b6259}
.listek .body{padding:0}
.listek .items{margin:0;padding:0;list-style:none}
.listek .items li{position:static;display:flex;justify-content:space-between;align-items:baseline;gap:14px;padding:0;border:0;transition:background-size .2s}
@media(hover:hover){.listek .items li{background:linear-gradient(rgba(243,200,177,.62),rgba(243,200,177,.62)) 0 50%/0 74% no-repeat}.listek .items li:hover{background-size:100% 74%}}
.listek .items li::before{content:none}
.listek .it em{display:inline;font-size:.84em;line-height:1;color:#6b6259;white-space:nowrap}
.listek .pr{flex:none;font-weight:400;color:var(--brick-d);white-space:nowrap}
.listek .pozn,.listek .body p{margin:0;color:#6b6259;font-size:.86em}
.ps{margin-top:var(--r)}
.ps p{margin:0}
.ps-tel{margin-top:var(--r)!important;color:#6b6259}
.ps-tel .as-link{min-height:44px;color:var(--brick-d);font-size:1.16em}
.ps-tel .fake{font-size:.8em}
@media(min-width:860px){
.cenik-hlava{display:grid;grid-template-columns:auto minmax(0,25em);justify-content:space-between;align-items:end;gap:48px}
.cenik-hlava p{margin:0 0 .5em}
.listek summary{min-height:0;padding:0;cursor:default;pointer-events:none}
.listek .s{display:inline;margin:0 0 0 10px;line-height:1;white-space:nowrap}
.listek summary::after{display:none}
.listek{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:48px;padding:calc(var(--r)*2) 44px var(--r)}
.sl:nth-child(3){grid-column:1/-1;columns:2;column-gap:48px;margin-top:var(--r)}
.sl:nth-child(3) .skup{break-inside:avoid}
.ps{grid-column:1/-1;display:flex;justify-content:space-between;align-items:baseline;gap:40px}
.ps-tel{margin:0!important;flex:none}
}
@media(min-width:1240px){
.listek{grid-template-columns:repeat(3,minmax(0,1fr));column-gap:52px;padding:calc(var(--r)*2) 52px var(--r)}
.sl:nth-child(3){grid-column:auto;columns:auto;margin-top:0}
}

/* salon */
.salon{position:relative;background:var(--cream);padding:calc(104px + clamp(72px,9vw,140px)) var(--okraj) clamp(84px,10vw,150px)}
.salon h2{max-width:1320px;margin:0 auto clamp(40px,6vw,88px);font-size:clamp(45px,7.6vw,114px);line-height:1.02;letter-spacing:-.015em}
.salon figure{margin:0}
.salon img{width:100%;height:100%;object-fit:cover}
.salon picture{display:block}
.salon-mriz{display:grid;gap:28px;max-width:1320px;margin:0 auto}
.salon-text p{margin:0 0 18px;max-width:30em;font-size:clamp(18px,1.4vw,20px)}
.salon-text .vetsi{font:400 clamp(27px,2.8vw,41px)/1.22 var(--serif);max-width:20em;margin-bottom:28px}
.domu{margin:0;padding:0;list-style:none;font:400 clamp(21px,1.8vw,26px)/1.42 var(--serif);color:var(--brick-d)}
.domu li{display:inline}
.domu li:not(:last-child)::after{content:","}
.salon .f-velka{margin-inline:calc(var(--okraj)*-1)}
.salon .f-masaz{justify-self:start;width:64%}
.salon .f-nehty{justify-self:end;width:48%;margin-top:-34%}
.salon .f-kava{margin-inline:calc(var(--okraj)*-1)}
.vz{font-family:var(--ruka);word-spacing:-.06em}
.vz h3{margin:0 0 4px;font:400 29px/1.2 var(--ruka)}
.vz ul{margin:0;padding:0;list-style:none}
.vz li,.vz p{margin:0;font-size:21px;line-height:1.42}
.vz li+li{margin-top:8px}
.vzkazy{display:grid;gap:30px}
.vz{position:relative;padding:24px 26px 26px;box-shadow:0 12px 24px rgba(38,33,31,.14)}
.vz::before{content:"";position:absolute;left:50%;top:-13px;width:104px;height:26px;margin-left:-52px;background:rgba(244,235,220,.82);box-shadow:0 1px 2px rgba(38,33,31,.14);transform:rotate(-2deg)}
.vz-a{background:var(--peach);color:var(--pine);transform:rotate(.7deg)}
.vz-c{background:var(--papir);transform:rotate(-.7deg)}
.vz-c h3{color:var(--brick-d)}
.vz-c .as-link{color:var(--brick-d)}
@media(min-width:860px){
.salon-mriz{grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px;row-gap:0;align-items:start}
.salon .f-velka{grid-column:1/7;grid-row:1/3;margin:0 0 0 calc(var(--okap)*-1)}
.salon-text{grid-column:8/13;grid-row:1;padding-top:6px}
.salon .f-masaz{grid-column:8/11;grid-row:2;width:auto;margin-top:64px}
.salon .f-nehty{grid-column:11/13;grid-row:2;width:auto;margin-top:150px}
.salon .f-kava{grid-column:1/6;grid-row:3;margin:clamp(56px,6vw,96px) 0 0 calc(var(--okap)*-1)}
.vzkazy{grid-column:6/13;grid-row:3;grid-template-columns:minmax(0,1fr) minmax(0,1.06fr);gap:28px;align-items:start;margin-top:clamp(84px,9vw,140px)}
.vz-c{margin-top:44px}
}
@media(min-width:860px) and (max-width:1099px){.vzkazy{grid-template-columns:minmax(0,1fr);gap:34px}.vz-c{margin-top:0}}

/* poukaz */
.poukaz{background:var(--brick);color:#fff;padding:clamp(88px,11vw,170px) var(--okraj);overflow:hidden}
.poukaz-in{max-width:1320px;margin:0 auto;gap:56px;align-items:center}
.pk-text h2{margin-bottom:.42em;font-size:clamp(58px,8.6vw,128px);line-height:1;letter-spacing:-.015em}
.pk-text p{max-width:27em;margin:0 0 16px;font-size:clamp(18px,1.45vw,21px)}
.poukaz .as-link{color:#fff}
.poukaz .pk-text :focus-visible{outline-color:#fff}
.poukaz .fake{color:#fbe6da}
.obalka{position:relative;max-width:600px;width:100%;justify-self:end;padding-bottom:76px}
.ob-zada{position:absolute;left:-6%;right:-6%;bottom:0;height:390px;background:#efb79c;box-shadow:0 22px 40px rgba(60,20,10,.32)}
.ob-zada::before{content:"";position:absolute;left:0;right:0;bottom:100%;height:170px;margin-bottom:-1px;background:#f6d3bf;clip-path:polygon(0 100%,50% 0,100% 100%)}
.ob-kapsa{position:absolute;left:-6%;right:-6%;bottom:0;height:164px;background:var(--peach);clip-path:polygon(0 0,50% 84px,100% 0,100% 100%,0 100%);pointer-events:none}
.ob-kapsa::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(160,80,50,.16),rgba(160,80,50,0) 44%)}
.karta{position:relative;display:grid;gap:16px;padding:0 clamp(22px,3vw,44px) 104px;background:var(--papir);color:var(--ink);box-shadow:0 10px 26px rgba(60,20,10,.28)}
.kr-lem{--pr:32px;--pul:16px;--bar:14px;height:calc(var(--bar) + var(--pul));margin:0 calc(clamp(22px,3vw,44px)*-1)}
.kr-nazev{margin:8px 0 6px;font:400 clamp(30px,2.8vw,40px)/1.1 var(--serif);color:var(--pine)}
.karta label{gap:0;font-size:17px;font-weight:500;color:var(--mute)}
.karta input,.karta textarea{padding:2px 0 4px;min-height:44px;background:transparent;border:0;border-bottom:2px solid var(--pine);border-radius:0;color:var(--pine);font:400 25px/1.3 var(--ruka);caret-color:var(--brick);transition:border-color .18s}
.karta textarea{display:block;resize:vertical;line-height:36px}
.karta ::placeholder{color:#857a70;opacity:1}
.karta input:hover,.karta textarea:hover{border-bottom-color:var(--brick)}
.karta input:focus-visible,.karta textarea:focus-visible{outline:0;border-bottom-color:var(--brick);box-shadow:0 2px 0 var(--brick)}
.karta .form-msg{min-height:0;color:var(--brick-d)}
.karta .form-msg:empty{display:none}
.karta .btn{margin-top:6px}
.karta :focus-visible{outline-color:var(--brick)}
@media(min-width:860px){.poukaz-in{grid-template-columns:minmax(0,1fr) minmax(0,1.1fr)}}
@media(min-width:1180px){.poukaz-in{grid-template-columns:minmax(0,1fr) minmax(0,600px)}}

/* konec */
#kontakt{padding:0;background:var(--pine);overflow:hidden}
.ml-konec{--kratka:58px}
.je-zavreno .ml-konec{--kratka:6px}
.konec{max-width:calc(1320px + var(--okraj)*2);margin:0 auto;padding:clamp(64px,8vw,120px) var(--okraj) 0;display:grid;gap:clamp(36px,4vw,56px)}
#kontakt .konec h2{margin:0;font-size:clamp(52px,9.3vw,140px);line-height:1;letter-spacing:-.015em;color:var(--cream)}
.konec .cta{max-width:none}
.konec .btn{min-height:58px;padding:0 32px;font-size:19px;white-space:nowrap}
.tel-pozn{margin:12px 0 0;font-size:16px;color:#c4bcb4}
.stav{margin:26px 0 0;font:400 26px/1.3 var(--ruka);color:var(--peach);word-spacing:-.06em}
.cedulka{justify-self:start;width:100%;max-width:420px;padding:30px 34px 26px;color:var(--ink);border-radius:18px;box-shadow:0 22px 40px rgba(10,8,7,.4);transform:rotate(1deg);
background:radial-gradient(circle 4px at 16px 16px,#b8ab96 96%,transparent) no-repeat,radial-gradient(circle 4px at calc(100% - 16px) 16px,#b8ab96 96%,transparent) no-repeat,var(--cream)}
#kontakt .cedulka h3{margin:0 0 10px;font-size:30px;color:var(--pine)}
.cedulka table{max-width:none}
.cedulka th,.cedulka td{padding:7px 0;border-bottom:1px solid #e0d5c0;font-size:18px}
.cedulka tr:last-child th,.cedulka tr:last-child td{border-bottom:0}
.cedulka tr.today th,.cedulka tr.today td{color:var(--brick-d);font-weight:700}
#kontakt .cedulka .hours-note{margin:10px 0 0;max-width:none;color:var(--mute);font-size:17px}
.pata{color:#c4bcb4}
.pata address{display:flex;flex-wrap:wrap;gap:6px 28px;margin-bottom:16px;font-size:18px}
.pata address>*{display:inline-flex;align-items:center;gap:.4em;min-height:32px;padding:0}
#kontakt .pata .as-link{color:#f6d9c8}
.pata .forma,.pata .forma-back{max-width:none;margin:6px 0 0;font-size:16px}
.slovo{margin:clamp(32px,4vw,56px) 0 -.17em;font:400 clamp(130px,31vw,470px)/.8 var(--serif);letter-spacing:-.02em;text-align:center;color:var(--pine2);user-select:none}
@media(min-width:860px){.konec h2 span{display:block}}
@media(min-width:1100px){
.konec{grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto auto 1fr;align-items:start}
.konec h2{grid-column:1/-1}
.cedulka{grid-column:2;grid-row:2/4}
.pata{grid-column:1;grid-row:3;align-self:end}
}

/* telefon: ťukací plochy textových odkazů aspoň 44 px (bez změny řádkování) */
@media(max-width:859px){
.as-link,.place a,.foot-back{position:relative}
.as-link::after,.place a::after,.foot-back::after{content:"";position:absolute;left:-4px;right:-4px;top:50%;height:44px;margin-top:-22px}
.pata address{gap:0 24px}
.pata address>*{min-height:44px}
.forma-back{margin-top:12px!important}
}

/* spodní lišta telefonu */
.sticky.is-shown.ve-scene,.sticky.is-shown.u-konce{transform:translateY(140%)}
/* FORMA-POLISH (generuje vizitka/tools/ukazky-polish.py) */
::selection{background:#b4492f;color:#ffffff}
:where(html){scrollbar-color:#f6efe2 #26211f}
:where(input,textarea){caret-color:#f6efe2}
: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 #f6efe2;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}
.sticky{bottom:calc(12px + env(safe-area-inset-bottom))}@media (max-width:859px){#kontakt{padding-bottom:calc(100px + env(safe-area-inset-bottom))}}
/* /FORMA-POLISH */