:root{--grond:#FFF7F2;--kaart:#FFF;--inkt:#182028;--zacht:#5A6875;--flauw:#8695A3;
      --koraal:#F4562A;--groen:#12B76A;--lijn:#EDE6E0;--rood:#C13B14}
*{box-sizing:border-box}
body{margin:0;background:var(--grond);color:var(--inkt);
     font-family:'Schibsted Grotesk','Helvetica Neue',Arial,sans-serif;-webkit-font-smoothing:antialiased}
.wrap{max-width:1120px;margin:0 auto;padding:0 20px}
h1{font-size:34px;line-height:1.15;letter-spacing:-.03em;font-weight:800;margin:0 0 8px}
.sub{font-size:17px;line-height:1.55;color:var(--zacht);margin:0 0 26px}
a{color:var(--koraal)}

.kop{background:#fff;border-bottom:1px solid var(--lijn)}
.kop .wrap{display:flex;align-items:center;justify-content:space-between;height:66px;gap:16px}
.merk{font-size:21px;font-weight:800;letter-spacing:-.04em;text-decoration:none;color:var(--inkt)}
.merk span{color:var(--koraal)}
.bewaard{font-size:13px;font-weight:700;color:#067647;background:#E4F7EE;border-radius:999px;padding:7px 14px}

.voortgangbalk{background:#fff;padding:16px 0 18px}
.vt{display:flex;justify-content:space-between;font-size:13.5px;color:var(--zacht);margin-bottom:9px}
.vt strong{color:var(--inkt)}
.baan{height:7px;border-radius:999px;background:var(--lijn);overflow:hidden}
.vul{height:7px;border-radius:999px;background:var(--koraal);transition:width .3s}

.kolommen{display:grid;grid-template-columns:1fr 320px;gap:34px;align-items:start;padding-top:34px;padding-bottom:60px}
.kaart{background:var(--kaart);border:2px solid var(--lijn);border-radius:20px;padding:34px 36px 30px}

.keuzes{display:flex;flex-direction:column;gap:10px}
.keuze{display:flex;align-items:center;gap:15px;border:2px solid var(--lijn);background:#fff;
       border-radius:15px;padding:17px 19px;cursor:pointer;transition:border-color .15s,background .15s}
.keuze:hover{border-color:#D9CFC7}
.keuze input{position:absolute;opacity:0;width:0;height:0}
.bol{width:23px;height:23px;border-radius:50%;border:2px solid #CFD6DD;background:#fff;flex:0 0 auto}
.keuze.aan{border-color:var(--koraal);background:#FEF3EF}
.keuze.aan .bol{border-color:var(--koraal);background:var(--koraal);box-shadow:inset 0 0 0 4px #fff}
.tekst strong{display:block;font-size:18px;line-height:1.3}
.tekst em{display:block;font-style:normal;font-size:14.5px;line-height:1.45;color:var(--zacht);margin-top:2px}

.lab{display:block;font-size:14.5px;font-weight:700;margin:18px 0 7px}
.veld{width:100%;background:#fff;border:2px solid var(--lijn);border-radius:13px;padding:15px 16px;
      font-size:17px;font-family:inherit;color:var(--inkt)}
.veld:focus{outline:0;border-color:var(--koraal)}
.veld::placeholder{color:#A7B4C0}
.veld.half{max-width:260px}
textarea.veld{line-height:1.55}
.bedragrij{display:flex;align-items:center;gap:12px}
.eur{font-size:34px;font-weight:800}
.bedrag{font-size:30px;font-weight:800;max-width:230px;padding:12px 14px}
.duo{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.duo .lab{margin-top:0}
.hint{font-size:14px;line-height:1.5;color:var(--flauw);margin:10px 0 0}
.fout{font-size:14.5px;font-weight:600;color:var(--rood);margin:8px 0 0}

.vondst{border:2px solid var(--lijn);background:var(--grond);border-radius:15px;padding:18px 20px;margin-top:16px;font-size:15px}
.vondst .vkop{font-weight:800;margin-bottom:10px;display:flex;gap:8px;align-items:center}
.vondst dl{display:grid;grid-template-columns:110px 1fr;gap:7px 14px;margin:0}
.vondst dt{color:var(--zacht)} .vondst dd{margin:0;font-weight:700}
.vondst .sig{margin-top:12px;padding-top:11px;border-top:1px solid var(--lijn);line-height:1.5}
.sig.goed{color:#067647} .sig.waarschuwing{color:var(--rood);font-weight:600} .sig.neutraal{color:var(--flauw)}

.zone{display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;cursor:pointer;
      border:2px dashed #D9CFC7;background:#FFFDFB;border-radius:17px;padding:34px 24px}
.zone:hover{border-color:var(--koraal);background:#FEF9F6}
.zone.over{border-color:var(--koraal);background:#FEF3EF}
.cirkel{width:48px;height:48px;border-radius:50%;background:#FDECE6;color:var(--koraal);
        display:flex;align-items:center;justify-content:center;font-size:22px;font-weight:800;margin-bottom:8px}
.zone strong{font-size:18px} .zone em{font-style:normal;font-size:14.5px;color:var(--zacht)}
.lijst{list-style:none;padding:0;margin:14px 0 0}
.lijst li{font-size:15px;padding:9px 0;border-bottom:1px solid var(--lijn);color:#067647;font-weight:600}
.lijst span{float:right;color:var(--flauw);font-weight:400}
.of{display:flex;align-items:center;gap:14px;margin:20px 0 16px;color:var(--flauw);font-size:14px;font-weight:600}
.of::before,.of::after{content:"";height:1px;background:var(--lijn);flex:1}
.mailbox{background:var(--grond);border:2px solid var(--lijn);border-radius:15px;padding:18px 20px}
.mailbox strong{font-size:16.5px} .mailbox p{margin:5px 0 0;font-size:15px;line-height:1.5;color:var(--zacht)}

.afspraak{background:var(--grond);border:2px solid var(--lijn);border-radius:15px;padding:20px 22px;margin:22px 0 18px}
.afspraak>strong{font-size:16px;display:block;margin-bottom:12px}
.afspraak table{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
.afspraak td{padding:9px 0;font-size:15.5px;border-bottom:1px solid var(--lijn);color:var(--zacht)}
.afspraak td:last-child{text-align:right;font-weight:700;color:var(--inkt)}
.afspraak .min td:last-child,.afspraak td.min{color:var(--rood)}
.afspraak .plus td:last-child,.afspraak td.plus{color:#067647}
.afspraak tr.tot td{border-bottom:0;border-top:2px solid var(--inkt);font-size:19px;padding-top:13px}
.afspraak>p{font-size:14px;color:var(--flauw);margin:11px 0 0}

.akkoord{display:flex;gap:13px;align-items:flex-start;font-size:15.5px;line-height:1.55;color:var(--zacht);cursor:pointer}
.akkoord input{position:absolute;opacity:0;width:0;height:0}
.vink{width:23px;height:23px;border-radius:7px;border:2px solid #CFD6DD;background:#fff;flex:0 0 auto;margin-top:1px;position:relative}
.akkoord input:checked+.vink{background:var(--groen);border-color:var(--groen)}
.akkoord input:checked+.vink::after{content:"";position:absolute;left:7px;top:3px;width:5px;height:10px;
  border:solid #fff;border-width:0 3px 3px 0;transform:rotate(45deg)}
.akkoord.misgaat .vink{border-color:var(--rood)}

.knoppen{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:28px;padding-top:24px;border-top:1px solid var(--lijn)}
.door{background:var(--groen);color:#fff;border:0;border-radius:999px;font:800 18px/1 inherit;
      padding:19px 36px;cursor:pointer;box-shadow:0 6px 18px rgba(18,183,106,.32)}
.door:hover{background:#0EA05C}
.terug{background:#fff;border:2px solid #E2DAD3;border-radius:999px;font:700 15px/1 inherit;padding:15px 24px;cursor:pointer;color:var(--inkt)}
.gerust{font-size:14.5px;color:var(--flauw)}

aside{display:flex;flex-direction:column;gap:16px;position:sticky;top:20px}
.samenvatting{background:var(--inkt);color:#fff;border-radius:18px;padding:24px 22px}
.skop{font-size:12px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--koraal);margin-bottom:16px}
.reg{padding-bottom:13px;margin-bottom:13px;border-bottom:1px solid #2B3743}
.reg.laatste{border:0;margin:0;padding:0}
.reg span{display:block;font-size:13px;color:#A7B4C0;margin-bottom:2px}
.reg strong{font-size:15.5px;line-height:1.35}
.reg .groen{font-size:25px;color:var(--groen);font-variant-numeric:tabular-nums}
.gerustkaart{background:#fff;border:2px solid var(--lijn);border-radius:18px;padding:20px 22px;
             display:flex;flex-direction:column;gap:12px;font-size:15px;line-height:1.45;color:var(--zacht)}

@media(max-width:880px){
  .kolommen{grid-template-columns:1fr;gap:22px}
  aside{position:static;order:-1}
  /* op de telefoon geen brief boven het formulier: alleen het bedrag als opsteker */
  .brief-mini{display:none}
  .gerustkaart{display:none}
  .kaart{padding:26px 20px 24px;border-radius:16px}
  h1{font-size:27px}
  .duo{grid-template-columns:1fr}
  .door{width:100%;justify-content:center;padding:20px}
  .knoppen{flex-direction:column-reverse;align-items:stretch}
  .gerust{text-align:center}
}

.opt{display:inline-block;font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;
     background:#EDE6E0;color:#5A6875;border-radius:999px;padding:3px 8px;margin-left:7px;vertical-align:2px}

/* verwijzing naar de machtiging, direct onder het vinkje */
.machtiglink { margin: 10px 0 0 34px; font-size: 15px; }
.machtiglink a { color: #C13B14; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.machtiglink a:hover { color: #182028; }
@media (max-width: 720px) { .machtiglink { margin-left: 0; } }

/* De meelopende brief in de zijkolom: dezelfde taal als de echte sommatie */
.brief-mini{background:#FDFCF8;border:1px solid #E9E3D8;transform:rotate(1.1deg);
  box-shadow:0 22px 50px rgba(24,32,40,.16),0 3px 10px rgba(24,32,40,.07)}
.bm-kop{background:#0B1729;padding:12px 20px 10px;display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.bm-kop strong{font-size:11.5px;letter-spacing:.06em;color:#fff;font-weight:800}
.bm-kop span{font-size:7px;letter-spacing:.14em;color:#7F90AC;text-transform:uppercase;text-align:right}
.bm-goud{height:3px;background:#C9A227}
.bm-body{padding:18px 22px 20px}
.bm-regel{display:grid;grid-template-columns:62px 1fr;gap:8px;padding:4px 0;border-bottom:1px solid #F0EBE0;align-items:baseline}
.bm-regel span{font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:#98A3B5}
.bm-regel strong{font-weight:700;color:#16233B;font-size:12.5px;overflow-wrap:anywhere}
.bm-balken{margin:14px 0 4px}
.bm-balken i{display:block;height:7px;border-radius:2px;background:#E8E4DA;margin:7px 0}
.bm-groet{margin-top:12px;font-size:12px;line-height:1.5;color:#2A3648}
.bm-groet em{font-style:italic;font-weight:700;font-size:13px;color:#0B1729}
@media (max-width:900px){.brief-mini{max-width:420px;margin:0 auto;transform:rotate(-0.7deg)}}

/* honingpot: onzichtbaar voor mensen, onweerstaanbaar voor bots */
.tfnr{position:absolute;left:-9999px;top:-9999px;height:1px;overflow:hidden}