body {
	font-feature-settings: 'liga' 1, 'calt' 1;
	background-color: #050314;
}
.glass {
	background: rgba(255, 255, 255, 0.06);
	border: 1px solid rgba(255, 255, 255, 0.08);
	backdrop-filter: blur(18px);
}
.grid-overlay::before {
	content: '';
	position: absolute;
	inset: 0;
	background-image: radial-gradient(
		circle at 1px 1px,
		rgba(255, 255, 255, 0.08) 1px,
		transparent 0
	);
	background-size: 20px 20px;
	opacity: 0.4;
	z-index: 0;
}

.back-to-top {
	box-shadow: 0 20px 35px -20px rgba(63, 93, 255, 0.65);
	animation: pulseGlow 3.6s ease-in-out infinite;
}

.back-to-top:hover {
	transform: translateY(-4px) scale(1.03);
}

.glow-card {
	position: relative;
	overflow: hidden;
}

.glow-card::before {
	content: '';
	position: absolute;
	inset: 1px;
	border-radius: inherit;
	border: 1px solid rgba(99, 102, 241, 0.2);
	opacity: 0;
	transition: opacity 0.3s ease;
}

.glow-card:hover::before {
	opacity: 1;
}

.cta-trigger {
	position: relative;
	overflow: hidden;
	transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.cta-trigger:hover {
	transform: translateY(-1px) scale(1.01);
}

.cta-trigger:active {
	transform: translateY(1px) scale(0.99);
}

.cta-trigger::after {
	content: '';
	position: absolute;
	inset: 0;
	background: radial-gradient(circle, rgba(255, 255, 255, 0.45) 0%, transparent 60%);
	transform: scale(0);
	opacity: 0;
	transition: transform 0.45s ease, opacity 0.45s ease;
}

.cta-trigger:active::after {
	opacity: 0.35;
	transform: scale(2.5);
}

.modal-panel {
	animation: modalIn 0.45s ease;
	box-shadow: 0 25px 90px -45px rgba(6, 182, 212, 0.35);
}

[data-animate] {
	opacity: 0;
	transform: translateY(32px) scale(0.98);
	transition:
		opacity 0.6s ease,
		transform 0.6s ease;
	transition-delay: var(--animate-delay, 0s);
}

[data-animate].animate-visible {
	opacity: 1;
	transform: translateY(0) scale(1);
}

.hero-gradient {
	position: absolute;
	inset: -200px;
	background: radial-gradient(circle at 30% 20%, rgba(79, 70, 229, 0.35), transparent 55%),
		radial-gradient(circle at 80% 0%, rgba(6, 182, 212, 0.25), transparent 45%),
		radial-gradient(circle at 10% 60%, rgba(14, 165, 233, 0.2), transparent 50%);
	filter: blur(80px);
	opacity: 0.55;
	animation: auroraShift 14s ease-in-out infinite alternate;
}

.section-divider {
	position: relative;
}

.section-divider::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 50%;
	width: 60%;
	height: 1px;
	background: linear-gradient(90deg, transparent, rgba(99, 102, 241, 0.3), transparent);
	transform: translateX(-50%);
}

.floating-orb {
	position: absolute;
	border-radius: 9999px;
	filter: blur(0);
	background: radial-gradient(circle, rgba(255, 255, 255, 0.45), transparent 60%);
	opacity: 0.35;
	animation: orbFloat 12s ease-in-out infinite;
	pointer-events: none;
}

.floating-orb--cyan {
	background: radial-gradient(circle, rgba(6, 182, 212, 0.5), transparent 65%);
}

.floating-orb--pink {
	background: radial-gradient(circle, rgba(236, 72, 153, 0.4), transparent 65%);
}

[data-tilt] {
	transition: transform 0.6s ease, box-shadow 0.6s ease;
	transform-style: preserve-3d;
}

[data-tilt].is-tilting {
	box-shadow: 0 35px 80px -60px rgba(15, 118, 230, 0.6);
}

.surface-noise {
	position: relative;
}

.surface-noise::after {
	content: '';
	position: absolute;
	inset: 0;
	background-image: url('data:image/svg+xml,%3Csvg width=\"160\" height=\"160\" viewBox=\"0 0 160 160\" xmlns=\"http://www.w3.org/2000/svg\"%3E%3Cg fill=\"none\" fill-opacity=\"0.08\"%3E%3Cpath d=\"M0 0h1v1H0z\" fill=\"%23fff\"/%3E%3C/g%3E%3C/svg%3E');
	opacity: 0.25;
	mix-blend-mode: soft-light;
	pointer-events: none;
}

@keyframes modalIn {
	0% {
		opacity: 0;
		transform: translateY(30px) scale(0.96);
	}
	100% {
		opacity: 1;
		transform: translateY(0) scale(1);
	}
}

@keyframes pulseGlow {
	0% {
		box-shadow: 0 20px 35px -20px rgba(63, 93, 255, 0.6),
			0 0 0 0 rgba(99, 102, 241, 0.35);
	}
	50% {
		box-shadow: 0 24px 40px -20px rgba(63, 93, 255, 0.75),
			0 0 35px 5px rgba(79, 70, 229, 0.35);
	}
	100% {
		box-shadow: 0 20px 35px -20px rgba(63, 93, 255, 0.6),
			0 0 0 0 rgba(99, 102, 241, 0.35);
	}
}

@keyframes auroraShift {
	0% {
		transform: translate3d(0, 0, 0) scale(1);
		filter: blur(70px);
	}
	50% {
		transform: translate3d(0, -30px, 0) scale(1.05);
		filter: blur(90px);
	}
	100% {
		transform: translate3d(40px, 10px, 0) scale(0.98);
		filter: blur(85px);
	}
}

@keyframes orbFloat {
	0% {
		transform: translateY(0) scale(1);
		opacity: 0.45;
	}
	50% {
		transform: translateY(-25px) scale(1.05);
		opacity: 0.7;
	}
	100% {
		transform: translateY(0) scale(1);
		opacity: 0.4;
	}
}
