.blog-search { max-width: 540px; margin: var(--space-lg) auto var(--space-md); }
.blog-featured { display: grid; overflow: hidden; }
@media (min-width: 900px) { .blog-featured { grid-template-columns: 1.05fr 1fr; } }
.blog-featured-image { position: relative; min-height: 260px; background: var(--sky-blue-pale); }
.blog-featured-image img { width: 100%; height: 100%; object-fit: cover; position: absolute; inset: 0; }
.blog-featured-flag { position: absolute; top: 1rem; left: 1rem; }
.blog-featured-body { padding: clamp(1.5rem, 4vw, 2.75rem); display: flex; flex-direction: column; gap: var(--space-sm); justify-content: center; }
.blog-featured-body h2 { font-size: clamp(1.4rem, 3vw, 2rem); margin: 0; }
.blog-featured-body h2 a:hover, .post-card h3 a:hover { color: #1b6fa8; }
.blog-byline { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-top: auto; padding-top: var(--space-sm); border-top: 1px solid var(--sky-blue-border); font-size: .875rem; color: var(--text-secondary); }
.blog-byline i { color: var(--sky-blue); }
.post-card[hidden] { display: none; }
.post-card-image { display: block; }
.post-cover { margin: 0 0 var(--space-lg); border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--shadow-md, 0 10px 30px rgba(16,30,58,.12)); }
.post-cover img { width: 100%; height: auto; display: block; }
.share-row { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; margin-top: var(--space-lg); padding-top: var(--space-md); border-top: 1px solid var(--sky-blue-border); }
.share-label { font-weight: 600; color: var(--text-secondary); margin-right: .25rem; }
.share-btn { width: 2.5rem; height: 2.5rem; border-radius: 50%; display: inline-grid; place-items: center; background: var(--sky-blue-pale); color: var(--navy, #101E3A); border: 1px solid var(--sky-blue-border); transition: transform .2s, background .2s, color .2s; }
.share-btn:hover { background: var(--navy, #101E3A); color: #fff; transform: translateY(-2px); }
.prose pre, .prose code { font-family: ui-monospace, Menlo, Consolas, monospace; font-size: .92em; }
.prose pre { background: var(--navy-deep, #0A1428); color: #e8f2fb; padding: 1rem; border-radius: var(--radius-md); overflow-x: auto; }
.prose table { width: 100%; border-collapse: collapse; display: block; overflow-x: auto; }
.prose th, .prose td { border: 1px solid var(--sky-blue-border); padding: .5rem .75rem; text-align: left; }