@charset "UTF-8";

/* ── 1. TOKENY ─────────────────────────────────────────────── */
:root{
  --panna:    #F6F1E8;
  --panna-2:  #EFE8DA;
  --panna-3:  #E4DACA;
  --ink:      #241E18;
  --ink-2:    #6E6355;
  --ink-3:    #948877;
  --terra:    #A94A28;
  --terra-dk: #8E3C20;
  --terra-lt: #C25E36;
  --oliva:    #2E3A2E;
  --oliva-lt: #3E4C3E;
  --oro:      #B8913F;
  --hair:     rgba(36,30,24,.16);
  --hair-2:   rgba(36,30,24,.08);
  --scrim:    rgba(20,14,10,.72);

  --sp-1:.5rem;  --sp-2:1rem;   --sp-3:1.5rem; --sp-4:2.5rem;
  --sp-5:4rem;   --sp-6:6rem;   --sp-7:9rem;

  --serif:'Cormorant Garamond',Georgia,'Times New Roman',serif;
  --sans:'Jost',system-ui,-apple-system,'Segoe UI',sans-serif;

  --ease:cubic-bezier(.22,1,.36,1);
  --ease-out:cubic-bezier(.16,1,.3,1);

  --nav-h:88px;
}

/* ── 2. RESET I PODSTAWY ───────────────────────────────────── */
*,*::before,*::after{ box-sizing:border-box }

html{
  -webkit-text-size-adjust:100%;
  scroll-behavior:smooth;
  scroll-padding-top:calc(var(--nav-h) + 1rem);
  scrollbar-color:var(--panna-3) var(--panna);
  caret-color:var(--terra);
}
@media (prefers-reduced-motion:reduce){ html{ scroll-behavior:auto } }

::-webkit-scrollbar{ width:11px; height:11px }
::-webkit-scrollbar-track{ background:var(--panna) }
::-webkit-scrollbar-thumb{ background:var(--panna-3); border:3px solid var(--panna) }
::-webkit-scrollbar-thumb:hover{ background:var(--terra) }

