/* ==========================================================================
   WOW EFFECT — Lueur d'Espoir
   Couche "premium" qui transforme le site en expérience cinématique.
   ========================================================================== */

/* ========== Curseur custom étoile dorée ========== */
@media (hover: hover) and (pointer: fine) {
	body.lde-body { cursor: none; }
	a, button, input, textarea, select, label, [role="button"] { cursor: none; }

	.lde-cursor {
		position: fixed;
		top: 0; left: 0;
		width: 24px; height: 24px;
		pointer-events: none;
		z-index: 99999;
		transform: translate(-50%, -50%);
		transition: transform .15s ease-out;
		will-change: transform;
	}
	.lde-cursor::before {
		content: "✦";
		display: block;
		color: var(--lde-gold-light);
		font-size: 22px;
		text-shadow: 0 0 12px rgba(247,210,125,.8), 0 0 24px rgba(231,111,81,.4);
		text-align: center;
		line-height: 24px;
		animation: lde-cursor-spin 8s linear infinite;
	}
	.lde-cursor-trail {
		position: fixed;
		top: 0; left: 0;
		width: 60px; height: 60px;
		border-radius: 50%;
		background: radial-gradient(circle, rgba(247,210,125,.18) 0%, transparent 70%);
		pointer-events: none;
		z-index: 99998;
		transform: translate(-50%, -50%);
		transition: transform .35s cubic-bezier(.16,1,.3,1), opacity .25s;
		will-change: transform;
		mix-blend-mode: screen;
	}
	.lde-cursor.is-hovering { transform: translate(-50%,-50%) scale(1.6); }
	.lde-cursor.is-hovering::before { color: var(--lde-ember); }
	.lde-cursor-trail.is-hovering { transform: translate(-50%,-50%) scale(1.5); background: radial-gradient(circle, rgba(231,111,81,.25) 0%, transparent 70%); }
}
@keyframes lde-cursor-spin {
	to { transform: rotate(360deg); }
}

/* ========== Gradient mesh animé globalement ========== */
body.lde-body::after {
	content: "";
	position: fixed;
	inset: -20%;
	pointer-events: none;
	z-index: -2;
	background:
		radial-gradient(circle at 20% 30%, rgba(231, 111, 81, .12) 0%, transparent 35%),
		radial-gradient(circle at 80% 20%, rgba(247, 210, 125, .08) 0%, transparent 40%),
		radial-gradient(circle at 50% 80%, rgba(168, 111, 31, .10) 0%, transparent 45%),
		radial-gradient(circle at 90% 90%, rgba(231, 111, 81, .08) 0%, transparent 40%);
	animation: lde-mesh-drift 24s ease-in-out infinite alternate;
	filter: blur(60px);
}
@keyframes lde-mesh-drift {
	0%   { transform: translate(0, 0) rotate(0deg); }
	50%  { transform: translate(3%, -2%) rotate(2deg); }
	100% { transform: translate(-2%, 3%) rotate(-2deg); }
}

/* ========== HERO CINÉMATIQUE ========== */
.lde-hero {
	min-height: 92vh;
	display: flex; align-items: center; justify-content: center;
	overflow: hidden;
	perspective: 1200px;
}
.lde-hero-bg {
	opacity: .42 !important;
	transition: transform .8s cubic-bezier(.16,1,.3,1);
	transform: scale(1.08);
}
.lde-hero.is-loaded .lde-hero-bg { transform: scale(1); }

/* Voile gradient riche par-dessus */
.lde-hero::after {
	background:
		radial-gradient(ellipse 60% 80% at 50% 50%, rgba(247,210,125,.18) 0%, transparent 60%),
		radial-gradient(circle at 20% 80%, rgba(231,111,81,.22) 0%, transparent 50%),
		radial-gradient(circle at 80% 20%, rgba(247,210,125,.14) 0%, transparent 55%),
		linear-gradient(180deg, rgba(10,26,58,.3) 0%, rgba(10,26,58,.55) 100%) !important;
}

/* Titre cinéma : chaque lettre animée */
.lde-hero-title {
	font-size: clamp(3.5rem, 9vw, 7rem) !important;
	font-weight: 500 !important;
	letter-spacing: -2px !important;
	line-height: .95 !important;
	margin: 0 0 .3em !important;
	color: var(--lde-cream) !important;
}
.lde-hero-title .lde-char {
	display: inline-block;
	opacity: 0;
	transform: translateY(60px) rotateX(-90deg);
	transform-origin: bottom;
	animation: lde-char-in .9s cubic-bezier(.16,1,.3,1) forwards;
}
@keyframes lde-char-in {
	to { opacity: 1; transform: translateY(0) rotateX(0); }
}

