/* Zoekopdracht in 3 stappen, huisstijl Wij Makelaardij 2.0. */
.wij-zo-usps {
    display: flex; flex-wrap: wrap; gap: 8px 22px;
    list-style: none; margin: 0 0 22px; padding: 0;
    font-size: 15px; color: #2b2b2b;
}
.wij-zo-usps li { display: flex; align-items: center; gap: 8px; }
.wij-zo-usps li::before {
    content: "✓"; display: inline-grid; place-items: center;
    width: 22px; height: 22px; border-radius: 50%;
    background: #12359b; color: #fff; font-size: 12px; font-weight: 700;
}
.wij-zo {
    background: #fff; border: 1px solid #e6dccd; border-radius: 10px;
    padding: 26px 30px 28px;
    box-shadow: 0 10px 30px rgba(11, 33, 102, .10);
    font-family: 'Source Sans Pro', 'Open Sans', sans-serif;
    color: #2b2b2b; text-align: left;
}
.wij-zo__kop { margin-bottom: 18px; }
.wij-zo__balk { display: flex; gap: 6px; margin-bottom: 8px; }
.wij-zo__balk span { flex: 1; height: 5px; border-radius: 3px; background: #e6dccd; }
.wij-zo__balk span.is-aan { background: #cea872; }
.wij-zo__stapnr { margin: 0; font-size: 13px; color: #5b6170; }
.wij-zo__stap { border: 0; margin: 0; padding: 0; min-width: 0; }
.wij-zo__stap[hidden] { display: none; }
.wij-zo__stap legend {
    padding: 0; margin: 0 0 18px; outline: none;
    font: 700 22px/1.25 'Montserrat', sans-serif; color: #12359b;
}
.wij-zo__lbl {
    margin: 20px 0 8px; font: 600 14px/1.3 'Montserrat', sans-serif;
    color: #0b2166;
}
.wij-zo__stap legend + .wij-zo__lbl { margin-top: 0; }
.wij-zo__lbl small { font-weight: 400; color: #5b6170; }
.wij-zo__tegels { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.wij-zo__tegel { position: relative; cursor: pointer; margin: 0; }
.wij-zo__tegel input,
.wij-zo__chip input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.wij-zo__tegel span {
    display: block; height: 100%; padding: 16px 18px;
    border: 2px solid #e6dccd; border-radius: 8px;
    transition: border-color .15s, background .15s;
}
.wij-zo__tegel b { display: block; font: 700 16px 'Montserrat', sans-serif; color: #0b2166; }
.wij-zo__tegel small { display: block; margin-top: 3px; font-size: 14px; color: #5b6170; }
.wij-zo__tegel input:checked + span { border-color: #12359b; background: #f3f6fd; }
.wij-zo__chips { display: flex; flex-wrap: wrap; gap: 8px; }
.wij-zo__chip { margin: 0; cursor: pointer; }
.wij-zo__chip span {
    display: inline-block; padding: 8px 15px; border-radius: 999px;
    border: 1.5px solid #e6dccd; background: #fff; font-size: 15px;
    transition: border-color .15s, background .15s, color .15s;
}
.wij-zo__chip input:checked + span { background: #12359b; border-color: #12359b; color: #fff; }
.wij-zo__tegel input:focus-visible + span,
.wij-zo__chip input:focus-visible + span { outline: 3px solid #cea872; outline-offset: 2px; }
.wij-zo__chip.is-extra { display: none; }
.wij-zo.toon-alle-plaatsen .wij-zo__chip.is-extra { display: inline-block; }
.wij-zo__meer {
    margin-top: 10px; padding: 0; border: 0; background: none; cursor: pointer;
    font: 600 14px 'Montserrat', sans-serif; color: #12359b;
    text-decoration: underline; text-underline-offset: 3px;
}
.wij-zo__meer[hidden] { display: none; }
.wij-zo__paar { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.wij-zo__veld { margin-top: 14px; }
.wij-zo__veld label { display: block; margin-bottom: 5px; font-size: 14px; font-weight: 600; }
.wij-zo__veld abbr { color: #b38d57; text-decoration: none; }
.wij-zo input[type=text], .wij-zo input[type=email],
.wij-zo input[type=tel], .wij-zo select {
    width: 100%; min-height: 46px; padding: 10px 12px;
    border: 1px solid #cfc4b2; border-radius: 6px; background: #fff;
    font: 16px 'Source Sans Pro', 'Open Sans', sans-serif; color: #2b2b2b;
    box-sizing: border-box;
}
.wij-zo input:focus, .wij-zo select:focus {
    outline: none; border-color: #12359b; box-shadow: 0 0 0 3px rgba(18, 53, 155, .15);
}
.wij-zo [aria-invalid=true] { border-color: #a33 !important; }
.wij-zo__akkoord { display: flex; gap: 10px; align-items: flex-start; margin-top: 18px; font-size: 14px; cursor: pointer; }
.wij-zo__akkoord input { margin-top: 3px; width: 18px; height: 18px; flex: 0 0 18px; }
.wij-zo__akkoord a { color: #12359b; }
.wij-zo__melding { min-height: 1.4em; margin: 16px 0 0; font-size: 14px; }
.wij-zo__melding.is-fout { color: #a33; font-weight: 600; }
.wij-zo__nav { display: flex; align-items: center; gap: 12px; margin-top: 8px; }
.wij-zo__terug {
    padding: 12px 6px; border: 0; background: none; cursor: pointer;
    font: 600 15px 'Montserrat', sans-serif; color: #5b6170;
}
.wij-zo__terug[hidden] { display: none; }
.wij-zo__knop {
    margin-left: auto; min-height: 50px; padding: 13px 28px; border: 0;
    border-radius: 6px; background: #12359b; color: #fff; cursor: pointer;
    font: 700 15px 'Montserrat', sans-serif; transition: background .15s;
}
.wij-zo__knop:hover { background: #0b2166; }
.wij-zo__knop:focus-visible { outline: 3px solid #cea872; outline-offset: 2px; }
.wij-zo__knop[disabled] { opacity: .7; cursor: progress; }
.wij-zo__hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.wij-zo__dank { padding: 18px 4px; text-align: center; outline: none; }
.wij-zo__vink {
    display: inline-grid; place-items: center; width: 54px; height: 54px;
    border-radius: 50%; background: #12359b; color: #fff; font-size: 26px;
}
.wij-zo__dank h3 { margin: 14px 0 6px; font: 700 21px 'Montserrat', sans-serif; color: #12359b; }
.wij-zo__dank p { margin: 0; }
@media (max-width: 600px) {
    .wij-zo { padding: 20px 18px 22px; }
    .wij-zo__tegels, .wij-zo__paar { grid-template-columns: 1fr; }
    .wij-zo__stap legend { font-size: 20px; }
    .wij-zo__knop { flex: 1; }
}
/* Ankerdoel onder de vaste header; ruimte voor de zwevende widgetknop op mobiel. */
#zoekopdracht { scroll-margin-top: 90px; }
@media (max-width: 600px) {
    .wij2-formblok#zoekopdracht { padding-bottom: 96px; }
}
