/* =====================================================================
   Ignarski Nieruchomosci - style motywu (przeniesione 1:1 z makiety).
   1.3.0: paleta ciemna (grafit z nuta zieleni) + zielen elewacji jako jedyny akcent,
   wg makiety Osiedla Zacisze. Ksztalty: przyciski/chipy = pill, karty = 14px,
   pola formularza = 10px. Rzuty mieszkan na jasnym "papierze" (--plan).
   Adaptacje WP: markup CF7 (floating labels przez :focus-within + .filled),
   klasy body WordPressa, offset admin-bara.
   ===================================================================== */

:root {
  /* 1.3.0: ciemna paleta z zielenia elewacji (makieta Osiedla Zacisze). Jeden akcent: zielen.
     Tokeny semantyczne zostaly pod starymi nazwami (--white = karta, --wood = akcent),
     zeby nie przepisywac wszystkich regul; nowe reguly uzywaja --accent/--surface-2. */
  --bg: #111613;            /* tlo strony */
  --paper: #161D18;         /* sekcje z odcieniem */
  --white: #18201B;         /* karty, panele, chipy (dawna biel) */
  --surface-2: #1F2922;     /* pola formularza, naglowki tabel, kafle */
  --plan: #FFFFFF;          /* biel pod rzutami - taka sama jak tlo PNG z rzutami, zeby nie bylo widac prostokata */
  --ink: #E8EEE5;
  --ink-strong: #F4F7F1;
  --muted: #A1AEA4;
  --line: #2D3A31;
  --line-strong: #3E4F43;
  --graphite: #0D110E;      /* najciemniejszy blok: kontakt + stopka, lightbox */
  --graphite-2: #141A16;
  --on-dark: #EEF3EA;
  --on-dark-muted: #9FB0A3;
  --accent: #9CC95A;        /* zielen elewacji osiedla */
  --accent-strong: #B4DB78;
  --accent-ink: #10160F;    /* tekst na zieleni */
  --accent-soft: #25331C;
  --wood: var(--accent);
  --wood-strong: var(--accent);
  --wood-tint: var(--accent-soft);
  --ok-text: #BFE08F;
  --ok-bg: #1F3A1C;
  --ok-line: #2F5226;
  --busy-text: #F0B9A6;
  --busy-bg: #3A2420;
  --busy-line: #55332C;
  --hold-text: #E8C77A;
  --hold-bg: #3A2F17;
  --hold-line: #5A4A22;
  --garden: #6F9F5F;
  --garden-soft: #3B5A2E;
  --garden-ink: #DCE8D3;
  --r-card: 14px;
  --r-input: 10px;
  --shadow-soft: 0 10px 30px rgba(0, 0, 0, 0.28);
  --shadow-lift: 0 16px 40px rgba(0, 0, 0, 0.4);
  --ease: cubic-bezier(0.16, 1, 0.3, 1);
}

* { margin: 0; padding: 0; box-sizing: border-box; }

html { scroll-behavior: smooth; color-scheme: dark; scroll-padding-top: 96px; }
html:has(body.page-template-lokalizacja) { scroll-padding-top: 136px; }

a, button { touch-action: manipulation; -webkit-tap-highlight-color: transparent; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; border-radius: 4px; }
.btn:focus-visible, .chip:focus-visible, .wpcf7-submit:focus-visible { outline-offset: 2px; border-radius: 999px; }
@media (pointer: fine) { html { overscroll-behavior: none; } }

body {
  font-family: "Outfit", "Segoe UI", system-ui, -apple-system, sans-serif;
  background: var(--bg);
  color: var(--ink);
  font-size: 16.5px;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}

img { display: block; max-width: 100%; height: auto; }
a { color: inherit; }

.wrap { max-width: 1240px; margin: 0 auto; padding: 0 24px; }

h1, h2, h3 { color: var(--ink-strong); font-weight: 600; line-height: 1.12; letter-spacing: -0.02em; text-wrap: balance; }
h1, h2 { text-wrap: balance; }
h1 { font-size: clamp(2.1rem, 4.6vw, 3.3rem); }
h2 { font-size: clamp(1.7rem, 3vw, 2.3rem); }
h3 { font-size: 1.15rem; letter-spacing: -0.01em; }

.lead { color: var(--muted); max-width: 62ch; }

.eyebrow {
  display: inline-block;
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--wood-strong);
  margin-bottom: 14px;
}

.sec { padding: 96px 0; }
.standard + .standard { border-top: 0; }
.sec-head { max-width: 640px; margin-bottom: 44px; }
.sec-head p { margin-top: 12px; }

.skip-link {
  position: fixed; left: 16px; top: -60px; z-index: 70;
  background: var(--accent); color: var(--accent-ink);
  padding: 11px 20px; border-radius: 999px; text-decoration: none; font-size: 0.92rem;
  transition: top 0.2s var(--ease);
}
.skip-link:focus-visible { top: 12px; }

/* ------- przyciski ------- */
.btn {
  display: inline-flex; align-items: center; gap: 9px;
  background: var(--accent); color: var(--accent-ink);
  border: 1px solid var(--accent);
  border-radius: 999px; padding: 13px 26px;
  font: inherit; font-size: 0.98rem; font-weight: 500;
  text-decoration: none; cursor: pointer; white-space: nowrap;
  transition: background 0.25s var(--ease), transform 0.25s var(--ease), box-shadow 0.25s var(--ease);
}
.btn:hover { background: var(--accent-strong); border-color: var(--accent-strong); transform: translateY(-1px); box-shadow: var(--shadow-soft); color: var(--accent-ink); }
.btn:active { transform: scale(0.98); }
.btn .ph { font-size: 1.1rem; }

.btn-ghost { background: transparent; color: var(--ink-strong); border-color: var(--line-strong); }
.btn-ghost:hover { background: var(--white); border-color: var(--accent); color: var(--ink-strong); }

.btn-light { background: var(--on-dark); color: var(--accent-ink); border-color: var(--on-dark); }
.btn-light:hover { background: var(--ink-strong); color: var(--accent-ink); }

.link-more {
  display: inline-flex; align-items: center; gap: 8px;
  font-weight: 500; color: var(--ink-strong);
  text-decoration: none; border-bottom: 1px solid var(--line);
  padding-bottom: 3px; transition: border-color 0.25s var(--ease), color 0.25s var(--ease);
}
.link-more:hover { color: var(--wood-strong); border-color: var(--wood); }

/* ------- nawigacja ------- */
.nav {
  position: sticky; top: 0; z-index: 40;
  background: rgba(17, 22, 19, 0.86);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--line);
}
body.admin-bar .nav { top: 32px; }
.nav-in { display: flex; align-items: center; justify-content: space-between; height: 70px; gap: 24px; }
.brand { display: flex; align-items: baseline; gap: 9px; text-decoration: none; }
.brand strong { font-size: 1.22rem; font-weight: 600; letter-spacing: -0.02em; color: var(--ink-strong); }
.brand span { font-size: 0.82rem; color: var(--muted); letter-spacing: 0.02em; }
.brand strong em { font-style: normal; color: var(--accent); }
.nav-links { display: flex; align-items: center; gap: 30px; list-style: none; }
.nav-links a { text-decoration: none; font-size: 0.96rem; color: var(--ink); transition: color 0.2s; }
.nav-links a:hover { color: var(--wood-strong); }
.nav-cta { display: flex; align-items: center; gap: 12px; }

.nav-burger {
  display: none; background: none; border: 1px solid var(--line); border-radius: 999px;
  width: 44px; height: 44px; color: var(--ink-strong); cursor: pointer;
  align-items: center; justify-content: center;
}
/* hamburger -> X: trzy kreski, srodkowa znika, skrajne skladaja sie w krzyzyk */
.nav-burger .bars {
  display: block; position: relative; width: 20px; height: 2px;
  background: currentColor; border-radius: 2px;
  transition: background 0.2s 0.12s;
}
.nav-burger .bars::before, .nav-burger .bars::after {
  content: ""; position: absolute; left: 0; width: 20px; height: 2px;
  background: currentColor; border-radius: 2px;
  transition: top 0.28s var(--ease), transform 0.28s var(--ease);
}
.nav-burger .bars::before { top: -6px; }
.nav-burger .bars::after { top: 6px; }
.nav.open .nav-burger .bars { background: transparent; transition-delay: 0s; }
.nav.open .nav-burger .bars::before { top: 0; transform: rotate(45deg); }
.nav.open .nav-burger .bars::after { top: 0; transform: rotate(-45deg); }

