/* Shared V1 design foundation. Loaded after page-specific styles. */
:root,body.home-page{--paper:#f9f9f5;--ink:#252821;--green:#678c47;--muted:#626b59;--surface:#eef0e7;--volt:#c6f729}
body.home-page{background:var(--paper);color:var(--ink);font-family:'Helvetica Neue',Helvetica,Arial,sans-serif}
body.home-page button,body.home-page input,body.home-page select,body.home-page textarea{font-family:inherit}
body.home-page main h1{font-weight:400}
body.home-page main h2{font-weight:400}
.home-page .home-about h2,.home-page .home-services h2,.home-page .promise-heading h2,.home-page #support h2,.home-page .home-contact h2,.home-page .roof-process-aligned h2{font-size:44px;line-height:1.08;font-weight:400}
.blog-page .blog-opening h1,.article-page .article-opening h1{font-size:clamp(44px,5vw,68px);font-weight:400;line-height:1.06}
.home-page .hero nav .quote-brand-mark{width:33px;height:33px;margin-right:9px;flex:0 0 33px;color:inherit}
body.home-page .green,body.home-page .experience-cta,body.home-page .finance-bottom>a,body.home-page .areas-cta,body.home-page .areas-invitation>a,body.home-page .article-cta .button,body.home-page .quote-submit{
 display:inline-flex;align-items:center;justify-content:center;gap:22px;min-height:52px;box-sizing:border-box;padding:14px 24px;border-radius:999px;font-size:15px;font-weight:500;line-height:22px;letter-spacing:-.025em;text-transform:none;box-shadow:none;
}
body.home-page .green:hover,body.home-page .experience-cta:hover,body.home-page .finance-bottom>a:hover,body.home-page .areas-cta:hover{box-shadow:none}
body.home-page .quote-submit{display:flex;width:100%}
body.home-page .about-end .green{background:transparent;color:#678c47;border:1px solid #678c47}
body.home-page .about-end .green:hover{background:#678c47;color:white}
body.home-page .home-contact .consult-form>.green{background:#678c47;color:white}
body.home-page .home-contact .consult-form>.green:hover{background:#526f39}
body.home-page .hero nav .nav-phone:hover,body.home-page .hero nav .nav-phone:focus-visible{background:#678c47;border-color:#678c47;color:white}
body.home-page .home-footer{padding:55px 0 25px;background:#141c0d}
body.home-page .home-footer .footer-grid h3{color:#bac4ac}
body.home-page .home-footer .footer-contact a{display:inline;font:inherit;letter-spacing:inherit;margin:0}
.quote-page .name-fields .field{margin-bottom:0}
.quote-page .name-fields{margin-bottom:20px}
/* Neutral page canvas; preserve photographic and dark contrast sections. */
.home-page .home-services,.home-page .roof-services,.home-page .roof-system,.home-page .roofing-how,.blog-page .blog-opening,.blog-page .blog-listing{background-color:var(--paper)}
@media(max-width:760px){
 .home-page .home-about h2,.home-page .home-services h2,.home-page .promise-heading h2,.home-page #support h2,.home-page .home-contact h2,.home-page .roof-process-aligned h2{font-size:36px}
 .blog-page .blog-opening h1,.article-page .article-opening h1{font-size:42px}
 body.home-page .home-footer{padding:45px 0 25px}
 /* Logo and menu share the first row; the phone has a deliberate second row. */
 body.home-page .hero>nav{display:grid;grid-template-columns:minmax(0,1fr) 44px;gap:8px 12px;height:auto;min-height:108px;padding-block:12px;align-items:center;flex-wrap:nowrap}
 body.home-page .hero>nav>.brand{grid-column:1;grid-row:1;font-size:21px;min-width:0}
 body.home-page .hero>nav>.menu{display:flex;align-items:center;justify-content:center;grid-column:2;grid-row:1;width:44px;height:44px;margin:0;font-size:22px;border-radius:50%}
 body.home-page .hero>nav>.nav-right{grid-column:1 / -1;grid-row:2;margin:0;justify-self:start}
 body.home-page .hero>nav .quote-brand-mark{width:27px;height:27px;flex-basis:27px;margin-right:7px}
 body.home-page .hero>nav.open>.nav-center{top:100%;grid-column:1 / -1;z-index:10;margin-top:4px}
 body.home-page .hero>nav .nav-phone{font-size:13px}
}
/* Override retained hero and About button sizing at every breakpoint. */
body.home-page .hero .hero-copy .green,body.home-page .hero .hero-content .green,body.home-page .hero .actions .green,body.home-page .hero a.green,body.home-page.about-page .about-end a.green{font-size:15px;font-weight:500;padding:14px 24px;line-height:22px;min-height:52px;box-shadow:none}

/* Shared footer interaction color, including contact and legal links. */
body footer a:hover,body footer button:hover,body footer a:focus-visible,body footer button:focus-visible{color:#c6f729!important}

body.home-page .home-footer .footer-legal a{font:inherit;color:inherit;text-decoration:none;letter-spacing:inherit}body.home-page .home-footer .footer-legal a:hover{text-decoration:underline}
