/* ==================================================================
   BOUTONS — refonte 2026
   Maquette Figma : elements/button (68:1409 et déclinaisons)

   Chargé automatiquement par
   common/content_type/componentCta/componentCta.html.twig (ligne 155)
   pour tous les CTA du site : c'est ici que vit la forme et la typo,
   pas dans les CSS de bloc.

   Le commun ne pose qu'un rayon en pilule et aucune police ; on
   surcharge la géométrie, les couleurs restent injectées en inline
   depuis le componentStyleCta.
   ================================================================== */

.component-cta {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0.75rem 1rem;
	font-family: var(--lx-font-main);
	font-size: 1rem;
	font-weight: 500;
	line-height: 1.4;
	text-align: center;
	text-decoration: none;
}

.component-title-cta-images-and-caption__hero .component-cta{
	padding: 0.75rem 0.1rem;
}

/* Le commun calcule un rayon de pilule depuis --cta-height ; la maquette
   veut un angle de 4 px. On neutralise aussi cette hauteur imposée, la
   hauteur vient désormais du padding. */
.component-cta--squared {
	border-radius: var(--lx-radius-button);
	line-height: 1.4;
}

.component-cta--rounded {
	border-radius: 6.25rem;
	line-height: 1.4;
}

.component-cta:focus-visible {
	outline: 0.125rem solid var(--lx-accent-second-light);
	outline-offset: 0.125rem;
}

.component-cta--ctaHeroInscription:is(a, button) {
	--cta-border-width: .063rem;

	border-width: var(--cta-border-width);
}