.roofing{color:var(--foreground);background:var(--background);font-family:var(--font-body,Inter, sans-serif)}.roofing h1,.roofing h2,.roofing h3{font-family:var(--font-title,Inter, sans-serif);overflow-wrap:anywhere}.roofing-container{width:100%;max-width:var(--container-width,1600px);margin-inline:auto;padding-inline:clamp(20px,4vw,64px)}.roofing-section{padding-block:var(--padding-section,64px)}.roofing-eyebrow{letter-spacing:.16em;text-transform:uppercase;font-size:11px;font-weight:700}.roofing-hero{background:var(--secondary);color:#fff;padding-block:clamp(72px,10vw,160px);position:relative;overflow:hidden}.roofing-hero :is(h1,h2){letter-spacing:-.045em;font-size:clamp(38px,5vw,72px);font-weight:900;line-height:1.04}.roofing-hero-image{align-items:center;min-height:min(82vh,820px);display:flex}.roofing-hero-photo,.roofing-hero-shade{object-fit:cover;width:100%;height:100%;position:absolute;inset:0}.roofing-hero-shade{background:linear-gradient(90deg,#000000a6,#0006)}.roofing-button{border-radius:var(--radius-button,8px);background:var(--primary);color:#fff;justify-content:center;align-items:center;gap:14px;padding:14px 24px;font-size:14px;font-weight:600;transition:opacity .2s;display:inline-flex}.roofing-button:hover{opacity:.88}.roofing :is(a,button,input,select,summary):focus-visible{outline:2px solid var(--primary);outline-offset:4px}.roofing-product-card{border:1px solid var(--color-neutral-100);border-radius:var(--radius-image,12px);background:var(--background);min-width:0;transition:transform .3s,box-shadow .3s;display:block;overflow:hidden}.roofing-product-card:hover{transform:translateY(-4px);box-shadow:0 18px 35px #00000014}.roofing-tabs{scrollbar-width:thin;gap:8px;padding:5px 2px 14px;display:flex;overflow-x:auto}.roofing-tab{color:var(--foreground);opacity:.65;border:1px solid var(--color-neutral-200);border-radius:999px;flex-shrink:0;padding:11px 18px;font-size:13px;transition:background .2s,opacity .2s}.roofing-tab:hover{opacity:1}.roofing-tab-active{background:var(--primary);color:#fff;opacity:1;border-color:var(--primary);box-shadow:0 3px 0 color-mix(in srgb,var(--primary) 25%,transparent)}.roofing-tab-mask{-webkit-mask-image:linear-gradient(90deg,#0000,#000 8px calc(100% - 8px),#0000);mask-image:linear-gradient(90deg,#0000,#000 8px calc(100% - 8px),#0000)}.roofing-input{border:1px solid var(--color-neutral-200);border-radius:var(--radius-button,8px);background:var(--background);width:100%;min-width:0;padding:12px 16px;font-size:14px}.roofing-input:focus{border-color:var(--primary);box-shadow:0 0 0 3px color-mix(in srgb,var(--primary) 15%,transparent)}.roofing-featured-article{grid-template-columns:3fr 2fr;align-items:center;gap:16px;display:grid}.roofing-article-card{flex-direction:column;min-width:0;display:flex}.roofing-page{border:1px solid var(--color-neutral-200);border-radius:50%;justify-content:center;align-items:center;min-width:40px;height:40px;font-size:13px;display:flex}.roofing-page:disabled{opacity:.3}.roofing-page-current{border-color:var(--primary);background:var(--primary);color:#fff}.roofing-feature-row{border-top:1px solid var(--color-neutral-200);grid-template-columns:auto 1fr;gap:20px;padding:24px 0;display:grid}.roofing-feature-row>span{color:color-mix(in srgb,var(--primary) 20%,transparent);font-size:52px;font-weight:900;line-height:1}.roofing-factory{grid-template-columns:1.5fr 1fr;gap:16px;display:grid}.roofing-factory img{object-fit:cover;border-radius:var(--radius-image,12px);width:100%;height:100%;min-height:220px}.roofing-factory img:first-child{grid-row:span 2}.roofing-steps{grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;display:grid}.roofing-step{border-top:2px solid var(--primary);padding-top:24px}.roofing-faq{border:1px solid var(--color-neutral-200);border-radius:var(--radius,12px);margin-top:12px;padding:20px}.roofing-faq[open]{border-left:3px solid var(--primary)}.roofing-prose{overflow-wrap:anywhere;line-height:1.85}.roofing-prose :is(p,ul,ol,h2,h3,table){margin-block:24px}.roofing-prose h2{font-size:26px;font-weight:700}.roofing-prose img{border-radius:var(--radius-image,12px);max-width:100%;height:auto;margin-block:32px}.roofing-prose table{max-width:100%;display:block;overflow-x:auto}.roofing-prose a{color:var(--primary);text-decoration:underline}@media (max-width:767px){.roofing-section{padding-block:40px}.roofing-featured-article{grid-template-columns:1fr;gap:0}.roofing-factory{grid-template-columns:1fr}.roofing-factory img:first-child{grid-row:auto}.roofing-steps{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (prefers-reduced-motion:reduce){.roofing *{transition:none!important;animation:none!important}.roofing-product-card:hover{transform:none}}.roofing .bg-secondary{background-color:var(--secondary)}.roofing .bg-secondary\/5{background-color:color-mix(in srgb,var(--secondary) 5%,transparent)}.roofing .text-secondary{color:var(--secondary)}.roofing .text-secondary\/30{color:color-mix(in srgb,var(--secondary) 30%,transparent)}