/* ==========================================================================
   Alignment: equal-height cards, images of one shape, buttons on one line.
   Loaded LAST (inc/alignment.php) so it applies to every card and button on
   the website. It adds alignment only: each card keeps its own design.
   ========================================================================== */

/* 1. Rows of cards: every card in a row is as tall as its tallest neighbour */
.grid,
.safari-grid,
.dest-card-grid,
.tour-grid,
.home-services-grid,
.recent-posts__grid,
.testimonial-grid,
.about-values__cards,
.outbound-home-section__grid,
.etc-card-grid {
	align-items: stretch !important;
}

/* 2. Every card is as tall as its row. Overlay-style cards (text on the picture)
      keep their own layout: they only need to fill the cell. */
.tour-card,
.blog-card,
.dest-card,
.safari-card,
.post-card,
.home-service-card,
.service-card,
.about-value-card,
.testimonial-card,
.outbound-itinerary-card {
	box-sizing: border-box !important;
	align-self: stretch !important;
	height: 100% !important;
}

/* 3. Cards with a button or link UNDER their text: stack the parts top to
      bottom and pin the button to the card's bottom edge, so the buttons of
      all cards in a row sit on one line whatever the text length. */
.tour-card,
.blog-card,
.post-card,
.home-service-card,
.service-card,
.testimonial-card {
	display: flex !important;
	flex-direction: column !important;
	align-items: stretch !important;
	justify-content: flex-start !important;
}
.tour-card__thumb,
.post-card__media,
.home-service-card__media,
.service-card__image {
	flex: 0 0 auto !important; /* pictures keep their designed height */
}
.tour-card__body,
.post-card__body,
.home-service-card__body {
	display: flex !important;
	flex-direction: column !important;
	align-items: stretch !important;
	justify-content: flex-start !important;
	flex: 1 1 auto !important;
	min-height: 0 !important;
}
.tour-card__read-more,
.post-card__more,
.home-service-card__link,
.service-card__link {
	margin-top: auto !important;
}
.tour-card__read-more,
.service-card__link {
	align-self: flex-start !important;
}
.testimonial-card .testimonial-author {
	margin-top: auto !important;
}

/* 4. The text part of side-by-side cards grows to the card's bottom */
.dest-card__body,
.safari-card__body {
	flex: 1 1 auto !important;
}

/* 5. Buttons: one height, text centred, sitting on the same line */
.btn,
.etc-form__btn,
.sfb-send {
	box-sizing: border-box !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	min-height: 48px !important;
	padding-top: 12px !important;
	padding-bottom: 12px !important;
	line-height: 1.2 !important;
	text-align: center !important;
	vertical-align: middle !important;
}
.tour-card__read-more,
.dest-card__cta,
.safari-card__link,
.service-card__link {
	box-sizing: border-box !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	min-height: 40px !important;
	line-height: 1.2 !important;
	vertical-align: middle !important;
}
