/**
 * Moduł Inwestycji — style listingu i strony szczegółów.
 * Czcionka i kolorystyka dopasowane do reszty strony (Poppins, #d6b981 — te same
 * wartości co --ast-global-color-0 zdefiniowany w Customizerze Astry).
 */

/*
 * Astra ustawia nagłówek (#masthead) na position:absolute w trybie transparentnym,
 * ale jego tło (.ast-primary-header-bar) ma na sztywno #ffffff na desktopie —
 * ta reguła nie jest nadpisywana dla layoutu "Separate Containers", którego
 * używa nasza strona archiwum. Wymuszamy przezroczystość, żeby baner był
 * widoczny jako tło menu (a nie zasłonięty białym paskiem).
 */
body.post-type-archive-inwestycje #masthead {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 100 !important;
  background: transparent !important;
}
body.post-type-archive-inwestycje #masthead .main-header-bar,
body.post-type-archive-inwestycje #masthead .ast-primary-header-bar,
body.post-type-archive-inwestycje #masthead .site-primary-header-wrap,
body.post-type-archive-inwestycje #masthead .ast-above-header-bar,
body.post-type-archive-inwestycje #masthead .ast-below-header-bar {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

/*
 * Podstrona szczegółów nie ma banera ze zdjęciem — zamiast tego dajemy nagłówkowi
 * po prostu ciemne tło (ten sam ciemny odcień co reszta modułu), żeby jasny tekst
 * menu był czytelny. Header nadal jest position:absolute (pływa nad treścią), więc
 * doliczamy padding-top na #primary równy jego wysokości, żeby nic się pod nim
 * nie chowało.
 */
body.single-inwestycje #masthead {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 100 !important;
  background: #1a1a1a !important;
}
body.single-inwestycje #masthead .main-header-bar,
body.single-inwestycje #masthead .ast-primary-header-bar,
body.single-inwestycje #masthead .site-primary-header-wrap,
body.single-inwestycje #masthead .ast-above-header-bar,
body.single-inwestycje #masthead .ast-below-header-bar {
  background: #1a1a1a !important;
  background-color: #1a1a1a !important;
  background-image: none !important;
}

/*
 * Layout "Separate Containers" Astry (.ast-separate-container #primary) dodaje
 * margin: 4em 0 wokół całej treści — stąd biały pas nad banerem/treścią na obu
 * podstronach modułu. Zerujemy go tylko tutaj.
 */
body.post-type-archive-inwestycje #primary,
body.single-inwestycje #primary {
  margin: 0 !important;
  padding: 0 !important;
}

/* Odsunięcie treści strony szczegółów od pływającego, ciemnego nagłówka. */
body.single-inwestycje #primary {
  padding-top: 110px !important;
}

:root {
  --inw-bg: #ffffff;
  --inw-bg-section: #f5f5f5;
  --inw-accent: #d6b981;
  --inw-accent-dark: #c8a359;
  --inw-text: #1a1a1a;
  --inw-text-muted: #666666;
  --inw-status-dostepne: #6a8f6e;
  --inw-status-zarezerwowane: #b9814a;
  --inw-status-sprzedane: #969696;
  --inw-border: #d0d7de;
}

.inwestycje-listing,
.inwestycja-szczegoly {
  color: var(--inw-text);
  font-family: 'Poppins', sans-serif;
  font-size: 16px;
  line-height: 1.6;
}

.inwestycje-listing h1,
.inwestycja-szczegoly h1 {
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
  font-size: clamp(28px, 4vw, 40px);
  margin: 0 0 12px;
}

.inwestycje-listing h2,
.inwestycja-szczegoly h2 {
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
  font-size: clamp(22px, 3vw, 28px);
  margin: 0 0 20px;
}

.inwestycje-listing .badge,
.inwestycja-szczegoly .badge {
  display: inline-block;
  padding: 4px 12px;
  border-radius: 999px;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 600;
  color: #fff;
}
.badge--green {
  background: var(--inw-status-dostepne);
}
.badge--orange {
  background: var(--inw-status-zarezerwowane);
}
.badge--gray {
  background: var(--inw-status-sprzedane);
}

