/* News overview: the compact event strip (blocks/event-strip) and the chronological list
   (blocks/news-list), plus the shared news card (inc/news.php). Tickets and cards are the
   homepage's own (sectie 11 and 12 in home.css); this file only lays them out. Both blocks sit
   on white under the page heading, so the page reads as one calm column. */

/* The shape belongs to the homepage's large card only. */
.b27u .st-CV .cv-s12-klein .cv-s12-vorm{display:none}

/* Both section headings: one quiet size, so they label the two parts without competing with
   the page title above them. */
.b27u.b27u.b27u .b27e-kop,.b27u.b27u.b27u .b27n-kop{margin:0;color:#1C0A3A;font-family:"Poppins","Segoe UI",system-ui,sans-serif;font-size:clamp(22px,1.8vw,28px);font-weight:600;line-height:1.2}

/* === Upcoming events: the homepage's small tickets in one row === */
.b27u.b27u.b27e .b27e-sectie{padding:40px 0 0;background:#FFFFFF}
.b27u.b27e .b27e-rij{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px;margin:24px 0 0;padding:0;list-style:none}
.b27u.b27e .b27e-rij>li{display:flex}
.b27u.b27e .b27e-rij .s11-ticket{flex:1;text-decoration:none}
.b27u.b27e .b27e-rij .u-h4{margin:0}
.b27u.b27e .b27e-rij .s11-plek{margin:0}

/* === Filter chips, in the cases overview's style === */
.b27u.b27n .b27n-sectie{padding:72px 0 96px;background:#FFFFFF}
.b27u.b27n .b27n-chips{display:flex;flex-wrap:wrap;gap:8px;margin:20px 0 0;padding:0;list-style:none}
.b27u.b27n .b27n-chip{display:inline-flex;align-items:center;gap:6px;min-height:40px;padding:0 16px;border:0;border-radius:999px;background:var(--cv-zacht,#F4F2FA);color:var(--cv-donker,#1C0A3A);font:600 14px/1 "DM Sans",system-ui,sans-serif;cursor:pointer}
.b27u.b27n .b27n-chip:hover{background:#E3DFEE}
.b27u.b27n .b27n-chip[aria-pressed="true"]{background:#9600B9;color:#FFFFFF}
.b27u.b27n .b27n-chip:focus-visible{outline:2px solid #3C1EFA;outline-offset:2px}
.b27u.b27n .b27n-n{opacity:.7;font-variant-numeric:tabular-nums}

/* === The list: one small card per row, newest first === */
.b27u.b27n .b27n-lijst{display:flex;flex-direction:column;gap:20px;margin-top:28px}
.b27u.b27n .b27n-lijst>[hidden]{display:none}
.b27u.b27n .b27n-lijst .cv-s12-klein{grid-template-columns:minmax(0,340px) minmax(0,1fr)}
.b27u.b27n .b27n-lijst .cv-s12-klein .cv-s12-foto{min-height:200px}
.b27u.b27n .cv-s12-uittreksel{color:#4A4060;font-size:16px;line-height:1.6;max-width:68ch}

@media (max-width:700px){
	.b27u.b27n .b27n-sectie{padding:48px 0 64px}
	.b27u.b27n .b27n-lijst .cv-s12-klein{grid-template-columns:1fr}
}
