.comparison{min-width:0}.comparison-stage{position:relative;width:100%;aspect-ratio:4/5;overflow:hidden;background:var(--surface-alt);border-radius:5px;--position:50%}.comparison-image{display:block;width:100%;height:100%;object-fit:cover;object-position:center}.comparison-before{position:absolute;inset:0;clip-path:inset(0 calc(100% - var(--position)) 0 0)}.comparison-label{position:absolute;top:14px;padding:6px 9px;border-radius:4px;background:rgba(20,29,38,.78);color:#fff;font-size:11px;font-weight:700;pointer-events:none}.before-label{left:14px}.after-label{right:14px}.comparison-divider{position:absolute;top:0;bottom:0;left:var(--position);width:2px;background:white;transform:translateX(-50%);pointer-events:none}.comparison-divider span{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:grid;place-items:center;grid-auto-flow:column;gap:4px;width:42px;height:42px;border-radius:50%;background:#fff;color:#182632;font-size:19px;line-height:1;box-shadow:0 2px 8px #0003}.comparison-divider b{font-weight:400}.comparison-stage input{position:absolute;inset:0;width:100%;height:100%;margin:0;cursor:ew-resize;opacity:0}.comparison-stage:has(input:focus-visible){outline:3px solid var(--accent);outline-offset:4px}.comparison-hint{font-size:12px;color:var(--muted);margin:12px 0 0}.tool{grid-template-columns:1fr auto}.hero-details span{gap:0}@media(max-width:700px){.comparison-stage{aspect-ratio:4/5}.tool{grid-template-columns:1fr}.tool-availability{grid-column:1}}