.pricing h1 span {
	color: var(--color-primary);
}

.section-pricing-table {
	padding: 6rem 0 8rem;
	background-color: var(--color-primary);
}

.pricing .subline {
	margin-bottom: 4rem;
	font: var(--h-small);
	text-align: center;
	color: #ebe7de;
}

.pricing .subline-add-on {
	display: block;
	font: var(--text-medium-regular);
}

.pricing-grid {
	margin: auto;
	max-width: 60rem;
	grid-gap: 1rem;
}

@media(min-width: 37.5rem) {
	.pricing-grid {
		grid-gap: 2rem;
	}
}

@media(min-width: 62.5rem) {
	.pricing-grid {
		grid-gap: 4rem;
	}
}

.pricing-box {
	padding: 2rem;
	padding-bottom: 1rem;
	border-radius: var(--border-radius);
	background-color: var(--white);
}

.plan-name {
	font: var(--text-large-bold);
	color: var(--color-brand-red);
}

.subscription-price {
	display: block;
	font: var(--h-small);
}

.subscription-interval {
	display: inline;
	font: var(--text-small-bold);
}

.plan-features {
	padding-top: 1rem;
	padding-bottom: 1rem;
}

.button-wrapper {
	margin-top: 1rem;
	padding-top: 1.25rem;
	border-top: 1px solid var(--border-color--light);
}

@media(min-width: 37.5rem) {
	.button-wrapper {
		padding-top: 1.5rem;
	}
}
