/* Studio Linka (ukázka FORMA) – písma uložená přímo u webu (SIL OFL 1.1, licence ve fonts/) */
@font-face{font-family:'Fraunces';font-style:normal;font-weight:100 900;font-display:swap;src:url(fonts/fraunces-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:'Fraunces';font-style:normal;font-weight:100 900;font-display:swap;src:url(fonts/fraunces-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:'Fraunces';font-style:italic;font-weight:400;font-display:swap;src:url(fonts/fraunces-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:'Fraunces';font-style:italic;font-weight:400;font-display:swap;src:url(fonts/fraunces-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:'Hanken Grotesk';font-style:normal;font-weight:100 900;font-display:swap;src:url(fonts/hanken-grotesk-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Hanken Grotesk';font-style:normal;font-weight:100 900;font-display:swap;src:url(fonts/hanken-grotesk-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Fraunces Fallback';src:local('Georgia');size-adjust:103%}
@font-face{font-family:'Hanken Fallback';src:local('Arial'),local('Helvetica Neue');size-adjust:100%}
:root{
  --ink:#18203a; --ink-2:#0f1528; --cream:#f4ece1; --paper:#fbf7f1; --blush:#e8cfc2;
  --copper:#9a4627; --glow:#eab38e; --line:rgba(24,32,58,.18);
  --serif:"Fraunces","Fraunces Fallback",Georgia,"Times New Roman",serif;
  --sans:"Hanken Grotesk","Hanken Fallback",Arial,sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:72px;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--cream);color:var(--ink);font:400 1.0625rem/1.55 var(--sans);overflow-x:hidden}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
h1,h2,h3,h4{font-family:var(--serif);font-weight:500;line-height:1.1;margin:0;letter-spacing:-.01em}
:focus-visible{outline:3px solid var(--copper);outline-offset:3px;border-radius:4px}
.hero :focus-visible,.top :focus-visible,.kontakt :focus-visible,.znacky :focus-visible,footer :focus-visible,.sticky :focus-visible{outline-color:var(--glow)}
.skip{position:absolute;left:8px;top:-60px;background:var(--cream);color:var(--ink);padding:10px 14px;z-index:30;border-radius:6px}
.skip:focus{top:8px}
.wrap{max-width:760px;margin:0 auto}

.btn{font:inherit;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 24px;border-radius:999px;background:var(--glow);color:var(--ink-2);font-weight:600;text-decoration:none;border:2px solid var(--glow);transition:background .2s,color .2s,transform .2s;text-align:center}
.btn:hover{background:var(--cream);border-color:var(--cream)}
.btn-ghost{background:transparent;color:inherit;border-color:currentColor}
.btn-ghost:hover{background:var(--cream);color:var(--ink-2)}
.btn-sm{min-height:40px;padding:0 18px;font-size:.95rem}
.cta{display:flex;flex-wrap:wrap;gap:12px}

.top{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 16px;background:var(--ink);color:var(--cream)}
.brand{font-family:var(--serif);font-size:1.35rem;text-decoration:none;white-space:nowrap}
.brand span{font-style:italic;font-size:.95rem;opacity:.85}
.top nav{display:flex;align-items:center;gap:20px}
.top nav a:not(.btn){display:none;text-decoration:none}
.top nav a:not(.btn):hover{text-decoration:underline;text-underline-offset:4px}
.top .btn{min-height:40px;padding:0 16px;font-size:.92rem}

.hero{background:var(--ink);color:var(--cream);padding:24px 20px 56px;display:grid;gap:40px;overflow:hidden}
.hero h1{font-size:clamp(2.6rem,12vw,5rem);font-weight:400}
.lead{font-size:1.125rem;margin:14px 0 22px;max-width:34ch;color:#e6ddcf}
.hero-img{width:min(78%,340px);margin:0 auto;border-radius:999px 999px 18px 18px;overflow:hidden;aspect-ratio:4/5;background:var(--ink-2);box-shadow:0 0 0 8px var(--ink),0 0 0 9px rgba(234,179,142,.55)}
.hero-img img{width:100%;height:100%;object-fit:cover}

.sluzby{padding:56px 20px 40px;max-width:860px;margin:0 auto}
h2{font-size:clamp(1.9rem,7vw,2.8rem)}
.menu{list-style:none;margin:24px 0 0;padding:0}
.menu li{border-top:1px solid var(--line)}
.menu li:last-child{border-bottom:1px solid var(--line)}
.menu a{display:grid;gap:2px;padding:18px 0;text-decoration:none;transition:padding .2s,color .2s}
.menu strong{font-family:var(--serif);font-weight:500;font-size:1.75rem;line-height:1.1}
.menu span{color:#45506e}
.menu a:hover{padding-left:12px;color:var(--copper)}

.arches{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:8px 14px 56px;max-width:960px;margin:0 auto}
.arches figure{margin:0;border-radius:999px 999px 10px 10px;overflow:hidden;aspect-ratio:5/7;background:var(--blush)}
.arches figure:nth-child(2){margin-top:28px}
.arches img{width:100%;height:100%;object-fit:cover}

.cenik{background:var(--paper);padding:56px 20px;border-block:1px solid var(--line)}
.sub{margin:10px 0 24px;color:#45506e}
.tabs{display:flex;gap:8px;overflow-x:auto;padding:4px 0 14px;margin:0 -20px;padding-inline:20px;scrollbar-width:thin}
.tabs button{flex:none;min-height:44px;padding:0 18px;border-radius:999px;border:1.5px solid var(--ink);background:transparent;color:var(--ink);font:500 1rem var(--sans);cursor:pointer}
.tabs button:hover{background:var(--blush)}
.tabs button[aria-selected=true]{background:var(--ink);color:var(--cream)}
.panel{padding-top:8px}
.panel+.panel{margin-top:32px}
.js .panel+.panel{margin-top:0}
.ph{font-size:1.9rem;margin:8px 0 4px}
.js .ph{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
h4{font-size:1.3rem;margin:26px 0 4px;color:var(--copper)}
.rows{list-style:none;margin:0;padding:0}
.rows li{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:12px 0;border-bottom:1px dotted rgba(24,32,58,.4)}
.nm{display:block;min-width:0}
.meta{display:block;font-size:.9rem;color:#45506e}
.pr{font-weight:600;white-space:nowrap;text-align:right;font-variant-numeric:tabular-nums}
.pn{font-size:.95rem;color:#45506e;margin:14px 0 0}
.tw{overflow-x:auto;margin-top:6px}
table{width:100%;border-collapse:collapse;font-size:.98rem}
caption,.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
th,td{padding:10px 8px;text-align:right;border-bottom:1px dotted rgba(24,32,58,.4);white-space:nowrap}
thead th{font-size:.85rem;font-weight:500;color:#45506e;vertical-align:bottom}
th:first-child,tbody th{text-align:left;font-weight:500;padding-left:0}
td{font-weight:600;font-variant-numeric:tabular-nums}
.rules{margin-top:40px;padding:20px;border-radius:18px;background:var(--blush)}
.rules h3{font-size:1.3rem;margin-bottom:8px}
.rules ul{margin:0;padding-left:1.1em}
.rules li+li{margin-top:6px}
.book{margin:32px 0 0}

.znacky{padding:56px 20px;max-width:860px;margin:0 auto}
.znacky ul{list-style:none;padding:0;margin:22px 0}
.znacky li{padding:14px 0;border-top:1px solid var(--line)}
.znacky b{display:block;font-family:var(--serif);font-weight:500;font-size:1.25rem;color:var(--copper)}
.znacky p{margin:0;color:#45506e}

.dalsi{padding:0 20px 56px;max-width:860px;margin:0 auto}
.cards{display:grid;gap:14px;margin-top:20px}
.card{width:100%;border:0;font:inherit;color:inherit;text-align:left;cursor:pointer;display:grid;gap:4px;padding:22px;border-radius:18px;background:var(--blush);text-decoration:none;transition:transform .2s,background .2s}
.card:hover{background:#dfbfae;transform:translateY(-2px)}
.card strong{font-family:var(--serif);font-weight:500;font-size:1.4rem}

.kontakt{background:var(--ink);color:var(--cream);padding:56px 20px}
address{font-style:normal;margin:20px 0 26px;font-size:1.15rem}
address p{margin:0 0 14px}
address a{text-underline-offset:4px}
.small{margin:18px 0 0;color:#c8cddc;font-size:.95rem}

footer{background:var(--ink-2);color:#c3c8d8;padding:28px 20px 96px;font-size:.9rem}
footer p{margin:0 0 6px}

.sticky{position:fixed;left:0;right:0;bottom:0;z-index:25;display:flex;gap:10px;padding:10px 14px calc(10px + env(safe-area-inset-bottom));background:var(--ink-2);color:var(--cream);transform:translateY(110%);transition:transform .3s}
.sticky .btn{flex:1;min-height:48px;padding:0 12px}
.sticky.is-shown{transform:none}

@media (min-width:760px){
  body{font-size:1.125rem}
  .top{padding:12px 40px}
  .top nav a:not(.btn){display:inline}
  .hero{grid-template-columns:1.1fr .9fr;align-items:center;padding:72px 56px 88px;gap:56px;max-width:none}
  .hero-txt{justify-self:end;max-width:560px}
  .lead{font-size:1.2rem}
  .hero-img{width:min(100%,430px);margin:0}
  .menu a{grid-template-columns:240px 1fr;align-items:baseline;gap:24px}
  .cards{grid-template-columns:1fr 1fr}
  .arches{gap:20px;padding-bottom:80px}
  .sticky{display:none}
  footer{padding-bottom:32px}
}
@media (min-width:1100px){.cenik .wrap{max-width:820px}}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *{transition:none!important}
}

/* ukázka na vizitce FORMA */
.hero-txt{min-width:0}
/* stav otevřeno / zavřeno a linka pod jménem */
.status{display:inline-flex;align-items:center;gap:.6em;margin:0 0 16px;padding:5px 14px 5px 11px;border:1px solid rgba(244,236,225,.3);border-radius:999px;font-size:.92rem;line-height:1.35;color:#e6ddcf}
.status .dot{flex:none;width:9px;height:9px;border-radius:50%;background:var(--glow);box-shadow:0 0 0 4px rgba(234,179,142,.2)}
.status.closed .dot{background:transparent;box-shadow:inset 0 0 0 1.5px #c8cddc}
.liner{display:block;width:min(64%,250px);height:auto;margin:6px 0 0;overflow:visible}
.liner path{fill:var(--glow)}

/* ceník v kostce: na telefonu vodorovně posuvný, každá karta otevře svou záložku ceníku */
.peek{margin:26px -20px 0}
.peek-h{margin:0 20px 10px;font-size:.82rem;font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:#c8cddc}
.peek ul{list-style:none;margin:0;padding:2px 20px 8px;display:flex;gap:10px;overflow-x:auto;scrollbar-width:none;scroll-snap-type:x proximity;scroll-padding-inline:20px}
.peek ul::-webkit-scrollbar{display:none}
.peek li{flex:none;scroll-snap-align:start}
.peek a{display:grid;justify-items:center;gap:1px;min-width:7.6rem;padding:14px 14px 9px;border:1px solid rgba(234,179,142,.5);border-radius:3rem 3rem 12px 12px;text-decoration:none;text-align:center;transition:background .2s,border-color .2s}
.peek a:hover{background:rgba(234,179,142,.12);border-color:var(--glow)}
.peek b{font-family:var(--serif);font-weight:500;font-size:1.08rem;line-height:1.2;white-space:nowrap}
.peek span{font-size:.92rem;font-weight:600;color:var(--glow);font-variant-numeric:tabular-nums;white-space:nowrap}

/* kontakt s otevírací dobou */
.k-grid{display:grid;gap:36px;margin-top:20px}
.kontakt address{margin:0 0 26px}
.k-hours h3{font-size:1.5rem;margin-bottom:6px}
.hours{max-width:26rem;font-size:1.02rem}
.hours th,.hours td{padding:10px 0;border-bottom:1px dotted rgba(244,236,225,.35)}
.hours tbody th{font-weight:400}
.hours td{font-weight:500}
.hours .off{font-weight:400;color:#c8cddc}
.hours tr.today th,.hours tr.today td{color:var(--glow);font-weight:600}
.today-l{display:inline-block;margin-left:4px;padding:1px 9px;border-radius:999px;background:var(--glow);color:var(--ink-2);font-size:.8rem;font-weight:600;vertical-align:1px}

/* telefon, e-mail, sítě a mapa jsou tlačítka, která otevřou vysvětlení ukázky */
.as-link{padding:0;border:0;background:none;color:inherit;font:inherit;text-align:inherit;text-decoration:underline;text-underline-offset:4px;cursor:pointer}
.as-link:hover{color:var(--glow)}
.fake{font-size:.8em;color:#c8cddc;white-space:nowrap}
footer .fake{font-size:.92em}
.foot-back{color:var(--cream);font-weight:600;text-underline-offset:4px}

/* vysvětlení ukázky: oblouk jako u fotek */
.pop{max-width:min(26rem,calc(100vw - 2.5rem));padding:3.6rem 1.5rem 1.5rem;border:0;border-radius:50% 50% 18px 18px/7rem 7rem 18px 18px;background:var(--ink);color:var(--cream);text-align:center;
  box-shadow:0 0 0 8px var(--ink),0 0 0 9px rgba(234,179,142,.6),0 30px 60px -20px rgba(0,0,0,.7)}
.pop::backdrop{background:rgba(15,21,40,.62)}
.pop h2{font-size:clamp(1.6rem,7vw,1.95rem);margin-bottom:.7rem}
.pop p{margin:0 0 1.3rem;color:#e6ddcf}
.pop .btn{width:100%}
.pop :focus-visible{outline-color:var(--glow)}

@media (min-width:760px){
  .peek{margin:30px 0 0}
  .peek-h{margin-left:0}
  .peek ul{flex-wrap:wrap;overflow:visible;padding:2px 0 0}
  .k-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px}
}
