/* Le Grand Frère — généré depuis design/tokens.json par design/build_tokens.py.
 * Ne pas modifier à la main : modifier design/tokens.json puis relancer le script.
 * Règles d'usage : design/DESIGN.md */

@font-face {
	font-family: "Nunito";
	font-style: normal;
	font-weight: 800;
	font-display: swap;
	src: url("../fonts/nunito-latin-800-normal.woff2") format("woff2");
}
@font-face {
	font-family: "Nunito";
	font-style: normal;
	font-weight: 900;
	font-display: swap;
	src: url("../fonts/nunito-latin-900-normal.woff2") format("woff2");
}
@font-face {
	font-family: "Fira Sans";
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url("../fonts/fira-sans-latin-400-normal.woff2") format("woff2");
}
@font-face {
	font-family: "Fira Sans";
	font-style: italic;
	font-weight: 400;
	font-display: swap;
	src: url("../fonts/fira-sans-latin-400-italic.woff2") format("woff2");
}
@font-face {
	font-family: "Fira Sans";
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url("../fonts/fira-sans-latin-600-normal.woff2") format("woff2");
}

:root {
	/* Couleurs */
	--lgf-bleu-500: #1464a1;
	--lgf-bleu-700: #0f4c7a;
	--lgf-bleu-50: #eaf2f8;
	--lgf-bleu-900: #0b2f4f;
	--lgf-turquoise-500: #5dc1cc;
	--lgf-turquoise-700: #176b74;
	--lgf-turquoise-50: #e6f6f8;
	--lgf-corail-500: #ec673f;
	--lgf-corail-600: #c2502a;
	--lgf-corail-700: #a3401f;
	--lgf-corail-50: #fdefe9;
	--lgf-jaune-400: #f7bf41;
	--lgf-jaune-50: #fef5df;
	--lgf-jaune-800: #6b4700;
	--lgf-vert-600: #2f9e7e;
	--lgf-vert-700: #1f7a5f;
	--lgf-vert-50: #e5f4ef;
	--lgf-rouge-600: #c0392b;
	--lgf-rouge-50: #fbeae8;
	--lgf-encre: #14243a;
	--lgf-texte: #44505f;
	--lgf-texte-discret: #5e6a78;
	--lgf-bordure: #e1e6ec;
	--lgf-bordure-champ: #8a94a2;
	--lgf-blanc: #ffffff;
	--lgf-fond: #f6f7f9;
	/* spacing */
	--lgf-espace-1: 4px;
	--lgf-espace-2: 8px;
	--lgf-espace-3: 12px;
	--lgf-espace-4: 16px;
	--lgf-espace-5: 24px;
	--lgf-espace-6: 32px;
	--lgf-espace-7: 48px;
	--lgf-espace-8: 64px;
	--lgf-espace-9: 96px;
	/* radius */
	--lgf-rayon-0: 0px;
	--lgf-rayon-xs: 4px;
	--lgf-rayon-md: 10px;
	--lgf-rayon-lg: 16px;
	--lgf-rayon-xl: 24px;
	--lgf-rayon-pilule: 999px;
	/* shadow */
	--lgf-ombre-sm: 0 1px 2px rgba(20, 36, 58, 0.06);
	--lgf-ombre-carte: 0 1px 2px rgba(20, 36, 58, 0.04), 0 8px 24px rgba(20, 36, 58, 0.06);
	--lgf-ombre-md: 0 4px 16px rgba(20, 36, 58, 0.08);
	--lgf-ombre-survol: 0 2px 6px rgba(20, 36, 58, 0.05), 0 18px 40px rgba(20, 36, 58, 0.14);
	--lgf-ombre-lg: 0 -4px 24px rgba(20, 36, 58, 0.12);
	--lgf-ombre-bouton: 0 6px 16px rgba(194, 80, 42, 0.28);
	--lgf-ombre-media: 0 24px 60px rgba(11, 47, 79, 0.28);
	/* border */
	--lgf-trait: 1px;
	--lgf-trait-fort: 2px;
	--lgf-ruban: 6px;
	/* layout */
	--lgf-conteneur: 1200px;
	--lgf-conteneur-texte: 720px;
	--lgf-marge-mobile: 16px;
	--lgf-marge-tablette: 24px;
	--lgf-marge-bureau: 32px;
	--lgf-cible-tactile: 44px;
	--lgf-hauteur-controle: 48px;
	--lgf-hauteur-controle-sm: 40px;
	--lgf-bp-mobile: 767px;
	--lgf-bp-tablette: 1130px;
	/* duration */
	--lgf-duree-rapide: 150ms;
	--lgf-duree-base: 250ms;
	--lgf-duree-lente: 450ms;
	--lgf-courbe: cubic-bezier(0.2, 0.8, 0.2, 1);
	/* Familles de polices */
	--font-titres: "Nunito", "Trebuchet MS", Arial, sans-serif;
	--font-texte: "Fira Sans", "Segoe UI", Arial, sans-serif;
	/* Styles de texte (taille, interlignage, graisse) */
	--lgf-display-taille: 48px;
	--lgf-display-interligne: 52px;
	--lgf-display-graisse: 900;
	--lgf-h1-taille: 40px;
	--lgf-h1-interligne: 44px;
	--lgf-h1-graisse: 800;
	--lgf-h2-taille: 28px;
	--lgf-h2-interligne: 34px;
	--lgf-h2-graisse: 800;
	--lgf-h3-taille: 20px;
	--lgf-h3-interligne: 26px;
	--lgf-h3-graisse: 800;
	--lgf-chapo-taille: 18px;
	--lgf-chapo-interligne: 28px;
	--lgf-chapo-graisse: 400;
	--lgf-corps-taille: 16px;
	--lgf-corps-interligne: 24px;
	--lgf-corps-graisse: 400;
	--lgf-corps-fort-taille: 16px;
	--lgf-corps-fort-interligne: 24px;
	--lgf-corps-fort-graisse: 600;
	--lgf-petit-taille: 14px;
	--lgf-petit-interligne: 20px;
	--lgf-petit-graisse: 400;
	--lgf-etiquette-taille: 14px;
	--lgf-etiquette-interligne: 20px;
	--lgf-etiquette-graisse: 600;
	--lgf-bouton-taille: 16px;
	--lgf-bouton-interligne: 20px;
	--lgf-bouton-graisse: 600;
	--lgf-surtitre-taille: 14px;
	--lgf-surtitre-interligne: 20px;
	--lgf-surtitre-graisse: 600;
}

