/* FHV shared look, approved 7 Oct 2026 ("Your pick": Refined home page, Coastal inner pages).
   One header, one contact block, one footer on every page. Loaded after each page's own styles. */
:root{--fx-cream:#faf7f2;--fx-sand:#f4f0e8;--fx-white:#fff;--fx-ink:#1a1814;--fx-ink2:#4a4640;--fx-gold:#b8722a;--fx-gold-text:#9a5d1f;--fx-line:#e8e2d8;--fx-radius:22px;--fx-shadow:0 6px 24px rgba(26,24,20,.08)}
body.fx{background:var(--fx-sand);color:var(--fx-ink);font-family:'Lato','Helvetica Neue',Arial,sans-serif;margin:0}
body.fx *{box-sizing:border-box}
body.fx a:focus-visible,body.fx button:focus-visible{outline:3px solid var(--fx-gold);outline-offset:2px}
.fx-wrap{max-width:1180px;margin:0 auto;padding-inline:24px}
@media (max-width:560px){.fx-wrap{padding-inline:16px}}

/* header */
.fx-head{background:var(--fx-ink);color:#fff;position:relative;z-index:30}
.fx-head .fx-wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-block:14px;flex-wrap:wrap}
.fx-brand{flex:1 1 0;min-width:0;display:flex;flex-direction:column;gap:2px;color:#fff!important;text-decoration:none!important;line-height:1.2}
.fx-brand .fx-n{font-family:'Playfair Display',Georgia,serif;font-size:24px;font-weight:700}
.fx-brand .fx-s{font-size:14px;color:#e8e2d8}
.fx-nav{display:flex;gap:4px;flex-wrap:wrap}
.fx-nav a{color:#fff!important;text-decoration:none!important;font-weight:700;font-size:16px;padding:10px 12px;border-radius:8px;line-height:1.3}
.fx-nav a:hover{background:rgba(255,255,255,.08)}
.fx-nav a[aria-current="page"]{box-shadow:inset 0 -3px 0 var(--fx-gold)}
.fx-menu{flex:none;display:none;background:transparent;border:1px solid #e8e2d8;color:#fff;border-radius:8px;min-width:64px;min-height:44px;font:700 16px 'Lato',sans-serif;cursor:pointer}
@media (max-width:900px){
  .fx-menu{display:inline-block}
  .fx-nav{display:none;width:100%;flex-direction:column;gap:0;padding-bottom:8px}
  .fx-nav.open{display:flex}
  .fx-nav a{padding:14px 8px;border-top:1px solid #3a3630;font-size:18px}
  .fx-brand .fx-n{font-size:20px}.fx-brand .fx-s{font-size:13px}
}

/* page title box (the old dark or plain hero becomes a white box with a gold top line) */
body.fx .hero{background:var(--fx-white)!important;color:var(--fx-ink)!important;max-width:1132px!important;margin:24px auto 8px!important;padding:44px 40px 40px!important;border-radius:var(--fx-radius);box-shadow:var(--fx-shadow);border-top:4px solid var(--fx-gold);text-align:left!important}
body.fx .hero h1{color:var(--fx-ink)!important;margin-left:0!important;margin-right:0!important;max-width:900px}
body.fx .hero h1 em,body.fx .hero h1 .gold,body.fx .hero h1 span{color:inherit!important;font-style:normal!important}
body.fx .hero-sub{color:var(--fx-ink2)!important;font-size:19px!important;font-weight:400!important;margin-left:0!important;margin-right:0!important;max-width:720px}
body.fx .hero-tag{color:var(--fx-gold-text)!important;border:0!important;padding:0!important;background:none!important;margin-bottom:12px!important;font-size:15px!important}
body.fx .hero .author-line{margin-left:0!important;margin-right:0!important;text-align:left!important}
body.fx main.container{background:var(--fx-white);border-radius:var(--fx-radius);box-shadow:var(--fx-shadow);margin:24px auto!important;padding:40px!important;border-top:4px solid var(--fx-gold)}
@media (max-width:560px){
  body.fx .hero{margin:16px 16px 8px!important;padding:28px 20px 24px!important}
  body.fx main.container{margin:16px!important;padding:24px 20px!important}
}

/* buttons: gold pill = main action, outlined pill = everything else */
body.fx .hero-cta,body.fx .btn,body.fx .cta-btn{display:inline-flex!important;align-items:center;justify-content:center;min-height:52px;padding:12px 28px!important;border-radius:999px!important;font-weight:700!important;font-size:18px!important;text-decoration:none!important;font-family:'Lato',sans-serif}
body.fx .hero-cta,body.fx .cta-btn,body.fx .btn:not([style*="transparent"]){background:var(--fx-gold)!important;color:#fff!important}

/* wide tables scroll inside their box on phones instead of pushing the page sideways */
@media (max-width:700px){body.fx table{display:block;overflow-x:auto;max-width:100%}}

/* older page parts that were wider than a phone */
@media (max-width:560px){body.fx [style*="grid-template-columns:repeat(3"]{grid-template-columns:1fr 1fr!important}body.fx .identity-block{max-width:100%;padding:1.25rem!important;word-break:break-word}}

/* readable minimum */
body.fx .hero-sub,body.fx p,body.fx li{font-size:max(1em,16px)}

/* contact block */
.fx-contact{max-width:1132px;margin:56px auto 0;background:var(--fx-white);border-radius:var(--fx-radius);box-shadow:var(--fx-shadow);padding:32px;display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;scroll-margin-top:16px}
.fx-contact h2{font-family:'Playfair Display',Georgia,serif;font-size:30px;margin:0 0 6px;color:var(--fx-ink);line-height:1.2}
.fx-contact p{margin:0;color:var(--fx-ink2);font-size:17px}
.fx-acts{display:flex;gap:10px;flex-wrap:wrap}
.fx-btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:12px 28px;border-radius:999px;font-weight:700;font-size:18px;text-decoration:none!important;font-family:'Lato',sans-serif;border:1px solid transparent}
.fx-btn.main{background:var(--fx-gold);color:#fff!important}
.fx-btn.alt{background:var(--fx-white);color:var(--fx-ink)!important;border-color:var(--fx-ink)}
@media (max-width:560px){.fx-contact{margin:40px 16px 0;padding:24px 20px}.fx-acts,.fx-btn{width:100%}}

/* footer */
.fx-foot{background:var(--fx-ink);color:#e8e2d8;padding-block:48px 32px;margin-top:56px;font-size:16px;line-height:1.6}
.fx-foot a{color:#e8e2d8!important;text-decoration:underline;text-underline-offset:3px}
.fx-foot a:hover{color:#fff!important}
.fx-cols{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:32px}
@media (max-width:900px){.fx-cols{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.fx-cols{grid-template-columns:1fr}}
.fx-col{display:flex;flex-direction:column;gap:6px;scroll-margin-top:16px}
.fx-t{color:#fff;font-weight:700;margin-bottom:2px}
.fx-me{display:flex;gap:16px;align-items:flex-start}
.fx-me img{width:84px;height:84px;border-radius:50%;object-fit:cover;border:2px solid var(--fx-gold);flex:none}
.fx-me .fx-n{font-family:'Playfair Display',Georgia,serif;font-size:22px;color:#fff;font-weight:700;line-height:1.2}
.fx-legal{border-top:1px solid #4a4640;margin-top:28px;padding-top:16px;font-size:15px;color:#cfc8bc}

/* hub pages (guides, communities) */
.fx-page{max-width:1180px;margin:24px auto 0;padding:0 24px}
.fx-title{background:var(--fx-white);border-radius:var(--fx-radius);box-shadow:var(--fx-shadow);border-top:4px solid var(--fx-gold);padding:44px 40px 40px}
.fx-title h1{font-family:'Playfair Display',Georgia,serif;font-size:clamp(34px,4.5vw,48px);margin:0 0 10px;line-height:1.15}
.fx-title p{margin:0;font-size:19px;color:var(--fx-ink2);max-width:720px;line-height:1.6}
.fx-crumbs{font-size:15px;color:var(--fx-ink2);margin-bottom:12px}
.fx-crumbs a{color:var(--fx-gold-text)}
.fx-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:28px}
@media (max-width:900px){.fx-grid{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.fx-grid{grid-template-columns:1fr}.fx-page{padding:0 16px}.fx-title{padding:28px 20px 24px}}
.fx-card{background:var(--fx-white);border-radius:var(--fx-radius);box-shadow:var(--fx-shadow);padding:24px;display:flex;flex-direction:column;gap:8px}
.fx-card h2,.fx-card h3{font-family:'Playfair Display',Georgia,serif;font-size:22px;margin:0;padding-bottom:8px;border-bottom:2px solid var(--fx-gold);line-height:1.25}
.fx-card a{color:var(--fx-gold-text);font-size:18px;line-height:1.5}
.fx-card p{margin:0;font-size:16px;color:var(--fx-ink2);line-height:1.6}
.fx-card .fx-ph{aspect-ratio:16/10;border-radius:14px;background:#d9cfbf center/cover;margin-bottom:6px}
.fx-item{display:flex;flex-direction:column;gap:2px;padding:6px 0}
.fx-item a{font-weight:700}

/* links: darker gold everywhere unless a page part sets its own */
:where(body.fx) a{color:#9a5d1f}

/* address boxes that used to sit on a dark hero */
body.fx .hero input[type="text"],body.fx .hero input:not([type]){background:#fff!important;color:var(--fx-ink)!important;border:1px solid #c9c2b6!important;border-radius:10px!important;min-height:52px;font-size:18px!important;padding:12px 16px!important}
body.fx .hero-addr{justify-content:flex-start!important;margin-left:0!important;margin-right:0!important;background:none!important;border:0!important;box-shadow:none!important;padding:0!important;gap:10px}
body.fx .hero-addr button,body.fx .hero button{border-radius:999px!important;min-height:52px}
body.fx .hero-disc{color:var(--fx-ink2)!important;text-align:left!important;margin-left:0!important;font-size:16px!important}
body.fx .hero > .container{padding:0!important;max-width:none!important;margin:0!important}

/* address box inside the title box: same look on every value page */
body.fx .fx-valuebox{margin:22px 0 4px;max-width:720px}
body.fx .fx-valuebox #estimate,body.fx .fx-valuebox .tool{background:var(--fx-cream)!important;border:1px solid var(--fx-line)!important;border-radius:16px!important;padding:18px!important;margin:0!important;box-shadow:none!important;text-align:left}
body.fx .fx-valuebox label{display:block;font-size:16px!important;color:var(--fx-ink2)!important;margin-bottom:8px}
body.fx .fx-valuebox input{width:100%!important;box-sizing:border-box;background:#fff!important;color:var(--fx-ink)!important;border:1px solid #c9c2b6!important;border-radius:10px!important;min-height:52px;font-size:18px!important;padding:12px 16px!important;margin:0 0 10px!important}
body.fx .fx-valuebox button{display:block;width:100%;min-height:52px;border:0!important;border-radius:999px!important;background:var(--fx-gold)!important;color:#fff!important;font:700 18px 'Lato',sans-serif!important;cursor:pointer}
body.fx .fx-valuebox p{font-size:15px!important;color:var(--fx-ink2)!important;margin:10px 0 0!important}

/* every typing box and menu has a visible edge */
body.fx input[type="text"],body.fx input:not([type]),body.fx select{border-color:#c9c2b6!important}

/* net proceeds calculator (community value pages) */
.fx-np{max-width:820px;margin:40px auto;background:var(--fx-white);border-radius:var(--fx-radius);box-shadow:var(--fx-shadow);padding:32px;text-align:left}
.fx-np h2{font-family:'Playfair Display',Georgia,serif;font-size:30px;margin:0 0 8px;color:var(--fx-ink);line-height:1.2}
.fx-np-lede{font-size:18px!important;color:var(--fx-ink2);margin:0 0 18px;line-height:1.6}
.fx-np-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px 18px;margin-bottom:18px}
@media (max-width:620px){.fx-np{margin:32px 16px;padding:24px 20px}.fx-np-grid{grid-template-columns:1fr}}
.fx-np-l{display:block;font-size:16px;font-weight:700;color:var(--fx-ink);margin-bottom:6px}
.fx-np-in{display:flex;align-items:center;gap:8px}
.fx-np-in span{color:var(--fx-ink2);font-size:18px}
.fx-np-in input{flex:1;min-width:0;min-height:52px;padding:12px 14px;font-size:18px;border:1px solid #c9c2b6;border-radius:10px;font-family:'Lato',sans-serif;background:#fff;color:var(--fx-ink)}
.fx-np .fx-btn{border:0;cursor:pointer;width:100%}
.fx-np-err{color:#a1281a;font-weight:700;margin:14px 0 0}
.fx-np-res{background:var(--fx-cream);border-left:4px solid var(--fx-gold);border-radius:12px;padding:16px 20px;margin-top:20px}
.fx-np-k{font-family:'DM Mono',monospace;font-size:15px;letter-spacing:.1em;text-transform:uppercase;color:var(--fx-gold-text)}
.fx-np-v{font-family:'Playfair Display',Georgia,serif;font-size:32px;font-weight:700;margin-top:4px}
.fx-np-t{width:100%;border-collapse:collapse;margin-top:14px;font-size:17px}
.fx-np-t td{padding:8px 0;border-bottom:1px solid var(--fx-line)}
.fx-np-t td:last-child{text-align:right;font-variant-numeric:tabular-nums}
.fx-np-note{font-size:16px!important;color:var(--fx-ink2);margin:14px 0 0;line-height:1.6}

/* community value pages: everything in the title box lines up on the left */
body.fx .hero .desc,body.fx .hero .region,body.fx .hero .disclaimer,body.fx .fx-valuebox .disclaimer{text-align:left!important;margin-left:0!important;margin-right:0!important;max-width:720px}
body.fx .hero .desc{font-size:19px!important;color:var(--fx-ink2)!important;line-height:1.6}
body.fx .hero .disclaimer,body.fx .fx-valuebox .disclaimer{font-size:15px!important;color:var(--fx-ink2)!important;line-height:1.55}
body.fx .hero .addr-row{max-width:720px;margin-left:0!important;margin-right:0!important;justify-content:flex-start!important}
body.fx .hero .status-pill{background:none!important;border:0!important;padding:0!important;color:var(--fx-gold-text)!important}
body.fx .fx-valuebox .valuebox h2{font-family:'Playfair Display',Georgia,serif;font-size:24px!important;margin:0 0 6px!important;text-align:left!important}
body.fx .fx-valuebox .valuebox .sub{text-align:left!important;margin:0 0 12px!important}
body.fx .fx-valuebox .addr-row{display:flex;flex-direction:column;gap:10px}
@media (max-width:560px){body.fx .fx-valuebox .valuebox .sub{display:none}}

/* home page only: Refined hero (photo, dark veil, centered), headshot in the header */
.fx-brand-photo{flex-direction:row!important;align-items:center;gap:14px}
.fx-brand-photo img{width:52px;height:52px;border-radius:50%;object-fit:cover;border:2px solid var(--fx-gold);flex:none}
.fx-brand-photo .fx-n,.fx-brand-photo .fx-s{display:block}
body.fx .fx-home-hero{max-width:none!important;margin:0!important;border-radius:0!important;border-top:0!important;box-shadow:none!important;text-align:center!important;color:#fff!important;padding:72px 24px 64px!important;background:linear-gradient(rgba(26,24,20,.62),rgba(26,24,20,.62)),url('/fhv-home-hero.jpg') center/cover!important}
body.fx .fx-home-hero h1,body.fx .fx-home-hero h1 .gold{color:#fff!important;margin-left:auto!important;margin-right:auto!important}
body.fx .fx-home-hero .hero-sub{color:#fff!important;margin-left:auto!important;margin-right:auto!important}
body.fx .fx-home-hero .hero-tag{color:#fff!important;margin-left:auto;margin-right:auto}
body.fx .fx-home-hero .hero-proof{color:#fff!important;opacity:.95}
.fx-home-label{display:block;font-size:16px;margin-bottom:.5rem;color:#fff}
.fx-addrrow{display:flex;flex-wrap:wrap;gap:10px;text-align:left}
.fx-addrrow input{order:1;flex:1 1 260px;min-width:0;min-height:56px;padding:14px 16px;font-size:18px;border:0;border-radius:12px;font-family:'Lato',sans-serif;color:var(--fx-ink);background:#fff}
.fx-addrrow .fx-btn{order:2;border:0;cursor:pointer;min-height:56px}
.fx-addrrow > div{order:3;flex-basis:100%;color:var(--fx-ink)}
.fx-hint{margin-top:10px;background:#fff;color:#a1281a;font-weight:700;border-radius:10px;padding:10px 14px;text-align:left}
body.fx .fx-home-hero #fhv-result,body.fx .fx-home-hero .rpr-slot{color:var(--fx-ink);text-align:left}
body.fx .fx-home-hero .rpr-slot:not(:empty){background:#fff;border-radius:12px}
@media (max-width:560px){body.fx .fx-home-hero{padding:40px 16px 40px!important}.fx-addrrow .fx-btn{width:100%}}
.fx-towns{padding:16px 0 8px}
.fx-towns h2{font-family:'Playfair Display',Georgia,serif;font-size:clamp(28px,4vw,38px);margin:32px 0 6px;text-align:center}
.fx-towns-lede{text-align:center;color:var(--fx-ink2);font-size:18px;margin:0 auto;max-width:640px}
.fx-towns-all{text-align:center;margin:20px 0 0;font-size:18px}
.fx-towns-all a{color:var(--fx-gold-text);font-weight:700}
.fx-brand-photo .fx-txt{display:flex;flex-direction:column;gap:2px}
body.fx .fx-home-hero{background:linear-gradient(rgba(26,24,20,.7),rgba(26,24,20,.7)),url('/fhv-home-hero.jpg') center/cover!important}
@media (max-width:560px){.fx-home-label{position:absolute;left:-9999px}body.fx .fx-home-hero .hero-sub{font-size:17px!important;margin-bottom:18px!important}body.fx .fx-home-hero h1{margin-bottom:12px!important}}

/* listing pages (rendered by the worker) carry their own element styles for header and footer */
body.fx header.fx-head{text-align:left!important;padding:0!important;margin:0!important;background:var(--fx-ink)!important;border:0!important}
body.fx footer.fx-foot{text-align:left!important;border-top:0!important;margin-top:56px!important;padding:48px 0 32px!important;font-size:16px!important;color:#e8e2d8!important;max-width:none!important}
body.fx .fx-head .fx-wrap,body.fx .fx-foot .fx-wrap{max-width:1180px;margin:0 auto;padding-inline:24px}
@media (max-width:560px){body.fx .fx-head .fx-wrap,body.fx .fx-foot .fx-wrap{padding-inline:16px}}
body.fx .fx-head nav a{font-size:16px!important}

/* home page: old homes-for-sale band gets the site's side margins on phones; no stray dot before the eyebrow */
@media (max-width:700px){body.fx .fx-home-hero ~ div .wrap,body.fx .fx-home-hero + div > .wrap{padding-left:16px!important;padding-right:16px!important}}
body.fx .fx-home-hero .hero-tag::before,body.fx .fx-home-hero .hero-tag .dot{display:none!important}
.fx-np-ask{margin-top:18px;padding-top:16px;border-top:1px solid var(--fx-line)}
.fx-np-ask label{display:block;font-size:17px;line-height:1.55;margin-bottom:10px;color:var(--fx-ink)}
.fx-np-askrow{display:flex;gap:10px;flex-wrap:wrap}
.fx-np-askrow input{flex:1 1 220px;min-width:0;min-height:52px;padding:12px 14px;font-size:18px;border:1px solid #c9c2b6;border-radius:10px;font-family:'Lato',sans-serif}
.fx-np-askrow .fx-btn{width:auto!important;cursor:pointer}
@media (max-width:560px){.fx-np-askrow .fx-btn{width:100%!important}}