/* Boekingsoftware Keuzehulp — token-driven, modern-minimal. */
.bs-quiz {
	--c-paper: var(--wp--preset--color--paper, #fff);
	--c-paper3: var(--wp--preset--color--paper-3, #eef2f7);
	--c-ink: var(--wp--preset--color--ink, #1e293b);
	--c-ink2: var(--wp--preset--color--ink-2, #475569);
	--c-muted: var(--wp--preset--color--muted, #64748b);
	--c-rule: var(--wp--preset--color--rule-2, #d8dee8);
	--c-accent: var(--wp--preset--color--accent, #2f5fe0);
	--c-accent-strong: var(--wp--preset--color--accent-strong, #244bb8);
	--c-accent-soft: var(--wp--preset--color--accent-soft, #eef2fe);
	--c-pos-soft: var(--wp--preset--color--positive-soft, #e7f6ee);
	--c-pos-ink: var(--wp--preset--color--positive-ink, #1d6b43);
	--c-pos: var(--wp--preset--color--positive, #2fa765);
	max-width: 640px;
	font-family: var(--wp--preset--font-family--body, system-ui, sans-serif);
}
.bs-quiz__inner {
	background: var(--c-paper);
	border: 1px solid var(--c-rule);
	border-radius: 16px;
	padding: clamp(1.25rem, 3vw, 2rem);
	box-shadow: 0 4px 12px rgba(30, 41, 59, 0.06);
}
.bs-quiz__progress { display: flex; align-items: center; gap: 1rem; margin-bottom: 1.5rem; }
.bs-quiz__bar { flex: 1; height: 6px; background: var(--c-paper3); border-radius: 999px; overflow: hidden; }
.bs-quiz__bar span { display: block; height: 100%; background: var(--c-accent); border-radius: 999px; transition: width 200ms cubic-bezier(0.22, 1, 0.36, 1); }
.bs-quiz__step { font-size: 0.8rem; color: var(--c-muted); font-family: var(--wp--preset--font-family--mono, monospace); white-space: nowrap; }
.bs-quiz__q { font-family: var(--wp--preset--font-family--display, inherit); font-size: 1.4rem; font-weight: 600; color: var(--c-ink); margin: 0 0 1.25rem; letter-spacing: -0.02em; }
.bs-quiz__lead { color: var(--c-ink2); margin: 0 0 1.25rem; font-size: 0.95rem; }
.bs-quiz__opts { display: grid; gap: 0.6rem; }
.bs-quiz__opt {
	text-align: left; font-size: 1rem; font-weight: 500; color: var(--c-ink);
	background: var(--c-paper); border: 1px solid var(--c-rule); border-radius: 10px;
	padding: 0.9rem 1.1rem; cursor: pointer; font-family: inherit;
	transition: border-color 130ms ease, background 130ms ease, transform 130ms ease;
}
.bs-quiz__opt:hover { border-color: var(--c-accent); background: var(--c-accent-soft); }
.bs-quiz__opt:focus-visible { outline: 2px solid var(--c-accent); outline-offset: 2px; }
.bs-quiz__opt.is-active { border-color: var(--c-accent); background: var(--c-accent-soft); }
.bs-quiz__nav { display: flex; gap: 1rem; margin-top: 1.25rem; }
.bs-quiz__back, .bs-quiz__restart {
	background: transparent; border: 0; color: var(--c-muted); font-weight: 600; cursor: pointer;
	font-family: inherit; font-size: 0.9rem; padding: 0.4rem 0;
}
.bs-quiz__back:hover, .bs-quiz__restart:hover { color: var(--c-ink); }
.bs-quiz__results { display: grid; gap: 0.85rem; }
.bs-quiz__card {
	position: relative; background: var(--c-paper3); border: 1px solid var(--c-rule);
	border-radius: 12px; padding: 1.1rem 1.25rem; display: flex; flex-direction: column; gap: 0.35rem;
}
.bs-quiz__card:first-child { border-color: var(--c-pos); background: var(--c-pos-soft); }
.bs-quiz__badge {
	align-self: flex-start; font-size: 0.7rem; font-weight: 700; text-transform: uppercase;
	letter-spacing: 0.04em; color: var(--c-pos-ink); border: 1px solid var(--c-pos);
	padding: 0.1rem 0.5rem; border-radius: 999px;
}
.bs-quiz__toolname { font-family: var(--wp--preset--font-family--display, inherit); font-size: 1.2rem; font-weight: 600; color: var(--c-ink); }
.bs-quiz__why { color: var(--c-ink2); font-size: 0.9rem; margin: 0; }
.bs-quiz__cta { align-self: flex-start; font-weight: 600; color: var(--c-accent); text-decoration: none; font-size: 0.95rem; }
.bs-quiz__cta:hover { color: var(--c-accent-strong); text-decoration: underline; }
.bs-quiz__note { font-size: 0.8rem; color: var(--c-muted); margin: 1.25rem 0 0; }
@media (prefers-reduced-motion: reduce) {
	.bs-quiz__bar span, .bs-quiz__opt { transition: none; }
}