@layer cm {
	.cm-bottom-fog {
		pointer-events: none;
		position: absolute;
		inset-inline: 0;
		bottom: 0;
		z-index: 5;
		height: 34%;
		overflow: hidden;
		opacity: .88;
	}

	@media (min-width: 768px) {
		.cm-bottom-fog {
			height: 30%;
		}
	}

	.cm-bottom-fog__back {
		pointer-events: none;
		position: absolute;
		bottom: 0;
		left: 0;
		height: 100%;
		width: 100%;
		overflow: hidden;
		opacity: .72;
	}

	.cm-fog__stream-1-float {
		animation: 5.5s ease-in-out infinite fog-float-vertical;
		display: flex;
		height: 100%;
		width: 200%;
	}

	.cm-fog__svg {
		height: 100%;
		width: 100%;
	}

	.cm-bottom-fog__mid {
		pointer-events: none;
		position: absolute;
		bottom: 0;
		left: 0;
		height: 85%;
		width: 100%;
		overflow: hidden;
		opacity: .58;
	}

	.cm-fog__stream-2 {
		animation: 17s linear infinite fog-stream-right;
		display: flex;
		height: 100%;
		width: 200%;
	}

	.cm-bottom-fog__front {
		pointer-events: none;
		position: absolute;
		bottom: 0;
		left: 0;
		height: 60%;
		width: 100%;
		overflow: hidden;
		opacity: .46;
	}

	.cm-fog__stream-3 {
		animation: 10s linear infinite fog-stream-left;
		display: flex;
		height: 100%;
		width: 200%;
	}

	.cm-fog-transition {
		pointer-events: none;
		position: absolute;
		inset: 0;
		z-index: 9999;
		overflow: hidden;
		-webkit-user-select: none;
		user-select: none;
	}

	.cm-fog-transition__wall {
		will-change: transform, opacity;
		animation: 1.65s cubic-bezier(.35,0,.25,1) forwards fog-rise-sweep,1.65s linear forwards fog-fade-tail;
		position: absolute;
		top: 0;
		left: 0;
		display: flex;
		height: 300vh;
		width: 100%;
		flex-direction: column;
	}

	.cm-fog-transition__top {
		position: relative;
		height: 40vh;
		width: 100%;
		overflow: hidden;
	}

	.cm-fog-transition__fill {
		position: absolute;
		inset: 0;
	}

	.cm-fog-transition__clouds {
		position: absolute;
		inset-inline: 0;
		bottom: 0;
		height: 92%;
	}

	.cm-fog-transition__body {
		position: relative;
		height: 160vh;
		width: 100%;
		overflow: hidden;
	}

	.cm-fog-transition__screen {
		position: absolute;
		inset: 0;
		opacity: .4;
		mix-blend-mode: screen;
	}

	.cm-fog__stream-1 {
		animation: 13s linear infinite fog-stream-left;
		display: flex;
		height: 100%;
		width: 200%;
	}

	.cm-fog-transition__multiply {
		position: absolute;
		inset: 0;
		opacity: .3;
		mix-blend-mode: multiply;
	}

	.cm-fog-transition__overlay {
		pointer-events: none;
		position: absolute;
		inset: 0;
	}

	.cm-fog-transition__tail {
		position: relative;
		height: 100vh;
		width: 100%;
	}

	.cm-fog-transition__tail-fog {
		position: absolute;
		inset-inline: 0;
		top: 0;
		height: 12rem;
		opacity: .35;
	}
}