@font-face{font-family:EGH Comparison Jost;src:url(pf-jost-latin.woff2) format("woff2");font-style:normal;font-weight:100 900;font-display:swap}.before-after{display:block;padding-block:var(--ba-padding-top) var(--ba-padding-bottom);background:var(--ba-background);color:var(--ba-text-color);font-family:var(--ba-text-font, "EGH Comparison Jost", Arial, sans-serif);font-style:var(--ba-text-style, normal);font-weight:var(--ba-text-weight, 400)}.before-after__container{width:100%;margin-inline:auto;padding-inline:15px}.before-after__layout{display:grid;grid-template-columns:minmax(0,1fr);gap:24px}.before-after__content{display:grid;justify-items:start;gap:14px;min-width:0;overflow-wrap:anywhere}.before-after__heading{justify-self:stretch;margin:0;text-align:center;color:var(--ba-heading-color);font-family:var(--ba-heading-font, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-style:var(--ba-heading-style, normal);font-weight:var(--ba-heading-weight, 700);font-size:var(--ba-heading-size-mobile);line-height:1.3;letter-spacing:normal}.before-after__text{max-width:80rem;font-size:var(--ba-text-size-mobile);line-height:1.5;letter-spacing:normal}.before-after__text>:first-child{margin-top:0}.before-after__text>:last-child{margin-bottom:0}.before-after__button.button{--color-button: var(--ba-button-color);--color-button-text: var(--ba-button-text);--buttons-radius: var(--ba-button-radius);--buttons-radius-outset: var(--ba-button-radius);--buttons-shadow-opacity: 0;--buttons-border-width: 0px;min-height:44px;min-width:0;width:100%;padding:10px 16px;border:0;border-radius:var(--ba-button-radius);background:rgb(var(--ba-button-color));color:rgb(var(--ba-button-text));font-family:-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-style:normal;font-size:var(--ba-button-size);font-weight:700;line-height:1.3;letter-spacing:0;text-align:center;white-space:normal;text-transform:uppercase;overflow-wrap:anywhere}.before-after__button.button:not(:disabled):not([aria-disabled=true]):hover{--color-button: var(--ba-button-hover);background:rgb(var(--ba-button-hover));color:#fff}.before-after__button.button:before,.before-after__button.button:after{content:none}.before-after__button.button:disabled{opacity:.45}.before-after__purchase,.before-after__form{display:block;width:100%;margin:0;min-width:0}.before-after__purchase .product-form__error-message-wrapper{margin-top:10px;font-size:13px}.before-after__frame{position:relative;aspect-ratio:var(--ba-ratio);overflow:hidden;isolation:isolate;background:#edf3f2;direction:ltr}.before-after__layer,.before-after__image,.before-after__placeholder{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%}.before-after__image{display:block;object-fit:cover}.before-after__before{clip-path:inset(0 calc(100% - var(--ba-position)) 0 0)}.before-after__before .before-after__placeholder{background:#dfeae8}.before-after__after .before-after__placeholder{background:#c6dfdc}.before-after__range{position:absolute;z-index:3;top:0;left:-22px;width:calc(100% + 44px);height:100%;margin:0;padding:0;border:0;opacity:0;appearance:none;-webkit-appearance:none;cursor:ew-resize;touch-action:pan-y}.before-after__range::-webkit-slider-thumb{width:44px;height:44px;border:0;appearance:none;-webkit-appearance:none}.before-after__range::-moz-range-thumb{width:44px;height:44px;border:0}.before-after__divider{position:absolute;top:0;bottom:0;left:var(--ba-position);width:2px;background:var(--ba-handle-color);transform:translate(-50%);pointer-events:none}.before-after__handle{position:absolute;top:50%;left:clamp(22px,var(--ba-position),calc(100% - 22px));display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--ba-handle-color);color:var(--ba-handle-icon);box-shadow:0 1px 8px #0000000f;transform:translate(-50%,-50%);pointer-events:none}.before-after__handle svg{width:24px;height:24px}.before-after__range:focus-visible~.before-after__handle{outline:3px solid var(--ba-handle-icon);outline-offset:-6px}.before-after__range:disabled{cursor:default}.before-after__range:disabled~.before-after__handle{display:none}.before-after__label{position:absolute;bottom:12px;max-width:calc(50% - 24px);padding:4px 8px;border-radius:3px;background:var(--ba-handle-color);color:var(--ba-handle-icon);font-size:12px;line-height:1.4;overflow-wrap:anywhere;pointer-events:none}.before-after__label--before{left:12px}.before-after__label--after{right:12px}.before-after__editor-note{margin:12px 0 0;font-size:13px;line-height:1.5}@media screen and (min-width:750px){.before-after__container{padding-inline:4%}.before-after__layout{grid-template-columns:minmax(0,32fr) minmax(0,68fr);align-items:center;gap:24px}.before-after__content{gap:24px}.before-after__heading{font-size:var(--ba-heading-size);text-align:start}.before-after__text{font-size:var(--ba-text-size)}}@media screen and (min-width:990px){.before-after__layout{grid-template-columns:minmax(0,25fr) minmax(0,75fr);gap:clamp(24px,2.4vw,48px)}}.before-after__layout--image-only{grid-template-columns:minmax(0,1fr)}
/*# sourceMappingURL=/cdn/shop/t/31/assets/section-before-after.css.map */
