/* November 2026: readable service choices and a shorter path to an inquiry. */
.refresh{--orange:#ff751c;--ink:#102f40;--muted:#50616b;-webkit-font-smoothing:antialiased}
.refresh [hidden]{display:none!important}
.refresh .section{padding:76px max(24px,calc((100% - 1150px)/2))}
.refresh h1,.refresh h2{letter-spacing:-.045em;text-wrap:balance}
.refresh h2{font-size:clamp(30px,3.2vw,43px)}
.refresh .eyebrow{letter-spacing:.15em;margin-bottom:14px;font-size:11px}
.refresh header{height:88px;gap:20px;padding-inline:max(24px,calc((100% - 1190px)/2));box-shadow:0 4px 20px #00263b08}
.refresh header nav{gap:20px;font-size:13px}
.refresh header .brand img{width:132px;height:62px}
.refresh .topbar{padding:10px max(24px,calc((100% - 1190px)/2));font-size:10px;letter-spacing:.1em}
.refresh .button{border-radius:8px;padding:15px 22px;box-shadow:0 4px 10px #00263b12;font-size:14px;letter-spacing:0}
.refresh .button.secondary{background:#fff;color:#00263b;border:1px solid #c9d5dc;box-shadow:none}
.refresh .button.secondary:hover{background:#edf3f6}
.refresh .hero{min-height:590px;background-position:center 44%}
.refresh .hero-copy{max-width:820px;padding:68px 7.5% 64px}
.refresh .hero h1{font-size:clamp(42px,4.3vw,63px);line-height:1.08;margin-bottom:24px}
.refresh .hero h1 em{color:#ff934c}
.refresh .hero .lead{max-width:500px;font-size:17px;line-height:1.8}
.refresh .hero .actions{gap:24px;flex-wrap:wrap}
.refresh .hero-note{font-size:13px}
.refresh .warranty{max-width:270px;padding:20px;background:#fff;color:#00263b;border-radius:0 0 8px 8px}
.refresh .warranty p{font-size:13px;line-height:1.5;margin:0;max-width:150px}
.refresh .warranty small{font-size:10px;color:#536773;display:block;margin-top:8px}
.refresh .image-label{bottom:194px;font-size:10px}
.refresh .trust{padding:24px 6%;font-size:10px;letter-spacing:.12em}
.refresh .section-head{margin-bottom:30px;gap:32px}
.solution-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.solution-card{background:#fff;border:1px solid #dbe4e9;border-radius:12px;overflow:hidden;display:flex;flex-direction:column;transition:transform .2s,box-shadow .2s}
.solution-card:hover{transform:translateY(-3px);box-shadow:0 14px 30px #00263b12}
.solution-card .roof-service-image{height:175px;flex:none}
.solution-copy{padding:22px;display:flex;flex-direction:column;flex:1}
.solution-copy h3{font-size:20px;line-height:1.25;margin:0 0 12px;letter-spacing:-.03em}
.solution-copy p{font-size:15px;line-height:1.7;color:#50616b;margin:0 0 22px}
.solution-copy>span{font-size:13px;font-weight:700;margin-top:auto;color:#8e3900;display:flex;justify-content:space-between;gap:12px}
.refresh .gallery-note{font-size:12px;line-height:1.7;color:#596c78;margin-top:18px}
.refresh-process{background:#f3f6f7;border-block:1px solid #e5ecef}
.refresh .steps{gap:35px;margin-top:30px}
.refresh .steps article{border-top:1px solid #c7d5dd;padding-top:22px}
.refresh .steps b{font-size:28px;color:#a84000}
.refresh .steps p{font-size:16px}
.refresh .why{gap:60px;grid-template-columns:.85fr 1.2fr}
.refresh .why>div:first-child>p:not(.eyebrow){font-size:16px;line-height:1.8;color:#d3e0e7}
.refresh .benefits{display:grid;grid-template-columns:1fr 1fr;gap:26px}
.refresh .benefits article{display:block;padding:0 0 18px;border-bottom:1px solid #426070}
.refresh .benefits h3{font-size:18px;line-height:1.35;margin:12px 0}
.refresh .benefits p{font-size:14px;line-height:1.75;margin-bottom:0}
.refresh .license-card{border-radius:8px;line-height:1.7}
.refresh .safety-section{gap:70px}
.material-callout{display:grid;grid-template-columns:.8fr 1.2fr;gap:65px;background:#f4f6f7;align-items:center}
.material-callout>.roof-service-image{height:330px;border-radius:12px}
.material-callout p:not(.eyebrow){font-size:16px;line-height:1.8;color:#50616b}
.material-callout .actions{flex-wrap:wrap;gap:20px}
.refresh .area{padding:65px max(24px,calc((100% - 1150px)/2));background:#fff;grid-template-columns:.85fr 1.15fr;gap:70px}
.refresh .area h2{font-size:34px}
.refresh .area p:not(.eyebrow){font-size:16px}
.refresh .region-grid span{font-size:13px}
.refresh .page-cta{padding:50px max(24px,calc((100% - 1150px)/2))}
.refresh .page-intro{padding:58px max(24px,calc((100% - 1150px)/2));background:#00263b}
.refresh .page-intro h1{font-size:clamp(38px,4.7vw,61px);line-height:1.08;max-width:900px}
.refresh .page-intro h1 em{color:#ff934c}
.refresh .page-intro .lead{font-size:17px;line-height:1.8;max-width:700px;color:#d4e2e9}
.refresh .page-intro .actions{margin-bottom:0;gap:16px;flex-wrap:wrap}
.refresh .page-intro .text-link{color:#fff;min-height:44px;display:inline-flex;align-items:center}
.refresh .service-jump{padding:20px max(24px,calc((100% - 1150px)/2));gap:10px;border-bottom:1px solid #dbe5eb;background:#f3f6f7}
.refresh .service-jump a{font-size:13px;background:#fff;flex-grow:1;justify-content:center;min-height:46px}
.refresh .service-feature{max-width:none;display:grid;grid-template-columns:.85fr 1.15fr;gap:65px;align-items:start;background:#fff;border-bottom:1px solid #e0e8ec;scroll-margin-top:88px}
.refresh .service-feature:nth-of-type(odd){background:#f6f8f9}
.refresh .feature-visual .roof-service-image{height:370px;border-radius:12px}
.refresh .feature-copy .lead{max-width:none;font-size:17px;line-height:1.8;margin-bottom:24px}
.refresh .feature-copy .button{margin-top:25px}
.service-detail{border-bottom:1px solid #cddbe2}
.service-detail summary{cursor:pointer;padding:18px 28px 18px 0;font-weight:700;font-size:16px;line-height:1.5}
.service-detail p{font-size:15px;line-height:1.85;color:#50616b;margin:0 0 20px}
.refresh .systems{padding-top:0}
.materials-intro{font-size:16px;line-height:1.8;max-width:740px;color:#50616b}
.refresh .roof-services-grid{gap:22px}
.refresh .roof-service-card{border:1px solid #d8e2e8;border-radius:12px;overflow:hidden;box-shadow:none}
.refresh .roof-service-copy{padding:22px}
.refresh .roof-service-copy h4{font-size:18px;line-height:1.4;min-height:50px}
.refresh .roof-service-copy a{font-size:13px}
.refresh .faq{background:#f5f7f8}
.refresh .faq details{border-radius:8px;border:1px solid #d5e0e6;padding:0 22px;background:#fff;margin-bottom:12px}
.refresh .faq summary{font-size:17px;padding-block:22px;cursor:pointer}
.refresh .faq details p{font-size:16px;line-height:1.8}
.refresh .calculator-section{background:#f3f6f7;color:#00263b;grid-template-columns:1fr 1fr;gap:60px;align-items:start}
.refresh .calculator-section .lead,.refresh .calculator-section .calc-note{color:#50616b}
.refresh .calculator-section .eyebrow{color:#a33c00}
.refresh .calc-panel,.refresh .form-panel{background:#fff;border:1px solid #d0dfe7;border-top:4px solid #ff751c;border-radius:12px;padding:32px;box-shadow:0 12px 36px #00263b08;color:#00263b}
.refresh .calc-panel h3{font-size:24px;margin-top:0}
.refresh .calc-panel label{font-size:15px}
.refresh .calc-panel select,.refresh .calc-panel input,.refresh .field input,.refresh .field textarea,.refresh .field select{font-size:16px;border-radius:6px;min-height:50px;color:#163746}
.refresh .calc-panel input[type=radio]{min-height:20px}
.refresh .calc-panel .calc-note{font-size:13px;line-height:1.75}
.refresh #calc-result{border-radius:8px;background:#edf4f5;color:#00263b;border:1px solid #c2d8df}
.refresh #calc-total{color:#00263b}
.refresh #calc-breakdown{color:#3e5867}
.estimate-details{margin-top:22px;border-top:1px solid #d2e0e7}
.estimate-details summary{font-size:13px;line-height:1.7;font-weight:700;cursor:pointer;padding-top:18px}
.refresh .material-preview{background:#fff}
.refresh .material-picture-grid figure{display:flex;flex-direction:column;border-radius:10px}
.refresh .material-picture-grid figcaption{flex:1;padding:18px 16px 12px;font-size:15px}
.material-select{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:0 14px 16px;padding:12px;border:1px solid #e8bda0;border-radius:6px;color:#843400;background:#fff1e7;font:700 13px/1.4 Arial,sans-serif;cursor:pointer;min-height:46px;text-align:left}
.material-select:hover{background:#ffe1cb}
.refresh .contact{background:#f5f7f8;gap:60px}
.refresh .contact .lead{font-size:17px;line-height:1.8}
.refresh .field label{font-size:15px}
.refresh .privacy-note{font-size:12px;line-height:1.8}
.refresh .pr-footer .pr-footer-grid{max-width:1300px;gap:30px;padding-block:50px}
.refresh .pr-footer .pr-footer-brand img{width:155px}
.refresh .pr-footer h2{font-size:13px;letter-spacing:.08em}
.refresh .pr-footer .pr-contact-row{gap:10px;grid-template-columns:20px minmax(0,1fr)}
.refresh .pr-footer .pr-contact-row svg{width:20px}
.refresh .pr-footer .pr-footer-bottom{padding-block:20px}
.refresh .skip{z-index:50}
.refresh :is(a,button,input,select,textarea,summary):focus-visible{outline:3px solid #c65300;outline-offset:4px}
@media(min-width:701px) and (max-width:1100px){.refresh header{gap:14px}.refresh header nav{gap:12px;font-size:12px}.refresh .nav-call{display:none}.solution-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.refresh .why{gap:35px}.refresh .service-feature{gap:35px}.refresh .hero-copy{max-width:700px}.refresh .hero .actions{max-width:520px}.refresh .warranty{right:24px}.refresh .pr-footer .pr-footer-grid{grid-template-columns:1fr 1fr}}
@media(max-width:700px){
 .refresh header{height:76px;padding:9px 5%;gap:8px}.refresh header .brand img{width:106px;height:auto}.refresh header nav{font-size:16px;gap:0}
 .refresh .topbar{padding:9px 5%;display:flex;justify-content:center;font-size:10px}.refresh .topbar>span{display:none}
 .refresh .hero{min-height:0;background-position:62% center;background-image:linear-gradient(180deg,#001c30f5 0%,#00263be8 57%,#00263b45 100%),url('https://static.wixstatic.com/media/397062_d73f6e0d3baa4f83b7891529ec1fd689~mv2.png')}
 .refresh .hero-copy{padding:42px 6% 192px;max-width:none}.refresh .hero h1{font-size:clamp(35px,8.6vw,48px);line-height:1.1;letter-spacing:-.045em}.refresh .hero .lead{font-size:16px;line-height:1.75}.refresh .hero .actions{display:flex;align-items:stretch;gap:12px;margin:25px 0}.refresh .hero .actions>*{width:100%;justify-content:center;text-align:center;min-height:48px;display:flex;align-items:center}
 .refresh .hero .eyebrow{font-size:10px}.refresh .hero-note{font-size:12px}.refresh .warranty{right:6%;left:6%;bottom:25px;max-width:300px;margin:0;padding:17px 20px}.refresh .warranty strong{font-size:40px}.refresh .warranty p{max-width:190px}.refresh .image-label{display:none}
 .refresh .trust{display:grid;grid-template-columns:1fr 1fr;padding:22px 6%;gap:18px;font-size:9px}.refresh .trust i{display:none}.refresh .trust span{width:auto}
 .refresh .section{padding:48px 6%}.refresh .section-head{display:block;margin-bottom:26px}.refresh .section-head>p{max-width:none}.refresh h2{font-size:32px}.refresh h3{font-size:20px}
 .solution-grid{grid-template-columns:1fr;gap:20px}.solution-card .roof-service-image{height:190px}.solution-copy{padding:24px}.solution-copy h3{font-size:22px}.solution-copy p{font-size:16px}.solution-copy>span{min-height:32px;font-size:14px}
 .refresh .steps{grid-template-columns:1fr;gap:25px}.refresh .steps article{padding-top:20px}.refresh .steps h3{font-size:21px}.refresh .steps p{font-size:16px}
 .refresh .why{grid-template-columns:1fr;gap:35px}.refresh .benefits{grid-template-columns:1fr;gap:22px}.refresh .benefits article{display:grid;grid-template-columns:34px 1fr;gap:16px}.refresh .benefits article>span{padding-top:12px}.refresh .benefits h3{font-size:19px}.refresh .benefits p{font-size:16px}
 .refresh .safety-section{gap:35px}.material-callout{grid-template-columns:1fr;gap:30px}.material-callout>.roof-service-image{height:250px}.material-callout .actions{display:flex;flex-direction:column;align-items:stretch;text-align:center}.material-callout .text-link{padding:12px}
 .refresh .area{padding:48px 6%;grid-template-columns:1fr;gap:20px}.refresh .area h2{font-size:32px}.refresh .page-cta{padding:40px 6%}.refresh .page-intro{padding:40px 6%}.refresh .page-intro h1{font-size:41px}.refresh .page-intro .lead{font-size:16px}.refresh .intro-actions>*{width:100%;justify-content:center;text-align:center}
 .refresh .service-jump{padding:20px 6%;gap:8px}.refresh .service-jump a{flex:1 1 40%;font-size:13px;padding:12px 8px}
 .refresh .service-feature{grid-template-columns:1fr;gap:25px;scroll-margin-top:76px}.refresh .feature-visual .roof-service-image{height:240px}.refresh .feature-copy .lead{font-size:16px}.refresh .feature-copy .button{width:100%}.service-detail p{font-size:16px}.service-detail summary{font-size:16px;padding-block:19px}
 .refresh .roof-services-grid{grid-template-columns:1fr}.refresh .roof-service-copy h4{min-height:0;font-size:20px}.refresh .roof-service-copy a{font-size:14px}.refresh .faq details{padding-inline:18px}.refresh .faq summary{font-size:16px}
 .refresh .calculator-section{grid-template-columns:1fr;gap:28px}.refresh .calc-panel,.refresh .form-panel{padding:24px 18px}.refresh .calculator-section .calc-note{font-size:14px}.refresh .calculator-section .lead{font-size:16px}.refresh .material-picture-grid{grid-template-columns:1fr 1fr;gap:12px}.refresh .material-picture-grid .roof-service-image{height:140px}.refresh .material-picture-grid figcaption{padding:14px 12px;font-size:14px}.material-select{font-size:12px;margin-inline:10px;padding:10px;min-height:48px}.refresh .contact{grid-template-columns:1fr;gap:30px}.refresh .contact .email{font-size:15px}.refresh .estimate-details summary{font-size:14px}
 .refresh .pr-footer .pr-footer-grid{grid-template-columns:1fr;padding:40px 6%;gap:24px}.refresh .pr-footer h2{font-size:14px}.refresh .pr-footer .pr-footer-links{gap:5px}.refresh .pr-footer .pr-footer-links a{min-height:44px}
 .refresh .mobile-actions a{font-size:12px;border-radius:8px;min-height:48px}.refresh .mobile-calc-link{font-size:12px;padding:8px}.refresh .menu-toggle{min-width:60px;padding:9px}
}
@media(max-width:360px){.refresh header .brand img{width:90px}.refresh .mobile-calc-link{font-size:11px}.refresh .hero h1{font-size:34px}.refresh .page-intro h1{font-size:36px}.refresh .material-picture-grid{grid-template-columns:1fr}.refresh .material-picture-grid .roof-service-image{height:190px}}
@media(prefers-reduced-motion:reduce){.refresh *{scroll-behavior:auto!important}.solution-card,.refresh .button{transition:none;transform:none}}
html.high-contrast .refresh .lead,body.high-contrast.refresh .lead{color:inherit}

.refresh .page-intro .eyebrow{color:#ffac76}

/* Contact strip, navigation and FAQ inspired by the supplied layout. */
.refresh .reference-topbar{display:flex;align-items:center;justify-content:space-between;gap:26px;padding:13px max(24px,calc((100% - 1240px)/2));background:#243c49;color:#fff;font-size:13px;line-height:1.6;letter-spacing:0}
.reference-topbar .topbar-contact{display:flex;align-items:center;flex-wrap:wrap;gap:10px 12px}
.reference-topbar a{color:#fff}.reference-topbar a:hover{text-decoration:underline;text-underline-offset:4px}
.reference-topbar .topbar-divider{color:#ff944f}
.reference-topbar .topbar-office{display:flex;flex-direction:column;align-items:flex-end;white-space:nowrap}
.reference-topbar .topbar-office strong{color:#ffb583;font-size:16px}
.reference-topbar .topbar-office span{font-size:11px;color:#dfebf1}
.reference-topbar .language-bar{padding:0;background:transparent;border:0;flex:none;position:relative;z-index:110}
.reference-topbar .language-picker summary{color:#fff;font-size:11px;min-height:32px;gap:7px;white-space:nowrap}
.reference-topbar .language-panel{top:calc(100% + 12px);right:0;width:min(430px,calc(100vw - 32px));font-size:14px;letter-spacing:0}
.reference-topbar .language-panel a{color:#00263b}
.refresh header.reference-header{height:104px;padding:14px max(24px,calc((100% - 1240px)/2));gap:24px;box-shadow:none;border-bottom:1px solid #dfe6e9;z-index:90}
.refresh .reference-header .brand{flex:none}.refresh .reference-header .brand img{width:175px;height:78px;object-fit:contain}
.refresh .reference-header #main-nav{display:flex;align-items:center;gap:26px;margin-left:auto;font-size:14px;letter-spacing:.025em;text-transform:uppercase}
.refresh .reference-header #main-nav>a{display:flex;align-items:center;min-height:48px;padding:9px 0;border-bottom:3px solid transparent;white-space:nowrap}
.refresh .reference-header #main-nav>a:hover,.refresh .reference-header #main-nav>a[aria-current]{color:#a64000;border-bottom-color:#ff751c;text-decoration:none}
.refresh .reference-header .header-calculator{display:inline-flex;flex:none;font-size:13px;min-height:48px;margin-left:8px}
.refresh .reference-faq{padding:0;background:#f1f3f5;scroll-margin-top:104px}
.reference-faq .faq-banner{padding:55px max(24px,calc((100% - 1150px)/2));background:linear-gradient(110deg,#183340,#52646d);color:#fff}
.reference-faq .faq-banner .eyebrow{color:#fff;font-size:12px;letter-spacing:.16em;margin:0 0 17px}
.refresh .reference-faq .faq-banner h2{font-size:clamp(29px,3vw,40px);text-transform:uppercase;letter-spacing:.065em;line-height:1.25;margin:0;max-width:1100px}
.reference-faq .faq-content{max-width:920px;margin:auto;padding:55px 24px 65px}
.reference-faq .faq-content>.eyebrow{text-align:center;margin-bottom:12px}
.reference-faq .faq-content>h3{font-size:30px;letter-spacing:-.025em;text-align:center;margin:0 0 18px}
.reference-faq .faq-intro{max-width:700px;margin:0 auto 34px;text-align:center;font-size:16px;line-height:1.8;color:#4e626e}
.reference-faq .faq-intro a{color:#914000;text-decoration:underline;text-underline-offset:3px}
.refresh .reference-faq details{border-radius:5px;box-shadow:none;margin-bottom:14px}
@media(min-width:1051px) and (max-width:1250px){.refresh .reference-header #main-nav{gap:16px;font-size:13px}.refresh .reference-header .brand img{width:150px}.refresh header.reference-header{gap:16px}.reference-topbar .topbar-contact{max-width:430px}.refresh .reference-topbar{gap:18px;font-size:12px}}
@media(max-width:1050px){
 .refresh header.reference-header{height:82px;padding:10px 5%;gap:12px;position:sticky;top:0}
 .refresh .reference-header .brand img{width:135px;height:62px}
 .refresh .reference-header .menu-toggle{display:block;margin-left:0;min-width:68px;min-height:46px}
 .refresh .reference-header .mobile-calc-link{display:inline-flex;margin-left:auto;min-height:46px;font-size:12px;align-items:center;justify-content:center;padding:9px 12px}
 .refresh .reference-header .header-calculator{display:none}
 .refresh .reference-header #main-nav{display:none;position:absolute;left:0;right:0;top:100%;margin:0;padding:14px 5% 20px;background:#fff;border-bottom:2px solid #ff751c;box-shadow:0 12px 22px #00263b17;max-height:calc(100dvh - 100px);overflow:auto;flex-direction:column;align-items:stretch;gap:0;font-size:15px;letter-spacing:.025em}
 .refresh .reference-header #main-nav.is-open{display:flex}
 .refresh .reference-header #main-nav>a{min-height:48px;padding:12px 8px;border-bottom:1px solid #e2eaee}
 .refresh .reference-topbar{display:grid;grid-template-columns:1fr auto;gap:9px 16px;padding:12px 5%;font-size:12px}
 .reference-topbar .topbar-contact{grid-column:1/-1;justify-content:center}
 .reference-topbar .topbar-office{align-items:flex-start}
 .reference-topbar .language-bar{justify-self:end}
 .refresh .reference-faq{scroll-margin-top:82px}
}
@media(max-width:600px){
 .refresh .reference-topbar{gap:8px;padding:10px 5%;font-size:11px}
 .reference-topbar .topbar-contact{display:flex;flex-direction:column;gap:3px;align-items:flex-start;grid-column:auto}
 .reference-topbar .topbar-divider{display:none}
 .reference-topbar .topbar-office{grid-column:1;grid-row:2;align-items:flex-start;gap:1px}
 .reference-topbar .topbar-office strong{font-size:14px}
 .reference-topbar .topbar-office span{font-size:10px}
 .reference-topbar .language-bar{grid-column:2;grid-row:1/3}
 .reference-topbar .language-picker summary{font-size:10px;white-space:normal;max-width:85px;line-height:1.5}
 .reference-topbar .language-panel{right:0;top:100%;width:calc(100vw - 40px)}
 .refresh header.reference-header{height:78px;gap:8px}
 .refresh .reference-header .brand img{width:112px;height:58px}
 .refresh .reference-header .mobile-calc-link{padding:8px;font-size:11px}
 .refresh .reference-header .menu-toggle{min-width:60px;font-size:12px}
 .reference-faq .faq-banner{padding:40px 6%}
 .refresh .reference-faq .faq-banner h2{font-size:29px;letter-spacing:.035em}
 .reference-faq .faq-banner .eyebrow{font-size:10px;line-height:1.7}
 .reference-faq .faq-content{padding:38px 6% 48px}
 .reference-faq .faq-content>h3{font-size:26px}
 .refresh .reference-faq{scroll-margin-top:78px}
}
@media(max-width:360px){.refresh .reference-header .brand img{width:91px}.refresh .reference-header .mobile-calc-link{font-size:10px;padding:7px}.refresh .reference-topbar{padding-inline:4%}.reference-topbar .topbar-contact a{font-size:10px}}

/* Root scroll padding already reserves space for the sticky header. */
#questions.reference-faq { scroll-margin-top: 0; }

/* Explicit material subtypes keep picture choices and calculator totals aligned. */
.material-type-options { display:grid; gap:8px; margin-top:auto; padding:0 16px 18px; }
.material-type-options .material-select { width:100%; margin:0; min-height:44px; white-space:normal; line-height:1.4; text-align:left; }
#material-calculation-note a { color:#873800; text-decoration:underline; text-underline-offset:3px; }

#calculator > div:first-child > p.calc-note { color:#4e626b !important; }
