/* BOOST The World – berichtsjabloon */
.btw-blog {
	--btw-zwart: #111111;
	--btw-tekst: #3a3a3a;
	--btw-goud: #d4af37;
	--btw-goud-donker: #a8871f;
	--btw-groen: #2e5b3b;
	--btw-beige: #e8d8c3;
	--btw-beige-licht: #f6efe6;
	--btw-kop: "Bebas Neue", "Arial Narrow", sans-serif;
	--btw-body: "Poppins", system-ui, sans-serif;
	--btw-kolom: 720px;
	font-family: var(--btw-body);
	color: var(--btw-tekst);
	background: #fff;
	overflow-x: clip;
}
.btw-blog *,
.btw-blog *::before,
.btw-blog *::after { box-sizing: border-box; }

/* Kop */
.btw-hero {
	position: relative;
	display: flex;
	align-items: flex-end;
	min-height: 360px;
	padding: 120px 24px 56px;
	background: var(--btw-zwart);
	color: #fff;
}
.btw-hero--beeld {
	min-height: min(68vh, 640px);
	background: linear-gradient(180deg, rgba(17,17,17,.15) 0%, rgba(17,17,17,.45) 45%, rgba(17,17,17,.9) 100%), var(--btw-hero-beeld) center 30% / cover no-repeat, var(--btw-zwart);
}
.btw-hero__inner { width: 100%; max-width: 960px; margin: 0 auto; }
.btw-hero__kruimel {
	display: flex; flex-wrap: wrap; gap: 8px;
	margin-bottom: 14px;
	font-family: var(--btw-kop);
	font-size: 20px; letter-spacing: 1.5px; text-transform: uppercase;
	color: var(--btw-goud);
}
.btw-hero__kruimel a { color: var(--btw-goud); text-decoration: none; }
.btw-hero__kruimel a:hover { color: #fff; }
.btw-hero__kruimel span[aria-hidden] { color: rgba(255,255,255,.5); }
.btw-hero__titel {
	margin: 0 0 18px;
	font-family: var(--btw-kop);
	font-weight: 400;
	font-size: clamp(44px, 6.4vw, 84px);
	line-height: .98;
	letter-spacing: .5px;
	text-transform: uppercase;
	color: #fff;
	text-wrap: balance;
}
.btw-hero__meta {
	display: flex; flex-wrap: wrap; gap: 10px;
	margin: 0;
	font-size: 15px;
	color: rgba(255,255,255,.85);
}

/* Tekst */
.btw-artikel { padding: 64px 24px 24px; }
.btw-inhoud {
	max-width: var(--btw-kolom);
	margin: 0 auto;
	font-size: 18px;
	line-height: 1.75;
}
.btw-inhoud > * { margin-top: 0; margin-bottom: 1.25em; }
.btw-inhoud > p:first-child {
	font-size: 21px;
	line-height: 1.65;
	color: var(--btw-zwart);
}
.btw-inhoud h2,
.btw-inhoud h3,
.btw-inhoud h4 {
	font-family: var(--btw-kop);
	font-weight: 400;
	line-height: 1.05;
	letter-spacing: .5px;
	text-transform: uppercase;
	color: var(--btw-zwart);
}
.btw-inhoud h2 { font-size: 42px; margin-top: 1.6em; margin-bottom: .45em; }
.btw-inhoud h3 { font-size: 32px; margin-top: 1.4em; margin-bottom: .4em; }
.btw-inhoud h4 { font-size: 26px; margin-top: 1.2em; margin-bottom: .35em; }
.btw-inhoud h2::before {
	content: "";
	display: block;
	width: 48px; height: 4px;
	margin-bottom: 14px;
	background: var(--btw-goud);
}
.btw-inhoud strong { color: var(--btw-zwart); font-weight: 600; }
.btw-inhoud a {
	color: var(--btw-groen);
	text-decoration: underline;
	text-decoration-color: var(--btw-goud);
	text-decoration-thickness: 2px;
	text-underline-offset: 3px;
}
.btw-inhoud a:hover { color: var(--btw-zwart); }
.btw-inhoud ul,
.btw-inhoud ol { padding-left: 1.3em; }
.btw-inhoud li { margin-bottom: .4em; }
.btw-inhoud ul li::marker { color: var(--btw-goud); }
.btw-inhoud blockquote {
	margin: 2em 0;
	padding: 4px 0 4px 28px;
	border-left: 4px solid var(--btw-goud);
	font-size: 24px;
	line-height: 1.5;
	font-style: italic;
	color: var(--btw-zwart);
}
.btw-inhoud blockquote p:last-child { margin-bottom: 0; }
.btw-inhoud img { max-width: 100%; height: auto; border-radius: 6px; display: block; }
.btw-inhoud figure { margin: 2em 0; }
.btw-inhoud figcaption { margin-top: 8px; font-size: 14px; color: #777; }
.btw-inhoud .btw-galerij {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
	gap: 12px;
}
.btw-inhoud .btw-galerij figure { margin: 0; }
.btw-inhoud .btw-galerij img { aspect-ratio: 4 / 3; object-fit: cover; width: 100%; }
.btw-inhoud iframe,
.btw-inhoud .wp-block-embed iframe { max-width: 100%; width: 100%; aspect-ratio: 16 / 9; height: auto; border: 0; border-radius: 6px; }
.btw-inhoud hr { border: 0; height: 1px; background: var(--btw-beige); margin: 2.5em 0; }
.btw-inhoud table { width: 100%; border-collapse: collapse; font-size: 16px; }
.btw-inhoud th, .btw-inhoud td { border: 1px solid #e6e6e6; padding: 8px 12px; text-align: left; }
.btw-inhoud th { background: var(--btw-beige-licht); }

/* Delen */
.btw-delen {
	display: flex; flex-wrap: wrap; align-items: center; gap: 10px;
	max-width: var(--btw-kolom);
	margin: 48px auto 0;
	padding-top: 24px;
	border-top: 1px solid var(--btw-beige);
}
.btw-delen__label {
	margin-right: 6px;
	font-family: var(--btw-kop);
	font-size: 22px; letter-spacing: 1px; text-transform: uppercase;
	color: var(--btw-zwart);
}
.btw-blog .btw-delen__knop {
	display: inline-block;
	padding: 7px 16px;
	border: 1px solid var(--btw-zwart);
	border-radius: 999px;
	background: transparent;
	font-family: var(--btw-body);
	font-size: 14px; font-weight: 500; line-height: 1.4;
	color: var(--btw-zwart);
	text-decoration: none;
	cursor: pointer;
	transition: background .2s, color .2s;
}
.btw-blog .btw-delen__knop:hover,
.btw-blog .btw-delen__knop:focus-visible { background: var(--btw-zwart); color: #fff; }

/* Oproep */
.btw-cta { padding: 72px 24px 0; }
.btw-cta__inner {
	max-width: 960px;
	margin: 0 auto;
	padding: 56px 48px;
	border-radius: 8px;
	background: var(--btw-zwart);
	color: #fff;
	text-align: center;
}
.btw-cta__kop {
	margin: 0 0 14px;
	font-family: var(--btw-kop);
	font-weight: 400;
	font-size: clamp(40px, 5vw, 60px);
	line-height: 1;
	letter-spacing: .5px;
	text-transform: uppercase;
	color: #fff;
}
.btw-cta__tekst { max-width: 600px; margin: 0 auto 28px; font-size: 17px; line-height: 1.7; color: rgba(255,255,255,.85); }
.btw-cta__knoppen { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; }
.btw-blog .btw-knop {
	display: inline-block;
	padding: 14px 28px;
	border-radius: 3px;
	font-family: var(--btw-body);
	font-size: 15px; font-weight: 500; letter-spacing: .5px; text-transform: uppercase;
	text-decoration: none;
	transition: background .2s, color .2s, border-color .2s;
}
.btw-blog .btw-knop--goud { background: var(--btw-goud); color: var(--btw-zwart); border: 2px solid var(--btw-goud); }
.btw-blog .btw-knop--goud:hover { background: #fff; border-color: #fff; color: var(--btw-zwart); }
.btw-blog .btw-knop--rand { border: 2px solid rgba(255,255,255,.6); color: #fff; }
.btw-blog .btw-knop--rand:hover { border-color: var(--btw-goud); color: var(--btw-goud); }

/* Meer verhalen */
.btw-meer { padding: 72px 24px 88px; }
.btw-meer__inner { max-width: 1140px; margin: 0 auto; }
.btw-meer__kop { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 8px 24px; margin-bottom: 24px; }
.btw-meer__kop h2 {
	margin: 0;
	font-family: var(--btw-kop);
	font-weight: 400;
	font-size: 48px; line-height: 1; letter-spacing: .5px; text-transform: uppercase;
	color: var(--btw-zwart);
}
.btw-meer__kop a { font-weight: 500; color: var(--btw-groen); text-decoration: none; }
.btw-meer__kop a:hover { color: var(--btw-zwart); }
.btw-meer__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.btw-kaart {
	display: flex; flex-direction: column;
	overflow: hidden;
	border-radius: 6px;
	background: var(--btw-beige-licht);
	color: var(--btw-zwart);
	text-decoration: none;
	transition: transform .2s, box-shadow .2s;
}
.btw-kaart:hover { transform: translateY(-3px); box-shadow: 0 12px 28px rgba(17,17,17,.12); }
.btw-kaart__beeld { display: block; aspect-ratio: 3 / 2; overflow: hidden; background: var(--btw-beige); }
.btw-kaart__beeld img { width: 100%; height: 100%; object-fit: cover; display: block; }
.btw-kaart__tekst { display: flex; flex-direction: column; gap: 6px; padding: 18px 20px 22px; }
.btw-kaart time { font-size: 13px; color: #777; }
.btw-kaart__titel { font-size: 18px; font-weight: 600; line-height: 1.35; }

/* Mobiel en tablet */
@media (max-width: 900px) {
	.btw-meer__grid { grid-template-columns: 1fr 1fr; }
	.btw-meer__grid > :nth-child(3) { display: none; }
}
@media (max-width: 640px) {
	.btw-hero { padding: 96px 16px 36px; min-height: 300px; }
	.btw-hero--beeld { min-height: 460px; }
	.btw-hero__kruimel { font-size: 17px; }
	.btw-artikel { padding: 40px 16px 16px; }
	.btw-inhoud { font-size: 17px; }
	.btw-inhoud > p:first-child { font-size: 19px; }
	.btw-inhoud h2 { font-size: 34px; }
	.btw-inhoud h3 { font-size: 28px; }
	.btw-inhoud blockquote { font-size: 20px; padding-left: 18px; }
	.btw-cta { padding: 48px 16px 0; }
	.btw-cta__inner { padding: 40px 22px; }
	.btw-meer { padding: 56px 16px 64px; }
	.btw-meer__kop h2 { font-size: 40px; }
	.btw-meer__grid { grid-template-columns: 1fr; }
	.btw-meer__grid > :nth-child(3) { display: flex; }
}