/* ------- podmenu podstrony ------- */
.subnav {
  position: sticky; top: 70px; z-index: 30;
  background: rgba(17, 22, 19, 0.9);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--line);
}
body.admin-bar .subnav { top: 102px; }
.subnav-in {
  display: flex; align-items: center; gap: 6px; height: 48px;
  overflow-x: auto; scrollbar-width: none;
}
.subnav-in::-webkit-scrollbar { display: none; }
.subnav a {
  font-size: 0.88rem; color: var(--muted); text-decoration: none; white-space: nowrap;
  padding: 6px 13px; border-radius: 999px; transition: color 0.2s, background 0.2s;
}
.subnav a:hover { color: var(--ink-strong); }
.subnav a.active { color: var(--ink-strong); background: var(--paper); }

/* ------- hero ------- */
.hero { padding: 44px 0 60px; overflow: clip; }
.hero-grid { display: grid; grid-template-columns: 1.02fr 0.98fr; gap: 64px; align-items: center; }
.hero-copy h1 { font-size: clamp(2rem, 3.2vw, 2.6rem); }
.hero-copy .lead { margin: 20px 0 30px; }
.hero-actions { display: flex; gap: 14px; flex-wrap: wrap; }
.hero-media img {
  width: 100%; aspect-ratio: 16 / 10; max-height: 400px;
  object-fit: cover; border-radius: var(--r-card); box-shadow: var(--shadow-lift);
}
.hero-media figcaption { margin-top: 12px; font-size: 0.88rem; color: var(--muted); }
/* hero tekstowe (bez zdjecia): jedna kolumna, wiecej luzu miedzy tytulem, opisem i przyciskami;
   sekcja pod spodem (karty lokalizacji) podchodzi blizej i robi za wizual hero */
.hero-text { padding: 64px 0 20px; }
.hero-text .hero-grid { grid-template-columns: 1fr; gap: 0; }
.hero-text .hero-copy { max-width: 860px; }
.hero-text .hero-copy h1 { font-size: clamp(2.2rem, 3.8vw, 3rem); }
.hero-text .hero-copy .lead { margin: 22px 0 0; max-width: 64ch; font-size: 1.08rem; }
.hero-text .hero-actions { margin-top: 36px; }
.hero-text + .sec { padding-top: 20px; }
.hero-text + .sec .sec-head { margin-bottom: 28px; }

/* ------- lokalizacje (bento 1 duza + 2) ------- */
.loc-grid { display: grid; grid-template-columns: 1.45fr 1fr; grid-template-rows: 1fr 1fr; gap: 20px; }
.loc-feature {
  grid-row: 1 / 3;
  position: relative; display: flex; flex-direction: column; justify-content: flex-end;
  min-height: 480px; border-radius: var(--r-card); overflow: hidden;
  text-decoration: none; color: var(--on-dark);
}
.loc-feature img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 0.7s var(--ease); }
.loc-feature:hover img { transform: scale(1.035); }
.loc-feature::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(185deg, rgba(13, 17, 14, 0) 30%, rgba(13, 17, 14, 0.58) 58%, rgba(13, 17, 14, 0.94) 86%);
}
.loc-feature-body { position: relative; z-index: 1; padding: 30px; }
.loc-feature-body h3 { color: var(--on-dark); font-size: 1.5rem; }
.loc-feature-body p { color: var(--on-dark-muted); margin: 8px 0 18px; font-size: 0.98rem; max-width: 46ch; }
.loc-feature-body .btn { background: var(--accent); color: var(--accent-ink); border-color: var(--accent); }
.loc-feature-body .btn:hover { background: var(--accent-strong); border-color: var(--accent-strong); }
.loc-card {
  border: 1px solid var(--line); border-radius: var(--r-card);
  padding: 28px; display: flex; flex-direction: column; justify-content: space-between; gap: 16px;
  background: var(--white);
}
.loc-card.alt { background: var(--paper); border-color: transparent; }
.loc-card h3 { margin-top: 10px; }
.loc-card p { color: var(--muted); font-size: 0.95rem; }
.chip-soon {
  align-self: flex-start;
  font-size: 0.8rem; font-weight: 500; letter-spacing: 0.04em;
  color: var(--muted); background: var(--bg);
  border: 1px solid var(--line); border-radius: 999px; padding: 5px 13px;
}
.loc-card.alt .chip-soon { background: var(--surface-2); }

/* ------- standard ------- */
.standard { background: var(--white); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.standard-grid { display: grid; grid-template-columns: 0.85fr 1.35fr; gap: 72px; align-items: start; }
.standard-intro { position: sticky; top: 96px; }
body.admin-bar .standard-intro { top: 128px; }
/* na podstronie lokalizacji pod menu jest jeszcze podmenu (48px): przyklejone kolumny startuja nizej */
body.page-template-lokalizacja .standard-intro,
body.page-template-lokalizacja .facts-copy,
body.page-template-lokalizacja .estate-media { top: 142px; }
body.admin-bar.page-template-lokalizacja .standard-intro,
body.admin-bar.page-template-lokalizacja .facts-copy,
body.admin-bar.page-template-lokalizacja .estate-media { top: 174px; }
.standard-intro .lead { margin-top: 14px; }
.standard-intro .btn { margin-top: 26px; }
.features { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.feature { border: 1px solid var(--line); border-radius: var(--r-card); padding: 22px; background: var(--surface-2); }
.feature .ph { font-size: 1.55rem; color: var(--wood-strong); }
.feature h3 { margin: 12px 0 6px; font-size: 1.02rem; }
.feature p { font-size: 0.9rem; color: var(--muted); line-height: 1.55; }

/* ------- o inwestycji ------- */
.about-grid { display: grid; grid-template-columns: 1.1fr 0.9fr; gap: 64px; align-items: center; }
.about-media img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--r-card); box-shadow: var(--shadow-soft); }
.about-copy h2 { margin-bottom: 16px; }
.about-copy .lead { margin-bottom: 26px; }

/* ------- ciemny blok: kontakt + stopka ------- */
.dark-block { background: var(--graphite); color: var(--on-dark); }
.contact { padding: 96px 0; }
.contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 72px; }
.contact h2 { color: var(--ink-strong); }
.contact .lead { color: var(--on-dark-muted); margin: 14px 0 34px; }
.contact-line { display: flex; align-items: center; gap: 14px; margin-bottom: 16px; text-decoration: none; color: var(--on-dark); }
.contact-line .ph { font-size: 1.25rem; color: var(--accent); }
.contact-line strong { font-size: 1.35rem; font-weight: 500; letter-spacing: 0.01em; }
.contact-line:hover strong { color: var(--accent-strong); text-decoration: underline; text-underline-offset: 4px; }
.contact-note { font-size: 0.9rem; color: var(--on-dark-muted); margin-top: 22px; max-width: 44ch; }

/* ------- formularz CF7 (markup pol w cf7-formularz.txt) ------- */
.wpcf7-form { display: grid; gap: 16px; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }

/* pole z plywajaca etykieta: label wyglada jak placeholder,
   po focusu (:focus-within) albo wpisaniu tresci (.filled z JS) zwija sie do gory */
