/* ============================================================
   KATALOG WYJAZDÓW — układ v3

   Projekt graficzny obejmował wyłącznie stronę główną, więc katalog jest
   złożony z komponentów, które grafik już rozstrzygnął. Ten arkusz dokłada
   tylko to, czego na stronie głównej nie było: nagłówek kategorii,
   pasek filtrów i stan pustej listy. Reszta (karta, pasek zakładek,
   pigułki, siatka, sekcja kontaktu) jedzie na home-v3.css.
   ============================================================ */

/* ---- nagłówek kategorii -----------------------------------------------
   Ta sama konstrukcja co hero na stronie głównej: zdjęcie na całą szerokość,
   treść w kolumnie 1269 px, podarta krawędź na styku z bielą i logo pod nią.
   Niższy, bo nie ma tu wyszukiwarki ani wycinanki postaci. */
.v3-kat-hero {
  position: relative;
  z-index: 2;
  min-height: max(26vw, 400px);
  display: flex;
  align-items: flex-end;
  padding-block: clamp(7rem, 12vw, 15rem) clamp(3.5rem, 6.5vw, 8rem);
  color: #fff;
  background: var(--v3-deep-2);
  isolation: isolate;
}
.v3-kat-hero__media { position: absolute; inset: 0; z-index: -1; overflow: hidden; }
.v3-kat-hero__media img { width: 100%; height: 100%; object-fit: cover; }
/* Zdjęcia nagłówków są wygradowane pod jasny tekst u dołu po lewej,
   ale kategorie z własną grafiką z panelu mogą być dowolnie jasne —
   stąd delikatne przyciemnienie, którego hero na stronie głównej nie ma. */
.v3-kat-hero__media::after {
  content: "";
  position: absolute;
  inset: 0;
  /* Dwa przyciemnienia: poziome pod kolumnę tekstu i pionowe pod pasek menu.
     Zdjęcia kategorii wgrywa klient, więc muszą znieść też jasny, kontrastowy
     kadr — sam gradient poziomy nie wystarczał na zaśnieżonym stoku. */
  background:
    linear-gradient(100deg, rgba(0, 16, 13, 0.78) 0%, rgba(0, 16, 13, 0.5) 42%, rgba(0, 16, 13, 0.16) 100%),
    linear-gradient(180deg, rgba(0, 16, 13, 0.45) 0%, rgba(0, 16, 13, 0) 30%);
}
.v3-kat-hero__inner { position: relative; z-index: 1; width: 100%; }

.v3-kat-hero__powrot {
  display: inline-flex;
  align-items: center;
  gap: 0.7rem;
  font-size: clamp(11px, 0.73vw, 14px);
  color: rgba(255, 255, 255, 0.82);
  margin-bottom: clamp(1rem, 1.8vw, 2.2rem);
  transition: color 0.25s;
}
.v3-kat-hero__powrot:hover { color: var(--v3-mint); }
.v3-strzalka--wstecz { transform: scaleX(-1); }
.v3-kat-hero__powrot:hover .v3-strzalka--wstecz { transform: scaleX(-1) translateX(3px); }

.v3-kat-hero .v3-eyebrow { margin-bottom: clamp(0.4rem, 0.73vw, 0.9rem); }
.v3-kat-hero__tytul {
  font-family: var(--v3-font-display);
  font-weight: 700;
  font-size: clamp(32px, 3.44vw, 66px);
  line-height: 1.06;
  letter-spacing: -0.015em;
  color: #fff;
  margin: 0;
}
.v3-kat-hero__licznik {
  margin: clamp(0.8rem, 1.25vw, 1.5rem) 0 0;
  font-size: clamp(12px, 0.83vw, 16px);
  color: rgba(255, 255, 255, 0.85);
}
.v3-kat-hero__licznik .result-count {
  font-family: var(--v3-font-ui);
  font-size: inherit;
  letter-spacing: 0;
  text-transform: none;
  color: rgba(255, 255, 255, 0.85);
}
.v3-kat-hero__licznik b { font-family: var(--v3-font-display); font-weight: 700; color: var(--v3-mint); }
.v3-kat-hero__lead {
  margin-top: clamp(0.8rem, 1.15vw, 1.4rem);
  max-width: 34em;
  font-size: clamp(12px, 0.83vw, 16px);
  line-height: 1.62;
  color: rgba(255, 255, 255, 0.85);
}

