/* Vivedis huisstijl v1 – "Technisch logboek" met accent #1f5f8b. Geen externe bronnen. */
:root{color-scheme:light dark;
--sans:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
--serif:Charter,"Bitstream Charter","Sitka Text",Cambria,Georgia,serif;
--mono:ui-monospace,"SF Mono",Menlo,Consolas,"Liberation Mono",monospace;
--bg:#faf8f3;--card:#ffffff;--fg:#22262a;--muted:#5a5f63;--acc:#1f5f8b;--acc-h:#174a6d;--on-acc:#ffffff;
--border:#8f897c;--rule:#ddd7ca;--track:#e2ddd0;--focus:#b35900;--mark:#fff3c4;--mark-fg:#22262a;--open:#ffe1e1;--r:2px}
@media(prefers-color-scheme:dark){:root{--bg:#1a1c1d;--card:#222527;--fg:#e6e3dc;--muted:#aeaaa1;--acc:#8cc0ea;--acc-h:#b0d4f2;--on-acc:#10161c;
--border:#77736b;--rule:#33383a;--track:#33383a;--focus:#ffad5c;--mark:#4a4220;--mark-fg:#f3eed8;--open:#4d2626}}
*{box-sizing:border-box}
body{margin:0;font:1.0625rem/1.6 var(--sans);color:var(--fg);background:var(--bg);-webkit-text-size-adjust:100%}
header,main,footer{max-width:46rem;margin:0 auto;padding:1rem 1.25rem}
header{display:flex;justify-content:space-between;align-items:center;gap:1rem;min-height:4rem;border-bottom:1px solid var(--rule);max-width:none;padding-left:max(1.25rem,calc((100% - 43.5rem)/2));padding-right:max(1.25rem,calc((100% - 43.5rem)/2))}
header a,header span{font-weight:600;color:var(--fg)}
.logo{display:inline-flex;align-items:center;gap:.45rem;font-weight:700;font-size:1.25rem;letter-spacing:.04em;color:var(--fg);text-decoration:none}
.logo svg{width:1.4rem;height:1.4rem;color:var(--acc)}
main{padding-top:2rem;padding-bottom:3rem}
h1,h2,h3{font-family:var(--serif);font-weight:600;line-height:1.2}
h1{font-size:clamp(1.9rem,6vw,2.6rem);margin:.5rem 0 1rem;letter-spacing:-.01em}
h2{font-size:1.4rem;margin:2.25rem 0 .75rem}h3{font-size:1.15rem}
a{color:var(--acc);text-underline-offset:.18em}a:hover{text-decoration-thickness:2px}
main>ul{list-style:none;padding:0}
main>ul>li{padding:.8rem 0 .8rem 1.25rem;border-top:1px solid var(--rule);position:relative}
main>ul>li:last-child{border-bottom:1px solid var(--rule)}
main>ul>li::before{content:"";position:absolute;left:0;top:1.4rem;width:.5rem;height:.5rem;background:var(--acc)}
.btn,.primary{display:inline-block;background:var(--acc);color:var(--on-acc);border:2px solid var(--acc);border-radius:var(--r);padding:.7rem 1.3rem;font:600 1rem/1.2 var(--sans);text-decoration:none;cursor:pointer}
.btn:hover,.primary:hover{background:var(--acc-h);border-color:var(--acc-h);color:var(--on-acc)}
button{font:600 1rem/1.2 var(--sans);padding:.7rem 1.2rem;border-radius:var(--r);border:2px solid var(--border);background:var(--card);color:var(--fg);cursor:pointer}
.ghost{border-color:transparent;background:transparent;color:var(--muted)}
.ghost:hover{color:var(--fg);border-color:var(--border)}
:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
.nav{display:flex;gap:.6rem;justify-content:flex-end;flex-wrap:wrap;margin-top:1.25rem}
fieldset{border:0;padding:0;margin:0 0 1.25rem;min-width:0}
legend{font-family:var(--serif);font-weight:600;font-size:1.2rem;margin-bottom:.6rem;padding:0}
.part legend{font-family:var(--sans);font-size:1rem}
.opt{display:flex;gap:.6rem;align-items:center;padding:.7rem .9rem;margin:.4rem 0;background:var(--card);border:1px solid var(--border);border-radius:var(--r);cursor:pointer}
.opt:has(input:checked){border-color:var(--acc);box-shadow:inset 4px 0 0 var(--acc)}
input[type=radio],input[type=checkbox],input[type=range]{accent-color:var(--acc)}
input[type=radio],input[type=checkbox]{width:1.1rem;height:1.1rem;flex:none}
input[type=email],input[type=text]{font:inherit;color:var(--fg);background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:.6rem .7rem;width:100%;max-width:24rem}
.slider{display:flex;gap:.6rem;align-items:center;flex-wrap:wrap}.slider input{flex:1;min-width:8rem}
.progress,.meta{color:var(--muted);font-size:.9rem}
.progress{font-family:var(--mono);letter-spacing:.02em;border-bottom:4px solid var(--track);padding-bottom:.4rem}
.meta{line-height:1.5}
#scan{background:var(--card);border:1px solid var(--rule);border-radius:var(--r);padding:1.25rem}
#scan:empty{display:none}
#scan h2{margin-top:.5rem}
.knelpunt{background:var(--card);border:1px solid var(--rule);border-left:4px solid var(--acc);padding:.75rem 1.1rem;margin:1rem 0}
.knelpunt h3{margin:.25rem 0 .5rem}
.ernst{font-family:var(--mono);font-size:.85rem;color:var(--muted);margin:0}
.dg{font-style:italic}.disclaimer{font-weight:600}
.dummy{background:var(--mark);color:var(--mark-fg);padding:0 .2rem}
.open{background:var(--open);padding:0 .2rem}
footer{color:var(--muted);font-size:.9rem;border-top:1px solid var(--rule);padding-top:1.25rem;padding-bottom:2rem}
footer a{color:var(--muted)}footer a:hover{color:var(--fg)}
.small{padding:.25rem .55rem;font-size:.85rem}
.print-only{display:none}
.legal table{border-collapse:collapse;width:100%;font-size:.92rem;display:block;overflow-x:auto}
.legal th,.legal td{border:1px solid var(--rule);padding:.4rem .55rem;text-align:left;vertical-align:top}
.legal th{background:var(--card)}
blockquote{margin:1rem 0;padding:.6rem 1rem;border-left:4px solid var(--border);background:var(--card)}
button[disabled]{opacity:.55;cursor:not-allowed}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;scroll-behavior:auto!important}}
@media print{
 .no-print{display:none!important}.print-only{display:block}
 body{background:#fff;color:#000;font-size:11pt}.knelpunt{border:0;border-left:3px solid #000;break-inside:avoid}
 header{border:0}
 @page{margin:18mm}
}
/* Taallink (CEO-besluit): sober, rechts in de header, doelgrootte >= 24x24 (WCAG 2.5.8) */
header{justify-content:flex-start}
header .logo{margin-right:auto}
header a.lang{display:inline-flex;align-items:center;justify-content:center;min-height:2rem;min-width:2rem;padding:.2rem .6rem;border:1px solid var(--border);border-radius:var(--r);color:var(--fg);font:500 .875rem/1.2 var(--sans);text-decoration:none;white-space:nowrap}
header a.lang:hover{border-color:var(--acc);color:var(--acc)}
@media print{header a.lang{display:none}}
/* ===== Landing v2 (variant A, wireframe 41 Vormgeving design/landing-v2/variant-a.html) ===== */
:root{--tint:#eef3f7;--band:#f1ede3}
@media(prefers-color-scheme:dark){:root{--tint:#1c2630;--band:#222527}}
body.landing main{max-width:none;padding:0}
.sec{padding:3rem 1.25rem}
.sec>.in{max-width:43.5rem;margin:0 auto}
.sec.wide>.in,.hero .wide-split{max-width:62rem}
.sec.tint{background:var(--tint)}
.sec.band{background:var(--band)}
.hero h1{max-width:22ch}
.hero .lead{font-size:1.15rem;max-width:40ch}
.cta-row{display:flex;flex-wrap:wrap;gap:.75rem 1.25rem;align-items:center;margin-top:1.5rem}
.btn.outline{background:transparent;color:var(--acc)}
.btn.outline:hover{background:var(--acc);color:var(--on-acc)}
.cards{display:grid;gap:1rem;margin-top:1.25rem}
.kaart{background:var(--card);border:1px solid var(--rule);border-top:4px solid var(--acc);border-radius:var(--r);padding:1.1rem 1.25rem}
.kaart h3{margin:0 0 .4rem;font-size:1.15rem}.kaart p{margin:0}
.split{display:grid;gap:2rem;align-items:center}
.diag{width:100%;max-width:18rem;color:var(--border);justify-self:center}
.diag .hot{fill:var(--acc)}.diag .warn{stroke:var(--acc);stroke-dasharray:5 4}
.spel p{font-family:var(--serif);font-size:1.3rem;line-height:1.5;margin:0}
.check{list-style:none;padding:0;margin:1rem 0 0}
.check li{padding:.65rem 0 .65rem 2rem;border-top:1px solid var(--rule);position:relative}
.check li:last-child{border-bottom:1px solid var(--rule)}
.check li::before{content:"";position:absolute;left:.2rem;top:1rem;width:.85rem;height:.45rem;border-left:2.5px solid var(--acc);border-bottom:2.5px solid var(--acc);transform:rotate(-45deg)}
.lijst{list-style:none;padding:0;margin:1rem 0 0;counter-reset:n}
.lijst li{counter-increment:n;padding:.75rem 0 .75rem 2.5rem;border-top:1px solid var(--rule);position:relative}
.lijst li::before{content:counter(n,decimal-leading-zero);position:absolute;left:0;top:.8rem;font:600 .9rem var(--mono);color:var(--acc)}
.slot{text-align:left}
.slot h2{font-size:clamp(1.6rem,5vw,2.2rem);margin-top:0}
@media(min-width:48rem){.sec{padding:4.5rem 1.25rem}.cards{grid-template-columns:1fr 1fr}.split{grid-template-columns:3fr 2fr}.split.rev{grid-template-columns:2fr 3fr}.split.rev .diag{order:-1}}
.probleem{margin-top:2.5rem;padding-top:2rem;border-top:1px solid var(--rule)}
.duo{display:grid;gap:2.5rem}.duo h2{margin-top:0}
@media(min-width:48rem){.duo{grid-template-columns:1fr 1fr;gap:3rem}}
.probleem h3{font-size:1.15rem;margin:0 0 .5rem}
.sec h1:first-child,.sec h2:first-child,.split>div>h2:first-child{margin-top:0}