/**
 * Equal-height promo cards on /akcii (added 2026-08-19).
 *
 * The card list (view mode "mini") is laid out with inline-block cards of a
 * fixed width, so each card is only as tall as its own content: a two-line
 * title makes a short card, a four-line title a tall one, and the "Подробнее"
 * buttons end up on different baselines.
 *
 * Grid with grid-auto-rows:1fr makes every row — and therefore every card —
 * as tall as the tallest card on the page; margin-top:auto pins the button to
 * the bottom of the card and the title block is centred in the space that is
 * left, so a short title does not leave a lopsided gap. Card widths, margins,
 * shadow and centring stay with all.css / critical-akcii.css (the widths are
 * repeated here only as grid track sizes, including the 1220px breakpoint).
 * Scoped to .page-akcii so the promo block on the front page
 * (#block-epromo-block) is untouched.
 */
.page-akcii .promo-list .entity-list__items {
  display: grid;
  grid-template-columns: repeat(auto-fit, 354px);
  grid-auto-rows: 1fr;
  align-items: stretch;
  justify-content: center;
  /* The cards' own side margins collapse inside a fixed grid track, so the
     spacing moves onto the grid: 58px between columns and 43px between rows
     reproduce the inline-block layout the page had before. */
  gap: 43px 58px;
  margin: 0;
}

.page-akcii .promo-list .node-promo {
  display: flex;
  flex-direction: column;
  margin: 0;
}

/* Title block takes the free space and centres itself in it. The side padding
   keeps long titles and subtitles off the card edge (the card itself has none). */
.page-akcii .promo-list .node-promo .promo-title {
  margin-top: auto;
  padding: 0 15px;
}

.page-akcii .promo-list .node-promo .promo-title-second {
  margin-bottom: 15px;
  padding: 0 15px;
}

.page-akcii .promo-list .node-promo > a.btn {
  margin-top: auto;
  align-self: center;
}

/* Below 1220px the card narrows to 305px while promo_mini stays 354px wide, so
   .promo-image's overflow:hidden was cropping ~28px off each side of the photo.
   Scaling the image to the card keeps the whole frame visible. */
.page-akcii .promo-list .node-promo .promo-image img {
  width: 100%;
  height: auto;
}

@media all and (max-width: 1220px) {
  .page-akcii .promo-list .entity-list__items {
    /* The card is 297px wide inside the 305px track, so the gap is 8px short
       of the spacing to keep the original 32px between cards here. */
    grid-template-columns: repeat(auto-fit, 305px);
    gap: 43px 24px;
  }
}

/* Below the two-column breakpoint the cards go full width — let the track
   follow the container instead of the fixed 354/305px above. */
@media all and (max-width: 680px) {
  .page-akcii .promo-list .entity-list__items {
    grid-template-columns: 1fr;
    grid-auto-rows: auto;
    gap: 43px 0;
  }
}
