/* WASDROOG-COMBINATIE.NL — shared design system
   This file is the only active stylesheet. Edit tokens and components here.
   Article topics never get their own width, table, label or button rules. */

/* 1. Design values: one source for every page and component. */

@font-face { font-family: DM; src: url("/assets/dm-sans.woff2") format("woff2"); font-weight: 100 1000; font-display: swap; }

@font-face { font-family: Manrope; src: url("/assets/manrope.woff2") format("woff2"); font-weight: 200 800; font-display: swap; }

:root {
  --font-body: DM, Arial, sans-serif;
  --font-heading: Manrope, DM, Arial, sans-serif;
  --blue: #195cff; --blue-hover: #0e48d7; --dark: #142342;
  --muted: #526176; --quiet: #63718a; --line: #dce5ef;
  --pale: #f3f6fc; --lime: #d9f79b; --white: #fff;
  --page-width: 1280px; --page-gutter: 36px;
  --reading-width: 940px; --text-measure: 78ch; --prose-measure: 66ch;
  --sidebar-width: 220px; --column-gap: 48px;
  --section-space: 44px; --section-padding: 48px; --panel-padding: 28px;
  --body-size: 17px; --body-leading: 1.8;
  --h1-size: 44px; --h2-size: 32px; --h3-size: 23px;
  --card-radius: 16px; --table-radius: 12px; --control-radius: 10px;
  --table-padding: 17px 19px; --table-font-size: 14px;
  --button-padding: 13px 20px; --button-size: 14px; --button-height: 51px;
  --label-size: 12px; --label-padding: 6px 10px;
  --anchor-offset: 110px; --ease-out: cubic-bezier(.22,1,.36,1);
}

@media (max-width: 1100px) {
  :root { --page-gutter: 28px; --sidebar-width: 200px; --column-gap: 32px; }
}

@media (max-width: 900px) {
  :root { --page-gutter: 24px; --column-gap: 28px; --h1-size: 40px; }
}

@media (max-width: 600px) {
  :root {
    --page-gutter: 20px; --section-space: 32px; --section-padding: 32px;
    --panel-padding: 20px; --body-size: 16px;
    --h1-size: 32px; --h2-size: 27px; --h3-size: 22px;
    --table-padding: 14px 16px; --table-font-size: 13px;
    --button-padding: 9px 14px; --button-height: 44px;
    --label-size: 11px; --label-padding: 5px 8px;
  }
}

@media (max-width: 360px) {
  :root { --h1-size: 28px; --h2-size: 24px; }
}

/* 2. Foundation and shared page geometry. */

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body { margin: 0; font: var(--body-size)/var(--body-leading) var(--font-body); color: var(--dark); background: var(--white); -webkit-font-smoothing: antialiased; }

a { color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; }

button, input, select, textarea { font: inherit; }

button { cursor: pointer; }

button, input, select { color: inherit; }

img { display: block; max-width: 100%; height: auto; }

svg { max-width: 100%; }

h1, h2, h3, h4, p { margin: 0; }

h1, h2, h3, h4 { font-family: var(--font-heading); font-weight: 650; letter-spacing: -.035em; line-height: 1.25; overflow-wrap: break-word; }

h1 { font-size: var(--h1-size); hyphens:auto; }

h2 { font-size: var(--h2-size); }

h3 { font-size: var(--h3-size); }

:focus-visible { outline: 3px solid var(--blue); outline-offset: 4px; }

[hidden] { display: none !important; }

.wrap { width: calc(100% - var(--page-gutter) * 2); max-width: var(--page-width); margin-inline: auto; }

section[id], li[id], .full-review[id], #beoordeling { scroll-margin-top: var(--anchor-offset); }

.visually-hidden, .skip-link:not(:focus) { position: absolute; top: 0; left: 0; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }

.skip-link:focus { position: fixed; top: 12px; left: 12px; z-index: 200; padding: 12px 18px; background: white; color: var(--blue); }

