/* =========================================================
   PROPERTY DETAILS PAGE
   Hero + curved wave divider styled after the "Luxury Living"
   flyer reference; sidebar contact card styled after the
   map/booking reference (dark "Show contacts" button etc.)
   ========================================================= */

/* ---- Hero image with curved sweep ---- */
.pd-hero{ position:relative; }
.pd-hero-img{ height:52vh; min-height:380px; max-height:560px; width:100%; object-fit:cover; }
.pd-wave{
  position:absolute; left:0; right:0; bottom:-1px;
  line-height:0;
}
.pd-wave svg{ width:100%; height:70px; display:block; }
.pd-wave path{ fill:#fff; }

.pd-badges{ position:absolute; top:24px; left:24px; display:flex; gap:8px; z-index:3; }
.pd-share-fav{ position:absolute; top:24px; right:24px; display:flex; gap:10px; z-index:3; }
.pd-share-fav button, .pd-share-fav a{
  width:42px; height:42px; border-radius:50%;
  background:rgba(255,255,255,.92);
  display:flex; align-items:center; justify-content:center;
  border:none; color:var(--color-text); box-shadow:var(--shadow-sm);
}

/* ---- Dark stats strip (price / type / size / built) ---- */
.pd-statsbar{
  background:var(--color-dark);
  color:#fff;
  padding:34px 0 26px;
}
.pd-statsbar .container{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  flex-wrap:wrap;
  gap:24px;
}
.pd-title-block h1{ color:#fff; font-size:clamp(1.5rem,3vw,2.1rem); margin-bottom:8px; }
.pd-title-block .pd-loc{ color:#b8c9c3; }
.pd-title-block .pd-loc i{ color:var(--color-gold); margin-right:6px; }
.pd-stat-row{ display:flex; gap:36px; flex-wrap:wrap; }
.pd-stat{ text-align:left; }
.pd-stat .label{ font-size:.72rem; text-transform:uppercase; letter-spacing:.06em; color:#8ea69d; margin-bottom:4px; }
.pd-stat .value{ font-family:var(--font-display); font-weight:700; font-size:1.15rem; color:#fff; }
.pd-stat .value.price{ color:var(--color-gold); font-size:1.4rem; }

/* ---- Unit overview: gallery + summary ---- */
.pd-overview{ display:grid; grid-template-columns:1fr 1fr .8fr; gap:16px; margin-top:-1px; }
.pd-gallery-item{ position:relative; border-radius:var(--radius-md); overflow:hidden; height:170px; }
.pd-gallery-item img{ width:100%; height:100%; object-fit:cover; }
.pd-gallery-item .gcap{
  position:absolute; left:0; right:0; bottom:0;
  background:linear-gradient(0deg, rgba(0,0,0,.6), transparent);
  color:#fff; font-size:.75rem; font-weight:700; letter-spacing:.04em; text-transform:uppercase;
  padding:10px 12px;
}
.pd-overview-copy{ grid-column:span 1; }
.pd-overview-copy h3{ font-size:1.1rem; }
.pd-overview-copy p{ color:var(--color-text-muted); font-size:.92rem; }
.pd-quickstats{ display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:16px; }
.pd-quickstat{ display:flex; align-items:center; gap:10px; font-size:.9rem; color:var(--color-text); }
.pd-quickstat i{ color:var(--color-primary); font-size:1.1rem; width:22px; }
.pd-address{ margin-top:16px; font-size:.85rem; color:var(--color-text-muted); display:flex; gap:8px; }

@media (max-width:1000px){
  .pd-overview{ grid-template-columns:1fr 1fr; }
  .pd-overview-copy{ grid-column:1 / -1; order:-1; }
}
@media (max-width:640px){
  .pd-overview{ grid-template-columns:1fr; }
}

/* ---- Main content layout: details + sidebar ---- */
.pd-layout{ display:grid; grid-template-columns:1fr 380px; gap:34px; align-items:start; }
.pd-block{ margin-bottom:44px; }
.pd-block h2{ font-size:1.3rem; margin-bottom:16px; }
.pd-features-grid{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.pd-feature{ display:flex; align-items:center; gap:10px; font-size:.92rem; padding:10px 0; border-bottom:1px dashed var(--color-border); }
.pd-feature i{ color:var(--color-primary); }

.pd-spec-table{ width:100%; border-collapse:collapse; }
.pd-spec-table td{ padding:12px 0; border-bottom:1px solid var(--color-border); font-size:.92rem; }
.pd-spec-table td:first-child{ color:var(--color-text-muted); width:45%; }
.pd-spec-table td:last-child{ font-weight:600; }

.map-placeholder{
  height:280px;
  border-radius:var(--radius-md);
  background:
    linear-gradient(135deg, rgba(31,122,77,.12), rgba(201,162,39,.12)),
    repeating-linear-gradient(45deg, #eef2ef 0 12px, #e6ebe7 12px 24px);
  display:flex; align-items:center; justify-content:center;
  flex-direction:column; gap:8px;
  color:var(--color-text-muted);
  border:1px dashed var(--color-border);
  text-align:center;
}
.map-placeholder i{ font-size:1.8rem; color:var(--color-primary); }

.nearby-tabs{ display:flex; gap:10px; flex-wrap:wrap; margin-bottom:16px; }
.nearby-tab{ padding:8px 16px; border:1px solid var(--color-border); border-radius:999px; font-size:.85rem; background:#fff; }
.nearby-tab.active{ background:var(--color-primary); color:#fff; border-color:var(--color-primary); }
.nearby-list{ display:none; }
.nearby-list.active{ display:block; }
.nearby-list li{ display:flex; justify-content:space-between; padding:10px 0; border-bottom:1px solid var(--color-border); font-size:.9rem; }
.nearby-list li span:last-child{ color:var(--color-text-muted); }

/* ---- Mortgage calculator ---- */
.calc-box{ background:var(--color-bg-alt); border-radius:var(--radius-md); padding:26px; }
.calc-grid{ display:grid; grid-template-columns:1fr 1fr 1fr; gap:16px; margin-bottom:18px; }
.calc-result{
  background:#fff; border-radius:var(--radius-sm); padding:18px; text-align:center;
  border:1px solid var(--color-border);
}
.calc-result .cr-value{ font-size:1.5rem; font-weight:700; color:var(--color-primary); }
.calc-result .cr-label{ font-size:.8rem; color:var(--color-text-muted); }

/* ---- Sidebar ---- */
.pd-sidebar{ position:sticky; top:90px; display:flex; flex-direction:column; gap:20px; }
.agent-card{ background:#fff; border:1px solid var(--color-border); border-radius:var(--radius-md); padding:22px; box-shadow:var(--shadow-sm); }
.agent-card .agent-row{ display:flex; gap:12px; align-items:center; margin-bottom:16px; }
.agent-card .agent-row img{ width:52px; height:52px; border-radius:50%; object-fit:cover; }
.agent-card .agent-name{ font-weight:700; }
.agent-card .agent-role{ font-size:.8rem; color:var(--color-text-muted); }
.agent-card .contact-buttons{ display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-bottom:14px; }
.agent-card .contact-buttons .btn{ width:100%; }

.contact-form-card{ background:#fff; border:1px solid var(--color-border); border-radius:var(--radius-md); padding:22px; }
.contact-form-card h3{ font-size:1.05rem; }

.related-strip{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
@media (max-width:1100px){ .related-strip{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:640px){ .related-strip{ grid-template-columns:1fr; } }

@media (max-width:1000px){
  .pd-layout{ grid-template-columns:1fr; }
  .pd-sidebar{ position:static; }
  .pd-features-grid, .calc-grid{ grid-template-columns:1fr; }
}