.before-after-hero{--bah-primary: #000000;--bah-on-surface-variant: #45474c;--bah-surface-lowest: #ffffff;--bah-outline-variant: #c6c6cc;--bah-font-family: "Inter", sans-serif;--bah-border-radius: .75rem;--bah-height: 700px;position:relative;overflow:hidden;height:var(--bah-height)}.before-after-hero__slider{position:relative;width:100%;height:100%;--reveal-percent: 50%}.before-after-hero__layer{position:absolute;top:0;right:0;bottom:0;left:0}.before-after-hero__layer--before{clip-path:inset(0 calc(100% - var(--reveal-percent)) 0 0);z-index:2}.before-after-hero__image{width:100%;height:100%;object-fit:cover;object-position:center;display:block}.before-after-hero__image--before{filter:grayscale(30%)}.before-after-hero__label{position:absolute;bottom:3rem}.before-after-hero__label--after{right:3rem}.before-after-hero__label--before{left:3rem}.before-after-hero__label span{display:inline-block;font-family:var(--bah-font-family);font-size:12px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:#fff;background:#00000059;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:.75rem 1.5rem;border-radius:8px}.before-after-hero__handle{position:absolute;top:0;bottom:0;left:var(--reveal-percent);width:4px;background:#fff;transform:translate(-50%);z-index:10;box-shadow:0 0 16px #00000040;pointer-events:none}.before-after-hero__handle-circle{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:3rem;height:3rem;background:#fff;border-radius:9999px;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 24px #0003;transition:transform .2s ease}.before-after-hero__handle-circle .material-symbols-outlined{font-size:1.5rem;color:var(--bah-primary);font-variation-settings:"FILL" 0,"wght" 400,"GRAD" 0,"opsz" 24;transform:rotate(90deg)}.before-after-hero__range{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;opacity:0;cursor:ew-resize;z-index:20;margin:0;padding:0;-webkit-appearance:none}.before-after-hero__overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;z-index:15;pointer-events:none;padding:1rem}.before-after-hero__content{background:#ffffffeb;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:3rem;border-radius:var(--bah-border-radius);text-align:center;max-width:640px;width:100%;pointer-events:auto;box-shadow:0 8px 40px #0000001f;border:1px solid rgba(198,198,204,.3)}.before-after-hero__heading{font-family:var(--bah-font-family);font-size:48px;font-weight:700;line-height:56px;letter-spacing:-.02em;color:var(--bah-primary);margin:0 0 1.5rem}.before-after-hero__subheading{font-family:var(--bah-font-family);font-size:18px;font-weight:400;line-height:28px;color:var(--bah-on-surface-variant);margin:0 auto 2rem;max-width:480px}.before-after-hero__cta{display:inline-flex;align-items:center;justify-content:center;min-height:56px;padding:0 2.5rem;background:var(--bah-primary);color:#fff;font-family:var(--bah-font-family);font-size:14px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;text-decoration:none;border-radius:9999px;border:none;cursor:pointer;transition:background .2s ease,transform .1s ease}.before-after-hero__cta:hover{background:#333}.before-after-hero__cta:active{transform:scale(.97)}@media screen and (max-width:749px){.before-after-hero{--bah-height: 520px}.before-after-hero__content{padding:2rem 1.5rem}.before-after-hero__heading{font-size:32px;line-height:40px}.before-after-hero__subheading{font-size:16px;line-height:24px}.before-after-hero__label--after{right:1rem;bottom:1.5rem}.before-after-hero__label--before{left:1rem;bottom:1.5rem}}
/*# sourceMappingURL=/cdn/shop/t/5/assets/section-before-after-hero.css.map */