.btn-primary,
.btn-secondary,
.btn-ghost {
  display: inline-block;
  text-align: center;
  border-radius: 6px;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  text-decoration: none;
  transition:
    transform 0.15s ease,
    background-color 0.15s ease,
    box-shadow 0.15s ease;
  border: none;
}
.btn-primary {
  background: var(--inw-accent);
  color: #fff;
  padding: 12px 28px;
}
.btn-primary:hover {
  background: var(--inw-accent-dark);
  color: #fff;
}
.btn-secondary {
  background: var(--inw-text);
  color: #fff;
  width: 100%;
  padding: 10px 16px;
  margin-top: 16px;
}
.btn-ghost {
  background: transparent;
  color: var(--inw-text);
  border: 1px solid var(--inw-border);
  padding: 10px 20px;
}
.btn-ghost:hover {
  border-color: var(--inw-accent);
  color: var(--inw-accent);
}
.btn-sm {
  padding: 6px 14px;
  font-size: 13px;
}

/* Zabezpieczenie przed poziomym scrollem powodowanym przez pełnoszerokościowe sekcje
   (100vw bywa nieznacznie szersze niż widoczny obszar, jeśli jest pasek przewijania).
   Bezpieczne tu, bo ten plik CSS ładuje się wyłącznie na stronach modułu inwestycji. */
body {
  overflow-x: hidden;
}

/* ---------- Listing: baner nagłówkowy ---------- */
/*
 * #primary siedzi wewnątrz .ast-container Astry (boxed, wyśrodkowany, z paddingiem
 * na tle strony --ast-global-color-4). Dotąd tylko baner "wyłamywał się" poza ten
 * kontener — reszta modułu (filtry, siatka, CTA) zostawała w boksie, więc po bokach
 * było widać pasek tła strony w innym odcieniu niż tło sekcji modułu (odcięcie
 * kolorystyczne). Wyłamujemy cały moduł na pełną szerokość i nadajemy mu spójne,
 * ciągłe tło — poszczególne sekcje w środku nadal mają własny max-width, więc układ
 * się nie zmienia, znika tylko szew po bokach.
 */
.inwestycje-listing {
  display: block;
  position: relative;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
  width: 100vw;
  background: var(--inw-bg);
}
.inwestycje-banner {
  position: relative;
  width: 100%;
  min-height: 650px;
  display: flex;
  align-items: flex-end;
  overflow: hidden;
  margin-bottom: 40px;
}
.inwestycje-banner__img {
  position: absolute;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.inwestycje-banner__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    180deg,
    rgba(0, 0, 0, 0.68) 0%,
    rgba(0, 0, 0, 0.2) 42%,
    rgba(0, 0, 0, 0.55) 100%
  );
}
.inwestycje-banner__content {
  position: relative;
  z-index: 1;
  padding: 48px 40px 56px;
  max-width: 960px;
  width: 100%;
  margin: 0 auto;
}
.inwestycje-banner__content h1 {
  color: #fff;
  margin: 0 0 10px;
  /* Skala dopasowana do hero-nagłówków reszty strony (np. "Kim jestem?" na /omnie/:
     .uagb-ifb-title { font-size: 60px; text-transform: uppercase; line-height: 1em; }) */
  text-transform: uppercase;
  font-weight: 800;
  font-size: clamp(32px, 6vw, 60px);
  line-height: 1.05;
}
.inwestycje-banner__content p {
  color: rgba(255, 255, 255, 0.88);
  font-size: 17px;
  margin: 0;
  max-width: 635px;
}

@media (max-width: 768px) {
  .inwestycje-banner {
    min-height: 320px;
  }
  .inwestycje-banner__content {
    padding: 32px 20px 36px;
  }
}

/* ---------- Listing: kontener wyników (AJAX) ---------- */
#listing-wyniki {
  position: relative;
  transition: opacity 0.15s ease;
}
#listing-wyniki.is-loading {
  opacity: 0.45;
  pointer-events: none;
}

