/* ================================================================== *
 * Comparison detail ("soorten vergelijken")
 * ================================================================== */

/* Shared mono label */
.dk-vdetail__lbl {
	font-family: var(--dk-font-mono);
	font-size: 10.5px;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--dk-text-light);
}

.dk-vdetail__lbl--green { color: var(--dk-green); }
.dk-vdetail__lbl--warn { color: #9a6b2f; }
.dk-vdetail__lbl--ocher { color: var(--dk-ocher-bright); }

/* Brand paw bullet */
.dk-vdetail__paw {
	display: inline-block;
	width: 9px;
	height: 8px;
	background: var(--dk-ocher);
	border-radius: var(--dk-paw);
	flex: 0 0 auto;
}

.dk-vdetail__paw--green { background: var(--dk-green); }

/* ---- Header band ---- */
.dk-vdetail__band {
	background: var(--dk-paper-light);
	border-bottom: 1px solid var(--dk-border);
}

.dk-vdetail__bandinner {
	padding-block: 32px 28px;
	display: flex;
	flex-direction: column;
	gap: 15px;
}

.dk-vdetail__crumb {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	font-family: var(--dk-font-mono);
	font-size: 10.5px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--dk-text-light);
}

.dk-vdetail__crumb a { color: var(--dk-green); }
.dk-vdetail__crumb span[aria-hidden] { color: var(--dk-border-xlight); }
.dk-vdetail__crumb [aria-current] { color: var(--dk-text); }

.dk-vdetail__kicker {
	font-family: var(--dk-font-mono);
	font-size: 11px;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--dk-ocher);
}

.dk-vdetail__title {
	font-size: clamp(32px, 4.5vw, 46px);
	line-height: 1.04;
	letter-spacing: -0.015em;
	margin: 0;
	max-width: 880px;
}

.dk-vdetail__lead {
	font-family: var(--dk-font-serif);
	font-style: italic;
	font-size: 20px;
	line-height: 1.5;
	color: var(--dk-text-grey);
	margin: 0;
	max-width: 780px;
}

.dk-vdetail__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0 22px;
	row-gap: 6px;
	padding-top: 4px;
	font-size: 13.5px;
	color: var(--dk-text-muted-2);
}

.dk-vdetail__author {
	display: flex;
	align-items: center;
	gap: 8px;
	color: var(--dk-text);
}

.dk-vdetail__avatar {
	width: 26px;
	height: 26px;
	border-radius: 50%;
	overflow: hidden;
	background: var(--dk-border);
	flex: 0 0 auto;
	line-height: 0;
}

.dk-vdetail__notsponsored { color: var(--dk-green); font-weight: 500; }

/* ---- Split ---- */
.dk-vdetail__split {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 380px;
	gap: 52px;
	align-items: start;
}

.dk-vdetail__article {
	display: flex;
	flex-direction: column;
	gap: 34px;
	padding-top: 38px;
	min-width: 0;
}

.dk-vdetail__intro {
	font-size: 17px;
	line-height: 1.75;
	color: var(--dk-text);
	margin: 0;
}

.dk-vdetail__sec {
	display: flex;
	flex-direction: column;
	gap: 18px;
}

.dk-vdetail__sec h2 {
	font-size: 30px;
	line-height: 1.15;
	margin: 0;
}

