.img-1 {
	opacity: 1;
}

.animation-wrapper {
	margin-top: var(--section-padding-block);
}

@media screen and (min-width: 1026px) {
	.animation-wrapper {
		display: flex;
		flex-direction: row-reverse;
		height: 300vh;
		position: relative;
		z-index: 99999999999;
	}

	.animation-wrapper > div {
		width: 50%;
		position: relative;
	}

	.animation-tab__inner {
		background: var(--primary-ultra-dark);
		height: 100vh;
		padding: 35px;
		padding-top: 50px;
		z-index: 999;
		display: flex;
		flex-direction: column;
	}

	.animation-tab__inner div.smart-spacing {
		margin-top: var(--space-xxl);
		max-width: 700px;
	}
	.animation-tab__inner h2 {
		max-width: 800px;
	}
	.animation-tab {
		position: absolute;
		height: 100vh;
		display: flex;
		flex-direction: column;
		top: 0;
		width: 100%;
	}

	.animation-tab-base {
		display: flex !important;
	}

	.animation-tab--1 {
		z-index: 10;
		top: 0;
	}

	.animation-tab--2,
	.animation-tab--3,
	.animation-tab--4 {
		top: 100%;
	}

	.animation-tab--2 {
		z-index: 30;
	}

	.animation-tab--3 {
		z-index: 40;
	}

	.animation-tab--4 {
		z-index: 50;
	}

	#animation-tabbed {
		position: sticky;
		left: 0;
		height: 100vh;
		top: 0;
	}
	#animation-tabbed-inner {
		height: 100vh;
	}

	.animation-trigger.animation-trigger {
		background: var(--primary-ultra-dark) !important;
	}

	.animation-img-section img {
		position: sticky;
		top: 0;
		right: 0;
		width: 100%;
		height: 100vh;
		object-fit: cover;
	}

	div.animation-trigger {
		height: 100vh;
		background: gold;
	}

	div.animation-trigger img {
		height: 100%;
		width: 100%;
		top: 0;
		position: absolute;
		right: 0;
	}

	#animation-tabbed {
		overflow: hidden;
	}
}

@media screen and (max-width: 1025px) {
	.animation-tab__inner img {
		display: block;
	}
	.animation-tab__inner h2 {
		margin-bottom: var(--space-l);
	}
	.animation-tab__inner > * {
		padding-left: var(--gutter);
		padding-right: var(--gutter);
	}
	.animation-tab__inner > div.animation-trigger {
		padding: 0;
		margin-top: 30px;
	}
	#animation-tabbed-inner {
		display: flex;
		flex-direction: column;
		gap: 60px;
		padding-top: 35px;
	}
}

@media screen and (min-width: 1630px) {
	.animation-tab__inner {
		padding-left: 70px;
	}
}
@media screen and (min-width: 1930px) {
	.animation-tab__inner {
		padding-left: 130px;
	}
}

@media screen and (min-width: 2230px) {
	.animation-tab__inner {
		padding-left: 230px;
	}
}

.animation-imgset {
	height: 100%;
	overflow: hidden;
}
.animation-imgset img {
	position: sticky;
	top: 0;
	height: 100vh;
	object-fit: cover;
	opacity: 1 !important;
	visibility: visible !important;
	display: block !important;
}
@media screen and (min-width: 1026px) {
	.t1 {
		position: absolute;
		top: 0%;
	}
	.t2 {
		position: absolute;
		top: 100vh;
	}
	.t3 {
		position: absolute;
		top: 200vh;
	}
	.t4 {
		position: absolute;
		top: 300vh;
	}
}
