/* ---- Engineering journal / article typography ---- */
.blog-filter{display:flex;flex-wrap:wrap;gap:0;margin-top:clamp(28px,3.5vw,44px);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.blog-filter a{padding:12px 16px 12px 0;margin-right:22px;font:400 13.5px/1.4 var(--sans);color:var(--steel);text-decoration:none;border-bottom:2px solid transparent;margin-bottom:-1px}
.blog-filter a:hover{color:var(--copper)}
.blog-filter a[aria-current="page"]{color:var(--ink);border-bottom-color:var(--copper)}
.blog-filter__n{font:400 11.5px/1 var(--mono);color:var(--steel);font-variant-numeric:tabular-nums}

.post-list{border-top:0}
.post-row{display:grid;grid-template-columns:112px minmax(0,1fr) 68px;gap:26px;align-items:start;padding:24px 0;border-bottom:1px solid var(--rule);text-decoration:none}
.post-row--with-thumb{grid-template-columns:112px 116px minmax(0,1fr) 68px}
.post-row:hover .post-row__title,.post-row:focus-visible .post-row__title{color:var(--copper)}
.post-row__date{font:400 12px/1.7 var(--mono);color:var(--steel);font-variant-numeric:tabular-nums}
.post-row__thumb{display:block;width:116px;aspect-ratio:16/10;overflow:hidden;background:var(--white);border:1px solid var(--rule)}
.post-row__thumb img{display:block;width:100%;height:100%;object-fit:cover}
.post-row__main{display:block;min-width:0}
.post-row__cat{display:block;font:500 11.5px/1.4 var(--sans);color:var(--steel);margin-bottom:7px}
.post-row__title{display:block;font:600 clamp(20px,2vw,26px)/1.18 var(--cond);margin-bottom:8px}
.post-row__excerpt{display:block;font:400 14.5px/1.55 var(--sans);color:var(--steel);max-width:68ch}
.post-row__read{font:400 12px/1.7 var(--mono);color:var(--steel);text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.post-row--compact{grid-template-columns:100px minmax(0,1fr) 56px;gap:18px;padding:16px 0}
.post-row--compact .post-row__title{font-size:20px;margin-bottom:0}
.post-list--compact{margin-top:24px;border-top:1px solid var(--rule)}

.pager{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-top:32px;font:400 13px/1.5 var(--sans);color:var(--steel)}
.pager__state{font:400 12px/1.5 var(--mono);font-variant-numeric:tabular-nums}

.post-meta{display:flex;flex-wrap:wrap;gap:22px;margin-top:22px;padding-bottom:20px;border-bottom:1px solid var(--rule);font:400 12.5px/1.5 var(--sans);color:var(--steel)}
.post-meta time{font-family:var(--mono);font-variant-numeric:tabular-nums}
.article h1{font-size:clamp(2.3rem,4.4vw,4rem);line-height:1.04;max-width:24ch}
.article h2{font:600 clamp(1.65rem,2.5vw,2.15rem)/1.1 var(--cond);margin-top:clamp(38px,4vw,58px);max-width:24ch}
.article h3{font:600 clamp(1.25rem,1.9vw,1.55rem)/1.2 var(--cond);margin-top:32px;max-width:30ch}
.article h4,.article h5{font:600 17px/1.3 var(--cond);margin-top:26px}
.article p{font-size:16px;line-height:1.68;max-width:68ch;margin-top:16px}
.article ul,.article ol{margin:18px 0 0;padding-left:23px;max-width:68ch}
.article li{margin-bottom:9px;line-height:1.62}
.article li::marker{color:var(--copper)}
.article strong{font-weight:600}
.article a{text-decoration:underline;text-decoration-color:var(--copper);text-underline-offset:3px}
.article a:hover{color:var(--copper)}
.article blockquote{margin:28px 0;padding:18px 24px;border-left:3px solid var(--copper);background:var(--white);max-width:70ch}
.article blockquote p{margin:0}
.article hr{border:0;border-top:1px solid var(--rule);margin:38px 0}
.article pre{background:var(--white);border:1px solid var(--rule);border-left:3px solid var(--copper);padding:16px 20px;margin:26px 0;overflow-x:auto;max-width:76ch;font:400 13px/1.65 var(--mono);color:var(--ink)}
.article :not(pre)>code{font:400 13.5px/1.4 var(--mono);background:#E3E9E4;padding:1px 5px}
.article img{display:block;width:100%;max-width:76ch;height:auto;margin:26px 0;border:1px solid var(--rule)}
.article-hero{margin:26px 0 10px;max-width:76ch}
.article-hero img{margin:0}
.article-hero figcaption{font:400 11.5px/1.5 var(--mono);color:var(--steel);margin-top:8px}
.article .tablewrap{margin-top:26px;margin-bottom:26px}
.article table{min-width:0}
.article th,.article td{white-space:normal;vertical-align:top}
.article thead th{font:500 12.5px/1.4 var(--sans);color:var(--steel)}
.post-tags{display:flex;gap:8px;flex-wrap:wrap;margin-top:42px;padding-top:20px;border-top:1px solid var(--rule)}
.post-tags span{font:400 11.5px/1.4 var(--mono);color:var(--steel);border:1px solid var(--rule);padding:5px 9px}
.post-nav{display:grid;grid-template-columns:1fr 1fr;gap:26px;margin-top:44px;padding-top:22px;border-top:1px solid var(--rule)}
.post-nav a{text-decoration:none;font:600 18px/1.3 var(--cond)}
.post-nav a:last-child{text-align:right}
.post-nav a span{display:block;font:400 11.5px/1.4 var(--mono);color:var(--steel);margin-bottom:7px}
.post-nav a:hover{color:var(--copper)}

/* ---- Quote form feedback ---- */
.form-msg{padding:12px 16px;border-left:3px solid var(--copper);background:var(--white);font:400 14px/1.5 var(--sans);margin:0 0 18px;grid-column:1/-1}
.form-msg--err{border-left-color:#B3261E;color:#8C1D18}
.hp{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;overflow:hidden!important}

@media (max-width:700px){
  .post-row,.post-row--compact,.post-row--with-thumb{grid-template-columns:1fr;gap:8px;padding:20px 0}
  .post-row__thumb{width:100%;max-width:280px;aspect-ratio:16/9}
  .post-row__read{text-align:left}
  .post-nav{grid-template-columns:1fr}
  .post-nav a:last-child{text-align:left}
  .blog-filter a{margin-right:14px;padding-right:10px}
  .pager{flex-wrap:wrap;justify-content:flex-start}
}