/* region.css — shared styles for the regional landing pages
 * (north-east.php, east.php, mornington-peninsula.php).
 *
 * Ported from the Sea Salt Marketing mock-ups (north-east/east/
 * mornington-peninsula regional pages). Palette aligned to brand-tokens /
 * the existing landing pages; global resets and the dev banner from the
 * mock-ups removed. All rules are scoped under body.rd-region so they
 * never touch the shared header/footer or other pages.
 */

.rd-region{
  --black:#0e0e0d;--charcoal:#1c1c1a;--ink:#2a2a27;--mid:#6b6b66;--stone:#9b9b95;
  --silver:#ddddd8;--linen:#f0ece4;--cream:#f7f5f0;--white:#fdfcfa;
  --gold:#b8a98a;--gold-d:#8c7d62;--gold-l:#e8dfc8;
  --serif:'Cormorant Garamond',Georgia,serif;--sans:'Jost',sans-serif;
  --ease:cubic-bezier(0.25,0.46,0.45,0.94);
}
.rd-region :where(h1,h2,h3,h4,p){margin:0}
.rd-region a{text-decoration:none;color:inherit}
.rd-region img{max-width:100%;display:block}
.rd-region .wrap{width:90%;max-width:1240px;margin:0 auto}
.rd-region .eyebrow{font-family:var(--sans);font-size:0.72rem;font-weight:500;letter-spacing:0.28em;text-transform:uppercase;color:var(--gold);margin-bottom:1.4rem}

/* ── HERO ── */
.rd-region .reg-hero{position:relative;min-height:84vh;display:flex;align-items:flex-end;color:var(--white);overflow:hidden}
.rd-region .reg-hero-bg{position:absolute;inset:0;background-size:cover;background-position:center 30%;background-repeat:no-repeat}
.rd-region .reg-hero-content{position:relative;z-index:2;padding-bottom:6rem}
.rd-region .reg-hero .eyebrow{color:var(--gold-l)}
.rd-region .reg-hero h1{font-family:var(--serif);font-weight:400;font-size:clamp(3rem,7vw,6rem);line-height:1.02;letter-spacing:-0.01em;max-width:16ch}
.rd-region .reg-hero p{font-size:clamp(1.05rem,1.6vw,1.3rem);font-weight:300;max-width:48ch;margin-top:1.6rem;color:rgba(253,252,250,0.9)}

/* ── INTRO ── */
.rd-region .reg-intro{padding:7rem 0 5rem}
.rd-region .reg-intro-grid{display:grid;grid-template-columns:1fr 1.3fr;gap:5rem;align-items:start}
.rd-region .reg-intro h2{font-family:var(--serif);font-weight:400;font-size:clamp(2rem,3.6vw,3.2rem);line-height:1.12;color:var(--black);letter-spacing:-0.01em}
.rd-region .reg-intro .lede{font-size:1.18rem;color:var(--ink);margin-bottom:1.6rem;font-weight:300}
.rd-region .reg-intro p{color:var(--mid);margin-bottom:1.2rem}
.rd-region .reg-intro p:last-child{margin-bottom:0}
.rd-region .reg-intro strong{font-weight:500;color:var(--ink)}

/* ── PROSE (SEO body copy: H2 sections shared by the regional + knockdown + sloping-block pages) ── */
.rd-region .reg-prose{padding:5.5rem 0;border-top:1px solid var(--linen)}
.rd-region .reg-prose .wrap{max-width:900px}
.rd-region .reg-prose h2{font-family:var(--serif);font-weight:400;font-size:clamp(1.7rem,3vw,2.4rem);line-height:1.15;color:var(--black);letter-spacing:-0.01em;margin-top:2.8rem}
.rd-region .reg-prose h2:first-child{margin-top:0}
.rd-region .reg-prose p{color:var(--mid);font-size:1.05rem;line-height:1.75;margin-top:1.1rem}
.rd-region .reg-prose strong{color:var(--ink);font-weight:500}

