/* DE VRIJSTELLING — de blauwe envelop, omgekeerd */
@import url('https://fonts.googleapis.com/css2?family=Besley:wght@400;700;800;900&family=Public+Sans:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500;600&display=swap');

:root{
  --envelop:#1d5d8f;
  --envelop-diep:#0e3a5c;
  --papier:#f7f5ef;
  --papier-donker:#efece2;
  --inkt:#17222b;
  --rood:#c8352e;
  --lijn:#d8d2c4;
  --maat:min(92vw,1060px);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}
body{
  background:var(--papier);
  color:var(--inkt);
  font-family:'Public Sans',system-ui,sans-serif;
  font-size:17px;line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
a{color:var(--envelop)}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid var(--rood);outline-offset:2px}
.wrap{width:var(--maat);margin:0 auto}

/* ── masthead: officieel formulier, gekaapt ── */
header.mast{border-bottom:3px double var(--inkt);background:var(--papier)}
.mast-strip{background:var(--envelop-diep);color:var(--papier);font-family:'IBM Plex Mono',monospace;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;padding:.45rem 0}
.mast-strip .wrap{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.mast-inner{padding:2.2rem 0 1.6rem}
.mast h1,.mast .h1{font-family:'Besley',serif;font-weight:900;font-size:clamp(2.6rem,7vw,4.6rem);letter-spacing:-.015em;line-height:1}
.mast h1 a{color:var(--inkt);text-decoration:none}
.mast .sub{margin-top:.7rem;max-width:46ch;font-size:1.02rem;color:#3d4a54}
.mast .sub em{font-style:normal;color:var(--rood);font-weight:600}

/* ── hero manifest ── */
.manifest{padding:3.2rem 0 1rem}
.manifest h2{font-family:'Besley',serif;font-weight:800;font-size:clamp(1.7rem,4vw,2.6rem);line-height:1.15;max-width:24ch}
.manifest h2 .streep{background:linear-gradient(transparent 62%,rgba(200,53,46,.28) 62%)}
.manifest p{margin-top:1rem;max-width:62ch;color:#3d4a54}

/* ── rekenformulier (signatuur) ── */
.formulier{
  margin:2.6rem 0 3.4rem;
  background:#fff;
  border:1px solid var(--lijn);
  border-top:14px solid var(--envelop);
  border-radius:6px;
  box-shadow:0 18px 40px -24px rgba(14,58,92,.35);
  position:relative;overflow:hidden;
}
.formulier::before{
  content:"MODEL DV-2026 · INVULLEN IN BLOKLETTERS NIET NODIG";
  display:block;font-family:'IBM Plex Mono',monospace;font-size:.68rem;letter-spacing:.12em;
  color:var(--envelop);padding:.8rem 1.6rem 0;
}
.form-kop{padding:.5rem 1.6rem 0;font-family:'Besley',serif;font-weight:800;font-size:1.5rem}
.form-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem;padding:1.2rem 1.6rem}
@media(max-width:720px){.form-grid{grid-template-columns:1fr}}
.veld label{display:block;font-family:'IBM Plex Mono',monospace;font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:#5a6570;margin-bottom:.35rem}
.veld input,.veld select{
  width:100%;padding:.7rem .8rem;font-family:'IBM Plex Mono',monospace;font-size:1.05rem;
  border:none;border-bottom:2px solid var(--inkt);background:var(--papier);color:var(--inkt);border-radius:0;
}
.uitkomst{border-top:1px dashed var(--lijn);display:grid;grid-template-columns:1fr 1fr;position:relative}
@media(max-width:720px){.uitkomst{grid-template-columns:1fr}}
.uitkomst>div{padding:1.4rem 1.6rem}
.uitkomst .fiscus{background:var(--papier-donker)}
.uitkomst .u{background:#fff}
.uitkomst .cijfer{font-family:'IBM Plex Mono',monospace;font-size:clamp(1.6rem,3.5vw,2.3rem);font-weight:600}
.uitkomst .fiscus .cijfer{color:var(--envelop-diep)}
.uitkomst .u .cijfer{color:var(--rood)}
.uitkomst .lbl{font-family:'IBM Plex Mono',monospace;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:#5a6570;margin-bottom:.3rem}
.stempel{
  position:absolute;right:1.2rem;top:-1.1rem;transform:rotate(-7deg);
  font-family:'IBM Plex Mono',monospace;font-weight:600;font-size:.8rem;letter-spacing:.16em;
  color:var(--rood);border:2.5px solid var(--rood);border-radius:4px;padding:.35rem .7rem;
  background:rgba(255,255,255,.85);text-transform:uppercase;
}
.form-voet{padding:0 1.6rem 1.2rem;font-size:.8rem;color:#6a747d}

/* ── artikel-index ── */
.dagen{padding-bottom:4rem}
.dagen .kop{display:flex;align-items:baseline;justify-content:space-between;border-bottom:2px solid var(--inkt);padding-bottom:.5rem;margin-bottom:0}
.dagen h3{font-family:'Besley',serif;font-weight:800;font-size:1.4rem}
.dagen .kop span{font-family:'IBM Plex Mono',monospace;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:#5a6570}
.dag{display:grid;grid-template-columns:110px 1fr auto;gap:1.4rem;align-items:baseline;padding:1.5rem 0;border-bottom:1px solid var(--lijn);text-decoration:none;color:var(--inkt)}
@media(max-width:720px){.dag{grid-template-columns:1fr;gap:.4rem}}
.dag:hover h4{color:var(--envelop)}
.dag .nr{font-family:'IBM Plex Mono',monospace;color:var(--rood);font-weight:600;font-size:.85rem;letter-spacing:.08em}
.dag h4{font-family:'Besley',serif;font-weight:800;font-size:1.35rem;line-height:1.25;transition:color .15s}
.dag p{color:#3d4a54;font-size:.95rem;margin-top:.3rem;max-width:64ch}
.dag .datum{font-family:'IBM Plex Mono',monospace;font-size:.75rem;color:#5a6570;white-space:nowrap}

/* ── artikelpagina ── */
article.stuk{padding:3rem 0 4rem;max-width:720px;margin:0 auto;width:92vw}
.stuk .eyebrow{font-family:'IBM Plex Mono',monospace;font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;color:var(--rood);font-weight:600}
.stuk h1{font-family:'Besley',serif;font-weight:900;font-size:clamp(2rem,5vw,3.1rem);line-height:1.1;margin:.6rem 0 1rem}
.stuk .meta{font-family:'IBM Plex Mono',monospace;font-size:.78rem;color:#5a6570;border-bottom:1px solid var(--lijn);padding-bottom:1.2rem;margin-bottom:2rem}
.stuk p{margin-bottom:1.2rem}
.stuk h2{font-family:'Besley',serif;font-weight:800;font-size:1.5rem;margin:2.2rem 0 .8rem}
.stuk .kader{background:#fff;border:1px solid var(--lijn);border-left:5px solid var(--envelop);padding:1.2rem 1.4rem;margin:1.6rem 0;border-radius:0 6px 6px 0}
.stuk .kader .k-lbl{font-family:'IBM Plex Mono',monospace;font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--envelop);margin-bottom:.4rem}
.stuk table{width:100%;border-collapse:collapse;margin:1.4rem 0;font-size:.95rem}
.stuk th{font-family:'IBM Plex Mono',monospace;font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;text-align:left;border-bottom:2px solid var(--inkt);padding:.5rem .6rem}
.stuk td{border-bottom:1px solid var(--lijn);padding:.55rem .6rem}
.stuk td.cijfer{font-family:'IBM Plex Mono',monospace;text-align:right}
.stuk .terug{display:inline-block;margin-top:2rem;font-family:'IBM Plex Mono',monospace;font-size:.85rem;text-decoration:none;border:2px solid var(--inkt);color:var(--inkt);padding:.5rem 1rem;border-radius:4px}
.stuk .terug:hover{background:var(--inkt);color:var(--papier)}

/* ── voet ── */
footer.voet{background:var(--envelop-diep);color:#c9d8e4;padding:2.4rem 0;font-size:.85rem}
footer.voet .wrap{display:grid;grid-template-columns:2fr 1fr;gap:2rem}
@media(max-width:720px){footer.voet .wrap{grid-template-columns:1fr}}
footer.voet strong{color:#fff;font-family:'Besley',serif;font-size:1.1rem;display:block;margin-bottom:.4rem}

/* ── masthead-nav ── */
.mast-nav{display:flex;gap:1.4rem;margin-top:1.1rem;font-family:'IBM Plex Mono',monospace;font-size:.78rem;letter-spacing:.08em;text-transform:uppercase}
.mast-nav a{color:var(--inkt);text-decoration:none;border-bottom:2px solid var(--rood);padding-bottom:2px}
.mast-nav a:hover{color:var(--rood)}

/* ── aanklacht ── */
.aanklacht{margin:2.8rem 0 0;border-top:2px solid var(--inkt)}
.aanklacht .a-kop{font-family:'IBM Plex Mono',monospace;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:#5a6570;padding:.6rem 0 1rem}
.a-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--lijn);border:1px solid var(--lijn)}
@media(max-width:900px){.a-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.a-grid{grid-template-columns:1fr}}
.a-item{background:#fff;padding:1.3rem 1.2rem}
.a-item .a-cijfer{font-family:'Besley',serif;font-weight:900;font-size:2.1rem;color:var(--rood);line-height:1}
.a-item p{font-size:.9rem;color:#3d4a54;margin-top:.55rem;line-height:1.5}
.a-item p strong{color:var(--inkt)}

/* ── manifest-oproep ── */
.oproep{margin:2.6rem 0 .4rem;background:var(--envelop-diep);color:var(--papier);border-radius:6px;padding:1.8rem 2rem;display:flex;justify-content:space-between;align-items:center;gap:1.5rem;flex-wrap:wrap}
.oproep .o-tekst{font-family:'Besley',serif;font-weight:800;font-size:clamp(1.2rem,2.6vw,1.65rem);line-height:1.2;max-width:30ch}
.oproep a{font-family:'IBM Plex Mono',monospace;font-size:.85rem;letter-spacing:.1em;text-transform:uppercase;color:var(--papier);text-decoration:none;border:2px solid var(--papier);border-radius:4px;padding:.7rem 1.3rem;white-space:nowrap}
.oproep a:hover{background:var(--papier);color:var(--envelop-diep)}