.practice-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:24px}.practice-card{border:0;background:transparent;color:inherit;text-align:left;cursor:pointer;font:inherit}.practice-card img{width:100%;aspect-ratio:1;object-fit:cover;display:block}.practice-card span{display:block;padding:12px 0}.comparison{--split:50%;position:relative;aspect-ratio:4/3;background:#19291f;overflow:hidden}.comparison>img{position:absolute;width:100%;height:100%;object-fit:contain}.comparison>img:nth-child(2){clip-path:inset(0 calc(100% - var(--split)) 0 0)}.comparison-line{position:absolute;left:var(--split);top:0;bottom:0;border-left:2px solid white;pointer-events:none}.comparison input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:ew-resize;touch-action:pan-y}.comparison:focus-within{outline:3px solid #8ea975}.before-label,.after-label{position:absolute;top:12px;background:#15251ed9;padding:6px 10px;color:white;font-size:11px}.before-label{left:12px}.after-label{right:12px}.comparison-nav{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:18px 0}.comparison-nav button{min-height:44px;cursor:pointer;padding:8px 12px}.comparison-nav span{font-size:12px}.comparison-videos,.practice-extras{display:grid;grid-template-columns:1fr 1fr;gap:16px}.comparison-videos figure,.practice-extras figure{margin:0}.comparison-videos img,.comparison-videos video,.practice-extras img,.practice-extras video{width:100%;max-height:450px;object-fit:contain}.practice-extras{margin-top:24px}figcaption{font-size:12px;padding:8px 0}@media(max-width:550px){.practice-grid{grid-template-columns:1fr 1fr;gap:12px}.practice-card span{font-size:14px}.comparison-videos,.practice-extras{grid-template-columns:1fr}}

.practice-stack{margin:0 0 32px;padding-bottom:20px;border-bottom:1px solid #ccd3c9}.practice-stack h3{font-size:18px}.practice-stack-media{background:#17261e}.practice-stack img,.practice-stack video{display:block;width:100%;max-height:560px;object-fit:contain}.practice-stack button{min-width:80px}
/* Spacious before/after imagery, preserving each image's proportions. */
.practice-panel .comparison-videos{gap:clamp(18px,4vw,80px)}
.practice-panel .comparison-videos img,.practice-panel .comparison-videos video{display:block;width:100%;height:min(72svh,900px);max-height:none;object-fit:contain}
.practice-panel .practice-extras img,.practice-panel .practice-extras video,.practice-panel .practice-stack img,.practice-panel .practice-stack video{max-height:78svh}
.practice-panel .comparison{max-height:76svh}
.practice-panel figcaption{font-size:14px;padding:12px 0}
.practice-panel .practice-grid{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:28px}
@media(max-width:550px){
 .practice-panel .practice-grid{grid-template-columns:1fr 1fr;gap:12px}
 .practice-panel .comparison-videos img,.practice-panel .comparison-videos video{height:auto;max-height:65svh}
}
/* Touch dragging updates the reveal; vertical gestures still scroll the page. */
.comparison{touch-action:pan-y pinch-zoom;user-select:none;-webkit-user-select:none}
.comparison>img{-webkit-user-drag:none;pointer-events:none}
.comparison-line{z-index:2}
.comparison-line::after{content:'↔';position:absolute;top:50%;left:0;transform:translate(-50%,-50%);display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:#f6f3ed;color:#25392e;box-shadow:0 2px 12px #0004;font:22px Arial,sans-serif}
@media(pointer:coarse){.comparison input{pointer-events:none}}