/* Donkere vragenlijst (dialog), gedeeld door alle pagina's. Onafhankelijk van site.css. */
dialog#qcDialog{margin:auto;--d-bg:#0f0f0f;--d-line:#2a2a2a;--d-mut:#a3a3a3;--d-dim:#737373;--d-acc:#9d5cff;border:1px solid #2a2a2a;border-radius:28px;padding:0;width:min(560px,92vw);max-height:88vh;background:var(--d-bg);color:#fff;font-family:Inter,system-ui,sans-serif;box-shadow:0 30px 80px -20px rgba(0,0,0,.9)}
dialog#qcDialog::backdrop{background:rgba(0,0,0,.72);backdrop-filter:blur(4px)}
dialog#qcDialog *{box-sizing:border-box}
.qc-head{position:relative;padding:32px 34px 0}
.qc-head h3{margin:0;font-size:24px;font-weight:900;letter-spacing:-.03em;text-transform:uppercase;line-height:1.05}
.qc-head p{margin:10px 0 0;color:var(--d-mut,#a3a3a3);font-size:14.5px;line-height:1.55;padding-right:30px}
.qc-close{position:absolute;top:22px;right:24px;width:34px;height:34px;border-radius:50%;border:1px solid #2a2a2a;background:transparent;color:#fff;font-size:18px;line-height:1;cursor:pointer}
.qc-close:hover{border-color:#fff}
.qc-body{padding:22px 34px 34px;max-height:68vh;overflow-y:auto}
.qc-form{display:flex;flex-direction:column;gap:16px}
.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:480px){.field-grid{grid-template-columns:1fr}.qc-head,.qc-body{padding-left:22px;padding-right:22px}}
.field{display:flex;flex-direction:column;gap:6px}
.field label{font-size:11px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#a3a3a3}
.field input,.field select,.field textarea{font-family:inherit;font-size:15px;color:#fff;border:1px solid #2a2a2a;border-radius:14px;padding:13px 15px;background:#000;width:100%;color-scheme:dark}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:#9d5cff}
.field input::placeholder{color:#525252}
.field textarea{resize:vertical;min-height:96px}
.qc-disclaimer{margin:0;font-size:12.5px;color:#737373;text-align:center}
.qc-error{margin:0;font-size:13.5px;color:#ff7a90;text-align:center;font-weight:600}
.qc-step{display:flex;flex-direction:column;gap:16px;border:0;padding:0;margin:0;min-width:0}
.qc-step[hidden],.qc-nav [hidden]{display:none!important}
.qc-progress{display:flex;justify-content:space-between;align-items:baseline;font-size:11px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#737373}
.qc-step-name{color:#9d5cff;font-size:11px}
.qc-bar{height:4px;border-radius:999px;background:#1c1c1c;overflow:hidden;margin-top:-6px}
.qc-bar i{display:block;height:100%;width:25%;background:#fff;border-radius:999px;transition:width 240ms ease}
.qc-hint{margin:6px 0 0;font-size:12.5px;line-height:1.5;color:#737373}
.qc-hint-inline{font-weight:500;text-transform:none;letter-spacing:0;color:#737373;font-size:12.5px}
.qc-check-group{display:flex;flex-direction:column;gap:8px;margin-top:10px}
.qc-check{display:flex;align-items:flex-start;gap:12px;padding:12px 14px;border:1px solid #2a2a2a;border-radius:14px;font-size:14.5px;color:#fff;cursor:pointer;text-transform:none;letter-spacing:0;font-weight:500;transition:border-color .16s,background .16s,opacity .16s}
.qc-check:has(input:checked){border-color:#9d5cff;background:rgba(157,92,255,.12)}
.qc-check:has(input:disabled){opacity:.45;cursor:default}
.qc-check input{margin-top:2px;width:16px;height:16px;accent-color:#9d5cff;flex:none}
.qc-warn{margin:8px 0 0;padding:11px 13px;border-radius:14px;background:rgba(255,90,120,.1);border:1px solid rgba(255,90,120,.35);font-size:13px;font-weight:600;line-height:1.5;color:#ff9aab}
.qc-nav{display:flex;gap:10px;position:sticky;bottom:-1px;background:var(--d-bg,#0f0f0f);padding:12px 0 2px;z-index:2}
.qc-nav .btn{flex:1;display:inline-flex;align-items:center;justify-content:center;height:50px;padding:0 24px;border-radius:999px;font-family:inherit;font-size:11.5px;font-weight:800;letter-spacing:.18em;text-transform:uppercase;cursor:pointer;background:#fff;color:#000;border:1px solid #fff;box-shadow:none}
.qc-nav .btn:hover{background:#e8e8e8}
.qc-nav .qc-prev{flex:0 0 auto;background:transparent;color:#fff;border-color:#2a2a2a}
.qc-nav .qc-prev:hover{border-color:#fff;background:transparent}
@media(max-width:640px){.qc-nav .qc-prev{padding-left:18px;padding-right:18px}}