/* Estera cinematic theme: dark harbor night, editorial serif, oversized type.
   Loaded after each page's own styles; restyles the shared site layout without changing content. */
:root{
  --night:#070b10;--tide:#0d1620;--deep2:#111d29;--foam:#eef3f4;--mist:#93a3ad;--body2:#c6d0d5;
  --brand:#2b9db8;--sand:#d9c9a8;--line:rgba(238,243,244,.13);
  --ice:var(--night);--ink:var(--foam);--muted:var(--mist);--teal:var(--brand);--teal-ink:#6cc6da;--white:var(--tide);
  --disp:"Bodoni Moda","Didot","Bodoni 72",Georgia,serif;--sans:"Figtree","Helvetica Neue",Arial,sans-serif;
  color-scheme:dark;
}
body{background:var(--night);color:var(--foam);font-family:var(--sans)}
a{color:var(--teal-ink)}
h1,h2,h3,h4,.brand b,.stat b,#card .addr,.bc h4,.tc h3,.mls-a,.sal-addr{font-family:var(--disp)!important;font-weight:400!important;letter-spacing:-.02em}
.eyebrow{color:var(--mist);letter-spacing:.28em;font-weight:500;font-size:11.5px}
section{padding:clamp(64px,9vw,120px) 0}
.sh h2{font-size:clamp(2.4rem,5.4vw,4.6rem);line-height:.98;margin-top:14px;text-wrap:balance}
.sh h2 em{color:var(--sand)}
.sh p,.prose p,.about p,.note{color:var(--body2);font-weight:300}

