/**
 * Tokens de design — source unique de vérité.
 *
 * Les valeurs sont extraites telles quelles de l'option `fusion_options` du
 * thème Avada précédent (palette, sets typographiques, largeurs, boutons), de
 * façon à reproduire le design existant sans approximation.
 *
 * Règle : aucune couleur, taille ou espacement en dur ailleurs dans le CSS.
 * Tout passe par une variable définie ici.
 */

:root {
	/* ── Palette brute ────────────────────────────────────────────────────
	 * Correspondance 1:1 avec l'ancienne palette Avada (color1 → color8),
	 * conservée pour pouvoir retracer n'importe quelle valeur du site actuel.
	 */
	--c1: #ffffff;
	--c2: #f4f5fa;
	--c3: #dde2e0;
	--c4: #5f6368;
	--c5: #0f5c3b;
	--c6: #1e7a52;
	--c7: #2e2e2e;
	--c8: #111111;

	/* Composantes HSL des deux verts, pour dériver les états de survol
	 * exactement comme Avada le faisait (-5% saturation, -10% luminosité). */
	--c5-h: 154;
	--c5-s: 72%;
	--c5-l: 21%;
	--c6-h: 154;
	--c6-s: 60.5%;
	--c6-l: 29.8%;

	/* ── Rôles ───────────────────────────────────────────────────────────── */
	--color-bg: var(--c1);
	--color-bg-alt: var(--c2);
	--color-bg-site: var(--c3);
	--color-bg-dark: var(--c7);

	--color-fg: var(--c8);
	--color-muted: var(--c4);
	--color-border: var(--c3);

	--color-primary: var(--c5);
	--color-primary-hover: hsl(var(--c6-h) calc(var(--c6-s) - 5%) calc(var(--c6-l) - 10%));
	--color-accent: var(--c6);

	--color-link: var(--c4);
	--color-link-hover: var(--c5);

	--color-on-primary: var(--c1);
	--color-on-dark: var(--c1);
	--color-on-dark-muted: rgb(255 255 255 / 0.6);
	--color-on-dark-link: rgb(255 255 255 / 0.8);

	/* ── Typographie ──────────────────────────────────────────────────────
	 * Kumbh Sans 700 pour les titres, Mulish pour le reste.
	 * `capitalize` sur les titres est repris du réglage Avada d'origine.
	 */
	--font-headings: "Kumbh Sans", Arial, Helvetica, sans-serif;
	--font-body: "Mulish", Arial, Helvetica, sans-serif;

	--weight-heading: 700;
	--weight-body: 400;
	--weight-medium: 500;
	--weight-lead: 600;

	--tracking-heading: -0.020em;
	--tracking-body: -0.015em;

	--leading-body: 1.8;
	--leading-tight: 1.6;

	/* Interlignes par niveau — repris un à un d'Avada, ils ne suivent pas
	 * une progression régulière et cela s'entend dans le rythme des pages. */
	--leading-h1: 1.2;
	--leading-h2: 1.4;
	--leading-h3: 1.3;
	--leading-h4: 1.4;
	--leading-h5: 1.3;
	--leading-h6: 1.3;

	/* Échelle de titres — les valeurs hautes sont celles d'Avada (56/44/36/28/22/16).
	 * Avada les appliquait sans adaptation ; on les borne en bas pour que le mobile
	 * reste lisible. C'est le seul écart volontaire avec le rendu d'origine. */
	--size-h1: clamp(2.125rem, 1.45rem + 3.0vw, 3.5rem);
	--size-h2: clamp(1.75rem, 1.25rem + 2.2vw, 2.75rem);
	--size-h3: clamp(1.5rem, 1.15rem + 1.6vw, 2.25rem);
	--size-h4: clamp(1.3125rem, 1.13rem + 0.8vw, 1.75rem);
	--size-h5: clamp(1.1875rem, 1.13rem + 0.25vw, 1.375rem);
	--size-h6: 1rem;

	--size-body: 1.0625rem;   /* 17px */
	--size-lead: 1.0625rem;   /* 17px, graisse 600 */
	--size-sub: 1.5rem;       /* 24px */
	--size-small: 0.9375rem;  /* 15px */
	--size-meta: 0.8125rem;   /* 13px */
	--size-quote: 1.375rem;   /* 22px */

	--size-page-title: clamp(2rem, 1.4rem + 2.8vw, 3.375rem); /* 54px */
	--size-post-title: clamp(1.875rem, 1.3rem + 2.4vw, 2.875rem); /* 46px */

	/* ── Layout ───────────────────────────────────────────────────────────── */
	--container: 1320px;
	--gutter: 30px;
	--section-padding: 60px;

	--space-3xs: 0.25rem;
	--space-2xs: 0.5rem;
	--space-xs: 0.75rem;
	--space-sm: 1rem;
	--space-md: 1.25rem;
	--space-lg: 2rem;
	--space-xl: 3.75rem;  /* 60px — le rythme vertical d'Avada */
	--space-2xl: 5rem;

	/* ── Formes ───────────────────────────────────────────────────────────── */
	--radius: 8px;
	--radius-sm: 4px;
	--radius-field: 6px;
	--radius-pill: 100px;

	--shadow-sm: 0 1px 2px rgb(17 17 17 / 0.06);
	--shadow: 0 1px 2px rgb(17 17 17 / 0.06), 0 8px 24px rgb(17 17 17 / 0.08);

	/* ── Boutons ──────────────────────────────────────────────────────────── */
	--button-padding: 20px 40px 22px;
	--button-radius: var(--radius-pill);

	/* ── Mouvement ────────────────────────────────────────────────────────── */
	--transition: 180ms cubic-bezier(0.2, 0, 0.2, 1);
	--transition-slow: 280ms cubic-bezier(0.2, 0, 0.2, 1);
}