/* ---- pas filtrów ------------------------------------------------------- */
.v3-kat-filtry {
  position: relative;
  z-index: 1;
  padding-block: clamp(1.6rem, 2.9vw, 3.5rem) clamp(1rem, 1.8vw, 2.2rem);
}
/* Zakładki zasięgu: dokładnie ta sama tafla co „Sprawdź te wyjazdy". */
.v3-kat-zasieg { margin-bottom: clamp(1rem, 1.56vw, 1.9rem); }
.v3-kat-zasieg .v3-taby__wiecej { color: var(--v3-ink); }

/* Pigułki filtrów w języku wyszukiwarki z hero. Znaczniki generuje
   `sielana_render_filters()`, więc nadpisujemy jego klasy (.chip, .fselect,
   .label) zamiast przepisywać szablon i ryzykować rozjazd z silnikiem. */
.v3-katalog .filters {
  position: static;                 /* przyklejony pasek zasłaniał podarcie */
  background: none;
  backdrop-filter: none;
  border-bottom: 0;
  padding-block: 0;
  z-index: 1;
}
.v3-katalog .filters .wrap { max-width: min(1269px, 66.1vw); padding-inline: 0; }
.v3-katalog .filters-panel-head { display: none; }
.v3-katalog .filters-row {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: clamp(0.9rem, 1.56vw, 1.9rem) clamp(1.1rem, 2.19vw, 2.6rem);
}
.v3-katalog .filter-group { display: grid; gap: 0.55rem; }

/* Etykieta grupy: Bricolage Bold zamiast mono w wersalikach. */
.v3-katalog .filter-group > .label {
  font-family: var(--v3-font-display);
  font-size: clamp(11px, 0.68vw, 13px);
  font-weight: 700;
  text-transform: none;
  letter-spacing: 0;
  color: var(--v3-ink);
  padding-left: 0;
}

/* Plakietki wyboru. Stan aktywny silnik oznacza i klasą, i atrybutem. */
.v3-katalog .chips { gap: 0.4rem; }
.v3-katalog .chip {
  font-family: var(--v3-font-ui);
  font-size: clamp(11px, 0.68vw, 13px);
  font-weight: 500;
  text-transform: none;
  letter-spacing: 0;
  color: var(--v3-ink);
  background: #fff;
  border: 1px solid var(--v3-line-2);
  border-radius: 100px;
  padding: 0.62em 1.15em;
  transition: background 0.2s, border-color 0.2s, color 0.2s;
}
.v3-katalog .chip:hover { border-color: var(--v3-ink); color: var(--v3-ink); }
.v3-katalog .chip.is-active,
.v3-katalog .chip[aria-pressed="true"] {
  background: var(--v3-mint);
  border-color: var(--v3-mint);
  color: var(--v3-ink);
  font-weight: 700;
}

/* Pola wyboru i daty w kształcie pigułek z wyszukiwarki. */
.v3-katalog .fselect,
.v3-katalog .filters input[type="date"],
.v3-katalog .filters input[type="number"] {
  font-family: var(--v3-font-ui);
  font-size: clamp(11px, 0.73vw, 14px);
  font-weight: 500;
  text-transform: none;
  letter-spacing: 0;
  color: var(--v3-ink);
  background-color: #fff;
  border: 1px solid var(--v3-line-2);
  border-radius: 100px;
  padding: 0.62em 2.2em 0.62em 1.1em;
  min-height: 38px;
}
.v3-katalog .filters input[type="date"],
.v3-katalog .filters input[type="number"] { padding-right: 1.1em; }
.v3-katalog .filters input[type="range"] { accent-color: var(--v3-mint); width: min(260px, 100%); }
.v3-katalog .filters label { font-size: clamp(11px, 0.68vw, 13px); color: var(--v3-ink); }

