/* WorthyEstate design — taken unchanged from the live worthyestate.com (home + area pages).
   Only the block marked "ADDITIONS" at the end is new, written in the same style, for things
   the old site didn't have (forms, buttons, WhatsApp button, FAQ, machine cards). */
:root{
  --bg:#FFFFFF;
  --bg-alt:#F5F7FA;
  --navy:#0B2B4F;
  --navy-deep:#06203C;
  --gold:#B8933F;
  --gold-text:#8A6D25;
  --gold-focus:#6F5720;
  --text:#1B2733;
  --text-soft:#5A6875;
  --rule:#E2E7EC;
  --up:#1B7A4B;
  --down:#B0322A;
  --maxw:1140px;
  --gut:24px;
  color-scheme:light;
  box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px);
  padding-bottom:env(safe-area-inset-bottom,0px);
}
*,*::before,*::after{box-sizing:inherit}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:96px}
body{margin:0;background:var(--bg);color:var(--text);
  font-family:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  font-size:16px;line-height:1.6;font-variant-numeric:tabular-nums}
img,svg{display:block;max-width:100%}
a{color:inherit}
h1,h2,h3,h4{color:var(--navy);font-weight:600;letter-spacing:-.015em;margin:0;line-height:1.18}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 var(--gut)}
:focus-visible{outline:2px solid var(--gold-focus);outline-offset:2px}

/* official top bar */
.govbar{height:4px;background:var(--navy)}

/* header */
header.site{position:sticky;top:env(safe-area-inset-top,0px);z-index:30;
  background:var(--bg);border-bottom:1px solid var(--rule)}
.navrow{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-block:14px}
.logo{display:flex;align-items:center;gap:12px;text-decoration:none;flex:none}
.logo-mark{height:44px;width:auto;flex:none}
@media(max-width:520px){.logo-mark{height:38px}}
.logo-txt{font-family:'Cormorant Garamond',Georgia,serif;font-size:23px;font-weight:700;
  letter-spacing:.04em;color:var(--navy);line-height:1}
.logo-txt em{font-style:normal;color:#B08D4F}
.logo-sub{font-size:9px;letter-spacing:.24em;text-transform:uppercase;color:var(--text-soft);
  margin-top:4px;font-weight:500}
.nav-links a{margin-left:22px;font-size:14.5px;color:var(--text-soft);text-decoration:none;
  padding-bottom:3px;border-bottom:2px solid transparent}
.nav-links a:hover{color:var(--navy);border-bottom-color:var(--gold)}
@media(max-width:560px){.nav-links a{margin-left:14px;font-size:13px}}
@media(max-width:419.98px){.logo-sub{display:none}.nav-links a{margin-left:12px;white-space:nowrap}}

/* hero */
.hero{background:var(--bg);padding:58px 0 46px;border-bottom:1px solid var(--rule)}
.eyebrow{display:flex;align-items:center;gap:10px;font-size:11.5px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--text-soft);font-weight:500}
.eyebrow::before{content:"";width:26px;height:2px;background:var(--gold)}
.hero h1{font-size:clamp(32px,6.2vw,50px);margin-top:18px;max-width:15ch}
.hero h1 span{display:block;color:var(--gold-text)}
.hero p.lede{margin:18px 0 0;max-width:58ch;color:var(--text-soft);font-size:17px}
.searchbox{margin-top:30px;max-width:520px}
.searchfield{position:relative}
.searchfield svg{position:absolute;left:14px;top:50%;width:18px;height:18px;transform:translateY(-50%);
  color:var(--text-soft);pointer-events:none}
