.roofing-navigation{position:static}.roofing-menu-panel{color:#14251f;z-index:80;background:#fff;border:1px solid #e4e9e1;border-radius:12px;grid-template-columns:1fr 1fr 1fr;gap:28px;width:min(970px,100vw - 80px);max-height:calc(100dvh - 150px);margin-inline:auto;padding:30px;display:grid;position:absolute;top:100%;left:40px;right:40px;overflow-y:auto;box-shadow:0 18px 55px #0002}.roofing-menu-panel h3{text-transform:uppercase;letter-spacing:.07em;color:#56665a;margin:0 0 10px;font-size:14px}.roofing-menu-panel a{color:inherit;padding:8px 0;font-size:15px;line-height:1.5;text-decoration:none;display:block}.roofing-menu-panel a:hover{color:#35664b;text-decoration:underline}.roofing-menu-panel .button{color:#fff;text-align:center;margin-top:14px;padding:12px 15px}.roofing-mobile-section{text-transform:uppercase;color:#667468;margin:18px 0 8px;font-size:12px}.roofing-navigation>summary{cursor:pointer;list-style:none}.roofing-navigation>summary::-webkit-details-marker{display:none}.roofing-navigation>summary:after{content:"⌄";margin-left:8px}.roofing-menu-panel a:focus-visible{outline-offset:3px;outline:3px solid #9b303b}.roofing-scope-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;display:grid}.roofing-scope-grid article{background:#fff;border:1px solid #d9dfd6;border-radius:12px;padding:26px}.roofing-scope-grid h3{font-size:1.5rem}.roofing-scope-grid p{line-height:1.75}.roofing-scope-grid a{margin-top:14px;display:block}@media (max-width:800px){.roofing-scope-grid{grid-template-columns:1fr}.roofing-menu-panel{display:none}}.roofing-group-title{align-items:center;gap:10px;min-height:44px;display:flex}.roofing-group-title img{object-fit:contain;flex:0 0 40px;width:40px;height:40px;display:block}.roofing-group-title span{line-height:1.4}.roofing-menu-panel .roofing-menu-phone{color:#9b1818;margin-top:8px;font-weight:700}.roofing-mobile-links .roofing-menu-phone{font-weight:700}.roofing-mobile .roofing-group-title{margin-top:18px}@media (min-width:1001px) and (max-width:1200px){body>header:has(>.header-phone){column-gap:12px}body>header:has(>.header-phone)>nav{gap:4px}body>header>.header-phone{font-size:14px}body>header:has(>.header-phone)>.compact{padding:12px 15px;font-size:13px}}