.field { position: relative; }
.field .wpcf7-form-control-wrap { display: block; }
.field input, .field textarea {
  font: inherit; font-size: 0.98rem; color: var(--ink);
  background: var(--surface-2); border: 1px solid var(--line-strong); border-radius: var(--r-input);
  padding: 24px 15px 9px; width: 100%; display: block;
}
.field textarea { height: 145px; min-height: 145px; resize: vertical; }
.field > label {
  position: absolute; left: 16px; top: 17px;
  font-size: 0.97rem; color: #93A097; pointer-events: none;
  transform-origin: left top;
  transition: transform 0.18s var(--ease), color 0.18s var(--ease);
}
.field input:focus, .field textarea:focus { outline: 2px solid var(--wood); outline-offset: 1px; }
.field:focus-within > label, .field.filled > label {
  transform: translateY(-10px) scale(0.72);
  color: var(--wood-strong);
}
.field .wpcf7-not-valid-tip { display: block; margin-top: 6px; font-size: 0.82rem; color: #F0B9A6; }

.wpcf7-acceptance { display: block; }
.wpcf7-acceptance .wpcf7-list-item { margin: 0; }
.wpcf7-acceptance label { display: flex; gap: 11px; align-items: flex-start; font-size: 0.86rem; color: var(--on-dark-muted); cursor: pointer; }
.wpcf7-acceptance input { margin-top: 4px; accent-color: var(--wood); width: 16px; height: 16px; flex: 0 0 auto; }
.consent-wrap .wpcf7-not-valid-tip { display: block; margin-top: 6px; font-size: 0.82rem; color: #F0B9A6; }

.wpcf7-submit {
  justify-self: start;
  display: inline-flex; align-items: center;
  background: var(--accent); color: var(--accent-ink);
  border: 1px solid var(--accent); border-radius: 999px; padding: 13px 26px;
  font: inherit; font-size: 0.98rem; font-weight: 500; cursor: pointer;
  transition: background 0.25s var(--ease), transform 0.25s var(--ease);
}
.wpcf7-submit:hover { background: var(--accent-strong); border-color: var(--accent-strong); transform: translateY(-1px); }
.wpcf7-submit:active { transform: scale(0.98); }
.wpcf7 .wpcf7-spinner { margin: 0 0 0 12px; }
.wpcf7 form .wpcf7-response-output {
  margin: 4px 0 0; padding: 12px 16px; border-radius: var(--r-input);
  border: 1px solid rgba(242, 241, 238, 0.3); font-size: 0.9rem;
}
.wpcf7 form.sent .wpcf7-response-output { border-color: var(--ok-line); background: rgba(231, 240, 231, 0.12); }

/* ------- stopka ------- */
.footer { border-top: 1px solid rgba(242, 241, 238, 0.14); padding: 44px 0 36px; }
.footer-grid { display: flex; justify-content: space-between; gap: 40px; flex-wrap: wrap; }
.footer .brand strong { color: var(--ink-strong); }
.footer .brand span { color: var(--on-dark-muted); }
.footer-note { font-size: 0.9rem; color: var(--on-dark-muted); margin-top: 10px; max-width: 40ch; }
.footer-col .footer-h { display: block; font-size: 0.85rem; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--on-dark-muted); margin-bottom: 14px; }
.footer-col ul { list-style: none; display: grid; gap: 9px; }
.footer-col a { display: inline-block; padding: 3px 0; color: var(--on-dark); text-decoration: none; font-size: 0.95rem; }
.footer-legal { margin-top: 36px; max-width: 110ch; font-size: 0.8rem; line-height: 1.6; color: var(--on-dark-muted); }
.footer-col a:hover { color: var(--accent-strong); text-decoration: underline; text-underline-offset: 4px; }
.footer-col .soon { color: var(--on-dark-muted); font-size: 0.85rem; }
.footer-bottom { margin-top: 40px; padding-top: 22px; border-top: 1px solid rgba(242, 241, 238, 0.14); font-size: 0.85rem; color: var(--on-dark-muted); display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; }
.credit { display: inline-flex; align-items: center; gap: 4px; color: var(--on-dark-muted); text-decoration: none; }
.credit-label { line-height: 1; }
.credit img { height: 20px; width: auto; display: block; margin-bottom: 6px; opacity: 0.85; transition: opacity 0.2s; }
.credit:hover { color: var(--on-dark); }
.credit:hover img { opacity: 1; }

/* ------- podstrona lokalizacji: naglowek ------- */
.pagehero { padding: 48px 0 80px; }
.pagehero-grid { display: grid; grid-template-columns: 1.05fr 0.95fr; gap: 64px; align-items: center; }
.pagehero .lead { margin: 18px 0 30px; }
.pagehero-media { position: relative; }
.pagehero-media img { width: 100%; aspect-ratio: 3 / 2.2; max-height: 380px; object-fit: cover; border-radius: var(--r-card); box-shadow: var(--shadow-lift); }
/* z pinezkami zdjecie w calosci (pozycje pinezek sa w % pelnego obrazu) */
.pagehero-media.has-pins img { aspect-ratio: auto; max-height: none; height: auto; object-fit: contain; }
.pagehero-grid.is-single { grid-template-columns: 1fr; }
.pagehero-grid.is-single .lead { max-width: 70ch; }
.pagehero-media-full { margin-top: 44px; }
.pagehero-media-full img { width: 100%; height: auto; max-height: none; aspect-ratio: auto; object-fit: contain; border-radius: 0; box-shadow: none; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.pin { position: absolute; z-index: 2; transform: translate(-50%, -100%); display: flex; flex-direction: column; align-items: center; text-decoration: none; }
.pin span {
  background: var(--accent); color: var(--accent-ink);
  font-size: clamp(10px, 1.05vw, 13px); font-weight: 600; line-height: 1; padding: 6px 9px; border-radius: 999px;
  white-space: nowrap; box-shadow: 0 6px 18px rgba(0, 0, 0, 0.5);
  transition: background 0.2s var(--ease), transform 0.2s var(--ease);
}
.pin::after { content: ""; width: 2px; height: clamp(14px, 2.4vw, 30px); background: var(--accent); }
/* sasiednie budynki sa blisko siebie: trzy poziomy nozek (dluga / krotka / srednia),
   zeby etykiety nie nachodzily nawet na waskim ekranie */
.pin:nth-of-type(3n+1)::after { height: clamp(62px, 5.6vw, 72px); }
.pin:nth-of-type(3n+3)::after { height: clamp(36px, 3.6vw, 48px); }
a.pin:hover span, a.pin:focus-visible span { background: var(--on-dark); transform: translateY(-2px); }
.pagehero-stats { display: grid; grid-template-columns: repeat(4, auto); gap: 36px; justify-content: start; }
.pagehero-stats div strong { display: block; font-size: 1.28rem; font-weight: 600; color: var(--ink-strong); font-variant-numeric: tabular-nums; }
.pagehero-stats div span { font-size: 0.86rem; color: var(--muted); }
.crumb { display: inline-flex; align-items: center; gap: 8px; text-decoration: none; color: var(--muted); font-size: 0.92rem; margin-bottom: 22px; }
.crumb:hover { color: var(--ink-strong); }

/* ------- lista mieszkan ------- */
.filters { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 34px; align-items: center; }
.chip {
  font: inherit; font-size: 0.92rem; font-weight: 500; cursor: pointer;
  background: var(--white); color: var(--ink); border: 1px solid var(--line);
  border-radius: 999px; padding: 9px 20px;
  transition: background 0.22s var(--ease), color 0.22s var(--ease),
    border-color 0.22s var(--ease), transform 0.22s var(--ease);
}
.chip:hover { border-color: var(--ink); }
.chip:active { transform: scale(0.96); }
.chip.active { background: var(--accent); color: var(--accent-ink); border-color: var(--accent); }
.filter-toggle {
  display: inline-flex; align-items: center; gap: 9px;
  margin-left: auto; padding: 9px 4px;
  font-size: 0.92rem; color: var(--muted); cursor: pointer; user-select: none;
}
.filter-toggle input { width: 17px; height: 17px; accent-color: var(--wood); cursor: pointer; }
.filter-toggle:hover { color: var(--ink-strong); }

.m-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.m-card {
  display: flex; flex-direction: column; text-decoration: none; color: inherit;
  background: var(--white); border: 1px solid var(--line); border-radius: var(--r-card);
  overflow: hidden; transition: transform 0.3s var(--ease), box-shadow 0.3s var(--ease),
    border-color 0.3s var(--ease), opacity 0.25s var(--ease);
}
.m-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-lift); border-color: var(--line-strong); }
.m-card.is-hide { opacity: 0; transform: scale(0.97); pointer-events: none; }
.m-thumb { background: var(--plan); border-bottom: 1px solid var(--line); padding: 18px; }
.m-thumb img { width: 100%; aspect-ratio: 4 / 3; object-fit: contain; }
.m-body { padding: 20px 22px 22px; display: flex; flex-direction: column; gap: 10px; flex: 1; }
.m-top { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.m-top h3 { font-size: 1.3rem; }
.m-top .floor { font-size: 0.84rem; color: var(--muted); }
.m-meta { font-size: 0.95rem; color: var(--muted); }
.m-bottom { margin-top: auto; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-top: 12px; border-top: 1px solid var(--line); }
.m-price { font-size: 1.12rem; font-weight: 600; color: var(--ink-strong); font-variant-numeric: tabular-nums; }
.m-price small { font-size: 0.82rem; font-weight: 400; color: var(--muted); }
.badge { font-size: 0.78rem; font-weight: 500; white-space: nowrap; border-radius: 999px; padding: 5px 12px; border: 1px solid; }
.badge.wolne { color: var(--ok-text); background: var(--ok-bg); border-color: var(--ok-line); }
.badge.wynajete { color: var(--busy-text); background: var(--busy-bg); border-color: var(--busy-line); }
.m-note { margin-top: 26px; font-size: 0.92rem; color: var(--muted); max-width: 74ch; }

/* ------- galeria budynku: siatka na desktopie, karuzela na mobile ------- */
.sec-tall { padding: 104px 0 112px; }
.gallery-strip { display: grid; grid-template-columns: repeat(3, 1fr); grid-auto-rows: 290px; gap: 16px; }
.gallery-strip a {
  position: relative; display: block; min-width: 0;
  border-radius: var(--r-card); overflow: hidden; border: 1px solid var(--line);
}
.gallery-strip a:first-child { grid-row: span 2; }
.gallery-strip img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.6s var(--ease); }
.gallery-strip a:hover img, .gallery-strip a:focus-visible img { transform: scale(1.04); }

