/*
 * Design tokens, repris à l'identique du README du handoff.
 * Design plat et clair : aucune ombre, séparations par bordures 1 px,
 * rayon 4 px partout, 3 px pour les badges, jamais plus arrondi.
 */

:root {
	/* Couleurs */
	--ppb-encre: #1A1D21;
	--ppb-texte: #3A4148;
	--ppb-attenue: #5C646E;
	--ppb-gris: #8B939C;
	--ppb-bordure-forte: #B6BEC7;
	--ppb-bordure: #D8DDE3;
	--ppb-canvas: #E4E8EC;
	--ppb-fond-clair: #F2F4F6;
	--ppb-blanc: #FFFFFF;
	--ppb-accent: #0B5FFF;
	--ppb-accent-hover: #0847BF;
	--ppb-signal: #FF5C1A;

	/* Typographie */
	--ppb-sans: 'Space Grotesk', system-ui, -apple-system, 'Segoe UI', sans-serif;
	--ppb-mono: 'IBM Plex Mono', ui-monospace, 'SFMono-Regular', 'Consolas', monospace;

	--ppb-h1: 44px;
	--ppb-h1-mobile: 32px;
	--ppb-h2: 26px;
	--ppb-h2-mobile: 22px;
	--ppb-h3: 18px;
	--ppb-corps: 16px;
	--ppb-eyebrow: 11px;
	--ppb-label: 12px;
	--ppb-tel: 15px;
	--ppb-chiffre: 40px;

	/* Espacements */
	--ppb-gouttiere: 4.5%;
	--ppb-section-y: 96px;
	--ppb-section-y-mobile: 48px;
	--ppb-gap-xs: 16px;
	--ppb-gap-s: 20px;
	--ppb-gap-m: 24px;
	--ppb-gap-l: 32px;
	--ppb-gap-xl: 40px;

	/* Formes */
	--ppb-rayon: 4px;
	--ppb-rayon-badge: 3px;
	--ppb-transition: 130ms ease;

	/* Motifs de fond */
	--ppb-trame-points: radial-gradient(circle at 6px 6px, var(--ppb-bordure) 4.5px, transparent 5px);
	--ppb-trame-millimetree:
		linear-gradient(rgba(216, 221, 227, .6) 1px, transparent 1px),
		linear-gradient(90deg, rgba(216, 221, 227, .6) 1px, transparent 1px),
		linear-gradient(rgba(216, 221, 227, .95) 1px, transparent 1px),
		linear-gradient(90deg, rgba(216, 221, 227, .95) 1px, transparent 1px);
}