/*Variables css*/
:root body {

	/* ========================================
	   FONTS - Elementor Typography
	   ======================================== */

	/* Références directes aux variables Elementor */
	--font-primary: var(--e-global-typography-primary-font-family, 'Aptos', sans-serif);
	--font-secondary: var(--e-global-typography-secondary-font-family, 'DIN Pro', sans-serif);
	--font-text: var(--e-global-typography-text-font-family, 'DIN Pro', sans-serif);
	--font-accent: var(--e-global-typography-accent-font-family, 'Aptos', sans-serif);

	/* Tailles de police communes */
	--font-size-xs: 12px;
	--font-size-sm: 14px;
	--font-size-base: 16px;
	--font-size-lg: 18px;
	--font-size-xl: 20px;
	--font-size-2xl: 24px;
	--font-size-3xl: 30px;
	--font-size-4xl: 32px;
	--font-size-5xl: 36px;
	--font-size-main-title: clamp(2rem, 4vw, 3rem);

	/* Poids de police */
	--font-weight-light: 300;
	--font-weight-normal: 400;
	--font-weight-medium: 500;
	--font-weight-semibold: 600;
	--font-weight-bold: 700;
	--font-weight-extrabold: 800;

	/* ========================================
	   COLORS - Elementor Color System
	   ======================================== */

	/* Couleurs principales Elementor */
	--color-primary: var(--e-global-color-primary, #e1051c);
	--color-secondary: var(--e-global-color-secondary, #12162B);
	--color-text: var(--e-global-color-text, #000000);
	--color-accent: var(--e-global-color-accent, #e1051c);
	--color-primary-rgb: 226, 0, 26; /* Composantes RGB de --color-primary, pour rgba() */

	/* Couleurs spécifiques du site */
	--color-red: var(--e-global-color-primary, #e1051c); /* Rouge signature */
	--color-dark: var(--e-global-color-secondary, #12162B); /* Bleu foncé */
	--color-primary-dark: #c00518;
	--color-primary-darker: #b00416;
	--color-white: #ffffff;
	--color-black: #000000;


	/* ========================================
	   SPACING - Système d'espacement
	   ======================================== */

	--spacing-xs: 4px;
	--spacing-sm: 8px;
	--spacing-md: 16px;
	--spacing-lg: 24px;
	--spacing-xl: 32px;
	--spacing-2xl: 48px;
	--spacing-3xl: 64px;
	--spacing-4xl: 96px;

	/* ========================================
	   TRANSITIONS - Animations
	   ======================================== */

	--transition-fast: 150ms ease;
	--transition-base: 250ms ease;
	--transition-slow: 400ms ease;
	--transition-slower: 600ms ease;

	--ease-in: cubic-bezier(0.4, 0, 1, 1);
	--ease-out: cubic-bezier(0, 0, 0.2, 1);
	--ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);

	/* ========================================
	   Z-INDEX - Gestion des couches
	   ======================================== */

	--z-dropdown: 1000;
	--z-sticky: 1020;
	--z-fixed: 1030;
	--z-modal-backdrop: 1040;
	--z-modal: 1050;
	--z-popover: 1060;
	--z-tooltip: 1070;
	--z-header: 1000000;
	--z-menu: 999990;

	/* ========================================
	   BREAKPOINTS - Points de rupture
	   ======================================== */

	--breakpoint-mobile: 768px;
	--breakpoint-tablet: 1024px;
	--breakpoint-desktop: 1200px;
	--breakpoint-wide: 1440px;

	/* ========================================
	   BORDERS - Bordures et arrondis
	   ======================================== */

	--border-radius-sm: 4px;
	--border-radius-base: 8px;
	--border-radius-lg: 12px;
	--border-radius-xl: 16px;
	--border-radius-full: 9999px;

	--border-width: 1px;
	--border-width-thick: 2px;

	/* ========================================
	   SHADOWS - Ombres
	   ======================================== */

	--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
	--shadow-base: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1);
	--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);
	--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);
	--shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1);

	/* ========================================
	   HEADER & MENU - Hauteurs fixes
	   ======================================== */

	--header-height-mobile: 70px;
	--header-height-desktop: 86px;

	/* ========================================
	   OPACITIES - Niveaux d'opacité
	   ======================================== */

	--opacity-disabled: 0.5;
	--opacity-hover: 0.8;
	--opacity-overlay: 0.95;
}
