:root{
  --bg:#F1F5F9;
  --panel:rgba(255,255,255,.94);
  --panel-solid:#FFFFFF;
  --line:rgba(15,23,42,.06);
  --line-soft:rgba(15,23,42,.04);
  --glass:rgba(255,255,255,.88);
  --glass-strong:rgba(255,255,255,.94);
  --text:#0F172A;
  --dim:#475569;
  --muted:#64748B;
  --accent:#0D9488;
  --accent-soft:#CCFBF1;
  --accent-ring:rgba(13,148,136,.18);
  --ok:#059669;
  --ok-soft:#D1FAE5;
  --warn:#DC2626;
  --warn-soft:#FEE2E2;
  --shadow:0 4px 24px rgba(15,23,42,.08);
  --shadow-lg:0 16px 48px rgba(15,23,42,.12);
  --shadow-float:0 8px 32px rgba(15,23,42,.12),0 2px 8px rgba(15,23,42,.06);
  --r:16px;
  --map-bg:#E8EEF2;
  --surface:rgba(241,245,249,.65);
  --surface-strong:rgba(241,245,249,.85);
  --input-bg:rgba(241,245,249,.7);
  --input-focus:rgba(255,255,255,.95);
  --chip-bg:rgba(241,245,249,.7);
  --hover-lift:rgba(255,255,255,.95);
  --map-veil:linear-gradient(90deg, rgba(255,255,255,.28) 0%, transparent 44%);
  --premium-bg:linear-gradient(160deg, rgba(204,251,241,.55) 0%, rgba(241,245,249,.8) 100%);
  --modal-scrim:rgba(15,23,42,.4);
  --modal-bg:#fff;
  --code-bg:rgba(15,23,42,.06);
  --color-scheme:light;
}
html[data-theme="dark"]{
  --bg:#0B1220;
  --panel:rgba(15,23,42,.92);
  --panel-solid:#111827;
  --line:rgba(148,163,184,.12);
  --line-soft:rgba(148,163,184,.08);
  --glass:rgba(15,23,42,.82);
  --glass-strong:rgba(17,24,39,.92);
  --text:#F1F5F9;
  --dim:#94A3B8;
  --muted:#64748B;
  --accent:#2DD4BF;
  --accent-soft:rgba(45,212,191,.16);
  --accent-ring:rgba(45,212,191,.22);
  --ok:#34D399;
  --ok-soft:rgba(52,211,153,.14);
  --warn:#F87171;
  --warn-soft:rgba(248,113,113,.14);
  --shadow:0 4px 24px rgba(0,0,0,.35);
  --shadow-lg:0 16px 48px rgba(0,0,0,.45);
  --shadow-float:0 8px 32px rgba(0,0,0,.4),0 2px 8px rgba(0,0,0,.25);
  --map-bg:#1a2740;
  --surface:rgba(30,41,59,.72);
  --surface-strong:rgba(30,41,59,.88);
  --input-bg:rgba(30,41,59,.75);
  --input-focus:rgba(30,41,59,.95);
  --chip-bg:rgba(30,41,59,.8);
  --hover-lift:rgba(30,41,59,.98);
  --map-veil:linear-gradient(90deg, rgba(15,23,42,.38) 0%, transparent 48%);
  --premium-bg:linear-gradient(160deg, rgba(45,212,191,.12) 0%, rgba(30,41,59,.85) 100%);
  --modal-scrim:rgba(0,0,0,.55);
  --modal-bg:#111827;
  --code-bg:rgba(148,163,184,.12);
  --color-scheme:dark;
}
*{box-sizing:border-box;margin:0;padding:0}
html{color-scheme:var(--color-scheme)}
html,body{height:100%}
body{
  font-family:'Plus Jakarta Sans',system-ui,sans-serif;
  background:var(--bg);color:var(--text);
  overflow:hidden;
  -webkit-font-smoothing:antialiased;
}
@media (prefers-reduced-motion: reduce){*{transition:none!important;animation:none!important}}

