/* Cross Management Leadportaal. Huisstijl: zwart-wit met cyaan #00B8E0 als enige accent.
   Systeemlettertype (geen externe fonts: sneller en geen gegevens naar derden). */
:root{--cyaan:#00B8E0;--cyaan-d:#0090B0;--zwart:#111;--g1:#333;--g2:#555;--g3:#888;--lijn:#e4e7eb;--vlak:#f6f7f9;--wit:#fff;
  --ok:#1a7f37;--let:#b54708;--fout:#b42318}
*{box-sizing:border-box}
body{margin:0;background:var(--vlak);color:var(--zwart);font:15px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif}
a{color:var(--cyaan-d)}
.kop{background:var(--wit);border-bottom:1px solid var(--lijn)}
.kop-in{max-width:1180px;margin:0 auto;padding:12px 20px;display:flex;align-items:center;gap:24px}
.kop img{height:30px;width:auto;display:block}
.kop nav{display:flex;gap:4px;flex:1}
.kop nav a{color:var(--g1);text-decoration:none;padding:8px 12px;border-radius:8px;font-weight:600;font-size:14px}
.kop nav a.aan,.kop nav a:hover{background:var(--vlak);color:var(--zwart)}
.kop .wie{font-size:13px;color:var(--g2);display:flex;align-items:center;gap:10px}
.inhoud{max-width:1180px;margin:0 auto;padding:28px 20px 60px}
h1{font-size:24px;margin:0 0 4px;letter-spacing:-.2px}
h2{font-size:17px;margin:0 0 12px}
.sub{color:var(--g2);margin:0 0 22px}
.kaart{background:var(--wit);border:1px solid var(--lijn);border-radius:12px;padding:20px}
.raster{display:grid;gap:18px;align-content:start;align-items:start}
@media(min-width:900px){.raster-2{grid-template-columns:1.6fr 1fr}.raster-4{grid-template-columns:repeat(4,1fr)}}
.knop{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--zwart);background:var(--zwart);color:#fff;border-radius:8px;padding:9px 14px;font:inherit;font-weight:600;font-size:14px;cursor:pointer;text-decoration:none}
.knop:hover{background:#000}
.knop.accent{background:var(--cyaan);border-color:var(--cyaan)}
.knop.accent:hover{background:var(--cyaan-d)}
.knop.licht{background:var(--wit);color:var(--zwart);border-color:var(--lijn)}
.knop.wa{background:#25D366;border-color:#25D366}
.knop.gevaar{background:var(--wit);color:var(--fout);border-color:#f3c3be}
input,select,textarea{font:inherit;border:1px solid #cfd4da;border-radius:8px;padding:9px 11px;background:#fff;color:var(--zwart);width:100%}
input:focus,select:focus,textarea:focus{outline:2px solid var(--cyaan);outline-offset:0;border-color:var(--cyaan)}
label{display:block;font-size:13px;font-weight:600;color:var(--g1);margin:12px 0 4px}
table{width:100%;border-collapse:collapse;font-size:14px}
th{text-align:left;font-size:12px;text-transform:uppercase;letter-spacing:.6px;color:var(--g3);font-weight:600;padding:10px 12px;border-bottom:1px solid var(--lijn)}
td{padding:12px;border-bottom:1px solid var(--lijn);vertical-align:top}
tr.klik{cursor:pointer}
tr.klik:hover td{background:#fafbfc}
.ref{font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap}
.status{display:inline-block;font-size:12px;font-weight:700;border-radius:999px;padding:3px 10px;white-space:nowrap}
.s-nieuw{background:#e0f7fc;color:#006a82}
.s-gecontacteerd{background:#eef0f3;color:var(--g1)}
.s-bezichtiging{background:#fff4e5;color:var(--let)}
.s-onderhandeling{background:#fff4e5;color:var(--let)}
.s-deal{background:#e6f4ea;color:var(--ok)}
.s-afgevallen{background:#f3f4f6;color:var(--g3)}
.tabs{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:16px}
.tabs a{text-decoration:none;color:var(--g1);font-size:13px;font-weight:600;border:1px solid var(--lijn);background:#fff;border-radius:999px;padding:6px 12px}
.tabs a.aan{border-color:var(--zwart);background:var(--zwart);color:#fff}
.tabs .n{color:var(--g3);font-weight:500;margin-left:4px}
.tabs a.aan .n{color:#cfd4da}
.zoek{display:flex;gap:8px;margin-bottom:16px;max-width:420px}
.gegevens dt{font-size:12px;text-transform:uppercase;letter-spacing:.6px;color:var(--g3);margin-top:12px}
.gegevens dd{margin:2px 0 0;font-weight:500;word-break:break-word}
.tijdlijn{list-style:none;margin:0;padding:0}
.tijdlijn li{padding:10px 0;border-bottom:1px solid var(--lijn);font-size:14px}
.tijdlijn .wanneer{color:var(--g3);font-size:12px}
.cijfer{font-size:28px;font-weight:700;letter-spacing:-.5px}
.label{font-size:12px;text-transform:uppercase;letter-spacing:.6px;color:var(--g3)}
.melding{background:#e0f7fc;border:1px solid #b3ecf7;color:#004e60;padding:10px 14px;border-radius:8px;margin-bottom:16px}
.melding.fout{background:#fef3f2;border-color:#fecdca;color:var(--fout)}
.leeg{color:var(--g2);text-align:center;padding:40px 0}
.rij{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.klein{font-size:13px;color:var(--g2)}
.inlog{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px}
.inlog .kaart{width:100%;max-width:380px;padding:32px}
.inlog img{height:36px;margin-bottom:24px}
.accentlijn{height:3px;background:var(--cyaan)}
@media(max-width:720px){.kop-in{flex-wrap:wrap;gap:10px;justify-content:space-between}.kop nav{order:3;flex:0 0 100%;overflow-x:auto}.verberg-mobiel{display:none}td,th{padding:10px 8px}}
.vink{display:flex;align-items:center;gap:8px;font-weight:600}
.vink input{width:auto;margin:0}
.smal{max-width:540px}.tussen{justify-content:space-between}.geen-marge{margin:0}.niet-omslaan{flex-wrap:nowrap}
.maand{width:180px}.onder-12{margin-bottom:12px}.onder-16{margin-bottom:16px}.onder-18{margin-bottom:18px}
.boven-10{margin-top:10px}.boven-12{margin-top:12px}.boven-14{margin-top:14px}.boven-20{margin-top:20px}
.accenttekst{color:var(--cyaan-d)}.tabelkaart{padding:0;overflow-x:auto}.terug{margin:0 0 8px}
.behoud-regels{white-space:pre-wrap}.groei{flex:1}.breed{width:100%;justify-content:center}
/* Cijfers */
.trechter{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;margin-bottom:14px}
@media(min-width:900px){.trechter{grid-template-columns:repeat(6,1fr)}}
.trechter>div{border-left:3px solid var(--lijn);padding-left:12px}
.trechter>div:nth-child(5){border-left-color:var(--cyaan)}
.verschil{font-size:12px;font-weight:700;color:var(--g3)}
.verschil.plus{color:var(--ok)}.verschil.min{color:var(--fout)}
.onder-0{margin-bottom:0}.breek{word-break:break-word}
.tabelkaart h2{padding:18px 20px 0}
progress{width:70px;height:8px;vertical-align:middle;appearance:none;-webkit-appearance:none;border:0;border-radius:4px;background:var(--vlak);overflow:hidden}
progress::-webkit-progress-bar{background:var(--vlak);border-radius:4px}
progress::-webkit-progress-value{background:var(--cyaan);border-radius:4px}
progress::-moz-progress-bar{background:var(--cyaan);border-radius:4px}
.kans{display:inline-block;font-size:12px;font-weight:700;border-radius:999px;padding:3px 10px;white-space:nowrap;background:#eef0f3;color:var(--g1)}
.k-bijna-bovenaan,.k-werkt{background:#e6f4ea;color:var(--ok)}
.k-daler,.k-afhakers-bij-whatsapp{background:#fef3f2;color:var(--fout)}
.k-titel-trekt-niet,.k-bezoek-zonder-aanvragen{background:#fff4e5;color:var(--let)}
.k-gat-in-de-site{background:#e0f7fc;color:#006a82}
.balk{white-space:nowrap}
.kaart:not(.tabelkaart){overflow-x:auto}
.trechter .cijfer{font-size:24px}
.kansen{list-style:none;margin:0;padding:0}
.kansen li{display:grid;gap:6px;padding:12px 0;border-bottom:1px solid var(--lijn)}
@media(min-width:900px){.kansen li{grid-template-columns:190px 1.2fr 1fr;gap:18px;align-items:start}}
