/* blog.css — Journal listing + post. Inherits main.css tokens (dark + gold). */

/* ---- filter ---- */
.blog-filter { display:flex; flex-wrap:wrap; gap:.5rem; justify-content:center; margin:2.2rem 0 1.6rem; }
.blog-chip { padding:.4rem .9rem; border:1px solid var(--border-2); border-radius:999px; background:transparent; color:var(--dim); font-size:.85rem; cursor:pointer; transition:all var(--transition); }
.blog-chip:hover { color:var(--cream); border-color:var(--gold); }
.blog-chip.active { background:linear-gradient(135deg,var(--gold),var(--gold-2)); color:var(--on-gold); border-color:transparent; font-weight:500; }

/* ---- grid ---- */
.blog-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:1.6rem; }
.blog-card { display:flex; flex-direction:column; background:var(--card); border:1px solid var(--border); border-radius:var(--radius-lg); overflow:hidden; transition:border-color var(--transition), transform var(--transition); color:var(--cream); }
.blog-card:hover { border-color:var(--gold); transform:translateY(-4px); color:var(--cream); }
.blog-card-img { aspect-ratio:16/9; overflow:hidden; background:var(--card-2); }
.blog-card-img img { width:100%; height:100%; object-fit:cover; }
.blog-card-noimg { display:grid; place-items:center; color:var(--gold); font-size:2rem; opacity:.4; }
.blog-card-body { padding:1.2rem 1.3rem; display:flex; flex-direction:column; gap:.5rem; flex:1; }
.blog-card-cat { font-size:.68rem; text-transform:uppercase; letter-spacing:.12em; color:var(--gold); }
.blog-card-body h3 { font-size:1.3rem; line-height:1.2; }
.blog-card-body p { color:var(--dim); font-size:.92rem; flex:1; }
.blog-card-meta { color:var(--muted); font-size:.78rem; }

/* ---- post ---- */
.blog-back { color:var(--gold); font-size:.85rem; display:inline-block; margin-bottom:1.2rem; }
.blog-title { font-size:clamp(2rem,4.5vw,3rem); line-height:1.1; margin-bottom:.6rem; }
.blog-meta { color:var(--muted); font-size:.85rem; margin-bottom:1.5rem; }
.blog-cover { border-radius:var(--radius-lg); overflow:hidden; margin-bottom:1.8rem; border:1px solid var(--border); }
.blog-cover img { width:100%; max-height:440px; object-fit:cover; display:block; }
.blog-lead { font-size:1.2rem; color:var(--cream); font-family:var(--font-display); font-style:italic; margin-bottom:1.8rem; }
.blog-body { font-size:1.05rem; line-height:1.8; color:var(--cream); }
.blog-body h2 { font-size:1.6rem; margin:2rem 0 .8rem; color:var(--gold-2); }
.blog-body h3 { font-size:1.25rem; margin:1.5rem 0 .6rem; }
.blog-body p { margin-bottom:1.1rem; color:#d8d2c4; }
.blog-body ul { margin:0 0 1.1rem 1.2rem; list-style:disc; color:#d8d2c4; }
.blog-body li { margin-bottom:.4rem; }
.blog-body a { color:var(--gold); text-decoration:underline; }
.blog-body strong { color:var(--cream); }
:root[data-theme="light"] .blog-body p, :root[data-theme="light"] .blog-body ul { color:#3a352c; }
.blog-cta { margin-top:2.5rem; padding-top:1.5rem; border-top:1px solid var(--border); }