.roofing-content{width:90%;max-width:none;margin:auto}
.roofing-block{padding:86px 0;border-top:1px solid rgba(18,48,72,.1);scroll-margin-top:190px}
.roofing-block:first-child{border-top:0;padding-top:42px}
.roofing-block-title{text-align:center;margin-bottom:46px}
.roofing-block-title .eyebrow{display:block;margin-bottom:12px}
.roofing-block-title h2{font-size:clamp(32px,3.25vw,54px);line-height:1.25;letter-spacing:.04em}
.roofing-block-title p{width:min(760px,90%);margin:22px auto 0;color:var(--muted);font-size:16px;line-height:1.95}
.roofing-feature{display:grid;grid-template-columns:2fr 1fr;gap:28px;align-items:stretch}
.roofing-feature.equal{grid-template-columns:1.12fr 1fr}
.roofing-feature-media,.roofing-feature-copy,.roof-model-carousel{min-width:0;background:#f3f6f8}
.roofing-feature-media img{display:block;width:100%;height:100%;min-height:460px;object-fit:cover}
.roofing-feature-copy{display:flex;flex-direction:column;justify-content:center;padding:clamp(34px,4vw,72px)}
.roofing-feature-copy h3{font-size:clamp(25px,2.2vw,36px);line-height:1.35}
.roofing-feature-copy p{margin-top:22px;color:var(--muted);font-size:16px;line-height:1.95}
.roofing-feature-points{display:grid;gap:18px;margin-top:30px}
.roofing-feature-points li{list-style:none;padding-top:18px;border-top:1px solid rgba(18,48,72,.12);font-size:15px;line-height:1.7}
.roof-model-carousel{position:relative;overflow:hidden;min-height:460px}
.roof-model-slide{position:absolute;inset:0;display:flex;flex-direction:column;opacity:0;transition:opacity .55s ease;pointer-events:none}
.roof-model-slide.is-active{opacity:1;pointer-events:auto}
.roof-model-slide img{width:100%;height:calc(100% - 68px);padding:24px;background:#f7f9fa;object-fit:contain}
.roof-model-slide figcaption{display:flex;min-height:68px;align-items:center;justify-content:center;background:#fff;color:var(--ink);font-size:18px;font-weight:650;letter-spacing:.04em}
.roof-carousel-control{position:absolute;z-index:2;top:calc(50% - 34px);width:48px;height:68px;border:0;background:rgba(4,38,82,.72);color:#fff;font-size:34px;line-height:1;cursor:pointer;transition:background .25s}
.roof-carousel-control:hover{background:var(--blue-deep)}
.roof-carousel-control.prev{left:0}.roof-carousel-control.next{right:0}
.roof-carousel-control:focus-visible{outline:2px solid #fff;outline-offset:-5px}
.roof-parameters{width:70%;margin-left:auto;margin-right:auto;overflow-x:auto;border:1px solid #e3eaf0;border-radius:22px;background:#fff;box-shadow:0 18px 46px rgba(35,61,82,.07)}
.roof-parameters .spec-table{min-width:760px;margin:0;border:0;border-collapse:separate;border-spacing:0}.roof-parameters .spec-table caption{padding:20px 28px;background:#f7f9fb;color:#536476;font-size:14px;text-align:left}.roof-parameters .spec-table th,.roof-parameters .spec-table td{padding:25px 28px;border:0;border-bottom:1px solid #e3eaf0;font-size:15px;line-height:1.55}.roof-parameters .spec-table thead th{background:#f6f8fa;color:#536476;font-weight:700}.roof-parameters .spec-table thead th:nth-child(2){background:rgba(0,28,131,.075);color:#40599d}.roof-parameters .spec-table thead th:nth-child(3){background:rgba(200,150,62,.12);color:#98712f}.roof-parameters .spec-table tbody tr:nth-child(odd) td{background:#f8fafc}.roof-parameters .spec-table tbody td:first-child{color:#66778a;font-weight:500}.roof-parameters .spec-table tbody td:not(:first-child){color:#172433;font-weight:650}.roof-parameters .spec-table tr:last-child td{border-bottom:0}
.roof-node-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.roof-node-card{margin:0;background:#f3f6f8;overflow:hidden}
.roof-node-card img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;transition:transform .6s cubic-bezier(.22,1,.36,1)}
.roof-node-card:hover img{transform:scale(1.035)}
.roof-node-card figcaption{padding:22px 24px;font-size:19px;font-weight:650;line-height:1.45}
#product-next-steps{padding-inline:0}
#product-next-steps>.container{width:90%;max-width:none}
#product-next-steps .card-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:22px}
#product-next-steps .card,#product-next-steps .card-dark{min-height:320px;padding:38px 34px;border:1px solid var(--line);border-radius:18px;background:#fff;color:var(--ink);box-shadow:0 8px 24px rgba(18,48,72,.035);transition:transform .38s cubic-bezier(.22,1,.36,1),box-shadow .38s,border-color .38s}
#product-next-steps .card:hover{transform:translateY(-9px);border-color:rgba(14,75,140,.24);box-shadow:0 22px 48px rgba(18,48,72,.11)}
#product-next-steps .card p{color:var(--steel)}
#product-next-steps .card .link-arrow,#product-next-steps .card-dark .link-arrow{min-height:50px;padding:13px 20px;border-radius:14px;color:var(--blue);justify-content:center}
@media(max-width:1100px){#product-next-steps .card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:900px){.roofing-feature,.roofing-feature.equal{grid-template-columns:1fr}.roof-model-carousel{min-height:520px}.roofing-feature-media img{min-height:360px}.roof-node-grid{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.roofing-content{width:90%}.roofing-block{padding:62px 0}.roofing-block-title{margin-bottom:30px}.roof-model-carousel{min-height:420px}.roof-node-grid{grid-template-columns:1fr}.roofing-feature-copy{padding:30px}.roof-model-slide figcaption{font-size:16px}}
@media(max-width:600px){#product-next-steps .card-grid{grid-template-columns:1fr}#product-next-steps .card{min-height:280px}}
@media(prefers-reduced-motion:reduce){.roof-model-slide{transition:none}.roof-node-card img{transition:none}}
.roof-parameters .spec-table thead th:nth-child(2)::before,.roof-parameters .spec-table thead th:nth-child(3)::before{content:'●';margin-right:10px;font-size:11px}

@media(max-width:900px){.roof-parameters{width:100%}}