.ba-section{padding-block:var(--ba-pt, 48px) var(--ba-pb, 48px);background-color:var(--color-background);color:var(--color-foreground)}.ba-section__inner{display:grid;gap:2rem;width:var(--content-width, calc(100% - 2rem) );margin-inline:auto}.ba-section__text{display:grid;gap:1.5rem}.ba-section__text .section-intro{margin-bottom:0}.ba-section__actions{display:flex}.ba-section__actions--center{justify-content:center}.ba-grid{display:grid;gap:var(--card-gap, 1rem)}.ba-section--centered .ba-grid{width:100%;margin-inline:auto}.ba-section--centered .ba-grid:has(>.ba-item:only-child){max-width:var(--ba-max, 760px)}.ba-item{margin:0;min-width:0}.ba-item__caption{margin-top:.75rem;font-size:.875em;color:var(--color-text-muted);text-align:center}.ba{--ba-pos: 50%;position:relative;aspect-ratio:var(--ba-ratio, 4 / 5);overflow:hidden;border-radius:var(--card-image-radius, 0);background-color:var(--color-surface);touch-action:pan-y;user-select:none;-webkit-user-select:none;cursor:ew-resize}.ba--vertical{touch-action:pan-x;cursor:ns-resize}.ba__img{position:absolute;top:0;right:0;bottom:0;left:0}.ba__img img,.ba__img svg{display:block;width:100%;height:100%;object-fit:cover;pointer-events:none}.ba__img--before{clip-path:inset(0 calc(100% - var(--ba-pos)) 0 0)}.ba--vertical .ba__img--before{clip-path:inset(0 0 calc(100% - var(--ba-pos)) 0)}.ba__placeholder{fill:var(--color-text-muted);opacity:.4;background-color:var(--color-surface)}.ba__placeholder--before{background-color:color-mix(in srgb,var(--color-text-muted) 18%,var(--color-surface))}.ba__label{position:absolute;top:1rem;z-index:2;padding:.35em .8em;font-family:var(--font-label--family);font-size:var(--font-label--size, 12px);letter-spacing:var(--font-label--spacing);text-transform:var(--font-label--case);color:#141414;background-color:#ffffffd9;border-radius:var(--radius-badge, 0);pointer-events:none}.ba__label--before{left:1rem}.ba__label--after{right:1rem}.ba--vertical .ba__label--before{top:1rem;left:1rem}.ba--vertical .ba__label--after{top:auto;bottom:1rem;right:auto;left:1rem}.ba-section--labels-text .ba__label{top:auto;bottom:1.25rem;padding:0;color:#fff;background:none;text-shadow:0 1px 6px rgb(0 0 0 / 35%)}.ba-section--labels-text .ba__label--before{left:1.25rem}.ba-section--labels-text .ba__label--after{right:1.25rem}.ba__handle{position:absolute;top:0;bottom:0;left:var(--ba-pos);z-index:3;width:2px;margin-left:-1px;background-color:var(--ba-handle, #fff);box-shadow:0 0 6px #0003;pointer-events:none}.ba--vertical .ba__handle{top:var(--ba-pos);bottom:auto;left:0;right:0;width:auto;height:2px;margin:-1px 0 0}.ba__knob{position:absolute;top:50%;left:50%;display:flex;align-items:center;justify-content:center;width:44px;height:44px;color:var(--ba-arrows, #141414);background-color:var(--ba-handle, #fff);border-radius:50%;box-shadow:0 2px 10px #0003;transform:translate(-50%,-50%);transition:transform .2s ease}.ba--vertical .ba__knob{transform:translate(-50%,-50%) rotate(90deg)}.ba.is-dragging .ba__knob{transform:translate(-50%,-50%) scale(1.1)}.ba--vertical.is-dragging .ba__knob{transform:translate(-50%,-50%) rotate(90deg) scale(1.1)}.ba__range{position:absolute;top:0;right:0;bottom:0;left:0;z-index:4;width:100%;height:100%;margin:0;opacity:0;pointer-events:none}.ba:has(.ba__range:focus-visible) .ba__knob{outline:2px solid var(--color-foreground);outline-offset:3px}.ba-section--full .ba-section__inner{width:100%}.ba-section--full .ba-section__text{width:var(--content-width, calc(100% - 2rem) );margin-inline:auto}.ba-section--full.ba-section--centered .ba-grid,.ba-section--full.ba-section--centered .ba-grid:has(>.ba-item:only-child){max-width:none}.ba-section--full .ba{border-radius:0}.ba-section--full .ba-item__caption{padding-inline:1rem}@media screen and (min-width:750px){.ba-section--centered .ba-grid{grid-template-columns:repeat(var(--ba-cols, 1),minmax(0,1fr))}}@media screen and (min-width:990px){.ba-section--side .ba-section__inner{grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);align-items:center;gap:4rem}.ba-section--full.ba-section--side .ba-section__text{width:auto;margin:0;padding-left:max(var(--page-margin, 40px),calc((100vw - var(--page-width, 1440px)) / 2 + var(--page-margin, 40px)))}}
/*# sourceMappingURL=/cdn/shop/t/11/assets/before-after.css.map */