/* Korte versie */
.dk-vdetail__kort {
	background: var(--dk-paper-light);
	border: 1px solid var(--dk-border);
	border-left: 3px solid var(--dk-green);
	padding: 24px 26px;
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.dk-vdetail__kortlist { display: flex; flex-direction: column; gap: 9px; }

.dk-vdetail__kortitem {
	display: flex;
	gap: 10px;
	align-items: flex-start;
	font-size: 16px;
	line-height: 1.65;
	color: var(--dk-text);
}

.dk-vdetail__kortitem .dk-vdetail__paw { margin-top: 6px; }

/* Factoren */
.dk-vdetail__factoren { border-top: 1px solid var(--dk-border); }

.dk-vdetail__factor {
	display: grid;
	grid-template-columns: 190px minmax(0, 1fr);
	gap: 24px;
	padding: 18px 0;
	border-bottom: 1px solid var(--dk-border);
}

.dk-vdetail__factor-l {
	font-family: var(--dk-font-serif);
	font-size: 20px;
	line-height: 1.25;
	color: var(--dk-ink);
}

.dk-vdetail__factor-t {
	font-size: 16px;
	line-height: 1.7;
	color: var(--dk-text);
}

/* Soort cards */
.dk-vdetail__soorten { display: flex; flex-direction: column; gap: 26px; }

.dk-vdetail__soort {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 236px;
	gap: 28px;
	align-items: start;
	background: var(--dk-paper-light);
	border: 1px solid var(--dk-border);
	padding: 26px 28px;
	scroll-margin-top: 90px;
}

.dk-vdetail__soort-prose { display: flex; flex-direction: column; gap: 14px; min-width: 0; }

.dk-vdetail__soort-kicker { display: flex; align-items: center; gap: 12px; }

.dk-vdetail__soort-kicker > span:first-child {
	font-family: var(--dk-font-mono);
	font-size: 10px;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--dk-ocher);
}

.dk-vdetail__hr { height: 1px; flex: 1 1 0; background: var(--dk-border-light); }

.dk-vdetail__soort-prose h3 {
	font-size: 26px;
	line-height: 1.15;
	margin: 0;
}

.dk-vdetail__soort-prose p {
	font-size: 16.5px;
	line-height: 1.7;
	color: var(--dk-text);
	margin: 0;
}

.dk-vdetail__geschikt { display: flex; flex-direction: column; gap: 4px; }
.dk-vdetail__geschikt span:last-child { font-size: 16px; line-height: 1.7; color: var(--dk-text); }

.dk-vdetail__pm {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 18px;
	padding-top: 4px;
	border-top: 1px solid var(--dk-border-light);
}

.dk-vdetail__pmcol { display: flex; flex-direction: column; gap: 7px; padding-top: 12px; }

.dk-vdetail__pmrow {
	display: flex;
	gap: 8px;
	font-size: 15px;
	line-height: 1.6;
	color: var(--dk-text);
}

.dk-vdetail__pmsign--plus { color: var(--dk-green); }
.dk-vdetail__pmsign--min { color: #9a6b2f; }

/* Soort spec-strip */
.dk-vdetail__soort-rail {
	display: flex;
	flex-direction: column;
	gap: 12px;
	border-left: 1px solid var(--dk-border);
	padding-left: 24px;
	min-width: 0;
}

/* Packshot, niet redactionele fotografie: het hele product moet zichtbaar zijn.
 * Daarom object-fit: contain in plaats van de .dk-media-default (cover), en een
 * vaste hoogte zodat de kaarten naast elkaar op gelijke hoogte blijven. Een
 * staande zak wordt zo smal en hoog getoond, een liggende doos breed en laag,
 * maar nooit afgesneden. */
.dk-vdetail__soort-foto {
	height: 200px;
}

.dk-vdetail .dk-vdetail__soort-foto--photo {
	background: var(--dk-paper-light);
	border: 1px solid var(--dk-border-light);
	padding: 10px;
}

.dk-vdetail .dk-vdetail__soort-foto img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: center;
}

.dk-vdetail__soort-cijfer {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 10px;
}

.dk-vdetail__cijfer {
	font-family: var(--dk-font-serif);
	font-size: 26px;
	line-height: 1;
}

.dk-vdetail__specs { border-top: 1px solid var(--dk-border-light); }

.dk-vdetail__spec {
	display: flex;
	justify-content: space-between;
	gap: 10px;
	padding: 7px 0;
	border-bottom: 1px solid var(--dk-border-light);
	font-size: 12.5px;
}

.dk-vdetail__spec span:first-child { color: var(--dk-text-muted-2); }
.dk-vdetail__spec span:last-child { color: var(--dk-ink); text-align: right; }

.dk-vdetail__soort-prod { display: flex; flex-direction: column; gap: 7px; padding-top: 2px; }
.dk-vdetail__prodname { font-size: 13.5px; line-height: 1.5; color: var(--dk-text); }