/* ===== kaart ===== */
#map{position:fixed;inset:0;z-index:0;background:var(--map-bg)}
#map.map-overgang .leaflet-map-pane{
  opacity:0;
  filter:blur(2px);
  transform:scale(1.02);
  transition:opacity .22s ease, filter .22s ease, transform .22s ease;
}
#map:not(.map-overgang) .leaflet-map-pane{
  opacity:1;
  filter:blur(0);
  transform:scale(1);
  transition:opacity .45s ease, filter .45s ease, transform .55s cubic-bezier(.22,.9,.3,1);
}
.leaflet-tile{filter:none}
html[data-theme="dark"] .leaflet-tile{
  /* Lichtere, warmere dark map i.p.v. zware invert */
  filter: invert(.88) hue-rotate(180deg) brightness(1.28) contrast(.82) saturate(.55);
}
html[data-theme="dark"] #map::before{
  content:"";
  position:absolute;inset:0;z-index:350;pointer-events:none;
  background:
    radial-gradient(ellipse 80% 60% at 70% 45%, rgba(45,212,191,.07), transparent 55%),
    linear-gradient(180deg, rgba(15,23,42,.12), transparent 35%, rgba(15,23,42,.18));
}
.leaflet-control-attribution{
  background:var(--glass-strong)!important;color:var(--muted)!important;
  font-family:'Plus Jakarta Sans',sans-serif;font-size:10px!important;
  border-radius:8px 0 0 0;box-shadow:var(--shadow);
}
.leaflet-control-attribution a{color:var(--dim)!important}
.leaflet-control-zoom{border:none!important;margin:18px!important;box-shadow:var(--shadow)!important;border-radius:12px!important;overflow:hidden}
.leaflet-bottom.leaflet-left .leaflet-control-zoom{margin-bottom:28px!important}
.leaflet-control-zoom a{
  background:var(--glass-strong)!important;color:var(--text)!important;
  border:none!important;font-weight:600;
  width:36px!important;height:36px!important;line-height:36px!important;
  font-size:18px!important;
}
.leaflet-control-zoom a:hover{background:var(--hover-lift)!important}
.leaflet-control-zoom a + a{border-top:1px solid var(--line)!important}
.poi-tip{
  background:rgba(15,23,42,.92)!important;color:#fff!important;border:none!important;
  border-radius:8px!important;padding:6px 10px!important;
  font-family:'Plus Jakarta Sans',system-ui,sans-serif!important;
  font-size:.72rem!important;font-weight:600!important;line-height:1.35!important;
  box-shadow:0 4px 16px rgba(15,23,42,.2)!important;
}
.poi-tip::before{border-top-color:rgba(15,23,42,.92)!important}
.poi-tip .poi-meta{font-weight:500;opacity:.8}
.poi-ov,.poi-sm{cursor:pointer}
#map::after{
  content:"";position:absolute;inset:0;pointer-events:none;z-index:400;
  background:transparent;transition:background .45s ease;
}
body:has(.dossier.open) #map::after{
  background:var(--map-veil);
}

/* ===== bovenbalk ===== */
.top{
  position:fixed;top:0;left:0;right:0;z-index:20;
  display:flex;align-items:center;justify-content:space-between;
  padding:18px 24px;pointer-events:none;
}
.top-rechts{display:flex;align-items:center;gap:10px;pointer-events:auto}
.top-link{
  font-size:.78rem;font-weight:700;color:var(--dim);text-decoration:none;
  background:var(--glass);padding:6px 12px;border-radius:100px;
  box-shadow:var(--shadow-float);backdrop-filter:blur(16px);
  transition:color .15s;
}
.top-link:hover{color:var(--accent)}
.merk{
  font-size:1.2rem;font-weight:800;letter-spacing:-.03em;
  pointer-events:auto;color:var(--text);text-decoration:none;
  background:var(--glass-strong);border:none;
  padding:8px 14px;border-radius:100px;box-shadow:var(--shadow-float);
  backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
}
.merk i{color:var(--accent);font-style:normal;font-weight:700}
.top .tag{
  font-size:.72rem;color:var(--dim);font-weight:600;
  letter-spacing:.06em;text-transform:uppercase;
  background:var(--glass);border:none;
  padding:6px 12px;border-radius:100px;backdrop-filter:blur(16px);
  box-shadow:var(--shadow-float);
}
@media(max-width:640px){.top .tag{display:none}}

