/* Scoped to blog.html and post.html; no changes to other public pages. */
.blog-page { background: var(--color-bg); color: var(--color-text); }
.blog-page .post-main, .blog-page .post-main :is(h2,h3,p,ul,ol),
.blog-page :is(.blog-title,.blog-excerpt,.toc-title,.post-meta) { color: var(--color-text); }
.blog-page :is(.blog-card,.box,.toc-box) { background: var(--color-surface); border-color: var(--color-border); }
.blog-page :is(.box h3,#toc a) { color: var(--color-text); }
.blog-page .blog-card > a { display: block; height: 100%; color: inherit; text-decoration: none; }
.blog-page .btn-read { display: inline-block; }
.blog-page .post-layout { grid-template-columns: minmax(0,2fr) minmax(0,1fr); }
.blog-page :is(.post-main,.post-aside,.blog-card) { min-width: 0; overflow-wrap: anywhere; }
.blog-page #post-cover-aside { width: 100%; height: auto; border-radius: 12px; }
.blog-page .post-nav { display: flex; flex-wrap: wrap; gap: 1rem; }
.blog-page .prose :is(h2,h3) { scroll-margin-top: 6rem; }
.blog-page a:focus-visible, .blog-page button:focus-visible { outline: 3px solid var(--color-link); outline-offset: 3px; }
.blog-page .navbar-wrap { position: relative; z-index: 10; }
@media(max-width:900px) { .blog-page .post-layout { grid-template-columns: minmax(0,1fr); } }
@media(max-width:768px) {
 .blog-page .main-nav { max-width: calc(100vw - 32px); }
 .blog-page .brand-name { font-size: 1rem; }
 .blog-page .blog-grid { grid-template-columns: minmax(0,1fr); }
}
.blog-page .navbar { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.blog-page .prose ul { list-style: disc; }
.blog-page .prose ol { list-style: decimal; }
.blog-page .post-nav .cta { white-space: normal; max-width: 100%; overflow-wrap: anywhere; }

/* One soft editorial accent for all listing cards. */
.blog-page #blog-list .blog-card { --read-bg:#e4eee5; --read-ink:#24543d; }
:root[data-theme="dark"] .blog-page #blog-list .blog-card { --read-bg:#293e32; --read-ink:#c4e1cd; }
.blog-page #blog-list .blog-card .btn-read { display:inline-block; padding:8px 12px; border:0; border-radius:6px; background:var(--read-bg); color:var(--read-ink); font-size:14px; line-height:1.4; }
.blog-page #blog-list .blog-card > a:is(:hover,:focus-visible) .btn-read { background:var(--read-bg); color:var(--read-ink); text-decoration:underline; text-underline-offset:3px; }

/* Blog listing header spacing; post.html does not use the post-page body class. */
.post-page.blog-page .navbar {
  min-height:88px;
  padding-block:16px;
  gap:26px;
}
.post-page.blog-page .navbar .brand { gap:10px; }
.post-page.blog-page .navbar .main-nav { gap:23px; }
.post-page.blog-page .navbar .main-nav a { min-height:44px; display:inline-flex; align-items:center; }
.post-page.blog-page .navbar .theme-toggle { width:44px; height:44px; margin:0; }
.post-page.blog-page .post-hero { border-bottom-color:var(--color-border); }
@media(max-width:768px) {
  .post-page.blog-page .navbar { min-height:76px; padding:12px 22px; }
  .post-page.blog-page .navbar-toggle { width:44px; height:44px; padding:0; }
  .post-page.blog-page .navbar .main-nav { top:100%; right:22px; gap:15px; }
}

/* Final scoped editorial finish for the article model and listing. */
.blog-page:not(.post-page) .post-hero { border-bottom-color:var(--color-border); }
.post-page.blog-page #blog-list { padding-bottom:2rem; }
.blog-page .post-nav { align-items:center; justify-content:space-between; margin-top:24px; }
.blog-page .post-nav :is(.post-back-link,.post-next-link) { color:#17654c; background:none; border:0; padding:8px 0; text-decoration:none; line-height:1.6; }
.blog-page .post-back-link { font-size:14px; }
.blog-page .post-next-link { grid-template-columns:minmax(0,1fr) auto; column-gap:14px; max-width:60%; margin-left:auto; }
.blog-page .post-next-label { grid-column:1; font-size:10px; letter-spacing:1.4px; color:var(--color-text); }
.blog-page .post-next-title { grid-column:1; font-size:15px; }
.blog-page .post-next-arrow { grid-column:2; grid-row:1 / 3; align-self:center; font-size:20px; }
.blog-page .post-nav a:is(:hover,:focus-visible) { text-decoration:underline; text-underline-offset:4px; }
@media(max-width:650px) { .blog-page .post-nav { align-items:flex-start; } .blog-page .post-next-link { max-width:100%; width:100%; margin-left:0; } }

:root[data-theme="dark"] .blog-page .post-nav :is(.post-back-link,.post-next-link) { color:#98d2b3; }

/* Reserve only the loading state; loaded layouts retain their approved geometry. */
.post-page.blog-page > main.container { width:100%; }
#blog-list[aria-busy="true"], #post-content[aria-busy="true"] { min-height:100svh; }
.blog-page:has(#post-content[aria-busy="true"]) #post-subtitle { min-height:1lh; }
@media(max-width:650px) {
  .blog-page:has(#post-content[aria-busy="true"]) :is(.breadcrumb,#post-title,#post-subtitle) { min-height:2lh; }
}