/* D&D Tech — keuzehulp, veelgestelde vragen en kennisbank (agent B, 15-10-2026).
   Bouwt voort op tokens.css, base.css en pages/diensten.css (.field, .choice, .faq, .prose, .crumbs). */

/* ---------- Keuzehulp ---------- */
.kh{display:grid;gap:var(--space-5);grid-template-columns:minmax(0,1fr)}
@media (min-width:1000px){.kh{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);align-items:start}
  .kh__uitkomst{position:sticky;top:calc(var(--header-h) + var(--space-4))}}
.kh fieldset{border:0;padding:0;margin:0 0 var(--space-6);min-width:0}
.kh legend{font-family:var(--font-mono);font-size:var(--fs-xs);letter-spacing:.15em;text-transform:uppercase;color:var(--cyan);margin-bottom:var(--space-3);padding:0}
.kh .row{display:grid;gap:var(--space-4);grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr))}
.kh .row>*{min-width:0}
.kh .hint{font-size:var(--fs-xs);color:var(--text-mute);margin:0}
.kh .choice input[type=radio]~i{border-radius:50%}
.kh-stats{display:grid;gap:var(--space-3);grid-template-columns:repeat(auto-fit,minmax(min(100%,140px),1fr));margin:var(--space-4) 0 var(--space-5)}
.kh-stat{border:1px solid var(--line);border-radius:var(--radius);padding:var(--space-4);background:var(--surface);min-width:0}
.kh-stat b{display:block;font-family:var(--font-display);font-size:var(--fs-xl);line-height:1.1;color:var(--text)}
.kh-stat span{font-size:var(--fs-xs);color:var(--text-mute);font-family:var(--font-mono);text-transform:uppercase;letter-spacing:.1em}
.kh-lijst{list-style:none;padding:0;margin:0 0 var(--space-5);font-size:var(--fs-sm);color:var(--text-dim)}
.kh-lijst li{padding:.55em 0;border-bottom:1px dashed var(--line);display:flex;gap:.7em}
.kh-lijst li::before{content:"";flex:none;width:6px;height:6px;margin-top:.6em;border-radius:50%;background:var(--cyan);box-shadow:0 0 8px var(--cyan)}
.kh-lijst a{color:var(--cyan)}
.kh-let{font-size:var(--fs-xs);color:var(--text-mute);border-left:2px solid var(--violet);padding-left:var(--space-3);margin-top:var(--space-4)}
.kh-status{font-family:var(--font-mono);font-size:var(--fs-xs);color:var(--lime);min-height:1.4em;margin-top:var(--space-2)}

/* ---------- Kennisbank ---------- */
.kb-grid{display:grid;gap:var(--space-5);grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr))}
.kb-card{display:flex;flex-direction:column}
.kb-card h2,.kb-card h3{font-size:var(--fs-lg)}
.kb-card .lees{margin-top:auto;color:var(--cyan);font-weight:600;font-size:var(--fs-sm)}
.kb-card a.stretch::after{content:"";position:absolute;inset:0;border-radius:inherit}
.art-meta{font-family:var(--font-mono);font-size:var(--fs-xs);color:var(--text-mute);display:flex;flex-wrap:wrap;gap:.4em 1.2em;margin-top:var(--space-4)}
.prose p{max-width:72ch}
.prose table{width:100%;border-collapse:collapse;font-size:var(--fs-sm);margin:var(--space-4) 0}
.prose th,.prose td{text-align:left;padding:.6em .8em;border-bottom:1px solid var(--line);vertical-align:top}
.prose th{font-family:var(--font-mono);font-size:var(--fs-xs);text-transform:uppercase;letter-spacing:.1em;color:var(--text-mute);font-weight:500}
.prose td{color:var(--text-dim)}
.note{border:1px solid var(--line-strong);border-left:3px solid var(--cyan);border-radius:var(--radius-sm);padding:var(--space-4) var(--space-5);background:var(--surface);margin:var(--space-5) 0;font-size:var(--fs-sm)}
.note p:last-child{margin-bottom:0}
.note strong{color:var(--text)}
.bronnen{font-size:var(--fs-xs);color:var(--text-mute)}
.bronnen a{word-break:break-word}

/* ---------- FAQ-pagina: rubrieken ---------- */
.faq-groep{margin-bottom:var(--space-7)}
.faq-groep>h2{font-size:var(--fs-xl);max-width:860px;margin-inline:auto;margin-bottom:var(--space-4)}
.faq .a a{color:var(--cyan);text-decoration:underline;text-underline-offset:.15em}
.faq .a ul{padding-left:1.2em;margin:0 0 var(--space-3)}
.faq-groep,[id]{scroll-margin-top:calc(var(--header-h) + var(--space-4))}
.kh-naar{color:var(--cyan);white-space:nowrap}
@media (min-width:1000px){.kh-naar{display:none}}