/*
 * Promo "stage" — a coloured studio backdrop with a soft ground shadow for a
 * transparent car PNG. Colour comes from three CSS variables set inline
 * (--cc-stage-base / -hi / -lo) so PHP owns the palette. Used on the homepage
 * and by the [cc_promo] shortcode. NEVER used on the /compare/ pages.
 */
.cc-stage {
	--cc-stage-base: #f4c300;
	--cc-stage-hi: #f7d24d;
	--cc-stage-lo: #d6ab00;
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	padding: 7% 8% 8%;
	border-radius: 14px;
	overflow: hidden;
	background:
		radial-gradient(120% 85% at 50% 38%,
			var(--cc-stage-hi) 0%,
			var(--cc-stage-base) 55%,
			var(--cc-stage-lo) 100%);
}

/* A single soft shadow that hugs the car shape (the transparent PNG). */
.cc-stage img {
	position: relative;
	z-index: 2;
	display: block;
	max-width: 100%;
	height: auto;
	filter: drop-shadow(0 16px 18px rgba(0, 0, 0, 0.26));
}

.cc-stage a {
	position: relative;
	z-index: 2;
	display: block;
	line-height: 0;
}

/* When a "Just added" card silhouette is a stage, drop the plain border and
   give the car some breathing room on the colour. Compound selector so it wins
   over the base .cc-vehicle-silhouette rules regardless of stylesheet order. */
.cc-vehicle-silhouette.cc-stage {
	border-bottom: none;
	border-radius: 10px;
	min-height: 118px;
	margin-bottom: 10px;
	padding: 12px 14px 16px;
}
.cc-vehicle-silhouette.cc-stage img,
.cc-vehicle-silhouette.cc-stage svg {
	width: 84%;
	margin: 0 auto;
}