/*
 * Maatharah home card alignment v1.1.0
 * 1) Equalizes card height inside each visual row.
 * 2) Keeps every card action anchored to the lower edge.
 */

/* Standard CSS-grid service groups: every item stretches to its row height. */
.home-page .home-services-grid {
  align-items: stretch;
}

.home-page .home-services-grid > .home-service-card {
  align-self: stretch;
  height: auto;
  min-height: 0;
}

/*
 * Centered groups are flex containers in home.css.
 * The old height:100% prevented reliable flex-line stretching when copy length differed.
 * Keep width/wrapping unchanged, but let each card stretch to the tallest card in its row.
 */
.home-page .home-services-grid--centered {
  align-items: stretch;
}

.home-page .home-services-grid--centered > .home-service-card {
  align-self: stretch;
  height: auto;
  min-height: 0;
}

/* The description absorbs variable vertical space, so CTA buttons stay level. */
.home-page .home-service-card > p {
  flex: 1 1 auto;
  width: 100%;
}

.home-page .home-service-card > .home-card-link {
  flex: 0 0 auto;
  align-self: center;
  margin-top: auto;
}

/* Program row: all program cards share the same row height and actions stay at bottom. */
.home-page .home-programs-list {
  align-items: stretch;
}

.home-page .home-program-card {
  align-self: stretch;
  height: auto;
  grid-template-rows: minmax(0, 1fr) auto;
}

.home-page .home-program-card > .home-program-mark,
.home-page .home-program-card > .home-program-copy {
  grid-row: 1;
}

.home-page .home-program-actions {
  grid-row: 2;
  align-self: end;
  margin-top: auto;
}

/* Download card stretches with the program row on desktop; its button remains at the bottom. */
@media (min-width: 1121px) {
  .home-page .home-programs-layout {
    align-items: stretch;
  }

  .home-page .home-download-card {
    align-self: stretch;
    height: auto;
    grid-template-rows: auto auto minmax(0, 1fr) auto;
    align-content: stretch;
  }

  .home-page .home-download-card .home-download-icon {
    grid-row: 1;
  }

  .home-page .home-download-card h3 {
    grid-row: 2;
  }

  .home-page .home-download-card p {
    grid-row: 3;
  }

  .home-page .home-download-card .btn {
    grid-row: 4;
    align-self: end;
    margin-top: auto;
  }
}

/* Phone layout: one card per row, so preserve natural content height and RTL alignment. */
@media (max-width: 720px) {
  .home-page .home-service-card > .home-card-link {
    align-self: center;
  }
}