/**
 * GEOCIKLO Core — Motion System
 * Climate-Tech Platform 2026
 */

/* 1. Base Reveal Utility Classes */
.gc-reveal {
	opacity: 0;
	transition: opacity var(--gc-motion-slow) var(--gc-ease-out);
	will-change: opacity;
}

.gc-reveal.gc-is-revealed {
	opacity: 1;
}

.gc-reveal-up {
	opacity: 0;
	transform: translateY(24px);
	transition: opacity var(--gc-motion-slow) var(--gc-ease-spring),
	            transform var(--gc-motion-slow) var(--gc-ease-spring);
	will-change: opacity, transform;
}

.gc-reveal-up.gc-is-revealed {
	opacity: 1;
	transform: translateY(0);
}

.gc-fade {
	opacity: 0;
	transition: opacity var(--gc-motion-base) var(--gc-ease-smooth);
}

.gc-fade.gc-is-active {
	opacity: 1;
}

/* 2. Micro-interactions & Hover Effects */
.gc-hover-lift {
	transition: transform var(--gc-motion-fast) var(--gc-ease-spring),
	            box-shadow var(--gc-motion-fast) var(--gc-ease-spring);
}

.gc-hover-lift:hover {
	transform: translateY(-2px);
	box-shadow: var(--gc-shadow-md);
}

.gc-hover-lift:active {
	transform: translateY(0);
}

.gc-magnetic {
	transition: transform var(--gc-motion-fast) var(--gc-ease-spring);
}

/* Arrow & Icon Micro-transitions */
.gc-icon-shift {
	display: inline-block;
	transition: transform var(--gc-motion-fast) var(--gc-ease-spring);
}

*:hover > .gc-icon-shift,
button:hover .gc-icon-shift,
a:hover .gc-icon-shift {
	transform: translateX(4px);
}

.gc-icon-spin-subtle {
	display: inline-block;
	transition: transform var(--gc-motion-base) var(--gc-ease-spring);
}

*:hover > .gc-icon-spin-subtle {
	transform: rotate(180deg);
}

/* AI Glow Pulse */
.gc-ai-glow {
	position: relative;
}

.gc-ai-glow::after {
	content: '';
	position: absolute;
	inset: -2px;
	border-radius: inherit;
	background: linear-gradient(135deg, rgba(63, 174, 106, 0.4), rgba(3, 88, 119, 0.2));
	z-index: -1;
	opacity: 0;
	transition: opacity var(--gc-motion-base) ease;
	filter: blur(6px);
}

.gc-ai-glow:hover::after {
	opacity: 1;
}

/* 3. Stagger Animations for Menus */
.gc-stagger > * {
	opacity: 0;
	transform: translateY(8px);
	transition: opacity var(--gc-motion-base) var(--gc-ease-spring),
	            transform var(--gc-motion-base) var(--gc-ease-spring);
}

.gc-is-open .gc-stagger > *:nth-child(1) { transition-delay: 40ms; opacity: 1; transform: translateY(0); }
.gc-is-open .gc-stagger > *:nth-child(2) { transition-delay: 80ms; opacity: 1; transform: translateY(0); }
.gc-is-open .gc-stagger > *:nth-child(3) { transition-delay: 120ms; opacity: 1; transform: translateY(0); }
.gc-is-open .gc-stagger > *:nth-child(4) { transition-delay: 160ms; opacity: 1; transform: translateY(0); }
.gc-is-open .gc-stagger > *:nth-child(5) { transition-delay: 200ms; opacity: 1; transform: translateY(0); }
.gc-is-open .gc-stagger > *:nth-child(6) { transition-delay: 240ms; opacity: 1; transform: translateY(0); }

/* 4. Accessibility: Reduced Motion */
@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}

	.gc-reveal-up,
	.gc-reveal,
	.gc-stagger > * {
		transform: none !important;
		opacity: 1 !important;
	}
}