.dk-vdetail__affbtn {
	background: var(--dk-green);
	color: var(--dk-paper-light);
	font-size: 13px;
	font-weight: 600;
	text-align: center;
	padding: 9px 12px;
}

.dk-vdetail__affbtn:hover { background: var(--dk-green-hover); text-decoration: none; color: var(--dk-paper-light); }

.dk-vdetail__afflbl {
	font-family: var(--dk-font-mono);
	font-size: 9.5px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--dk-text-lighter);
}

/* Matrix */
.dk-vdetail__matrixwrap { border: 1px solid var(--dk-border); background: var(--dk-paper-light); overflow-x: auto; }

.dk-vdetail__matrix { width: 100%; min-width: 660px; border-collapse: collapse; }

.dk-vdetail__matrix thead th {
	background: var(--dk-dark-bg);
	color: #d8d3c9;
	font-family: var(--dk-font-mono);
	font-size: 10px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	text-align: left;
	padding: 13px 10px;
}

.dk-vdetail__matrix thead th:first-child { padding-left: 14px; }

.dk-vdetail__matrix tbody th {
	text-align: left;
	font-weight: 400;
	font-size: 14px;
	color: var(--dk-ink);
	padding: 12px 14px;
	border-right: 1px solid var(--dk-border-light);
	border-bottom: 1px solid var(--dk-border-light);
}

.dk-vdetail__matrix tbody td {
	font-size: 13.5px;
	line-height: 1.45;
	color: var(--dk-text-grey);
	padding: 12px 10px;
	border-right: 1px solid var(--dk-border-light);
	border-bottom: 1px solid var(--dk-border-light);
	vertical-align: top;
}

.dk-vdetail__matrix tbody tr:nth-child(even) { background: var(--dk-paper-warm); }

.dk-vdetail__matrix td.is-best { color: var(--dk-green); font-weight: 600; }

.dk-vdetail__note {
	font-family: var(--dk-font-mono);
	font-size: 11.5px;
	line-height: 1.8;
	color: var(--dk-text-grey);
}

/* Situaties */
.dk-vdetail__situaties { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }

.dk-vdetail__situatie {
	background: var(--dk-paper-accent);
	border: 1px solid var(--dk-border);
	padding: 20px 22px;
	display: flex;
	flex-direction: column;
	gap: 9px;
}

.dk-vdetail__sit-t { font-family: var(--dk-font-serif); font-size: 20px; line-height: 1.25; color: var(--dk-ink); }
.dk-vdetail__sit-x { font-size: 15.5px; line-height: 1.7; color: var(--dk-text); }
.dk-vdetail__sit-k {
	font-family: var(--dk-font-mono);
	font-size: 10px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--dk-green);
}

/* FAQ */
.dk-vdetail__faq { border-top: 1px solid var(--dk-border); }

.dk-vdetail__faqitem { border-bottom: 1px solid var(--dk-border); }

.dk-vdetail__faqitem summary {
	list-style: none;
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 16px;
	padding: 16px 0;
	cursor: pointer;
}

.dk-vdetail__faqitem summary::-webkit-details-marker { display: none; }

.dk-vdetail__faqitem summary h3 {
	font-size: 20px;
	line-height: 1.3;
	margin: 0;
}

.dk-vdetail__faqsign {
	flex: 0 0 auto;
	position: relative;
	width: 14px;
	height: 14px;
}

.dk-vdetail__faqsign::before,
.dk-vdetail__faqsign::after {
	content: "";
	position: absolute;
	background: var(--dk-green);
}

.dk-vdetail__faqsign::before { left: 0; top: 6px; width: 14px; height: 2px; }
.dk-vdetail__faqsign::after { left: 6px; top: 0; width: 2px; height: 14px; }
.dk-vdetail__faqitem[open] .dk-vdetail__faqsign::after { display: none; }

.dk-vdetail__faqitem p {
	margin: 0;
	padding: 0 0 18px;
	font-size: 16px;
	line-height: 1.75;
	color: var(--dk-text);
	max-width: 660px;
}

/* Tot slot */
.dk-vdetail__slot {
	background: var(--dk-dark-bg);
	padding: 26px 28px;
	display: flex;
	flex-direction: column;
	gap: 11px;
}

