/* Contents precedes the article on phones and tablets; desktop keeps its sidebar. */
@media(max-width:900px) {
 .blog-post-page .blog-layout > .blog-toc, .legal-layout > .blog-toc { grid-row: 1; padding: 20px; border: 0; border-radius: 20px; background: var(--public-panel-bg); }
 .blog-post-page .blog-layout > article, .legal-layout > article { grid-row: 2; min-width: 0; }
 .blog-post-page .blog-toc h2, .legal-layout .blog-toc h2 { margin-left: 0; }
}
/* Align checklist and step markers with the complete text block, including wrapped lines. */
body:is(.landing-page,.blog-post-page,.feature-page) .post-list.post-list > li::before { top: 50%; transform: translateY(-50%); }
body:is(.landing-page,.blog-post-page,.feature-page) ul.post-list.post-list > li::after { top: 50%; transform: translateY(-50%) rotate(45deg); }
body:is(.landing-page,.blog-post-page,.feature-page) .post-list > li > p { margin: 0; }
body:is(.landing-page,.blog-post-page,.feature-page) .post-list > li > p + p { margin-top: 12px; }
/* iOS applies a blue tint to buttons unless their text color is explicit. */
body.landing-page [data-blog-filters] .filter-tab { color: #52525b; -webkit-text-fill-color: currentColor; }
body.landing-page [data-blog-filters] .filter-tab.active { color: #fff; }

/* Related device screens share a row at a common height on wider article panels. */
.blog-post-page .blog-screen-group { gap: 24px; }
.blog-post-page .blog-screen-group > * { flex: 0 0 auto; }
.blog-post-page .blog-screen-group > .product-panel { border: 0 !important; box-shadow: none !important; border-radius: 10px; }
@media(max-width:600px) {
 .blog-post-page .blog-screen-group > [data-blog-related] { display: none; }
 .blog-post-page .blog-screen-group { padding: 20px; }
}