/* ============================================================
   TOKENY — kolory, typografia, odstępy.
   Chcesz zmienić kolorystykę? Zmieniasz tylko tutaj.
   ============================================================ */
:root{
  --atrament:#0d2a30;      /* głęboka woda — tekst i tła */
  --woda:#1b6b6f;          /* turkus jeziora — elementy aktywne */
  --tafla:#dfeae6;         /* jasna tafla — delikatne tła */
  --piasek:#eadfc9;        /* piasek plaży */
  --slonce:#c8912f;        /* światło lampy / zachód — akcent */
  --bialy:#fbfaf6;         /* biel domku */

  --tlo:var(--bialy);
  --tlo-2:#f2efe7;
  --tekst:var(--atrament);
  --tekst-cichy:#4d6a6e;
  --linia:#cfd9d4;
  --karta:#ffffff;
  --btn-tekst:#ffffff;
  --cien:0 1px 2px rgba(13,42,48,.06), 0 8px 24px -12px rgba(13,42,48,.18);

  --serif:"Petrona", Georgia, "Times New Roman", serif;
  --sans:"Karla", system-ui, -apple-system, "Segoe UI", sans-serif;

  --max:1140px;
  --r-s:6px; --r-m:12px; --r-l:22px;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --tlo:#08191d; --tlo-2:#0d2429; --tekst:#e6efec; --tekst-cichy:#9db3b3;
    --linia:#22434a; --karta:#0f2b31; --tafla:#153840; --piasek:#3b3527;
    --woda:#4fb0a8; --slonce:#e0ad4d; --btn-tekst:#06181c;
    --cien:0 1px 2px rgba(0,0,0,.4), 0 10px 30px -14px rgba(0,0,0,.7);
  }
}
:root[data-theme="dark"]{
  --tlo:#08191d; --tlo-2:#0d2429; --tekst:#e6efec; --tekst-cichy:#9db3b3;
  --linia:#22434a; --karta:#0f2b31; --tafla:#153840; --piasek:#3b3527;
  --woda:#4fb0a8; --slonce:#e0ad4d; --btn-tekst:#06181c;
  --cien:0 1px 2px rgba(0,0,0,.4), 0 10px 30px -14px rgba(0,0,0,.7);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth; scroll-padding-top:76px}
@media (prefers-reduced-motion:reduce){ html{scroll-behavior:auto} *{animation:none !important; transition:none !important} }

body{
  margin:0; background:var(--tlo); color:var(--tekst);
  font-family:var(--sans); font-size:17px; line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%; display:block}
a{color:inherit}
h1,h2,h3{font-family:var(--serif); font-weight:500; line-height:1.12; margin:0; letter-spacing:-.01em}
h1{font-size:clamp(2.6rem,7vw,4.6rem)}
h2{font-size:clamp(1.9rem,4.2vw,2.9rem)}
h3{font-size:1.22rem; line-height:1.25}
p{margin:0 0 1em}
.owijka{max-width:var(--max); margin-inline:auto; padding-inline:22px}
.sekcja{padding-block:clamp(56px,9vw,104px)}
.sekcja--tlo{background:var(--tlo-2)}
.wstep{max-width:56ch; color:var(--tekst-cichy); font-size:1.06rem}
:focus-visible{outline:3px solid var(--slonce); outline-offset:3px; border-radius:4px}

/* ---------- pasek górny ---------- */
.pasek{
  position:sticky; top:0; z-index:60;
  background:color-mix(in srgb, var(--tlo) 88%, transparent);
  backdrop-filter:blur(12px); border-bottom:1px solid var(--linia);
}
.pasek__in{display:flex; align-items:center; gap:26px; height:64px; max-width:var(--max); margin-inline:auto; padding-inline:22px}
.marka{font-family:var(--serif); font-size:1.16rem; text-decoration:none; white-space:nowrap; font-weight:600}
.marka span{color:var(--woda)}
.nawi{display:flex; gap:22px; margin-left:auto; font-size:.95rem}
.nawi a{text-decoration:none; color:var(--tekst-cichy); padding-block:6px; border-bottom:2px solid transparent}
.nawi a:hover{color:var(--tekst); border-bottom-color:var(--slonce)}
@media (max-width:900px){ .nawi{display:none} }

