/* BelBuddy helpcentrum. Gebouwd door bron/hulp_bouw.py. */
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.hkop{padding-top:40px;padding-bottom:36px}
.hkop h1{font-size:clamp(2rem,4.2vw,2.9rem);line-height:1.12;letter-spacing:-.02em;margin:10px 0 0;max-width:820px}
.hkop .sub{font-size:1.15rem;color:var(--grijs);margin:14px 0 0;max-width:680px}
.kruimel{font-size:.92rem;color:var(--grijs)}
.kruimel a{color:var(--blauw);text-decoration:none;font-weight:500}
.kruimel a:hover{text-decoration:underline}
.hkop-index{text-align:center;padding-top:64px;padding-bottom:40px}
.hkop-index h1,.hkop-index .sub{margin-left:auto;margin-right:auto}
.hzoek{max-width:620px;margin:32px auto 0}
.hzoek input{width:100%;box-sizing:border-box;font:400 1.05rem/1.4 Geist,system-ui,sans-serif;padding:17px 20px 17px 52px;border-radius:999px;border:1.5px solid var(--lijn);background:var(--vlak,#fff) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235A6079' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E") no-repeat 20px 50%/20px;color:var(--inkt);box-shadow:0 1px 2px rgba(13,18,48,.04)}
.hzoek input:focus{outline:none;border-color:var(--blauw);box-shadow:0 0 0 4px var(--blauw-zacht)}
.hgeen{text-align:center;color:var(--grijs);margin-top:18px}
.hcat{margin-top:48px}
.hcat h2,.hvid h2{font-size:1.3rem;margin:0 0 16px}
.hkaarten{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:14px}
.hkaart{display:flex;flex-direction:column;gap:6px;padding:20px 22px;border-radius:18px;border:1px solid var(--lijn);background:var(--vlak,#fff);text-decoration:none;color:var(--inkt);transition:border-color .15s,box-shadow .15s}
.hkaart:hover{border-color:var(--blauw);box-shadow:0 10px 30px -18px rgba(79,70,229,.45)}
.hkaart b{font-weight:600;font-size:1.02rem}
.hkaart span{color:var(--grijs);font-size:.93rem;line-height:1.5}
.hkaart em{font-style:normal;font-size:.8rem;font-weight:600;color:var(--blauw);margin-top:4px}
.hkaart[hidden],.hcat[hidden]{display:none}
.hvid{margin-top:8px}
.hvkaarten{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
@media (max-width:820px){.hvkaarten{grid-template-columns:1fr}}
.hvkaart{text-decoration:none;color:var(--inkt);display:flex;flex-direction:column;gap:6px}
.hvkaart img{width:100%;height:auto;border-radius:16px;border:1px solid var(--lijn);display:block}
.hvkaart b{font-weight:600;margin-top:6px}
.hvkaart span{color:var(--grijs);font-size:.9rem}
.hraster{display:grid;grid-template-columns:240px minmax(0,1fr);gap:64px;align-items:start;padding-bottom:96px}
@media (max-width:900px){.hraster{grid-template-columns:1fr;gap:40px}.hzij{order:2;position:static!important;border-top:1px solid var(--lijn);padding-top:28px}}
.hzij{position:sticky;top:24px;font-size:.93rem}
.hzij .hzkop{font-size:.78rem;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--grijs);margin:22px 0 8px}
.hzij .hzkop:first-child{margin-top:0}
.hzij ul{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.hzij a{display:block;padding:7px 12px;border-radius:10px;color:var(--grijs);text-decoration:none;line-height:1.35}
.hzij a:hover{color:var(--inkt);background:var(--vlak2)}
.hzij a[aria-current]{color:var(--blauw);background:var(--blauw-zacht);font-weight:600}
.hart{max-width:740px;font-size:1.04rem;line-height:1.7}
.hart>p,.hart li p{margin:0 0 12px}
.hart .inleiding{font-size:1.12rem;color:var(--inkt);margin-bottom:28px}
.hart h2{font-size:1.32rem;margin:48px 0 12px;letter-spacing:-.01em}
.hart a{color:var(--blauw)}
.hart code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.9em;background:var(--vlak2);border:1px solid var(--lijn);border-radius:6px;padding:.1em .4em;white-space:nowrap}
.hstappen{list-style:none;counter-reset:stap;margin:8px 0 0;padding:0}
.hstappen>li{counter-increment:stap;position:relative;padding:0 0 30px 52px}
.hstappen>li::before{content:counter(stap);position:absolute;left:0;top:-2px;width:34px;height:34px;border-radius:50%;background:var(--blauw);color:#fff;font-weight:600;font-size:.95rem;display:grid;place-items:center}
.hstappen>li::after{content:"";position:absolute;left:16.5px;top:40px;bottom:6px;width:1px;background:var(--lijn)}
.hstappen>li:last-child::after{display:none}
.hstappen h3{font-size:1.08rem;margin:2px 0 8px;letter-spacing:0}
.scherm{margin:16px 0 8px;padding:12px;border-radius:18px;background:var(--vlak2);border:1px solid var(--lijn)}
.scherm img{display:block;width:100%;height:auto;border-radius:12px;box-shadow:0 1px 2px rgba(13,18,48,.06),0 12px 30px -20px rgba(13,18,48,.35)}
.scherm.smal{max-width:300px}
.noot{background:var(--blauw-zacht);border-radius:16px;padding:16px 20px;margin:28px 0;font-size:.98rem;line-height:1.6}
.noot a{font-weight:500}
.punten{margin:0;padding-left:20px}
.punten li{margin:6px 0}
table.codes,table.systemen{width:100%;border-collapse:collapse;margin:14px 0 8px;font-size:.97rem}
table.codes th,table.codes td,table.systemen th,table.systemen td{text-align:left;vertical-align:top;padding:13px 12px 13px 0;border-bottom:1px solid var(--lijn)}
table.codes th,table.systemen th{font-weight:600;width:32%}
table.systemen tr:target{background:var(--blauw-zacht)}
@media (max-width:600px){table.systemen th,table.systemen td{display:block;width:auto;padding:4px 0}table.systemen th{padding-top:14px;border-bottom:0}table.codes th{width:45%}}
.video{margin:0 0 36px;border-radius:18px;overflow:hidden;border:1px solid var(--lijn);background:#0D1230}
.video video{display:block;width:100%;height:auto;aspect-ratio:16/9;background:#0D1230}
.video figcaption{background:var(--vlak2);color:var(--grijs);font-size:.88rem;padding:10px 16px}
.hnodig{margin-top:56px;padding:24px 26px;border-radius:18px;border:1px solid var(--lijn);background:var(--vlak,#fff)}
.hnodig h2{margin:0 0 6px;font-size:1.15rem}
.hnodig p{margin:0;color:var(--grijs)}
.hverwant{margin-top:36px}
.hverwant h2{font-size:1.05rem;margin:0 0 10px}
.hverwant ul{margin:0;padding-left:20px}
.hverwant li{margin:6px 0}