.sq-before-after{background:var(--sq-color-bg)}.template-product .sq-before-after{margin-top:var(--sq-space-10)}.sq-before-after .baa-section{padding:var(--sq-space-12) 0;overflow-x:hidden}.sq-before-after .section-header{text-align:center;margin-bottom:var(--sq-space-8);padding:0 var(--sq-space-5)}.sq-before-after .section-eyebrow{font-family:var(--sq-font-sans);font-size:var(--sq-fs-2xs);font-weight:var(--sq-fw-medium);letter-spacing:2px;text-transform:uppercase;color:var(--sq-color-text-faint);margin-bottom:var(--sq-space-3)}.sq-before-after .section-title{font-family:var(--sq-font-serif);font-size:var(--sq-fs-h1);font-weight:var(--sq-fw-regular);color:var(--sq-color-text);line-height:1.2;letter-spacing:-.4px;max-width:320px;margin:0 auto}.sq-before-after .section-title em{font-style:italic}.template-product .sq-before-after .section-title{font-size:var(--sq-fs-h3);line-height:var(--sq-lh-base);letter-spacing:0}.sq-before-after .baa-carousel-wrap{position:relative;overflow:visible;max-width:none;padding-left:var(--sq-space-5)}.sq-before-after .baa-scroll{display:flex;gap:var(--sq-space-3);overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;padding:0 var(--sq-space-5) var(--sq-space-1) 0;scrollbar-width:none}.sq-before-after .baa-scroll::-webkit-scrollbar{display:none}.sq-before-after .baa-card{min-width:280px;max-width:280px;scroll-snap-align:start;flex-shrink:0}.sq-before-after .baa-arrow,.sq-before-after .baa-dots{display:none}.sq-before-after .baa-dot{width:5px;height:5px;border-radius:50%;border:none;background:var(--sq-color-border-light);cursor:pointer;padding:0;transition:background .3s var(--sq-ease),transform .3s var(--sq-ease)}.sq-before-after .baa-dot.is-active{background:var(--sq-color-text-faint);transform:scale(1.4)}.sq-before-after .baa-dot:focus-visible{outline:2px solid var(--sq-color-text-faint);outline-offset:2px}@media(min-width:768px){.sq-before-after .section-title{font-size:32px;max-width:580px}.template-product .sq-before-after .section-title{font-size:26px}.sq-before-after .baa-carousel-wrap{overflow:hidden;padding:var(--sq-space-4) 56px;max-width:calc(3 * 340px + 2 * var(--sq-space-5) + 112px);margin-left:auto;margin-right:auto}.sq-before-after .baa-scroll{overflow:visible;scroll-snap-type:none;padding:0;justify-content:flex-start;align-items:center;gap:var(--sq-space-5);cursor:grab;touch-action:pan-y;will-change:transform}.sq-before-after .baa-card{min-width:340px;max-width:340px;scroll-snap-align:unset;transform:scale(.85);opacity:.5;transition:transform .5s cubic-bezier(.4,0,.2,1),opacity .5s cubic-bezier(.4,0,.2,1)}.sq-before-after .baa-card.is-current{transform:scale(1.08);opacity:1}@media(prefers-reduced-motion:reduce){.sq-before-after .baa-card{transition:none}}.sq-before-after .baa-arrow{display:flex;align-items:center;justify-content:center;position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px;border-radius:50%;background:var(--sq-color-bg);border:1px solid var(--sq-color-border-light);box-shadow:0 2px 8px #0000000f;color:var(--sq-color-text-muted);cursor:pointer;z-index:3;padding:0;transition:background var(--sq-duration-fast) var(--sq-ease),border-color var(--sq-duration-fast) var(--sq-ease),color var(--sq-duration-fast) var(--sq-ease),box-shadow var(--sq-duration-fast) var(--sq-ease)}.sq-before-after .baa-arrow:hover:not(:disabled){border-color:var(--sq-color-border-dark);color:var(--sq-color-text);box-shadow:0 2px 12px #0000001a}.sq-before-after .baa-arrow:disabled{opacity:.3;cursor:default}.sq-before-after .baa-arrow:focus-visible{outline:none;box-shadow:0 0 0 2px var(--sq-color-bg),0 0 0 4px var(--sq-color-text-muted)}.sq-before-after .baa-arrow svg{width:18px;height:18px}.sq-before-after .baa-arrow--prev{left:4px}.sq-before-after .baa-arrow--next{right:4px}.sq-before-after .baa-dots{display:flex;justify-content:center;gap:var(--sq-space-2);margin-top:var(--sq-space-10)}}@media(min-width:1024px){.sq-before-after .baa-carousel-wrap{max-width:calc(3 * 360px + 2 * var(--sq-space-5) + 112px)}.sq-before-after .baa-card{min-width:360px;max-width:360px}}
/*# sourceMappingURL=/cdn/shop/t/106/assets/sq-before-after.css.map */