/**
 * GuesTO design tokens — guesto-default preset.
 */

:root {
	--g-font: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

	--g-background: hsl(220, 20%, 97%);
	--g-foreground: hsl(215, 28%, 14%);
	--g-card: hsl(0, 0%, 100%);
	--g-card-foreground: hsl(215, 28%, 14%);
	--g-primary: hsl(215, 28%, 17%);
	--g-primary-fg: hsl(210, 40%, 98%);
	--g-accent: hsl(38, 92%, 50%);
	--g-accent-fg: hsl(30, 50%, 10%);
	--g-muted: hsl(220, 14%, 96%);
	--g-muted-fg: hsl(220, 9%, 46%);
	--g-border: hsl(220, 13%, 91%);
	--g-success: hsl(142, 71%, 45%);
	--g-destructive: hsl(0, 72%, 51%);
	--g-sidebar: hsl(215, 28%, 14%);
	--g-radius: 6px;
	--g-radius-lg: 8px;
	--g-shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);
	--g-shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.07), 0 2px 4px -2px rgb(0 0 0 / 0.05);
	--g-ring: 0 0 0 2px hsl(215 28% 17% / 0.15);
	--g-ease: cubic-bezier(0.22, 1, 0.36, 1);
	--g-ease-out: cubic-bezier(0.16, 1, 0.3, 1);
}

@keyframes guesto-fade-in {
	from {
		opacity: 0;
		transform: translateY(6px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

@keyframes guesto-fade-up {
	from {
		opacity: 0;
		transform: translateY(20px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

@keyframes guesto-scale-in {
	from {
		opacity: 0;
		transform: scale(0.96);
	}
	to {
		opacity: 1;
		transform: scale(1);
	}
}

@keyframes guesto-slide-right {
	from {
		opacity: 0;
		transform: translateX(24px);
	}
	to {
		opacity: 1;
		transform: translateX(0);
	}
}

@keyframes guesto-hero-ken {
	from {
		transform: scale(1.04);
	}
	to {
		transform: scale(1.08);
	}
}

.guesto-animate-in {
	animation: guesto-fade-in 0.5s var(--g-ease-out) forwards;
}

/* Scroll-reveal base */
.guesto-section {
	opacity: 0;
	transform: translateY(20px);
	transition: opacity 0.65s var(--g-ease-out), transform 0.65s var(--g-ease-out);
}

.guesto-section.is-visible {
	opacity: 1;
	transform: translateY(0);
}

.guesto-reveal {
	opacity: 0;
	transform: translateY(14px);
	transition:
		opacity 0.55s var(--g-ease-out),
		transform 0.55s var(--g-ease-out);
	transition-delay: var(--g-reveal-delay, 0s);
}

.guesto-reveal.is-visible {
	opacity: 1;
	transform: translateY(0);
}

@media (prefers-reduced-motion: reduce) {
	.guesto-animate-in,
	.guesto-section,
	.guesto-reveal {
		animation: none !important;
		opacity: 1 !important;
		transform: none !important;
		transition: none !important;
	}
}