/* ═══════════════════════════════════════════════════════════════
   PRIVÉ — Paid Landing Page  (/private-viewing/, page-private-viewing.php)
   Scoped under .lp. Loaded only on the LP template (see prive_enqueue_assets),
   so even bare element selectors here apply only on the LP. Chrome reuses the
   global site classes via header-lp.php; the Core Values block reuses the global
   .values-grid / .h3-style system from the About page.
   ═══════════════════════════════════════════════════════════════ */

/* ── Smooth in-page scroll (e.g. the "Request a private viewing" CTA) ─ */
html { scroll-behavior: smooth; }
#enquire { scroll-margin-top: 100px; } /* clear the fixed topbar on jump */

/* ── Hero content — subhead + filled CTA (tighten the title gap) ─ */
.lp .hero__title { margin-bottom: 20px; }
.lp .lp-hero__sub {
  font-family: var(--font-body);
  font-size: clamp(16px, 1.3vw, 19px);
  line-height: 1.6;
  letter-spacing: 0.02em;
  color: rgba(255, 255, 255, 0.85);
  max-width: 540px;
  margin-bottom: 32px;
}
.lp .lp-hero__cta {
  display: inline-block;
  font-family: var(--font-headline);
  font-size: 14px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  padding: 15px 34px;
  background: #fff;
  color: var(--color-primary);
  transition: background 0.3s, color 0.3s;
}
.lp .lp-hero__cta:hover { background: var(--color-accent); color: #fff; }

/* ── Intro / positioning ──────────────────────────────────────── */
.lp-intro { padding: 88px 0 64px; }
@media (min-width: 1024px) { .lp-intro { padding: 120px 0 80px; } }
.lp-intro__inner { max-width: 760px; }
.lp-intro__inner .body-text { margin-top: 20px; }

/* ── The Apartments — image grid + highlights (parchment band) ── */
.lp-apartments { padding: 80px 0 96px; background: var(--color-parchment); }
@media (min-width: 1024px) { .lp-apartments { padding: 104px 0 120px; } }
.lp-apartments__head { max-width: 760px; margin-bottom: 48px; }
.lp-apartments__head .body-text { margin-top: 20px; }
.lp-apartments__grid { display: grid; grid-template-columns: 1fr; gap: 16px; }
@media (min-width: 768px) { .lp-apartments__grid { grid-template-columns: repeat(3, 1fr); gap: 20px; } }
.lp-apartments__img { margin: 0; aspect-ratio: 4 / 3; overflow: hidden; background: var(--color-placeholder); }
.lp-apartments__img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.lp-apartments__highlights { list-style: none; padding: 0; margin: 56px 0 0; display: grid; grid-template-columns: 1fr; }
@media (min-width: 768px) { .lp-apartments__highlights { grid-template-columns: repeat(2, 1fr); column-gap: 64px; } }
.lp-apartments__highlights li {
  padding: 18px 0;
  border-top: 1px solid rgba(46, 71, 85, 0.15);
  font-family: var(--font-body);
  font-size: 17px;
  line-height: 1.6;
  color: var(--color-body);
}

/* ── Enquire — single centred column, no sidebar ──────────────── */
.lp-enquire { padding: 88px 0; border-top: 1px solid rgba(46, 71, 85, 0.1); }
@media (min-width: 1024px) { .lp-enquire { padding: 120px 0; } }
.lp-enquire__head { max-width: 680px; margin: 0 auto 48px; text-align: center; }
.lp-enquire__head .body-text { margin-top: 18px; }
.lp-enquire__form { max-width: 680px; margin: 0 auto; }