/* Underline du titre devient une vraie ligne dessinée */
.lde-hero-title::after {
	content: "";
	display: block;
	width: 0;
	height: 2px;
	margin: 28px auto 0 !important;
	background: var(--lde-grad-ember);
	border-radius: 4px;
	box-shadow: 0 0 24px rgba(247, 210, 125, .6);
	animation: lde-line-draw 1.4s cubic-bezier(.16,1,.3,1) 1.2s forwards;
}
@keyframes lde-line-draw {
	to { width: 120px; }
}

.lde-hero-subtitle {
	font-size: clamp(.85rem, 1.5vw, 1rem) !important;
	letter-spacing: 6px !important;
	font-weight: 600 !important;
	text-transform: uppercase;
	margin-bottom: 24px !important;
	opacity: 0;
	animation: lde-fade-up .8s ease 1.6s forwards;
}
.lde-hero-baseline {
	font-size: clamp(1.3rem, 2.4vw, 1.85rem) !important;
	max-width: 760px;
	margin: 0 auto 44px !important;
	opacity: 0;
	animation: lde-fade-up .8s ease 1.9s forwards;
}
.lde-hero-cta {
	opacity: 0;
	animation: lde-fade-up .8s ease 2.2s forwards;
}
.lde-hero-cta .lde-btn {
	animation: none !important;
	padding: 18px 36px !important;
	font-size: 1rem !important;
	letter-spacing: 1px !important;
	text-transform: uppercase;
	font-weight: 600 !important;
}

/* Indicateur de scroll cinématique */
.lde-hero::before {
	content: "";
}
.lde-scroll-hint {
	position: absolute;
	bottom: 32px; left: 50%;
	transform: translateX(-50%);
	width: 28px; height: 46px;
	border: 2px solid rgba(247, 210, 125, .55);
	border-radius: 20px;
	z-index: 4;
	opacity: 0;
	animation: lde-fade-up 1s ease 2.6s forwards;
}
.lde-scroll-hint::after {
	content: "";
	position: absolute;
	left: 50%; top: 8px;
	width: 4px; height: 8px;
	background: var(--lde-gold-light);
	border-radius: 4px;
	transform: translateX(-50%);
	animation: lde-scroll-bounce 2s ease-in-out infinite;
}
@keyframes lde-scroll-bounce {
	0%, 20% { transform: translate(-50%, 0); opacity: 1; }
	80%, 100% { transform: translate(-50%, 18px); opacity: 0; }
}

/* ========== PARTICULES FLOTTANTES JS ========== */
.lde-particles {
	position: fixed;
	inset: 0;
	pointer-events: none;
	z-index: 1;
	overflow: hidden;
}
.lde-particle {
	position: absolute;
	width: 3px; height: 3px;
	background: radial-gradient(circle, var(--lde-gold-light) 0%, transparent 70%);
	border-radius: 50%;
	pointer-events: none;
	will-change: transform;
}

/* ========== DIVIDERS SVG ENTRE SECTIONS ========== */
.lde-section-divider {
	display: block;
	width: 100%;
	height: 80px;
	margin: 0;
}
.lde-section-divider svg { display: block; width: 100%; height: 100%; }

