.main-wrapper {
  padding: 40px 0;
  background-color: var(--main-bg);
}

.container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
}

.content-area {
  display: flex;
  flex-direction: row;
  gap: 40px;
}

/* Основной контент */
.main-content {
  flex: 1 1 0;
}

/* Сайдбар */
.sidebar-right {
  width: 300px;
}

/* 📱 Респонсив: прячем сайдбар или перекидываем вниз */
@media (max-width: 768px) {
  .content-area {
    flex-direction: column;
  }

  .sidebar-right {
    width: 100%;
    margin-top: 30px;
  }
}

/* Сетка карточек: 1 колонка → 2 колонки */
.main-content .page-numbers {
    color: var(--main-link, inherit);
}
.main-content .page-numbers:hover {
    color: var(--main-link-hover, inherit);
}
.main-content .cards-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 24px;
}
@media (min-width: 1024px){
  .main-content .cards-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
}

/* Карточка */
.main-content .card {
  display:flex; flex-direction:column;
  background: var(--main-card-bg, #FFFFFF);
  border: 1px solid var(--main-divider, rgba(0,0,0,.06));
  border-radius:16px; overflow:hidden;
  box-shadow:0 2px 12px rgba(0,0,0,.04);
}

/* Контейнер задаёт высоту, картинка его заполняет */
.main-content .card-thumb{
  position: relative;
  display: block;
  aspect-ratio: 16/9;
  overflow: hidden;               /* обрезка лишнего */
  background: var(--main-divider, #f4f4f5);
}
.main-content .card-thumb img{
  position: absolute;
  inset: 0;                       /* top/right/bottom/left:0 */
  width: 100%;
  height: 100%;
  object-fit: cover;              /* заполняем, обрезая */
  display: block;
}

/* Когда превью нет — уплотняем */
.main-content .card--no-thumb .card-body { padding-top:16px; }

/* Текст и ссылки */
.main-content .card-body {
  padding:16px 16px 18px;
  display:flex; flex-direction:column; gap:10px;
  color: var(--main-text-primary, #000000);
}
.main-content .card-title {
  margin:0; font-size:1.125rem; line-height:1.3;
  color: var(--main-text-title, #5C4033);
}
.main-content .card-title a {
  color: var(--main-link, inherit);
  text-decoration:none;
}
.main-content .card-title a:hover {
  color: var(--main-link-hover, var(--main-link, inherit));
  text-decoration:underline;
}
.main-content .card-meta {
  font-size:.875rem;
  color: var(--main-text-secondary, #6B6B6B);
  display:flex; align-items:center; gap:.5ch;
}
.main-content .card-excerpt { color: var(--main-text-primary, #000000); }
.main-content .button-link {
  font-weight:600; text-decoration:none;
  color: var(--main-link, inherit);
}
.main-content .button-link:hover {
  color: var(--main-link-hover, var(--main-link, inherit));
  text-decoration:underline;
}

/* На очень узких экранах скрываем превью ради компактности */
@media (max-width: 320px){
  .main-content .card-thumb { display:none; }
  .main-content .card { border-radius:12px; }
}

.donate-wrap svg { transition: filter .2s ease; }
.donate-wrap:hover svg { filter: drop-shadow(0 0 12px rgba(255,213,74,.6)); }

/*
.donate-wrap {
  color: #A5741B;   
}

.donate-wrap:hover {
  color: #E0B25F;   
}
*/