/* Blog list and post pages (07 §7). */
.blog-list__chips { margin-block: var(--space-5); }
.blog-list__grid { margin-top: var(--space-4); }
.pagination { margin-top: var(--space-6); }


.post { max-width: calc(var(--prose) + 2 * var(--space-5)); padding-block: var(--space-6) 0; }
.post__header { margin-bottom: var(--space-5); }
.post__meta { margin-top: var(--space-2); font-size: var(--text-small); color: var(--color-text-muted); }
.post__body { max-width: var(--prose); }
.post__body table { width: 100%; font-size: var(--text-small); }
.post__body th, .post__body td { padding: var(--space-2) var(--space-3); border-bottom: 1px solid var(--color-border); text-align: left; }
.post__body .table-wrap { overflow-x: auto; }

.answer { padding: var(--space-4) var(--space-5); background: var(--color-surface); border-left: 4px solid var(--color-primary); border-radius: var(--radius-sm); }
.answer__title { font-weight: 700; margin-bottom: var(--space-1); }

.inline-test {
  display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-4); max-width: var(--prose);
  margin-top: var(--space-7); padding: var(--space-5);
  background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-md);
}
.inline-test__icon { width: var(--icon-lg); height: var(--icon-lg); color: var(--color-primary); flex: none; }
.inline-test__text { flex: 1 1 240px; }
/* Long tool names must wrap inside the card on 375 px screens, not push the page sideways. */
.inline-test .btn { max-width: 100%; white-space: normal; text-align: center; line-height: 1.3; padding-block: var(--space-2); }

/* Mobile sticky "Test your speed" bar (07 §7) */
.sticky-test {
  position: fixed; z-index: 35; left: var(--space-3); right: var(--space-3); bottom: var(--space-3);
  display: flex; align-items: center; gap: var(--space-2); padding: var(--space-2) var(--space-2) var(--space-2) var(--space-4);
  background: var(--color-surface-raised); border: 1px solid var(--color-border); border-radius: var(--radius-pill); box-shadow: var(--shadow-2);
}
.sticky-test__text { flex: 1 1 auto; font-size: var(--text-small); font-weight: 600; }
@media (min-width: 768px) { .sticky-test { display: none; } }