/*
 * Bandeau d'appel à l'action plein écran (ex. "Jusqu'à 500 € d'aide…").
 * S'applique à un bloc Cover natif (image de fond + superposition gérées par
 * le bloc lui-même), rendu en alignfull (voir patterns/homepage.php) pour
 * occuper toute la largeur de la fenêtre comme dans la maquette. Ce fichier
 * habille le texte/bouton et pose les mêmes liserés dégradés haut/bas que
 * .solea-quick-links (assets/css/homepage.css) pour marquer les bords de
 * section de façon cohérente sur toute la page.
 *
 * Pas de width/margin manuels ici : le wp:post-content est lui-même en
 * "align":"full" (templates/front-page.html) pour ne pas être recentré par
 * le <main> englobant (is-layout-constrained) — le bloc core gère alors le
 * "breakout" du Cover via son propre support d'alignement (classe
 * alignfull + compensation --wp--style--root--padding native), sans les
 * approximations d'un calc(50vw) qui ignore la largeur de la scrollbar.
 */
.solea-cta-banner {
	position: relative;
	padding: clamp(64px, 10vw, 140px) 20px;
}

.solea-cta-banner::before,
.solea-cta-banner::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	height: 1px;
	background: linear-gradient(90deg, rgba(122, 59, 234, 0) 0%, var(--wp--preset--color--brand-purple-light) 35%, var(--wp--preset--color--brand-accent-light) 65%, rgba(196, 169, 255, 0) 100%);
}

.solea-cta-banner::before {
	top: 0;
}

.solea-cta-banner::after {
	bottom: 0;
	left: 48px;
	right: 48px;
}

.solea-cta-banner .wp-block-cover__inner-container {
	max-width: 720px;
	margin-inline: auto;
	text-align: center;
}

/*
 * Sélecteur ".solea-cta-banner__heading" (pas juste "h2") : native-typography.css
 * cible tout ".entry-content h2:not([class*='solea-'])" avec une spécificité
 * supérieure à ".solea-cta-banner h2" seul (une classe + élément) — sans un
 * nom de classe préfixé "solea-" sur le heading lui-même, sa règle
 * line-height/majuscules générique l'emporterait ici.
 */
h2.solea-cta-banner__heading {
	margin: 0 0 32px;
	text-transform: uppercase;
	font-size: 3.5rem !important;
	line-height: 1.32;
	font-weight: 800;
	letter-spacing: -0.01em;
	color: var(--wp--preset--color--base);
}

/*
 * !important requis sur background/color : le bloc Heading applique la
 * surbrillance texte via un style inline (background-color) et une classe
 * de couleur de preset (has-*-color) directement sur le <mark> — les deux
 * priment sur un simple sélecteur de classe côté feuille de style.
 */
.solea-cta-banner__heading mark {
	line-height: 1.4;
	background-color: var(--wp--preset--color--brand-accent) !important;
	color: var(--wp--preset--color--base) !important;
	padding: 0 12px;
	border-radius: 6px;
	box-decoration-break: clone;
	-webkit-box-decoration-break: clone;
}

.solea-cta-banner .wp-block-button__link {
	background: var(--wp--preset--color--brand-accent);
	color: var(--wp--preset--color--base);
}

@media (max-width: 640px) {
	h2.solea-cta-banner__heading {
		font-size: 2.25rem !important;
	}
}