/* WCAG-check: aanvullingen op check.css. Alle kleurcombinaties halen minimaal 4,5:1 contrast. */
.chip.e-blokkerend{background:#9F1D1D;color:#fff}
.chip.e-ernstig{background:#B33A0B;color:#fff}
.chip.e-hinderlijk{background:#7A5600;color:#fff}
.chip.e-verbetering{background:var(--line);color:var(--ink)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .chip.e-hinderlijk{background:#F2C14E;color:#17160F}}

.keuzes{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:14px;max-width:640px}
.keuzes label{display:grid;gap:6px;font:500 .9rem/1.2 var(--f-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--night-muted, var(--muted))}
.keuzes select{font:400 1rem/1.2 var(--f-body);padding:.7em .8em;border-radius:4px;border:1px solid var(--night-line);background:var(--night-2);color:#F1EFE4;min-height:44px}
@media (max-width:560px){.keuzes{grid-template-columns:1fr}}

.telling{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px}
.telling span{display:inline-flex;align-items:center;gap:8px;font-size:.95rem;padding:.4em .7em;border-radius:3px;background:var(--surface)}
.telling b{font:400 1.3rem/1 var(--f-title)}

.wet{border-left:6px solid var(--marker);background:var(--surface);padding:18px 20px;border-radius:0 4px 4px 0}
.wet h3{margin:0 0 6px;font-size:1.2rem}
.wet p{margin:0}
.wet small{display:block;margin-top:8px;color:var(--muted)}

.punt .wie{grid-column:2;font-size:.92rem;color:var(--muted)}
.punt .wie b{color:var(--ink);font-weight:500}
@media (max-width:520px){.punt .wie{grid-column:1}}

.signaal{display:flex;gap:12px;align-items:flex-start;padding:14px 16px;border:1px solid var(--line);border-radius:4px;margin-top:10px}
.signaal::before{content:"!";flex:0 0 auto;display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--ink);color:var(--paper);font-weight:700}

.mailme{margin-top:24px;padding:20px;border:1px solid var(--line);border-radius:6px;display:grid;gap:12px;max-width:640px}
.mailme .rij{display:flex;flex-wrap:wrap;gap:10px}
.mailme input[type=email]{flex:1 1 220px;min-height:44px;font:400 1rem/1.2 var(--f-body);padding:.6em .8em;border:1px solid var(--muted);border-radius:4px;background:var(--paper);color:var(--ink)}
.mailme .akkoord{display:flex;gap:10px;align-items:flex-start;font-size:.95rem}
.mailme .akkoord input{width:22px;height:22px;margin-top:2px;flex:0 0 auto}
.mailme .status{margin:0;font-size:.95rem}
.mailme .status.ok{color:var(--goed)}
.mailme .status.fout{color:var(--fout)}

.res-kop:focus{outline:none}
.res-kop:focus-visible{outline:3px solid var(--marker);outline-offset:6px}
.methode{font-size:.9rem;color:var(--muted);margin-top:24px}
.sr-only-focusable:focus{position:fixed!important;left:12px;top:12px;width:auto!important;height:auto!important;clip:auto!important;clip-path:none!important;margin:0!important;overflow:visible!important;white-space:normal!important;z-index:100;background:var(--marker);color:var(--on-marker);padding:10px 14px;border-radius:4px;font-weight:500}
#result .subs{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:860px){#result .subs{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:420px){#result .subs{grid-template-columns:1fr}}

/* Sectiemenu WCAG: tweede rij in de vaste kop, verbindt check, webshop-check en monitor */
html{scroll-padding-top:128px}
.top nav.sectie{display:block;margin:0;gap:0;border-top:1px solid var(--night-line)}
.top .sectie .wrap{justify-content:flex-start;display:flex;align-items:center;gap:0 26px;min-height:44px;overflow-x:auto;scrollbar-width:none;white-space:nowrap}
.sectie .wrap::-webkit-scrollbar{display:none}
.sectie-naam{font:400 .78rem/1 var(--f-title);letter-spacing:.08em;color:var(--marker);padding-right:20px;border-right:1px solid var(--night-line);align-self:stretch;display:flex;align-items:center}
.sectie a{position:relative;display:inline-flex;align-items:center;min-height:44px;flex:none;text-decoration:none;font:500 1rem/1 var(--f-display);letter-spacing:.01em;color:var(--night-muted);transition:color .15s}
.sectie a:hover{color:#fff}
.sectie a[aria-current]{color:#F1EFE4}
.sectie a[aria-current]::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:var(--marker)}
.sectie a:focus-visible{outline-offset:-3px}
@media (max-width:520px){.top .sectie .wrap{gap:0 18px}.sectie-naam{padding-right:14px}.sectie a{font-size:.95rem}}
/* Onderaan elke WCAG-pagina: de andere WCAG-pagina's */
.verder h2.label{margin:0}
.verder .xsell{grid-template-columns:repeat(3,minmax(0,1fr));margin-top:18px}
@media (max-width:900px){.verder .xsell{grid-template-columns:1fr}}