body{
  margin:0;
  background:var(--panna);
  color:var(--ink);
  font-family:var(--sans);
  font-weight:300;
  font-size:17px;
  line-height:1.72;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
body.is-locked{ overflow:hidden }

h1,h2,h3,h4{
  font-family:var(--serif); font-weight:400; margin:0;
  line-height:1.08; letter-spacing:-.012em; text-wrap:balance;
}
p,ul,ol,dl,figure{ margin:0 }
a{ color:inherit }
img,svg,video{ max-width:100%; display:block }
button{ font:inherit; color:inherit }

::selection{ background:var(--terra); color:var(--panna) }
:focus-visible{ outline:2px solid var(--terra); outline-offset:4px; border-radius:1px }
.hero :focus-visible,.page-hero :focus-visible,.footer :focus-visible{ outline-color:var(--panna) }

.skip{
  position:absolute; left:1rem; top:-100px; z-index:200;
  background:var(--ink); color:var(--panna); padding:.9rem 1.4rem;
  font-family:var(--sans); font-size:.82rem; letter-spacing:.14em;
  text-transform:uppercase; text-decoration:none; transition:top .25s var(--ease);
}
.skip:focus{ top:1rem }

.vh{ position:absolute!important; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0 }

/* ── 3. UKŁAD ──────────────────────────────────────────────── */
.wrap{ width:min(1180px, 100% - 2.5rem); margin-inline:auto }
.wrap--narrow{ width:min(760px, 100% - 2.5rem); margin-inline:auto }
.section{ padding-block:var(--sp-7) }
.section--tight{ padding-block:var(--sp-6) }
.section--tint{ background:var(--panna-2); border-block:1px solid var(--hair) }
.section--dark{ background:var(--oliva); color:var(--panna) }
.section--dark .label{ color:var(--oro) }
.section--dark a{ color:var(--panna) }

.label{
  font-family:var(--sans); font-weight:500; font-size:.74rem;
  letter-spacing:.22em; text-transform:uppercase; color:var(--terra);
}
.section-head{ max-width:56ch }
.section-head--center{ margin-inline:auto; text-align:center }
.section-head h2{ font-size:clamp(2.1rem,4.2vw,3.3rem); margin-top:var(--sp-3) }
.section-head p{ color:var(--ink-2); margin-top:var(--sp-2) }
.section--dark .section-head p{ color:rgba(246,241,232,.78) }

.lead{ font-size:1.12rem; line-height:1.75 }
.muted{ color:var(--ink-2) }

/* ── 4. PRZYCISKI I ODNOŚNIKI ──────────────────────────────── */
.btn{
  font-family:var(--sans); font-weight:500; font-size:.82rem;
  letter-spacing:.14em; text-transform:uppercase; text-decoration:none;
  display:inline-flex; align-items:center; justify-content:center; gap:.6rem;
  padding:1rem 2.1rem; border:0; cursor:pointer; text-align:center;
  background:var(--terra); color:var(--panna);
  transition:background .3s var(--ease), transform .3s var(--ease), box-shadow .3s var(--ease);
}
.btn:hover{ background:var(--terra-dk); transform:translateY(-2px) }
.btn:active{ transform:translateY(0) }
.btn[disabled]{ opacity:.5; pointer-events:none }
.btn--line{ background:transparent; color:var(--panna); box-shadow:inset 0 0 0 1px rgba(246,241,232,.55) }
.btn--line:hover{ background:rgba(246,241,232,.12); box-shadow:inset 0 0 0 1px var(--panna) }
.btn--dark{ background:transparent; color:var(--ink); box-shadow:inset 0 0 0 1px var(--hair) }
.btn--dark:hover{ background:var(--ink); color:var(--panna); box-shadow:inset 0 0 0 1px var(--ink) }
.btn--wide{ width:100% }

.more{
  display:inline-block;
  font-family:var(--sans); font-weight:500; font-size:.78rem; letter-spacing:.16em;
  text-transform:uppercase; text-decoration:none; color:var(--terra);
  padding-bottom:.45rem; border-bottom:1px solid var(--terra);
  transition:color .25s var(--ease), border-color .25s var(--ease);
}
.more:hover{ color:var(--ink); border-color:var(--ink) }
.section--dark .more{ color:var(--oro); border-color:var(--oro) }
.section--dark .more:hover{ color:var(--panna); border-color:var(--panna) }

.actions{ display:flex; flex-wrap:wrap; gap:1rem; margin-top:var(--sp-4) }
.actions--center{ justify-content:center }

/* ── 5. SLOT NA ZDJĘCIE ────────────────────────────────────
   Tło zastępcze do czasu podmiany na materiał zdjęciowy.
   Podmiana: usuń .shot i wstaw <img> albo ustaw background-image. */
.shot{
  position:relative; overflow:hidden; background:#241A13;
  background-image:
    radial-gradient(58% 48% at 72% 28%, rgba(255,198,124,.30), transparent 72%),
    radial-gradient(46% 42% at 18% 78%, rgba(206,116,58,.20), transparent 74%),
    linear-gradient(163deg,#3D2E22 0%,#241A13 56%,#37291E 100%);
}
.shot--day{
  background:#CFC3AE;
  background-image:
    radial-gradient(60% 55% at 30% 20%, rgba(255,252,244,.85), transparent 70%),
    radial-gradient(50% 45% at 80% 80%, rgba(190,168,136,.5), transparent 72%),
    linear-gradient(160deg,#E6DCC8 0%,#CFC3AE 60%,#DCD2BE 100%);
}
.shot::after{
  content:''; position:absolute; inset:0; opacity:.5; pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.22'/%3E%3C/svg%3E");
}
.shot img{ width:100%; height:100%; object-fit:cover; position:absolute; inset:0 }

.shot--hero{    background-image:url('../img/hero-sala-wieczor.jpg'),
  radial-gradient(58% 48% at 72% 28%, rgba(255,198,124,.30), transparent 72%),
  linear-gradient(163deg,#3D2E22 0%,#241A13 56%,#37291E 100%) }
.shot--fasada{  background-image:url('../img/fasada-sw-marcin.jpg'),
  radial-gradient(58% 48% at 50% 40%, rgba(255,198,124,.28), transparent 72%),
  linear-gradient(163deg,#3D2E22 0%,#241A13 56%,#37291E 100%) }
.shot--stol{    background-image:url('../img/o-nas-stol.jpg'),
  radial-gradient(60% 55% at 30% 20%, rgba(255,252,244,.85), transparent 70%),
  linear-gradient(160deg,#E6DCC8 0%,#CFC3AE 60%,#DCD2BE 100%) }
.shot--sala{    background-image:url('../img/sala-dzien.jpg'),
  radial-gradient(60% 55% at 30% 20%, rgba(255,252,244,.85), transparent 70%),
  linear-gradient(160deg,#E6DCC8 0%,#CFC3AE 60%,#DCD2BE 100%) }
.shot--grupy{   background-image:url('../img/grupy-stol.jpg'),
  radial-gradient(60% 55% at 30% 20%, rgba(255,252,244,.8), transparent 70%),
  linear-gradient(160deg,#E6DCC8 0%,#CFC3AE 60%,#DCD2BE 100%) }
.shot--wina{    background-image:url('../img/wina-butelki.jpg'),
  radial-gradient(50% 60% at 78% 45%, rgba(255,198,124,.24), transparent 72%),
  linear-gradient(163deg,#33261C 0%,#1D1510 60%,#2C211A 100%) }
.shot--skladniki{ background-image:url('../img/skladniki-makaron.jpg'),
  linear-gradient(160deg,#E6DCC8 0%,#CFC3AE 60%,#DCD2BE 100%) }
.shot--pizza{ background-image:url('../img/pizza-piec.jpg'),
  linear-gradient(163deg,#3D2E22 0%,#241A13 56%,#37291E 100%) }
.shot--hero,.shot--fasada,.shot--stol,.shot--sala,.shot--grupy,.shot--wina,
.shot--skladniki,.shot--pizza{
  background-size:cover; background-position:center; background-repeat:no-repeat;
}
.shot-tag{
  position:absolute; left:1rem; bottom:1rem; z-index:3;
  font-family:var(--sans); font-weight:400; font-size:.62rem;
  letter-spacing:.16em; text-transform:uppercase; color:rgba(246,241,232,.75);
  border:1px solid rgba(246,241,232,.3); padding:.38rem .68rem; line-height:1.5;
  background:rgba(20,14,10,.45); backdrop-filter:blur(3px);
}
.shot--day .shot-tag{ color:rgba(36,30,24,.7); border-color:rgba(36,30,24,.25); background:rgba(246,241,232,.6) }

/* ── 6. NAGŁÓWEK STRONY ────────────────────────────────────── */
.site-header{
  position:absolute; top:0; left:0; right:0; z-index:60;
  transition:background .35s var(--ease), box-shadow .35s var(--ease);
}
.site-header.is-stuck{
  position:fixed; background:var(--panna);
  box-shadow:0 1px 0 var(--hair), 0 12px 30px -24px rgba(36,30,24,.6);
}
.site-header.is-solid{ position:sticky; background:var(--panna); box-shadow:0 1px 0 var(--hair) }

.topbar{ display:flex; align-items:center; gap:var(--sp-4); height:var(--nav-h) }
.mark{ text-decoration:none; margin-right:auto; line-height:1; display:block }
.mark b{
  display:block; font-family:var(--serif); font-weight:500;
  font-size:1.7rem; letter-spacing:.14em; color:var(--panna);
  transition:color .35s var(--ease);
}
.mark span{
  display:block; font-family:var(--sans); font-weight:400; font-size:.55rem;
  letter-spacing:.44em; text-transform:uppercase; color:rgba(246,241,232,.7);
  margin-top:.28rem; transition:color .35s var(--ease);
}
.is-stuck .mark b,.is-solid .mark b{ color:var(--ink) }
.is-stuck .mark span,.is-solid .mark span{ color:var(--ink-2) }

.nav{ display:flex; gap:2rem }
.nav a{
  font-family:var(--sans); font-weight:400; font-size:.78rem; letter-spacing:.16em;
  text-transform:uppercase; text-decoration:none; color:var(--panna);
  padding-block:.4rem; position:relative; transition:color .35s var(--ease);
}
.nav a::after{
  content:''; position:absolute; left:0; right:0; bottom:0; height:1px;
  background:currentColor; transform:scaleX(0); transform-origin:left;
  transition:transform .4s var(--ease);
}
.nav a:hover::after,.nav a[aria-current="page"]::after{ transform:scaleX(1) }
.is-stuck .nav a,.is-solid .nav a{ color:var(--ink) }
.nav a[aria-current="page"]{ color:var(--terra) }
.is-stuck .nav a[aria-current="page"],.is-solid .nav a[aria-current="page"]{ color:var(--terra) }

.nav-cta{ display:none }

.burger{
  display:none; background:none; border:0; padding:.6rem; cursor:pointer;
  color:var(--panna); transition:color .35s var(--ease);
}
.is-stuck .burger,.is-solid .burger{ color:var(--ink) }

.drawer{
  position:fixed; inset:0; z-index:90; background:var(--panna);
  display:flex; flex-direction:column; padding:var(--sp-3) 0 var(--sp-4);
  transform:translateY(-100%); visibility:hidden;

  transition:transform .5s var(--ease), visibility 0s linear .5s;
}
.drawer.is-open{
  transform:translateY(0); visibility:visible;
  transition:transform .5s var(--ease), visibility 0s linear 0s;
}
.drawer-top{ display:flex; align-items:center; height:var(--nav-h) }
.drawer .mark b{ color:var(--ink) } .drawer .mark span{ color:var(--ink-2) }
.drawer-close{ background:none; border:0; padding:.6rem; cursor:pointer; color:var(--ink); margin-left:auto }
.drawer-nav{ display:flex; flex-direction:column; gap:.2rem; margin-top:var(--sp-4); flex:1 }
.drawer-nav a{
  font-family:var(--serif); font-size:2rem; font-weight:400; text-decoration:none;
  color:var(--ink); padding:.45rem 0; border-bottom:1px solid var(--hair-2);
}
.drawer-nav a[aria-current="page"]{ color:var(--terra) }
.drawer-foot{ margin-top:var(--sp-4); display:grid; gap:.8rem }
.drawer-foot .tel{
  font-family:var(--sans); font-size:1.1rem; font-weight:400; letter-spacing:.04em;
  text-decoration:none; color:var(--ink); font-variant-numeric:tabular-nums;
}

/* ── 7. HERO (strona główna) ───────────────────────────────── */
.hero{
  position:relative; min-height:100vh; min-height:100svh;
  display:flex; flex-direction:column; isolation:isolate; overflow:hidden;
}
.hero > .shot{ position:absolute; inset:0; z-index:-2 }
.hero-img{ position:absolute; inset:0; z-index:-2; width:100%; height:100%;
  object-fit:cover; object-position:center 42%;

  animation:hero-breathe 34s ease-in-out infinite alternate }
@keyframes hero-breathe{ from{ transform:scale(1) } to{ transform:scale(1.07) } }

.wine-bg{ position:absolute; inset:0; opacity:.28 }
.wine-veil{ position:absolute; inset:0;
  background:linear-gradient(90deg, rgba(46,58,46,.92) 0%, rgba(46,58,46,.7) 45%, rgba(46,58,46,.86) 100%) }
.status .sep{ color:rgba(246,241,232,.4) }
.hero-scrim{
  position:absolute; inset:-1px; z-index:-1;
  background:
    radial-gradient(70% 55% at 50% 52%, rgba(20,14,10,.55) 0%, rgba(20,14,10,.2) 100%),
    linear-gradient(180deg, rgba(20,14,10,.72) 0%, rgba(20,14,10,.34) 38%, rgba(20,14,10,.78) 100%);
}
.hero-body{
  flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center;
  text-align:center; padding-block:var(--sp-6) var(--sp-5);
}
.hero h1{ color:var(--panna); font-size:clamp(2.7rem,6.2vw,5.3rem); font-weight:300; max-width:16ch }
.hero h1 em{ font-style:italic; font-weight:400 }
.hero-lede{
  max-width:52ch; margin-top:var(--sp-3); color:rgba(246,241,232,.88);
  font-size:1.1rem; line-height:1.75;
}
.hero .actions{ justify-content:center }

.status{
  display:inline-flex; align-items:center; gap:.6rem; margin-bottom:var(--sp-4);
  font-family:var(--sans); font-weight:400; font-size:.72rem;
  letter-spacing:.2em; text-transform:uppercase; color:rgba(246,241,232,.92);
}
.status .disc{
  width:7px; height:7px; border-radius:50%; background:#8FBF7A; flex:none;
  box-shadow:0 0 0 0 rgba(143,191,122,.6); animation:pulse 2.8s ease-out infinite;
}
.status[data-open="false"] .disc{ background:var(--ink-3); animation:none }
.status .hrs{ font-variant-numeric:tabular-nums }
@keyframes pulse{ 0%{box-shadow:0 0 0 0 rgba(143,191,122,.5)} 70%,100%{box-shadow:0 0 0 10px rgba(143,191,122,0)} }

.page-hero{ position:relative; padding-block:calc(var(--nav-h) + var(--sp-6)) var(--sp-6); isolation:isolate }
.page-hero > .shot{ position:absolute; inset:0; z-index:-2 }
.page-hero .hero-scrim{
  background:
    linear-gradient(90deg, rgba(20,14,10,.8) 0%, rgba(20,14,10,.5) 65%, rgba(20,14,10,.4) 100%),
    linear-gradient(180deg, rgba(20,14,10,.55) 0%, rgba(20,14,10,.6) 100%);
}
.page-hero h1{ color:var(--panna); font-size:clamp(2.4rem,5.2vw,4.2rem); font-weight:300; max-width:18ch }
.page-hero .label{ color:var(--oro) }
.page-hero p{ color:rgba(246,241,232,.85); max-width:56ch; margin-top:var(--sp-2) }

/* ── 8. PASEK WYRÓŻNIKÓW ───────────────────────────────────── */
.marks{ border-bottom:1px solid var(--hair) }
.marks ul{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(4,1fr) }
.marks li{ padding:var(--sp-4) var(--sp-3); border-left:1px solid var(--hair); text-align:center }
.marks li:first-child{ border-left:0 }
.marks dt{ font-family:var(--serif); font-size:1.5rem; font-weight:500; color:var(--terra) }
.marks dd{ margin:.3rem 0 0; font-size:.86rem; color:var(--ink-2) }

/* ── 9. UKŁAD DWUKOLUMNOWY ─────────────────────────────────── */
.split{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,.92fr); gap:var(--sp-6); align-items:center }
.split--flip .split-media{ order:-1 }

.split--sticky{ align-items:start }
.split--sticky .split-media{ position:sticky; top:calc(var(--nav-h) + var(--sp-3)) }
.split--sticky .split-body{ padding-block:var(--sp-3) }
.split-body h2{ font-size:clamp(2.1rem,4.2vw,3.3rem); margin-top:var(--sp-3); max-width:15ch }
.split-body .text{ margin-top:var(--sp-3); color:var(--ink-2); max-width:56ch; font-size:1.05rem }
.split-body .text p + p{ margin-top:var(--sp-2) }
.split-body .text b{ color:var(--ink); font-weight:400 }
.split-media .shot{ aspect-ratio:4/5 }

/* ── 10. KARTA DAŃ ─────────────────────────────────────────── */
.cats{ display:flex; flex-wrap:wrap; justify-content:center; gap:.3rem 2rem; margin-top:var(--sp-4) }
.cats a{
  font-family:var(--sans); font-weight:400; font-size:.78rem; letter-spacing:.16em;
  text-transform:uppercase; text-decoration:none; color:var(--ink-2);
  padding-block:.55rem; border-bottom:1px solid transparent;
  transition:color .25s var(--ease), border-color .25s var(--ease);
}
.cats a:hover{ color:var(--ink); border-color:var(--hair) }
.cats a.is-active{ color:var(--terra); border-color:var(--terra) }

.cats-bar{
  position:sticky; top:0; z-index:50; background:var(--panna);
  border-bottom:1px solid var(--hair); transition:top .35s var(--ease);
}
.cats-bar.is-below-nav{ top:var(--nav-h) }
.cats-bar .cats{ margin-top:0; justify-content:flex-start; flex-wrap:nowrap;
  overflow-x:auto; scrollbar-width:none; gap:1.6rem }
.cats-bar .cats::-webkit-scrollbar{ display:none }
.cats-bar .cats a{ white-space:nowrap }

.dishes{ display:grid; grid-template-columns:1fr 1fr; gap:0 var(--sp-6); margin-top:var(--sp-3) }
.dishes--single{ grid-template-columns:1fr; max-width:820px }
.dish{ padding:1.3rem 0; border-bottom:1px solid var(--hair) }
.dish-top{ display:flex; align-items:baseline; gap:.75rem }
.dish-name{ font-family:var(--serif); font-weight:600; font-size:1.36rem; line-height:1.2 }
.dish-top::after{
  content:''; order:2; flex:1 1 auto; min-width:1.5rem; height:1px;
  align-self:flex-end; margin-bottom:.42em;
  background-image:radial-gradient(circle at 1px 1px, rgba(36,30,24,.34) 1px, transparent 1.3px);
  background-size:5px 2px; background-repeat:repeat-x;
}
.dish-price{
  order:3; font-family:var(--sans); font-weight:500; font-size:1rem;
  font-variant-numeric:tabular-nums; white-space:nowrap; color:var(--ink);
}
.dish-desc{ margin-top:.3rem; font-size:.94rem; color:var(--ink-2); max-width:46ch }
.diet{ display:inline-flex; gap:.35rem; margin-left:.5rem; transform:translateY(-1px) }
.diet i{
  font-style:normal; font-family:var(--sans); font-weight:500; font-size:.57rem;
  letter-spacing:.12em; text-transform:uppercase; padding:.16rem .4rem;
  border:1px solid var(--hair); color:var(--ink-2); white-space:nowrap;
}

.course{ margin-top:var(--sp-7); scroll-margin-top:calc(var(--nav-h) + 3rem) }
.course:first-of-type{ margin-top:var(--sp-5) }
.course > h2{
  font-family:var(--serif); font-weight:400; font-size:clamp(1.9rem,3.4vw,2.7rem);
  letter-spacing:-.012em; color:var(--ink); padding-bottom:var(--sp-2);
  border-bottom:1px solid var(--ink);
  display:flex; align-items:baseline; justify-content:space-between; gap:1.5rem;
}
.course > h2 .count{
  font-family:var(--sans); font-weight:500; font-size:.7rem; letter-spacing:.18em;
  text-transform:uppercase; color:var(--terra); white-space:nowrap;
}
.course > .note{ margin-top:var(--sp-2); font-size:.95rem; color:var(--ink-2); max-width:60ch }

.legend{ display:flex; flex-wrap:wrap; gap:1.4rem; margin-top:var(--sp-4);
  padding-top:var(--sp-3); border-top:1px solid var(--hair) }
.legend div{ display:flex; align-items:center; gap:.5rem; font-size:.86rem; color:var(--ink-2) }

/* ── 11. KARTA WIN ─────────────────────────────────────────── */
.wine{ padding:1.15rem 0; border-bottom:1px solid var(--hair) }
.wine-top{ display:flex; align-items:baseline; gap:.75rem }
.wine-name{ font-family:var(--serif); font-weight:600; font-size:1.22rem; line-height:1.25 }
.wine-top::after{
  content:''; order:2; flex:1 1 auto; min-width:1.5rem; height:1px;
  align-self:flex-end; margin-bottom:.42em;
  background-image:radial-gradient(circle at 1px 1px, rgba(36,30,24,.3) 1px, transparent 1.3px);
  background-size:5px 2px; background-repeat:repeat-x;
}
.wine-price{ order:3; font-family:var(--sans); font-weight:500; font-size:.98rem;
  font-variant-numeric:tabular-nums; white-space:nowrap }
.wine-meta{ margin-top:.25rem; font-size:.88rem; color:var(--ink-2);
  font-family:var(--sans); letter-spacing:.02em }
.wine-meta em{ font-style:normal; color:var(--ink-3) }

.section--dark .wine{ border-bottom-color:rgba(246,241,232,.2) }
.section--dark .wine-name{ color:var(--panna) }
.section--dark .wine-price{ color:var(--oro) }
.section--dark .wine-meta{ color:rgba(246,241,232,.72) }
.section--dark .wine-meta em{ color:rgba(246,241,232,.5) }
.section--dark .wine-top::after{
  background-image:radial-gradient(circle at 1px 1px, rgba(246,241,232,.32) 1px, transparent 1.3px);
}

/* ── 12. MENU DLA GRUP ─────────────────────────────────────── */
.plans{ display:grid; grid-template-columns:1fr 1fr; gap:var(--sp-4); margin-top:var(--sp-5) }
.plan{ border:1px solid var(--hair); background:var(--panna); padding:var(--sp-4) }
.plan-head{ border-bottom:1px solid var(--hair); padding-bottom:var(--sp-3) }
.plan h3{ font-size:1.9rem; margin-top:.4rem }
.plan-price{
  font-family:var(--sans); font-weight:500; font-size:1.5rem; color:var(--terra);
  font-variant-numeric:tabular-nums; margin-top:var(--sp-2); display:block;
}
.plan-price small{ font-size:.82rem; font-weight:300; color:var(--ink-2); letter-spacing:.04em }
.plan ul{ list-style:none; margin:var(--sp-3) 0 0; padding:0 }
.plan li{ padding:.6rem 0; border-bottom:1px solid var(--hair-2); font-size:.98rem }
.plan li:last-child{ border-bottom:0 }

.facts{
  list-style:none; margin:var(--sp-5) 0 0; padding:0;
  display:grid; grid-template-columns:repeat(3,1fr);
  border-top:1px solid var(--ink); border-left:1px solid var(--hair);
}
.facts li{
  display:flex; flex-direction:column;
  padding:var(--sp-3) var(--sp-3) var(--sp-4);
  border-right:1px solid var(--hair); border-bottom:1px solid var(--hair);
  transition:background .3s var(--ease);
}
.facts li:hover{ background:rgba(169,74,40,.045) }
.facts h3{
  font-family:var(--sans); font-weight:500; font-size:.72rem;
  letter-spacing:.18em; text-transform:uppercase; color:var(--terra);
}
.fact-ico{ width:28px; height:28px; color:var(--terra); margin-bottom:var(--sp-2) }
.facts li:hover .fact-ico{ color:var(--ink); transition:color .3s var(--ease) }
.facts .fact-num{
  font-family:var(--serif); font-weight:500; font-size:2.4rem; line-height:1;
  color:var(--ink); margin-top:.7rem; font-variant-numeric:lining-nums;
}
.facts .fact-num small{ font-family:var(--sans); font-size:.8rem; font-weight:300;
  color:var(--ink-2); letter-spacing:.04em }
.facts p{ margin-top:.6rem; color:var(--ink-2); font-size:.95rem }
.facts .fact-num + p{ margin-top:.5rem }

.section--dark .facts{ border-top-color:var(--oro); border-left-color:rgba(246,241,232,.16) }
.section--dark .facts li{ border-right-color:rgba(246,241,232,.16); border-bottom-color:rgba(246,241,232,.16) }
.section--dark .facts li:hover{ background:rgba(246,241,232,.05) }
.section--dark .facts h3{ color:var(--oro) }
.section--dark .facts .fact-num{ color:var(--panna) }
.section--dark .facts p{ color:rgba(246,241,232,.78) }

/* ── 13. DOWÓD SPOŁECZNY ───────────────────────────────────── */
/* ── OPINIE ────────────────────────────────────────────── */
.reviews{ display:grid; grid-template-columns:minmax(0,.62fr) minmax(0,1fr);
  gap:var(--sp-6); align-items:center }

.score{ text-align:center; padding:var(--sp-4) var(--sp-3);
  border:1px solid var(--hair); background:var(--panna) }
.score .num{
  font-family:var(--serif); font-weight:500; font-size:5.2rem; line-height:.9;
  color:var(--terra); font-variant-numeric:lining-nums; display:block;
  font-feature-settings:'tnum';
}
.stars{ display:flex; gap:.3rem; margin-top:var(--sp-2); justify-content:center }
.stars svg{ width:20px; height:20px; color:var(--oro) }

.js .stars svg{ opacity:.22 }
.js .stars.is-lit svg{ opacity:1; transition:opacity .5s var(--ease) }
.js .stars.is-lit svg:nth-child(2){ transition-delay:.1s }
.js .stars.is-lit svg:nth-child(3){ transition-delay:.2s }
.js .stars.is-lit svg:nth-child(4){ transition-delay:.3s }
.js .stars.is-lit svg:nth-child(5){ transition-delay:.4s }
.score .of{ font-family:var(--sans); font-size:.8rem; letter-spacing:.16em;
  text-transform:uppercase; color:var(--ink-2); margin-top:var(--sp-3) }
.score .count{ font-family:var(--serif); font-size:1.5rem; color:var(--ink); margin-top:.4rem }
.score .count b{ font-weight:500; font-variant-numeric:lining-nums }

.praise{ list-style:none; margin:0; padding:0; border-top:1px solid var(--ink) }
.praise li{ padding:var(--sp-3) 0; border-bottom:1px solid var(--hair);
  display:grid; grid-template-columns:auto 1fr; gap:1.2rem; align-items:start }
.praise-ico{ width:26px; height:26px; color:var(--terra); flex:none; margin-top:.1rem }
.praise h3{ font-family:var(--sans); font-weight:500; font-size:.74rem;
  letter-spacing:.18em; text-transform:uppercase; color:var(--ink) }
.praise p{ margin-top:.4rem; color:var(--ink-2); font-size:.98rem }

.trust{
  display:inline-flex; align-items:center; gap:.55rem; margin-top:var(--sp-3);
  font-family:var(--sans); font-weight:400; font-size:.78rem; letter-spacing:.1em;
  color:rgba(246,241,232,.8); text-decoration:none;
  border-bottom:1px solid transparent; padding-bottom:.2rem;
  transition:color .25s var(--ease), border-color .25s var(--ease);
}
.trust:hover{ color:var(--panna); border-bottom-color:rgba(246,241,232,.5) }
.trust svg{ width:14px; height:14px; color:var(--oro); flex:none }
.trust b{ font-weight:500; color:var(--panna); font-variant-numeric:lining-nums }

/* ── 14. KONTAKT, FORMULARZ, MAPA ──────────────────────────── */
.contact-grid{ display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1fr); gap:var(--sp-6) }
.info dl{ margin:0 }
.info dt{ font-family:var(--sans); font-weight:500; font-size:.72rem; letter-spacing:.18em;
  text-transform:uppercase; color:var(--ink-2); margin-top:var(--sp-3) }
.info dd{ margin:.35rem 0 0; font-size:1.05rem }
.info dd a{ text-decoration:none; border-bottom:1px solid var(--hair);
  transition:border-color .25s var(--ease) }
.info dd a:hover{ border-color:var(--terra) }
.hours{ list-style:none; margin:.4rem 0 0; padding:0 }
.hours li{ display:flex; justify-content:space-between; gap:1rem; padding:.32rem 0;
  border-bottom:1px solid var(--hair-2); font-size:.98rem; max-width:340px }
.hours li span:last-child{ font-variant-numeric:tabular-nums; color:var(--ink-2) }
.hours li.is-today{ color:var(--terra) }
.hours li.is-today span:last-child{ color:var(--terra) }

.form{ display:grid; gap:var(--sp-3) }
.row{ display:grid; grid-template-columns:1fr 1fr; gap:var(--sp-3) }
.field{ display:grid; gap:.4rem }
.field label{ font-family:var(--sans); font-weight:500; font-size:.74rem;
  letter-spacing:.16em; text-transform:uppercase; color:var(--ink-2) }
.field .req{ color:var(--terra) }
.field input,.field select,.field textarea{
  font-family:var(--sans); font-weight:300; font-size:1rem; color:var(--ink);
  background:transparent; border:0; border-bottom:1px solid var(--hair);
  padding:.7rem .2rem; border-radius:0; -webkit-appearance:none; appearance:none;
  transition:border-color .25s var(--ease);
}
.field select{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none' stroke='%236E6355' stroke-width='1.5'%3E%3Cpath d='M1 1.5 6 6.5l5-5'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right .3rem center; padding-right:1.6rem;
}
.field textarea{ min-height:120px; resize:vertical; line-height:1.6 }
.field input:focus,.field select:focus,.field textarea:focus{
  outline:none; border-bottom-color:var(--terra); border-bottom-width:2px; padding-bottom:calc(.7rem - 1px);
}
.field input::placeholder,.field textarea::placeholder{ color:var(--ink-3) }
.field .hint{ font-size:.82rem; color:var(--ink-2) }
.field .err{ font-size:.84rem; color:var(--terra); display:none }
.field.has-error input,.field.has-error select,.field.has-error textarea{ border-bottom-color:var(--terra) }
.field.has-error .err{ display:block }

.check{ display:grid; grid-template-columns:auto 1fr; gap:.75rem; align-items:start;
  font-size:.92rem; color:var(--ink-2); line-height:1.6 }
.check input{ width:20px; height:20px; margin-top:.2rem; accent-color:var(--terra);
  border:1px solid var(--hair); flex:none }
.check a{ color:var(--terra) }

.form-note{ font-size:.9rem; color:var(--ink-2); border-left:1px solid var(--terra);
  padding-left:var(--sp-2); line-height:1.65 }
.form-status{ display:none; padding:var(--sp-3); font-size:.95rem; line-height:1.6 }
.form-status.is-ok{ display:block; background:var(--panna-2); border-top:2px solid #4C7A3A }
.form-status.is-fail{ display:block; background:var(--panna-2); border-top:2px solid var(--terra) }

.map{ margin-top:var(--sp-5) }
.map iframe{ width:100%; height:420px; border:0; display:block; filter:saturate(.8) contrast(1.02) }
.map-fallback{ margin-top:var(--sp-2); font-size:.9rem; color:var(--ink-2) }

.faq{ margin-top:var(--sp-4) }
.faq details{ border-bottom:1px solid var(--hair) }
.faq summary{
  cursor:pointer; list-style:none; padding:1.15rem 2.5rem 1.15rem 0; position:relative;
  font-family:var(--serif); font-size:1.28rem; font-weight:500;
}
.faq summary::-webkit-details-marker{ display:none }
.faq summary::after{
  content:''; position:absolute; right:.4rem; top:50%; width:12px; height:12px;
  border-right:1px solid var(--ink-2); border-bottom:1px solid var(--ink-2);
  transform:translateY(-70%) rotate(45deg); transition:transform .3s var(--ease);
}
.faq details[open] summary::after{ transform:translateY(-30%) rotate(-135deg) }
.faq .answer{ padding-bottom:1.3rem; color:var(--ink-2); max-width:64ch }

/* ── 15. STOPKA ────────────────────────────────────────────── */
.footer{ background:var(--oliva); color:var(--panna); padding-block:var(--sp-6) var(--sp-4) }
.footer-grid{ display:grid; grid-template-columns:1.2fr 1fr 1fr; gap:var(--sp-5) }
.footer .mark b{ color:var(--panna) } .footer .mark span{ color:rgba(246,241,232,.65) }
.footer h3{ font-family:var(--sans); font-weight:500; font-size:.74rem; letter-spacing:.2em;
  text-transform:uppercase; color:var(--oro) }
.footer ul{ list-style:none; margin:var(--sp-2) 0 0; padding:0 }
.footer li{ padding:.28rem 0 }
.footer a{ text-decoration:none; color:rgba(246,241,232,.85);
  transition:color .25s var(--ease) }
.footer a:hover{ color:var(--panna) }
.footer .tagline{ margin-top:var(--sp-3); color:rgba(246,241,232,.75); max-width:34ch; font-size:.95rem }
.footer-bottom{ margin-top:var(--sp-5); padding-top:var(--sp-3);
  border-top:1px solid rgba(246,241,232,.18); display:flex; flex-wrap:wrap; gap:var(--sp-2) var(--sp-4);
  font-size:.84rem; color:rgba(246,241,232,.6) }
.footer-bottom a{ color:rgba(246,241,232,.6) }

/* ── 16. PASEK AKCJI (telefon) ─────────────────────────────── */
.mobile-bar{
  display:none; position:fixed; left:0; right:0; bottom:0; z-index:70;
  background:var(--panna); border-top:1px solid var(--hair);
  padding-bottom:env(safe-area-inset-bottom);
  box-shadow:0 -10px 30px -20px rgba(36,30,24,.5);
}
.mobile-bar ul{ display:grid; grid-template-columns:repeat(3,1fr); list-style:none; margin:0; padding:0 }
.mobile-bar a{
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.28rem;
  min-height:58px; text-decoration:none; color:var(--ink);
  font-family:var(--sans); font-weight:500; font-size:.66rem;
  letter-spacing:.14em; text-transform:uppercase;
}
.mobile-bar li:nth-child(2) a{ background:var(--terra); color:var(--panna) }
.mobile-bar svg{ width:17px; height:17px }

/* ── 17. RUCH ──────────────────────────────────────────────── */

.js .reveal{ opacity:0; transform:translateY(18px) }
.js .reveal.is-in{ opacity:1; transform:none;
  transition:opacity .8s var(--ease-out), transform .8s var(--ease-out) }

/* ── 18. RESPONSYWNOŚĆ ─────────────────────────────────────── */
@media (max-width:1024px){
  .nav{ gap:1.4rem }
  .nav a{ font-size:.72rem; letter-spacing:.12em }
  .split{ gap:var(--sp-4) }
}
@media (max-width:900px){
  :root{ --nav-h:72px; --sp-7:5.5rem; --sp-6:4rem }
  .nav{ display:none }
  .burger{ display:block }
  .mobile-bar{ display:block }
  body{ padding-bottom:64px }
  .marks ul{ grid-template-columns:1fr 1fr }
  .marks li:nth-child(odd){ border-left:0 }
  .marks li:nth-child(n+3){ border-top:1px solid var(--hair) }
  .split{ grid-template-columns:1fr }
  .split-media{ order:-1 }
  .split-media .shot{ aspect-ratio:3/2 }
  .split--sticky .split-media{ position:static }
  .facts{ grid-template-columns:1fr 1fr }
  .reviews{ grid-template-columns:1fr; gap:var(--sp-4) }
  .dishes{ grid-template-columns:1fr }
  .plans{ grid-template-columns:1fr }
  .contact-grid{ grid-template-columns:1fr }
  .footer-grid{ grid-template-columns:1fr 1fr }
  .cats-bar.is-below-nav{ top:var(--nav-h) }
}
@media (max-width:560px){
  .wrap,.wrap--narrow{ width:calc(100% - 2rem) }

  .status{ flex-wrap:wrap; justify-content:center; row-gap:.1rem;
    font-size:.68rem; letter-spacing:.16em }
  .status .sep{ display:none }
  .status .hrs{ flex-basis:100%; text-align:center }
  .row{ grid-template-columns:1fr }
  .dish-top,.wine-top{ flex-wrap:wrap }
  .dish-top::after,.wine-top::after{ display:none }
  .dish-price,.wine-price{ margin-left:auto }
  .footer-grid{ grid-template-columns:1fr; gap:var(--sp-4) }
  .facts{ grid-template-columns:1fr }
  .score .num{ font-size:4rem }
  .course > h2{ display:block }
  .course > h2 .count{ display:block; margin-top:.5rem }
  .map iframe{ height:320px }
  .plan{ padding:var(--sp-3) }
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms!important; animation-iteration-count:1!important;
    transition-duration:.01ms!important;
  }
  .js .reveal{ opacity:1; transform:none }
}

/* ── 19. DRUK (karta dań / karta win) ──────────────────────── */
@media print{
  .site-header,.mobile-bar,.drawer,.cats-bar,.footer,.shot,.hero-scrim,.actions{ display:none!important }
  body{ background:#fff; color:#000; font-size:11pt; padding:0 }
  .page-hero{ padding-block:0 1rem }
  .page-hero h1{ color:#000 }
  .dishes{ grid-template-columns:1fr 1fr }
  .course{ break-inside:avoid }
}