/* Karuzela + podgląd pełnoekranowy. Kolory z tokenów strony (z wartościami awaryjnymi). */
.car { position: relative; }
.car__track {
  display: flex; gap: var(--car-gap, 1rem);
  overflow-x: auto; overscroll-behavior-x: contain;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  padding-bottom: .25rem;
}
.car__track::-webkit-scrollbar { display: none; }
.car__slide {
  flex: 0 0 var(--car-w, 78%);
  scroll-snap-align: start;
  margin: 0;
}
.car__slide button {
  display: block; width: 100%; padding: 0; border: 0; background: none; cursor: zoom-in;
  aspect-ratio: var(--car-ratio, 3 / 4); overflow: hidden;
}
.car__slide img { width: 100%; height: 100%; object-fit: cover; }
.car__slide figcaption { margin-top: .6rem; font-size: .9375rem; line-height: 1.4; }
.car__ctrl { display: flex; align-items: center; gap: .5rem; }
.car__ctrl button {
  width: 2.75rem; height: 2.75rem; border-radius: 50%;
  border: 1.5px solid currentColor; background: none; color: inherit;
  font-size: 1.5rem; line-height: 1; cursor: pointer;
}
.car__ctrl button:disabled { opacity: .3; cursor: default; }
.car__count { font-variant-numeric: tabular-nums; min-width: 5.5rem; text-align: center; }

/* Podgląd pełnoekranowy */
.lb-open { overflow: hidden; }
.lb {
  width: 100vw; height: 100dvh; max-width: none; max-height: none;
  margin: 0; padding: 0; border: 0;
  background: #0E1113; color: #fff;
}
.lb::backdrop { background: #0E1113; }
.lb__bar {
  position: absolute; top: 0; left: 0; right: 0; z-index: 2;
  display: flex; justify-content: space-between; align-items: center;
  padding: .75rem 1rem;
}
.lb__count { font-variant-numeric: tabular-nums; font-size: .9375rem; opacity: .85; }
.lb__close {
  width: 2.75rem; height: 2.75rem; border: 0; border-radius: 50%;
  background: rgba(255,255,255,.12); color: #fff; font-size: 1.75rem; line-height: 1; cursor: pointer;
}
.lb__track {
  display: flex; height: 100%;
  overflow-x: auto; scroll-snap-type: x mandatory; overscroll-behavior: contain;
  scrollbar-width: none;
}
.lb__track::-webkit-scrollbar { display: none; }
.lb__slide {
  flex: 0 0 100%; height: 100%; margin: 0;
  scroll-snap-align: center;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  padding: 3.75rem 1rem 1rem;
}
.lb__slide img { max-width: 100%; max-height: calc(100% - 3rem); object-fit: contain; }
.lb__slide figcaption { margin-top: .75rem; font-size: 1rem; text-align: center; max-width: 40rem; }
.lb__nav {
  position: absolute; top: 50%; transform: translateY(-50%); z-index: 2;
  width: 3rem; height: 3rem; border: 0; border-radius: 50%;
  background: rgba(255,255,255,.12); color: #fff; font-size: 2rem; line-height: 1; cursor: pointer;
}
.lb__nav--prev { left: 1rem; }
.lb__nav--next { right: 1rem; }
@media (hover: none) and (max-width: 40rem) { .lb__nav { display: none; } }
.car :focus-visible { outline: 3px solid var(--focus, #10303B); outline-offset: 3px; }
.lb :focus-visible { outline: 3px solid #EE6A1F; outline-offset: 3px; }

/* Ukrywanie przez filtr */
.car__slide[hidden], .lb__slide[hidden], .lb__nav[hidden] { display: none; }

/* Filtry kategorii – prawdziwe przyciski */
.chips { display: flex; flex-wrap: wrap; gap: .5rem; margin: 0 0 1.5rem; padding: 0; list-style: none; }
.chips button {
  font: inherit; font-size: .9375rem; font-weight: 600;
  min-height: 2.75rem; padding: .45rem 1rem; border-radius: 999px; cursor: pointer;
  border: 1.5px solid var(--chip-line, rgba(0,0,0,.25)); background: transparent; color: inherit;
}
.chips button:hover { border-color: currentColor; }
.chips button[aria-pressed="true"] { background: var(--chip-on-bg, #1E4A5A); border-color: var(--chip-on-bg, #1E4A5A); color: var(--chip-on-fg, #fff); }

/* Pływający przycisk „Zadzwoń” (telefon) */
.callbar { display: none; }
@media (max-width: 40rem) {
  .callbar {
    display: flex; align-items: center; justify-content: center; gap: .6rem;
    position: fixed; left: .75rem; right: .75rem; bottom: calc(.75rem + env(safe-area-inset-bottom)); z-index: 30;
    min-height: 3.5rem; border-radius: 12px;
    background: var(--call-bg, #EE6A1F); color: var(--call-fg, #23282B);
    font-weight: 800; font-size: 1.15rem; text-decoration: none;
    box-shadow: 0 10px 28px rgba(16,48,59,.35), 0 2px 6px rgba(16,48,59,.25);
    transform: translateY(calc(100% + 1.5rem)); opacity: 0; pointer-events: none; visibility: hidden;
    transition: transform .25s ease, opacity .2s ease, visibility 0s linear .25s;
  }
  .callbar.is-shown { transform: none; opacity: 1; pointer-events: auto; visibility: visible; transition-delay: 0s; }
  .callbar:focus-visible { outline: 3px solid #10303B; outline-offset: 3px; }
  .callbar svg { width: 1.2rem; height: 1.2rem; fill: currentColor; }
}
@media (prefers-reduced-motion: reduce) { .callbar { transition: none; } }

/* Przeciąganie myszką */
@media (hover: hover) and (pointer: fine) {
  .car__track { cursor: grab; }
  .car__slide button { cursor: grab; }
  .car__track.is-dragging { scroll-snap-type: none; cursor: grabbing; user-select: none; }
  .car__track.is-dragging .car__slide button { cursor: grabbing; }
}

/* Znacznik „powiększ” na zdjęciu */
.car__slide button { position: relative; }
.car__zoom {
  position: absolute; right: .6rem; top: .6rem;
  display: grid; place-items: center; width: 2.25rem; height: 2.25rem; border-radius: 50%;
  background: rgba(16,48,59,.78); color: #fff; opacity: 0; transition: opacity .15s;
}
.car__zoom svg { width: 1.1rem; height: 1.1rem; }
.car__slide button:hover .car__zoom, .car__slide button:focus-visible .car__zoom { opacity: 1; }
.car__track.is-dragging .car__zoom { opacity: 0; }
@media (hover: none) { .car__zoom { opacity: 1; } }