/* ===== zoek-etalage ===== */
.stage{
  position:fixed;inset:0;z-index:10;
  display:grid;
  grid-template-columns:minmax(300px,440px) 1fr;
  align-items:center;
  gap:24px;
  padding:88px 28px 28px;
  transition:opacity .45s ease, visibility .45s;
  pointer-events:none;
}
.stage > *{pointer-events:auto}
.stage.weg{opacity:0;visibility:hidden;pointer-events:none}
.kaart-ruimte{min-height:1px}
.etalage{
  position:relative;z-index:1;
  width:100%;text-align:left;
  background:var(--glass-strong);border:none;
  border-radius:20px;padding:28px 26px 24px;
  box-shadow:var(--shadow-lg);
  backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
}
.etalage h1{
  font-weight:800;font-size:clamp(1.65rem,3.2vw,2.15rem);
  line-height:1.12;letter-spacing:-.035em;margin-bottom:10px;color:var(--text);
}
.etalage h1 i{color:var(--accent);font-style:normal}
.etalage p{color:var(--dim);margin-bottom:20px;font-size:.92rem;line-height:1.55;font-weight:600}
.zoek{
  position:relative;text-align:left;
  background:var(--input-bg);border:none;border-radius:var(--r);
  box-shadow:inset 0 1px 3px rgba(15,23,42,.05);
}
.zoek input{
  width:100%;background:none;border:0;outline:none;color:var(--text);
  font-family:inherit;font-size:1rem;font-weight:500;
  padding:18px 52px 18px 20px;border-radius:var(--r);
}
.zoek input::placeholder{color:var(--muted)}
.zoek .lens{
  position:absolute;right:18px;top:50%;transform:translateY(-50%);
  color:var(--accent);font-size:1.15rem;pointer-events:none;font-weight:600;
}
.zoek:focus-within{
  background:var(--input-focus);
  box-shadow:inset 0 1px 3px rgba(15,23,42,.04),0 0 0 3px var(--accent-ring);
}
.sug{border-top:1px solid var(--line);display:none;max-height:280px;overflow-y:auto}
.sug button{
  display:flex;gap:10px;align-items:baseline;width:100%;text-align:left;padding:13px 20px;
  background:none;border:0;cursor:pointer;color:var(--text);font-family:inherit;font-size:.92rem;
}
.sug button small{color:var(--dim);font-weight:500}
.sug button:hover,.sug button:focus-visible,.sug button.actief{background:var(--accent-soft);outline:none}
.melding{
  margin-top:14px;display:none;font-size:.84rem;color:var(--warn);font-weight:500;
  background:var(--warn-soft);border:none;
  padding:12px 16px;border-radius:12px;text-align:left;line-height:1.5;
}
.melding a{color:var(--accent);font-weight:700}
.melding code{font-size:.78rem;background:var(--code-bg);padding:2px 6px;border-radius:4px;font-weight:600}

