.roof-page .local-layout-stage {grid-template-columns:repeat(2,minmax(0,1fr));}
.roof-page .local-layout-stage>.roof-viewer {grid-column:1;}
.roof-page .local-layout-aside {grid-column:2;}
.roof-page #roof-principle>.roof-viewer .local-canvas-wrap {height:520px;}
.roof-view-explanation {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;padding:28px 0;border-top:1px solid #d9e2e9;}
.roof-view-explanation h3 {font-size:28px;line-height:1.15;margin:0;}
.roof-view-explanation p {font-size:14px;line-height:1.7;color:#586b7a;margin:0;}
.roof-foundation-note {border-top:1px solid #c9d4de;margin-top:30px;padding-top:24px;}
.roof-foundation-note h4 {font-size:17px;font-weight:400;margin:0 0 14px;}
.roof-page .local-layout-aside .plain-link {line-height:1.6;}
.roof-principle-cards {margin-top:48px;}
.roof-page .local-hero-grid>.roof-viewer {align-self:center;}
.roof-page #roof-documents .button,.roof-page #roof-cost .button {margin-top:38px;}
.roof-page .roof-viewer[data-ready=fallback] .roof-layer-controls,.roof-page .roof-viewer[data-ready=fallback] .roof-principle-controls {display:none;}
@media(min-width:1600px){.roof-page #roof-principle>.roof-viewer .local-canvas-wrap{height:620px;}}
@media(max-width:1100px){.roof-page .local-hero h1{font-size:clamp(64px,8.5vw,92px);}.roof-page .local-hero h2{font-size:clamp(26px,2.8vw,34px);}}
@media(max-width:760px){.roof-page #roof-principle>.roof-viewer .local-canvas-wrap{height:390px;}.roof-principle-controls{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;}.roof-view-explanation{grid-template-columns:1fr;gap:18px;}.roof-view-explanation h3{font-size:25px;}.roof-view-explanation p{font-size:14px;}.roof-page .local-hero h1{font-size:74px;}.roof-page .local-hero h2{font-size:30px;}}
@media(max-width:600px){.roof-page .local-hero h1{font-size:62px;}.roof-page .local-hero h2{font-size:26px;}.roof-application-switch{gap:6px;}.roof-application-switch button{font-size:11px;padding:10px 4px;}.roof-page .roof-support-controls{gap:12px;}.roof-layer-controls{grid-template-columns:repeat(2,minmax(0,1fr));}.roof-principle-controls{gap:12px;}.roof-principle-controls button{font-size:12px;padding:14px 10px;}.roof-page #roof-principle>.roof-viewer .local-canvas-wrap{height:340px;}}

.roof-page .local-model-key>span[hidden] {display:none;}

/* Shared studio lighting and scale with the detailed Local model. */
.roof-page .local-model-key>span:first-child i {background:#0030cf;}
.roof-page .local-canvas-wrap {height:clamp(460px,61svh,620px);background:#f3f5f6;}
@media(max-width:1100px) and (min-width:761px){.roof-page .local-canvas-wrap{height:440px;}}
@media(max-width:760px){.roof-page .local-canvas-wrap,.roof-page .local-hero .local-canvas-wrap{height:clamp(330px,48svh,440px);}}