/* The Edison log (blog). Builds on site.css: same palette, fonts, LCARS panels and pills. Reading comfort first:
   a 68-character column, 19px text, generous line height. */
.blog-head { padding-top: 56px; padding-bottom: 28px; max-width: 820px; }
.blog-head h1 { margin-top: 12px; font-weight: 800; font-size: clamp(36px, 7vw, 60px); letter-spacing: -.01em; }
.blog-head p { margin-top: 12px; color: var(--soft); font-size: 19px; }
.blog-list { padding-bottom: 40px; }
.cards { display: grid; gap: 14px; }
@media (min-width: 820px) { .cards { grid-template-columns: 1fr 1fr; } }
.post-card { display: block; text-decoration: none; padding: 20px 20px 22px 24px; border-radius: 0 18px 18px 0; border-left: 10px solid var(--violet);
  background: rgba(34, 23, 79, .82); transition: background .15s; }
.post-card:nth-child(3n+2) { border-left-color: var(--cyan); } .post-card:nth-child(3n+3) { border-left-color: var(--pink); }
.post-card:hover { background: var(--tint2); }
.post-card .mono { color: var(--amber); font-size: 14px; }
.post-card h3 { margin-top: 8px; font-size: 23px; line-height: 1.2; }
.post-card p:last-child { margin-top: 8px; color: var(--soft); }

.post { padding-top: 48px; padding-bottom: 40px; }
.post-head, .prose, .post .toc, .post .cta, .author, .more { max-width: 760px; margin-left: auto; margin-right: auto; }
.crumbs { font-size: 14px; color: var(--soft); }
.crumbs a { color: var(--cyan); text-decoration: none; }
.post-head h1 { margin-top: 14px; font-weight: 800; font-size: clamp(34px, 6.4vw, 54px); letter-spacing: -.01em; text-wrap: balance; }
.dek { margin-top: 14px; font-size: 21px; color: var(--soft); }
.byline { margin-top: 16px; font-size: 14px; color: var(--amber); }
.toc { margin-top: 30px; }
.toc ol { margin: 0; padding-left: 22px; display: grid; gap: 6px; }
.toc a { color: var(--text); }
.prose { margin-top: 30px; font-size: 19px; line-height: 1.7; }
.prose > * + * { margin-top: 1.05em; }
.prose h2 { margin-top: 2em; font-size: clamp(26px, 4.6vw, 34px); font-weight: 800; line-height: 1.15; }
.prose h3 { margin-top: 1.6em; font-size: 23px; }
.prose a { color: var(--cyan); text-underline-offset: 3px; }
.prose ul, .prose ol { padding-left: 1.3em; }
.prose li + li { margin-top: .4em; }
.prose strong { color: #fff; }
.prose code { font-family: var(--mono); font-size: .9em; background: var(--tint); padding: 2px 6px; border-radius: 6px; }
.prose blockquote { margin-left: 0; padding: 14px 20px; border-left: 8px solid var(--pink); border-radius: 0 16px 16px 0; background: rgba(15, 10, 46, .85); }
.prose blockquote p { font-style: italic; font-size: 21px; }
.tbl { overflow-x: auto; }
.prose table { width: 100%; border-collapse: collapse; font-size: 17px; }
.prose th { text-align: left; font: 700 14px/1.2 var(--cond); letter-spacing: .12em; text-transform: uppercase; color: var(--cyan); }
.prose th, .prose td { padding: 10px 12px; border-bottom: 1px solid var(--line); }
.prose .num { font-family: var(--mono); color: var(--amber); }
.callout { padding: 16px 20px; border-radius: 16px; background: rgba(34, 23, 79, .85); box-shadow: inset 0 0 0 1px var(--line); }
.callout b { color: var(--amber); font-family: var(--cond); letter-spacing: .1em; }
.cta { margin-top: 44px; }
.cta h2 { font-size: clamp(26px, 5vw, 36px); font-weight: 800; }
.cta p { margin-top: 8px; color: var(--soft); font-size: 18px; }
.author { margin-top: 30px; padding: 18px 20px; border-radius: 16px; background: rgba(15, 10, 46, .85); box-shadow: inset 0 0 0 1px var(--line); }
.author .mono { color: var(--violet); font-size: 13px; margin-bottom: 6px; }
.author p:last-child { color: var(--soft); }
.more { margin-top: 44px; }
.more h2 { font-size: 26px; margin-bottom: 14px; }
.nav a[aria-current="page"] { color: var(--text); background: var(--tint); }
.foot a { color: var(--cyan); }
