.blog-wrap {
  width: min(94%, 1000px);
  margin: 0 auto;
  padding: 30px clamp(16px, 4vw, 60px) 88px;
}
.blog-post { max-width: 890px; }
.blog-crumb, .post-meta, .blog-filters { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; }
.blog-crumb { color: #555e60; font-size: 13px; }
.blog-crumb a:hover, .post-meta a:hover, .blog-back:hover { text-decoration: underline; }
.blog-head { margin: 54px 0 30px; }
.blog-head .eyebrow { display: block; margin-bottom: 14px; }
.blog-head h1 { font-size: clamp(30px, 4.2vw, 58px); letter-spacing: -.035em; line-height: 1.35; overflow-wrap: anywhere; }
.blog-head p { margin: 20px 0; max-width: 52em; line-height: 1.9; }
.blog-filters { gap: 5px; border-block: 1px solid var(--line); padding-block: 10px; }
.blog-filters a { padding: 7px 14px; font-size: 14px; }
.blog-filters [aria-current=page] { background: var(--ink); color: #fff; }
.blog-row { display: grid; grid-template-columns: 10em 1fr; gap: 14px; padding: 22px 0; border-bottom: 1px solid var(--line); }
.blog-row time, .post-meta { color: #535a5d; font-size: 14px; }
.blog-row h2 { font-size: clamp(18px, 2vw, 24px); line-height: 1.55; }
.blog-row h2 a:hover { text-decoration: underline; text-underline-offset: .16em; }
.blog-row p { font-size: 14px; line-height: 1.75; margin: .45em 0 0; }
.post-meta { margin-top: 18px; }
.post-meta a, .post-body a { text-decoration: underline; text-underline-offset: .17em; }
.post-body { border-top: 1px solid var(--line); padding-top: 22px; font-size: 16px; line-height: 1.95; overflow-wrap: anywhere; }
.post-body p { margin: .72em 0; white-space: pre-line; }
.post-body p:empty { margin: 0; }
.post-body h2, .post-body h3, .post-body h4 { margin: 1.65em 0 .5em; line-height: 1.5; }
.post-body ul, .post-body ol { padding-left: 1.6em; }
.post-body ul { list-style: disc; }
.post-body ol { list-style: decimal; }
.post-body blockquote { border-left: 3px solid var(--orange); margin: 20px 0; padding: 4px 1.2em; }
.post-body figure { margin: 24px 0; }
.post-body img { max-width: 100%; max-height: 72vh; height: auto; width: auto; margin: 0 auto; }
.blog-table { overflow-x: auto; margin-block: 18px; }
.blog-table table { width: 100%; border-collapse: collapse; background: #fff; }
.blog-table td { padding: .5em .85em; border: 1px solid var(--line); min-width: 6em; }
.blog-back { display: inline-block; margin-top: 32px; font-weight: 700; }
@media (max-width: 680px) {
  .blog-wrap { width: 100%; padding-inline: 22px; }
  .blog-row { grid-template-columns: 1fr; gap: 4px; }
  .blog-head { margin-top: 32px; }
}