/* Socle commun des blocs Spirfix : couleurs et mise en page reprises de l'accueil FR. */
:root {
	--spx-fond: #f8f6f2;
	--spx-bleu: #0474f2;
	--spx-encre: #000;
	--spx-gris: #555;
	--spx-carte: #fff;
	--spx-rayon: 10px;
	--spx-ombre: 0 5px 20px rgba(0, 0, 0, 0.12);
	--spx-largeur: 1170px;
}

html {
	overflow-x: clip;
}

/* Section pleine largeur, contenu centré. */
.spx-bloc {
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	padding: 56px 16px;
}

.spx-bloc--fond {
	background: var(--spx-fond);
}

.spx-bloc__inner {
	max-width: var(--spx-largeur);
	margin: 0 auto;
}

/* Accueil : même largeur de contenu que spirfix.com (1302 px). */
.spx-bloc__inner--ancho {
	max-width: 1302px;
}

.spx-bloc h1,
.spx-bloc h2 {
	font-weight: 400;
	line-height: 1.2;
	letter-spacing: -0.01em;
	margin: 0 0 24px;
	color: var(--spx-encre);
}

.spx-bloc h2 {
	font-size: clamp(24px, 3vw, 35px);
}

.spx-bloc h2.spx-centre {
	text-align: center;
	font-weight: 600;
	font-size: clamp(22px, 2.4vw, 28px);
}

.spx-bloc strong {
	font-weight: 700;
}

.spx-bloc em {
	font-style: italic;
}

.spx-bloc strong em,
.spx-bloc em strong {
	font-weight: 800;
}

.spx-carte {
	background: var(--spx-carte);
	border-radius: var(--spx-rayon);
	box-shadow: var(--spx-ombre);
}

.spx-pastille {
	display: inline-flex;
	align-items: center;
	padding: 6px 16px;
	border-radius: 30px;
	border: 1px solid #ddd;
	background: #fff;
	color: var(--spx-encre);
	font-size: 14px;
	font-weight: 500;
	line-height: 1.4;
	cursor: pointer;
	text-decoration: none;
}

.spx-bloc a.spx-pastille,
.spx-bloc .spx-hero__note a {
	text-decoration: none;
}

.spx-pastille[aria-selected="true"],
.spx-pastille:hover {
	background: var(--spx-bleu);
	border-color: var(--spx-bleu);
	color: #fff;
}

@media (max-width: 767px) {
	.spx-bloc {
		padding: 36px 16px;
	}
}

/* Dans l'éditeur et en haut de la page boutique (colonne WooCommerce), pas de débordement pleine largeur. */
.editor-styles-wrapper .spx-bloc,
.spx-boutique-contenu .spx-bloc {
	margin-left: 0;
	margin-right: 0;
}

.spx-boutique-contenu .spx-bloc {
	padding: 8px 0 32px;
}
