@property --wm-ba-pos{syntax: "<percentage>"; inherits: true; initial-value: 50%;}.wm-ba{--wm-ba-accent: #8c5a63;--wm-ba-ink: #171717;--wm-ba-muted: #6b6663;--wm-ba-card: #fffdfb;--wm-ba-border: rgba(140, 90, 99, .16);background:var(--wm-ba-bg, #faf7f4);color:var(--wm-ba-ink);padding-block:var(--wm-ba-pad-top, 64px) var(--wm-ba-pad-bottom, 64px);overflow-x:clip}.wm-ba__inner{width:min(100% - 2.5rem,var(--wm-ba-width, 1560px));margin-inline:auto}.wm-ba__card{display:grid;grid-template-columns:1fr;gap:clamp(1.5rem,3.5vw,2rem);padding:clamp(14px,3.5vw,20px);background:var(--wm-ba-card);border:1px solid var(--wm-ba-border);border-radius:clamp(24px,3vw,32px);box-shadow:0 1px 2px #3c282c08,0 18px 44px -32px #3c282c3d}.wm-ba__copy{display:contents}.wm-ba__lede{order:1}.wm-ba__stage{order:2}.wm-ba__benefits{order:3}@media screen and (min-width:1000px){.wm-ba__card{grid-template-columns:1fr 42%;align-items:center;column-gap:clamp(36px,3vw,52px);padding:clamp(18px,1.6vw,24px)}.wm-ba__copy{display:flex;flex-direction:column;gap:clamp(1.25rem,1.8vw,1.9rem);order:2}.wm-ba__stage{order:1}}@media screen and (min-width:1280px){.wm-ba__card{grid-template-columns:1fr 33%}}.wm-ba__eyebrow{margin:0 0 .75rem;color:var(--wm-ba-accent);font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase}.wm-ba__heading{margin:0;font-size:clamp(23px,7vw,40px);font-weight:700;line-height:1.06;letter-spacing:-.035em;text-wrap:balance}@media screen and (min-width:1000px){.wm-ba__heading{font-size:clamp(34px,3vw,54px)}}.wm-ba__accent{color:var(--wm-ba-accent)}.wm-ba__body{margin:.9rem 0 0;max-width:460px;color:var(--wm-ba-muted);font-size:clamp(.9375rem,.9rem + .2vw,1.0625rem);line-height:1.55;text-wrap:pretty}.wm-ba__body p{margin:0}.wm-ba__body p+p{margin-top:.75rem}.wm-ba__benefits{margin:0;padding:0;max-width:460px;list-style:none;border-top:1px solid var(--wm-ba-border)}.wm-ba__benefit{display:grid;grid-template-columns:auto 1fr;gap:.7rem;align-items:start;padding:.72rem 0;border-bottom:1px solid var(--wm-ba-border)}.wm-ba__benefit-icon{display:grid;place-items:center;width:17px;height:17px;margin-top:1px;color:var(--wm-ba-accent);background:color-mix(in oklab,var(--wm-ba-accent) 12%,transparent);border-radius:50%}.wm-ba__benefit-icon svg{display:block;width:9px;height:9px}.wm-ba__benefit-title{display:block;font-size:.9375rem;font-weight:650;letter-spacing:-.012em}.wm-ba__benefit-text{display:block;margin-top:.1rem;color:var(--wm-ba-muted);font-size:.875rem;line-height:1.45}.wm-ba__stage{min-width:0}.wm-ba__frame{position:relative;aspect-ratio:var(--wm-ba-ratio-mobile, 3 / 2);border-radius:clamp(22px,4vw,26px);overflow:hidden;background:#f1ebe7;isolation:isolate;touch-action:pan-y;cursor:ew-resize;user-select:none;-webkit-user-select:none}@media screen and (min-width:1000px){.wm-ba__frame{aspect-ratio:auto;height:clamp(420px,34vw,560px);border-radius:clamp(22px,2vw,26px)}}.wm-ba__layer{position:absolute;top:0;right:0;bottom:0;left:0}.wm-ba__img{display:block;width:100%;height:100%;object-fit:cover;-webkit-user-drag:none;user-select:none;-webkit-user-select:none;object-position:var(--wm-ba-focal, center center)}.wm-ba__layer--before{clip-path:inset(0 calc(100% - var(--wm-ba-pos)) 0 0)}.wm-ba__layer--after{clip-path:inset(0 0 0 var(--wm-ba-pos))}.wm-ba__layer--after .wm-ba__img{object-position:var(--wm-ba-focal-after, center center)}.wm-ba__tag{position:absolute;top:clamp(.75rem,2.2vw,1.05rem);padding:.4rem .7rem;color:#fff;font-size:11px;font-weight:650;letter-spacing:.1em;text-transform:uppercase;white-space:nowrap;background:#1c161685;border-radius:999px;box-shadow:0 2px 10px #1c16162e;backdrop-filter:blur(8px) saturate(1.15);-webkit-backdrop-filter:blur(8px) saturate(1.15);pointer-events:none}.wm-ba__tag--before{left:clamp(.75rem,2.2vw,1.05rem)}.wm-ba__tag--after{right:clamp(.75rem,2.2vw,1.05rem)}.wm-ba__control{position:absolute;inset-block:0;left:0;width:100%;transform:translate(var(--wm-ba-pos));pointer-events:none}.wm-ba__line{position:absolute;inset-block:0;left:0;width:2px;transform:translate(-50%);background:#ffffffeb;box-shadow:0 0 0 1px #3c282c29,0 0 18px #1c16162e}.wm-ba__handle{position:absolute;top:50%;left:0;display:grid;place-items:center;width:48px;height:48px;transform:translate(-50%,-50%);color:var(--wm-ba-accent);background:#fffcfab8;border:1px solid rgba(140,90,99,.42);border-radius:50%;box-shadow:inset 0 1px #ffffffeb,0 6px 18px -6px #3c282c61;backdrop-filter:blur(12px) saturate(1.35);-webkit-backdrop-filter:blur(12px) saturate(1.35);transition:transform .14s cubic-bezier(.16,1,.3,1);touch-action:none;pointer-events:auto}.wm-ba__handle:after{content:"";position:absolute;top:50%;right:50%;bottom:50%;left:50%;width:52px;height:52px;translate:-50% -50%;border-radius:50%}.wm-ba__arrows{display:flex;align-items:center;gap:3px}.wm-ba__arrows svg{display:block;width:9px;height:13px}.wm-ba__grip{width:1px;height:14px;background:currentColor;opacity:.35}.wm-ba__ring{position:absolute;top:-1px;right:-1px;bottom:-1px;left:-1px;border:1px solid var(--wm-ba-accent);border-radius:50%;opacity:0;pointer-events:none}.wm-ba__frame.is-pressed .wm-ba__handle{transform:translate(-50%,-50%) scale(.96)}.wm-ba__frame.is-pressed .wm-ba__ring{animation:wm-ba-ring .42s cubic-bezier(.16,1,.3,1)}@keyframes wm-ba-ring{0%{opacity:.5;transform:scale(1)}to{opacity:0;transform:scale(1.42)}}.wm-ba__range{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;margin:0;opacity:0;appearance:none;-webkit-appearance:none;background:none;pointer-events:none}.wm-ba__frame:not(.is-pointer-focus):has(.wm-ba__range:focus-visible){outline:2px solid var(--wm-ba-accent);outline-offset:3px}.wm-ba__frame:not(.is-pointer-focus):has(.wm-ba__range:focus-visible) .wm-ba__handle{border-color:var(--wm-ba-accent);box-shadow:inset 0 1px #ffffffeb,0 0 0 3px #8c5a6342,0 6px 18px -6px #3c282c61}.wm-ba__frame.is-animating{transition:--wm-ba-pos .3s cubic-bezier(.22,1,.36,1)}.wm-ba__frame.is-demo{animation:wm-ba-demo .7s cubic-bezier(.22,1,.36,1)}@keyframes wm-ba-demo{0%{--wm-ba-pos: var(--wm-ba-start)}45%{--wm-ba-pos: calc(var(--wm-ba-start) + 5%)}to{--wm-ba-pos: var(--wm-ba-start)}}@media(prefers-reduced-motion:reduce){.wm-ba__frame.is-animating,.wm-ba__handle{transition:none}.wm-ba__frame.is-demo,.wm-ba__frame.is-pressed .wm-ba__ring{animation:none}}
/*# sourceMappingURL=/cdn/shop/t/6/assets/warmoura-before-after.css.map */