/* ==========================================================================
   TESTIMONIAL CARDS  (#reviews-3)
   The three review cards sit in a VC flex row set to "content-top", so each
   card was only as tall as its own quote and the bottoms came out ragged.
   Stretch every card to the height of the tallest one in the row, and pin the
   rating + author to the bottom so they line up across all three.

   Everything below is scoped to the card columns (.vc_col-sm-4) only. The
   section's other two rows -- the centred title (sm-10) and the "see more
   reviews" line (sm-12) -- must keep VC's default flex-direction: column, or
   their centred text shrinks to fit and drifts off-centre.
   Loaded after responsive.css so it wins over style.css.
   ========================================================================== */

@media (min-width: 768px) {

  /* align-self overrides the row's align-items: flex-start (vc_row-o-content-top)
     for these columns alone, so the row itself is left untouched. */
  #reviews-3 .vc_row-flex > .wpb_column.vc_col-sm-4 {
    align-self: stretch;
    display: flex;
    flex-direction: column;
  }

  /* Card fills the full column height. */
  #reviews-3 .wpb_column.vc_col-sm-4 > .review-3 {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    width: 100%;
  }

  /* Inner panel carries the border/background, so it has to stretch too. */
  #reviews-3 .wpb_column.vc_col-sm-4 .review-3 > .review-3-txt {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    width: 100%;
  }

  /* Quote takes up the slack; auto margin above the rating pushes the rating
     and author down to a common baseline in every card. */
  #reviews-3 .wpb_column.vc_col-sm-4 .review-3-txt .app-rating {
    margin-top: auto;
  }

  /* Last element sits flush at the bottom of the card. */
  #reviews-3 .wpb_column.vc_col-sm-4 .review-3-txt .testimonial-author,
  #reviews-3 .wpb_column.vc_col-sm-4 .review-3-txt .testimonial-author p:last-child {
    margin-bottom: 0;
  }
}