/* Naslag — alle kleuren en fonts komen uit het merkbestand (theme.json presets). */
:root{
  --kalk:var(--wp--preset--color--achtergrond);
  --papier:var(--wp--preset--color--papier);
  --grafiet:var(--wp--preset--color--tekst);
  --steen:var(--wp--preset--color--gedempt);
  --voeg:var(--wp--preset--color--lijn);
  --duimstok:var(--wp--preset--color--accent);
  --duimstok-licht:var(--wp--preset--color--accent-licht);
  --serif:var(--wp--preset--font-family--tekst);
  --grotesk:var(--wp--preset--font-family--koppen);
  --kopbreedte:var(--wp--custom--kop-breedte,100%);
  --max:76rem;
}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;-webkit-font-smoothing:antialiased;font-optical-sizing:auto}
.wp-site-blocks{padding:0}
.wp-site-blocks>*,.wp-site-blocks>*+*{margin-block-start:0}
a{color:inherit;text-decoration-color:var(--duimstok);text-decoration-thickness:2px;text-underline-offset:.22em}
a:hover{text-decoration-color:var(--grafiet)}
:focus-visible{outline:3px solid var(--grafiet);outline-offset:3px}
img{max-width:100%;height:auto}
.sr,.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
h1,h2,h3,h4{font-stretch:var(--kopbreedte);color:var(--grafiet)}
h1,.wp-block-post-title{margin:0 0 1.4rem;max-width:16ch}
.knop{display:inline-block;background:var(--duimstok);color:var(--grafiet);font:700 1rem/1 var(--grotesk);padding:.85rem 1.2rem;text-decoration:none}
.knop:hover{background:var(--grafiet);color:#fff}

/* Kop */
.kop{border-bottom:1px solid var(--voeg);background:var(--papier)}
.kop-in{max-width:var(--max);margin:auto;padding:1.1rem 1.5rem;gap:1rem 2.5rem!important}
.merk{margin:0}
.merk a{text-decoration:none;font-stretch:88%;letter-spacing:-.01em;display:block;line-height:0}
.merk-logo{display:block;height:1.55rem;width:auto}
@media (max-width:600px){.merk-logo{height:1.3rem}}
.naslag-menu{display:flex;gap:1.6rem;font:500 .95rem/1 var(--grotesk);flex-wrap:wrap}
.naslag-menu a{text-decoration:none;padding-bottom:.3rem}
.naslag-menu a[aria-current]{box-shadow:inset 0 -3px var(--duimstok)}
.naslag-menu a:hover{box-shadow:inset 0 -3px var(--voeg)}

/* Bladspiegel: kantlijn + tekst */
.blad{max-width:var(--max);margin:auto;padding:3rem 1.5rem 5rem}
.single .blad,.blad:has(>.kantlijn){display:grid;grid-template-columns:13.5rem minmax(0,42rem);column-gap:4.5rem;align-items:start}
.blad>*{margin-block-start:0}
.blad--smal .artikel,.blad--smal>*{max-width:42rem}
.kantlijn{font:400 .9rem/1.5 var(--grotesk);color:var(--steen);position:sticky;top:2rem;padding-top:3.2rem}
.kantlijn dl{margin:0 0 2rem}
.kantlijn dt{color:var(--grafiet);font-weight:600;margin-top:.9rem}
.kantlijn dt:first-child{margin-top:0}
.kantlijn dd{margin:0}
.inhoud-kop{font-weight:600;color:var(--grafiet);margin:0 0 .6rem}
.inhoud{list-style:none;margin:0;padding:0;border-left:3px solid var(--voeg)}
.inhoud a{display:block;padding:.35rem 0 .35rem 1rem;margin-left:-3px;border-left:3px solid transparent;text-decoration:none;color:var(--grafiet)}
.inhoud a:hover{border-left-color:var(--duimstok)}
.artikel>*{margin-block-start:0}
.kruimel{margin:0 0 2.2rem;font:400 .9rem/1.5 var(--grotesk);color:var(--steen)}
.kruimel a{text-decoration:none}.kruimel a:hover{text-decoration:underline}
.inhoud-mobiel{display:none;margin:0 0 2rem;font:400 .95rem/1.5 var(--grotesk)}
.inhoud-mobiel summary{font-weight:600;cursor:pointer;padding:.7rem 0;border-top:1px solid var(--voeg);border-bottom:1px solid var(--voeg)}
.inhoud-mobiel .inhoud{margin-top:.8rem}

/* Artikeltekst: gewone HTML van het schrijfscript */
.tekst>*{margin-block-start:0}
.tekst p,.tekst ul,.tekst ol{margin:0 0 1.15rem}
.tekst ul,.tekst ol{padding-left:1.2rem}.tekst li{margin-bottom:.4rem}
.tekst h2{font-size:1.75rem;line-height:1.2;margin:3.2rem 0 .9rem;letter-spacing:-.005em;scroll-margin-top:1.5rem;font-stretch:calc(var(--kopbreedte) + 5%)}
.tekst h3{margin:2rem 0 .5rem;font-family:var(--grotesk)}
.tekst strong{font-weight:600}
.tekst sup{line-height:0}
.tekst sup a{text-decoration:none;font:600 .72rem var(--grotesk);padding:0 .15em;background:var(--duimstok-licht)}
.tekst blockquote{margin:2rem 0;border-left:6px solid var(--duimstok);padding:.2rem 0 .2rem 1.2rem}

/* Het korte antwoord: <div class="kort-antwoord"> bovenaan het artikel */
.kort-antwoord{margin:0 0 3rem;background:var(--papier);border-top:6px solid var(--grafiet);padding:1.6rem 1.6rem 1.4rem;font-size:1.15rem;line-height:1.6}
.kort-antwoord::before{content:'Het korte antwoord';display:block;font:700 1.15rem/1.3 var(--grotesk);margin-bottom:.4rem}
.kort-antwoord p:last-child,.kort-antwoord ul:last-child{margin-bottom:0}
.kort-antwoord mark{background:linear-gradient(to bottom,transparent 0 58%,var(--duimstok-licht) 58% 94%,transparent 94%);color:inherit;padding:0 .12em;margin:0 -.12em;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.kort-antwoord .tabel{margin:1.4rem 0 0;border:0}

/* Tabellen: als een specificatieblad */
.tabel{max-width:100%;overflow-x:auto;margin:1.5rem 0 2rem}
.tekst table{width:100%;border-collapse:collapse;font:400 1rem/1.35 var(--grotesk);font-variant-numeric:tabular-nums;min-width:30rem}
.tekst caption{text-align:left;font:400 .85rem/1.5 var(--grotesk);color:var(--steen);caption-side:bottom;padding-top:.8rem}
.tekst th,.tekst td{padding:.75rem .6rem;text-align:left;vertical-align:baseline;border-bottom:1px solid var(--voeg)}
.tekst thead th{font-weight:600;font-size:.85rem;color:var(--steen);border-bottom:2px solid var(--grafiet)}
.tekst tbody td{font-weight:500}
.tekst tr.markeer td,.tekst tr.markeer th{background:var(--duimstok-licht)}

/* Beeld */
.artikel-figuur,.tekst figure{margin:2.5rem 0}
.artikel-figuur img,.tekst figure img{display:block;width:100%;aspect-ratio:3/2;object-fit:cover}
figcaption{font:400 .88rem/1.5 var(--grotesk);color:var(--steen);margin-top:.6rem;max-width:36rem}

/* Lees ook (linkscripts) en let-op */
.tekst .klikt-intern-leesook,.tekst .let{border-left:6px solid var(--duimstok);padding:.2rem 0 .2rem 1.2rem;margin:2rem 0}
.tekst .klikt-intern-leesook p,.tekst .klikt-intern-leesook strong:first-child{font:600 .95rem/1.4 var(--grotesk);margin:0 0 .4rem}
.tekst .klikt-intern-leesook ul{list-style:none;padding:0;margin:0}
.tekst .klikt-intern-leesook li{margin:0;padding:.25rem 0;font-family:var(--grotesk)}
.tekst a.klikt-intern{text-decoration-thickness:2px}

/* Bronnen (<div class="artikel-bronnen">) en verantwoording */
.tekst .artikel-bronnen{margin-top:3.5rem;border-top:2px solid var(--grafiet);padding-top:1.2rem;font:400 .92rem/1.6 var(--grotesk)}
.tekst .artikel-bronnen h2,.tekst .artikel-bronnen h3{font:700 1.15rem/1.3 var(--grotesk);margin:0 0 .8rem}
.tekst .artikel-bronnen ol,.tekst .artikel-bronnen ul{margin:0;padding-left:1.4rem}
.tekst .artikel-bronnen li{margin-bottom:.5rem}
.verantwoording{margin:2rem 0 0;font:400 .92rem/1.6 var(--grotesk);color:var(--steen);max-width:36rem}
.verantwoording strong{color:var(--grafiet)}

/* Rijen: artikellijsten zonder kaarten */
.gerelateerd{margin-top:3.5rem}
.gerelateerd h2,.sectie-intro h2{font-size:1.75rem;font-stretch:calc(var(--kopbreedte) + 5%);margin:0 0 .8rem}
.rijen{list-style:none;margin:0;padding:0;border-top:2px solid var(--grafiet)}
.rijen>li{display:grid;grid-template-columns:minmax(0,1fr) 9.5rem 9.5rem;gap:1rem;padding:.85rem 0;border-bottom:1px solid var(--voeg);align-items:baseline;margin:0}
.rijen>li>*{margin:0}
.rijen a,.rijen .wp-block-post-title{font:600 1.05rem/1.35 var(--grotesk);font-stretch:100%;max-width:none;letter-spacing:0}
.rijen .wp-block-post-title a,.rijen>li>a{text-decoration:none}
.rijen .wp-block-post-title a:hover,.rijen>li>a:hover{text-decoration:underline;text-decoration-color:var(--duimstok)}
.rijen span,.rijen .wp-block-post-terms,.rijen .wp-block-post-date{font:400 .9rem var(--grotesk);color:var(--steen)}
.rijen .wp-block-post-terms a{text-decoration:none;font:inherit}
.blad--lijst{display:block;max-width:var(--max)}
.archief-kop{max-width:42rem;margin-bottom:2.5rem}
.archief-intro{font-size:1.2rem;line-height:1.55}
.archief-intro p{margin:0 0 1rem}
.wp-block-query-pagination{margin-top:2rem;font-family:var(--grotesk);gap:.6rem}

/* Home */
.voorpagina{max-width:var(--max);margin:auto;padding:3.5rem 1.5rem 5rem}
.voorpagina>*{margin-block-start:0}
.opening{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:4rem;align-items:end;padding-bottom:3rem;border-bottom:6px solid var(--grafiet)}
.opening>*{margin:0}
.opening h1{font-size:clamp(2.8rem,6.5vw,5.4rem);max-width:12ch;margin-bottom:1.6rem}
.opening-intro{font-size:1.25rem;line-height:1.55;margin:0 0 1.8rem;max-width:34rem}
.zoekveld{display:flex;max-width:34rem;border:2px solid var(--grafiet);background:#fff}
.zoekveld input{flex:1;border:0;font:500 1.1rem var(--grotesk);padding:.9rem 1rem;min-width:0;background:transparent;color:var(--grafiet)}
.zoekveld input:focus{outline:none}
.zoekveld:focus-within{outline:3px solid var(--duimstok);outline-offset:2px}
.zoekveld button{border:0;background:var(--grafiet);color:#fff;font:600 1rem var(--grotesk);padding:0 1.4rem;cursor:pointer}
.rekenhulp-kort{font-family:var(--grotesk)}
.rekenhulp-kort h2{font-size:1.4rem;margin:0 0 .4rem;font-stretch:calc(var(--kopbreedte) + 5%)}
.rekenhulp-kort p{font:400 1rem/1.5 var(--serif);margin:0 0 1rem}
.rekenhulp-kort ul{list-style:none;margin:0 0 1.2rem;padding:0;border-top:1px solid var(--voeg)}
.rekenhulp-kort li a{display:flex;justify-content:space-between;gap:1rem;padding:.7rem 0;border-bottom:1px solid var(--voeg);text-decoration:none;font-weight:500}
.rekenhulp-kort li a span{color:var(--steen);font-weight:400}
.rekenhulp-kort li a:hover{box-shadow:inset 4px 0 var(--duimstok);padding-left:.7rem}
.hoofdstukken{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:0 0 4rem;border-bottom:1px solid var(--voeg)}
.hoofdstuk{padding:2rem 1.5rem 2rem 0;border-right:1px solid var(--voeg);margin-right:1.5rem}
.hoofdstuk:last-child{border-right:0;margin-right:0}
.hoofdstuk h2{font-size:1.6rem;line-height:1.15;margin:0 0 .6rem}
.hoofdstuk h2 a{text-decoration:none}
.hoofdstuk h2 a:hover{text-decoration:underline;text-decoration-color:var(--duimstok)}
.hoofdstuk p{font-size:.98rem;line-height:1.55;margin:0 0 1rem}
.hoofdstuk ul{list-style:none;margin:0;padding:0;font:400 .95rem/1.45 var(--grotesk)}
.hoofdstuk li{padding:.35rem 0}
.hoofdstuk li a{text-decoration-thickness:1px;text-decoration-color:var(--voeg)}
.hoofdstuk li a:hover{text-decoration-color:var(--duimstok);text-decoration-thickness:2px}
.register,.nieuw{display:grid;grid-template-columns:13.5rem minmax(0,1fr);column-gap:4.5rem;margin-bottom:4rem}
.nieuw>*{margin:0}
.sectie-intro p{font:400 .95rem/1.5 var(--grotesk);color:var(--steen);margin:0}
.letters{columns:4 11rem;column-gap:2.5rem;font-family:var(--grotesk)}
.letter{break-inside:avoid;margin:0 0 1.4rem}
.letter h3{font-size:1.5rem;line-height:1;font-weight:800;font-stretch:75%;margin:0 0 .4rem;padding-bottom:.3rem;border-bottom:3px solid var(--duimstok);display:inline-block;min-width:1.4rem}
.letter ul{list-style:none;margin:0;padding:0}
.letter li{padding:.18rem 0;font-size:.98rem}
.letter li a{text-decoration:none}
.letter li a:hover{text-decoration:underline;text-decoration-color:var(--duimstok)}

/* Rekenhulp-pagina */
.blad--tool{display:block}
.tool-kop{max-width:44rem;margin-bottom:2.5rem}
.tool-kop h1{max-width:none}
.tool-intro p{font-size:1.2rem;line-height:1.55;margin:0}

/* Zoekblok (404) */
.zoekblok .wp-block-search__inside-wrapper{border:2px solid var(--grafiet);background:#fff;max-width:34rem;padding:0}
.zoekblok .wp-block-search__input{border:0;font:500 1.1rem var(--grotesk);padding:.9rem 1rem}
.zoekblok .wp-block-search__button{margin:0;background:var(--grafiet);color:#fff;border:0;font:600 1rem var(--grotesk)}

/* Voet */
.voet{border-top:1px solid var(--voeg);font:400 .9rem/1.5 var(--grotesk);color:var(--steen)}
.voet-in{max-width:var(--max);margin:auto;padding:1.5rem;display:flex;gap:1.5rem;flex-wrap:wrap}
.voet-in span{margin-right:auto}

@media (max-width:900px){
  .kop-in{padding:1rem;flex-direction:column;align-items:flex-start!important}
  .naslag-menu{width:100%;gap:1.1rem;overflow-x:auto;flex-wrap:nowrap;white-space:nowrap;padding-bottom:.2rem}
  .blad,.single .blad{display:block;padding:1.6rem 1rem 3.5rem}
  .kantlijn{display:none}
  .kruimel{margin-bottom:1.4rem}
  .inhoud-mobiel{display:block}
  .kort-antwoord{padding:1.2rem 1rem;margin-left:-1rem;margin-right:-1rem}
  .tekst table{min-width:0;font-size:.95rem}
  .tekst th,.tekst td{padding:.65rem .35rem}
  .rijen>li{grid-template-columns:1fr;gap:.2rem}
  .voorpagina{padding:2rem 1rem 3.5rem}
  .opening{grid-template-columns:1fr;gap:2.2rem;padding-bottom:2.2rem}
  .opening-intro{font-size:1.12rem}
  .hoofdstukken{grid-template-columns:1fr;margin-bottom:3rem}
  .hoofdstuk{border-right:0;margin-right:0;padding:1.6rem 0;border-bottom:1px solid var(--voeg)}
  .hoofdstuk:last-child{border-bottom:0}
  .register,.nieuw{display:block}
  .sectie-intro{margin-bottom:1.2rem}
  .letters{columns:2 9rem}
}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}