/* === Ozzéo Design Tokens — SOT charte graphique === */
/* Source : .altitudenexus/projects/ozzeo/audits/2026-05-03/CHARTE-GRAPHIQUE-OZZEO.md */

:root {
	/* Couleurs principales (extraites du kit Elementor) */
	--ozzeo-primary: #1E88E5;
	--ozzeo-primary-dark: #1565C0;
	--ozzeo-primary-light: #64B5F6;
	--ozzeo-secondary: #1E88E5;
	--ozzeo-dark: #0F1123;
	--ozzeo-text: #393E46;
	--ozzeo-text-soft: #5F6470;
	--ozzeo-orange: #E79852;
	--ozzeo-orange-dark: #D17F38;
	--ozzeo-bg-light: #F3F9FF;
	--ozzeo-bg-grey: #F8FAFC;
	--ozzeo-white: #FEFEFF;
	--ozzeo-grey: #AAAAAA;
	--ozzeo-border: #E5E7EB;
	--ozzeo-success: #43A047;

	/* Typo */
	--ozzeo-font: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

	/* Espacements */
	--ozzeo-space-1: 4px;
	--ozzeo-space-2: 8px;
	--ozzeo-space-3: 16px;
	--ozzeo-space-4: 24px;
	--ozzeo-space-5: 32px;
	--ozzeo-space-6: 48px;
	--ozzeo-space-7: 64px;
	--ozzeo-space-8: 96px;

	/* Radius */
	--ozzeo-radius-sm: 6px;
	--ozzeo-radius-md: 12px;
	--ozzeo-radius-lg: 20px;

	/* Shadows */
	--ozzeo-shadow-sm: 0 1px 2px rgba(15, 17, 35, .05), 0 1px 3px rgba(15, 17, 35, .08);
	--ozzeo-shadow-md: 0 4px 6px rgba(15, 17, 35, .05), 0 10px 15px rgba(15, 17, 35, .08);
	--ozzeo-shadow-lg: 0 20px 40px rgba(15, 17, 35, .10), 0 8px 16px rgba(15, 17, 35, .06);

	/* Transitions */
	--ozzeo-trans: all 0.2s ease;
}

/* === Container utilitaire === */
.ozzeo-container {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 clamp(20px, 5vw, 40px);
}

/* === Composants réutilisables (scope page money uniquement) === */
.ozzeo-money * { box-sizing: border-box; }

.ozzeo-money {
	font-family: var(--ozzeo-font);
	font-weight: 400;
	font-size: 17px;
	line-height: 1.6;
	color: var(--ozzeo-text);
}

.ozzeo-money h1,
.ozzeo-money h2,
.ozzeo-money h3,
.ozzeo-money h4 {
	font-family: var(--ozzeo-font);
	color: var(--ozzeo-dark);
	margin: 0 0 var(--ozzeo-space-3);
	line-height: 1.2;
}

.ozzeo-money h1 {
	font-weight: 900;
	font-size: clamp(36px, 5vw, 56px);
	letter-spacing: -0.02em;
	line-height: 1.1;
}
.ozzeo-money h2 { font-weight: 600; font-size: clamp(28px, 3.5vw, 40px); }
.ozzeo-money h3 { font-weight: 600; font-size: clamp(22px, 2.4vw, 28px); }
.ozzeo-money h4 { font-weight: 600; font-size: clamp(18px, 1.8vw, 22px); }

.ozzeo-money p { margin: 0 0 var(--ozzeo-space-3); }

.ozzeo-money a:not(.ozm-btn) { color: var(--ozzeo-primary); text-decoration: none; }
.ozzeo-money a:not(.ozm-btn):hover { color: var(--ozzeo-primary-dark); text-decoration: underline; }

/* === Boutons === */
.ozm-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--ozzeo-space-2);
	font-family: var(--ozzeo-font);
	font-weight: 600;
	font-size: 17px;
	letter-spacing: 0.01em;
	border-radius: var(--ozzeo-radius-md);
	padding: 16px 32px;
	text-decoration: none;
	cursor: pointer;
	border: 0;
	transition: var(--ozzeo-trans);
	line-height: 1;
}
.ozm-btn.ozm-btn--primary {
	background: var(--ozzeo-primary);
	color: #fff;
	box-shadow: var(--ozzeo-shadow-md);
}
.ozm-btn.ozm-btn--primary:hover {
	background: var(--ozzeo-primary-dark);
	color: #fff;
	transform: translateY(-1px);
	box-shadow: var(--ozzeo-shadow-lg);
	text-decoration: none;
}
.ozm-btn--secondary {
	background: transparent;
	color: var(--ozzeo-primary);
	border: 2px solid var(--ozzeo-primary);
	padding: 14px 30px;
}
.ozm-btn--secondary:hover {
	background: var(--ozzeo-primary);
	color: var(--ozzeo-white);
	text-decoration: none;
}
.ozm-btn--ghost {
	background: transparent;
	color: var(--ozzeo-dark);
	padding: 14px 24px;
}
.ozm-btn--ghost:hover { color: var(--ozzeo-primary); text-decoration: none; }

/* === Badge crédit impôt === */
.ozm-badge-credit {
	display: inline-flex;
	align-items: center;
	gap: var(--ozzeo-space-1);
	background: linear-gradient(135deg, var(--ozzeo-orange) 0%, var(--ozzeo-orange-dark) 100%);
	color: white;
	padding: 6px 14px;
	border-radius: 100px;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.02em;
	box-shadow: var(--ozzeo-shadow-sm);
}

/* === Form input partagé === */
.ozm-input {
	width: 100%;
	padding: 14px 16px;
	border: 1.5px solid var(--ozzeo-border);
	border-radius: var(--ozzeo-radius-md);
	font-family: var(--ozzeo-font);
	font-size: 16px;
	color: var(--ozzeo-text);
	background: var(--ozzeo-white);
	transition: border-color 0.2s, box-shadow 0.2s;
}
.ozm-input:focus {
	outline: none;
	border-color: var(--ozzeo-primary);
	box-shadow: 0 0 0 3px rgba(30, 136, 229, .12);
}

/* === Mobile === */
@media (max-width: 768px) {
	.ozzeo-money { font-size: 16px; }
	.ozm-btn { padding: 14px 24px; font-size: 16px; width: 100%; }
}