.v3-katalog .filters-more,
.v3-katalog .filters-toggle,
.v3-katalog #clearFilters {
  font-family: var(--v3-font-display);
  font-weight: 700;
  font-size: clamp(11px, 0.68vw, 13px);
  text-transform: none;
  letter-spacing: 0;
  color: var(--v3-ink);
  margin-top: clamp(0.8rem, 1.15vw, 1.4rem);
}
.v3-katalog .filters-more:hover,
.v3-katalog #clearFilters:hover { color: var(--v3-orange); }
.v3-katalog .filters-row--zaawansowane {
  margin-top: clamp(0.8rem, 1.35vw, 1.6rem);
  padding-top: clamp(0.9rem, 1.35vw, 1.6rem);
  border-top: 1px solid var(--v3-line-2);
}
/* Zwinięte filtry muszą zostać zwinięte: `display: flex` wyżej wygrywało
   z regułą [hidden] z arkusza bazowego i cały panel otwierał się na starcie. */
.v3-katalog .filters-row[hidden],
.v3-katalog .filter-group[hidden] { display: none; }

/* ---- lista ------------------------------------------------------------- */
.v3-kat-lista {
  position: relative;
  z-index: 1;
  padding-block: clamp(0.5rem, 1.15vw, 1.4rem) clamp(3rem, 5.7vw, 6.9rem);
}
/* Sprzedane wyjazdy zostają w siatce, ale nie udają dostępnych. */
.v3-kat-lista .card--sold { opacity: 0.55; }

.v3-kat-pusto {
  text-align: center;
  padding-block: clamp(3rem, 6.25vw, 7.5rem);
  display: grid;
  justify-items: center;
  gap: clamp(0.8rem, 1.25vw, 1.5rem);
}
.v3-kat-pusto p { font-size: clamp(12px, 0.83vw, 16px); color: var(--v3-ink-2); margin: 0; max-width: 34em; }

/* ---- stronicowanie ----------------------------------------------------- */
.v3-kat-strony { margin-top: clamp(2rem, 3.5vw, 4.2rem); }
.v3-kat-strony .nav-links { display: flex; justify-content: center; flex-wrap: wrap; gap: 0.4rem; }
.v3-kat-strony .page-numbers {
  display: grid;
  place-items: center;
  min-width: 42px;
  height: 42px;
  padding-inline: 0.9em;
  border-radius: 100px;
  font-family: var(--v3-font-display);
  font-weight: 700;
  font-size: clamp(12px, 0.73vw, 14px);
  color: var(--v3-ink);
  background: #fff;
  border: 1px solid var(--v3-line-2);
  transition: background 0.2s, border-color 0.2s;
}
.v3-kat-strony .page-numbers:hover { border-color: var(--v3-ink); }
.v3-kat-strony .page-numbers.current { background: var(--v3-mint); border-color: var(--v3-mint); }

/* ---- responsywność ----------------------------------------------------- */
@media (max-width: 1100px) {
  .v3-kat-hero { min-height: 0; padding-block: clamp(6rem, 18vw, 9rem) clamp(2.5rem, 7vw, 4rem); }
  .v3-kat-lista .v3-oferty__grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 900px) {
  .v3-kat-hero { padding-block: 7rem 2.5rem; }
  .v3-kat-filtry .filters-row { gap: 1rem; }
}

@media (max-width: 640px) {
  .v3-kat-lista .v3-oferty__grid { grid-template-columns: 1fr; }
  .v3-kat-zasieg { flex-wrap: wrap; }
}