/* ═══ Full-screen property explorer ═══════════════════════════════════════
   Light brand only: sky, frosted white, gold, ink. Never a dark scrim. */

/* ── the bubble tab, centred on the dock's top edge ───────────────────── */
.dock{position:relative;overflow:visible}
.explore-tab{
  position:absolute;left:50%;top:0;transform:translate(-50%,-55%);z-index:5;
  display:flex;align-items:center;gap:8px;height:34px;padding:0 8px 0 14px;border-radius:999px;
  font:700 12.5px var(--sans);color:var(--ink);letter-spacing:.01em;white-space:nowrap;
  background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(250,242,222,.95));
  border:1px solid rgba(232,194,106,.75);
  box-shadow:inset 0 1px 0 #fff, 0 0 0 4px rgba(246,213,115,.16), 0 10px 26px -10px rgba(var(--sh),.55), 0 0 22px -4px rgba(232,194,106,.55);
  transition:transform .25s var(--ease-out), box-shadow .25s;
}
.explore-tab:hover{transform:translate(-50%,-62%);box-shadow:inset 0 1px 0 #fff, 0 0 0 5px rgba(246,213,115,.24), 0 16px 32px -12px rgba(var(--sh),.6), 0 0 30px -2px rgba(232,194,106,.7)}
.explore-tab:active{transform:translate(-50%,-52%) scale(.98)}
.et-ic{display:grid;place-items:center;width:20px;height:20px;border-radius:50%;font-size:12px;color:var(--luna-btn-text);background:linear-gradient(180deg,var(--gold-hi),var(--luna-btn))}
.et-n{font-size:10.5px;min-width:22px;height:20px;padding:0 6px;border-radius:999px;display:grid;place-items:center;background:var(--ink);color:#fff}
.explore-tab::after{ /* a slow halo so it is discoverable without being loud */
  content:"";position:absolute;inset:-6px;border-radius:999px;border:1px solid rgba(232,194,106,.5);opacity:0;animation:etHalo 3.6s ease-out 2.5s infinite;pointer-events:none}
@keyframes etHalo{0%{opacity:.8;transform:scale(.92)}70%,100%{opacity:0;transform:scale(1.18)}}

/* ── the dialog + translucent backdrop ────────────────────────────────── */
.explorer{position:fixed;inset:0;width:100vw;height:100dvh;max-width:none;max-height:none;margin:0;padding:clamp(10px,2.2vh,22px) clamp(10px,2vw,28px);border:0;background:transparent;overflow:hidden;color:var(--body)}
.explorer::backdrop{background:radial-gradient(120% 90% at 50% 0%, rgba(255,255,255,.62), rgba(232,240,250,.58) 55%, rgba(250,242,222,.55));backdrop-filter:blur(18px) saturate(1.4);-webkit-backdrop-filter:blur(18px) saturate(1.4);animation:exFade .26s ease-out}
@keyframes exFade{from{opacity:0}}
html.ex-open{overflow:hidden}
.ex-panel{
  position:relative;height:100%;display:flex;flex-direction:column;border-radius:26px;overflow:hidden;
  background:linear-gradient(160deg,rgba(255,255,255,.86),rgba(255,255,255,.74) 40%,rgba(246,250,255,.78));
  border:1px solid rgba(255,255,255,.95);
  box-shadow:inset 0 1px 0 #fff, 0 2px 4px rgba(var(--sh),.10), 0 40px 100px -30px rgba(var(--sh),.55), 0 0 0 1px rgba(232,194,106,.18);
}
.ex-panel::before{content:"";position:absolute;left:24px;right:24px;top:0;height:2px;border-radius:2px;background:linear-gradient(90deg,transparent,#f2d78c,#d3ab54,#b8933f,transparent);box-shadow:0 0 12px rgba(246,213,115,.6);z-index:2}

/* morph timing (View Transitions) */
::view-transition-group(hh-explorer){animation-duration:.5s;animation-timing-function:cubic-bezier(.2,.8,.2,1)}
::view-transition-old(hh-explorer),::view-transition-new(hh-explorer){height:100%;object-fit:cover;overflow:clip}
::view-transition-new(hh-explorer){animation:exNewIn .5s cubic-bezier(.2,.8,.2,1) both}
@keyframes exNewIn{0%{opacity:0}35%{opacity:1}}

/* ── header ───────────────────────────────────────────────────────────── */
.ex-head{padding:18px 22px 10px;flex:none}
.ex-title-row{display:flex;align-items:center;gap:14px}
.ex-title{font:700 clamp(24px,2.1vw,32px)/1 var(--serif);color:var(--ink);letter-spacing:-.01em}
.ex-count{font-size:12.5px;color:var(--muted);font-weight:600;font-variant-numeric:tabular-nums}
.ex-tools{margin-left:auto;display:flex;align-items:center;gap:10px}
.ex-seg{display:flex;background:rgba(58,86,130,.08);border-radius:999px;padding:3px}
.ex-seg button{padding:6px 12px;border-radius:999px;font-size:12px;font-weight:700;color:var(--muted)}
.ex-seg button[aria-pressed="true"]{background:#fff;color:var(--ink);box-shadow:0 1px 4px rgba(var(--sh),.25)}
.ex-sort{display:flex;align-items:center;gap:6px;font-size:11.5px;color:var(--muted);font-weight:600}
.ex-sort select{height:32px;border-radius:10px;border:1px solid var(--hair);background:rgba(255,255,255,.8);padding:0 8px;font-size:12.5px;color:var(--ink)}
.ex-close{width:38px;height:38px;border-radius:50%;font-size:16px;color:var(--ink);background:#fff;border:1px solid var(--hair);box-shadow:0 4px 12px -6px rgba(var(--sh),.5)}
.ex-close:hover{border-color:var(--gold);color:var(--gold-text)}

.ex-search{
  margin-top:14px;display:flex;align-items:center;gap:10px;min-height:56px;padding:6px 8px 6px 18px;border-radius:999px;
  background:#fff;border:1px solid rgba(184,133,46,.38);
  box-shadow:inset 0 2px 4px rgba(var(--sh),.06), 0 14px 34px -16px rgba(184,133,46,.6), 0 0 0 5px rgba(246,213,115,.12);
}
.ex-search:focus-within{box-shadow:inset 0 2px 4px rgba(var(--sh),.06), 0 14px 34px -14px rgba(184,133,46,.75), 0 0 0 5px rgba(246,213,115,.3)}
.ex-search-ic{font-size:22px;color:var(--gold-core)}
.ex-search input{flex:1 1 220px;min-width:140px;border:0;outline:none;background:transparent;font:500 clamp(15px,1.15vw,18px) var(--sans);color:var(--ink)}
.ex-search input::placeholder{color:#8a93a8}
.ex-search input::-webkit-search-cancel-button{display:none}
.ex-chips{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.ex-chip{display:flex;align-items:center;gap:6px;height:30px;padding:0 6px 0 12px;border-radius:999px;font-size:12px;font-weight:700;color:var(--luna-btn-text);
  background:linear-gradient(180deg,var(--gold-hi),var(--gold));box-shadow:inset 0 1px 0 rgba(255,255,255,.7), 0 3px 8px -4px rgba(184,133,46,.7);animation:chipIn .25s var(--ease-out)}
.ex-chip span{width:18px;height:18px;border-radius:50%;display:grid;place-items:center;background:rgba(63,46,8,.12);font-size:13px}
.ex-chip:hover span{background:rgba(63,46,8,.25)}
@keyframes chipIn{from{opacity:0;transform:scale(.85)}}
.ex-luna,.ex-save{flex:none;height:40px;padding:0 14px;border-radius:999px;font-size:12.5px;font-weight:700;display:flex;align-items:center;gap:7px}
.ex-luna{color:var(--luna-btn-text);background:linear-gradient(180deg,#fbe39a,var(--luna-btn));box-shadow:inset 0 1px 0 rgba(255,255,255,.8), 0 6px 16px -8px rgba(184,133,46,.8)}
.ex-dot{width:10px;height:10px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fffdf4,var(--gold-hi) 40%,var(--gold-core));box-shadow:0 0 8px rgba(232,194,106,.9)}
.ex-save{color:var(--ink);background:rgba(58,86,130,.07)}
.ex-save:hover{background:rgba(58,86,130,.13)}

.ex-cats{display:flex;gap:8px;margin-top:12px;overflow-x:auto;scrollbar-width:none;padding:2px 2px 6px}
.ex-cats::-webkit-scrollbar{display:none}
.ex-cat{flex:none;display:flex;align-items:center;gap:7px;height:38px;padding:0 8px 0 12px;border-radius:999px;font-size:12.5px;font-weight:700;color:var(--ink);
  background:rgba(255,255,255,.75);border:1px solid #fff;box-shadow:inset 0 1px 0 #fff, 0 3px 10px -6px rgba(var(--sh),.45);transition:transform .18s var(--ease-out), background .18s}
.ex-cat:hover{transform:translateY(-1px);background:#fff}
.ex-cat b{font-size:10.5px;min-width:22px;height:20px;padding:0 6px;border-radius:999px;display:grid;place-items:center;background:rgba(58,86,130,.1);color:var(--muted)}
.ex-cat-ic{color:var(--gold-core);font-size:13px}
.ex-cat.on{background:linear-gradient(180deg,#1b2650,var(--ink));color:#fff;border-color:transparent;box-shadow:0 8px 18px -8px rgba(11,16,38,.6)}
.ex-cat.on b{background:rgba(246,213,115,.3);color:var(--gold-hi)}
.ex-cat.on .ex-cat-ic{color:var(--gold-hi)}

/* ── body: rows / grid ────────────────────────────────────────────────── */
.ex-body{flex:1;min-height:0;overflow:auto;padding:6px 22px 26px;scrollbar-width:thin;scrollbar-color:rgba(58,86,130,.25) transparent;outline:none}
.ex-row{margin-top:14px}
.ex-row-h{display:flex;align-items:center;gap:10px;margin-bottom:8px}
.ex-row-h h3{font:700 20px var(--serif);color:var(--ink)}
.ex-row-n{font-size:11px;font-weight:700;color:var(--gold-text);background:rgba(232,194,106,.2);border-radius:999px;padding:2px 8px}
.ex-seeall{font-size:12px;font-weight:700;color:var(--gold-text)}
.ex-seeall:hover{text-decoration:underline}
.ex-arrows{margin-left:auto;display:flex;gap:6px}
.ex-arr{width:32px;height:32px;border-radius:50%;background:#fff;border:1px solid var(--hair);font-size:18px;line-height:1;color:var(--ink);box-shadow:0 4px 10px -6px rgba(var(--sh),.5)}
.ex-arr:disabled{opacity:.35;cursor:default}
.ex-track{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:4px;padding:6px 4px 14px;scrollbar-width:none}
.ex-track::-webkit-scrollbar{display:none}
.ex-track .ex-card{flex:0 0 clamp(240px,22vw,320px);scroll-snap-align:start}
.ex-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:20px;padding-top:12px}

.ex-card{position:relative;border-radius:18px;overflow:hidden;background:#fff;cursor:pointer;outline:none;
  box-shadow:inset 0 1px 0 #fff, 0 2px 4px rgba(var(--sh),.08), 0 18px 34px -20px rgba(var(--sh),.5);
  transition:transform .28s var(--ease-out), box-shadow .28s}
.ex-card:hover,.ex-card:focus-visible{transform:translateY(-4px);box-shadow:inset 0 1px 0 #fff, 0 4px 8px rgba(var(--sh),.10), 0 30px 50px -24px rgba(var(--sh),.6), 0 0 0 2px rgba(232,194,106,.7)}
.ex-img{position:relative;aspect-ratio:4/3;background:linear-gradient(100deg,#e4ecf6 30%,#f4f8fd 50%,#e4ecf6 70%);background-size:220% 100%;animation:shimmer 1.3s linear infinite;overflow:hidden}
.ex-img.ready{animation:none;background:#e8eef6}
.ex-img img{width:100%;height:100%;object-fit:cover;display:block;opacity:0;transform:scale(1.04);transition:opacity .5s, transform 1.2s var(--ease-out)}
.ex-img.ready img{opacity:1;transform:scale(1)}
.ex-card:hover .ex-img img{transform:scale(1.05)}
.ex-badge{position:absolute;left:10px;top:10px;font-size:10px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--gold-text);background:rgba(255,255,255,.92);border-radius:999px;padding:3px 9px;box-shadow:0 4px 10px -6px rgba(var(--sh),.6)}
.ex-qa{position:absolute;right:10px;top:10px;display:flex;gap:6px}
.ex-qa button{width:30px;height:30px;border-radius:50%;background:rgba(255,255,255,.94);color:var(--gold-text);font-weight:800;font-size:13px;box-shadow:0 4px 10px -4px rgba(var(--sh),.55);transition:transform .15s}
.ex-qa button:hover{transform:scale(1.1)}
.ex-qa button[aria-pressed="true"]{background:linear-gradient(180deg,var(--gold-hi),var(--gold));color:var(--luna-btn-text)}
.ex-info{padding:12px 14px 14px}
.ex-price{font:700 22px/1.05 var(--serif);color:var(--ink);font-variant-numeric:tabular-nums}
.ex-name{font:600 13.5px var(--sans);color:var(--ink);margin-top:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ex-facts{font-size:12px;color:var(--body);margin-top:3px}
.ex-loc{font-size:11.5px;color:var(--muted);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ex-price,.ex-name,.ex-facts,.ex-loc{unicode-bidi:plaintext}

/* staggered entrance, once per change */
.ex-body.enter .ex-card{animation:exCardIn .42s var(--ease-out) both;animation-delay:calc(min(var(--i),12) * 35ms)}
@keyframes exCardIn{from{opacity:0;transform:translateY(14px) scale(.98)}}

/* empty state */
.ex-empty{max-width:520px;margin:8vh auto 0;text-align:center}
.ex-empty-orb{width:72px;height:72px;margin:0 auto 16px;border-radius:50%;background:radial-gradient(circle at 34% 30%,#fffdf4,var(--gold-hi) 30%,var(--gold) 55%,var(--gold-core));box-shadow:0 0 40px 6px rgba(232,194,106,.5)}
.ex-empty h3{font:700 26px var(--serif);color:var(--ink)}
.ex-empty p{margin:6px 0 16px;color:var(--muted)}
.ex-empty-acts{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.ex-empty .btn-gold{height:40px}
.ex-ghost{height:40px;padding:0 16px;border-radius:999px;background:#fff;border:1px solid var(--hair);font-weight:700;font-size:12.5px;color:var(--ink)}

/* page layers shown inside the explorer (property sheet, toast, compare tray) */
.explorer .veil{z-index:3}
.explorer .toast{z-index:4}
.compare-tray.in-explorer{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);margin:0;z-index:4;box-shadow:inset 0 1px 0 #fff, var(--e3)}

/* ── smaller screens ──────────────────────────────────────────────────── */
@media (max-width:900px){
  .ex-title-row{flex-wrap:wrap}
  .ex-tools{width:100%;margin-left:0}
  .ex-search{flex-wrap:wrap;border-radius:22px;padding:8px 10px}
  .ex-chips{justify-content:flex-start;width:100%}
  .ex-luna,.ex-save{flex:1;justify-content:center}
}
@media (max-width:720px){
  .explorer{padding:0}
  .ex-panel{border-radius:0}
  .ex-head{padding:14px 14px 8px}
  .ex-body{padding:4px 14px 90px}
  .ex-sort span{display:none}
  .ex-grid{grid-template-columns:1fr 1fr;gap:12px}
  .ex-track .ex-card{flex-basis:78vw}
  .explore-tab{font-size:12px}
  /* P3 B6: the pill hangs ~16 px into the dock; give the tabs that room so it never sits on "Featured Properties" */
  .dock .dock-head{padding-top:26px}
}
@media (max-width:420px){ .ex-grid{grid-template-columns:1fr} }
@media (prefers-reduced-motion:reduce){
  ::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none!important}
  .explore-tab::after,.ex-img,.ex-chip,.ex-body.enter .ex-card,.explorer::backdrop{animation:none!important}
}
/* close matches: what relaxing one filter adds */
.ex-close-matches{margin-top:26px;padding-top:16px;border-top:1px dashed rgba(184,133,46,.35)}
.ex-why{font-size:12px;color:var(--muted)}
.ex-why b{color:var(--gold-text)}
.ex-close-matches .ex-card{opacity:.92}
.ex-chip[data-inferred]{background:linear-gradient(180deg,#fff7df,#f6e2a6)}
/* zero results but close matches exist: a compact message, the matches stay above the fold */
.ex-empty:has(+ .ex-close-matches){margin-top:14px;max-width:none;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:6px 16px;text-align:left}
.ex-empty:has(+ .ex-close-matches) .ex-empty-orb{width:40px;height:40px;margin:0;grid-row:span 2}
.ex-empty:has(+ .ex-close-matches) h3{font-size:20px}
.ex-empty:has(+ .ex-close-matches) p{margin:0;grid-column:2}
.ex-empty:has(+ .ex-close-matches) .ex-empty-acts{grid-column:3;grid-row:1 / span 2;justify-content:flex-end}
.ex-empty + .ex-close-matches{margin-top:14px}
@media (max-width:900px){ .ex-empty:has(+ .ex-close-matches){grid-template-columns:auto 1fr} .ex-empty:has(+ .ex-close-matches) .ex-empty-acts{grid-column:1 / -1;grid-row:auto;justify-content:flex-start} }
.ex-arrows{direction:ltr}