@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');:root{--ink:#12253d;--navy:#123454;--blue:#1f668b;--cream:#f7f8f6;--line:#dde5e9;--muted:#597084}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);font-family:'DM Sans',sans-serif;line-height:1.7;background:#fff}a{color:inherit;text-decoration:none}img{width:100%;display:block;object-fit:cover}.wrap{max-width:1200px;margin:auto;padding:0 26px}.top{background:#0d2b45;color:#e7f1f7;text-align:center;font-size:12px;letter-spacing:.09em;padding:9px 12px}.header{background:#fff;position:sticky;top:0;z-index:10;box-shadow:0 4px 24px #12253d12}.nav{height:78px;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{display:flex;align-items:center;gap:11px;font-weight:800;font:800 23px Manrope,sans-serif;letter-spacing:-.055em;color:#163f5e;white-space:nowrap}.brand .mark{width:40px;height:40px;display:grid;place-items:center;background:#174767;color:white;border-radius:12px;font-size:24px}.brand small{display:block;font:600 9px 'DM Sans';letter-spacing:.14em;color:#657f8c}.navlinks{display:flex;align-items:center;gap:24px;font-size:13px;font-weight:700}.navlinks a:hover{color:#2d7ca5}.btn{display:inline-flex;align-items:center;justify-content:center;border-radius:8px;background:#1b658f;color:#fff;padding:13px 21px;font-weight:800;font-size:14px;transition:.2s;border:1px solid #1b658f}.btn:hover{background:#114c6f}.btn.secondary{background:white;color:#174767;border-color:#d5e1e8}.btn.light{background:white;color:#163f5e;border-color:#fff}.hero{background:#f1f6f8}.hero-inner{display:grid;grid-template-columns:1.1fr .9fr;align-items:center;gap:54px;min-height:560px;padding-top:60px;padding-bottom:65px}.eyebrow{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.19em;color:#1b719b;margin-bottom:16px}.hero h1,h1{font-family:Manrope,sans-serif;font-size:clamp(37px,4.1vw,61px);line-height:1.13;letter-spacing:-.055em;margin:0 0 23px;font-weight:800}.hero p{color:#4a6578;font-size:17px;max-width:610px}.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:29px}.hero-photo{height:460px;border-radius:22px;box-shadow:0 24px 35px #102c4020}.mini{font-size:12px;color:#638093;margin-top:23px}.section{padding:86px 0}.section.alt{background:#f7f9fa}.section-title{font:800 clamp(27px,3.2vw,40px)/1.25 Manrope,sans-serif;letter-spacing:-.04em;max-width:760px;margin:0 0 15px}.lead{color:#5b7181;max-width:710px;margin:0 0 34px}.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.card{border:1px solid #e0e9ed;border-radius:14px;overflow:hidden;background:#fff;box-shadow:0 7px 24px #24435808}.card img{height:180px}.card-body{padding:20px}.card h3{margin:0 0 8px;font:800 18px Manrope}.card p{font-size:14px;color:#5a7081;margin:0 0 16px}.inline-link{color:#0e6b97;font-size:13px;font-weight:800}.split{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:60px}.split img{height:460px;border-radius:17px}.check{padding:0;list-style:none}.check li{margin:12px 0;padding-left:28px;position:relative}.check li:before{content:'✓';color:#117cac;font-weight:800;position:absolute;left:0}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:30px}.steps article{padding:22px 0;border-top:2px solid #c8dce8}.number{font:800 17px Manrope;color:#1680ab}.steps h3{font:800 19px Manrope}.steps p{color:#617486;font-size:14px}.cta{background:#123d5d;color:white;border-radius:18px;padding:48px;display:flex;justify-content:space-between;gap:25px;align-items:center}.cta h2{margin:0;font:800 30px Manrope;letter-spacing:-.04em}.cta p{color:#d1e4ee;margin:7px 0 0}.footer{background:#10283b;color:#e1ecf2;padding:60px 0 25px}.footgrid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:60px}.footer a{display:block;color:#c1d3dc;margin:7px 0;font-size:14px}.footer small{color:#7e9aaa}.footer h4{margin-top:0}.city-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}.city-grid a{font-size:13px;background:white;padding:12px;border:1px solid #e0e8ec;border-radius:8px}.city-grid a:hover{border-color:#1b719b;color:#1b719b}.crumb{font-size:12px;color:#58798e;padding:22px 0}.cityhero{padding:70px 0;background:#edf5f8}.cityhero h1{max-width:950px}.prose{font-size:16px;max-width:840px}.prose p{margin:15px 0}.faqs details{padding:15px 0;border-bottom:1px solid #dbe4ea}.faqs summary{cursor:pointer;font-weight:800}.pill{display:inline-block;padding:8px 13px;border-radius:100px;background:#eaf2f6;color:#2c617c;font-size:12px;font-weight:700;margin:4px}.mobile-toggle{display:none}.editor-note{background:#fff4db;color:#805414;padding:10px 20px;font-size:12px;text-align:center}@media(max-width:950px){.navlinks{display:none;position:absolute;top:78px;left:0;right:0;padding:18px 24px;background:white;flex-direction:column;align-items:flex-start;box-shadow:0 12px 16px #0001}.navlinks.open{display:flex}.mobile-toggle{display:block;background:none;border:0;font-size:25px}.hero-inner,.split{grid-template-columns:1fr}.hero-photo{height:320px}.cards{grid-template-columns:repeat(2,1fr)}.city-grid{grid-template-columns:repeat(3,1fr)}}@media(max-width:620px){.cards,.steps,.city-grid,.footgrid{grid-template-columns:1fr}.section{padding:55px 0}.hero-inner{padding-top:44px;gap:20px}.hero-photo{height:270px}.cta{display:block;padding:29px}.cta .btn{margin-top:20px}.brand{font-size:18px}.nav{height:70px}.navlinks{top:70px}.split img{height:290px}}
/* v2: regional navigation, correct company identity and hero branding */
.navlinks{gap:15px}.brand{letter-spacing:0;gap:10px}.brand-words strong{display:block;font-size:20px;line-height:1.15;letter-spacing:-.035em;text-transform:none}.brand-words small{font-size:10px;letter-spacing:.05em;color:#607e91}.area-menu{position:relative;align-self:center}.area-trigger{border:0;background:transparent;font:700 13px 'DM Sans',sans-serif;color:#12253d;padding:14px 4px;cursor:pointer}.area-panel{display:none;position:absolute;right:-150px;top:100%;width:min(760px,90vw);max-height:70vh;overflow:auto;background:white;border:1px solid #e1e8ef;box-shadow:0 20px 60px #0e2b4260;border-radius:12px;padding:22px;z-index:40;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.area-menu:hover .area-panel,.area-menu:focus-within .area-panel,.area-menu.expanded .area-panel{display:grid}.area-panel .area-top{font-weight:800;color:#17628f;padding:6px 0}.area-region strong{display:block;color:#103956;padding:0 0 5px;border-bottom:1px solid #dde7ed;font-size:13px}.area-items{display:flex;gap:6px 14px;flex-wrap:wrap;padding-top:8px}.area-items a{font-size:12px!important;display:inline-block;padding:4px 0}.hero-brand{display:flex;align-items:center;gap:12px;margin-bottom:24px;color:#174767}.hero-brand-symbol{font-size:26px;font-weight:800;background:#174767;border-radius:10px;padding:8px 18px;color:#fff}.hero-brand b,.hero-brand small{display:block}.hero-brand b{font-size:18px}.hero-brand small{font-size:12px;letter-spacing:.02em}.mayflower-home-hero .hero-photo{height:490px}.seo-note{max-width:950px;font-size:16px}.mayflower-logo{max-width:170px;max-height:60px;object-fit:contain}.hero-brand img{max-width:120px;max-height:90px;width:auto}.footer .brand-words small{color:#c2d9e4}
@media(max-width:950px){.navlinks{gap:5px}.area-menu{width:100%}.area-trigger{width:100%;text-align:left}.area-panel{position:static;max-height:45vh;width:100%;box-shadow:none;grid-template-columns:1fr;padding:12px}.area-menu:hover .area-panel{display:none}.area-menu.expanded .area-panel{display:grid}}
@media(max-width:620px){.brand-words strong{font-size:16px}.brand-words small{font-size:9px}.hero-brand b{font-size:14px}.hero-brand small{font-size:11px}.mayflower-home-hero .hero-photo{height:280px}}

/* V3: photographic New England roofing, larger hero/header, readable long-form content */
.nav{height:96px}.header .brand{min-width:255px}.brand-words strong{font-size:25px}.brand-words small{font-size:12px;color:#456b84}.top{font-weight:700}.mayflower-home-hero .hero-inner{min-height:675px;padding-top:85px;padding-bottom:85px;gap:40px}.mayflower-home-hero .hero-photo{height:580px;object-position:center center;border-radius:18px}.hero-brand b{font-size:21px}.hero-brand small{font-size:13px}.hero h1{font-size:clamp(42px,4.4vw,69px)}.hero-photo{object-position:center}.editorial{border-top:1px solid #e5ecf0}.editorial-inner{max-width:900px}.editorial-inner p{margin:18px 0;color:#425b70;line-height:1.85;font-size:16px}.editorial-inner h2{margin-bottom:25px}.card img{object-position:50% 35%}.area-panel{z-index:110}.header{z-index:100}
@media(max-width:950px){.nav{height:82px}.navlinks{top:82px}.mayflower-home-hero .hero-inner{min-height:initial;padding-top:55px;padding-bottom:65px}.mayflower-home-hero .hero-photo{height:425px}.header .brand{min-width:0}}
@media(max-width:620px){.nav{height:74px}.navlinks{top:74px}.mayflower-home-hero .hero-photo{height:310px}.mayflower-home-hero .hero-inner{padding-top:36px;padding-bottom:45px}.brand-words strong{font-size:18px}.brand-words small{font-size:10px}.hero h1{font-size:37px}.editorial-inner p{font-size:15px}}

/* v4 — uncluttered county navigation, generous logo/header, New England photo hero */
.top{background:#0a2944;padding:10px 15px;letter-spacing:.06em}
.nav{height:114px;gap:14px}.header .brand{min-width:315px}.brand-logo-slot{width:72px;height:72px;flex-shrink:0;display:flex;align-items:center;justify-content:center}
.brand-logo-slot .mark{height:60px;width:60px;font-size:30px;background:#123454}
.mayflower-logo{width:auto!important;max-width:265px!important;max-height:86px!important;object-fit:contain;flex-shrink:0}
.brand-words strong{font-size:27px}.brand-words small{font-size:13px}
.navlinks{gap:16px}.navlinks>a,.area-trigger{font-size:13px;white-space:nowrap}
.area-panel{right:0;width:min(720px,91vw);display:none;padding:22px 24px;grid-template-columns:1fr;gap:12px;max-height:73vh}
.area-menu:hover .area-panel,.area-menu:focus-within .area-panel,.area-menu.expanded .area-panel{display:block}
.area-menu-intro{display:flex;justify-content:space-between;align-items:center;gap:10px;border-bottom:1px solid #dce8ef;padding-bottom:13px;margin-bottom:12px}
.area-menu-intro strong{font-size:17px;color:#123454}.area-menu-intro span{font-size:12px;color:#547185}
.county-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px 16px}
.county-block{border:1px solid #dce7ef;border-radius:9px;overflow:hidden;background:#f8fbfc}
.county-block summary{cursor:pointer;font-size:13px;font-weight:800;padding:12px 13px;color:#123454;list-style:none;display:flex;align-items:center;justify-content:space-between}
.county-block summary::-webkit-details-marker{display:none}.county-block summary:after{content:'+';font-size:19px;font-weight:400;color:#1f6585}.county-block[open] summary:after{content:'−'}
.county-block[open]{grid-row:span 3;background:white}
.county-links{display:grid;grid-template-columns:1fr;gap:1px;padding:3px 12px 12px;max-height:260px;overflow:auto}
.county-links a{font-size:12px;line-height:1.4;padding:6px 4px!important;color:#395a71}.county-links a:hover{color:#b21b2f;background:#f1f6f8}
.area-all{font-size:13px;color:#0e648d!important;display:block;margin-top:14px;font-weight:800}
.hero-wide{background:linear-gradient(90deg,rgba(9,31,54,.91) 0%,rgba(11,37,59,.81) 45%,rgba(9,31,54,.30) 100%),url('new-england-roof.jpg') center 45%/cover no-repeat;color:#fff}
.hero-wide .hero-inner{display:block;min-height:655px;max-width:1200px;padding-top:130px;padding-bottom:115px}
.hero-wide .hero-inner>div{max-width:750px}
.hero-wide .eyebrow{color:#bfe8ff}.hero-wide h1{color:#fff;font-size:clamp(44px,5.2vw,75px);letter-spacing:-.05em;line-height:1.07;text-shadow:0 3px 12px #11273865}
.hero-wide p{color:#eff7fc;font-size:19px;line-height:1.7;max-width:680px}
.hero-wide .mini{color:#dbe8ef}.hero-wide .btn.secondary{background:#fff;color:#103756}
.footer .mayflower-logo{max-height:70px!important;max-width:225px!important}
@media(max-width:1150px){.nav{height:90px}.header .brand{min-width:255px}.brand-words strong{font-size:22px}.brand-words small{font-size:10px}.navlinks{gap:10px}.navlinks>a,.area-trigger{font-size:12px}.brand-logo-slot{width:53px;height:53px}.mayflower-logo{max-width:175px!important;max-height:65px!important}}
@media(max-width:950px){.nav{height:82px}.navlinks{top:82px}.header .brand{min-width:0}.area-panel{width:100%;max-height:55vh;position:static;padding:14px;box-shadow:none;overflow:auto}.county-grid{grid-template-columns:1fr 1fr}.area-menu:hover .area-panel{display:none}.area-menu.expanded .area-panel{display:block}.hero-wide .hero-inner{min-height:500px;padding:85px 26px}.hero-wide h1{font-size:clamp(39px,6vw,63px)}}
@media(max-width:620px){.nav{height:74px}.navlinks{top:74px}.brand-words strong{font-size:17px}.brand-words small{font-size:9px}.brand-logo-slot{width:45px;height:45px}.brand-logo-slot .mark{width:43px;height:43px}.mayflower-logo{max-height:50px!important;max-width:135px!important}.area-menu-intro{display:block}.area-menu-intro span{display:block}.county-grid{grid-template-columns:1fr}.hero-wide .hero-inner{padding:76px 26px;min-height:570px}.hero-wide h1{font-size:42px}.hero-wide p{font-size:16px}}

/* V5: real company logo and filled homepage hero right column */
.header .header-real-logo{display:block;flex:0 0 auto;width:86px;height:77px;object-fit:contain;object-position:center;background:#fff;border-radius:5px}
.header .brand{gap:13px}
.hero-wide{background:linear-gradient(110deg,#0b2b45,#174c6f);color:#fff}
.hero-wide .hero-inner{display:grid;grid-template-columns:minmax(0,1fr) minmax(340px,.92fr);align-items:center;gap:45px;max-width:1200px;padding-top:85px;padding-bottom:85px;min-height:635px}
.hero-wide .hero-inner>div{max-width:none}
.hero-wide .hero-copy{min-width:0}
.hero-wide h1{font-size:clamp(41px,4.55vw,66px);max-width:680px}
.hero-wide .hero-visual{position:relative;align-self:stretch;min-height:430px;border-radius:18px;overflow:hidden;box-shadow:0 28px 60px #001a2d75;border:4px solid #ffffff32}
.hero-wide .hero-visual img{width:100%;height:100%;min-height:430px;object-fit:cover;object-position:54% center}
.hero-photo-caption{position:absolute;bottom:0;left:0;right:0;color:#fff;font-weight:800;font-size:15px;letter-spacing:.02em;padding:35px 20px 18px;background:linear-gradient(transparent,#071b2dcf)}
@media(max-width:1100px){.hero-wide .hero-inner{gap:24px;grid-template-columns:minmax(0,1.1fr) minmax(285px,.9fr)}.hero-wide h1{font-size:clamp(38px,4.3vw,55px)}.header .header-real-logo{width:68px;height:65px}}
@media(max-width:850px){.hero-wide .hero-inner{grid-template-columns:1fr;padding-top:55px;padding-bottom:55px;min-height:initial}.hero-wide .hero-visual{min-height:330px;max-height:460px}.hero-wide .hero-visual img{min-height:330px}.hero-wide h1{font-size:clamp(36px,6.3vw,54px)}}
@media(max-width:620px){.header .header-real-logo{width:53px;height:51px}.hero-wide .hero-inner{padding-top:42px;padding-bottom:44px}.hero-wide .hero-visual{min-height:255px}.hero-wide .hero-visual img{min-height:255px}.hero-wide h1{font-size:38px}}

/* v6: matching service imagery, unique page photography and responsive Google map */
.footgrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;align-items:start}
.footmap{min-width:0}.footmap h4{margin:0 0 12px}.footmap iframe{display:block;width:100%;height:185px;border:0;border-radius:12px;background:#dfe7eb}.footmap p{font-size:12px;line-height:1.5;opacity:.85}
.service-card-icon{height:165px;background:linear-gradient(145deg,#173c59,#3277a3);position:relative}
.service-card-icon:after{content:'MAYFLOWER';letter-spacing:.18em;position:absolute;left:20px;bottom:22px;color:#e9f3fa;font-size:13px;font-weight:700}
.city-hero-photo{display:block;max-width:400px;width:100%;border-radius:14px;margin:24px 0}
@media(max-width:950px){.footgrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.footgrid{grid-template-columns:1fr}.footmap iframe{height:220px}}

/* v8: replace blue image placeholders with actual theme-bundled, service-relevant photos */
.card img.service-photo{display:block;width:100%;height:180px;object-fit:cover;object-position:center}
.split img.commercial-photo{display:block;width:100%;height:390px;object-fit:cover;border-radius:17px}
@media(max-width:620px){.split img.commercial-photo{height:250px}}

/* v9 service-specific images and responsive service submenus */
.service-nav-dropdown{position:relative;align-self:center;color:#103956;font-size:13px;font-weight:700}
.service-nav-dropdown>summary{cursor:pointer;list-style:none;white-space:nowrap;padding:10px 0}
.service-nav-dropdown>summary::-webkit-details-marker{display:none}
.service-nav-panel{display:none;position:absolute;z-index:130;left:-12px;top:100%;background:#fff;min-width:245px;box-shadow:0 14px 32px #17354e27;border:1px solid #dce7ef;border-radius:12px;padding:10px}
.service-nav-dropdown[open] .service-nav-panel{display:grid;gap:2px}
.service-nav-panel a{display:block;color:#163e59;font-size:13px;font-weight:600;padding:8px 11px;border-radius:6px;white-space:normal}
.service-nav-panel a:hover{background:#edf5f9}
.subservice-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:24px}
.subservice-card{overflow:hidden;border:1px solid #e2eaf0;border-radius:15px;background:white;box-shadow:0 9px 24px #183d5610}
.subservice-card img{width:100%;height:205px;object-fit:cover}
.subservice-card-body{padding:18px 20px}.subservice-card h3{line-height:1.25;margin:0 0 9px}.subservice-card p{font-size:14px;line-height:1.6}
.subservice-detail-photo{height:330px;max-width:740px;border-radius:16px;object-fit:cover;margin:22px auto}
.subservice-link{display:inline-block;margin:8px 20px 8px 0}
@media(max-width:950px){.service-nav-dropdown{width:100%;padding:0 14px}.service-nav-panel{position:static;box-shadow:none;min-width:0}.subservice-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.subservice-grid{grid-template-columns:1fr}.subservice-detail-photo{height:240px}}