@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;600;700&family=Inter:wght@400;500;600;700&display=swap');



:root{
  --kz-ink:#161A20; --kz-ink-soft:#5A6472; --kz-ink-faint:#8A93A0;
  --kz-accent:#F7A60B; --kz-accent-deep:#C97F00; --kz-accent-wash:#FFF8EC;
  --kz-paper:#fff; --kz-bg:#F4F5F7; --kz-line:#E4E7EC; --kz-line-soft:#EEF0F3;
  --kz-ok:#0A7D33; --kz-groen:#22C55E;
  --kz-radius:14px; --kz-radius-sm:10px;
  --kz-shadow:0 8px 24px rgba(16,24,40,.08); --kz-shadow-sm:0 2px 8px rgba(16,24,40,.05);
  --kz-sans:'Inter',system-ui,sans-serif; --kz-display:'Space Grotesk',var(--kz-sans);
  --kz-pad:clamp(16px,3.4vw,26px);
}

*{box-sizing:border-box}
body{margin:0;font-family:var(--kz-sans);color:var(--kz-ink);background:var(--kz-bg);
     -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}


html,body{height:100%}
.kz-shell{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column}
.kz-top{display:flex;align-items:center;justify-content:space-between;
        padding:14px clamp(16px,3.4vw,26px);background:var(--kz-ink);color:#fff;flex:0 0 auto}
.kz-mark{font-family:var(--kz-display);font-weight:700;font-size:17px;letter-spacing:-.01em;display:flex;align-items:center}
.kz-mark span{color:var(--kz-accent);margin-left:2px}
.kz-mark-txt{font-family:var(--kz-display);font-weight:700;font-size:17px;color:#fff}
.kz-mark-txt span{color:var(--kz-accent);margin-left:2px}
.kz-top-tag{font-size:12.5px;color:#c9cfd8;font-weight:600;letter-spacing:.02em}
.kz-foot{padding:14px 22px;text-align:center;color:var(--kz-ink-faint);font-size:12.5px;flex:0 0 auto}

.kz-main{flex:1 1 auto;width:100%;max-width:860px;margin:0 auto;padding:var(--kz-pad) var(--kz-pad) 48px;overflow-y:auto}
.kz-laden{text-align:center;color:var(--kz-ink-faint);padding:56px 0}

.kz-card{background:var(--kz-paper);border:1px solid var(--kz-line);border-radius:var(--kz-radius);
         box-shadow:var(--kz-shadow);padding:clamp(16px,3vw,22px)}
.kz-muted{color:var(--kz-ink-soft)}

.kz-logo-blok{display:flex;justify-content:flex-start;margin:0 0 12px}
.kz-logo-in{max-height:46px;max-width:210px;width:auto;height:auto;display:block}

.kz-reviews{display:flex;flex-direction:column;align-items:center;gap:5px;
            margin:0 0 14px;padding:9px 14px;background:var(--kz-paper);border:1px solid var(--kz-line);
            border-radius:var(--kz-radius-sm);box-shadow:var(--kz-shadow-sm)}
.kz-rev-items{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:6px 14px}
.kz-rev-tekst{font-size:13px;color:var(--kz-ink-soft);font-weight:600;text-align:center;width:100%}
.kz-rev-item{display:inline-flex;align-items:center;gap:5px;text-decoration:none;color:inherit;font-size:13px}
.kz-rev-item:hover .kz-rev-plat{text-decoration:underline}
.kz-rev-plat{font-weight:700;color:var(--kz-ink)}
.kz-rev-stars{color:var(--kz-accent);letter-spacing:1px;font-size:13.5px}
.kz-rev-score{color:var(--kz-ink-soft);font-size:12px}

.kz-progress{display:flex;gap:5px;margin-bottom:8px}
.kz-stap-tekst{font-size:12px;color:#6b7280;font-weight:600;margin-bottom:16px}
.kz-progress span{flex:1;height:5px;border-radius:999px;background:var(--kz-line);transition:background .2s}
.kz-progress span.done{background:var(--kz-accent)}
.kz-progress span.now{background:var(--kz-accent-deep)}

.kz-stephead{margin:0 0 4px;font-family:var(--kz-display);font-size:clamp(19px,3.4vw,22px);line-height:1.2}
.kz-stepsub{margin:0 0 18px;color:var(--kz-ink-soft);font-size:13.5px;line-height:1.5}

.kz-tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px}
.kz-tile{background:var(--kz-paper);border:1.5px solid var(--kz-line);border-radius:var(--kz-radius-sm);
         padding:16px 12px;text-align:center;cursor:pointer;transition:border-color .12s,box-shadow .12s,transform .06s}
.kz-tile:hover{border-color:var(--kz-accent);box-shadow:0 4px 14px rgba(247,166,11,.14)}
.kz-tile:active{transform:translateY(1px)}
.kz-tile.sel{border-color:var(--kz-accent);background:var(--kz-accent-wash);box-shadow:0 4px 14px rgba(247,166,11,.18)}
.kz-tile .emoji{font-size:30px;line-height:1;display:block;margin-bottom:8px}
.kz-tile img{width:100%;aspect-ratio:var(--kz-beeld-ratio, 4 / 3);height:auto;object-fit:contain;border-radius:8px;margin-bottom:8px}
.kz-tile .nm{font-weight:600;font-size:13.5px}

.kz-groep{margin-bottom:18px}
.kz-groep h3{font-family:var(--kz-display);font-size:14px;margin:0 0 9px;
             text-transform:uppercase;letter-spacing:.04em;color:var(--kz-ink-soft)}
.kz-checks{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:9px}
.kz-check{display:flex;align-items:center;gap:10px;background:var(--kz-paper);
          border:1.5px solid var(--kz-line);border-radius:var(--kz-radius-sm);padding:11px 13px;
          cursor:pointer;transition:border-color .12s,background .12s}
.kz-check:hover{border-color:var(--kz-accent)}
.kz-check.on{border-color:var(--kz-accent);background:var(--kz-accent-wash)}
.kz-check input{width:18px;height:18px;accent-color:var(--kz-accent);flex:0 0 auto}
.kz-check .nm{font-size:13.5px;font-weight:500}

.kz-seg{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}
.kz-seg button{flex:1;min-width:110px;padding:11px;border:1.5px solid var(--kz-line);
               border-radius:var(--kz-radius-sm);background:var(--kz-paper);font-weight:600;font-size:13.5px;
               cursor:pointer;transition:border-color .12s,background .12s}
.kz-seg button:hover{border-color:var(--kz-accent)}
.kz-seg button.on{border-color:var(--kz-accent);background:var(--kz-accent-wash);color:var(--kz-ink)}

.kz-fld{margin-bottom:12px}
.kz-fld label{display:block;font-size:12.5px;font-weight:600;margin-bottom:5px}
.kz-fld input{width:100%;padding:11px 13px;border:1.5px solid var(--kz-line);
              border-radius:var(--kz-radius-sm);font-size:15px;font-family:inherit;transition:border-color .12s}
.kz-fld input:focus{outline:none;border-color:var(--kz-accent);box-shadow:0 0 0 3px rgba(247,166,11,.12)}
.kz-grid2{display:grid;grid-template-columns:1fr 1fr;gap:11px}

.kz-samenvat{background:var(--kz-paper);border:1px solid var(--kz-line);border-radius:var(--kz-radius-sm);
             padding:15px 17px;margin-bottom:12px;box-shadow:var(--kz-shadow-sm)}
.kz-sec-h{margin:0 0 9px;font-size:13.5px;font-weight:700;color:var(--kz-ink)}
.kz-overzicht{width:100%;border-collapse:collapse}
.kz-overzicht td{padding:6px 0;font-size:13.5px;border-bottom:1px solid var(--kz-line-soft)}
.kz-overzicht td:first-child{color:var(--kz-ink-soft);width:42%}
.kz-overzicht tr:last-child td{border-bottom:0}
.kz-wijzig{margin-top:11px;background:transparent;border:1.5px solid var(--kz-line);border-radius:9px;
           padding:8px 15px;font-weight:600;font-size:13px;cursor:pointer;color:var(--kz-ink);transition:border-color .12s}
.kz-wijzig:hover{border-color:var(--kz-accent)}
.kz-woning-status{min-height:18px;margin:5px 0 2px}
.kz-woning-bezig{font-size:12.5px;color:var(--kz-ink-soft)}

.kz-nav{display:flex;justify-content:space-between;gap:10px;margin-top:22px}
.kz-btn{padding:12px 20px;border-radius:var(--kz-radius-sm);border:1.5px solid var(--kz-line);
        background:var(--kz-paper);font-weight:600;font-size:14.5px;font-family:inherit;cursor:pointer;
        transition:border-color .12s,background .12s,color .12s}
.kz-btn:hover{border-color:var(--kz-accent)}
.kz-btn.prim{background:var(--kz-accent);border-color:var(--kz-accent);color:var(--kz-ink)}
.kz-btn.prim:hover{background:var(--kz-accent-deep);border-color:var(--kz-accent-deep);color:#fff}
.kz-btn:disabled{opacity:.5;cursor:not-allowed}

.kz-result{display:grid;grid-template-columns:1.2fr 1fr;gap:16px}
.kz-prijsblok{background:var(--kz-ink);color:#fff;border-radius:var(--kz-radius);padding:20px}
.kz-prijsblok .lbl{color:#c9cfd8;font-size:12.5px}
.kz-prijsblok .groot{font-family:var(--kz-display);font-size:clamp(28px,5vw,34px);font-weight:700;margin:2px 0 12px}
.kz-prijsrij{display:flex;justify-content:space-between;padding:8px 0;border-top:1px solid rgba(255,255,255,.12);font-size:13.5px}
.kz-prijsrij.acc{color:var(--kz-accent);font-weight:700}
.kz-regel{display:flex;justify-content:space-between;font-size:13.5px;padding:6px 0;border-bottom:1px solid var(--kz-line-soft)}

.kz-badge-label{display:inline-block;background:var(--kz-groen,#22C55E);color:#000;border-radius:999px;
                padding:4px 12px;font-weight:700;font-size:12.5px;margin-top:8px}
.kz-slot{font-size:12px;color:var(--kz-ink-faint);margin-top:14px;line-height:1.55}

@media(max-width:820px){
  .kz-result{grid-template-columns:1fr}
  .kz-tiles{grid-template-columns:repeat(auto-fill,minmax(128px,1fr))}
}

@media(max-width:560px){
  .kz-grid2{grid-template-columns:1fr}
  .kz-tiles{grid-template-columns:1fr 1fr;gap:8px}
  .kz-checks{grid-template-columns:1fr}
  .kz-nav{margin-top:18px}
  .kz-nav .kz-btn{flex:1;text-align:center;padding:12px 12px}
  .kz-reviews{gap:5px 10px;padding:7px 10px}
  .kz-logo-in{max-height:40px;max-width:170px}
  .kz-tile .emoji{font-size:26px}
}

@media(max-width:380px){
  .kz-tiles{grid-template-columns:1fr}
}


body.kz-embed{background:transparent}
body.kz-embed .kz-shell{height:100%;min-height:100%}
body.kz-embed .kz-main{padding:16px 14px 28px}

.kz-uitleg{background:var(--kz-accent-wash);border:1px solid #F3D48A;
           border-radius:var(--kz-radius-sm);margin:0 0 14px;color:#6b5200}
.kz-uitleg-kop{display:flex;gap:9px;align-items:center;padding:9px 13px;cursor:pointer;
               font-size:13px;font-weight:600;list-style:none;user-select:none}
.kz-uitleg-kop::-webkit-details-marker{display:none}
.kz-uitleg-kop::after{content:'';margin-left:auto;width:7px;height:7px;border-right:2px solid #b8912f;
                      border-bottom:2px solid #b8912f;transform:rotate(45deg) translate(-2px,-2px);
                      transition:transform .18s}
.kz-uitleg[open] .kz-uitleg-kop::after{transform:rotate(-135deg) translate(-2px,-2px)}
.kz-uitleg-kop:hover{background:rgba(247,166,11,.08)}
.kz-uitleg-ico{flex:0 0 auto;width:19px;height:19px;border-radius:50%;background:var(--kz-accent);
               color:#fff;font-size:12px;font-weight:700;display:flex;align-items:center;justify-content:center}
.kz-uitleg-tekst{padding:0 13px 11px 41px;font-size:13px;line-height:1.5}






.kz-tiles{grid-template-columns:repeat(2, minmax(0, calc(var(--kz-beeld-grootte, 138px) + 27px)));
          justify-content:center;
          gap:var(--kz-beeld-ruimte-y, 20px) var(--kz-beeld-ruimte-x, 20px);
          margin-left:auto;margin-right:auto}
.kz-tile img{width:100%;aspect-ratio:var(--kz-beeld-ratio, 4 / 3);height:auto;object-fit:contain;
             border-radius:9px;margin-bottom:9px;background:var(--kz-line-soft);display:block}
.kz-tile.sel img{box-shadow:0 0 0 2px var(--kz-accent)}

.kz-checks{grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}
.kz-check.kz-check-beeld{flex-direction:column;align-items:stretch;gap:0;padding:0;overflow:hidden;
                         position:relative;text-align:center}
.kz-check-foto{display:block;width:100%;aspect-ratio:4/3;background:var(--kz-line-soft);overflow:hidden}
.kz-check-foto img{width:100%;height:100%;object-fit:contain;display:block;transition:transform .18s}
.kz-check.kz-check-beeld:hover .kz-check-foto img{transform:scale(1.04)}
.kz-check.kz-check-beeld .nm{display:block;padding:10px 12px;font-size:13.5px;font-weight:600}
.kz-check.kz-check-beeld input{position:absolute;top:9px;right:9px;width:22px;height:22px;
                               background:#fff;border-radius:6px;box-shadow:0 1px 4px rgba(0,0,0,.28);margin:0}
.kz-check.kz-check-beeld.on{border-color:var(--kz-accent);background:var(--kz-accent-wash)}

@media(max-width:560px){
  .kz-tile{padding:9px 7px}
  .kz-tile img{border-radius:8px;margin-bottom:7px}
  .kz-tile .nm{font-size:12.5px}
  .kz-checks{grid-template-columns:1fr 1fr}
  .kz-check.kz-check-beeld .nm{padding:8px 9px;font-size:12.5px}
}
@media(max-width:380px){
  .kz-checks{grid-template-columns:1fr 1fr}
  .kz-tile img{border-radius:8px}
}

.kz-nietgevonden{background:#FFF8EC;border:1px solid #F3D48A;border-radius:var(--kz-radius-sm);
                 padding:11px 13px;margin:2px 0 0;font-size:13px;line-height:1.5;color:#6b5200}
.kz-nav.kz-nav-2{justify-content:space-between;gap:10px}
.kz-nav.kz-nav-2 .kz-btn{flex:1}
@media(max-width:380px){.kz-nav.kz-nav-2{flex-direction:column}}
.kz-zoekreden{display:block;margin-top:6px;font-size:11.5px;color:#9a7b2e;opacity:.85}

.kz-tiles.kz-beeld-rond .kz-tile img{border-radius:50%;width:100%;
                                     margin-left:auto;margin-right:auto}
.kz-tiles.kz-beeld-rond .kz-tile.sel img{box-shadow:0 0 0 3px var(--kz-accent)}
.kz-tiles.kz-beeld-panorama .kz-tile{padding:12px 10px}
.kz-geenpand{margin:0;font-size:13px;line-height:1.5;color:#8A93A0}


.kz-check{position:relative;flex-direction:column;align-items:stretch;text-align:center;gap:0}
.kz-check-m2{display:block;font-size:11.5px;color:var(--kz-muted,#8A93A0);margin-top:2px}
.kz-tel{display:flex;align-items:center;justify-content:center;gap:10px;margin-top:8px}
.kz-tel button{width:30px;height:30px;border:1.5px solid var(--kz-line);background:#fff;border-radius:8px;
               font-size:17px;line-height:1;cursor:pointer;color:var(--kz-ink);padding:0;
               display:flex;align-items:center;justify-content:center;transition:border-color .12s}
.kz-tel button:hover:not(:disabled){border-color:var(--kz-accent)}
.kz-tel button:disabled{opacity:.35;cursor:default}
.kz-tel-nr{min-width:22px;text-align:center;font-weight:700;font-size:15px}
.kz-check.on .kz-tel-nr{color:var(--kz-accent)}
.kz-check.kz-check-beeld .kz-tel{padding:0 10px 10px}
.kz-check.kz-check-beeld .kz-check-m2{padding:0 10px}


.kz-check.kz-optie{flex-direction:row;align-items:center;justify-content:space-between;
                   text-align:left;gap:12px;padding:12px 14px}
.kz-check.kz-optie .nm{flex:1;min-width:0;font-size:13.5px;font-weight:600;line-height:1.35}
.kz-check.kz-optie .kz-tel{margin-top:0;flex:0 0 auto}
.kz-check.kz-optie.on::after{content:'';position:absolute;top:8px;right:10px;width:6px;height:11px;
                             border-right:2px solid var(--kz-accent);border-bottom:2px solid var(--kz-accent);
                             transform:rotate(45deg);opacity:.9}
.kz-check.kz-optie.on .nm{color:var(--kz-ink)}
.kz-groep .kz-checks:has(.kz-optie){grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:10px}

.kz-seg{display:flex;flex-wrap:wrap;gap:8px}
.kz-seg button{border:1.5px solid var(--kz-line);background:var(--kz-paper);border-radius:var(--kz-radius-sm);
               padding:10px 16px;font-size:13.5px;font-weight:600;color:var(--kz-ink);cursor:pointer;
               transition:border-color .12s,background .12s,box-shadow .12s}
.kz-seg button:hover{border-color:var(--kz-accent)}
.kz-seg button.on{border-color:var(--kz-accent);background:var(--kz-accent-wash);
                  box-shadow:0 2px 10px rgba(247,166,11,.16)}
.kz-optie-tekst{flex:1;min-width:0;display:block}
.kz-check.kz-optie .kz-check-m2{margin-top:1px}
.kz-samenvat-blok{margin-top:4px}
.kz-samenvat-blok .kz-prijsrij{border-bottom:1px solid var(--kz-line-soft,#EEF0F3)}
.kz-samenvat-blok .kz-prijsrij:last-child{border-bottom:0}
.kz-check-uitleg{display:block;font-size:12px;line-height:1.4;color:var(--kz-muted,#8A93A0);margin-top:3px}
.kz-check.kz-check-beeld .kz-check-uitleg{padding:0 10px}


.kz-spec{margin-top:16px;border-top:1px solid var(--kz-line);padding-top:14px}
.kz-spec-knop{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;
              background:var(--kz-paper);border:1.5px solid var(--kz-line);border-radius:var(--kz-radius-sm);
              padding:12px 14px;font-size:14px;font-weight:600;color:var(--kz-ink);cursor:pointer;
              font-family:inherit;transition:border-color .12s,background .12s}
.kz-spec-knop:hover{border-color:var(--kz-accent)}
.kz-spec-knop .pijl{color:var(--kz-accent);font-size:13px;transition:transform .2s ease}
.kz-spec-knop.open{border-color:var(--kz-accent);background:var(--kz-accent-wash)}
.kz-spec-knop.open .pijl{transform:rotate(180deg)}

.kz-spec-inhoud{padding:14px 2px 0}
.kz-spec-groep + .kz-spec-groep{margin-top:14px}
.kz-spec-groep h4{margin:0 0 6px;font-size:12px;font-weight:700;letter-spacing:.06em;
                  text-transform:uppercase;color:var(--kz-muted,#8A93A0)}
.kz-spec-rij{display:flex;align-items:baseline;gap:10px;padding:5px 0;
             border-bottom:1px solid var(--kz-line-soft,#EEF0F3);font-size:14px}
.kz-spec-groep .kz-spec-rij:last-child{border-bottom:0}
.kz-spec-rij .aantal{flex:0 0 auto;min-width:28px;font-weight:700;color:var(--kz-accent);
                     font-variant-numeric:tabular-nums}
.kz-spec-rij .naam{flex:1;min-width:0}
.kz-spec-slot{margin:14px 0 0;font-size:12.5px;line-height:1.5;color:var(--kz-muted,#8A93A0)}

@media(max-width:560px){
  .kz-spec-rij{gap:8px}
}



.kz-tile img,
.kz-check-foto img,
.kz-check-beeld img{object-fit:contain;background:var(--kz-paper,#F7F8FA)}
.kz-check-foto{background:var(--kz-paper,#F7F8FA)}

.kz-nav-slot{display:flex;gap:10px;justify-content:space-between;align-items:center}
.kz-nav-slot .kz-btn{flex:0 1 auto}
@media(max-width:480px){
  .kz-nav-slot{flex-direction:column-reverse;align-items:stretch}
  .kz-nav-slot .kz-btn{width:100%}
}
.kz-spec-rij .bedrag{flex:0 0 auto;font-weight:600;font-variant-numeric:tabular-nums}


.kz-merkslot{background:#FFF8EC;border:1px solid #F3DCA8;border-left:3px solid var(--kz-accent,#F7A60B);
             border-radius:10px;padding:13px 15px;margin-top:16px;font-size:13.5px;line-height:1.55}
.kz-merkslot b{display:block;font-size:14.5px;margin-bottom:5px;color:var(--kz-ink,#161A20)}
.kz-merkslot p{margin:0 0 5px;color:#4A5462}
.kz-merkslot p:last-child{margin-bottom:0;font-weight:650;color:var(--kz-ink,#161A20)}
.kz-merkslot.aan{background:#F1FAF4;border-color:#CFE8D9;border-left-color:var(--kz-groen,#22C55E)}
.kz-merkslot-knop{display:flex;align-items:center;gap:10px;margin-top:10px;flex-wrap:wrap}
.kz-merkslot-knop .kz-btn{padding:9px 16px;font-size:13.5px}
.kz-merkslot-aan{font-weight:700;color:#0A7D33;font-size:13.5px}
.kz-label-uitleg{font-size:11.5px;line-height:1.45;color:#8A93A0;margin:6px 0 0}

.kz-geg{margin-top:18px;padding-top:16px;border-top:1px solid var(--kz-line,#E4E7EC)}
.kz-geg-h{margin:0 0 6px;font-size:14px;font-weight:700;color:var(--kz-ink,#161A20)}
.kz-geg-h + .kz-feiten,.kz-geg-h + .kz-geg-p{margin-bottom:14px}
.kz-geg-p{margin:0;font-size:13.5px;line-height:1.6;color:var(--kz-ink-soft,#5A6472)}


.kz-labelkeuze{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:8px;margin-top:4px}
.kz-labelknop{padding:11px 10px;border:1.5px solid var(--kz-line,#E4E7EC);border-radius:9px;
              background:#fff;font-family:inherit;font-size:13.5px;font-weight:600;text-align:center;
              color:var(--kz-ink,#161A20);cursor:pointer;transition:border-color .12s,background .12s;
              white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kz-labelknop:hover{border-color:#C9CFD6}
.kz-labelknop.sel{border-color:var(--kz-accent,#F7A60B);background:#FFF8EC}
@media(max-width:520px){
  .kz-labelkeuze{grid-template-columns:repeat(auto-fit,minmax(104px,1fr));gap:7px}
  .kz-labelknop{padding:10px 6px;font-size:12.5px}
}

.kz-aanbetaling{margin-top:14px;padding:10px 12px;border-radius:10px;background:rgba(247,166,11,.14);border:1px solid rgba(247,166,11,.45);font-size:13px;line-height:1.5}
.kz-voorbehoud{margin-top:16px;padding-top:14px;border-top:1px solid rgba(255,255,255,.12)}
.kz-voorbehoud b{display:block;font-size:13px;font-weight:700;color:#fff;margin-bottom:4px}
.kz-voorbehoud p{margin:0;font-size:11.5px;line-height:1.55;color:#9AA4B0}

.kz-veldfout{margin:10px 0 0;font-size:13px;font-weight:600;color:#C0392B}


.kz-kleuren{display:grid;grid-template-columns:repeat(auto-fill,minmax(116px,1fr));gap:10px;margin-top:6px}


.kz-kleur{display:grid;grid-template-rows:64px 15px 30px 13px 15px;gap:3px;align-content:start;
          border:1.5px solid var(--kz-line,#E4E7EC);border-radius:11px;background:#fff;padding:8px;
          cursor:pointer;font-family:inherit;text-align:center;
          transition:border-color .12s,box-shadow .12s}
.kz-kleur:hover{border-color:#C9CFD6}
.kz-kleur.sel{border-color:var(--kz-accent,#F7A60B);background:#FFF8EC;
              box-shadow:0 0 0 3px rgba(247,166,11,.16)}
.kz-kleur .vlak{display:block;height:64px;border-radius:8px;background-size:cover;
                background-position:center;border:1px solid rgba(0,0,0,.09)}

.kz-kleur .ral{display:block;font-size:12px;font-weight:700;color:var(--kz-ink,#161A20);
               line-height:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kz-kleur .nm{display:block;font-size:11.5px;color:var(--kz-ink-soft,#5A6472);line-height:1.3;
              overflow:hidden}
.kz-kleur .soort{display:block;font-size:9.5px;font-weight:700;letter-spacing:.05em;
                 text-transform:uppercase;color:#8A93A0;line-height:13px;
                 white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.kz-kleur .gratis{display:inline-block;justify-self:center;align-self:center;
                  padding:1px 8px;border-radius:999px;background:#E9F7EE;color:#0A7D33;
                  font-size:9.5px;font-weight:700;letter-spacing:.03em;text-transform:uppercase;
                  white-space:nowrap}


.kz-kleuren[hidden],
.kz-kleur[hidden]{display:none}
.kz-kleuren-meer{margin-top:10px}


.kz-kleur.kz-meer{border-style:dashed;background:#FAFBFC}
.kz-kleur.kz-meer:hover{border-color:var(--kz-accent,#F7A60B);background:#FFF8EC}
.kz-kleur.kz-meer .vlak{display:flex;align-items:center;justify-content:center;background:#F1F3F6;
                        border-style:dashed}
.kz-kleur.kz-meer .plus{font-size:26px;font-weight:300;line-height:1;color:var(--kz-ink-soft,#5A6472)}
.kz-kleur.kz-meer:hover .plus{color:var(--kz-accent,#F7A60B)}

@media(max-width:520px){
  .kz-kleuren{grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:8px}
  .kz-kleur{grid-template-rows:52px 14px 28px 12px 14px;padding:6px}
  .kz-kleur .vlak{height:52px}
  .kz-kleur .nm{font-size:11px}
}

.kz-kleurcode{font-size:12px;color:var(--kz-ink-soft,#5A6472);font-weight:400}

.kz-uitvoering{flex-basis:100%;display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:10px;padding-top:10px;border-top:1px solid rgba(255,255,255,.12)}
.kz-uitv-kop{font-size:12px;opacity:.75;margin-right:4px}
.kz-uitv{padding:7px 14px;border-radius:999px;border:1.5px solid rgba(255,255,255,.25);background:transparent;color:inherit;font:inherit;font-size:13px;cursor:pointer;transition:border-color .15s,background .15s}
.kz-uitv:hover{border-color:rgba(247,166,11,.7)}
.kz-uitv.sel{border-color:#F7A60B;background:rgba(247,166,11,.16);font-weight:600}
.kz-gekozen{display:flex;flex-wrap:wrap;align-items:center;gap:12px;padding:12px 14px;border:1.5px solid var(--kz-accent,#F7A60B);
  border-radius:12px;background:#fff;margin-bottom:14px}
.kz-gekozen .vlak{width:44px;height:44px;border-radius:8px;background-size:cover;background-position:center;
  border:1px solid rgba(0,0,0,.1);flex:0 0 auto}
.kz-gekozen-tekst{flex:1 1 auto;font-size:14px;color:#1c2430}
.kz-gekozen-tekst b{font-weight:700}
.kz-wijzig{border:1px solid var(--kz-line,#e2e5ea);background:#fff;border-radius:8px;padding:8px 14px;
  font-weight:600;cursor:pointer;font-size:13px;color:#1c2430}
.kz-wijzig:hover{border-color:var(--kz-accent,#F7A60B)}
.kz-kleur.kz-minder .plus{font-size:26px;line-height:1}
