.videos-page { background: var(--bone); }
.videos-main { width: min(100% - 56px, 1240px); margin: 0 auto; padding: 48px 0 88px; }
.videos-intro { padding: 4px 0 38px; border-bottom: 1px solid var(--line); }
.videos-intro .section-meta { margin-bottom: clamp(34px, 6vw, 72px); }
.videos-intro h1 { margin: 0 0 16px; font: 500 clamp(52px, 7vw, 82px)/1 var(--serif); letter-spacing: -.045em; }
.videos-deck { max-width: 560px; margin: 0; font: 400 clamp(17px, 2vw, 21px)/1.5 var(--sans); }
.video-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 40px 24px; padding-top: 36px; }
.video-card { min-width: 0; }
.video-heading { display: grid; grid-template-columns: 30px minmax(0, 1fr); align-items: baseline; gap: 6px 12px; margin-bottom: 12px; }
.video-number { color: var(--graphite); }
.video-heading h2 { min-width: 0; margin: 0; font: 400 clamp(18px, 1.9vw, 22px)/1.3 var(--sans); }
.video-heading a { grid-column: 2; justify-self: start; font: 500 11px/1.3 var(--sans); text-decoration: none; }
.video-frame { position: relative; width: 100%; aspect-ratio: 16 / 9; overflow: hidden; background: #171716; }
.video-frame iframe { position: absolute; inset: 0; display: block; width: 100%; height: 100%; border: 0; }
@media (max-width: 940px) {
  .videos-main { width: calc(100% - 40px); }
}
@media (max-width: 680px) {
  .videos-main { width: calc(100% - 32px); padding: 34px 0 64px; }
  .videos-intro { padding-bottom: 28px; }
  .videos-intro .section-meta { margin-bottom: 42px; }
  .video-list { grid-template-columns: 1fr; gap: 30px; padding-top: 28px; }
  .video-heading h2 { font-size: 19px; }
}
@media (max-width: 360px) {
  .videos-main { width: calc(100% - 28px); }
  .videos-intro h1 { font-size: 46px; }
  .video-heading { grid-template-columns: 24px minmax(0,1fr); gap: 6px 8px; }
}