/* The pricing page: the plans side by side, the figure large, the features as a list. */

.plans {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
	gap: 1.5rem;
}

.plan-card {
	display: flex;
	flex-direction: column;
}

.plan-card .plan-desc {
	color: var(--muted);
	margin: 0 0 1rem;
}

.plan-figure {
	margin: 0 0 0.25rem;
}

.plan-amount {
	font-size: 2rem;
	font-weight: 700;
}

.plan-per, .plan-yearly-note, .plan-was {
	color: var(--muted);
}

.plan-was {
	margin-inline-start: 0.6rem;
	text-decoration-color: var(--bad);
}

.plan-yearly-note {
	margin: 0 0 1rem;
	font-size: 0.9rem;
}

.plan-features {
	margin: 1rem 0 1.5rem;
	padding-inline-start: 1.2rem;
	flex: 1;
}

.plan-features li {
	margin: 0.35rem 0;
}