/* ========================================
   FRAMER APPEAR ANIMATIONS
   ======================================== */

/* Animation keyframes based on Framer appear data */

/* Spring animation keyframes */
@keyframes appear-spring-up {
	0% {
		opacity: 0.001;
		transform: translateY(40px);
	}
	100% {
		opacity: 1;
		transform: translateY(0px);
	}
}

@keyframes appear-spring-down {
	0% {
		opacity: 0.001;
		transform: translateY(-150px);
	}
	100% {
		opacity: 1;
		transform: translateY(0px);
	}
}

@keyframes appear-scale-fade {
	0% {
		opacity: 0.001;
		transform: scale(1.2);
	}
	100% {
		opacity: 1;
		transform: scale(1);
	}
}

@keyframes appear-fade-only {
	0% {
		opacity: 0.001;
	}
	100% {
		opacity: 1;
	}
}

@keyframes appear-fade-partial {
	0% {
		opacity: 0.001;
	}
	100% {
		opacity: 0.35;
	}
}

/* ========================================
   ANIMATION CLASSES
   ======================================== */

/* Base animation class */
.framer-appear-animation {
	animation-fill-mode: both;
	animation-timing-function: cubic-bezier(0.44, 0, 0.56, 1);
}

/* Specific animations for each element ID */

/* oiko23 - Header navigation with transform template */
[data-framer-appear-id="oiko23"] {
	animation: appear-spring-down 0.8s cubic-bezier(0.44, 0, 0.56, 1) 0s both;
	transform-origin: center;
}

/* 197f8vq - Hero content */
[data-framer-appear-id="197f8vq"] {
	animation: appear-spring-up 0.8s cubic-bezier(0.44, 0, 0.56, 1) 0.1s both;
}

/* 1yft3nv - Content section */
[data-framer-appear-id="1yft3nv"] {
	animation: appear-spring-up 0.8s cubic-bezier(0.44, 0, 0.56, 1) 0.3s both;
	perspective: 1200px;
}

/* nqkn6i - Content section with longer delay */
[data-framer-appear-id="nqkn6i"] {
	animation: appear-spring-up 0.8s cubic-bezier(0.44, 0, 0.56, 1) 0.5s both;
	perspective: 1200px;
}

/* 9u8728 - Centered element with transform template */
[data-framer-appear-id="9u8728"] {
	animation: appear-fade-only 1.5s cubic-bezier(0.44, 0, 0.56, 1) 0.3s both;
	transform-origin: center;
}

/* bwyuny - Main target element with scale animation */
[data-framer-appear-id="bwyuny"] {
	animation: appear-scale-fade 1.2s cubic-bezier(0.44, 0, 0.56, 1) 1s both;
	transform-origin: center;
}

/* j599p2, 12cgz0n, 3uiry7, 16bt43i - Scale fade animations */
[data-framer-appear-id="j599p2"],
[data-framer-appear-id="12cgz0n"],
[data-framer-appear-id="3uiry7"],
[data-framer-appear-id="16bt43i"] {
	animation: appear-scale-fade 1.2s cubic-bezier(0.44, 0, 0.56, 1) 1s both;
}

/* Background elements with partial opacity */
[data-framer-appear-id="1686fo2"],
[data-framer-appear-id="14w3bot"],
[data-framer-appear-id="1ieip20"],
[data-framer-appear-id="48mhml"],
[data-framer-appear-id="1gxcrjq"],
[data-framer-appear-id="lfh3mq"] {
	animation: appear-fade-partial 1.5s cubic-bezier(0.44, 0, 0.56, 1) 0.3s both;
}

/* Content sections with perspective */
[data-framer-appear-id="1xeyeif"],
[data-framer-appear-id="1c0tbg2"] {
	animation: appear-spring-up 0.8s cubic-bezier(0.44, 0, 0.56, 1) 0.3s both;
	perspective: 1200px;
}

[data-framer-appear-id="1c0tbg2"] {
	animation-delay: 0.5s;
}

/* Single element animations */
[data-framer-appear-id="1r7mkfk"] {
	animation: appear-spring-up 0.8s cubic-bezier(0.44, 0, 0.56, 1) 0.3s both;
	perspective: 1200px;
}

[data-framer-appear-id="13rxeoy"] {
	animation: appear-fade-only 1.5s cubic-bezier(0.44, 0, 0.56, 1) 0.3s both;
}

/* ========================================
   RESPONSIVE ANIMATIONS
   ======================================== */

/* Disable animations on reduced motion preference */
@media (prefers-reduced-motion: reduce) {
	[data-framer-appear-id] {
		animation: none !important;
		opacity: 1 !important;
		transform: none !important;
	}
}

/* Adjust animations for smaller screens */
@media (max-width: 809px) {
	[data-framer-appear-id] {
		animation-duration: 0.6s;
	}

	@keyframes appear-spring-up {
		0% {
			opacity: 0.001;
			transform: translateY(20px);
		}
		100% {
			opacity: 1;
			transform: translateY(0px);
		}
	}

	@keyframes appear-spring-down {
		0% {
			opacity: 0.001;
			transform: translateY(-75px);
		}
		100% {
			opacity: 1;
			transform: translateY(0px);
		}
	}
}

/* ========================================
   FRAMER ANIMATIONS - DIRECT FROM REACT
   ======================================== */

/* Keyframes for continuous rotation */
@keyframes rotate-continuous {
	0% {
		transform: rotate(0deg);
	}
	100% {
		transform: rotate(360deg);
	}
}

