/* Rebooko: a product story with readable, uncropped interface captures. */
.cs-hero { aspect-ratio: 1423 / 728; border-radius: 12px; }
.cs-hero img { height: auto; object-fit: contain; }
.facts { grid-template-columns: repeat(3, minmax(0,1fr)); }
.fact { border-radius: 0; border-width: 1px 0 0; background: transparent; padding: 22px 8px 12px 0; }
.fact span { max-width: 23ch; }
.cs-list { gap: 0; }
.cs-item { border: 0; border-top: 1px solid var(--hairline); border-radius: 0; padding: 28px 0; background: transparent; }
.cs-item .ci { border-radius: 0; background: transparent; justify-content: start; width: 34px; padding: 0; }
.cs-item b { font-size: clamp(20px,2.5vw,25px); line-height: 1.25; margin-bottom: 12px; }
.cs-item span { font-size: 17px; line-height: 1.75; color: var(--ink-muted); }
.gallery.gallery--screens { margin: 24px 0 48px; }
.gallery.gallery--screens figure { border-radius: 8px; background: var(--paper); }
.gallery.gallery--screens img { aspect-ratio: 1423 / 728; }
.gallery.gallery--screens img[src$="/studio.webp"] { aspect-ratio: 1280 / 720; }
.gallery.gallery--screens img[src$="/mobile.webp"] { aspect-ratio: 390 / 844; }
.gallery.gallery--screens figcaption { background: var(--paper); font-size: 13px; padding: 14px 18px; color: var(--grey-mid); }
.gallery .gallery-zoom { font-size: 10px; bottom: 10px; right: 10px; }
.cs-screen--mobile { max-width: 390px; margin-inline: auto !important; }
.cs-screen--mobile img { max-width: 390px; margin-inline: auto; }
@media (min-width: 1120px) {
  .cs-screen:not(.cs-screen--mobile) { width: 1000px; margin-left: -120px; }
}
@media (max-width: 767px) {
  .facts { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .fact { padding-top: 16px; }
  .cs-item { gap: 8px; padding: 24px 0; }
  .cs-item .ci { width: 27px; }
  .gallery.gallery--screens { margin: 14px 0 30px; }
  .gallery.gallery--screens figcaption { padding: 12px; }
}