/* ------- teren wokol ------- */
.ground-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 40px; }
.ground-item .ph { font-size: 1.7rem; color: var(--wood-strong); }
.ground-item h3 { font-size: 1rem; margin: 12px 0 4px; }
.ground-item p { font-size: 0.9rem; color: var(--muted); }

/* ------- dojazd / mapa ------- */
.map-grid { display: grid; grid-template-columns: 0.9fr 1.1fr; gap: 56px; align-items: center; }
.map-frame { border-radius: var(--r-card); overflow: hidden; border: 1px solid var(--line); box-shadow: var(--shadow-soft); }
.map-frame iframe { display: block; width: 100%; height: 380px; border: 0; }
.map-note { font-size: 0.85rem; color: var(--muted); margin-top: 10px; }

/* ------- karta mieszkania ------- */
.detail-head { padding: 42px 0 34px; }
.detail-head-grid { display: flex; align-items: flex-end; justify-content: space-between; gap: 32px; flex-wrap: wrap; }
.detail-title .badge { margin-bottom: 16px; display: inline-block; }
.detail-title h1 { margin-bottom: 8px; }
.detail-title .m-meta { font-size: 1.05rem; }
.detail-price { text-align: right; }
.detail-price strong { display: block; font-size: 2rem; font-weight: 600; letter-spacing: -0.02em; color: var(--ink-strong); font-variant-numeric: tabular-nums; }
.detail-price span { font-size: 0.92rem; color: var(--muted); }

.detail-main { display: grid; grid-template-columns: 1.55fr 1fr; gap: 48px; align-items: start; padding-bottom: 96px; }
/* min-width:0: pasek miniaturek (nowrap) nie moze rozpychac kolumn gridu na mobile */
.detail-main > * { min-width: 0; }
.detail-left { display: grid; gap: 64px; }
.detail-left > * { min-width: 0; }
.detail-block h2 { font-size: 1.45rem; margin-bottom: 22px; }

.stage { position: relative; border-radius: var(--r-card); background: var(--plan); border: 1px solid var(--line); overflow: hidden; cursor: zoom-in; }
.stage-img { padding: 20px; }
.stage-img img { width: 100%; aspect-ratio: 16 / 11.5; object-fit: contain; }
.stage.is-photo { background: var(--white); }
.stage.is-photo .stage-img { padding: 0; }
.stage.is-photo .stage-img img { object-fit: cover; border-radius: 0; }
.stage-zoom {
  position: absolute; right: 14px; bottom: 14px;
  width: 42px; height: 42px; border-radius: 999px; border: 1px solid var(--line);
  background: rgba(24, 32, 27, 0.92); color: var(--ink-strong);
  display: flex; align-items: center; justify-content: center; font-size: 1.15rem;
  pointer-events: none;
}
/* miniatury: jeden przewijany rzad (desktop i mobile) + strzalki przy nadmiarze zdjec */
.thumbs-wrap { position: relative; margin-top: 14px; }
.thumbs {
  display: flex; gap: 12px; flex-wrap: nowrap;
  overflow-x: auto; scrollbar-width: none; padding-bottom: 4px;
}
.thumbs::-webkit-scrollbar { display: none; }
.thumbs-arrow {
  position: absolute; top: 50%; transform: translateY(-52%);
  z-index: 2; width: 38px; height: 38px; border-radius: 999px;
  background: rgba(24, 32, 27, 0.95); border: 1px solid var(--line);
  box-shadow: var(--shadow-soft);
  display: flex; align-items: center; justify-content: center;
  color: var(--ink-strong); font-size: 1.05rem; cursor: pointer;
  transition: border-color 0.2s, color 0.2s;
}
.thumbs-arrow:hover { border-color: var(--accent); color: var(--accent); }
.thumbs-arrow.prev { left: -12px; }
.thumbs-arrow.next { right: -12px; }
.thumbs-arrow[hidden] { display: none; }
.thumb {
  flex: 0 0 auto;
  width: 104px; height: 78px; border-radius: 10px; border: 1px solid var(--line);
  background: var(--white); padding: 0; cursor: pointer; overflow: hidden;
}
.thumb img { width: 100%; height: 100%; object-fit: cover; }
.thumb.plan { padding: 6px; background: var(--plan); }
.thumb.plan img { object-fit: contain; }
.thumb.active { border-color: var(--accent); box-shadow: 0 0 0 1px var(--accent); }

.summary { position: sticky; top: 96px; border: 1px solid var(--line); border-radius: var(--r-card); background: var(--white); padding: 28px; }
body.admin-bar .summary { top: 128px; }
.summary h3 { margin-bottom: 18px; }
.summary dl { display: grid; gap: 0; }
.summary .srow { display: flex; justify-content: space-between; gap: 18px; padding: 11px 0; }
.summary .srow + .srow { border-top: 1px solid var(--line); }
.summary dt { color: var(--muted); font-size: 0.93rem; }
.summary dd { font-weight: 500; color: var(--ink-strong); text-align: right; font-size: 0.95rem; }
.summary .actions { display: grid; gap: 10px; margin-top: 22px; }
.summary .actions .btn { justify-content: center; }
.summary .avail-note { font-size: 0.87rem; color: var(--muted); margin-top: 16px; }

.rooms-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 48px; max-width: 860px; }
.room-row { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding: 12px 2px; border-bottom: 1px solid var(--line); }
.room-row span { color: var(--ink); }
.room-row strong { font-weight: 500; font-variant-numeric: tabular-nums; white-space: nowrap; }
.rooms-empty { background: var(--paper); border-radius: var(--r-card); padding: 26px 30px; color: var(--muted); max-width: 640px; }

.spec-list { display: grid; grid-template-columns: 1fr 1fr; gap: 13px 44px; max-width: 900px; }
.spec-item { display: flex; gap: 13px; align-items: flex-start; }
.spec-item .ph { color: var(--wood-strong); font-size: 1.2rem; margin-top: 4px; }

