.blog{padding-block:clamp(48px,6vw,88px);display:grid;grid-template-columns:200px minmax(0,1fr);gap:clamp(24px,4vw,64px);align-items:start}
body.no-panel .blog{max-width:1280px;padding-inline:0;margin-inline:auto;width:calc(100% - 2 * var(--gutter))}
.blog__cats{position:sticky;top:calc(var(--header-h) + 24px)}
.blog__cats .overline{margin-bottom:12px}
.blog__catlist{display:grid;gap:2px}
.catbtn{display:flex;justify-content:space-between;width:100%;padding:8px 0;font-size:15px;text-align:left;border-bottom:1px solid transparent;transition:opacity var(--fast) linear}
.catbtn span{color:var(--muted);font-size:13px}
.catbtn:hover{opacity:.65}
.catbtn.is-on{font-weight:500;border-bottom-color:currentColor}
.blog__select{display:none}
.blog__select select{width:100%;font:inherit;font-size:16px;padding:12px 14px;border:1px solid var(--line);border-radius:999px;background:transparent;color:inherit}
.blog__title{margin-bottom:22px}
.blog__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(24px,3vw,40px) 20px}
.bcard[hidden]{display:none}
.bcard.is-entering{animation:item-in 400ms var(--ease) both;animation-delay:calc(var(--s,0) * 30ms)}
@keyframes item-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.blog__more{display:flex;justify-content:center;margin-top:48px}
.blog__more[hidden]{display:none}
@media (max-width:1023px){.blog{grid-template-columns:1fr}.blog__cats{position:static}.blog__catlist{display:none}.blog__select{display:block}.blog__grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.blog__grid{grid-template-columns:1fr}}