/* Animated CSS gradient background - replaces Spline WebGL viewers site-wide */
.bi-animated-bg {
	position: fixed;
	inset: 0;
	z-index: -1;
	pointer-events: none;
	background:
		radial-gradient(ellipse at 20% 50%, rgba(30, 10, 80, 0.9) 0%, transparent 60%),
		radial-gradient(ellipse at 80% 15%, rgba(6, 30, 80, 0.85) 0%, transparent 55%),
		radial-gradient(ellipse at 55% 90%, rgba(10, 5, 40, 0.7) 0%, transparent 50%),
		linear-gradient(145deg, #050816 0%, #070c1e 40%, #050816 100%);
	background-size: 200% 200%;
	animation: bi-bg-shift 18s ease-in-out infinite alternate;
}

@keyframes bi-bg-shift {
	0%   { background-position: 0% 50%; }
	50%  { background-position: 60% 30%; }
	100% { background-position: 100% 60%; }
}

/* Floating orb overlays - purple top-left, cyan bottom-right */
.bi-animated-bg::before,
.bi-animated-bg::after {
	content: '';
	position: absolute;
	border-radius: 50%;
	filter: blur(90px);
	opacity: 0.22;
	animation: bi-orb-float 22s ease-in-out infinite alternate;
}

.bi-animated-bg::before {
	width: 580px;
	height: 580px;
	top: -8%;
	left: -8%;
	background: radial-gradient(circle, #7c3aed 0%, transparent 70%);
	animation-duration: 22s;
}

.bi-animated-bg::after {
	width: 460px;
	height: 460px;
	bottom: -8%;
	right: -5%;
	background: radial-gradient(circle, #0891b2 0%, transparent 70%);
	animation-duration: 28s;
	animation-direction: alternate-reverse;
}

@keyframes bi-orb-float {
	0%   { transform: translate(0, 0) scale(1); }
	50%  { transform: translate(40px, 35px) scale(1.12); }
	100% { transform: translate(-25px, 65px) scale(0.94); }
}

/* Prevent white flash - match homepage. Keep body opaque so
   .bi-animated-bg (z-index: -1) paints above the page color, not behind the browser canvas. */
html, body {
	background: #050816 !important;
	--bs-body-bg: #050816;
}