html:not(.js) [data-rz-js] { display: none !important; }
#realizacje.row { width: 100%; max-width: none; padding-left: var(--gutter); padding-right: var(--gutter); }
.rz { --rz-gap: 1rem; display: grid; gap: 1.5rem; overflow-anchor: none; }
.rz [data-kat="druk"]      { --rz-kat: var(--cyan); }
.rz [data-kat="szyldy"]    { --rz-kat: var(--magenta); }
.rz [data-kat="uv"]        { --rz-kat: var(--yellow); }
.rz [data-kat="cnc"]       { --rz-kat: var(--magenta); }
.rz [data-kat="oklejanie"] { --rz-kat: #000; }
.rz [data-kat="montaz"]    { --rz-kat: var(--cyan); }
.rz [data-kat="przyczepy"] { --rz-kat: var(--yellow); }
.rz [data-kat="indywidualne"] { --rz-kat: var(--magenta); }
.rz-filtry { display: flex; flex-wrap: wrap; gap: .625rem; margin: 0; padding: 0; list-style: none; }
.rz-filtr {
  display: inline-flex; align-items: center; gap: .55rem;
  min-height: 2.75rem; padding: .55rem 1.1rem;
  background: rgba(6, 8, 12, .35); color: var(--text);
  border: 1.5px solid rgba(255, 255, 255, .45); border-radius: 999px;
  font: 500 .9375rem/1.2 var(--body); text-shadow: none; cursor: pointer;
  transition: border-color .15s, background-color .15s, color .15s;
}
.rz-filtr:hover { border-color: var(--text); background: rgba(255, 255, 255, .1); }
.rz-filtr[aria-pressed="true"] { background: var(--text); border-color: var(--text); color: #06080C; }
.rz-filtr[data-kat]::before {
  content: ""; width: .6rem; height: .6rem; border-radius: 50%; flex: none;
  background: var(--rz-kat); box-shadow: 0 0 0 1.5px rgba(255, 255, 255, .6);
}
.rz-filtr[aria-pressed="true"][data-kat]::before { box-shadow: 0 0 0 1.5px rgba(6, 8, 12, .35); }
.rz-siatka {
  --rz-start: 6; --rz-krok: 6;
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.75rem var(--rz-gap);
  margin: 0; padding: 0; list-style: none;
}
.rz-element { display: grid; gap: .6rem; align-content: start; min-width: 0; }
.rz-kafel {
  display: block; width: 100%; padding: 0; border: 0; border-radius: 10px; overflow: hidden;
  background: rgba(255, 255, 255, .06); cursor: zoom-in;
}
.rz-kafel img {
  display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover;
  transition: transform .35s ease;
}
.rz-kafel:hover img { transform: scale(1.035); }
.rz-kafel:focus-visible { outline: 3px solid var(--cyan); outline-offset: 3px; }
.rz-podpis {
  position: relative; padding-left: .8rem;
  font-size: .9375rem; line-height: 1.4; color: var(--text); text-wrap: pretty;
}
.rz-podpis::before {
  content: ""; position: absolute; left: 0; top: .2em; bottom: .2em; width: 3px; border-radius: 2px;
  background: var(--rz-kat);
}
.rz-element[data-kat="oklejanie"] .rz-podpis::before { box-shadow: 0 0 0 1px rgba(255, 255, 255, .55); }
.rz-akcje { display: flex; flex-wrap: wrap; gap: .75rem; }
.rz-akcje[hidden] { display: none; }
.rz-przycisk {
  min-height: 2.75rem; padding: .55rem 1.25rem;
  background: transparent; color: var(--text);
  border: 1.5px solid rgba(255, 255, 255, .55); border-radius: 999px;
  font: 500 .9375rem/1 var(--body); text-shadow: none; cursor: pointer;
  transition: border-color .15s, background-color .15s;
}
.rz-przycisk:hover { border-color: var(--text); background: rgba(255, 255, 255, .1); }
.rz-sr { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.rz-podglad {
  position: fixed; inset: 0; width: 100%; max-width: none; height: 100%; max-height: none;
  margin: 0; padding: 0; border: 0; background: rgba(6, 8, 12, .94); color: var(--text);
  overscroll-behavior: contain;
}
.rz-podglad::backdrop { background: rgba(6, 8, 12, .6); }
.rz-podglad[open] {
  display: grid; grid-template-columns: 4.5rem minmax(0, 1fr) 4.5rem; grid-template-rows: 4.5rem minmax(0, 1fr) auto;
}
.rz-scena { grid-column: 2; grid-row: 2; display: grid; place-items: center; min-height: 0; margin: 0; }
.rz-scena img {
  display: block; max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain;
  border-radius: 6px; background: rgba(255, 255, 255, .04);
}
.rz-opis {
  grid-column: 1 / -1; grid-row: 3; display: flex; justify-content: center; gap: 1rem;
  padding: 1rem var(--gutter) 1.5rem; font-size: 1rem; line-height: 1.4; text-align: center;
}
.rz-licznik { color: var(--muted); font-variant-numeric: tabular-nums; white-space: nowrap; }
.rz-ster {
  display: grid; place-items: center; width: 3.25rem; height: 3.25rem; padding: 0;
  background: rgba(6, 8, 12, .55); color: var(--text);
  border: 1.5px solid rgba(255, 255, 255, .5); border-radius: 50%; cursor: pointer;
  transition: border-color .15s, background-color .15s;
}
.rz-ster:hover { border-color: var(--text); background: rgba(255, 255, 255, .12); }
.rz-ster svg { width: 1.375rem; height: 1.375rem; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.rz-zamknij { grid-column: 3; grid-row: 1; justify-self: center; align-self: center; }
.rz-poprz { grid-column: 1; grid-row: 2; justify-self: center; align-self: center; }
.rz-nast { grid-column: 3; grid-row: 2; justify-self: center; align-self: center; }
html.rz-otwarte { overflow: hidden; }
@media (max-width: 1180px) {
}
@media (max-width: 900px) {
  .rz { --rz-gap: .875rem; }
  .rz-siatka { gap: 1.25rem var(--rz-gap); }
  .rz-podglad[open] { grid-template-columns: 0 minmax(0, 1fr) 0; grid-template-rows: 4rem minmax(0, 1fr) auto auto; }
  .rz-scena { grid-column: 1 / -1; padding: 0 .75rem; }
  .rz-zamknij { grid-column: 2; justify-self: end; margin-right: .75rem; }
  .rz-poprz, .rz-nast { grid-row: 4; grid-column: 2; margin-bottom: 1.25rem; }
  .rz-poprz { justify-self: start; margin-left: calc(50% - 4.25rem); }
  .rz-nast { justify-self: end; margin-right: calc(50% - 4.25rem); }
  .rz-opis { padding-bottom: 1rem; }
}
@media (max-width: 600px) {
  .rz-siatka { --rz-start: 4; --rz-krok: 4; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rz-podpis { font-size: .875rem; }
  .rz-filtr { padding: .5rem .9rem; font-size: .875rem; }
}
@media (prefers-reduced-motion: reduce) {
  .rz-kafel img { transition: none; }
  .rz-kafel:hover img { transform: none; }
}
