/*
 * tokens.css - FormaSources
 * Role : source unique des variables de design (charte Ancrage) et
 *        declaration des polices auto-hebergees (RGPD, aucun appel CDN).
 * Dependances : polices WOFF2 dans /assets/fonts. A charger en premier.
 * Reference : reference/claude design/uploads/css-variables.css
 */

/* --- Polices auto-hebergees --- */

@font-face
{
	font-family: "Fraunces";
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url("../fonts/fraunces-600-latin.woff2") format("woff2");
	unicode-range:
		U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308,
		U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face
{
	font-family: "Fraunces";
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url("../fonts/fraunces-600-latin-ext.woff2") format("woff2");
	unicode-range:
		U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329,
		U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113,
		U+2C60-2C7F, U+A720-A7FF;
}

/* Source Sans 3 est servie en fonte variable : un seul fichier couvre 400 et 500. */
@font-face
{
	font-family: "Source Sans 3";
	font-style: normal;
	font-weight: 400 500;
	font-display: swap;
	src: url("../fonts/source-sans-3-latin.woff2") format("woff2");
	unicode-range:
		U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308,
		U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face
{
	font-family: "Source Sans 3";
	font-style: normal;
	font-weight: 400 500;
	font-display: swap;
	src: url("../fonts/source-sans-3-latin-ext.woff2") format("woff2");
	unicode-range:
		U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329,
		U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113,
		U+2C60-2C7F, U+A720-A7FF;
}

/* --- Variables de design --- */

:root
{
	/* Couleurs principales */
	--color-primary: #b5705a;
	--color-primary-dark: #9a5d4a;
	--color-primary-light: #c9907e;
	--color-primary-subtle: rgba(181, 112, 90, 0.08);
	/* Terracotta legerement approfondi, reserve au fond du hero (blanc AA dessus) */
	--color-hero-bg: #a5634e;

	--color-secondary: #c9a227;
	--color-secondary-dark: #a88620;
	--color-secondary-light: #d4b44e;
	--color-secondary-subtle: rgba(201, 162, 39, 0.1);
	/* Or clair de l'eyebrow du hero, sur fond terracotta (valeur de la demo) */
	--color-eyebrow-hero: #f2d98a;
	/* Or profond pour le TEXTE des eyebrows de section : contraste AA sur clair et muted */
	--color-eyebrow: #7a5f12;

	/* Neutres */
	--color-bg: #f9f6f2;
	--color-surface: #ffffff;
	--color-border: #e5ded4;
	--color-beige: #d9c4aa;
	--color-muted-bg: #f3ede5;

	/* Texte */
	--color-text: #3d2e24;
	--color-text-secondary: #5c4a3d;
	--color-text-muted: #8a7b6f;
	--color-text-inverse: #f9f6f2;
	--color-text-white: #ffffff;

	/* Semantique (formulaire) */
	--color-success: #6b9080;
	--color-error: #c0524d;
	--color-info: #4a6e8a;

	/* Typographie */
	--font-heading: "Fraunces", Georgia, "Times New Roman", serif;
	--font-body: "Source Sans 3", "Source Sans Pro", system-ui, -apple-system, sans-serif;

	/* Echelle typographique */
	--text-hero: 56px;
	--text-h1: 44px;
	--text-h2: 32px;
	--text-h3: 24px;
	--text-body-lg: 18px;
	--text-body: 16px;
	--text-body-sm: 14px;
	--text-eyebrow: 13px;
	--text-caption: 12px;

	/* Espacements */
	--space-xs: 4px;
	--space-sm: 8px;
	--space-md: 16px;
	--space-lg: 24px;
	--space-xl: 32px;
	--space-2xl: 48px;
	--space-3xl: 64px;
	--space-4xl: 96px;
	--space-5xl: 128px;

	--section-py: 90px;
	--container-max: 1200px;
	--container-px: 24px;
	--measure: 68ch; /* largeur de lecture confortable */

	/* Arrondis */
	--radius-sm: 4px;
	--radius-md: 6px;
	--radius-lg: 8px;

	/* Ombres */
	--shadow-subtle: 0 1px 3px rgba(61, 46, 36, 0.06);
	--shadow-card: 0 2px 8px rgba(61, 46, 36, 0.08);

	/* Transition */
	--transition: all 0.2s ease;

	/* Icone coche (masque pour les listes de modalites) */
	--check-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M9.55 17.6 4 12.05l1.4-1.4 4.15 4.15L18.6 5.4 20 6.8z'/%3E%3C/svg%3E");

	/* Chrome de mise en page */
	--header-height: 72px;
	--focus-ring: 2px solid var(--color-primary);
	--focus-offset: 2px;
	--z-header: 100;
	--z-menu: 200;
}

/* Ajustements mobiles */
@media (max-width: 768px)
{
	:root
	{
		--text-hero: 36px;
		--text-h1: 32px;
		--text-h2: 26px;
		--text-h3: 20px;
		--section-py: 64px;
		--container-px: 16px;
		--header-height: 64px;
	}
}
