/* McBeth Kings property lookup, v4 (25 Oct 2026): v3 plus a fix so that after sending, the fields and button really disappear and only the thank-you shows (the form's own styles had overridden the hidden attribute).
   v3 (25 Oct 2026): everything in v2, plus the "Get a free valuation" button and form under each result.
   The card itself is styled by the lookup page. Scoped under .results like the page's own rules. */

/* "(no house number)" after a street name */
.results .res-tag{font:400 13px/1 var(--mk-sans);color:var(--mk-muted)}

/* "nominal value" under an R 1 000 figure: road and service slivers, listed last */
.results .res-val{display:flex;flex-direction:column;align-items:flex-end;gap:4px}
.results .res-sub{font:500 10px/1.2 var(--mk-sans);letter-spacing:1px;text-transform:uppercase;color:var(--mk-muted)}

/* the two-entries note, under the grey line */
.results .res-note{font:400 12.5px/1.45 var(--mk-sans);color:var(--mk-charcoal);margin:6px 0 0;padding-left:10px;border-left:2px solid #C5A359}

/* the button under each result, and the address that opens the same form */
.results .res{flex-wrap:wrap}
.results .res-addr{cursor:pointer}
.results .res-ask{margin:10px 0 0;padding:0 0 2px;background:none;border:0;border-bottom:1px solid #8C6F2E;font:600 11px/1.3 var(--mk-sans);letter-spacing:1.2px;text-transform:uppercase;color:#8C6F2E;cursor:pointer}
.results .res-ask:hover,.results .res-ask[aria-expanded="true"]{color:var(--mk-black,#1C1C1C);border-bottom-color:var(--mk-black,#1C1C1C)}

/* the form that opens under a result */
.results .res-form{flex:0 0 100%;align-self:stretch;width:100%;margin-top:6px;padding-top:16px;border-top:1px solid var(--mk-hairline)}
.results .res-form[hidden],.results .res-form [hidden]{display:none !important}
.results .res-form-h{font:400 18px/1.3 var(--mk-display);color:var(--mk-black,#1C1C1C);margin:0 0 12px}
.results .res-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.results .res-fld{display:flex;flex-direction:column;gap:6px}
.results .res-fld span{font:500 11px/1.2 var(--mk-sans);letter-spacing:1px;text-transform:uppercase;color:var(--mk-muted)}
.results .res-fld input{font:400 16px/1.2 var(--mk-sans);padding:12px;border:1px solid var(--mk-hairline);background:#fff;color:var(--mk-ink,#1C1C1C);min-width:0;border-radius:0}
.results .res-fld input:focus{outline:2px solid #C5A359;outline-offset:0;border-color:#C5A359}
.results .res-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.results .res-consent{display:flex;gap:10px;align-items:flex-start;margin:12px 0;font:400 12.5px/1.45 var(--mk-sans);color:var(--mk-muted)}
.results .res-consent input{margin-top:3px}
.results .res-err{font:500 13px/1.4 var(--mk-sans);color:#8B1E1E;margin:0 0 10px}
.results .res-done-h{font:400 22px/1.2 var(--mk-display);color:var(--mk-black,#1C1C1C);margin:0 0 6px}
.results .res-done p{margin:0 0 12px;font:400 14px/1.5 var(--mk-sans);color:var(--mk-charcoal)}

@media (max-width:640px){
  .results .res-val{align-items:flex-start}
  .results .res-grid{grid-template-columns:1fr}
  /* the card stacks in a column here: no wrapping into a second column, and the form takes its natural height */
  .results .res{flex-wrap:nowrap}
  .results .res-form{flex:0 0 auto}
}