/* ===== dossierpaneel ===== */
.dossier{
  position:fixed;top:0;bottom:0;left:0;z-index:15;width:min(440px,100%);
  background:var(--glass-strong);
  border:none;
  box-shadow:var(--shadow-lg);
  backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
  transform:translateX(-105%);transition:transform .5s cubic-bezier(.22,.9,.3,1);
  display:flex;flex-direction:column;
}
.dossier.open{transform:translateX(0)}
.d-scroll{overflow-y:auto;padding:80px 24px 24px;flex:1}
.d-scroll::-webkit-scrollbar{width:5px}
.d-scroll::-webkit-scrollbar-thumb{background:var(--line);border-radius:3px}
.dossier-acties{
  position:absolute;top:18px;right:18px;z-index:2;
  display:flex;align-items:center;gap:8px;
}
.deel{
  background:var(--glass);border:none;color:var(--text);
  height:36px;padding:0 14px;border-radius:10px;cursor:pointer;
  font-size:.78rem;font-weight:700;font-family:inherit;
  box-shadow:var(--shadow);transition:all .18s;
  backdrop-filter:blur(12px);
}
.deel:hover{color:var(--accent);background:var(--hover-lift);box-shadow:var(--shadow-float)}
.deel.deel-ok{color:var(--ok)}
.sluit{
  background:var(--glass);border:none;color:var(--dim);
  width:36px;height:36px;border-radius:10px;cursor:pointer;font-size:.95rem;
  box-shadow:var(--shadow);transition:all .18s;
  backdrop-filter:blur(12px);
}
.sluit:hover{color:var(--accent);background:var(--hover-lift);box-shadow:var(--shadow-float)}
.eyebrow{
  font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;
  color:var(--accent);font-weight:700;margin-bottom:6px;
}
.d-adres{
  font-weight:800;font-size:1.65rem;line-height:1.15;
  letter-spacing:-.03em;margin-bottom:4px;
}
.d-plaats{color:var(--dim);font-size:.9rem;font-weight:500;margin-bottom:22px}

/* statistiek-tegels */
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:14px}
.stat{
  background:var(--surface);border:none;border-radius:14px;
  padding:14px 12px 12px;
}
.stat .n{
  font-size:1.35rem;font-weight:800;line-height:1;
  letter-spacing:-.02em;color:var(--text);
}
.stat .n.skelet{
  color:transparent;min-height:1.1em;min-width:3.2ch;
  background:linear-gradient(90deg,var(--line-soft),var(--line),var(--line-soft));
  background-size:200% 100%;animation:glim 1.2s infinite;border-radius:6px;
}
@keyframes glim{to{background-position:-200% 0}}
.stat .l{
  font-size:.65rem;letter-spacing:.06em;text-transform:uppercase;
  color:var(--dim);margin-top:6px;font-weight:600;
}
.chips{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:22px}
.chip{
  font-size:.72rem;font-weight:600;padding:5px 11px;border-radius:100px;
  border:none;color:var(--dim);background:var(--chip-bg);
}
.chip.g{color:var(--ok);background:var(--ok-soft)}

/* woz-blok */
.blok{
  background:var(--surface);border:none;
  border-radius:14px;padding:16px 18px;margin-bottom:12px;
}
.blok h3{
  font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;
  color:var(--dim);margin-bottom:12px;font-weight:700;
}
.woz-rij{display:flex;align-items:flex-end;justify-content:space-between;gap:14px}
.woz-n{font-size:1.75rem;font-weight:800;line-height:1;letter-spacing:-.03em}
.woz-n small{
  display:block;font-family:inherit;font-size:.68rem;color:var(--dim);
  margin-top:6px;letter-spacing:0;font-weight:600;
}
.woz-delta{font-size:.78rem;font-weight:700;color:var(--ok);font-variant-numeric:tabular-nums}
.woz-spark{
  position:relative;margin-top:10px;cursor:ew-resize;
  touch-action:none;outline:none;border-radius:10px;
}
.woz-spark:focus-visible{box-shadow:0 0 0 2px var(--accent-ring)}
#spark{width:100%;height:72px;overflow:visible;display:block}
#spark path.lijn{fill:none;stroke:var(--accent);stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}
#spark path.vlak{fill:url(#gg);stroke:none}
#spark .woz-punt{fill:var(--accent);opacity:.35;pointer-events:none}
#spark .woz-gids{
  stroke:var(--accent);stroke-width:1.25;stroke-dasharray:3 3;opacity:.55;pointer-events:none;
}
#spark .woz-knop{
  fill:#fff;stroke:var(--accent);stroke-width:2.5;
  filter:drop-shadow(0 1px 3px rgba(15,23,42,.18));
  pointer-events:none;
}
#spark text{font-family:inherit;font-size:9px;font-weight:700;fill:var(--dim)}
.woz-hint{
  font-size:.68rem;color:var(--muted);font-weight:600;margin-top:4px;
  letter-spacing:.01em;
}
.blok .status{font-size:.84rem;color:var(--dim);line-height:1.5;font-weight:500}
.blok .status a{color:var(--accent);font-weight:700}
.blok .status.f{color:var(--warn)}
.status-retry{
  display:inline-block;margin-left:6px;padding:0;border:0;background:none;
  color:var(--accent);font:inherit;font-weight:700;cursor:pointer;text-decoration:underline;
}