/* Star twinkling animation */
@keyframes star-twinkle {
	0%,
	100% {
		opacity: 0.8;
		transform: scale(1);
	}
	50% {
		opacity: 1;
		transform: scale(1.05);
	}
}

/* Avatar hover animation - scale 1.1 avec préservation des transformations existantes */
.framer-7i3kfm-container {
	transition: all 0.2s ease-out !important;
	z-index: 1;
}
.framer-7i3kfm-container:hover {
	transform: translateY(-25%) scale(1.1) !important;
	z-index: 10;
}

.framer-1slni18-container {
	transition: all 0.2s ease-out !important;
	z-index: 1;
}
.framer-1slni18-container:hover {
	transform: translateY(-25%) scale(1.1) !important;
	z-index: 10;
}

.framer-pph02m-container {
	transition: all 0.2s ease-out !important;
	z-index: 1;
}
.framer-pph02m-container:hover {
	transform: translateY(-25%) scale(1.1) !important;
	z-index: 10;
}

.framer-1flizrq-container {
	transition: all 0.2s ease-out !important;
	z-index: 1;
}
.framer-1flizrq-container:hover {
	transform: translateY(-25%) scale(1.1) !important;
	z-index: 10;
}

.framer-1dsxgoz-container {
	transition: all 0.2s ease-out !important;
	z-index: 1;
}
.framer-1dsxgoz-container:hover {
	transform: translateY(-25%) scale(1.1) !important;
	z-index: 10;
}

/* Button hover animations - whileTap scale 0.9 */
button:active,
.framer-button:active {
	transform: scale(0.9);
	transition: transform 0.05s ease-out;
}

/* Star animations - simple twinkling */
.framer-41k7i5,
.framer-7jazmv,
.framer-tvqvvr,
.framer-1hovr56,
.framer-b3w2t2 {
	animation: star-twinkle 3s ease-in-out infinite;
}

/* Stagger star animations */
.framer-41k7i5 {
	animation-delay: 0s;
}
.framer-7jazmv {
	animation-delay: 0.6s;
}
.framer-tvqvvr {
	animation-delay: 1.2s;
}
.framer-1hovr56 {
	animation-delay: 1.8s;
}
.framer-b3w2t2 {
	animation-delay: 2.4s;
}

/* Continuous rotation for glow elements - will-change: transform */
.framer-1ibt9zd,
.framer-ru09yz,
.framer-zzjcmx,
.framer-ha9wxm,
.framer-1snvfia,
.framer-1umm8ie,
.framer-lipcen,
.framer-1um24av,
.framer-1sppexy,
.framer-w47hlo,
.framer-byv9gq,
.framer-i1yo4a,
.framer-1hr18x0,
.framer-1skap1r,
.framer-1pytiok,
.framer-3aw1g5,
.framer-1l6bpng,
.framer-g246xy,
.framer-dlsetp,
.framer-1kff827,
.framer-gh5sx,
.framer-1h82hhi,
.framer-r8kk15,
.framer-1sgeauc,
.framer-1ojm0af,
.framer-cr1b6k,
.framer-1lzgude {
	animation: rotate-continuous 20s linear infinite;
}

/* Slower rotation for some elements */
.framer-1280n73,
.framer-cdx0te,
.framer-1rgr5ip,
.framer-tcyzkn,
.framer-1nlyh1b,
.framer-faluk4,
.framer-1cfwglf,
.framer-3bd8bl,
.framer-m3w2r4 {
	animation: rotate-continuous 30s linear infinite reverse;
}

/* ========================================
   GLOW ROTATION ANIMATIONS
   ======================================== */

/* Continuous rotation for glow elements */
.framer-1ibt9zd,
.framer-ru09yz,
.framer-zzjcmx,
.framer-ha9wxm,
.framer-1snvfia,
.framer-1umm8ie,
.framer-lipcen,
.framer-1um24av,
.framer-1sppexy,
.framer-w47hlo,
.framer-byv9gq,
.framer-i1yo4a,
.framer-1hr18x0,
.framer-1skap1r,
.framer-1pytiok,
.framer-3aw1g5,
.framer-1l6bpng,
.framer-g246xy,
.framer-dlsetp,
.framer-1kff827,
.framer-gh5sx,
.framer-1h82hhi,
.framer-r8kk15,
.framer-1sgeauc,
.framer-1ojm0af,
.framer-cr1b6k,
.framer-1lzgude {
	will-change: transform;
	animation: star-rotate 20s linear infinite;
}

/* Slower rotation for some elements */
.framer-1280n73,
.framer-cdx0te,
.framer-1rgr5ip,
.framer-tcyzkn,
.framer-1nlyh1b,
.framer-faluk4,
.framer-1cfwglf,
.framer-3bd8bl,
.framer-m3w2r4 {
	will-change: transform;
	animation: star-rotate 30s linear infinite reverse;
}

/* ========================================
   ANIMATION UTILITIES
   ======================================== */

/* Force animation replay */
.replay-animation {
	animation-name: none;
}

.replay-animation.active {
	animation-name: inherit;
}

/* Animation delay utilities */
.delay-short {
	animation-delay: 0.1s;
}
.delay-medium {
	animation-delay: 0.3s;
}
.delay-long {
	animation-delay: 0.5s;
}
.delay-extra-long {
	animation-delay: 1s;
}
