.wdt-sc-roofing-wrapper .wdt-sc-roofing-form{display:grid;grid-template-columns:repeat(2,1fr);justify-items:start}.wdt-sc-roofing-wrapper .wdt-sc-roofing-form .wdt-sc-calc-container{padding:clamp(0.625rem, -0.625rem + 2.6042vw, 2.5rem);padding-left:0;padding-right:clamp(1.875rem, 1.0966rem + 4.2945vw, 6.25rem)}.wdt-sc-roofing-wrapper .wdt-sc-roofing-form .wdt-sc-calc-container{width:100%;max-width:100%;text-align:left;display:flex;flex-wrap:wrap;align-items:center;align-content:center}.wdt-sc-roofing-wrapper .wdt-sc-roofing-form .wdt-sc-calc-container>div{width:100%;max-width:100%;display:flex;flex-direction:column;align-items:flex-start}.wdt-sc-roofing-wrapper .wdt-sc-roofing-form .wdt-sc-calc-container>div:not(:last-child){margin-bottom:clamp(1.5625rem, 1.2845rem + 1.5337vw, 3.125rem)}.wdt-sc-roofing-wrapper .wdt-sc-roofing-form .wdt-sc-calc-container>div h3{font-family:var(--wdtFontTypo_Alt);font-size:clamp(1.25rem, 1.2055rem + 0.2454vw, 1.5rem);font-weight:var(--wdtFontWeight_Alt);line-height:var(--wdtLineHeight_Alt);text-transform:capitalize;color:var(--wdtHeadAltColor);margin:0;margin-bottom:clamp(0.875rem, 0.786rem + 0.4908vw, 1.375rem)}.wdt-sc-roofing-wrapper .wdt-sc-roofing-form .wdt-sc-calc-container>div .wdt-options-wrapper .wdt-option-item{display:flex;align-items:center;justify-content:flex-start}.wdt-sc-roofing-wrapper .wdt-sc-roofing-form .wdt-sc-calc-container>div .wdt-options-wrapper .wdt-option-item:not(:last-child){margin-bottom:clamp(0.875rem, 0.8083rem + 0.3681vw, 1.25rem)}.wdt-sc-roofing-wrapper .wdt-sc-roofing-form .wdt-sc-calc-container>div .wdt-options-wrapper .wdt-option-item input{cursor:pointer;-webkit-appearance:none;appearance:none;width:16px;height:16px;padding:0;border:3px solid var(--wdtBorderColor);-webkit-border-radius:var(--wdtRadius_Part);border-radius:var(--wdtRadius_Part);margin:0 10px 0 0}.wdt-sc-roofing-wrapper .wdt-sc-roofing-form .wdt-sc-calc-container>div .wdt-options-wrapper .wdt-option-item input:checked{border-color:var(--wdtPrimaryColor)}.wdt-sc-roofing-wrapper .wdt-sc-roofing-form .wdt-sc-calc-container>div .wdt-options-wrapper .wdt-option-item .wdt-option-label{font-family:var(--wdtFontTypo_Alt);font-size:clamp(1rem, 0.9778rem + 0.1227vw, 1.125rem);font-weight:var(--wdtFontWeight_Base);line-height:var(--wdtLineHeight_Alt);text-transform:capitalize;color:var(--wdtHeadAltColor)}.wdt-sc-roofing-wrapper .wdt-sc-roofing-form .wdt-sc-calc-container>div.roof-types{width:50%;max-width:50%;padding-right:20px}.wdt-sc-roofing-wrapper .wdt-sc-roofing-form .wdt-sc-calc-container>div.material-types{width:50%;max-width:50%}.wdt-sc-roofing-wrapper .wdt-sc-roofing-form .wdt-sc-calc-container>div.building-types .wdt-options-wrapper{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-start;margin:-8px -15px}.wdt-sc-roofing-wrapper .wdt-sc-roofing-form .wdt-sc-calc-container>div.building-types .wdt-options-wrapper .wdt-option-item{margin:8px 15px}.wdt-sc-roofing-wrapper .wdt-sc-roofing-form .wdt-sc-calc-container>div.building-types .wdt-options-wrapper .wdt-option-item:not(:last-child){margin-bottom:8px}.wdt-sc-roofing-wrapper .wdt-sc-roofing-form .wdt-roofing-range-progress .wdt-roofing-range-label-group{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-start;gap:10px;font-family:var(--wdtFontTypo_Alt);font-size:clamp(1.5rem, 1.4333rem + 0.3681vw, 1.875rem);font-weight:var(--wdtFontWeight_Alt);line-height:var(--wdtLineHeight_Alt);text-transform:capitalize;color:var(--wdtHeadAltColor);margin-bottom:25px}.wdt-sc-roofing-wrapper .wdt-sc-roofing-form .wdt-roofing-range-progress .wdt-roofing-range-label-group .selected-range-value #selected-value{margin-right:6px}.wdt-sc-roofing-wrapper .wdt-sc-roofing-form .wdt-roofing-range-progress input[type="range"]{cursor:e-resize;height:3px;padding:0;border:none!important;-webkit-border-radius:var(--wdtRadius_Zero);border-radius:var(--wdtRadius_Zero)}.wdt-sc-roofing-wrapper .wdt-sc-roofing-form .wdt-roofing-range-progress input[type="range"]::-webkit-slider-thumb{width:12px;height:12px;-webkit-appearance:none;appearance:none;background:var(--wdtPrimaryColor);-webkit-box-shadow:0 0 0 5px rgba(var(--wdtPrimaryColorRgb),.2);box-shadow:0 0 0 5px rgba(var(--wdtPrimaryColorRgb),.2);-webkit-border-radius:var(--wdtRadius_Full);border-radius:var(--wdtRadius_Full)}.wdt-sc-roofing-wrapper .wdt-sc-roofing-form .wdt-roofing-range-progress .range-values{width:100%;max-width:100%;display:flex;align-items:center;justify-content:space-between;gap:10px;font-family:var(--wdtFontTypo_Alt);font-size:var(--wdtFontSize_Base);font-weight:var(--wdtFontWeight_Alt);text-transform:capitalize;color:var(--wdtBodyTxtColor);margin-top:18px;margin-bottom:clamp(0.625rem, 0.536rem + 0.4908vw, 1.125rem)}.wdt-sc-roofing-wrapper .wdt-sc-roofing-form .wdt-sc-roofing-result{position:relative;overflow:hidden;width:100%;max-width:100%;backface-visibility:hidden;will-change:transform;background-image:url(https://proofer.wpengine.com/wp-content/uploads/2025/08/Section-Overlay-Image.jpg);background-position:center center;background-repeat:no-repeat;background-size:cover;-webkit-clip-path:polygon(85% 0,100% 15%,100% 100%,0 100%,0 0);clip-path:polygon(85% 0,100% 15%,100% 100%,0 100%,0 0);padding:clamp(1.5625rem, 1.2845rem + 1.5337vw, 3.125rem);display:flex;flex-direction:column;align-items:flex-start;justify-content:center;text-align:left}.wdt-sc-roofing-wrapper .wdt-sc-roofing-form .wdt-sc-roofing-result::before{content:'';pointer-events:none;position:absolute;width:100%;height:100%;top:0;right:0;bottom:0;left:0;background-color:var(--wdtPrimaryColor);opacity:.95;z-index:-1;margin:auto}.wdt-sc-roofing-wrapper .wdt-sc-roofing-form .wdt-sc-roofing-result>div{width:100%;max-width:100%}.wdt-sc-roofing-wrapper .wdt-sc-roofing-form .wdt-sc-roofing-result div,.wdt-sc-roofing-wrapper .wdt-sc-roofing-form .wdt-sc-roofing-result h2,.wdt-sc-roofing-wrapper .wdt-sc-roofing-form .wdt-sc-roofing-result span{color:var(--wdtAccentTxtColor)}.wdt-sc-roofing-wrapper .wdt-sc-roofing-form .wdt-sc-roofing-result>h2{font-family:var(--wdtFontTypo_Alt);font-size:clamp(1.5rem, 1.4333rem + 0.3681vw, 1.875rem);font-weight:var(--wdtFontWeight_Alt);line-height:var(--wdtLineHeight_Alt);text-transform:capitalize;margin:0;margin-bottom:clamp(0.875rem, 0.786rem + 0.4908vw, 1.375rem)}.wdt-sc-roofing-wrapper .wdt-sc-roofing-form .wdt-sc-roofing-result .total-cost-item{display:flex;flex-direction:column;align-items:flex-start}.wdt-sc-roofing-wrapper .wdt-sc-roofing-form .wdt-sc-roofing-result>div:not(:last-child){border-bottom:1px solid rgba(var(--wdtAccentTxtColorRgb),.5);padding-bottom:clamp(1.5625rem, 1.3957rem + 0.9202vw, 2.5rem);margin-bottom:clamp(1.5625rem, 1.3957rem + 0.9202vw, 2.5rem)}.wdt-sc-roofing-wrapper .wdt-sc-roofing-form .wdt-sc-roofing-result .total-cost-item .cost-label{font-family:var(--wdtFontTypo_Alt);font-size:clamp(1.25rem, 1.2055rem + 0.2454vw, 1.5rem);font-weight:var(--wdtFontWeight_Alt);line-height:var(--wdtLineHeight_Alt);text-transform:capitalize;margin-bottom:clamp(0.625rem, 0.5805rem + 0.2454vw, 0.875rem)}.wdt-sc-roofing-wrapper .wdt-sc-roofing-form .wdt-sc-roofing-result .total-cost-item #total-cost{font-family:var(--wdtFontTypo_Alt);font-size:clamp(2.1875rem, 1.7983rem + 2.1472vw, 4.375rem);font-weight:var(--wdtFontWeight_Alt);line-height:var(--wdtLineHeight_Alt);text-transform:capitalize;margin-bottom:clamp(0.3125rem, 0.2569rem + 0.3067vw, 0.625rem)}.wdt-sc-roofing-wrapper .wdt-sc-roofing-form .wdt-sc-roofing-result .cost-results div:not(:last-child){margin-bottom:clamp(0.875rem, 0.8083rem + 0.3681vw, 1.25rem)}.wdt-sc-roofing-wrapper .wdt-sc-roofing-form .wdt-sc-roofing-result .cost-results div.cost-item{width:100%;max-width:100%;display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:8px 40px}.wdt-sc-roofing-wrapper .wdt-sc-roofing-form .wdt-sc-roofing-result .cost-results div.cost-item .cost-label{font-family:var(--wdtFontTypo_Alt);font-size:clamp(1.25rem, 1.2055rem + 0.2454vw, 1.5rem);font-weight:var(--wdtFontWeight_Alt);line-height:var(--wdtLineHeight_Alt);text-transform:capitalize}.wdt-sc-roofing-wrapper .wdt-sc-roofing-form .wdt-sc-roofing-result .cost-results div.cost-item #labour-cost,.wdt-sc-roofing-wrapper .wdt-sc-roofing-form .wdt-sc-roofing-result .cost-results div.cost-item #material-cost{font-family:var(--wdtFontTypo_Alt);font-size:clamp(1.25rem, 1.2055rem + 0.2454vw, 1.5rem);font-weight:var(--wdtFontWeight_Alt);line-height:var(--wdtLineHeight_Alt);text-transform:capitalize}.wdt-sc-roofing-wrapper .wdt-sc-roofing-form .wdt-sc-roofing-result>div.wdt-roofing-btn-wrapper{width:100%;max-width:fit-content}.wdt-sc-roofing-wrapper .wdt-sc-roofing-form .wdt-sc-roofing-result>div.wdt-roofing-btn-wrapper a.wdt-roofing-calculate-btn{background-color:var(--wdtAccentTxtColor);color:var(--wdtHeadAltColor);margin:0}.wdt-sc-roofing-wrapper .wdt-sc-roofing-form .wdt-sc-roofing-result>div.wdt-roofing-btn-wrapper a.wdt-roofing-calculate-btn:hover{background-color:var(--wdtSecondaryColor)}.wdt-sc-roofing-wrapper .wdt-sc-roofing-form .wdt-sc-roofing-result>div.wdt-roofing-btn-wrapper a.wdt-roofing-calculate-btn .wdt-button-text{display:inline-flex;align-items:center;-webkit-transform:translateX(12px);transform:translateX(12px);transform-origin:center;backface-visibility:hidden;isolation:isolate;will-change:transform;-webkit-transition:var(--wdt-Livi-Transition);transition:var(--wdt-Livi-Transition);color:var(--wdtHeadAltColor)}.wdt-sc-roofing-wrapper .wdt-sc-roofing-form .wdt-sc-roofing-result>div.wdt-roofing-btn-wrapper a.wdt-roofing-calculate-btn:hover .wdt-button-text{-webkit-transform:translateX(0);transform:translateX(0);color:var(--wdtAccentTxtColor)}.wdt-sc-roofing-wrapper .wdt-sc-roofing-form .wdt-sc-roofing-result>div.wdt-roofing-btn-wrapper a.wdt-roofing-calculate-btn .wdt-button-text::after{content:'\e800';font-family:"common-right-arrow";font-size:calc(100% + 15%);-webkit-transform:translateX(4px);transform:translateX(4px);transform-origin:center;backface-visibility:hidden;isolation:isolate;will-change:transform;-webkit-transition:var(--wdt-Livi-Transition);transition:var(--wdt-Livi-Transition);opacity:0;margin-left:8px}.wdt-sc-roofing-wrapper .wdt-sc-roofing-form .wdt-sc-roofing-result>div.wdt-roofing-btn-wrapper a.wdt-roofing-calculate-btn:hover .wdt-button-text::after{-webkit-transform:translateX(0);transform:translateX(0);opacity:1}@media only screen and (max-width:767px){.wdt-sc-roofing-wrapper .wdt-sc-roofing-form{grid-template-columns:repeat(1,1fr)}.wdt-sc-roofing-wrapper .wdt-sc-roofing-form .wdt-sc-calc-container{padding:0;padding-left:0;padding-right:0;padding-bottom:40px}}@media only screen and (max-width:480px){.wdt-sc-roofing-wrapper .wdt-sc-roofing-form .wdt-sc-calc-container{padding-bottom:30px}}