.blog-shell { position:relative; z-index:10; max-width:1120px; margin:0 auto; padding:4.5rem 2rem 6rem; }
.blog-hero { max-width:760px; padding:1rem 0 4rem; }
.eyebrow { color:var(--accent-1); text-transform:uppercase; letter-spacing:.14em; font-size:.75rem; font-weight:700; margin-bottom:1rem; }
.blog-hero h1 { font-family:var(--font-heading); font-size:clamp(2.6rem,6vw,5rem); line-height:1.03; letter-spacing:-1.8px; margin-bottom:1.25rem; }
.blog-hero > p:last-child { max-width:650px; color:var(--text-secondary); font-size:1.15rem; line-height:1.75; }
.blog-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1.35rem; }
.blog-card { background:rgba(255,255,255,.9); border:1px solid var(--panel-border); border-radius:var(--radius-lg); padding:1.6rem; display:flex; flex-direction:column; min-height:300px; box-shadow:0 8px 24px rgba(36,25,23,.06); }
.blog-card-meta { display:flex; justify-content:space-between; gap:1rem; color:var(--accent-1); text-transform:uppercase; letter-spacing:.08em; font-size:.68rem; font-weight:700; margin-bottom:1.1rem; }
.blog-card-meta time { color:var(--text-secondary); font-weight:500; white-space:nowrap; }
.blog-card h2 { font-family:var(--font-heading); font-size:1.65rem; line-height:1.13; letter-spacing:-.4px; margin-bottom:.9rem; }
.blog-card h2 a { color:var(--text-primary); text-decoration:none; }
.blog-card h2 a:hover { color:var(--accent-1); }
.blog-card p { color:var(--text-secondary); line-height:1.7; font-size:.94rem; flex:1; }
.blog-card-footer { border-top:1px solid var(--panel-border); margin-top:1.4rem; padding-top:1rem; display:flex; justify-content:space-between; gap:1rem; font-size:.78rem; font-weight:700; }
.blog-card-footer span { color:var(--text-secondary); }
.blog-card-footer a { color:var(--accent-1); text-decoration:none; }
.blog-empty { color:var(--text-secondary); padding:2rem 0; }
.blog-article-shell { max-width:850px; }
.blog-breadcrumb { display:flex; gap:.6rem; color:var(--text-secondary); font-size:.82rem; margin-bottom:2.2rem; }
.blog-breadcrumb a { color:var(--accent-1); text-decoration:none; }
.blog-article { background:rgba(255,255,255,.86); border:1px solid var(--panel-border); border-radius:var(--radius-lg); padding:clamp(1.5rem,5vw,4rem); box-shadow:0 10px 30px rgba(36,25,23,.06); }
.article-header { border-bottom:1px solid var(--panel-border); padding-bottom:2rem; margin-bottom:2.4rem; }
.article-header h1 { font-family:var(--font-heading); font-size:clamp(2.35rem,5vw,4.3rem); line-height:1.05; letter-spacing:-1.5px; margin-bottom:1rem; }
.article-excerpt { color:var(--text-secondary); font-size:1.15rem; line-height:1.7; max-width:700px; }
.article-reading { color:var(--text-secondary); font-size:.82rem; margin-top:1.2rem; }
.article-content { color:var(--text-secondary); font-size:1.02rem; line-height:1.86; }
.article-content h2 { color:var(--text-primary); font-family:var(--font-heading); font-size:2rem; line-height:1.15; margin:2.8rem 0 .9rem; }
.article-content h3 { color:var(--text-primary); font-size:1.25rem; margin:2rem 0 .65rem; }
.article-content p { margin:0 0 1.1rem; }
.article-content ul, .article-content ol { margin:0 0 1.3rem 1.5rem; }
.article-content li { margin:.4rem 0; }
.article-content strong { color:var(--text-primary); }
.article-content code { background:#f7ebe7; border-radius:4px; padding:.1rem .3rem; color:var(--text-primary); }
.article-content pre { background:#241917; color:#fff8f6; border-radius:8px; padding:1rem; overflow:auto; margin:1rem 0 1.4rem; }
.article-cta { display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-top:3rem; padding:1.2rem 1.3rem; background:#fff3ee; border:1px solid #edc9bd; border-radius:var(--radius-md); color:var(--text-primary); }
.article-cta .btn-primary { text-decoration:none; white-space:nowrap; }
.blog-footer { position:relative; z-index:10; }
@media (max-width:900px) { .blog-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:620px) { .blog-shell { padding-left:1rem; padding-right:1rem; } .blog-grid { grid-template-columns:1fr; } .article-cta { align-items:flex-start; flex-direction:column; } }