/**
 * Wij Makelaardij — Funda-stijl archief + single (2026-04-17)
 *
 *  Huisstijl:
 *   - Primair:  #12359b (blauw)
 *   - Accent:   #cea872 (goud)
 *   - Cream:    #efe2cf
 *   - Donker:   #363636 / #3e3e3e
 *
 *  Mobile-first. Breakpoints: 640, 768, 1024, 1280.
 */

:root {
    --wij-primary: #12359b;
    --wij-primary-dark: #0d2570;
    --wij-accent: #cea872;
    --wij-cream: #efe2cf;
    --wij-text: #1a1a1a;
    --wij-muted: #6b7280;
    --wij-border: #e5e7eb;
    --wij-bg-soft: #f7f8fa;
    --wij-radius: 6px;
    --wij-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
    --wij-shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.1);
    --wij-header-h: 120px; /* schatting — sticky offset */
}

/* -------- Reset / base -------- */

.wij-search *,
.wij-archive *,
.wij-single * {
    box-sizing: border-box;
}

.wij-single__inner,
.wij-archive__inner {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 16px;
}

@media (min-width: 768px) {
    .wij-single__inner,
    .wij-archive__inner {
        padding: 0 24px;
    }
}

/* -------- Buttons -------- */

.wij-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px 16px;
    font: 600 14px/1.2 inherit;
    border: 1px solid transparent;
    border-radius: var(--wij-radius);
    cursor: pointer;
    text-decoration: none;
    transition: all .15s ease;
    white-space: nowrap;
}

.wij-btn--primary { background: var(--wij-primary); color: #fff; }
.wij-btn--primary:hover { background: var(--wij-primary-dark); color: #fff; }
.wij-btn--outline { background: #fff; border-color: var(--wij-primary); color: var(--wij-primary); }
.wij-btn--outline:hover { background: var(--wij-primary); color: #fff; }
.wij-btn--ghost { background: transparent; color: var(--wij-text); border-color: var(--wij-border); }
.wij-btn--ghost:hover { background: var(--wij-bg-soft); }
.wij-btn--large { padding: 14px 24px; font-size: 16px; }

/* -------- Form controls -------- */

.wij-input,
.wij-select {
    width: 100%;
    padding: 10px 12px;
    font: 400 14px/1.3 inherit;
    background: #fff;
    border: 1px solid var(--wij-border);
    border-radius: var(--wij-radius);
    color: var(--wij-text);
}
.wij-input:focus,
.wij-select:focus {
    outline: none;
    border-color: var(--wij-primary);
    box-shadow: 0 0 0 3px rgba(18, 53, 155, .15);
}
.wij-select--block { display: block; }

/* -------- SEARCH BAR (sticky hero vervanger) -------- */

.wij-search {
    background: #fff;
    border-bottom: 1px solid var(--wij-border);
    box-shadow: var(--wij-shadow);
    padding: 28px 16px;
    margin-top: 120px; /* duwt de filter duidelijk onder de (sticky) site-header */
}
@media (min-width: 1024px) {
    .wij-search { margin-top: 140px; }
}
.wij-search--sticky { position: relative; }

/* =====================================================================
 * Zoekbalk v2 — schone 2-rijen layout
 * ===================================================================== */
.wij-search__form {
    max-width: 1280px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

/* Rij 1: primair (locatie + prijs + filter-knop + wissen) */
.wij-search__row--primary {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    align-items: stretch;
}

/* Rij 2: secundair (type + slaapkamers + oppervlak) */
.wij-search__row--secondary {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 10px;
}

@media (min-width: 768px) {
    .wij-search__row--primary {
        grid-template-columns: 2fr 1.5fr auto auto;
    }
}
@media (max-width: 767px) {
    /* Op mobile: secundaire rij verbergen — gebruik "Alle filters" drawer voor alle opties */
    .wij-search__row--secondary { display: none; }
}

/* Field wrapper — één samengesteld input-veld */
.wij-field {
    display: flex;
    align-items: stretch;
    background: #fff;
    border: 1px solid var(--wij-border);
    border-radius: 8px;
    overflow: hidden;
    transition: border-color .15s, box-shadow .15s;
    min-height: 46px;
}
.wij-field:focus-within {
    border-color: var(--wij-primary);
    box-shadow: 0 0 0 3px rgba(18, 53, 155, .12);
}
.wij-field__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 12px;
    color: var(--wij-muted);
    background: transparent;
    flex-shrink: 0;
}
.wij-field__input {
    flex: 1;
    min-width: 0;
    border: 0;
    background: transparent;
    padding: 0 8px;
    font: 400 14px/1.3 inherit;
    color: var(--wij-text);
    outline: none;
}
.wij-field__input::placeholder { color: var(--wij-muted); }
.wij-field__straal {
    flex-shrink: 0;
    border: 0;
    border-left: 1px solid var(--wij-border);
    background: #fff;
    padding: 0 10px;
    font: 500 13px/1 inherit;
    color: var(--wij-text);
    cursor: pointer;
    outline: none;
    min-width: 82px;
}
.wij-field__select {
    flex: 1;
    min-width: 0;
    border: 0;
    background: transparent;
    padding: 0 14px;
    font: 500 14px/1.3 inherit;
    color: var(--wij-text);
    cursor: pointer;
    outline: none;
    appearance: none;
    -webkit-appearance: none;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>");
    background-repeat: no-repeat;
    background-position: right 12px center;
    background-size: 14px 14px;
    padding-right: 32px;
}
.wij-field__select--compact {
    min-height: 44px;
    background-color: #fff;
    border: 1px solid var(--wij-border);
    border-radius: 8px;
}
.wij-field__select--compact:focus {
    border-color: var(--wij-primary);
    box-shadow: 0 0 0 3px rgba(18, 53, 155, .12);
}
.wij-field--price .wij-field__select { padding-right: 28px; }
.wij-field__sep {
    display: inline-flex;
    align-items: center;
    padding: 0 4px;
    color: var(--wij-muted);
    user-select: none;
}

/* Primary field (locatie met pin icon + input + straal dropdown) */
.wij-field--location { position: relative; }

/* Price field: twee selects met separator */
.wij-field--price > .wij-field__select {
    border-right: 1px solid var(--wij-border);
}
.wij-field--price > .wij-field__select:last-child {
    border-right: 0;
}
.wij-field--price > .wij-field__sep { display: none; } /* border doet t 'em */

/* "Alle filters" knop */
.wij-search__more {
    padding: 0 18px;
    min-height: 46px;
    border-radius: 8px;
    font: 600 14px/1 inherit;
    white-space: nowrap;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

/* Wissen link */
.wij-search__reset {
    background: transparent;
    border: 0;
    color: var(--wij-muted);
    font: 600 13px/1 inherit;
    cursor: pointer;
    padding: 0 10px;
    align-self: center;
    white-space: nowrap;
}
.wij-search__reset:hover { color: var(--wij-primary); }
@media (max-width: 767px) {
    .wij-search__reset { justify-self: end; padding: 6px 12px; }
}

/* Legacy labels — voorkom dat oude HTML ze toont */
.wij-search__label { display: none; }
.wij-search__field { display: contents; }

/* Tabs (Koop/Huur) — enkel in drawer nog */
.wij-tabs {
    display: inline-flex;
    border: 1px solid var(--wij-border);
    border-radius: 8px;
    overflow: hidden;
    background: #fff;
    width: 100%;
}
.wij-tab {
    flex: 1;
    padding: 10px 16px;
    background: transparent;
    border: 0;
    font: 600 13px/1 inherit;
    color: var(--wij-text);
    cursor: pointer;
    transition: all .15s;
}
.wij-tab.is-active { background: var(--wij-primary); color: #fff; }

.wij-range-inputs {
    display: flex;
    align-items: center;
    gap: 6px;
}
.wij-range-inputs .wij-input { min-width: 0; }

/* -------- Drawer (Alle filters) -------- */

.wij-drawer {
    position: fixed;
    inset: 0;
    z-index: 100;
    display: none;
    pointer-events: none;
}
.wij-drawer.is-open { display: block; pointer-events: auto; }
.wij-drawer__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, .45);
    cursor: pointer;
}
.wij-drawer__panel {
    position: absolute;
    inset: 0;
    background: #fff;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
}
@media (min-width: 768px) {
    .wij-drawer__panel {
        inset: 0 0 0 auto;
        width: 460px;
        box-shadow: var(--wij-shadow-lg);
    }
}
.wij-drawer__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 24px;
    border-bottom: 1px solid var(--wij-border);
}
.wij-drawer__head h2 { margin: 0; font: 600 18px/1 inherit; }
.wij-drawer__close {
    background: transparent;
    border: 0;
    font-size: 28px;
    line-height: 1;
    cursor: pointer;
    color: var(--wij-muted);
}
.wij-drawer__body { padding: 24px; flex: 1; display: flex; flex-direction: column; gap: 20px; }
.wij-drawer__foot {
    display: flex;
    gap: 12px;
    padding: 16px 24px;
    border-top: 1px solid var(--wij-border);
    background: var(--wij-bg-soft);
}
.wij-drawer__foot .wij-btn { flex: 1; }

.wij-filter-group { border: 0; padding: 0; margin: 0; }
.wij-filter-group legend { font: 600 14px/1 inherit; margin-bottom: 8px; }

.wij-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.wij-chip {
    padding: 6px 12px;
    border: 1px solid var(--wij-border);
    background: #fff;
    border-radius: 999px;
    font: 600 13px/1 inherit;
    cursor: pointer;
    color: var(--wij-text);
}
.wij-chip.is-active { background: var(--wij-primary); color: #fff; border-color: var(--wij-primary); }

.wij-check { display: inline-flex; align-items: center; gap: 8px; cursor: pointer; }

/* -------- ARCHIVE -------- */

.wij-archive { padding: 24px 16px 64px; background: var(--wij-bg-soft); }
.wij-archive__head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 20px;
}
.wij-archive__count { margin: 0; font: 600 20px/1.2 inherit; color: var(--wij-text); }
.wij-archive__count span { color: var(--wij-primary); }
.wij-archive__sort { display: flex; align-items: center; gap: 8px; }
.wij-archive__sort label { font-size: 13px; color: var(--wij-muted); }
.wij-archive__sort .wij-select { width: auto; min-width: 180px; }

/* Grid van 3 kolommen op desktop, 2 op tablet, 1 op mobile */
.wij-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 20px;
}
@media (min-width: 640px) {
    .wij-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 1024px) {
    .wij-grid { grid-template-columns: repeat(3, 1fr); gap: 24px; }
}

/* ====================================================================
 * Woning card v3.1 — robuuste fixed-height layout
 * Full-image background, tekst overlay onderaan met leesbare gradient.
 * ==================================================================== */
.wij-card {
    position: relative;
    height: 320px;               /* fixed height — voorspelbaar in alle contexts */
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .06);
    transition: transform .3s cubic-bezier(.2,.7,.3,1), box-shadow .3s;
    background: #1a1a1a;
}
.wij-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 24px rgba(18, 53, 155, .18);
}
.wij-card__link {
    display: block;
    position: absolute;
    inset: 0;
    text-decoration: none;
    color: #fff;
    overflow: hidden;
}
.wij-card__bg {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    background-color: #333;
    transition: transform .6s cubic-bezier(.2,.7,.3,1);
}
.wij-card:hover .wij-card__bg { transform: scale(1.06); }

