/* Keep the six SOP stages in a vertical accordion. The opened stage reads
   top to bottom, with its image below the description and deliverable. */
#workflow .sop-panel-content {
  display: flex;
  flex-direction: column;
  gap: 0;
  padding-right: 0;
}
#workflow .is-active .sop-panel-content { max-height: 1120px; }
#workflow .sop-copy {
  width: 100%;
  padding: 13px clamp(24px, 3vw, 40px) 24px;
}
#workflow .sop-copy h3 { margin-bottom: 15px; }
#workflow .sop-copy p { max-width: 950px; }
#workflow .sop-copy .sop-deliverable { max-width: 950px; }
#workflow .sop-arrow { margin-top: 19px; }
#workflow .sop-photo {
  justify-self: auto;
  width: min(calc(100% - 56px), 960px);
  max-width: none;
  height: auto;
  min-height: 0;
  aspect-ratio: 2.25;
  margin: 0 auto 30px;
  border-radius: 15px;
}
@media (max-width: 700px) {
  #workflow .is-active .sop-panel-content { max-height: 1300px; }
  #workflow .sop-copy { padding: 10px 23px 20px; }
  #workflow .sop-photo {
    width: calc(100% - 44px);
    aspect-ratio: 4 / 3;
    margin: 0 auto 23px;
  }
}
