/* ---------- Variant A · „Klasik“ (rozvinutie súčasnej identity) ---------- */
:root{
  --bg:#F8F4EC; --bg2:#EFE8DA; --surface:#FFFDF8; --ink:#1F1915; --ink2:#5C5148; --line:#DED4C2;
  --brand:#C1121F; --brand-ink:#fff; --gold:#A8842E; --green:#2F5D50; --soft:#F3E6D2;
  --font-display:"Fraunces",Georgia,"Times New Roman",serif; --font-body:"Source Sans 3","Helvetica Neue",Arial,sans-serif;
  --radius:14px; --shadow:0 10px 30px rgba(60,40,10,.10);
  --hero-overlay:linear-gradient(90deg,rgba(248,244,236,.0) 40%,rgba(248,244,236,.0));
}
/* ---------- Variant B · „Noc“ (tmavý moderný gastro look) ---------- */
:root[data-variant="b"]{
  --bg:#14110F; --bg2:#1C1815; --surface:#221D19; --ink:#F4EDE2; --ink2:#B8AB9A; --line:#3A322B;
  --brand:#E8A33D; --brand-ink:#1A1410; --gold:#E8A33D; --green:#9CC5B4; --soft:#2B2420;
  --font-display:"Bricolage Grotesque","Arial Narrow",Arial,sans-serif; --font-body:"Manrope","Helvetica Neue",Arial,sans-serif;
  --radius:10px; --shadow:0 14px 40px rgba(0,0,0,.45);
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto} *{transition:none!important;animation:none!important}}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font-body);font-size:17px;line-height:1.5;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit}
h1,h2,h3{font-family:var(--font-display);line-height:1.05;margin:0;text-wrap:balance;letter-spacing:-.01em}
:root[data-variant="b"] h1,:root[data-variant="b"] h2,:root[data-variant="b"] h3{letter-spacing:-.02em}
.wrap{max-width:1180px;margin-inline:auto;padding-inline:20px}
.eyebrow{font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--gold)}
.btn{display:inline-flex;align-items:center;gap:8px;padding:13px 20px;border-radius:999px;font-weight:700;text-decoration:none;border:1.5px solid transparent;font-size:16px;cursor:pointer;transition:transform .15s,background .15s;white-space:nowrap}
.btn:hover{transform:translateY(-1px)}
.btn:focus-visible,.tab:focus-visible,a:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.btn-primary{background:var(--brand);color:var(--brand-ink)}
.btn-ghost{border-color:var(--ink);color:var(--ink);background:transparent}
.btn-soft{background:var(--soft);color:var(--ink)}
.btn svg{width:18px;height:18px;flex:none}

