.roofing-page{--roof-ink:#062e20;--roof-green:#047a3d;--roof-charcoal:#1e2925;--roof-slate:#3e4b46;--roof-mint:#eaf7ef;--roof-sand:#f7f4ec;--roof-yellow:#f4c84a;background:#fff;color:var(--roof-ink)}
.roofing-page .landing-eyebrow{gap:8px}.roofing-page .landing-eyebrow i{font-size:.9rem}
.roof-hero{position:relative;overflow:hidden;background:linear-gradient(120deg,#fbfcf9 0%,#f2f6ef 54%,#e2eee7 100%)}
.roof-hero::before{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(135deg,rgba(30,41,37,.035) 0 1px,transparent 1px 34px);mask-image:linear-gradient(90deg,#000,transparent 78%)}
.roof-hero__grid{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,.8fr) minmax(600px,1.2fr);align-items:center;gap:clamp(42px,5vw,82px);min-height:750px;padding-top:72px;padding-bottom:70px}
.roof-hero__copy h1,.roof-heading h2,.roof-pipeline__panel h3,.roof-final h2{margin:0;color:var(--roof-ink);font-weight:900;letter-spacing:-.055em;text-wrap:balance}
.roof-hero__copy h1{max-width:650px;margin-top:22px;font-size:clamp(4.4rem,5.7vw,6.8rem);line-height:.9}.roof-hero__copy>p:not(.roof-hero__helper){max-width:620px;margin:27px 0 0;color:#4b6359;font-size:clamp(1.08rem,1.3vw,1.3rem);line-height:1.58}
.roof-hero__actions{display:flex;flex-wrap:wrap;gap:13px;margin-top:30px}.roof-hero__helper{display:flex;gap:9px;margin:19px 0 0;color:#536b61;font-size:.86rem}.roof-hero__helper i{color:var(--roof-green)}
.roof-breadcrumb{display:flex;align-items:center;gap:8px;margin-top:24px;color:#687b73;font-size:.77rem}.roof-breadcrumb a{color:inherit;text-decoration:none}.roof-breadcrumb i{font-size:.55rem}
.roof-hero__visual{position:relative;min-width:0;padding:0 0 67px 20px}.roof-hero__visual picture{display:block;overflow:hidden;border:1px solid rgba(6,46,32,.15);border-radius:34px 34px 34px 130px;box-shadow:0 34px 75px rgba(6,46,32,.2)}.roof-hero__visual img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover}
.roof-hero-card{position:absolute;right:12px;bottom:0;width:min(500px,75%);padding:18px 20px;border:1px solid rgba(6,46,32,.16);border-radius:20px;background:rgba(255,255,255,.97);box-shadow:0 20px 42px rgba(6,46,32,.18);backdrop-filter:blur(10px)}
.roof-hero-card>div:first-child{display:grid;grid-template-columns:36px 1fr auto;align-items:center;gap:10px}.roof-hero-card>div:first-child>i{display:grid;place-items:center;width:36px;height:36px;border-radius:11px;background:var(--roof-green);color:#fff}.roof-hero-card span{display:grid;gap:2px}.roof-hero-card small{color:#75877f;font-size:.64rem;text-transform:uppercase}.roof-hero-card strong{font-size:.8rem}.roof-hero-card>div:first-child>b,.roof-calculator__head b{padding:6px 9px;border-radius:99px;background:#fff4c7;color:#775a00;font-size:.62rem;text-transform:uppercase}
.roof-hero-card__progress{height:7px;margin-top:15px;overflow:hidden;border-radius:99px;background:#e1e9e5}.roof-hero-card__progress i{display:block;width:75%;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--roof-green),#74c98f)}.roof-hero-card>p{display:flex;justify-content:space-between;margin:8px 0 0;color:#6c7e76;font-size:.68rem}.roof-hero-card>p strong{color:var(--roof-ink)}
.roof-weather{position:absolute;top:-18px;right:-9px;display:flex;align-items:center;gap:9px;padding:11px 14px;border:1px solid rgba(6,46,32,.12);border-radius:15px;background:#fff;box-shadow:0 12px 30px rgba(6,46,32,.13);animation:roof-float 4.5s ease-in-out infinite}.roof-weather>i{display:grid;place-items:center;width:32px;height:32px;border-radius:10px;background:#fff4c7;color:#9a7300}.roof-weather span{display:grid;gap:1px;color:#687a72;font-size:.65rem}.roof-weather b{color:var(--roof-ink);font-size:.73rem}
.roof-outcomes{border-block:1px solid #e1e9e5}.roof-outcomes__grid{display:grid;grid-template-columns:repeat(4,1fr)}.roof-outcomes article{display:flex;gap:12px;padding:22px 20px;border-right:1px solid #e5ece8}.roof-outcomes article:last-child{border-right:0}.roof-outcomes article>i{display:grid;place-items:center;flex:0 0 auto;width:38px;height:38px;border-radius:11px;background:var(--roof-mint);color:var(--roof-green)}.roof-outcomes article span{display:grid;gap:3px}.roof-outcomes strong{font-size:.84rem}.roof-outcomes small{color:#6d7f77;font-size:.71rem;line-height:1.4}
.roof-section{padding:clamp(88px,8vw,140px) 0}.roof-heading{max-width:650px}.roof-heading--center{margin-inline:auto;text-align:center}.roof-heading>span,.roof-pipeline__panel>div>span,.roof-scope aside>span,.roof-final__card>div:first-child>span{display:block;margin-bottom:14px;color:var(--roof-green);font-size:.73rem;font-weight:900;letter-spacing:.1em;text-transform:uppercase}.roof-heading h2{font-size:clamp(3rem,4.3vw,5.1rem);line-height:.96}.roof-heading>p{margin:20px 0 0;color:#5b7167;font-size:1rem;line-height:1.65}.roof-heading>small{display:block;margin-top:16px;color:#71837b;font-size:.7rem;line-height:1.45}
.roof-pipeline{background:var(--roof-sand)}.roof-pipeline__tabs{position:relative;display:grid;grid-template-columns:repeat(4,1fr);max-width:980px;margin:42px auto 24px}.roof-pipeline__tabs::before{content:"";position:absolute;top:25px;left:12%;right:12%;height:2px;background:#ccd9d3}.roof-pipeline__tabs button{position:relative;z-index:1;display:grid;justify-items:center;gap:6px;border:0;background:transparent;color:#64776f;font-weight:800;cursor:pointer}.roof-pipeline__tabs button small{position:absolute;top:-8px;right:calc(50% - 31px);display:grid;place-items:center;width:19px;height:19px;border-radius:50%;background:#dbe5e0;color:#6a7d74;font-size:.55rem}.roof-pipeline__tabs button>i{display:grid;place-items:center;width:52px;height:52px;border:2px solid #cbd8d2;border-radius:50%;background:var(--roof-sand);font-size:1.05rem}.roof-pipeline__tabs button span{font-size:.78rem}.roof-pipeline__tabs button.is-active{color:var(--roof-ink)}.roof-pipeline__tabs button.is-active>i{border-color:var(--roof-green);background:var(--roof-green);color:#fff;box-shadow:0 8px 20px rgba(4,122,61,.25)}.roof-pipeline__tabs button.is-active small{background:var(--roof-yellow);color:#4c3a00}
.roof-pipeline__tabs button:focus-visible,.roof-pin:focus-visible,.roof-choice-row button:focus-visible,.roof-language-toggle button:focus-visible{outline:3px solid rgba(244,200,74,.9);outline-offset:4px}
.roof-pipeline__panel{display:grid;grid-template-columns:minmax(0,.85fr) minmax(420px,1.15fr);align-items:center;gap:50px;max-width:1100px;margin-inline:auto;padding:clamp(28px,4vw,52px);border:1px solid #dbe5e0;border-radius:26px;background:#fff;box-shadow:0 18px 50px rgba(6,46,32,.07)}.roof-pipeline__panel[hidden]{display:none}.roof-pipeline__panel h3{font-size:clamp(2.3rem,3.2vw,3.7rem);line-height:.98}.roof-pipeline__panel p{margin:17px 0 0;color:#61756c;line-height:1.65}.roof-pipeline__panel ul{display:grid;gap:9px;margin:0;padding:0;list-style:none}.roof-pipeline__panel li{display:grid;grid-template-columns:38px 1fr auto;align-items:center;gap:11px;padding:12px 14px;border:1px solid #e3ebe7;border-radius:13px;color:#4f655b;font-weight:760}.roof-pipeline__panel li>i{display:grid;place-items:center;width:36px;height:36px;border-radius:10px;background:var(--roof-mint);color:var(--roof-green)}.roof-pipeline__panel li>b{color:var(--roof-green)}
.roof-inspection{background:var(--roof-charcoal);overflow:hidden}.roof-inspection__grid{display:grid;grid-template-columns:minmax(0,.72fr) minmax(560px,1.28fr);align-items:center;gap:clamp(50px,7vw,100px)}.roof-inspection .roof-heading h2{color:#fff}.roof-inspection .roof-heading>span{color:#93dfab}.roof-inspection .roof-heading>p{color:#b9cbc3}.roof-inspection__note{display:flex;gap:12px;margin-top:28px;padding:17px;border:1px solid rgba(255,255,255,.14);border-radius:15px;background:rgba(255,255,255,.07)}.roof-inspection__note>i{display:grid;place-items:center;flex:0 0 auto;width:38px;height:38px;border-radius:11px;background:var(--roof-yellow);color:#4e3b00}.roof-inspection__note span{display:grid;gap:4px}.roof-inspection__note strong{color:#fff}.roof-inspection__note small{color:#b9cbc3;line-height:1.45}
.roof-inspection__photo{position:relative;overflow:hidden;border:1px solid rgba(255,255,255,.25);border-radius:26px;box-shadow:0 30px 70px rgba(0,0,0,.35)}.roof-inspection__photo::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,transparent 55%,rgba(0,0,0,.35))}.roof-inspection__photo img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover}.roof-pin{position:absolute;z-index:2;display:flex;align-items:center;gap:7px;border:0;background:transparent;color:#fff;cursor:pointer}.roof-pin span{display:grid;place-items:center;width:32px;height:32px;border:3px solid #fff;border-radius:50%;background:var(--roof-green);box-shadow:0 4px 13px rgba(0,0,0,.35)}.roof-pin b{padding:6px 9px;border-radius:8px;background:rgba(6,46,32,.88);font-size:.67rem;opacity:0;transform:translateX(-4px);transition:.18s ease}.roof-pin:hover b,.roof-pin.is-active b{opacity:1;transform:none}.roof-pin.is-active span{background:var(--roof-yellow);color:#4c3900}.roof-pin--one{left:30%;top:62%}.roof-pin--two{left:67%;top:48%}.roof-pin--three{left:45%;top:24%}
.roof-scope{background:#fff}.roof-scope__builder{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(300px,.7fr);gap:20px;margin-top:43px;padding:20px;border:1px solid #dfe8e3;border-radius:25px;background:#f8faf9;box-shadow:0 18px 50px rgba(6,46,32,.07)}.roof-scope__builder>div:first-child{display:grid;gap:24px;padding:11px}.roof-scope fieldset{min-width:0;margin:0;padding:0;border:0}.roof-scope legend{margin-bottom:11px;color:#61746c;font-size:.73rem;font-weight:850;text-transform:uppercase}.roof-choice-row{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.roof-choice-row button{display:flex;align-items:center;justify-content:center;gap:8px;min-height:58px;padding:10px;border:1px solid #dce6e1;border-radius:13px;background:#fff;color:#5b7067;font-weight:780;cursor:pointer}.roof-choice-row button:hover{border-color:#8fc4a7;color:var(--roof-green)}.roof-choice-row button.is-active{border-color:var(--roof-green);background:var(--roof-mint);color:var(--roof-ink);box-shadow:inset 0 0 0 1px var(--roof-green)}.roof-scope aside{padding:27px;border-radius:19px;background:linear-gradient(145deg,#073323,#075d37);color:#fff}.roof-scope aside>span{color:#9ee3b4}.roof-scope aside h3{margin:0 0 22px;font-size:1.55rem;font-weight:900;letter-spacing:-.03em}.roof-scope aside>div{display:grid;gap:4px;padding:13px 0;border-top:1px solid rgba(255,255,255,.14)}.roof-scope aside small{color:#a9c5b9}.roof-scope aside p{display:flex;gap:8px;margin:19px 0 0;color:#bfd5cc;font-size:.73rem;line-height:1.5}
.roof-profit{background:linear-gradient(150deg,#f4f8f5,#e6f2eb)}.roof-profit__grid{display:grid;grid-template-columns:minmax(0,.82fr) minmax(500px,1.18fr);align-items:center;gap:clamp(50px,7vw,105px)}.roof-calculator{padding:26px;border:1px solid #d4e2db;border-radius:24px;background:#fff;box-shadow:0 24px 60px rgba(6,46,32,.13)}.roof-calculator__head{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:20px;font-weight:850}.roof-calculator label{display:flex;justify-content:space-between;gap:15px;margin-top:15px;color:#5d7168;font-size:.78rem;font-weight:760}.roof-calculator output{color:var(--roof-ink);font-weight:900}.roof-calculator input[type=range]{width:100%;margin-top:7px;accent-color:var(--roof-green);cursor:pointer}.roof-calculator__result{display:grid;grid-template-columns:repeat(2,1fr);margin-top:22px;overflow:hidden;border-radius:15px;background:var(--roof-green);color:#fff}.roof-calculator__result span{display:grid;gap:5px;padding:18px}.roof-calculator__result span+span{border-left:1px solid rgba(255,255,255,.2)}.roof-calculator__result small{color:#cbe9d5;text-transform:uppercase}.roof-calculator__result strong{font-size:1.65rem}.roof-calculator__result.is-negative{background:#863e32}
.roof-crews{background:#fff}.roof-crews__grid{display:grid;grid-template-columns:minmax(340px,.75fr) minmax(0,1.25fr);align-items:center;gap:clamp(70px,10vw,150px)}.roof-phone{width:min(330px,100%);margin-inline:auto;padding:11px;border:3px solid #344a41;border-radius:42px;background:#15241e;box-shadow:0 28px 60px rgba(6,46,32,.23)}.roof-phone__top{display:flex;align-items:center;justify-content:space-between;padding:4px 18px 10px;color:#dce8e3;font-size:.64rem}.roof-phone__top i{width:46px;height:6px;border-radius:99px;background:#07130e}.roof-phone__app{padding:15px;border-radius:30px;background:#f4f9f6}.roof-phone__brand{display:flex;align-items:center;gap:7px;color:#4d645a;font-size:.68rem;font-weight:800}.roof-phone__brand img{width:27px;height:27px;border-radius:8px;object-fit:contain}.roof-phone__job{display:grid;gap:3px;margin-top:15px;padding:15px;border-radius:16px;background:linear-gradient(145deg,#075d37,#073323);color:#fff}.roof-phone__job small{color:#9fe1b5}.roof-phone__job span{font-size:.71rem}.roof-phone__actions{display:grid;gap:8px;margin-top:10px}.roof-phone__actions button{display:flex;align-items:center;gap:9px;width:100%;padding:11px;border:1px solid #dce7e1;border-radius:11px;background:#fff;color:var(--roof-ink);font-size:.72rem;font-weight:780;text-align:left}.roof-phone__actions i{color:var(--roof-green)}.roof-language-toggle{display:inline-grid;grid-template-columns:repeat(2,1fr);gap:4px;margin-top:24px;padding:4px;border:1px solid #dae5df;border-radius:99px;background:#f3f7f5}.roof-language-toggle button{min-width:55px;padding:8px 12px;border:0;border-radius:99px;background:transparent;color:#61756d;font-weight:850;cursor:pointer}.roof-language-toggle button.is-active{background:var(--roof-green);color:#fff}.roof-crews .roof-heading ul{display:grid;gap:11px;margin:24px 0 0;padding:0;list-style:none}.roof-crews .roof-heading li{display:flex;gap:9px;color:#53685f}.roof-crews .roof-heading li i{color:var(--roof-green)}
.roof-faq{background:#f4f8f6}.roof-faq__grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(500px,1.2fr);gap:clamp(55px,8vw,115px)}.roof-faq__list{display:grid;align-content:start;gap:10px}.roof-faq details{border:1px solid #dde7e2;border-radius:14px;background:#fff}.roof-faq summary{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:18px 20px;font-weight:820;cursor:pointer;list-style:none}.roof-faq summary::-webkit-details-marker{display:none}.roof-faq summary i{color:var(--roof-green);transition:transform .2s}.roof-faq details[open] summary i{transform:rotate(45deg)}.roof-faq details p{margin:0;padding:0 20px 20px;color:#62766d;line-height:1.6}
.roof-final{padding:30px 0 88px;background:#f4f8f6}.roof-final__card{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:48px;padding:clamp(36px,5vw,64px);border-radius:27px;background:linear-gradient(120deg,#1e2925,#073323 62%,#087c42);color:#fff;box-shadow:0 26px 60px rgba(6,46,32,.2)}.roof-final__card>div:first-child>span{color:#a9e2ba}.roof-final h2{max-width:760px;color:#fff;font-size:clamp(2.7rem,4vw,4.5rem);line-height:.97}.roof-final p{max-width:700px;margin:17px 0 0;color:#d3e5dd;line-height:1.6}.roof-final__card>div:last-child{display:grid;justify-items:center;gap:14px;min-width:245px}.roof-final__card>div:last-child>a:last-child{color:#fff;font-size:.78rem;font-weight:800}
.roofing-page.has-roofing-motion [data-roofing-reveal]{opacity:0;transform:translateY(27px);transition:opacity .62s ease,transform .62s cubic-bezier(.2,.7,.2,1)}.roofing-page.has-roofing-motion [data-roofing-reveal].is-visible{opacity:1;transform:none}
@keyframes roof-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
@media(max-width:1180px){.roof-hero__grid{grid-template-columns:minmax(0,.86fr) minmax(500px,1.14fr);gap:38px}.roof-hero__copy h1{font-size:clamp(4rem,5.7vw,5.5rem)}.roof-hero-card{width:82%}}
@media(max-width:900px){.roof-hero__grid,.roof-inspection__grid,.roof-profit__grid,.roof-crews__grid,.roof-faq__grid{grid-template-columns:1fr}.roof-hero__grid{min-height:0;padding-top:58px}.roof-hero__visual{padding-left:0}.roof-outcomes__grid{grid-template-columns:repeat(2,1fr)}.roof-outcomes article:nth-child(2){border-right:0}.roof-outcomes article:nth-child(-n+2){border-bottom:1px solid #e5ece8}.roof-pipeline__panel{grid-template-columns:1fr}.roof-inspection__grid{gap:45px}.roof-scope__builder{grid-template-columns:1fr}.roof-profit__grid{gap:45px}.roof-crews__grid{gap:50px}.roof-phone{order:2}.roof-faq__grid{gap:42px}.roof-final__card{grid-template-columns:1fr}.roof-final__card>div:last-child{justify-items:start}}
@media(max-width:700px){.roof-section{padding:78px 0}.roof-hero__grid{padding-top:44px;padding-bottom:52px}.roof-hero__copy h1{margin-top:17px;font-size:clamp(3.55rem,15vw,4.8rem)}.roof-hero__copy>p:not(.roof-hero__helper){margin-top:20px;font-size:1rem}.roof-hero__actions{display:grid}.roof-hero__actions .landing-btn{width:100%}.roof-breadcrumb{flex-wrap:wrap}.roof-hero__visual{padding-bottom:108px}.roof-hero__visual picture{border-radius:24px 24px 24px 70px}.roof-hero__visual img{aspect-ratio:5/4}.roof-weather{right:7px;top:-14px}.roof-hero-card{right:7px;width:calc(100% - 14px);padding:15px}.roof-outcomes__grid{grid-template-columns:1fr}.roof-outcomes article{padding-inline:5px;border-right:0;border-bottom:1px solid #e5ece8}.roof-heading h2{font-size:clamp(2.8rem,12vw,3.9rem)}.roof-pipeline__tabs{grid-template-columns:repeat(4,1fr)}.roof-pipeline__tabs button span{font-size:.6rem}.roof-pipeline__tabs button>i{width:44px;height:44px}.roof-pipeline__tabs::before{top:21px}.roof-pipeline__panel{gap:28px;padding:22px}.roof-pipeline__panel li{grid-template-columns:34px 1fr auto;padding:10px}.roof-pipeline__panel li>i{width:32px;height:32px}.roof-inspection__photo{overflow:visible;margin-bottom:55px}.roof-inspection__photo img{border-radius:22px}.roof-pin b{opacity:0}.roof-pin.is-active b{opacity:1;position:absolute;top:38px;left:0;min-width:85px}.roof-pin--one{left:18%;top:62%}.roof-pin--two{left:68%;top:47%}.roof-pin--three{left:43%;top:22%}.roof-scope__builder{padding:12px}.roof-choice-row{grid-template-columns:1fr}.roof-choice-row button{justify-content:flex-start}.roof-scope aside{padding:22px}.roof-calculator{padding:19px}.roof-calculator__result strong{font-size:1.35rem}.roof-phone{width:min(315px,88vw)}.roof-faq summary{padding:17px;font-size:.9rem}.roof-final{padding-bottom:56px}.roof-final__card{padding:29px 23px;border-radius:22px}.roof-final__card>div:last-child{width:100%}.roof-final__card .landing-btn{width:100%}}
@media(prefers-reduced-motion:reduce){.roof-weather{animation:none}.roof-pin b,.roof-faq summary i{transition:none}.roofing-page.has-roofing-motion [data-roofing-reveal]{opacity:1;transform:none;transition:none}}
