.media-case { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 70px; padding-bottom: 64px; border-bottom: 1px solid var(--line); align-items: start; }
.media-case-meta { display: flex; justify-content: space-between; gap: 20px; color: var(--muted); font-size: 11px; margin-bottom: 24px; }
.media-case h2 { font: 28px/1.5 "Songti SC",serif; color: #a43e75; margin-bottom: 22px; }
.media-case-copy > p:not(.media-case-meta):not(.media-metrics-note) { font-size: 14px; line-height: 1.95; }
.media-case dl { margin: 30px 0; font-size: 13px; line-height: 1.9; }
.media-case dl > div { margin-bottom: 20px; }
.media-case dt { color: #a43e75; margin-bottom: 8px; }
.media-case dd { margin: 0; }
.media-metrics { display: flex; gap: 38px; border-top: 1px solid var(--line); padding-top: 24px; }
.media-metrics span { display: grid; gap: 8px; font-size: 12px; color: var(--muted); }
.media-metrics b { font: 29px var(--serif); color: #365b73; }
.media-case-copy .media-metrics-note { font-size: 11px; line-height: 1.8; margin-top: 20px; color: var(--muted); }
.media-note { width: 100%; max-width: 460px; justify-self: end; }
.media-note > button { height: 530px; overflow: hidden; border: 1px solid #e3eff7; }
.media-note > button img { max-height: none; height: auto; }
.media-note figcaption { align-items: center; justify-content: space-between; gap: 12px; }
.media-note .media-full-note { width: auto; padding: 7px 0; color: #a43e75; cursor: pointer; font-size: 12px; }
#lightbox[data-kind="media"][open] { display: block; overflow-y: auto; padding-top: 70px; }
#lightbox[data-kind="media"] figure { display: block; width: min(620px,100%); height: auto; margin: auto; }
#lightbox[data-kind="media"] img { display: block; width: 100%; max-height: none; height: auto; }
#lightbox[data-kind="media"] figcaption { padding: 25px 0; }
#lightbox[data-kind="media"] > button { position: fixed; }
@media (max-width: 820px) {
  .media-case { grid-template-columns: minmax(0,1fr); gap: 30px; padding-bottom: 40px; }
  .media-case h2 { font-size: 25px; }
  .media-case dl { margin: 24px 0; }
  .media-note { justify-self: center; max-width: 460px; }
  .media-note > button { height: 420px; }
  .media-metrics { gap: 34px; }
  #lightbox[data-kind="media"] { padding-bottom: 70px; }
}