.dk-vdetail__slot-t { font-family: var(--dk-font-serif); font-size: 24px; line-height: 1.25; color: var(--dk-paper-light); max-width: 620px; }
.dk-vdetail__slot-x { font-size: 15px; line-height: 1.7; color: #a9a49a; max-width: 620px; }

/* Verantwoording */
.dk-vdetail__verantw { border-top: 1px solid var(--dk-border); padding-top: 20px; display: flex; flex-direction: column; gap: 11px; }
.dk-vdetail__verantw p { font-size: 14px; line-height: 1.7; color: var(--dk-text-grey); margin: 0; }

/* ================================================================== *
 * Sticky rail
 * ================================================================== */
.dk-vdetail__rail {
	padding-top: 38px;
	display: flex;
	flex-direction: column;
	gap: 16px;
	min-width: 0;
}

.dk-vdetail__scorecard {
	position: sticky;
	top: 20px;
	border: 1px solid var(--dk-border);
	background: var(--dk-paper-light);
}

.dk-vdetail__scorehead { background: var(--dk-dark-bg); padding: 15px 18px; display: flex; flex-direction: column; gap: 5px; }
.dk-vdetail__scoreintro { font-size: 13px; line-height: 1.55; color: #a9a49a; }

.dk-vdetail__scorerow {
	display: flex;
	flex-direction: column;
	gap: 5px;
	padding: 13px 18px;
	border-bottom: 1px solid var(--dk-border-light);
	color: inherit;
}

.dk-vdetail__scorerow:nth-child(even) { background: var(--dk-paper-warm); }
.dk-vdetail__scorerow:hover { text-decoration: none; background: var(--dk-paper-accent); }

.dk-vdetail__scoretop,
.dk-vdetail__scorebot { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.dk-vdetail__scorenaam { font-size: 14.5px; color: var(--dk-ink); }
.dk-vdetail__scorecijfer { font-family: var(--dk-font-serif); font-size: 19px; line-height: 1; }
.dk-vdetail__scorekort { font-size: 12.5px; line-height: 1.45; color: var(--dk-text-muted-2); }
.dk-vdetail__scoreprijs { flex: 0 0 auto; font-family: var(--dk-font-mono); font-size: 11px; color: var(--dk-text-grey); }

.dk-vdetail__scorefoot { padding: 13px 18px; display: flex; flex-direction: column; gap: 8px; }
.dk-vdetail__scorefoot span { font-size: 13px; line-height: 1.6; color: var(--dk-text-grey); }
.dk-vdetail__scorebtn {
	border: 1.5px solid var(--dk-ink);
	color: var(--dk-ink);
	font-size: 13px;
	font-weight: 600;
	text-align: center;
	padding: 9px 12px;
}
.dk-vdetail__scorebtn:hover { background: var(--dk-ink); color: var(--dk-paper-light); text-decoration: none; }

/* Weging */
.dk-vdetail__weging {
	border: 1px solid var(--dk-border);
	background: var(--dk-paper-accent);
	padding: 18px 20px;
	display: flex;
	flex-direction: column;
	gap: 11px;
}

.dk-vdetail__wrow { display: flex; flex-direction: column; gap: 5px; }
.dk-vdetail__wtop { display: flex; justify-content: space-between; font-size: 13.5px; color: var(--dk-text); }
.dk-vdetail__wpct { font-family: var(--dk-font-mono); font-size: 12px; color: var(--dk-text-grey); }
.dk-vdetail__wbar { height: 4px; background: var(--dk-border); }
.dk-vdetail__wbar span { display: block; height: 4px; background: var(--dk-green); }

/* Rail TOC + Ook vergeleken */
.dk-vdetail__toc,
.dk-vdetail__ook {
	border: 1px solid var(--dk-border);
	background: var(--dk-paper-light);
	padding: 18px 20px;
	display: flex;
	flex-direction: column;
	gap: 9px;
}

.dk-vdetail__toc a { font-size: 14px; line-height: 1.5; color: var(--dk-green); }
.dk-vdetail__ook { gap: 10px; }
.dk-vdetail__ookitem { display: flex; flex-direction: column; gap: 2px; color: inherit; }
.dk-vdetail__ookitem:hover { text-decoration: none; }
.dk-vdetail__ooktitle { font-family: var(--dk-font-serif); font-size: 17px; line-height: 1.25; color: var(--dk-ink); }
.dk-vdetail__ookitem:hover .dk-vdetail__ooktitle { color: var(--dk-green); }
.dk-vdetail__ookmeta {
	font-family: var(--dk-font-mono);
	font-size: 10px;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--dk-text-lighter);
}

/* ================================================================== *
 * Full-width product table
 * ================================================================== */
.dk-vdetail__prodwrap {
	padding-top: 52px;
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.dk-vdetail__prodhead-row {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 20px;
	flex-wrap: wrap;
	border-bottom: 2px solid var(--dk-ink);
	padding-bottom: 10px;
}

.dk-vdetail__prodhead-row h2 { font-size: 28px; margin: 0; }
.dk-vdetail__prodhead-row span { font-size: 13.5px; color: var(--dk-text-muted-2); }

.dk-vdetail__prodtable-scroll { border: 1px solid var(--dk-border); background: var(--dk-paper-light); overflow-x: auto; }

.dk-vdetail__prodtable { width: 100%; min-width: 780px; border-collapse: collapse; }

.dk-vdetail__prodtable thead th {
	background: var(--dk-dark-bg);
	color: #d8d3c9;
	font-family: var(--dk-font-mono);
	font-size: 10px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	text-align: left;
	padding: 13px 8px;
}

.dk-vdetail__prodtable thead th:first-child { padding-left: 16px; }

.dk-vdetail__prodtable tbody td {
	padding: 13px 8px;
	border-bottom: 1px solid var(--dk-border-light);
	vertical-align: middle;
}

.dk-vdetail__prodtable tbody tr:nth-child(even) { background: var(--dk-paper-warm); }

.dk-vdetail__prod-naam { padding-left: 16px !important; display: flex; flex-direction: column; gap: 2px; }
.dk-vdetail__prod-naam > span:first-child { font-size: 14.5px; color: var(--dk-ink); }
.dk-vdetail__prod-soort {
	font-family: var(--dk-font-mono);
	font-size: 9.5px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--dk-text-lighter);
}

.dk-vdetail__prod-mlink { display: none; font-size: 12.5px; font-weight: 600; color: var(--dk-green); }
.dk-vdetail__prod-cijfer { font-family: var(--dk-font-serif); font-size: 19px; }
.dk-vdetail__prod-prijs { font-size: 13.5px; color: var(--dk-text); white-space: nowrap; }
.dk-vdetail__prod-kenmerk { font-size: 13.5px; line-height: 1.5; color: var(--dk-text-grey); }

.dk-vdetail__prod-link a {
	display: block;
	border: 1.5px solid var(--dk-ink);
	color: var(--dk-ink);
	font-size: 12.5px;
	font-weight: 600;
	padding: 8px 10px;
	text-align: center;
}

.dk-vdetail__prod-link a:hover { background: var(--dk-ink); color: var(--dk-paper-light); text-decoration: none; }

/* ================================================================== *
 * Responsive
 * ================================================================== */
@media (max-width: 1040px) {
	.dk-vdetail__split { grid-template-columns: 1fr; gap: 34px; }
	.dk-vdetail__rail { padding-top: 0; }
	.dk-vdetail__scorecard { position: static; }
	.dk-vdetail__soort { grid-template-columns: 1fr; }
	.dk-vdetail__soort-rail { border-left: 0; border-top: 1px solid var(--dk-border); padding-left: 0; padding-top: 16px; }
}

@media (max-width: 700px) {
	.dk-vdetail__factor { grid-template-columns: 1fr; gap: 6px; }
	.dk-vdetail__situaties { grid-template-columns: 1fr; }
	.dk-vdetail__pm { grid-template-columns: 1fr; }
	.dk-vdetail__prodtable [data-m="hidecol"] { display: none; }
	.dk-vdetail__prod-mlink { display: inline-block; margin-top: 4px; }
	.dk-vdetail__prodtable { min-width: 0; }
}