.main-blog { background: rgb(var(--color-background)); }
.main-blog .page-width { max-width: 1160px; padding-inline: 20px; }
.main-blog .main-blog__container { display: flex; flex-direction: column; gap: 38px; }
.main-blog .main-blog__title { margin: 0; font-size: 44px; line-height: 1.15; letter-spacing: -.025em; color: rgb(var(--color-text)); }
.main-blog .main-blog__list { --column-gap: 36px; --row-gap: 48px; margin: 0; padding: 0; list-style: none; }
.main-blog .main-blog__item { min-width: 0; }
.main-blog .block-article-card { display: flex; flex-direction: column; gap: 20px; text-align: start; color: inherit; text-decoration: none; }
.main-blog .block-article-card__cover { width: 100%; }
.main-blog .block-article-card__image-wrapper { aspect-ratio: 16/10; overflow: hidden; border-radius: 10px; }
.main-blog .block-article-card__image-wrapper img { width: 100%; height: 100%; object-fit: cover; }
.main-blog .block-article-card__info { display: flex; flex-direction: column; width: 100%; gap: 12px; }
.main-blog .block-article-card__title { text-align: start; margin: 0; font-size: 26px; line-height: 1.3; letter-spacing: -.01em; }
.main-blog .block-article-card__extra-info { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; color: rgb(var(--color-light-text)); font-size: 13px; line-height: 1.6; }
.main-blog .block-article-card__excerpt { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: var(--max-row,3); overflow: hidden; text-align: start; margin: 0; font-size: 16px; line-height: 1.75; }
.main-blog .block-article-card:focus-visible { outline: 2px solid rgb(var(--color-button-text-link)); outline-offset: 6px; border-radius: 10px; }
.main-blog .block-article-card:hover .block-article-card__title { text-decoration: underline; text-underline-offset: 4px; }
@media (min-width: 960px) {
  .main-blog .main-blog__list[data-layout="grid"] { --desktop-columns: var(--grid-desktop-columns); }
  .main-blog .main-blog__list[data-layout="list"] .main-blog__item { grid-column: span 2; }
  .main-blog .main-blog__list[data-layout="list"] .main-blog__item:nth-child(3n-1),
  .main-blog .main-blog__list[data-layout="list"] .main-blog__item:nth-child(3n) { grid-column: span 1; }
}
@media (max-width: 959px) {
  .main-blog .main-blog__container { gap: 30px; }
  .main-blog .main-blog__list { --row-gap: 36px; }
  .main-blog .main-blog__title { font-size: 34px; }
  .main-blog .block-article-card__title { font-size: 24px; }
}