/* Single post (blocks/post). The hero and the strip under it are the case page's (b27c classes
   in case.css); this file adds the event facts and the post's own block content. The closing
   band is shared with the case page (inc/more.php, css27/more.css).

   The body is block content written for boolean-fse (callout band, zigzag rows, cards), so it
   keeps that structure from layout.css and only takes the house style here: DM Sans text,
   Poppins headings, the homepage's D-corner on photos and its link colour. */

/* === Event facts, in the results strip under the hero === */
.b27u.b27p .b27p-feiten{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:24px 32px;margin:0}
.b27u.b27p .b27p-feiten>div{padding-left:20px;border-left:2px solid var(--u-paars)}
.b27u.b27p .b27p-feiten dt{color:var(--u-txt2);font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.b27u.b27p .b27p-feiten dd{margin:8px 0 0;color:var(--u-kop);font-size:18px;font-weight:600;line-height:1.4}

/* === The post's own content === */
.b27u.b27p .b27p-verhaal{background:#FFFFFF;padding:24px 0 96px}
.b27u.b27p .b27p-inhoud{max-width:1000px;color:var(--u-txt);font-family:"DM Sans",system-ui,sans-serif;font-size:17px;line-height:1.7}
.b27u.b27u.b27p .b27p-inhoud p{margin:0 0 20px;max-width:68ch;font-family:inherit;font-size:inherit;line-height:inherit;color:inherit}
.b27u.b27u.b27p .b27p-inhoud :is(h2,h3,h4){margin:40px 0 12px;color:var(--u-kop);font-family:"Poppins","Segoe UI",system-ui,sans-serif;font-weight:600;line-height:1.25}
.b27u.b27u.b27p .b27p-inhoud h2{font-size:clamp(24px,2vw,30px)}
.b27u.b27u.b27p .b27p-inhoud h3{font-size:clamp(21px,1.6vw,24px)}
.b27u.b27u.b27p .b27p-inhoud h4{font-size:19px}
.b27u.b27u.b27p .b27p-inhoud :is(ul,ol){margin:0 0 20px;padding-left:1.3em;max-width:68ch;list-style:disc}
.b27u.b27u.b27p .b27p-inhoud ol{list-style:decimal}
.b27u.b27u.b27p .b27p-inhoud li{margin:0 0 6px}
.b27u.b27p .b27p-inhoud a{color:var(--u-link);font-weight:600;text-decoration:none}
.b27u.b27p .b27p-inhoud a:hover{color:var(--u-link-hover)}
.b27u.b27p .b27p-inhoud a.boolean-inline-cta{font-weight:700}

/* The claim between paragraphs: flat blauw, Poppins, as the house style sets a claim. */
.b27u.b27u.b27u .b27p-inhoud p.boolean-callout-band{max-width:none;margin:40px 0;padding:40px;border-radius:var(--u-r);background:var(--u-blauw);color:#FFFFFF;font-family:"Poppins","Segoe UI",system-ui,sans-serif;font-size:clamp(24px,2.2vw,32px);font-weight:600;line-height:1.3}

/* Zigzag rows: the photos take the homepage's D-corner, top right. */
.b27u.b27p .b27p-inhoud .boolean-zigzag-row{margin-top:56px}
.b27u.b27p .b27p-inhoud .boolean-zigzag-row :is(img,video){border-radius:var(--u-r) var(--u-d) var(--u-r) var(--u-r)}
.b27u.b27p .b27p-inhoud .boolean-zigzag-row figure{margin:0}
.b27u.b27u.b27u .b27p-inhoud p.boolean-zigzag-row__eyebrow{margin:0 0 4px;color:var(--u-accent);font-size:13px;font-weight:700;letter-spacing:.14em;line-height:1.3;text-transform:uppercase}
.b27u.b27u.b27p .b27p-inhoud .boolean-zigzag-row h3{margin-top:0}

/* Cards between the rows: the homepage's card radius and shadow. */
.b27u.b27p .b27p-inhoud .boolean-card{border:0;border-radius:var(--u-r);box-shadow:var(--u-sch1)}
.b27u.b27u.b27p .b27p-inhoud .boolean-card h4{margin-top:12px}
.b27u.b27u.b27p .b27p-inhoud .boolean-card p{margin-bottom:0;font-size:16px}

}
@media (max-width:700px){
	.b27u.b27u.b27u .b27p-inhoud p.boolean-callout-band{padding:28px 24px}
	.b27u.b27p .b27p-verhaal{padding-bottom:64px}
}