/* Общие стили блога */
.blog-hero{padding:32px 0 40px;text-align:center}
.blog-hero h1{font-size:clamp(32px,6vw,48px);margin:0 0 10px;font-weight:700;line-height:1.15}
.blog-hero h1 em{color:var(--accent);font-style:normal}
.blog-hero p{color:var(--muted);font-size:18px;margin:0}
.blog-content{max-width:720px;margin:0 auto;padding:0 20px 80px}
.blog-nav{margin-bottom:40px}
.blog-nav a{display:block;padding:14px 20px;background:var(--surface-2);border-radius:12px;margin-bottom:12px;color:var(--ink);text-decoration:none;font-weight:600;transition:background .2s}
.blog-nav a:hover{background:var(--line)}
.blog-post h2{font-size:28px;margin:30px 0 16px;font-weight:700}
.blog-post h3{font-size:22px;margin:24px 0 12px;font-weight:700}
.blog-post p{line-height:1.7;margin:0 0 16px}
.blog-post .meta{display:flex;align-items:center;gap:10px;font-size:12px;letter-spacing:.08em;text-transform:uppercase;font-weight:700;color:var(--muted);margin-bottom:14px}
.blog-post .meta svg{width:16px;height:16px;stroke-width:2;stroke:currentColor;fill:none;stroke-linecap:round;stroke-linejoin:round}
.blog-post .meta .sep{color:var(--accent);font-weight:700}
.blog-cards{display:grid;gap:20px}
.bcard{display:block;padding:24px;background:var(--surface);border:1px solid var(--line);border-radius:16px;text-decoration:none;color:inherit;transition:border-color .2s,box-shadow .2s}
.bcard:hover{border-color:var(--accent);box-shadow:var(--shadow)}
.bcard-emo{font-size:42px;display:block;margin-bottom:12px}
.bcard-meta{display:flex;align-items:center;gap:8px;font-size:12px;letter-spacing:.08em;text-transform:uppercase;font-weight:700;color:var(--muted);margin-bottom:10px}
.bcard-meta svg{width:14px;height:14px;stroke-width:2;stroke:currentColor;fill:none;stroke-linecap:round;stroke-linejoin:round}
.bcard h2{font-size:20px;margin:0 0 8px;font-weight:700}
.bcard p{color:var(--muted);margin:0 0 14px;line-height:1.5}
.bcard-more{display:inline-flex;align-items:center;gap:6px;color:var(--accent);font-weight:600;font-size:14px}
.bcard-more svg{width:16px;height:16px;stroke-width:2;stroke:currentColor;fill:none;stroke-linecap:round;stroke-linejoin:round}
@media(max-width:760px){.blog-hero{padding:20px 0 28px}.blog-content{padding:0 20px 60px}}

/* --- полировка поста --- */
.blog-post{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:28px 22px;box-shadow:var(--shadow)}
.blog-post em{color:var(--accent);font-style:normal}
.blog-post ul,.blog-post ol{margin:0 0 16px;padding-left:22px;line-height:1.7}
.blog-post li{margin-bottom:8px}
@media(max-width:760px){.blog-post{padding:22px 16px}}

/* выравнивание мета-групп */
.blog-post .meta .m,.bcard-meta .m{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.blog-post .meta{flex-wrap:wrap;row-gap:6px}
.bcard-meta{display:inline-flex;align-items:center;gap:10px;flex-wrap:wrap}
/* десктоп: компактный архив по центру */
@media(min-width:761px){
.blog-nav{display:flex;justify-content:center;gap:10px;margin-bottom:32px}
.blog-nav a{margin:0;padding:10px 18px;border-radius:999px}
.blog-content{max-width:860px}
}

.bcard-meta .sep{color:var(--accent);font-weight:700;margin:0}
.bcard-meta{gap:8px}
.blog-post .meta{flex-wrap:nowrap}
@media(max-width:480px){.blog-post .meta{font-size:10.5px;gap:6px}}

.bcard .bcard-meta{display:inline-flex;align-items:center}
.bcard .bcard-meta .sep{margin:0}

/* фирменные точки без page-bg */
body{background-image:radial-gradient(rgba(40,70,30,.05) 1px,transparent 1.4px);background-size:22px 22px}
/* стык под футером: html в цвет футера, без светлой полосы */ html{background:var(--bg-2)}
/* футер к низу на коротких страницах (десктоп) */
body{display:flex;flex-direction:column;min-height:100vh}
footer{margin-top:auto}

h1 em, h1 i { font-style: normal; line-height:1.15;}