/* header */
header.top{background:rgba(7,11,16,.72);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.brand b{font-size:22px}
.brand span{color:var(--mist);letter-spacing:.22em}
nav.main a{font-weight:500;letter-spacing:.06em;font-size:13px;text-transform:uppercase;opacity:.86}
nav.main a:hover{opacity:1}
nav.main a.call{background:transparent;border:1px solid var(--line);color:var(--foam);opacity:1}
nav.main a.call:hover{border-color:var(--brand)}

/* buttons and chips */
.btn{font-weight:600;letter-spacing:.12em;text-transform:uppercase;font-size:12.5px;min-height:50px}
.btn-teal,.btn-dark{background:var(--brand);color:var(--night);border:1px solid var(--brand)}
.btn-line,.btn-ghost{border:1px solid var(--line);color:var(--foam);background:transparent}
.btn-line:hover,.btn-ghost:hover{border-color:var(--foam)}
.chip{border:1px solid var(--line);color:var(--foam);font-weight:500;letter-spacing:.04em}
.chip[aria-pressed="true"]{background:var(--foam);color:var(--night);border-color:var(--foam)}

/* hero */
.hero{min-height:min(94vh,960px)!important;padding:150px 0 clamp(70px,9vw,120px)!important;justify-content:flex-end}
.hero::before{background:linear-gradient(90deg,rgba(7,11,16,.6) 0%,transparent 60%),linear-gradient(180deg,rgba(7,11,16,.55) 0%,rgba(7,11,16,.08) 34%,rgba(7,11,16,.22) 62%,var(--night) 100%),radial-gradient(120% 90% at 50% 45%,transparent 45%,rgba(7,11,16,.5) 100%)!important}
.hero h1{font-size:clamp(3rem,7.2vw,6.8rem)!important;line-height:.9;letter-spacing:-.035em;text-wrap:balance;animation:rise 1.3s cubic-bezier(.2,.7,.1,1) both}
@keyframes rise{from{opacity:0;transform:translateY(36px)}to{opacity:1;transform:none}}
.hero p{color:var(--foam)!important;font-weight:300;max-width:38ch!important}
.hero .wrap{align-items:end}
.stat{background:rgba(13,22,32,.55);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--line);border-radius:4px}
.stat b{font-size:clamp(2.4rem,4vw,3.4rem);line-height:1}
.stat span{color:var(--mist);letter-spacing:.04em}
.bhero{position:relative;isolation:isolate;min-height:min(78vh,760px);display:flex;flex-direction:column;justify-content:flex-end;padding:150px 0 clamp(64px,8vw,104px)!important;background:linear-gradient(90deg,rgba(7,11,16,.78) 0%,rgba(7,11,16,.25) 62%,rgba(7,11,16,.1) 100%),linear-gradient(180deg,rgba(7,11,16,.6) 0%,rgba(7,11,16,.1) 40%,var(--night) 100%),var(--bh,linear-gradient(160deg,#0d1620,#070b10)) center/cover no-repeat!important}
.bhero>.wrap{width:100%}
.bhero h1{font-size:clamp(2.8rem,7.4vw,7rem)!important;line-height:.92;letter-spacing:-.03em;text-wrap:balance}
.bhero p.lead{color:var(--foam)!important;font-weight:300}
.crumbs{color:var(--mist);letter-spacing:.12em;text-transform:uppercase;font-size:11.5px}.crumbs a{color:var(--foam)}

/* surfaces */
.blds,.about,.relo,.contact{background:var(--night)!important}
.blds,.contact{background:var(--tide)!important}
.lc,.bc,.tc,.faq details,.hl a,.others a,#card,.mls-card,.sal-card,form.val{background:var(--deep2)!important;border:1px solid var(--line)!important;color:var(--foam)!important;border-radius:4px!important;box-shadow:none!important}
.lc:hover,.bc:hover,.tc:hover,.hl a:hover,.others a:hover,.mls-card:hover{border-color:var(--brand)!important}
.bc-img,.mls-img{border-radius:0!important}
.bc-img{border-radius:3px 3px 0 0!important}
.lc .st,.lc .p,.bc .facts,#card .val,#card .cta .phone,.hl a b,.others a,.mls-p{color:var(--foam)!important}
.lc .st{color:var(--sand)!important;letter-spacing:.16em}
.lc .st.pending,#card .units .pd{color:#e3a35c!important}
.lc .bn,.lc .go,.bc .go,.tc .go,.mls-c{color:var(--teal-ink)!important;letter-spacing:.06em}
.lc .sp,.lc .sp2,.bc .ad,.bc p,.tc p,.faq p,#card .meta,.mls-m,.mls-br,.legend{color:var(--mist)!important}
.bgroup h3{font-size:clamp(1.8rem,3vw,2.6rem)}
#card .badge{background:var(--brand);color:var(--night)}
#card .units,#card .units li,#card .cta{border-color:var(--line)!important}
#card .units button{color:var(--foam)}
#card .x{color:var(--mist)}
.mapbox{border-radius:4px;border:1px solid var(--line);background:#0a1118}
.hint{background:rgba(7,11,16,.85);border:1px solid var(--line)}
.relo .tc{background:var(--deep2)!important}
.relo .tc p,.relo .sh p{color:var(--body2)!important}

/* about / Meet Ricky */
.about .me{border-radius:2px;box-shadow:none;outline:1px solid var(--brand);outline-offset:14px}
.about h2,.contact h2{font-size:clamp(2.6rem,5.6vw,5rem)!important;line-height:.95}

/* contact form */
form.val{border-radius:4px!important}
form.val label{color:var(--mist);font-weight:500;letter-spacing:.1em;text-transform:uppercase;font-size:11.5px}
form.val input,form.val textarea,form.val select{background:var(--night);border:1px solid var(--line);color:var(--foam);border-radius:4px}
.contact .lines a{color:var(--foam)}

/* inline legacy colors */
[style*="background:var(--navy);color:#fff"]{background:var(--deep2)!important}
[style*="color:var(--navy)"]{color:var(--foam)!important}
footer{background:#05080c;color:var(--mist);border-top:1px solid var(--line)}
footer .sites a{color:var(--foam)}

@media (prefers-reduced-motion:reduce){.hero h1{animation:none}}
@media (max-width:860px){.hero{min-height:88vh!important;padding-top:120px!important}.bhero{min-height:70vh}}

#mls h2{font-size:clamp(2.2rem,4.6vw,3.8rem)!important;line-height:1;margin-top:12px}
.mls-a{font-size:20px!important}

/* ---- gold accent ---- */
:root{--gold:#d4b16a;--gold-2:#e8cf96;--teal-ink:var(--gold-2)}
.eyebrow,.crumbs{color:var(--gold)!important}
.btn-teal,.btn-dark{background:linear-gradient(135deg,#e8cf96 0%,#c9a45c 55%,#b58d43 100%)!important;color:#0b0f14!important;border:0!important}
.btn-line,.btn-ghost{border-color:rgba(212,177,106,.55)!important}
.btn-line:hover,.btn-ghost:hover{border-color:var(--gold-2)!important;color:var(--gold-2)!important}
nav.main a.call{border-color:rgba(212,177,106,.6)!important;color:var(--gold-2)!important}
nav.main a:hover{color:var(--gold-2)}
.chip[aria-pressed="true"]{background:var(--gold)!important;border-color:var(--gold)!important;color:#0b0f14!important}
.chip:hover{border-color:var(--gold)}
.stat b,.lc .p,.mls-p,#card .val,.sal-price{color:var(--gold-2)!important}
.stat{border-color:rgba(212,177,106,.28)!important}
.lc .st,.lc .bn,.lc .go,.bc .go,.tc .go,.mls-c,.bc .facts,a{color:var(--gold)}
.lc .st{color:var(--gold)!important}.lc .bn,.lc .go,.bc .go,.tc .go,.mls-c{color:var(--gold-2)!important}
.lc:hover,.bc:hover,.tc:hover,.hl a:hover,.others a:hover,.mls-card:hover{border-color:var(--gold)!important}
.sh h2::after,#mls h2::after,.about h2::after,.contact h2::after{content:"";display:block;width:64px;height:1px;background:var(--gold);margin-top:22px}
.bgroup h3 i{background:var(--gold)!important}
.about .me{outline-color:var(--gold)!important}
#card .badge{background:var(--gold)!important;color:#0b0f14!important}
.mls-tag{background:rgba(11,15,20,.85)!important;color:var(--gold-2)!important;border:1px solid rgba(212,177,106,.5)}
form.val input:focus,form.val textarea:focus,form.val select:focus{outline:none;border-color:var(--gold)}
.contact .lines a,footer .sites a{color:var(--gold-2)!important}
header.top{border-bottom-color:rgba(212,177,106,.25)}
.hero h1 em,.bhero h1 em,.sh h2 em{color:var(--gold-2);font-style:italic}
#card .eb,.legend b{color:var(--gold)!important}

/* mobile header: compact */
@media (max-width:860px){
  header.top .wrap{gap:10px;padding-top:10px;padding-bottom:10px}
  .brand span{display:none}.brand b{font-size:18px}
  .logo{height:38px}
  nav.main{flex-wrap:nowrap;overflow-x:auto;gap:18px;width:100%;scrollbar-width:none;-webkit-overflow-scrolling:touch;padding-bottom:2px}
  nav.main::-webkit-scrollbar{display:none}
  nav.main a{white-space:nowrap;font-size:12px}
  nav.main a.call{padding:8px 14px}
}

/* ---- smaller headlines ---- */
.hero h1{font-size:clamp(2.6rem,5vw,4.8rem)!important;line-height:.95}
.bhero h1{font-size:clamp(2.4rem,4.6vw,4.4rem)!important;line-height:.95}
.sh h2,#mls h2{font-size:clamp(2rem,3.8vw,3.4rem)!important}
.about h2,.contact h2{font-size:clamp(2.2rem,4vw,3.6rem)!important}
.stat b{font-size:clamp(2rem,3.2vw,2.8rem)!important}

/* listing card photos */
.lc{overflow:hidden;padding-top:0!important}
.lc-img{display:grid;place-items:center;margin:0 -20px 10px;aspect-ratio:16/10;background:var(--tide) center/cover no-repeat;position:relative;color:var(--foam);font-family:var(--disp);font-size:22px;text-align:center}
.lc-tag{position:absolute;left:10px;bottom:10px;background:rgba(11,15,20,.85);color:var(--gold-2);border:1px solid rgba(212,177,106,.5);font:600 10.5px var(--sans);letter-spacing:.14em;text-transform:uppercase;padding:5px 10px;border-radius:999px}
