:root{--bg:#1f2833;--bg-soft:#1a2430;--surface:#213248;--surface-2:#2b3a4a;--ink:#f2f5f7;--ink-soft:#bfbfbf;--ink-dim:#8c98a4;--gold:#6afbf0;--gold-hi:#a3fdf7;--gold-deep:#3fc9bf;--gold-soft:rgba(106,251,240,.1);--gold-line:rgba(106,251,240,.3);--gold-grad:linear-gradient(135deg,#a3fdf7,#6afbf0 45%,#3fc9bf);--on-gold:#0b1418;--font:Poppins,system-ui,sans-serif;--shadow-sm:0 2px 10px #0003;--ring:0 0 0 3px #6afbf060}
body{background:var(--bg)}h1,h2,h3,.ed-h2{font-family:'League Spartan',Poppins,system-ui,sans-serif}.site-header.beheer-header{background:var(--bg);border-color:var(--line)}.beheer-logo{width:145px;height:auto;max-width:145px;object-fit:contain}.btn--primary,.btn--primary:hover,.btn--gold-outline.is-on{color:var(--on-gold)}.tabbar{background:var(--bg)}.form-card,.stat,.rev-card{background:var(--surface)}.demo-info{border:1px solid var(--gold-line);border-left:3px solid var(--gold);padding:16px 20px;margin:0 0 30px;background:#213248}.demo-info b{font-size:14px}.demo-info p{color:var(--ink-soft);font-size:12px;margin:5px 0 14px}.demo-info .btn{font-size:11px;padding:9px 12px;min-height:36px}.demo-info form{margin:0}.demo-utility{max-width:900px;margin:0 auto;padding:105px 24px 80px}.demo-utility .form-card{margin:20px 0}.demo-utility h1{font-size:2.1rem}.demo-utility pre{white-space:pre-wrap;overflow-wrap:anywhere;color:var(--ink-soft);font:13px/1.7 var(--font)}.demo-mail{margin:20px 0}.demo-mail summary{cursor:pointer;padding:12px 0;color:var(--gold)}.demo-mail iframe{width:100%;height:500px;border:1px solid var(--line);background:white}.demo-payment{font-size:2rem;color:var(--gold);font-weight:700}.demo-footer-note{font-size:12px;color:var(--ink-soft);padding:24px 0}
html{scrollbar-gutter:stable}.rev-line{stroke:var(--gold)}.rev-dot{fill:var(--gold)}.rev-area{fill:var(--gold-soft)}.ag-ev{border-color:var(--gold-line)}
@media(max-width:600px){.beheer-logo{width:110px;max-width:110px}.demo-info{padding:14px;margin-bottom:24px}.demo-info .btn-row{gap:7px}.demo-info .btn{font-size:10px;padding:9px 10px}.demo-utility{padding:100px 18px 40px}}

.demo-contact{max-width:480px;color:var(--ink);border:1px solid var(--gold-line)}.demo-contact::backdrop{background:#0009}

.demo-info p{margin:5px 0 8px}.demo-info summary{cursor:pointer;font-size:12px;color:var(--gold);font-weight:600}.demo-info details[open] .btn-row{margin-top:14px}.input,.select,.textarea{background:#1a2430;color:var(--ink)}

/* De grotere HK-bediening behoudt de kleuren en veldranden van 17sites. */
:root{--control-line:#617387}
.input::placeholder,.textarea::placeholder{color:var(--ink-dim)}
.demo-info .btn{min-height:44px;font-size:.8125rem;padding:.65rem .85rem}

/* Korte toelichtingen staan naast het label, met gelijke veldranden. */
.demo-trainer .field > label:not(.check) > .hint{display:inline;margin-left:.4rem}