.results-body { --evidence-ink: #172f46; --evidence-purple: #7562a7; }
.results-page { padding: 4rem 0 5rem; background: #fff; color: var(--evidence-ink); }
.evidence-container { width: min(1120px, calc(100% - 80px)); }
.evidence-intro { margin-bottom: 3.5rem; padding-bottom: 2.5rem; border-bottom: 1px solid var(--line); }
.evidence-intro .section-kicker { margin-bottom: .75rem; }
.evidence-intro h1 { font-size: clamp(2.4rem,4vw,3.75rem); line-height: 1.16; letter-spacing: -.035em; font-weight: 400; }
.evidence-lead { max-width: 45rem; margin: 1.1rem 0 0; color: var(--muted); font-size: 1.0625rem; line-height: 1.75; }
.evidence-context { max-width: 46rem; margin: .7rem 0 0; color: var(--muted); font-size: .875rem; line-height: 1.7; }
.evidence-comparisons { display: grid; gap: 3rem; }
.evidence-comparison { min-width: 0; width: 100%; max-width: 52rem; margin-inline: auto; padding-bottom: 2.5rem; border-bottom: 1px solid var(--line); }
.evidence-heading { display: flex; gap: 1.1rem; align-items: baseline; margin-bottom: 1.3rem; }
.evidence-number { color: var(--purple); flex-shrink: 0; font-size: .875rem; }
.evidence-comparison h2 { margin: 0; font-size: clamp(1.35rem,2.1vw,1.75rem); font-weight: 400; letter-spacing: -.02em; line-height: 1.35; }
.evidence-slider { --reveal: 50%; }
.comparison-frame, .evidence-result-frame { position: relative; width: 100%; aspect-ratio: 4/3; overflow: hidden; border: 1px solid #c5dbe9; border-radius: .5rem; background: #edf2f6; }
.comparison-layer { position: absolute; inset: 0; overflow: hidden; pointer-events: none; }
.comparison-before { z-index: 1; clip-path: inset(0 calc(100% - var(--reveal)) 0 0); }
.comparison-photo { position: absolute; inset: 0; overflow: hidden; }
.comparison-photo[data-lightbox] { pointer-events: auto; cursor: zoom-in; }
.comparison-photo img { display: block; width: 100%; max-width: none; height: 100%; object-fit: cover; object-position: var(--photo-position, 50% 50%); }
/* Display the photo inside the supplied screenshot; keep the original file unchanged. */
.comparison-photo-letterboxed { inset: auto; top: 50%; left: 50%; height: 100%; width: auto; aspect-ratio: 709/400; transform: translate(-50%, -50%); }
.comparison-photo-letterboxed img { position: absolute; top: -142%; left: 0; width: 100%; height: auto; }
.comparison-tag { position: absolute; top: .8rem; padding: .45rem .8rem; border-radius: .25rem; font-size: .875rem; line-height: 1.4; font-weight: 700; letter-spacing: .04em; box-shadow: 0 1px 8px #172f4620; }
.comparison-tag-before { left: .8rem; color: #225479; background: #edf5fb; }
.comparison-tag-after { right: .8rem; color: #6c5793; background: #f3eef8; }
.comparison-divider { position: absolute; z-index: 2; inset-block: 0; left: var(--reveal); width: 3px; transform: translateX(-50%); background: #fff; box-shadow: 0 0 0 1px #172f4633; pointer-events: none; }
.comparison-grip { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; border: 1px solid #7562a7; border-radius: 50%; background: #fff; color: #172f46; box-shadow: 0 2px 10px #172f4633; }
.comparison-grip span { width: 2px; height: 16px; background: currentColor; box-shadow: -5px 0 currentColor, 5px 0 currentColor; }
.comparison-range { position: absolute; z-index: 3; top: 0; bottom: 0; left: var(--reveal); width: 44px; height: 100%; margin: 0; transform: translateX(-50%); opacity: 0; cursor: ew-resize; touch-action: pan-y; }
.comparison-range:disabled { pointer-events: none; }
.comparison-frame:focus-within { outline: 3px solid #287dba; outline-offset: 4px; }
.comparison-controls { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .25rem 1rem; margin-top: .55rem; }
.comparison-instruction { color: var(--muted); font-size: .875rem; line-height: 1.5; }
.comparison-originals { display: flex; flex-wrap: wrap; gap: .25rem 1.1rem; }
.comparison-originals a, .evidence-original-link { display: inline-flex; align-items: center; min-height: 44px; color: #225479; font-size: .875rem; line-height: 1.5; text-decoration: underline; text-underline-offset: .2em; }
.comparison-originals a:hover, .evidence-original-link:hover { color: #6c5793; }
.comparison-originals a:focus-visible, .evidence-original-link:focus-visible { outline: 3px solid #287dba; outline-offset: 4px; }
.evidence-caption { margin: .9rem 0 0; color: var(--muted); font-size: .9375rem; line-height: 1.7; }
.photo-quote { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 1.5rem 2rem; margin-top: 3rem; padding: 2rem; border: 1px solid #cfdeea; border-radius: .6rem; background: var(--ice); }
.photo-quote .section-kicker { margin-bottom: .65rem; }
.photo-quote h2 { max-width: 42rem; font-size: clamp(1.4rem, 2.5vw, 2rem); line-height: 1.3; letter-spacing: -.02em; }
.photo-quote-copy > p:last-child { max-width: 42rem; margin: .85rem 0 0; font-size: 1rem; color: var(--muted); }
.photo-quote .button { max-width: 15rem; text-align: center; }
.evidence-more { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem 1.5rem; margin-top: 2.5rem; }
.evidence-more .button { white-space: normal; text-align: center; }
.evidence-back { margin-bottom: 1.2rem; }
.evidence-gallery-section { width: 100%; max-width: 52rem; margin-inline: auto; }
.evidence-gallery-section + .evidence-gallery-section { margin-top: 3.5rem; }
.evidence-gallery-section > h2 { margin: 0 0 1.5rem; font-size: clamp(1.4rem,2.5vw,2rem); font-weight: 400; line-height: 1.35; }
.evidence-standalone { margin: 0; }
.evidence-result-frame { border-color: #d6cbe5; }
.evidence-result-frame .comparison-photo { cursor: zoom-in; }
.evidence-result-caption { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .25rem 1rem; margin-top: .55rem; color: var(--muted); font-size: .9375rem; line-height: 1.7; }
html.lightbox-open, html.lightbox-open body { overflow: hidden; }
.photo-lightbox { position: fixed; inset: 0; width: min(1120px, calc(100vw - 2rem)); max-width: calc(100vw - 2rem); max-height: calc(100vh - 2rem); max-height: calc(100dvh - 2rem); margin: auto; padding: 0; overflow: hidden; border: 1px solid #708296; border-radius: .9rem; color: #f5f8fb; background: #101923; box-shadow: 0 24px 80px #0007; }
.photo-lightbox:not([open]) { display: none; }
.photo-lightbox::backdrop { background: #08111ae6; backdrop-filter: blur(6px); }
.lightbox-panel { display: flex; flex-direction: column; height: min(900px, calc(100vh - 2rem - 2px)); height: min(900px, calc(100dvh - 2rem - 2px)); }
.lightbox-toolbar { display: flex; flex-shrink: 0; align-items: center; justify-content: space-between; gap: 1rem; padding: .9rem 1rem; }
.lightbox-toolbar h2 { margin: 0; font-size: 1.25rem; line-height: 1.35; font-weight: 400; }
.lightbox-counter { margin: .2rem 0 0; color: #bfd0df; font-size: .875rem; line-height: 1.5; }
.lightbox-button { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: .5rem 1rem; border: 1px solid #7b91a3; border-radius: .4rem; color: #f5f8fb; background: #ffffff0a; font: inherit; font-size: .875rem; line-height: 1.5; cursor: pointer; }
.lightbox-button:hover { background: #ffffff1f; }
.lightbox-button:focus-visible { outline: 3px solid #c4e7ff; outline-offset: 3px; }
.lightbox-close { flex-shrink: 0; width: 44px; padding: 0; font-size: 1.8rem; line-height: 1; }
.lightbox-stage { position: relative; display: flex; flex: 1; align-items: center; justify-content: center; min-height: 0; margin: 0 1rem; overflow: hidden; }
.lightbox-media { position: relative; flex-shrink: 0; max-width: 100%; max-height: 100%; overflow: hidden; }
.lightbox-media img { display: block; width: 100%; height: 100%; object-fit: contain; }
.lightbox-media.is-letterboxed img { position: absolute; top: -142%; left: 0; width: 100%; max-width: none; height: auto; }
.lightbox-media img[hidden], .lightbox-status[hidden] { display: none; }
.lightbox-status { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; margin: 0; padding: 1rem; color: #bfd0df; font-size: .9375rem; line-height: 1.6; text-align: center; }
.lightbox-footer { display: flex; flex-shrink: 0; align-items: center; justify-content: space-between; gap: .75rem 1.5rem; padding: .9rem 1rem 1rem; }
.lightbox-caption { flex: 1; min-width: 0; margin: 0; color: #d5e0e9; font-size: .9375rem; line-height: 1.6; }
.lightbox-nav { display: flex; flex-shrink: 0; gap: .625rem; }
@media (max-width:700px) {
  .results-page { padding: 2.3rem 0 3.5rem; }
  .evidence-container { width: calc(100% - 32px); }
  .evidence-intro { margin-bottom: 2rem; padding-bottom: 1.7rem; }
  .evidence-intro h1 { font-size: clamp(2rem,8vw,2.7rem); }
  .evidence-lead { font-size: 1rem; margin-top: 1rem; }
  .evidence-context { font-size: .875rem; }
  .evidence-comparisons { gap: 2rem; }
  .evidence-heading { gap: .8rem; margin-bottom: 1rem; }
  .comparison-tag { top: .65rem; padding: .4rem .65rem; }
  .comparison-tag-before { left: .65rem; }
  .comparison-tag-after { right: .65rem; }
  .comparison-controls { align-items: flex-start; flex-direction: column; margin-top: .8rem; }
  .evidence-caption { padding-inline: .25rem; }
  .photo-quote { grid-template-columns: 1fr; gap: 1.25rem; margin-top: 2rem; padding: 1.4rem; }
  .photo-quote .button { width: 100%; max-width: none; }
  .evidence-more { align-items: stretch; flex-direction: column; gap: 1rem; margin-top: 1.8rem; }
  .evidence-more .button { width: 100%; }
  .evidence-more .text-link { justify-content: center; text-align: center; }
  .evidence-gallery-section > h2 { padding-inline: .25rem; }
  .lightbox-footer { align-items: stretch; flex-direction: column; }
  .lightbox-nav { width: 100%; }
  .lightbox-nav .lightbox-button { flex: 1; min-width: 0; padding-inline: .5rem; overflow-wrap: anywhere; }
  .lightbox-toolbar h2 { font-size: 1.0625rem; }
}
