/* ============================================================
   NAZARET REALTY — DESIGN SYSTEM v4 (n20 prototype, 3 Nov 2026)
   The A BIGGER HERO™ look for the whole site:
   Montserrat only (no serif) · Mediterranean blue #216198 · gold #C69829 ·
   champagne #F0D99E · white. No dark navy, no coral.
   Loaded AFTER styles.css + nav-2026.css; it restyles, it never changes
   markup or behaviour, so every form, calculator and link works as before.
   ============================================================ */
@font-face{font-family:'Montserrat';font-style:normal;font-weight:400;font-display:swap;src:url(/abiggerhero/assets/fonts/montserrat-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Montserrat';font-style:normal;font-weight:500;font-display:swap;src:url(/abiggerhero/assets/fonts/montserrat-latin-500-normal.woff2) format('woff2')}
@font-face{font-family:'Montserrat';font-style:normal;font-weight:600;font-display:swap;src:url(/abiggerhero/assets/fonts/montserrat-latin-600-normal.woff2) format('woff2')}
@font-face{font-family:'Montserrat';font-style:normal;font-weight:700;font-display:swap;src:url(/abiggerhero/assets/fonts/montserrat-latin-700-normal.woff2) format('woff2')}

:root{
  /* v4 brand tokens */
  --v4-blue:#216198; --v4-blue-deep:#174C7A; --v4-blue-ink:#164A76;
  --v4-gold:#C69829; --v4-gold-ink:#7E5E10; --v4-champagne:#F0D99E; --v4-champagne-soft:#FBF4E2;
  --v4-white:#FFFFFF; --v4-text:#22323E; --v4-muted:#51616C; --v4-line:#E7DDC3;
  --v4-gold-grad:linear-gradient(135deg,#F0D99E 0%,#C69829 62%);
  --v4-font:'Montserrat',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;

  /* the old tokens, remapped — every existing rule follows */
  --navy:var(--v4-blue); --navy-deep:var(--v4-blue-deep);
  --sand:#FFFFFF; --sand-line:var(--v4-line); --seafoam:var(--v4-gold-ink);
  --coral:var(--v4-gold); --ink:var(--v4-text); --paper:#FFFFFF;
  --nz-navy:var(--v4-blue-ink); --nz-navy-hi:var(--v4-blue); --nz-cream:#FFFFFF; --nz-muted:var(--v4-muted);
}

/* ---------- one typeface everywhere (inline serif styles included) ---------- */
html body, html body *:not(svg):not(path){font-family:var(--v4-font)!important;}
body [style*="italic"], .lede{font-style:normal!important;}
body{background:#fff;color:var(--v4-text);letter-spacing:.005em;}
h1,h2,h3,h4{color:var(--v4-blue-ink);font-weight:700;letter-spacing:-.01em;line-height:1.2;}
h1{letter-spacing:-.02em;}
.mono,.eyebrow,.eb-eyebrow,.form-section-label,.side-label,.r-label,.ex-pct-tag,.wizard-label,.county-label{
  font-weight:600!important;letter-spacing:.18em!important;text-transform:uppercase;font-size:.72rem!important;}
.eyebrow,.form-section-label,.wizard-label{color:var(--v4-gold-ink);}
p,li{color:inherit;}

/* ---------- top bar ---------- */
.topnav{background:rgba(255,255,255,.96);border-bottom:1px solid var(--v4-line);}
.brand{font-weight:600!important;text-transform:uppercase;letter-spacing:.22em!important;font-size:.95rem!important;color:var(--v4-blue-ink)!important;}
.navlinks a,.nav-dd-btn{color:var(--v4-text);font-weight:600;letter-spacing:.12em;}
.navlinks a.cta,.navlinks a.nav-start{border-radius:6px!important;font-weight:700;}
/* Jeff's choice (Option A): TALK WITH MILENIA gold, GET STARTED solid blue */
.navlinks a.cta{background:var(--v4-gold-grad)!important;color:#0F3557!important;border:1px solid rgba(126,94,16,.35)!important;}
.navlinks a.nav-start{background:var(--v4-blue)!important;color:#fff!important;border:1px solid var(--v4-blue)!important;}
.navlinks a.cta:hover,.navlinks a.nav-start:hover{filter:brightness(1.05);}
.navlinks a.nav-phone{color:var(--v4-blue-ink);}
.nav-toggle svg{color:var(--v4-blue-ink);}

/* ---------- dark (blue) sections ---------- */
.hero,.band,.ex-result,.photo-hero-mobile-ctas{
  background:linear-gradient(160deg,var(--v4-blue) 0%,var(--v4-blue-deep) 100%)!important;color:#fff;}
.hero::after{background:none!important;border-bottom:1px solid rgba(240,217,158,.45);}
.hero h1,.hero h2,.hero h3,.band h1,.band h2,.band h3,.ex-result h3{color:#fff;}
.hero h1{font-size:clamp(2.3rem,5.2vw,3.6rem)!important;font-weight:700;text-transform:uppercase;letter-spacing:-.01em;}
.hero h1 span,.hero h1 em{color:var(--v4-champagne)!important;}
.hero .eyebrow,.band .eyebrow,.ex-result .r-label,.band .side-label{color:var(--v4-champagne)!important;}
.hero p,.band p,.hero .lede{color:rgba(255,255,255,.92)!important;}
.hero .lede{font-weight:400;color:rgba(255,255,255,.92)!important;}
.hero .lede[style*="italic"]{font-weight:600;font-size:1.15rem!important;color:var(--v4-champagne)!important;letter-spacing:.03em;opacity:1!important;}
.band .card,.band .side-card{background:rgba(255,255,255,.07);border:1px solid rgba(240,217,158,.35);border-radius:14px;color:#fff;}
.band .card h3,.band .card h4,.band .side-card h3{color:var(--v4-champagne)!important;}
.band a{color:var(--v4-champagne);}
.band .callout{background:rgba(255,255,255,.08);border-color:rgba(240,217,158,.4);color:#fff;}
.band .callout p,.band .callout li{color:rgba(255,255,255,.92);}
.band [class*="label"],.band .mono,.band small{color:var(--v4-champagne)!important;}
.band .faq summary{color:#fff;}
.band .faq summary::after{color:var(--v4-champagne);}
.band .card [class*="label"],.band .card .mono{color:var(--v4-champagne)!important;}
.band .wizard{color:var(--v4-text);}
.band .wizard [class*="label"],.band .wizard .mono,.band .wizard small{color:var(--v4-gold-ink)!important;}
.band .wizard .form-field label,.band .wizard h3,.band .wizard h4{color:var(--v4-blue-ink)!important;}
.band .wizard p{color:var(--v4-text)!important;}
.band .wizard .form-hint,.band .wizard .direct-contact p{color:var(--v4-muted)!important;}
.band .wizard .radio-row label,.band .wizard .checkbox-grid label,.band .wizard .consent{color:var(--v4-text)!important;}
.ex-result .r-big{color:var(--v4-champagne)!important;font-weight:700;}
footer{background:linear-gradient(160deg,var(--v4-blue-deep) 0%,#123E64 100%)!important;color:rgba(255,255,255,.82);}
footer a{color:var(--v4-champagne);}
footer strong{color:#fff!important;}
footer p,footer small,footer .fine,footer div{color:rgba(255,255,255,.84)!important;}
footer [style*="243,236,221"]{color:rgba(255,255,255,.84)!important;}

/* ---------- buttons ---------- */
.btn{border-radius:8px!important;font-weight:700;letter-spacing:.1em;padding:14px 26px;}
.btn-primary,.form-submit{background:var(--v4-gold-grad)!important;color:#0F3557!important;border:0;box-shadow:0 10px 24px -14px rgba(23,76,122,.7);}
.btn-primary:hover,.form-submit:hover{filter:brightness(1.05);}
.btn-ghost{color:#fff;border:1px solid rgba(255,255,255,.55);}
.btn-ghost.on-light{color:var(--v4-blue-ink);border:1.5px solid var(--v4-blue);background:#fff;}
.form-submit{border-radius:8px;font-weight:700;letter-spacing:.1em;}

/* ---------- light sections, cards, callouts ---------- */
section{background:#fff;}
section:nth-of-type(even):not(.band):not(.hero){background:var(--v4-champagne-soft);}
.card,.side-card,.callout{background:#fff;border:1px solid var(--v4-line);border-radius:14px;box-shadow:0 12px 34px -26px rgba(23,76,122,.55);}
.callout{border-left:5px solid var(--v4-gold)!important;}
.callout h2,.callout h3{color:var(--v4-blue-ink);}
.side-card .side-label{color:var(--v4-gold-ink);}
.process li{border-radius:14px!important;}
.process li::before{color:var(--v4-gold-ink)!important;font-weight:700;font-size:1.6rem!important;}
ul.check li::before{color:var(--v4-gold)!important;}
.faq summary{color:var(--v4-blue-ink);font-weight:700;}
.faq summary::after{color:var(--v4-gold-ink);}
.fine,.form-hint{color:var(--v4-muted);}
[style*="#3B4A50"],[style*="#4A5C63"]{color:var(--v4-muted)!important;}

/* ---------- calculator (Reward Explorer) ---------- */
.ex-tab{font-weight:700;letter-spacing:.08em;}
.ex-tab[aria-selected="true"]{color:var(--v4-blue-ink);border-bottom-color:var(--v4-gold);}
.chip{border-radius:8px;}
.chip[aria-pressed="true"]{background:var(--v4-gold-grad)!important;border-color:var(--v4-gold)!important;color:#0F3557!important;font-weight:700;}
.ex-pct-val{color:var(--v4-blue-ink)!important;font-weight:700;}
.ex-pct-tag{color:var(--v4-gold-ink)!important;}
.ex-bar i{background:var(--v4-gold-grad)!important;}
.ex-lines div.total b{color:var(--v4-gold-ink)!important;font-weight:700;}
.ex-result .ex-lines div.total b,.ex-result b{color:var(--v4-champagne)!important;}
input[type=range],input[type=checkbox],input[type=radio]{accent-color:var(--v4-blue)!important;}

/* ---------- forms (Buy wizard) ---------- */
.form-field input,.form-field select,.form-field textarea{border-radius:8px;border:1px solid #CFD8DF;background:#fff;color:var(--v4-text);}
.form-field input:focus,.form-field select:focus,.form-field textarea:focus{outline:2px solid var(--v4-blue);outline-offset:1px;border-color:var(--v4-blue);}
.form-field label{color:var(--v4-blue-ink);font-weight:600;}
.radio-row label,.checkbox-grid label{border-radius:8px;}
.result-panel .badge{background:var(--v4-gold-grad);color:#0F3557;border-radius:999px;font-weight:700;}
.form-status.error{border-left-color:var(--v4-gold);}

/* ---------- direct contact chips under forms ---------- */
.direct-contact p{color:var(--v4-muted);}
.contact-row a{color:var(--v4-blue-ink)!important;border:1px solid #BFCBD5!important;border-radius:6px!important;background:#fff!important;}
.contact-row a:hover{border-color:var(--v4-blue)!important;}

/* ---------- mobile polish ---------- */
@media (max-width:860px){
  .navlinks{background:#fff;}
  .navlinks a{border-bottom-color:var(--v4-line);}
  .hero{padding:56px 0 44px;}
  .btn{width:100%;text-align:center;}
}

/* ---------- calculator panel sits on white inside the blue band ---------- */
.band .ex-label{color:var(--v4-blue-ink)!important;}
.ex-field .hint,.ex-tab{color:var(--v4-muted)!important;}
.ex-tab[aria-selected="true"]{color:var(--v4-blue-ink)!important;}
.band .ex-result [class*="label"]{color:var(--v4-champagne)!important;}

/* ---------- homepage: the top half stays exactly as it was (agreed 3 Nov) ----------
   The hero artwork (Milenia, tiles, banner, hotspots) is an image and is untouched.
   The phone buttons under it keep their original colours, shapes and typeface. */
.photo-hero{background:linear-gradient(160deg,var(--v4-blue) 0%,var(--v4-blue-deep) 100%)!important;}
.photo-hero-media{background:#071A2C;}
.photo-hero .stat b{color:#fff!important;font-weight:700;}
.photo-hero .stat span{color:var(--v4-champagne)!important;}
.photo-hero .wrap > p{color:rgba(255,255,255,.8)!important;}
.photo-hero-mobile-ctas{--navy:#0B2942;--navy-deep:#071A2C;--coral:#DD6B4C;--sand:#F3ECDD;--sand-line:#E4D9C2;
  background:#0B2942!important;}
html body .photo-hero-mobile-ctas .btn{font-family:'Inter',sans-serif!important;border-radius:2px!important;letter-spacing:.06em!important;
  font-weight:600!important;padding:13px 26px!important;box-shadow:none!important;filter:none!important;}
html body .photo-hero-mobile-ctas .btn-primary{background:#DD6B4C!important;color:#fff!important;}
html body .photo-hero-mobile-ctas .btn-ghost{background:transparent!important;color:#F3ECDD!important;border:1px solid rgba(243,236,221,.4)!important;}

/* ---------- small grey notes and white form cards inside blue bands ---------- */
[style*="#7A8A90"],[style*="#7A8A90"] *,[style*="#8A9599"],[style*="#9AA5A9"],[style*="#7a8a90"]{color:var(--v4-muted)!important;}
.band form [class*="label"],.band form .mono{color:var(--v4-gold-ink)!important;}
.band form .form-field label,.band form h3,.band form h4{color:var(--v4-blue-ink)!important;}
.band form p,.band form .consent{color:var(--v4-text)!important;}
.table-scroll{max-width:100%;min-width:0;-webkit-overflow-scrolling:touch;}
.table-scroll:focus-visible{outline:2px solid var(--v4-blue);outline-offset:2px;}
@media (max-width:860px){.wrap{min-width:0;} .table-scroll{max-width:calc(100vw - 48px);}}

/* ---------- A1A Condo Guide specifics ---------- */
img{max-width:100%;height:auto;}
.county-photo{width:100%;max-width:100%;}
.card .sig{color:var(--v4-gold-ink)!important;font-style:normal!important;font-weight:600;}
.ratings-note,.best-for .bf-label{color:var(--v4-muted)!important;font-style:normal!important;}
.dot.filled{background:var(--v4-gold)!important;}
.dual-panel.buy{background:linear-gradient(160deg,var(--v4-blue) 0%,var(--v4-blue-deep) 100%)!important;color:#fff!important;}
.dual-panel.sell{background:var(--v4-champagne-soft)!important;color:var(--v4-text)!important;border:1px solid var(--v4-line);}
.dual-panel.buy h3,.dual-panel.buy p{color:#fff!important;}
.dual-panel.sell h3{color:var(--v4-blue-ink)!important;}
.dual-panel.sell p{color:var(--v4-text)!important;}
.dual-panel.buy .btn-ghost,.dual-panel.buy a.btn:not(.btn-primary){color:#fff;border-color:rgba(255,255,255,.6);}

/* ---------- links inside white form cards on blue bands ---------- */
.band form a:not(.btn),.band .wizard a:not(.btn){color:var(--v4-blue-ink)!important;}

/* ---------- photo panels: Mediterranean-blue veil instead of navy ---------- */
.photo-panel-media::after{background:linear-gradient(100deg,rgba(18,62,100,.92) 0%,rgba(23,76,122,.74) 34%,rgba(33,97,152,.36) 64%,rgba(33,97,152,.08) 100%)!important;}
.photo-panel .eb-eyebrow{color:var(--v4-champagne)!important;}
.photo-panel .eb-quote{color:#fff!important;font-weight:700;}
.photo-panel .eb-copy{color:rgba(255,255,255,.92)!important;}
section.photo-panel{background:var(--v4-blue-deep)!important;}
.hero .stat span,.hero small{color:var(--v4-champagne)!important;}
.hero .stat b{color:#fff!important;font-weight:700;}
ul.check{list-style:none;padding-left:0;}
