/* Version 2025 */

/*	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	*/
/*	- TYPOGRAPHY 	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	*/
/*	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	*/

/* @import url("fonts/Plex/Web/css/ibm-plex.min.css") all; */

/*	FONT-FAMILY	*/
	body { font-family: 'IBM Plex Sans', sans-serif; }
	@supports (font-variation-settings: normal) {
		body { font-family: 'IBM Plex Sans Var', sans-serif; }
	}

	     .sans { font-family: 'IBM Plex Sans', sans-serif; }
	.condensed { font-family: 'IBM Plex Sans Condensed', sans-serif; }
	     .mono { font-family: 'IBM Plex Mono', monospace; }
	    .serif { font-family: 'IBM Plex Serif', serif; }

	.data, code, pre {
		font-family: 'IBM Plex Mono', monospace
	}


/*	FONT-SIZE	*/

	/* → → → type.scale.css */



/*	FONT-STYLE	*/
	h5, h6 { font-style: italic; }
	h4.display { font-style: italic; }


/*	FONT-WEIGHT	*/

	/* → → → type.scale.css */



/*	LETTER_SPACING */

	/* → → → type.scale.css */

	.condensed { letter-spacing: -0.005em; }


/*	LINE-HEIGHT	*/

	/* → → → type.scale.css */



/*	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	*/
/*	- COLOR	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	*/
/*	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	*/


/*	COLOR VARIABLES	*/

:root{

	/* Pantone 279 C – #3B8EDE */
	--Appartenances-Bleu: hsl(209, 71%, 55%);

	--Appartenances-Bleu-05: hsl(209, 67%, 98%);
	--Appartenances-Bleu-10: hsl(209, 74%, 95%);
	--Appartenances-Bleu-20: hsl(209, 70%, 91%);
	--Appartenances-Bleu-25: hsl(209, 70%, 88%);
	--Appartenances-Bleu-30: hsl(209, 70%, 85%);
	--Appartenances-Bleu-40: hsl(209, 70%, 80%);
	--Appartenances-Bleu-50: hsl(209, 70%, 77%);
	--Appartenances-Bleu-60: hsl(209, 70%, 70%);

	/* Ombrage bleu 40% s/noir */
	--Appartenances-Bleu-Dark: hsl(209, 58%, 33%);

	/* Orange Pantone 716 C */
	--Appartenances-Orange: hsl(30, 100%, 46%);

	/* Jaune Pantone 116 C */
	--Appartenances-Jaune: hsl(48, 100%, 50%);

	/* Turquoise */
			--Turquoise: hsl(187, 100%, 91%);
		--Turquoise-light: hsl(187,  94%, 94%);
	--Turquoise-lighter: hsl(187,  97%, 97%);

	/* Saumon */
			--Saumon: hsl(337, 100%, 86%);
	--Saumon-light: hsl(337, 100%, 93%);

	/* JauneClaire */
			--JauneClaire: hsl(42, 85%, 89%);
	--JauneClaire-light: hsl(42, 86%, 95%);


	/* Grey */
	--Gris: hsl(209, 0%, 50%);

	/* darkGrey */
	--darkGrey: hsl(209, 0%, 13%);

	/* lightGrey */
	--lightGrey: hsl(209, 0%, 90%);

	/* offWhite */
	--lightGrey: #FCFCFC;
	/* HSL(0, 0%, 99%) */
	
}

@media screen {
	body{
		background-color: var(lightGrey);
	}
}

body, p { color: #222222; }

h1,.h1, h3,.h3 { color: #3B8EDE; }

h2,.h2 { color: #1e476f; color: #222222; }

h4,.h4, h5,.h5, h6,.h6 { color: #7f7f7f; }

	.display { color: #3B8EDE; }
h4.display { color: #1e476f; }

code { 
	margin: 0 0.33em;
}