/* ---------- przyciski ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:9px;
  font:600 .97rem/1 var(--sans); padding:14px 22px; border-radius:999px;
  border:1px solid transparent; cursor:pointer; text-decoration:none; transition:.18s ease;
}
.btn--glowny{background:var(--woda); color:var(--btn-tekst)}
.btn--glowny:hover{filter:brightness(.9)}
.btn--obrys{background:transparent; color:var(--tekst); border-color:var(--linia)}
.btn--obrys:hover{border-color:var(--woda); color:var(--woda)}
.btn--maly{padding:10px 16px; font-size:.9rem}
.btn[disabled]{opacity:.45; cursor:not-allowed}

/* ---------- hero ---------- */
.hero{position:relative; min-height:min(88vh,760px); display:flex; align-items:flex-end; overflow:hidden; background:var(--atrament)}
.hero__media{position:absolute; inset:0}
.hero__media svg{width:100%; height:100%}
/* Masz zdjęcie? Odkomentuj i podaj ścieżkę — zastąpi grafikę: */
.hero__foto{
  position:absolute; inset:0; background-size:cover; background-position:center;
  background-image:url("zdjecia/ognisko.jpg");
  background-position:center 42%;
}
.hero__zaslona{position:absolute; inset:0; background:linear-gradient(to top, rgba(6,24,28,.92) 0%, rgba(6,24,28,.45) 45%, rgba(6,24,28,.15) 100%)}
.hero__tresc{position:relative; width:100%; max-width:var(--max); margin-inline:auto; padding:0 22px clamp(40px,7vw,76px); color:#fdfcf8}
.hero h1{max-width:14ch; text-shadow:0 2px 30px rgba(0,0,0,.35)}
.hero__lead{max-width:46ch; font-size:1.12rem; color:#e4ece9; margin-top:18px}
.hero__cta{display:flex; flex-wrap:wrap; gap:12px; margin-top:28px}
.hero .btn--obrys{color:#fdfcf8; border-color:rgba(255,255,255,.5)}
.hero .btn--obrys:hover{background:rgba(255,255,255,.12); color:#fff; border-color:#fff}
.hero__lokal{font-size:.9rem; letter-spacing:.06em; color:var(--piasek); margin-bottom:20px}
@media (prefers-reduced-motion:no-preference){
  .hero__tresc>*{animation:wejscie .8s cubic-bezier(.2,.7,.3,1) backwards}
  .hero__lokal{animation-delay:.05s} .hero h1{animation-delay:.15s}
  .hero__lead{animation-delay:.28s} .hero__cta{animation-delay:.4s}
  @keyframes wejscie{from{opacity:0; transform:translateY(18px)} to{opacity:1; transform:none}}
}

/* ---------- fakty ---------- */
.fakty{display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); border-top:1px solid var(--linia)}
.fakt{padding:26px 22px; border-right:1px solid var(--linia); border-bottom:1px solid var(--linia)}
.fakt b{display:block; font-family:var(--serif); font-size:1.75rem; font-weight:500; line-height:1}
.fakt span{display:block; margin-top:6px; font-size:.9rem; color:var(--tekst-cichy)}

/* ---------- układ dwukolumnowy ---------- */
.duo{display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(28px,5vw,64px); align-items:start}
@media (max-width:820px){ .duo{grid-template-columns:1fr} }

.lista-udogodnien{list-style:none; margin:26px 0 0; padding:0; display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:2px 26px}
.lista-udogodnien li{padding:9px 0 9px 26px; position:relative; border-bottom:1px solid var(--linia); font-size:.97rem}
.lista-udogodnien li::before{content:"—"; position:absolute; left:0; color:var(--slonce)}

/* ---------- galeria ---------- */
.galeria{display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin-top:36px}
.galeria button{
  all:unset; cursor:zoom-in; position:relative; aspect-ratio:4/3; border-radius:var(--r-m);
  overflow:hidden; background:var(--tafla); display:block;
}
.galeria button:nth-child(1){grid-column:span 2; grid-row:span 2; aspect-ratio:auto}
.galeria img{width:100%; height:100%; object-fit:cover}
.zastepnik{position:absolute; inset:0; display:flex; flex-direction:column; justify-content:flex-end; padding:14px;
  background:linear-gradient(145deg, var(--tafla), var(--piasek)); color:var(--atrament)}
.zastepnik b{font-family:var(--serif); font-size:1rem; font-weight:600}
.zastepnik small{font-size:.75rem; opacity:.72}
.galeria figcaption{position:absolute; left:0; right:0; bottom:0; padding:26px 14px 12px; color:#fff; font-size:.88rem;
  background:linear-gradient(to top, rgba(6,24,28,.8), transparent)}
@media (max-width:720px){ .galeria{grid-template-columns:repeat(2,1fr)} .galeria button:nth-child(1){grid-column:span 2; grid-row:auto; aspect-ratio:4/3} }

.lupa{position:fixed; inset:0; z-index:100; background:rgba(5,18,22,.94); display:none; place-items:center; padding:20px}
.lupa[open]{display:grid}
.lupa figure{margin:0; max-width:1000px; width:100%}
.lupa .kadr{aspect-ratio:3/2; border-radius:var(--r-m); overflow:hidden; position:relative; background:var(--tafla)}
.lupa img{width:100%; height:100%; object-fit:contain; background:#08191d}
.lupa figcaption{color:#dfeae6; text-align:center; padding-top:14px; font-size:.95rem}
.lupa__x, .lupa__strzalka{position:absolute; background:rgba(255,255,255,.12); color:#fff; border:0; width:46px; height:46px;
  border-radius:50%; font-size:1.3rem; cursor:pointer; display:grid; place-items:center}
.lupa__x{top:16px; right:16px}
.lupa__strzalka{top:50%; transform:translateY(-50%)}
.lupa__strzalka.lewo{left:16px} .lupa__strzalka.prawo{right:16px}
.lupa__x:hover,.lupa__strzalka:hover{background:rgba(255,255,255,.28)}

/* ---------- kalendarz ---------- */
.kal-panel{display:grid; grid-template-columns:1fr 320px; gap:32px; margin-top:38px; align-items:start}
@media (max-width:900px){ .kal-panel{grid-template-columns:1fr} }
.kal-glowa{display:flex; align-items:center; gap:14px; margin-bottom:18px}
.kal-glowa strong{font-family:var(--serif); font-size:1.15rem; font-weight:600; margin-inline:auto}
.kal-nav{background:var(--karta); border:1px solid var(--linia); width:40px; height:40px; border-radius:50%; cursor:pointer;
  font-size:1.1rem; color:var(--tekst); display:grid; place-items:center}
.kal-nav:hover:not([disabled]){border-color:var(--woda); color:var(--woda)}
.miesiace{display:grid; grid-template-columns:1fr 1fr; gap:34px}
@media (max-width:700px){ .miesiace{grid-template-columns:1fr} }
.miesiac h4{margin:0 0 12px; font:600 .95rem/1 var(--sans); color:var(--tekst-cichy)}
.dni-tyg,.siatka{display:grid; grid-template-columns:repeat(7,1fr); gap:4px}
.dni-tyg span{text-align:center; font-size:.72rem; color:var(--tekst-cichy); padding-bottom:6px}
.dzien{
  all:unset; text-align:center; aspect-ratio:1; display:grid; place-items:center; font-size:.9rem;
  border-radius:var(--r-s); cursor:pointer; position:relative; color:var(--tekst);
}
.dzien.pusty{cursor:default}
.dzien.wolny:hover{background:var(--tafla)}
.dzien.zajety{color:var(--tekst-cichy); cursor:not-allowed; text-decoration:line-through; opacity:.55; background:repeating-linear-gradient(45deg,transparent,transparent 3px,var(--linia) 3px,var(--linia) 4px)}
.dzien.przeszlosc{color:var(--tekst-cichy); opacity:.35; cursor:not-allowed}
.dzien.zakres{background:var(--tafla); border-radius:0}
.dzien.krance{background:var(--woda); color:#fff; font-weight:700}
.dzien.start{border-radius:var(--r-s) 0 0 var(--r-s)}
.dzien.koniec{border-radius:0 var(--r-s) var(--r-s) 0}
.dzien.start.koniec{border-radius:var(--r-s)}
.dzien.dzis::after{content:""; position:absolute; bottom:5px; width:4px; height:4px; border-radius:50%; background:var(--slonce)}
.legenda{display:flex; flex-wrap:wrap; gap:18px; margin-top:22px; font-size:.85rem; color:var(--tekst-cichy)}
.legenda i{display:inline-block; width:14px; height:14px; border-radius:4px; vertical-align:-2px; margin-right:7px}
.l-wolny{border:1px solid var(--linia); background:var(--karta)}
.l-zajety{background:repeating-linear-gradient(45deg,var(--tlo-2),var(--tlo-2) 3px,var(--linia) 3px,var(--linia) 4px)}
.l-wybor{background:var(--woda)}

.podsum{background:var(--karta); border:1px solid var(--linia); border-radius:var(--r-l); padding:26px; box-shadow:var(--cien); position:sticky; top:88px}
.podsum h3{margin-bottom:4px}
.podsum__pusto{color:var(--tekst-cichy); font-size:.95rem}
.wiersz{display:flex; justify-content:space-between; gap:12px; padding:11px 0; border-bottom:1px solid var(--linia); font-size:.95rem}
.wiersz:last-of-type{border-bottom:0}
.wiersz b{font-weight:600}
.suma{display:flex; justify-content:space-between; align-items:baseline; margin-top:14px; padding-top:16px; border-top:2px solid var(--atrament)}
:root[data-theme="dark"] .suma{border-top-color:var(--woda)}
.suma strong{font-family:var(--serif); font-size:1.65rem; font-weight:600}
.podsum .btn{width:100%; margin-top:18px}
.drobne{font-size:.79rem; color:var(--tekst-cichy); margin-top:14px; line-height:1.45}
.blad{color:#b23b2e; font-size:.88rem; margin-top:10px}
:root[data-theme="dark"] .blad{color:#f0937f}

/* ---------- cennik ---------- */
.cennik{width:100%; border-collapse:collapse; margin-top:30px; font-size:.97rem}
.cennik th,.cennik td{text-align:left; padding:15px 14px; border-bottom:1px solid var(--linia)}
.cennik th{font:600 .82rem/1 var(--sans); color:var(--tekst-cichy)}
.cennik td:last-child,.cennik th:last-child{text-align:right; white-space:nowrap}
.cennik tr.teraz{background:var(--tafla)}

/* ---------- kroki ---------- */
.kroki{display:grid; grid-template-columns:repeat(3,1fr); gap:26px; margin-top:36px; counter-reset:k}
@media (max-width:760px){ .kroki{grid-template-columns:1fr} }
.krok{counter-increment:k; padding-top:18px; border-top:2px solid var(--atrament)}
:root[data-theme="dark"] .krok{border-top-color:var(--woda)}
.krok::before{content:counter(k); font-family:var(--serif); font-size:1rem; color:var(--slonce); font-weight:600}
.krok h3{margin:6px 0 8px}
.krok p{font-size:.95rem; color:var(--tekst-cichy); margin:0}

/* ---------- okolica ---------- */
.okolica{list-style:none; padding:0; margin:30px 0 0}
.okolica li{display:flex; gap:18px; align-items:baseline; padding:14px 0; border-bottom:1px solid var(--linia)}
.okolica .km{font-family:var(--serif); font-size:1.15rem; color:var(--woda); min-width:74px; font-weight:600}
.okolica small{display:block; color:var(--tekst-cichy); font-size:.88rem}

/* ---------- FAQ ---------- */
.faq{margin-top:30px; max-width:78ch}
.faq details{border-bottom:1px solid var(--linia)}
.faq summary{cursor:pointer; padding:20px 40px 20px 0; position:relative; font-weight:600; list-style:none; font-size:1.03rem}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+"; position:absolute; right:6px; top:17px; font-size:1.5rem; font-weight:400; color:var(--woda); line-height:1}
.faq details[open] summary::after{content:"–"}
.faq details p{margin:0 0 20px; color:var(--tekst-cichy); max-width:66ch}

/* ---------- formularz ---------- */
.formularz{display:grid; gap:16px}
.pole{display:grid; gap:6px}
.pole label{font-size:.86rem; font-weight:600}
.pole input,.pole textarea,.pole select{
  font:400 1rem/1.4 var(--sans); padding:13px 14px; border:1px solid var(--linia);
  border-radius:var(--r-m); background:var(--karta); color:var(--tekst); width:100%;
}
.pole input:focus,.pole textarea:focus,.pole select:focus{border-color:var(--woda); outline:none; box-shadow:0 0 0 3px color-mix(in srgb, var(--woda) 22%, transparent)}
.para{display:grid; grid-template-columns:1fr 1fr; gap:16px}
@media (max-width:560px){ .para{grid-template-columns:1fr} }
.akcje{display:flex; flex-wrap:wrap; gap:12px; margin-top:6px}
.komunikat{font-size:.9rem; color:var(--woda); min-height:1.2em}

/* ---------- kontakt ---------- */
.kontakt-karty{display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:14px; margin-top:34px}
.kkarta{background:var(--karta); border:1px solid var(--linia); border-radius:var(--r-m); padding:20px; text-decoration:none; display:block; transition:.18s}
.kkarta:hover{border-color:var(--woda); transform:translateY(-2px)}
.kkarta span{display:block; font-size:.8rem; color:var(--tekst-cichy); margin-bottom:5px}
.kkarta b{font-family:var(--serif); font-size:1.1rem; font-weight:600; word-break:break-word}

/* ---------- stopka ---------- */
.stopka{background:var(--atrament); color:#cfe0dc; padding-block:52px 34px; font-size:.9rem}
:root[data-theme="dark"] .stopka{background:#061418}
.stopka a{color:var(--piasek)}
.stopka__in{max-width:var(--max); margin-inline:auto; padding-inline:22px; display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:34px}
@media (max-width:760px){ .stopka__in{grid-template-columns:1fr} }
.stopka h4{font-family:var(--serif); font-size:1.05rem; margin:0 0 12px; color:#fff; font-weight:600}
.stopka ul{list-style:none; padding:0; margin:0; display:grid; gap:8px}
.stopka .uwaga{border:1px solid rgba(255,255,255,.2); border-radius:var(--r-m); padding:14px; font-size:.82rem; margin-top:18px; color:#e9dfc6}
.copy{max-width:var(--max); margin:34px auto 0; padding:18px 22px 0; border-top:1px solid rgba(255,255,255,.15); font-size:.8rem; opacity:.7}

.mobilny-pas{position:fixed; left:0; right:0; bottom:0; z-index:70; display:none; gap:8px; padding:10px 14px calc(10px + env(safe-area-inset-bottom));
  background:var(--karta); border-top:1px solid var(--linia)}
.mobilny-pas .btn{flex:1; padding:13px 10px}
@media (max-width:640px){ .mobilny-pas{display:flex} body{padding-bottom:74px} }

/* ---------- przełącznik języka ---------- */
.jezyk{
  font:700 .82rem/1 var(--sans); letter-spacing:.06em; text-decoration:none;
  color:var(--tekst-cichy); border:1px solid var(--linia); border-radius:999px;
  padding:9px 13px; transition:.18s;
}
.jezyk:hover{border-color:var(--woda); color:var(--woda)}
@media (max-width:420px){ .pasek__in{gap:12px} .marka{font-size:1rem} }

/* ================= PRZEBUDOWA: nagłówek, zaufanie, CTA ================= */
.hero__param{list-style:none; display:flex; flex-wrap:wrap; gap:10px; padding:0; margin:22px 0 0}
.hero__param li{
  font:600 .88rem/1 var(--sans); color:#fdfcf8; padding:9px 14px; border-radius:999px;
  background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.28); backdrop-filter:blur(4px);
}
.hero__cena{margin:20px 0 0; font-size:.95rem; color:var(--piasek)}
.hero__cena span{font-family:var(--serif); font-size:1.3rem; color:#fff; font-weight:600}

.oceny{background:var(--atrament); color:#dfeae6; padding-block:22px}
:root[data-theme="dark"] .oceny{background:#061418}
.oceny__in{display:flex; align-items:center; gap:28px; flex-wrap:wrap}
.ocena{display:flex; align-items:baseline; gap:8px; white-space:nowrap}
.ocena b{font-family:var(--serif); font-size:1.5rem; font-weight:600; color:var(--slonce)}
.ocena span{font-size:.85rem; opacity:.85}
.oceny__uwaga{margin:0; flex:1 1 320px; font-size:.82rem; line-height:1.5; opacity:.8; border-left:1px solid rgba(255,255,255,.25); padding-left:22px}
@media (max-width:720px){ .oceny__uwaga{border-left:0; padding-left:0; border-top:1px solid rgba(255,255,255,.2); padding-top:14px} }

.sekcja--waska{padding-block:clamp(40px,6vw,68px)}
.opinie{display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:20px; margin-top:28px}
.opinie blockquote{margin:0; background:var(--karta); border:1px solid var(--linia); border-radius:var(--r-m); padding:22px}
.opinie p{font-family:var(--serif); font-size:1.05rem; line-height:1.5; margin:0 0 14px}
.opinie cite{font-style:normal; font-size:.8rem; color:var(--tekst-cichy)}

.cta-pas{
  margin-top:38px; padding:26px; border-radius:var(--r-l); background:var(--tafla);
  display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap;
}
.cta-pas p{margin:0; font-family:var(--serif); font-size:1.2rem}
.cta-pas--waski{background:transparent; padding:0; margin-top:22px}

.grupy{display:grid; gap:24px; margin-top:24px}
.grupa h4{margin:0 0 8px; font:600 .8rem/1 var(--sans); letter-spacing:.08em; text-transform:uppercase; color:var(--woda)}
.grupa ul{list-style:none; margin:0; padding:0}
.grupa li{padding:7px 0 7px 20px; position:relative; font-size:.96rem; border-bottom:1px solid var(--linia)}
.grupa li::before{content:"—"; position:absolute; left:0; color:var(--slonce)}

.cennik-uwagi{list-style:none; margin:24px 0 0; padding:0; display:grid; gap:12px}
.cennik-uwagi li{font-size:.92rem; line-height:1.5; padding-left:20px; position:relative; color:var(--tekst-cichy)}
.cennik-uwagi li::before{content:"›"; position:absolute; left:0; color:var(--slonce); font-weight:700}
.cennik-uwagi b{color:var(--tekst)}

.btn--duzy{width:100%; padding:18px 24px; font-size:1.02rem}
.wiecej summary{cursor:pointer; font-size:.9rem; color:var(--woda); padding:10px 0; list-style:none}
.wiecej summary::-webkit-details-marker{display:none}
.wiecej summary::before{content:"+ "; font-weight:700}
.wiecej[open] summary::before{content:"– "}

.faq details.schowane{display:none}
.faq-wiecej{margin-top:22px}

/* ---------- większe strefy klikalne na telefonie ---------- */
@media (max-width:640px){
  .btn{padding:16px 22px; min-height:48px}
  .btn--maly{padding:12px 16px; min-height:44px}
  .nawi a{padding-block:12px}
  .faq summary{padding-block:22px; min-height:48px}
  .dzien{font-size:.95rem}
  .kal-nav{width:48px; height:48px}
  .pole input,.pole textarea,.pole select{padding:15px 14px; min-height:50px; font-size:16px}
  .kkarta{padding:18px; min-height:60px}
  .galeria{gap:8px}
  .wstep{font-size:1rem}
  .cta-pas{padding:20px; text-align:center; justify-content:center}
  .cta-pas p{font-size:1.08rem}
  .cta-pas .btn{width:100%}
}

/* ocena Google jako klikalny element paska zaufania */
.ocena--link{text-decoration:none; border-bottom:1px solid transparent; padding-bottom:2px}
.ocena--link:hover{border-bottom-color:var(--slonce)}

/* opinie gości */
.gwiazdki{display:block; color:var(--slonce); font-size:.95rem; letter-spacing:.12em; margin-bottom:10px; font-weight:700}
.opinie__cta{margin:26px 0 0; text-align:center}
.opinie__cta a{font-size:.92rem; color:var(--woda); text-underline-offset:4px}

/* Audyt 2026-09: fotografia, zwarta galeria i czytelna rezerwacja. */
[hidden]{display:none!important}
.skip-link{position:fixed;top:8px;left:8px;z-index:200;transform:translateY(-160%);background:var(--karta);padding:12px 18px}
.skip-link:focus{transform:none}
main{display:block}
.hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:stretch;min-height:0;max-width:1440px;margin:auto;background:var(--atrament);overflow:visible}
.hero__photo{grid-column:2;grid-row:1;min-width:0;position:relative}
.hero__photo img{width:100%;height:100%;position:absolute;inset:0;object-fit:cover;object-position:50% 50%}
.hero__tresc{grid-column:1;grid-row:1;padding:64px clamp(24px,5vw,72px);align-self:center;color:#fdfcf8}
.hero h1{font-size:clamp(2.5rem,4.4vw,3.75rem);line-height:1.1;max-width:15ch;text-shadow:none}
.hero__lokal{font-size:.875rem;letter-spacing:.025em;margin-bottom:18px;color:#e6dfcc}
.hero__lead{font-size:1.0625rem;line-height:1.6;margin-top:22px;max-width:45ch;color:#e5ecea}
.hero__cta{gap:10px;margin-top:24px}
.hero__param{gap:8px;margin-top:20px}
.hero__param li{font-size:.875rem;line-height:1.3;padding:8px 10px}
.hero__cena{color:#eee7d7}
.hero .btn--glowny{background:#e5c580;color:#102f35}
.hero .btn--glowny:hover{background:#f0d69f;filter:none}
.oceny__in{justify-content:space-between;gap:20px}
.oceny__uwaga{flex:0 1 290px;font-size:.875rem;opacity:1;color:#dce7e3}
.ocena b span{font:inherit;opacity:1}
.fakty{max-width:1440px;margin:auto;grid-template-columns:repeat(4,minmax(0,1fr))}
.fakt{padding:22px}
.fakt b{font-size:1.45rem}
.fakt span{font-size:.9375rem}
.galeria{grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:clamp(140px,16vw,205px);gap:14px}
.galeria button,.galeria button:nth-child(1){aspect-ratio:auto;height:100%;min-width:0;min-height:0}
.galeria button:focus-visible,.dzien:focus-visible{outline:3px solid var(--woda);outline-offset:3px;z-index:1}
.galeria button:nth-child(1){grid-column:span 2;grid-row:span 2}
.galeria img{height:100%;width:100%;object-fit:cover;transition:transform .25s}
.galeria button:hover img{transform:scale(1.025)}
.galeria__podpis{position:absolute;inset:auto 0 0;padding:30px 14px 12px;color:#fff;font-size:.875rem;line-height:1.4;background:linear-gradient(transparent,rgba(6,24,28,.9))}
.galeria-wiecej{display:flex;margin:24px auto 0;min-height:48px}
.drobne{font-size:.9375rem;line-height:1.55}
.pole label,.kkarta span,.grupa h4,.opinie cite{font-size:.875rem;line-height:1.5}
.lozka{list-style:none;padding:0;margin:20px 0}
.lozka li{display:grid;grid-template-columns:110px 1fr;gap:14px;padding:14px 0;border-bottom:1px solid var(--linia);font-size:1rem}
.lozka b{font-weight:600}
.lozka span{color:var(--tekst-cichy)}
.bezpieczenstwo{margin-top:24px;border:1px solid var(--linia);border-radius:12px;padding:16px;font-size:.9375rem}
.bezpieczenstwo summary{cursor:pointer;font-weight:600;min-height:28px}
.bezpieczenstwo p{margin:12px 0 0}
.kal-panel{grid-template-columns:minmax(0,1fr) 330px;gap:28px}
.miesiace{gap:20px;min-width:0}
.kal-nav{width:44px;height:44px;flex-shrink:0}
.dzien{min-height:44px;font-size:.9375rem}
.dni-tyg span{font-size:.875rem}
.dzien.tylko-wyjazd{background:linear-gradient(135deg,var(--tafla) 50%,var(--tlo-2) 50%);box-shadow:inset 0 0 0 1px var(--woda);color:var(--tekst);cursor:pointer}
.dzien.tylko-wyjazd:hover{background:var(--tafla)}
.dzien.krance{color:var(--btn-tekst)}
.podsum{padding:22px;scroll-margin-top:12px}
.podsum .drobne{font-size:.875rem}
.podsum__pusto{margin-top:16px}
.wiersz{line-height:1.5;font-size:.9375rem}
.wiersz b{text-align:right}
.formularz-podsum{padding:20px;border:1px solid var(--linia);border-radius:14px;background:var(--tlo-2)}
.formularz-podsum h3{margin-bottom:10px}
.formularz-podsum p:last-child:empty{display:none}
.formularz-podsum .drobne:last-child{margin-bottom:0}
.form-instrukcja{margin:0}
.formularz-wycena{border:1px solid var(--linia);border-radius:14px;background:var(--tlo-2)}
.formularz-wycena>summary{padding:16px;cursor:pointer;min-height:48px}
.formularz-wycena>summary strong{font-size:1rem}
.formularz-wycena>summary span{display:block;margin-top:4px;color:var(--tekst-cichy);font-size:.875rem}
.formularz-wycena .formularz-podsum{border:0;background:transparent;padding-top:0}
.formularz:focus{outline:none}
@media(min-width:701px){.akcje .kontakt-sms{display:none}}
.formularz .drobne{margin-top:0}
.pole,.para>*{min-width:0}
.pole input,.pole select{min-width:0;max-width:100%}
.komunikat:empty{display:none}
.komunikat{padding:14px;border-left:3px solid var(--woda);background:var(--tafla);font-size:1rem}
.blad{font-size:.9375rem;line-height:1.5}
.lupa-otwarta{overflow:hidden}
.lupa-otwarta .mobilny-pas,.edycja-formularza .mobilny-pas{display:none}
.lupa .kadr{aspect-ratio:auto;height:min(76vh,760px);background:transparent}
.lupa figure{max-width:1100px}
.lupa__strzalka{top:auto;bottom:18px;transform:none}
.lupa__strzalka.lewo{left:calc(50% - 65px)}
.lupa__strzalka.prawo{right:calc(50% - 65px)}
.lupa{padding:65px 20px 85px}
.jezyk{min-height:44px;min-width:44px;display:inline-flex;align-items:center;justify-content:center;margin-left:auto}
.nawi+.jezyk{margin-left:0}
@media(max-width:1100px){.pasek__in{gap:16px}.nawi{gap:14px}.kal-panel{grid-template-columns:minmax(0,1fr) 300px;gap:20px}.siatka,.dni-tyg{gap:2px}}
@media(max-width:900px){.kal-panel{grid-template-columns:minmax(0,1fr)}.podsum{position:static}.pasek__in>.jezyk{margin-left:auto}.hero__tresc{padding:40px 24px}.hero h1{font-size:2.8rem}.hero__photo img{object-position:55% center}}
@media(max-width:700px){
 .hero{grid-template-columns:minmax(0,1fr)}
 .hero__photo{grid-column:1;grid-row:1;aspect-ratio:16/10}
 .hero__tresc{grid-column:1;grid-row:2;padding:28px 20px 34px}
 .hero h1{font-size:clamp(2.2rem,8vw,3rem);max-width:20ch}
 .hero__lokal{margin-bottom:14px}
 .hero__lead{margin-top:16px}
 .hero__param{margin-top:16px}
 .hero__cta{margin-top:20px}
 .hero__cta .btn{flex:1 1 220px}
 .oceny__in{gap:16px;justify-content:flex-start}
 .oceny__uwaga{flex-basis:100%;padding:12px 0 0;border-left:0;border-top:1px solid #ffffff35}
 .fakty{grid-template-columns:repeat(2,minmax(0,1fr))}
 .fakt{padding:20px 16px}
 .galeria{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:clamp(140px,30vw,210px);gap:10px}
 .galeria button:nth-child(1){grid-column:span 2;grid-row:span 2}
 .owijka{padding-inline:18px}
 .miesiace{grid-template-columns:1fr}
 .siatka,.dni-tyg{gap:2px}
 .dzien{aspect-ratio:auto;height:44px}
 .kal-glowa strong{text-align:center;font-size:1.0625rem}
 .cennik td,.cennik th{padding:12px 6px;font-size:.875rem;overflow-wrap:anywhere}
 .lozka li{grid-template-columns:90px 1fr}
}
@media(max-width:560px){.pasek__in{height:auto;min-height:64px;flex-wrap:wrap;padding:12px 16px;gap:10px}.pasek__in>.btn{display:none}.pasek__in .marka{font-size:1.1rem}.hero__photo{aspect-ratio:16/10}.ocena{gap:5px}.ocena b{font-size:1.35rem}.ocena span{font-size:.875rem}.formularz-podsum{padding:16px}.wiersz{gap:10px}.sekcja{padding-block:56px}.kontakt-karty{grid-template-columns:minmax(0,1fr)}}
@media(prefers-reduced-motion:reduce){.hero__tresc>*{animation:none!important}.galeria img{transition:none}}

.l-wyjazd{background:linear-gradient(135deg,var(--tafla) 50%,var(--tlo-2) 50%);border:1px solid var(--woda)}

/* ==================================================================
   Poprawki 2026-09: kadrowanie zdjęcia głównego, rozdzielona wycena,
   komunikaty przy polach, wyraźny drugi przycisk kontaktu.
   ================================================================== */

/* Zdjęcie główne: osobne kadrowanie dla dużego ekranu i telefonu.
   Zawsze object-fit:cover, więc proporcje zdjęcia się nie zmieniają. */
.hero__photo img{object-position:50% 58%}

/* pasek ocen */
.oceny__data{display:block;margin-top:6px;font-size:.8125rem;opacity:.85}

/* --- wycena: koszt pobytu osobno, kaucja osobno --- */
.wiersz--cichy{color:var(--tekst-cichy);font-size:.875rem;padding-top:2px}
.wiersz--cichy b{font-weight:600}
.suma--uzgodnienie strong{font-size:1.25rem;line-height:1.3}
.kaucja-blok{margin-top:14px;padding-top:14px;border-top:1px solid var(--linia)}
.kaucja-blok .wiersz{font-size:.9375rem}
.kaucja-blok .drobne{margin:4px 0 0;font-size:.8125rem}
.uwaga-goscie{margin-top:14px;padding:12px 14px;border-left:3px solid var(--slonce);
  background:var(--tafla);border-radius:0 8px 8px 0}

/* --- komunikaty przy polach --- */
.blad--pole{margin:-6px 0 4px;padding:10px 12px;border-left:3px solid var(--blad,#b03a2e);
  background:rgba(178,59,46,.07);background:color-mix(in srgb, var(--blad) 8%, transparent);border-radius:0 8px 8px 0}
.pole input[aria-invalid="true"],.pole select[aria-invalid="true"]{border-color:var(--blad,#b03a2e)}
.komunikat--blad{border-left-color:var(--blad,#b03a2e)}
.komunikat--sukces{border-left-color:var(--woda)}
.komunikat a{text-decoration:underline;text-underline-offset:3px}

/* --- przyciski akcji: poczta i Messenger obok siebie --- */
.akcje{display:flex;flex-wrap:wrap;gap:12px;margin-top:8px}
.akcje .btn{flex:1 1 240px;justify-content:center;text-align:center}
.btn--tekst{background:none;border:0;padding:10px 0;color:var(--woda);
  text-decoration:underline;text-underline-offset:4px;font-size:.9375rem;min-height:44px;
  justify-content:flex-start;cursor:pointer}
.btn--tekst:hover{color:var(--atrament)}

/* --- dolny pasek nie zasłania treści ani błędów --- */
@media(max-width:640px){
  body{padding-bottom:calc(78px + env(safe-area-inset-bottom))}
  .formularz .blad--pole,.komunikat,.formularz-podsum{scroll-margin-bottom:96px}
  #kontakt{scroll-margin-bottom:96px}
}

/* --- kadrowanie na telefonie: mniej nieba, więcej domku i ogrodu --- */
@media(max-width:700px){
  .hero__photo{aspect-ratio:16/10}
  .hero__photo img{object-position:50% 62%}
  .akcje .btn{flex:1 1 100%}
}
@media(max-width:430px){
  .hero__photo{aspect-ratio:3/2}
  .hero__photo img{object-position:50% 66%}
}

/* kolor komunikatów o błędzie — ten sam co dotychczas w .blad */
:root{--blad:#b23b2e}
@media (prefers-color-scheme: dark){ :root{--blad:#f0937f} }
:root[data-theme="dark"]{--blad:#f0937f}

/* przycisk w nagłówku: wygodny do kliknięcia także palcem */
.btn--maly{min-height:40px}

/* Komunikaty i pola formularza nie mogą chować się pod przypiętym nagłówkiem
   ani pod dolnym paskiem — stąd zapas z obu stron przy przewijaniu do błędu. */
.formularz .blad--pole,.formularz .para input,.formularz .para select,.komunikat,.formularz-podsum{scroll-margin-top:96px}
@media (max-width:640px){
  .formularz .para input,.formularz .para select{scroll-margin-bottom:96px}
}

/* Kwoty nie mogą łamać się w połowie („1 000” i „zł” w osobnych wierszach),
   a przed blokiem kaucji wystarczy jedna kreska, nie dwie. */
.kwota,.suma strong{white-space:nowrap}
.wiersz--cichy{border-bottom:0}
.kaucja-blok .wiersz{align-items:baseline}

/* Zdjęcie ogrodu i oznaczenia indywidualnej wyceny. */
.hero__photo img{object-position:50% 48%}
@media(max-width:900px){.hero__photo{aspect-ratio:4/5}.hero__photo img{object-position:50% 50%}}
.dzien.indywidualna::after{content:"";display:block;width:6px;height:6px;border-radius:50%;background:#e8bd68;position:absolute;bottom:4px;left:calc(50% - 3px)}
.dzien{position:relative}.legenda .l-indywidualna{background:#e8bd68;border-radius:50%}
.warunki-rezerwacji{margin:24px 0}.warunki-rezerwacji h3{margin:18px 0 8px}.warunki-rezerwacji p{line-height:1.6}

/* Faza 2: wyłącznie wygląd i nawigacja. Logika rezerwacji bez zmian. */
:root{color-scheme:light;--kontur:#748a88;--fokus:#95651b;--blad:#a83429}
@media(prefers-color-scheme: dark){
  :root:not([data-theme="light"]){color-scheme:dark;--kontur:#658c8f;--fokus:#f0c573;--blad:#f4a297}
}
:root[data-theme="dark"]{color-scheme:dark;--kontur:#658c8f;--fokus:#f0c573;--blad:#f4a297}
:root[data-theme="light"]{color-scheme:light;--blad:#a83429}
body{font-size:1.0625rem}
h1,h2,h3{overflow-wrap:break-word;text-wrap:balance}
.sekcja p{max-width:70ch}
.sekcja p a:not(.btn){overflow-wrap:anywhere}
.poradnik-hero>*{min-width:0}
.wstep{max-width:60ch}
.btn{line-height:1.3;min-height:44px;white-space:normal;text-align:center}
.btn--obrys,.jezyk,.kal-nav{border-color:var(--kontur)}
.btn--tekst:hover{color:var(--tekst)}
.pole input,.pole textarea,.pole select{border-color:var(--kontur)}
.pole input::placeholder,.pole textarea::placeholder{color:var(--tekst-cichy);opacity:1}
.pole label{font-size:.9375rem}
:focus-visible,.galeria button:focus-visible,.dzien:focus-visible,
.pole input:focus-visible,.pole textarea:focus-visible,.pole select:focus-visible{
  outline:3px solid var(--fokus);outline-offset:3px;box-shadow:0 0 0 2px var(--tlo)
}
.hero :focus-visible,.stopka :focus-visible,.lupa :focus-visible{outline-color:#f0c573;box-shadow:0 0 0 2px #0d2a30}
.blad,:root[data-theme="dark"] .blad,.komunikat--blad{color:var(--blad)}
.blad--pole,.komunikat--blad{background:color-mix(in srgb,var(--blad) 10%,var(--tlo));border-left-color:var(--blad)}
.suma,.krok{border-top-color:var(--woda)}
.stopka,:root[data-theme="dark"] .stopka{background:#092125}
.stopka a{color:#eadfc9;text-underline-offset:4px;overflow-wrap:anywhere}
.stopka a:hover{color:#fff}
.stopka ul a{display:inline-block;padding-block:8px;min-height:44px}
.stopka ul{gap:0}
.copy{opacity:1;color:#cfe0dc;line-height:1.6}
.gwiazdki{color:var(--woda)}
.l-wolny{border-color:var(--kontur)}
.dzien.zajety{opacity:1;color:var(--tekst-cichy)}
.dzien.przeszlosc{opacity:.6}
.dzien.indywidualna::after,.legenda .l-indywidualna{background:var(--slonce);box-shadow:0 0 0 1px var(--tekst-cichy)}
.hero__photo{aspect-ratio:auto;min-width:0;width:100%;overflow:hidden;align-self:stretch}
.hero__photo img{object-position:50% 48%}
.hero__tresc{padding:clamp(32px,4vw,56px) clamp(24px,4vw,58px);min-width:0}
.hero h1{font-size:clamp(2.2rem,4.1vw,3.6rem)}
.hero__lead{max-width:46ch;margin-top:20px}
.hero__lokal{line-height:1.5}
.hero__param{margin-top:18px}
.hero__param li{border-radius:12px;backdrop-filter:none}
.hero__cta{margin-top:22px}
.pasek__in{height:auto;min-height:72px;position:relative;padding-block:10px}
.nawi a{display:inline-flex;align-items:center;min-height:44px;line-height:1.3}
.marka{line-height:1.2;white-space:normal}
.menu-mobilne{display:none}
.menu-mobilne summary{list-style:none;cursor:pointer;min-width:54px;min-height:44px;display:flex;align-items:center;justify-content:center;border:1px solid var(--kontur);border-radius:12px;padding:8px;font-size:.875rem;font-weight:600}
.menu-mobilne summary::-webkit-details-marker{display:none}
.menu-mobilne[open] summary{background:var(--tafla);border-color:var(--woda)}
.menu-mobilne nav{position:absolute;top:100%;left:12px;right:12px;background:var(--karta);border:1px solid var(--kontur);border-radius:14px;box-shadow:var(--cien);padding:12px;display:grid;grid-template-columns:1fr 1fr;gap:4px 10px;max-height:65vh;overflow-y:auto}
.menu-mobilne nav a{display:flex;align-items:center;min-height:48px;padding:10px 12px;border-radius:8px;text-decoration:none;line-height:1.4;overflow-wrap:anywhere}
.menu-mobilne nav a:hover{background:var(--tafla)}
.lupa{overflow-y:auto;padding:max(70px,calc(3em + 24px)) 20px max(92px,calc(3em + 24px))}
.lupa figure{min-height:0;max-height:100%;display:flex;flex-direction:column}
.lupa .kadr{min-height:0;flex:1 1 auto;height:min(68dvh,720px)}
.lupa figcaption{flex:none;line-height:1.5;padding-top:12px;overflow-wrap:anywhere}
.lupa__x,.lupa__strzalka{background:#23494d;border:1px solid #89aaa9;z-index:2;width:1.6em;height:1.6em;min-width:46px;min-height:46px;line-height:1;padding:0}
.lupa__strzalka.lewo{left:auto;right:calc(50% + 8px)}
.lupa__strzalka.prawo{left:calc(50% + 8px);right:auto}
.galeria__podpis{background:linear-gradient(transparent,rgba(6,24,28,.96) 40%);padding-top:32px}
.galeria button:hover img{transform:scale(1.015)}
.duo>* ,.stopka__in>*,.miesiac{min-width:0}
.para,.miesiace{grid-template-columns:repeat(2,minmax(0,1fr))}
.cennik{table-layout:fixed}
.cennik th,.cennik td{overflow-wrap:anywhere}
.cennik td:last-child,.cennik th:last-child{white-space:normal}
.wiersz{flex-wrap:wrap}
.wiersz b{margin-left:auto}
.suma{gap:12px;flex-wrap:wrap}
.suma strong{margin-left:auto}
.kal-glowa strong{line-height:1.4}
.dzien{line-height:1.4;min-height:44px;height:auto}
.legenda{gap:12px 18px;line-height:1.5}
.wiecej summary,.bezpieczenstwo summary{min-height:44px;display:flex;align-items:center;line-height:1.5}
@media(max-width:1100px){
  .nawi{display:none}.menu-mobilne{display:block;margin-left:auto}.pasek__in>.jezyk{margin-left:0}
  .hero__tresc{padding:32px 24px}
}
@media(max-width:900px){
  .hero{grid-template-columns:minmax(0,1fr)}
  .hero__tresc{grid-column:1;grid-row:1;padding:32px clamp(20px,5vw,40px)}
  .hero__photo{grid-column:1;grid-row:2;aspect-ratio:16/9;max-height:420px}
  .hero h1{font-size:clamp(2.1rem,5vw,3rem);max-width:24ch}
  .hero__lead{max-width:60ch}.hero__param{max-width:65ch}
  .kal-panel{grid-template-columns:minmax(0,1fr)}
}
@media(max-width:700px){
  .hero__tresc{padding:26px 20px 30px}
  .hero h1{font-size:2.15rem;max-width:18ch}
  .hero__lead{font-size:1rem;line-height:1.55;margin-top:16px}
  .hero__lokal{margin-bottom:12px;font-size:.875rem}
  .hero__param{gap:6px;margin-top:14px}
  .hero__param li{font-size:.875rem;padding:7px 9px}
  .hero__cta{margin-top:18px;gap:10px}
  .hero__cta .btn{flex:1 1 100%;padding:13px 18px}
  .hero__photo{aspect-ratio:4/3;max-height:360px}
  .hero__photo img{object-position:50% 64%}
  .hero__cena{margin-top:14px}
  .miesiace{grid-template-columns:minmax(0,1fr)}
  .dzien{height:auto;min-height:44px}
  .galeria{grid-auto-rows:minmax(180px,auto)}
  .galeria button:nth-child(1){grid-row:span 1;min-height:260px}
  .galeria__podpis{font-size:.9375rem;padding-inline:10px}
  .mobilny-pas .btn{min-width:0;line-height:1.3;padding:12px 8px}
}
@media(max-width:560px){
  .pasek__in{padding:10px 14px;gap:8px;min-height:64px;flex-wrap:nowrap}
  .pasek__in .marka{font-size:1rem;flex:1;max-width:200px}
  .menu-mobilne{margin-left:auto}
  .jezyk{padding:8px;flex-shrink:0}
  .para{grid-template-columns:minmax(0,1fr)}
  .fakty{grid-template-columns:repeat(2,minmax(0,1fr))}
  .fakt b{font-size:1.25rem;line-height:1.25}
  .pole input,.pole textarea,.pole select{font-size:1rem}
}

/* Tekst powiększony: elastyczne kolumny, bez ucinania podpisów. */
.fakty{grid-template-columns:repeat(auto-fit,minmax(min(100%,10em),1fr))}
.fakt{overflow-wrap:anywhere}
.lozka li{grid-template-columns:minmax(7em,.45fr) minmax(0,1fr)}
.lozka b,.lozka span{overflow-wrap:anywhere}
.okolica .km{flex:0 0 auto;min-width:4.5em}
.okolica li>div{min-width:0;overflow-wrap:anywhere}
.ocena{white-space:normal;flex-wrap:wrap;line-height:1.4}
.ocena>span{min-width:0}
.dni-tyg,.siatka{grid-template-columns:repeat(7,minmax(0,1fr))}
.dni-tyg span{overflow-wrap:anywhere;line-height:1.4}
.mobilny-pas{flex-wrap:wrap}
.mobilny-pas .btn{flex:1 1 8em}
.menu-mobilne nav{grid-template-columns:repeat(auto-fit,minmax(min(100%,7em),1fr))}
.galeria{grid-auto-rows:minmax(210px,auto)}
.galeria button{display:grid;grid-template-rows:minmax(140px,1fr) auto;background:var(--karta);border:1px solid var(--linia)}
.galeria img{min-height:0;grid-row:1;contain:size;aspect-ratio:auto}
.galeria__podpis{position:static;background:var(--karta);color:var(--tekst);padding:12px;font-size:.9375rem;overflow-wrap:anywhere}
html{scroll-padding-top:calc(var(--wysokosc-naglowka,76px) + 12px);scroll-padding-bottom:calc(var(--wysokosc-paska,0px) + 16px)}
@media(max-width:640px){body{padding-bottom:max(90px,var(--wysokosc-paska,90px))}}
@media(max-width:560px){
  .lozka li{grid-template-columns:minmax(0,1fr);gap:4px}
  .okolica li{flex-wrap:wrap;gap:6px}
}

/* Korekta pierwszego ekranu telefonu po ocenie na urządzeniu. */
.hero__lead--telefon{display:none}
@media(max-width:700px){
  .hero__photo{grid-row:1;display:block;height:clamp(180px,52vw,220px);max-height:none;aspect-ratio:auto}
  .hero__photo img{object-position:50% 42%}
  .hero__tresc{grid-row:2;padding:20px 20px 24px}
  .hero__lokal{font-size:.8125rem;margin-bottom:10px}
  .hero h1{font-size:1.875rem;line-height:1.12;max-width:22ch}
  .hero__lead:not(.hero__lead--telefon),.hero__detal{display:none}
  .hero__lead--telefon{display:block;font-size:1rem;line-height:1.45;margin-top:10px}
  .hero__param{margin-top:12px;gap:6px}
  .hero__param li{font-size:.8125rem;padding:6px 6px}
  .hero__cta{margin-top:16px}
  .hero__cta .btn--obrys{display:none}
  .hero__cta .btn--glowny{padding:12px 16px}
  .hero__cena{font-size:.875rem;margin-top:12px}
}

/* 2026-10: pas „Rezerwując bezpośrednio”, film, trzy przyciski w dolnym pasku. */
.bezposrednio{background:var(--tafla);padding-block:24px}
.bezposrednio h2{font-size:1.3rem;margin-bottom:12px}
.bezposrednio ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.bezposrednio li{display:grid;gap:4px;align-content:start}
.bezposrednio li b{font-weight:600}
.bezposrednio li span{color:var(--tekst-cichy);font-size:.9375rem;line-height:1.5}
@media(min-width:760px){.bezposrednio ul{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}}
.film{margin:28px 0 0}
.film video{display:block;width:100%;height:auto;aspect-ratio:16/9;border-radius:var(--r-m);background:#08191d}
.film figcaption{margin-top:10px;font-size:.9375rem;color:var(--tekst-cichy)}
.mobilny-pas{flex-wrap:nowrap;gap:6px}
.mobilny-pas .btn{flex:1 1 0;min-width:0;padding-inline:6px;font-size:.9375rem}
@media(min-width:760px){
  .bezposrednio{text-align:center}
  .bezposrednio h2{margin-bottom:16px}
  .bezposrednio ul{gap:32px}
}

/* Telefon: drugi przycisk „Obejrzyj domek” znów widoczny pod głównym. */
@media(max-width:700px){
  .hero__cta .btn--obrys{display:flex;padding:11px 16px}
}

.stopka-portale{margin:12px 0 0;line-height:1.6}

/* Link pod opiniami: wyśrodkowany względem kart, nie ograniczony szerokością akapitu. */
.sekcja .opinie__cta{max-width:none}

/* Wybór liczby osób w karcie terminu. */
.wybor-gosci{display:grid;grid-template-columns:auto minmax(0,1.4fr) auto minmax(0,1fr);align-items:center;gap:8px 8px}
.wybor-gosci label{font-size:.9375rem;color:var(--tekst)}
.wybor-gosci select{font:inherit;padding:8px 6px;min-height:44px;border:1px solid var(--kontur);border-radius:10px;background:var(--karta);color:var(--tekst);min-width:0;width:100%}