*{box-sizing:border-box;margin:0;padding:0}
:root{--ink:#151515;--cream:#f4f0e8;--warm:#e9dfd0;--muted:#68645d;--white:#fff;--line:rgba(21,21,21,.14)}
html{scroll-behavior:smooth}
body{font-family:"DM Sans",sans-serif;color:var(--ink);background:var(--cream);line-height:1.55}
a{text-decoration:none;color:inherit}
.nav{height:78px;display:flex;align-items:center;justify-content:space-between;padding:0 5vw;background:var(--cream);position:sticky;top:0;z-index:20;border-bottom:1px solid var(--line)}
.brand{font-weight:700;letter-spacing:.12em;font-size:15px}
.brand span{font-weight:400}
.nav nav{display:flex;align-items:center;gap:32px;font-size:13px}
.nav nav a:not(.nav-cta){opacity:.78}
.nav-cta{border:1px solid var(--ink);padding:11px 18px;border-radius:99px}
.menu{display:none;background:none;border:0;font-size:22px}
.hero{height:min(760px,calc(100vh - 78px));min-height:620px;position:relative;display:flex;align-items:flex-end;overflow:hidden;background:#333}
.hero-image{position:absolute;width:100%;height:100%;object-fit:cover;object-position:center 42%;filter:saturate(.9)}
.hero-overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.65) 0%,rgba(0,0,0,.22) 65%,rgba(0,0,0,.05) 100%),linear-gradient(0deg,rgba(0,0,0,.55),transparent 50%)}
.hero-content{position:relative;color:#fff;max-width:820px;padding:0 7vw 8vw}
.eyebrow{font-size:11px;letter-spacing:.19em;font-weight:700;margin-bottom:20px}
.hero h1{font-size:clamp(48px,7vw,92px);line-height:.98;letter-spacing:-.055em;font-weight:600}
.hero h1 em,.section-heading em,.move-copy h2 em,.about-copy h2 em,.quote h2 em{font-family:"Playfair Display",serif;font-weight:500}
.hero-copy{max-width:620px;font-size:17px;margin:28px 0 30px;color:rgba(255,255,255,.9)}
.hero-buttons{display:flex;align-items:center;gap:26px}
.button{display:inline-block;border:1px solid var(--ink);padding:14px 21px;border-radius:3px;font-weight:600;font-size:13px;cursor:pointer}
.light{background:#fff;color:#111;border-color:#fff}
.dark-button{background:var(--ink);color:#fff;border-color:var(--ink)}
.text-button{font-size:13px;border-bottom:1px solid rgba(255,255,255,.7);padding-bottom:4px}
.text-button span{margin-left:8px}
.hero-note{position:absolute;right:5vw;bottom:34px;color:#fff;font-size:9px;letter-spacing:.2em;writing-mode:vertical-rl;opacity:.8}
.intro{display:grid;grid-template-columns:1fr 2.4fr;gap:8vw;padding:110px 9vw}
.intro-label{font-size:10px;letter-spacing:.18em;font-weight:700;color:var(--muted)}
.intro h2{font-family:"Playfair Display",serif;font-size:clamp(36px,5vw,64px);font-weight:500;line-height:1.08;letter-spacing:-.03em;max-width:900px}
.intro p{max-width:700px;color:var(--muted);margin-top:28px;font-size:16px}
.move-section{background:var(--ink);color:#fff;display:grid;grid-template-columns:1fr 1fr;min-height:720px}
.move-image{min-height:600px}
.move-image img{width:100%;height:100%;object-fit:cover;filter:saturate(.75)}
.move-copy{padding:9vw 8vw;display:flex;flex-direction:column;justify-content:center}
.eyebrow.dark{color:var(--muted)}
.move-copy .eyebrow.dark{color:#b9b3aa}
.move-copy h2{font-size:clamp(40px,5vw,66px);line-height:1.04;font-weight:600;letter-spacing:-.045em}
.move-copy>p:not(.eyebrow){color:#c3c0ba;margin:28px 0 34px;max-width:560px}
.area-grid{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid rgba(255,255,255,.2);margin-bottom:34px}
.area-grid div{padding:18px 16px 18px 0;border-bottom:1px solid rgba(255,255,255,.2)}
.area-grid div:nth-child(even){padding-left:16px;border-left:1px solid rgba(255,255,255,.2)}
.area-grid strong{display:block;font-size:14px;margin-bottom:4px}
.area-grid span{display:block;color:#a9a59e;font-size:11px;line-height:1.4}
.services{padding:120px 9vw}
.section-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;margin-bottom:65px}
.section-heading h2{font-size:clamp(42px,5vw,68px);line-height:1.02;letter-spacing:-.05em;max-width:650px}
.service-list{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line)}
.service-list article{padding:28px 28px 20px 0;border-right:1px solid var(--line);margin-right:28px}
.service-list article:last-child{border-right:0}
.service-list span{font-size:10px;letter-spacing:.16em;color:var(--muted)}
.service-list h3{font-size:22px;margin:48px 0 12px}
.service-list p{font-size:13px;color:var(--muted);max-width:230px}
.about{background:#e8e0d4;display:grid;grid-template-columns:1fr 1fr;align-items:center}
.about-photo{height:760px;overflow:hidden}
.about-photo img{width:100%;height:100%;object-fit:cover;object-position:center center;filter:grayscale(1)}
.about-copy{padding:8vw}
.about-copy h2{font-size:clamp(38px,4.5vw,62px);line-height:1.05;letter-spacing:-.045em}
.about-copy>p:not(.eyebrow){color:#625e58;max-width:570px;margin-top:24px}
.about-copy .button{margin-top:28px}
.quote{padding:125px 9vw;text-align:center;background:#fff}
.quote-mark{font-family:"Playfair Display",serif;font-size:80px;line-height:.6}
.quote h2{font-family:"DM Sans",sans-serif;font-size:clamp(34px,5vw,62px);line-height:1.05;letter-spacing:-.045em;font-weight:600;max-width:1000px;margin:30px auto 0}
.contact{background:var(--ink);color:#fff;padding:110px 9vw;display:grid;grid-template-columns:1fr 1fr;gap:9vw}
.contact h2{font-size:clamp(44px,5vw,72px);line-height:1;letter-spacing:-.05em}
.contact-copy>p:not(.eyebrow){color:#bbb7b0;max-width:520px;margin-top:25px}
.contact-details{display:flex;gap:45px;margin-top:55px}
.contact-details span{display:block;color:#89857e;font-size:9px;letter-spacing:.15em;margin-bottom:7px}
.contact-details strong{font-size:11px;letter-spacing:.05em}
.contact-form{background:#f5f1e9;color:var(--ink);padding:35px}
.contact-form label{display:block;font-size:11px;font-weight:600;margin-bottom:18px}
.contact-form input,.contact-form select,.contact-form textarea{display:block;width:100%;margin-top:7px;padding:13px 12px;border:1px solid #ccc6bc;background:#fff;font:inherit;font-size:13px;outline:none}
.contact-form textarea{resize:vertical}
.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus{border-color:#555}
.full{width:100%;font:inherit}
footer{background:#111;color:#aaa;padding:35px 5vw;display:flex;align-items:center;justify-content:space-between;gap:25px;font-size:11px}
footer .brand{color:#fff}
footer a{color:#fff}
@media(max-width:850px){.nav{height:68px;padding:0 6vw}.nav nav{display:none}.menu{display:block}.hero{min-height:650px;height:calc(100vh - 68px)}.hero-content{padding:0 7vw 13vw}.hero h1{font-size:52px}.hero-copy{font-size:15px}.hero-buttons{flex-direction:column;align-items:flex-start;gap:18px}.hero-note{display:none}.intro,.move-section,.about,.contact{grid-template-columns:1fr}.intro{padding:80px 7vw}.intro-label{margin-bottom:25px}.move-image{height:430px;min-height:0}.move-copy{padding:75px 7vw}.services{padding:85px 7vw}.section-heading{display:block;margin-bottom:45px}.section-heading .eyebrow{margin-bottom:25px}.service-list{grid-template-columns:1fr 1fr}.service-list article{border-bottom:1px solid var(--line);padding-bottom:35px}.about-photo{height:600px}.about-copy{padding:75px 7vw}.quote{padding:85px 7vw}.contact{padding:80px 7vw}.contact-details{flex-direction:column;gap:22px}.contact-form{margin-top:10px;padding:25px}footer{flex-direction:column;align-items:flex-start}}
@media(max-width:520px){.hero h1{font-size:45px}.area-grid{grid-template-columns:1fr}.area-grid div:nth-child(even){padding-left:0;border-left:0}.service-list{grid-template-columns:1fr}.service-list article{border-right:0;margin-right:0}.about-photo{height:520px}}


/* Interactive lead tools */
.tools{padding:115px 9vw;background:#fff}
.tools-intro{max-width:780px;margin-bottom:55px}
.tools-intro h2{font-size:clamp(42px,5vw,68px);line-height:1.02;letter-spacing:-.05em}
.tools-intro h2 em{font-family:"Playfair Display",serif;font-weight:500}
.tools-intro>p:not(.eyebrow){max-width:650px;color:var(--muted);margin-top:24px}
.tool-switcher{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--line);margin-bottom:24px}
.tool-tab{appearance:none;border:0;background:#f4f0e8;text-align:left;padding:28px;cursor:pointer;font:inherit;color:var(--ink);transition:.2s}
.tool-tab+ .tool-tab{border-left:1px solid var(--line)}
.tool-tab.active{background:var(--ink);color:#fff}
.tool-tab span{display:block;font-size:10px;letter-spacing:.16em;margin-bottom:25px;opacity:.55}
.tool-tab strong{display:block;font-size:22px;margin-bottom:8px}
.tool-tab small{display:block;font-size:12px;line-height:1.5;opacity:.68;max-width:400px}
.tool-panel{display:none;grid-template-columns:.8fr 1.2fr;gap:7vw;background:var(--cream);padding:55px}
.tool-panel.active{display:grid}
.tool-panel-copy h3{font-size:clamp(32px,4vw,52px);line-height:1.05;letter-spacing:-.04em}
.tool-panel-copy>p:not(.eyebrow){color:var(--muted);margin-top:22px;max-width:490px;font-size:14px}
.tool-panel-copy .small-note{font-size:11px;border-left:2px solid var(--ink);padding-left:14px}
.lead-form{display:flex;flex-direction:column;gap:16px}
.lead-form label{display:block;font-size:11px;font-weight:600}
.lead-form input,.lead-form select,.lead-form textarea{display:block;width:100%;margin-top:7px;padding:13px 12px;border:1px solid #c9c3ba;background:#fff;font:inherit;font-size:13px;outline:none}
.lead-form textarea{resize:vertical}
.lead-form input:focus,.lead-form select:focus,.lead-form textarea:focus{border-color:#555}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.lead-form .button{margin-top:3px}

@media(max-width:850px){
  .tools{padding:85px 7vw}
  .tool-switcher{grid-template-columns:1fr}
  .tool-tab+.tool-tab{border-left:0;border-top:1px solid var(--line)}
  .tool-panel{grid-template-columns:1fr;padding:35px 25px}
}
@media(max-width:520px){
  .form-row{grid-template-columns:1fr}
}

.hero-image{object-position:center 42%}
@media(max-width:850px){.hero-image{object-position:center 38%}.about-photo img{object-position:center center}}

/* Final presentation fixes */
.hero{
  height:auto;
  min-height:720px;
  align-items:center;
}
.hero-content{
  padding:120px 7vw 110px;
}
.hero h1{
  max-width:900px;
}
.hero-image{
  object-position:center 38%;
}

.site-footer{
  background:#111;
  color:#aaa;
  padding:42px 5vw 28px;
}
.footer-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:25px;
  font-size:11px;
}
.footer-top .brand{
  color:#fff;
}
.footer-top a{
  color:#fff;
}
.footer-brokerage{
  margin-top:34px;
  padding-top:28px;
  border-top:1px solid rgba(255,255,255,.14);
  display:flex;
  align-items:center;
  justify-content:center;
  gap:70px;
}
.brokerage-brand{
  display:flex;
  align-items:center;
  gap:12px;
  color:#fff;
  min-width:190px;
}
.brokerage-brand strong{
  display:block;
  font-size:14px;
  letter-spacing:.11em;
  line-height:1.1;
}
.brokerage-brand span{
  display:block;
  font-size:9px;
  letter-spacing:.18em;
  color:#aaa;
  margin-top:4px;
}
.perry-mark,
.real-mark{
  width:40px;
  height:40px;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,255,255,.7);
  color:#fff;
  font-weight:700;
  font-size:18px;
}
.real-mark{
  border-radius:50%;
}
.footer-legal{
  margin-top:24px;
  padding-top:18px;
  border-top:1px solid rgba(255,255,255,.08);
  display:flex;
  justify-content:center;
  gap:28px;
  flex-wrap:wrap;
  font-size:9px;
  letter-spacing:.08em;
  color:#777;
}

@media(max-width:850px){
  .hero{
    min-height:720px;
    align-items:center;
  }
  .hero-content{
    padding:95px 7vw 90px;
  }
  .hero h1{
    max-width:700px;
  }
  .hero-image{
    object-position:center 34%;
  }
  .footer-top{
    flex-direction:column;
    align-items:flex-start;
  }
  .footer-brokerage{
    justify-content:flex-start;
    gap:30px;
    flex-wrap:wrap;
  }
}
@media(max-width:520px){
  .hero{
    min-height:690px;
  }
  .hero-content{
    padding:80px 7vw 75px;
  }
  .hero h1{
    font-size:44px;
  }
  .footer-brokerage{
    flex-direction:column;
    align-items:flex-start;
  }
}

.footer-brokerage{
  margin-top:34px;
  padding-top:28px;
  border-top:1px solid rgba(255,255,255,.14);
  display:flex;
  justify-content:center;
}
.footer-branding-image{
  display:block;
  width:min(100%, 1100px);
  height:auto;
  margin:0 auto;
}
@media(max-width:850px){
  .footer-branding-image{
    width:100%;
  }
}

/* Clean mortgage calculator */
.calculator-section{
  padding: 105px 9vw;
  background: #f7f4ee;
}
.calculator-intro{
  max-width: 700px;
  margin-bottom: 42px;
}
.calculator-intro h2{
  font-size: clamp(40px, 4.8vw, 64px);
  line-height: 1.04;
  letter-spacing: -.045em;
  margin: 0;
}
.calculator-intro > p:not(.eyebrow){
  color: var(--muted);
  max-width: 610px;
  margin-top: 20px;
  font-size: 14px;
  line-height: 1.65;
}
.calculator-card{
  max-width: 1120px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.15fr .85fr;
  background: #fff;
  border: 1px solid #ded8ce;
  box-shadow: 0 16px 45px rgba(30,27,23,.06);
}
.calculator-fields{
  padding: 38px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 22px 18px;
}
.calc-field label,
.calc-field > label{
  display: block;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .02em;
  margin-bottom: 8px;
}
.input-prefix,
.input-suffix{
  height: 48px;
  display: flex;
  align-items: center;
  border: 1px solid #d2ccc2;
  background: #fff;
  transition: border-color .2s ease;
}
.input-prefix:focus-within,
.input-suffix:focus-within,
.calc-field select:focus{
  border-color: #777067;
}
.input-prefix span,
.input-suffix span{
  color: #817a71;
  font-size: 13px;
  padding: 0 12px;
}
.input-prefix input,
.input-suffix input,
.calc-field select{
  width: 100%;
  height: 48px;
  border: 1px solid #d2ccc2;
  background: #fff;
  color: var(--ink);
  font: inherit;
  font-size: 14px;
  outline: none;
}
.input-prefix input,
.input-suffix input{
  border: 0;
  padding: 0 12px;
}
.input-prefix .input-note{
  padding-left: 0;
  font-size: 11px;
  white-space: nowrap;
}
.calc-field select{
  padding: 0 12px;
  appearance: auto;
}
.calculator-result{
  background: var(--ink);
  color: #fff;
  padding: 38px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.calculator-result .eyebrow{
  color: #aaa49b;
  margin-bottom: 10px;
}
.monthly-total{
  font-size: clamp(42px, 5vw, 64px);
  line-height: 1;
  letter-spacing: -.045em;
  font-weight: 600;
  margin-bottom: 28px;
}
.payment-breakdown{
  border-top: 1px solid rgba(255,255,255,.14);
  margin-bottom: 20px;
}
.payment-breakdown div{
  display: flex;
  justify-content: space-between;
  gap: 20px;
  padding: 11px 0;
  border-bottom: 1px solid rgba(255,255,255,.09);
  font-size: 12px;
}
.payment-breakdown span{color:#aaa49b}
.payment-breakdown strong{font-weight:600;color:#fff}
.calculator-note{
  color: #8f8a82;
  font-size: 10px;
  line-height: 1.5;
  margin: 0 0 24px;
}
.calculator-result .button.light{
  background: #f5f1e9;
  color: var(--ink);
}
.calculator-result .button.light:hover{
  background: #fff;
}
@media(max-width:850px){
  .calculator-section{padding:85px 7vw}
  .calculator-card{grid-template-columns:1fr}
  .calculator-fields{padding:28px}
  .calculator-result{padding:32px 28px}
}
@media(max-width:520px){
  .calculator-fields{grid-template-columns:1fr;padding:24px}
  .calculator-result{padding:28px 24px}
}

/* Footer social links */
.footer-socials{
  display:flex;
  align-items:center;
  gap:10px;
}
.footer-socials a{
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,255,255,.18);
  color:#fff;
  text-decoration:none;
  font-size:10px;
  letter-spacing:.04em;
  transition: background .2s ease, border-color .2s ease;
}
.footer-socials a:hover{
  background:rgba(255,255,255,.08);
  border-color:rgba(255,255,255,.4);
}
@media(max-width:850px){
  .footer-socials{margin-top:8px}
}
