/* ==========================================================================
   Page sélecteur de compatibilité — SPÉCIFIQUE à la page.
   Bande CTA sombre, badge de héro, bande de section, liens sur fond sombre,
   chiffres-clés, cartes produit et étoiles viennent de components.css :
   ne rien redéclarer ici, seulement ajuster par variables CSS.
   ========================================================================== */

/* --- Héro ---------------------------------------------------------------- */

/* Mise en couleur d'une partie du titre (« pour votre voiture » / « pour
   {marque} ») — partagé par le sélecteur et la page marque. */

.cp-lead { --lead-width: 48ch; }

.cp-points { --list-gap: 12px; }

.cp-check {
	--tile-size: 30px;
	--tile-radius: 9px;
}

/* --- Éditorial ----------------------------------------------------------- */

.cp-editorial {
	padding-top: clamp(40px, 5vw, 68px);
	padding-bottom: clamp(10px, 2vw, 16px);
}

.cp-chapo {
	font-size: clamp(16px, 1.8vw, 18.5px);
	line-height: var(--k-lh);
	color: var(--k-body);
	margin: 0 0 18px;
}

.cp-editorial h2 {
	font-size: var(--k-h2-m);
	margin: 28px 0 12px;
}

.cp-editorial p {
	margin: 0 0 12px;
}

.cp-callout {
	display: flex;
	align-items: center;
	gap: 13px;
	background: var(--k-green-tint);
	border: 1px solid var(--k-green-border);
	border-radius: var(--k-r-card);
	padding: 16px 20px;
	margin-top: 18px;
}

.cp-callout p {
	font-size: var(--k-text-xl);
	line-height: 1.5;
	color: var(--k-green-ink);
	margin: 0;
	font-weight: 700;
}

/* --- Règles -------------------------------------------------------------- */

.cp-grid3 {
	--grid-min: 250px;
}

.cp-rule {
	--card-padding: 26px;
}

/* --- Bande statistiques -------------------------------------------------- */

.cp-stats {
	background: var(--k-blue);
	color: var(--k-dark-strong);
	margin: clamp(20px, 3vw, 30px) 0 clamp(40px, 5vw, 64px);
}

.cp-stats-inner {
	--grid-min: 280px;
	--grid-gap: clamp(24px, 4vw, 40px);
	padding-top: clamp(28px, 4vw, 44px);
	padding-bottom: clamp(28px, 4vw, 44px);
	align-items: center;
	--stat-max: 38px;
	--stat-l-size: 13px;
	--stat-l-color: var(--k-faint);
}

.cp-stats h2 {
	font-size: var(--k-h2-m);
	margin: 0 0 14px;
	color: var(--k-dark-strong);
}

.cp-stats p {
	font-size: var(--k-text-l);
	line-height: var(--k-lh);
	color: var(--k-dark-body);
	margin: 0 0 12px;
}

.cp-stats p:last-child {
	margin-bottom: 0;
}

.cp-stats strong {
	color: var(--k-dark-strong);
}

.cp-stats-cards {
	display: flex;
	gap: 14px;
	flex-wrap: wrap;
}

.cp-stat {
	flex: 1;
	min-width: 130px;
	background: rgba(255, 255, 255, 0.05);
	border: 1px solid rgba(255, 255, 255, 0.09);
	border-radius: var(--k-r-card);
	padding: 20px;
}
/* --- Ajustements des composants pour cette page -------------------------- */