.haven-pdp-before-after{color:rgb(var(--color-foreground))}.haven-pdp-before-after__head{text-align:center;margin-bottom:3rem}.haven-pdp-before-after__heading{margin:0;font-family:var(--font-heading-family);font-weight:var(--font-heading-weight);font-size:4.8rem;line-height:1;color:rgb(var(--haven-brand))}.haven-pdp-before-after__heading em{font-style:normal;color:rgb(var(--color-highlight))}.haven-pdp-before-after__subheading{margin-top:1rem;font-size:1.6rem;line-height:1.5}.haven-pdp-before-after__subheading p{margin:0}@media screen and (max-width:1399px){.haven-pdp-before-after__heading{font-size:4.3rem}}@media screen and (max-width:1199px){.haven-pdp-before-after__heading{font-size:3.8rem}}@media screen and (max-width:989px){.haven-pdp-before-after__heading{font-size:3.4rem}.haven-pdp-before-after__subheading{font-size:1.4rem}}@media screen and (max-width:749px){.haven-pdp-before-after__heading{font-size:2.9rem}.haven-pdp-before-after__head{margin-bottom:2rem}}.haven-pdp-before-after__wrapper{display:grid;grid-template-columns:27% 40% 27%;align-items:center;justify-content:space-between;gap:2rem}.haven-pdp-before-after__features{display:flex;flex-direction:column;gap:3rem;margin:0}.haven-pdp-before-after__feature{display:flex;align-items:center;gap:1rem}.haven-pdp-before-after__icon{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;width:6rem;height:6rem;color:rgb(var(--haven-icon))}.haven-pdp-before-after__icon svg,.haven-pdp-before-after__icon img,.haven-pdp-before-after__icon-img{display:block;width:6rem;height:6rem;object-fit:contain}.haven-pdp-before-after__text{font-family:var(--font-heading-family);font-weight:var(--font-heading-weight);font-size:2rem;line-height:1.3}@media screen and (max-width:989px){.haven-pdp-before-after__wrapper{grid-template-columns:1fr}.haven-pdp-before-after__features{width:fit-content;margin:0 auto;gap:2rem}.haven-pdp-before-after__text{font-size:1.8rem}}@media screen and (max-width:749px){.haven-pdp-before-after__icon,.haven-pdp-before-after__icon svg,.haven-pdp-before-after__icon img,.haven-pdp-before-after__icon-img{width:4rem;height:4rem}.haven-pdp-before-after__text{font-size:1.6rem}}.haven-pdp-before-after__media{position:relative;width:100%}.haven-pdp-before-after__compare{--percent: 100%;position:relative;display:block;overflow:hidden;border-radius:2rem;cursor:ew-resize;touch-action:pan-y}.haven-pdp-before-after__compare.is-animating .haven-pdp-before-after__after,.haven-pdp-before-after__compare.is-animating .haven-pdp-before-after__handle{transition:clip-path .6s ease,left .6s ease}.haven-pdp-before-after__before,.haven-pdp-before-after__after{display:block;width:100%}.haven-pdp-before-after__before img,.haven-pdp-before-after__after img,.haven-pdp-before-after__img{display:block;width:100%;height:100%;object-fit:cover}.haven-pdp-before-after__after{position:absolute;top:0;left:0;height:100%;clip-path:inset(0 0 0 var(--percent))}.haven-pdp-before-after__handle{position:absolute;top:0;left:var(--percent);z-index:2;width:.4rem;height:100%;margin-left:-.2rem;padding:0;border:0;background:rgb(var(--haven-color-white));cursor:grab;touch-action:none;filter:drop-shadow(0 1px 2px rgba(0,0,0,.1))}.haven-pdp-before-after__handle:active{cursor:grabbing}.haven-pdp-before-after__handle-grip{position:absolute;top:50%;left:50%;display:flex;align-items:center;justify-content:center;width:4.4rem;height:4.4rem;transform:translate(-50%,-50%);border-radius:50%;background:rgb(var(--haven-color-white));color:rgb(var(--haven-icon));box-shadow:0 .2rem .8rem #0003}.haven-pdp-before-after__handle-grip .icon{width:1.8rem;height:1.8rem}.haven-pdp-before-after__compare[data-at-edge] .haven-pdp-before-after__handle-grip{opacity:.85;transform:translate(-80%,-50%)}.haven-pdp-before-after__handle:focus-visible{outline:.2rem solid rgb(var(--haven-icon));outline-offset:.2rem}@media(prefers-reduced-motion:reduce){.haven-pdp-before-after *,.haven-pdp-before-after *:before,.haven-pdp-before-after *:after{transition:none;animation:none}}
/*# sourceMappingURL=/cdn/shop/t/3/assets/haven-pdp-before-after.css.map */