.others h2 { margin-bottom: 34px; }

/* mobilna belka: cena + kontakt, tylko na karcie mieszkania */
.mobilebar {
  display: none;
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 50;
  background: rgba(17, 22, 19, 0.97);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-top: 1px solid var(--line);
  padding: 11px 16px calc(11px + env(safe-area-inset-bottom));
  align-items: center; gap: 12px;
}
.mobilebar-price { line-height: 1.2; margin-right: auto; }
.mobilebar-price strong { display: block; font-size: 1.12rem; font-weight: 600; color: var(--ink-strong); font-variant-numeric: tabular-nums; }
.mobilebar-price span { font-size: 0.76rem; color: var(--muted); }
.mobilebar .btn { padding: 11px 20px; }
.mobilebar-mail {
  width: 46px; height: 46px; border-radius: 999px; border: 1px solid var(--line);
  display: flex; align-items: center; justify-content: center;
  color: var(--ink-strong); font-size: 1.2rem; text-decoration: none; background: var(--white);
}

/* ------- plywajacy przycisk telefonu (male ekrany, strony bez dolnej belki) ------- */
.fab-call {
  display: none; position: fixed; right: 16px; bottom: calc(16px + env(safe-area-inset-bottom)); z-index: 45;
  align-items: center; gap: 8px; height: 52px; padding: 0 20px 0 16px; border-radius: 999px;
  background: var(--accent); color: var(--accent-ink); font-weight: 600; font-size: 0.95rem; text-decoration: none;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.45);
  transition: transform 0.3s var(--ease), opacity 0.3s var(--ease), background 0.2s var(--ease);
}
.fab-call .ph { font-size: 1.25rem; }
.fab-call:hover { background: var(--accent-strong); }
.fab-call:active { transform: scale(0.97); }
.fab-call.is-hidden { transform: translateY(140%); opacity: 0; pointer-events: none; }

/* ------- nota prawna (drobny druk) ------- */
.sec-note { padding: 40px 0 56px; }
.legal-note { max-width: 110ch; font-size: 0.82rem; line-height: 1.6; color: var(--muted); }

/* ------- strona 404 ------- */
.error404-sec { padding: 110px 0 130px; }
.error404-box { max-width: 640px; text-align: center; display: grid; justify-items: center; }
.error404-code {
  font-size: clamp(4.5rem, 10vw, 7rem); font-weight: 700; line-height: 1;
  letter-spacing: -0.04em; color: var(--paper);
  -webkit-text-stroke: 2px var(--wood); color: transparent;
  margin-bottom: 10px;
}
.error404-box h1 { font-size: clamp(1.7rem, 3.4vw, 2.4rem); margin-bottom: 14px; }
.error404-box .lead { margin-bottom: 30px; }
.error404-box .hero-actions { justify-content: center; }

/* ------- moduly tekstowe ------- */
.prose { max-width: 72ch; color: var(--ink); }
.prose > * + * { margin-top: 14px; }
.prose h3 { margin-top: 26px; font-size: 1.12rem; }
.prose h4 { margin-top: 20px; font-size: 1rem; }
.prose a { color: var(--wood-strong); text-decoration: underline; text-underline-offset: 3px; }
.prose a:hover { color: var(--ink-strong); }
.prose ul, .prose ol { padding-left: 22px; display: grid; gap: 6px; }
.prose img { border-radius: var(--r-card); }
.prose blockquote { border-left: 3px solid var(--wood); padding: 4px 0 4px 18px; color: var(--muted); }
.readmore-extra { margin-top: 14px; }
.readmore-toggle { margin-top: 18px; background: none; cursor: pointer; font-size: 1rem; }
.readmore-toggle .ph { transition: transform 0.3s var(--ease); }
.readmore-toggle[aria-expanded="true"] .ph { transform: rotate(180deg); }

/* ------- FAQ (akordeon) ------- */
.faq-list { display: grid; gap: 12px; max-width: 820px; }
.faq-item {
  background: var(--white); border: 1px solid var(--line); border-radius: var(--r-card);
  overflow: hidden;
}
.faq-item summary {
  display: flex; align-items: center; justify-content: space-between; gap: 18px;
  padding: 18px 22px; cursor: pointer; list-style: none;
  font-weight: 500; color: var(--ink-strong);
}
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary:hover { color: var(--wood-strong); }
.faq-item summary .ph { flex: 0 0 auto; font-size: 1.15rem; color: var(--wood-strong); transition: transform 0.3s var(--ease); }
.faq-item[open] summary .ph { transform: rotate(45deg); }
.faq-item .faq-answer { padding: 0 22px 20px; color: var(--muted); max-width: none; }

/* ------- lightbox ------- */
.lightbox {
  position: fixed; inset: 0; z-index: 80; display: flex;
  background: rgba(8, 11, 9, 0.94);
  align-items: center; justify-content: center; padding: 40px;
  overscroll-behavior: contain;
  opacity: 0; visibility: hidden;
  transition: opacity 0.3s var(--ease), visibility 0s linear 0.3s;
}
.lightbox.open { opacity: 1; visibility: visible; transition: opacity 0.3s var(--ease); }
.lightbox img {
  max-width: min(1200px, 92vw); max-height: 86vh; width: auto; height: auto; object-fit: contain;
  border-radius: 10px; background: var(--plan);
  transform: scale(0.95); transition: transform 0.35s var(--ease);
}
.lightbox.open img { transform: none; }
.lightbox-close {
  position: absolute; top: 22px; right: 26px;
  background: rgba(255, 255, 255, 0.14); border: 1px solid rgba(255, 255, 255, 0.28); color: #FFFFFF;
  width: 46px; height: 46px; border-radius: 999px; font-size: 1.25rem; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: background 0.2s var(--ease), border-color 0.2s var(--ease);
}
.lightbox-close:hover { background: rgba(255, 255, 255, 0.28); border-color: rgba(255, 255, 255, 0.5); }

/* ------- animacje wejscia ------- */
.rv { opacity: 0; transform: translateY(16px); transition: opacity 0.7s var(--ease), transform 0.7s var(--ease); }
.rv.in { opacity: 1; transform: none; }
.rv-d1 { transition-delay: 0.08s; }
.rv-d2 { transition-delay: 0.16s; }
.rv-d3 { transition-delay: 0.24s; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .rv { opacity: 1; transform: none; transition: none; }
  .btn, .m-card, .loc-feature img, .gallery-strip img, .chip,
  .nav-links, .nav-burger .bars, .nav-burger .bars::before, .nav-burger .bars::after,
  .lightbox, .lightbox img, .field > label { transition: none; }
}

/* =====================================================================
   1.2.0 - oferta sprzedazy: karty lokalizacji (warianty siatki), lista pod
   kaflami standardu, galerie z zakladkami, fakty + porownanie ogrodow,
   ceny i kalkulator rat, osiedle, karta mieszkania na sprzedaz, lightbox
   z nawigacja.
   ===================================================================== */

/* karty lokalizacji: dwie wyroznione obok siebie / para (karta na pelna wysokosc) */
.loc-grid-all-feature { grid-template-columns: 1fr 1fr; grid-template-rows: auto; }
.loc-grid-all-feature .loc-feature { grid-row: auto; min-height: 440px; }
.loc-grid-pair .loc-card { grid-row: 1 / 3; }
/* plakietka na wyroznionej karcie: inline-block, inaczej margines pod nia nie dziala i siedzi na nagloweku */
.chip-light { display: inline-block; color: var(--on-dark); background: rgba(255, 255, 255, 0.14); border-color: rgba(255, 255, 255, 0.3); margin-bottom: 18px; }
.loc-feature-body h3 { margin-top: 0; }
.loc-card .link-more { margin-top: 16px; }

