/* listings.css — Matheson Group Realty MLS Listings Page
   Imports after styles.css (inherits all root vars + base styles)
*/

/* ── Page hero ─────────────────────────────────────────────────────────── */
.listings-hero{
  background:linear-gradient(135deg,var(--coal-deep) 0%,var(--coal-soft) 60%,var(--coal) 100%);
  color:var(--ivory);padding:clamp(52px,8vw,88px) 0 clamp(40px,6vw,64px);
  border-bottom:1px solid rgba(176,141,87,.2)
}
.listings-hero h1{
  font-family:var(--serif);font-weight:400;
  font-size:clamp(2rem,4.5vw,3.4rem);line-height:1.06;letter-spacing:-.01em;margin-top:10px
}
.listings-hero h1 em{color:var(--brass-lite);font-style:italic}
.listings-hero .sub{
  font-size:1.02rem;color:rgba(245,241,232,.75);margin-top:14px;max-width:36em
}

/* ── Filter bar ────────────────────────────────────────────────────────── */
.filter-bar{
  background:#fff;border-bottom:1px solid var(--line);
  position:sticky;top:74px;z-index:40;box-shadow:0 2px 12px rgba(38,49,55,.06)
}
.filter-bar .wrap{
  display:flex;flex-direction:column;gap:10px;padding-top:14px;padding-bottom:14px
}
.filter-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.filter-row-2{gap:10px}

/* Search input */
.filter-search-wrap{
  position:relative;display:flex;align-items:center;flex:1;min-width:200px;max-width:280px
}
.filter-search-icon{
  position:absolute;left:11px;color:var(--ink-soft);pointer-events:none;flex-shrink:0
}
.filter-search{
  width:100%;font-family:var(--sans);font-size:.88rem;font-weight:500;color:var(--coal);
  border:1px solid var(--line);border-radius:8px;
  padding:9px 12px 9px 32px;background:var(--ivory);transition:.18s;outline:none
}
.filter-search:focus{border-color:var(--brass);box-shadow:0 0 0 3px rgba(176,141,87,.15)}
.filter-search::placeholder{color:var(--ink-soft);font-weight:400}
.filter-select{
  font-family:var(--sans);font-size:.88rem;font-weight:600;color:var(--coal);
  border:1px solid var(--line);border-radius:8px;padding:9px 32px 9px 12px;
  background:var(--ivory) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%239a7843'/%3E%3C/svg%3E") no-repeat right 10px center;
  background-size:10px;appearance:none;-webkit-appearance:none;cursor:pointer;
  transition:.18s;min-width:120px
}
.filter-select:focus{outline:none;border-color:var(--brass);box-shadow:0 0 0 3px rgba(176,141,87,.15)}
.filter-select.has-value{border-color:var(--brass);background-color:#fdf8f0}
.filter-price-wrap{display:flex;align-items:center;gap:6px}
.filter-price-wrap span{font-size:.8rem;color:var(--ink-soft);font-weight:600}
.filter-price{
  font-family:var(--sans);font-size:.88rem;font-weight:600;color:var(--coal);
  border:1px solid var(--line);border-radius:8px;padding:9px 12px;
  background:var(--ivory);width:120px;transition:.18s
}
.filter-price:focus{outline:none;border-color:var(--brass);box-shadow:0 0 0 3px rgba(176,141,87,.15)}
.filter-clear{
  font-family:var(--sans);font-size:.84rem;font-weight:700;color:var(--brass-deep);
  background:none;border:none;cursor:pointer;padding:9px 6px;letter-spacing:.02em;
  display:none
}
.filter-clear.visible{display:block}
.filter-clear:hover{color:var(--coal)}
.filter-spacer{flex:1}
.sort-select{
  font-family:var(--sans);font-size:.84rem;font-weight:600;color:var(--ink-soft);
  border:none;background:none;cursor:pointer;padding:4px 20px 4px 0;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%2355636b'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 0 center;background-size:10px;
  appearance:none;-webkit-appearance:none
}
.sort-select:focus{outline:none}

/* ── REALTOR badge ─────────────────────────────────────────────────────── */
.realtor-badge-bar{
  background:var(--ivory2);border-bottom:1px solid var(--line);
  padding:10px 0
}
.realtor-badge-bar .wrap{
  display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap
}
.realtor-badge-bar .result-count{
  font-size:.84rem;font-weight:600;color:var(--ink-soft)
}
.realtor-badge-bar .result-count strong{color:var(--coal)}
.realtor-badge{display:flex;align-items:center}
.realtor-badge img{height:22px;display:block}

/* ── Listings grid ─────────────────────────────────────────────────────── */
.listings-main{padding:clamp(28px,4vw,48px) 0 clamp(48px,7vw,80px)}
.listings-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:24px
}
@media(max-width:980px){.listings-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.listings-grid{grid-template-columns:1fr;gap:16px}}

