.bar-section{background:#0a0a0a;padding:80px 24px;overflow:hidden}.bar-inner{max-width:1080px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}.bar-slider-outer{position:relative}.bar-slider{position:relative;width:100%;aspect-ratio:1 / 1;border-radius:6px;overflow:hidden;box-shadow:0 0 0 1px #ffffff0f,0 24px 80px #000000a6;cursor:ew-resize;user-select:none;-webkit-user-select:none}.bar-img{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;object-position:center;display:block;pointer-events:none}.bar-img--after{z-index:1}.bar-img--before{z-index:2;clip-path:inset(0 50% 0 0)}.bar-img--placeholder{background:#1a1814;display:flex;align-items:center;justify-content:center}.bar-img--placeholder span{font-family:var(--font-heading, "Barlow Condensed", sans-serif);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:#fff3;text-align:center;padding:16px}.bar-corner-label{position:absolute;top:16px;z-index:10;font-family:var(--font-heading, "Barlow Condensed", sans-serif);font-size:10px;font-weight:800;letter-spacing:.22em;text-transform:uppercase;padding:5px 12px;border-radius:3px;line-height:1;pointer-events:none}.bar-corner-label--before{left:16px;background:#000000b3;color:#ffffffbf;border:1px solid rgba(255,255,255,.15)}.bar-corner-label--after{right:16px;background:var(--cf-accent, #2dc8ca);color:#0a0a0a}.bar-divider{position:absolute;top:0;bottom:0;left:50%;transform:translate(-50%);width:3px;background:var(--cf-accent, #2dc8ca);z-index:8;pointer-events:none;box-shadow:0 0 16px #2dc8ca80;transition:box-shadow .2s ease}.bar-slider:has(.bar-handle.is-dragging) .bar-divider{box-shadow:0 0 28px #2dc8cacc}.bar-handle{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:12;width:52px;height:52px;border-radius:50%;background:var(--cf-accent, #2dc8ca);display:flex;align-items:center;justify-content:center;flex-direction:column;gap:1px;cursor:ew-resize;box-shadow:0 0 0 4px #2dc8ca38,0 0 24px #2dc8ca80,0 4px 14px #00000073;transition:box-shadow .2s ease,transform .15s ease;touch-action:none;outline:none}.bar-handle:focus-visible{box-shadow:0 0 0 3px #0a0a0a,0 0 0 5px var(--cf-accent, #2dc8ca),0 0 24px #2dc8ca99}.bar-handle.is-dragging{box-shadow:0 0 0 6px #2dc8ca47,0 0 40px #2dc8cabf,0 6px 20px #00000080;transform:translate(-50%,-50%) scale(1.08)}.bar-handle__arrows{display:flex;align-items:center;gap:3px;pointer-events:none}.bar-handle__vs{font-family:var(--font-heading, "Barlow Condensed", sans-serif);font-size:10px;font-weight:800;letter-spacing:.05em;color:#0a0a0a;line-height:1;pointer-events:none}@keyframes bar-nudge{0%{transform:translate(-50%,-50%) scale(1)}20%{transform:translate(calc(-50% - 18px),-50%) scale(1.05)}50%{transform:translate(calc(-50% + 18px),-50%) scale(1.05)}75%{transform:translate(calc(-50% - 8px),-50%) scale(1.02)}to{transform:translate(-50%,-50%) scale(1)}}.bar-handle.is-nudging{animation:bar-nudge 1.1s cubic-bezier(.4,0,.2,1) forwards}.bar-caption{position:absolute;bottom:0;left:0;right:0;z-index:9;padding:32px 18px 14px;background:linear-gradient(to top,rgba(0,0,0,.62) 0%,transparent 100%);pointer-events:none}.bar-caption__inner{display:flex;align-items:center;gap:9px}.bar-caption__swatch{flex-shrink:0;width:13px;height:13px;border-radius:50%;border:1.5px solid rgba(255,255,255,.4);box-shadow:0 1px 4px #00000059}.bar-caption__text{font-family:var(--font-heading, "Barlow Condensed", sans-serif);font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#fff9}.bar-copy{display:flex;flex-direction:column}.bar-copy__eyebrow{display:inline-block;font-family:var(--font-heading, "Barlow Condensed", sans-serif);font-size:11px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--cf-accent, #2dc8ca);background:#2dc8ca1a;border:1px solid rgba(45,200,202,.2);padding:5px 14px;border-radius:3px;margin-bottom:20px;width:fit-content}.bar-copy__heading{font-family:var(--font-heading, "Barlow Condensed", sans-serif);font-size:clamp(32px,3.6vw,52px);font-weight:800;text-transform:uppercase;letter-spacing:.02em;color:#fff;line-height:1;margin:0 0 32px}.bar-features{display:flex;flex-direction:column;gap:20px;margin-bottom:32px}.bar-feature{display:flex;align-items:flex-start;gap:14px}.bar-feature__dot{flex-shrink:0;width:6px;height:6px;border-radius:50%;background:var(--cf-accent, #2dc8ca);margin-top:8px;box-shadow:0 0 8px #2dc8ca99}.bar-feature__text{font-family:var(--font-body, "Barlow", sans-serif);font-size:15px;line-height:1.65;color:#ffffff94;margin:0}.bar-feature__text strong{color:#ffffffe6;font-weight:600}.bar-copy__kicker{font-family:var(--font-heading, "Barlow Condensed", sans-serif);font-size:12px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:#ffffff47;padding-top:24px;border-top:1px solid rgba(255,255,255,.08);margin:0}@media(max-width:760px){.bar-section{padding:60px 20px}.bar-inner{grid-template-columns:1fr;gap:40px}.bar-slider{max-width:480px;margin:0 auto}.bar-handle{width:44px;height:44px}.bar-copy__heading{font-size:clamp(28px,8vw,40px)}}
/*# sourceMappingURL=/cdn/shop/t/2/assets/before-after-reveal.css.map */