/* ============================================================
   GROUPE POLMAR - Page véhicules d'occasion
   Bandeau titre, fil d'Ariane, texte SEO.
   La barre de filtres, la grille et les cartes sont stylées par
   le plugin polmar-vehicules (assets/css/vehicules.css).
   ============================================================ */

.vo-main { background: var(--g50); }

/* ── Bandeau titre ── */
.vo-hero {
	background: linear-gradient(135deg, var(--dark) 0%, var(--navy) 60%, var(--navy-mid) 100%);
	border-bottom: 3px solid var(--pink);
	color: #fff;
}
.vo-hero__in {
	padding-top: 56px;
	padding-bottom: 60px;
	text-align: center;
}
.vo-hero__kicker {
	font-size: .68rem;
	font-weight: 700;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: #E3B8DA;
	margin-bottom: 12px;
}
.vo-hero__title {
	color: #fff;
	font-size: clamp(1.9rem, 4.4vw, 3.1rem);
	font-weight: 800;
	line-height: 1.05;
	margin: 0 0 10px;
}
.vo-hero__sub {
	font-size: .92rem;
	color: rgba(255,255,255,.82);
	margin: 0;
}
.vo-hero__sub strong { color: #fff; font-weight: 800; }
.vo-hero__sub--wide {
	max-width: 760px;
	margin: 0 auto;
	line-height: 1.7;
}

/* Points forts du concept (comme neuves) */
.vo-hero__points {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 24px;
}
.vo-hero__point {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 9px 17px;
	background: rgba(255,255,255,.08);
	border: 1px solid rgba(255,255,255,.16);
	border-radius: 30px;
	font-size: .78rem;
	font-weight: 600;
	color: #fff;
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
}
.vo-hero__point svg { color: #E3B8DA; flex-shrink: 0; }
.vo-hero__point strong { font-weight: 800; }

/* ── Fil d'Ariane ── */
.vo-breadcrumbs {
	display: flex;
	align-items: center;
	gap: 8px;
	padding-top: 22px;
	font-size: .66rem;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--g400);
}
.vo-breadcrumbs a {
	color: var(--navy);
	text-decoration: none;
	transition: color var(--transition);
}
.vo-breadcrumbs a:hover { color: var(--pink); }
.vo-breadcrumbs__sep { color: var(--g200); }

/* ── Texte SEO sous le listing ── */
.vo-seo {
	background: #fff;
	border-top: 1px solid var(--g100);
	margin-top: 64px;
}
.vo-seo__in {
	max-width: 860px;
	padding-top: 48px;
	padding-bottom: 56px;
}
.vo-seo__in p {
	color: var(--g600);
	font-size: .88rem;
	line-height: 1.75;
	margin-bottom: 14px;
}

@media (max-width: 640px) {
	.vo-hero__in { padding-top: 38px; padding-bottom: 44px; }
	.vo-seo { margin-top: 44px; }
	.vo-seo__in { padding-top: 36px; padding-bottom: 42px; }
}
