.visual-detail-list .visual-detail {
  display: block;
  padding: 0;
}

.visual-detail summary {
  display: grid;
  grid-template-columns: minmax(2.5rem, .35fr) minmax(0, 1.65fr) auto;
  gap: clamp(1rem, 3vw, 3rem);
  align-items: start;
  padding: clamp(1.4rem, 2.5vw, 2.4rem) 0;
  cursor: pointer;
  list-style: none;
}

.visual-detail summary::-webkit-details-marker { display: none; }
.visual-detail-copy h3, .visual-detail-copy p { margin: 0; }
.visual-detail-copy p { margin-top: .75rem; max-width: 62ch; }
.visual-detail-action { align-self: center; white-space: nowrap; border-bottom: 1px solid currentColor; padding-bottom: .22rem; }
.visual-detail-action::after { content: " +"; }
.visual-detail[open] .visual-detail-action::after { content: " −"; }
.visual-detail summary:focus-visible { outline: 2px solid #f25a3c; outline-offset: 6px; }

.visual-detail figure {
  margin: 0 0 clamp(1.5rem, 4vw, 3.5rem);
  padding-inline-start: clamp(3.5rem, 9vw, 10rem);
  overflow: hidden;
}
.visual-detail figure img { display: block; width: 100%; height: min(54vw, 34rem); object-fit: cover; }
.visual-detail figure figcaption, .project-review-photo figcaption { margin-top: .75rem; color: var(--muted, #a5a5a2); font-size: .82rem; }

.capability-detail--with-evidence {
  grid-template-columns: minmax(0, 1fr) minmax(18rem, .82fr);
  align-items: start;
}
.capability-detail--with-evidence .project-review-photo { grid-column: 2; grid-row: 1; margin: 0; }
.capability-detail--with-evidence .project-review-photo img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; object-position: 50% 35%; }
.capability-detail--with-evidence .service-brief { grid-column: 1 / -1; }

@media (max-width: 760px) {
  .visual-detail summary { grid-template-columns: 2.5rem minmax(0, 1fr); }
  .visual-detail-action { grid-column: 2; justify-self: start; margin-top: .25rem; }
  .visual-detail figure { padding-inline-start: 0; }
  .visual-detail figure img { height: 72vw; }
  .capability-detail--with-evidence { grid-template-columns: 1fr; }
  .capability-detail--with-evidence .project-review-photo,
  .capability-detail--with-evidence .service-brief { grid-column: 1; grid-row: auto; }
}

@media (prefers-reduced-motion: no-preference) {
  .visual-detail summary { transition: color 180ms ease; }
  .visual-detail summary:hover { color: #fff; }
}