/* ── Property card ─────────────────────────────────────────────────────── */
.prop-card{
  background:#fff;border:1px solid var(--line);border-radius:14px;
  overflow:hidden;display:flex;flex-direction:column;
  box-shadow:0 4px 20px rgba(38,49,55,.07);
  transition:transform .2s,box-shadow .2s
}
.prop-card:hover{transform:translateY(-3px);box-shadow:0 12px 36px rgba(38,49,55,.13)}
.prop-photo{position:relative;width:100%;aspect-ratio:4/3;background:var(--ivory2);overflow:hidden}
.prop-photo img{
  width:100%;height:100%;object-fit:cover;
  transition:transform .4s ease
}
.prop-card:hover .prop-photo img{transform:scale(1.04)}
.prop-photo .photo-placeholder{
  width:100%;height:100%;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,var(--ivory2),#e8e0d0)
}
.prop-photo .photo-placeholder svg{opacity:.3}
.prop-type-badge{
  position:absolute;top:10px;left:10px;
  background:rgba(38,49,55,.82);backdrop-filter:blur(6px);
  color:var(--ivory);font-family:var(--sans);font-weight:700;
  font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;
  padding:5px 10px;border-radius:6px
}
.photo-count{
  position:absolute;bottom:10px;right:10px;
  background:rgba(38,49,55,.75);color:#fff;
  font-family:var(--sans);font-size:.72rem;font-weight:600;
  padding:4px 8px;border-radius:5px;display:flex;align-items:center;gap:5px
}
.prop-body{padding:18px 20px 20px;display:flex;flex-direction:column;flex:1}
.prop-price{
  font-family:var(--serif);font-weight:500;
  font-size:clamp(1.35rem,2.5vw,1.7rem);
  color:var(--coal);line-height:1;letter-spacing:-.01em
}
.prop-price sup{font-size:.55em;font-family:var(--sans);font-weight:700;color:var(--brass-deep);vertical-align:.35em}
.prop-addr{margin-top:8px;font-size:.9rem;font-weight:600;color:var(--coal);line-height:1.4}
.prop-city{font-size:.82rem;color:var(--ink-soft);font-weight:400;margin-top:2px}
.prop-details{
  display:flex;align-items:center;gap:0;
  margin-top:12px;flex-wrap:wrap
}
.prop-detail{
  display:flex;align-items:center;gap:5px;font-size:.82rem;
  font-weight:600;color:var(--ink-soft)
}
.prop-detail+.prop-detail::before{content:"·";margin:0 8px;color:var(--line);font-weight:700}
.prop-detail svg{flex-shrink:0;color:var(--brass)}
.prop-mls{margin-top:10px;font-size:.75rem;color:var(--ink-soft)}
.prop-footer{
  margin-top:auto;padding-top:14px;
  border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between
}
.prop-realtor-link{
  font-size:.8rem;font-weight:700;color:var(--brass-deep);
  display:flex;align-items:center;gap:5px;letter-spacing:.01em
}
.prop-realtor-link:hover{color:var(--coal)}
.prop-powered{display:flex;align-items:center}
.prop-powered img{height:18px;opacity:.75}

/* ── States ────────────────────────────────────────────────────────────── */
.listings-state{
  grid-column:1/-1;text-align:center;padding:64px 0
}
.listings-state .state-icon{
  width:60px;height:60px;background:var(--ivory2);border-radius:50%;
  display:flex;align-items:center;justify-content:center;margin:0 auto 18px
}
.listings-state h3{font-family:var(--serif);font-size:1.7rem;color:var(--coal);font-weight:400}
.listings-state p{color:var(--ink-soft);margin-top:8px;max-width:26em;margin-left:auto;margin-right:auto;line-height:1.6}

