.bg-1 {
	background-image: var(--bg-gradient-card-1);
}

.bg-2 {
	background-image: var(--bg-gradient-card-2);
}

.bg-3 {
	background-image: var(--bg-gradient-card-3);
}

.bg-4 {
	background-image: var(--bg-gradient-card-4);
}

.gradient[class*="bg-promo"] {
	border: none;
	padding: 4px;
}

.bg-promo-1 {
	background-color: var(--bg-promo-1);
}

.bg-promo-1.gradient {
	background: linear-gradient(135deg, var(--bg-recommended), var(--bg-promo-1));
}

.bg-promo-2 {
	background-color: var(--bg-promo-2);
}

.bg-promo-2.gradient {
	background: linear-gradient(135deg, var(--bg-recommended), var(--bg-promo-2));
}

.bg-promo-3 {
	background-color: var(--bg-promo-3);
}

.bg-promo-3.gradient {
	background: linear-gradient(135deg, var(--bg-recommended), var(--bg-promo-3));
}

.bg-promo-4 {
	background-color: var(--bg-promo-4);
}

.bg-promo-4.gradient {
	background: linear-gradient(135deg, var(--bg-recommended), var(--bg-promo-4));
}