@keyframes introLogo{
	0%{ opacity: 1; }
	100%{ opacity: 0; }
}

@keyframes introMask{
	100%{
		mask-size: 400vw;
		-webkit-mask-size: 400vw;
	}
}

@keyframes textClip{
	0%{ transform: translateY(100%); clip-path: polygon(0 0, 100% 0, 100% 0, 0 0); -webkit-clip-path: polygon(0 0, 100% 0, 100% 0, 0 0); }
	100%{ transform: translateY(0); clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); }
}

@keyframes letterSpacing{
	0%{ letter-spacing: var(--before); }
	100%{ letter-spacing: var(--after); }
}

@keyframes visual3D{
	0%{ transform: translateY(-30%) rotateX(-5deg); opacity: 0; }
	100%{ transform: translateY(-50%) rotateX(0); opacity: 1; }
}

@keyframes visualText{
	0%{ letter-spacing: var(--before); }
	100%{ letter-spacing: var(--after); }
}

@keyframes counter{
	0%{ top: var(--lineHeight); transform: translateY(-100%); }
	100%{ top: 0; transform: translateY(0); }
}

@keyframes dotRotate{
	0%{ transform: rotate(var(--start)); }
	100%{ transform: rotate(calc(360deg + var(--start))); }
}