/* Property card + list row — copied verbatim from PropertyCard.dc.html /
   PropertyListRow.dc.html, prefixed .pc-/.plr- exactly as in the mockups. */

.pc-root { font-family: 'Manrope', system-ui, sans-serif; background: var(--surface); border: 1px solid var(--border); border-radius: 14px; overflow: hidden; display: flex; flex-direction: column; height: 100%; transition: box-shadow .18s ease, transform .18s ease; }
.pc-root:hover { box-shadow: 0 12px 28px -12px var(--shadow); transform: translateY(-2px); }
.pc-stripe { height: 4px; display: block; }
.pc-pinned-note { font-size: 10.5px; font-weight: 700; color: var(--accent2); margin-top: -2px; }
.pc-boost { display: inline-flex; align-items: center; gap: 3px; font-weight: 700; color: var(--accent2); }
.pc-boost svg { width: 11px; height: 11px; }
.pc-photo { position: relative; height: 178px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; background-size: cover; background-position: center; }
.pc-photo svg { width: 46px; height: 46px; opacity: .55; }
.pc-chips { position: absolute; top: 10px; left: 10px; display: flex; gap: 6px; }
.pc-chip { font-size: 11px; font-weight: 700; letter-spacing: .02em; padding: 4px 9px; border-radius: 999px; color: #fff; text-transform: uppercase; }
.pc-actions { position: absolute; top: 10px; right: 10px; display: flex; gap: 6px; }
.pc-iconbtn { width: 30px; height: 30px; border-radius: 999px; background: rgba(255,255,255,.92); display: flex; align-items: center; justify-content: center; color: #26221c; }
.pc-iconbtn.is-fav { color: var(--bad); }
.pc-iconbtn svg { width: 15px; height: 15px; }
.pc-body { padding: 14px 16px 16px; display: flex; flex-direction: column; gap: 8px; flex-grow: 1; }
.pc-price-row { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.pc-price { font-family: 'Domine', serif; font-size: 20px; font-weight: 600; color: var(--text); }
.pc-pricem2 { font-size: 12px; color: var(--muted); white-space: nowrap; }
.pc-title { font-size: 14px; font-weight: 600; color: var(--text); line-height: 1.35; }
.pc-loc { display: flex; align-items: center; gap: 5px; font-size: 12.5px; color: var(--muted); }
.pc-loc svg { width: 13px; height: 13px; flex-shrink: 0; }
.pc-specs { display: flex; align-items: center; gap: 12px; font-size: 12.5px; color: var(--muted); flex-wrap: wrap; }
.pc-spec { display: flex; align-items: center; gap: 4px; }
.pc-spec svg { width: 14px; height: 14px; }
.pc-meta { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 4px; padding-top: 10px; border-top: 1px solid var(--border); }
.pc-seller { display: flex; align-items: center; gap: 5px; font-size: 11.5px; font-weight: 600; color: var(--accent); }
.pc-seller svg { width: 13px; height: 13px; }
.pc-date { font-size: 11.5px; color: var(--muted); }

.cards-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
@media (max-width: 1100px) { .cards-grid { grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (max-width: 700px) { .cards-grid { grid-template-columns: 1fr; } }

/* list row — copied verbatim from the real PropertyListRow.dc.html source
   (read in full; class names are .row-*, not .plr-* as originally guessed). */
.row-root { font-family: 'Manrope', system-ui, sans-serif; background: var(--surface); border: 1px solid var(--border); border-radius: 14px; display: flex; gap: 16px; padding: 12px 12px 12px 16px; transition: box-shadow .18s ease; position: relative; overflow: hidden; }
.row-root:hover { box-shadow: 0 12px 28px -14px var(--shadow); }
.row-stripe { position: absolute; left: 0; top: 0; bottom: 0; width: 4px; }
.row-pinned-note { font-size: 11px; font-weight: 700; color: var(--accent2); }
.row-boost { display: inline-flex; align-items: center; gap: 3px; font-weight: 700; color: var(--accent2); margin-left: 8px; }
.row-boost svg { width: 12px; height: 12px; }
.row-thumb { position: relative; width: 172px; height: 130px; border-radius: 10px; flex-shrink: 0; display: flex; align-items: center; justify-content: center; background-size: cover; background-position: center; }
.row-thumb svg { width: 32px; height: 32px; opacity: .55; }
.row-chips { position: absolute; top: 8px; left: 8px; display: flex; gap: 5px; }
.row-chip { font-size: 10px; font-weight: 700; padding: 3px 8px; border-radius: 999px; color: #fff; text-transform: uppercase; }
.row-fav { position: absolute; top: 8px; right: 8px; width: 26px; height: 26px; border-radius: 999px; background: rgba(255,255,255,.92); display: flex; align-items: center; justify-content: center; color: #26221c; }
.row-fav svg { width: 13px; height: 13px; }
.row-fav.is-fav { color: var(--bad); }
.row-body { flex-grow: 1; display: flex; flex-direction: column; gap: 6px; min-width: 0; justify-content: center; }
.row-title { font-size: 15px; font-weight: 700; color: var(--text); }
.row-loc { display: flex; align-items: center; gap: 5px; font-size: 12.5px; color: var(--muted); }
.row-loc svg { width: 13px; height: 13px; flex-shrink: 0; }
.row-specs { display: flex; align-items: center; gap: 14px; font-size: 12.5px; color: var(--muted); flex-wrap: wrap; }
.row-spec { display: flex; align-items: center; gap: 4px; }
.row-spec svg { width: 14px; height: 14px; }
.row-meta { display: flex; align-items: center; gap: 6px; font-size: 11.5px; font-weight: 700; color: var(--accent); margin-top: 2px; }
.row-meta svg { width: 13px; height: 13px; }
.row-date { font-size: 11.5px; color: var(--muted); font-weight: 400; margin-left: 4px; }
.row-price-col { flex-shrink: 0; display: flex; flex-direction: column; align-items: flex-end; justify-content: center; gap: 6px; text-align: right; min-width: 128px; }
.row-price { font-family: 'Domine', serif; font-size: 19px; font-weight: 600; color: var(--text); }
.row-pricem2 { font-size: 11.5px; color: var(--muted); }
.row-cta { margin-top: 4px; font-size: 12px; font-weight: 700; color: var(--accent); border: 1px solid var(--border); border-radius: 999px; padding: 6px 14px; }
@media (max-width: 700px) { .row-root { flex-direction: column; } .row-thumb { width: 100%; height: 160px; } .row-price-col { align-items: flex-start; text-align: left; flex-direction: row; justify-content: space-between; width: 100%; } }