/* Clinical before/after slider strip · 2026-11-02. Layered after responsive.css. */
.clinical-results{background:#eef2ef}
.clinical-results .section-title{align-items:flex-start;gap:clamp(24px,4vw,90px)}
.clinical-results .section-title h2{max-width:900px}
.clinical-results .section-title>p{max-width:440px;color:#5b6d69}
.clinical-results .case-grid{display:grid;grid-auto-flow:column;grid-auto-columns:clamp(420px,39vw,700px);gap:clamp(18px,2vw,28px);margin:clamp(24px,3vw,42px) 0 0;overflow-x:auto;overflow-y:hidden;overscroll-behavior-inline:contain;scroll-snap-type:x proximity;scroll-padding-inline:0;padding:4px 2px 14px}
.clinical-results .case-grid::-webkit-scrollbar{height:12px}
.clinical-results .case-grid::-webkit-scrollbar-track{background:#dfe8e4;border-radius:999px}
.clinical-results .case-grid::-webkit-scrollbar-thumb{background:#6d318d;border-radius:999px;border:2px solid #dfe8e4}
.clinical-results .case-card,.clinical-results .case-card--feature{display:flex;flex-direction:column;grid-column:auto;min-width:0;overflow:hidden;background:#fff;border:1px solid #d9e4df;border-radius:6px;scroll-snap-align:start;scroll-snap-stop:always;box-shadow:0 8px 26px rgba(21,62,66,.04)}
.clinical-results .case-visual{min-width:0;display:flex;flex-direction:column}
.clinical-results .compare{position:relative;overflow:hidden;isolation:isolate;background:#d5ddda;cursor:ew-resize;touch-action:pan-y;user-select:none;-webkit-user-select:none;aspect-ratio:1.72}
.clinical-results .case-card--smile .compare{aspect-ratio:2.05}
.clinical-results .case-card--lower .compare{aspect-ratio:1.55}
.clinical-results .case-card--upper .compare{aspect-ratio:1.75}
.clinical-results .compare>img,.clinical-results .compare-before>img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;object-position:center center;display:block;max-width:none;pointer-events:none}
.clinical-results .compare-before{position:absolute;inset:0;overflow:hidden;clip-path:inset(0 calc(100% - var(--position)) 0 0);will-change:clip-path}
.clinical-results .compare-line{z-index:2;display:block;position:absolute;top:0;bottom:0;left:var(--position);transform:translateX(-1px);width:2px;background:#fff;box-shadow:0 0 0 1px #0000001f;pointer-events:none}
.clinical-results .compare-line b{width:50px;height:50px;font:22px/1 'Segoe UI',sans-serif;color:#153e42;border:4px solid #fff;background:#fff;border-radius:50%;box-shadow:0 4px 24px #0004;display:grid;place-items:center;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%)}
.clinical-results .before-label,.clinical-results .after-label{z-index:2;position:absolute;bottom:16px;display:inline-block;color:#153e42;background:#fffffff2;border-radius:3px;box-shadow:0 1px 6px #0002;padding:7px 11px;font-size:11px;line-height:1.3;font-weight:700;letter-spacing:.09em;pointer-events:none}
.clinical-results .before-label{left:16px}
.clinical-results .after-label{right:16px}
.clinical-results .range-label{display:flex;flex-direction:column;align-items:flex-start;gap:9px;padding:14px 18px;border-bottom:1px solid #e2e8e5;background:#f6f8f6;min-height:auto;font-size:11px;line-height:1.3;color:#153e42}
.clinical-results .range-label span{max-width:none}
.clinical-results .range-label input{min-width:0;width:100%;height:28px;accent-color:#6d318d;cursor:ew-resize}
.clinical-results .range-label input:focus-visible{outline:3px solid #6d318d;outline-offset:4px;border-radius:6px}
.clinical-results .case-description,.clinical-results .case-card--feature .case-description{flex:1;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;padding:22px 22px 24px}
.clinical-results .case-description .eyebrow{margin:0 0 14px;font-size:10px}
.clinical-results .case-category{color:#6d318d;font-size:11px;font-weight:600;letter-spacing:.10em;text-transform:uppercase;margin-bottom:10px}
.clinical-results .case-description h3{font-size:clamp(24px,2.2vw,36px);line-height:1.12;letter-spacing:-.045em;margin:0 0 14px}
.clinical-results .case-description p{font-size:14px;line-height:1.75;margin:0;color:#526365;max-width:520px}
.clinical-results .case-counter{margin-top:auto;padding-top:20px;font:13px/1.2 'Segoe UI',sans-serif;color:#82928e;letter-spacing:.08em}
.clinical-results .case-counter span{color:#c2cfc7;padding:0 4px}
.clinical-results .cases-footer{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:24px}
.clinical-results .cases-footer .fine-print{max-width:980px;font-size:12px;margin:0;line-height:1.7}
.clinical-results .cases-footer .text-link{white-space:nowrap;flex-shrink:0}
@media(max-width:1100px){.clinical-results .case-grid{grid-auto-columns:minmax(430px,72vw)}}
@media(max-width:760px){.clinical-results .section-title{display:block}.clinical-results .section-title>p{margin-top:14px}.clinical-results .case-grid{grid-auto-columns:86vw;gap:16px;padding-bottom:12px}.clinical-results .case-description,.clinical-results .case-card--feature .case-description{padding:20px}.clinical-results .case-description h3{font-size:clamp(24px,7vw,32px)}.clinical-results .cases-footer{display:block}.clinical-results .cases-footer .text-link{display:inline-block;margin-top:18px}.clinical-results .compare-line b{width:46px;height:46px;font-size:20px}}
@media(max-width:430px){.clinical-results .case-grid{grid-auto-columns:90vw}.clinical-results .before-label,.clinical-results .after-label{bottom:10px;font-size:10px;padding:5px 8px}.clinical-results .before-label{left:10px}.clinical-results .after-label{right:10px}}
@media(prefers-reduced-motion:reduce){.clinical-results .compare-before{will-change:auto}}

/* Single-line carousel navigation. */
.clinical-results .cases-carousel-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;color:#52716b;font-size:12px;margin-top:20px}
.clinical-results .cases-carousel-controls{display:flex;align-items:center;gap:8px}
.clinical-results .cases-carousel-controls button{border:1px solid #bbcfc9;background:#fff;color:#153e42;border-radius:50%;width:44px;height:44px;display:grid;place-items:center;font-size:22px;cursor:pointer;transition:background .2s,border-color .2s}
.clinical-results .cases-carousel-controls button:hover{background:#e4dcec;border-color:#6d318d}
.clinical-results .cases-carousel-controls button:disabled{opacity:.3;cursor:not-allowed}
.clinical-results .cases-carousel-controls button:focus-visible{outline:3px solid #6d318d;outline-offset:3px}
.clinical-results .case-grid{margin-top:12px}
.clinical-results .case-grid:focus-visible{outline:2px solid #6d318d;outline-offset:5px}
@media(max-width:760px){.clinical-results .cases-carousel-toolbar{margin-top:12px}.clinical-results .cases-carousel-controls button{width:38px;height:38px;font-size:19px}}