/* ── STAT STRIP ── */
.rd-region .stats{background:var(--black);color:var(--white);padding:4.5rem 0}
.rd-region .stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:2rem;text-align:center}
.rd-region .stat .num{font-family:var(--serif);font-size:clamp(2.6rem,4.5vw,3.8rem);font-weight:400;color:var(--gold-l);line-height:1}
.rd-region .stat .label{font-family:var(--sans);font-size:0.78rem;font-weight:400;letter-spacing:0.14em;text-transform:uppercase;color:var(--silver);margin-top:0.8rem}

/* ── SUBURBS ── */
.rd-region .suburbs{padding:7rem 0;background:var(--cream)}
.rd-region .suburbs-head{text-align:center;max-width:60ch;margin:0 auto 3.5rem}
.rd-region .suburbs-head h2{font-family:var(--serif);font-weight:400;font-size:clamp(2rem,3.6vw,3rem);color:var(--black);line-height:1.12}
.rd-region .suburbs-head .eyebrow{display:block}

.rd-region .suburb-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:1.2rem}
.rd-region .suburb-card{position:relative;overflow:hidden;background:var(--charcoal);color:var(--white);display:flex;align-items:flex-end;text-decoration:none;aspect-ratio:3/4;grid-column:span 2}
.rd-region .suburb-card.feature{grid-column:span 3;aspect-ratio:16/10}
.rd-region .suburb-card.third{grid-column:span 2;aspect-ratio:4/5}
.rd-region .suburb-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;transition:transform 0.7s var(--ease)}
.rd-region .suburb-card:hover .suburb-img{transform:scale(1.05)}
.rd-region .suburb-card .ph{position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(14,14,13,0.08),rgba(14,14,13,0.78))}
.rd-region .suburb-card.impression .ph{background:linear-gradient(160deg,#2a2a27 0%,#1c1c1a 60%,rgba(14,14,13,0.85) 100%)}
.rd-region .suburb-card .name{position:relative;z-index:2;padding:1.4rem}
.rd-region .suburb-card.feature .name{padding:1.8rem}
.rd-region .suburb-card .name h3{font-family:var(--serif);font-weight:500;font-size:1.5rem;line-height:1}
.rd-region .suburb-card.feature .name h3{font-size:2.1rem}
.rd-region .suburb-card .name .meta{font-family:var(--sans);font-size:0.66rem;letter-spacing:0.13em;text-transform:uppercase;color:var(--gold-l);margin-top:0.5rem}
.rd-region .suburb-card .arrow{position:absolute;top:1.2rem;right:1.2rem;z-index:2;width:36px;height:36px;border:1px solid rgba(255,255,255,0.4);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:0.95rem;transition:all 0.4s var(--ease)}
.rd-region .suburb-card:hover .arrow{background:var(--gold);border-color:var(--gold);color:var(--black)}
.rd-region .suburb-card .imp-badge{position:absolute;top:1.2rem;left:1.2rem;z-index:3;font-family:var(--sans);font-size:0.6rem;font-weight:500;letter-spacing:0.12em;text-transform:uppercase;color:var(--black);background:var(--gold-l);padding:0.3rem 0.6rem;border-radius:2px}

/* ── DROMANA showcase (Mornington Peninsula) ── */
.rd-region .dromana{display:flex;flex-direction:column;gap:1.2rem}
.rd-region .dromana-feature{position:relative;aspect-ratio:21/9;overflow:hidden;background:var(--charcoal);color:var(--white);display:flex;align-items:flex-end}
.rd-region .dromana-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.rd-region .dromana-feature .ph{position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(14,14,13,0.15),rgba(14,14,13,0.7))}
.rd-region .dromana-cap{position:relative;z-index:2;padding:2.4rem;max-width:50ch}
.rd-region .dromana-cap h3{font-family:var(--serif);font-weight:500;font-size:clamp(1.8rem,3vw,2.6rem);line-height:1.05}
.rd-region .dromana-cap p{font-family:var(--sans);font-weight:300;font-size:1rem;color:rgba(253,252,250,0.85);margin-top:0.7rem}
.rd-region .dromana-gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem}
.rd-region .gcard{position:relative;aspect-ratio:4/3;overflow:hidden;background:var(--charcoal)}
.rd-region .gcard .gcard-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;transition:transform 0.7s var(--ease)}
.rd-region .gcard:hover .gcard-img{transform:scale(1.05)}
.rd-region .gcard .ph{position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(14,14,13,0.05),rgba(14,14,13,0.35))}

