.before-after{margin-top:var(--margin-top-mobile);margin-bottom:var(--margin-bottom-mobile)}.before-after__inner{display:grid;gap:24px}.before-after__content{padding:0 16px;text-align:center}.before-after__eyebrow{margin:0 0 24px;color:var(--color-black-800)}.before-after__title{margin:0;text-transform:uppercase;font-size:32px}.before-after__text{margin:8px auto 0;color:var(--color-black-800);max-width:450px}.before-after__text p{margin:0}.before-after__media{display:block}.before-after__canvas{position:relative;overflow:hidden;border-radius:var(--radius-lg);background:var(--color-white-700);aspect-ratio:1 / 1;user-select:none;-webkit-user-select:none;touch-action:none}.before-after__layer{position:absolute;top:0;right:0;bottom:0;left:0}.before-after__layer--after{clip-path:inset(0 0 0 var(--comparison-position))}.before-after__image{width:100%;height:100%;object-fit:cover;display:block}.before-after__labels{position:absolute;top:14px;left:14px;right:14px;z-index:1;display:flex;justify-content:space-between;color:var(--color-white);text-transform:uppercase}.before-after__handle{position:absolute;top:0;left:var(--comparison-position);transform:translate(-50%);z-index:2;width:36px;height:100%;border:0;background:transparent;padding:0;cursor:ew-resize}.before-after__handle:before{content:"";position:absolute;left:50%;top:0;bottom:0;width:2px;transform:translate(-50%);background:#fffffff2}.before-after__handle-icon{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:36px;height:36px;border-radius:50%;border:1px solid rgba(255,255,255,.45);background:#7a7a7a80;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);color:var(--color-white);font-size:1.3rem;line-height:1;display:flex;align-items:center;justify-content:center}.before-after__handle-icon svg{width:60%}@media screen and (min-width:990px){.before-after{margin-top:var(--margin-top-desktop);margin-bottom:var(--margin-bottom-desktop)}.before-after__inner{grid-template-columns:minmax(300px,1fr) minmax(420px,1fr);gap:12px;align-items:center}.before-after__content{text-align:center;margin:0 auto;padding:90px}.before-after__title{font-size:48px}.before-after__text{margin-top:18px}}
/*# sourceMappingURL=/cdn/shop/t/254/assets/section-before-after.css.map */