/* ========== STATS ANIMÉS ========== */
.lde-stats {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
	gap: 30px;
	max-width: 1100px;
	margin: 60px auto;
	padding: 50px 22px;
	position: relative;
}
.lde-stats::before {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(135deg, var(--lde-navy) 0%, var(--lde-navy-soft) 100%);
	border-radius: var(--lde-radius-lg);
	z-index: -1;
	box-shadow: 0 30px 80px rgba(10, 26, 58, .25);
}
.lde-stats::after {
	content: "";
	position: absolute;
	inset: 0;
	background-image:
		radial-gradient(1.5px 1.5px at 14% 24%, #fff 50%, transparent),
		radial-gradient(1px 1px at 32% 68%, #f7d27d 50%, transparent),
		radial-gradient(2px 2px at 56% 18%, #fff 50%, transparent),
		radial-gradient(1px 1px at 82% 78%, #f7d27d 50%, transparent),
		radial-gradient(1.5px 1.5px at 94% 38%, #fff 50%, transparent);
	opacity: .55;
	border-radius: var(--lde-radius-lg);
	pointer-events: none;
	animation: lde-twinkle 5s ease-in-out infinite;
}
.lde-stat {
	text-align: center;
	color: var(--lde-cream);
	position: relative;
	z-index: 1;
}
.lde-stat-num {
	display: block;
	font-family: var(--lde-font-title);
	font-size: clamp(3rem, 6vw, 4.5rem);
	font-weight: 600;
	line-height: 1;
	background: linear-gradient(135deg, var(--lde-gold-light) 0%, var(--lde-ember) 100%);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	margin-bottom: 8px;
	letter-spacing: -2px;
}
.lde-stat-label {
	font-size: .82rem;
	letter-spacing: 2px;
	text-transform: uppercase;
	color: rgba(250, 243, 231, .85);
}

/* ========== MANIFESTE PLEIN ÉCRAN ========== */
.lde-manifesto {
	padding: clamp(80px, 14vw, 160px) 24px;
	text-align: center;
	position: relative;
	overflow: hidden;
}
.lde-manifesto-inner {
	max-width: 980px;
	margin: 0 auto;
	position: relative;
	z-index: 2;
}
.lde-manifesto-quote {
	font-family: var(--lde-font-title);
	font-size: clamp(1.8rem, 4vw, 3.2rem);
	font-weight: 500;
	font-style: italic;
	line-height: 1.3;
	color: var(--lde-navy);
	margin: 0;
	letter-spacing: -.5px;
}
.lde-manifesto-quote em {
	background: linear-gradient(135deg, var(--lde-ember) 0%, var(--lde-gold-text) 100%);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	font-style: italic;
	font-weight: 600;
}
.lde-manifesto-sign {
	margin-top: 36px;
	font-family: var(--lde-font-title);
	font-size: 1.1rem;
	color: var(--lde-text-soft);
	letter-spacing: 3px;
	text-transform: uppercase;
}
.lde-manifesto-sign::before {
	content: "✦  ";
	color: var(--lde-ember);
}

/* ========== MARQUEE SERVICES ========== */
.lde-marquee {
	overflow: hidden;
	background: var(--lde-navy);
	color: var(--lde-gold-light);
	padding: 20px 0;
	white-space: nowrap;
	position: relative;
}
.lde-marquee-inner {
	display: inline-flex;
	gap: 60px;
	animation: lde-marquee-scroll 28s linear infinite;
}
.lde-marquee-item {
	font-family: var(--lde-font-title);
	font-size: 1.25rem;
	font-style: italic;
	letter-spacing: 1px;
}
.lde-marquee-item::after {
	content: " ✦";
	color: var(--lde-ember);
	margin-left: 60px;
}
@keyframes lde-marquee-scroll {
	from { transform: translateX(0); }
	to   { transform: translateX(-50%); }
}

/* ========== SERVICE CARDS — 3D TILT ========== */
.lde-service-card {
	transform-style: preserve-3d;
	transition: transform .25s cubic-bezier(.16,1,.3,1), box-shadow .35s !important;
	will-change: transform;
}
.lde-service-card > * {
	transform: translateZ(0);
	transition: transform .35s ease;
}
.lde-service-card:hover {
	transform: perspective(900px) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg)) translateY(-10px) !important;
	box-shadow: 0 30px 80px rgba(10, 26, 58, .22), 0 0 0 1px rgba(232, 184, 109, .3) !important;
}
.lde-service-card:hover .lde-service-img img {
	transform: translateZ(40px) scale(1.05) !important;
}
.lde-service-card:hover .lde-service-title { transform: translateZ(30px); }
.lde-service-card:hover .lde-service-desc  { transform: translateZ(20px); }
.lde-service-card:hover .lde-service-link  { transform: translateZ(40px); }

/* Spot lumineux qui suit la souris sur la carte */
.lde-service-card { position: relative; isolation: isolate; }
.lde-service-card::before {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: inherit;
	background: radial-gradient(
		400px circle at var(--mx, 50%) var(--my, 50%),
		rgba(247, 210, 125, .18),
		transparent 40%
	);
	opacity: 0;
	transition: opacity .35s;
	pointer-events: none;
	z-index: 2;
}
.lde-service-card:hover::before { opacity: 1; }

/* ========== REVEAL CINÉMATIQUE AU SCROLL ========== */
[data-wow] {
	opacity: 0;
	transform: translateY(40px);
	transition: opacity 1s cubic-bezier(.16,1,.3,1), transform 1s cubic-bezier(.16,1,.3,1);
	will-change: transform, opacity;
}
[data-wow].is-visible {
	opacity: 1;
	transform: none;
}
[data-wow-scale] { transform: translateY(40px) scale(.96); }
[data-wow-scale].is-visible { transform: none; }
[data-wow-slide-left]  { transform: translateX(-40px); }
[data-wow-slide-right] { transform: translateX(40px); }
[data-wow-slide-left].is-visible,
[data-wow-slide-right].is-visible { transform: none; }
[data-wow-delay="1"]  { transition-delay: .12s; }
[data-wow-delay="2"]  { transition-delay: .24s; }
[data-wow-delay="3"]  { transition-delay: .36s; }
[data-wow-delay="4"]  { transition-delay: .48s; }

/* Titres avec un peu de poids supplémentaire */
.lde-page-content h2,
.lde-single-content h2 {
	font-size: clamp(1.8rem, 3.5vw, 2.6rem) !important;
	letter-spacing: -1px !important;
}

/* ========== BOUTONS — magnétiques + style premium ========== */
.lde-btn {
	position: relative;
	overflow: hidden;
	letter-spacing: .8px !important;
	transition: transform .25s cubic-bezier(.16,1,.3,1), box-shadow .25s, background .25s !important;
}
.lde-btn-primary {
	background: linear-gradient(135deg, var(--lde-ember) 0%, var(--lde-ember-deep) 50%, var(--lde-gold-text) 100%) !important;
	background-size: 200% 200% !important;
	background-position: 0% 0% !important;
}
.lde-btn-primary:hover {
	background-position: 100% 100% !important;
	transform: translateY(-3px) scale(1.02) !important;
	box-shadow: 0 18px 40px rgba(231, 111, 81, .5), 0 0 30px rgba(247, 210, 125, .3) !important;
}

/* ========== Lien "Découvrir" enrichi ========== */
.lde-service-link {
	display: inline-flex !important;
	align-items: center !important;
	gap: 6px !important;
	color: var(--lde-ember-text) !important;
	font-weight: 600 !important;
	position: relative;
	padding-bottom: 2px;
}
.lde-service-link::after {
	content: "";
	position: absolute;
	left: 0; bottom: 0;
	width: 0; height: 2px;
	background: var(--lde-ember);
	transition: width .35s;
}
.lde-service-card:hover .lde-service-link::after { width: 100%; }

/* ========== Salutation contextuelle ========== */
.lde-greeting {
	display: inline-block;
	padding: 8px 18px;
	background: rgba(247, 210, 125, .14);
	border: 1px solid rgba(247, 210, 125, .3);
	color: var(--lde-gold-light);
	font-size: .82rem;
	letter-spacing: 2px;
	text-transform: uppercase;
	border-radius: 30px;
	margin-bottom: 28px;
	font-weight: 500;
	backdrop-filter: blur(8px);
	animation: lde-fade-up .8s ease 1.4s both;
}

/* ========== Animation utilitaire ========== */
@keyframes lde-fade-up {
	from { opacity: 0; transform: translateY(20px); }
	to   { opacity: 1; transform: translateY(0); }
}

/* ========== Desktop only ========== */
@media (max-width: 720px) {
	body.lde-body { cursor: auto !important; }
	a, button { cursor: pointer !important; }
	.lde-cursor, .lde-cursor-trail { display: none !important; }
	.lde-service-card:hover { transform: translateY(-4px) !important; }
	.lde-service-card:hover .lde-service-img img,
	.lde-service-card:hover .lde-service-title,
	.lde-service-card:hover .lde-service-desc,
	.lde-service-card:hover .lde-service-link { transform: none !important; }
	.lde-stats { padding: 40px 22px; }
}

@media (prefers-reduced-motion: reduce) {
	.lde-hero-title .lde-char,
	.lde-hero-title::after,
	.lde-hero-subtitle, .lde-hero-baseline, .lde-hero-cta,
	[data-wow], .lde-greeting {
		opacity: 1 !important;
		transform: none !important;
		animation: none !important;
	}
	.lde-particle, .lde-cursor, .lde-cursor-trail { display: none !important; }
	body.lde-body::after { animation: none !important; }
}
