.tp-before-after{padding:72px 32px;background:#faf6f0}.tp-before-after__container{max-width:880px;margin:0 auto;text-align:center}.tp-before-after__title{font-size:clamp(26px,3vw,34px);font-weight:800;letter-spacing:-.02em;color:var(--tp-color-dark);margin:12px 0 40px}.tp-comparator{position:relative;aspect-ratio:4 / 3.6;border-radius:24px;overflow:hidden;box-shadow:var(--tp-shadow-medium);touch-action:none}.tp-comparator__layer{position:absolute;top:0;right:0;bottom:0;left:0}.tp-comparator__layer img{width:100%;height:100%;object-fit:cover;display:block;-webkit-user-select:none;user-select:none;pointer-events:none}.tp-comparator__layer--after{-webkit-mask-image:linear-gradient(to right,black 0,black calc(var(--reveal) - 22px),transparent calc(var(--reveal) + 22px));mask-image:linear-gradient(to right,black 0,black calc(var(--reveal) - 22px),transparent calc(var(--reveal) + 22px))}.tp-comparator__label{position:absolute;bottom:16px;font-size:12.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--tp-color-white);background:#1e1b188c;backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);padding:6px 14px;border-radius:100px;transition:opacity .2s ease}.tp-comparator__label--before{left:16px}.tp-comparator__label--after{right:16px}.tp-comparator__divider{position:absolute;top:0;bottom:0;left:var(--reveal);width:0}.tp-comparator__handle{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:52px;height:52px;border-radius:50%;background:var(--tp-color-white);box-shadow:var(--tp-shadow-medium);display:flex;align-items:center;justify-content:center;cursor:ew-resize}.tp-comparator__handle-icon{color:var(--tp-color-accent);font-size:20px;display:flex}.tp-comparator__hairs{position:absolute;top:-6px;right:-6px;bottom:-6px;left:-6px;width:calc(100% + 12px);height:calc(100% + 12px);fill:none;stroke:var(--tp-color-text-muted);stroke-width:1.6;stroke-linecap:round;opacity:0;pointer-events:none}@keyframes tp-hairs-appear{0%{opacity:0;transform:scale(.85)}25%{opacity:.9;transform:scale(1)}75%{opacity:.9}to{opacity:0}}.tp-comparator__hairs.is-animating{animation:tp-hairs-appear 1.3s ease forwards}@media(max-width:560px){.tp-before-after{padding:56px 20px}.tp-comparator{aspect-ratio:1 / 1}.tp-comparator__label{font-size:11px;padding:5px 11px}}.tp-comparator__handle-img{width:30px;height:30px;object-fit:contain;pointer-events:none;-webkit-user-select:none;user-select:none;filter:drop-shadow(0 1px 2px rgba(30,27,24,.15));transition:transform .25s ease}.tp-comparator__handle{transition:transform .25s ease,box-shadow .25s ease}.tp-comparator__handle:hover{transform:translate(-50%,-50%) scale(1.06);box-shadow:0 6px 18px #1e1b182e}.tp-comparator__handle:hover .tp-comparator__handle-img{transform:scale(1.08)}
/*# sourceMappingURL=/cdn/shop/t/14/assets/toudoupet-before-after.css.map */