/* Scoped article layout: screenshots support the prose rather than widening it. */
.groundworks-container { max-width: 1180px; }
.article.groundworks-article { max-width: 720px; display: flow-root; }
.groundworks-article > h2 { clear: both; }
.groundworks-figure { box-sizing: border-box; width: 100%; max-width: 720px; margin: 28px auto 34px; border: 1px solid #cfe1e2; border-radius: 12px; overflow: hidden; background: #f4f8f8; }
.groundworks-figure--aside { float: right; width: 44%; max-width: 320px; margin: 4px 0 20px 28px; }
.groundworks-figure > a { display: block; }
.groundworks-figure img { display: block; width: 100%; height: auto; object-fit: contain; }
.groundworks-figure figcaption { padding: 12px 16px; color: #3f5961; font-size: .85rem; line-height: 1.55; }
.groundworks-figure figcaption a { display: inline-block; margin-left: .3em; }
.groundworks-figure a:focus-visible { outline: 3px solid #0f766e; outline-offset: -3px; }
.groundworks-feature .blog-feature-media { padding: 20px; }
.groundworks-feature .blog-feature-media img { height: auto; min-height: 0; object-fit: contain; }
.groundworks-feature:hover .blog-feature-media img { transform: none; }
@media (max-width: 640px) {
  .groundworks-figure--aside { float: none; width: 100%; max-width: 360px; margin: 24px auto; }
  .groundworks-figure figcaption { padding: 12px 14px; }
  .groundworks-feature .blog-feature-media { min-height: 0; padding: 16px; }
}