.roof-problems{--problem-green:#234c40;--problem-paper:#f3f3eb;color:#202b27}.problem-hero{background:var(--problem-paper);border-bottom:1px solid #d9dfd6;padding:76px 0 64px}.problem-hero h1{max-width:1000px;margin:20px 0;font-size:clamp(2.5rem,5vw,4.5rem);line-height:1.06}.problem-hero h1 span{color:var(--problem-green)}.problem-hero .lede{max-width:740px}.problem-search{gap:10px;max-width:660px;margin:25px 0;font-weight:600;display:grid}.problem-search input{color:#202b27;width:100%;font:inherit;background:#fff;border:1px solid #9aa99f;border-radius:8px;padding:17px}.problem-filters{flex-wrap:wrap;gap:10px;margin:24px 0;display:flex}.problem-filters button,.problem-filters>a{color:var(--problem-green);font:inherit;cursor:pointer;background:#fff;border:1px solid #a8b6ad;border-radius:30px;padding:10px 17px;text-decoration:none}.problem-filters button[aria-pressed=true]{background:var(--problem-green);color:#fff}.problem-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;display:grid}.problem-card{background:#fff;border:1px solid #d4ddd5;border-radius:12px;overflow:hidden}.problem-illustration{color:var(--problem-green);background:#e9eee6;place-items:center;height:130px;display:grid}.problem-illustration svg{width:240px;max-width:100%;height:100px}.problem-card-copy{padding:25px}.problem-card h3{margin:12px 0;font-size:1.5rem;line-height:1.2}.problem-card h3 a{color:inherit;text-decoration:none}.problem-card p{line-height:1.7}.problem-panel{background:var(--problem-paper);border-radius:12px;margin:48px 0;padding:32px}.problem-comparison{grid-template-columns:repeat(3,1fr);gap:24px;margin:24px 0;display:grid}.problem-bottom{margin:48px 0}.problem-article{max-width:900px;padding-top:32px;padding-bottom:64px;font-size:1.1rem;line-height:1.8}.problem-article section{margin:38px 0;scroll-margin-top:110px}.problem-article h2{font-size:2rem;line-height:1.2}.problem-causes{padding:0;list-style:none}.problem-causes li{border-bottom:1px solid #d4ddd5;align-items:baseline;gap:24px;padding:10px 0;display:flex}.problem-causes li>span{color:var(--problem-green);font-weight:700}.problem-urgent{background:#fff6e8;border-left:4px solid #af752d;margin:36px 0;padding:24px}.problem-urgent h2{font-size:1.35rem}.problem-related{padding-left:20px}.problem-related li{margin:16px 0}.problem-sources{font-size:.95rem}.roof-problems :focus-visible{outline-offset:4px;outline:3px solid #b57b31}.problem-home-link{background:#f3f3eb;padding:40px 0}.problem-home-link h2{margin-top:0}@media (max-width:1000px){.problem-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width:600px){.problem-grid,.problem-comparison{grid-template-columns:1fr}.problem-hero{padding:40px 0}.problem-panel,.problem-card-copy{padding:22px}.problem-article h2{font-size:1.65rem}}.roof-problems .problem-illustration{aspect-ratio:3/2;background:#e9eee6;height:auto;display:block;overflow:hidden}.problem-illustration img{object-fit:cover;width:100%;height:100%;display:block}.problem-detail-image{margin:0 0 32px}.problem-detail-image img{border-radius:12px;width:100%;height:auto;display:block}.problem-detail-image figcaption{color:#59685e;margin-top:8px;font-size:.85rem}.problem-search-form{flex-wrap:wrap;align-items:center;gap:16px;display:flex}.problem-search-form .problem-search{flex:1;min-width:220px}.problem-pagination{flex-wrap:wrap;gap:12px;margin:38px 0;display:flex}.problem-pagination a{border:1px solid #a8b6ad;border-radius:8px;padding:12px 18px;text-decoration:none}.problem-pagination a[aria-current=page],.problem-filters a[aria-current=true]{color:#fff;background:#234c40}.problem-related-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;display:grid}.problem-related-grid img{width:100%;height:auto;display:block}.problem-related-grid h3{font-size:1.3rem}.problem-related-grid .problem-card-copy{padding:18px}.problem-related-grid p{font-size:.95rem;line-height:1.6}@media (max-width:650px){.problem-related-grid{grid-template-columns:1fr}}