/* ---------- Listing: filtry ---------- */
.listing-filtry {
  background: var(--inw-bg-section);
  border-radius: 12px;
  padding: 24px;
  margin: 0 24px 40px;
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
}
.filtry-toggle-mobile {
  display: none;
  width: 100%;
  background: #fff;
  color: var(--inw-text);
  border: 1px solid var(--inw-border);
  border-radius: 6px;
  padding: 12px 16px;
  font-weight: 400;
  text-align: left;
  cursor: pointer;
}
.filtry-grid {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 24px;
}
.filtr-grupa {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.filtr-grupa label {
  text-transform: uppercase;
  font-size: 11px;
  letter-spacing: 0.08em;
  color: var(--inw-text-muted);
  font-weight: 600;
}
.toggle-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.toggle-buttons button {
  background: #fff;
  border: 1px solid var(--inw-border);
  border-radius: 999px;
  padding: 7px 14px;
  font-size: 13px;
  cursor: pointer;
  color: var(--inw-text);
  transition: all 0.15s ease;
}
.toggle-buttons button.active,
.toggle-buttons button:hover {
  background: var(--inw-accent);
  border-color: var(--inw-accent);
  color: #fff;
}
.cena-inputs {
  display: flex;
  gap: 8px;
}
.cena-inputs input,
.filtr-grupa input[type='number'] {
  width: 100px;
  padding: 8px 10px;
  border: 1px solid var(--inw-border);
  border-radius: 6px;
  font-size: 14px;
}
.filtry-akcje {
  display: flex;
  gap: 12px;
  align-items: center;
  margin-left: auto;
}

/* ---------- Listing: siatka kart ---------- */
.listing-siatka {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 24px 40px;
}
.karty-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
  align-items: stretch;
}

/* ---------- Cross-sell: slider poziomy (scroll-snap) ---------- */
.crosssell-slider {
  position: relative;
}
.karty-grid--small {
  display: flex;
  gap: 24px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  padding: 4px 4px 12px;
  margin: 0 -4px;
}
.karty-grid--small::-webkit-scrollbar {
  display: none;
}
.karty-grid--small .nieruchomosc-karta {
  flex: 0 0 calc((100% - 2 * 24px) / 3);
  scroll-snap-align: start;
}
.crosssell-arrow {
  /* Domyślnie ukryte — JS pokazuje je (.is-scrollable) tylko, gdy karty
     faktycznie nie mieszczą się w widoku i jest co przewijać. */
  display: none;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 2;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: 1px solid var(--inw-border);
  background: #fff;
  color: var(--inw-text);
  font-size: 22px;
  line-height: 1;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
  transition:
    background-color 0.15s ease,
    color 0.15s ease,
    border-color 0.15s ease;
}
.crosssell-slider.is-scrollable .crosssell-arrow {
  display: flex;
}
.crosssell-arrow:hover {
  background: var(--inw-accent);
  color: #fff;
  border-color: var(--inw-accent);
}
.crosssell-arrow--prev {
  left: -22px;
}
.crosssell-arrow--next {
  right: -22px;
}

.nieruchomosc-karta {
  background: #fff;
  border-radius: 10px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
  overflow: hidden;
  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease;
  height: 100%;
}
.nieruchomosc-karta:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.12);
}
.karta-link {
  display: flex;
  flex-direction: column;
  height: 100%;
  color: inherit;
  text-decoration: none;
}
.karta-zdjecie {
  position: relative;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: var(--inw-bg-section);
}
.karta-zdjecie img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.karta-zdjecie .badge {
  position: absolute;
  top: 12px;
  right: 12px;
}
.karta-tresc {
  padding: 20px;
  display: flex;
  flex-direction: column;
  flex-grow: 1;
}
.karta-typ {
  text-transform: uppercase;
  font-size: 11px;
  letter-spacing: 0.08em;
  color: var(--inw-text-muted);
  font-weight: 600;
}
.karta-tytul {
  font-family: 'Poppins', sans-serif;
  font-size: 18px;
  font-weight: 600;
  margin: 6px 0 4px;
}
.karta-adres {
  color: var(--inw-text-muted);
  font-size: 14px;
  margin: 0 0 14px;
}
.karta-parametry {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  font-size: 14px;
  color: var(--inw-text-muted);
  margin-bottom: 14px;
}
.karta-parametry span {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.karta-parametr-etykieta {
  color: var(--inw-text);
  font-weight: 600;
}
.karta-cena {
  margin-top: auto;
}
.cena-wartosc {
  font-size: 20px;
  font-weight: 700;
}
.cena-zapytaj {
  color: var(--inw-text-muted);
  font-style: italic;
}

/* ---------- Paginacja ---------- */
.paginacja {
  display: flex;
  justify-content: center;
  gap: 6px;
  margin-top: 40px;
}
.paginacja .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 36px;
  height: 36px;
  border-radius: 6px;
  border: 1px solid var(--inw-border);
  color: var(--inw-text);
  text-decoration: none;
  font-size: 14px;
}
.paginacja .page-numbers.current {
  background: var(--inw-accent);
  border-color: var(--inw-accent);
  color: #fff;
}

