@font-face{font-family:Tanker;src:url(fonts/Tanker-Regular.ttf);font-display:swap}
@font-face{font-family:Mulish;src:url(fonts/Mulish-Light.ttf);font-weight:300;font-display:swap}
@font-face{font-family:Mulish;src:url(fonts/Mulish-Regular.ttf);font-weight:400;font-display:swap}
@font-face{font-family:Mulish;src:url(fonts/Mulish-SemiBold.ttf);font-weight:600;font-display:swap}
:root{--blauw:#2dafe6;--donker:#27348b;--geel:#ffb800;--g1:#169ad3;--g2:#5ebcd1;--vlak:#f4f8fb;--kaart:#fff;--inkt:#1f2a5a;--inkt2:#5c6488;--lijn:#dfe6ef}
*{box-sizing:border-box}
body.rp{margin:0;background:var(--vlak);color:var(--inkt);font:300 15px/1.5 Mulish,sans-serif}
.rp-kop{background:linear-gradient(135deg,var(--g1),var(--g2));color:#fff;padding:18px 24px 0}
.rp-top{display:flex;align-items:center;gap:16px;max-width:1180px;margin:0 auto;flex-wrap:wrap}
.rp-logo{background:#fff;border-radius:12px;padding:6px 10px;display:flex}.rp-logo img{height:30px}
.rp-merk{font:400 22px Tanker;letter-spacing:.5px;color:var(--geel)}
.rp-top .r{margin-left:auto;font-weight:600;font-size:14px}.rp-top .r a{color:#fff;opacity:.85;margin-left:12px}
.rp-top select{font:600 14px Mulish;border-radius:8px;border:0;padding:4px 8px;color:var(--donker)}
.rp-nav{max-width:1180px;margin:14px auto 0;display:flex;gap:4px;overflow-x:auto}
.rp-nav a{color:#fff;text-decoration:none;font:600 15px Mulish;padding:10px 16px;border-radius:12px 12px 0 0;opacity:.85;white-space:nowrap}
.rp-nav a.aan{background:var(--vlak);color:var(--donker);opacity:1}
.rp-main{max-width:1180px;margin:0 auto;padding:24px 16px}
.rp h1{font:400 40px/1 Tanker;letter-spacing:.5px;color:var(--donker);margin:0}
.rp h2{font:400 24px Tanker;color:var(--donker);margin:0 0 12px;letter-spacing:.4px}
.kop{display:flex;align-items:end;gap:20px;flex-wrap:wrap;margin-bottom:20px}
.aftel{background:var(--geel);color:var(--donker);border-radius:14px;padding:6px 14px;font:400 20px Tanker}
.grid{display:grid;grid-template-columns:repeat(12,1fr);gap:16px}
.card{background:var(--kaart);border-radius:20px;padding:20px;box-shadow:0 1px 3px rgba(39,52,139,.08)}
.c4{grid-column:span 4}.c6{grid-column:span 6}.c8{grid-column:span 8}.c12{grid-column:span 12}
@media(max-width:900px){.c4,.c6,.c8{grid-column:span 12}}
.leg{font-size:13px;color:var(--inkt2)}
.cijfers{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.cijf b{display:block;font:400 34px Tanker;color:var(--donker)}.cijf small{color:var(--inkt2)}
ul.taken,ul.verw,ul.nieuw,ul.hand,ul.win{list-style:none;margin:0;padding:0}
.taken li label{display:flex;gap:10px;align-items:center;padding:9px 0;border-bottom:1px solid var(--lijn);cursor:pointer}
.taken input{width:18px;height:18px;accent-color:var(--blauw);flex-shrink:0}.taken .d{font-weight:600;min-width:70px;color:var(--inkt2);font-size:13px}.taken .w{flex:1}
.taken li.af .w{text-decoration:line-through;color:var(--inkt2)}
.tag{font:600 12px Mulish;border-radius:10px;padding:2px 8px}.tag.regio{background:#fff3cc;color:#7a5600}.tag.ikpas{background:#e0f3fb;color:var(--donker)}
.verw li{display:flex;gap:12px;padding:7px 0 7px 16px;border-left:3px solid var(--blauw);margin-left:4px}.verw .d{min-width:84px;font-weight:600;font-size:13px;color:var(--inkt2)}
.nieuw li{padding:6px 0;border-bottom:1px solid var(--lijn)}.nieuw small{color:var(--inkt2);margin-left:6px}
.win li{display:flex;justify-content:space-between;padding:6px 0;border-bottom:1px solid var(--lijn)}.win b{font:400 20px Tanker;color:var(--donker)}
.tip{font-size:13px;margin:8px 0 14px}.tip a{color:var(--g1);font-weight:600}
.quote{font-weight:400;font-size:16px;margin:0 0 10px;color:var(--donker)}
.contact{display:flex;gap:14px;align-items:center}.av{width:52px;height:52px;border-radius:50%;background:var(--geel);display:grid;place-items:center;font:400 22px Tanker;color:var(--donker)}
.filters{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px}.f{border:1px solid var(--lijn);background:#fff;border-radius:20px;padding:7px 14px;font:600 14px Mulish;color:var(--inkt);cursor:pointer;text-decoration:none}.f.aan{background:var(--donker);color:#fff;border-color:var(--donker)}
.mats{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px}.mat{background:#fff;border-radius:20px;overflow:hidden;box-shadow:0 1px 3px rgba(39,52,139,.08);display:flex;flex-direction:column}
.thumb{aspect-ratio:4/3;display:grid;place-items:center;color:#fff;font:400 22px Tanker;letter-spacing:1px;background:linear-gradient(135deg,#169ad3,#5ebcd1);overflow:hidden}.thumb img{width:100%;height:100%;object-fit:contain;background:#eef3f8}
.mi{padding:12px 14px 14px;display:flex;flex-direction:column;flex:1}.mi b{display:block;font-weight:600;font-size:14px}.mi small{color:var(--inkt2);font-size:12px}
.let{display:inline-block;margin-top:6px;font:600 11px Mulish;background:#fff3cc;color:#7a5600;border-radius:8px;padding:2px 7px;align-self:flex-start}
.knop-rij{display:flex;gap:6px;margin-top:auto;padding-top:10px;flex-wrap:wrap}
.knop,button.knop{font:600 13px Mulish;border:0;border-radius:10px;padding:7px 12px;background:var(--blauw);color:#fff;cursor:pointer;text-decoration:none;display:inline-block}.knop.sec{background:#e0f3fb;color:var(--donker)}
.hand li{display:flex;gap:12px;align-items:center;padding:10px 0;border-bottom:1px solid var(--lijn);flex-wrap:wrap}.hand b{flex:1;font-weight:600;min-width:200px}.hand small{color:var(--inkt2)}
.leeg{color:var(--inkt2);font-size:14px;padding:20px;background:#fff;border-radius:20px}
table.beheer{width:100%;border-collapse:collapse;font-size:13px;background:#fff;border-radius:12px;overflow:hidden}table.beheer th,table.beheer td{padding:8px;border-bottom:1px solid var(--lijn);text-align:left}table.beheer td.ja{color:#0a7a4a;font-weight:600}
.qrkaart{margin-bottom:16px}.qrlijst{list-style:none;margin:12px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px}
.qrlijst li{display:flex;gap:12px;align-items:center;border:1px solid #e6e8f0;border-radius:14px;padding:10px}
.qrlijst img{background:#fff;flex:none}.qrlijst .knop-rij{margin-top:6px;padding-top:0}
.qrleeg{width:88px;height:88px;flex:none;display:flex;align-items:center;justify-content:center;border-radius:10px;background:#f2f3f7;color:var(--inkt2);font-size:13px}
.wwmelding{margin-bottom:16px;border:2px solid var(--geel)}.wwmelding .ww{font-family:ui-monospace,Menlo,monospace;font-size:17px;background:#fff7db;padding:2px 8px;border-radius:6px}
table.beheer form{display:inline}table.beheer small{display:block;margin-top:4px}
.let.eigen{background:#e3f4fc;color:var(--donker)}
.nieuw{font:600 11px Mulish;background:var(--geel);color:var(--donker);border-radius:8px;padding:2px 7px;vertical-align:middle;letter-spacing:0}
.stappen{list-style:none;margin:0 0 12px;padding:0;display:grid;gap:8px}.stappen li{display:flex;gap:10px;align-items:flex-start;font-size:14px}
.stappen b{flex:none;width:24px;height:24px;border-radius:50%;background:var(--blauw);color:#fff;display:grid;place-items:center;font:400 15px Tanker}
.cijfers.spook{opacity:.45;margin-bottom:12px}
.per-uiting{list-style:none;margin:12px 0 0;padding:0;display:grid;gap:6px;font-size:13px}.per-uiting li{display:grid;grid-template-columns:96px 1fr 36px;align-items:center;gap:8px}
.per-uiting i{display:block;height:8px;border-radius:4px;background:var(--blauw);min-width:2px}.per-uiting b{text-align:right;font-weight:600}
.telt{background:#e3f4fc;border-radius:14px;padding:12px 16px;margin:0 0 14px;font-size:14px}.telt a{color:var(--donker);font-weight:600}
