.roof-planning-scroll-story_track__aXMT9{--header-offset:57px;position:relative;height:510svh;scroll-margin-top:var(--header-offset)}.roof-planning-scroll-story_stage__2rDgK{--backdrop:246 248 252;--ink:4 26 77;--muted:86 101 123;--accent:22 83 233;position:sticky;top:var(--header-offset);height:calc(100svh - var(--header-offset));display:flex;flex-direction:column;isolation:isolate;overflow:clip;background:rgb(var(--backdrop));color:rgb(var(--ink))}.roof-planning-scroll-story_halo__nOW9y{position:absolute;inset:8% -30% -20% 0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 60% 65%,rgb(22 83 233/.2),transparent 58%);transform:translate3d(0,var(--halo-y,0),0);opacity:var(--halo-opacity,1)}.roof-planning-scroll-story_topline__s4Ywg{display:flex;align-items:center;justify-content:space-between;width:min(1360px,100%);margin-inline:auto;padding:7px 20px 0;font-size:10px;font-weight:600;color:rgb(var(--muted))}.roof-planning-scroll-story_topline__s4Ywg a,.roof-planning-scroll-story_topline__s4Ywg>span{display:flex;align-items:center;gap:7px}.roof-planning-scroll-story_topline__s4Ywg a{min-height:44px}.roof-planning-scroll-story_topline__s4Ywg i{width:6px;height:6px;background:rgb(var(--accent));border-radius:50%}.roof-planning-scroll-story_composition__n2VYG{display:flex;flex:1;min-height:0;flex-direction:column;justify-content:center;gap:22px;padding:8px 20px 12px}.roof-planning-scroll-story_copy__HpK4R{width:100%;max-width:600px;margin-inline:auto}.roof-planning-scroll-story_eyebrow__u1BnH{font-size:10px;font-weight:650;text-transform:uppercase;letter-spacing:.1em;color:rgb(var(--muted))}.roof-planning-scroll-story_eyebrow__u1BnH>span{color:rgb(var(--accent));margin-right:5px}.roof-planning-scroll-story_copy__HpK4R h2{margin-top:11px;min-height:3.27em;font-size:clamp(29px,8.5vw,36px);font-weight:700;line-height:1.09;letter-spacing:-.045em;text-wrap:balance}.roof-planning-scroll-story_copy__HpK4R h2>span{color:rgb(var(--accent))}.roof-planning-scroll-story_description__iwCdu{margin-top:11px;min-height:4.65em;max-width:450px;font-size:13px;line-height:1.55;color:rgb(var(--muted));text-wrap:pretty}.roof-planning-scroll-story_desktopHint__YAtnb{display:none}.roof-planning-scroll-story_product__avkQr{width:100%;max-width:600px;margin-inline:auto;perspective:1200px}.roof-planning-scroll-story_surface__c9IEA{position:relative;border:1px solid #dce3ef;border-radius:15px;background:white;color:#041a4d;overflow:hidden;transform:rotateX(var(--tilt,0deg));box-shadow:0 24px 70px -25px rgb(0 10 35/.35)}.roof-planning-scroll-story_toolbar__CrNzD{display:flex;align-items:center;gap:9px;padding-inline:12px;height:48px}.roof-planning-scroll-story_appIcon__BXMAH{display:grid;place-items:center;width:29px;height:29px;border-radius:8px;color:#1653e9;background:#eef3ff}.roof-planning-scroll-story_toolbar__CrNzD>div{display:flex;flex-direction:column;gap:2px}.roof-planning-scroll-story_toolbar__CrNzD strong{font-size:11px;font-weight:700}.roof-planning-scroll-story_toolbar__CrNzD>div>span{font-size:8px;color:#63738c}.roof-planning-scroll-story_status__3xb83{margin-left:auto;padding:5px 8px;border-radius:99px;background:#eef3ff;color:#1653e9;font-size:8px;font-weight:600}.roof-planning-scroll-story_photoViewport__hmL_4{position:relative;aspect-ratio:3/2;overflow:hidden;background:#384638}.roof-planning-scroll-story_photoPlane__EZEbU{position:absolute;inset:0;transform:scale(var(--photo-scale,1))}.roof-planning-scroll-story_photo__3cduJ{object-fit:cover}.roof-planning-scroll-story_overlay__gN8hA{position:absolute;inset:0;width:100%;height:100%}.roof-planning-scroll-story_module__wDdrH{opacity:0;filter:drop-shadow(1px 4px 2px rgb(0 0 0/.55))}.roof-planning-scroll-story_guides__nP0Ay{opacity:var(--guides,0)}.roof-planning-scroll-story_referenceArea__kaXYI{opacity:var(--reference-guides,0)}.roof-planning-scroll-story_referenceLine__VM8c1{stroke:#83efb6;stroke-width:3;stroke-dasharray:1;stroke-dashoffset:calc(1 - var(--reference, 0));fill:rgb(30 110 66/.1);fill-opacity:var(--reference,0)}.roof-planning-scroll-story_tileGrid__Cdb0z{stroke:#83efb6;stroke-width:1;opacity:calc(var(--reference, 0) * .85)}.roof-planning-scroll-story_measureLabel__deA_0{opacity:var(--reference,0);font-size:20px;font-weight:600}.roof-planning-scroll-story_roofOutline__RszQ9{stroke:#719aff;stroke-width:4;stroke-dasharray:1;stroke-dashoffset:calc(1 - var(--outline, 0));fill:rgb(22 83 233/.09);fill-opacity:var(--outline,0)}.roof-planning-scroll-story_referencePoint__TMuN5{opacity:var(--outline,0)}.roof-planning-scroll-story_viewfinder__30gkj{position:absolute;inset:12%;opacity:var(--viewfinder,1);transform:scale(calc(1.08 - var(--capture, 0) * .08));color:white;pointer-events:none}.roof-planning-scroll-story_viewfinder__30gkj i{position:absolute;width:28px;height:28px;border:2px solid white;filter:drop-shadow(0 1px 3px #0008)}.roof-planning-scroll-story_viewfinder__30gkj i:first-child{top:0;left:0;border-right:0;border-bottom:0;border-radius:8px 0 0}.roof-planning-scroll-story_viewfinder__30gkj i:nth-child(2){top:0;right:0;border-left:0;border-bottom:0;border-radius:0 8px 0 0}.roof-planning-scroll-story_viewfinder__30gkj i:nth-child(3){bottom:0;left:0;border-right:0;border-top:0;border-radius:0 0 0 8px}.roof-planning-scroll-story_viewfinder__30gkj i:nth-child(4){bottom:0;right:0;border-left:0;border-top:0;border-radius:0 0 8px}.roof-planning-scroll-story_viewfinder__30gkj>span{bottom:10px;transform:translateX(-50%);padding:7px 11px;background:#071527d9}.roof-planning-scroll-story_resultBadge__FPfM5,.roof-planning-scroll-story_viewfinder__30gkj>span{position:absolute;left:50%;display:flex;align-items:center;gap:7px;border-radius:99px;font-size:10px;white-space:nowrap}.roof-planning-scroll-story_resultBadge__FPfM5{bottom:11px;transform:translate3d(-50%,calc((1 - var(--result, 0)) * 16px),0);opacity:var(--result,0);padding:8px 12px;background:white;color:#1653e9;box-shadow:0 3px 16px #0003;font-weight:650}.roof-planning-scroll-story_surfaceFooter__MHs08{display:flex;justify-content:space-between;align-items:center;gap:5px;height:29px;padding-inline:12px;font-size:8px;color:#526580}.roof-planning-scroll-story_surfaceFooter__MHs08>span:first-child{display:inline-flex;align-items:center;gap:5px}.roof-planning-scroll-story_accessory__ti18O{position:relative;display:flex;align-items:center;gap:11px;height:80px;max-width:570px;padding:10px 2px;margin:5px auto 0;border-bottom:1px solid rgb(var(--muted)/.18)}.roof-planning-scroll-story_accessoryIcon___kRZE{display:grid;place-items:center;width:34px;height:34px;flex-shrink:0;color:rgb(var(--accent))}.roof-planning-scroll-story_accessoryText__KQKYO strong{display:block;font-size:11px;font-weight:650}.roof-planning-scroll-story_accessoryText__KQKYO p{margin-top:5px;color:rgb(var(--muted));font-size:9px;line-height:1.5}.roof-planning-scroll-story_accessoryCheck___Tl68,.roof-planning-scroll-story_moduleCounter__P_OFf{margin-left:auto;color:rgb(var(--accent));flex-shrink:0}.roof-planning-scroll-story_moduleCounter__P_OFf{font-size:20px;font-weight:650;font-variant-numeric:tabular-nums}.roof-planning-scroll-story_moduleCounter__P_OFf small{font-size:10px;font-weight:500;color:rgb(var(--muted))}.roof-planning-scroll-story_placementProgress__ziYO5{position:absolute;height:2px;bottom:-1px;left:0;width:100%;background:rgb(var(--accent));transform:scaleX(var(--placed,0));transform-origin:left}.roof-planning-scroll-story_sample__D4PPh{margin-top:10px;text-align:center;color:rgb(var(--muted));font-size:8px}.roof-planning-scroll-story_controls__LI7ZA{display:flex;align-items:center;width:-moz-fit-content;width:fit-content;max-width:calc(100% - 32px);padding:4px;gap:3px;margin:auto auto 15px;border:1px solid var(--story-nav-border);border-radius:99px;background:var(--story-nav-background)}.roof-planning-scroll-story_controls__LI7ZA button{display:inline-flex;justify-content:center;align-items:center;gap:8px;min-width:44px;height:44px;border-radius:99px;color:var(--story-nav-text);font-size:11px;font-variant-numeric:tabular-nums}.roof-planning-scroll-story_controls__LI7ZA button[aria-current=step]{background:var(--story-nav-active);color:var(--story-nav-active-text);font-weight:650}.roof-planning-scroll-story_chapterLabel__auZnx{display:none}.roof-planning-scroll-story_scrollLabel__NrJRX{display:flex;align-items:center;gap:5px;padding:0 8px;font-size:9px;color:rgb(var(--muted))}.roof-planning-scroll-story_progressLine__eviC5{position:absolute;bottom:0;left:0;width:100%;height:2px;background:rgb(var(--accent));transform:scaleX(var(--progress,0));transform-origin:left}.roof-planning-scroll-story_stage__2rDgK a:focus-visible,.roof-planning-scroll-story_stage__2rDgK button:focus-visible{outline:2px solid rgb(var(--accent));outline-offset:3px}.roof-planning-scroll-story_accessibleStory__nknSC{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}@media (min-width:640px){.roof-planning-scroll-story_topline__s4Ywg{padding-inline:35px;font-size:11px}.roof-planning-scroll-story_composition__n2VYG{padding-inline:40px;gap:24px}.roof-planning-scroll-story_copy__HpK4R h2{font-size:42px;min-height:2.18em}.roof-planning-scroll-story_description__iwCdu{font-size:14px;min-height:3.1em}.roof-planning-scroll-story_toolbar__CrNzD{height:53px;padding-inline:16px}.roof-planning-scroll-story_toolbar__CrNzD strong{font-size:13px}.roof-planning-scroll-story_status__3xb83,.roof-planning-scroll-story_toolbar__CrNzD>div>span{font-size:10px}.roof-planning-scroll-story_surfaceFooter__MHs08{height:33px;font-size:10px;padding-inline:16px}.roof-planning-scroll-story_accessory__ti18O{height:85px}.roof-planning-scroll-story_accessoryText__KQKYO strong{font-size:13px}.roof-planning-scroll-story_accessoryText__KQKYO p{font-size:11px}.roof-planning-scroll-story_sample__D4PPh{font-size:9px}.roof-planning-scroll-story_resultBadge__FPfM5{font-size:12px;padding:9px 15px}.roof-planning-scroll-story_controls__LI7ZA{gap:6px}.roof-planning-scroll-story_controls__LI7ZA button{padding-inline:14px}.roof-planning-scroll-story_chapterLabel__auZnx{display:inline;font-size:10px}.roof-planning-scroll-story_scrollLabel__NrJRX{display:none}}@media (min-width:1024px){.roof-planning-scroll-story_composition__n2VYG{width:min(1360px,100%);margin-inline:auto;flex-direction:row;align-items:center;gap:50px;padding:24px 40px}.roof-planning-scroll-story_copy__HpK4R{flex:.78;max-width:435px}.roof-planning-scroll-story_copy__HpK4R h2{margin-top:20px;min-height:3.24em;font-size:clamp(40px,4vw,58px);line-height:1.08}.roof-planning-scroll-story_eyebrow__u1BnH{font-size:11px}.roof-planning-scroll-story_description__iwCdu{margin-top:25px;min-height:6.8em;font-size:16px;line-height:1.7}.roof-planning-scroll-story_desktopHint__YAtnb{display:flex;align-items:center;gap:8px;margin-top:25px;color:rgb(var(--muted));font-size:11px}.roof-planning-scroll-story_product__avkQr{flex:1.35;max-width:min(760px,calc((100svh - 430px) * 1.5))}.roof-planning-scroll-story_surface__c9IEA{border-radius:19px}.roof-planning-scroll-story_toolbar__CrNzD{height:60px}.roof-planning-scroll-story_accessory__ti18O{height:91px;margin-top:10px}.roof-planning-scroll-story_accessoryText__KQKYO strong{font-size:14px}.roof-planning-scroll-story_controls__LI7ZA{margin-bottom:22px}.roof-planning-scroll-story_controls__LI7ZA button{padding-inline:19px}.roof-planning-scroll-story_chapterLabel__auZnx{font-size:11px}}@media (max-width:639px) and (max-height:740px){.roof-planning-scroll-story_topline__s4Ywg{position:absolute;right:0;top:0;width:auto;padding-top:0}.roof-planning-scroll-story_topline__s4Ywg>span{display:none}.roof-planning-scroll-story_composition__n2VYG{padding-top:12px;padding-bottom:8px;gap:8px}.roof-planning-scroll-story_copy__HpK4R h2{margin-top:8px;font-size:27px;min-height:3.27em}.roof-planning-scroll-story_description__iwCdu{margin-top:7px;font-size:12px;min-height:4.65em}.roof-planning-scroll-story_toolbar__CrNzD{height:39px}.roof-planning-scroll-story_surfaceFooter__MHs08{height:26px}.roof-planning-scroll-story_accessory__ti18O{height:53px;margin-top:2px;gap:8px}.roof-planning-scroll-story_accessoryText__KQKYO strong{font-size:10px}.roof-planning-scroll-story_accessoryText__KQKYO p{font-size:8px;margin-top:3px}.roof-planning-scroll-story_sample__D4PPh{margin-top:5px;font-size:7px}.roof-planning-scroll-story_controls__LI7ZA{margin-bottom:8px}}@media (min-width:640px) and (max-width:1023px) and (max-height:850px){.roof-planning-scroll-story_composition__n2VYG{gap:10px;padding-block:5px}.roof-planning-scroll-story_copy__HpK4R,.roof-planning-scroll-story_product__avkQr{max-width:450px}.roof-planning-scroll-story_product__avkQr{max-width:min(450px,calc((100svh - 486px) * 1.5))}.roof-planning-scroll-story_copy__HpK4R h2{font-size:30px;margin-top:6px}.roof-planning-scroll-story_description__iwCdu{margin-top:8px;font-size:12px}.roof-planning-scroll-story_toolbar__CrNzD{height:42px}.roof-planning-scroll-story_surfaceFooter__MHs08{height:27px;font-size:9px}.roof-planning-scroll-story_accessory__ti18O{height:61px;margin-top:2px}.roof-planning-scroll-story_accessoryText__KQKYO strong{font-size:11px}.roof-planning-scroll-story_accessoryText__KQKYO p{font-size:9px;margin-top:3px}.roof-planning-scroll-story_sample__D4PPh{margin-top:7px;font-size:8px}.roof-planning-scroll-story_controls__LI7ZA{margin-bottom:10px}}@media (max-width:639px) and (max-height:660px){.roof-planning-scroll-story_product__avkQr{max-width:min(100%,calc((100svh - 435px) * 1.5))}}@media (min-width:1024px) and (max-height:780px){.roof-planning-scroll-story_product__avkQr{max-width:min(620px,calc((100svh - 355px) * 1.5))}.roof-planning-scroll-story_composition__n2VYG{padding-block:12px;gap:30px}.roof-planning-scroll-story_copy__HpK4R h2{font-size:42px}.roof-planning-scroll-story_description__iwCdu{font-size:14px;margin-top:16px}.roof-planning-scroll-story_toolbar__CrNzD{height:46px}.roof-planning-scroll-story_accessory__ti18O{height:68px;margin-top:5px}}.roof-planning-scroll-story_track__aXMT9:not([data-enhanced=true]),.roof-planning-scroll-story_track__aXMT9[data-static=true]{height:auto}.roof-planning-scroll-story_track__aXMT9:not([data-enhanced=true]) .roof-planning-scroll-story_stage__2rDgK,.roof-planning-scroll-story_track__aXMT9[data-static=true] .roof-planning-scroll-story_stage__2rDgK{position:relative;top:auto;height:auto}.roof-planning-scroll-story_track__aXMT9:not([data-enhanced=true]) .roof-planning-scroll-story_composition__n2VYG,.roof-planning-scroll-story_track__aXMT9[data-static=true] .roof-planning-scroll-story_composition__n2VYG{padding-block:30px}.roof-planning-scroll-story_track__aXMT9:not([data-enhanced=true]) .roof-planning-scroll-story_product__avkQr,.roof-planning-scroll-story_track__aXMT9[data-static=true] .roof-planning-scroll-story_product__avkQr{max-width:600px}.roof-planning-scroll-story_track__aXMT9[data-static=true] .roof-planning-scroll-story_topline__s4Ywg{order:-2;position:relative;width:100%;padding:7px 20px 0}.roof-planning-scroll-story_track__aXMT9[data-static=true] .roof-planning-scroll-story_topline__s4Ywg>span{display:inline-flex}.roof-planning-scroll-story_track__aXMT9[data-static=true] .roof-planning-scroll-story_controls__LI7ZA{order:-1;margin:10px auto 0}.roof-planning-scroll-story_track__aXMT9:not([data-enhanced=true]) .roof-planning-scroll-story_controls__LI7ZA{display:none}.roof-planning-scroll-story_track__aXMT9:not([data-enhanced=true]) .roof-planning-scroll-story_accessibleStory__nknSC{position:static;width:auto;height:auto;margin:0;padding:24px;overflow:visible;clip:auto;white-space:normal}.roof-planning-scroll-story_accessibleStory__nknSC h3{font-weight:650;margin-top:20px}.roof-planning-scroll-story_accessibleStory__nknSC p{margin-top:8px}@media (max-height:560px),(prefers-reduced-motion:reduce){.roof-planning-scroll-story_track__aXMT9{height:auto}.roof-planning-scroll-story_stage__2rDgK{position:relative;top:auto;height:auto}.roof-planning-scroll-story_halo__nOW9y,.roof-planning-scroll-story_photoPlane__EZEbU,.roof-planning-scroll-story_surface__c9IEA{transform:none}}@media print{.roof-planning-scroll-story_track__aXMT9{height:auto}.roof-planning-scroll-story_stage__2rDgK{display:none}.roof-planning-scroll-story_accessibleStory__nknSC{position:static;width:auto;height:auto;margin:0;padding:30px;overflow:visible;clip:auto;white-space:normal}}