.searchbox input{width:100%;padding:13.5px 16px 13.5px 44px;font-size:16px;font-family:inherit;
  border:1.5px solid #7F8F9C;background:var(--bg-alt);color:var(--text);border-radius:2px}
.searchbox input::placeholder{color:var(--text-soft)}
.searchbox input:focus-visible{outline:2px solid var(--gold-focus);outline-offset:2px;border-color:var(--navy)}
.hint{font-size:12.5px;color:var(--text-soft);margin-top:8px}

/* stat strip */
.strip{background:var(--bg-alt);border-bottom:1px solid var(--rule)}
.strip .inner{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--rule)}
@media(min-width:760px){.strip .inner{grid-template-columns:repeat(4,1fr)}}
.stat{background:var(--bg-alt);padding:20px 4px}
.stat .n{font-size:27px;font-weight:600;color:var(--navy);line-height:1.15}
.stat .l{font-size:12.5px;color:var(--text-soft);margin-top:4px}
.up{color:var(--up)} .down{color:var(--down)}
.stat .n.up{color:var(--up)}.stat .n.down{color:var(--down)}

section{padding:54px 0}
section.alt{background:var(--bg-alt);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
h2{font-size:30px}
.sub{color:var(--text-soft);font-size:15.5px;margin-top:8px;max-width:64ch}

/* area cards */
.grid{display:grid;gap:14px;grid-template-columns:1fr;margin-top:28px}
@media(min-width:620px){.grid{grid-template-columns:1fr 1fr}}
@media(min-width:920px){.grid{grid-template-columns:repeat(3,1fr)}}
.area{background:var(--bg);border:1px solid var(--rule);border-left:2px solid transparent;
  border-radius:2px;padding:18px;text-decoration:none;display:block;transition:border-color .15s}
.area:hover{border-color:var(--rule);border-left-color:var(--gold)}
.area h3{font-size:20px}
.atype{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--text-soft);margin-top:4px}
.psf{font-size:25px;font-weight:600;color:var(--navy);margin-top:12px}
.psf small{font-size:12.5px;font-weight:400;color:var(--text-soft)}
.ameta{display:flex;justify-content:space-between;margin-top:12px;padding-top:12px;
  border-top:1px solid var(--rule);font-size:13.5px;color:var(--text-soft)}
.noresult{display:none;margin-top:22px;color:var(--text-soft)}

/* two panels */
.two{display:grid;gap:18px;grid-template-columns:1fr;margin-top:26px}
@media(min-width:760px){.two{grid-template-columns:1fr 1fr}}
.panel{background:var(--bg);border:1px solid var(--rule);border-radius:2px;padding:22px}
.panel h3{font-size:19px}
.panel ul{margin:12px 0 0;padding-left:18px;color:var(--text-soft);font-size:15px}
.panel li{margin:8px 0}

/* signup */
.signup{background:var(--bg-alt);color:var(--text);padding:46px 0;
  border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.signup h2,.signup h3{color:var(--navy)}
.signup p{color:var(--text);max-width:54ch;margin-top:10px}
.form{display:flex;gap:10px;margin-top:22px;max-width:500px;flex-wrap:wrap}
.form input{flex:1 1 250px;padding:13px 14px;font-size:15px;font-family:inherit;border-radius:2px;
  border:1px solid var(--text-soft);background:var(--bg);color:var(--text)}
.form input::placeholder{color:var(--text-soft)}
.form button{padding:13px 24px;font-size:15px;font-family:inherit;font-weight:500;
  background:var(--gold);color:#241D00;border:0;border-radius:2px;cursor:pointer}
.form button:hover{filter:brightness(1.07)}
.formnote{font-size:12.5px;color:var(--text-soft);margin-top:12px}

/* contact + footer */
.contactgrid{display:grid;gap:22px;grid-template-columns:1fr;margin-top:26px}
@media(min-width:760px){.contactgrid{grid-template-columns:1fr 1fr}}
ul.details{margin:0;padding:0;list-style:none}
ul.details li{display:flex;gap:12px;padding:12px 0;border-bottom:1px solid var(--rule)}
ul.details .dlabel{display:block;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--text-soft)}
ul.details .dval{display:block;margin:2px 0 0;font-size:15.5px;color:var(--navy)}
ul.details .dval a{text-decoration:none}
ul.details .dval a:hover{color:var(--gold-text)}
footer.site{background:var(--bg-alt);border-top:1px solid var(--rule);padding:34px 0 46px;
  font-size:14.5px;color:var(--text-soft)}
footer.site .cols{display:flex;gap:30px;flex-wrap:wrap;justify-content:space-between}
footer.site h4{font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--navy);margin-bottom:10px}
footer.site ul{margin:0;padding:0;list-style:none}
footer.site li{margin:6px 0}
footer.site a{text-decoration:none}
footer.site a:hover{color:var(--navy)}
.disclaimer{margin-top:28px;padding-top:18px;border-top:1px solid var(--rule);
  font-size:12.5px;max-width:78ch;line-height:1.7}