/* ---------- Brak wyników ---------- */
.listing-brak {
  text-align: center;
  padding: 60px 24px;
  max-width: 600px;
  margin: 0 auto 40px;
}
.listing-brak p {
  color: var(--inw-text-muted);
  margin-bottom: 16px;
}

/* ---------- CTA baner ---------- */
.listing-cta-baner {
  position: relative;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
  width: 100vw;
  background: var(--inw-text);
  color: #fff;
  text-align: center;
  padding: 56px 24px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
}
.listing-cta-baner p {
  font-size: 20px;
  max-width: 560px;
  margin: 0;
}

/*
 * Tak jak na listingu: #primary siedzi wewnątrz boksowanego .ast-container Astry
 * (tło strony --ast-global-color-4). .inwestycja-szczegoly jest jeszcze węższy
 * (max-width:1100 vs 1300 kontenera), więc po bokach widać było pasek tła strony
 * w innym odcieniu niż karty modułu (--inw-bg-section). Dokładamy pełnoszerokościowe
 * tło pseudoelementem, żeby cała wysokość podstrony miała spójny kolor za treścią —
 * sama treść zostaje wyśrodkowana jak dotychczas.
 */
.inwestycja-szczegoly {
  position: relative;
  z-index: 0;
  max-width: 1100px;
  margin: 0 auto;
  padding: 32px 24px 80px;
}
.inwestycja-szczegoly::before {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
  width: 100vw;
  z-index: -1;
  background: var(--inw-bg);
}
.breadcrumb {
  font-size: 13px;
  color: var(--inw-text-muted);
  margin-bottom: 24px;
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.breadcrumb a {
  color: var(--inw-text-muted);
  text-decoration: none;
}
.breadcrumb a:hover {
  color: var(--inw-accent);
}

/* ---------- Single: header + cena ---------- */
.szczegoly-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 24px;
  margin-bottom: 32px;
  padding-bottom: 24px;
  border-bottom: 1px solid var(--inw-border);
}
.header-lewa {
  display: flex;
  flex-direction: column;
  gap: 12px;
  flex: 1 1 auto;
  min-width: 0;
}
.header-lewa h1 {
  margin: 0;
}
.header-lewa .badge {
  align-self: flex-start;
}
.header-prawa {
  text-align: right;
  display: flex;
  flex-direction: column;
  gap: 4px;
  flex-shrink: 0;
}
.cena-glowna {
  font-size: 32px;
  font-weight: 700;
}
.cena-m2 {
  color: var(--inw-text-muted);
  font-size: 14px;
}
.cena-data {
  color: var(--inw-text-muted);
}

/* ---------- Single: galeria ---------- */
.szczegoly-galeria {
  margin-bottom: 40px;
}
.galeria-glowna {
  border-radius: 10px;
  overflow: hidden;
  aspect-ratio: 16 / 9;
}
.galeria-glowna img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  cursor: zoom-in;
}
.galeria-miniatury {
  display: flex;
  gap: 10px;
  margin-top: 10px;
  overflow-x: auto;
  padding-bottom: 4px;
}
.galeria-miniatury img {
  width: 96px;
  height: 72px;
  object-fit: cover;
  border-radius: 6px;
  cursor: pointer;
  flex-shrink: 0;
}

/* ---------- Single: kafle parametrów ---------- */
.szczegoly-parametry {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  gap: 12px;
  margin-bottom: 40px;
}
.kafel {
  background: var(--inw-bg-section);
  border-radius: 10px;
  padding: 18px 12px;
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.kafel-wartosc {
  font-size: 18px;
  font-weight: 700;
}
.kafel-label {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--inw-text-muted);
}

