/* blog/blok5 — popular / top posts (blog.css .mk-post*, .mk-posts, .mk-sorting, .pagination). */
.mk-post { overflow: hidden; display: flex; flex-direction: column; }
.mk-post__image img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.mk-post__body { padding: 18px; display: grid; gap: 10px; }
.mk-post__author a:hover { color: var(--yellow); }
.mk-post__author .avatar { width: 24px; height: 24px; border-radius: 50%; object-fit: cover; }
.mk-post__meta { display: flex; justify-content: space-between; align-items: center; gap: 12px; font-size: 13px; color: var(--muted); flex-wrap: wrap; }
.mk-post__meta .eyebrow { margin: 0; }
.mk-post__meta span { display: inline-flex; align-items: center; gap: 6px; }
.mk-post__title { font-size: 18px; transition: color var(--trans); }
a:hover > .mk-post__title { color: var(--yellow); }
.mk-post__desc { margin: 0; color: #c9c9cf; font-size: 14px; line-height: 1.6; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
.mk-posts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
@media (max-width: 991px) { .mk-posts { grid-template-columns: 1fr 1fr; } }
@media (max-width: 640px) { .mk-posts { grid-template-columns: 1fr; } }
.mk-sorting { align-self: center; margin-right: 6px; font-size: 13px; }
.mk-blog #popular .section__head { display: flex; justify-content: space-between; align-items: center; gap: 12px 24px; flex-wrap: wrap; margin-bottom: 16px; }
.mk-blog #popular .section__title { margin: 0; }
.pagination { display: flex; justify-content: center; gap: 6px; margin-top: 24px; }
.pagination__item { min-width: 36px; height: 36px; display: grid; place-items: center; border-radius: 999px; border: 1px solid var(--line); color: var(--muted); }
.pagination__item.is-active { background: var(--yellow); border-color: var(--yellow); color: var(--bg); }
.mk-posts.is-switching { opacity: 0; transition: opacity var(--blog-fade, 180ms) ease; }
.mk-posts { transition: opacity var(--blog-fade, 180ms) ease; }
/* depo0 also loads the legacy globals.css (front does not here): undo its absolutely positioned
   ".pagination a" so the page links sit in the row. */
.mk-blog .pagination a.pagination__item { position: static; display: grid; }