/* 1UP Blogs: gebruikt de globale Elementor-kleuren van de site, met terugvalwaarden. */
.oneup-blogs,
.oneup-blog {
	--ob-ink: var(--e-global-color-accent, #171717);
	--ob-muted: var(--e-global-color-text, #4a4a4a);
	--ob-accent: var(--e-global-color-primary, #e5ff00);
	--ob-surface: var(--e-global-color-surface, #f5f5f3);
	--ob-border: var(--e-global-color-border, #e4e4e4);
	--ob-tint: var(--e-global-color-ytint, #f5fbcf);
	color: var(--ob-ink);
	font-family: "Noto Sans", system-ui, sans-serif;
}

/* ---------- Overzicht ---------- */
.oneup-blogs__filters {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0 0 32px;
}
.oneup-blogs__filters a {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 8px 14px;
	border: 1px solid var(--ob-border);
	border-radius: 999px;
	color: var(--ob-ink);
	font-size: 14px;
	font-weight: 700;
	text-decoration: none;
	transition: background-color .15s ease, border-color .15s ease;
}
.oneup-blogs__filters a span { color: var(--ob-muted); font-weight: 400; }
.oneup-blogs__filters a:hover { border-color: var(--ob-ink); }
.oneup-blogs__filters a[aria-current="page"] { background: var(--ob-accent); border-color: var(--ob-accent); }

.oneup-blogs__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 24px;
}
@media (max-width: 1024px) { .oneup-blogs__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 767px) { .oneup-blogs__grid { grid-template-columns: 1fr; gap: 20px; } }

.oneup-blogcard { margin: 0; }
.oneup-blogcard__link {
	display: flex;
	flex-direction: column;
	height: 100%;
	background: var(--ob-surface);
	border-radius: 16px;
	overflow: hidden;
	color: var(--ob-ink);
	text-decoration: none;
	transition: background-color .15s ease;
}
.oneup-blogcard__link:hover { background: var(--ob-tint); color: var(--ob-ink); }
.oneup-blogcard__link:focus-visible { outline: 3px solid var(--ob-ink); outline-offset: 3px; }
.oneup-blogcard__img { aspect-ratio: 16 / 9; background: var(--ob-border); overflow: hidden; }
.oneup-blogcard__img img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .3s ease; }
.oneup-blogcard__link:hover .oneup-blogcard__img img { transform: scale(1.03); }
@media (prefers-reduced-motion: reduce) { .oneup-blogcard__img img { transition: none; } .oneup-blogcard__link:hover .oneup-blogcard__img img { transform: none; } }
.oneup-blogcard__body { display: flex; flex-direction: column; gap: 10px; padding: 24px; flex: 1; }
.oneup-blogcard__cat {
	align-self: flex-start;
	margin: 0;
	padding: 5px 8px;
	border-radius: 6px;
	background: var(--ob-accent);
	font-size: 12px;
	font-weight: 700;
	line-height: 1.2;
}
.oneup-blogs .oneup-blogcard__title,
.oneup-blog .oneup-blogcard__title {
	margin: 0;
	font-size: 20px;
	font-weight: 700;
	line-height: 1.25;
	letter-spacing: -.01em;
	color: var(--ob-ink);
}
.oneup-blogcard__sum { margin: 0; font-size: 15px; line-height: 1.55; color: var(--ob-muted); }
.oneup-blogcard__meta { margin: auto 0 0; padding-top: 6px; font-size: 13px; color: var(--ob-muted); }

.oneup-blogs__pages { display: flex; gap: 8px; margin-top: 40px; }
.oneup-blogs__pages a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	height: 40px;
	border: 1px solid var(--ob-border);
	border-radius: 10px;
	color: var(--ob-ink);
	font-weight: 700;
	text-decoration: none;
}
.oneup-blogs__pages a[aria-current="page"] { background: var(--ob-accent); border-color: var(--ob-accent); }
.oneup-blogs__none, .oneup-blogs--empty p { margin: 0; padding: 24px; border-radius: 16px; background: var(--ob-surface); }
.oneup-blogs__none a { color: var(--ob-ink); font-weight: 700; }

/* ---------- Detail ---------- */
.oneup-blog { display: block; padding: 64px 24px 0; }
.oneup-blog__wrap { max-width: 760px; margin: 0 auto; }
.oneup-blog__back { margin: 0 0 28px; font-size: 14px; }
.oneup-blog__back a { color: var(--ob-ink); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.oneup-blog__badge { margin: 0 0 18px; }
.oneup-blog__badge a, .oneup-blog__badge {
	color: var(--ob-ink);
	font-size: 13px;
	font-weight: 700;
	text-decoration: none;
}
.oneup-blog__badge a, .oneup-blog__badge:not(:has(a)) {
	display: inline-block;
	padding: 6px 9px;
	border-radius: 6px;
	background: var(--ob-accent);
}
.oneup-blog .oneup-blog__title {
	margin: 0 0 20px;
	font-size: clamp(34px, 5vw, 56px);
	font-weight: 800;
	line-height: 1.05;
	letter-spacing: -.035em;
	color: var(--ob-ink);
}
.oneup-blog__lead { margin: 0 0 28px; font-size: 20px; line-height: 1.55; color: var(--ob-muted); }
.oneup-blog__meta { display: flex; align-items: center; gap: 12px; margin: 0 0 36px; font-size: 14px; line-height: 1.4; }
.oneup-blog__meta strong { display: block; }
.oneup-blog__meta span:not(.oneup-blog__avatar) { color: var(--ob-muted); }
.oneup-blog__avatar {
	position: relative;
	display: inline-flex;
	flex: none;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	overflow: hidden;
	background: var(--ob-accent);
	font-size: 14px;
	font-weight: 800;
	color: var(--ob-ink);
}
.oneup-blog__avatar img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.oneup-blog__cover { margin: 0 0 48px; border-radius: 18px; overflow: hidden; }
.oneup-blog__cover img { display: block; width: 100%; height: auto; }

.oneup-blog__body { max-width: 68ch; font-size: 18px; line-height: 1.7; }
.oneup-blog__body > * { margin: 0 0 1.1em; }
.oneup-blog__body h2 { margin: 1.8em 0 .5em; font-size: 28px; font-weight: 800; line-height: 1.15; letter-spacing: -.02em; color: var(--ob-ink); }
.oneup-blog__body h3 { margin: 1.5em 0 .4em; font-size: 22px; font-weight: 700; line-height: 1.2; color: var(--ob-ink); }
.oneup-blog__body ul, .oneup-blog__body ol { padding-left: 1.3em; }
.oneup-blog__body li { margin: 0 0 .4em; }
.oneup-blog__body a { color: var(--ob-ink); font-weight: 700; text-decoration: underline; text-decoration-color: var(--ob-accent); text-decoration-thickness: 3px; text-underline-offset: 3px; }
.oneup-blog__body img { max-width: 100%; height: auto; border-radius: 14px; }
.oneup-blog__body blockquote { margin-left: 0; padding-left: 18px; border-left: 3px solid var(--ob-ink); }

.oneup-blog__author {
	display: flex;
	gap: 18px;
	align-items: flex-start;
	margin: 56px 0 0;
	padding: 28px;
	border-radius: 16px;
	background: var(--ob-surface);
	font-size: 15px;
	line-height: 1.55;
}
.oneup-blog__author p { margin: 0 0 4px; }
.oneup-blog__author a { color: var(--ob-ink); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.oneup-blog__author-label { font-size: 13px; color: var(--ob-muted); }
.oneup-blog__author-name { font-size: 18px; font-weight: 700; }

.oneup-blog__related { margin-top: 112px; padding: 112px 0; background: var(--ob-surface); margin-left: -24px; margin-right: -24px; }
.oneup-blog__related-inner { max-width: 1160px; margin: 0 auto; padding: 0 24px; }
.oneup-blog__related h2 { margin: 0 0 32px; font-size: clamp(32px, 4vw, 48px); font-weight: 800; line-height: 1.08; letter-spacing: -.03em; color: var(--ob-ink); }
.oneup-blog__related .oneup-blogcard__link { background: #fff; }
.oneup-blog__related .oneup-blogcard__link:hover { background: var(--ob-tint); }
.oneup-blog--empty { padding-bottom: 112px; }
.oneup-blog__button {
	display: inline-block;
	padding: 14px 16px;
	border-radius: 10px;
	background: var(--ob-accent);
	color: var(--ob-ink);
	font-weight: 700;
	text-decoration: none;
}
.oneup-blog:not(:has(.oneup-blog__related)) { padding-bottom: 112px; }

@media (max-width: 767px) {
	.oneup-blog { padding: 40px 16px 0; }
	.oneup-blog__related { margin: 64px -16px 0; padding: 64px 0; }
	.oneup-blog__related-inner { padding: 0 16px; }
	.oneup-blog__body { font-size: 17px; }
	.oneup-blog__author { flex-direction: column; padding: 22px; }
	.oneup-blog:not(:has(.oneup-blog__related)) { padding-bottom: 64px; }
}

/* ---------- Contentblokken (privacyverklaring, voorwaarden) ---------- */
.oneup-content {
	--ob-ink: var(--e-global-color-accent, #171717);
	--ob-muted: var(--e-global-color-text, #4a4a4a);
	--ob-accent: var(--e-global-color-primary, #e5ff00);
	--ob-surface: var(--e-global-color-surface, #f5f5f3);
	--ob-border: var(--e-global-color-border, #e4e4e4);
	width: 100%;
	color: var(--ob-ink);
	font-size: 17px;
	line-height: 1.7;
}
.oneup-content > *, .oneup-content header > *, .oneup-content section > * { margin: 0 0 1em; }
.oneup-content__updated, .oneup-content .muted, .oneup-content .meta { color: var(--ob-muted); font-size: 14px; }
.oneup-content h1 { margin: 1.4em 0 .5em; font-size: 32px; font-weight: 800; line-height: 1.1; letter-spacing: -.02em; color: var(--ob-ink); }
.oneup-content h2 { margin: 1.8em 0 .5em; font-size: 26px; font-weight: 800; line-height: 1.15; letter-spacing: -.02em; color: var(--ob-ink); scroll-margin-top: 110px; }
.oneup-content h3 { margin: 1.4em 0 .4em; font-size: 20px; font-weight: 700; line-height: 1.25; color: var(--ob-ink); scroll-margin-top: 110px; }
.oneup-content ul, .oneup-content ol { padding-left: 1.3em; }
.oneup-content li { margin: 0 0 .4em; }
.oneup-content a { color: var(--ob-ink); text-decoration: underline; text-decoration-color: var(--ob-accent); text-decoration-thickness: 3px; text-underline-offset: 3px; }
.oneup-content hr { margin: 3em 0; border: 0; border-top: 1px solid var(--ob-border); }
.oneup-content nav { margin: 0 0 2.5em; padding: 24px 28px; border-radius: 16px; background: var(--ob-surface); }
.oneup-content nav h2 { margin: 0 0 .6em; font-size: 18px; }
.oneup-content nav ol { margin: 0; columns: 3; column-gap: 32px; font-size: 15px; }
.oneup-content nav li { break-inside: avoid; }
.oneup-content nav a { text-decoration: none; font-weight: 700; }
.oneup-content nav a:hover { text-decoration: underline; }
.oneup-content--empty p { padding: 24px; border-radius: 16px; background: var(--ob-surface); }
@media (max-width: 767px) {
	.oneup-content { font-size: 16px; }
	.oneup-content nav { padding: 20px; }
	.oneup-content nav ol { columns: 1; }
}