/* Gutermuth Homes — seller landing page. Navy + warm gold, mobile-first. */
:root{
  --navy:#16324f; --navy-deep:#0f2640; --navy-soft:#1f4e6b;
  --gold:#d8a43c; --gold-deep:#bd8a28;
  --ink:#1f2d3a; --muted:#5b6b78; --line:#e4e9ed;
  --bg:#ffffff; --cream:#f7f4ee;
  --maxw:1080px; --radius:12px;
  --shadow:0 10px 30px rgba(15,38,64,.12);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
html,body{overflow-x:hidden}
body{
  margin:0; color:var(--ink); background:var(--bg);
  font-family:"Segoe UI",-apple-system,Roboto,Helvetica,Arial,sans-serif;
  font-size:17px; line-height:1.6; -webkit-font-smoothing:antialiased;
}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 20px}
.narrow{max-width:760px}
.center{text-align:center}
h1,h2{line-height:1.15; color:var(--navy); margin:0 0 .5em; font-weight:800; letter-spacing:-.01em; overflow-wrap:break-word}
h1{font-size:2.1rem}
h2{font-size:1.7rem}
p{margin:0 0 1rem}
.lead{font-size:1.18rem; color:var(--ink)}
.muted{color:var(--muted)}
.small{font-size:.92rem}
.xsmall{font-size:.8rem}
a{color:var(--navy-soft)}

/* header */
.site-header{position:sticky; top:0; z-index:20; background:rgba(255,255,255,.96);
  backdrop-filter:saturate(1.2) blur(6px); border-bottom:1px solid var(--line)}
.header-inner{display:flex; align-items:center; justify-content:space-between; height:64px}
.brand{display:flex; align-items:center; gap:10px; text-decoration:none; color:var(--navy); font-weight:800}
.brand-mark{display:inline-grid; place-items:center; width:36px; height:36px; border-radius:8px;
  background:var(--navy); color:var(--gold); font-weight:800; font-size:.95rem; letter-spacing:.5px}
.brand-name{font-size:1.05rem; letter-spacing:-.01em}
.brand-text{display:flex; flex-direction:column; line-height:1.12}
.brand-broker{font-size:.7rem; font-weight:600; color:var(--muted); letter-spacing:.01em}
.header-phone{font-weight:700; color:var(--navy); text-decoration:none; padding:8px 14px;
  border:1px solid var(--line); border-radius:999px}
.header-phone:hover{border-color:var(--gold)}

/* buttons */
.btn{display:inline-block; font-weight:700; font-size:1.02rem; text-decoration:none; cursor:pointer;
  border:none; border-radius:10px; padding:14px 26px; transition:transform .05s ease, background .2s}
