@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,500;9..144,600;9..144,700&family=Work+Sans:wght@400;500;600;700&display=swap');

:root{
  --green: #1F3A2E;
  --green-dark: #142A20;
  --brass: #B08D46;
  --brass-dark: #8F7038;
  --cream: #EFF1EC;
  --cream-dark: #E3E6DE;
  --ink: #1A1D1B;
  --line: #D3D7CD;
  --white: #FFFFFF;
  --max: 1140px;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{margin:0; font-family:'Work Sans', -apple-system, sans-serif; color:var(--ink); background:var(--white); line-height:1.6;}
h1,h2,h3,h4{font-family:'Fraunces', serif; font-weight:600; color:var(--green-dark); line-height:1.12; margin:0 0 0.4em;}
h1{font-size:clamp(2.3rem,5vw,3.4rem); font-weight:600; letter-spacing:-0.01em;}
h2{font-size:clamp(1.6rem,3vw,2.1rem);}
h2 .rule{display:block; width:52px; height:3px; background:var(--brass); margin-bottom:14px;}
h3{font-size:1.2rem;}
p{margin:0 0 1em; max-width:66ch;}
a{color:var(--green);}
.wrap{max-width:var(--max); margin:0 auto; padding:0 24px;}
img{max-width:100%; display:block;}

header.site{border-bottom:1px solid var(--line); background:var(--white); position:sticky; top:0; z-index:50;}
.header-row{display:flex; align-items:center; justify-content:space-between; padding:18px 24px; max-width:var(--max); margin:0 auto;}
.brand{font-family:'Fraunces', serif; font-weight:600; font-size:1.4rem; color:var(--green-dark); text-decoration:none; display:flex; align-items:center; min-width:0;}
.brand-logo{height:34px; width:auto; max-width:260px; display:block; object-fit:contain;}
.menu-toggle{display:none; flex-direction:column; justify-content:center; gap:5px; width:38px; height:38px; background:none; border:none; cursor:pointer; padding:0;}
.menu-toggle span{display:block; width:24px; height:2.5px; background:var(--green-dark); border-radius:2px;}
.brand span{color:var(--brass-dark);}
nav.main a{margin-left:20px; text-decoration:none; color:var(--ink); font-weight:500; font-size:0.92rem; white-space:nowrap;}
nav.main a:hover{color:var(--brass-dark);}
.call-btn{background:var(--green); color:var(--white)!important; padding:10px 18px; border-radius:2px; font-weight:600; margin-left:20px!important;}
.call-btn:hover{background:var(--green-dark);}

.hero-split{display:grid; grid-template-columns:1fr 1fr; min-height:560px;}
.hero-split.single{grid-template-columns:1fr; min-height:auto;}
.hero-split.single .copy{max-width:760px; margin:0 auto; padding:64px 24px;}
.hero-split .copy{padding:72px 56px 72px 24px; display:flex; flex-direction:column; justify-content:center;}
.hero-split .photo{background:var(--green-dark) center/cover no-repeat; position:relative; filter:saturate(0.85);}
.hero-split .photo::after{content:""; position:absolute; inset:0; background:linear-gradient(160deg, rgba(31,58,46,0.35), rgba(31,58,46,0.08));}
.eyebrow{color:var(--brass-dark); font-weight:600; font-size:0.95rem; margin-bottom:10px;}
.hero-split p.lead{font-size:1.15rem; color:#3A3E39;}
.trust-strip{display:flex; gap:0; border-top:1px solid var(--line); margin-top:28px;}
.trust-strip div{padding:14px 20px 14px 0; border-right:1px solid var(--line); margin-right:20px; font-size:0.88rem; color:#54584F; font-weight:500;}
.trust-strip div:last-child{border-right:none;}
.cta-row{display:flex; gap:14px; margin-top:30px; flex-wrap:wrap;}
.btn{display:inline-block; padding:15px 28px; font-weight:600; text-decoration:none; border-radius:2px; font-size:1rem;}
.btn-primary{background:var(--brass); color:var(--white);}
.btn-primary:hover{background:var(--brass-dark);}
.btn-outline{border:1.5px solid var(--green); color:var(--green);}
.btn-outline:hover{background:var(--green); color:var(--white);}

section{padding:64px 0;}
section.alt{background:var(--cream);}
.section-intro{max-width:66ch; margin-bottom:36px;}

.service-list{display:flex; flex-direction:column;}
.service-row{display:grid; grid-template-columns:auto 1fr auto; gap:28px; align-items:center; padding:28px 0; border-bottom:1px solid var(--line);}
.service-row:first-child{border-top:1px solid var(--line);}
.service-num{font-family:'Fraunces'; font-size:1.8rem; color:var(--cream-dark); font-weight:600; -webkit-text-stroke:1px var(--brass); color:transparent;}
.service-row h3{margin-bottom:4px;}
.service-row .go{white-space:nowrap; font-weight:600; color:var(--green); text-decoration:none; border-bottom:1.5px solid var(--brass); padding-bottom:2px;}
.service-row .go:hover{color:var(--brass-dark);}

.steps{display:grid; grid-template-columns:repeat(4,1fr); gap:32px;}
.step .step-num{font-family:'Fraunces'; font-size:2.2rem; font-weight:600; color:var(--brass); display:block; margin-bottom:8px;}
.step h3{margin-bottom:6px; font-size:1.05rem;}

.testi-row{display:grid; grid-template-columns:repeat(3,1fr); gap:28px;}
.testi{background:var(--white); border-top:3px solid var(--brass); padding:24px; box-shadow:0 2px 10px rgba(20,42,32,0.06);}
.testi .stars{color:var(--brass); margin-bottom:10px; letter-spacing:2px;}
.testi .who{font-weight:600; margin-top:12px; font-size:0.86rem; color:#54584F;}

.areas-list{columns:3; gap:24px; list-style:none; padding:0; margin:0;}
.areas-list li{margin-bottom:10px; break-inside:avoid;}
.areas-list a{text-decoration:none; font-weight:500; color:var(--ink); border-bottom:1px solid var(--line);}
.areas-list a:hover{color:var(--brass-dark); border-color:var(--brass);}

.accordion-item{border-bottom:1px solid var(--line);}
.accordion-btn{width:100%; text-align:left; background:none; border:none; padding:20px 0; font-family:'Fraunces'; font-size:1.15rem; font-weight:600; color:var(--green-dark); cursor:pointer; display:flex; justify-content:space-between; align-items:center;}
.accordion-btn .icon{font-size:1.3rem; color:var(--brass-dark); font-family:'Work Sans'; font-weight:400;}
.accordion-body{max-height:0; overflow:hidden; transition:max-height 0.25s ease;}
.accordion-body p{padding-bottom:20px;}
.accordion-item.open .accordion-body{max-height:320px;}

.quiz{background:var(--green-dark); color:var(--white); padding:36px; margin:36px 0;}
.quiz h2{color:var(--white);}
.quiz-options{display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin:18px 0;}
.quiz-opt{background:#24402F; border:1px solid #3A5A46; color:var(--white); text-align:left; padding:16px; border-radius:2px; cursor:pointer; font-family:'Work Sans'; font-size:0.95rem; font-weight:500;}
.quiz-opt:hover{border-color:var(--brass);}
.quiz-opt.active{background:var(--brass); border-color:var(--brass); color:var(--green-dark);}
.quiz-result{background:#24402F; border-left:3px solid var(--brass); padding:18px 20px; display:none;}
.quiz-result.show{display:block;}
.quiz-result strong{color:var(--brass);}

.estimator{background:var(--cream); border:1px solid var(--line); padding:36px; margin:36px 0;}
.estimator-row{display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-bottom:16px;}
.estimator select{width:100%; padding:13px; border:1px solid var(--line); border-radius:2px; font-family:'Work Sans'; font-size:0.95rem; background:var(--white);}
.estimator-out{background:var(--green-dark); color:var(--white); padding:24px; margin-top:18px; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:14px;}
.estimator-out .range{font-family:'Fraunces'; font-size:2rem; font-weight:600; color:var(--brass);}

.door-tabs-nav{display:flex; gap:0; border-bottom:2px solid var(--line); flex-wrap:wrap;}
.door-tab-btn{background:none; border:none; padding:15px 24px; font-family:'Fraunces'; font-size:1.1rem; font-weight:600; color:#6B6F63; cursor:pointer; border-bottom:3px solid transparent; margin-bottom:-2px;}
.door-tab-btn.active{color:var(--brass-dark); border-bottom-color:var(--brass);}
.door-tab-panel{display:none; padding:36px 0; grid-template-columns:1fr 1fr; gap:40px; align-items:center;}
.door-tab-panel.active{display:grid;}
.door-tab-panel .photo{background:var(--cream-dark) center/cover no-repeat; min-height:280px;}
.spec-list{list-style:none; padding:0; margin:18px 0;}
.spec-list li{padding:9px 0; border-bottom:1px solid var(--line); display:flex; justify-content:space-between; font-size:0.92rem;}

.area-header{background:var(--green-dark); color:var(--white); padding:0;}
.area-header-grid{display:grid; grid-template-columns:1.1fr 0.9fr;}
.area-header .copy{padding:60px 44px;}
.area-header h1{color:var(--white);}
.area-header .photo{background:var(--green) center/cover no-repeat; min-height:300px; filter:saturate(0.8);}
.stat-callout{background:var(--cream); border-left:3px solid var(--brass); padding:22px 26px; margin:26px 0;}
.stat-callout .big{font-family:'Fraunces'; font-size:2.4rem; font-weight:600; color:var(--green-dark); line-height:1;}
.local-facts{list-style:none; padding:0; margin:0; display:grid; gap:10px;}
.local-facts li{padding:12px 16px; background:var(--cream); font-size:0.9rem;}

footer.site{background:var(--green-dark); color:#C4CBC3; padding:52px 0 26px; margin-top:0px;}
.footer-grid{display:grid; grid-template-columns:1.3fr 1fr 1fr 1fr 1fr; gap:26px;}
footer.site h4{color:var(--white); font-family:'Fraunces'; font-weight:600; margin-bottom:12px; font-size:1rem;}
footer.site a{color:#A9B3A7; text-decoration:none; font-size:0.9rem; line-height:2.1;}
footer.site a:hover{color:var(--brass);}
footer .bottom{border-top:1px solid #2E4C3C; margin-top:32px; padding-top:18px; font-size:0.82rem; color:#7C8A7E; display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px;}
footer .bottom a{color:#7C8A7E; font-size:0.82rem;}
footer .bottom a:hover{color:var(--brass);}
@media (max-width:760px){
  .footer-grid{grid-template-columns:1fr 1fr; gap:24px;}
  .footer-brand{grid-column:1 / -1;}
}
@media (max-width:560px){
  .footer-grid{grid-template-columns:1fr;}
}

.sticky-call{display:none;}

/* ============ Final CTA banner ============ */
.final-cta{background:var(--green-dark); padding:56px 0;}
.final-cta .inner{display:flex; justify-content:space-between; align-items:center; gap:32px; flex-wrap:wrap;}
.final-cta h2{color:var(--white); margin-bottom:8px;}
.final-cta .sub{color:#A9B3A7; font-size:0.98rem; margin:0;}
.final-cta .actions{display:flex; align-items:center; gap:22px; flex-wrap:wrap;}
.final-cta .phone-big{font-family:'Fraunces', serif; font-size:1.7rem; font-weight:600; color:var(--brass); text-decoration:none; white-space:nowrap;}
.final-cta .phone-big:hover{color:var(--white);}
.final-cta .or{color:#7C8A7E; font-size:0.85rem;}
@media (max-width:700px){
  .final-cta .inner{flex-direction:column; text-align:center;}
  .final-cta .actions{flex-direction:column;}
}
@media (max-width: 900px){
  .hero-split{grid-template-columns:1fr; min-height:auto;}
  .hero-split .copy{padding:44px 24px;}
  .hero-split .photo{min-height:240px;}
  .service-row{grid-template-columns:1fr; gap:8px;}
  .steps{grid-template-columns:1fr 1fr;}
  .testi-row{grid-template-columns:1fr;}
  .areas-list{columns:2;}
  .quiz-options{grid-template-columns:1fr;}
  .door-tab-panel{grid-template-columns:1fr;}
  .estimator-row{grid-template-columns:1fr;}
  .area-header-grid{grid-template-columns:1fr;}
  .brand-logo{height:28px; max-width:190px;}

  .menu-toggle{display:flex;}
  nav.main{
    display:flex; flex-direction:column; align-items:stretch;
    position:fixed; top:0; right:0; height:100vh; width:78%; max-width:320px;
    background:var(--white); padding:80px 28px 28px; gap:0;
    box-shadow:-8px 0 24px rgba(0,0,0,0.12);
    transform:translateX(100%); transition:transform 0.28s ease;
    z-index:70; overflow-y:auto;
  }
  nav.main.open{transform:translateX(0);}
  nav.main a{margin-left:0; padding:14px 0; border-bottom:1px solid var(--line); font-size:1.05rem;}
  nav.main .call-btn{margin-left:0!important; margin-top:16px; text-align:center; border-bottom:none;}
  .nav-backdrop{display:none; position:fixed; inset:0; background:rgba(20,42,32,0.45); z-index:65;}
  .nav-backdrop.open{display:block;}

  .sticky-call{display:block; position:fixed; bottom:0; left:0; right:0; background:var(--brass); color:var(--white); text-align:center; padding:15px; font-weight:700; text-decoration:none; z-index:60; font-size:1.05rem;}
  body{padding-bottom:56px;}
}