/* lokalizacje: lista - lokalizacja pod lokalizacja (zdjecie | chip, tytul, opis, przycisk) */
.loc-list { display: grid; gap: 20px; }
.loc-row, .loc-feature, .loc-card { scroll-margin-top: 96px; }
.loc-row {
  display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
  background: var(--white); border: 1px solid var(--line); border-radius: var(--r-card); overflow: hidden;
  transition: border-color 0.3s var(--ease), box-shadow 0.3s var(--ease);
}
.loc-row:not(.is-soon):hover { border-color: var(--line-strong); box-shadow: var(--shadow-lift); }
.loc-row-media { position: relative; min-height: 280px; background: var(--paper); }
.loc-row-media a { display: block; height: 100%; }
.loc-row-media img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.7s var(--ease); }
.loc-row:not(.is-soon):hover .loc-row-media img { transform: scale(1.03); }
.loc-row-placeholder { height: 100%; min-height: 280px; display: flex; align-items: center; justify-content: center; color: var(--line-strong); font-size: 3rem; }
.loc-row-body { padding: 34px 36px; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 12px; }
.loc-row-body h3 { font-size: 1.45rem; }
.loc-row-body h3 a { text-decoration: none; }
.loc-row-body h3 a:hover { color: var(--accent-strong); }
.loc-row-body p { color: var(--muted); max-width: 56ch; }
.loc-row-body .btn { margin-top: 10px; }
.loc-row.is-soon .loc-row-media, .loc-row.is-soon .loc-row-placeholder { min-height: 200px; }
.loc-row.is-soon .loc-row-body p { color: var(--muted); }

/* standard: lista pod kaflami */
.standard-main { display: grid; gap: 28px; }
.std-list { list-style: none; display: grid; grid-template-columns: 1fr 1fr; gap: 6px 36px; font-size: 0.95rem; }
.std-list li { position: relative; padding: 9px 0 9px 24px; border-bottom: 1px dashed var(--line); color: var(--ink); }
.std-list li::before { content: ""; position: absolute; left: 2px; top: 19px; width: 10px; height: 2px; background: var(--wood); }

/* galerie z zakladkami */
.gal-sec .sec-head { max-width: 720px; }
.gal-sec-compact { padding-top: 40px; }
.gal-tabs { margin-bottom: 22px; }
.gal-desc-row { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; margin-bottom: 22px; }
.gal-desc { color: var(--muted); max-width: 66ch; }
.swatches { display: flex; gap: 6px; flex: 0 0 auto; padding-bottom: 4px; }
.swatches i { display: block; width: 26px; height: 26px; border-radius: 50%; border: 1px solid rgba(255, 255, 255, 0.18); }
.gallery-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-auto-rows: 190px; gap: 12px; }
.gallery-grid a {
  position: relative; display: block; min-width: 0;
  border-radius: var(--r-card); overflow: hidden; border: 1px solid var(--line); background: var(--paper);
}
.gallery-grid a:first-child { grid-column: span 2; grid-row: span 2; }
.gallery-grid img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.6s var(--ease); }
.gallery-grid a:hover img, .gallery-grid a:focus-visible img { transform: scale(1.04); }
.gallery-cap {
  position: absolute; left: 10px; bottom: 10px;
  font-size: 0.78rem; font-weight: 500; letter-spacing: 0.02em;
  background: rgba(13, 17, 14, 0.78); color: var(--on-dark);
  padding: 4px 10px; border-radius: 999px; pointer-events: none;
}

/* fakty + porownanie ogrodow */
.facts-sec { background: var(--paper); }
.facts-grid { display: grid; grid-template-columns: 0.95fr 1.05fr; gap: 64px; align-items: start; }
.facts-grid-single { grid-template-columns: 1fr; }
.facts-lead { margin-top: 14px; }
.gfacts { display: grid; margin-top: 28px; }
.gfacts div { display: grid; grid-template-columns: 120px 1fr; gap: 16px; padding: 15px 0; border-bottom: 1px solid var(--line); }
.gfacts dt { font-size: 0.82rem; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--wood-strong); padding-top: 3px; }
.gfacts dd { color: var(--ink); font-size: 0.97rem; }
.gbars-h { font-size: 1.15rem; margin-bottom: 4px; }
.gbars-note { font-size: 0.88rem; color: var(--muted); margin-bottom: 22px; }
.gbars { display: grid; gap: 14px; }
.gbar { display: grid; grid-template-columns: 52px minmax(0, 1fr) 96px; gap: 12px; align-items: center; text-decoration: none; color: var(--ink); }
.gbar-id { font-weight: 600; color: var(--ink-strong); font-variant-numeric: tabular-nums; }
.gbar-track { display: flex; height: 32px; border-radius: 8px; overflow: hidden; background: var(--white); border: 1px solid var(--line); }
.gbar-track i, .gbar-legend i { display: block; }
.gbar-flat { background: var(--ink); }
.gbar-back { background: var(--garden); }
.gbar-front { background: var(--garden-soft); }
.gbar-val { font-weight: 500; text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.gbar:hover .gbar-track { border-color: var(--ink); }
.gbar-legend { display: flex; flex-wrap: wrap; gap: 8px 18px; margin-top: 18px; font-size: 0.86rem; color: var(--muted); }
.gbar-legend span { display: inline-flex; align-items: center; gap: 7px; }
.gbar-legend i { width: 12px; height: 12px; border-radius: 3px; border: 1px solid rgba(255, 255, 255, 0.12); }

/* szczegoly mieszkan: zakladki per lokal (pomieszczenia + dzialka | rzut + polozenie + ceny) */
.unit-detail { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr); gap: 56px; align-items: start; }
.unit-detail[hidden] { display: none; }
.unit-detail h3 { font-size: 1.5rem; display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 8px; }
.tag { font-size: 0.78rem; font-weight: 500; letter-spacing: 0.02em; padding: 5px 12px; border-radius: 999px; background: var(--surface-2); color: var(--muted); border: 1px solid var(--line); white-space: nowrap; }
.detail-note { color: var(--muted); max-width: 60ch; }
.rooms { width: 100%; border-collapse: collapse; margin-top: 24px; font-variant-numeric: tabular-nums; }
.rooms th { text-align: left; font-size: 0.76rem; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; color: var(--muted); padding: 0 0 10px; border-bottom: 1px solid var(--line-strong); }
.rooms th.a, .rooms td.a { text-align: right; }
.rooms td { padding: 11px 0; border-bottom: 1px solid var(--line); vertical-align: middle; }
.rooms td.n { width: 48px; color: var(--muted); font-size: 0.88rem; }
.rooms td.a { width: 80px; font-weight: 500; white-space: nowrap; }
.rooms td.bar { width: 30%; padding-left: 18px; }
.rooms td.bar i { display: block; height: 8px; border-radius: 4px; background: var(--accent); }
.rooms tfoot td { border-bottom: 0; padding-top: 14px; font-weight: 600; color: var(--ink-strong); }
.rooms tfoot td.a { font-size: 1.1rem; }
.unit-garden { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 28px; align-items: start; margin-top: 32px; }
.unit-garden .plot-vis { padding: 16px; }
.unit-detail-media { display: grid; gap: 18px; }
.unit-detail-media figure a { position: relative; display: block; border-radius: var(--r-card); overflow: hidden; border: 1px solid var(--line); background: var(--plan); }
.unit-detail-media figure img { width: 100%; height: auto; }
.unit-plan a { padding: 20px; }
.unit-plan img { max-height: 560px; object-fit: contain; }
.unit-pos { max-width: 360px; }
.unit-detail-media figcaption { margin-top: 8px; font-size: 0.86rem; color: var(--muted); }
.unit-cta { display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap; padding-top: 18px; border-top: 1px solid var(--line); }
.unit-prices { display: flex; gap: 28px; flex-wrap: wrap; }
.unit-prices span { display: block; font-size: 0.82rem; color: var(--muted); }
.unit-prices strong { font-size: 1.2rem; font-weight: 600; color: var(--ink-strong); font-variant-numeric: tabular-nums; }

