/*
 * Witgoed-Gids 3.2.17 — desktop redactionele typografie
 *
 * Definitieve desktoplaag voor echte leestekst.
 * - 16px / 1.72 voor redactionele bodycopy
 * - één rustige bodykleur en linkkleur
 * - functionele UI (badges, specs, CTA's, navigatie) blijft compact
 * - mobiel blijft volledig onder 05-mobile-normalization.css vallen
 */

@media (min-width: 781px) {
	:root {
		--wg-editorial-copy: #405163;
		--wg-editorial-muted: #66768a;
		--wg-editorial-link: #0b668f;
		--wg-editorial-size: 16px;
		--wg-editorial-line-height: 1.72;
	}

	/* ============================================================
	 * Gewone pagina's + redactionele tekst onder apparatenlistings
	 * ============================================================ */
	.wg-page__content,
	.wg-page__content p,
	.wg-page__content li,
	.wg-listing-bottom .wg-listing-editorial__content,
	.wg-listing-bottom .wg-listing-editorial__content p,
	.wg-listing-bottom .wg-listing-editorial__content li {
		color: var(--wg-editorial-copy);
		font-size: var(--wg-editorial-size);
		line-height: var(--wg-editorial-line-height);
	}

	/* ============================================================
	 * Kennis — bestaande 3.2.14-verbetering behouden
	 * Direct antwoord / cards / sidebar blijven eigen UI-typografie.
	 * ============================================================ */
	body.single-kennis .wg-knowledge-content,
	body.single-kennis .wg-knowledge-content p,
	body.single-kennis .wg-knowledge-content li {
		color: var(--wg-editorial-copy);
		font-size: var(--wg-editorial-size);
		line-height: var(--wg-editorial-line-height);
	}

	/* ============================================================
	 * Problemen — daadwerkelijke uitlegtekst in de probleemflow.
	 * Nummering, labels, benodigdheden, onderdelen en CTA's blijven
	 * bewust op hun compacte componentmaten.
	 * ============================================================ */
	body.single-probleem .wg-problem-causes__item p,
	body.single-probleem .wg-problem-steps__content p,
	body.single-probleem .wg-problem-faq__item > div,
	body.single-probleem .wg-problem-faq__item > div p {
		color: var(--wg-editorial-copy);
		font-size: var(--wg-editorial-size);
		line-height: var(--wg-editorial-line-height);
	}

	/* Losse vrije content wanneer een probleemtemplate die bevat. */
	body.single-probleem .wg-problem__main > p,
	body.single-probleem .wg-problem__main > ul,
	body.single-probleem .wg-problem__main > ol,
	body.single-probleem .wg-problem__main > ul > li,
	body.single-probleem .wg-problem__main > ol > li {
		color: var(--wg-editorial-copy);
		font-size: var(--wg-editorial-size);
		line-height: var(--wg-editorial-line-height);
	}

	/* ============================================================
	 * Koopgidsen — niet alleen de wrapper, maar ook de echte p/li's.
	 * Productcards, vergelijking, badges, prijzen en CTA's vallen
	 * expres buiten deze selectors.
	 * ============================================================ */
	body.single-koopgids .wg-koopgids__intro-text,
	body.single-koopgids .wg-koopgids__intro-text p,
	body.single-koopgids .wg-koopgids__intro-text li,
	body.single-koopgids .wg-koopgids__method-text,
	body.single-koopgids .wg-koopgids__method-text p,
	body.single-koopgids .wg-koopgids__method-text li,
	body.single-koopgids .wg-koopgids-editorial__text,
	body.single-koopgids .wg-koopgids-editorial__text p,
	body.single-koopgids .wg-koopgids-editorial__text li,
	body.single-koopgids .wg-koopgids-conclusion__text,
	body.single-koopgids .wg-koopgids-conclusion__text p,
	body.single-koopgids .wg-koopgids-conclusion__text li,
	body.single-koopgids .wg-koopgids-page__editor-content,
	body.single-koopgids .wg-koopgids-page__editor-content p,
	body.single-koopgids .wg-koopgids-page__editor-content li {
		color: var(--wg-editorial-copy);
		font-size: var(--wg-editorial-size);
		line-height: var(--wg-editorial-line-height);
	}

	/* ============================================================
	 * Apparaat single — alleen redactionele review/uitlegzones.
	 * Intro is al bewust groter (18px) en blijft dat. Specs, scores,
	 * samenvatting en verkoopblokken behouden hun eigen typografie.
	 * ============================================================ */
	body.single-apparaat .wg-editorial-key-quality__text,
	body.single-apparaat .wg-editorial-key-quality__text p,
	body.single-apparaat .wg-editorial-conclusion p {
		color: var(--wg-editorial-copy);
		font-size: var(--wg-editorial-size);
		line-height: var(--wg-editorial-line-height);
	}

	body.single-apparaat .wg-editorial-intro,
	body.single-apparaat .wg-editorial-intro p {
		color: var(--wg-editorial-copy);
	}

	/* Reviewkaarten zijn functionele cards, maar de gewone uitlegcopy
	 * krijgt dezelfde tekstkleur voor een rustiger geheel. Grootte blijft
	 * bewust de bestaande compacte 15px. */
	body.single-apparaat .wg-review-section__intro,
	body.single-apparaat .wg-review-section__closing,
	body.single-apparaat .wg-review-empty {
		color: var(--wg-editorial-copy);
	}

	/* ============================================================
	 * Redactionele links — één herkenbare rustige accentkleur.
	 * Buttons/CTA's worden niet meegenomen.
	 * ============================================================ */
	.wg-page__content a:not([class*="button"]):not([class*="cta"]),
	.wg-listing-bottom .wg-listing-editorial__content a:not([class*="button"]):not([class*="cta"]),
	body.single-kennis .wg-knowledge-content a:not([class*="button"]):not([class*="cta"]),
	body.single-probleem .wg-problem-causes__item p a,
	body.single-probleem .wg-problem-steps__content p a,
	body.single-probleem .wg-problem-faq__item > div a,
	body.single-probleem .wg-problem__main > p a,
	body.single-probleem .wg-problem__main > ul a,
	body.single-probleem .wg-problem__main > ol a,
	body.single-koopgids .wg-koopgids__intro-text a,
	body.single-koopgids .wg-koopgids__method-text a,
	body.single-koopgids .wg-koopgids-editorial__text a,
	body.single-koopgids .wg-koopgids-conclusion__text a,
	body.single-koopgids .wg-koopgids-page__editor-content a,
	body.single-apparaat .wg-editorial-intro a,
	body.single-apparaat .wg-editorial-key-quality__text a,
	body.single-apparaat .wg-editorial-conclusion a {
		color: var(--wg-editorial-link);
	}

	/* Eén mutedkleur waar een redactioneel metaelement voorkomt. */
	.wg-page__content .wg-meta,
	body.single-kennis .wg-knowledge-content .wg-meta,
	body.single-probleem .wg-problem__main .wg-meta,
	body.single-koopgids .wg-koopgids-page__editor-content .wg-meta,
	body.single-apparaat .wg-editorial-section .wg-meta {
		color: var(--wg-editorial-muted);
	}

	/* ============================================================
	 * Desktop editorial layout — kortere regels en consistenter ritme.
	 * Alleen echte leeskolommen; summary/cards/hubs blijven breed.
	 * ============================================================ */
	@media (min-width: 981px) {
		body.single-kennis .wg-knowledge-content p,
		body.single-kennis .wg-knowledge-content ul,
		body.single-kennis .wg-knowledge-content ol {
			margin-bottom: 21px;
		}

		body.single-kennis .wg-knowledge-content h2 {
			margin-top: 46px;
			margin-bottom: 15px;
		}

		body.single-probleem .wg-problem-causes__item p,
		body.single-probleem .wg-problem-steps__content p {
			margin-bottom: 0;
		}
	}

	/* ============================================================
	 * Koopgidsen — ook de daadwerkelijk zichtbare intro's meenemen.
	 * Het selectieoverzicht en product-UI behouden hun compacte schaal.
	 * ============================================================ */
	body.single-koopgids .wg-koopgids-page .wg-hub-hero__content > p,
	body.single-koopgids .wg-koopgids__selection-intro,
	body.single-koopgids .wg-koopgids-comparison__intro {
		color: var(--wg-editorial-copy);
		font-size: var(--wg-editorial-size);
		line-height: var(--wg-editorial-line-height);
	}

	@media (min-width: 960px) {
		body.single-koopgids .wg-koopgids-page .wg-hub-hero__content > p {
			max-width: 760px;
			margin-top: 14px;
		}

		body.single-koopgids .wg-koopgids__selection-header,
		body.single-koopgids .wg-koopgids__selection-intro {
			max-width: 760px;
		}

		body.single-koopgids .wg-koopgids__selection-intro {
			margin-top: 8px;
		}

		body.single-koopgids .wg-koopgids-editorial__text,
		body.single-koopgids .wg-koopgids-conclusion__text,
		body.single-koopgids .wg-koopgids-page__editor-content {
			max-width: 780px;
		}

		body.single-koopgids .wg-koopgids-editorial__text p,
		body.single-koopgids .wg-koopgids-conclusion__text p,
		body.single-koopgids .wg-koopgids-page__editor-content p {
			margin-bottom: 21px;
		}
	}

}
