/*
 * Variables du thème : tout ce qui doit être déclaré une seule fois.
 *
 * Les trois couleurs de marque en particulier ne doivent jamais être
 * réécrites en dur ailleurs (CLAUDE.md) : toute règle qui en a besoin
 * référence une de ces variables.
 */

:root {

	/* Couleurs de marque, extraites du fichier logo réel (SITE.md). */
	--aspacam-theme-color-blue: #29317C;
	--aspacam-theme-color-red: #CC251E;
	--aspacam-theme-color-yellow: #F6EB45;

	/*
	 * Teinte très claire du bleu de marque, utilisée pour le fond du hero.
	 * Valeur directe, relevée sur la maquette (#E7E9F7) : le bleu de marque
	 * vient d'un fichier logo qui ne changera pas, et cette valeur cible
	 * n'était de toute façon pas elle-même dérivée du bleu — un calcul avait
	 * été construit pour atteindre exactement une valeur qui ne l'était pas.
	 */
	--aspacam-theme-color-blue-tint: #E7E9F7;

	/* Couleurs neutres, pour le texte et les fonds courants. */
	--aspacam-theme-color-text: #1a1a1a;
	--aspacam-theme-color-text-muted: #595959;
	--aspacam-theme-color-background: #ffffff;
	--aspacam-theme-color-border: #e0e0e0;

	/*
	 * Typographie : pile de polices déjà présentes sur l'appareil du
	 * visiteur. Aucune police chargée depuis un serveur tiers, ni pour
	 * éviter une dépendance externe, ni pour éviter l'appel réseau vers un
	 * tiers qu'elle représenterait (CLAUDE.md).
	 */
	--aspacam-theme-font-body: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

	--aspacam-theme-font-size-tiny: 0.75rem;
	--aspacam-theme-font-size-small: 0.875rem;
	--aspacam-theme-font-size-base: 1rem;
	--aspacam-theme-font-size-large: 1.25rem;
	--aspacam-theme-font-size-h1: 2rem;
	--aspacam-theme-font-size-h2: 1.5rem;
	/*
	 * Ramenée de 2,75rem (44px) à 2rem (32px) : la valeur précédente venait
	 * d'une comparaison entre deux captures prises à des largeurs
	 * différentes, traitées à tort comme comparables (voir le rapport de
	 * session). Grandit légèrement au-delà de 900px (assets/css/hero.css),
	 * sans jamais retrouver 44px.
	 */
	--aspacam-theme-font-size-hero-title: 2rem;
	/* Un cran sous les 17px précédents, pas jusqu'aux ~15px de la maquette :
	   c'est sous le seuil de confort de lecture sur téléphone. */
	--aspacam-theme-font-size-hero-subtitle: 1rem;

	--aspacam-theme-line-height-base: 1.6;

	/* Échelle d'espacement unique, utilisée partout plutôt que des valeurs éparses. */
	--aspacam-theme-space-xs: 0.5rem;
	--aspacam-theme-space-sm: 1rem;
	--aspacam-theme-space-md: 1.5rem;
	--aspacam-theme-space-lg: 2.5rem;
	--aspacam-theme-space-xl: 4rem;

	/* Grille : largeur maximale du contenu et marge minimale sur les côtés. */
	--aspacam-theme-container-max-width: 1100px;
	--aspacam-theme-container-padding: 1rem;

	/*
	 * Taille du visuel en tête d'une tuile (pastille photo des activités,
	 * icône au trait des réservations) : une seule valeur, pour que les deux
	 * grilles de tuiles restent à la même hauteur sans avoir à s'accorder à
	 * la main (assets/css/activities.css, assets/css/reservation-tiles.css —
	 * étape 3bis, sujet 2).
	 */
	--aspacam-theme-tile-visual-size: 50px;
}