.anim-container {
	background-color: #0c3346;
	color: #f2f7f7;
	font-family: 'Satoshi';
	position: relative;
	display: grid;
	place-items: center;
	width: 100%;
	min-height: calc(var(--scf, 1) * 1075px);
	overflow: hidden;
}
.anim-container a {
	color: #fff;
	text-decoration: none;
}
.anim-container .bg-img {
	position: absolute;
	max-width: 100%;
	opacity: 0.2;
}
.anim-container img {
	max-width: none;
}
.anim-container .logo-wrapper {
	position: absolute;
	display: grid;
	place-content: center;
	place-items: center;
	scale: var(--scf);
}
.anim-container .logo-wrapper:hover .logo-glare {
	animation-play-state: paused;
}
@keyframes rotateGlare1 {
	0% {
		rotate: -45deg;
	}
	100% {
		rotate: 315deg;
	}
}
@keyframes rotateGlare2 {
	0% {
		rotate: 120deg;
	}
	100% {
		rotate: 480deg;
	}
}
@keyframes circleOuterRing {
	0% {
		scale: 1;
	}
	100% {
		scale: 1.15;
	}
}
.anim-container .center-circle {
	position: absolute;
}
.anim-container .center-ring-inner {
	opacity: 0.25;
	position: absolute;
	animation: circleOuterRing 6s 2s alternate infinite ease-in-out;
}
.anim-container .center-ring-outer {
	opacity: 0.25;
	position: absolute;
	animation: circleOuterRing 6s alternate infinite ease-in-out;
}
.anim-container .logo-glare {
	width: 298px;
	height: 298px;
	position: absolute;
	animation: 14s rotateGlare1 ease-in-out infinite;
}
.anim-container .logo-glare.opt2 {
	animation: 14s rotateGlare2 ease-in-out infinite;
}
.anim-container .logo {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}
.anim-container .earth {
	--r: 350px;
	--deg: 0deg;
	position: absolute;
	width: 135px;
	height: 137px;
	display: grid;
	place-content: center;
	place-items: center;
	transform: translate(
		calc(cos(var(--deg)) * var(--r)),
		calc(sin(var(--deg)) * var(--r))
	);
	transition: all 300ms linear;
	scale: var(--scf);
}
.anim-container .earth .inner-earth {
	position: relative;
	width: 135px;
	height: 137px;
	display: grid;
	place-content: center;
	place-items: center;
	gap: 8px;
	font-weight: 900;
	font-size: 18px;
	line-height: 1.1;
	z-index: 0;
	transition: all 300ms ease-out;
}
.anim-container .earth .inner-img {
	position: absolute;
	z-index: -1;
	width: 135px;
	height: 137px;
	transition: all 300ms ease-out;
}
.anim-container .earth .text {
	text-align: center;
	text-transform: uppercase;
}
.anim-container .earth.earth-1 .inner-earth {
	background-image: url('./assets/earth1.svg');
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
}
.anim-container .earth.earth-2 .inner-earth {
	background-image: url('./assets/earth2.svg');
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
}
.anim-container .earth.earth-3 .inner-earth {
	background-image: url('./assets/earth3.svg');
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
}
.anim-container .earth.earth-4 .inner-earth {
	background-image: url('./assets/earth4.svg');
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
}
.anim-container .earth.earth-5 .inner-earth {
	background-image: url('./assets/earth5.svg');
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
}
.anim-container .earth.earth-6 .inner-earth {
	background-image: url('./assets/earth6.svg');
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
}
.anim-container .earth.pos-1 {
	--deg: 10deg;
	--r: 330px;
}
.anim-container .earth.pos-1 .inner-earth {
	font-size: 18px;
}
.anim-container .earth.pos-1 .embedded-text {
	--deg: 0deg;
	--r: 160px;
	font-size: 24px;
}
.anim-container .earth.pos-1 .connector {
	--deg: 190deg;
	--r: 120px;
	width: 150px;
	height: 60px;
}
.anim-container .earth.pos-1 .particle-container {
	--deg: 190deg;
	--r: 120px;
	--rot: 10deg;
}
.anim-container .earth.pos-1 .particle-container .particle-path {
	--w: 100px;
}
.anim-container .earth.pos-1:hover,
.anim-container .earth.pos-1.hover {
	--r: calc(330px + 20px);
}
.anim-container .earth.pos-1:hover .inner-earth,
.anim-container .earth.pos-1.hover .inner-earth {
	scale: 1.25;
	filter: brightness(1.1);
}
.anim-container .earth.pos-1:hover .inner-img,
.anim-container .earth.pos-1.hover .inner-img {
	filter: brightness(1.5);
}
.anim-container .earth.pos-1:hover .inner-text,
.anim-container .earth.pos-1.hover .inner-text {
	transition: all 300ms ease-out;
	opacity: 1;
	transform: translate(0, 0);
}
.anim-container .earth.pos-1:hover .bottom-line,
.anim-container .earth.pos-1.hover .bottom-line {
	transition: all 300ms ease-out;
	transform: scaleX(1);
}
.anim-container .earth.pos-1:hover .connector,
.anim-container .earth.pos-1.hover .connector {
	opacity: 1;
	scale: 1.1;
}
.anim-container .earth.pos-2 {
	--deg: 48deg;
	--r: 310px;
}
.anim-container .earth.pos-2 .inner-earth {
	font-size: 18px;
}
.anim-container .earth.pos-2 .embedded-text {
	--deg: 0deg;
	--r: 160px;
	font-size: 24px;
}
.anim-container .earth.pos-2 .connector {
	--deg: 228deg;
	--r: 120px;
	width: 80px;
	height: 64px;
}
.anim-container .earth.pos-2 .particle-container {
	--deg: 225deg;
	--r: 120px;
	--rot: 48deg;
}
.anim-container .earth.pos-2 .particle-container .particle-path {
	--w: 100px;
}
.anim-container .earth.pos-2:hover,
.anim-container .earth.pos-2.hover {
	--r: calc(310px + 20px);
}
.anim-container .earth.pos-2:hover .inner-earth,
.anim-container .earth.pos-2.hover .inner-earth {
	scale: 1.25;
	filter: brightness(1.1);
}
.anim-container .earth.pos-2:hover .inner-img,
.anim-container .earth.pos-2.hover .inner-img {
	filter: brightness(1.5);
}
.anim-container .earth.pos-2:hover .inner-text,
.anim-container .earth.pos-2.hover .inner-text {
	transition: all 300ms ease-out;
	opacity: 1;
	transform: translate(0, 0);
}
.anim-container .earth.pos-2:hover .bottom-line,
.anim-container .earth.pos-2.hover .bottom-line {
	transition: all 300ms ease-out;
	transform: scaleX(1);
}
.anim-container .earth.pos-2:hover .connector,
.anim-container .earth.pos-2.hover .connector {
	opacity: 1;
	scale: 1.1;
}
.anim-container .earth.pos-3 {
	--deg: 90deg;
	--r: 300px;
}
.anim-container .earth.pos-3 .inner-earth {
	font-size: 16px;
}
.anim-container .earth.pos-3 .embedded-text {
	--deg: 90deg;
	--r: 130px;
	font-size: 20px;
}
.anim-container .earth.pos-3 .connector {
	--deg: 270deg;
	--r: 120px;
	width: 19px;
	height: 69px;
}
.anim-container .earth.pos-3 .particle-container {
	--deg: 270deg;
	--r: 115px;
	--rot: 90deg;
}
.anim-container .earth.pos-3 .particle-container .particle-path {
	--w: 95px;
}
.anim-container .earth.pos-3:hover,
.anim-container .earth.pos-3.hover {
	--r: calc(300px + 20px);
}
.anim-container .earth.pos-3:hover .inner-earth,
.anim-container .earth.pos-3.hover .inner-earth {
	scale: 1.25;
	filter: brightness(1.1);
}
.anim-container .earth.pos-3:hover .inner-img,
.anim-container .earth.pos-3.hover .inner-img {
	filter: brightness(1.5);
}
.anim-container .earth.pos-3:hover .inner-text,
.anim-container .earth.pos-3.hover .inner-text {
	transition: all 300ms ease-out;
	opacity: 1;
	transform: translate(0, 0);
}
.anim-container .earth.pos-3:hover .bottom-line,
.anim-container .earth.pos-3.hover .bottom-line {
	transition: all 300ms ease-out;
	transform: scaleX(1);
}
.anim-container .earth.pos-3:hover .connector,
.anim-container .earth.pos-3.hover .connector {
	opacity: 1;
	scale: 1.1;
}
.anim-container .earth.pos-4 {
	--deg: 132deg;
	--r: 310px;
}
.anim-container .earth.pos-4 .inner-earth {
	font-size: 18px;
}
.anim-container .earth.pos-4 .embedded-text {
	--deg: 180deg;
	--r: 160px;
	font-size: 20px;
}
.anim-container .earth.pos-4 .connector {
	--deg: 312deg;
	--r: 120px;
	width: 98px;
	height: 84px;
}
.anim-container .earth.pos-4 .particle-container {
	--deg: -40deg;
	--r: 120px;
	--rot: 132deg;
}
.anim-container .earth.pos-4 .particle-container .particle-path {
	--w: 100px;
}
.anim-container .earth.pos-4:hover,
.anim-container .earth.pos-4.hover {
	--r: calc(310px + 20px);
}
.anim-container .earth.pos-4:hover .inner-earth,
.anim-container .earth.pos-4.hover .inner-earth {
	scale: 1.25;
	filter: brightness(1.1);
}
.anim-container .earth.pos-4:hover .inner-img,
.anim-container .earth.pos-4.hover .inner-img {
	filter: brightness(1.5);
}
.anim-container .earth.pos-4:hover .inner-text,
.anim-container .earth.pos-4.hover .inner-text {
	transition: all 300ms ease-out;
	opacity: 1;
	transform: translate(0, 0);
}
.anim-container .earth.pos-4:hover .bottom-line,
.anim-container .earth.pos-4.hover .bottom-line {
	transition: all 300ms ease-out;
	transform: scaleX(1);
}
.anim-container .earth.pos-4:hover .connector,
.anim-container .earth.pos-4.hover .connector {
	opacity: 1;
	scale: 1.1;
}
.anim-container .earth.pos-5 {
	--deg: 170deg;
	--r: 330px;
}
.anim-container .earth.pos-5 .inner-earth {
	font-size: 18px;
}
.anim-container .earth.pos-5 .embedded-text {
	--deg: 180deg;
	--r: 160px;
	font-size: 24px;
}
.anim-container .earth.pos-5 .connector {
	--deg: 350deg;
	--r: 120px;
	width: 115px;
	height: 45px;
}
.anim-container .earth.pos-5 .particle-container {
	--deg: -10deg;
	--r: 120px;
	--rot: 170deg;
}
.anim-container .earth.pos-5 .particle-container .particle-path {
	--w: 120px;
}
.anim-container .earth.pos-5:hover,
.anim-container .earth.pos-5.hover {
	--r: calc(330px + 20px);
}
.anim-container .earth.pos-5:hover .inner-earth,
.anim-container .earth.pos-5.hover .inner-earth {
	scale: 1.25;
	filter: brightness(1.1);
}
.anim-container .earth.pos-5:hover .inner-img,
.anim-container .earth.pos-5.hover .inner-img {
	filter: brightness(1.5);
}
.anim-container .earth.pos-5:hover .inner-text,
.anim-container .earth.pos-5.hover .inner-text {
	transition: all 300ms ease-out;
	opacity: 1;
	transform: translate(0, 0);
}
.anim-container .earth.pos-5:hover .bottom-line,
.anim-container .earth.pos-5.hover .bottom-line {
	transition: all 300ms ease-out;
	transform: scaleX(1);
}
.anim-container .earth.pos-5:hover .connector,
.anim-container .earth.pos-5.hover .connector {
	opacity: 1;
	scale: 1.1;
}
.anim-container .earth.pos-6 {
	--deg: 205deg;
	--r: 330px;
}
.anim-container .earth.pos-6 .inner-earth {
	font-size: 16px;
}
.anim-container .earth.pos-6 .embedded-text {
	--deg: 180deg;
	--r: 160px;
	font-size: 24px;
}
.anim-container .earth.pos-6 .connector {
	--deg: 385deg;
	--r: 120px;
	width: 90px;
	height: 85px;
}
.anim-container .earth.pos-6 .particle-container {
	--deg: 25deg;
	--r: 120px;
	--rot: 205deg;
}
.anim-container .earth.pos-6 .particle-container .particle-path {
	--w: 120px;
}
.anim-container .earth.pos-6:hover,
.anim-container .earth.pos-6.hover {
	--r: calc(330px + 20px);
}
.anim-container .earth.pos-6:hover .inner-earth,
.anim-container .earth.pos-6.hover .inner-earth {
	scale: 1.25;
	filter: brightness(1.1);
}
.anim-container .earth.pos-6:hover .inner-img,
.anim-container .earth.pos-6.hover .inner-img {
	filter: brightness(1.5);
}
.anim-container .earth.pos-6:hover .inner-text,
.anim-container .earth.pos-6.hover .inner-text {
	transition: all 300ms ease-out;
	opacity: 1;
	transform: translate(0, 0);
}
.anim-container .earth.pos-6:hover .bottom-line,
.anim-container .earth.pos-6.hover .bottom-line {
	transition: all 300ms ease-out;
	transform: scaleX(1);
}
.anim-container .earth.pos-6:hover .connector,
.anim-container .earth.pos-6.hover .connector {
	opacity: 1;
	scale: 1.1;
}
.anim-container .earth.pos-7 {
	--deg: 235deg;
	--r: 330px;
}
.anim-container .earth.pos-7 .inner-earth {
	font-size: 16px;
}
.anim-container .earth.pos-7 .embedded-text {
	--deg: 205deg;
	--r: 170px;
	font-size: 24px;
}
.anim-container .earth.pos-7 .connector {
	--deg: 415deg;
	--r: 120px;
	width: 80px;
	height: 107px;
}
.anim-container .earth.pos-7 .particle-container {
	--deg: 50deg;
	--r: 125px;
	--rot: 235deg;
}
.anim-container .earth.pos-7 .particle-container .particle-path {
	--w: 110px;
}
.anim-container .earth.pos-7:hover,
.anim-container .earth.pos-7.hover {
	--r: calc(330px + 20px);
}
.anim-container .earth.pos-7:hover .inner-earth,
.anim-container .earth.pos-7.hover .inner-earth {
	scale: 1.25;
	filter: brightness(1.1);
}
.anim-container .earth.pos-7:hover .inner-img,
.anim-container .earth.pos-7.hover .inner-img {
	filter: brightness(1.5);
}
.anim-container .earth.pos-7:hover .inner-text,
.anim-container .earth.pos-7.hover .inner-text {
	transition: all 300ms ease-out;
	opacity: 1;
	transform: translate(0, 0);
}
.anim-container .earth.pos-7:hover .bottom-line,
.anim-container .earth.pos-7.hover .bottom-line {
	transition: all 300ms ease-out;
	transform: scaleX(1);
}
.anim-container .earth.pos-7:hover .connector,
.anim-container .earth.pos-7.hover .connector {
	opacity: 1;
	scale: 1.1;
}
.anim-container .earth.pos-8 {
	--deg: 270deg;
	--r: 330px;
}
.anim-container .earth.pos-8 .inner-earth {
	font-size: 18px;
}
.anim-container .earth.pos-8 .embedded-text {
	--deg: 270deg;
	--r: 130px;
	font-size: 24px;
}
.anim-container .earth.pos-8 .connector {
	--deg: 450deg;
	--r: 120px;
	width: 54px;
	height: 106px;
}
.anim-container .earth.pos-8 .particle-container {
	--deg: 90deg;
	--r: 115px;
	--rot: 270deg;
}
.anim-container .earth.pos-8 .particle-container .particle-path {
	--w: 110px;
}
.anim-container .earth.pos-8:hover,
.anim-container .earth.pos-8.hover {
	--r: calc(330px + 20px);
}
.anim-container .earth.pos-8:hover .inner-earth,
.anim-container .earth.pos-8.hover .inner-earth {
	scale: 1.25;
	filter: brightness(1.1);
}
.anim-container .earth.pos-8:hover .inner-img,
.anim-container .earth.pos-8.hover .inner-img {
	filter: brightness(1.5);
}
.anim-container .earth.pos-8:hover .inner-text,
.anim-container .earth.pos-8.hover .inner-text {
	transition: all 300ms ease-out;
	opacity: 1;
	transform: translate(0, 0);
}
.anim-container .earth.pos-8:hover .bottom-line,
.anim-container .earth.pos-8.hover .bottom-line {
	transition: all 300ms ease-out;
	transform: scaleX(1);
}
.anim-container .earth.pos-8:hover .connector,
.anim-container .earth.pos-8.hover .connector {
	opacity: 1;
	scale: 1.1;
}
.anim-container .earth.pos-9 {
	--deg: 305deg;
	--r: 330px;
}
.anim-container .earth.pos-9 .inner-earth {
	font-size: 18px;
}
.anim-container .earth.pos-9 .embedded-text {
	--deg: 330deg;
	--r: 170px;
	font-size: 24px;
}
.anim-container .earth.pos-9 .connector {
	--deg: 485deg;
	--r: 120px;
	width: 80px;
	height: 110px;
}
.anim-container .earth.pos-9 .particle-container {
	--deg: 122deg;
	--r: 125px;
	--rot: 305deg;
}
.anim-container .earth.pos-9 .particle-container .particle-path {
	--w: 120px;
}
.anim-container .earth.pos-9:hover,
.anim-container .earth.pos-9.hover {
	--r: calc(330px + 20px);
}
.anim-container .earth.pos-9:hover .inner-earth,
.anim-container .earth.pos-9.hover .inner-earth {
	scale: 1.25;
	filter: brightness(1.1);
}
.anim-container .earth.pos-9:hover .inner-img,
.anim-container .earth.pos-9.hover .inner-img {
	filter: brightness(1.5);
}
.anim-container .earth.pos-9:hover .inner-text,
.anim-container .earth.pos-9.hover .inner-text {
	transition: all 300ms ease-out;
	opacity: 1;
	transform: translate(0, 0);
}
.anim-container .earth.pos-9:hover .bottom-line,
.anim-container .earth.pos-9.hover .bottom-line {
	transition: all 300ms ease-out;
	transform: scaleX(1);
}
.anim-container .earth.pos-9:hover .connector,
.anim-container .earth.pos-9.hover .connector {
	opacity: 1;
	scale: 1.1;
}
.anim-container .earth.pos-10 {
	--deg: 337deg;
	--r: 330px;
}
.anim-container .earth.pos-10 .inner-earth {
	font-size: 18px;
}
.anim-container .earth.pos-10 .embedded-text {
	--deg: 0deg;
	--r: 160px;
	font-size: 24px;
}
.anim-container .earth.pos-10 .connector {
	--deg: 517deg;
	--r: 120px;
	width: 74px;
	height: 52px;
}
.anim-container .earth.pos-10 .particle-container {
	--deg: 155deg;
	--r: 120px;
	--rot: 337deg;
}
.anim-container .earth.pos-10 .particle-container .particle-path {
	--w: 100px;
}
.anim-container .earth.pos-10:hover,
.anim-container .earth.pos-10.hover {
	--r: calc(330px + 20px);
}
.anim-container .earth.pos-10:hover .inner-earth,
.anim-container .earth.pos-10.hover .inner-earth {
	scale: 1.25;
	filter: brightness(1.1);
}
.anim-container .earth.pos-10:hover .inner-img,
.anim-container .earth.pos-10.hover .inner-img {
	filter: brightness(1.5);
}
.anim-container .earth.pos-10:hover .inner-text,
.anim-container .earth.pos-10.hover .inner-text {
	transition: all 300ms ease-out;
	opacity: 1;
	transform: translate(0, 0);
}
.anim-container .earth.pos-10:hover .bottom-line,
.anim-container .earth.pos-10.hover .bottom-line {
	transition: all 300ms ease-out;
	transform: scaleX(1);
}
.anim-container .earth.pos-10:hover .connector,
.anim-container .earth.pos-10.hover .connector {
	opacity: 1;
	scale: 1.1;
}
.anim-container:has(.earth:is(:hover, .hover)) .earth:not(:is(:hover, .hover)) {
	opacity: 0.7;
	transition: all 200ms linear;
}
.anim-container:has(.earth:is(:hover, .hover))
	.earth:not(:is(:hover, .hover))
	.inner-earth {
	scale: 0.95;
}
.anim-container .embedded-text {
	--r: 150px;
	--deg: 0deg;
	position: absolute;
	font-weight: normal;
	font-size: 24px;
	max-width: 240px;
	width: 100%;
	line-break: auto;
	text-align: center;
	pointer-events: none;
	transform: translate(
		calc(cos(var(--deg)) * var(--r)),
		calc(sin(var(--deg)) * var(--r))
	);
}
.anim-container .embedded-text .inner-text {
	display: block;
	position: relative;
	opacity: 0;
	transform: translate(0, 12px);
	width: 100%;
	transition: all 150ms ease-in;
}
.anim-container .embedded-text .bottom-line {
	content: '';
	position: absolute;
	left: 0%;
	top: 100%;
	width: 100%;
	height: 2px;
	background-color: #21edf7;
	transform-origin: left center;
	transform: scaleX(0);
	transition: all 150ms ease-in;
}
.anim-container .connector {
	--r: 60px;
	--deg: 0deg;
	opacity: 0.6;
	position: absolute;
	z-index: -5;
	transition: all 300ms linear;
	transform: translate(
		calc(cos(var(--deg)) * var(--r)),
		calc(sin(var(--deg)) * var(--r))
	);
}
.anim-container .connector img {
	max-width: 100%;
	max-height: 100%;
}
.anim-container .particle-container {
	--r: 130px;
	--deg: 180deg;
	--rot: 0deg;
	display: flex;
	position: absolute;
	z-index: -1;
	transform: translate(
			calc(cos(var(--deg)) * var(--r)),
			calc(sin(var(--deg)) * var(--r))
		)
		rotate(var(--rot));
}
.anim-container .particle-container .particle-path {
	--w: 140px;
	width: var(--w);
}
@keyframes particleAnim {
	100% {
		transform: translateX(calc(var(--w) - var(--p-size) / 2));
	}
}
.anim-container .particle-container .particle {
	--p-size: 6px;
	--p-opacity: 1;
	--p-delay: 0ms;
	--p-speed: 4s;
	background-color: #1cbbb3;
	border-radius: 9999px;
	height: var(--p-size);
	width: var(--p-size);
	opacity: var(--p-opacity);
	animation: 4s particleAnim alternate infinite;
	animation-delay: var(--p-delay);
	animation-timing-function: ease-in;
	animation-duration: var(--p-speed, 4s);
}