/* DPS Media, expertise-overzicht (/expertises/): aanvullingen op dps-kb-overzicht.css.
   Zelfde bento-familie als kennisbank en cases; hier een foto in de beeldtegel,
   kaarten met een regel uitleg onder de titel, en het blok met de zes afspraken. */
.dps-xp .dps-kbo-bento .is-beeld img{ object-fit:cover; }
.dps-xp .dps-kbo-bento .is-reeksen ul{ grid-template-columns:1fr 1fr; column-gap:14px; }
.dps-xp .dps-kbo-kaart .onder{ flex-direction:column; align-items:flex-start; gap:6px; right:28px; bottom:20px; }
.dps-xp .dps-kbo-kaart h2{ max-width:none; }
.dps-xp .dps-kbo-kaart small{ color:rgba(255,255,255,.8); font-size:13px; line-height:1.4; max-width:40ch; white-space:normal; overflow:visible; text-overflow:clip; }
/* tien kaarten in drie kolommen: de eerste en de laatste dubbel breed (2+1, 3, 3, 1+2), dan blijft geen rij half leeg */
.dps-xp .dps-kbo-raster.is-tien > li:first-child, .dps-xp .dps-kbo-raster.is-tien > li:last-child{ grid-column:span 2; aspect-ratio:auto; }
.dps-xp .dps-kbo-raster.is-tien > li:first-child small, .dps-xp .dps-kbo-raster.is-tien > li:last-child small{ max-width:52ch; font-size:14px; }
.dps-xp .dps-kbo-raster.is-tien > li:first-child h2, .dps-xp .dps-kbo-raster.is-tien > li:last-child h2{ font-size:22px !important; }
.dps-xp .dps-kbo-kaart > a::after{ background:linear-gradient(180deg, rgba(10,8,36,0) 30%, rgba(10,8,36,.55) 62%, rgba(10,8,36,.92) 100%); }
.dps-xp .dps-kbo-sub{ margin-top:56px !important; }
.dps-xp .dps-kbo-lead{ margin:0 0 4px; color:#5f6270; font-size:16px; line-height:1.6; max-width:62ch; }
.dps-xp .dps-xp-alle{ margin:22px 0 0; }
.dps-xp .dps-xp-alle a{ display:inline-block; padding:12px 22px; border-radius:999px; border:1px solid #d9d9e6; color:#0b0b14; font-weight:700; text-decoration:none; font-size:14.5px; transition:background .35s, border-color .35s; }
.dps-xp .dps-xp-alle a:hover{ background:#0a0824; border-color:#0a0824; color:#fff; }

/* de zes afspraken */
.dps-xp-afspraken{ margin-top:56px; }
.dps-xp-afspraken .kop{ display:flex; flex-direction:column; gap:6px; margin-bottom:22px; }
.dps-xp-afspraken .eyebrow{ display:inline-block; align-self:flex-start; padding:7px 16px; border-radius:999px; background:linear-gradient(90deg,#6121DF,#911CEA); color:#fff; font-size:13px; font-weight:700; }
.dps-xp-afspraken h2{ font-size:clamp(22px, 2.2vw, 30px) !important; font-weight:800 !important; letter-spacing:-.02em; margin:6px 0 0 !important; color:#0b0b14 !important; text-align:left !important; }
.dps-xp-afspraken ul{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:16px; }
.dps-xp-afspraken li{ border-radius:0 30px; border:1px solid #e6e6ee; background:#f5f5fa; padding:24px 26px 26px; display:flex; flex-direction:column; gap:10px; min-height:190px; }
.dps-xp-afspraken li i{ font-style:normal; font-weight:800; font-size:13px; letter-spacing:.08em; color:#6121DF; }
.dps-xp-afspraken li h3{ margin:0 !important; font-size:18px !important; font-weight:800 !important; line-height:1.25 !important; color:#0b0b14 !important; letter-spacing:-.01em; text-align:left !important; }
.dps-xp-afspraken li p{ margin:0; color:#5f6270; font-size:14.5px; line-height:1.6; }
@media (max-width:1023px){
  .dps-xp-afspraken ul{ grid-template-columns:1fr 1fr; }
  .dps-xp .dps-kbo-raster.is-tien > li:first-child, .dps-xp .dps-kbo-raster.is-tien > li:last-child{ grid-column:auto; aspect-ratio:395/296; }
  .dps-xp .dps-kbo-raster.is-tien > li:first-child h2, .dps-xp .dps-kbo-raster.is-tien > li:last-child h2{ font-size:16px !important; }
  .dps-xp .dps-kbo-raster.is-tien > li:first-child small, .dps-xp .dps-kbo-raster.is-tien > li:last-child small{ font-size:13px; }
}
@media (max-width:640px){
  .dps-xp .dps-kbo-bento .is-reeksen ul{ grid-template-columns:1fr; }
  .dps-xp-afspraken ul{ grid-template-columns:1fr; }
  .dps-xp-afspraken li{ min-height:0; border-radius:0 22px; }
  .dps-xp .dps-kbo-sub{ margin-top:40px !important; }
}
@media print{ .dps-xp .dps-xp-alle{ display:none; } }
