.demo-detail-page { background: #fbfbfd; }

.demo-detail-page .article-header h1 { max-width: 940px; }
.demo-detail-page .article-dek { max-width: 780px; }

.demo-video { margin-top: 0; margin-bottom: 18px; }

.demo-video video {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  border-radius: 6px;
  background: #050607;
  object-fit: contain;
}

.demo-video figcaption {
  margin-top: 12px;
  color: #86868b;
  font-size: 12px;
  line-height: 1.55;
}

.demo-facts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 34px;
  border-top: 1px solid rgba(29, 29, 31, .16);
  border-bottom: 1px solid rgba(29, 29, 31, .16);
}

.demo-facts div { padding: 20px 18px 20px 0; }
.demo-facts div + div { padding-left: 18px; border-left: 1px solid rgba(29, 29, 31, .1); }
.demo-facts strong, .demo-facts span { display: block; }
.demo-facts strong { color: #1d1d1f; font-size: 16px; line-height: 1.35; }
.demo-facts span { margin-top: 7px; color: #77777c; font-size: 12px; line-height: 1.55; }

@media (max-width: 680px) {
  .demo-video { width: 100%; }
  .demo-video video { border-radius: 0; }
  .demo-video figcaption { padding: 0 20px; }
  .demo-facts { grid-template-columns: 1fr; }
  .demo-facts div, .demo-facts div + div { padding: 16px 0; border-bottom: 1px solid rgba(29, 29, 31, .1); border-left: 0; }
}