/* loading skeleton */
.skel{background:var(--ivory2);border-radius:14px;overflow:hidden;animation:skelPulse 1.4s ease-in-out infinite}
.skel-photo{width:100%;aspect-ratio:4/3}
.skel-body{padding:18px 20px 20px}
.skel-line{height:14px;border-radius:4px;background:var(--ivory2);animation:skelPulse 1.4s ease-in-out infinite}
.skel-line.skel-price{height:26px;width:55%;background:#e0d8c8;margin-bottom:12px}
.skel-line.skel-addr{width:80%;margin-bottom:8px}
.skel-line.skel-city{width:50%;margin-bottom:16px}
.skel-line.skel-det{width:65%}
@keyframes skelPulse{0%,100%{opacity:1}50%{opacity:.55}}

/* ── Load more ─────────────────────────────────────────────────────────── */
.load-more-wrap{text-align:center;margin-top:40px}
.btn-load-more{
  font-family:var(--sans);font-weight:700;font-size:.95rem;
  color:var(--coal);border:1.5px solid var(--line);background:var(--ivory);
  padding:14px 36px;border-radius:10px;cursor:pointer;
  transition:.2s;letter-spacing:.02em
}
.btn-load-more:hover{border-color:var(--brass);color:var(--brass-deep);background:#fdf8f0}
.btn-load-more:disabled{opacity:.45;cursor:not-allowed}

/* ── No-config notice ──────────────────────────────────────────────────── */
.setup-notice{
  background:linear-gradient(135deg,#fdf8f0,#f5f1e8);border:1px solid rgba(176,141,87,.3);
  border-radius:14px;padding:36px 32px;text-align:center;grid-column:1/-1
}
.setup-notice h3{font-family:var(--serif);font-weight:400;font-size:1.5rem;color:var(--coal);margin-bottom:10px}
.setup-notice p{color:var(--ink-soft);font-size:.94rem;line-height:1.65;max-width:32em;margin:0 auto}
.setup-notice code{
  font-family:monospace;background:rgba(38,49,55,.07);
  padding:2px 6px;border-radius:4px;font-size:.85em;color:var(--coal)
}

/* ── Mobile filter toggle ──────────────────────────────────────────────── */
@media(max-width:680px){
  .filter-row{gap:7px}
  .filter-search-wrap{max-width:100%;min-width:100%}
  .filter-select,.filter-price{font-size:.82rem;padding:8px 28px 8px 10px;min-width:unset}
  .filter-price{width:95px}
  .sort-select{display:none}
}

/* ── Card: hover overlay + status badge ──────────────────────────────── */
.prop-card{cursor:pointer}
.card-hover-cta{
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  background:rgba(38,49,55,.42);color:#fff;
  font-family:var(--sans);font-weight:700;font-size:.92rem;letter-spacing:.06em;
  text-transform:uppercase;opacity:0;transition:opacity .22s;pointer-events:none
}
.prop-card:hover .card-hover-cta{opacity:1}
.prop-status-badge{
  font-family:var(--sans);font-size:.72rem;font-weight:700;letter-spacing:.06em;
  text-transform:uppercase;color:var(--brass-deep);
  border:1px solid rgba(176,141,87,.35);border-radius:4px;padding:3px 7px;
  background:rgba(176,141,87,.07)
}

/* ═══════════════════════════════════════════════════════════════════════
   PROPERTY DETAIL MODAL
════════════════════════════════════════════════════════════════════════ */
.modal-overlay{
  position:fixed;inset:0;background:rgba(20,26,30,.72);
  backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);
  z-index:1000;display:flex;align-items:center;justify-content:center;
  opacity:0;pointer-events:none;transition:opacity .25s
}
.modal-overlay.open{opacity:1;pointer-events:all}

.prop-modal{
  background:#fff;border-radius:18px;
  width:min(94vw,980px);max-height:92vh;
  overflow:hidden;display:flex;flex-direction:column;
  box-shadow:0 40px 100px rgba(12,18,22,.4),0 0 0 1px rgba(0,0,0,.06);
  transform:translateY(14px) scale(.98);transition:transform .28s,opacity .25s;
  position:relative
}
.modal-overlay.open .prop-modal{transform:translateY(0) scale(1)}

.modal-close{
  position:absolute;top:14px;right:14px;z-index:20;
  width:36px;height:36px;border-radius:50%;
  background:rgba(20,26,30,.62);backdrop-filter:blur(4px);
  color:#fff;border:none;font-size:1.5rem;line-height:1;
  cursor:pointer;display:flex;align-items:center;justify-content:center;
  font-weight:300;transition:.18s
}
.modal-close:hover{background:var(--coal);transform:scale(1.08)}

/* ── Gallery ─────────────────────────────────────────────────────────── */
.modal-gallery{
  position:relative;width:100%;aspect-ratio:16/9;
  background:var(--coal-deep);flex-shrink:0;overflow:hidden
}
.gallery-track{
  display:flex;height:100%;
  transition:transform .34s cubic-bezier(.4,0,.2,1)
}
.gallery-slide{width:100%;flex-shrink:0}
.gallery-slide img{width:100%;height:100%;object-fit:cover;display:block}
.gallery-no-photo{
  position:absolute;inset:0;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:12px;
  color:rgba(176,141,87,.5);font-family:var(--sans);font-size:.82rem;
  font-weight:600;letter-spacing:.06em;text-transform:uppercase
}
.gallery-nav{
  position:absolute;top:50%;transform:translateY(-50%);
  width:42px;height:42px;border-radius:50%;
  background:rgba(255,255,255,.92);border:none;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  font-size:1.5rem;line-height:1;color:var(--coal);z-index:2;
  transition:.18s;box-shadow:0 2px 12px rgba(0,0,0,.22);
  font-weight:300
}
.gallery-nav:hover{background:#fff;box-shadow:0 4px 20px rgba(0,0,0,.3);transform:translateY(-50%) scale(1.08)}
.gallery-nav.prev{left:14px}
.gallery-nav.next{right:14px}
.gallery-counter{
  position:absolute;bottom:14px;right:16px;
  background:rgba(20,26,30,.72);color:#fff;
  font-family:var(--sans);font-size:.75rem;font-weight:700;
  padding:5px 11px;border-radius:20px;letter-spacing:.04em
}

/* ── Modal body grid ──────────────────────────────────────────────────── */
.modal-body{
  display:grid;grid-template-columns:1fr 330px;
  overflow-y:auto;flex:1;min-height:0
}

/* ── Left: property info ──────────────────────────────────────────────── */
.modal-info{
  padding:26px 28px 32px;
  border-right:1px solid var(--line);
  overflow-y:auto
}
.modal-top-row{
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:12px
}
.modal-status-badge{
  font-family:var(--sans);font-size:.72rem;font-weight:700;letter-spacing:.08em;
  text-transform:uppercase;color:var(--brass-deep);
  border:1px solid rgba(176,141,87,.4);border-radius:4px;padding:4px 9px;
  background:rgba(176,141,87,.08)
}
.modal-mls-badge{
  font-family:var(--sans);font-size:.72rem;color:var(--ink-soft);
  font-weight:600;letter-spacing:.03em
}
.modal-price{
  font-family:var(--serif);font-size:clamp(1.9rem,3vw,2.5rem);
  font-weight:500;color:var(--coal);letter-spacing:-.02em;line-height:1
}
.modal-price sup{
  font-family:var(--sans);font-size:.45em;font-weight:700;
  color:var(--brass-deep);vertical-align:.5em
}
.modal-addr{
  font-size:1.05rem;font-weight:600;color:var(--coal);
  margin-top:10px;line-height:1.35
}
.modal-city{font-size:.85rem;color:var(--ink-soft);margin-top:3px}

.modal-meta{
  display:flex;flex-wrap:wrap;gap:8px;
  margin-top:18px;padding:16px 0;
  border-top:1px solid var(--line);border-bottom:1px solid var(--line)
}
.meta-item{
  display:flex;align-items:center;gap:7px;
  font-family:var(--sans);font-size:.84rem;font-weight:600;color:var(--coal);
  padding:6px 12px;border:1px solid var(--line);border-radius:8px;
  background:var(--ivory2)
}
.meta-item svg{color:var(--brass);flex-shrink:0}

.modal-desc{
  margin-top:16px;font-size:.86rem;color:var(--ink-soft);
  line-height:1.75;max-height:130px;overflow-y:auto;
  border-left:3px solid rgba(176,141,87,.35);padding-left:14px
}
.modal-actions{
  display:flex;flex-wrap:wrap;gap:10px;margin-top:22px
}
.modal-actions .btn{font-size:.88rem;padding:11px 20px}
.modal-book-btn{
  background:var(--brass);color:var(--ivory);border-color:var(--brass)
}
.modal-book-btn:hover{background:var(--brass-deep);border-color:var(--brass-deep)}

.modal-realtor-row{
  display:flex;align-items:center;justify-content:space-between;
  flex-wrap:wrap;gap:10px;margin-top:20px;padding-top:16px;
  border-top:1px solid var(--line)
}
.modal-view-link{
  font-family:var(--sans);font-size:.8rem;font-weight:700;
  color:var(--brass-deep);display:flex;align-items:center;gap:5px;
  letter-spacing:.02em;transition:.18s
}
.modal-view-link:hover{color:var(--coal)}
.modal-powered-img{height:20px;opacity:.7;display:block}

/* ── Right: inquiry form ─────────────────────────────────────────────── */
.modal-form-panel{
  padding:26px 24px 32px;background:var(--ivory2);
  display:flex;flex-direction:column
}
.modal-form-panel h3{
  font-family:var(--serif);font-size:1.18rem;font-weight:400;
  color:var(--coal);margin-bottom:18px;letter-spacing:-.01em
}
.inq-field{
  width:100%;box-sizing:border-box;
  font-family:var(--sans);font-size:.87rem;color:var(--coal);
  border:1px solid var(--line);border-radius:8px;
  padding:10px 13px;background:#fff;margin-bottom:9px;
  transition:.18s;outline:none;
  -webkit-appearance:none;appearance:none
}
.inq-field:focus{border-color:var(--brass);box-shadow:0 0 0 3px rgba(176,141,87,.14)}
.inq-field::placeholder{color:var(--ink-soft)}
textarea.inq-field{resize:vertical;min-height:88px}
.inq-error{
  font-family:var(--sans);font-size:.8rem;color:#c0392b;
  margin-bottom:8px;padding:8px 12px;border-radius:6px;
  background:rgba(192,57,43,.07);border:1px solid rgba(192,57,43,.2)
}
.inq-submit{
  width:100%;font-family:var(--sans);font-weight:700;font-size:.92rem;
  letter-spacing:.04em;background:var(--coal);color:var(--ivory);
  border:none;border-radius:8px;padding:13px;cursor:pointer;
  transition:.18s;margin-top:2px
}
.inq-submit:hover{background:var(--coal-deep)}
.form-note{
  font-size:.78rem;color:var(--ink-soft);margin-top:11px;text-align:center;line-height:1.55
}
.form-note a{color:var(--brass-deep);font-weight:600}
.form-note a:hover{color:var(--coal)}

.form-success{text-align:center;padding:32px 16px}
.form-success .tick{
  width:52px;height:52px;border-radius:50%;
  background:linear-gradient(135deg,var(--brass),var(--brass-deep));
  color:#fff;font-size:1.5rem;display:flex;align-items:center;justify-content:center;
  margin:0 auto 16px;box-shadow:0 6px 20px rgba(176,141,87,.35)
}
.form-success h4{
  font-family:var(--serif);font-size:1.3rem;font-weight:400;color:var(--coal)
}
.form-success p{
  font-size:.86rem;color:var(--ink-soft);margin-top:10px;
  line-height:1.65;max-width:22em;margin-left:auto;margin-right:auto
}
.form-success p a{color:var(--brass-deep);font-weight:600}

/* ── Modal: responsive ────────────────────────────────────────────────── */
@media(max-width:780px){
  .modal-body{grid-template-columns:1fr}
  .modal-info{border-right:none;border-bottom:1px solid var(--line);padding:20px}
  .modal-form-panel{padding:20px}
  .prop-modal{
    border-radius:20px 20px 0 0;
    max-height:96vh;align-self:flex-end;width:100%;max-width:100%
  }
  .modal-overlay{align-items:flex-end}
  .modal-gallery{aspect-ratio:16/9}
  .modal-actions .btn{flex:1;text-align:center;justify-content:center}
}
@media(max-width:480px){
  .modal-gallery{aspect-ratio:4/3}
  .modal-price{font-size:1.85rem}
  .modal-info{padding:16px}
  .modal-form-panel{padding:16px}
}

/* ═══════════════════════════════════════════════════════════════════════
   PREMIUM CARD REDESIGN — price + details overlaid on photo
════════════════════════════════════════════════════════════════════════ */

/* Card shell: no border, elevated shadow, tighter radius */
.prop-card{
  border:none;
  border-radius:12px;
  box-shadow:0 2px 18px rgba(38,49,55,.09);
  background:var(--ivory2)
}
.prop-card:hover{
  transform:translateY(-5px);
  box-shadow:0 22px 54px rgba(38,49,55,.17)
}

/* Photo area: taller, crisp corners */
.prop-photo{
  aspect-ratio:4/3;
  border-radius:12px 12px 0 0;
  background:linear-gradient(145deg,#2a3540,#1c2830)
}
.prop-photo img{border-radius:12px 12px 0 0}

/* Full-photo gradient overlay */
.prop-overlay{
  position:absolute;inset:0;
  background:linear-gradient(
    to top,
    rgba(10,15,18,.96) 0%,
    rgba(10,15,18,.68) 28%,
    rgba(10,15,18,.18) 54%,
    transparent 78%
  );
  display:flex;flex-direction:column;justify-content:space-between;
  padding:14px;pointer-events:none;border-radius:12px 12px 0 0
}

.overlay-top{
  display:flex;justify-content:space-between;align-items:flex-start
}

/* Status/type badge — brass tint */
.prop-type-badge{
  background:rgba(176,141,87,.88);
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
  color:#fff;border-radius:5px;
  font-size:.65rem;font-weight:800;letter-spacing:.09em;text-transform:uppercase;
  padding:5px 9px;line-height:1
}

/* Photo count badge */
.photo-count{
  background:rgba(10,15,18,.65);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);
  border-radius:5px;color:#fff;
  font-size:.72rem;font-weight:700;
  padding:4px 8px;display:flex;align-items:center;gap:4px
}

.overlay-bottom{padding-bottom:2px}

.overlay-price{
  font-family:var(--serif);
  font-size:clamp(1.35rem,2.4vw,1.75rem);
  font-weight:500;color:#fff;
  letter-spacing:-.015em;line-height:1;
  text-shadow:0 1px 14px rgba(0,0,0,.55)
}
.overlay-price sup{
  font-family:var(--sans);font-size:.5em;font-weight:700;
  color:rgba(176,141,87,.95);vertical-align:.5em
}

.overlay-meta{
  font-family:var(--sans);font-size:.76rem;font-weight:600;
  color:rgba(255,255,255,.76);margin-top:5px;letter-spacing:.025em
}

/* Hover "View Details" cta — keep same but ensure above overlay */
.card-hover-cta{
  z-index:2;
  background:rgba(10,15,18,.48);
  font-size:.84rem;letter-spacing:.08em
}

/* Body: minimal — address + city only */
.prop-body{
  padding:13px 16px 16px;
  background:var(--ivory2);
  border-radius:0 0 12px 12px
}
.prop-addr{
  font-size:.88rem;font-weight:700;color:var(--coal);
  line-height:1.35;white-space:nowrap;overflow:hidden;text-overflow:ellipsis
}
.prop-city{
  font-size:.76rem;color:var(--ink-soft);margin-top:3px;
  font-weight:400;letter-spacing:.01em
}

/* Listings section: ivory background feels premium */
.listings-main{background:var(--ivory2)}
.listings-grid{gap:20px}

/* Filter bar: ivory background to match */
.filter-bar{background:var(--ivory2);border-bottom:1px solid var(--line)}
.filter-select{background-color:var(--ivory);border-color:var(--line)}
.filter-price{background-color:var(--ivory)}

/* Result count bar: matches */
.realtor-badge-bar{background:var(--ivory2)}

/* Load more: more refined */
.btn-load-more{
  background:var(--coal);color:var(--ivory);border-color:var(--coal);
  border-radius:8px;padding:13px 40px;letter-spacing:.06em;text-transform:uppercase;font-size:.82rem
}
.btn-load-more:hover{background:var(--coal-deep);border-color:var(--coal-deep);color:var(--ivory)}

/* Skeleton: match ivory bg */
.skel{background:#e8e3d8}
.skel-line{background:#ddd7cb}
.skel-line.skel-price{background:#d0c9bc}

/* ── Card map strip ──────────────────────────────────────────────────── */
.card-map{
  margin:10px -16px -16px;
  height:108px;overflow:hidden;
  border-radius:0 0 12px 12px;
  border-top:1px solid var(--line)
}
.card-map img{
  width:100%;height:100%;object-fit:cover;display:block;
  transition:transform .35s ease
}
.prop-card:hover .card-map img{transform:scale(1.05)}

/* Mobile: tighter grid gap */
@media(max-width:600px){
  .listings-grid{gap:14px}
  .prop-body{padding:11px 14px 14px}
  .overlay-price{font-size:1.25rem}
  .card-map{margin:10px -14px -14px;height:90px}
}