blog: add fixing DoH tail latency post + blog infrastructure

New post on reqwest HTTP/2 window tuning and request hedging
(Dean & Barroso's "The Tail at Scale" applied to DNS forwarding).
Covers DoH forwarding p99 improvement and cold recursive
resolution from 2.3s to 538ms.

Also adds blog build infrastructure: index generation script,
draft preview server, hero metrics/before-after CSS, and
normalizes date format across existing posts.

site/blog-template.html

@@ -267,9 +267,105 @@ body::before {
 .blog-footer a:hover { color: var(--amber); }
 
 /* --- Responsive --- */
+/* Hero metrics cards */
+.hero-metrics {
+  display: grid;
+  grid-template-columns: repeat(3, 1fr);
+  gap: 1rem;
+  margin: 2rem 0;
+}
+.metric-card {
+  background: var(--bg-card);
+  border: 1px solid var(--border);
+  border-radius: 6px;
+  padding: 1.25rem;
+  text-align: center;
+}
+.metric-vs {
+  font-family: var(--font-mono);
+  font-size: 0.7rem;
+  letter-spacing: 0.08em;
+  text-transform: uppercase;
+  color: var(--text-dim);
+  margin-bottom: 0.5rem;
+}
+.metric-value {
+  font-family: var(--font-display);
+  font-size: 2.4rem;
+  font-weight: 400;
+  color: var(--amber);
+  line-height: 1.1;
+}
+.metric-label {
+  font-size: 0.82rem;
+  color: var(--text-secondary);
+  margin-top: 0.5rem;
+  line-height: 1.3;
+}
+
+/* Before/after progression */
+.before-after {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 1.5rem;
+  margin: 2rem 0;
+  padding: 1.5rem;
+  background: var(--bg-card);
+  border: 1px solid var(--border);
+  border-radius: 6px;
+}
+.ba-item { text-align: center; }
+.ba-label {
+  font-family: var(--font-mono);
+  font-size: 0.7rem;
+  letter-spacing: 0.08em;
+  text-transform: uppercase;
+  color: var(--text-dim);
+  margin-bottom: 0.3rem;
+}
+.ba-value {
+  font-family: var(--font-display);
+  font-size: 1.8rem;
+  font-weight: 400;
+  color: var(--text-secondary);
+}
+.ba-before {
+  text-decoration: line-through;
+  text-decoration-color: rgba(192, 98, 58, 0.4);
+  color: var(--text-dim);
+}
+.ba-after { color: var(--amber); }
+.ba-arrow { font-size: 1.5rem; color: var(--text-dim); }
+.ba-ref {
+  border-left: 1px solid var(--border);
+  padding-left: 1.5rem;
+}
+
+/* Spike highlight */
+.spike {
+  background: rgba(192, 98, 58, 0.12);
+  padding: 0.15em 0.5em;
+  border-radius: 3px;
+  font-weight: 600;
+  color: var(--amber-dim);
+}
+
+/* Section dividers */
+.article hr {
+  border: none;
+  height: 1px;
+  background: var(--border);
+  margin: 3rem auto;
+  max-width: 120px;
+}
+
 @media (max-width: 640px) {
   .article { padding: 2rem 1.25rem 4rem; }
   .article pre { padding: 1rem; margin-left: -0.5rem; margin-right: -0.5rem; border-radius: 0; border-left: none; border-right: none; }
+  .hero-metrics { grid-template-columns: 1fr; }
+  .before-after { flex-direction: column; gap: 0.75rem; }
+  .ba-ref { border-left: none; border-top: 1px solid var(--border); padding-left: 0; padding-top: 0.75rem; }
 }
 </style>
 </head>

site/blog/index.html

@@ -168,10 +168,17 @@ body::before {
 <main class="blog-index">
   <h1>Blog</h1>
   <ul class="post-list">
+    <li>
+      <a href="/blog/posts/fixing-doh-tail-latency.html">
+        <div class="post-title">Fixing DNS tail latency with a 5-line config and a 50-line function</div>
+        <div class="post-desc">We had periodic 40-140ms DoH spikes from hyper's dispatch channel. The fix was reqwest window tuning and request hedging — Dean & Barroso's "The Tail at Scale," applied to a DNS forwarder. Same ideas took our cold recursive p99 from 2.3 seconds to 538ms.</div>
+        <div class="post-date">April 2026</div>
+      </a>
+    </li>
     <li>
       <a href="/blog/posts/dot-from-scratch.html">
         <div class="post-title">DNS-over-TLS from Scratch in Rust</div>
-        <div class="post-desc">Building RFC 7858 on top of rustls — length-prefix framing, ALPN cross-protocol defense, iPhone dogfooding, and two bugs that only the strict clients caught.</div>
+        <div class="post-desc">Building RFC 7858 on top of rustls — length-prefix framing, ALPN cross-protocol defense, and two bugs that only the strict clients caught.</div>
         <div class="post-date">April 2026</div>
       </a>
     </li>
@@ -185,7 +192,7 @@ body::before {
     <li>
       <a href="/blog/posts/dns-from-scratch.html">
         <div class="post-title">I Built a DNS Resolver from Scratch in Rust</div>
-        <div class="post-desc">How DNS actually works at the wire level — label compression, TTL tricks, DoH implementation, and what I learned building a resolver with zero DNS libraries.</div>
+        <div class="post-desc">How DNS actually works at the wire level — label compression, TTL tricks, DoH, and what surprised me building a resolver with zero DNS libraries.</div>
         <div class="post-date">March 2026</div>
       </a>
     </li>