@media (max-width: 767px) {
	:root {
		--lgf-display-taille: 36px;
		--lgf-display-interligne: 40px;
		--lgf-h1-taille: 28px;
		--lgf-h1-interligne: 34px;
		--lgf-h2-taille: 24px;
		--lgf-h2-interligne: 30px;
	}
}

.lgf-t-display {
	font-family: var(--font-titres);
	font-size: var(--lgf-display-taille);
	line-height: var(--lgf-display-interligne);
	font-weight: var(--lgf-display-graisse);
	letter-spacing: -0.01em;
}
.lgf-t-h1 {
	font-family: var(--font-titres);
	font-size: var(--lgf-h1-taille);
	line-height: var(--lgf-h1-interligne);
	font-weight: var(--lgf-h1-graisse);
}
.lgf-t-h2 {
	font-family: var(--font-titres);
	font-size: var(--lgf-h2-taille);
	line-height: var(--lgf-h2-interligne);
	font-weight: var(--lgf-h2-graisse);
}
.lgf-t-h3 {
	font-family: var(--font-titres);
	font-size: var(--lgf-h3-taille);
	line-height: var(--lgf-h3-interligne);
	font-weight: var(--lgf-h3-graisse);
}
.lgf-t-chapo {
	font-family: var(--font-texte);
	font-size: var(--lgf-chapo-taille);
	line-height: var(--lgf-chapo-interligne);
	font-weight: var(--lgf-chapo-graisse);
}
.lgf-t-corps {
	font-family: var(--font-texte);
	font-size: var(--lgf-corps-taille);
	line-height: var(--lgf-corps-interligne);
	font-weight: var(--lgf-corps-graisse);
}
.lgf-t-corps-fort {
	font-family: var(--font-texte);
	font-size: var(--lgf-corps-fort-taille);
	line-height: var(--lgf-corps-fort-interligne);
	font-weight: var(--lgf-corps-fort-graisse);
}
.lgf-t-petit {
	font-family: var(--font-texte);
	font-size: var(--lgf-petit-taille);
	line-height: var(--lgf-petit-interligne);
	font-weight: var(--lgf-petit-graisse);
}
.lgf-t-etiquette {
	font-family: var(--font-texte);
	font-size: var(--lgf-etiquette-taille);
	line-height: var(--lgf-etiquette-interligne);
	font-weight: var(--lgf-etiquette-graisse);
}
.lgf-t-bouton {
	font-family: var(--font-texte);
	font-size: var(--lgf-bouton-taille);
	line-height: var(--lgf-bouton-interligne);
	font-weight: var(--lgf-bouton-graisse);
}
.lgf-t-surtitre {
	font-family: var(--font-texte);
	font-size: var(--lgf-surtitre-taille);
	line-height: var(--lgf-surtitre-interligne);
	font-weight: var(--lgf-surtitre-graisse);
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

/* Mouvement réduit : aucune transition ni animation */
@media (prefers-reduced-motion: reduce) {
	:root {
		--lgf-duree-rapide: 0ms;
		--lgf-duree-base: 0ms;
	}
}