/* ── PROOF ── */
.rd-region .proof{padding:7rem 0}
.rd-region .proof-inner{max-width:50ch;margin:0 auto;text-align:center}
.rd-region .proof-inner.video{max-width:880px}
.rd-region .proof .eyebrow{text-align:center}
.rd-region .proof .quote{font-family:var(--serif);font-weight:400;font-style:italic;font-size:clamp(1.6rem,3vw,2.4rem);line-height:1.32;color:var(--black)}
.rd-region .proof .quote::before{content:'\201C';color:var(--gold)}
.rd-region .proof .quote::after{content:'\201D';color:var(--gold)}
.rd-region .proof .attr{font-family:var(--sans);font-size:0.8rem;font-weight:500;letter-spacing:0.16em;text-transform:uppercase;color:var(--mid);margin-top:2rem}
.rd-region .proof-title{font-family:var(--serif);font-weight:400;font-size:clamp(1.8rem,3vw,2.6rem);color:var(--black);line-height:1.1;margin-bottom:2rem}
.rd-region .video-frame{position:relative;width:100%;aspect-ratio:16/9;background:var(--charcoal);overflow:hidden}
.rd-region .video-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

/* ── CTA ── */
.rd-region .cta{background:var(--black);color:var(--white);padding:6.5rem 0;text-align:center}
.rd-region .cta h2{font-family:var(--serif);font-weight:400;font-size:clamp(2.2rem,4vw,3.4rem);line-height:1.1;max-width:20ch;margin:0 auto 1.4rem}
.rd-region .cta p{color:var(--silver);max-width:46ch;margin:0 auto 2.6rem;font-weight:300}
.rd-region .btn{display:inline-block;font-family:var(--sans);font-size:0.82rem;font-weight:500;letter-spacing:0.16em;text-transform:uppercase;padding:1.1rem 2.6rem;background:var(--gold);color:var(--black);text-decoration:none;transition:all 0.4s var(--ease);border:1px solid var(--gold)}
.rd-region .btn:hover{background:transparent;color:var(--gold-l)}

@media (max-width:880px){
  .rd-region .reg-intro-grid{grid-template-columns:1fr;gap:2.5rem}
  .rd-region .reg-intro{padding:5rem 0 3.5rem}
  .rd-region .stats-grid{grid-template-columns:repeat(2,1fr);gap:2.5rem}
  .rd-region .suburb-grid{grid-template-columns:repeat(2,1fr)}
  .rd-region .suburb-card{grid-column:span 1}
  .rd-region .suburb-card.feature{grid-column:span 2;aspect-ratio:16/10}
  .rd-region .suburb-card.third{grid-column:span 1;aspect-ratio:4/5}
  .rd-region .reg-hero{min-height:70vh}
  .rd-region .reg-hero-content{padding-bottom:3.5rem}
  .rd-region .dromana-feature{aspect-ratio:4/3}
  .rd-region .dromana-gallery{grid-template-columns:1fr}
  .rd-region .dromana-cap{padding:1.6rem}
}
@media (max-width:540px){
  .rd-region .suburb-grid{grid-template-columns:1fr}
  .rd-region .suburb-card,.rd-region .suburb-card.feature,.rd-region .suburb-card.third{grid-column:span 1}
  .rd-region .stats-grid{grid-template-columns:1fr}
}