/* ---------- Single: opis ---------- */
.szczegoly-opis {
  max-width: 100%;
  line-height: 1.7;
  margin-bottom: 48px;
}
.szczegoly-opis h3 {
  margin-bottom: 30px;
}

/* ---------- Single: tabela cenowa ---------- */
.szczegoly-ceny {
  margin-bottom: 48px;
}
.ceny-tabela {
  width: 100%;
  border-collapse: collapse;
}
.ceny-tabela tr:nth-child(odd) {
  background: #ffffff;
}
.ceny-tabela tr:nth-child(even) {
  background: #f9f9f9;
}
.ceny-tabela th,
.ceny-tabela td {
  text-align: left;
  padding: 12px 16px;
  font-weight: 400;
}
.ceny-tabela th {
  color: var(--inw-text-muted);
  font-weight: 500;
  width: 40%;
}
.ceny-tabela .wiersz-glowny th,
.ceny-tabela .wiersz-glowny td {
  font-weight: 700;
  font-size: 17px;
}

/* ---------- Single: dokumenty ---------- */
.szczegoly-dokumenty {
  margin-bottom: 48px;
}
.dokumenty-lista {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.dokumenty-lista li {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 18px;
  background: var(--inw-bg-section);
  border-radius: 8px;
}
.dok-nazwa {
  flex-grow: 1;
}

/* ---------- Single: dane dewelopera (ustawa deweloperska) ---------- */
.szczegoly-prawne {
  margin-bottom: 48px;
}

/* ---------- Single: rzut lokalu ---------- */
.szczegoly-rzut {
  margin-bottom: 48px;
}
.szczegoly-rzut img {
  width: 100%;
  max-height: 500px;
  object-fit: contain;
  border-radius: 10px;
  background: var(--inw-bg-section);
  cursor: zoom-in;
}
.szczegoly-rzut .btn-ghost {
  margin-top: 14px;
}

/* ---------- Single: mapa ---------- */
.szczegoly-mapa {
  margin-bottom: 48px;
}
.mapa-ramka {
  border-radius: 10px;
  overflow: hidden;
  background: var(--inw-bg-section);
  line-height: 0;
}
.mapa-ramka iframe {
  display: block;
  width: 100%;
  height: 400px;
}
.mapa-adres {
  font-weight: 600;
  margin-top: 12px;
}

/* ---------- Single: formularz kontaktowy ---------- */
.szczegoly-kontakt {
  margin-bottom: 56px;
}
.kontakt-grid {
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: 48px;
}
.kontakt-formularz-brak {
  color: var(--inw-text-muted);
  background: var(--inw-bg-section);
  padding: 20px;
  border-radius: 8px;
}

/* WPForms — dopasowanie do stylu modułu (nadpisuje domyślne style wtyczki) */
.kontakt-formularz .wpforms-form,
.kontakt-formularz .wpforms-field-container,
.kontakt-formularz .wpforms-field {
  width: 100% !important;
  max-width: 100% !important;
}
.kontakt-formularz .wpforms-field {
  padding: 0 0 8px !important;
}

/* Placeholdery zamiast labeli nad polami — etykieta zostaje w DOM tylko dla czytników ekranu. */
.kontakt-formularz .wpforms-field-name .wpforms-field-label,
.kontakt-formularz .wpforms-field-text .wpforms-field-label,
.kontakt-formularz .wpforms-field-email .wpforms-field-label,
.kontakt-formularz .wpforms-field-textarea .wpforms-field-label,
.kontakt-formularz .wpforms-field-gdpr-checkbox > .wpforms-field-label {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.kontakt-formularz input[type='text'],
.kontakt-formularz input[type='email'],
.kontakt-formularz input[type='tel'],
.kontakt-formularz textarea,
.kontakt-formularz select {
  display: block;
  width: 100% !important;
  max-width: 100% !important;
  border: 1px solid var(--inw-border) !important;
  border-radius: 6px !important;
  padding: 10px 12px !important;
  font-size: 15px !important;
  font-family: 'Poppins', sans-serif !important;
  color: var(--inw-text) !important;
  background: #fff !important;
  box-shadow: none !important;
  transition: border-color 0.15s ease;
}
.kontakt-formularz input[type='text']::placeholder,
.kontakt-formularz input[type='email']::placeholder,
.kontakt-formularz textarea::placeholder {
  color: var(--inw-text-muted);
  opacity: 1;
}
.kontakt-formularz input[type='text']:focus,
.kontakt-formularz input[type='email']:focus,
.kontakt-formularz textarea:focus {
  border-color: var(--inw-accent) !important;
  outline: none !important;
}
.kontakt-formularz textarea {
  min-height: 100px;
  resize: vertical;
}
.kontakt-formularz .wpforms-field-gdpr-checkbox ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.kontakt-formularz .wpforms-field-gdpr-checkbox input[type='checkbox'] {
  margin-right: 8px;
  accent-color: var(--inw-accent);
}
.kontakt-formularz .wpforms-field-gdpr-checkbox label {
  font-size: 13px !important;
  font-weight: 400 !important;
  color: var(--inw-text-muted) !important;
  line-height: 1.5;
}
.kontakt-formularz .inw-hidden-field {
  display: none !important;
}
.kontakt-formularz .wpforms-submit {
  background: var(--inw-accent) !important;
  border: none !important;
  color: #fff !important;
  font-family: 'Poppins', sans-serif !important;
  font-weight: 600 !important;
  font-size: 15px !important;
  border-radius: 6px !important;
  padding: 12px 28px !important;
  cursor: pointer;
  transition: background-color 0.15s ease;
}
.kontakt-formularz .wpforms-submit:hover {
  background: var(--inw-accent-dark) !important;
}
.kontakt-formularz .wpforms-confirmation-container-full {
  background: var(--inw-bg-section) !important;
  border-radius: 8px !important;
  padding: 20px !important;
  color: var(--inw-text) !important;
  border: none !important;
}
.kontakt-formularz .wpforms-error,
.kontakt-formularz label.wpforms-error {
  color: #b3261e !important;
  font-size: 13px !important;
}
.kontakt-dane {
  background: var(--inw-bg-section);
  border-radius: 10px;
  padding: 24px;
  height: max-content;
}
.kontakt-dane h3 {
  margin-bottom: 15px;
  font-size: 20px;
  font-weight: 600;
}
.kontakt-wiersz {
  display: flex;
  flex-direction: column;
  gap: 2px;
  margin-bottom: 14px;
}
.kontakt-wiersz:last-child {
  margin-bottom: 0;
}
.kontakt-dane a {
  color: var(--inw-text);
  text-decoration: none;
}
.kontakt-dane a:hover {
  color: var(--inw-accent);
}
.kontakt-etykieta {
  font-weight: 600;
  color: var(--inw-text);
}

/* ---------- Single: cross-sell ---------- */
.szczegoly-crosssell {
  text-align: center;
}
.szczegoly-crosssell .karty-grid {
  text-align: left;
  margin-bottom: 28px;
}

/* ---------- Responsywność ---------- */
@media (max-width: 1200px) {
  .karty-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .karty-grid--small .nieruchomosc-karta {
    flex-basis: calc((100% - 24px) / 2);
  }
}

@media (max-width: 960px) {
  /* Mobile/tablet: karty przewija się gestem (swipe), bez strzałek. */
  .crosssell-slider.is-scrollable .crosssell-arrow {
    display: none;
  }
}

@media (max-width: 900px) {
  .szczegoly-header {
    flex-direction: column;
  }
  .header-prawa {
    text-align: left;
  }
  .kontakt-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 768px) {
  .karty-grid {
    grid-template-columns: 1fr;
  }
  .karty-grid--small .nieruchomosc-karta {
    flex-basis: 85%;
  }

  .filtry-toggle-mobile {
    display: block;
  }
  #filtry-inwestycji {
    display: none;
  }
  #filtry-inwestycji.is-open {
    display: block;
    margin-top: 16px;
  }
  .filtry-grid {
    flex-direction: column;
    align-items: stretch;
  }
  .filtry-akcje {
    margin-left: 0;
  }

  .listing-cta-baner p {
    font-size: 17px;
  }
}

/* ---------- Dark mode: zachowaj czytelność (strona nie ma trybu ciemnego, ale zabezpieczenie na wszelki wypadek) ---------- */
@media (prefers-color-scheme: dark) {
  .inwestycje-listing,
  .inwestycja-szczegoly {
    background: #fff;
  }
}