/* ── detail pages (from area pages) ── */
.crumbs{font-size:13.5px;color:var(--text-soft);padding-top:22px}
.crumbs ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.crumbs li+li::before{content:"\203A";margin-right:6px;color:var(--text-soft)}
.crumbs a{text-decoration:none;border-bottom:1px solid var(--rule)}
.crumbs a:hover{color:var(--navy);border-bottom-color:var(--gold)}
.ahead{padding:18px 0 34px;border-bottom:1px solid var(--rule)}
.ahead h1{font-size:clamp(30px,5.4vw,44px)}
.summary{margin:12px 0 0;font-size:17px;color:var(--text);max-width:68ch}
.dld{margin:10px 0 0;font-size:15px;color:var(--text-soft)}
.stamp{margin:14px 0 0;font-size:13.5px;color:var(--text-soft);display:flex;flex-wrap:wrap;gap:4px 18px}
.stamp b{color:var(--text);font-weight:500}
section.ptype{padding:40px 0;border-bottom:1px solid var(--rule)}
section.ptype:nth-of-type(even){background:var(--bg-alt)}
.ptype-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:6px 20px}
.ptype-head h2{font-size:26px}
.count{margin:0;font-size:14.5px;color:var(--text-soft)}
.panels{display:grid;gap:16px;grid-template-columns:1fr;margin-top:20px}
@media(min-width:760px){.panels{grid-template-columns:1fr 1fr}}
.panel.ready{border-top:2px solid var(--navy)}
.panel.offplan{border-top:2px solid var(--gold)}
.panel h4{font-size:18px;display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px}
.panel h4 span{font-size:12.5px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:var(--text-soft)}
.figs{margin:14px 0 0;display:grid;grid-template-columns:1fr 1fr;gap:14px 18px}
.figs dt{font-size:12.5px;color:var(--text-soft)}
.figs dd{margin:2px 0 0;font-size:21px;font-weight:600;color:var(--navy)}
.figs div:nth-child(n+3) dd{font-size:17px}
.flat{color:var(--text)}.na{color:var(--text-soft);font-weight:400}
.pnote{margin:14px 0 0;font-size:13.5px;color:var(--text-soft)}
.chartbox{margin-top:22px;background:var(--bg);border:1px solid var(--rule);border-radius:2px;padding:20px}
.chartbox h3{font-size:17px}
.legend{margin:8px 0 10px;font-size:13.5px;color:var(--text-soft);display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px}
.key{display:inline-block;width:18px;height:3px;vertical-align:middle}
.key.ready{background:var(--navy)}.key.offplan{background:var(--gold-text)}
.lnote{flex-basis:100%}
details{margin-top:14px}
summary{cursor:pointer;font-size:14.5px;color:var(--navy);font-weight:500}
.mtable{width:100%;border-collapse:collapse;margin-top:10px;font-size:14px}
.mtable th,.mtable td{text-align:right;padding:7px 8px;border-bottom:1px solid var(--rule)}
.mtable th:first-child{text-align:left;white-space:nowrap}
.mtable thead th{font-size:12.5px;color:var(--text-soft);font-weight:500}
.mtable td.na{text-align:left}
@media(max-width:520px){.mtable{font-size:12.5px}.mtable th,.mtable td{padding:6px 4px}}
.notes{padding:34px 0 40px}
.notes h2{font-size:22px}
.notes ul{margin:12px 0 0;padding-left:18px;color:var(--text-soft);font-size:15px;max-width:78ch}
.notes li{margin:6px 0}
.prose{padding:34px 0}
.prose.alt{background:var(--bg-alt);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.prose h2{font-size:24px}
.prose p,.prose li{max-width:78ch}
.prose p{margin:12px 0 0}
.prose ul{margin:12px 0 0;padding-left:20px}
.prose li{margin:8px 0}
.prose a,.notes a{color:var(--navy);text-underline-offset:3px}
.callout{margin-top:16px;background:var(--bg);border:1px solid var(--rule);border-left:3px solid var(--gold);border-radius:2px;padding:18px 20px}
.callout h3{font-size:18px}
.callout p{margin:10px 0 0}
.tablewrap{overflow-x:auto;margin-top:14px;border:1px solid var(--rule);border-radius:2px;background:var(--bg)}
.fnote{font-size:13.5px;color:var(--text-soft)}

/* ══ ADDITIONS (same visual language: navy, gold, 2px radius, thin rules) ══ */
.hidden{display:none!important}
.prose h3{font-size:18px;margin-top:22px}

/* buttons — same as the existing Subscribe button */
.btns{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:13px 24px;
  font-size:15px;font-family:inherit;font-weight:500;line-height:1.2;text-decoration:none;
  background:var(--gold);color:#241D00;border:1px solid var(--gold);border-radius:2px;cursor:pointer}
.btn:hover{filter:brightness(1.07)}
.btn.line{background:var(--bg);color:var(--navy);border-color:var(--navy)}
.btn.line:hover{filter:none;background:var(--bg-alt)}
.btn.sm{padding:9px 14px;font-size:14px}
.btn svg{width:17px;height:17px;flex:none}
.btn.block{width:100%}

/* header call link (mobile) */
.nav-call{color:var(--gold-text)!important;font-weight:600}
@media(min-width:761px){.nav-call{display:none}}
@media(max-width:760px){.nav-links .wide{display:none}}

/* machine cards = area cards with actions */
.area .spec{font-size:13.5px;color:var(--text-soft);margin-top:10px}
.area .spec b{color:var(--text);font-weight:500}
.area .cardlink{text-decoration:none}
.area .cardlink:hover h3{color:var(--gold-text)}
.area .acts{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:14px}
.tag{display:inline-block;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--gold-text);margin-left:6px}

/* category filter */
.filters{display:flex;gap:6px;flex-wrap:wrap;margin-top:18px}
.filters button{font-family:inherit;font-size:13.5px;padding:7px 12px;border:1px solid var(--rule);
  background:var(--bg);color:var(--text-soft);border-radius:2px;cursor:pointer}
.filters button[aria-pressed="true"]{border-color:var(--navy);color:var(--navy);box-shadow:inset 0 -2px 0 var(--gold)}

/* chips (service areas) */
.chips{display:flex;flex-wrap:wrap;gap:6px 18px;list-style:none;padding:0;margin:22px 0 0;color:var(--text-soft);font-size:15px}
.chips li{padding:4px 0;border-bottom:1px solid var(--rule)}

/* forms — fields match the existing search input */
.qform{background:var(--bg);border:1px solid var(--rule);border-top:2px solid var(--gold);border-radius:2px;padding:22px}
.qform h3{font-size:19px}
.qform .fnote{margin-top:6px}
.field{margin-top:14px}
.field label,.field .lbl{display:block;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--text-soft);margin-bottom:6px}
.field .req{color:var(--down)}
.field input,.field select,.field textarea{width:100%;padding:12px 14px;font-size:16px;font-family:inherit;
  border:1.5px solid #7F8F9C;background:var(--bg-alt);color:var(--text);border-radius:2px}
.field input:focus-visible,.field select:focus-visible,.field textarea:focus-visible{border-color:var(--navy)}
.field textarea{min-height:84px;resize:vertical}
.fhint{margin:6px 0 0;font-size:13px;color:var(--text-soft)}
/* machine field: free text + a list with its own search box */
.combo{position:relative}
.combo-row{display:flex;gap:8px}
.combo-row input{flex:1;min-width:0}
.combo-toggle{flex:none;padding:0 14px;font:600 14px/1 inherit;font-family:inherit;color:var(--navy);background:var(--bg);
  border:1.5px solid #7F8F9C;border-radius:2px;cursor:pointer}
.combo-toggle:hover,.combo-toggle[aria-expanded="true"]{border-color:var(--navy);background:var(--bg-alt)}
.combo-panel{position:absolute;left:0;right:0;z-index:20;margin-top:4px;background:var(--bg);border:1.5px solid var(--navy);
  border-radius:2px;box-shadow:0 8px 24px rgba(11,43,79,.14);padding:8px}
.combo-panel[hidden]{display:none}
.field .combo-search{padding:9px 12px;font-size:16px}
.combo-list{list-style:none;margin:8px 0 0;padding:0;max-height:260px;overflow-y:auto;overscroll-behavior:contain}
.combo-list ul{list-style:none;margin:0;padding:0}
.combo-list [hidden]{display:none}
.combo-cat{display:block;padding:8px 8px 4px;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--text-soft)}
.combo-opt{display:block;width:100%;text-align:left;padding:9px 10px;font:inherit;font-size:15px;color:var(--text);
  background:none;border:0;border-radius:2px;cursor:pointer}
.combo-opt:hover,.combo-opt:focus-visible{background:var(--bg-alt);color:var(--navy);outline:2px solid var(--gold-focus);outline-offset:-2px}
.combo-empty{margin:8px 4px 4px;font-size:14px;color:var(--text-soft)}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.radios{display:flex;gap:18px;font-size:15px}
.radios label{display:flex;align-items:center;gap:6px;color:var(--text);letter-spacing:0;text-transform:none;font-size:15px;margin:0}
.radios input{width:auto}
.qform .btn{margin-top:18px}
.form-status{margin-top:12px;font-size:14px;color:var(--navy)}
.side{display:grid;gap:28px;grid-template-columns:1fr}
@media(min-width:920px){.side{grid-template-columns:1.35fr 1fr;align-items:start}.side .stick{position:sticky;top:96px}}

/* FAQ */
details.faq{border-bottom:1px solid var(--rule);margin:0;padding:12px 0}
details.faq summary{font-size:15.5px}
details.faq p{margin:8px 0 0;color:var(--text-soft);font-size:15px;max-width:72ch}

/* simple bar chart */
.bars{display:grid;gap:10px;margin-top:14px}
.bar{display:grid;grid-template-columns:84px 1fr;gap:10px;align-items:center;font-size:13.5px;color:var(--text-soft)}
.bar .track{background:var(--bg-alt);height:30px}
.bar .fill{height:100%;background:var(--navy);color:#fff;display:flex;align-items:center;padding:0 10px;font-size:13px;white-space:nowrap}
.bar .fill.g{background:var(--gold-text)}

/* floating WhatsApp */
.wa-float{position:fixed;right:18px;bottom:18px;z-index:40;width:54px;height:54px;border-radius:50%;
  background:#25D366;display:grid;place-items:center;box-shadow:0 4px 14px rgba(11,43,79,.25)}
.wa-float svg{width:28px;height:28px;fill:#fff}
footer.site{padding-bottom:90px}
.nav-links{display:flex;align-items:center;white-space:nowrap}
@media(max-width:480px){.nav-links .hide-xs{display:none}}
.area .ameta span:last-child{white-space:nowrap;margin-left:10px}

/* quote pop-up */
.pop{position:fixed;inset:0;z-index:60;background:rgba(6,32,60,.55);display:flex;align-items:flex-start;justify-content:center;
  padding:max(24px,env(safe-area-inset-top)) 14px 24px;overflow-y:auto}
.pop[hidden]{display:none}
.pop-box{position:relative;width:100%;max-width:520px;background:var(--bg);border-radius:2px;padding:22px 20px 6px;
  box-shadow:0 18px 50px rgba(6,32,60,.35);margin:auto 0}
.pop-box .qform{border:0;border-top:2px solid var(--gold);padding:16px 0 18px}
.pop-x{position:absolute;right:8px;top:6px;width:40px;height:40px;border:0;background:none;font-size:28px;line-height:1;
  color:var(--text-soft);cursor:pointer}
.pop-x:hover{color:var(--navy)}
body.pop-open{overflow:hidden}