/* Background Floating Math Symbols */
.math-bg {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	pointer-events: none;
	z-index: 0;
	overflow: hidden;
}

.math-symbol {
	position: absolute;
	color: rgba(23, 59, 112, 0.15);
	font-weight: 800;
	user-select: none;
	animation: float 14s infinite ease-in-out;
}

.s1 {
	top: 8%;
	left: 6%;
	font-size: clamp(2rem, 6vh, 5rem);
	animation-duration: 12s;
}

.s2 {
	top: 20%;
	right: 8%;
	font-size: clamp(2.5rem, 7vh, 6rem);
	animation-duration: 16s;
	animation-delay: -2s;
}

.s3 {
	top: 65%;
	left: 8%;
	font-size: clamp(2rem, 5.5vh, 4.5rem);
	animation-duration: 14s;
	animation-delay: -5s;
}

.s4 {
	top: 72%;
	right: 6%;
	font-size: clamp(2.2rem, 6.5vh, 5.5rem);
	animation-duration: 18s;
	animation-delay: -3s;
}

.s5 {
	top: 42%;
	left: 3%;
	font-size: clamp(1.8rem, 5vh, 4rem);
	animation-duration: 11s;
	animation-delay: -1s;
}

.s6 {
	top: 12%;
	left: 82%;
	font-size: clamp(2rem, 5.5vh, 4.5rem);
	animation-duration: 15s;
	animation-delay: -4s;
}

.s7 {
	top: 85%;
	left: 45%;
	font-size: clamp(2.2rem, 6vh, 5rem);
	animation-duration: 13s;
	animation-delay: -6s;
}

.s8 {
	top: 38%;
	right: 20%;
	font-size: clamp(1.6rem, 4.5vh, 3.5rem);
	animation-duration: 17s;
	animation-delay: -7s;
}

.s9 {
	top: 4%;
	left: 48%;
	font-size: clamp(1.8rem, 5vh, 4rem);
	animation-duration: 10s;
	animation-delay: -2s;
}

.s10 {
	top: 52%;
	right: 4%;
	font-size: clamp(2.2rem, 6vh, 5rem);
	animation-duration: 19s;
	animation-delay: -8s;
}

@keyframes float {

	0%,
	100% {
		transform: translateY(0) rotate(0deg);
	}

	50% {
		transform: translateY(-20px) rotate(10deg);
	}
}