.case-comparison{max-width:680px;margin:30px auto;color:#171a1c}
.case-comparison-labels{display:flex;justify-content:space-between;gap:20px;padding:0 2px 12px;font:600 14px/1.4 'DM Sans',sans-serif;letter-spacing:.05em;text-transform:uppercase}
.case-comparison-stage{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:18px;isolation:isolate}
.case-comparison-frame{margin:0;min-width:0}
.case-comparison-image{display:block;width:100%;height:auto;border-radius:12px}
.case-comparison-frame figcaption{font:400 13px/1.5 'DM Sans',sans-serif;margin-top:10px;color:#59616b}
.case-comparison[data-ready="true"] .case-comparison-stage{display:block;aspect-ratio:3 / 4;overflow:hidden;border-radius:14px;background:#252a30;touch-action:pan-y;cursor:ew-resize;box-shadow:0 10px 30px #12182016;--reveal:50%}
.case-comparison[data-ready="true"] .case-comparison-frame{position:absolute;inset:0;overflow:hidden}
.case-comparison[data-ready="true"] .case-comparison-frame figcaption{display:none}
.case-comparison[data-ready="true"] .case-comparison-image{position:absolute;inset:0;width:100%;height:100%;max-height:none;object-fit:contain;border-radius:0;user-select:none;pointer-events:none}
.case-comparison[data-ready="true"] .case-comparison-before{z-index:2;clip-path:inset(0 calc(100% - var(--reveal)) 0 0)}
.case-comparison[data-ready="true"] .case-comparison-before .case-comparison-image{transform:translate(-2%,2%) scale(1.06)}
.case-comparison[data-ready="true"] .case-comparison-after{z-index:1}
.case-comparison[data-ready="true"] .case-comparison-after .case-comparison-image{transform:translate(2%,-2%) scale(1.06)}
.case-comparison-divider{display:none}
.case-comparison[data-ready="true"] .case-comparison-divider{display:block;position:absolute;left:var(--reveal);top:0;bottom:0;z-index:3;width:2px;background:#fff;box-shadow:0 0 0 1px #171a1c36;pointer-events:none;transform:translateX(-50%)}
.case-comparison-handle{position:absolute;left:50%;top:50%;display:grid;place-items:center;width:48px;height:48px;transform:translate(-50%,-50%);border:2px solid #fff;border-radius:50%;background:#d90010;color:#fff;box-shadow:0 3px 12px #0005}
.case-comparison-handle svg{width:26px;height:26px}
.case-comparison-range{position:absolute;inset:0;z-index:4;display:block;width:100%;height:100%;margin:0;opacity:0;pointer-events:none}
.case-comparison-range[hidden]{display:none}
.case-comparison-stage:focus-within{outline:none}
.case-comparison-help{margin:14px 0 6px;font:400 14px/1.5 'DM Sans',sans-serif;color:#59616b;text-align:center}
.case-comparison-note{margin:0;font:400 12px/1.5 'DM Sans',sans-serif;color:#59616b;text-align:center}
.case-comparison-controls[hidden]{display:none}
.case-comparison-ends{display:flex;justify-content:space-between;gap:16px;margin-top:12px}
.case-comparison-ends button{appearance:none;border:1px solid #c9cdd2;border-radius:7px;background:#fff;color:#171a1c;padding:9px 12px;font:600 13px/1.3 'DM Sans',sans-serif;cursor:pointer}
.case-comparison-ends button:hover{border-color:#171a1c}
.case-comparison-ends button:focus-visible{outline:3px solid #d90010;outline-offset:3px}
.case-story{max-width:680px;margin:30px auto 0;font:400 17px/1.7 'DM Sans',sans-serif}
.case-story h2{font:400 32px/1.1 'Bebas Neue',sans-serif;color:#171a1c;margin:28px 0 12px}
.case-story .actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:20px}
.case-story .actions a{display:inline-block;border:1px solid #171a1c;border-radius:7px;padding:11px 16px;color:#171a1c;text-decoration:none;font:600 14px/1.4 'DM Sans',sans-serif}
.case-story .actions a:last-child{background:#d90010;border-color:#d90010;color:#fff}
@media(max-width:700px){.case-comparison{margin:24px auto}.case-comparison-stage{grid-template-columns:1fr}.case-comparison-labels{font-size:12px}.case-comparison-handle{width:44px;height:44px}.case-story{font-size:16px}.case-story h2{font-size:28px}.case-story .actions a{flex:1 1 auto;text-align:center}}
@media(prefers-reduced-motion:reduce){.case-comparison *{animation:none!important;transition:none!important}}

.case-comparison-stage,.case-comparison-stage *{user-select:none;-webkit-user-select:none;-webkit-user-drag:none}.case-comparison-stage img{outline:none!important}.case-comparison-stage:has(.case-comparison-range:focus-visible) .case-comparison-handle{outline:2px solid #171a1c;outline-offset:3px}