html{background:var(--hf-color-background,#fff)}body{margin:0}:root{--hf-color-primary:#12857e;--hf-color-secondary:#ffd84d;--hf-color-accent:#ef5d8f;--hf-color-background:#fbf7ef;--hf-color-surface:#ffffff;--hf-color-text:#23212b;--hf-color-border:#23212b;--hf-status-available:#2f9e5b;--hf-status-option:#f2a516;--hf-status-reserved:#f2a516;--hf-status-sold:#8d8a99;--hf-font-body:"Avenir Next","Segoe UI",system-ui;--hf-font-heading:"Avenir Next","Segoe UI",system-ui;--hf-radius:0;--hf-sticker-shadow:3px 3px 0 var(--hf-color-border);--hf-kaart-hoogte:760px}.woningzoeker{background:var(--hf-color-background);color:var(--hf-color-text);font-family:var(--hf-font-body),sans-serif;font-size:16px;line-height:1.45;margin:auto;max-width:1400px;padding:20px}.woningzoeker *{box-sizing:border-box}.woningzoeker button{font:inherit}.woningzoeker [hidden]{display:none!important}.werkvlak{align-items:stretch;display:grid;gap:20px;grid-template-columns:minmax(0,1fr) 380px}.traceframe{aspect-ratio:var(--hf-beeldverhouding,1.39);background:#f1ebde;border:2px solid var(--hf-color-border);box-shadow:var(--hf-sticker-shadow);max-height:var(--hf-kaart-hoogte);width:100%;overflow:hidden;position:relative}.beeld{left:50%;position:absolute;top:50%;transform:translate(-50%,-50%)}.beeld img,.traceoverlay,.vorig-aanzicht{display:block;height:100%;inset:0;object-fit:contain;position:absolute;width:100%}.vorig-aanzicht{left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);z-index:0}.beeld img,.traceoverlay{z-index:1}.tracehost{height:100%;width:100%}.viewkeuze{display:flex;flex-wrap:wrap;gap:6px;left:20px;position:absolute;top:20px;z-index:5}.viewkeuze button,.kaartknop,.pijl{background:rgb(35 33 43 / 72%);border:0;color:#fff;cursor:pointer;font-size:14px;font-weight:600;padding:8px 12px;transition:background-color 0.15s ease}.viewkeuze button[aria-selected="true"]{background:var(--hf-color-primary)}.kaartknoppen{position:absolute;right:20px;top:20px;z-index:5}.kaartknop[aria-pressed="true"]{background:var(--hf-color-accent)}.pijl{align-items:center;display:flex;height:46px;justify-content:center;padding:0;position:absolute;top:50%;transform:translateY(-50%);width:46px;z-index:5}.pijl svg{fill:none;height:22px;stroke:currentColor;stroke-width:2.5;width:22px}.pijl.vorige{left:12px}.pijl.volgende{right:12px}.viewkeuze button:is(:hover,:focus-visible),.pijl:is(:hover,:focus-visible),.kaartknop:is(:hover,:focus-visible){background:var(--hf-color-primary)}.architect{background:var(--hf-color-secondary);border:2px solid var(--hf-color-border);bottom:14px;box-shadow:var(--hf-sticker-shadow);font-size:14px;right:14px;margin:0;padding:4px 10px;position:absolute;transform:rotate(2deg);z-index:5}.tracelabel{background:var(--hf-color-text);color:#fff;font-size:14px;line-height:1.3;max-width:260px;padding:6px 10px;pointer-events:none;position:absolute;white-space:pre-line;z-index:8}.pois{inset:0;pointer-events:none;position:absolute;z-index:3}.woningzoeker[data-poi="uit"] .pois,.woningzoeker.wisselt .pois{display:none}.poi{align-items:center;animation:poi-in 0.3s ease-out both;background:#fff;border:2px solid var(--hf-color-border);border-radius:50%;box-shadow:2px 2px 0 var(--hf-color-border);cursor:default;display:flex;font-size:14px;height:30px;justify-content:center;padding:0;pointer-events:auto;position:absolute;transform:translate(-50%,-50%);width:30px}.poi.teaser{background:var(--hf-color-secondary)}.poi .tip{background:var(--hf-color-text);bottom:calc(100% + 10px);color:#fff;font-size:13px;left:50%;line-height:1.35;opacity:0;padding:6px 10px;pointer-events:none;position:absolute;text-align:left;transform:translateX(-50%);transition:opacity 0.15s ease;width:200px}.poi .tip strong{display:block}.poi .tip::after{border:6px solid transparent;border-top-color:var(--hf-color-text);content:"";left:50%;position:absolute;top:100%;transform:translateX(-50%)}.poi:is(:hover,:focus-visible){z-index:2}.poi:is(:hover,:focus-visible) .tip,.poi.is-open .tip{opacity:1}.poi.onder .tip{bottom:auto;top:calc(100% + 10px)}.poi.onder .tip::after{border-bottom-color:var(--hf-color-text);border-top-color:transparent;bottom:100%;top:auto}@keyframes poi-in{from{transform:translate(-50%,-50%) scale(0.4)}}.legenda{display:flex;flex-wrap:wrap;gap:16px;font-size:14px;margin:12px 0 0}.legenda span::before,.status::before{background:var(--stip,var(--hf-status-sold));border:1.5px solid var(--hf-color-border);content:"";display:inline-block;height:11px;margin-right:6px;vertical-align:-1px;width:11px}[data-status="available"]{--stip:var(--hf-status-available)}[data-status="option"],[data-status="reserved"]{--stip:var(--hf-status-option)}[data-status="sold"]{--stip:var(--hf-status-sold)}.lijst{background:var(--hf-color-surface);border:2px solid var(--hf-color-border);box-shadow:var(--hf-sticker-shadow);display:flex;flex-direction:column;height:0;min-height:100%}.lijstkop{border-bottom:2px solid var(--hf-color-border);padding:16px 16px 12px}.lijstkop h2{font-family:var(--hf-font-heading),sans-serif;font-size:22px;margin:0}.teller{font-size:14px;margin:2px 0 10px;opacity:0.75}.chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}.chip{background:#fff;border:1.5px solid var(--hf-color-border);color:var(--hf-color-text);cursor:pointer;font-size:13px;padding:3px 9px}.chip[aria-pressed="true"]{background:var(--hf-color-text);color:#fff}.woningen{flex:1;overflow-y:auto;padding:8px 16px 16px}.groepkop{font-size:13px;font-weight:700;letter-spacing:0.06em;margin:14px 0 6px;text-transform:uppercase}.woningkaart{align-items:center;background:#fff;border:1.5px solid var(--hf-color-border);color:inherit;cursor:pointer;display:grid;gap:2px 12px;grid-template-columns:42px 1fr auto;margin-bottom:6px;padding:8px 10px;text-align:left;transition:transform 0.12s ease,box-shadow 0.12s ease;width:100%}.woningkaart:is(:hover,:focus-visible,.is-gemarkeerd),.woningkaart.is-actief{box-shadow:var(--hf-sticker-shadow);transform:translate(-2px,-2px)}.woningkaart.is-actief{background:#fff6d6}.woningkaart .nummer{align-items:center;background:var(--stip);border:1.5px solid var(--hf-color-border);color:#fff;display:flex;font-weight:700;grid-row:span 2;height:42px;justify-content:center;text-shadow:0 1px 1px rgb(0 0 0 / 35%)}.woningkaart .type{font-weight:700}.woningkaart .sub{font-size:13px;grid-column:2;opacity:0.75}.woningkaart .kaartprijs{font-weight:700;grid-column:3;grid-row:1 / span 2;text-align:right;white-space:nowrap}.woningkaart .kaartprijs small{display:block;font-size:12px;font-weight:400}.melding{padding:16px}.melding.fout{background:#ffe1e1;border:2px solid #b00020;margin-top:12px}.woningdetail{background:#fff;border:2px solid var(--hf-color-border);box-shadow:6px 6px 0 var(--hf-color-border);color:var(--hf-color-text);max-height:90vh;max-width:520px;padding:26px;width:calc(100% - 32px)}.woningdetail::backdrop{background:rgb(35 33 43 / 45%)}.woningdetail .sluiten{background:none;border:0;cursor:pointer;font-size:30px;line-height:1;position:absolute;right:14px;top:8px}.woningdetail h2{font-size:26px;margin:6px 0 0}.woningdetail .woningtype{font-size:18px;font-weight:600;margin:0}.woningdetail .deelgebied{margin:0;opacity:0.75}.woningdetail .prijs{font-size:22px;font-weight:700;margin:12px 0}.status{background:#fff;border:1.5px solid var(--hf-color-border);display:inline-block;font-size:13px;font-weight:700;padding:2px 8px}.kenmerken{display:grid;gap:4px 16px;grid-template-columns:auto 1fr;margin:12px 0}.kenmerken dt{opacity:0.75}.kenmerken dd{font-weight:600;margin:0}.notitie{background:var(--hf-color-secondary);border:1.5px solid var(--hf-color-border);margin:14px 0 0;padding:8px 12px;transform:rotate(-1deg)}.overtype{border-top:1.5px dashed var(--hf-color-border);margin:16px 0 0;padding-top:12px}.overtype strong{display:block}@media (max-width:1023px){.werkvlak{grid-template-columns:1fr}.traceframe{aspect-ratio:var(--hf-beeldverhouding,1.39);height:auto;max-height:72vh;width:100%}.lijst{height:auto;max-height:520px;min-height:0}}@media (max-width:600px){.woningzoeker{padding:12px}.viewkeuze{left:10px;top:10px}.viewkeuze button,.kaartknop{font-size:12px;padding:5px 8px}.kaartknoppen{right:10px;top:10px}.pijl{height:38px;width:38px}.pijl.vorige{left:6px}.pijl.volgende{right:6px}.poi{border-width:1.5px;box-shadow:none;font-size:10px;height:20px;width:20px}.poi .tip{width:160px}.architect{bottom:8px;font-size:11px;padding:2px 6px;right:8px}}@media (prefers-reduced-motion:reduce){.poi{animation:none}.woningkaart{transition:none}}