/* css/blog.css - раздел статей hlc120.com/blog (21.10.2026). Поверх css/club.css. */
.art-hero{background:linear-gradient(180deg,var(--green-50),#fff);padding:40px 0 26px}
.art-hero .wrap,.art-body .wrap{width:min(820px,92%)}
.art-hero h1{font-size:clamp(1.8rem,4.4vw,2.7rem)}
.art-hero .lead{color:var(--ink-soft);font-size:1.12rem;margin:18px 0 0}
.art-hero .meta{font:600 .82rem var(--font-body);color:var(--gold-700);margin-top:16px;letter-spacing:.04em}
.crumbs{font-size:.85rem;color:var(--ink-soft);margin-bottom:16px}
.crumbs a{color:var(--green-600);text-decoration:none}
.art-body{padding:10px 0 60px}
.art-body h2{font-size:clamp(1.35rem,3vw,1.85rem);margin:38px 0 14px}
.art-body h3{margin:0 0 8px}
.art-body p{margin:0 0 14px}
.art-body p b{color:var(--green-800)}
.art-body ul.todo{margin:0 0 10px;padding-left:1.25em}
.art-body ul.todo li{margin:8px 0}
.stories{display:grid;gap:16px;margin:18px 0 12px}
.story{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:20px 22px;box-shadow:var(--shadow)}
.story .who{font:700 .78rem var(--font-body);letter-spacing:.12em;text-transform:uppercase;color:var(--gold-700);margin-bottom:10px}
.story .rw{margin:6px 0;color:var(--ink)}
.story .rw b{color:var(--green-800)}
.art-body .note{font-size:.92rem;color:var(--ink-soft);border-left:3px solid var(--gold-500);padding:4px 0 4px 14px;margin:14px 0 8px}
.path{background:var(--green-50);border:1px solid var(--line);border-radius:var(--radius);padding:24px 26px;margin:34px 0 10px}
.path h2{margin:0 0 12px}
.path ol{margin:0;padding-left:1.2em}
.path li{margin:8px 0}
.path .cta{display:flex;flex-wrap:wrap;gap:12px;margin:18px 0 10px;text-align:left}
.path .sub{font-size:.88rem;color:var(--ink-soft);margin:0}
.faq details{border-bottom:1px solid var(--line);padding:12px 0}
.faq summary{cursor:pointer;font-weight:700;color:var(--green-800)}
.faq details p{margin:10px 0 0;color:var(--ink-soft)}
.related{padding-left:1.2em}
.related li{margin:6px 0}
.post-grid{display:grid;gap:16px;margin:0 0 10px}
.post{display:block;background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:20px 22px;box-shadow:var(--shadow);text-decoration:none;color:var(--ink);transition:transform .15s}
.post:hover{transform:translateY(-2px)}
.post p{color:var(--ink-soft);font-size:.95rem;margin:0}
.lang a{display:inline-block;padding:7px 12px;font:700 .78rem var(--font-body);color:var(--ink-soft);text-decoration:none}
.lang a.active{background:var(--green-800);color:var(--gold-100)}
@media (max-width:600px){.top .nav{display:none}.path .cta .btn{width:100%}}