.roof-cover-figure{margin:0}.roof-photo{display:block;position:relative;overflow:hidden;background:#dfe4e7}.roof-photo img{display:block;width:100%;height:auto;transition:transform .25s}.roof-photo:hover img{transform:scale(1.025)}.project-detail .roof-cover img{height:min(650px,70vw);min-height:320px;object-fit:cover;object-position:center 45%}.roof-enlarge{position:absolute;bottom:16px;right:16px;background:#102e42e8;color:#fff;padding:8px 13px;font-size:12px}.roof-collection{padding-top:60px}.roof-gallery-heading{display:flex;align-items:end;justify-content:space-between;gap:25px;margin-bottom:28px}.roof-gallery-heading h2{font-size:clamp(28px,3vw,44px);margin-top:12px}.roof-gallery-heading>p{font-size:12px;max-width:230px}.roof-gallery-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px 22px}.roof-gallery-grid figure{margin:0}.project-detail .roof-gallery-grid img{height:340px;width:100%;object-fit:cover}.roof-gallery-grid figcaption{font-size:12px;color:var(--muted);padding-top:10px}.roof-viewer{border:0;padding:20px;background:#10202d;color:#fff;width:min(1200px,96vw);max-width:96vw;max-height:96dvh;border-radius:4px}.roof-viewer::backdrop{background:#000d}.roof-viewer-toolbar,.roof-viewer-bottom{display:flex;align-items:center;justify-content:space-between;gap:20px}.roof-viewer p{color:#fff;font-size:13px}.roof-viewer button{background:transparent;color:#fff;border:1px solid #ffffff60;padding:10px 16px;min-height:44px;flex-shrink:0}.roof-viewer button:hover{background:#ffffff20}.roof-viewer-image{width:100%;height:calc(90dvh - 150px);object-fit:contain;margin:15px 0}.roof-caption{text-align:center;max-width:700px}.roof-counter{font-variant-numeric:tabular-nums}html.roof-viewer-open{overflow:hidden}@media(max-width:900px){.roof-gallery-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.project-detail .roof-gallery-grid img{height:300px}.roof-gallery-heading{align-items:start;flex-direction:column;gap:12px}}@media(max-width:550px){.roof-gallery-grid{grid-template-columns:1fr}.project-detail .roof-gallery-grid img{height:auto;max-height:520px;object-fit:contain}.roof-collection{padding-top:35px}.roof-viewer{padding:12px}.roof-viewer-bottom{gap:8px}.roof-viewer p{font-size:11px}.roof-viewer button{padding:9px 12px}.project-detail .roof-cover img{height:440px;min-height:0}}@media(prefers-reduced-motion:reduce){.roof-photo img{transition:none}}
