/* blog.css — shared styles for the hand-written blog pages
   (growth plan C3, 2026-08-02). Light theme, matching styles.css
   tokens without depending on its class names. */
* { margin: 0; box-sizing: border-box; }
body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  background: #eef2f9; color: #16203a; line-height: 1.7; }
a { color: #0369a1; text-decoration: none; }
a:hover { text-decoration: underline; }
.wrap { max-width: 760px; margin: 0 auto; padding: 26px 22px 60px; }
.top { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 40px; }
.brand { display: flex; align-items: center; gap: 10px; font-weight: 800; font-size: 19px; color: #16203a; }
.brand img { width: 26px; height: 26px; }
.top nav a { margin-left: 18px; font-size: 13.5px; color: #46557a; }
.eyebrow { display: block; font-size: 11.5px; letter-spacing: 0.14em; color: #0284c7;
  font-weight: 700; margin-bottom: 8px; }
h1 { font-size: 32px; letter-spacing: -0.01em; line-height: 1.22; margin-bottom: 10px; }
.byline { color: #66739a; font-size: 13px; margin-bottom: 30px; }
article h2 { font-size: 22px; margin: 34px 0 10px; }
article p, article li { color: #33415f; font-size: 15.5px; margin-bottom: 16px; }
article ul, article ol { padding-left: 24px; margin-bottom: 16px; }
article code { font-family: ui-monospace, 'JetBrains Mono', monospace; font-size: 0.9em;
  background: rgba(37,99,235,0.08); padding: 2px 6px; border-radius: 5px; }
article pre { background: #16203a; color: #dbe7f7; padding: 18px 22px; border-radius: 12px;
  overflow-x: auto; font-size: 13px; line-height: 1.7; margin-bottom: 18px; }
article pre code { background: none; padding: 0; color: inherit; }
.post-list { list-style: none; padding: 0; }
.post-list li { padding: 18px 20px; margin-bottom: 14px; border: 1px solid rgba(37,99,235,0.16);
  border-radius: 12px; background: rgba(255,255,255,0.8); }
.post-list .date { color: #66739a; font: 12.5px ui-monospace, monospace; }
.post-list h2 { font-size: 17px; margin: 4px 0 6px; }
.post-list p { color: #66739a; font-size: 13.5px; margin: 0; }
.foot { margin-top: 46px; color: #66739a; font-size: 12.5px; display: flex;
  justify-content: space-between; gap: 12px; flex-wrap: wrap; }
/* CHAOSS ecosystem link band — full-width row beneath the blog footer. */
.foot-eco { flex-basis: 100%; display: flex; gap: 16px; flex-wrap: wrap; align-items: center;
  margin-top: 10px; padding-top: 10px; border-top: 1px solid rgba(102,115,154,0.2); }
.foot-eco-label { text-transform: uppercase; letter-spacing: 0.04em; font-size: 11px; }
.foot-eco a { color: #66739a; }