/* Stevige gradient — zwart vanaf 40% tot onderaan voor leesbare tekst */
.wij-card__gradient {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg,
        rgba(0, 0, 0, 0) 0%,
        rgba(0, 0, 0, 0) 30%,
        rgba(0, 0, 0, .45) 60%,
        rgba(0, 0, 0, .85) 100%);
    pointer-events: none;
    transition: background .3s;
}
.wij-card:hover .wij-card__gradient {
    background: linear-gradient(180deg,
        rgba(0, 0, 0, 0) 0%,
        rgba(0, 0, 0, .15) 25%,
        rgba(0, 0, 0, .65) 55%,
        rgba(0, 0, 0, .9) 100%);
}

/* Status pill — Wij blauw, kleiner, niet uppercase, ruimere binnen-padding */
.wij-card__status {
    position: absolute;
    top: 14px;
    left: 14px;
    z-index: 3;
    background: var(--wij-primary);
    color: #fff;
    font: 600 10.5px/1 inherit;
    padding: 8px 16px;
    border-radius: 999px;
    text-transform: none;
    letter-spacing: .2px;
    box-shadow: 0 2px 6px rgba(0, 0, 0, .25);
}
.wij-card__status--beschikbaar { background: var(--wij-primary); }
.wij-card__status--onder-bod   { background: #d97706; }
.wij-card__status--ovb         { background: #b45309; }
.wij-card__status--verkocht    { background: #c8102e; }
.wij-card__status--verhuurd    { background: #c8102e; }
.wij-card__status--open        { background: var(--wij-accent); }

/* Gedempt beeld bij niet-beschikbaar */
.wij-card--verkocht .wij-card__bg,
.wij-card--verhuurd .wij-card__bg,
.wij-card--ovb .wij-card__bg { filter: saturate(.7) brightness(.9); }

.wij-card__content {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 18px 20px;
    z-index: 2;
    color: #fff;
}
/* Horizontale regel: address links, prijs rechts, op dezelfde baseline */
.wij-card__row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 0;
    transition: margin-bottom .3s;
    flex-wrap: nowrap;
}
.wij-card:hover .wij-card__row { margin-bottom: 10px; }

/* Legacy fallback (oude __top/__location classes uit eerdere render) */
.wij-card__top {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
}
.wij-card__location { min-width: 0; flex: 1 1 auto; }
/* `!important` overruled theme-CSS die blauw/donker erft vanuit globale p/h3 selectors */
.wij-card__city {
    margin: 0 0 4px !important;
    font: 700 11px/1.2 inherit !important;
    text-transform: uppercase;
    letter-spacing: .6px;
    color: rgba(255, 255, 255, .9) !important;
    text-shadow: 0 1px 3px rgba(0, 0, 0, .5);
    display: block;
}
.wij-card__address {
    margin: 0 !important;
    font: 600 16px/1.25 inherit !important;
    color: #ffffff !important;
    text-shadow: 0 1px 3px rgba(0, 0, 0, .7);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 0;
    flex: 1 1 auto;
}
.wij-card__price {
    flex: 0 0 auto;
    font: 700 15px/1.25 inherit !important;
    color: #ffffff !important;
    text-align: right;
    text-shadow: 0 1px 3px rgba(0, 0, 0, .7);
    white-space: nowrap;
}
.wij-card__specs li,
.wij-card__specs {
    color: #ffffff !important;
}

/* Specs onder: hidden op rust, slide up op hover (desktop) */
.wij-card__specs {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    transition: max-height .35s cubic-bezier(.2,.7,.3,1), opacity .25s;
}
.wij-card:hover .wij-card__specs {
    max-height: 40px;
    opacity: 1;
}
.wij-card__specs li {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font: 500 13px/1.2 inherit;
    color: #fff;
    text-shadow: 0 1px 3px rgba(0, 0, 0, .5);
}
.wij-card__specs .wij-ic {
    width: 15px;
    height: 15px;
    flex-shrink: 0;
}

/* Mobile / no-hover: specs altijd tonen */
@media (hover: none), (max-width: 768px) {
    .wij-card__specs { max-height: 40px; opacity: 1; }
    .wij-card__top { margin-bottom: 10px; }
}

/* Witte iconen (overlay op donker beeld) — voor card-specs */
.wij-ic--area-w { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffffff'><path d='M4 4h16v16H4V4zm2 2v12h12V6H6z'/><path d='M7 7h4v1H7zm0 2h3v1H7z' fill='%23ffffff'/></svg>"); }
.wij-ic--lot-w  { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffffff'><path d='M3 3h18v18H3V3zm2 2v14h14V5H5zm2 2h4v4H7V7zm6 0h4v4h-4V7zm-6 6h4v4H7v-4zm6 0h4v4h-4v-4z'/></svg>"); }
.wij-ic--bed-w  { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffffff'><path d='M21 10V7a2 2 0 0 0-2-2H5a2 2 0 0 0-2 2v3c-1.1 0-2 .9-2 2v7h2v-3h18v3h2v-7a2 2 0 0 0-2-2zm-12 0H5V7h4v3zm10 0h-8V7h8v3z'/></svg>"); }
.wij-ic--bath-w { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffffff'><path d='M7 14h14v2H7zM5 11V5a2 2 0 0 1 2-2h3v2H7v6h14v2H3v-2zM7 17v3h2v-3zm10 0v3h2v-3z'/></svg>"); }

.wij-card__img { display: none; }
/* Subtielere, kleinere status-badges. Kleur verschilt per status. */
.wij-card__badge {
    position: absolute;
    top: 10px;
    left: 10px;
    padding: 3px 8px;
    background: rgba(255, 255, 255, .95);
    color: var(--wij-text);
    font: 600 10px/1.4 inherit;
    border-radius: 3px;
    text-transform: uppercase;
    letter-spacing: .4px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .15);
}
.wij-card__badge--beschikbaar { background: rgba(255,255,255,.95); color: #2e7d32; }
.wij-card__badge--onder-bod   { background: rgba(255,255,255,.95); color: #d97706; }
.wij-card__badge--ovb         { background: rgba(255,255,255,.95); color: #b45309; }
.wij-card__badge--verkocht    { background: #c8102e; color: #fff; }
.wij-card__badge--verhuurd    { background: #c8102e; color: #fff; }
.wij-card__badge--open        { background: var(--wij-accent); color: #fff; }

/* Gedempte kaart voor niet-beschikbare woningen */
.wij-card--verkocht .wij-card__img,
.wij-card--verhuurd .wij-card__img,
.wij-card--ovb      .wij-card__img { opacity: .75; }

.wij-card__body { padding: 16px; }
.wij-card__price { font: 700 17px/1.2 inherit; color: var(--wij-primary); margin-bottom: 4px; }
.wij-card__address { font: 600 15px/1.3 inherit; margin: 0 0 2px; color: var(--wij-text); }
.wij-card__city { font-size: 13px; color: var(--wij-muted); margin-bottom: 12px; }
.wij-card__specs {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    gap: 16px;
    font-size: 13px;
    color: var(--wij-text);
}
.wij-card__specs li { display: inline-flex; align-items: center; gap: 4px; }

.wij-ic {
    display: inline-block;
    width: 14px;
    height: 14px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    vertical-align: -2px;
}
.wij-ic--area { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23363636'><path d='M3 3h18v18H3V3zm2 2v14h14V5H5z'/></svg>"); }
.wij-ic--lot { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23363636'><path d='M2 22V2h20v20H2zm2-2h16V4H4v16z'/><path d='M7 7h2v2H7zm4 0h2v2h-2zm4 0h2v2h-2zM7 11h2v2H7zm4 0h2v2h-2zm4 0h2v2h-2zM7 15h2v2H7zm4 0h2v2h-2zm4 0h2v2h-2z' fill='%23363636'/></svg>"); }
.wij-ic--bed  { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23363636'><path d='M21 10V7c0-1.1-.9-2-2-2H5c-1.1 0-2 .9-2 2v3c-1.1 0-2 .9-2 2v7h2v-3h18v3h2v-7c0-1.1-.9-2-2-2z'/></svg>"); }
.wij-ic--phone { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%2312359b'><path d='M6.6 10.8c1.4 2.7 3.6 5 6.3 6.3l2.1-2.1c.3-.3.7-.4 1.1-.3 1.2.4 2.5.6 3.8.6.6 0 1.1.4 1.1 1V20c0 .6-.4 1-1 1C9.9 21 3 14.1 3 5.6c0-.6.4-1 1-1h3.6c.6 0 1 .4 1 1 0 1.3.2 2.6.6 3.8.1.4 0 .8-.3 1.1l-2.1 2.1z'/></svg>"); }
.wij-ic--download { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%2312359b'><path d='M12 3v12m0 0l-4-4m4 4l4-4M5 21h14' stroke='%2312359b' stroke-width='2' fill='none' stroke-linecap='round'/></svg>"); }
.wij-ic--photos { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23fff'><path d='M3 5h18v14H3V5zm2 2v10h14V7H5zm2 2h10v6H7V9z'/></svg>"); }
.wij-ic--filter { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23fff'><path d='M4 6h16v2H4zM7 11h10v2H7zm3 5h4v2h-4z'/></svg>"); }

.wij-empty {
    grid-column: 1 / -1;
    text-align: center;
    padding: 48px 16px;
    color: var(--wij-muted);
}

.wij-loadmore-wrap { text-align: center; margin-top: 32px; }
.wij-loader {
    display: none;
    width: 32px;
    height: 32px;
    margin: 16px auto;
    border: 3px solid var(--wij-border);
    border-top-color: var(--wij-primary);
    border-radius: 50%;
    animation: wij-spin 1s linear infinite;
}
@keyframes wij-spin { to { transform: rotate(360deg); } }

/* Paginering */
.wij-pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    margin-top: 40px;
    flex-wrap: wrap;
}
.wij-pagination__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    height: 40px;
    padding: 0 12px;
    background: #fff;
    border: 1px solid var(--wij-border);
    border-radius: 8px;
    color: var(--wij-text);
    font: 600 14px/1 inherit;
    text-decoration: none;
    transition: all .15s;
}
.wij-pagination__btn:hover {
    border-color: var(--wij-primary);
    color: var(--wij-primary);
    transform: translateY(-1px);
}
.wij-pagination__btn.is-active {
    background: var(--wij-primary);
    border-color: var(--wij-primary);
    color: #fff;
    cursor: default;
}
.wij-pagination__btn.is-active:hover { transform: none; }
.wij-pagination__btn--nav { padding: 0 10px; }
.wij-pagination__gap {
    padding: 0 6px;
    color: var(--wij-muted);
    font-weight: 600;
}

/* -------- SINGLE -------- */

.wij-single { background: #fff; color: var(--wij-text); }

.wij-breadcrumb {
    padding: 12px 0;
    font-size: 13px;
    color: var(--wij-muted);
    border-bottom: 1px solid var(--wij-border);
}
.wij-breadcrumb a { color: var(--wij-muted); text-decoration: none; }
.wij-breadcrumb a:hover { color: var(--wij-primary); }
.wij-sep { margin: 0 6px; color: var(--wij-border); }

/* =========================================================
 * Galerij — Funda-stijl
 *  Desktop: 1 groot links + 2×2 tegels rechts (geen gaps tussen)
 *  Tablet:  hetzelfde maar kleinere tegels
 *  Mobile:  1 groot boven, 2×2 tegels eronder
 *
 *  Alle items zijn DIRECTE children van .wij-gallery__grid
 *  (geen nested wrapper — voorkomt display:contents bugs).
 * ========================================================= */
.wij-gallery { background: #fff; padding: 0; }

.wij-gallery__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 220px 220px;
    grid-template-areas:
        "main main"
        "tile1 tile2";
    gap: 4px;
    margin-top: 16px;
    position: relative;
    overflow: hidden;
    border-radius: var(--wij-radius);
}
/* Mobile: alleen main + 2 tegels zichtbaar; tegel 3+4 verbergen voor rust */
.wij-gallery__tile--3,
.wij-gallery__tile--4 { display: none; }

@media (min-width: 600px) {
    .wij-gallery__grid {
        grid-template-columns: 1fr 1fr;
        grid-template-rows: 180px 180px;
        grid-template-areas:
            "main main"
            "tile1 tile2"
            "tile3 tile4";
    }
    .wij-gallery__tile--3,
    .wij-gallery__tile--4 { display: block; }
}

@media (min-width: 900px) {
    .wij-gallery__grid {
        grid-template-columns: 2fr 1fr 1fr;
        grid-template-rows: 260px 260px;
        grid-template-areas:
            "main tile1 tile2"
            "main tile3 tile4";
    }
}

@media (min-width: 1200px) {
    .wij-gallery__grid {
        grid-template-rows: 300px 300px;
    }
}

.wij-gallery__main  { grid-area: main;  }
.wij-gallery__tile--1 { grid-area: tile1; }
.wij-gallery__tile--2 { grid-area: tile2; }
.wij-gallery__tile--3 { grid-area: tile3; }
.wij-gallery__tile--4 { grid-area: tile4; }

.wij-gallery__item {
    display: block;
    overflow: hidden;
    cursor: zoom-in;
    position: relative;
    background: #eee;
    min-width: 0;  /* voorkom grid-overflow */
    min-height: 0;
}
.wij-gallery__item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .4s ease;
}
.wij-gallery__item:hover img { transform: scale(1.04); }

.wij-gallery__more {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    background: rgba(0, 0, 0, .55);
    color: #fff;
    font: 600 14px/1 inherit;
    cursor: zoom-in;
    pointer-events: none; /* click passeert door naar <a> */
}

.wij-gallery__hidden { display: none; }

/* Layout */
.wij-single__layout {
    display: grid;
    grid-template-columns: 1fr;
    gap: 32px;
    padding: 32px 16px;
}
@media (min-width: 1024px) {
    .wij-single__layout {
        grid-template-columns: 1fr 360px;
        gap: 48px;
        padding: 48px 24px;
    }
}

.wij-single__main { min-width: 0; }

/* Title block */
.wij-title { margin-bottom: 32px; }
.wij-title h1 { font: 700 28px/1.2 inherit; margin: 0 0 8px; color: var(--wij-text); }
@media (min-width: 768px) { .wij-title h1 { font-size: 32px; } }
.wij-title__location { margin: 0 0 16px; color: var(--wij-muted); font-size: 16px; }
.wij-title__price {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 16px;
}
.wij-title__price-val { font: 700 26px/1 inherit; color: var(--wij-primary); }
.wij-title__status {
    background: #c8102e;
    color: #fff;
    padding: 4px 10px;
    border-radius: 3px;
    font: 600 11px/1.3 inherit;
    text-transform: uppercase;
    letter-spacing: .4px;
}
.wij-title__quick {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    gap: 24px;
    flex-wrap: wrap;
    padding-top: 16px;
    border-top: 1px solid var(--wij-border);
}
.wij-title__quick li { font-size: 14px; color: var(--wij-muted); }
.wij-title__quick strong { color: var(--wij-text); font-weight: 700; }
/* Energielabel kleuren — altijd witte letter voor consistent contrast */
.wij-energy-badge,
.wij-title__energy {
    background: #46b450;
    color: #fff !important;
    padding: 4px 8px;
    border-radius: 3px;
    font-weight: 700;
}
.wij-energy-a { background: #00a000 !important; color: #fff !important; }
.wij-energy-b { background: #46b450 !important; color: #fff !important; }
.wij-energy-c { background: #aacd20 !important; color: #fff !important; }
.wij-energy-d { background: #f2dc28 !important; color: #fff !important; }
.wij-energy-e { background: #f7a42c !important; color: #fff !important; }
.wij-energy-f { background: #f26b28 !important; color: #fff !important; }
.wij-energy-g { background: #d7342a !important; color: #fff !important; }

/* Subnav */
.wij-subnav {
    position: sticky;
    top: var(--wij-header-h);
    z-index: 20;
    background: #fff;
    border-bottom: 1px solid var(--wij-border);
    padding: 12px 0;
    margin-bottom: 32px;
    display: flex;
    gap: 20px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}
.wij-subnav a {
    white-space: nowrap;
    text-decoration: none;
    color: var(--wij-text);
    font: 600 14px/1 inherit;
    padding: 8px 0;
    border-bottom: 2px solid transparent;
}
.wij-subnav a:hover,
.wij-subnav a.is-active {
    color: var(--wij-primary);
    border-bottom-color: var(--wij-primary);
}

/* Sections */
.wij-section { margin-bottom: 48px; }
.wij-section h2 { font: 700 22px/1.2 inherit; margin: 0 0 16px; color: var(--wij-text); }
.wij-section h3 { font: 700 16px/1.2 inherit; margin: 0 0 12px; color: var(--wij-text); text-transform: uppercase; letter-spacing: .5px; }

/* Native <details> collapse — bulletproof (geen JS/CSS race) */
.wij-details { position: relative; }
.wij-details .wij-prose {
    line-height: 1.7;
    font-size: 15px;
    max-height: 220px;
    overflow: hidden;
    position: relative;
}
.wij-details[open] .wij-prose {
    max-height: none;
    overflow: visible;
}

/* Gradient fade-out onder text als details gesloten is */
.wij-details:not([open]) .wij-prose::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 80px;
    background: linear-gradient(to bottom, rgba(255,255,255,0), #ffffff);
    pointer-events: none;
}

.wij-prose p { margin: 0 0 1em; line-height: 1.7; }
.wij-prose p:last-child { margin-bottom: 0; }

/* Summary als primaire knop */
.wij-details__summary {
    list-style: none;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 14px;
    background: transparent;
    border: 0;
    color: var(--wij-primary);
    font: 600 14px/1 inherit;
    padding: 6px 0;
    text-decoration: underline;
    user-select: none;
}
.wij-details__summary::-webkit-details-marker { display: none; }
.wij-details__summary::before {
    content: 'Volledige omschrijving';
}
.wij-details[open] .wij-details__summary::before {
    content: 'Toon minder';
}
.wij-details__summary::after {
    content: '▾';
    display: inline-block;
    transition: transform .2s;
    font-size: 12px;
}
.wij-details[open] .wij-details__summary::after {
    transform: rotate(180deg);
}
.wij-details__summary:hover { color: var(--wij-primary-dark); }

/* Kenmerken */
.wij-kenmerk-group {
    margin-bottom: 24px;
    padding: 20px;
    background: var(--wij-bg-soft);
    border-radius: var(--wij-radius);
}
.wij-dl { margin: 0; }
.wij-dl dt {
    display: inline-block;
    width: 45%;
    padding: 8px 0;
    font-size: 14px;
    color: var(--wij-muted);
    vertical-align: top;
}
.wij-dl dd {
    display: inline-block;
    width: 54%;
    padding: 8px 0;
    margin: 0;
    font-size: 14px;
    color: var(--wij-text);
    vertical-align: top;
}
.wij-dl dt + dd { border-bottom: 1px solid var(--wij-border); }
.wij-dl dt { border-bottom: 1px solid var(--wij-border); }

.wij-energy-badge {
    display: inline-block;
    padding: 2px 10px;
    border-radius: 3px;
    font-weight: 700;
    color: #fff;
}

/* Plattegrond */
.wij-floorplans {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 16px;
}
.wij-floorplans a {
    display: block;
    background: #fff;
    border: 1px solid var(--wij-border);
    border-radius: var(--wij-radius);
    overflow: hidden;
    cursor: zoom-in;
}
.wij-floorplans img { width: 100%; height: auto; display: block; }

/* Kaart */
.wij-map {
    width: 100%;
    height: 400px;
    background: var(--wij-bg-soft);
    border-radius: var(--wij-radius);
    margin-bottom: 16px;
}
.wij-map-legend { display: flex; flex-wrap: wrap; gap: 8px; }
.wij-map-toggle {
    padding: 8px 14px;
    border: 1px solid var(--wij-border);
    background: #fff;
    border-radius: 999px;
    font: 600 13px/1 inherit;
    cursor: pointer;
    color: var(--wij-text);
}
.wij-map-toggle.is-active { background: var(--wij-primary); color: #fff; border-color: var(--wij-primary); }

/* Buurt */
.wij-buurt-loading, .wij-buurt-error { color: var(--wij-muted); font-style: italic; }
.wij-buurt-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 16px;
    margin-bottom: 12px;
}
.wij-buurt-item {
    display: flex;
    flex-direction: column;
    padding: 16px;
    background: var(--wij-bg-soft);
    border-radius: var(--wij-radius);
}
.wij-buurt-item .label { font-size: 12px; color: var(--wij-muted); text-transform: uppercase; letter-spacing: .5px; }
.wij-buurt-item .val { font: 600 16px/1.3 inherit; margin-top: 4px; }
.wij-buurt-source { font-size: 12px; color: var(--wij-muted); }

/* Aside / broker card */
.wij-single__aside { min-width: 0; }
.wij-broker {
    background: #fff;
    border: 1px solid var(--wij-border);
    border-radius: var(--wij-radius);
    padding: 24px;
    box-shadow: var(--wij-shadow);
    display: flex;
    flex-direction: column;
    gap: 12px;
}
@media (min-width: 1024px) {
    .wij-broker {
        position: sticky;
        top: calc(var(--wij-header-h) + 20px);
    }
}
.wij-broker__photo {
    width: 96px;
    height: 96px;
    border-radius: 50%;
    overflow: hidden;
    background: var(--wij-bg-soft);
    align-self: center;
}
.wij-broker__photo img { width: 100%; height: 100%; object-fit: cover; }
.wij-broker__info { text-align: center; margin-bottom: 8px; }
.wij-broker__name { font: 700 16px/1.2 inherit; color: var(--wij-text); }
.wij-broker__role { font-size: 13px; color: var(--wij-muted); }
.wij-broker__cta { width: 100%; justify-content: center; }
.wij-broker__phone-btn { width: 100%; justify-content: center; }
.wij-broker__phone-btn.is-revealed { background: var(--wij-cream); }
.wij-broker__phone-btn a { color: var(--wij-primary); text-decoration: none; font-weight: 700; }
.wij-broker__brochure {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 8px;
    color: var(--wij-primary);
    font: 600 13px/1 inherit;
    text-decoration: none;
    justify-content: center;
}

/* ====================================================================
 * Related carousel — slick met custom nav onder de slides
 * ==================================================================== */
.wij-related {
    padding: 56px 16px;
    background: var(--wij-bg-soft);
}
.wij-related h2 {
    margin: 0 0 28px;
    font: 700 22px/1.2 inherit;
    color: var(--wij-text);
}

.wij-related__carousel {
    margin: 0 -10px 24px;
    visibility: hidden; /* voorkom flash of unstyled content vóór slick init */
}
.wij-related__carousel.slick-initialized {
    visibility: visible;
}
.wij-related__slide {
    padding: 0 10px;
    outline: none;
}

/* Slick slides krijgen soms auto-height; zorg dat ze allemaal gelijk zijn */
.wij-related__carousel .slick-track {
    display: flex;
    align-items: stretch;
}
.wij-related__carousel .slick-slide {
    height: auto;
    float: none;
}
.wij-related__carousel .slick-slide > div {
    height: 100%;
}

/* Default slick pijlen verbergen */
.wij-related__carousel .slick-prev,
.wij-related__carousel .slick-next { display: none !important; }

/* Custom navigatie-bar onder de slides */
.wij-carousel-nav {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    margin-top: 8px;
}
.wij-carousel-nav__btn {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: #fff;
    border: 1px solid var(--wij-border);
    color: var(--wij-primary);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: all .2s;
    box-shadow: 0 2px 6px rgba(0, 0, 0, .06);
    padding: 0;
    flex-shrink: 0;
}
.wij-carousel-nav__btn:hover:not(:disabled) {
    background: var(--wij-primary);
    border-color: var(--wij-primary);
    color: #fff;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(18, 53, 155, .2);
}
.wij-carousel-nav__btn:disabled {
    opacity: .35;
    cursor: not-allowed;
}
.wij-carousel-nav__btn svg {
    width: 18px;
    height: 18px;
    stroke: currentColor;
    fill: none;
    stroke-width: 2.5;
    stroke-linecap: round;
    stroke-linejoin: round;
}

/* Dots container + dots zelf (slick render dots ALS UL in #wij-carousel-dots) */
.wij-carousel-nav__dots {
    display: inline-flex;
    align-items: center;
}
.wij-carousel-nav__dots .slick-dots,
.wij-carousel-nav__dots ul {
    display: inline-flex !important;
    align-items: center;
    gap: 8px;
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    position: static !important;
    width: auto !important;
    bottom: auto !important;
}
.wij-carousel-nav__dots li {
    width: 9px;
    height: 9px;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    display: block !important;
    transition: width .2s;
}
.wij-carousel-nav__dots li::before,
.wij-carousel-nav__dots li::marker { display: none !important; content: none !important; }
.wij-carousel-nav__dots li button {
    width: 9px !important;
    height: 9px !important;
    padding: 0 !important;
    border: 0 !important;
    background: var(--wij-border) !important;
    border-radius: 50% !important;
    text-indent: -9999px !important;
    cursor: pointer !important;
    transition: all .2s !important;
    display: block !important;
    font-size: 0 !important;
    box-shadow: none !important;
}
.wij-carousel-nav__dots li button:before { display: none !important; content: none !important; }
.wij-carousel-nav__dots li:hover button { background: var(--wij-muted) !important; }
.wij-carousel-nav__dots li.slick-active { width: 26px; }
.wij-carousel-nav__dots li.slick-active button {
    background: var(--wij-primary) !important;
    width: 26px !important;
    border-radius: 5px !important;
}

/* FAQ */
.wij-faq-section { padding: 48px 16px; }
.wij-faq-section h2 { margin: 0 0 24px; font: 700 22px/1.2 inherit; }
.wij-faq { max-width: 800px; margin: 0 auto; }
.wij-faq__item {
    border-bottom: 1px solid var(--wij-border);
    padding: 16px 0;
}
.wij-faq__item summary {
    cursor: pointer;
    font: 600 16px/1.4 inherit;
    list-style: none;
    position: relative;
    padding-right: 32px;
    color: var(--wij-text);
}
.wij-faq__item summary::-webkit-details-marker { display: none; }
.wij-faq__item summary::after {
    content: '+';
    position: absolute;
    right: 0;
    top: 0;
    font-size: 24px;
    color: var(--wij-primary);
    transition: transform .2s;
}
.wij-faq__item[open] summary::after { content: '−'; }
.wij-faq__answer { padding-top: 12px; color: var(--wij-text); line-height: 1.7; font-size: 15px; }

/* CTA bottom */
.wij-cta-bottom {
    background: var(--wij-primary);
    color: #fff;
    padding: 48px 16px;
    text-align: center;
}
.wij-cta-bottom h2 { color: #fff; margin: 0 0 8px; font: 700 24px/1.2 inherit; }
.wij-cta-bottom p { margin: 0 0 24px; opacity: .9; }
.wij-cta-bottom__actions { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }
.wij-cta-bottom .wij-btn--primary { background: var(--wij-accent); border-color: var(--wij-accent); color: var(--wij-text); }
.wij-cta-bottom .wij-btn--primary:hover { background: #b6914d; border-color: #b6914d; }
.wij-cta-bottom .wij-btn--outline { color: #fff; border-color: #fff; background: transparent; }
.wij-cta-bottom .wij-btn--outline:hover { background: rgba(255,255,255,.12); color: #fff; }

/* Hide woningaanbod-page margin inherit */
.woningaanbod-page { padding: 0 !important; }

/* =====================================================================
 * MOBILE AUDIT — verfijningen per viewport (2026-04-17)
 * ===================================================================== */

/* Mobile (<600px) */
@media (max-width: 599px) {
    .wij-single__inner,
    .wij-archive__inner { padding: 0 12px; }

    /* Card iets compacter op mobile */
    .wij-card { height: 280px; }
    .wij-card__content { padding: 14px 16px; }
    .wij-card__address { font-size: 15px !important; }
    .wij-card__price   { font-size: 14px !important; }
    .wij-card__city    { font-size: 10px !important; }

    /* Single hero gallery — korter op mobile */
    .wij-gallery__grid {
        grid-template-rows: 200px 160px !important;
    }

    /* Title block compact */
    .wij-title--v2 { margin-bottom: 24px; padding-bottom: 20px; }
    .wij-title__addr { font-size: 26px !important; }
    .wij-title__loc  { font-size: 15px; margin-bottom: 16px; }
    .wij-title__price { font-size: 26px !important; }
    .wij-title__specs { gap: 16px; }
    .wij-title__specs li { font-size: 13px; gap: 6px; }
    .wij-title__specs strong { font-size: 14px; }

    /* Sub-nav compact */
    .wij-subnav { padding: 10px 0; gap: 16px; }
    .wij-subnav a { font-size: 13px; padding: 6px 0; }

    /* Section titels kleiner */
    .wij-section { margin-bottom: 32px; }
    .wij-section h2 { font-size: 20px; margin-bottom: 14px; }
    .wij-section h3 { font-size: 14px; }

    /* Kenmerken groups: stack dl naar 1 kolom */
    .wij-kenmerk-group { padding: 16px; margin-bottom: 16px; }
    .wij-dl { grid-template-columns: 1fr; }
    .wij-dl dt {
        padding: 8px 0 2px !important;
        border-bottom: 0 !important;
        color: var(--wij-muted);
        font-size: 13px;
    }
    .wij-dl dd {
        padding: 0 0 10px !important;
        border-bottom: 1px solid var(--wij-border) !important;
        font-size: 15px;
    }

    /* Chips-bar horizontale scroll met snap */
    .wij-chips-bar { padding: 10px 0; }
    .wij-chips-list { padding: 0 12px; gap: 6px; }
    .wij-chip-btn { padding: 8px 14px; font-size: 12px; }

    /* Broker stacks onder content op mobile */
    .wij-broker { padding: 20px; }

    /* Subnav scroll hint */
    .wij-subnav { padding-left: 12px; padding-right: 12px; }

    /* CTA bottom: grotere buttons, full width */
    .wij-cta-bottom { padding: 32px 16px; }
    .wij-cta-bottom h2 { font-size: 22px; }
    .wij-cta-bottom__actions { flex-direction: column; gap: 10px; }
    .wij-cta-bottom__actions .wij-btn { width: 100%; justify-content: center; }

    /* Buurt-stats naar 1 kolom (iconcards zijn al compact) */
    .wij-buurt-stats { grid-template-columns: 1fr 1fr; gap: 8px; }
    .wij-stat-card { padding: 12px; gap: 10px; }
    .wij-stat-card__icon { width: 32px; height: 32px; background-size: 16px 16px; }
    .wij-stat-card__value { font-size: 18px; }
    .wij-stat-card__label { font-size: 12px; }
    .wij-stat-card__sub { font-size: 11px; }

    /* Buurt-location stacked */
    .wij-buurt-location { grid-template-columns: 1fr 1fr; }

    /* Breadcrumb: scroll horizontaal bij overflow */
    .wij-breadcrumb {
        overflow-x: auto;
        white-space: nowrap;
        -webkit-overflow-scrolling: touch;
    }
    .wij-breadcrumb .wij-single__inner { display: inline-flex; align-items: center; }

    /* Map iets kleiner */
    .wij-map { height: 300px; }

    /* FAQ compact */
    .wij-faq-section { padding: 32px 12px; }
    .wij-faq__item summary { font-size: 15px; }
    .wij-faq__answer { font-size: 14px; }

    /* Related carousel */
    .wij-related { padding: 32px 12px; }

    /* Paginering */
    .wij-pagination__btn { min-width: 36px; height: 36px; font-size: 13px; padding: 0 10px; }
    .wij-pagination { gap: 4px; }

    /* Archive heading compact */
    .wij-archive { padding: 20px 12px 48px; }
    .wij-archive__head { gap: 8px; margin-bottom: 16px; }
    .wij-archive__count { font-size: 17px; }
    .wij-archive__sort .wij-select { min-width: 150px; font-size: 13px; }

    /* Filter minder margin-top op mobile (gewoon onder header) */
    .wij-search { margin-top: 80px; padding: 16px 12px; }

    /* Plattegronden enkel 1 kolom */
    .wij-floorplans { grid-template-columns: 1fr; gap: 12px; }
}

/* Tablet (600-900px) */
@media (min-width: 600px) and (max-width: 899px) {
    .wij-title__addr { font-size: 28px !important; }
    .wij-title__price { font-size: 28px !important; }
    .wij-section h2 { font-size: 21px; }
    .wij-search { margin-top: 100px; }
    .wij-dl { grid-template-columns: 1fr 1fr; }
    .wij-buurt-stats { grid-template-columns: 1fr 1fr; }
}

/* Touch devices: specs op card altijd zichtbaar (geen hover) */
@media (hover: none) {
    .wij-card__specs { max-height: 40px; opacity: 1; }
    .wij-card__row   { margin-bottom: 10px; }
}

/* -------- Extra icons (v2, 2026-04-17) -------- */
.wij-ic--calc       { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%2312359b'><path d='M6 2h12a2 2 0 0 1 2 2v16a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2zm0 2v4h12V4H6zm0 6v2h2v-2H6zm4 0v2h2v-2h-2zm4 0v2h4v-2h-4zm-8 4v2h2v-2H6zm4 0v2h2v-2h-2zm4 0v8h4v-8h-4zM6 18v2h2v-2H6zm4 0v2h2v-2h-2z'/></svg>"); }
.wij-ic--photos-white { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffffff'><path d='M3 5h18v14H3V5zm2 2v10h14V7H5zm2 2h10v6H7V9z'/></svg>"); }
.wij-ic--plan       { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%2312359b'><path d='M4 4h16v16H4V4zm2 2v6h4V6H6zm6 0v4h6V6h-6zm-6 8v4h10v-4H6zm12 0v4h2v-4h-2zm0-4v2h2v-2h-2z'/></svg>"); }
.wij-ic--bath       { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23363636'><path d='M7 14h14v2H7zM5 11V5a2 2 0 0 1 2-2h3v2H7v6h14v2H3v-2zM7 17v3h2v-3zm10 0v3h2v-3z'/></svg>"); }
.wij-ic--energy     { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23363636'><path d='M13 2L3 14h7v8l10-12h-7z'/></svg>"); }
.wij-ic--school     { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%231a73e8'><path d='M12 3L2 8l10 5 10-5-10-5zM4 11v6c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2v-6l-8 4-8-4z'/></svg>"); width:18px; height:18px; }
.wij-ic--cart       { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23e37400'><path d='M7 18a2 2 0 1 0 0 4 2 2 0 0 0 0-4zm10 0a2 2 0 1 0 0 4 2 2 0 0 0 0-4zM1 2h3l3 13h11l3-9H6'/></svg>"); width:18px; height:18px; }
.wij-ic--transit    { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%237b1fa2'><path d='M12 2C8 2 4 2.5 4 6v9a3 3 0 0 0 3 3l-2 2v1h14v-1l-2-2a3 3 0 0 0 3-3V6c0-3.5-4-4-8-4zm-5 13a2 2 0 1 1 0-4 2 2 0 0 1 0 4zm10 0a2 2 0 1 1 0-4 2 2 0 0 1 0 4zm1-7H6V6h12v2z'/></svg>"); width:18px; height:18px; }
.wij-ic--food       { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23d81b60'><path d='M8.1 13.34l2.83-2.83L3.91 3.5a4 4 0 0 0 0 5.66l4.19 4.18zm6.78-1.81c1.53.71 3.68.21 5.27-1.38s2.09-3.75 1.38-5.27l-3.03 3.03-1.41-1.41 3.03-3.03c-1.53-.71-3.68-.21-5.27 1.38-1.59 1.59-2.09 3.75-1.38 5.27l-9.36 9.36 1.41 1.41 7.03-7.03 4.37 4.37 1.41-1.41-4.37-4.37z'/></svg>"); width:18px; height:18px; }
.wij-ic--tree       { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%232e7d32'><path d='M12 2l5 7h-3v5h-4V9H7l5-7zm-1 14h2v6h-2z'/></svg>"); width:18px; height:18px; }
.wij-ic--gym        { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23546e7a'><path d='M20.6 12l1.4-1.4-2.2-2.2-1.4 1.4-3.5-3.5 1.4-1.4-2.2-2.2-1.4 1.4-1.4-1.4-2.1 2.1 1.4 1.4L7.1 9.7 5.7 8.3 3.5 10.5l1.4 1.4L3.5 13.3l2.2 2.2 1.4-1.4 3.5 3.5-1.4 1.4 2.2 2.2 1.4-1.4 1.4 1.4 2.1-2.1-1.4-1.4 3.5-3.5 1.4 1.4 2.2-2.2z'/></svg>"); width:18px; height:18px; }

/* -------- Chips bar onder galerij -------- */
.wij-chips-bar {
    background: #fff;
    border-bottom: 1px solid var(--wij-border);
    padding: 12px 0;
}
.wij-chips-list {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}
.wij-chip-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 16px;
    background: #fff;
    border: 1px solid var(--wij-border);
    border-radius: 999px;
    font: 600 13px/1.2 inherit;
    color: var(--wij-text);
    cursor: pointer;
    text-decoration: none;
    white-space: nowrap;
    transition: all .15s;
}
.wij-chip-btn:hover { border-color: var(--wij-primary); color: var(--wij-primary); }
.wij-chip-btn.is-primary { background: var(--wij-primary); color: #fff; border-color: var(--wij-primary); }
.wij-chip-btn.is-primary:hover { background: var(--wij-primary-dark); border-color: var(--wij-primary-dark); color: #fff; }
.wij-chip-count {
    background: rgba(255, 255, 255, .25);
    padding: 2px 8px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 700;
}
.wij-chip-btn:not(.is-primary) .wij-chip-count { background: var(--wij-bg-soft); color: var(--wij-muted); }

/* -------- Title block v2 (Funda-stijl, huisstijl Wij blauw) -------- */
.wij-title--v2 { margin-bottom: 32px; padding-bottom: 24px; border-bottom: 1px solid var(--wij-border); }
.wij-title__head { margin-bottom: 12px; min-height: 0; }
.wij-title__head:empty { display: none; }
.wij-title__badge {
    display: inline-block;
    padding: 4px 12px;
    background: var(--wij-accent);
    color: #fff;
    font: 700 12px/1.3 inherit;
    border-radius: 3px;
    text-transform: uppercase;
    letter-spacing: .6px;
}
.wij-title__badge--status { background: #c8102e; }
.wij-title__addr {
    font: 700 40px/1.1 inherit;
    margin: 0 0 8px;
    color: var(--wij-primary); /* Wij huisstijl blauw */
    letter-spacing: -0.5px;
}
@media (max-width: 767px) { .wij-title__addr { font-size: 30px; } }
.wij-title__loc {
    font: 400 17px/1.4 inherit;
    color: var(--wij-muted);
    margin: 0 0 24px;
}
.wij-title__buurt {
    color: var(--wij-primary);
    font-weight: 600;
    text-decoration: none;
    margin-left: 6px;
}
.wij-title__buurt:hover { text-decoration: underline; }
.wij-title__price-row {
    margin-bottom: 24px;
}
.wij-title__price {
    font: 700 36px/1 inherit;
    color: var(--wij-text);
    letter-spacing: -0.5px;
}
@media (max-width: 767px) { .wij-title__price { font-size: 28px; } }

.wij-title__specs {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    gap: 28px;
    flex-wrap: wrap;
    align-items: center;
}
.wij-title__specs li {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font: 400 15px/1.4 inherit;
    color: var(--wij-text);
}
.wij-title__specs li .wij-ic {
    width: 20px;
    height: 20px;
    opacity: .7;
}
.wij-title__specs strong {
    color: var(--wij-text);
    font-weight: 700;
    font-size: 16px;
}
.wij-title__spec-label { color: var(--wij-muted); }
.wij-title__spec-energy .wij-energy-badge {
    font-size: 15px;
    padding: 3px 10px;
    border-radius: 3px;
    font-weight: 700;
    color: #fff !important; /* Altijd witte letter in gekleurde kader */
}

/* Legacy title styles (v1 of single) — backward compat */
.wij-title h1 { font: 700 28px/1.2 inherit; margin: 0 0 8px; color: var(--wij-text); }

/* -------- Buurt locatie + CBS kerncijfers cards -------- */
.wij-buurt-location {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 12px;
    margin-bottom: 24px;
}
.wij-buurt-loc {
    display: flex;
    flex-direction: column;
    padding: 14px 18px;
    background: var(--wij-bg-soft);
    border-radius: var(--wij-radius);
}
.wij-buurt-loc .label {
    font: 600 11px/1 inherit;
    color: var(--wij-muted);
    text-transform: uppercase;
    letter-spacing: .6px;
    margin-bottom: 4px;
}
.wij-buurt-loc .val {
    font: 600 16px/1.3 inherit;
    color: var(--wij-text);
}

.wij-buurt-h3 {
    font: 700 14px/1.2 inherit !important;
    margin: 28px 0 14px !important;
    text-transform: uppercase !important;
    letter-spacing: .6px !important;
    color: var(--wij-muted) !important;
}

/* CBS kerncijfers cards — compact, iconisch, subtiel */
.wij-buurt-stats {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}
.wij-stat-card {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 14px 16px;
    background: var(--wij-bg-soft);
    border: 1px solid transparent;
    border-radius: var(--wij-radius);
    transition: all .2s ease;
}
.wij-stat-card:hover {
    background: #fff;
    border-color: var(--wij-border);
    box-shadow: 0 2px 8px rgba(18, 53, 155, .06);
    transform: translateY(-1px);
}
.wij-stat-card__icon {
    flex-shrink: 0;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background-color: rgba(18, 53, 155, .08); /* lichte Wij-blauw tint */
    background-repeat: no-repeat;
    background-position: center;
    background-size: 18px 18px;
    margin-top: 2px;
}
.wij-stat-card__body { min-width: 0; flex: 1; }
.wij-stat-card__value {
    font: 700 22px/1.15 inherit;
    color: var(--wij-primary);
    margin-bottom: 2px;
    letter-spacing: -0.3px;
}
.wij-stat-card__label {
    font: 600 13px/1.3 inherit;
    color: var(--wij-text);
}
.wij-stat-card__sub {
    font: 400 12px/1.35 inherit;
    color: var(--wij-muted);
    margin-top: 3px;
}

/* Icoon per metric — inline SVG data-URI, wit op goud */
.wij-stat-ic--inwoners   { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffffff'><path d='M16 11c1.66 0 3-1.34 3-3s-1.34-3-3-3-3 1.34-3 3 1.34 3 3 3zm-8 0c1.66 0 3-1.34 3-3s-1.34-3-3-3-3 1.34-3 3 1.34 3 3 3zm0 2c-2.33 0-7 1.17-7 3.5V19h14v-2.5c0-2.33-4.67-3.5-7-3.5zm8 0c-.29 0-.62.02-.97.05C16.19 14.12 17 15.39 17 16.5V19h7v-2.5c0-2.33-4.67-3.5-7-3.5z'/></svg>"); }
.wij-stat-ic--family     { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffffff'><path d='M16 11c1.66 0 2.99-1.34 2.99-3S17.66 5 16 5c-1.66 0-3 1.34-3 3s1.34 3 3 3zm-8 0c1.66 0 2.99-1.34 2.99-3S9.66 5 8 5C6.34 5 5 6.34 5 8s1.34 3 3 3zm0 2c-2.33 0-7 1.17-7 3.5V19h14v-2.5c0-2.33-4.67-3.5-7-3.5zm8 0c-.29 0-.62.02-.97.05 1.16.84 1.97 1.97 1.97 3.45V19h6v-2.5c0-2.33-4.67-3.5-7-3.5zm-4-4c-1 0-2 .3-2.5.8l2 2 2.5-2.5C13 9 12.5 9 12 9z'/></svg>"); }
.wij-stat-ic--household  { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffffff'><path d='M12 2L2 12h3v8h6v-6h2v6h6v-8h3L12 2zm0 5.5c1.1 0 2 .9 2 2s-.9 2-2 2-2-.9-2-2 .9-2 2-2z'/></svg>"); }
.wij-stat-ic--young      { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffffff'><path d='M12 6c1.66 0 3-1.34 3-3S13.66 0 12 0 9 1.34 9 3s1.34 3 3 3zm0 1c-3 0-6 1.5-6 4.5V14h2v8h8v-8h2v-2.5c0-3-3-4.5-6-4.5z'/></svg>"); }
.wij-stat-ic--elder      { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffffff'><path d='M12 4a3 3 0 1 1 0 6 3 3 0 0 1 0-6zm6 16v-2c-.5-2-3.5-4-6-4s-5.5 2-6 4v2h3v-6l1.5-.5L12 20l1.5-6.5L15 14v6h3zm-13 0H3v-8a3 3 0 0 1 3-3c.3 0 .5.05.8.1L4 20z'/></svg>"); }
.wij-stat-ic--single     { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffffff'><circle cx='12' cy='7' r='4'/><path d='M12 13c-4 0-7 2-7 5v3h14v-3c0-3-3-5-7-5z'/></svg>"); }
.wij-stat-ic--woz        { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffffff'><path d='M12 3 3 11h2v9h5v-6h4v6h5v-9h2L12 3zm0 8.5c-1.1 0-2-.7-2-1.5s.9-1.5 2-1.5 2 .7 2 1.5-.9 1.5-2 1.5z'/></svg>"); }
.wij-stat-ic--koop       { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffffff'><path d='M12.65 10A5.99 5.99 0 0 0 7 6c-3.31 0-6 2.69-6 6s2.69 6 6 6a5.99 5.99 0 0 0 5.65-4H17v4h4v-4h2v-4H12.65zM7 14a2 2 0 1 1 0-4 2 2 0 0 1 0 4z'/></svg>"); }
.wij-stat-ic--house      { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffffff'><path d='M12 3 2 12h3v8h14v-8h3L12 3zm0 2.8 7 6.3V18h-4v-5H9v5H5v-5.9l7-6.3z'/></svg>"); }
.wij-stat-ic--income     { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffffff'><path d='M11.8 10.9c-2.3-.6-3-1.2-3-2.1 0-1.1 1-1.8 2.7-1.8 1.8 0 2.4.9 2.5 2.1h2.2c0-1.8-1.1-3.4-3.3-3.9V3h-3v2.2c-2 .4-3.6 1.7-3.6 3.6 0 2.4 2 3.5 4.8 4.2 2.6.6 3.1 1.5 3.1 2.5 0 .7-.5 1.8-2.7 1.8-2 0-2.8-.9-2.9-2.1H6.3c.1 2.3 1.8 3.6 3.8 4V21h3v-2c2-.4 3.6-1.6 3.6-3.6 0-3-2.6-4-5-4.5z'/></svg>"); }
.wij-stat-ic--homes      { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffffff'><path d='M17 11V3H7v4H3v14h8v-4h2v4h8V11h-4zM7 19H5v-2h2v2zm0-4H5v-2h2v2zm0-4H5V9h2v2zm4 4H9v-2h2v2zm0-4H9V9h2v2zm0-4H9V5h2v2zm4 8h-2v-2h2v2zm0-4h-2V9h2v2zm0-4h-2V5h2v2zm4 12h-2v-2h2v2zm0-4h-2v-2h2v2z'/></svg>"); }
.wij-stat-ic--density    { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffffff'><circle cx='12' cy='6' r='2'/><circle cx='6' cy='10' r='2'/><circle cx='18' cy='10' r='2'/><circle cx='9' cy='16' r='2'/><circle cx='15' cy='16' r='2'/><circle cx='12' cy='12' r='1.5'/></svg>"); }

/* -------- Card v2 styling (modernised) -------- */
.wij-card__type {
    position: absolute;
    bottom: 12px;
    left: 12px;
    padding: 4px 10px;
    background: rgba(0, 0, 0, .6);
    color: #fff;
    font: 600 11px/1.3 inherit;
    border-radius: 3px;
    text-transform: uppercase;
    letter-spacing: .4px;
}
.wij-card__city {
    font: 700 14px/1.2 inherit !important;
    margin: 0 0 2px !important;
    color: var(--wij-text) !important;
    text-transform: uppercase;
    letter-spacing: .4px;
}
.wij-card__address {
    font: 400 15px/1.3 inherit;
    margin: 0 0 10px;
    color: var(--wij-text);
}
.wij-card__price-row { margin-bottom: 10px; }
.wij-card__price {
    font: 700 18px/1 inherit;
    color: var(--wij-primary);
}

/* -------- dl beter formatteerd -------- */
.wij-dl {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
}
.wij-dl dt,
.wij-dl dd {
    width: auto !important;
    display: block !important;
    padding: 10px 0 !important;
    border-bottom: 1px solid var(--wij-border) !important;
}
.wij-dl dt { color: var(--wij-muted); font-size: 14px; }
.wij-dl dd { color: var(--wij-text); font-size: 14px; margin: 0; }
.wij-dl dt:last-of-type,
.wij-dl dd:last-of-type { border-bottom: 0 !important; }

/* -------- Live polish (2026-05-02): compact header + gold woning UI -------- */
:root { --wij-header-h: 96px; }

#main-header .row.top-bar {
    height: 34px !important;
}
#main-header .row.top-bar .full-row .blocks-container {
    padding-top: 6px !important;
}
#main-header .row.bottom-bar {
    height: 82px !important;
}
#main-header .row.bottom-bar .full-row .blocks-container {
    padding-top: 6px !important;
}
#main-header .row.bottom-bar .full-row .blocks-container .block.logo {
    margin-top: 2px !important;
}
#main-header .row.bottom-bar .full-row .blocks-container .block.logo a img {
    width: 76px !important;
}
#main-header .row.bottom-bar .full-row .blocks-container .block#main-navigation ul li a {
    padding: 24px 8px 31px !important;
    font-size: 13px !important;
}
#main-navigation ul li.menu-item-has-children > a {
    padding-right: 22px !important;
}
#main-navigation ul li.menu-item-has-children > a::before {
    top: 50% !important;
    right: 7px !important;
    bottom: auto !important;
    left: auto !important;
    transform: translateY(-50%) !important;
    pointer-events: none;
}
#main-header .row.bottom-bar .full-row .blocks-container .block#main-navigation ul li.menu-item-has-children > a {
    padding-right: 22px !important;
}
#main-header .row.bottom-bar .full-row .blocks-container .block#main-navigation ul li.menu-item-has-children > a::before {
    top: 50% !important;
    right: 7px !important;
    bottom: auto !important;
    left: auto !important;
    transform: translateY(-50%) !important;
}

.wij-search {
    margin-top: 82px !important;
    padding-top: 20px;
    padding-bottom: 20px;
}

.wij-search__more,
.wij-search__more:hover,
.wij-drawer__foot .wij-btn--primary,
.wij-drawer__foot .wij-btn--primary:hover {
    background: var(--wij-accent) !important;
    border-color: var(--wij-accent) !important;
    color: #fff !important;
}

.wij-card__status,
.wij-card__status--beschikbaar,
.wij-card__status--onder-bod,
.wij-card__status--ovb,
.wij-card__status--verkocht,
.wij-card__status--verhuurd,
.wij-card__status--open {
    background: var(--wij-accent) !important;
    color: #fff !important;
}

.wij-card__city {
    color: var(--wij-accent) !important;
}

.wij-kenmerk-group {
    background: #f6eee4 !important;
}
.wij-kenmerk-group h3 {
    color: var(--wij-primary) !important;
}
.wij-kenmerk-group .wij-dl dt,
.wij-kenmerk-group .wij-dl dd {
    border-bottom-color: rgba(54, 54, 54, .18) !important;
}
.wij-kenmerk-group .wij-dl dt {
    color: #363636 !important;
}
.wij-kenmerk-group .wij-dl dd {
    color: #363636 !important;
}

.wij-map-toggle,
.wij-map-toggle:hover,
.wij-map-toggle.is-active {
    background: var(--wij-accent) !important;
    border-color: var(--wij-accent) !important;
    color: #fff !important;
}

.wij-stat-card__icon {
    background-color: var(--wij-accent) !important;
}

.wij-carousel-nav__btn:hover:not(:disabled),
.wij-carousel-nav__dots li.slick-active button {
    background: var(--wij-accent) !important;
    border-color: var(--wij-accent) !important;
}

@media (max-width: 767px) {
    :root { --wij-header-h: 68px; }

    #main-header .row.top-bar {
        height: 0 !important;
        min-height: 0 !important;
        overflow: hidden !important;
    }
    #main-header .row.top-bar .full-row .blocks-container {
        padding-top: 0 !important;
    }
    #main-header .row.bottom-bar {
        height: 68px !important;
    }
    #main-header .row.bottom-bar .full-row .blocks-container {
        padding-top: 5px !important;
    }
    #main-header .row.bottom-bar .full-row .blocks-container .block.logo a img {
        width: 62px !important;
    }
    .wij-search {
        margin-top: 68px !important;
        padding-top: 14px;
        padding-bottom: 14px;
    }
}