/* ---------- Gifts page ---------- */

/* Hero + intro sections both carry the default 70px section padding,
   stacking into a much bigger gap than production between the heading
   and the "Gift Giving" row below it. */
.er-gifts-hero {
	padding-bottom: 20px;
}
.er-gifts-intro {
	padding-top: 20px;
}

.er-gifts-intro-row {
	display: grid;
	grid-template-columns: 4fr 3fr 3fr;
	gap: 20px;
	align-items: stretch;
}
.er-gifts-darkbox {
	background: var(--er-dark-green);
	border-radius: 10px;
	padding: 40px;
	display: flex;
	flex-direction: column;
	justify-content: center;
}
.er-gifts-darkbox h2 {
	font-family: 'Nunito', sans-serif;
	font-size: 32px;
	line-height: 1.25;
	color: #fff;
	font-weight: 700;
	margin: 0 0 16px;
}
.er-gifts-darkbox p {
	color: #EBEBEB;
	line-height: 1.7;
	margin: 0;
}
.er-gifts-intro-image {
	min-height: 370px;
	border-radius: 10px;
	background-size: cover;
	background-position: center;
}

/* Production sets this paragraph on a light mint card the full width of the
   container, with noticeably more room below the text than above it. The 40px
   of section padding that used to open up the gap above becomes margin, so the
   band keeps those proportions instead of swallowing the gap. This is the only
   --tight section on the page. */
#er-gifts .er-section--tight {
	margin-top: 30px;
}

.er-gifts-lead-box {
	background: var(--er-mint);
	border-radius: 10px;
	padding-top: 10px;
	padding-bottom: 38px;
}

.er-gifts-lead {
	max-width: 1020px;
	margin: 0 auto;
	text-align: center;
	color: var(--er-secondary);
	line-height: 1.7;
}

.er-gift-cards {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	gap: 40px;
}
.er-gift-card {
	background: var(--er-dark-green);
	border-radius: 10px;
	padding: 15px 15px 30px;
}
.er-gift-card--image {
	padding: 0;
	overflow: hidden;
}
.er-gift-card--image .er-gift-card__image {
	height: 100%;
	min-height: 350px;
	margin-bottom: 0;
	border-radius: 10px;
}
.er-gift-card__image {
	width: 100%;
	min-height: 350px;
	border-radius: 6px;
	background-size: cover;
	background-position: center;
	margin-bottom: 24px;
}
.er-gift-card h3 {
	font-family: 'Nunito', sans-serif;
	font-size: 25px;
	color: var(--er-mint);
	font-weight: 700;
	margin: 0 0 14px;
	padding: 0 10px;
}
.er-gift-card .er-eyebrow {
	padding: 0 10px;
}
.er-gift-card > p:not(.er-eyebrow) {
	color: #F6F6F6;
	line-height: 1.7;
	margin: 0 0 20px;
	padding: 0 10px;
}
.er-gift-card .er-btn {
	margin: 0 10px;
}

@media (max-width: 900px) {
	.er-gifts-intro-row {
		grid-template-columns: 1fr;
	}
	.er-gift-cards {
		grid-template-columns: 1fr;
		gap: 32px;
	}
	.er-gift-card--image {
		display: none;
	}
}