.related-articles { margin-block: 60px 80px; color: #252525; min-width: 0; }
.related-articles__header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; gap: 20px; }
.related-articles__header h2 { font-size: 24px; font-weight: 600; margin: 0; }
.related-articles__controls { display: flex; gap: 8px; }
.related-articles__controls[hidden] { display: none; }
.related-articles__controls button { width: 36px; height: 36px; border-radius: 50%; border: 1px solid #dce2e6; display: grid; place-items: center; cursor: pointer; background: transparent; }
.related-articles__controls button:disabled { opacity: .35; cursor: default; }
.related-articles__controls svg { width: 18px; height: 18px; }
.related-articles__track { display: flex; gap: 24px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; padding-bottom: 4px; }
.related-articles__track::-webkit-scrollbar { display: none; }
.related-articles__card { flex: 0 0 calc((100% - 48px) / 3); min-width: 0; scroll-snap-align: start; }
.related-articles__link { display: block; color: inherit; text-decoration: none; }
.related-articles__image, .related-articles__placeholder { width: 100%; aspect-ratio: 12 / 7; object-fit: cover; border-radius: 8px; display: block; }
.related-articles__placeholder { display: grid; place-items: center; background: #f0f4f6; color: #a5b4bd; }
.related-articles__placeholder svg { width: 48px; height: 48px; }
.related-articles__card h3 { font-size: 16px; font-weight: 400; margin: 16px 0 12px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.related-articles__card time { display: block; font-size: 12px; line-height: 1.5; color: #607b8b; }
.related-articles__link:hover h3 { color: var(--primary, #00aeef); }
.related-articles :focus-visible { outline: 2px solid var(--primary, #00aeef); outline-offset: 3px; }
@media (max-width: 639px) { .related-articles { margin-block: 40px 48px; } .related-articles__header h2 { font-size: 22px; } .related-articles__track { gap: 16px; } .related-articles__card { flex-basis: 82%; } }
