/*
 * Wobi - Mouvement : couche d'animations du site.
 * Active uniquement quand le script a ajoute .wobi-mvt sur <html>
 * (sans JavaScript, ou si l'appareil demande moins d'animations, tout reste
 * visible et immobile).
 */

:root { --mvt-ease: cubic-bezier(.2, .8, .2, 1); --mvt-orange: #F26A1B; }

/* 1. Barre de progression de lecture */
.wobi-progression {
	position: fixed; top: 0; left: 0; right: 0; height: 3px; z-index: 100000;
	background: var(--mvt-orange);
	transform-origin: 0 50%; transform: scaleX(var(--p, 0));
	pointer-events: none;
}
.admin-bar .wobi-progression { top: 32px; }
@media (max-width: 782px) { .admin-bar .wobi-progression { top: 46px; } }

/* 2. Titres principaux : mots qui montent un par un */
.wobi-mvt .wobi-mot { display: inline-block; overflow: hidden; vertical-align: bottom; padding-bottom: .08em; margin-bottom: -.08em; }
.wobi-mvt .wobi-mot > span { display: inline-block; transform: translateY(105%); }
.wobi-mvt .est-vu .wobi-mot > span {
	transform: none;
	transition: transform .9s var(--mvt-ease);
	transition-delay: calc(var(--m, 0) * 70ms + 120ms);
}

/* 3. Mots manuscrits du hero : apparition "tampon" l'un apres l'autre */
.wobi-mvt body.home .v2-hand__l { opacity: 0; transform: scale(.6) rotate(-10deg); }
.wobi-mvt body.home .v2-hand.est-vu .v2-hand__l {
	opacity: 1; transform: none;
	transition: opacity .35s ease, transform .6s cubic-bezier(.34, 1.56, .64, 1);
}
.wobi-mvt body.home .v2-hand.est-vu .v2-hand__l:nth-child(1) { transition-delay: .9s; }
.wobi-mvt body.home .v2-hand.est-vu .v2-hand__l:nth-child(2) { transition-delay: 1.15s; }
.wobi-mvt body.home .v2-hand.est-vu .v2-hand__l:nth-child(3) { transition-delay: 1.4s; }

/* 4. Halo orange du hero : derive tres lente + parallaxe */
.wobi-mvt body.home .v2-hero::before {
	translate: 0 calc(var(--py, 0) * 1px);
	animation: wobi-halo 14s ease-in-out infinite alternate;
}
@keyframes wobi-halo {
	from { transform: scale(1); opacity: .85; }
	to { transform: scale(1.18) translate(-30px, 20px); opacity: 1; }
}

/* 5. Photos : devoilement en rideau + leger dezoom */
.wobi-mvt .wobi-devoile img {
	clip-path: inset(0 0 100% 0 round 18px);
	transform: scale(1.08);
}
.wobi-mvt .wobi-devoile.est-vu img {
	clip-path: inset(0 0 0 0 round 18px);
	transform: none;
	transition: clip-path 1.1s var(--mvt-ease), transform 1.4s var(--mvt-ease);
	transition-delay: var(--d, 0ms);
}

/* 6. Badge "20 ans" : arrive en tournant */
.wobi-mvt body.home .v2-badge { opacity: 0; transform: rotate(-24deg) scale(.6) !important; }
.wobi-mvt body.home .v2-badge.est-vu {
	opacity: 1; transform: rotate(-6deg) !important;
	transition: opacity .4s ease .5s, transform .8s cubic-bezier(.34, 1.56, .64, 1) .5s;
}

/* 7. Filigrane "Services" : glisse avec le defilement */
.wobi-mvt body.home .v2-filigrane .elementor-heading-title { transform: translateX(calc(var(--px, 0) * 1px)); will-change: transform; }

/* 8. Icones des cartes : petit basculement au survol */
body.home .v2-impcarte .elementskit-info-box-icon,
body.home .v2-valcarte .elementskit-info-box-icon,
body.home .v2-svc__icone .elementor-icon { transition: transform .4s cubic-bezier(.34, 1.56, .64, 1), background .3s; }
body.home .v2-impcarte:hover .elementskit-info-box-icon,
body.home .v2-valcarte:hover .elementskit-info-box-icon { transform: rotate(-8deg) scale(1.08); background: var(--mvt-orange); }
body.home .v2-impcarte:hover .elementskit-info-box-icon i,
body.home .v2-valcarte:hover .elementskit-info-box-icon i,
body.home .v2-impcarte:hover .elementskit-info-box-icon svg,
body.home .v2-valcarte:hover .elementskit-info-box-icon svg { color: #fff !important; fill: #fff !important; }
body.home .v2-svc:hover .v2-svc__icone .elementor-icon { transform: rotate(-10deg) scale(1.1); }
body.home .v2-svc__img img { transition: transform .7s var(--mvt-ease); }
body.home .v2-svc:hover .v2-svc__img img { transform: scale(1.06); }

/* 9. Boutons principaux : reflet au survol */
.v2-btn--primaire .elementor-button,
.wobi-btn-primary .elementor-button { position: relative; overflow: hidden; isolation: isolate; }
.v2-btn--primaire .elementor-button::after,
.wobi-btn-primary .elementor-button::after {
	content: ""; position: absolute; top: 0; bottom: 0; left: -60%; width: 40%; z-index: -1;
	background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .35), transparent);
	transform: skewX(-20deg); pointer-events: none;
}
.v2-btn--primaire .elementor-button:hover::after,
.wobi-btn-primary .elementor-button:hover::after { left: 130%; transition: left .7s var(--mvt-ease); }

/* 10. Chiffres du bandeau : soulignement qui se dessine */
.wobi-mvt .wobi-sec--chiffres .wobi-stat .elementor-counter-number-wrapper { position: relative; }
.wobi-mvt .wobi-sec--chiffres .wobi-stat .elementor-counter-number-wrapper::after {
	content: ""; position: absolute; left: 0; bottom: -6px; height: 3px; width: 40px;
	background: currentColor; opacity: .5; border-radius: 2px;
	transform: scaleX(0); transform-origin: 0 50%;
}
.wobi-mvt .wobi-sec--chiffres .wobi-stat.est-vu .elementor-counter-number-wrapper::after { transform: scaleX(1); transition: transform .9s var(--mvt-ease) .3s; }

/* Mobile : pas de parallaxe */
@media (max-width: 767px) {
	.wobi-mvt body.home .v2-filigrane .elementor-heading-title { transform: none; }
	.wobi-mvt body.home .v2-hero::before { translate: none; }
}

/* Securite : l'editeur Elementor affiche tout, sans animation */
.elementor-editor-active .wobi-mot > span,
.elementor-editor-active .wobi-devoile img,
.elementor-editor-active .v2-hand__l,
.elementor-editor-active .v2-badge { transform: none !important; clip-path: none !important; opacity: 1 !important; }

@media (prefers-reduced-motion: reduce) {
	.wobi-progression { display: none; }
	.v2-btn--primaire .elementor-button::after, .wobi-btn-primary .elementor-button::after { display: none; }
	body.home .v2-hero::before { animation: none; }
}