/* Full-width case-study showcase with the shared page gutters and controls. */
.clairol-case #design .clairol-showcase{display:block}
.clairol-case .clairol-showcase>.feature-copy{max-width:820px;margin:0 0 25px}
.clairol-case .clairol-slideshow{width:100%;margin:0 auto;padding:0;background:none;max-width:calc((100svh - 140px) * 1436 / 1252)}
.clairol-case #final-designs .clairol-slideshow{max-width:calc((100svh - 140px) * 2945 / 1935)}
.clairol-case .clairol-slideshow figcaption{margin-bottom:12px}
.clairol-case .clairol-final-stage{aspect-ratio:2945/1935;background:#fff}
.clairol-case .clairol-process-stage{aspect-ratio:1436/1252;background:#fff}
body.approved-case-template .clairol-slideshow .wireframe-layer{object-fit:contain;object-position:left top}
@media(max-width:750px){.clairol-case .clairol-slideshow,.clairol-case #final-designs .clairol-slideshow{max-width:100%}}

.clairol-case #photo-setup .clairol-slideshow,.clairol-case #controls-saved-looks .clairol-slideshow{max-width:calc((100svh - 140px) * 792 / 612)}
.clairol-case .clairol-photo-full-stage{aspect-ratio:792/612;background:#fff}
@media(max-width:750px){.clairol-case #photo-setup .clairol-slideshow,.clairol-case #controls-saved-looks .clairol-slideshow{max-width:100%}}