.section-kicker { display: block; color: #47658b; font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; margin-bottom: 14px; }

.content-layout, .product-reviews-layout { display: grid; grid-template-columns: var(--sidebar-width) minmax(0,1fr); gap: var(--column-gap); align-items: start; }

.content-layout { padding-block: var(--section-padding) 32px; border-top: 1px solid var(--line); margin-top: 20px; }

.guide-content, .article-main { min-width: 0; max-width: var(--reading-width); }

/* Reading columns share the menu's right edge while keeping the left sidebar. */
.content-layout > .guide-content, .product-reviews-layout > .article-main { max-width: none; --text-measure: 100%; --prose-measure: 100%; }

.chapter { padding-bottom: var(--section-space); margin-bottom: var(--section-space); border-bottom: 1px solid var(--line); }

.chapter:last-child { border-bottom: 0; }

.chapter h2 { font-size: var(--h2-size); line-height: 1.28; max-width: 31ch; margin-bottom: 24px; }

.chapter h3 { font-size: var(--h3-size); line-height: 1.35; margin: 28px 0 18px; }

.prose { color: #40516c; }

.chapter p:not(.label,.review-label), .full-review > p:not(.label,.review-label), .article-main > p { font-size: var(--body-size); line-height: var(--body-leading); max-width: var(--text-measure); margin-bottom: 22px; }

.prose > p:not(.label,.review-label) { max-width: var(--prose-measure); }
.chapter > :last-child, .chapter > p:last-child, .chapter > figure:last-child { margin-bottom: 0; }

.chapter strong { color: #253f60; font-weight: 650; }

.prose a:not(.button), .bronnoot a, .guide-content p a:not(.button) { color: var(--blue); text-decoration: underline; text-underline-offset: 3px; overflow-wrap: anywhere; }

.prose ul, .prose ol { padding-left: 24px; margin: 22px 0; }

.prose li { margin-bottom: 12px; }

.sources-chapter li { font-size: 14px; line-height: 1.8; }

/* Article photographs share the reading column, spacing and palette. */
.editorial-photo { margin: 28px 0; scroll-margin-top: var(--anchor-offset); }
.editorial-photo img { width: 100%; height: auto; border-radius: var(--card-radius); background: var(--pale); }
.editorial-photo figcaption { margin-top: 12px; color: var(--muted); font-size: 14px; line-height: 1.65; }

/* Completed article illustrations use the same palette and reading-column width. */
.article-illustration { margin: 30px 0; padding: 28px; background: var(--pale); border: 1px solid var(--line); border-radius: var(--card-radius); scroll-margin-top: var(--anchor-offset); }
.article-illustration > h3 { margin: 0 0 24px; font-size: 23px; line-height: 1.3; }
.article-illustration > figcaption { margin-top: 20px; font-size: 14px; line-height: 1.65; color: var(--muted); }
.laundry-route { display: grid; grid-template-columns: 1fr 24px 1fr 24px 1.2fr; align-items: center; gap: 12px; margin: 16px 0; }
.laundry-route > div { padding: 20px 14px; border-radius: 12px; text-align: center; background: #fff; }
.laundry-route > div strong { display: block; font-size: 28px; color: #142342; line-height: 1.2; margin-bottom: 8px; }
.laundry-route > div span { display: block; font-size: 14px; line-height: 1.45; }
.laundry-route .laundry-route-dry { background: #195cff; color: white; }
.laundry-route .laundry-route-dry strong { color: white; }
.laundry-route .laundry-route-rest { background: #d9f79b; }
.laundry-route-arrow,.laundry-route-plus { text-align: center; font-size: 24px; color: #142342; }
.dimension-drawing { padding: 12px; background: #fff; border-radius: 12px; }
.dimension-drawing svg { display: block; width: 100%; height: auto; }
.illustration-key { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px 24px; margin: 24px 0 0; }
.illustration-key dt { color: #142342; font-weight: 700; font-size: 16px; }
.illustration-key dd { margin: 5px 0 0; font-size: 15px; color: var(--muted); line-height: 1.6; }
.label-reading { display: grid; grid-template-columns: minmax(220px,.9fr) minmax(0,1.1fr); gap: 28px; align-items: start; }
.label-original { display: block; background: white; padding: 8px; border-radius: 10px; }
.label-original img { width: 100%; height: auto; }
.label-half { padding: 20px; border-radius: 12px; background: #fff; margin-bottom: 18px; }
.label-half .section-kicker { display: block; font-size: 11px; line-height: 1.6; }
.label-half h4 { margin: 12px 0; font-size: 24px; }
.label-half p { margin: 10px 0 0; font-size: 15px; line-height: 1.65; }
.label-explanation > p { font-size: 15px; line-height: 1.7; }
.timeline-scroll { max-width: 100%; overflow-x: auto; padding: 0 0 12px; }
.laundry-timeline { min-width: 580px; }
.timeline-row,.timeline-scale { display: grid; grid-template-columns: 130px 1fr; gap: 14px; align-items: center; margin-bottom: 12px; }
.timeline-row > strong { font-size: 13px; line-height: 1.4; }
.timeline-scale { font-size: 12px; color: var(--muted); }
.timeline-scale > div { display: flex; justify-content: space-between; }
.timeline-track { display: grid; grid-template-columns: repeat(10,minmax(0,1fr)); min-height: 43px; border-radius: 7px; overflow: hidden; background: #fff; }
.time-block { display: grid; place-items: center; font-size: 12px; font-weight: 650; padding: 8px 2px; }
.time-w { background: #195cff; color: white; }
.time-d { background: #d9f79b; color: #142342; }
.time-q { background: #e3e8f1; color: #142342; }
.time-span-1 { grid-column: span 1; }
.time-span-2 { grid-column: span 2; }
.time-span-3 { grid-column: span 3; }
.time-span-5 { grid-column: span 5; }
.timeline-outcome { display: flex; flex-wrap: wrap; gap: 12px 28px; margin: 16px 0 0; }
.timeline-outcome strong { color: #142342; font-size: 18px; }
@media (max-width: 700px) {
  .article-illustration { padding: 20px 16px; margin-block: 24px; }
  .article-illustration > h3 { font-size: 21px; }
  .label-reading { grid-template-columns: minmax(0,1fr); gap: 22px; }
  .label-original { width: min(100%,360px); justify-self: center; }
  .laundry-route { grid-template-columns: 1fr 20px 1.2fr; gap: 8px; border-top: 1px solid var(--line); padding-top: 16px; }
  .laundry-route .laundry-route-start { grid-column: 1 / -1; padding: 14px; }
  .laundry-route-arrow { display: none; }
  .laundry-route > div { padding: 16px 8px; }
  .laundry-route > div strong { font-size: 25px; }
  .laundry-route > div span { font-size: 13px; }
  .illustration-key { grid-template-columns: 1fr; gap: 15px; }
  .laundry-timeline { min-width: 0; }
  .timeline-row,.timeline-scale { grid-template-columns: minmax(0,1fr); gap: 6px; }
  .timeline-scale > span { display: none; }
  .timeline-track { min-height: 34px; }
  .time-block { padding: 8px 0; font-size: 10px; }
  .time-q { font-size: 8px; }
}
@media (max-width: 600px) {
  .editorial-photo { margin-block: 24px; }
  .editorial-photo figcaption { font-size: 13px; }
}

.article-disclosure { padding-block: 20px 40px; font-size: 13px; line-height: 1.8; color: var(--quiet); border-top: 1px solid var(--line); }

.article-disclosure p { max-width: 90ch; }

@media (max-width: 900px) {
  .content-layout, .product-reviews-layout { grid-template-columns: minmax(0,1fr); }
}

/* 3. Navigation, search and footer. */

.header { position: sticky; top: 0; z-index: 100; background: white; border-bottom: 1px solid #edf0f6; }

.header-row { height: 88px; display: flex; align-items: center; justify-content: space-between; gap: 24px; position: relative; }

.brand { display: inline-flex; align-items: center; white-space: nowrap; }

.logo-word { font-size: 19px; font-weight: 800; letter-spacing: -1.4px; line-height: 1.2; }

.logo-word > span { color: var(--blue); }

.header .header-button { display: none; }

#main-nav { display: flex; align-items: center; gap: 20px; margin-left: auto; }

#main-nav > a { padding: 12px 0; font-size: 14px; font-weight: 650; white-space: nowrap; }

#main-nav a:hover { color: var(--blue); }

.nav-group { position: static; }

.nav-group summary { display: flex; align-items: center; gap: 9px; list-style: none; font-size: 14px; font-weight: 650; cursor: pointer; padding: 18px 0; white-space: nowrap; }

.nav-group summary::-webkit-details-marker { display: none; }

.nav-chevron { display: inline-flex; align-items: center; justify-content: center; width: 20px; height: 20px; flex: 0 0 20px; color: #7385a1; }
.nav-chevron svg, .mega-menu svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; flex: 0 0 20px; }
.nav-chevron svg { transition: transform .18s ease; }
.nav-group[open] .nav-chevron svg { transform: rotate(180deg); }

.nav-group[open] summary { color: var(--blue); }

.mega-menu { position: absolute; top: 100%; left: 0; right: 0; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 28px; border: 1px solid var(--line); border-top: 2px solid var(--blue); border-radius: 0 0 22px 22px; background: white; padding: 30px; box-shadow: 0 22px 38px #132b501a; z-index: 50; }
.mega-menu:has(.mega-group:nth-child(3)) { grid-template-columns: repeat(4,minmax(0,1fr)); }
.mega-group h2 { font: 650 13px/1.5 var(--font-body); color: var(--muted); letter-spacing: .02em; margin: 0 0 12px; }
.mega-group a { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 44px; padding: 10px 0; font-size: 14px; line-height: 1.5; color: #263f61; border-bottom: 1px solid #edf1f7; }
.mega-group a svg { width: 16px; height: 16px; flex-basis: 16px; color: var(--blue); }
.mega-group a:hover, .mega-group a[aria-current] { color: var(--blue); background: #f4f7fd; }
#main-nav .menu-feature { display: flex; flex-direction: column; align-items: flex-start; padding: 24px; background: var(--blue); color: white; border-radius: 14px; }
.menu-feature strong { font: 650 22px/1.3 var(--font-heading); letter-spacing: -.035em; }
.menu-feature p { font-size: 14px; line-height: 1.65; margin: 14px 0 24px; color: #e8efff; }
.menu-feature-action { display: inline-flex; align-items: center; gap: 10px; padding: 10px 12px; margin-top: auto; background: var(--lime); color: #243f20; border-radius: 7px; font-size: 13px; font-weight: 650; }
.menu-feature:hover .menu-feature-action { background: white; }

.menu-toggle { display: none; flex-shrink: 0; border: 0; background: none; width: 42px; height: 44px; padding: 9px; }

.menu-toggle > span { display: block; background: var(--dark); width: 24px; height: 1px; margin: 6px 0; }

.menu-toggle[aria-expanded=true] span:first-child { transform: translateY(3.5px) rotate(45deg); }

.menu-toggle[aria-expanded=true] span:last-child { transform: translateY(-3.5px) rotate(-45deg); }

.site-search-open { display: flex; align-items: center; justify-content: center; flex: none; min-width: 44px; min-height: 44px; border: 0; background: transparent; }

.site-search-open > span { display: none; }

.site-search-open svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.6; }

#site-search { width: min(700px,calc(100vw - 32px)); max-height: calc(100dvh - 48px); margin: 8vh auto auto; padding: 32px; border: 0; border-radius: 22px; background: white; color: var(--dark); box-shadow: 0 25px 90px #10224338; overflow: auto; }

#site-search::backdrop { background: #12213b80; backdrop-filter: blur(3px); }

.search-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 24px; }

.search-heading h2 { font-size: 26px; }

.site-search-close { display: flex; align-items: center; gap: 10px; min-height: 44px; padding: 8px 12px; border: 1px solid var(--line); border-radius: 9px; background: white; font-size: 14px; }

.site-search-close span { font-size: 24px; line-height: 1; }

#site-search label { display: block; font-size: 14px; font-weight: 600; margin-bottom: 10px; }

#site-search-input { display: block; width: 100%; min-height: 56px; border: 2px solid #bdcbea; border-radius: var(--control-radius); padding: 14px 16px; font-size: 17px; background: #f7f9fe; }

#site-search-status { font-size: 14px; color: var(--muted); margin: 16px 0 10px; line-height: 1.6; }

#site-search-results { list-style: none; padding: 0; margin: 0; }

#site-search-results a { display: block; padding: 15px 12px; border-bottom: 1px solid var(--line); border-radius: 8px; font-size: 16px; font-weight: 600; line-height: 1.4; }

#site-search-results a:hover, #site-search-results a:focus-visible { background: #edf3ff; color: var(--blue); }

.footer { border-top: 1px solid var(--line); padding-block: 32px; }

.footer p { font-size: 13px; margin: 12px 0; }

.footer-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 30px; padding: 18px 0 32px; }

.footer-heading .brand { font-size: 24px; font-weight: 700; letter-spacing: -.04em; }

.footer-heading p { max-width: 48ch; color: var(--quiet); }

.footer-reviews { font-size: 13px; color: var(--blue); white-space: nowrap; }

.footer-links { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 40px; border-block: 1px solid var(--line); padding-block: 32px; }

.footer-links h2 { font-size: 16px; letter-spacing: 0; margin-bottom: 16px; }

.footer-links a { display: block; font-size: 14px; line-height: 1.6; margin: 10px 0; color: var(--muted); }

.footer-links a:hover { text-decoration: underline; color: var(--blue); }

.footer-bottom { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding-top: 22px; }

.footer-bottom a { font-size: 13px; }

@media (min-width: 901px) and (max-width: 1100px) { #main-nav { gap: 14px; } }

@media (max-width: 900px) {
  .header-row { height: 70px; gap: 12px; }
  .menu-toggle { display: block; }
  #main-nav { display: none; }
  #main-nav.is-open { display: flex; flex-direction: column; align-items: stretch; position: absolute; top: 100%; left: calc(-1 * var(--page-gutter)); right: calc(-1 * var(--page-gutter)); background: white; padding: 16px 24px 24px; max-height: calc(100dvh - 80px); overflow-y: auto; gap: 0; border-bottom: 1px solid var(--line); box-shadow: 0 12px 25px #1423420c; }
  .nav-group { border-top: 1px solid var(--line); }
  .nav-group summary { justify-content: space-between; padding: 15px 0; }
  .mega-menu, .mega-menu:has(.mega-group:nth-child(3)) { position: static; grid-template-columns: repeat(2,minmax(0,1fr)); border: 0; border-radius: 12px; background: #f7f9fd; box-shadow: none; padding: 20px; margin-bottom: 16px; gap: 24px; }
  .mega-group h2 { margin-bottom: 6px; }
  #main-nav .menu-feature { padding: 20px; }
  .footer-heading { display: block; }
  .footer-reviews { display: inline-block; margin-top: 12px; }
}

@media (max-width: 600px) {
  .mega-menu, .mega-menu:has(.mega-group:nth-child(3)) { grid-template-columns: minmax(0,1fr); gap: 22px; padding: 18px; }
  .menu-feature strong { font-size: 20px; }
  .menu-feature p { margin-bottom: 18px; }
  .logo-word { font-size: 16px; }
  .header-row { gap: 8px; }
  .site-search-open { margin-left: auto; }
  #site-search { padding: 22px 18px; margin-top: 16px; border-radius: 16px; }
  .search-heading h2 { font-size: 22px; }
  #site-search-input { font-size: 16px; }
  .footer-heading .brand { font-size: 21px; }
  .footer-links { grid-template-columns: 1fr 1fr; gap: 26px; }
  .footer-links > div:last-child { grid-column: 1/-1; }
  .footer-links a { font-size: 13px; }
  .footer-bottom { display: block; }
  .footer-bottom a { display: inline-block; margin-top: 10px; }
}

/* 4. Buttons, labels and tables: shared across all page types. */

.hero-context { color: var(--muted); font-size: 15px; line-height: 1.75; margin-top: 18px; }
.pick-summary p { font-size: 14px; line-height: 1.8; color: var(--muted); margin: 12px 0 20px; }
.pick-reason { font-size: 12px; line-height: 1.5; color: var(--blue); margin: 8px 0 12px; }
.pick-label > span:only-child { max-width: 100%; }
.review-copy { margin-block: 24px; }
.review-copy p { margin: 0 0 18px; }
.review-copy p:last-child { margin-bottom: 0; }
.answer-panel { padding: 24px 28px; margin: 24px 0; background: var(--pale); border: 1px solid #d2dff2; border-left: 4px solid var(--blue); border-radius: 14px; }
.answer-panel p { margin-block: 14px; }
.answer-panel > a { font-size: 13px; line-height: 1.7; }
.page-toc > .scroll-recommendation { margin-top: 22px; }
@media (prefers-reduced-motion: reduce) { .nav-chevron svg { transition: none; } }

.button, .shop-button, .site-shop, .choice-submit .button {
  position: relative; display: inline-flex; align-items: center; justify-content: center;
  gap: 15px; min-height: var(--button-height); padding: var(--button-padding);
  border: 1px solid transparent; border-radius: var(--control-radius);
  font: 650 var(--button-size)/1.5 var(--font-body); text-decoration: none;
}

.button-blue, .shop-button, .site-shop, .choice-submit .button { color: white; background: var(--blue); }

.button-blue:hover, .shop-button:hover, .site-shop:hover, .choice-submit .button:hover { background: var(--blue-hover); }

.button-outline { border-color: #ced8e9; background: white; color: var(--dark); }

.button-outline:hover { background: #f1f5fc; border-color: #9daece; }

.button-lime { background: var(--lime); color: #233c1b; }

.button-white { background: white; color: var(--blue); }

.button > span[aria-hidden] { font-size: 18px; }
.button [aria-hidden="true"], .site-shop:not(.hero-choice) [aria-hidden="true"] { line-height: 1; }

.site-shop { display: flex; flex-direction: column; align-items: stretch; gap: 3px; }

.site-shop > span { display: flex; align-items: center; justify-content: space-between; gap: 12px; }

.site-shop > span > span { font-size: 18px; }

.site-shop small { font-size: 10px; color: #e8f0ff; font-weight: 400; line-height: 1.5; }

.model-summary-copy .site-shop { max-width: 300px; margin: 24px 0; }

@media (max-width: 600px) { .model-summary-copy .site-shop { max-width: none; } }

.shop-button { flex-direction: row; align-items: center; overflow: hidden; white-space: nowrap; }

.shop-button svg { width: 19px; height: 19px; flex-shrink: 0; fill: none; stroke: currentColor; stroke-width: 1.75; }

.shop-action { display: flex; flex-direction: column; align-items: stretch; gap: 6px; }

.shop-retailer { display: block; text-align: center; font-size: 12px; line-height: 1.5; color: var(--muted); }

.shop-retailer strong { font-weight: 650; }

/* Mobile actions stay compact, including merchant links with a separate arrow. */
@media (max-width: 600px) {
  .site-shop:not(.hero-choice) { flex-direction: row; align-items: center; gap: 10px; }
}

.label, .review-label, .recommendation-label, .decision-label, .pick-label > span:first-child {
  display: inline-flex; align-items: center; font-size: var(--label-size); font-weight: 650;
  line-height: 1.5; padding: var(--label-padding); border-radius: 6px;
  color: #345b94; background: #edf3ff;
}

.label-choice, .recommendation-label, .pick-card:first-child .pick-label > span:first-child { background: var(--lime); color: #345321; }

.label-budget { background: #fff3da; color: #755013; }

.review-label { margin-bottom: 18px; }

.table-scroll { width: 100%; max-width: 100%; overflow-x: auto; overscroll-behavior-x: contain; border: 1px solid var(--line); border-radius: var(--table-radius); margin: 26px 0 24px; }

.table-scroll table { width: 100%; min-width: 640px; table-layout: auto; border-collapse: separate; border-spacing: 0; margin: 0; font-size: var(--table-font-size); }

.table-scroll.columns-2 table { min-width: 480px; }

/* Preserve readable column widths in larger comparisons on phones. */
.table-scroll.columns-5 table { min-width: 760px; }
.table-scroll.columns-6 table { min-width: 900px; }
.table-scroll.columns-7 table { min-width: 1040px; }
.table-scroll.columns-8 table { min-width: 1180px; }

.table-scroll th, .table-scroll td { padding: var(--table-padding); text-align: left; vertical-align: top; border: 0; border-bottom: 1px solid var(--line); font-size: var(--table-font-size); line-height: 1.7; overflow-wrap: break-word; }

.table-scroll thead th { background: #eaf0ff; color: var(--dark); font-weight: 650; min-width: 140px; }

.table-scroll thead th:first-child { min-width: 170px; }

.table-scroll thead th a { color: inherit; text-decoration: none; font-size: 15px; line-height: 1.5; }

.table-scroll thead span { display: block; font-size: 12px; font-weight: 400; margin-top: 4px; }

.table-scroll tbody th { font-weight: 500; background: #f1f5fc; }

.table-scroll tbody tr:nth-child(even) td { background: #fafbfe; }

.table-scroll tbody tr:hover td { background: #f2f6ff; }

.table-scroll tr:last-child > * { border-bottom: 0; }

.table-scroll caption:not(.visually-hidden) { text-align: left; background: #f4f7fc; padding: 16px 20px; font-weight: 650; color: #28476c; border-bottom: 1px solid var(--line); font-size: var(--table-font-size); line-height: 1.6; }

.comparison-section { padding-block: var(--section-padding); border-top: 1px solid var(--line); }

.comparison-section h2 { margin-bottom: 18px; }

.comparison-section > p { max-width: var(--text-measure); font-size: 16px; line-height: 1.8; margin-bottom: 20px; }

.comparison-section .table-scroll thead th:not(:first-child) { min-width: 210px; }

.comparison-section .site-shop { max-width: 250px; }

.table-note { font-size: 13px; color: var(--muted); }

.table-swipe-hint, .scroll-hint { display: none; }

@media (max-width: 900px) { .table-swipe-hint, .scroll-hint { display: block; font-size: 11px; color: var(--quiet); margin: -14px 0 24px; line-height: 1.6; } }

/* 5. Heroes and reading navigation. */

.intro { display: grid; grid-template-columns: minmax(0,1.08fr) minmax(0,.92fr); gap: 56px; padding-block: 56px; align-items: center; }

.hero-copy, .hero-visual { min-width: 0; }

.intro h1 { line-height: 1.16; letter-spacing: -.045em; max-width: 15ch; }

.intro .lead { font-size: 18px; line-height: 1.75; color: var(--muted); margin: 24px 0; }

.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 32px; padding-top: 4px; }

.page-hero { padding: 28px 0 48px; }

.breadcrumbs { display: flex; flex-wrap: wrap; gap: 12px; font-size: 12px; line-height: 1.6; color: var(--quiet); margin-bottom: 36px; }

.page-hero-copy { max-width: 900px; }

.page-hero h1 { line-height: 1.16; max-width: 27ch; margin-bottom: 24px; }

.page-hero .lead { font-size: 19px; line-height: 1.8; max-width: var(--text-measure); color: var(--muted); margin-bottom: 28px; }

.page-hero .hero-actions { margin-top: 32px; }

.page-date { font-size: 12px; color: var(--quiet); margin-top: 20px; }

/* Approved article photos also introduce the topic beside the title and lead. */
.article-hero-layout { display: grid; grid-template-columns: minmax(0,1.08fr) minmax(0,.92fr); align-items: center; gap: 56px; }
.article-hero-layout > .page-hero-copy { min-width: 0; }
.article-hero-photo { width: 100%; min-width: 0; margin: 0; overflow: hidden; border-radius: var(--card-radius); background: var(--pale); }
.article-hero-photo > img { width: 100%; height: auto; }
.article-hero-photo.has-hero-choice { position: relative; align-self: stretch; min-height: 520px; padding: 0; }
.article-hero-photo.has-hero-choice > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.hero-choice.site-shop { position: absolute; left: 24px; right: 24px; bottom: 24px; width: calc(100% - 48px); max-width: 420px; margin-inline: auto; display: grid; grid-template-columns: 66px minmax(0,1fr) 38px; align-items: center; gap: 15px; padding: 18px; background: #fff; color: var(--dark); border: 1px solid var(--line); border-radius: 14px; box-shadow: 0 8px 26px #153b5514; text-decoration: none; text-align: left; transition: transform .2s, box-shadow .2s; }
.hero-choice > img { width: 66px; height: 82px; object-fit: contain; }
.hero-choice.site-shop .hero-choice-copy { display: flex; min-width: 0; flex-direction: column; align-items: flex-start; justify-content: center; gap: 6px; }
.hero-choice.site-shop .hero-choice-label { display: inline-flex; align-items: center; gap: 6px; padding: 3px 8px; border-radius: 5px; background: var(--lime); color: #294825; font-size: 11px; font-weight: 750; line-height: 1.5; }
.hero-choice-label::before { content: '✓'; }
.hero-choice-name { font-size: 16px; line-height: 1.3; overflow-wrap: anywhere; }
.hero-choice.site-shop .hero-choice-action { color: var(--blue); font-size: 13px; font-weight: 750; }
.hero-choice.site-shop .hero-choice-arrow { display: grid; place-items: center; justify-content: center; gap: 0; width: 38px; height: 38px; background: var(--blue); color: #fff; border-radius: 50%; line-height: 1; transition: transform .2s; animation: choice-arrival .7s ease-out 1; }
.hero-choice-arrow svg { display: block; width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.hero-choice.site-shop:hover { background: #fff; transform: translateY(-3px); box-shadow: 0 12px 30px #153b5526; }
.hero-choice:hover .hero-choice-arrow { transform: rotate(45deg); }
.hero-choice:focus-visible { outline: 3px solid var(--blue); outline-offset: 4px; }
.selection-availability { margin-bottom: 36px; padding: 24px; border: 1px solid var(--line); border-radius: 12px; background: var(--pale); }
.selection-availability p { margin: 8px 0 0; }
.picks-grid:has(> :only-child) { grid-template-columns: minmax(0,1fr); max-width: 700px; }
.picks-grid:has(> :nth-child(2):last-child) { grid-template-columns: repeat(2,minmax(0,1fr)); }
@keyframes choice-arrival { from { transform: scale(.75); opacity: .5; } to { transform: scale(1); opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .hero-choice.site-shop, .hero-choice.site-shop .hero-choice-arrow { transition: none; animation: none; } }
@media (max-width: 600px) {
  .hero-choice.site-shop { left: 12px; right: 12px; bottom: 12px; width: auto; padding: 14px; gap: 10px; grid-template-columns: 48px minmax(0,1fr) 32px; }
  .hero-choice > img { width: 48px; height: 72px; }
  .hero-choice-name { font-size: 14px; }
  .hero-choice.site-shop .hero-choice-arrow { width: 32px; height: 32px; }
  .picks-grid:has(> :nth-child(2):last-child) { grid-template-columns: minmax(0,1fr); }
}

@media (min-width: 901px) and (max-width: 1100px) {
  .article-hero-layout, .intro.has-article-photo { gap: 32px; }
}

@media (max-width: 900px) {
  .article-hero-layout { grid-template-columns: minmax(0,1fr); gap: 32px; }
  .article-hero-photo.has-hero-choice { min-height: clamp(340px,65vw,520px); }
}

.sidebar { position: sticky; top: var(--anchor-offset); align-self: start; max-height: calc(100dvh - 140px); overflow-y: auto; scrollbar-width: thin; }

.sidebar nav { display: grid; gap: 15px; border-left: 1px solid var(--line); padding: 12px 0 8px 17px; font-size: 13px; line-height: 1.5; }

.sidebar nav strong { font-size: 14px; margin-bottom: 4px; }

.sidebar nav a { color: var(--muted); }

.sidebar nav a:hover { color: var(--blue); }

.page-toc summary { font-size: 14px; font-weight: 650; padding: 12px 0; list-style: none; pointer-events: none; }

.page-toc details:not([open]) > nav { display: grid; }

@media (max-width: 900px) {
  .intro { grid-template-columns: minmax(0,1fr); padding-block: 36px; gap: 32px; }
  .intro h1 { max-width: 20ch; }
  .capacity-hero { max-width: 620px; }
  .sidebar { position: static; max-height: none; overflow: visible; }
  .page-toc { background: #f4f7fc; border: 1px solid var(--line); border-radius: 12px; padding: 0 20px; }
  .page-toc summary { pointer-events: auto; cursor: pointer; padding: 18px 0; list-style: revert; }
  .page-toc nav { border: 0; padding: 5px 0 20px; }
  .page-toc nav a { min-height: 44px; display: flex; align-items: center; }
  .page-toc details:not([open]) > nav { display: none; }
}

@media (max-width: 600px) {
  .intro .lead, .page-hero .lead { font-size: 17px; }
  .page-hero { padding: 22px 0 38px; }
  .breadcrumbs { font-size: 11px; gap: 8px; margin-bottom: 28px; }
  .page-hero h1 { margin-bottom: 20px; }
  .page-date { font-size: 11px; }
}

/* 6. One product selection and detailed product component, on every page. */

.selection-band { background: var(--pale); padding-block: var(--section-padding); margin-top: 12px; }

.selection-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 28px; margin-bottom: 28px; }

.selection-heading > div { min-width: 0; }

.selection-heading h2 { font-size: 36px; max-width: 26ch; line-height: 1.24; margin-top: 12px; }

.selection-heading h2 > span { color: var(--quiet); font-weight: 450; }

.selection-heading > .button { flex-shrink: 0; }

.selection-band .wrap > p:not(.selection-note,.affiliate-disclosure) { max-width: 84ch; font-size: 16px; line-height: 1.8; margin-bottom: 24px; }

.picks-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; }

.pick-card { min-width: 0; display: flex; flex-direction: column; border: 1px solid #e0e6f0; border-radius: 18px; background: white; overflow: hidden; }

.pick-card:first-child { border-color: #a4baef; }

.pick-label { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 17px 16px 0; min-height: 54px; }

.pick-label > span:first-child { max-width: 75%; }

.pick-score { font-size: 15px; font-weight: 700; color: var(--dark); white-space: nowrap; }

.pick-score small { font-size: 12px; font-weight: 400; color: var(--quiet); }

.pick-image { display: flex; align-items: center; justify-content: center; padding: 22px 20px 18px; height: 210px; }

.pick-image img { width: 100%; height: 173px; object-fit: contain; }

.product-photo-placeholder { display: grid; place-items: center; width: 100%; height: 173px; background: #fafbfe; color: var(--quiet); font-size: 12px; text-align: center; border-radius: 6px; }

.pick-copy { display: flex; flex-direction: column; flex: 1; min-width: 0; padding: 0 19px 19px; }

.pick-copy h3 { font-size: 23px; line-height: 1.3; letter-spacing: -.025em; overflow-wrap: anywhere; margin-bottom: 16px; }

.pick-copy h3 a:hover { color: var(--blue); }

.pick-copy p { font-size: 13px; line-height: 1.7; color: var(--quiet); margin: 0 0 18px; }

.pick-copy .pick-purpose { font-weight: 650; color: #173b74; font-size: 15px; line-height: 1.5; margin: 12px 0 8px; }

.pick-copy > .shop-action, .pick-copy > .site-shop { margin-top: auto; }

.pick-copy .shop-button { width: 100%; }

.pick-link { display: flex; align-items: center; justify-content: space-between; gap: 10px; border-top: 1px solid #edf0f6; padding-top: 12px; font-size: 13px; font-weight: 600; color: var(--blue); margin-top: 14px; }

.pick-link:hover { text-decoration: underline; text-underline-offset: 4px; }

.pick-caution { font-size: 12px; line-height: 1.65; color: #725625; margin-bottom: 18px; }

.selection-note, .affiliate-disclosure { text-align: center; color: var(--quiet); font-size: 12px; line-height: 1.7; margin: 18px auto 0; max-width: 80ch; }

.selection-bottom-link { display: table; font-size: 14px; color: var(--quiet); margin: 26px auto 0; text-align: center; }

.selection-bottom-link > span { color: var(--blue); margin-left: 9px; }

.product-reviews-layout { margin-block: var(--section-padding); }

.article-main > h2 { font-size: var(--h2-size); line-height: 1.25; margin-bottom: 28px; max-width: 30ch; }

.article-main > h3 { font-size: var(--h3-size); margin: 38px 0 18px; }

.contents { align-self: stretch; }

.contents-inner { position: sticky; top: var(--anchor-offset); max-height: calc(100vh - 140px); overflow: auto; scrollbar-width: thin; padding-right: 5px; }

.contents a { display: flex; gap: 12px; align-items: baseline; font-size: 14px; line-height: 1.5; }

.contents-main { font-weight: 650; padding: 17px 0; border-bottom: 1px solid var(--line); justify-content: space-between; }

.contents a:hover { color: var(--blue); }

.contents-product { padding: 9px 0; color: #687994; }

.contents-product > span { font-size: 12px; width: 16px; flex-shrink: 0; }

.ui-topselectie { list-style: none; padding: 0; margin: 28px 0; }

.ui-topselectie > li::before { display: none; }

.product-detail { background: white; border: 1px solid var(--line); border-radius: 20px; padding: var(--panel-padding) 32px; margin-bottom: 26px; }

.product-detail:nth-of-type(even) { background: #f9fbff; }

.review-heading { display: flex; align-items: center; gap: 16px; margin-bottom: 24px; }

.review-heading > div { min-width: 0; flex: 1; }

.review-heading h3 { position: relative; font-size: 26px; line-height: 1.3; margin-top: 5px; overflow-wrap: anywhere; }

.section-number { display: grid; place-items: center; width: 39px; min-width: 39px; height: 39px; color: var(--blue); background: var(--pale); font-size: 18px; font-weight: 650; border-radius: 11px; }

.review-score { margin-left: auto; padding: 8px 14px; border-radius: 12px; font-size: 22px; font-weight: 650; text-align: center; line-height: 1.1; flex-shrink: 0; background: var(--lime); color: #304c20; }

.review-score small { display: block; max-width: 90px; margin-top: 5px; font-size: 10px; line-height: 1.4; font-weight: 400; }

.review-product { display: flex; align-items: center; gap: 28px; margin-block: 27px; border-radius: 14px; background: var(--pale); padding: 24px 28px; }

.review-product > div { flex: 1; min-width: 0; }

.review-product > img, .review-product > .product-photo-placeholder { width: 150px; height: 165px; flex: none; object-fit: contain; background: #ffffff80; }

.product-detail:nth-of-type(even) .review-product { background: white; border: 1px solid #e7edf6; }

.product-subtitle { font-size: 20px; font-weight: 550; line-height: 1.5; color: #28476c; }

.spec-line { font-size: 14px; color: #7c8ba1; margin-top: 10px; }

.review-actions { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; margin-top: 22px; }

.review-actions .site-shop { min-width: 210px; }

.product-caveat { padding: 18px 22px; margin: 24px 0; border-left: 3px solid #a9bedf; background: #f4f7fc; border-radius: 0 10px 10px 0; font-size: 15px; line-height: 1.8; color: var(--muted); }

.product-caveat p { margin: 0; }

.product-caveat > strong { display: block; font-size: 12px; margin-bottom: 6px; color: #365376; }

.ui-methode { margin-top: 32px; padding: 24px 28px; background: linear-gradient(120deg,#edf3ff,#f3f7ea); border: 1px solid #dfe7ed; border-radius: 14px; }

.ui-methode h3 { font-size: 21px; margin-bottom: 16px; }

.ui-methode p { font-size: 15px; line-height: 1.8; margin-bottom: 16px; color: var(--muted); }

.ui-methode p:last-child { margin-bottom: 0; }

.score-details { border-block: 1px solid var(--line); margin: 24px 0; }

.score-details summary { padding: 16px 0; font-size: 14px; font-weight: 650; cursor: pointer; }

.opbouw { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 22px; padding: 14px 0 24px; margin: 0; }

.opbouw dt { font-size: 12px; line-height: 1.6; }

.opbouw dd { font-size: 16px; line-height: 1.6; margin: 6px 0 10px; font-weight: 650; }

.opbouw > div::after { content: ""; display: block; width: var(--score); max-width: 100%; height: 4px; border-radius: 4px; background: var(--blue); }

.visual-description, .illustration-note { margin: 12px 0 24px; font-size: 12px; line-height: 1.7; color: var(--quiet); }

.visual-description summary, .illustration-note summary { cursor: pointer; }

.notice { padding: 16px 20px; background: #f6f8fb; border: 1px dashed #c9d3e2; border-radius: 10px; color: var(--muted); font-size: 13px; line-height: 1.6; margin: 20px 0; }

.visual-description .notice, .illustration-note .notice { background: transparent; border: 0; padding: 12px 0; margin: 12px 0 0; }

.model-review-link { margin-top: 24px; padding-top: 20px; border-top: 1px solid var(--line); font-size: 14px; }

.model-review-link a { color: var(--blue); }

@media (max-width: 1100px) {
  .pick-copy h3 { font-size: 21px; }
  .review-product { padding: 22px; gap: 22px; }
  .review-product > img, .review-product > .product-photo-placeholder { width: 115px; height: 140px; }
}

@media (max-width: 900px) {
  .selection-heading { align-items: flex-start; }
  .selection-heading h2 { font-size: 31px; }
  .selection-heading > .button { display: none; }
  .contents { display: none; }
}

@media (max-width: 600px) {
  .selection-band { margin-top: 5px; }
  .selection-heading h2 { font-size: var(--h2-size); overflow-wrap: anywhere; }
  .picks-grid { grid-template-columns: minmax(0,1fr); gap: 15px; }
  .pick-card { display: grid; grid-template-columns: 80px minmax(0,1fr); column-gap: 14px; padding: 17px; border-radius: 15px; }
  .pick-label { grid-column: 1/-1; margin: 0 0 16px; min-height: 0; }
  .pick-label > span:first-child { max-width: 100%; }
  .pick-image { grid-column: 1; grid-row: 2; align-self: start; height: 110px; padding: 0 0 14px; }
  .pick-image img, .pick-image .product-photo-placeholder { height: 96px; font-size: 11px; }
  .pick-copy { display: contents; }
  .pick-copy > * { grid-column: 1/-1; min-width: 0; }
  .pick-copy h3 { grid-column: 2; grid-row: 2; align-self: center; font-size: 18px; line-height: 1.4; margin: 0 0 14px; }
  .pick-copy p { font-size: 14px; line-height: 1.65; margin: 0 0 14px; }
  .pick-copy .pick-reason, .pick-copy .pick-specs { font-size: 12px; }
  .pick-copy .pick-purpose { font-size: 13px; }
  .pick-link { font-size: 12px; }
  .pick-caution { font-size: 11px; }
  .product-detail { padding: 23px 20px; border-radius: 17px; margin-bottom: 22px; }
  .review-heading { display: grid; grid-template-columns: 31px minmax(0,1fr) auto; gap: 11px; }
  .review-heading > div { grid-column: 1/-1; grid-row: 2; }
  .review-heading h3 { font-size: 22px; }
  .section-number { width: 31px; min-width: 31px; height: 31px; font-size: 15px; border-radius: 8px; }
  .review-score { grid-column: 3; grid-row: 1; margin: 0; font-size: 18px; padding: 8px 10px; }
  .review-score small { font-size: 9px; }
  .review-product { flex-direction: column; align-items: stretch; gap: 20px; padding: 24px 20px; }
  .review-product > img, .review-product > .product-photo-placeholder { width: 76px; height: 100px; font-size: 11px; align-self: center; }
  .product-subtitle { font-size: 18px; }
  .review-actions { flex-direction: column; align-items: stretch; gap: 16px; }
  .review-actions .button, .review-actions .shop-button { width: 100%; }
  .review-actions .site-shop { min-width: 0; }
  .opbouw { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 20px; }
  .opbouw > div { min-width: 0; overflow-wrap: anywhere; }
  .opbouw dd { font-size: 14px; }
  .ui-methode { padding: 22px; }
}

/* 7. Homepage calculators and explanatory figures */

.capacity-hero {
  display: block;
  aspect-ratio: auto;
  height: auto;
  min-height: 0;
  background: linear-gradient(125deg,#eaf0ff,#f4f7ff 65%,#f2f8e9);
  border: 1px solid var(--line);
  border-radius: 22px;
  padding: 28px;
}

.capacity-hero h2, .capacity-hero h3 {
  font-size: 22px;
  line-height: 1.3;
  margin: 0 0 12px;
}

.capacity-hero p {
  font-size: 15px;
  line-height: 1.6;
  margin: 0 0 20px;
}

.capacity-route {
  border-top: 1px solid #d3dded;
  padding: 16px 0;
}

.route-label {
  display: block;
  font-size: 12px;
  font-weight: 700;
  color: #456185;
  margin-bottom: 8px;
}

.capacity-route>div {
  display: flex;
  gap: 20px;
  align-items: center;
}

.capacity-route strong {
  font-size: 30px;
  color: var(--blue);
  white-space: nowrap;
}

.capacity-route div>span {
  font-size: 14px;
  line-height: 1.6;
}

.capacity-hero small {
  display: block;
  font-size: 12px;
  line-height: 1.6;
  color: var(--muted);
}

.capacity-explainer { margin-block: 28px; }

.energy-tool {
  margin: 32px 0 0;
  padding: 28px;
  background: var(--dark);
  border-radius: 18px;
  color: white;
}

.energy-tool h3 {
  color: white;
  font-size: 25px;
  line-height: 1.3;
  margin: 0 0 14px;
}

.energy-tool>p {
  color: #d7e2f5;
  font-size: 15px;
  line-height: 1.7;
  margin: 0 0 20px;
}

.example-label {
  display: inline-block;
  background: #293b5e;
  color: #e1eafa;
  padding: 6px 10px;
  border-radius: 6px;
  font-size: 11px;
  line-height: 1.6;
  margin-bottom: 24px;
}

.calculator-layout {
  display: grid;
  grid-template-columns: minmax(0,1fr);
  gap: 24px;
}

.calc-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}

.calc-grid label {
  font-size: 13px;
  font-weight: 650;
  line-height: 1.5;
  color: white;
}

.input-unit {
  display: flex;
  align-items: center;
  background: white;
  border: 1px solid #c1cde0;
  border-radius: 8px;
  margin-top: 8px;
  padding-right: 10px;
  gap: 6px;
}

.input-unit input {
  width: 100%;
  min-width: 0;
  border: 0;
  border-radius: 8px;
  padding: 12px 10px;
  background: white;
  color: var(--dark);
  font: 600 17px var(--font-body);
}

.input-unit>span {
  font-size: 10px;
  color: var(--muted);
  white-space: nowrap;
  font-weight: 500;
}

.calc-grid small {
  display: block;
  font-size: 11px;
  line-height: 1.6;
  color: #c7d5ed;
  font-weight: 400;
  margin-top: 8px;
}

.calc-grid .field-help {
  grid-column: 1/-1;
  font-size: 12px;
  line-height: 1.6;
  color: #c7d5ed;
  margin: -8px 0 0;
}

.calc-outcome {
  background: #f1f6e4;
  color: var(--dark);
  border-radius: 12px;
  padding: 24px;
}

.calc-outcome>span {
  font-size: 12px;
  font-weight: 650;
}

.calc-outcome dl {
  display: grid;
  grid-template-columns: 1fr 1fr;
  margin: 16px 0 20px;
  gap: 16px;
}

.calc-outcome dl>div {
  padding-bottom: 14px;
  border-bottom: 1px solid #d4dec4;
}

.calc-outcome dt {
  font-size: 13px;
}

.calc-outcome dd {
  font-size: 23px;
  font-weight: 650;
  margin: 4px 0 0;
}

.calc-outcome output {
  display: block;
  font-size: 14px;
  line-height: 1.6;
}

.calc-outcome output strong {
  display: block;
  font-size: 34px;
  line-height: 1.2;
  margin-bottom: 6px;
}

.calc-outcome output span {
  display: block;
}

.energy-tool .calc-caveat {
  font-size: 12px;
  line-height: 1.7;
  margin: 20px 0 0;
  color: #c7d5ed;
}

.calc-explanation {
  border-top: 1px solid #394a67;
  margin-top: 20px;
  padding-top: 16px;
}

.calc-explanation summary {
  font-size: 13px;
  cursor: pointer;
}

.calc-explanation p {
  font-size: 12px;
  line-height: 1.7;
  color: #c7d5ed;
  margin: 12px 0 0;
}

@media (max-width:850px) {
  .capacity-hero {
    max-width: 620px;
  }
}

@media (max-width:560px) {
  .capacity-hero {
    padding: 22px;
  }

  .energy-tool {
    padding: 22px 18px;
  }

  .energy-tool h3 {
    font-size: 23px;
  }

  .calc-grid {
    grid-template-columns: 1fr;
  }

  .calc-outcome {
    padding: 20px;
  }
}

@media (max-width: 360px) {
  .calc-outcome dl { grid-template-columns: minmax(0,1fr); gap: 12px; }
  .calc-outcome output strong { font-size: 28px; overflow-wrap: anywhere; }
}

.energy-tool>p strong {
  color: inherit;
}

.editorial-chart {
  margin: 28px 0;
  padding: 26px;
  background: var(--pale);
  border: 1px solid #e4eaf4;
  border-radius: 16px;
}

.editorial-chart figcaption {
  font-size: 19px;
  font-weight: 700;
  line-height: 1.4;
  color: var(--dark);
  margin: 0 0 12px;
}

.editorial-chart>p {
  font-size: 14px;
  line-height: 1.7;
  margin: 0 0 20px;
}

.chart-row {
  display: grid;
  grid-template-columns: 150px minmax(0,1fr) 90px;
  gap: 16px;
  align-items: center;
  margin: 20px 0;
}

.chart-row>span {
  font-size: 14px;
  font-weight: 600;
}

.chart-row small {
  display: block;
  font-size: 10px;
  font-weight: 400;
  color: #687588;
  margin-top: 4px;
}

.chart-row>strong {
  text-align: right;
  font-size: 16px;
  white-space: nowrap;
}

.chart-track {
  height: 14px;
  background: #e0e7f2;
  border-radius: 7px;
  overflow: hidden;
  position: relative;
}

.chart-fill {
  display: block;
  width: var(--value);
  height: 100%;
  background: var(--blue);
  border-radius: 7px;
  transform-origin: left;
  position: relative;
  z-index: 1;
}

.chart-row:nth-of-type(2) .chart-fill {
  background: #6885b8;
}

.capacity-rest {
  position: absolute;
  inset: 0 0 0 62.5%;
  background: repeating-linear-gradient(125deg,#ced9e8 0 3px,#edf2fa 3px 7px);
}

.chart-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin: 20px 0;
}

.chart-legend>span {
  font-size: 11px;
  color: var(--muted);
  display: flex;
  gap: 6px;
  align-items: center;
}

.chart-legend i {
  width: 10px;
  height: 10px;
  border-radius: 2px;
  background: #6885b8;
}

.chart-legend .rest-key {
  background: repeating-linear-gradient(125deg,#acbed5 0 2px,#edf2fa 2px 4px);
}

.editorial-chart .chart-note {
  font-size: 12px;
  color: #687588;
  margin: 18px 0 0;
}

.editorial-chart .chart-takeaway {
  padding-top: 16px;
  border-top: 1px solid #dbe3f0;
  font-size: 13px;
  line-height: 1.7;
  margin-bottom: 0;
}

.chart-takeaway strong {
  display: block;
  color: #234e92;
  font-size: 19px;
  margin-bottom: 4px;
}

.program-check {
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 24px;
  margin-top: 28px;
}

.program-check h3 {
  font-size: 20px;
  margin: 0 0 20px;
}

.program-check ol {
  list-style: none;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 20px;
}

.program-check li {
  margin: 0;
  padding: 0;
}

.program-check li:before {
  display: none;
}

.program-check li>span {
  display: block;
  color: var(--blue);
  font-size: 12px;
  font-weight: 650;
  margin-bottom: 8px;
}

.program-check strong {
  font-size: 15px;
}

.program-check li p, .program-check>p {
  font-size: 13px;
  line-height: 1.65;
  margin: 8px 0 0;
}

.program-check>p {
  border-top: 1px solid var(--line);
  padding-top: 16px;
  color: #687588;
}

@keyframes bar-enter {
from{transform:scaleX(.02)}to{transform:scaleX(1)}
}

@media (prefers-reduced-motion:no-preference) {
  [data-chart].chart-entered .chart-fill {
    animation: bar-enter 850ms cubic-bezier(.2,.65,.3,1) both;
  }
}

@media (max-width:850px) {
  .chart-row {
    grid-template-columns: 115px minmax(0,1fr) 80px;
    gap: 10px;
  }
}

@media (max-width:600px) {
  .editorial-chart {
    padding: 20px;
  }

  .chart-row {
    grid-template-columns: 1fr auto;
    gap: 10px;
    margin: 22px 0;
  }

  .chart-row .chart-track {
    grid-column: 1/-1;
    grid-row: 2;
  }

  .chart-row>strong {
    grid-column: 2;
    grid-row: 1;
  }

  .editorial-chart figcaption {
    font-size: 18px;
  }

  .chart-row small {
    font-size: 11px;
  }

  .program-check {
    padding: 20px;
  }

  .program-check ol {
    grid-template-columns: 1fr;
    gap: 18px;
  }

  .program-check li {
    display: grid;
    grid-template-columns: 24px 1fr;
    column-gap: 10px;
  }

  .program-check li p {
    grid-column: 2;
    margin-top: 4px;
  }

  .program-check li>span {
    margin: 0;
  }
}

.decision-pair, .label-explainer, .placement-guide, .function-guide {
  margin: 28px 0 0;
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 26px;
  background: #fff;
}

.decision-pair h3, .function-guide h3, .label-explainer figcaption, .placement-guide figcaption {
  font-size: 21px;
  font-weight: 700;
  line-height: 1.35;
  margin: 0 0 20px;
  color: var(--dark);
}

.decision-columns {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
}

.decision-columns>div+div {
  border-left: 1px solid var(--line);
  padding-left: 24px;
}

.decision-label { margin-bottom: 14px; }

.decision-columns>div:first-child .decision-label {
  background: #eaf2d4;
  color: #36531b;
}

.decision-columns h4 {
  font-size: 18px;
  line-height: 1.4;
  margin: 0 0 12px;
}

.decision-columns p {
  font-size: 14px;
  line-height: 1.75;
  margin: 0 0 16px;
}

.decision-limit {
  border-top: 1px solid #e1e7f0;
  padding-top: 14px;
  color: var(--muted);
}

.decision-limit strong {
  display: block;
  color: #365376;
  font-size: 12px;
  margin-bottom: 5px;
}

.label-explainer {
  background: #f4f7fc;
  margin-bottom: 28px;
}

.label-explainer figcaption {
  margin-bottom: 10px;
}

.label-explainer .label-context {
  font-size: 14px;
  margin: 0 0 20px;
}

.label-halves {
  display: grid;
  grid-template-columns: 1fr 1fr;
  border: 1px solid #ccd9ee;
  border-radius: 12px;
  overflow: hidden;
  background: white;
}

.label-halves>div {
  padding: 20px;
}

.label-halves>div+div {
  border-left: 1px solid #ccd9ee;
}

.label-halves>div>span {
  display: block;
  font-size: 11px;
  color: #687588;
  margin-bottom: 8px;
}

.label-halves h4 {
  font-size: 18px;
  margin: 0 0 18px;
}

.cycle-pair {
  min-height: 46px;
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 18px;
}

.cycle-pair span {
  background: #eaf0ff;
  padding: 8px 10px;
  border-radius: 6px;
  font-size: 12px;
  color: #315d9b;
}

.cycle-pair b {
  color: #6e85a8;
  font-size: 13px;
}

.label-halves p {
  font-size: 14px;
  line-height: 1.65;
  margin: 0 0 14px;
}

.label-halves>div>strong {
  font-size: 12px;
  line-height: 1.6;
  display: block;
  color: #345b94;
}

.chapter .element-note {
  font-size: 12px;
  line-height: 1.7;
  color: #687588;
  margin: 18px 0 0;
}

.placement-guide {
  background: linear-gradient(120deg,#f4f7fd,#fff);
}

.placement-layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  align-items: center;
}

.placement-plan {
  width: 100%;
  max-width: 340px;
  height: auto;
}

.placement-plan text {
  font-family: var(--font-body);
  font-size: 12px;
  fill: #345276;
}

.placement-layout ol {
  counter-reset: place;
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 20px;
}

.placement-layout li {
  counter-increment: place;
  padding: 0 0 0 34px;
  margin: 0;
  position: relative;
}

.placement-layout li:before {
  content: counter(place);
  position: absolute;
  left: 0;
  top: 1px;
  background: #e5edfa;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  color: #345b94;
  font-size: 11px;
  display: grid;
  place-items: center;
}

.placement-layout strong {
  display: block;
  font-size: 15px;
  margin-bottom: 5px;
}

.placement-layout li span {
  font-size: 13px;
  line-height: 1.7;
  color: var(--muted);
  display: block;
}

.function-guide {
  padding: 0;
  border: 0;
}

.function-guide dl {
  margin: 0;
  border: 1px solid var(--line);
  border-radius: 14px;
  overflow: hidden;
}

.function-guide dl>div {
  display: grid;
  grid-template-columns: 42% 1fr;
  gap: 20px;
  padding: 20px;
  background: #fff;
}

.function-guide dl>div+div {
  border-top: 1px solid var(--line);
}

.function-guide dl>div:nth-child(2n) {
  background: #f7f9fd;
}

.function-guide dt {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 14px;
  font-weight: 650;
  line-height: 1.6;
}

.function-icon {
  display: inline-grid;
  place-items: center;
  width: 26px;
  height: 26px;
  flex-shrink: 0;
  background: #e9effa;
  color: #345e9a;
  border-radius: 7px;
  font-size: 18px;
}

.function-guide dd {
  margin: 0;
  font-size: 13px;
  line-height: 1.7;
  color: var(--muted);
}

.function-guide dd strong {
  display: block;
  font-size: 13px;
  margin-bottom: 5px;
  color: var(--dark);
}

@media (max-width:600px) {
  .decision-pair, .label-explainer, .placement-guide {
    padding: 20px;
  }

  .decision-pair h3, .function-guide h3, .label-explainer figcaption, .placement-guide figcaption {
    font-size: 20px;
  }

  .decision-columns, .label-halves, .placement-layout {
    grid-template-columns: 1fr;
  }

  .decision-columns>div+div {
    border-left: 0;
    border-top: 1px solid var(--line);
    padding: 22px 0 0;
  }

  .label-halves>div+div {
    border-left: 0;
    border-top: 1px solid #ccd9ee;
  }

  .placement-plan {
    max-width: 280px;
    justify-self: center;
  }

  .function-guide dl>div {
    grid-template-columns: 1fr;
    gap: 10px;
    padding: 18px;
  }

  .function-guide dd {
    padding-left: 36px;
  }

  .label-halves h4 {
    font-size: 18px;
  }

  .decision-columns p {
    font-size: 14px;
  }
}

/* 8. Editorial calculators, diagrams and checklists */

.reading-checklist, .reading-steps {
  list-style: none;
  padding: 0;
  margin: 28px 0;
  counter-reset: reading;
}

.reading-checklist>li, .reading-steps>li {
  position: relative;
  padding: 20px 20px 20px 58px;
  margin: 0;
  line-height: 1.8;
  font-size: 16px;
  border-bottom: 1px solid var(--line);
  background: #f7f9fc;
}

.reading-checklist>li:first-child, .reading-steps>li:first-child {
  border-radius: 12px 12px 0 0;
}

.reading-checklist>li:last-child, .reading-steps>li:last-child {
  border-radius: 0 0 12px 12px;
  border-bottom: 0;
}

.reading-checklist>li:before, .reading-steps>li:before {
  content: "✓";
  position: absolute;
  top: 23px;
  left: 20px;
  width: 23px;
  height: 23px;
  display: grid;
  place-items: center;
  background: #e2edfa;
  color: var(--blue);
  font-size: 12px;
  border-radius: 50%;
  line-height: 1;
}

.reading-steps>li {
  counter-increment: reading;
}

.reading-steps>li:before {
  content: counter(reading);
}

.article-tool {
  background: var(--dark);
  color: #fff;
  border-radius: 18px;
  padding: 30px;
  margin: 30px 0;
  scroll-margin-top: 110px;
}

.tool-eyebrow {
  display: inline-block;
  background: #2b3f60;
  color: #dbe8ff;
  border-radius: 5px;
  font-size: 10px;
  padding: 5px 9px;
  margin-bottom: 18px;
  letter-spacing: .07em;
  text-transform: uppercase;
}

.article-tool h3 {
  color: #fff;
  font-size: 27px;
  margin: 0 0 16px;
  max-width: 30ch;
}

.article-tool>p {
  color: #d2def0;
  font-size: 15px;
  line-height: 1.8;
  margin-bottom: 24px;
}

.tool-fields {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  margin: 24px 0;
}

.tool-fields label {
  color: #e4ecfa;
  font-size: 13px;
  line-height: 1.6;
  font-weight: 500;
}

.tool-input {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 8px;
  background: #fff;
  border-radius: 8px;
  color: var(--dark);
  padding-right: 12px;
  border: 1px solid #c6d3e8;
}

.tool-input input {
  width: 100%;
  min-width: 0;
  font: 600 17px var(--font-body);
  padding: 13px 12px;
  border: 0;
  border-radius: 8px;
  color: var(--dark);
  background: white;
}

.tool-input>span {
  font-size: 10px;
  white-space: nowrap;
  color: var(--muted);
}

.tool-input:focus-within {
  outline: 3px solid #b0ceff;
  outline-offset: 3px;
}

.tool-input input:focus-visible {
  outline: none;
}

.article-tool output {
  display: block;
  padding: 24px;
  border-radius: 12px;
  background: #eaf4d6;
  color: #233d30;
  font-size: 14px;
  line-height: 1.8;
  min-height: 110px;
}

.article-tool output strong {
  display: block;
  color: #19382c;
  font-size: 29px;
  font-weight: 650;
  line-height: 1.3;
  margin-bottom: 10px;
}

.article-tool output span {
  display: block;
}

.article-tool output[data-state=error] {
  background: #f4e9d5;
  color: #6b4a1c;
}

.article-tool .tool-formula {
  font-size: 12px;
  color: #c4d2e8;
  line-height: 1.8;
  margin: 20px 0 0;
  max-width: 90ch;
}

.page-chart, .measure-guide, .cycle-diagram {
  margin: 30px 0;
  padding: 28px;
  background: #f2f6fc;
  border: 1px solid var(--line);
  border-radius: 16px;
}

.page-chart figcaption, .measure-guide figcaption, .cycle-diagram figcaption {
  font: 650 21px/1.4 var(--font-heading);
  color: var(--dark);
  margin-bottom: 24px;
  max-width: 35ch;
}

.metric-row {
  margin: 22px 0;
}

.metric-row>div:first-child {
  display: flex;
  justify-content: space-between;
  align-items: start;
  gap: 24px;
  margin-bottom: 10px;
  font-size: 14px;
  line-height: 1.6;
}

.metric-row strong {
  white-space: nowrap;
  font-size: 15px;
}

.metric-track {
  height: 12px;
  border-radius: 7px;
  background: #dfe7f2;
  overflow: hidden;
}

.metric-track>span {
  display: block;
  background: var(--blue);
  height: 100%;
  width: var(--value);
  border-radius: 7px;
  transform-origin: left;
}

.metric-row:nth-of-type(2n) .metric-track>span {
  background: #7190bc;
}

.page-chart p.chart-note, .cycle-diagram p.chart-note {
  font-size: 13px;
  line-height: 1.8;
  color: var(--quiet);
  margin: 24px 0 0;
}

.capacity-model {
  padding: 22px 0;
  border-bottom: 1px solid var(--line);
}

.capacity-model:first-of-type {
  padding-top: 0;
}

.capacity-model:last-of-type {
  border-bottom: 0;
  padding-bottom: 0;
}

.capacity-model h4 {
  font-size: 15px;
  line-height: 1.5;
  margin: 0 0 15px;
  letter-spacing: 0;
}

.capacity-metric {
  display: grid;
  grid-template-columns: 65px 1fr 65px;
  gap: 15px;
  align-items: center;
  margin: 10px 0;
  font-size: 12px;
}

.capacity-metric strong {
  text-align: right;
  white-space: nowrap;
  font-size: 13px;
}

.metric-track .bar-wash {
  background: #819bbf;
}

.metric-track .bar-dry {
  background: var(--blue);
}

.measure-layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 35px;
  align-items: center;
}

.cabinet-diagram {
  position: relative;
  max-width: 250px;
  margin: 30px 25px 35px;
  padding: 16px 25px;
  border: 2px solid #8099bc;
  background: #e3ebf6;
  border-radius: 5px;
}

.cabinet-machine {
  border: 2px solid #5c7aa4;
  border-radius: 5px;
  height: 180px;
  background: #fff;
  padding: 35px 20px 20px;
}

.cabinet-machine span {
  display: block;
  width: 110px;
  height: 110px;
  max-width: 100%;
  border: 9px solid #c8d8ef;
  border-radius: 50%;
  margin: auto;
  background: #eaf1fb;
}

.measure-top, .measure-bottom {
  position: absolute;
  left: 0;
  right: 0;
  text-align: center;
  font-size: 11px;
  color: #45638b;
}

.measure-top {
  top: -28px;
}

.measure-bottom {
  bottom: -30px;
  white-space: nowrap;
}

.measure-side {
  position: absolute;
  right: -30px;
  top: 40px;
  writing-mode: vertical-rl;
  font-size: 11px;
  color: #45638b;
}

.measure-layout ul {
  list-style: none;
  padding: 0;
}

.measure-layout li {
  padding: 0;
  margin: 0 0 18px;
}

.measure-layout li:before {
  display: none;
}

.measure-layout strong, .measure-layout span {
  display: block;
}

.measure-layout li strong {
  font-size: 14px;
}

.measure-layout li span {
  font-size: 13px;
  line-height: 1.7;
  color: var(--quiet);
}

.measure-guide>p {
  font-size: 12px;
  color: var(--quiet);
  line-height: 1.8;
  margin: 24px 0 0;
}

.process-map {
  margin: 28px 0;
  background: linear-gradient(125deg,#edf3ff,#f2f7e9);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 24px;
}

.process-map h3 {
  font-size: 22px;
  margin: 0 0 20px;
}

.process-map ol {
  list-style: none;
  padding: 0;
  margin: 0;
}

.process-map li {
  padding: 0;
  margin: 0;
  border-top: 1px solid #dae4ee;
}

.process-map li:before {
  display: none;
}

.process-map a {
  display: flex;
  align-items: baseline;
  gap: 18px;
  font-size: 14px;
  line-height: 1.6;
  padding: 14px 0;
  color: #29496d;
  text-decoration: none;
}

.process-map a span {
  color: #7189a8;
  font-size: 12px;
}

.process-map a:hover {
  color: var(--blue);
}

.cycle-diagram>div {
  padding: 20px 0;
  border-bottom: 1px solid var(--line);
}

.cycle-diagram>div>strong {
  font-size: 15px;
}

.cycle-diagram>div p {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 15px 0;
  font-size: 13px;
  line-height: 1.5;
}

.cycle-diagram>div p span {
  display: block;
  border-radius: 6px;
  background: #dfe9fb;
  padding: 12px 16px;
  flex: 1;
}

.cycle-diagram>div:nth-of-type(2) p span {
  background: #e4edd9;
}

.cycle-diagram small {
  display: block;
  font-size: 12px;
  color: var(--quiet);
}

@media (prefers-reduced-motion:no-preference) {
  .page-chart.chart-entered .metric-track>span {
    animation: bar-enter 850ms cubic-bezier(.2,.65,.3,1) both;
  }
}

@media (max-width:600px) {
  .reading-checklist>li, .reading-steps>li {
    font-size: 15px;
    padding: 18px 18px 18px 52px;
  }

  .reading-checklist>li:before, .reading-steps>li:before {
    left: 17px;
    top: 21px;
  }

  .article-tool {
    padding: 24px 20px;
  }

  .article-tool h3 {
    font-size: 24px;
  }

  .tool-fields {
    grid-template-columns: 1fr;
    gap: 18px;
  }

  .article-tool>p {
    font-size: 14px;
  }

  .article-tool output {
    padding: 20px;
  }

  .article-tool output strong {
    font-size: 25px;
  }

  .page-chart, .measure-guide, .cycle-diagram {
    padding: 22px 20px;
  }

  .page-chart figcaption, .measure-guide figcaption, .cycle-diagram figcaption {
    font-size: 20px;
  }

  .metric-row>div:first-child {
    font-size: 13px;
    gap: 16px;
  }

  .metric-row strong {
    font-size: 13px;
  }

  .capacity-metric {
    grid-template-columns: 55px 1fr 52px;
    gap: 10px;
  }

  .measure-layout {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .cabinet-diagram {
    width: 200px;
    justify-self: center;
    margin-bottom: 30px;
  }

  .process-map {
    padding: 22px 20px;
  }

  .process-map h3 {
    font-size: 21px;
  }

  .process-map a {
    font-size: 13px;
  }
}

.article-tool output[data-state=pending] {
  background: #e5edf9;
  color: #3d5679;
}

/* 9. Single-model review and review directory */

.review-brief {
  margin-bottom: 44px;
  padding: 28px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: linear-gradient(125deg,#f0f5ff,#f8faf5);
}

.model-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 30px;
}

.model-heading h2 {
  font-size: 28px;
  line-height: 1.3;
  margin: 0;
  max-width: 28ch;
}

.model-score {
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
  text-align: center;
  padding: 12px 16px;
  border-radius: 12px;
  background: #e3edff;
  color: var(--blue);
}

.model-score>strong {
  font: 650 30px/1.2 var(--font-heading);
  color: var(--blue);
  display: block;
}

.model-score>span {
  display: block;
  max-width: 125px;
  font-size: 12px;
  line-height: 1.5;
  margin: 0 0 7px;
  color: #456999;
}

.model-summary-layout {
  display: grid;
  grid-template-columns: 170px minmax(0,1fr);
  gap: 28px;
  align-items: start;
}

.model-photo {
  display: grid;
  place-items: center;
  aspect-ratio: 3/4;
  background: #fff9;
  border: 1px solid #e3eaf5;
  border-radius: 10px;
  color: var(--quiet);
  font-size: 12px;
  text-align: center;
}

.model-summary-copy {
  min-width: 0;
}

.model-summary-copy>h3 {
  font-size: 21px;
  line-height: 1.4;
  margin: 0 0 16px;
}

.model-summary-copy>p:not(.label) {
  font-size: 16px;
  line-height: 1.8;
  margin: 0 0 18px;
}

.model-summary-layout .visual-description {
  font-size: 12px;
  line-height: 1.8;
  margin: 14px 0 0;
  color: var(--quiet);
}

.model-summary-layout .visual-description summary {
  cursor: pointer;
}

.model-summary-layout .visual-description .notice {
  font-size: 12px;
}

.review-brief .score-details {
  margin: 24px 0 0;
  border-color: #d2deef;
}

.review-brief .score-details summary {
  font-size: 13px;
  line-height: 1.6;
  padding: 16px 0;
  color: #315477;
}

.review-brief .opbouw {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 22px;
  margin: 0;
  padding: 12px 0 20px;
}

.review-brief .opbouw dt {
  font-size: 12px;
  line-height: 1.6;
  color: #49617f;
}

.review-brief .opbouw dd {
  font-size: 18px;
  font-weight: 650;
  line-height: 1.4;
  margin: 8px 0 12px;
  color: #193c72;
}

.review-brief .opbouw>div:after {
  content: "";
  display: block;
  width: var(--score);
  max-width: 100%;
  height: 4px;
  background: var(--blue);
  border-radius: 4px;
}

.review-brief .ui-methode {
  padding: 20px 0 0;
  margin-top: 0;
  border: 0;
  border-radius: 0;
  background: none;
}

.review-brief .ui-methode p {
  font-size: 13px;
  line-height: 1.8;
  margin: 0 0 16px;
  color: var(--muted);
}

.review-brief .ui-methode h3 {
  font-size: 19px;
  line-height: 1.4;
  margin: 0 0 14px;
}

.review-brief .ui-methode p:last-child {
  margin-bottom: 0;
}

.review-related>div {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 12px;
}

.review-related>div>a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 18px 20px;
  background: #f2f6fc;
  border: 1px solid var(--line);
  border-radius: 9px;
  font-size: 14px;
  line-height: 1.6;
  color: #294e87;
  text-decoration: none;
}

.review-related>div>a:hover {
  border-color: #9ebbf3;
}

.all-reviews-link {
  display: inline-block;
  font-size: 14px;
  margin-top: 24px;
  color: var(--blue);
}

.review-directory-count {
  font-size: 13px;
  line-height: 1.7;
  color: #5f7595;
  padding-top: 20px;
  border-top: 1px solid var(--line);
  margin-top: 28px;
}

.review-directory {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 20px;
  padding-bottom: 64px;
}

.review-directory-card {
  display: flex;
  flex-direction: column;
  padding: 25px;
  border: 1px solid var(--line);
  border-radius: 14px;
  text-decoration: none;
  background: #fff;
  min-width: 0;
}

.review-directory-card>span {
  color: #7c8ba1;
  font-size: 11px;
  line-height: 1.6;
  margin-bottom: 18px;
}

.review-directory-card h2 {
  font-size: 23px;
  line-height: 1.35;
  letter-spacing: -.025em;
  overflow-wrap: anywhere;
  margin: 0 0 28px;
}

.review-directory-card p {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  color: var(--blue);
  font-size: 13px;
  font-weight: 600;
  margin-top: auto;
}

.review-directory-card:hover {
  border-color: #9ebbf3;
  background: #f8faff;
}

#beoordeling, .review-brief {
  scroll-margin-top: 110px;
}

@media (prefers-reduced-motion:no-preference) {
  .review-directory-card {
    transition: border-color 160ms,background 160ms;
  }

  .review-directory-card p>span {
    transition: transform 160ms;
  }

  .review-directory-card:hover p>span {
    transform: translateX(4px);
  }
}

.model-heading>div:first-child {
  min-width: 0;
}

.model-heading h2 {
  overflow-wrap: anywhere;
}

.review-offer {
  display: grid;
  grid-template-columns: minmax(0,1fr) 220px;
  align-items: center;
  gap: 28px;
  padding: 26px 28px;
  margin: 4px 0 44px;
  border: 1px solid #d8e4f7;
  border-radius: 14px;
  background: #f1f6ff;
}

.review-offer h2, .review-offer h3 {
  font-size: 23px;
  line-height: 1.35;
  margin: 0 0 12px;
}

.review-offer p {
  font-size: 13px;
  line-height: 1.8;
  margin: 0;
  color: #506886;
}

.review-offer p:first-of-type {
  font-size: 15px;
  font-weight: 600;
  color: #213b64;
  margin-bottom: 8px;
  overflow-wrap: anywhere;
}

.review-offer .site-shop {
  margin: 0;
}

@media (max-width:600px) {
  .review-offer {
    grid-template-columns: 1fr;
    gap: 22px;
    padding: 24px 20px;
  }

  .review-offer h2 {
    font-size: 22px;
  }
}

@media (max-width:1100px) {
  .model-summary-layout {
    grid-template-columns: 130px minmax(0,1fr);
    gap: 22px;
  }

  .model-heading h2 {
    font-size: 25px;
  }

  .review-directory {
    grid-template-columns: repeat(2,minmax(0,1fr));
  }
}

@media (max-width:900px) {
  .model-summary-layout {
    grid-template-columns: 170px minmax(0,1fr);
  }
}

@media (max-width:600px) {
  .review-brief {
    padding: 22px 20px;
  }

  .model-heading {
    gap: 15px;
    margin-bottom: 22px;
  }

  .model-heading h2 {
    font-size: 24px;
    line-height: 1.3;
  }

  .model-score {
    padding: 10px;
    max-width: 75px;
  }

  .model-score>strong {
    font-size: 25px;
  }

  .model-score>span {
    font-size: 12px;
  }

  .model-summary-layout {
    grid-template-columns: 1fr;
    gap: 24px;
  }

  .model-photo {
    width: 100%;
    max-width: 200px;
    justify-self: center;
    height: auto;
    min-height: 140px;
    aspect-ratio: auto;
  }

  .model-summary-copy>p:not(.label) {
    font-size: 15px;
    line-height: 1.85;
  }

  .review-related>div {
    grid-template-columns: 1fr;
  }

  .review-related>div>a {
    font-size: 13px;
    padding: 16px 18px;
  }

  .review-directory {
    grid-template-columns: 1fr;
    gap: 14px;
    padding-bottom: 40px;
  }

  .review-directory-card {
    padding: 22px;
  }

  .review-directory-card h2 {
    font-size: 24px;
    margin-bottom: 24px;
  }

  .review-brief .opbouw {
    gap: 18px;
  }

  .review-brief .opbouw dt {
    font-size: 12px;
  }

  .review-brief .opbouw dd {
    font-size: 17px;
  }
}

@media (max-width:480px) {
  .model-heading {
    display: block;
  }

  .model-score {
    display: inline-flex;
    flex-direction: row;
    align-items: center;
    gap: 12px;
    max-width: none;
    margin-top: 18px;
    padding: 10px 14px;
  }

  .model-score>span {
    margin: 0;
    max-width: none;
    text-align: left;
    font-size: 12px;
  }
}

/* 10. Choice aid and recommendations */

.choice-guide {
  padding-block: 28px 44px;
}

.choice-disclosure {
  background: linear-gradient(115deg,#edf3ff,#f7f9fd 65%,#f1f6e6);
  border: 1px solid #cbd9f0;
  border-radius: 20px;
  overflow: hidden;
}

.choice-disclosure>summary {
  list-style: none;
  display: flex;
  gap: 22px;
  align-items: center;
  cursor: pointer;
  padding: 28px 32px;
}

.choice-disclosure>summary::-webkit-details-marker {
  display: none;
}

.choice-symbol {
  width: 62px;
  height: 62px;
  border-radius: 18px;
  background: var(--blue);
  color: white;
  display: grid;
  place-items: center;
  flex-shrink: 0;
  box-shadow: 0 5px 14px #195cff1a;
  transform: rotate(-5deg);
}

.choice-symbol svg {
  height: 34px;
  width: 34px;
  stroke-width: 1.8;
  fill: none;
  stroke: currentColor;
}

.choice-summary-copy {
  display: grid;
  gap: 6px;
  flex: 1;
}

.choice-kicker {
  color: #42618b;
  font-size: 12px;
  font-weight: 650;
  line-height: 1.6;
  display: block;
}

.choice-summary-copy>strong {
  font-family: var(--font-heading);
  font-size: 25px;
  line-height: 1.3;
  letter-spacing: -.035em;
  color: var(--dark);
  font-weight: 650;
}

.choice-summary-copy>span:last-child {
  font-size: 14px;
  line-height: 1.6;
  color: var(--muted);
}

.choice-start {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 18px;
  min-height: 48px;
  padding: 12px 18px;
  background: white;
  border: 1px solid #cbd9f0;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 650;
  color: var(--blue);
  flex-shrink: 0;
}

.choice-chevron {
  font-size: 20px;
  line-height: 1;
}

.choice-disclosure[open] .choice-chevron {
  transform: rotate(90deg);
}

.choice-body {
  padding: 28px 32px 30px;
  border-top: 1px solid #d6e1f1;
  background: white;
}

.choice-body fieldset {
  border: 0;
  padding: 0;
  margin: 0 0 26px;
  min-width: 0;
}

.choice-body legend {
  font-size: 19px;
  font-weight: 650;
  line-height: 1.5;
  color: var(--dark);
  padding: 0;
  margin-bottom: 12px;
}

.choice-body legend>span {
  display: inline-grid;
  place-items: center;
  vertical-align: middle;
  background: #edf3ff;
  color: var(--blue);
  width: 28px;
  height: 28px;
  border-radius: 8px;
  margin-right: 8px;
  font-size: 13px;
}

.choice-help {
  font-size: 13px;
  line-height: 1.7;
  color: var(--muted);
  max-width: 85ch;
  margin: 0 0 14px;
}

.choice-options {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 12px;
}

.choice-options label {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  border: 1px solid #d5dfed;
  background: #fff;
  border-radius: 12px;
  padding: 17px 14px;
  cursor: pointer;
  min-height: 84px;
}

.choice-options label:hover {
  border-color: #789de8;
  background: #f8faff;
}

.choice-options label:has(input:checked) {
  border-color: var(--blue);
  background: #edf3ff;
  box-shadow: 0 0 0 1px var(--blue);
}

.choice-options input {
  accent-color: var(--blue);
  width: 18px;
  height: 18px;
  margin: 3px 0 0;
  flex-shrink: 0;
}

.choice-options strong {
  display: block;
  font-size: 14px;
  font-weight: 650;
  color: var(--dark);
  line-height: 1.6;
}

.choice-options small {
  display: block;
  font-size: 12px;
  line-height: 1.6;
  color: var(--quiet);
  margin-top: 3px;
}

.choice-submit {
  display: flex;
  gap: 18px;
  align-items: center;
  flex-wrap: wrap;
}

.choice-submit>span {
  font-size: 12px;
  color: var(--quiet);
}

.choice-result {
  border: 1px solid #d8e4c0;
  background: #f5f9ec;
  border-radius: 14px;
  margin-top: 26px;
  padding: 26px;
}

.choice-result h3 {
  font-size: 25px;
  line-height: 1.35;
  margin: 12px 0;
  color: var(--dark);
}

.choice-result p {
  font-size: 15px;
  line-height: 1.8;
  max-width: 80ch;
  margin: 0 0 16px;
  color: #40516c;
}

.choice-result-caveat {
  border-top: 1px solid #d8e4c0;
  padding-top: 14px;
  font-size: 13px;
}

.choice-result-caveat>strong {
  color: #334b21;
}

.choice-result-actions {
  display: flex;
  align-items: center;
  gap: 24px;
  flex-wrap: wrap;
}

.choice-result-actions .shop-action {
  min-width: 190px;
}

.choice-review {
  font-size: 14px;
  font-weight: 650;
  color: var(--blue);
  text-underline-offset: 4px;
}

.choice-review:hover {
  text-decoration: underline;
}

.choice-no-match {
  background: var(--pale);
  border-color: #d5dfed;
}

.choice-body .choice-scope, .choice-fallback {
  font-size: 12px;
  line-height: 1.8;
  color: var(--quiet);
  margin: 20px 0 0;
}

.choice-fallback a {
  text-decoration: underline;
  color: var(--blue);
}

.scroll-recommendation {
  background: var(--pale);
  border: 1px solid #d2dff2;
  border-radius: 14px;
  padding: 18px;
  margin: 0 0 24px;
  min-width: 0;
}

.recommendation-photo {
  display: flex;
  align-items: center;
  justify-content: center;
  background: white;
  border: 1px solid #e4eaf4;
  border-radius: 10px;
  width: 100%;
  max-width: 100%;
  padding: 8px;
  margin: 10px 0;
}

.recommendation-photo img {
  display: block;
  width: 100%;
  height: 72px;
  object-fit: contain;
}

.recommendation-name {
  display: block;
  font-family: var(--font-heading);
  font-size: 14px;
  font-weight: 650;
  line-height: 1.4;
  letter-spacing: -.025em;
  margin: 0 0 8px;
  color: var(--dark);
  overflow-wrap: anywhere;
  text-wrap: balance;
}

.product-reviews-layout .recommendation-specs, .recommendation-specs {
  font-size: 12px;
  color: var(--muted);
  line-height: 1.7;
  margin: 0 0 16px;
}

.scroll-recommendation a.shop-button, .mobile-recommendation a.shop-button {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 46px;
  padding: 11px 14px;
  font-size: 14px;
  color: white;
}

.product-reviews-layout a.choice-jump, .choice-jump {
  display: block;
  font-size: 12px;
  line-height: 1.7;
  color: #42618b;
  margin-top: 14px;
  text-decoration: none;
}

@media (max-width: 600px) {
  .mobile-recommendation a.shop-button {
    min-height: var(--button-height);
    padding: var(--button-padding);
  }
}

.choice-jump:hover {
  text-decoration: underline;
}

.mobile-recommendation {
  display: none;
}

.choice-guide :focus-visible, .scroll-recommendation :focus-visible, .mobile-recommendation :focus-visible {
  outline: 3px solid var(--blue);
  outline-offset: 4px;
}

@keyframes conversion-enter {
from{opacity:.5;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}
}

@keyframes shop-sheen {
from{transform:translateX(-190%) skewX(-18deg)}to{transform:translateX(330%) skewX(-18deg)}
}

@keyframes choice-wiggle {
0%,100%{transform:rotate(-5deg)}35%{transform:rotate(5deg)}70%{transform:rotate(-8deg)}
}

@media (prefers-reduced-motion:no-preference) {
  [data-conversion-reveal].conversion-entered {
    animation: conversion-enter .55s cubic-bezier(.2,.65,.3,1) backwards;
  }

  .conversion-entered .shop-button::after, .mobile-recommendation.first-appearance .shop-button::after {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 45%;
    pointer-events: none;
    background: linear-gradient(90deg,transparent,#ffffff38,transparent);
    animation: shop-sheen .85s .4s both;
  }

  .choice-guide.conversion-entered .choice-symbol {
    animation: choice-wiggle .75s .3s both;
  }

  .mobile-recommendation.first-appearance {
    animation: conversion-enter .35s both;
  }

  .choice-disclosure[open] .choice-body,.choice-result:not([hidden]) {
    animation: conversion-enter .3s both;
  }

  .choice-chevron, .choice-options label {
    transition: transform .2s,border-color .2s,background .2s;
  }
}

@media (max-width:1100px) {
  .choice-disclosure>summary {
    gap: 16px;
    padding: 24px;
  }

  .choice-summary-copy>strong {
    font-size: 22px;
  }

  .choice-symbol {
    width: 50px;
    height: 50px;
  }

  .choice-start {
    gap: 10px;
    padding: 12px;
  }

  .choice-body {
    padding: 24px;
  }

  .scroll-recommendation {
    padding: 14px;
  }

  .recommendation-name {
    font-size: 13px;
  }
}

@media (max-width:900px) {
  .scroll-recommendation {
    display: none;
  }

  .mobile-recommendation:not([hidden]) {
    display: block;
    position: fixed;
    inset: auto 0 0;
    z-index: 40;
    background: #fff;
    border-top: 1px solid #d2dff2;
    box-shadow: 0 -6px 24px #14234210;
    padding: 10px 10px calc(10px + env(safe-area-inset-bottom));
  }

  .mobile-recommendation-inner {
    max-width: 640px;
    margin: auto;
    display: grid;
    grid-template-columns: minmax(0,1fr) auto 44px;
    align-items: center;
    gap: 10px;
  }

  .mobile-recommendation-copy {
    min-width: 0;
  }

  .mobile-recommendation-copy>strong {
    display: block;
    color: var(--dark);
    font-size: 13px;
    line-height: 1.45;
    margin-top: 5px;
    max-width: 30ch;
  }

  .mobile-recommendation .recommendation-label { line-height: 1.5; }

  .mobile-recommendation .shop-button {
    gap: 8px;
  }

  .mobile-recommendation .shop-retailer {
    font-size: 10px;
  }

  .mobile-recommendation .shop-action {
    gap: 3px;
  }

  .recommendation-close {
    border: 0;
    background: transparent;
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    padding: 6px;
    color: var(--quiet);
  }

  .recommendation-close svg {
    width: 18px;
    height: 18px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.75;
  }

  body.has-mobile-recommendation {
    padding-bottom: var(--recommendation-height,110px);
  }

  html.has-mobile-recommendation {
    scroll-padding-bottom: calc(var(--recommendation-height,110px) + 16px);
  }

  .choice-start {
    font-size: 13px;
  }

  .choice-options {
    grid-template-columns: 1fr;
  }

  .choice-options label {
    min-height: 64px;
  }
}

@media (max-width:600px) {
  .choice-guide {
    padding-block: 20px 32px;
  }

  .choice-disclosure {
    border-radius: 16px;
  }

  .choice-disclosure>summary {
    display: grid;
    grid-template-columns: 40px minmax(0,1fr);
    gap: 14px;
    padding: 20px;
  }

  .choice-symbol {
    width: 40px;
    height: 40px;
    border-radius: 12px;
  }

  .choice-symbol svg {
    width: 28px;
    height: 28px;
  }

  .choice-summary-copy>strong {
    font-size: 21px;
  }

  .choice-summary-copy>span:last-child {
    font-size: 13px;
  }

  .choice-kicker {
    font-size: 10px;
  }

  .choice-start {
    grid-column: 1/-1;
    justify-content: space-between;
    margin-top: 2px;
    min-height: var(--button-height);
    padding: 9px 12px;
  }

  .choice-body {
    padding: 22px 18px;
  }

  .choice-body legend {
    font-size: 17px;
  }

  .choice-body legend>span {
    width: 24px;
    height: 24px;
    margin-right: 5px;
  }

  .choice-submit {
    gap: 10px;
  }

  .choice-result {
    padding: 20px;
  }

  .choice-result h3 {
    font-size: 22px;
  }

  .choice-result-actions {
    display: grid;
    gap: 16px;
  }

  .choice-result-actions .shop-action {
    min-width: 0;
  }
}

@media (max-width:360px) {
  .mobile-recommendation-inner {
    gap: 6px;
  }

  .mobile-recommendation .shop-button svg {
    display: none;
  }

  .mobile-recommendation-copy>strong {
    font-size: 12px;
  }
}

@media (prefers-reduced-motion:reduce) {
  .choice-guide *, .scroll-recommendation *, .mobile-recommendation * {
    animation: none;
    transition: none;
  }
}

@media print {
  .mobile-recommendation, .scroll-recommendation, .choice-guide {
    display: none;
  }
}

/* Reading explanations: the original paragraphs remain inside each pattern. */
.reading-comparison, .reading-features, .reading-callout, .reading-flow {
  margin: 28px 0;
  max-width: 100%;
}
.reading-columns {
  display: grid;
  grid-template-columns: repeat(auto-fit,minmax(min(100%,310px),1fr));
  gap: 20px;
  align-items: stretch;
}
.reading-item { min-width: 0; }
.reading-columns > .reading-item {
  padding: var(--panel-padding);
  border: 1px solid var(--line);
  border-radius: var(--card-radius);
  background: var(--pale);
}
.reading-columns > .reading-item:nth-child(even) { background: #fff; }
.reading-item h3, .reading-feature h3, .reading-callout h3 {
  margin: 0 0 16px;
  color: #244d8c;
  font-size: 20px;
  line-height: 1.45;
}
.reading-item-copy, .reading-feature-copy { min-width: 0; }
.reading-item-copy p, .reading-feature-copy p, .reading-callout p {
  max-width: none;
  margin: 0 0 18px;
  font-size: var(--body-size);
}
.reading-item-copy > :last-child, .reading-feature-copy > :last-child, .reading-callout > :last-child { margin-bottom: 0; }
.reading-rows, .reading-features {
  border: 1px solid var(--line);
  border-radius: var(--card-radius);
  overflow: hidden;
}
.reading-rows > .reading-item, .reading-feature {
  display: grid;
  grid-template-columns: minmax(140px,.8fr) minmax(0,2.2fr);
  gap: 28px;
  padding: var(--panel-padding);
  background: #fff;
}
.reading-rows > .reading-item + .reading-item, .reading-feature + .reading-feature { border-top: 1px solid var(--line); }
.reading-rows > .reading-item:nth-child(even), .reading-feature:nth-child(even) { background: #f7f9fd; }
.reading-rows .reading-item h3, .reading-feature h3 { margin-bottom: 0; font-size: 18px; }
.reading-callout {
  padding: var(--panel-padding);
  border: 1px solid var(--line);
  border-left: 4px solid #8baeea;
  border-radius: var(--table-radius);
  background: var(--pale);
}
.reading-flow {
  padding: var(--panel-padding);
  border: 1px solid var(--line);
  border-radius: var(--card-radius);
  background: var(--pale);
}
.reading-flow figcaption { margin-bottom: 24px; color: var(--dark); font: 650 21px/1.4 var(--font-heading); }
.prose .reading-flow-list {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 24px;
  list-style: none;
  counter-reset: air-step;
  max-width: none;
  margin: 0;
  padding: 0;
}
.prose .reading-flow-list > li {
  position: relative;
  counter-increment: air-step;
  margin: 0;
  padding: 0;
}
.reading-flow-list > li::before, .reading-step-number {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  border: 1px solid #d4e1fb;
  border-radius: var(--control-radius);
  background: #eaf0ff;
  color: #2458b5;
  font: 650 18px/1 var(--font-heading);
}
.reading-flow-list > li::before { content: counter(air-step); margin-bottom: 16px; }
.reading-flow-list > li:not(:last-child)::after {
  content: '→';
  position: absolute;
  top: 8px;
  right: 0;
  color: #6c8bb8;
}
.chapter .reading-step-title { display: flex; align-items: flex-start; gap: 16px; }
.reading-step-title > span:last-child { min-width: 0; overflow-wrap: anywhere; hyphens: auto; }
.reading-step-number { flex: 0 0 40px; margin-top: 2px; }
@media (max-width:600px) {
  .reading-columns { grid-template-columns: 1fr; gap: 16px; }
  .chapter .reading-step-title { display: block; }
  .reading-step-title > span:last-child { display: block; }
  .reading-step-number { margin: 0 0 12px; }
  .reading-rows > .reading-item, .reading-feature { grid-template-columns: 1fr; gap: 14px; }
  .reading-item h3, .reading-callout h3 { font-size: 19px; }
  .prose .reading-flow-list { grid-template-columns: 1fr; gap: 24px; }
  .prose .reading-flow-list > li { padding-left: 56px; min-height: 40px; }
  .reading-flow-list > li::before { position: absolute; left: 0; top: 0; margin: 0; }
  .reading-flow-list > li:not(:last-child)::after { content: ''; top: 48px; bottom: -16px; right: auto; left: 19px; width: 1px; background: #c7d8f0; }
}

/* 11. Review explanations: reusable figures, using the shared design values. */

.review-facts {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 24px;
  max-width: var(--reading-width);
  margin-top: 32px;
  padding-top: 28px;
  border-top: 1px solid var(--line);
}

.review-facts a { display: block; padding-left: 20px; border-left: 3px solid #dce7ff; }
.review-facts a:hover { border-left-color: var(--blue); }
.review-facts strong { display: block; font: 650 25px/1.3 var(--font-heading); color: var(--dark); letter-spacing: -.03em; }
.review-facts span { display: block; margin-top: 8px; font-size: 13px; line-height: 1.6; color: var(--muted); }
.review-use-label { margin-bottom: 16px; }
.model-visual { min-width: 0; }

.review-insight {
  margin: 30px 0;
  padding: var(--panel-padding);
  border: 1px solid var(--line);
  border-radius: var(--card-radius);
  background: var(--pale);
}

.review-insight h3 { margin: 0 0 24px; font-size: 21px; }
.review-metrics { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 24px; margin: 0; }
.review-metrics > div { min-width: 0; display: flex; flex-direction: column; padding-left: 20px; border-left: 1px solid #cbd8eb; }
.review-metrics > div:first-child { border: 0; padding-left: 0; }
.review-metrics dt { font-size: 13px; line-height: 1.6; color: var(--muted); }
.review-metrics dd { order: -1; margin: 0 0 12px; }
.review-metrics strong { display: block; font: 650 31px/1.25 var(--font-heading); color: var(--blue); letter-spacing: -.04em; }
.review-metrics dd span { display: block; margin-top: 7px; font-size: 12px; line-height: 1.5; color: var(--dark); }
.review-insight p.review-visual-note { font-size: 13px; line-height: 1.8; color: var(--muted); margin: 22px 0 0; }
.review-saving { background: #f5faed; border-color: #dae6c6; }
.review-saving .review-metrics strong { color: #365b20; font-size: 26px; }

.review-bars { padding: var(--panel-padding); background: #fff; }
.review-bars figcaption { max-width: none; }
.review-chart-axis { display: flex; justify-content: space-between; gap: 16px; font-size: 12px; line-height: 1.5; color: var(--quiet); margin-bottom: 16px; }
.review-chart-axis span:last-child { text-align: right; }
.review-bar { padding-block: 18px; border-top: 1px solid #eaf0f6; }
.review-bar-heading { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin-bottom: 12px; }
.review-bar-heading > div { min-width: 0; font-size: 14px; font-weight: 650; line-height: 1.5; }
.review-bar-heading > div span { display: block; margin-top: 4px; color: var(--quiet); font-size: 12px; font-weight: 400; }
.review-bar-heading strong { flex-shrink: 0; color: var(--dark); font-size: 16px; }
.review-bars .metric-track { height: 10px; background: #f0f3f9; }
.review-bars .metric-track > span { background: #9fb4d2; }
.review-bar.is-current .metric-track > span { background: var(--blue); }
.review-bar.is-current .review-bar-heading { color: var(--blue); }
.review-bar.is-current .review-bar-heading strong { color: var(--blue); }
.review-schedule { background: linear-gradient(120deg,#f1f5ff,#fff); }
.review-bars p.chart-note { max-width: none; font-size: 13px; line-height: 1.8; margin-bottom: 0; padding-top: 18px; border-top: 1px solid var(--line); }

.table-scroll .review-comparison-table { table-layout: fixed; min-width: 680px; }
.table-scroll .review-comparison-table thead th:first-child { width: 24%; }
.table-scroll .review-comparison-table .table-current-model { background: #edf3ff; }
.table-scroll .review-comparison-table thead .table-current-model { background: #dfeaff; box-shadow: inset 0 3px 0 var(--blue); color: #174ba4; }
.table-scroll .review-alternatives-table .table-current-model { background: #edf3ff; color: #244d8c; font-weight: 600; }
.table-scroll .review-alternatives-table thead .table-current-model { background: #dfeaff; box-shadow: inset 0 3px 0 var(--blue); }

@media (max-width: 600px) {
  .review-facts { gap: 20px; }
  .review-facts a { padding-left: 12px; }
  .review-facts strong { font-size: 20px; }
  .review-facts span { font-size: 12px; }
  .review-metrics { grid-template-columns: 1fr; gap: 20px; }
  .review-metrics > div, .review-metrics > div:first-child { border: 0; border-bottom: 1px solid var(--line); padding: 0 0 18px; }
  .review-metrics > div:last-child { border-bottom: 0; padding-bottom: 0; }
  .review-metrics strong { font-size: 30px; }
  .review-metrics dd { display: flex; align-items: baseline; gap: 12px; margin-bottom: 6px; }
  .review-metrics dd span { margin: 0; }
  .review-saving .review-metrics { gap: 14px; }
  .review-saving .review-metrics > div { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 12px; padding-bottom: 14px; }
  .review-saving .review-metrics dd { margin: 0; }
  .review-saving .review-metrics strong { font-size: 22px; }
  .review-insight h3 { font-size: 20px; }
  .review-bar-heading { align-items: start; gap: 12px; }
  .review-bar-heading strong { font-size: 14px; }
}

@media (max-width: 420px) {
  .review-facts { grid-template-columns: 1fr; gap: 15px; padding-top: 24px; }
  .review-facts a { display: grid; grid-template-columns: 120px minmax(0,1fr); align-items: center; gap: 14px; }
  .review-facts span { margin-top: 0; }
}

/* Review reading patterns. Text remains full size, with the shared prose measure. */
.review-hero .lead { max-width: var(--prose-measure); }
.review-facts a { min-height: 44px; }
.review-use-label { background: #e5edff; color: #244d8c; }
.prose ul.review-limits { list-style: none; padding: 0; margin: 24px 0; border: 1px solid var(--line); border-radius: var(--table-radius); overflow: hidden; max-width: var(--prose-measure); }
.review-limits li { display: flex; align-items: baseline; justify-content: space-between; gap: 24px; margin: 0; padding: 15px 20px; background: #f7f9fc; border-bottom: 1px solid var(--line); }
.review-limits li:last-child { border: 0; }
.review-limits strong { flex-shrink: 0; font-variant-numeric: tabular-nums; }
.review-reading-panel { margin: 28px 0; padding: var(--panel-padding); border: 1px solid var(--line); border-radius: var(--card-radius); background: var(--pale); }
.review-reading-panel h3 { margin: 0 0 18px; font-size: 21px; color: var(--dark); }
.review-reading-panel > p:not(.label) { max-width: var(--prose-measure); }
.review-reading-panel > p:last-child { margin-bottom: 0; }
.review-service { border: 0; border-left: 3px solid #9fb4d2; border-radius: 0; background: #f7f9fc; }
.review-positive, .review-caution { background: none; border: 0; border-left: 3px solid #8ba5cc; border-radius: 0; padding-block: 4px; }
.review-caution { border-left-color: #be934f; }
.review-positive h3, .review-caution h3 { font-size: 17px; letter-spacing: 0; }
.review-fact-sheet { margin: 28px 0; padding: var(--panel-padding); border: 1px solid var(--line); border-radius: var(--card-radius); background: #fff; }
.review-fact-sheet figcaption { font: 650 21px/1.4 var(--font-heading); color: var(--dark); margin-bottom: 24px; }
.review-fact-sheet dl { margin: 0; }
.review-fact-sheet dl > div { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.4fr); gap: 28px; padding: 18px 0; border-top: 1px solid var(--line); }
.review-fact-sheet dt { color: var(--muted); font-size: 14px; line-height: 1.6; }
.review-fact-sheet dd { margin: 0; }
.review-fact-sheet dd strong { display: block; font: 650 21px/1.4 var(--font-heading); color: var(--dark); }
.review-fact-sheet dd span { display: block; margin-top: 6px; color: var(--muted); font-size: 13px; line-height: 1.7; }
.review-fact-sheet p.review-visual-note { font-size: 13px; line-height: 1.8; color: var(--muted); margin: 8px 0 0; padding-top: 18px; border-top: 1px solid var(--line); max-width: none; }
.review-verdict { padding: var(--panel-padding); background: #f5faed; border: 1px solid #dae6c6; border-radius: var(--card-radius); }
.review-verdict .review-offer { padding: 24px 0 0; margin: 26px 0 0; border: 0; border-top: 1px solid #cddcbd; border-radius: 0; background: none; }
.review-verdict .review-offer h3 { font-size: 20px; margin: 0 0 12px; }
.review-offer p:not(.label) { font-size: 13px; margin-bottom: 0; }
.review-offer p:first-of-type { font-size: 15px; margin-bottom: 8px; }
.review-sources { padding-top: 0; margin-bottom: 0; }
.review-sources ul { columns: 2; column-gap: 40px; }
.review-sources li { break-inside: avoid; padding-block: 3px; }
.review-sources a { display: block; }

/* Native table scrolling, enhanced with controls only when columns overflow. */
.table-controls { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 12px 16px; margin: 26px 0 10px; font-size: 13px; line-height: 1.6; color: var(--muted); }
.table-control-title { grid-column: 1/-1; font-size: var(--table-font-size); font-weight: 650; color: var(--dark); }
.table-scroll caption.table-caption-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; padding: 0; border: 0; }
.table-controls > div { display: flex; gap: 8px; flex-shrink: 0; }
.table-controls button { display: grid; place-items: center; width: 44px; height: 44px; border: 1px solid #bacce5; border-radius: var(--control-radius); background: white; color: var(--blue); font-size: 22px; }
.table-controls button:disabled { color: #718098; background: #f3f6fc; border-color: var(--line); cursor: default; }
.table-controls:not([hidden]) + .table-scroll { margin-top: 0; }
.table-scroll.is-enhanced + .table-swipe-hint { display: none; }
.table-scroll table a { display: inline-block; }
.table-scroll.has-overflow thead th:first-child, .table-scroll.has-overflow tbody th:first-child { position: sticky; left: 0; z-index: 1; box-shadow: 2px 0 0 #dce5ef; }
.sidebar nav a[aria-current="location"] { color: var(--blue); border-left: 2px solid var(--blue); background: #f3f6fc; margin-left: -18px; padding-left: 16px; }

@media (max-width:600px) {
  .review-reading-panel h3, .review-fact-sheet figcaption { font-size: 20px; }
  .review-positive h3, .review-caution h3 { font-size: 17px; }
  .review-fact-sheet dl > div { grid-template-columns: 1fr; gap: 8px; }
  .review-sources ul { columns: 1; }
  .table-scroll.has-overflow table { table-layout: fixed; }
  .table-scroll.has-overflow thead th:first-child { min-width: 0; width: 140px; }
  .table-scroll.has-overflow thead th:not(:first-child) { min-width: 0; }
  .table-controls { gap: 8px; font-size: 12px; }
  .review-bar-heading > div { overflow-wrap: anywhere; }
  .review-brief .model-summary-copy > p:not(.label) { font-size: var(--body-size); line-height: var(--body-leading); }
}

/* 12. Interaction and accessibility apply equally to every component. */

@media (prefers-reduced-motion: no-preference) {
  .button, .shop-button, .site-shop { transition: background 160ms, box-shadow 160ms; }
  .pick-card { transition: box-shadow 180ms, transform 180ms; }
  .pick-card:hover { box-shadow: 0 12px 30px #223d6910; transform: translateY(-3px); }
  .page-chart.chart-entered .metric-track > span { animation: bar-enter 850ms cubic-bezier(.2,.65,.3,1) both; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
}

@media print {
  .table-controls { display: none; }
  .table-scroll caption.table-caption-sr { position: static; width: auto; height: auto; clip-path: none; white-space: normal; }
  .header, .sidebar, .contents, .mobile-recommendation, .scroll-recommendation, .choice-guide { display: none; }
  .content-layout, .product-reviews-layout { display: block; }
  .wrap { width: 100%; }
}

/* 14. Shared review prices: merchant rows and Wasmachine-info price history. */
.review-price-comparison { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); padding-block: var(--panel-padding); }
.price-section-heading, .price-history-heading { display:flex; justify-content:space-between; align-items:center; gap:20px; }
.price-section-heading h2, .price-history-heading h2, .review-price-history > h2 { margin:0; font-size:var(--h2-size); line-height:1.3; letter-spacing:-.035em; }
.price-section-heading > a, .price-text-link { color:var(--blue); font-size:14px; font-weight:600; text-underline-offset:4px; }
.chapter p.price-model-name, .chapter p.price-history-subtitle { margin:10px 0 14px; color:var(--muted); font-size:15px; }
.merchant-comparison { list-style:none; padding:0; margin:0; container-type:inline-size; }
.merchant-row { display:grid; grid-template-columns:minmax(130px,1fr) minmax(130px,1fr) auto; align-items:center; gap:20px; padding:22px 0; border-bottom:1px solid var(--line); min-width:0; }
.merchant-row:last-child { border-bottom:0; }
.merchant-name { display:flex; align-items:center; min-width:0; font-size:17px; height:48px; }
.merchant-logo { display:block; width:112px; max-width:100%; height:auto; max-height:44px; object-fit:contain; object-position:left center; }
.merchant-logo[alt="Coolblue"] { width:44px; }
.merchant-logo[alt="AEG"] { width:80px; }
.merchant-logo[alt="Bol.com"] { width:110px; }
.merchant-logo[alt="EP.nl"] { width:68px; }
.merchant-logo[alt="Samsung"] { width:132px; }
.merchant-logo[alt="Voordeligwitgoed.nl"] { width:160px; }
.merchant-price { min-width:0; }
.merchant-price > strong { display:block; font-family:var(--font-heading); font-size:15px; line-height:1.5; }
.merchant-price > span { display:block; font-size:12px; color:var(--muted); margin-top:5px; line-height:1.5; }
.merchant-comparison .shop-link { margin:0; min-height:var(--button-height); white-space:nowrap; }
.chapter p.price-source-note { font-size:13px; line-height:1.7; color:var(--muted); margin:16px 0 0; max-width:var(--text-measure); }
.review-price-history { padding:var(--panel-padding); background:#f5f8fd; border:1px solid #dce6f4; border-radius:var(--card-radius); }
.price-history-count { display:inline-block; color:var(--blue); font-size:var(--label-size); font-weight:600; padding:var(--label-padding); border:1px solid #dce6f4; border-radius:100px; white-space:nowrap; }
.price-history-stats { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; margin:24px 0; }
.price-history-stats > div { min-width:0; }
.price-history-stats dt { font-size:13px; color:var(--muted); }
.price-history-stats dd { font:700 30px/1.3 var(--font-heading); margin:5px 0 0; letter-spacing:-.04em; }
.chapter p.price-history-insight { font-size:16px; line-height:1.8; max-width:var(--prose-measure); margin:0; }
.review-price-history figure { margin:24px 0 0; }
.review-price-history figcaption { font-size:13px; line-height:1.6; color:var(--muted); }
.price-chart { position:relative; display:grid; grid-template-columns:58px minmax(0,1fr); margin-top:20px; height:240px; }
.price-chart-axis { display:flex; flex-direction:column; justify-content:space-between; font-size:12px; color:var(--muted); padding:12px 0; }
.price-chart-svg { width:100%; height:240px; overflow:visible; touch-action:pan-y; }
.price-chart-svg line { stroke:#d6e0ef; stroke-width:1; vector-effect:non-scaling-stroke; }
.price-chart-svg .price-chart-line { stroke:var(--blue); stroke-width:2.5; fill:none; stroke-linejoin:round; vector-effect:non-scaling-stroke; }
.price-chart-svg .price-chart-cursor { stroke:#839bc6; stroke-dasharray:4 5; }
.price-chart-point { fill:var(--blue); stroke:white; stroke-width:2; vector-effect:non-scaling-stroke; }
.price-chart-dates { display:flex; justify-content:space-between; margin-left:58px; font-size:11px; line-height:1.5; color:var(--muted); gap:8px; }
.price-history-controls { display:none; grid-template-columns:44px minmax(0,1fr) 44px; align-items:center; gap:12px; max-width:450px; margin:22px auto 6px; }
.price-history-controls output { font-size:15px; font-weight:600; text-align:center; line-height:1.5; }
.price-history-controls button { font:inherit; display:grid; place-items:center; width:44px; height:44px; padding:0; border:1px solid #cfdaec; border-radius:50%; background:white; color:var(--blue); cursor:pointer; }
.price-history-controls button:disabled { opacity:.4; cursor:default; }
.review-price-history input[type=range] { display:none; width:100%; accent-color:var(--blue); cursor:pointer; min-height:44px; margin:0; }
.chapter p.price-range-hint { display:none; text-align:center; font-size:12px; color:var(--muted); line-height:1.6; margin:6px 0 0; }
.price-history-ready .price-history-controls { display:grid; }
.price-history-ready input[type=range], .price-history-ready p.price-range-hint { display:block; }
.price-data { border-top:1px solid var(--line); margin-top:24px; padding-top:12px; }
.price-data summary { display:list-item; font-size:14px; font-weight:600; color:var(--blue); cursor:pointer; padding:10px 0; min-height:44px; }
.price-data-scroll { max-height:330px; overflow:auto; margin-top:12px; border:1px solid var(--line); border-radius:var(--table-radius); background:white; }
.price-data table { border-collapse:collapse; width:100%; font-size:var(--table-font-size); min-width:0; }
.price-data caption { text-align:left; padding:var(--table-padding); color:var(--muted); }
.price-data td, .price-data th { padding:var(--table-padding); text-align:left; border-bottom:1px solid var(--line); font-weight:400; }
.price-data thead th { position:sticky; top:0; background:#eef4ff; font-weight:600; }
.price-data td:last-child, .price-data thead th:last-child { text-align:right; white-space:nowrap; }
.chapter p.price-empty { font-size:16px; color:var(--muted); margin:18px 0; }
@container (max-width:550px) {
  .merchant-row { grid-template-columns:minmax(0,1fr) auto; gap:12px 16px; }
  .merchant-name { grid-row:1; }
  .merchant-price { grid-row:1; text-align:right; max-width:175px; }
  .merchant-price > strong { font-size:14px; }
  .merchant-comparison .shop-link { grid-column:1 / -1; justify-self:stretch; }
}
@media (max-width:600px) {
  .price-section-heading, .price-history-heading { align-items:flex-start; flex-direction:column; gap:12px; }
  .price-history-heading h2 { max-width:14ch; }
  .price-history-stats { gap:10px; margin:22px 0; }
  .price-history-stats dd { font-size:clamp(19px,5.8vw,27px); }
  .price-history-stats dt { font-size:12px; line-height:1.4; min-height:2.8em; }
  .chapter p.price-history-insight { font-size:15px; }
  .price-chart, .price-chart-svg { height:200px; }
  .price-chart { grid-template-columns:49px minmax(0,1fr); }
  .price-chart-axis { font-size:11px; padding:10px 0; }
  .price-chart-dates { margin-left:49px; }
  .price-chart-dates span:nth-child(2), .price-chart-dates span:nth-child(4) { display:none; }
  .price-chart-dates span { max-width:65px; }
  .price-chart-dates span:last-child { text-align:right; }
  .price-history-controls { gap:8px; }
  .price-history-controls output { font-size:13px; }
}
@media (prefers-reduced-motion:no-preference) {
  .price-history-ready .price-chart-line { animation:price-chart-in .7s ease-out both; }
  @keyframes price-chart-in { from { opacity:.35; } to { opacity:1; } }
}
@media (max-width:360px) {
  .price-history-stats { grid-template-columns:1fr; gap:0; }
  .price-history-stats > div { display:flex; align-items:baseline; justify-content:space-between; gap:12px; padding:10px 0; border-bottom:1px solid var(--line); }
  .price-history-stats dt { min-height:0; }
  .price-history-stats dd { font-size:22px; white-space:nowrap; margin:0; }
}
@media print {
  .price-history-controls, .review-price-history input[type=range], .price-range-hint { display:none!important; }
}

/* 15. Product reviews: verified hero imagery, clear criteria and a buying action. */
.review-hero-layout { display:grid; grid-template-columns:minmax(0,1.8fr) minmax(240px,1fr); align-items:center; gap:56px; }
.review-hero-layout .page-hero-copy { min-width:0; }
.review-hero-photo { width:100%; max-width:360px; justify-self:end; margin:0; padding:24px; border:1px solid var(--line); border-radius:var(--card-radius); background:#fff; }
.review-hero-photo img { display:block; width:100%; height:auto; aspect-ratio:1; object-fit:contain; }
.review-hero-photo figcaption { text-align:center; color:var(--muted); font-size:13px; line-height:1.6; margin-top:16px; }
.model-photo img { width:100%; height:auto; max-height:320px; object-fit:contain; }
.model-photo:has(img) { background:white; }
.review-position .review-metrics dt { font:650 17px/1.5 var(--font-heading); color:var(--dark); margin-bottom:16px; min-height:3em; }
.review-position .review-metrics dd { order:0; display:block; margin:0; }
.review-position .review-metrics strong { font-size:28px; }
.review-position .review-metrics dd span { font-size:13px; }
.review-position .review-metrics .review-metric-detail { margin-top:14px; padding-top:12px; border-top:1px solid #d5e0ef; color:var(--muted); }
.review-row-label { display:table; margin-top:10px; padding:4px 8px; font-size:11px; font-weight:600; line-height:1.5; border-radius:6px; }
.tone-positive { color:#29562f; background:#eaf3e8; }
.tone-caution { color:#78521c; background:#fff3dc; }
.tone-neutral { color:#3d526f; background:#eaf0f8; }
.review-position-table { table-layout:fixed; min-width:700px; }
.review-position-table thead th:first-child { width:29%; }
.review-position-table thead th:nth-child(2) { width:25%; }
.review-position-table[data-columns="4"] thead th:first-child { width:25%; }
.review-position-table[data-columns="4"] thead th:nth-child(2) { width:20%; }
.review-position-table td:first-of-type strong { color:#244d8c; font-weight:650; }
.has-review-buybar { --review-buybar-height:100px; padding-bottom:var(--review-buybar-height); }
.has-review-buybar .sidebar { max-height:calc(100dvh - var(--anchor-offset) - 110px); }
.review-buybar { position:fixed; inset:auto 0 0; z-index:95; background:#fff; border-top:1px solid #d9e3f0; box-shadow:0 -6px 30px #17365a10; }
.review-buybar[hidden] { display:none; }
.review-buybar-inner { display:flex; justify-content:space-between; align-items:center; gap:24px; padding-block:14px; }
.review-buybar-product { display:flex; align-items:center; gap:16px; min-width:0; }
.review-buybar-product img { width:50px; height:50px; object-fit:contain; flex-shrink:0; }
.review-buybar-product strong { display:block; font:650 17px/1.4 var(--font-heading); }
.review-buybar-product span { display:block; color:var(--muted); font-size:12px; line-height:1.5; margin-top:4px; }
.review-buybar-actions { display:flex; align-items:center; gap:24px; flex-shrink:0; }
.review-buybar-compare { font-size:13px; color:var(--muted); text-decoration:underline; text-underline-offset:4px; }
.review-buybar .button { margin:0; white-space:nowrap; flex-direction:row; align-items:center; gap:12px; }
@media (max-width:1000px) and (min-width:761px) {
  .review-hero-layout { grid-template-columns:minmax(0,1.7fr) minmax(200px,1fr); gap:28px; }
  .review-hero-layout .review-facts { gap:14px; }
  .review-hero-layout .review-facts strong { font-size:20px; }
  .review-hero-layout .review-facts a { padding-left:10px; }
}
@media (max-width:760px) {
  .review-hero-layout { grid-template-columns:minmax(0,1fr); gap:0; }
  .review-hero-layout .page-hero-copy { display:contents; }
  .review-hero-layout h1 { order:0; min-width:0; overflow-wrap:anywhere; }
  .review-hero-photo { order:1; max-width:260px; justify-self:center; margin:8px 0 28px; padding:18px; }
  .review-hero-layout .lead { order:2; }
  .review-hero-layout .hero-actions { order:3; }
  .review-hero-layout .review-facts { order:4; }
  .review-hero-layout .page-date { order:5; }
}
@media (max-width:600px) {
  .table-scroll .review-position-table { display:block; min-width:0; width:100%; }
  .review-position-table caption { display:block; }
  .review-position-table thead { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
  .review-position-table tbody { display:block; }
  .review-position-table tbody tr { display:block; padding:18px 16px; border-bottom:1px solid var(--line); }
  .table-scroll .review-position-table tbody th, .table-scroll .review-position-table tbody td { display:block; position:static; width:100%; padding:0; border:0; background:none; box-shadow:none; }
  .table-scroll .review-position-table tbody th { font-size:15px; font-weight:650; line-height:1.5; }
  .table-scroll .review-position-table tbody td { padding-top:16px; }
  .review-position-table td::before { content:attr(data-column-label); display:block; margin-bottom:4px; font-size:11px; font-weight:500; color:var(--muted); }
  .review-position-table tbody tr:last-child { border-bottom:0; }
  .review-buybar-inner { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:12px; padding-block:10px; padding-bottom:max(10px,env(safe-area-inset-bottom)); }
  .review-buybar-product img, .review-buybar-product span, .review-buybar-compare { display:none; }
  .review-buybar-product strong { font-size:12px; line-height:1.4; overflow-wrap:anywhere; }
  .review-buybar-actions { display:grid; }
  .review-buybar .button { width:100%; min-height:min(46px,var(--button-height)); font-size:14px; }
  .review-position .review-metrics dt { margin-bottom:10px; min-height:0; }
  .review-position .review-metrics dd span { margin-top:7px; }
}
@media (prefers-reduced-motion:no-preference) {
  .review-buybar:not([hidden]) { animation:review-buybar-in 240ms ease-out both; }
  @keyframes review-buybar-in { from { transform:translateY(12px); opacity:0; } to { transform:translateY(0); opacity:1; } }
}
@media print { .review-buybar { display:none; } .has-review-buybar { padding-bottom:0; } }

/* Standalone photo review: uses the shared typography, spacing and colours. */
.opstelling-checks { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin-block:24px; }
.opstelling-checks > div { background:white; border:1px solid var(--line); border-radius:12px; padding:22px; }
.opstelling-checks strong { display:block; color:var(--dark); font:650 17px/1.5 var(--font-heading); margin-bottom:10px; }
.opstelling-checks p { margin:0; font-size:15px; line-height:1.7; color:var(--muted); }
@media (max-width:760px) { .opstelling-checks { grid-template-columns:1fr; } }
.photo-test-header { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:16px; padding-block:24px; border-bottom:1px solid var(--line); }
.photo-test-main { padding-block:var(--section-padding); }
.photo-test-intro { display:grid; justify-items:start; gap:16px; margin-bottom:var(--section-space); }
.photo-test-intro p { color:var(--muted); max-width:var(--text-measure); }
.photo-test-item + .photo-test-item { margin-top:var(--section-space); }
.photo-test-item h2 { margin-bottom:20px; }
.photo-test-item figure { margin:0 0 12px; }
.photo-test-item figure a { display:block; border-radius:var(--card-radius); overflow:hidden; }
.photo-test-item img { width:100%; height:auto; }
.photo-test-link { color:var(--blue); font-size:14px; text-decoration:underline; text-underline-offset:4px; }
.photo-test-footer { display:flex; justify-content:space-between; flex-wrap:wrap; gap:16px; padding-block:24px; border-top:1px solid var(--line); color:var(--muted); font-size:14px; }

/* Wasmachine.site — shared visual system. New design requested 19 October 2026.
   The retained v18 CSS is compiled before this single, site-wide adaptation. */
:root{--blue:#2457ed;--blue-hover:#1744ca;--dark:#182b36;--muted:#5c6b72;--quiet:#6b777c;--line:#e1e6e4;--pale:#f4f6f4;--lime:#e6efbf;--paper:#fafbf8;--page-width:1280px;--font-body:DM,Arial,sans-serif;--font-heading:Manrope,DM,Arial,sans-serif;--body-size:17px;--h1-size:clamp(36px,4.1vw,57px);--h2-size:32px;--h3-size:23px;--anchor-offset:116px}
html{scroll-padding-top:116px}body.ds-site{background:var(--paper);color:var(--dark);font-family:var(--font-body);line-height:1.8}body.ds-site:has(.ds-nav.is-open){overflow-x:hidden}
.ds-site *{box-sizing:border-box}.ds-site a{color:inherit}.ds-site a:hover{color:var(--blue)}.ds-site img{height:auto}.ds-site h1,.ds-site h2,.ds-site h3{color:var(--dark);font-weight:750;letter-spacing:-.045em;text-wrap:balance}.ds-site h1{line-height:1.12}.ds-site h2{line-height:1.25}.ds-site button,.ds-site input{font-family:var(--font-body)}
.ds-icon{display:inline-block;width:24px;height:24px;flex:0 0 24px;vertical-align:middle}.ds-site .wrap{width:calc(100% - 72px);max-width:1280px;margin-inline:auto}
.ds-skip,.overslaan,.visueel-verborgen{position:absolute!important;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.ds-skip:focus{clip-path:none;width:auto;height:auto;padding:10px 16px;background:white;position:fixed!important;top:10px;left:10px;z-index:1000}
.ds-header{position:sticky;top:0;z-index:70;background:rgba(250,251,248,.96);border-bottom:1px solid var(--line);backdrop-filter:blur(16px)}.ds-header-inner{height:92px;display:flex;align-items:center;justify-content:space-between;gap:24px}.ds-brand{display:inline-flex;align-items:center;gap:10px;white-space:nowrap;font:800 24px/1 var(--font-heading);letter-spacing:-1.2px}.ds-brand-suffix{color:var(--blue)}.ds-brand-mark{display:grid;place-items:center;background:var(--blue);color:white;width:39px;height:42px;border-radius:12px}.ds-brand-mark .ds-icon{width:25px;height:28px}.ds-brand:hover .ds-brand-mark{background:var(--dark)}
.ds-nav{display:flex;align-items:center;gap:28px;font-size:14px;font-weight:600}.ds-menu{position:relative}.ds-menu summary{list-style:none;display:flex;align-items:center;gap:10px;cursor:pointer;min-height:48px}.ds-menu summary::-webkit-details-marker{display:none}.ds-chevron{width:6px;height:6px;display:block;border-right:1.5px solid;border-bottom:1.5px solid;transform:rotate(45deg);margin-top:-3px;transition:transform .2s}.ds-menu[open] .ds-chevron{transform:rotate(225deg);margin-top:3px}.ds-menu-panel{position:absolute;top:64px;left:-24px;width:320px;padding:20px;border:1px solid var(--line);background:#fff;border-radius:18px;box-shadow:0 20px 60px #182b3617}.ds-menu:last-of-type .ds-menu-panel{left:auto;right:0}.ds-menu-panel p{font-size:12px;color:var(--muted);margin:0 10px 10px}.ds-menu-panel a{padding:10px;display:flex;align-items:center;justify-content:space-between;gap:12px;border-radius:8px;line-height:1.5}.ds-menu-panel a:hover{background:#eff3ff}.ds-menu-panel a .ds-icon{width:16px;height:16px;flex-basis:16px}.ds-search-link{display:flex;align-items:center;gap:8px;padding:12px 0 12px 24px;border-left:1px solid var(--line)}.ds-search-link .ds-icon{width:20px;height:20px;flex-basis:20px}.ds-menu-toggle{display:none}.ds-reading-progress{position:absolute;height:2px;background:var(--blue);bottom:-1px;left:0;width:0}
.ds-button,.ds-site .button{display:inline-flex;justify-content:center;align-items:center;gap:18px;background:var(--blue);color:white!important;border:1px solid transparent;border-radius:10px;padding:16px 23px;min-height:54px;font-size:15px;font-weight:650;line-height:1.4;text-decoration:none}.ds-button:hover,.ds-site .button:hover{background:var(--blue-hover);transform:translateY(-2px);box-shadow:0 8px 20px #2457ed20}.ds-button .ds-icon{width:19px;height:19px;flex-basis:19px}.ds-text-link{font-size:14px;font-weight:650;display:inline-flex;align-items:center;gap:14px;line-height:1.4;min-height:44px}.ds-text-link .ds-icon{width:18px;height:18px;flex-basis:18px}.ds-button,.ds-text-link,.ds-editorial-card,.ds-routes>a{transition:background .2s,transform .2s,box-shadow .2s,color .2s}
.ds-home-hero{display:grid;grid-template-columns:1.08fr 1fr;gap:44px;align-items:center;padding:64px 0 52px}.ds-home-copy h1{font-size:clamp(43px,4.9vw,69px);letter-spacing:-.065em;line-height:1.06;font-weight:750;margin:0 0 25px;max-width:630px;text-wrap:initial}.ds-home-copy h1 span{color:var(--blue);display:block}.ds-home-copy>p{font-size:18px;line-height:1.7;max-width:470px;color:var(--muted);margin:0 0 30px}.ds-hero-actions{display:flex;align-items:center;gap:24px;flex-wrap:wrap}.ds-hero-footnote{display:flex;align-items:center;gap:9px;color:var(--muted);font-size:12px;margin-top:30px}.ds-hero-footnote .ds-icon{width:16px;height:16px;flex-basis:16px}
.ds-machine-stage{position:relative;height:500px;isolation:isolate;background:#e8edff;border-radius:120px 24px 24px 24px;display:grid;place-items:center;overflow:visible}.ds-stage-halo{position:absolute;width:340px;height:340px;border:1px solid #c3cff9;border-radius:50%;top:50px;left:calc(50% - 170px)}.ds-stage-circle{position:absolute;width:260px;height:260px;top:90px;left:calc(50% - 130px);border-radius:50%;background:#d2ddff}.ds-stage-grid{position:absolute;inset:30px;background-image:radial-gradient(#b9c9f2 1px,transparent 1px);background-size:18px 18px;opacity:.7;mask-image:linear-gradient(90deg,black,transparent 40%,transparent 60%,black)}.ds-hero-machine{position:relative;width:350px;height:350px!important;object-fit:contain;mix-blend-mode:multiply;filter:drop-shadow(0 22px 9px #2238751e);transform:rotate(-4deg);margin-top:-12px}.ds-floating{display:flex;align-items:center;gap:12px;position:absolute;z-index:2;background:white;padding:15px 17px;border:1px solid #f0f2f4;box-shadow:0 12px 28px #283a6410;border-radius:14px;font-size:11px;line-height:1.7;transition:transform .2s;max-width:calc(100% - 32px)}.ds-floating>.ds-icon:first-child{background:#edf1ff;width:38px;height:38px;padding:9px;border-radius:11px;flex-basis:38px;color:var(--blue)}.ds-floating>.ds-icon:last-child{width:17px;flex-basis:17px;height:17px;color:var(--blue);margin-left:4px}.ds-floating strong{display:block;font-size:13px;color:var(--dark);font-weight:650}.ds-floating span{color:var(--muted)}.ds-floating-top{top:55px;right:-15px}.ds-floating-bottom{bottom:66px;left:-20px}.ds-floating-bottom>.ds-icon:first-child{background:#edf1db;color:#4b643e}.ds-floating:hover{transform:translateY(-4px)}.ds-stage-caption{position:absolute;bottom:22px;right:24px;font-size:11px;color:#5b6b95;letter-spacing:.02em}
.ds-routes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border:1px solid var(--line);border-radius:15px;background:#fff;overflow:hidden;margin:0 0 74px}.ds-routes>a{display:flex;align-items:center;gap:16px;padding:27px 24px;border-right:1px solid var(--line)}.ds-routes>a:last-child{border:0}.ds-routes>a:hover{background:#f2f5ff}.ds-routes>a>.ds-icon:first-child{width:35px;height:35px;flex-basis:35px;color:var(--blue)}.ds-routes strong{display:block;font-size:15px;line-height:1.4}.ds-routes small{font-size:12px;color:var(--muted);display:block;margin-top:5px}.ds-routes>a>.ds-icon:last-child{width:18px;height:18px;flex-basis:18px;margin-left:auto}
.ds-section{margin:0 0 82px}.ds-section-heading{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:28px}.ds-section-heading h2{font-size:34px;margin:0 0 11px}.ds-section-heading p{font-size:16px;color:var(--muted);line-height:1.7;max-width:800px}.ds-section-heading>.ds-text-link{white-space:nowrap}.ds-editorial-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.ds-editorial-card{display:block;background:white;border:1px solid var(--line);border-radius:18px;overflow:hidden}.ds-editorial-card:hover{transform:translateY(-5px);box-shadow:0 18px 35px #182b360d}.ds-editorial-art{height:196px;position:relative;display:grid;place-items:center;overflow:hidden}.ds-art-blue{background:#e7ecfc;color:#2457ed}.ds-art-green{background:#e8eddc;color:#547438}.ds-art-peach{background:#f4e6dc;color:#ae6c3b}.ds-editorial-art>.ds-icon{width:72px;height:72px;stroke-width:.9;position:relative;z-index:2}.ds-art-ring{width:140px;height:140px;position:absolute;left:calc(50% - 70px);top:calc(50% - 70px);border:1px solid currentColor;opacity:.15;border-radius:50%}.ds-art-ring:before{content:'';position:absolute;inset:-25px;border:1px solid;border-radius:50%}.ds-art-pill{position:absolute;left:20px;bottom:17px;font-size:11px;background:#ffffffbb;border-radius:30px;padding:3px 12px;font-weight:500;color:var(--dark)}.ds-editorial-copy{padding:25px}.ds-editorial-copy h3{font-size:22px;margin-bottom:12px;line-height:1.3}.ds-editorial-copy p{font-size:14px;color:var(--muted);line-height:1.8;margin:0 0 18px}.ds-card-action{display:flex;align-items:center;justify-content:space-between;font-size:13px;font-weight:600;color:var(--blue)}.ds-card-action .ds-icon{width:18px;height:18px}
.ds-help{background:#192e3b;color:white;border-radius:24px;padding:48px 50px;display:grid;grid-template-columns:1fr 1.08fr;gap:65px;align-items:center;margin-bottom:82px;position:relative;overflow:hidden}.ds-help h2{color:white;font-size:36px;line-height:1.2;margin:18px 0}.ds-help p{font-size:15px;line-height:1.8;color:#c5d2d9;max-width:380px;margin-bottom:26px}.ds-help-symbol{display:grid;place-items:center;width:42px;height:42px;color:#d9edaf;border:1px solid #647465;border-radius:12px}.ds-button-light{background:#e1edbd!important;color:#1a3022!important;box-shadow:none!important}.ds-button-light:hover{background:#d1e29a!important}.ds-help-links>a{display:flex;align-items:center;gap:18px;border-top:1px solid #ffffff24;padding:28px 0;line-height:1.5;color:white}.ds-help-links>a:last-child{border-bottom:1px solid #ffffff24}.ds-help-links>a:hover{color:#e0ecbe}.ds-help-links span{color:#8d9da5;font-size:12px;font-variant-numeric:tabular-nums}.ds-help-links strong{font-size:16px;font-weight:500}.ds-help-links .ds-icon{width:20px;height:20px;margin-left:auto;flex-basis:20px}
.ds-knowledge-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}.ds-knowledge-grid .ui-article{border:0;border-top:2px solid var(--dark);border-radius:0;padding:26px 0 0;background:none;box-shadow:none}.ds-knowledge-grid h2{font-size:23px;margin:0 0 13px}.ds-knowledge-grid p{font-size:14px;color:var(--muted);line-height:1.8;margin-bottom:18px}.ds-knowledge-grid .ui-verder a{display:flex;justify-content:space-between;gap:15px;line-height:1.5;font-size:14px;padding:14px 0;border-bottom:1px solid var(--line);font-weight:500}.ds-knowledge-grid .ui-verder a:after{content:'↗';font-size:18px;color:var(--blue)}.ds-method{display:flex;align-items:center;gap:42px;background:#eff1e9;border-radius:20px;padding:40px 48px;margin-bottom:80px}.ds-method h2{font-size:30px;margin:0 0 12px}.ds-method p{font-size:15px;color:var(--muted);line-height:1.8;margin-bottom:16px;max-width:850px}.ds-method-art{flex:0 0 100px;width:100px;height:100px;background:#e1e6d4;display:grid;place-items:center;border-radius:50%}.ds-method-art .ds-icon{width:45px;height:45px;color:#566e44;stroke-width:1.1}
.ds-footer{background:#eef1ec;margin-top:70px;padding:55px 0 0;border-top:1px solid var(--line)}.ds-footer-top{display:grid;grid-template-columns:1fr 2fr;gap:65px;padding-bottom:45px}.ds-footer-top>.ds-brand{align-self:start}.ds-footer-top>div>p{color:var(--muted);font-size:14px;line-height:1.8;margin:20px 0 18px}.ds-footer-top .ds-text-link{font-size:12px}.ds-footer-links{display:grid;grid-template-columns:1.1fr 1.1fr 1fr;gap:26px}.ds-footer-links h2{font-size:13px;letter-spacing:-.01em;margin:0 0 17px}.ds-footer-links a{font-size:12px;display:flex;line-height:1.7;margin-bottom:8px;color:var(--muted)}.ds-footer-links a .ds-icon{display:none}.ds-footer-bottom{padding:23px 0;border-top:1px solid #d6ddd4;display:flex;align-items:center;justify-content:space-between;gap:20px;font-size:11px;color:var(--muted)}.ds-footer-bottom p{margin:0}.ds-footer-bottom>a{font-weight:600}
/* The same reading, product and table components serve every article type. */
.ds-main{padding-bottom:30px}.ds-main>.ui-hero{padding:28px 0 40px;margin-bottom:0}.ds-breadcrumb{display:flex;flex-wrap:wrap;align-items:center;gap:10px;color:var(--muted);font-size:12px;margin:0 0 30px}.ds-breadcrumb a:hover{text-decoration:underline}.ds-breadcrumb>span{color:#a4adaf}.ui-hero h1{font-size:var(--h1-size);max-width:1040px;margin:0 0 22px}.ui-hero>.ui-article{max-width:920px;padding:0;border:0;background:transparent;box-shadow:none}.ui-hero p{font-size:18px;color:var(--muted);line-height:1.8;margin:0}.ds-article-meta{display:flex;align-items:center;gap:9px;color:var(--muted);font-size:11px;margin-top:24px;flex-wrap:wrap}.ds-article-meta>.ds-icon{width:15px;height:15px;flex-basis:15px}.ds-article-meta>a{display:flex;gap:6px;align-items:center}.ds-article-meta a .ds-icon{width:13px;height:13px;flex-basis:13px}.ds-meta-dot{height:3px;width:3px;background:#7b898c;border-radius:50%;margin:0 3px}
.ui-article{min-width:0}.ds-main>.ui-article:has(.ui-top3){padding:0;margin-bottom:34px}.ui-top3{background:white;border:1px solid var(--line);padding:30px;border-radius:20px}.ui-top3>h2{font-size:29px;margin-bottom:14px}.ui-top3>p:not(.bronnoot){font-size:15px;color:var(--muted);margin-bottom:26px;line-height:1.8}.ui-topselectie{list-style:none;padding:0;margin:0 0 24px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;align-items:stretch}.ui-topselectie>li{display:flex;flex-direction:column;align-items:stretch;gap:0;min-width:0;background:var(--paper);border:1px solid var(--line);border-radius:15px;padding:22px;position:relative}.ui-topselectie>li.kaart-uitgelicht{border-color:#9cb4f5;background:#f1f5ff}.ui-topselectie .label{align-self:start;font-size:10px;font-weight:650;color:#3e5062;border:1px solid #d9dfdc;background:white;line-height:1.5;padding:4px 10px;border-radius:6px;margin-bottom:16px}.ui-topselectie .kaart-uitgelicht>.label{background:var(--blue);color:white;border-color:var(--blue)}.ui-topselectie img{width:100%;height:190px!important;object-fit:contain;mix-blend-mode:multiply;display:block;margin-bottom:20px}.ui-topselectie h3{font-size:18px;line-height:1.4;margin:0 0 18px;min-height:76px;letter-spacing:-.025em;text-wrap:initial}.ui-topselectie>li>div:not(.toelichting){display:flex;flex-direction:column}.ui-topselectie dl:not(.opbouw){margin:0 0 20px;padding:0;font-size:12px}.ui-topselectie dl:not(.opbouw)>div{display:flex;justify-content:space-between;gap:14px;padding:7px 0;border-bottom:1px solid #dfe5e6}.ui-topselectie dt{font-weight:400;color:var(--muted)}.ui-topselectie dd{margin:0;font-weight:650;text-align:right}.ui-topselectie .button{width:100%;font-size:13px;padding:12px 16px;min-height:46px}.ui-topselectie .toelichting{border-top:1px solid #dce2e5;margin-top:24px;padding-top:20px;font-size:13px;line-height:1.8}.ui-topselectie .toelichting p{margin:0 0 14px}.ui-topselectie .toelichting-kop{font-weight:700;font-size:13px}.opbouw{font-size:10px;margin:20px 0 0;padding:0}.opbouw>div{position:relative;display:flex;justify-content:space-between;gap:8px;padding:7px 0 9px;margin-bottom:7px}.opbouw>div:after{content:'';position:absolute;bottom:0;left:0;right:0;height:2px;background:#dce3df}.opbouw>div:before{content:'';position:absolute;bottom:0;left:0;width:var(--w,0%);height:2px;background:var(--blue);z-index:1}.opbouw dt{font-size:10px;color:var(--muted)}.opbouw dd{font-size:10px}
.ui-note{padding:22px 28px;border-left:3px solid var(--blue);border-radius:0 12px 12px 0;background:#edf2ff;margin:28px 0}.ui-note p{font-size:15px;line-height:1.9;margin:0}.ui-summary{display:block;padding:30px;background:#eef1e6;border-radius:18px;border:1px solid #dfe5d7;margin:30px 0}.ui-summary h2{font-size:22px;margin:0 0 10px}.ui-summary p{font-size:15px;color:#4f6151;line-height:1.85;margin:0}.ds-main>.ui-kaarten{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:0;padding:10px 0 32px;border-bottom:1px solid var(--line);margin-bottom:44px}.ds-main>.ui-kaarten>article{padding:15px 24px;border-right:1px solid var(--line)}.ds-main>.ui-kaarten>article:first-child{padding-left:0}.ds-main>.ui-kaarten>article:last-child{border:0}.ui-kaarten h3{font-size:20px;margin:0 0 10px;line-height:1.3}.ui-kaarten p{font-size:13px;color:var(--muted);line-height:1.75;margin:0}
.ui-content-layout{display:grid;grid-template-columns:220px minmax(0,1fr);gap:48px;align-items:start;margin:40px 0}.ui-sidebar{position:sticky;top:120px;max-height:calc(100vh - 150px);overflow:auto;padding:0 20px 10px 0;scrollbar-width:thin;scrollbar-color:#d5dcd8 transparent}.toc-kop{font-size:12px!important;font-weight:700;margin:0 0 15px!important;color:var(--dark)!important}.toc-lijst{padding:0;margin:0;list-style:none;border-left:1px solid var(--line)}.toc-lijst li{padding:0;margin:0!important}.toc-lijst a{display:block;padding:8px 12px;margin-left:-1px;color:var(--muted);font-size:12px;line-height:1.65;border-left:2px solid transparent}.toc-lijst a:hover,.toc-lijst a.is-active{color:var(--blue);border-color:var(--blue);background:#edf2ff}.ui-content-layout>article#artikel{padding:0;background:none;border:0;border-radius:0;box-shadow:none;max-width:none;min-width:0}.ui-content-layout article#artikel>h2:first-of-type{margin-top:0}#artikel h2{font-size:29px;margin:48px 0 21px;scroll-margin-top:120px}#artikel h3{font-size:22px;margin:32px 0 15px;scroll-margin-top:120px}#artikel p{font-size:17px;line-height:1.9;margin:0 0 21px}#artikel a:not(.button){color:var(--blue);text-decoration:underline;text-decoration-color:#aec0f8;text-underline-offset:3px}#artikel a:hover{text-decoration-color:var(--blue)}#artikel ul,#artikel ol{padding-left:24px;margin:18px 0 26px}#artikel li{padding-left:5px;margin:9px 0;font-size:16px;line-height:1.85}.mobiele-inhoud{display:none}.bronnoot,#artikel .bronnoot{font-size:11px;color:var(--muted);line-height:1.85;margin:14px 0}.bronnoot a{color:var(--blue)}.ui-methode{margin:40px 0;padding:28px;background:#f0f2ed;border:1px solid var(--line);border-radius:14px}.ui-methode h2{margin-top:0!important}.ui-methode p:last-child{margin-bottom:0!important}
.ui-vergelijking{margin:32px 0;padding:0;background:transparent;border:none;min-width:0}.ui-vergelijking>figcaption{font-size:14px;font-weight:700;margin-bottom:12px;line-height:1.5}.ui-vergelijking>p:not(.bronnoot){font-size:13px!important;color:var(--muted)}.tabel-scroll{max-width:100%;overflow-x:auto;border:1px solid #dce3df;border-radius:12px;background:#fff;overscroll-behavior-x:contain;margin:16px 0;scrollbar-width:thin}table{width:100%;border-collapse:collapse;font-size:13px;line-height:1.65;text-align:left;margin:0;min-width:520px}thead{background:#edf1eb}th,td{padding:16px 18px;border:0;border-bottom:1px solid #e2e7e2;vertical-align:top}th{font-weight:650}tbody th{font-weight:600}tbody tr:last-child>*{border-bottom:0}tbody tr:nth-child(even){background:#fafbf8}caption:not(.visueel-verborgen){text-align:left;padding:15px;font-weight:650}figure{margin-inline:0}blockquote{border-left:3px solid var(--blue);padding:18px 24px;background:#edf2ff;margin:28px 0;border-radius:0 12px 12px 0}details:not(.ds-menu):not(.mobiele-inhoud) summary{cursor:pointer;padding:15px 0;font-weight:650}details:not(.ds-menu):not(.mobiele-inhoud){border-bottom:1px solid var(--line)}
.publication-related{padding:30px;background:#f0f3ec;border-radius:18px;border:1px solid var(--line);margin:45px 0}.publication-related h2{font-size:24px;margin:0 0 16px}.ui-linklijst{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;padding:0;margin:0}.ui-linklijst li{margin:0}.ui-linklijst a{display:block;padding:18px;background:white;border:1px solid var(--line);border-radius:10px;font-size:14px;font-weight:600;line-height:1.65;height:100%}.ui-linklijst a:hover{border-color:#a9bef7}
/* Directory and search use the same shared shell. */
.ds-directory #artikel>section{background:#fff;border:1px solid var(--line);border-radius:16px;padding:28px;margin-bottom:28px}.ds-directory #artikel>section h2{margin-top:0}.ds-directory #artikel ul{list-style:none;padding:0;margin:10px 0 25px}.ds-directory #artikel li{border-bottom:1px solid var(--line);padding:0;margin:0;font-size:15px}.ds-directory #artikel li a{display:flex;align-items:center;justify-content:space-between;padding:12px 0;text-decoration:none;color:var(--dark)}.ds-directory #artikel li a:after{content:'↗';color:var(--blue)}.ds-directory #artikel li a:hover{color:var(--blue)}.ds-directory #artikel h3{font-size:18px;margin-top:28px}.ds-directory #artikel section p{font-size:14px;color:var(--muted)}.ds-directory #artikel>nav{display:none}.ds-search-page{min-height:650px}.ds-search-page>.ui-hero{padding-bottom:18px}.ds-search-page .ui-hero p{max-width:760px}.publication-search{max-width:850px;display:flex;align-items:end;gap:12px;margin:24px 0 18px}.publication-search>div{flex:1;min-width:0}.publication-search label{font-size:13px;font-weight:650;display:block;margin-bottom:10px}.publication-search input{width:100%;border:1px solid #cbd5d1;border-radius:10px;background:white;padding:15px 17px;font-size:16px;height:56px;color:var(--dark)}.publication-search button{border:0;background:var(--blue);color:white;padding:15px 28px;border-radius:10px;min-height:56px;font-size:15px;font-weight:600}.publication-search button:hover{background:var(--blue-hover)}.ds-search-page>p{font-size:13px;color:var(--muted)}.ds-search-page>p a{text-decoration:underline;text-underline-offset:3px}.ds-search-page>h2{margin-top:46px;font-size:26px}.publication-search-status{margin:18px 0}.publication-results{list-style:none;max-width:850px;padding:0;margin:26px 0}.publication-results>li{padding:24px;background:white;border:1px solid var(--line);border-radius:12px;margin-bottom:15px}.publication-results a{font-size:20px;font-weight:650;line-height:1.5}.publication-results p{font-size:14px;color:var(--muted);margin:10px 0 0;line-height:1.85}.ds-404 .ds-main{min-height:450px}.ds-404 main a:not(.ds-breadcrumb a){text-decoration:underline;color:var(--blue)}
@media(min-width:1500px){.ds-home-hero{gap:60px}.ds-home-copy h1{font-size:72px}.ds-machine-stage{height:510px}}
@media(max-width:1150px){.ds-nav{gap:18px;font-size:12px}.ds-brand{font-size:22px}.ds-brand-mark{width:35px;height:38px}.ds-home-hero{gap:28px;padding-top:45px}.ds-home-copy h1{font-size:55px}.ds-machine-stage{height:440px}.ds-floating-top{right:-10px;top:35px}.ds-floating-bottom{left:-10px;bottom:42px}.ds-hero-machine{width:310px;height:310px!important}.ds-routes>a{padding:24px 18px;gap:12px}.ds-routes strong{font-size:13px}.ds-routes small{font-size:11px}.ds-help{gap:35px;padding:38px}.ds-footer-top{gap:36px;grid-template-columns:.9fr 2fr}.ui-topselectie>li{padding:18px}.ui-topselectie h3{font-size:16px}.ui-topselectie .toelichting{font-size:12px}}
@media(max-width:950px){.ds-site .wrap{width:calc(100% - 48px)}.ds-header-inner{height:78px}.ds-menu-toggle{display:flex;align-items:center;gap:10px;min-height:44px;background:transparent;border:1px solid var(--line);border-radius:9px;font-size:13px;padding:8px 12px}.ds-menu-toggle .ds-icon{height:17px;width:17px;flex-basis:17px;transition:transform .2s}.ds-menu-toggle[aria-expanded=true] .ds-icon{transform:rotate(45deg)}.ds-nav{display:none;position:absolute;top:77px;left:0;right:0;background:var(--paper);padding:12px 24px 22px;border-bottom:1px solid var(--line);max-height:calc(100dvh - 78px);overflow:auto;box-shadow:0 20px 30px #192e3b0b;gap:0;font-size:15px}.ds-nav.is-open{display:block}.ds-menu{border-bottom:1px solid var(--line)}.ds-menu summary{justify-content:space-between;padding:12px 0;min-height:52px}.ds-menu-panel{position:static;box-shadow:none;border:0;width:auto;padding:4px 0 12px;background:transparent}.ds-menu-panel p{display:none}.ds-menu-panel a{font-size:13px;min-height:44px}.ds-search-link{padding:16px 0 0;border:0}.ds-home-copy h1{font-size:46px}.ds-home-copy>p{font-size:16px}.ds-home-hero{gap:25px;padding:42px 0}.ds-machine-stage{height:400px;border-top-left-radius:90px}.ds-stage-circle{width:220px;height:220px;left:calc(50% - 110px);top:70px}.ds-stage-halo{width:280px;height:280px;left:calc(50% - 140px);top:40px}.ds-hero-machine{width:280px;height:280px!important}.ds-floating{padding:11px;gap:8px}.ds-floating strong{font-size:11px}.ds-floating span{font-size:10px}.ds-floating-top{top:25px}.ds-floating-bottom{bottom:38px}.ds-hero-actions{gap:14px}.ds-hero-actions .ds-button{font-size:13px;padding:14px 16px}.ds-hero-actions .ds-text-link{font-size:13px}.ds-hero-footnote{font-size:10px;margin-top:20px}.ds-routes>a>.ds-icon:first-child{width:27px;height:27px;flex-basis:27px}.ds-routes{margin-bottom:55px}.ds-routes>a{padding:22px 16px}.ds-routes small{display:none}.ds-section-heading h2{font-size:29px}.ds-editorial-copy{padding:20px}.ds-editorial-copy h3{font-size:20px}.ds-editorial-art{height:170px}.ds-editorial-grid{gap:18px}.ds-help{gap:30px}.ds-help h2{font-size:30px}.ds-help-links strong{font-size:14px}.ds-knowledge-grid{gap:24px}.ds-knowledge-grid h2{font-size:20px}.ds-footer-top{grid-template-columns:1fr;gap:35px}.ds-footer-links{max-width:850px}.ui-content-layout{grid-template-columns:180px minmax(0,1fr);gap:28px}.ui-sidebar{top:100px}.ui-top3{padding:24px}.ui-topselectie{gap:12px}.ui-topselectie>li{padding:15px}.ui-topselectie img{height:150px!important}.ui-topselectie h3{font-size:15px;min-height:84px}.ui-topselectie dl:not(.opbouw){font-size:11px}.ui-topselectie .button{font-size:12px}.ui-topselectie .toelichting{font-size:12px}.ui-topselectie .toelichting-kop{font-size:12px}}
@media(max-width:700px){.ds-site .wrap{width:calc(100% - 40px)}.ds-header-inner{height:72px}.ds-brand{font-size:21px;letter-spacing:-1px;gap:8px}.ds-brand-mark{width:32px;height:35px;border-radius:10px}.ds-brand-mark .ds-icon{width:22px;height:25px}.ds-nav{top:71px;padding-inline:20px}.ds-home-hero{grid-template-columns:1fr;gap:35px;padding:36px 0 28px}.ds-home-copy h1{font-size:clamp(37px,8.5vw,55px);max-width:560px;margin-bottom:20px;letter-spacing:-.06em}.ds-home-copy>p{font-size:16px;line-height:1.75;margin-bottom:24px;max-width:520px}.ds-hero-actions{gap:18px}.ds-button,.ds-site .button{min-height:44px;padding:12px 17px;font-size:13px;border-radius:9px}.ds-hero-actions .ds-text-link{font-size:12px;gap:7px}.ds-hero-footnote{font-size:11px;margin-top:22px}.ds-machine-stage{height:350px;max-width:520px;width:100%;margin:auto;border-top-left-radius:90px}.ds-hero-machine{width:265px;height:265px!important}.ds-stage-circle{top:50px;width:230px;height:230px;left:calc(50% - 115px)}.ds-stage-halo{top:25px;width:280px;height:280px;left:calc(50% - 140px)}.ds-floating-top{right:8px;top:23px}.ds-floating-bottom{left:8px;bottom:34px}.ds-floating strong{font-size:12px}.ds-floating span{font-size:10px}.ds-floating{padding:10px 12px;gap:8px}.ds-stage-caption{font-size:10px;bottom:12px;right:17px}.ds-floating>.ds-icon:first-child{width:30px;height:30px;flex-basis:30px;padding:7px}.ds-floating>.ds-icon:last-child{display:none}.ds-routes{grid-template-columns:1fr;margin-bottom:48px;border-radius:13px}.ds-routes>a{border:0;border-bottom:1px solid var(--line);padding:18px 20px;gap:16px}.ds-routes strong{font-size:14px}.ds-routes small{display:block;font-size:11px}.ds-routes>a>.ds-icon:first-child{width:29px;height:29px;flex-basis:29px}.ds-section{margin-bottom:48px}.ds-section-heading{display:block;margin-bottom:22px}.ds-section-heading h2{font-size:28px;line-height:1.25}.ds-section-heading p{font-size:14px}.ds-section-heading>.ds-text-link{margin-top:14px;font-size:12px;min-height:35px}.ds-editorial-grid{grid-template-columns:1fr}.ds-editorial-card{display:grid;grid-template-columns:110px minmax(0,1fr);border-radius:13px}.ds-editorial-art{height:100%;min-height:190px}.ds-editorial-art>.ds-icon{width:48px;height:48px}.ds-art-ring{width:85px;height:85px;left:calc(50% - 42.5px);top:calc(50% - 42.5px)}.ds-art-ring:before{inset:-17px}.ds-art-pill{display:none}.ds-editorial-copy{padding:20px}.ds-editorial-copy h3{font-size:19px;margin-bottom:9px}.ds-editorial-copy p{font-size:12px;line-height:1.8;margin-bottom:13px}.ds-card-action{font-size:11px}.ds-help{grid-template-columns:1fr;gap:28px;padding:28px;border-radius:18px;margin-bottom:48px}.ds-help h2{font-size:30px}.ds-help p{font-size:14px}.ds-help-links>a{padding:21px 0;gap:12px}.ds-help-links strong{font-size:13px}.ds-help-links .ds-icon{width:17px;height:17px;flex-basis:17px}.ds-knowledge-grid{grid-template-columns:1fr;gap:30px}.ds-knowledge-grid h2{font-size:23px}.ds-knowledge-grid p{font-size:14px}.ds-knowledge-grid .ui-article{padding-top:20px}.ds-knowledge-grid .ui-verder a{font-size:14px;padding:12px 0}.ds-method{display:block;padding:28px;margin-bottom:45px}.ds-method-art{width:56px;height:56px;margin-bottom:20px}.ds-method-art .ds-icon{width:28px;height:28px}.ds-method h2{font-size:26px}.ds-method p{font-size:14px}.ds-footer{margin-top:40px;padding-top:35px}.ds-footer-links{grid-template-columns:1fr 1fr;gap:25px 18px}.ds-footer-links h2{font-size:12px}.ds-footer-links a{font-size:11px}.ds-footer-bottom{flex-wrap:wrap;gap:10px;font-size:10px}.ds-footer-bottom p{order:3;width:100%}.ds-footer-top{padding-bottom:28px}.ds-main>.ui-hero{padding:21px 0 25px}.ds-breadcrumb{font-size:10px;gap:8px;margin-bottom:23px}.ui-hero h1{font-size:34px;line-height:1.13;letter-spacing:-.05em;margin-bottom:22px}.ui-hero p{font-size:16px;line-height:1.85}.ds-article-meta{font-size:10px;gap:7px;line-height:1.5;margin-top:22px}.ds-article-meta a{min-height:30px}.ui-top3{padding:20px;border-radius:14px}.ui-top3>h2{font-size:25px}.ui-top3>p:not(.bronnoot){font-size:14px}.ui-topselectie{grid-template-columns:1fr;gap:20px}.ui-topselectie>li{padding:22px}.ui-topselectie img{height:180px!important;margin-bottom:20px}.ui-topselectie h3{font-size:20px;min-height:0;margin-bottom:16px}.ui-topselectie dl:not(.opbouw){font-size:13px}.ui-topselectie .button{font-size:14px;min-height:44px}.ui-topselectie .toelichting{font-size:14px}.ui-topselectie .toelichting-kop{font-size:14px}.opbouw dt,.opbouw dd{font-size:11px}.ui-note{padding:18px 20px;margin:24px 0}.ui-note p{font-size:14px;line-height:1.85}.ui-summary{padding:23px;margin:25px 0;border-radius:14px}.ui-summary h2{font-size:22px}.ui-summary p{font-size:14px}.ds-main>.ui-kaarten{grid-template-columns:1fr 1fr;padding:0 0 20px;margin-bottom:28px;gap:20px 0}.ds-main>.ui-kaarten>article{padding:0 18px!important;border:0;border-left:1px solid var(--line)}.ds-main>.ui-kaarten>article:nth-child(odd){padding-left:0!important;border-left:0}.ui-kaarten h3{font-size:18px;line-height:1.35}.ui-kaarten p{font-size:12px}.ui-content-layout{display:block;margin:25px 0}.ui-sidebar{display:none}.mobiele-inhoud{display:block!important;border:1px solid var(--line)!important;background:white;border-radius:10px;padding:16px 18px;margin-bottom:28px}.mobiele-inhoud summary{font-size:14px;font-weight:650;cursor:pointer}.mobiele-inhoud ol{margin-bottom:0!important}.mobiele-inhoud a{font-size:12px}#artikel h2{font-size:25px;margin:36px 0 18px;line-height:1.3}#artikel h3{font-size:20px;margin-top:26px}#artikel p{font-size:16px;line-height:1.9;margin-bottom:20px}#artikel li{font-size:15px;line-height:1.85}.ui-methode{padding:22px}.ui-vergelijking{margin:26px 0}.ui-vergelijking>figcaption{font-size:13px}th,td{padding:13px 15px}.bronnoot,#artikel .bronnoot{font-size:10px;line-height:1.8}.publication-related{padding:23px}.publication-related h2{font-size:23px}.ui-linklijst{grid-template-columns:1fr;gap:10px}.ui-linklijst a{font-size:13px;padding:14px 16px}.ds-directory #artikel>section{padding:22px}.ds-directory #artikel li{font-size:14px}.publication-search{flex-wrap:wrap;gap:12px}.publication-search>div{flex-basis:100%}.publication-search input{height:50px;font-size:16px}.publication-search button{min-height:44px;padding:12px 25px;font-size:14px}.publication-results>li{padding:20px}.publication-results a{font-size:18px}.publication-results p{font-size:13px}.ds-search-page>.ui-hero{padding-bottom:0}}
@media(max-width:360px){.ds-site .wrap{width:calc(100% - 32px)}.ds-home-copy h1{font-size:36px}.ds-hero-actions{gap:8px}.ds-hero-actions .ds-button{padding:12px;font-size:12px;gap:10px}.ds-hero-actions .ds-text-link{font-size:11px;gap:4px}.ds-brand{font-size:19px}.ds-home-copy>p{font-size:15px}.ds-machine-stage{height:320px}.ds-hero-machine{width:245px;height:245px!important}.ds-stage-circle{width:210px;height:210px;left:calc(50% - 105px)}.ds-stage-halo{width:250px;height:250px;left:calc(50% - 125px)}.ds-floating strong{font-size:10px}.ds-floating span{font-size:9px}.ds-floating{padding:8px 10px}.ds-editorial-card{grid-template-columns:86px minmax(0,1fr)}.ds-editorial-copy{padding:17px}.ds-editorial-copy h3{font-size:18px}.ds-editorial-art{min-height:210px}.ui-hero h1{font-size:30px}.ui-top3{padding:16px}.ui-topselectie>li{padding:18px}.ui-topselectie h3{font-size:18px}.ds-help{padding:23px}.ds-help h2{font-size:28px}.ds-menu-toggle{font-size:12px;padding:8px 10px}.ds-routes strong{font-size:13px}.ds-routes small{font-size:10px}}
.ui-alsdan{margin:26px 0;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:white}.ui-alsdan>div{display:grid;grid-template-columns:1fr 1.5fr;border-bottom:1px solid var(--line)}.ui-alsdan>div:last-child{border:0}.ui-alsdan dt{background:#edf2ff;padding:22px;font-size:15px;font-weight:650;line-height:1.7}.ui-alsdan dd{margin:0;padding:22px;font-size:15px;line-height:1.85}.ds-site .button-rustig{background:white;color:var(--dark)!important;border:1px solid var(--line)}
@media(max-width:700px){.ui-alsdan>div{display:block}.ui-alsdan dt,.ui-alsdan dd{padding:18px;font-size:14px}}
@media(min-width:361px) and (max-width:700px){.ds-hero-actions{gap:16px}.ds-hero-actions .ds-button{font-size:12px;gap:12px;padding:12px 14px}.ds-hero-actions .ds-text-link{font-size:11px;gap:6px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}*,*:before,*:after{transition:none!important;animation:none!important;scroll-behavior:auto!important}}
@media print{.ds-header,.ds-footer,.ui-sidebar,.ds-article-meta,.publication-related,.ds-skip,.mobiele-inhoud{display:none!important}.ds-site .wrap{width:100%;max-width:none}.ui-content-layout{display:block}body.ds-site{background:white;color:black}.tabel-scroll{overflow:visible}.ui-topselectie{display:block}.ui-topselectie>li{break-inside:avoid;margin-bottom:20px}a{color:black!important}}

/* Central choice helper, shared invitation and profile components. */
.kh-nav-cta{position:relative}.kh-launch,.kh-nav-cta{isolation:isolate;overflow:hidden}
@media(prefers-reduced-motion:no-preference){
 .kh-launch,.kh-nav-cta{animation:kh-button-glow 5.5s ease-out infinite}
 .kh-launch:before,.kh-nav-cta:before{content:'';position:absolute;inset:-50% auto -50% -80%;width:45%;background:linear-gradient(90deg,transparent,#ffffff3d,transparent);transform:skewX(-22deg);pointer-events:none;z-index:-1;animation:kh-button-shine 5.5s ease-in-out infinite}
 .kh-launch>.ds-icon:first-child,.kh-nav-cta>.ds-icon{animation:kh-button-spark 5.5s ease-in-out infinite;transform-origin:center}
 .kh-launch:hover,.kh-launch:focus-visible,.kh-nav-cta:hover,.kh-nav-cta:focus-visible{animation-play-state:paused}
}
@keyframes kh-button-glow{0%,65%,100%{box-shadow:0 8px 28px #2457ed25,0 0 0 0 #2457ed00}15%{box-shadow:0 8px 28px #2457ed35,0 0 0 7px #2457ed1c}32%{box-shadow:0 8px 28px #2457ed25,0 0 0 12px #2457ed00}}
@keyframes kh-button-shine{0%,45%{left:-80%}70%,100%{left:150%}}
@keyframes kh-button-spark{0%,70%,100%{transform:rotate(0deg) scale(1)}80%{transform:rotate(-15deg) scale(1.15)}90%{transform:rotate(12deg) scale(1.1)}}
#kh-question,#kh-result-title{scroll-margin-top:115px}
.ds-nav{gap:20px}.kh-nav-cta{display:flex;align-items:center;gap:7px;background:var(--blue);color:white!important;padding:11px 15px;border-radius:9px;font-size:12px;white-space:nowrap}.kh-nav-cta:hover{background:var(--blue-hover)}.kh-nav-cta .ds-icon{width:17px;height:17px;flex-basis:17px}.ds-search-link{border:0;padding-left:0}.ds-search-link>span{display:none}.ds-footer{padding-bottom:80px}
.kh-home-band{display:flex;justify-content:space-between;align-items:center;gap:24px;background:#eaf0ff;border:1px solid #d3dffc;padding:27px 30px;border-radius:17px;margin:0 0 24px}.kh-home-band>div{display:flex;align-items:center;gap:19px}.kh-home-band>div>span{display:grid;place-items:center;background:var(--blue);color:white;border-radius:13px;width:48px;height:48px;flex:0 0 48px}.kh-home-band h2{font-size:22px;letter-spacing:-.035em;margin-bottom:6px}.kh-home-band p{font-size:13px;line-height:1.7;color:var(--muted)}.kh-home-band .ds-button{white-space:nowrap;font-size:13px;min-height:48px;padding:13px 18px}.kh-home-band+.ds-routes{margin-top:0}
.kh-launch{position:fixed;z-index:62;bottom:22px;right:24px;display:flex;align-items:center;gap:12px;padding:14px 18px;color:white!important;background:var(--blue);border:1px solid #6389ed;border-radius:40px;box-shadow:0 8px 30px #1d43ab30;font-size:13px;font-weight:650;line-height:1.4;min-height:50px}.kh-launch>.ds-icon:first-child{width:21px;height:21px;flex-basis:21px}.kh-launch>.ds-icon:last-child{width:17px;height:17px;flex-basis:17px}.kh-launch:hover{background:var(--blue-hover);transform:translateY(-2px)}
.kh-invite{position:fixed;bottom:90px;right:24px;z-index:64;width:340px;max-width:calc(100vw - 32px);padding:27px;background:white;border:1px solid #dce3ec;box-shadow:0 16px 55px #172b3626;border-radius:20px;animation:kh-arrive .3s ease-out}.kh-invite-close{position:absolute;top:8px;right:8px;width:44px;height:44px;border:0;background:transparent;font-size:24px;line-height:1;color:var(--muted);border-radius:50%}.kh-invite-close:hover{background:var(--pale);color:var(--dark)}.kh-invite-icon{display:grid;place-items:center;background:#edf2ff;border-radius:12px;width:42px;height:42px;color:var(--blue);margin-bottom:19px}.kh-invite h2{font-size:24px;line-height:1.25;max-width:260px;margin:0 0 13px}.kh-invite p{font-size:13px;line-height:1.85;color:var(--muted);margin:0 0 20px}.kh-invite-link{display:flex;align-items:center;justify-content:center;min-height:45px;padding:10px 15px;background:var(--blue);border-radius:9px;color:white!important;font-size:13px;font-weight:600}.kh-invite-link:hover{background:var(--blue-hover)}.kh-invite small{display:block;text-align:center;font-size:10px;color:var(--muted);margin-top:12px}.kh-invite[hidden]{display:none!important}@keyframes kh-arrive{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.kh-page{padding-bottom:0}.kh-hero{padding:27px 0 36px}.kh-hero .ds-breadcrumb{margin-bottom:27px}.kh-hero h1{font-size:clamp(34px,3.7vw,52px);line-height:1.12;margin:0 0 20px;max-width:900px;letter-spacing:-.055em}.kh-hero h1 span{color:var(--blue)}.kh-hero>div>p{font-size:16px;line-height:1.85;color:var(--muted);max-width:690px;margin:0 0 24px}.kh-hero-note{display:flex;gap:22px;flex-wrap:wrap;font-size:11px;color:var(--muted)}.kh-hero-note>span{display:inline-flex;align-items:center;gap:7px}.kh-hero-note>span:before{content:'✓';color:#58713c;font-weight:700}
.kh-layout{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:27px;align-items:start;margin-bottom:65px}.kh-panel{background:white;border:1px solid var(--line);border-radius:20px;padding:32px 36px;min-width:0}.kh-progress-head{display:flex;justify-content:space-between;font-size:11px;color:var(--muted);margin-bottom:10px}.kh-progress-head>span:first-child{color:var(--blue);font-weight:650}.kh-progress{height:4px;border-radius:5px;background:#eaf0f9;overflow:hidden;margin-bottom:30px}.kh-progress>span{display:block;height:100%;width:0;background:var(--blue);transition:width .25s}.kh-question-icon{display:grid;place-items:center;background:#edf2ff;color:var(--blue);width:44px;height:44px;border-radius:12px;margin-bottom:18px}.kh-question-icon .ds-icon{width:25px;height:25px}#kh-question{font-size:29px;line-height:1.25;margin:0 0 14px;outline-offset:8px}.kh-question-intro{font-size:14px;line-height:1.8;color:var(--muted);max-width:650px;margin-bottom:26px}.kh-options{border:0;padding:0;margin:0;display:grid;grid-template-columns:1fr 1fr;gap:13px}.kh-option{position:relative;display:flex;align-items:center;gap:14px;min-height:110px;border:1px solid #dce3e0;border-radius:12px;padding:18px 16px;cursor:pointer;transition:background .15s,border-color .15s;line-height:1.5}.kh-option:hover{background:#f5f8ff;border-color:#b0c3f5}.kh-option:has(input:checked){background:#edf3ff;border:2px solid var(--blue);padding:17px 15px}.kh-option:has(input:focus-visible){outline:3px solid #84a4ff;outline-offset:3px}.kh-option input{position:absolute;left:20px;top:20px;width:1px;height:1px;opacity:0}.kh-option-icon{color:var(--blue);flex:0 0 28px;display:flex;align-items:center}.kh-option-icon .ds-icon{width:27px;height:27px;flex-basis:27px}.kh-option strong{display:block;font-size:14px;font-weight:650}.kh-option small{display:block;font-size:11px;color:var(--muted);line-height:1.7;margin-top:6px}.kh-radio{width:18px;height:18px;flex:0 0 18px;border:1px solid #cbd6dd;border-radius:50%;margin-left:auto;background:white}.kh-option:has(input:checked) .kh-radio{border:5px solid var(--blue)}.kh-guide-link{display:inline-flex;align-items:center;min-height:44px;color:var(--blue)!important;font-size:11px;margin-top:15px;text-decoration:underline;text-underline-offset:3px}.kh-controls{display:flex;justify-content:space-between;align-items:center;gap:20px;border-top:1px solid var(--line);padding-top:23px;margin-top:18px}.kh-controls .ds-button{margin-left:auto;font-size:13px;min-height:47px;padding:13px 20px;border:0}.kh-controls .ds-button:disabled{background:#e5eaf1;color:#82909d!important;cursor:not-allowed;box-shadow:none;transform:none}.kh-back,.kh-reset{background:transparent;border:0;color:var(--muted);font-size:12px;padding:10px 0;min-height:44px}.kh-back:hover,.kh-reset:hover{color:var(--blue)}.kh-announcement{font-size:11px;color:var(--muted);line-height:1.6;min-height:18px;margin-top:10px}
.kh-profile{position:sticky;top:118px;background:#eff2e9;border:1px solid #dce2d3;border-radius:18px;padding:26px}.kh-profile-heading{display:flex;align-items:center;gap:10px;margin-bottom:14px}.kh-profile-heading h2{font-size:18px;letter-spacing:-.035em}.kh-profile-icon{color:#57723f;display:flex;align-items:center}.kh-profile>p{font-size:12px;color:var(--muted);line-height:1.85}.kh-profile ol{list-style:none;padding:0;margin:20px 0 24px}.kh-profile li{display:flex;align-items:center;gap:11px;border-bottom:1px solid #d8dfd1;padding:10px 0}.kh-profile li>span{font-size:10px;color:#7b886e;font-variant-numeric:tabular-nums;align-self:start;margin-top:10px}.kh-profile li>button{border:0;background:transparent;text-align:left;padding:4px 0;min-height:44px;width:100%;cursor:pointer;line-height:1.5}.kh-profile button small{display:block;font-size:10px;color:var(--muted);margin-bottom:3px}.kh-profile button strong{display:block;font-size:12px;font-weight:600}.kh-profile li.is-current button strong{color:var(--blue)}.kh-live-count{border:1px solid #d5dfc8;border-radius:12px;background:#fafcf6;display:flex;gap:14px;align-items:center;padding:18px;margin-bottom:18px}.kh-live-count strong{font-size:32px;font-weight:650;letter-spacing:-.045em;color:#4e693c;line-height:1}.kh-live-count>span{font-size:11px;line-height:1.7;color:#576550}.kh-private{font-size:10px!important;line-height:1.9!important}
.kh-results{margin-bottom:60px;scroll-margin-top:116px}.kh-results-heading{display:flex;justify-content:space-between;gap:30px;align-items:end;margin:15px 0 25px}.kh-results h2{font-size:34px;line-height:1.2;margin:0 0 15px}.kh-results-heading p{font-size:14px;color:var(--muted);line-height:1.8;max-width:700px}.kh-result-actions{display:flex;gap:9px;flex-wrap:wrap;justify-content:flex-end;max-width:400px}.kh-secondary{background:white;border:1px solid #cfd9de;color:var(--dark);border-radius:8px;min-height:42px;font-size:11px;padding:10px 13px}.kh-secondary:hover{border-color:var(--blue);color:var(--blue)}.kh-reset{font-size:10px;padding:5px}.kh-chips{display:flex;flex-wrap:wrap;gap:9px;margin-bottom:22px}.kh-chips>button{display:flex;gap:9px;align-items:center;font-size:11px;min-height:36px;border:1px solid #d6e1f8;background:#edf2ff;color:#264b9f;padding:7px 13px;border-radius:30px}.kh-chips>button:hover{border-color:var(--blue)}.kh-destination{font-size:11px;line-height:1.8;color:var(--muted);margin-bottom:25px}.kh-result-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin-bottom:45px}.kh-product{background:white;border:1px solid var(--line);border-radius:18px;padding:23px;display:flex;flex-direction:column;min-width:0}.kh-product:first-child{border-color:#99b2ef}.kh-product-top{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:9px;color:#48633b}.kh-product-top>span:first-child{padding:5px 9px;background:#eff4e5;border-radius:6px}.kh-product-top>span:last-child{color:#7a8792;font-variant-numeric:tabular-nums}.kh-product-photo{display:grid;place-items:center;background:white;margin:15px 0 18px}.kh-product img{width:100%;height:190px;object-fit:contain}.kh-product h3{font-size:19px;line-height:1.35;min-height:76px;letter-spacing:-.025em;margin:0 0 18px}.kh-product dl{font-size:12px;margin:0 0 24px}.kh-product dl>div{display:flex;justify-content:space-between;gap:15px;padding:8px 0;border-bottom:1px solid var(--line);line-height:1.5}.kh-product dt{color:var(--muted)}.kh-product dd{font-weight:600;margin:0;text-align:right;white-space:nowrap}.kh-product-why{font-size:12px;margin-bottom:23px}.kh-product-why h4{font-size:12px;font-weight:700;margin-bottom:10px;letter-spacing:0}.kh-product-why ul{list-style:none;margin:0;padding:0}.kh-product-why li{position:relative;padding-left:17px;margin:0 0 9px;font-size:11px;line-height:1.85;color:var(--muted)}.kh-product-why li:before{content:'✓';position:absolute;left:0;color:#5d7b40}.kh-product>.ds-button{margin-top:auto;min-height:46px;font-size:13px;justify-content:space-between;padding:13px 17px}.kh-no-match{grid-column:1/-1;background:#f0f3e8;border:1px solid var(--line);padding:35px;border-radius:16px}.kh-no-match>.ds-icon{color:#5e7946;width:35px;height:35px;margin-bottom:20px}.kh-no-match h3{font-size:26px;margin-bottom:15px}.kh-no-match p{max-width:780px;font-size:14px;color:var(--muted);margin-bottom:24px}.kh-no-match>a{display:inline-flex;min-height:44px;align-items:center;margin-left:20px;font-size:12px;color:var(--blue)}.kh-comparison{margin-bottom:30px}.kh-comparison h3{font-size:26px;margin:0 0 12px}.kh-comparison>p{font-size:14px;color:var(--muted);margin-bottom:20px}.kh-comparison table{min-width:680px;font-size:12px;table-layout:fixed}.kh-comparison thead th:first-child{width:24%}.kh-result-bottom{font-size:11px;color:var(--muted);line-height:1.9;border-top:1px solid var(--line);padding-top:22px}.kh-result-bottom p{margin-bottom:8px}.kh-result-bottom a{color:var(--blue);text-decoration:underline}.kh-results>[role=status]{font-size:12px;color:#45623a;margin-top:18px;overflow-wrap:anywhere}.kh-explainer{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:35px;border-top:1px solid var(--line);padding-top:35px;margin-bottom:60px}.kh-explainer>div>span{font-size:11px;color:var(--blue);display:block;margin-bottom:17px}.kh-explainer h2{font-size:22px;line-height:1.3;margin-bottom:13px}.kh-explainer p{font-size:13px;color:var(--muted);line-height:1.85}
@media(max-width:1150px){.ds-nav{gap:13px}.kh-nav-cta{font-size:11px;padding:10px 12px}.kh-layout{grid-template-columns:minmax(0,1fr) 270px;gap:22px}.kh-panel{padding:28px}.kh-profile{padding:22px}.kh-options{gap:10px}.kh-option{gap:10px;padding:16px 12px}.kh-option:has(input:checked){padding:15px 11px}.kh-option strong{font-size:12px}.kh-option small{font-size:10px}.kh-option-icon{flex-basis:22px}.kh-option-icon .ds-icon{width:22px;height:22px;flex-basis:22px}.kh-radio{width:16px;height:16px;flex-basis:16px}.kh-product{padding:20px}.kh-product h3{font-size:17px}.kh-product dl{font-size:11px}.kh-home-band h2{font-size:20px}}
@media(max-width:950px){.ds-nav{gap:0}.ds-search-link>span{display:inline}.ds-nav>.kh-nav-cta{display:inline-flex;min-height:44px;margin-top:15px;padding:12px 17px;font-size:13px}.ds-search-link{padding:16px 0 0}.kh-layout{grid-template-columns:minmax(0,1fr) 250px;gap:20px}.kh-panel{padding:24px}.kh-options{grid-template-columns:1fr}.kh-option{min-height:85px;padding:15px}.kh-option:has(input:checked){padding:14px}.kh-option strong{font-size:14px}.kh-option small{font-size:11px}.kh-question-intro{font-size:13px}#kh-question{font-size:27px}.kh-profile{top:100px;padding:20px}.kh-results-heading{display:block}.kh-result-actions{justify-content:flex-start;max-width:none;margin-top:20px}.kh-product{padding:17px}.kh-product h3{font-size:16px}.kh-result-grid{gap:14px}.kh-product dl{font-size:10px}.kh-product-why li{font-size:10px}.kh-product img{height:155px}.kh-home-band{padding:24px}.kh-home-band>div{gap:14px}.kh-home-band h2{font-size:18px}.kh-home-band p{font-size:12px}}
@media(max-width:700px){.kh-home-band{display:block;padding:23px;margin-bottom:18px;border-radius:14px}.kh-home-band h2{font-size:20px}.kh-home-band p{font-size:12px;margin-top:10px}.kh-home-band>div{align-items:start}.kh-home-band>div>span{width:38px;height:38px;flex-basis:38px;border-radius:10px}.kh-home-band>div>span .ds-icon{width:21px;height:21px}.kh-home-band .ds-button{margin-top:20px;min-height:44px;font-size:12px}.kh-launch{bottom:15px;right:16px;gap:9px;min-height:46px;font-size:12px;padding:12px 16px}.kh-launch>.ds-icon:first-child{height:18px;width:18px;flex-basis:18px}.kh-invite{right:16px;bottom:75px;width:325px;padding:23px;border-radius:17px}.kh-invite h2{font-size:23px}.kh-invite p{font-size:12px}.kh-invite-link{font-size:12px}.kh-invite-icon{margin-bottom:15px}.kh-hero{padding:22px 0 28px}.kh-hero .ds-breadcrumb{margin-bottom:23px}.kh-hero h1{font-size:34px;line-height:1.15}.kh-hero>div>p{font-size:15px;line-height:1.85;margin-bottom:19px}.kh-hero-note{gap:7px 16px;font-size:10px}.kh-layout{grid-template-columns:1fr;gap:20px;margin-bottom:40px}.kh-panel{padding:23px 20px;border-radius:16px}.kh-progress{margin-bottom:24px}.kh-progress-head{font-size:10px}.kh-question-icon{width:37px;height:37px;border-radius:10px;margin-bottom:17px}.kh-question-icon .ds-icon{width:22px;height:22px}#kh-question{font-size:25px;line-height:1.3;margin-bottom:13px}.kh-question-intro{font-size:13px;line-height:1.85;margin-bottom:23px}.kh-options{gap:12px}.kh-option{min-height:86px;padding:15px 13px;gap:12px;border-radius:10px}.kh-option:has(input:checked){padding:14px 12px}.kh-option strong{font-size:13px}.kh-option small{font-size:10px;line-height:1.75}.kh-option-icon,.kh-option-icon .ds-icon{width:23px;height:23px;flex-basis:23px}.kh-guide-link{font-size:10px;line-height:1.65}.kh-controls{gap:12px;padding-top:20px;margin-top:12px}.kh-controls .ds-button{font-size:12px;min-height:44px;padding:12px 15px}.kh-back{font-size:11px}.kh-announcement{font-size:10px;line-height:1.7;margin-top:12px}.kh-profile{position:static;padding:23px;border-radius:15px}.kh-profile-heading h2{font-size:19px}.kh-profile ol{display:grid;grid-template-columns:1fr 1fr;gap:0 16px;margin-bottom:20px}.kh-profile li>span{display:none}.kh-profile button strong{font-size:11px}.kh-profile button small{font-size:9px}.kh-profile>p{font-size:11px}.kh-live-count{margin-bottom:15px}.kh-live-count strong{font-size:29px}.kh-live-count>span{font-size:11px}.kh-private{font-size:9px!important}.kh-results-heading{margin-top:8px}.kh-results h2{font-size:29px;line-height:1.25}.kh-results-heading p{font-size:13px}.kh-result-actions{gap:8px}.kh-secondary{font-size:10px;min-height:44px;padding:9px 11px}.kh-reset{font-size:10px;min-height:44px}.kh-chips{gap:7px;margin-bottom:18px}.kh-chips>button{font-size:10px;min-height:38px;padding:7px 11px}.kh-destination{font-size:10px;line-height:1.8}.kh-result-grid{grid-template-columns:1fr;gap:20px;margin-bottom:35px}.kh-product{padding:23px;border-radius:15px}.kh-product h3{font-size:21px;min-height:0;margin-bottom:20px}.kh-product img{height:210px}.kh-product dl{font-size:12px}.kh-product dl>div{padding:10px 0}.kh-product-why h4{font-size:13px}.kh-product-why li{font-size:12px;line-height:1.85}.kh-product-top{font-size:10px}.kh-product>.ds-button{min-height:46px;font-size:14px}.kh-comparison h3{font-size:24px}.kh-comparison>p{font-size:12px}.kh-comparison table{font-size:11px;min-width:650px}.kh-comparison th,.kh-comparison td{padding:14px 16px;line-height:1.8}.kh-result-bottom{font-size:10px}.kh-no-match{padding:25px}.kh-no-match h3{font-size:24px}.kh-no-match p{font-size:13px}.kh-no-match>.ds-button{font-size:12px}.kh-no-match>a{font-size:11px;margin-left:0;margin-top:10px;display:flex}.kh-explainer{grid-template-columns:1fr;gap:28px;padding-top:28px;margin-bottom:40px}.kh-explainer>div>span{margin-bottom:10px}.kh-explainer h2{font-size:23px;margin-bottom:10px}.kh-explainer p{font-size:13px}.ds-footer{padding-bottom:75px}}
@media(max-width:360px){.kh-hero h1{font-size:30px}.kh-panel{padding:20px 16px}.kh-option strong{font-size:12px}.kh-option small{font-size:10px}.kh-option{gap:10px}.kh-option-icon{display:none}.kh-controls .ds-button{padding:12px;font-size:11px}.kh-invite{max-width:calc(100vw - 32px)}.kh-home-band h2{font-size:18px}.kh-home-band>div>span{display:none}.kh-hero-note{font-size:9px;gap:5px 12px}.kh-profile{padding:20px}.kh-product{padding:20px}}
@media print{.kh-launch,.kh-invite,.kh-result-actions,.kh-controls,.kh-profile{display:none!important}.kh-layout{display:block}.kh-result-grid{display:block}.kh-product{break-inside:avoid}.kh-page .tabel-scroll{overflow:visible}}
