.gallery-intro {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  border-bottom: 1px solid #c4c9c2;
  padding-bottom: 18px;
  margin: 50px 0 32px;
  font-size: .875rem;
  color: #52605d;
}
.gallery-intro > span:first-child { font-weight: 700; letter-spacing: .12em; color: #172024; }
.evidence-gallery { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 52px 36px; }
.evidence-case { min-width: 0; }
.evidence-heading { display: flex; align-items: center; gap: 17px; margin-bottom: 22px; }
.case-number { font-family: 'Playfair Display', Georgia, serif; font-size: 2.4rem; line-height: 1; color: #a66749; }
.evidence-heading h3 { font-size: 1.12rem; line-height: 1.4; font-weight: 600; margin: 0 0 5px; }
.evidence-heading p { color: #59665f; font-size: .875rem; line-height: 1.5; margin: 0; }
.evidence-pair { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.evidence-pair figure { margin: 0; min-width: 0; }
.gallery-photo, .gallery-compare {
  display: block;
  position: relative;
  width: 100%;
  height: auto;
  aspect-ratio: var(--photo-ratio);
  overflow: hidden;
  background: #d9dbd5;
}
.gallery-photo { cursor: zoom-in; }
.gallery-photo img, .gallery-compare img { width: 100%; height: 100%; object-fit: contain; object-position: center; }
.gallery-compare .compare-before { background: #d9dbd5; }
.gallery-compare .badge { top: 12px; padding: 7px 9px; font-size: .75rem; }
.gallery-compare .before-badge { left: 10px; }
.gallery-compare .after-badge { right: 10px; }
.gallery-compare .handle { width: 40px; height: 40px; }
.gallery-compare input { margin: 0; touch-action: pan-y; }
.gallery-compare input:focus-visible { opacity: 0; }
.gallery-compare:has(input:focus-visible) { outline: 3px solid #a66749; outline-offset: 4px; }
.gallery-compare:has(input:focus-visible) .handle { outline: 3px solid #a66749; }
.evidence-pair figcaption { padding-top: 13px; line-height: 1.5; }
.figure-label { display: block; font-size: .875rem; font-weight: 600; }
.photo-links { display: flex; gap: 5px 14px; flex-wrap: wrap; margin-top: 6px; font-size: .875rem; color: #52605d; }
.photo-links a { padding: 4px 0; text-decoration: underline; text-underline-offset: 4px; text-decoration-color: #9ca69e; }
.photo-links a:hover { color: #172024; text-decoration-color: currentColor; }
.photo-zoom:focus-visible, .viewer-close:focus-visible { outline: 3px solid #a66749; outline-offset: 4px; }
.results-section .example-note { margin-top: 40px; }
.hero-visual .hero-card:not(.hero-card-before) { height: calc(100% - 32px); width: auto; aspect-ratio: 1048 / 1501; }
.hero-visual .hero-card img { object-fit: contain; object-position: center; }
.hero-visual .hero-card-before { height: auto; aspect-ratio: 758 / 1086; }
.photo-viewer {
  width: min(1000px, calc(100vw - 32px));
  max-width: none;
  max-height: calc(100dvh - 32px);
  padding: 0;
  border: 1px solid #ffffff30;
  background: #172024;
  color: #fff;
  box-shadow: 0 24px 80px #0008;
}
.photo-viewer::backdrop { background: #101719eb; }
.viewer-bar { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 12px 20px; }
.viewer-bar p { margin: 0; font-size: 1rem; line-height: 1.4; }
.viewer-close { display: inline-flex; align-items: center; gap: 14px; min-height: 44px; padding: 8px 12px; border: 1px solid #aab6b0; background: transparent; color: #fff; font: inherit; cursor: pointer; }
.viewer-close span { font-size: 1.5rem; line-height: 1; }
.photo-viewer > img { width: 100%; height: calc(100dvh - 116px); object-fit: contain; }
html:has(.photo-viewer[open]) { overflow: hidden; }
@media (max-width: 1050px) {
  .evidence-gallery { gap: 42px 24px; }
  .evidence-pair { gap: 12px; }
}
@media (max-width: 850px) {
  .evidence-gallery { grid-template-columns: 1fr; gap: 48px; }
  .evidence-pair { gap: 20px; }
}
@media (max-width: 540px) {
  .evidence-pair { grid-template-columns: 1fr; gap: 26px; }
  .evidence-heading { gap: 14px; }
  .gallery-intro { margin-top: 30px; gap: 12px; }
  .gallery-intro > span:first-child { letter-spacing: .06em; }
  .gallery-compare .badge { font-size: .875rem; }
  .photo-links a { min-height: 44px; display: inline-flex; align-items: center; }
  .photo-viewer { width: calc(100vw - 16px); max-height: calc(100dvh - 16px); }
  .viewer-bar { padding: 10px; gap: 10px; }
  .viewer-bar p { font-size: .875rem; }
  .viewer-close { gap: 8px; }
  .photo-viewer > img { height: calc(100dvh - 100px); }
}