sb-day-night{display:block;--sb-compare-split:50%}
.sb-day-night-figure{margin:0;min-width:0}
.sb-compare-visual{position:relative;isolation:isolate;overflow:hidden;border-radius:3px;line-height:0}
.sb-compare-visual .sb-compare-night{display:block;width:100%;height:auto;object-fit:contain}
.sb-compare-visual .sb-compare-day{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:contain;clip-path:inset(0 calc(100% - var(--sb-compare-split)) 0 0)}
.sb-compare-divider{position:absolute;top:0;bottom:0;left:var(--sb-compare-split);width:2px;background:#ffffffdf;transform:translateX(-50%);pointer-events:none;z-index:2}
.sb-compare-divider>span{position:absolute;top:50%;left:50%;display:grid;place-items:center;width:44px;height:44px;transform:translate(-50%,-50%);border:1px solid #fff;background:#f7f3e9ed;border-radius:50%;color:#35372e;font:400 24px/1 Arial,Helvetica,sans-serif;box-shadow:0 2px 14px #0003}
.sb-compare-range{position:absolute;inset:0;z-index:3;width:100%;height:100%;opacity:0;margin:0;padding:0;cursor:ew-resize;touch-action:pan-y}
.sb-compare-visual:focus-within{outline:2px solid #7b653c;outline-offset:4px}
.sb-compare-views{position:absolute;inset:16px 16px auto;display:flex;justify-content:space-between;pointer-events:none;z-index:4}
.sb-compare-views button{pointer-events:auto;padding:9px 13px;border:1px solid #ffffff60;border-radius:22px;background:#fbfaf7e8;backdrop-filter:blur(12px);font:700 12px/1.3 Arial,Helvetica,sans-serif;color:#292c29;cursor:pointer}
.sb-day-night-figure>figcaption{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 20px;font:400 11px/1.5 Arial,Helvetica,sans-serif;color:var(--sb-muted);margin-top:12px}
.sb-case-comparison{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);gap:45px;align-items:center;padding:36px 0;border-bottom:1px solid var(--sb-border)}
.sb-store .sb-case-comparison h2{font:400 clamp(30px,3.5vw,49px)/1.1 Georgia,'Times New Roman',serif;letter-spacing:-.035em;margin:0 0 20px;max-width:20ch}
.sb-case-comparison>div>p:not(.sb-case-scene-label){font-size:15px;line-height:1.7;color:var(--sb-muted);max-width:42ch;margin-bottom:23px}
@media(max-width:700px){.sb-compare-views{inset:12px 12px auto}.sb-compare-views button{padding:8px 12px;font-size:11px}.sb-compare-divider>span{width:38px;height:38px;font-size:22px}.sb-case-comparison{grid-template-columns:1fr;gap:25px;padding:27px 0}.sb-case-comparison>div>p:not(.sb-case-scene-label){font-size:14px}.sb-day-night-figure>figcaption{font-size:10px;gap:5px}}
