.roof-layers-story{background:#f5f6f0;min-height:410svh;color:#263327;border-top:1px solid #d9dfd3;border-bottom:1px solid #d9dfd3}.roof-layers-stage{position:sticky;top:0;padding:24px 48px 18px;max-width:1560px;margin:auto;min-height:100svh;flex-direction:column}.roof-layers-eyebrow,.roof-layers-stage{display:flex;justify-content:space-between}.roof-layers-eyebrow{align-items:center;font-size:12px;border-bottom:1px solid #d6ddcf;padding-bottom:15px}.roof-layer-navigation button,.roof-layers-eyebrow button,.roof-layers-view button{font:inherit;background:transparent;border:1px solid #c4cdbb;border-radius:var(--radius-ui);padding:9px 12px;cursor:pointer}.roof-layers-heading{display:flex;align-items:center;justify-content:space-between;gap:35px;margin:24px 0 12px}.roof-layers-heading h2{font-size:clamp(34px,3.5vw,52px);font-weight:500;letter-spacing:-.05em;line-height:1.06;margin:0}.roof-layers-heading>p{font-size:15px;color:#63705d;line-height:1.6;width:29%;margin:0}.roof-layers-layout{display:grid;grid-template-columns:minmax(0,1.8fr) minmax(290px,.85fr);gap:35px;align-items:center;flex:1}.roof-layers-model{min-width:0;position:relative;background:#edf0e7;border-radius:var(--radius-ui);overflow:hidden}.layer-house-placeholder,.roof-layers-model .layer-house-canvas{height:clamp(400px,62svh,710px);width:100%;position:relative}.roof-layers-model canvas{width:100%;height:100%;display:block}.roof-layers-view{display:flex;justify-content:space-between;align-items:center;margin:-30px 24px 12px;position:relative;font-size:12px}.roof-layers-view>span{font-variant-numeric:tabular-nums;letter-spacing:.1em}.roof-layers-view>div{display:flex;gap:6px}.roof-layers-view button{font-size:11px;background:#edf0e7e8;min-height:34px}.roof-layers-view button:nth-child(-n+2){font-size:20px;padding:0 10px}.roof-layers-caption{font-size:10px;text-align:center;color:#6c7864;margin:0;padding:0 18px 16px}.roof-layers-copy{min-width:0;padding:12px 0}.roof-layer-choices{display:grid;gap:0;border-top:1px solid #ced6c5}.roof-layer-choices button{font:inherit;font-size:14px;border:0;border-bottom:1px solid #ced6c5;background:transparent;display:grid;grid-template-columns:27px 1fr 16px;align-items:center;gap:10px;text-align:left;padding:16px 12px;cursor:pointer;color:#46513f;transition:background .25s,color .25s}.roof-layer-choices button>span:first-child{font-size:10px;opacity:.65}.roof-layer-choices strong{font-weight:500}.roof-layer-choices button[aria-pressed=true]{background:#2e4433;color:white;border-bottom-color:#2e4433}.roof-layer-choices button:hover{background:#e0e7d8}.roof-layer-choices button[aria-pressed=true]:hover{background:#2e4433}.roof-layer-description{min-height:182px;padding:22px 0 12px}.roof-layer-description h3{font-size:22px;font-weight:500;letter-spacing:-.025em;margin:0 0 10px}.roof-layer-description>p:last-child{font-size:14px;line-height:1.6;color:#5a6853;margin:0;max-width:380px}.roof-layer-detail{font-size:10px;color:#79826f;letter-spacing:.035em;margin:0 0 12px}.roof-layer-navigation{display:flex;justify-content:space-between;align-items:center;font-size:11px;color:#697660;margin-bottom:22px}.roof-layer-navigation button{min-width:38px;font-size:16px;padding:5px 10px}.roof-layer-navigation button:disabled{opacity:.3;cursor:default}.roof-layers-copy>a{font-size:12px;text-underline-offset:5px}.roof-layers-foot{display:flex;justify-content:space-between;gap:20px;font-size:10px;color:#75806c;padding-top:18px}.roof-layers-foot button{background:none;border:0;border-bottom:1px solid;color:inherit;font:inherit;padding:0 0 4px;cursor:pointer}.roof-layers-story a:focus-visible,.roof-layers-story button:focus-visible{outline:2px solid #527247;outline-offset:4px}@media (min-width:900px) and (max-height:800px){.roof-layers-stage{padding:16px 40px 12px}.roof-layers-heading{margin:16px 0 8px}.roof-layers-heading h2{font-size:36px}.roof-layer-choices button{padding:10px;font-size:13px}.roof-layer-description{min-height:150px;padding-top:15px}.roof-layer-description>p:last-child{font-size:13px}.roof-layer-description h3{font-size:20px}.roof-layer-navigation{margin-bottom:14px}.layer-house-placeholder,.roof-layers-model .layer-house-canvas{height:460px}.roof-layers-layout{gap:25px}}@media (max-width:899px){.roof-layers-story{min-height:0}.roof-layers-stage{position:relative;min-height:0;padding:24px 20px}.roof-layers-heading{display:block;margin:24px 0}.roof-layers-heading h2{font-size:37px}.roof-layers-heading>p{font-size:14px;width:auto;margin-top:18px}.roof-layers-layout{display:flex;flex-direction:column;gap:15px}.roof-layers-model{width:100%}.layer-house-placeholder,.roof-layers-model .layer-house-canvas{height:430px}.roof-layers-view{margin:-28px 14px 14px}.roof-layers-copy{width:100%;padding:0}.roof-layer-choices{grid-template-columns:1fr 1fr;gap:6px;border:0}.roof-layer-choices button{border:1px solid #ced6c5;border-radius:var(--radius-ui);padding:12px 9px;grid-template-columns:18px 1fr;gap:5px;min-height:50px;font-size:12px}.roof-layer-choices button>span:last-child{display:none}.roof-layer-description{min-height:145px;padding:20px 0 12px}.roof-layers-foot{margin-top:14px;border-top:1px solid #ced6c5;line-height:1.5}.roof-layers-foot button,.roof-layers-scroll{display:none}.roof-layers-caption{font-size:9px}.roof-layer-navigation{margin-bottom:15px}}@media (prefers-reduced-motion:reduce){.roof-layers-story{min-height:0}.roof-layers-stage{position:relative}.roof-layers-scroll{display:none}.roof-layers-story *{transition:none!important}}.roof-layers-model .service-model-status{position:absolute;bottom:12px;left:20px;right:20px;margin:0;text-align:center;color:#52604e;font-size:12px}.roof-layers-story{border-radius:var(--radius-ui)}