/* ceny: warianty, tabela, kalkulator */
.rates { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-bottom: 36px; max-width: 900px; }
.rate { background: var(--white); border: 1px solid var(--line); border-radius: var(--r-card); padding: 24px 26px; }
.rate.is-main { border-color: var(--wood); box-shadow: inset 0 0 0 1px var(--wood); }
.rate .eyebrow { margin-bottom: 8px; }
.rate strong { display: block; font-size: 1.7rem; font-weight: 600; letter-spacing: -0.02em; color: var(--ink-strong); font-variant-numeric: tabular-nums; }
.rate p { color: var(--muted); font-size: 0.93rem; margin-top: 8px; }
.price-table-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: var(--r-card); background: var(--white); }
.price-table { width: 100%; border-collapse: collapse; min-width: 640px; font-variant-numeric: tabular-nums; }
.price-table th, .price-table td { padding: 15px 20px; text-align: left; border-bottom: 1px solid var(--line); white-space: nowrap; }
.price-table th { font-size: 0.78rem; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; color: var(--muted); background: var(--surface-2); }
.price-table td:first-child { font-weight: 600; font-size: 1.15rem; color: var(--ink-strong); }
.price-table td a { text-decoration: none; }
.price-table td a:hover { color: var(--wood-strong); }
.price-table tr:last-child td { border-bottom: none; }
.price-table td.hl { color: var(--wood-strong); font-weight: 600; }
.calc-h { font-size: 1.45rem; margin: 56px 0 18px; }
.calc { display: grid; grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr); gap: 40px; background: var(--white); border: 1px solid var(--line); border-radius: var(--r-card); padding: 32px; }
.calc fieldset { border: 0; padding: 0; margin: 0 0 22px; min-width: 0; }
.calc legend { font-size: 0.78rem; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; color: var(--muted); margin-bottom: 10px; }
.opts { display: grid; gap: 8px; }
.opt { display: flex; align-items: center; gap: 12px; border: 1px solid var(--line); border-radius: 12px; padding: 12px 14px; cursor: pointer; transition: border-color 0.2s, background 0.2s; }
.opt:hover { border-color: var(--line-strong); }
.opt:has(input:checked) { border-color: var(--wood); background: var(--wood-tint); }
.opt input { accent-color: var(--wood); width: 18px; height: 18px; margin: 0; flex: 0 0 auto; }
.opt span { flex: 1; font-weight: 500; }
.opt small { color: var(--muted); font-size: 0.86rem; font-variant-numeric: tabular-nums; white-space: nowrap; }
.calc-out .eyebrow { color: var(--muted); }
.calc-total { font-size: clamp(2rem, 4.2vw, 2.9rem); font-weight: 600; letter-spacing: -0.02em; line-height: 1.05; color: var(--ink-strong); font-variant-numeric: tabular-nums; }
.calc-sub { font-size: 0.9rem; color: var(--muted); margin-top: 8px; font-variant-numeric: tabular-nums; }
.sched { width: 100%; border-collapse: collapse; margin-top: 24px; font-size: 0.92rem; }
.sched td { padding: 10px 0; border-bottom: 1px solid var(--line); vertical-align: top; }
.sched td.p { width: 52px; color: var(--wood-strong); font-weight: 600; font-variant-numeric: tabular-nums; }
.sched td.w { color: var(--ink-strong); font-weight: 500; }
.sched td.w small { display: block; color: var(--muted); font-size: 0.84rem; font-weight: 400; }
.sched td.d { width: 120px; color: var(--muted); white-space: nowrap; padding-left: 12px; }
.sched td.v { width: 120px; text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; font-weight: 500; }
.calc-note { font-size: 0.86rem; color: var(--muted); margin-top: 16px; }

/* osiedle / inwestycja */
.estate-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 64px; align-items: start; }
.estate-grid-single { grid-template-columns: 1fr; }
.estate-lead { margin-top: 14px; }
.estate-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 30px; border-top: 1px solid var(--line-strong); }
.estate-stats div { padding: 16px 16px 16px 0; border-bottom: 1px solid var(--line); }
.estate-stats strong { display: block; font-size: 1.9rem; font-weight: 600; letter-spacing: -0.02em; line-height: 1.1; color: var(--ink-strong); font-variant-numeric: tabular-nums; }
.estate-stats span { font-size: 0.86rem; color: var(--muted); }
.check-list { list-style: none; display: grid; gap: 10px; margin-top: 26px; }
.check-list li { display: grid; grid-template-columns: 22px 1fr; gap: 10px; align-items: start; font-size: 0.97rem; }
.check-list .ph { color: var(--wood-strong); font-size: 1.1rem; margin-top: 4px; }
.estate-links { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 28px; }
.estate-media a { position: relative; display: block; border-radius: var(--r-card); overflow: hidden; border: 1px solid var(--line); background: var(--plan); box-shadow: var(--shadow-soft); }
.estate-media img { width: 100%; height: auto; }
.estate-media figcaption { margin-top: 10px; font-size: 0.86rem; color: var(--muted); }
/* kolumna zdjec przyklejona przy przewijaniu (krotsza kolumna nie zostawia pustki na dole);
   dodatkowe zdjecia: jedno = pelna szerokosc, wiecej = siatka 2 kolumny */
.estate-media { position: sticky; top: 96px; }
body.admin-bar .estate-media { top: 128px; }
.estate-gallery { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 12px; }
.estate-gallery.is-single { grid-template-columns: 1fr; }
.estate-gallery a { display: block; border-radius: var(--r-card); overflow: hidden; border: 1px solid var(--line); background: var(--white); box-shadow: var(--shadow-soft); }
.estate-gallery img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; transition: transform 0.6s var(--ease); }
.estate-gallery a:hover img { transform: scale(1.03); }
/* fakty: tekst przyklejony, pod slupkami zdjecie / plan */
.facts-copy { position: sticky; top: 96px; }
body.admin-bar .facts-copy { top: 128px; }
.facts-media { margin-top: 32px; }
.facts-media-only { margin-top: 0; }
.facts-media a { position: relative; display: block; border-radius: var(--r-card); overflow: hidden; border: 1px solid var(--line); background: var(--plan); box-shadow: var(--shadow-soft); }
.facts-media img { width: 100%; height: auto; }
.facts-media figcaption { margin-top: 10px; font-size: 0.86rem; color: var(--muted); }

/* karta na liscie - sprzedaz */
.m-thumb.is-photo { padding: 0; background: var(--white); }
.m-thumb.is-photo img { aspect-ratio: 16 / 10; object-fit: cover; }
.m-meta-ogrod { display: flex; align-items: center; gap: 8px; }
.m-meta-ogrod .ph { color: var(--garden); font-size: 1.05rem; }
.m-price-sale small { display: block; font-size: 0.78rem; margin-top: 1px; }
.m-price-sale .m-price-alt { color: var(--muted); margin-top: 4px; }
.badge.rezerwacja { color: var(--hold-text); background: var(--hold-bg); border-color: var(--hold-line); }
.badge.sprzedane { color: var(--busy-text); background: var(--busy-bg); border-color: var(--busy-line); }

