.elementor-widget-sbm_berichten{
  --sbm-paneel:#191D22;
  --sbm-hover:#212730;
  --sbm-lijn:rgba(255,255,255,.1);
  --sbm-lijn-hover:#2B323B;
  --sbm-titel:#EDEFF1;
  --sbm-tekst:#727C85;
  --sbm-accent:#EE701C;
  --sbm-actief:#EDEFF1;
  --sbm-radius:6px;
  --sbm-beeldhoogte:230px;
  --sbm-compactbeeld:76px;
  --sbm-sans:"Instrument Sans",system-ui,sans-serif;
  --sbm-tech:"Barlow Semi Condensed",system-ui,sans-serif;
}

/* ---------- filterrij ---------- */
.sbm-filters{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:32px}
.sbm-filter{
  display:inline-block;padding:9px 17px;border:1px solid var(--sbm-lijn);border-radius:999px;
  font-family:var(--sbm-sans);font-size:13.5px;font-weight:500;line-height:1.2;
  color:#9BA5AD;text-decoration:none;transition:.16s ease;
}
.sbm-filter:hover{color:var(--sbm-titel);border-color:var(--sbm-lijn-hover)}
.sbm-filter.is-actief{background:var(--sbm-actief);border-color:var(--sbm-actief);color:#0B0D0F;font-weight:600}
.sbm-telling{
  margin-left:auto;font-family:var(--sbm-tech);text-transform:uppercase;letter-spacing:.12em;
  font-size:12.5px;color:var(--sbm-tekst);
}

/* ---------- raster ---------- */
.sbm-kaarten{
  display:grid;
  grid-template-columns:repeat(var(--sbm-kolommen,3),minmax(0,1fr));
  gap:16px;
}

/* ---------- kaart ---------- */
.sbm-kaart{
  display:flex;flex-direction:column;overflow:hidden;text-decoration:none;
  background:var(--sbm-paneel);border:1px solid var(--sbm-lijn);border-radius:var(--sbm-radius);
  transition:background .18s ease,border-color .18s ease;
}
.sbm-kaart:hover{background:var(--sbm-hover);border-color:var(--sbm-lijn-hover)}

.sbm-kaart__beeld{position:relative;display:block;height:var(--sbm-beeldhoogte);background:#000;overflow:hidden;flex:none}
.sbm-kaart__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.88;transition:transform .5s ease}
.sbm-kaart:hover .sbm-kaart__img{transform:scale(1.03)}
.sbm-kaart__img--leeg{background:linear-gradient(150deg,#20252C,#14181D)}

.sbm-kaart__body{display:flex;flex-direction:column;flex:1;padding:24px 26px 26px}
.sbm-kaart__cat{
  font-family:var(--sbm-tech);text-transform:uppercase;letter-spacing:.12em;
  font-size:12px;line-height:1.4;color:var(--sbm-accent);
}
.sbm-kaart__titel{
  margin-top:14px;font-family:var(--sbm-sans);font-size:19px;font-weight:600;
  letter-spacing:-.015em;line-height:1.24;color:var(--sbm-titel);
}
.sbm-kaart__tekst{
  margin-top:11px;font-family:var(--sbm-sans);font-size:14.5px;font-weight:400;
  line-height:1.55;color:var(--sbm-tekst);
}
.sbm-kaart__voet{
  margin-top:auto;padding-top:22px;display:flex;align-items:center;
  justify-content:space-between;gap:12px;
}
.sbm-kaart__datum{
  font-family:var(--sbm-tech);text-transform:uppercase;letter-spacing:.11em;
  font-size:12px;color:var(--sbm-tekst);
}
.sbm-kaart__link{
  font-family:var(--sbm-sans);font-size:13.5px;font-weight:600;color:var(--sbm-accent);
  padding-bottom:3px;border-bottom:1px solid rgba(238,112,28,.4);transition:border-color .18s ease;
}
.sbm-kaart:hover .sbm-kaart__link{border-color:var(--sbm-accent)}

/* ---------- uitgelicht eerste bericht ---------- */
/* Het brede blok op grid in plaats van flex: een grid-item krijgt een bepaalde
   hoogte, waardoor het beeld eronder wel op 100% kan uitvullen. */
@media (min-width:901px){
  .sbm-kaarten--uitgelicht .sbm-kaart--breed{
    grid-column:span 2;
    display:grid;
    grid-template-columns:1fr 1fr;
    align-items:stretch;
  }
  .sbm-kaarten--uitgelicht .sbm-kaart--breed .sbm-kaart__beeld{
    width:auto;height:auto;min-height:var(--sbm-beeldhoogte);align-self:stretch;
  }
  .sbm-kaarten--uitgelicht .sbm-kaart--breed .sbm-kaart__img{
    position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;
  }
  .sbm-kaarten--uitgelicht .sbm-kaart--breed .sbm-kaart__body{padding:34px 36px;justify-content:center}
  .sbm-kaarten--uitgelicht .sbm-kaart--breed .sbm-kaart__titel{font-size:27px;margin-top:16px}
  .sbm-kaarten--uitgelicht .sbm-kaart--breed .sbm-kaart__tekst{font-size:15.5px;max-width:44ch}
}

/* ---------- paginering ---------- */
.sbm-paginering{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:34px}
.sbm-paginering .page-numbers{
  display:inline-flex;align-items:center;justify-content:center;min-width:42px;height:42px;
  padding:0 14px;border:1px solid var(--sbm-lijn);border-radius:999px;
  font-family:var(--sbm-sans);font-size:13.5px;font-weight:500;color:#9BA5AD;
  text-decoration:none;transition:.16s ease;
}
.sbm-paginering .page-numbers:hover{color:var(--sbm-titel);border-color:var(--sbm-lijn-hover)}
.sbm-paginering .page-numbers.current{
  background:var(--sbm-actief);border-color:var(--sbm-actief);color:#0B0D0F;font-weight:600;
}
.sbm-paginering .page-numbers.dots{border-color:transparent}

.sbm-leeg{font-family:var(--sbm-sans);font-size:16px;color:#9BA5AD}

@media (max-width:900px){
  .sbm-kaarten{grid-template-columns:1fr}
  .sbm-telling{margin-left:0;width:100%}
}

/* ---------- gegevensregel in de kaart ---------- */
.sbm-kaart__specs{
  margin-top:18px;padding-top:16px;border-top:1px solid var(--sbm-lijn);
  display:flex;flex-wrap:wrap;gap:8px 24px;
  font-family:var(--sbm-tech);text-transform:uppercase;letter-spacing:.1em;
  font-size:12.5px;line-height:1.4;color:var(--sbm-tekst);
}
.sbm-kaart__spec b{color:var(--sbm-titel);font-weight:500}
.sbm-kaart--zonderbeeld .sbm-kaart__body{padding:34px}

/* ---------- gegevenslijst in de zijbalk ---------- */
.sbm-specs{
  --sbm-spec-label:#EDEFF1;--sbm-spec-waarde:#9BA5AD;--sbm-spec-lijn:rgba(255,255,255,.1);
  margin:0;padding:0;list-style:none;
}
.sbm-specs li{
  display:flex;align-items:center;justify-content:space-between;gap:20px;
  padding:13px 0;border-bottom:1px solid var(--sbm-spec-lijn);
}
.sbm-specs li:last-child{border-bottom:0}
.sbm-specs__label{
  font-family:var(--sbm-sans);font-size:14.5px;line-height:1.5;color:var(--sbm-spec-label);
}
.sbm-specs__waarde{
  font-family:var(--sbm-tech);font-size:13.5px;letter-spacing:.04em;line-height:1.4;
  color:var(--sbm-spec-waarde);text-align:right;
}

/* ---------- compacte weergave voor een zijbalk ---------- */
.sbm-kaarten--compact{display:flex;flex-direction:column;gap:0}
.sbm-kaarten--compact .sbm-kaart{
  flex-direction:row;align-items:center;gap:15px;
  background:none;border:0;border-radius:0;
  border-bottom:1px solid var(--sbm-lijn);padding:14px 0;
}
.sbm-kaarten--compact .sbm-kaart:first-child{padding-top:0}
.sbm-kaarten--compact .sbm-kaart:last-child{border-bottom:0;padding-bottom:0}
.sbm-kaarten--compact .sbm-kaart:hover{background:none}
.sbm-kaarten--compact .sbm-kaart__beeld{
  width:var(--sbm-compactbeeld);height:calc(var(--sbm-compactbeeld) * .74);
  border-radius:4px;flex:none;
}
.sbm-kaarten--compact .sbm-kaart__body{padding:0;flex:1;min-width:0}
.sbm-kaarten--compact .sbm-kaart__cat,
.sbm-kaarten--compact .sbm-kaart__tekst,
.sbm-kaarten--compact .sbm-kaart__specs,
.sbm-kaarten--compact .sbm-kaart__link{display:none}
.sbm-kaarten--compact .sbm-kaart__titel{
  margin-top:0;font-size:14.5px;line-height:1.4;transition:color .16s ease;
}
.sbm-kaarten--compact .sbm-kaart:hover .sbm-kaart__titel{color:var(--sbm-accent)}
.sbm-kaarten--compact .sbm-kaart__voet{margin-top:5px;padding-top:0}
.sbm-kaarten--compact .sbm-kaart__datum{font-size:11.5px;letter-spacing:.1em}
.sbm-kaarten--compact.sbm-kaarten .sbm-kaart--zonderbeeld .sbm-kaart__body{padding:0}
