/*
 * Fondations : reset minimal, typographie de base, grille.
 * Tout le reste du site hérite de ce fichier.
 */

*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	/* Empêche un agrandissement de police du visiteur d'être ignoré. */
	-webkit-text-size-adjust: 100%;
}

body {
	margin: 0;
	font-family: var(--aspacam-theme-font-body);
	font-size: var(--aspacam-theme-font-size-base);
	line-height: var(--aspacam-theme-line-height-base);
	color: var(--aspacam-theme-color-text);
	background-color: var(--aspacam-theme-color-background);
}

img {
	/* Une image ne doit jamais dépasser son conteneur, y compris sur mobile. */
	max-width: 100%;
	height: auto;
}

h1,
h2,
h3,
p {
	margin: 0 0 var(--aspacam-theme-space-sm);
}

h1 {
	font-size: var(--aspacam-theme-font-size-h1);
}

h2 {
	font-size: var(--aspacam-theme-font-size-h2);
}

a {
	color: var(--aspacam-theme-color-blue);
}

/* Esthétique plate : aucun dégradé, aucune ombre portée (CLAUDE.md, SITE.md). */
.aspacam-button {
	display: inline-block;
	padding: var(--aspacam-theme-space-xs) var(--aspacam-theme-space-md);
	border: none;
	border-radius: 4px;
	font-size: var(--aspacam-theme-font-size-base);
	font-family: inherit;
	text-decoration: none;
	cursor: pointer;
}

/*
 * Bouton discret : fond blanc, bordure grise fine, coins arrondis. Utilisé
 * pour « Adhérer » — l'adhésion se transmet de bouche-à-oreille, ce n'est
 * pas à ce bouton d'être l'action la plus criante de la page. Choix assumé,
 * à ne pas remplacer par un bouton plein.
 */
.aspacam-button--outline {
	background-color: var(--aspacam-theme-color-background);
	color: var(--aspacam-theme-color-text);
	border: 1px solid var(--aspacam-theme-color-border);
	border-radius: 8px;
}

.aspacam-button--outline:hover,
.aspacam-button--outline:focus {
	border-color: var(--aspacam-theme-color-text-muted);
}

/*
 * Un cran plus petit que le bouton normal : pour une action secondaire
 * (« Régler un paiement » du pied de page), qui ne prétend pas à la même
 * importance qu'une action principale comme « Adhérer ».
 */
.aspacam-button--small {
	padding: calc(var(--aspacam-theme-space-xs) / 2) var(--aspacam-theme-space-sm);
	font-size: var(--aspacam-theme-font-size-small);
	border-radius: 6px;
}

.aspacam-container {
	max-width: var(--aspacam-theme-container-max-width);
	margin-inline: auto;
	padding-inline: var(--aspacam-theme-container-padding);
}

/*
 * Bloc de section (Activités, Restez connectés, Réservations à venir) :
 * une ligne de séparation fine, puis le titre. Espacements mesurés sur la
 * maquette, identiques aux trois sections — valeurs en pixels, volontai-
 * rement en dehors de l'échelle d'espacement en rem, parce que ce sont des
 * mesures externes précises, pas des multiples de l'échelle du thème.
 *
 * "line-height: 1" sur le titre : sans ça, l'interligne ajoute un espace
 * invisible au-dessus et en dessous du texte, et la marge ne correspond
 * plus à l'espace réellement mesuré à l'écran.
 */
.aspacam-section {
	padding-top: 26px;
	/* Entre le bas du contenu d'une section et le trait qui suit : 21px,
	   mesuré sur la maquette, identique à toutes les sections. */
	padding-bottom: 21px;
	border-top: 1px solid var(--aspacam-theme-color-border);
}

.aspacam-section-title {
	margin: 0 0 19px;
	line-height: 1;
}

/*
 * Traitement uniforme de tous les petits textes de la page (étape 2ter,
 * validé et étendu à l'étape 2quater) : interlettrage légèrement resserré,
 * graisse d'un cran au-dessus de la normale, et un gris commun. Aucune
 * police ajoutée, aucun fichier de police touché.
 *
 * Le gris (#767470) est la valeur la plus claire qui reste au-dessus du
 * seuil de lisibilité de 4,5:1 sur fond blanc (contraste mesuré : 4,54).
 * Ne pas aller plus clair : un cran de plus tombe à 4,42, sous le seuil.
 *
 * Cette classe est la seule source de couleur pour les petits textes :
 * les règles propres à chaque composant (sous-titre du hero, liens du
 * pied de page, etc.) ne fixent plus leur propre couleur, pour que le
 * gris reste identique partout sans exception.
 */
.aspacam-text-dense,
.aspacam-text-dense a {
	letter-spacing: -0.01em;
	font-weight: 500;
	color: #767470;
}