.roofs-projects-hubdb{color:#10233f;overflow:hidden;width:100%}.roofs-projects-hubdb__heading{color:#10233f;font-family:Archivo Expanded,sans-serif;font-size:38px;font-weight:700;line-height:1.12;margin:0 0 34px;text-align:center}.roofs-projects-hubdb__filters{align-items:center;display:flex;flex-wrap:wrap;gap:8px 10px;justify-content:center;margin:0 auto 45px;max-width:920px}.roofs-projects-hubdb__filter{appearance:none;background:#8db8f4;border:0;border-radius:999px;color:#fff;cursor:pointer;font-family:Archivo Expanded,sans-serif;font-size:10px;font-weight:700;line-height:1;min-height:25px;padding:8px 18px;text-transform:uppercase;transition:background-color .16s ease,color .16s ease}.roofs-projects-hubdb__filter.is-active,.roofs-projects-hubdb__filter:focus,.roofs-projects-hubdb__filter:focus-visible,.roofs-projects-hubdb__filter:hover{background:#10233f;color:#fff;outline:0}.roofs-projects-hubdb__slider{isolation:isolate;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);min-height:460px;overflow:hidden;padding:0 0 2px;position:relative;width:100vw;--project-nav-size:79px}.roofs-projects-hubdb__slider:after,.roofs-projects-hubdb__slider:before{bottom:0;content:"";pointer-events:none;position:absolute;top:0;width:min(305px,24vw);z-index:3}.roofs-projects-hubdb__slider:before{background:linear-gradient(270deg,hsla(0,0%,100%,0),#fff 89.42%);left:max(0px,calc(50vw - 850px))}.roofs-projects-hubdb__slider:after{background:linear-gradient(90deg,hsla(0,0%,100%,0),#fff 89.42%);right:max(0px,calc(50vw - 850px))}.roofs-projects-hubdb__swiper{margin:0 auto;overflow:visible;position:relative;width:min(100vw,1700px)}.roofs-projects-hubdb__swiper .swiper-wrapper{position:relative;z-index:1}.roofs-projects-hubdb__slide.is-filtered-out,.roofs-projects-hubdb__slide[hidden]{display:none!important}.roofs-projects-hubdb__card{align-items:flex-end;appearance:none;background:#e9f1fb;background-repeat:no-repeat;border:0;border-radius:4px;color:#fff;cursor:pointer;display:flex;height:460px;justify-content:space-between;margin:0;overflow:hidden;padding:0 30px 28px;position:relative;text-align:left;width:100%}.roofs-projects-hubdb .roofs-projects-hubdb__card:after{background:linear-gradient(180deg,rgba(18,112,209,0) 44%,rgba(18,112,209,.36) 62%,rgba(15,59,125,.92) 88%)!important;content:""!important;display:block!important;inset:0!important;opacity:1!important;pointer-events:none!important;position:absolute!important;z-index:1!important}.roofs-projects-hubdb__image{display:block;height:100%;inset:0;object-fit:cover;object-position:center;position:absolute;width:100%;z-index:0}.roofs-projects-hubdb__card-copy{display:grid;gap:2px;min-width:0;position:relative;z-index:2}.roofs-projects-hubdb__card-material,.roofs-projects-hubdb__card-title{color:#fff;display:block;font-family:Archivo Expanded,sans-serif;line-height:1.05;margin:0}.roofs-projects-hubdb__card-title{font-size:22px;font-weight:700}.roofs-projects-hubdb__card-material{font-size:20px;font-weight:500}.roofs-projects-hubdb__card-icon{background:#f15a29;border-radius:999px;flex:0 0 34px;height:34px;margin-left:16px;position:relative;width:34px;z-index:2}.roofs-projects-hubdb__card-icon,.roofs-projects-hubdb__nav{align-items:center;display:inline-flex;justify-content:center}.roofs-projects-hubdb__nav{appearance:none;background:#10233f;background-color:#10233f;border:0;border-radius:999px;color:#fff;cursor:pointer;height:79px;margin:0;padding:0;position:absolute!important;top:50%!important;transform:translateY(-50%)!important;width:79px;z-index:20!important}.roofs-projects-hubdb .roofs-projects-hubdb__slider .roofs-projects-hubdb__nav.swiper-button-next,.roofs-projects-hubdb .roofs-projects-hubdb__slider .roofs-projects-hubdb__nav.swiper-button-prev{align-items:center!important;background:#10233f!important;border:0!important;border-radius:999px!important;color:#fff!important;display:inline-flex!important;height:var(--project-nav-size)!important;justify-content:center!important;margin:0!important;opacity:1!important;padding:0!important;top:50%!important;transform:translateY(-50%)!important;width:var(--project-nav-size)!important;z-index:20!important}.roofs-projects-hubdb__nav svg{display:block;height:31px;width:35px}.roofs-projects-hubdb .roofs-projects-hubdb__nav svg{color:#fff!important;display:block!important;height:31px!important;width:35px!important}.roofs-projects-hubdb .roofs-projects-hubdb__nav svg path{fill:currentColor!important}.roofs-projects-hubdb__nav:after,.roofs-projects-hubdb__nav:before{display:none}.roofs-projects-hubdb__nav:focus,.roofs-projects-hubdb__nav:focus-visible,.roofs-projects-hubdb__nav:hover{background:#10233f;background-color:#10233f;color:#fff;outline:0}.roofs-projects-hubdb__nav--prev{left:max(24px,calc(50vw - 818px))}.roofs-projects-hubdb__nav--next{right:max(24px,calc(50vw - 818px))}.roofs-projects-hubdb .roofs-projects-hubdb__slider .roofs-projects-hubdb__nav--prev.swiper-button-prev{left:max(24px,calc(50vw - 818px))!important;right:auto!important}.roofs-projects-hubdb .roofs-projects-hubdb__slider .roofs-projects-hubdb__nav--next.swiper-button-next{left:auto!important;right:max(24px,calc(50vw - 818px))!important}.roofs-projects-hubdb__nav.swiper-button-disabled{background:#10233f!important;background-color:#10233f!important;opacity:1!important;pointer-events:auto}.roofs-projects-hubdb__nav.swiper-button-lock{display:inline-flex!important}.roofs-projects-hubdb__modal{align-items:center;display:none;inset:0;justify-content:center;padding:42px 24px;position:fixed;z-index:9999}.roofs-projects-hubdb__modal.is-open{display:flex}.roofs-projects-hubdb__modal-backdrop{background:rgba(5,28,54,.9);inset:0;position:absolute}.roofs-projects-hubdb__modal-dialog{color:#fff;max-height:calc(100vh - 84px);max-width:1012px;overflow:auto;position:relative;width:min(100%,1012px);z-index:1}.roofs-projects-hubdb__close{align-items:center;background:#f15a29;border:0;border-radius:999px;color:#fff;cursor:pointer;display:inline-flex;flex:0 0 51px;height:51px;justify-content:center;line-height:1;padding:0;width:51px}.roofs-projects-hubdb__popup-header{align-items:baseline;display:flex;gap:24px;justify-content:space-between;margin:18px 0 24px}.roofs-projects-hubdb__popup-heading{align-items:baseline;display:flex;gap:18px;min-width:0}.roofs-projects-hubdb__popup-material,.roofs-projects-hubdb__popup-title{color:inherit;margin:0}.roofs-projects-hubdb__popup-title{font-size:34px;font-weight:600;line-height:1.1}.roofs-projects-hubdb__popup-material{font-size:30px;line-height:1.1}.roofs-projects-hubdb__compare{background:#e9f1fb;border-radius:12px;min-height:330px;overflow:hidden;position:relative}.roofs-projects-hubdb__compare-img{display:block;height:min(58vh,548px);object-fit:cover;width:100%}.roofs-projects-hubdb__compare-after{clip-path:inset(0 calc(100% - var(--after-width)) 0 0);inset:0;position:absolute}.roofs-projects-hubdb__compare-line{background:hsla(0,0%,100%,.9);bottom:0;left:var(--after-width);position:absolute;top:0;transform:translateX(-50%);width:3px}.roofs-projects-hubdb__compare-handle{align-items:center;background:#fff;border-radius:999px;color:#10233f;display:inline-flex;font-size:28px;font-weight:700;height:52px;justify-content:center;left:50%;line-height:1;position:absolute;top:50%;transform:translate(-50%,-50%);width:52px}.roofs-projects-hubdb__compare-range{cursor:ew-resize;inset:0;opacity:0;position:absolute;width:100%}.roofs-projects-hubdb__popup-body{display:grid;gap:50px;grid-template-columns:minmax(0,1.7fr) minmax(240px,1fr);margin-top:36px}.roofs-projects-hubdb__popup-body *{color:#fff}.roofs-projects-hubdb__description,.roofs-projects-hubdb__highlights{color:#fff;font-size:20px;line-height:1.5}.roofs-projects-hubdb__highlights{border-left:1px solid hsla(0,0%,100%,.95);padding-left:48px}.roofs-projects-hubdb__empty{margin:0;text-align:center}body.roofs-projects-hubdb-modal-open{overflow:hidden}@media (max-width:991px){.roofs-projects-hubdb__heading{font-size:32px}.roofs-projects-hubdb__slider:after,.roofs-projects-hubdb__slider:before{width:96px}.roofs-projects-hubdb__popup-header,.roofs-projects-hubdb__popup-heading{align-items:flex-start}.roofs-projects-hubdb__popup-heading{flex-direction:column;gap:6px}.roofs-projects-hubdb__popup-material,.roofs-projects-hubdb__popup-title{font-size:28px}.roofs-projects-hubdb__popup-body{gap:28px;grid-template-columns:1fr}.roofs-projects-hubdb__highlights{border-left:0;border-top:1px solid hsla(0,0%,100%,.95);padding-left:0;padding-top:24px}}@media (max-width:767px){.roofs-projects-hubdb__heading{font-size:26px;margin-bottom:24px}.roofs-projects-hubdb__filters{gap:7px;margin-bottom:30px}.roofs-projects-hubdb__filter{font-size:9px;min-height:23px;padding:7px 12px}.roofs-projects-hubdb__slider:after,.roofs-projects-hubdb__slider:before{width:58px}.roofs-projects-hubdb__card{height:340px;padding:0 22px 22px}.roofs-projects-hubdb__card-title{font-size:18px}.roofs-projects-hubdb__card-material{font-size:16px}.roofs-projects-hubdb__card-icon{flex-basis:32px;height:32px;width:32px}.roofs-projects-hubdb__nav{height:38px;width:38px}.roofs-projects-hubdb__slider{min-height:340px;--project-nav-size:38px}.roofs-projects-hubdb .roofs-projects-hubdb__slider .roofs-projects-hubdb__nav.swiper-button-next,.roofs-projects-hubdb .roofs-projects-hubdb__slider .roofs-projects-hubdb__nav.swiper-button-prev{height:var(--project-nav-size)!important;width:var(--project-nav-size)!important}.roofs-projects-hubdb__nav--prev{left:48px}.roofs-projects-hubdb__nav--next{right:48px}.roofs-projects-hubdb .roofs-projects-hubdb__slider .roofs-projects-hubdb__nav--prev.swiper-button-prev{left:48px!important;right:auto!important}.roofs-projects-hubdb .roofs-projects-hubdb__slider .roofs-projects-hubdb__nav--next.swiper-button-next{left:auto!important;right:48px!important}.roofs-projects-hubdb .roofs-projects-hubdb__nav svg{height:16px!important;width:20px!important}.roofs-projects-hubdb__modal{align-items:flex-start;padding:24px 16px}.roofs-projects-hubdb__modal-dialog{max-height:calc(100vh - 48px)}.roofs-projects-hubdb__close{flex-basis:40px;height:40px;width:40px}.roofs-projects-hubdb__popup-material,.roofs-projects-hubdb__popup-title{font-size:24px}.roofs-projects-hubdb__compare{min-height:240px}.roofs-projects-hubdb__compare-img{height:360px}.roofs-projects-hubdb__description,.roofs-projects-hubdb__highlights{font-size:17px}}