/* blog.css — KatiFACE Journal styles. Inherits fonts/tokens from style.css. */
.blog-body{font-family:'Switzer',system-ui,sans-serif;color:#323232;background:#fbf8f8;margin:0;line-height:1.7}
.blog-article,.blog-index{max-width:720px;margin:0 auto;padding:7rem 1.5rem 5rem}
.blog-index{max-width:1080px}

.blog-eyebrow{font-size:.72rem;text-transform:uppercase;letter-spacing:.22em;color:#9c7b7b;margin:0 0 1rem}
.blog-title{font-family:'Cormorant',Georgia,serif;font-weight:400;font-size:2.8rem;line-height:1.12;color:#2f3b38;margin:0 0 1rem}
.blog-byline{font-size:.85rem;color:#8a8a8a;border-bottom:1px solid #ece3e3;padding-bottom:1.6rem;margin:0}
.blog-hero{margin:2rem 0 0}
.blog-hero img{width:100%;border-radius:8px;display:block}

.blog-content{font-size:1.1rem}
.blog-lede{font-size:1.3rem;line-height:1.6;color:#4a4a4a;font-family:'Cormorant',Georgia,serif;margin:2rem 0 2.5rem}
.blog-content h2{font-family:'Cormorant',Georgia,serif;font-weight:400;font-size:1.85rem;color:#2f3b38;margin:2.8rem 0 .8rem;line-height:1.2}
.blog-content h3{font-family:'Switzer',sans-serif;font-weight:500;font-size:1.2rem;color:#3a3a3a;margin:1.9rem 0 .5rem}
.blog-content p{margin:0 0 1.2rem}
.blog-content ul,.blog-content ol{margin:0 0 1.4rem;padding-left:1.3rem}
.blog-content li{margin:0 0 .5rem}
.blog-content a{color:#9c5a5a;text-decoration:underline;text-underline-offset:2px}

.blog-fig{margin:2.4rem 0}
.blog-fig img{width:100%;border-radius:8px;display:block}
.blog-fig figcaption{font-size:.78rem;color:#a59;text-align:center;margin-top:.6rem;letter-spacing:.03em}
.blog-fig--proof img{border:1px solid #e7dede}

.blog-faq{margin-top:3.5rem;border-top:1px solid #ece3e3;padding-top:2.2rem}
.blog-faq h2{font-family:'Cormorant',Georgia,serif;font-weight:400;font-size:1.85rem;color:#2f3b38;margin:0 0 1.5rem}
.blog-faq__item{margin-bottom:1.6rem}
.blog-faq__item h3{font-weight:500;font-size:1.08rem;color:#2f3b38;margin:0 0 .4rem}
.blog-faq__item p{margin:0;color:#555}

.blog-cta{margin-top:3.5rem;background:#eef1ee;border-radius:10px;padding:2.4rem 2rem;text-align:center}
.blog-cta p{font-family:'Cormorant',Georgia,serif;font-size:1.3rem;color:#2f3b38;margin:0 0 1.3rem}
.blog-cta__btn{display:inline-block;background:#2f4f4f;color:#fff;text-decoration:none;font-size:.8rem;letter-spacing:.22em;text-transform:uppercase;padding:.95rem 2rem;border-radius:6px}
.blog-cta__btn:hover{background:#3a5f5f}

/* index */
.blog-index__head{text-align:center;margin-bottom:3.5rem}
.blog-index__title{font-family:'Cormorant',Georgia,serif;font-weight:400;font-size:3rem;color:#2f3b38;margin:.5rem 0 1rem;line-height:1.1}
.blog-index__sub{font-size:1.05rem;color:#777;max-width:540px;margin:0 auto}
.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem}
.blog-card{text-decoration:none;color:inherit;background:#fff;border:1px solid #ece3e3;border-radius:10px;overflow:hidden;transition:box-shadow .2s,transform .2s;display:block}
.blog-card:hover{box-shadow:0 12px 30px rgba(80,60,60,.08);transform:translateY(-3px)}
.blog-card__img{aspect-ratio:3/2;overflow:hidden}
.blog-card__img img{width:100%;height:100%;object-fit:cover;display:block}
.blog-card__body{padding:1.4rem 1.3rem 1.6rem}
.blog-card__cat{font-size:.68rem;text-transform:uppercase;letter-spacing:.18em;color:#9c7b7b;margin:0 0 .5rem}
.blog-card__title{font-family:'Cormorant',Georgia,serif;font-weight:400;font-size:1.4rem;line-height:1.2;color:#2f3b38;margin:0 0 .6rem}
.blog-card__excerpt{font-size:.92rem;color:#666;margin:0 0 1rem;line-height:1.55}
.blog-card__more{font-size:.78rem;letter-spacing:.1em;color:#9c5a5a;text-transform:uppercase}

/* footer */
.blog-footer{background:#2f3b38;color:#cdd6d2;margin-top:5rem;padding:3rem 1.5rem}
.blog-footer__inner{max-width:720px;margin:0 auto;text-align:center}
.blog-footer__brand{font-family:'Cormorant',Georgia,serif;font-size:1.6rem;letter-spacing:1px;margin:0 0 1rem;color:#fff}
.blog-footer__brand span{color:#c89}
.blog-footer__med{font-size:.85rem;margin:0 0 1rem}
.blog-footer__med a{color:#e3d3d3}
.blog-footer__disc{font-size:.74rem;color:#8fa39c;line-height:1.6;max-width:560px;margin:0 auto 1.2rem}
.blog-footer__links{font-size:.8rem}
.blog-footer__links a{color:#cdd6d2;text-decoration:none;margin:0 .2rem}

@media(max-width:900px){.blog-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.blog-grid{grid-template-columns:1fr}.blog-title{font-size:2.2rem}.blog-article,.blog-index{padding-top:5.5rem}}
