/* Design tokens — docs/design-system.md */

:root {
	--color-orange-1: #f58018;
	--color-orange-2: #f35f2e;
	--color-sapin: #1b4038;
	--color-sapin-2: #0f2c27;
	--color-mint: #e0f2f2;
	--color-mint-2: #cfe9e7;
	--color-ink: #12332e;
	--color-grey: #5c6b68;
	--color-white: #ffffff;

	--color-brand-primary: var(--color-orange-1);
	--color-brand-primary-strong: var(--color-orange-2);
	--color-brand-secondary: var(--color-sapin);
	--color-text: var(--color-ink);
	--color-text-muted: var(--color-grey);
	--color-text-inverse: var(--color-white);
	--color-surface: var(--color-white);
	--color-surface-alt: var(--color-mint);
	--color-surface-alt-2: var(--color-mint-2);
	--color-surface-dark: var(--color-sapin);
	--color-border: var(--color-mint-2);
	--color-link: var(--color-sapin);
	--color-link-hover: var(--color-orange-2);
	--color-gradient-brand: linear-gradient(135deg, var(--color-orange-1), var(--color-orange-2));
	--color-gradient-brand-hero: linear-gradient(140deg, var(--color-orange-1), var(--color-orange-2));
	--color-focus: var(--color-orange-2);

	--font-serif: "Playfair Display", serif;
	--font-sans: "Poppins", sans-serif;

	--font-size-kicker: 12px;
	--font-size-body: 15.5px;
	--font-size-body-sm: 14px;
	--font-size-lead: 17px;
	--font-size-h1-hero: 50px;
	--font-size-h1-hero-sm: 34px;
	--font-size-h2: 38px;
	--font-size-h2-cta: 36px;
	--font-size-h3-card: 21px;
	--font-size-nav: 14px;
	--font-size-btn: 14px;
	--font-size-stat: 40px;
	--font-size-chiffre: 46px;

	--font-weight-light: 300;
	--font-weight-regular: 400;
	--font-weight-medium: 500;
	--font-weight-semibold: 600;
	--font-weight-bold: 700;
	--font-weight-black: 800;

	--line-height-body: 1.6;
	--line-height-h1: 1.12;
	--line-height-h2: 1.15;
	--letter-spacing-kicker: 4px;
	--letter-spacing-logo: 6px;

	--space-section-y: 56px;
	--space-section-y-lg: 88px;
	--space-hero-pad-top: 48px;
	--space-hero-pad-bottom: 56px;
	--space-hero-pad-top-lg: 84px;
	--space-hero-pad-bottom-lg: 96px;
	--space-stats-y: 44px;
	--space-cta-y: 74px;
	--space-sec-head-mb: 36px;
	--space-sec-head-mb-lg: 52px;
	--space-gutter: 24px;
	--space-grid-gap-sm: 18px;
	--space-grid-gap-md: 22px;
	--space-grid-gap-lg: 26px;
	--space-split-gap: 32px;
	--space-split-gap-lg: 56px;
	--space-hero-gap: 40px;
	--space-hero-gap-lg: 70px;
	--space-card-pad: 28px 24px;
	--space-card-pad-lg: 34px 28px;
	--space-btn-pad: 12px 26px;
	--space-nav-height: 74px;

	--container-max: 1180px;
	--container-padding: 24px;
	--container-sec-head-max: 760px;

	--radius-xs: 2px;
	--radius-sm: 3px;
	--radius-md: 4px;
	--radius-lg: 8px;
	--radius-xl: 10px;
	--radius-pill: 50%;

	--shadow-nav: 0 1px 12px rgba(20, 60, 55, 0.08);
	--shadow-btn: 0 6px 18px rgba(243, 95, 46, 0.35);
	--shadow-btn-inv: 0 8px 22px rgba(0, 0, 0, 0.18);
	--shadow-card: 0 8px 26px rgba(20, 60, 55, 0.07);
	--shadow-tile: 0 10px 30px rgba(20, 60, 55, 0.1);
	--shadow-media: 0 18px 48px rgba(20, 60, 55, 0.16);
	--shadow-mod-hover: 0 22px 55px rgba(20, 60, 55, 0.3);

	--transition-mod: transform 0.28s ease, box-shadow 0.28s ease;
	--transition-tile: transform 0.25s ease;
	--transition-nav: transform 0.2s ease, opacity 0.2s ease;

	--bp-sm: 600px;
	--bp-md: 900px;
}
