/* Fairfax Homes — listing search. Builds on /assets/site.css (v2 tokens). */
.samplebar{background:#8a3b2a;color:#fff;text-align:center;font:600 14px var(--sans);padding:8px 12px;letter-spacing:.02em}
.small{font-size:14px}
.btn.line{background:transparent;border:1.5px solid var(--line);color:var(--ink)}
.btn.line:hover{border-color:var(--gold)}
.btn.light{border-color:rgba(255,255,255,.35);color:#fff}
.btn.full{display:flex;justify-content:center;width:100%;margin-top:10px}
.favlink{font-weight:600}
.favlink [data-favcount]:empty{display:none}

/* hero + search bar */
.shero{background:var(--hero);color:#fff;padding:26px 0 30px}
.shero .crumbs,.shero .crumbs a{color:#b3c3e6;padding-top:0}
.shero h1{font:800 clamp(30px,4.6vw,48px)/1.1 var(--serif);letter-spacing:-.03em;margin:10px 0 6px}
.shero h1 em{font-style:normal;color:#ffc043}
.shero .sub{color:#d6e0f5;font-size:16px}
.shero .sub a{color:#ffc043}
.sbar{display:flex;gap:10px;margin-top:18px;flex-wrap:wrap}
.sbar input,.sbar select{font:inherit;font-size:17px;padding:13px 18px;border-radius:999px;border:0;background:#fff;color:#1b2430}
.sbar input{flex:1 1 320px;min-width:0}
.sbar select{flex:0 1 220px}

/* filters */
.filters{background:var(--surface);border-bottom:1px solid var(--line);position:sticky;top:70px;z-index:15}
.frow{display:flex;flex-wrap:wrap;gap:10px 14px;align-items:flex-end;padding:12px 0}
.f{display:flex;flex-direction:column;font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);gap:4px}
.f select{font:500 15px var(--sans);text-transform:none;letter-spacing:0;color:var(--ink);padding:8px 10px;border:1px solid var(--line);border-radius:10px;background:var(--bg);min-width:110px}
fieldset.f{border:0;flex-direction:row;flex-wrap:wrap;align-items:center;gap:6px}
fieldset.f legend{float:left;width:100%;margin-bottom:4px}
.chip{display:inline-flex;align-items:center;gap:6px;font:500 14px var(--sans);text-transform:none;letter-spacing:0;color:var(--ink);padding:7px 12px;border:1px solid var(--line);border-radius:999px;cursor:pointer;background:var(--bg)}
.chip:has(input:checked){background:var(--gold-soft);border-color:var(--gold)}
.chip input{accent-color:var(--gold-deep)}
details.more{position:relative;align-self:flex-end}
details.more summary{list-style:none;cursor:pointer;font:600 14px var(--sans);padding:8px 14px;border:1px solid var(--line);border-radius:999px;background:var(--bg)}
details.more summary::-webkit-details-marker{display:none}
details.more>div{position:absolute;top:44px;left:0;background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:14px;display:flex;flex-direction:column;gap:10px;z-index:30;box-shadow:0 18px 40px -18px rgba(0,0,0,.35);min-width:220px}
.f.sort{margin-left:auto}
@media (max-width:760px){.filters{position:static}.f select{min-width:0}.f.sort{margin-left:0}.frow{gap:8px}}

/* results layout */
.results{padding:22px 0 50px}
.rgrid2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.9fr);gap:22px;align-items:start;max-width:1400px}
.mapwrap{position:sticky;top:150px;height:calc(100vh - 170px);min-height:420px;border-radius:18px;overflow:hidden;border:1px solid var(--line)}
#map{width:100%;height:100%}
.mapmove{position:absolute;top:12px;left:50%;transform:translateX(-50%);z-index:500;background:#fff;color:#1b2430;padding:7px 14px;border-radius:999px;font-size:14px;box-shadow:0 4px 14px rgba(0,0,0,.2);display:flex;gap:6px;align-items:center;white-space:nowrap}
.maptoggle{display:none}
@media (max-width:1000px){
  .rgrid2{grid-template-columns:minmax(0,1fr)}
  .mapwrap{display:none;position:relative;top:0;height:70vh;order:-1}
  .mapwrap.show{display:block}
  .maptoggle{display:inline-flex}
}
.rhead{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:14px}
.ractions{display:flex;gap:8px;flex-wrap:wrap}
.cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.cards.four{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:1000px){.cards.four{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.cards,.cards.four{grid-template-columns:minmax(0,1fr)}}
.cards.loading{opacity:.5;transition:opacity .2s}
.pager{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:26px;color:var(--muted);font-size:15px}
.empty{grid-column:1/-1;background:var(--surface);border:1px dashed var(--line);border-radius:16px;padding:28px}
.empty h3{margin-top:0}

/* card */
.hcard{position:relative;background:var(--surface);border:1px solid var(--line);border-radius:16px;overflow:hidden;transition:box-shadow .2s,transform .2s}
.hcard:hover{box-shadow:0 18px 40px -22px rgba(20,42,68,.45);transform:translateY(-2px)}
.hcard.hl{outline:3px solid var(--gold)}
.hphoto{display:block;position:relative;aspect-ratio:4/3;background:#e7e3da;overflow:hidden}
.hphoto img{width:100%;height:100%;object-fit:cover;display:block}
.nophoto{display:grid;place-items:center;height:100%;color:var(--muted);font-size:14px}
.badges{position:absolute;top:10px;left:10px;display:flex;gap:6px;flex-wrap:wrap}
.badges b,.lstatus b{font:700 12px var(--sans);letter-spacing:.03em;padding:4px 9px;border-radius:999px;background:#fff;color:#1b2430}
.badges b.new,.lstatus b.new{background:var(--gold);color:#1b2430}
.badges b.red,.lstatus b.red{background:#8a3b2a;color:#fff}
.badges b.st,.lstatus b.st{background:var(--navy);color:#fff}
.lstatus b.ok{background:#2f6b4f;color:#fff}
.pc{position:absolute;bottom:10px;right:10px;background:rgba(0,0,0,.55);color:#fff;font-size:12px;padding:3px 8px;border-radius:999px}
.heart{position:absolute;top:8px;right:8px;width:38px;height:38px;border-radius:50%;border:0;background:rgba(255,255,255,.92);font-size:19px;color:#9aa3ad;cursor:pointer;line-height:1}
.heart.on,[data-fav].on{color:#c0392b}
.hbody{display:flex;flex-direction:column;padding:12px 16px 14px;text-decoration:none;gap:2px}
.hbody .price{font:600 24px var(--serif)}
.hbody .facts{font-size:15px;font-weight:600}
.hbody .addr{font-size:15px}
.hbody .city{font-size:14px;color:var(--muted)}
.court{font-size:12px;color:var(--muted);margin-top:4px}
.court.big{font-size:14px;margin-top:10px}

/* map pins */
.pin{background:var(--brand);color:#fff;font:700 12px var(--sans);padding:3px 7px;border-radius:999px;white-space:nowrap;border:2px solid #fff;box-shadow:0 2px 6px rgba(0,0,0,.3);transform:translate(-50%,-50%);display:inline-block}
.pin.hl{background:var(--gold);color:#1b2430;z-index:1000}
.leaflet-div-icon{background:none;border:0}
.leaflet-popup-content{margin:0;width:230px!important}
.leaflet-popup-content .hcard{border:0;border-radius:12px}
.leaflet-popup-content .hbody .price{font-size:19px}
.leaflet-popup-content .court{display:none}

/* ask */
.ask .grid2{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
@media (max-width:860px){.ask .grid2{grid-template-columns:1fr}}

/* listing page */
.gallery{padding:12px 0 0}
.gmain{position:relative;aspect-ratio:16/9;max-height:620px;background:#111;border-radius:18px;overflow:hidden;width:100%}
.gmain img{width:100%;height:100%;object-fit:contain;display:block;cursor:zoom-in}
.gnav{position:absolute;top:50%;transform:translateY(-50%);width:46px;height:46px;border-radius:50%;border:0;background:rgba(255,255,255,.9);font-size:28px;cursor:pointer;line-height:1;color:#1b2430}
.gnav.prev{left:14px}.gnav.next{right:14px}
.gcount{position:absolute;bottom:12px;left:14px;background:rgba(0,0,0,.6);color:#fff;font-size:13px;padding:4px 10px;border-radius:999px}
.gfull{position:absolute;bottom:12px;right:14px;border:0;background:rgba(0,0,0,.6);color:#fff;font-size:18px;width:38px;height:38px;border-radius:50%;cursor:pointer}
.gthumbs{display:flex;gap:8px;overflow-x:auto;padding:10px 0 4px;scrollbar-width:thin}
.gthumbs button{flex:0 0 110px;height:74px;border:2px solid transparent;border-radius:10px;overflow:hidden;padding:0;cursor:pointer;background:#ddd}
.gthumbs button.on{border-color:var(--gold)}
.gthumbs img{width:100%;height:100%;object-fit:cover;display:block}
.lightbox{border:0;padding:0;background:#000;width:100vw;height:100vh;max-width:none;max-height:none}
.lightbox::backdrop{background:#000}
.lightbox img{width:100%;height:100%;object-fit:contain}
.lbclose{position:absolute;top:14px;right:18px;z-index:2;border:0;background:rgba(255,255,255,.9);width:44px;height:44px;border-radius:50%;font-size:26px;cursor:pointer}
.lhead{padding:24px 0 10px}
.lgrid{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:36px;align-items:start}
@media (max-width:960px){.lgrid{grid-template-columns:minmax(0,1fr)}}
.lstatus{display:flex;gap:8px;align-items:center;flex-wrap:wrap;font-size:14px;color:var(--muted)}
.lprice{font:600 clamp(34px,5vw,48px)/1.1 var(--serif);margin:10px 0 4px}
.laddr{font-size:20px;font-weight:600;line-height:1.35}
.laddr span{font-weight:400;color:var(--muted);font-size:17px}
.lfacts{display:flex;flex-wrap:wrap;gap:8px 22px;list-style:none;margin-top:14px;font-size:17px}
.lfacts b{font-size:22px}
.lactions{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}
.agentcard{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:22px}
.ag{display:flex;gap:12px;align-items:center;margin-bottom:10px}
.ag b{display:block;font-size:18px}.ag span{font-size:14px;color:var(--muted)}
.avatar{width:52px;height:52px;border-radius:50%;background:var(--navy);color:var(--gold);display:grid;place-items:center;font:600 18px var(--serif);flex-shrink:0}
.remarks{white-space:pre-line;max-width:46em}
.dtable{display:grid;grid-template-columns:200px minmax(0,1fr);border-top:1px solid var(--line)}
.dtable dt,.dtable dd{padding:10px 0;border-bottom:1px solid var(--line);font-size:16px}
.dtable dt{color:var(--muted)}
@media (max-width:560px){.dtable{grid-template-columns:130px minmax(0,1fr)}}
.calc{padding:22px}
.crow{display:flex;gap:16px;flex-wrap:wrap}
.crow label{display:flex;flex-direction:column;font-size:13px;font-weight:600;color:var(--muted);gap:4px}
.crow input,.crow select{font:inherit;font-size:16px;padding:8px 10px;border:1px solid var(--line);border-radius:10px;background:var(--bg);color:var(--ink);width:110px}
.crow span{display:flex;align-items:center;gap:4px;color:var(--ink)}
.cout{display:grid;grid-template-columns:auto minmax(0,1fr);gap:24px;align-items:center;margin:18px 0 10px}
@media (max-width:560px){.cout{grid-template-columns:1fr}}
.ctotal span{display:block;font-size:13px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}
.ctotal b{font:600 38px var(--serif)}
.cout ul{list-style:none}
.cout li{display:flex;justify-content:space-between;padding:6px 0;border-bottom:1px dashed var(--line);font-size:15px}
.lmap{height:340px;border-radius:16px;border:1px solid var(--line)}
.areabox{margin-top:36px;padding:24px;background:var(--gold-soft);border:0}
.areabox h3{margin-top:4px}
.sticky{position:sticky;top:90px}
.cf.card input,.cf.card textarea,.cf.card select{width:100%;margin-bottom:10px}
.cf.card label.small{display:block;margin-bottom:10px;color:var(--muted)}
.dlg{border:0;border-radius:18px;padding:24px;max-width:420px;width:92vw;background:var(--surface);color:var(--ink)}
.dlg::backdrop{background:rgba(10,20,35,.55)}
.dlg h3{margin-top:0}
.dlg input{width:100%;font:inherit;padding:12px 14px;border:1px solid var(--line);border-radius:10px;margin:12px 0 8px;background:var(--bg);color:var(--ink)}
.dlg .end{display:flex;gap:10px;justify-content:flex-end;margin-top:12px}

/* IDX notice */
section.idx{padding:26px 0;border-top:1px solid var(--line);background:var(--surface)}
section.idx p{font-size:12.5px;color:var(--muted);max-width:none}
.idxlogo{height:34px;margin-bottom:8px}

/* area-page widget on the static guides */
.hwidget .cards{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:900px){.hwidget .cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.hwidget .cards{grid-template-columns:minmax(0,1fr)}}

@media print{
  .noprint,nav.main,.top,.filters,.gthumbs,.gnav,.gfull,.gcount,.samplebar,footer,.band,.lmap{display:none!important}
  .lgrid{grid-template-columns:1fr}.gmain{max-height:360px;background:none}
}
.cf.card input,.cf.card textarea,.cf.card select{font:inherit;font-size:16px;padding:12px 14px;border-radius:8px;border:1px solid var(--line);background:var(--bg);color:var(--ink)}
.cf.card input::placeholder,.cf.card textarea::placeholder{color:var(--muted)}
.cf.card .cf-status{color:var(--muted)}
.homes .shero .wrap,.homes .filters .wrap{max-width:1400px}
.show-sm{display:none}
@media (max-width:800px){.hide-sm{display:none}.show-sm{display:inline}}
.ftoggle{display:none;margin:10px 0;font:600 15px var(--sans);padding:9px 16px;border-radius:999px;border:1px solid var(--line);background:var(--bg);color:var(--ink);cursor:pointer}
@media (max-width:760px){.ftoggle{display:inline-flex}.filters #fform{display:none}.filters.open #fform{display:flex}}
.dot{width:12px;height:12px;border-radius:50%;background:var(--brand);border:2px solid #fff;box-shadow:0 1px 4px rgba(0,0,0,.35);transform:translate(-50%,-50%)}
.dot.hl{background:var(--gold);width:16px;height:16px}
.dot{display:block}
.homes .wrap{max-width:1400px}
.hphoto img{color:transparent}