/* karta mieszkania - sprzedaz: numery pomieszczen, suma, schemat dzialki */
.detail-intro { max-width: 70ch; }
.room-no { display: inline-block; min-width: 34px; margin-right: 8px; font-size: 0.8rem; color: var(--muted); font-variant-numeric: tabular-nums; }
.rooms-total { display: flex; justify-content: space-between; gap: 16px; max-width: 860px; margin-top: 14px; padding: 12px 2px 0; font-weight: 600; color: var(--ink-strong); }
.rooms-total strong { font-size: 1.1rem; font-variant-numeric: tabular-nums; }
.plot-grid { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 36px; align-items: start; max-width: 860px; }
.plot-vis { background: var(--paper); border-radius: var(--r-card); padding: 22px; }
.plot-svg { width: 100%; height: auto; display: block; }
.plot-back { fill: var(--garden); }
.plot-front { fill: var(--garden-soft); }
.plot-house { fill: var(--ink); }
.plot-t { font-family: "Outfit", system-ui, sans-serif; }
.plot-t-big { font-size: 16px; font-weight: 600; fill: #fff; }
.plot-t-small { font-size: 11px; fill: rgba(255, 255, 255, 0.85); }
.plot-t-house { font-size: 13px; font-weight: 500; fill: var(--accent-ink); }
.plot-t-front { font-size: 11.5px; fill: var(--garden-ink); }
.plot-t-note { font-size: 10.5px; fill: var(--muted); }
.plot-facts { display: grid; }
.plot-facts div { display: flex; justify-content: space-between; gap: 18px; padding: 11px 0; border-bottom: 1px solid var(--line); }
.plot-facts dt { color: var(--muted); font-size: 0.93rem; }
.plot-facts dd { font-weight: 500; color: var(--ink-strong); font-variant-numeric: tabular-nums; }
.plot-note { font-size: 0.86rem; color: var(--muted); margin-top: 14px; }

/* lightbox: podpis + strzalki */
.lightbox-fig { display: grid; justify-items: center; gap: 12px; max-width: 100%; }
.lightbox-cap { font-size: 0.9rem; color: #FFFFFF; opacity: 0.85; text-align: center; }
.lightbox-arrow {
  position: absolute; top: 50%; transform: translateY(-50%);
  width: 48px; height: 48px; border-radius: 999px; border: 0;
  background: rgba(255, 255, 255, 0.14); border: 1px solid rgba(255, 255, 255, 0.28); color: #FFFFFF; font-size: 1.3rem; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: background 0.2s var(--ease), border-color 0.2s var(--ease);
}
.lightbox-arrow:hover { background: rgba(255, 255, 255, 0.28); border-color: rgba(255, 255, 255, 0.5); }
.lightbox-arrow.prev { left: 22px; }
.lightbox-arrow.next { right: 22px; }
.lightbox-arrow[hidden] { display: none; }

/* ------- responsywnosc ------- */
@media (max-width: 1080px) {
  .hero-grid, .pagehero-grid, .about-grid, .map-grid { grid-template-columns: 1fr; gap: 40px; }
  .standard-grid { grid-template-columns: 1fr; gap: 40px; }
  .standard-intro { position: static; }
  .m-grid { grid-template-columns: repeat(2, 1fr); }
  .detail-main { grid-template-columns: 1fr; }
  .summary { position: static; }
  .mobilebar { display: flex; }
  body.single-mieszkanie { padding-bottom: 78px; }
  body.single-mieszkanie .dark-block { padding-bottom: 12px; }
  /* cena w naglowku zbedna, gdy jest dolna belka z cena; kaucja siedzi w podsumowaniu */
  .detail-price { display: none; }
  .loc-grid, .loc-grid-all-feature { grid-template-columns: 1fr; grid-template-rows: auto; }
  .loc-feature, .loc-grid-pair .loc-card { grid-row: auto; min-height: 380px; }
  .loc-grid-pair .loc-card { min-height: 0; }
  .loc-row { grid-template-columns: 1fr; }
  .loc-row-media { min-height: 0; aspect-ratio: 16 / 9; }
  .loc-row-media img { aspect-ratio: 16 / 9; }
  .loc-row-placeholder { min-height: 180px; }
  .loc-row-body { padding: 24px; }
  .facts-grid, .estate-grid { grid-template-columns: 1fr; gap: 44px; }
  .estate-media, .facts-copy { position: static; }
  .gallery-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-auto-rows: 170px; }
  .calc { grid-template-columns: 1fr; padding: 24px; }
  .plot-grid { grid-template-columns: 1fr; max-width: 520px; }
  .unit-detail { grid-template-columns: 1fr; gap: 40px; }
  .unit-garden { grid-template-columns: 1fr; max-width: 480px; }
  .contact-grid { grid-template-columns: 1fr; gap: 48px; }
}

@media (max-width: 782px) {
  body.admin-bar .nav { top: 46px; }
  body.admin-bar .subnav { top: 116px; }
}

@media (max-width: 768px) {
  .sec { padding: 64px 0; }
  .hero { padding: 40px 0 56px; }
  .hero-text { padding: 44px 0 12px; }
  .hero-text .hero-actions { margin-top: 28px; }
  .nav-cta .btn { display: none; }
  .fab-call { display: inline-flex; }
  .nav-burger { display: inline-flex; }
  .nav-links {
    display: flex; flex-direction: column; align-items: stretch; gap: 4px;
    position: absolute; top: 70px; left: 0; right: 0;
    background: var(--bg); border-bottom: 1px solid var(--line); padding: 12px 24px 20px;
    box-shadow: 0 18px 30px rgba(60, 54, 42, 0.08);
    opacity: 0; visibility: hidden; transform: translateY(-10px);
    transition: opacity 0.3s var(--ease), transform 0.3s var(--ease), visibility 0s linear 0.3s;
  }
  .nav.open .nav-links {
    opacity: 1; visibility: visible; transform: none;
    transition: opacity 0.3s var(--ease), transform 0.3s var(--ease);
  }
  .nav-links li { width: 100%; }
  .nav-links a { display: block; padding: 10px 0; font-size: 1.05rem; }
  /* przyciski delikatnie mniejsze na telefonie, zeby CTA w hero nie lamaly sie do 2 linii */
  .btn { padding: 11px 15px; font-size: 0.9rem; gap: 7px; }
  .btn .ph { font-size: 1rem; }
  .hero-actions { gap: 8px; }
  .chip { padding: 10px 16px; font-size: 0.88rem; }
  .pin span { font-size: 9.5px; padding: 5px 7px; }
  .features { grid-template-columns: 1fr; }
  .m-grid { grid-template-columns: 1fr; }
  .gallery-strip {
    display: flex; overflow-x: auto; gap: 12px;
    scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch;
    scrollbar-width: none; padding-bottom: 4px;
    margin: 0 -24px; padding-left: 24px; padding-right: 24px;
  }
  .gallery-strip::-webkit-scrollbar { display: none; }
  .gallery-strip a { flex: 0 0 82%; height: 320px; scroll-snap-align: center; }
  .sec-tall { padding: 64px 0 72px; }
  .gal-sec-compact { padding-top: 28px; }
  .pagehero { padding: 36px 0 56px; }
  .subnav-in { height: 52px; }
  .subnav a { padding: 12px 13px; }
  /* miniaturki galerii mieszkania: pasek na pelna szerokosc ekranu.
     BEZ scroll-snap: snap szarpal sie z programowym przewijaniem (strzalki,
     dosuwanie klikniętej miniatury) i odbijal na koncach paska. */
  .thumbs {
    gap: 10px; margin: 0 -24px; padding: 0 24px 6px;
    -webkit-overflow-scrolling: touch;
  }
  .thumb { flex: 1 0 96px; width: auto; height: 74px; }
  .thumbs-arrow { width: 36px; height: 36px; }
  .ground-row { grid-template-columns: 1fr 1fr; gap: 28px; }
  .pagehero-stats { grid-template-columns: 1fr 1fr; gap: 20px; }
  .rooms-grid, .spec-list { grid-template-columns: 1fr; }
  .form-row { grid-template-columns: 1fr; }
  .std-list { grid-template-columns: 1fr; }
  .gallery-grid { grid-template-columns: 1fr 1fr; grid-auto-rows: 130px; gap: 8px; }
  .gallery-cap { display: none; }
  .rates { grid-template-columns: 1fr; }
  .estate-stats { grid-template-columns: 1fr; }
  .estate-stats div { display: flex; align-items: baseline; gap: 12px; }
  .gbar { grid-template-columns: 44px minmax(0, 1fr) 80px; gap: 8px; }
  .gfacts div { grid-template-columns: 1fr; gap: 4px; }
  .sched td.d { display: none; }
  .rooms td.bar, .rooms th:nth-child(3) { display: none; }
  .unit-plan a { padding: 12px; }
  .lightbox { padding: 16px; }
  .lightbox-arrow { width: 40px; height: 40px; top: auto; bottom: 18px; transform: none; }
  .lightbox-arrow.prev { left: 16px; }
  .lightbox-arrow.next { right: 16px; }
  .lightbox-close { top: 12px; right: 12px; }
}