.btn-primary{background:var(--gold); color:#3a2a08}
.btn-primary:hover{background:var(--gold-deep)}
.btn-primary:active{transform:translateY(1px)}
.btn-block{width:100%}
.btn-lg{padding:16px 34px; font-size:1.1rem}

/* hero */
.hero{background:linear-gradient(160deg,var(--navy) 0%,var(--navy-deep) 100%); color:#eaf2f8; padding:48px 0 56px}
.hero-grid{display:grid; grid-template-columns:1fr; gap:28px}
.eyebrow{color:var(--gold); font-weight:700; letter-spacing:.06em; text-transform:uppercase; font-size:.82rem; margin-bottom:.5rem}
.hero h1{color:#fff; font-size:2.3rem}
.hero h1 .hl{color:var(--gold); display:block}
.hero .sub{color:#cfe0ec; font-size:1.12rem; max-width:540px}
.hero-points{list-style:none; padding:0; margin:18px 0 0}
.hero-points li{display:flex; gap:10px; align-items:flex-start; margin-bottom:9px; color:#eaf2f8}
.tick{color:var(--navy); background:var(--gold); width:22px; height:22px; border-radius:50%;
  display:inline-grid; place-items:center; font-size:.8rem; font-weight:800; flex:0 0 auto; margin-top:2px}

/* form card */
.form-card{background:#fff; color:var(--ink); border-radius:var(--radius); box-shadow:var(--shadow);
  padding:24px; align-self:start}
.form-title{font-size:1.3rem; margin-bottom:.2em}
.form-note{color:var(--muted); font-size:.92rem; margin-bottom:1rem}
#lead-form label{display:block; font-size:.86rem; font-weight:600; color:var(--navy); margin-bottom:12px}
#lead-form input[type=text],#lead-form input[type=tel],#lead-form input[type=email],#lead-form select{
  display:block; width:100%; margin-top:5px; padding:11px 12px; font-size:1rem; font-family:inherit;
  border:1px solid var(--line); border-radius:8px; background:#fff; color:var(--ink)}
#lead-form input:focus,#lead-form select:focus{outline:none; border-color:var(--gold); box-shadow:0 0 0 3px rgba(216,164,60,.25)}
.row{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:12px}
.consent{display:flex; gap:10px; align-items:flex-start; font-size:.78rem!important; font-weight:400!important;
  color:var(--muted)!important; line-height:1.45; margin:4px 0 16px}
.consent input{margin-top:3px; flex:0 0 auto; width:16px; height:16px}
.form-error{color:#b3261e; font-size:.9rem; margin:10px 0 0}

/* thank you */
.thanks{text-align:center}
.thanks-check{width:56px; height:56px; border-radius:50%; background:#e7f4ec; color:#15803d;
  display:grid; place-items:center; font-size:1.7rem; margin:0 auto 12px}

/* sections */
.section{padding:56px 0}
.section-cream{background:var(--cream)}
.section-navy{background:var(--navy); color:#eaf2f8}
.on-navy{color:#fff}
.on-navy-sub{color:#cfe0ec; font-size:1.12rem}
.theme{font-size:1.25rem; font-weight:700; color:var(--gold-deep); margin-top:1.2rem}

/* case study */
.case{display:grid; grid-template-columns:1fr; gap:24px; background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.14); border-radius:var(--radius); padding:26px}
.case-story p{color:#dfeaf2}
.case-stats{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; text-align:center}
.stat{min-width:0}
.stat-num{display:block; font-size:1.25rem; font-weight:800; color:var(--gold)}
.stat-lbl{display:block; font-size:.78rem; color:#bcd0df; margin-top:2px}

/* strategy */
.strategy-grid{list-style:none; padding:0; margin:28px 0 0;
  display:grid; grid-template-columns:1fr; gap:14px}
.strategy-grid li{background:#fff; border:1px solid var(--line); border-left:4px solid var(--gold);
  border-radius:10px; padding:16px 18px}
.strategy-grid strong{display:block; color:var(--navy); margin-bottom:3px}
.strategy-grid span{color:var(--muted); font-size:.95rem}

/* badge */
.badge{display:inline-block; background:var(--gold); color:#3a2a08; font-weight:800; font-size:.78rem;
  letter-spacing:.05em; text-transform:uppercase; padding:6px 14px; border-radius:999px; margin-bottom:14px}

/* about */
.about-grid{display:grid; grid-template-columns:1fr; gap:28px; align-items:center}
.headshot-ph{aspect-ratio:1/1; max-width:300px; margin:0 auto; border-radius:var(--radius);
  background:linear-gradient(160deg,var(--navy-soft),var(--navy)); color:var(--gold);
  display:grid; place-items:center; text-align:center; font-weight:800; font-size:1.4rem; box-shadow:var(--shadow)}
.team-photo{width:100%; height:auto; display:block; border-radius:var(--radius); box-shadow:var(--shadow)}
.about-personal{color:var(--muted)}

/* video */
.video-ph{aspect-ratio:16/9; background:var(--navy); color:var(--gold); border-radius:var(--radius);
  display:grid; place-items:center; margin:18px 0 8px; box-shadow:var(--shadow)}
.video-ph span{font-size:2.4rem; line-height:1}
.video-ph p{color:#bcd0df; margin:.4rem 0 0}

/* steps */
.steps{list-style:none; padding:0; margin:28px 0; display:grid; grid-template-columns:1fr; gap:18px}
.steps li{background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.14); border-radius:10px;
  padding:22px 20px 20px; position:relative}
.steps strong{display:block; color:#fff; margin:6px 0 4px; font-size:1.1rem}
.steps span:last-child{color:#cfe0ec; font-size:.96rem}
.step-n{display:inline-grid; place-items:center; width:34px; height:34px; border-radius:50%;
  background:var(--gold); color:#3a2a08; font-weight:800}

/* reviews */
.reviews{display:grid; grid-template-columns:1fr; gap:18px; margin-top:24px}
.review{background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:22px; margin:0; box-shadow:var(--shadow)}
.stars{color:var(--gold); letter-spacing:2px; margin-bottom:8px}
.review p{font-style:italic; color:var(--ink)}
.review cite{color:var(--muted); font-style:normal; font-weight:600; font-size:.9rem}

/* final cta */
.final-cta .btn{margin-top:8px}

/* about license line */
.about-lic{color:var(--gold-deep); font-weight:700; font-size:.98rem; margin:-.2rem 0 1rem}

/* footer */
.site-footer{background:var(--navy-deep); color:#cfe0ec; padding:36px 0 28px}
.footer-inner{display:grid; grid-template-columns:1fr; gap:20px; padding-bottom:18px; border-bottom:1px solid rgba(255,255,255,.12)}
.footer-brand .brand-name{color:#fff}
.footer-broker{color:#fff; font-weight:700; margin:.15rem 0 .5rem; font-size:1rem}
.footer-contact{display:flex; flex-direction:column; gap:6px}
.footer-contact a{color:var(--gold); text-decoration:none}
.footer-social{display:flex; gap:16px; margin-top:8px}
.footer-social a{color:var(--gold); text-decoration:none; display:inline-flex; align-items:center; gap:6px}
.footer-social svg{display:block; flex:0 0 auto}
.footer-legal{display:flex; align-items:center; gap:16px; flex-wrap:wrap; margin-top:16px}
.eho{display:flex; align-items:center; gap:8px; color:#dfeaf2; font-size:.8rem; font-weight:700; flex:0 0 auto}
.eho img{display:block}
.disclosure{margin:0; flex:1 1 280px; min-width:240px}
.footer-privacy{color:#cfe0ec; font-size:.8rem; font-weight:600; text-decoration:underline}
.hp-field{position:absolute !important; left:-9999px !important; width:1px; height:1px; overflow:hidden}

/* ---- responsive ---- */
@media(min-width:760px){
  h1{font-size:2.6rem}
  .hero h1{font-size:2.8rem}
  .case{grid-template-columns:1.3fr 1fr; align-items:center}
  .case-stats .stat-num{font-size:1.5rem}
  .strategy-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .about-grid{grid-template-columns:minmax(0,440px) minmax(0,1fr); align-items:start}
  .steps{grid-template-columns:repeat(3,minmax(0,1fr))}
  .reviews{grid-template-columns:repeat(2,minmax(0,1fr))}
  .footer-inner{grid-template-columns:1fr auto}
}
@media(min-width:940px){
  .hero{padding:64px 0 72px}
  .hero-grid{grid-template-columns:1.05fr .95fr; gap:44px; align-items:center}
  .section{padding:72px 0}
}