/* utility strip */
.strip{background:var(--green);color:#fff;font-size:14px}
:root[data-variant="b"] .strip{background:#0E0C0A;color:var(--ink2)}
.strip .wrap{display:flex;justify-content:space-between;gap:12px;align-items:center;min-height:36px;flex-wrap:wrap}
.strip a{color:inherit;text-decoration:none;font-weight:700}
.strip .dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#7CD992;margin-right:6px;vertical-align:middle}
@media (max-width:760px){.strip{font-size:13px}.strip .wrap{flex-wrap:nowrap;min-height:34px;padding-block:6px}.strip .wrap>span{white-space:nowrap}.strip-x{display:none}}
@media (max-width:360px){.strip #openNow{font-size:12.5px}}

/* header */
header.site{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
header.site .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:70px}
.logo{display:block;text-decoration:none;flex:none}
.logo img{height:46px;width:auto}
.logo .logo-white{display:none}
:root[data-variant="b"] .logo .logo-dark{display:none}
:root[data-variant="b"] .logo .logo-white{display:block}
nav.main{display:flex;gap:0}
nav.main a{text-decoration:none;white-space:nowrap;font-weight:600;padding:8px 8px;border-radius:8px;font-size:14px;color:var(--ink)}
nav.main a:hover{background:var(--soft)}
nav.main a.hot{color:var(--brand)}
.head-cta{display:flex;gap:10px;align-items:center}
.burger{display:none;background:none;border:1.5px solid var(--line);border-radius:10px;width:44px;height:44px;color:var(--ink);cursor:pointer}
@media (max-width:1230px){nav.main{display:none}.burger{display:grid;place-items:center}.head-cta .btn-ghost{display:none}}
@media (max-width:600px){.head-cta .btn-primary{padding:10px 14px;font-size:14px}.logo img{height:38px}.wrap{padding-inline:16px}}
@media (max-width:420px){.head-cta .btn-primary{display:none}}

/* hero */
.hero{padding-block:36px 28px}
.hero .grid{display:grid;grid-template-columns:1.05fr .95fr;gap:36px;align-items:center}
.hero h1{font-size:clamp(40px,6vw,72px);font-weight:700}
.hero h1 em{font-style:italic;color:var(--brand)}
:root[data-variant="b"] .hero h1 em{font-style:normal;color:var(--brand)}
.hero p.lead{font-size:19px;color:var(--ink2);max-width:52ch;margin:18px 0 24px}
.hero .ctas{display:flex;gap:12px;flex-wrap:wrap}
.hero .chips{display:flex;gap:8px;flex-wrap:wrap;margin-top:26px}
.chip{font-size:13px;font-weight:600;padding:6px 12px;border-radius:999px;border:1px solid var(--line);background:var(--surface);color:var(--ink2)}
.hero .photo{position:relative;border-radius:22px;overflow:hidden;aspect-ratio:5/4;max-width:100%;box-shadow:var(--shadow)}
.hero .photo img{width:100%;height:100%;object-fit:cover}
.hero .badge{position:absolute;left:16px;bottom:16px;background:var(--surface);color:var(--ink);padding:12px 16px;border-radius:12px;font-size:14px;box-shadow:var(--shadow);max-width:80%}
.hero .badge b{display:block;font-family:var(--font-display);font-size:18px}
@media (max-width:900px){.hero .grid{grid-template-columns:1fr}.hero .photo{aspect-ratio:16/10}.hero h1{font-size:clamp(38px,11vw,56px)}}

/* daily menu */
.menu{padding-block:34px 40px}
.menu .panel{background:var(--surface);border:1px solid var(--line);border-radius:22px;box-shadow:var(--shadow);overflow:hidden}
.menu .top{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;padding:26px 26px 0;flex-wrap:wrap}
.menu h2{font-size:clamp(30px,4vw,44px)}
.menu .top .meta{color:var(--ink2);font-size:15px;margin-top:6px}
.menu .top .actions{display:flex;gap:10px;flex-wrap:wrap}
.tabs{display:flex;gap:6px;padding:20px 26px 0;overflow-x:auto;scrollbar-width:none}
.tabs::-webkit-scrollbar{display:none}
.tab{flex:none;border:1.5px solid var(--line);background:transparent;color:var(--ink);border-radius:12px;padding:10px 14px;font:inherit;font-weight:700;cursor:pointer;min-width:84px;text-align:left;line-height:1.15}
.tab small{display:block;font-weight:400;font-size:12px;color:var(--ink2)}
.tab[aria-selected="true"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.tab[aria-selected="true"] small{color:color-mix(in srgb,var(--bg) 70%,transparent)}
.tab .today{display:inline-block;font-size:10px;letter-spacing:.1em;text-transform:uppercase;background:var(--brand);color:var(--brand-ink);padding:2px 6px;border-radius:6px;margin-left:6px;vertical-align:middle;font-weight:800}
.day{padding:22px 26px 26px;display:grid;grid-template-columns:1fr 1fr;gap:22px 34px}
.day .soups{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:12px}
.soup{background:var(--soft);border-radius:12px;padding:14px 16px;display:flex;gap:12px;align-items:flex-start}
.soup .n{flex:none;width:30px;font-family:var(--font-display);font-weight:700;color:var(--gold);font-size:18px;font-variant-numeric:tabular-nums;line-height:1.35}
.soup small,.item small{color:var(--ink2);font-size:13px}
.itm-list{display:flex;flex-direction:column}
.item{display:grid;grid-template-columns:30px 1fr auto;gap:12px;padding:13px 0;border-bottom:1px dashed var(--line);align-items:baseline}
.item:last-child{border-bottom:0}
.item .n{font-family:var(--font-display);font-weight:700;color:var(--gold);font-size:18px;font-variant-numeric:tabular-nums}
.item .t{font-weight:600;line-height:1.35}
.item .w{font-size:13px;color:var(--ink2);font-variant-numeric:tabular-nums;white-space:nowrap}
.alg{display:inline-flex;gap:3px;margin-left:6px;vertical-align:middle}
.alg i{font-style:normal;font-size:10.5px;font-weight:700;color:var(--ink2);border:1px solid var(--line);border-radius:5px;padding:0 4px;line-height:16px}
.special{grid-column:1/-1;display:grid;grid-template-columns:auto 1fr;gap:18px;align-items:center;background:var(--ink);color:var(--bg);border-radius:16px;padding:20px 22px}
:root[data-variant="b"] .special{background:linear-gradient(120deg,#3A2A16,#2A2019);color:var(--ink);border:1px solid #5A4324}
.special .eyebrow{color:var(--gold)}
.special .big{font-family:var(--font-display);font-weight:700;font-size:56px;line-height:1;color:var(--gold);min-width:44px;text-align:center}
.special h3{font-size:24px;margin-top:4px}
.special p{margin:6px 0 0;opacity:.85;font-size:15px}
.special .price{font-family:var(--font-display);font-size:34px;font-weight:700;text-align:right;line-height:1}
.special .price small{display:block;font-family:var(--font-body);font-size:12px;opacity:.8;font-weight:400;margin-top:6px}
.prices{grid-column:1/-1;display:flex;gap:10px 26px;flex-wrap:wrap;align-items:center;padding-top:6px;border-top:1px solid var(--line);color:var(--ink2);font-size:15px}
.prices b{color:var(--ink);font-size:18px;font-family:var(--font-display)}
.prices .nameday{margin-left:auto}
.menu .foot{background:var(--bg2);padding:16px 26px;display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;align-items:center;font-size:14px;color:var(--ink2)}
.menu .foot .btns{display:flex;gap:10px;flex-wrap:wrap}
@media (max-width:760px){.day{grid-template-columns:1fr;padding:18px 16px 20px}.day .soups{grid-template-columns:1fr}.menu .top,.tabs{padding-inline:16px}.menu .foot{padding-inline:16px}.special{align-items:start}.special .big{font-size:44px;min-width:36px}.prices .nameday{margin-left:0}}

/* ---- mobil: kompaktnejšie prvky ---- */
@media (max-width:760px){
  .strip a{padding:8px 0;display:inline-block}
  .menu .top .actions{width:100%;flex-wrap:nowrap}
  .menu .top .actions .btn{flex:1 1 0;min-width:0;justify-content:center;padding-inline:8px;font-size:14px}
  .hero .chips{margin-top:18px}
  .chip{font-size:12.5px;padding:5px 10px}
}
@media (max-width:560px){
  .rooms{grid-template-columns:1fr;gap:8px}
  .room{display:grid;grid-template-columns:112px 1fr;align-items:center}
  .room img{aspect-ratio:1;height:100%}
  .room .rt{padding:10px 12px}
  .room b{font-size:18px}
  .hero .chips .chip:nth-child(n+5){display:none}
}

/* mobile sticky order bar */
.sticky-order{display:none;position:fixed;left:0;right:0;bottom:0;z-index:30;background:var(--surface);border-top:1px solid var(--line);padding:10px 16px calc(10px + env(safe-area-inset-bottom,0px));gap:10px}
.sticky-order .btn{flex:1;justify-content:center;padding:12px 10px;font-size:15px}
@media (max-width:760px){.sticky-order{display:flex}body{padding-bottom:78px}}

/* tiles */
.tiles{padding-block:10px 40px}
.tiles .grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.tile{position:relative;border-radius:18px;overflow:hidden;min-height:250px;display:flex;align-items:flex-end;text-decoration:none;color:#fff;isolation:isolate}
.tile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:transform .5s}
.tile:hover img{transform:scale(1.04)}
.tile::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 35%,rgba(0,0,0,.78));z-index:-1}
.tile .in{padding:20px}
.tile .eyebrow{color:#F2CC7A}
.tile h3{font-size:26px;margin-top:4px}
.tile p{margin:6px 0 0;font-size:14px;opacity:.9}
.tile.wide{grid-column:span 2;min-height:280px}
@media (max-width:900px){.tiles .grid{grid-template-columns:1fr 1fr}.tile.wide{grid-column:span 2}}
@media (max-width:560px){.tiles .grid{grid-template-columns:1fr}.tile.wide{grid-column:span 1}.tile{min-height:200px}}

/* salóniky + events */
.split{padding-block:20px 44px}
.split .grid{display:grid;grid-template-columns:1.1fr .9fr;gap:20px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:26px}
.card h2{font-size:30px;margin:6px 0 10px}
.card p{color:var(--ink2);margin:0 0 14px}
.rooms{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:14px 0 18px}
.room{background:var(--soft);border-radius:12px;overflow:hidden}
.room img{width:100%;height:auto;aspect-ratio:3/2;object-fit:cover}
.room .rt{padding:12px}
.room b{display:block;font-family:var(--font-display);font-size:20px}
.room span{font-size:13px;color:var(--ink2)}
.event{display:flex;gap:14px;align-items:center;padding:12px 0;border-top:1px solid var(--line)}
.event .d{flex:none;width:54px;text-align:center;background:var(--soft);border-radius:10px;padding:6px 0;font-weight:700;line-height:1.1}
.event .d small{display:block;font-size:11px;color:var(--ink2);font-weight:600;text-transform:uppercase}
.event b{display:block}.event span{font-size:14px;color:var(--ink2)}
@media (max-width:900px){.split .grid{grid-template-columns:1fr}.rooms{grid-template-columns:1fr 1fr 1fr}}
@media (max-width:560px){.rooms{grid-template-columns:1fr}}

.dn-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:14px 0}
.dn{display:block;background:var(--soft);border-radius:12px;padding:14px;text-decoration:none;color:var(--ink)}
.dn .dn-ic{display:block;font-size:22px;margin-bottom:6px}
.dn b{display:block;font-family:var(--font-display);font-size:19px;margin-bottom:4px}
.dn span:last-child{font-size:14px;color:var(--ink2)}
.perks{list-style:none;padding:0;margin:0 0 16px;display:flex;flex-wrap:wrap;gap:8px}
.perks li{font-size:13px;font-weight:600;padding:5px 10px;border-radius:999px;border:1px solid var(--line);color:var(--ink2)}
.perks li::before{content:"✓ ";color:var(--green)}
@media (max-width:560px){.dn-grid{grid-template-columns:1fr}}
/* gallery */
.gallery{padding-block:10px 44px}
.gallery .head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;margin-bottom:16px;flex-wrap:wrap}
.gallery h2{font-size:clamp(28px,3.6vw,38px)}
.gallery .g{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:170px;gap:10px}
.gallery .g img{width:100%;height:100%;object-fit:cover;border-radius:12px}
.gallery .g .tall{grid-row:span 2}
@media (max-width:900px){.gallery .g{grid-template-columns:repeat(3,1fr);grid-auto-rows:150px}}
@media (max-width:560px){.gallery .g{grid-template-columns:repeat(2,1fr);grid-auto-rows:130px}}
/* contact/footer */
footer.site{background:var(--ink);color:var(--bg);padding-block:44px 26px;margin-top:10px}
:root[data-variant="b"] footer.site{background:#0E0C0A;color:var(--ink)}
footer .grid{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:28px}
footer h3{font-size:22px;margin-bottom:10px}
footer .eyebrow{color:var(--gold)}
footer a{color:inherit}
footer .hours{display:grid;grid-template-columns:auto 1fr;gap:4px 14px;font-variant-numeric:tabular-nums;font-size:15px}
footer .bottom{margin-top:34px;padding-top:16px;border-top:1px solid rgba(255,255,255,.14);font-size:13px;opacity:.7;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px}
@media (max-width:760px){footer .grid{grid-template-columns:1fr}}