/* SDJ Realizacje – Widget Elementor
   Renderuje wyłącznie komponent (filtry + siatka + przycisk).
   Zero narzuconego tła/kontenera/paddingu sekcji — to buduje się w Elementorze wokół widgetu. */

.sdjr-wrap{
  --sdjr-ink:#252525;
  --sdjr-white:#FFFFFF;
  --sdjr-accent:#0048FF;
  --sdjr-border:#EAEAEA;
  --sdjr-muted:#6b6b6b;
  font-family:'Zalando Sans Expanded','Zalando Sans',Arial,sans-serif;
  color:var(--sdjr-ink);
}
.sdjr-wrap *{ box-sizing:border-box; }

/* ---- pasek filtrów ---- */
.sdjr-filters{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin:0 0 24px;
}
.sdjr-filter-chip{
  font-family:inherit;
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.03em;
  border:1px solid var(--sdjr-border) !important;
  background:#fff !important;
  color:#555 !important;
  padding:8px 16px;
  border-radius:0 !important;
  cursor:pointer;
  font-weight:600;
  outline:none !important;
  box-shadow:none !important;
  transition:all .2s ease;
}
.sdjr-filter-chip:hover:not(.is-active),
.sdjr-filter-chip:focus:not(.is-active){
  border-color:var(--sdjr-accent) !important;
  color:var(--sdjr-accent) !important;
  background:#fff !important;
}
.sdjr-filter-chip.is-active,
.sdjr-filter-chip.is-active:hover,
.sdjr-filter-chip.is-active:focus{
  background:var(--sdjr-ink) !important;
  border-color:var(--sdjr-ink) !important;
  color:#fff !important;
}

/* ---- siatka ---- */
.sdjr-grid{
  display:grid;
  gap:24px;
}
.sdjr-cols-2{ grid-template-columns:repeat(2,1fr); }
.sdjr-cols-3{ grid-template-columns:repeat(3,1fr); }
.sdjr-cols-4{ grid-template-columns:repeat(4,1fr); }
@media (max-width:900px){
  .sdjr-cols-3, .sdjr-cols-4{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:600px){
  .sdjr-cols-2, .sdjr-cols-3, .sdjr-cols-4{ grid-template-columns:1fr; }
}

/* ---- karta ---- */
.sdjr-card{
  display:block;
  background:#fff !important;
  border:1px solid var(--sdjr-border) !important;
  border-radius:0 !important;
  overflow:hidden;
  text-decoration:none !important;
  color:inherit !important;
  position:relative;
  transition:border-color .25s ease, box-shadow .25s ease, transform .2s ease;
}
.sdjr-card:hover,
.sdjr-card:focus{
  border-color:var(--sdjr-accent) !important;
  box-shadow:0 16px 32px rgba(0,72,255,.12) !important;
  transform:translateY(-4px);
  text-decoration:none !important;
}
.sdjr-card.sdjr-hidden{ display:none; }

.sdjr-img-wrap{
  display:block;
  aspect-ratio:4/3;
  overflow:hidden;
  position:relative;
  background:#f2f2f2;
}
.sdjr-img-wrap img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transition:transform .4s ease;
}
.sdjr-card:hover .sdjr-img-wrap img{
  transform:scale(1.06);
}
.sdjr-img-fallback{
  position:absolute; inset:0;
  display:flex; align-items:center; justify-content:center;
  background:repeating-linear-gradient(45deg,#dcdcdc,#dcdcdc 8px,#ececec 8px,#ececec 16px);
  color:#8a8a8a; font-size:11px; text-transform:uppercase; letter-spacing:.05em;
}

.sdjr-tag{
  position:absolute; top:12px; left:12px;
  background:rgba(37,37,37,.82) !important;
  color:#fff !important;
  font-size:10px;
  text-transform:uppercase;
  letter-spacing:.05em;
  padding:5px 10px;
  border-radius:0 !important;
  font-weight:700;
}

.sdjr-body{
  display:block;
  padding:18px 20px 20px;
}
.sdjr-title{
  display:block;
  font-size:15.5px;
  font-weight:800;
  margin:0 0 8px;
  line-height:1.3;
  color:var(--sdjr-ink) !important;
}
.sdjr-meta{
  display:flex;
  flex-wrap:wrap;
  gap:4px 14px;
  font-size:11.5px;
  color:var(--sdjr-muted) !important;
}
.sdjr-meta span{ display:inline-flex; align-items:center; gap:5px; }
.sdjr-meta svg{ width:12px; height:12px; stroke:var(--sdjr-muted); fill:none; stroke-width:1.8; flex:none; }

.sdjr-empty{ font-size:13.5px; color:var(--sdjr-muted); }

/* ---- meta realizacji (lokalizacja / kontrahent / kategoria) ---- */
.sdjr-meta-row{
  display:flex;
  flex-wrap:wrap;
  gap:22px;
  font-size:13px;
  color:var(--sdjr-muted);
}
.sdjr-meta-row--divider{
  padding-bottom:24px;
  border-bottom:1px solid var(--sdjr-border);
}
.sdjr-meta-item{
  display:inline-flex;
  align-items:center;
  gap:7px;
}
.sdjr-meta-item svg{
  width:15px;
  height:15px;
  stroke:var(--sdjr-accent);
  fill:none;
  stroke-width:1.8;
  flex:none;
}
.sdjr-meta-item b{
  color:var(--sdjr-ink) !important;
  font-weight:700;
}

/* ---- CTA ---- */
.sdjr-cta-row{ margin-top:36px; }
.sdjr-cta{
  display:inline-block;
  background:var(--sdjr-ink) !important;
  color:#fff !important;
  font-weight:700;
  font-size:13px;
  text-transform:uppercase;
  letter-spacing:.04em;
  text-decoration:none !important;
  padding:14px 26px;
  border-radius:0 !important;
  transition:background .2s ease;
}
.sdjr-cta:hover,
.sdjr-cta:focus{
  background:var(--sdjr-accent) !important;
  color:#fff !important;
  text-decoration:none !important;
}
