/* ============ Property detail — mobile-first v3 ============ */

/* ── HERO ── */
.phero{position:relative;height:62svh;min-height:340px;max-height:580px;display:flex;flex-direction:column;justify-content:flex-end;color:var(--paper);overflow:hidden}
@media(min-width:640px){.phero{height:74svh;min-height:460px}}
.phero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;animation:heroIn 1.5s var(--ease) both}
@keyframes heroIn{from{transform:scale(1.06)}to{transform:scale(1)}}
.phero .scrim{position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,9,6,.3) 0,rgba(10,9,6,0) 28%,rgba(10,9,6,.06) 52%,rgba(10,9,6,.74) 100%)}
.phero-inner{position:relative;z-index:2;width:100%;padding:0 var(--gutter) clamp(24px,5vh,48px)}
.phero .badge-row{display:flex;gap:8px;margin-bottom:12px}
.phero .pbadge{font-family:var(--f-mono);font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;padding:6px 12px;border-radius:var(--r-pill);color:var(--paper);background:rgba(20,18,12,.5);backdrop-filter:blur(6px)}
.phero .pbadge.sale{background:var(--gold-deep)}
.phero .pbadge.rent{background:#2F6F8A}
.phero .pbadge.lease{background:#6A5B8A}
.phero .eyebrow{display:flex;align-items:center;gap:11px;margin-bottom:10px}
.phero .eyebrow .ln{display:none}
.phero .eyebrow span{font-family:var(--f-mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:rgba(247,244,237,.86)}
.phero h1{font-family:var(--f-display);font-weight:400;letter-spacing:-.018em;line-height:.96;font-size:clamp(34px,6.5vw,96px)}
.phero .pprice{font-family:var(--f-display);font-weight:600;font-size:clamp(20px,3vw,34px);margin-top:10px;letter-spacing:-.01em}
.phero .pprice small{font-family:var(--f-sans);font-size:13px;font-weight:400;opacity:.82;letter-spacing:0}

/* ── SPEC BAR — horizontal scroll on mobile ── */
.specs{border-bottom:1px solid var(--line);overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.specs::-webkit-scrollbar{display:none}
.specs-in{display:flex;min-width:max-content}
@media(min-width:640px){.specs-in{min-width:0;display:grid;grid-template-columns:repeat(3,1fr)}}
@media(min-width:900px){.specs-in{grid-template-columns:repeat(6,1fr)}}
.spec{padding:clamp(14px,2.4vw,28px) clamp(14px,1.8vw,22px);border-right:1px solid var(--line-soft);flex:none;min-width:110px}
@media(min-width:640px){.spec{flex:auto;min-width:0}}
.spec:last-child{border-right:0}
.spec h6{font-family:var(--f-mono);font-size:9px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);margin-bottom:7px;font-weight:400}
.spec .v{font-family:var(--f-display);font-size:clamp(17px,2vw,26px);font-weight:500;line-height:1;letter-spacing:-.01em}

/* ── STORY + BUY CARD ── */
.story{padding:clamp(32px,7vw,88px) 0}
.story-grid{display:grid;gap:clamp(24px,4vw,52px);align-items:start}
.story-grid.with-buy .buy-card-wrap{order:-1}
@media(min-width:860px){
  .story-grid.with-buy{grid-template-columns:1.5fr .9fr}
  .story-grid.with-buy .buy-card-wrap{order:0}
}
.story .lead-k{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--accent);margin-bottom:16px;display:block}
.story h2{font-family:var(--f-display);font-weight:500;font-size:clamp(24px,3.6vw,46px);line-height:1.06;letter-spacing:-.01em;margin-bottom:18px;max-width:18ch}
.story h2 .it{font-style:italic;color:var(--accent)}
.story p{font-size:clamp(14px,1.4vw,16px);line-height:1.72;color:var(--ink-2);margin-bottom:16px;max-width:54ch}
.story p:last-child{margin-bottom:0}
.story .figcrop{position:relative;border-radius:var(--r-sm);overflow:hidden;background:var(--paper-2);aspect-ratio:16/10;margin-top:26px}
.story .figcrop img{width:100%;height:100%;object-fit:cover}

/* ── BUY / ENQUIRY CARD ── */
.buy-card{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:clamp(18px,2.4vw,28px)}
@media(min-width:860px){.buy-card{position:sticky;top:88px}}
.buy-card .bc-price{font-family:var(--f-display);font-weight:600;font-size:clamp(24px,3vw,36px);line-height:1;letter-spacing:-.01em}
.buy-card .bc-price small{font-family:var(--f-sans);font-size:13px;font-weight:400;color:var(--ink-3);letter-spacing:0}
.buy-card .bc-sub{font-family:var(--f-mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-top:5px}
.buy-card .bc-emi{margin-top:14px;padding:12px 14px;background:var(--paper-2);border-radius:var(--r-sm);display:flex;justify-content:space-between;align-items:center;gap:8px}
.buy-card .bc-emi .l{font-size:12px;color:var(--ink-3);line-height:1.4}
.buy-card .bc-emi .v{font-family:var(--f-display);font-size:18px;font-weight:600;text-align:right}
.buy-card .bc-emi a{display:block;font-family:var(--f-mono);font-size:9px;letter-spacing:.08em;text-transform:uppercase;color:var(--gold-deep);margin-top:2px}
.buy-card .bc-actions{display:flex;flex-direction:column;gap:8px;margin-top:14px}
.buy-card .bc-actions a{justify-content:center;width:100%}
.buy-card .bc-row{display:flex;gap:8px}
.buy-card .bc-row a{flex:1}
.buy-card .bc-call{border:1px solid var(--line);color:var(--ink);display:grid;place-items:center;border-radius:var(--r-pill);padding:12px;transition:.28s}
.buy-card .bc-call:hover{background:var(--ink);color:var(--paper)}
.buy-card .bc-call svg{width:20px;height:20px}
.buy-card .bc-wa{background:#25D366;color:#fff;border-radius:var(--r-pill);display:flex;align-items:center;justify-content:center;gap:8px;padding:12px}
.buy-card .bc-wa:hover{filter:brightness(.92)}
.buy-card .bc-note{font-size:12px;color:var(--muted);text-align:center;margin-top:11px;line-height:1.45}
/* hide card on mobile (sticky bar takes over) */
@media(max-width:859px){.buy-card-wrap{display:none}}

/* ── MOBILE STICKY CTA ── */
.prop-sticky-cta{
  display:flex;gap:9px;align-items:center;
  position:fixed;bottom:0;left:0;right:0;z-index:50;
  padding:12px 16px calc(12px + env(safe-area-inset-bottom));
  background:rgba(247,244,237,.95);backdrop-filter:blur(14px);
  border-top:1px solid var(--line-soft);
  box-shadow:0 -6px 20px -8px rgba(10,9,6,.16);
}
.prop-sticky-cta .cta-price{display:flex;flex-direction:column;justify-content:center;flex:1;min-width:0}
.prop-sticky-cta .cta-price .p{font-family:var(--f-display);font-size:19px;font-weight:600;letter-spacing:-.01em;line-height:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.prop-sticky-cta .cta-price .t{font-family:var(--f-mono);font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-top:2px}
.prop-sticky-cta .cta-wa{width:46px;height:46px;background:#25D366;color:#fff;border-radius:50%;display:grid;place-items:center;flex:none}
.prop-sticky-cta .cta-wa svg{width:22px;height:22px}
.prop-sticky-cta .cta-btn{flex:1.4;max-width:180px;background:var(--ink);color:var(--paper);border-radius:var(--r-sm);display:flex;align-items:center;justify-content:center;font-size:13.5px;font-weight:500;letter-spacing:.02em;min-height:46px;transition:.28s}
.prop-sticky-cta .cta-btn:hover{background:var(--gold-deep)}
@media(min-width:860px){.prop-sticky-cta{display:none}}
body.has-prop-cta{padding-bottom:80px}
@media(min-width:860px){body.has-prop-cta{padding-bottom:0}}

/* ── BAND IMAGE ── */
.band-img{position:relative;width:100%;aspect-ratio:4/3;overflow:hidden;background:var(--paper-2)}
@media(min-width:640px){.band-img{aspect-ratio:16/7}}
.band-img img{width:100%;height:100%;object-fit:cover}
.band-img figcaption{position:absolute;left:var(--gutter);bottom:16px;font-family:var(--f-mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--paper);text-shadow:0 1px 12px rgba(0,0,0,.4)}

/* ── AMENITIES + SETTING ── */
.feat{padding:clamp(32px,6vw,88px) 0}
.feat-grid{display:grid;gap:clamp(28px,4.5vw,60px)}
@media(min-width:860px){.feat-grid{grid-template-columns:1.1fr 1fr}}
.feat h3{font-family:var(--f-display);font-weight:500;font-size:clamp(20px,2.8vw,34px);line-height:1.06;letter-spacing:-.01em;margin-bottom:20px}
.amen{list-style:none;columns:1;column-gap:24px}
@media(min-width:480px){.amen{columns:2}}
.amen li{break-inside:avoid;display:flex;gap:10px;align-items:baseline;padding:10px 0;border-bottom:1px solid var(--line-soft);font-size:14px;color:var(--ink-2)}
.amen li .d{width:5px;height:5px;border-radius:50%;background:var(--accent);flex:none;transform:translateY(-2px)}
.setting p{font-size:clamp(14px,1.4vw,16px);line-height:1.72;color:var(--ink-2);margin-bottom:16px;max-width:50ch}
.setting .pill-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.setting .pill{font-family:var(--f-mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);border:1px solid var(--line);border-radius:var(--r-pill);padding:7px 13px}

/* ── SIMILAR HOMES ── */
.similar{padding:clamp(32px,5.5vw,72px) 0;border-top:1px solid var(--line-soft)}
.similar .shead{margin-bottom:clamp(18px,2.8vw,32px)}
.plist-grid{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding-bottom:4px}
.plist-grid::-webkit-scrollbar{display:none}
.plist-grid .plist{flex:none;width:clamp(220px,66vw,300px);scroll-snap-align:start}
@media(min-width:760px){.plist-grid{display:grid;grid-template-columns:repeat(3,1fr);overflow:visible;padding-bottom:0}.plist-grid .plist{width:auto}}

/* ── NEXT LISTING ── */
.p-next{display:block;position:relative;height:clamp(180px,36vw,400px);overflow:hidden;color:var(--paper)}
.p-next img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.p-next:hover img{transform:scale(1.04)}
.p-next .scrim{position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,9,6,.18),rgba(10,9,6,.6))}
.p-next .nx{position:relative;height:100%;max-width:var(--w);margin-inline:auto;padding:0 var(--gutter);display:flex;flex-direction:column;justify-content:center;gap:8px}
.p-next .nx .k{font-family:var(--f-mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:rgba(247,244,237,.76)}
.p-next .nx h3{font-family:var(--f-display);font-weight:500;font-size:clamp(26px,5vw,68px);line-height:1;letter-spacing:-.015em;display:flex;align-items:center;gap:14px}
.p-next .nx h3 .arr{font-size:.7em;transition:transform .5s var(--ease)}
.p-next:hover .nx h3 .arr{transform:translateX(10px)}
.p-next .nx .loc{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.11em;text-transform:uppercase;color:rgba(247,244,237,.76)}