/* blog/blok4 — featured slider (blog.css .mk-featured*, shared .mk-post__* card rules; .rail from site.css).
   Dots under the slider are added by blok4.js. */
.mk-featured { gap: 20px; }
.mk-featured__slide { flex: 0 0 min(100%, 1100px); scroll-snap-align: start; display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); overflow: hidden; }
@media (max-width: 767px) { .mk-featured__slide { grid-template-columns: 1fr; } }
.mk-featured__image img { width: 100%; height: 100%; min-height: 260px; max-height: 460px; object-fit: cover; }
.mk-featured__text { padding: 24px; display: grid; gap: 10px; align-content: start; }
.mk-featured__text .eyebrow { margin: 0; }
.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-featured.is-draggable { cursor: grab; }
.mk-featured.is-dragging { cursor: grabbing; scroll-snap-type: none; user-select: none; }
.mk-featured.is-dragging a { pointer-events: none; }
.mk-featured__dots { display: flex; justify-content: center; gap: 8px; margin-top: 6px; }
.mk-featured__dot { width: 8px; height: 8px; padding: 0; border-radius: 999px; border: 0; background: var(--line-strong); cursor: pointer; transition: width var(--trans), background var(--trans); }
.mk-featured__dot.is-active { width: 24px; background: var(--yellow); }