/* Blog article styling (web-optimized, builds on style.css variables) */
.blog-article { max-width: 740px; margin: 0 auto; padding: 2.4rem 1.25rem 3.5rem; }
.age-badge { display:inline-block; background:var(--color-burgundy); color:#fff; font-size:.72rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; padding:4px 12px; border-radius:999px; }
.blog-article h1 { font-size:clamp(1.9rem,5vw,2.7rem); margin:.6rem 0 .3rem; }
.post-sub { font-size:1.2rem; color:var(--color-muted); font-style:italic; margin:0 0 1.6rem; }
.blog-article h2 { font-size:1.5rem; margin:2rem 0 .6rem; border-bottom:2px solid var(--color-gold); padding-bottom:4px; }
.blog-article h3 { color:var(--color-burgundy); margin:1.2rem 0 .3rem; font-size:1.15rem; }
.blog-article p { font-size:1.08rem; line-height:1.75; margin:0 0 1rem; }
.lead-hook { font-size:1.22rem; line-height:1.65; color:#1a2a3d; }
.blog-article ul, .blog-article ol { font-size:1.06rem; line-height:1.7; margin:0 0 1rem; padding-left:1.3rem; }
.blog-article li { margin-bottom:.45rem; }
.verse { background:var(--color-cream-2); border-left:4px solid var(--color-gold); padding:.9rem 1.2rem; margin:1.1rem 0; font-style:italic; font-family:var(--font-serif); font-size:1.22rem; color:var(--color-navy); border-radius:4px; line-height:1.45; }
.verse cite { display:block; font-style:normal; font-size:.85rem; color:var(--color-burgundy); font-weight:700; font-family:var(--font-sans); margin-top:.4rem; }
.callout { background:#faf6ef; border:1px solid var(--color-line); border-radius:8px; padding:1rem 1.3rem; margin:1.3rem 0; }
.mf { border-collapse:collapse; width:100%; font-size:.98rem; margin:1rem 0; }
.mf th, .mf td { border:1px solid var(--color-line); padding:.6rem .8rem; text-align:left; vertical-align:top; }
.mf th { background:var(--color-navy); color:#fff; }
.mf .myth { background:#fbecec; width:42%; }
.mf .fact { background:#eef5ee; }
.cta { background:var(--color-navy); color:#f5ecd9; border-radius:10px; padding:1.5rem 1.6rem; margin:1.7rem 0; }
.cta h2 { color:#fff; border:none; margin-top:0; }
.cta a { color:#e8c879; font-weight:700; }
.cta p { color:#e2ddcf; }
.src { font-size:.92rem; color:#36506e; line-height:1.6; }
.src a { color:#36506e; word-break:break-word; }
.post-foot { margin-top:1.6rem; padding-top:1rem; border-top:1px solid var(--color-line); font-size:.92rem; color:var(--color-muted); }
.share-row { display:flex; gap:.5rem; flex-wrap:wrap; margin-top:.8rem; }
.share-row a { font-size:.85rem; }

/* Blog hub */
.blog-filters { display:flex; flex-wrap:wrap; gap:.5rem; justify-content:center; margin:0 auto 2rem; }
.blog-filter { background:#fff; border:1.5px solid var(--color-line); border-radius:999px; padding:.55rem 1.1rem; font:inherit; font-weight:600; font-size:.95rem; color:var(--color-navy); cursor:pointer; }
.blog-filter.active { background:var(--color-navy); color:#fff; border-color:var(--color-navy); }
.blog-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:1.25rem; max-width:920px; margin:0 auto; }
@media(max-width:720px){ .blog-grid{ grid-template-columns:1fr; } }
.blog-card { background:#fff; border:1px solid var(--color-line); border-radius:var(--radius); box-shadow:var(--shadow-card); padding:1.4rem 1.5rem; }
.blog-card .age-badge { margin-bottom:.6rem; }
.blog-card h3 { margin:.2rem 0 .4rem; color:var(--color-navy); }
.blog-card p { color:var(--color-muted); font-size:.95rem; margin:0 0 .9rem; }
.blog-card .langs { display:flex; flex-wrap:wrap; gap:.4rem; }
.blog-card .langs a { font-size:.85rem; font-weight:600; color:var(--color-gold-dark); border:1px solid var(--color-line); border-radius:999px; padding:.25rem .7rem; }
.blog-card .langs a:hover { border-color:var(--color-gold); }

.copyright{font-size:.8rem;color:var(--color-muted);line-height:1.55;margin-top:1.2rem;padding-top:.9rem;border-top:1px solid var(--color-line);}