.before-and-after{display:block;background-color:var(--color-background);color:var(--color-text)}.before-and-after .section-inner{padding-top:var(--before-and-after-padding-top-mobile);padding-bottom:var(--before-and-after-padding-bottom-mobile);max-width:100%}.before-and-after .product-rating{margin:0}@media(max-width:1023px){.before-and-after .section-inner{padding-left:0;padding-right:0;background:var(--before-and-after-background, transparent)}}.before-and-after__inner{display:flex;flex-direction:column;gap:var(--spacing-6);text-align:center}@media(max-width:1023px){.before-and-after__inner{gap:0}}.before-and-after__card{background:var(--color-background, transparent);padding:var(--spacing-20) var(--spacing-4)}@media(max-width:719px){.template-product .before-and-after__card{padding:var(--spacing-30) var(--spacing-5)}}@media(min-width:1024px){.before-and-after .section-inner{padding-top:var(--before-and-after-padding-top-desktop);padding-bottom:var(--before-and-after-padding-bottom-desktop);padding-left:0;padding-right:0}.before-and-after__inner{flex-direction:row;align-items:center;position:relative}.before-and-after__inner:before{content:"";position:absolute;width:calc(50% - var(--spacing-3));background:var(--before-and-after-background, transparent);height:100%;left:0}.before-and-after__slider{flex:0 0 calc(50% - var(--spacing-3));align-self:stretch}.before-and-after__card{flex:0 0 40%;margin-inline:auto;padding-top:var(--spacing-8);padding-bottom:var(--spacing-8);gap:var(--spacing-6)}}@media(min-width:1200px){.before-and-after__card{padding-top:var(--spacing-16);padding-bottom:var(--spacing-16)}}.before-and-after__heading{color:var(--before-and-after-heading-color, var(--color-text));margin:0 0 var(--spacing-10)}@media(min-width:1024px){.before-and-after__heading{margin-bottom:var(--spacing-4)}}.before-and-after__subheading{margin:0}.before-and-after__subheading>*:first-child{margin-top:0}.before-and-after__subheading>*:last-child{margin-bottom:0}.before-and-after__card{display:flex;flex-direction:column;gap:0}.before-and-after__product-image-wrap--desktop{display:none}@media(min-width:1024px){.before-and-after__product-image-wrap--desktop{display:block;width:280px;height:280px;margin:0 auto;text-align:center;border-bottom:1px solid var(--color-border)}.before-and-after__product-image-wrap--mobile{display:none}}.before-and-after__product-image-wrap--mobile{flex-shrink:0;width:240px;aspect-ratio:1;overflow:hidden}.before-and-after__product-image{display:block;width:100%;height:100%;object-fit:contain;object-position:var(--focal-alignment, center)}.before-and-after__product-placeholder{display:block;width:100%;height:100%;background:var(--color-text-alpha-05)}.before-and-after__product-details{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-4)}@media(min-width:1024px){.before-and-after__product-details{padding-top:var(--spacing-4);padding-bottom:var(--spacing-4)}}.before-and-after__product-info{flex:1;min-width:0}.before-and-after__product-title{color:var(--color-text);font-weight:700;margin:0;text-transform:uppercase}.before-and-after__product-subtitle{margin:0 0 var(--spacing-2)}.before-and-after__product-meta{display:flex;flex-direction:column;flex-wrap:wrap;align-items:center;gap:var(--spacing-3)}.before-and-after__product-price{font-weight:700;color:var(--color-text)}.before-and-after__button_wrapper{width:max-content;margin:var(--spacing-4) auto var(--spacing-10)}@media(min-width:1024px){.before-and-after__button_wrapper{width:max-content;margin:0 auto var(--spacing-6)}}.before-and-after__products-used{border-top:1px solid var(--color-border);padding-top:var(--spacing-4)}.before-and-after__products-used-heading{font-weight:700}.before-and-after__products-used-list{margin:0;padding:0;list-style:none}.before-and-after__products-used-list>span{display:inline-flex}.before-and-after__products-used-link{display:inline-block;color:var(--color-text-link);text-decoration:underline;text-underline-offset:.2em}.before-and-after__products-used-link:hover,.before-and-after__products-used-link:focus-visible{text-decoration-thickness:2px}.before-and-after__slider{position:relative;width:100%;aspect-ratio:9/10;max-height:600px;overflow:hidden;background:var(--color-text-alpha-05);border-radius:50% 50% 0 0/45% 45% 0 0}@media(min-width:720px){.before-and-after__slider{max-height:900px;aspect-ratio:1;border-radius:50% 50% 0 0/60% 60% 0 0}}@media(min-width:1024px){.before-and-after__slider{max-height:none;border-radius:50% 50% 0 0/27% 27% 0 0}}@media(min-width:1200px){.before-and-after__slider{border-radius:50% 50% 0 0/32% 32% 0 0;min-height:819px}}@media(min-width:1400px){.before-and-after__slider{border-radius:50% 50% 0 0/40% 40% 0 0}}@media(min-width:1500px){.before-and-after__slider{border-radius:50% 50% 0 0}}.before-and-after__slider-track{position:relative;width:100%;height:100%}.before-and-after__slider-before,.before-and-after__slider-after{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden}.before-and-after__slider-before{z-index:2;clip-path:inset(0 calc(100% - var(--slider-position, 50%)) 0 0)}.before-and-after__slider-after{z-index:1}.before-and-after__slider-image,.before-and-after__slider-placeholder{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;object-position:center}.before-and-after__slider:before{content:"";position:absolute;top:0;bottom:0;left:var(--slider-position, 50%);width:4px;margin-left:-1px;background:var(--before-and-after-tag-background, var(--color-background));pointer-events:none;z-index:3}.before-and-after__tag{position:absolute;bottom:var(--spacing-3);color:var(--color-text);font-weight:700;line-height:100%;text-transform:uppercase;z-index:3}.before-and-after__tag--before{left:var(--spacing-3)}.before-and-after__tag--after{right:var(--spacing-3)}@media(min-width:720px){.before-and-after__tag--before{left:var(--spacing-6)}.before-and-after__tag--after{right:var(--spacing-6)}.before-and-after__tag{bottom:var(--spacing-4)}}.before-and-after__handle{position:absolute;bottom:7%;left:var(--slider-position, 50%);transform:translate(-50%,-50%);display:flex;align-items:center;justify-content:center;width:56px;height:36px;padding:0;border:0;border-radius:9999px;background:var(--before-and-after-tag-background, var(--color-background));color:var(--before-and-after-tag-text, var(--color-accent));box-shadow:0 8px 16px #0003;cursor:ew-resize;touch-action:none;z-index:4;gap:0}.before-and-after__handle:focus-visible{outline:2px solid var(--color-text);outline-offset:2px}.before-and-after__handle .icon{display:flex;align-items:center;justify-content:center}.before-and-after__handle .icon:first-child{transform:rotate(180deg)}.before-and-after__handle svg{width:24px;height:auto;padding:6px}@media(min-width:1024px){.before-and-after__handle{bottom:15%;width:76px;height:48px;padding:0;gap:var(--spacing-1)}.before-and-after__handle svg{width:24px;height:auto;padding:3px}}
/*# sourceMappingURL=/cdn/shop/t/15/assets/custom-css__before-and-after.css.map */