/* energielabel */
.el-inhoud{display:flex;align-items:center;gap:16px}
.el-badge{
  width:56px;height:56px;border-radius:14px;display:flex;align-items:center;justify-content:center;
  font-size:1.45rem;font-weight:800;color:#fff;letter-spacing:-.02em;flex-shrink:0;
  box-shadow:0 4px 12px rgba(15,23,42,.12);
}
.el-a{background:linear-gradient(135deg,#059669,#10b981)}
.el-b{background:linear-gradient(135deg,#65a30d,#84cc16)}
.el-c{background:linear-gradient(135deg,#ca8a04,#eab308)}
.el-d{background:linear-gradient(135deg,#ea580c,#f97316)}
.el-e{background:linear-gradient(135deg,#dc2626,#ef4444)}
.el-fg{background:linear-gradient(135deg,#991b1b,#b91c1c)}
.el-onbekend{background:#94a3b8}
.el-titel{font-weight:800;font-size:.95rem;letter-spacing:-.02em}
.el-meta{font-size:.78rem;color:var(--dim);font-weight:500;margin-top:4px;line-height:1.4}

/* monumenten */
.mon-top{display:flex;align-items:center;gap:16px}
.mon-badge{
  min-width:56px;height:56px;padding:0 10px;border-radius:14px;
  display:flex;align-items:center;justify-content:center;
  font-size:1.1rem;font-weight:800;color:#fff;flex-shrink:0;
}
.mon-ja{background:linear-gradient(135deg,#0f766e,#0d9488)}
.mon-buurt{background:linear-gradient(135deg,#0369a1,#0ea5e9);font-size:1.35rem}
.mon-nee{background:#94a3b8}
.mon-titel{font-weight:800;font-size:.95rem;letter-spacing:-.02em;line-height:1.25}
.mon-meta{font-size:.78rem;color:var(--dim);font-weight:500;margin-top:4px}
.mon-lijst{margin-top:12px;display:flex;flex-direction:column;gap:6px}
.mon-lijst a{
  font-size:.8rem;font-weight:600;color:var(--accent);text-decoration:none;
  padding:6px 0;border-top:1px solid var(--line);
}
.mon-lijst a:hover{text-decoration:underline}
.mon-lijst a small{color:var(--muted);font-weight:500}

/* cbs buurt */
.cbs-naam{font-weight:700;font-size:.88rem;margin-bottom:12px;color:var(--dim)}
.cbs-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.cbs-cel{
  background:var(--surface-strong);border-radius:10px;padding:10px 8px;text-align:center;
}
.cbs-v{font-weight:800;font-size:.92rem;letter-spacing:-.02em;line-height:1.2}
.cbs-l{font-size:.62rem;letter-spacing:.04em;text-transform:uppercase;color:var(--dim);font-weight:600;margin-top:4px}
.cbs-sub{
  font-size:.68rem;color:var(--dim);font-weight:600;margin-top:3px;
  line-height:1.2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.cbs-cel-adres{
  background:var(--accent-soft);
  grid-column:1 / -1;
  display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;
  gap:2px 12px;text-align:left;padding:12px 14px;align-items:center;
}
.cbs-cel-adres .cbs-v{grid-row:1 / 3;font-size:1.15rem}
.cbs-cel-adres .cbs-l{margin-top:0}
.cbs-cel-adres .cbs-sub{margin-top:0;white-space:normal}
@media(max-width:520px){.cbs-grid{grid-template-columns:repeat(2,1fr)}}

.ov-lijst{display:flex;flex-direction:column;gap:6px}
.ov-item{
  display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;
  padding:10px 12px;border-radius:10px;background:var(--surface-strong);color:inherit;
}
.ov-soort{
  font-size:.62rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;
  color:var(--accent);background:var(--accent-soft);padding:4px 7px;border-radius:6px;
}
.ov-naam{font-weight:700;font-size:.88rem;line-height:1.25}
.ov-afst{font-size:.78rem;color:var(--dim);font-weight:600;white-space:nowrap}

/* pdf-dossier */
.blok-premium{
  background:var(--premium-bg);
}
.blok-premium .status{margin-bottom:12px}
.premium-lijst{
  list-style:none;margin:0 0 16px;padding:0;
  font-size:.76rem;color:var(--dim);line-height:1.55;font-weight:500;
}
.premium-lijst li{padding-left:16px;position:relative;margin-bottom:2px}
.premium-lijst li::before{
  content:"✓";position:absolute;left:0;color:var(--accent);font-weight:700;font-size:.68rem;
}
.pdf-knop{
  display:flex;align-items:center;gap:14px;width:100%;
  padding:14px 16px;border:none;border-radius:14px;
  background:linear-gradient(135deg, #0d9488 0%, #0f766e 100%);
  color:#fff;font-family:inherit;cursor:pointer;
  box-shadow:0 4px 16px rgba(13,148,136,.32), inset 0 1px 0 rgba(255,255,255,.15);
  transition:transform .15s, box-shadow .15s, opacity .15s;
  text-align:left;
}
.pdf-knop:hover:not(:disabled):not(.is-disabled){
  transform:translateY(-1px);
  box-shadow:0 8px 24px rgba(13,148,136,.4), inset 0 1px 0 rgba(255,255,255,.15);
}
.pdf-knop:active:not(:disabled):not(.is-disabled){transform:translateY(0)}
.pdf-knop.is-disabled{opacity:.5;cursor:not-allowed;box-shadow:none;pointer-events:none}
.pdf-knop-icon{
  display:flex;align-items:center;justify-content:center;
  width:42px;height:42px;border-radius:11px;
  background:rgba(255,255,255,.18);flex-shrink:0;
}
.pdf-knop-text{display:flex;flex-direction:column;gap:2px;min-width:0}
.pdf-knop-text strong{font-size:.9rem;font-weight:800;letter-spacing:-.02em;line-height:1.2}
.pdf-knop-text small{font-size:.72rem;font-weight:500;opacity:.88;line-height:1.3}
.pdf-hint{font-size:.68rem;color:var(--muted);margin-top:10px;font-weight:500;line-height:1.4}

/* advies */
.advies{
  border:none;background:var(--accent-soft);
  border-radius:14px;padding:16px 18px;margin-top:0;
}
.advies h3{
  font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;
  color:var(--dim);margin-bottom:8px;font-weight:700;
}
.advies p{font-size:.84rem;color:var(--dim);line-height:1.5;font-weight:500}
.advies a{color:var(--accent);font-weight:700;text-decoration:none}
.d-voet a{color:var(--accent);text-decoration:none;font-weight:600}
.d-voet a:hover{text-decoration:underline}

/* premium modal */
.modal{
  position:fixed;inset:0;z-index:50;display:flex;align-items:center;justify-content:center;
  padding:20px;background:var(--modal-scrim);backdrop-filter:blur(4px);
  opacity:0;pointer-events:none;transition:opacity .2s;
}
.modal.open{opacity:1;pointer-events:auto}
.modal-inhoud{
  position:relative;background:var(--panel-solid);border-radius:18px;padding:28px 24px 24px;
  max-width:400px;width:100%;box-shadow:var(--shadow-lg);
}
.modal-sluit{
  position:absolute;top:14px;right:14px;background:none;border:none;
  font-size:1.1rem;color:var(--muted);cursor:pointer;padding:4px 8px;
}
.modal-sluit:hover{color:var(--text)}
.modal-inhoud .eyebrow{margin-bottom:4px}
.modal-titel{font-size:1.35rem;font-weight:800;letter-spacing:-.03em;margin-bottom:4px;line-height:1.15}
.modal-adres{font-size:.9rem;color:var(--dim);font-weight:500;margin-bottom:14px}
.modal-prijs{font-size:.84rem;margin-bottom:14px;font-weight:500;color:var(--dim)}
.modal-prijs strong{font-size:1.35rem;font-weight:800;color:var(--text);letter-spacing:-.02em}
.modal-inhoud .pdf-knop{justify-content:center;text-align:center;margin-top:12px}
.modal-inhoud .pdf-knop-text{align-items:center}
.modal-label{
  display:block;font-size:.68rem;letter-spacing:.06em;text-transform:uppercase;
  color:var(--dim);font-weight:700;margin-bottom:6px;
}
.modal-input{
  width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:12px;
  font-family:inherit;font-size:.9rem;font-weight:500;color:var(--text);
  background:var(--input-bg);outline:none;
}
.modal-input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-ring)}
.modal-fout{
  display:none;margin-top:8px;font-size:.78rem;color:var(--warn);font-weight:600;line-height:1.4;
}
.modal-fout[style*="block"],.modal-fout:not([hidden]){display:block}
.modal-klein{font-size:.68rem;color:var(--muted);margin-top:10px;line-height:1.5;font-weight:500}
.d-voet{
  padding:14px 24px;border-top:1px solid var(--line);
  font-size:.68rem;color:var(--muted);line-height:1.5;font-weight:500;
  background:transparent;
}

/* herzoek */
.herzoek{
  position:fixed;top:18px;left:calc(min(440px,100%) + 16px);z-index:16;display:none;
  background:var(--glass-strong);border:none;color:var(--text);
  font-family:inherit;font-weight:700;font-size:.84rem;padding:10px 16px;border-radius:100px;
  cursor:pointer;box-shadow:var(--shadow-float);transition:all .18s;
  backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
}
.herzoek:hover{color:var(--accent);background:var(--hover-lift);box-shadow:var(--shadow-lg)}
.dossier.open ~ .herzoek{display:block}
@media(max-width:900px){
  .stage{
    grid-template-columns:1fr;
    align-content:end;
    padding:72px 16px 20px;
  }
  .kaart-ruimte{display:none}
  .etalage{text-align:center}
}
@media(max-width:640px){
  .dossier{width:100%}
  .herzoek{left:auto;right:14px;top:auto;bottom:14px}
}

/* ===== thema-toggle ===== */
.thema-knop{
  display:inline-flex;align-items:center;justify-content:center;
  width:36px;height:36px;padding:0;border:none;border-radius:100px;
  background:var(--glass);color:var(--dim);cursor:pointer;
  box-shadow:var(--shadow-float);backdrop-filter:blur(16px);
  transition:color .15s, background .15s;
}
.thema-knop:hover{color:var(--accent);background:var(--hover-lift)}
.thema-knop svg{width:18px;height:18px;display:block}
.thema-knop .icoon-zon{display:none}
.thema-knop .icoon-maan{display:block}
html[data-theme="dark"] .thema-knop .icoon-zon{display:block}
html[data-theme="dark"] .thema-knop .icoon-maan{display:none}
html[data-theme="dark"] #spark .woz-knop{fill:#111827}