.page {
	.solutions-top {
		min-height: 600px;
		height: calc(100vh - 90px);
		display: flex;
		align-items: center;

		position: relative;
		overflow: hidden;
		z-index: 0;
		background: linear-gradient(to bottom, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 100%);

		&::before {
			content: '';
			position: absolute;

			inset: -50px 0;
			background-image: url('../../images/man-works-computer.webp');
			background-size: 100%;
			background-position: center;
			background-repeat: no-repeat;
			z-index: 0;
			will-change: transform;
			transform: translateY(var(--parallax-offset, 0));

			@media (max-width: 768px) {
				background-size: cover;
				background-position: center bottom;
			}
		}

		.is-layout-constrained {
			height: 60vh;
			@media (max-width: 768px) {
				height: 74vh;
			}
		}

		h2 {
			font-size: var(--font-title-md);
			font-weight: bold;
		}
		h2 strong,
		h2 b {
			color: var(--smx-color-white);
			font-weight: bold;
			position: relative;
			z-index: 1;

			text-shadow:
				0 0 20px rgba(255, 0, 176, 0.4),
				0 0 40px rgba(140, 177, 255, 0.6),
				0 0 80px rgba(255, 255, 255, 0.4);
		}

		h3 {
			font-size: var(--font-subtitle);
			margin-top: var(--space-sm);
			font-weight: normal;
			@media (max-width: 768px) {
				margin-bottom: var(--space-sm);
			}
		}

		p {
			max-width: 960px;
			margin: 0 auto;
			font-size: var(--font-text);
			color: var(--smx-color-background-light);
		}
	}

	.solutions-enterprise {
		background: linear-gradient(
			0deg,
			var(--smx-color-background-light) 0%,
			rgb(var(--smx-color-primary-tint-rgb), 0.3) 100%
		);
		padding: var(--space-xl) 0;

		min-height: 400px;
		position: relative;
		overflow: hidden;
		@media (max-width: 768px) {
			padding-bottom: calc(var(--space-xxl) * 6.8);
		}

		&::before {
			content: '';
			position: absolute;

			inset: -50px 0;
			background-image: url('../../images/people-laptop-boss.webp');
			background-size: 64%;
			background-position: right bottom;
			background-repeat: no-repeat;
			z-index: 0;
			will-change: transform;
			transform: translateY(var(--parallax-offset, 0));
			mix-blend-mode: darken;

			@media (min-width: 1281px) {
				background-size: 760px;
			}
			@media (max-width: 768px) {
				background-size: 100%;
			}
		}

		h2 {
			font-size: var(--font-title-sm);
			line-height: 1.2;
			margin-top: var(--space-sm);
		}

		.container-top {
			display: grid;
			grid-template-columns: 1fr 1fr;

			@media (max-width: 768px) {
				grid-template-columns: 1fr;
			}

			h4 {
				margin-top: var(--space-sm);
				font-size: var(--font-size-base);
				font-weight: 400;
				margin-bottom: var(--space-lg);
			}

			h3 {
				font-size: var(--font-size-base);
				line-height: 1.2;
			}

			p {
				font-size: var(--font-text);
			}
		}

		.is-layout-flex {
			@media (max-width: 768px) {
				display: grid;
				gap: var(--space-sm);
				grid-template-columns: 1fr;
			}
		}

		.platform {
			@media (max-width: 768px) {
				.row-linear {
					grid-template-columns: 1fr;
				}
			}
		}

		.card {
			background: rgba(var(--smx-color-white-rgb), 0.76);
			backdrop-filter: blur(1.2rem);
			padding: var(--space-lg);
			padding-right: var(--space-lg);
			border-radius: var(--border-radius-lg);
			grid-template-columns: auto 1fr;
			gap: var(--space-md);

			img {
				max-width: 8rem;
				height: auto;
				margin: 0 auto;
			}

			h4 {
				margin: 0;
				font-size: var(--font-size-base);
				font-weight: normal;
			}

			h3 {
				font-size: var(--font-size-lg);
				margin: 0;
			}

			p {
				font-size: var(--font-text);
				margin-top: 0;
			}

			&.card-1 {
				grid-column: 3;
				grid-row: 1;
			}

			&.card-2 {
				grid-column: 1;
				grid-row: 1;
			}

			&.card-3 {
				grid-column: 2;
				grid-row: 1;
			}

			.partners-list {
				margin: 0 auto;
				display: flex;
				flex-wrap: wrap;
				gap: var(--space-md);

				justify-content: center;
				text-align: center;

				.partner {
					background: transparent;
					border-radius: var(--border-radius-lg);
					padding: var(--space-sm);
					width: calc(100% / 6.86);

					@media (max-width: 768px) {
						width: calc(100% / 3.86);
					}

					img {
						max-height: 36px;
						max-width: 100%;
						height: auto;
						width: auto;
						display: block;
						margin: 0 auto;
					}

					display: flex;
					flex-direction: column;
					justify-content: center;
				}
			}
		}

		.container-intelligent {
			.row-linear {
				grid-template-columns: repeat(3, 1fr);
				gap: var(--space-md);

				@media (max-width: 768px) {
					grid-template-columns: 1fr;

					.card {
						grid-column: 1 !important;
						grid-row: auto !important;
					}
				}

				h3 {
					color: var(--smx-color-primary);
				}
			}
		}

		.container-enterprise {
			min-height: 400px;
			.container-top {
				margin-top: var(--space-xxl);
				padding-top: var(--space-xl);
				position: relative;

				&:before {
					content: '';
					position: absolute;
					top: 0;
					height: 2px;
					border-radius: var(--border-radius-full);
					width: 100%;
					max-width: 600px;
					background: var(--smx-color-primary-contrast);
					background: linear-gradient(
						90deg,
						rgba(var(--smx-color-primary-contrast-rgb), 1) 0%,
						rgba(var(--smx-color-primary-contrast-rgb), 0) 100%
					);
				}

				p {
					font-size: var(--font-size-base);
					font-weight: 400;
					color: var(--smx-color-text-bold);
					margin-bottom: var(--space-lg);
				}

				.card p {
					padding: var(--space-md);
				}
			}

			.card {
				padding: var(--space-sm) 0;
				max-width: 100%;
				aside {
					margin: 0;
					display: flex;
					flex-direction: column;
					height: 100%;

					header,
					footer,
					p {
						padding: var(--space-sm) 0;
						width: 100%;
					}

					header {
						display: flex;
						justify-content: center;
						gap: var(--space-sm);
						border-bottom: 1px solid var(--smx-color-background-light);

						img {
							max-height: 1.68rem;
						}
					}
					p {
						flex: auto;
						color: var(--smx-color-text-bold);
						padding: var(--space-md);
						margin: 0;
						@media (max-width: 768px) {
							text-align: center;
						}
					}

					footer {
						display: flex;
						justify-content: space-between;
						gap: var(--space-sm);
						border-top: 1px solid var(--smx-color-background-light);
						text-align: center;
						flex-wrap: wrap;

						p {
							font-size: var(--font-size-sm);
							color: var(--smx-color-text);
							margin: 0;
							padding: 0;
							max-width: 120px;
							width: 30%;
						}
						img {
							max-height: 1rem;
							margin: 0 auto;
							display: block;
						}
						figure {
							margin: 0 auto;
							display: block;
						}
					}
				}

				&:nth-child(2) {
					aside {
						footer {
							justify-content: center;

							p:first-child {
								text-wrap: right;
							}
						}
					}
				}
			}
			@media (max-width: 768px) {
				.container.is-layout-grid {
					grid-template-columns: 1fr;
				}
			}
		}
	}

	.solutions-engine {
		.container {
			position: relative;
			overflow: hidden;
			padding: var(--space-xl) 0;
			color: var(--smx-color-background-light);

			@media (max-width: 768px) {
				padding-bottom: calc(var(--space-xxl) * 2);
			}

			h2 {
				font-weight: bold;
				color: var(--smx-color-white);
				font-size: var(--font-title-md);

				strong {
					color: var(--smx-color-primary-tint);
				}
				z-index: 1;
			}

			h3 {
				margin: 0 auto;
				font-size: var(--font-size-lg);
				max-width: 720px;
				z-index: 1;
			}

			p {
				font-size: var(--font-text);
				margin-top: 0;
				z-index: 1;
				padding-top: 16rem;
			}

			p:first-child,
			p:last-child {
				padding-top: 0;
			}

			.is-layout-flex {
				align-items: normal;
				display: grid;
				grid-template-columns: 0.8fr 1.4fr 0.8fr;
				gap: var(--space-xs);

				@media (max-width: 768px) {
					gap: var(--space-sm);
					grid-template-columns: 1fr;

					p {
						padding-top: 0;
						backdrop-filter: blur(1rem);
						padding: var(--space-sm);
						border-radius: var(--border-radius-xl);
						margin: var(--space-sm);
						text-align: center !important;
						color: var(--smx-color-white);
						font-size: var(--font-text);
					}
				}
			}
		}
	}

	.solutions-product {
		position: relative;
		overflow: hidden;

		&::before {
			content: '';
			position: absolute;

			inset: -50px 0;
			background-size: contain;
			background-position: right center;
			background-repeat: no-repeat;
			z-index: 0;
			will-change: transform;
			transform: translateY(var(--parallax-offset, 0));
			mix-blend-mode: darken;

			@media (max-width: 768px) {
				background-position: bottom center !important;
			}
		}

		.container {
			padding: var(--space-xxl) var(--space-md);
			display: flex;

			@media (max-width: 768px) {
				padding-left: var(--space-sm) !important;
				padding-right: var(--space-sm) !important;
				padding-bottom: 16.4rem !important;
				padding-bottom: var(--space-lg);

				.wp-block-group-is-layout-grid {
					grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
				}
			}
			@media (min-width: 769px) {
				.container-content {
					min-width: 600px;
					width: 54%;
				}
			}
		}

		h2 {
			font-size: var(--font-subtitle);
			line-height: 1.2;
		}

		h3 {
			margin-top: var(--space-sm);
			font-size: var(--font-size-base);
		}

		p {
			margin-top: var(--space-sm);
			font-size: var(--font-text);
		}

		.card {
			background: var(--smx-color-white);
			padding: var(--space-md) var(--space-sm);
			border-radius: var(--border-radius-lg);

			img {
				max-width: 2.6rem;
				height: auto;
				margin: 0 auto;
			}

			h4 {
				margin: 0;
				margin-top: var(--space-xs);
				font-size: var(--font-text);
				font-weight: normal;
				font-weight: 600;
			}
		}

		&.solutions-product-first {
			&::before {
				background-image: url('../../images/server-office.webp');
				background-position: left center;

				@media (max-width: 768px) {
					background-image: url('../../images/white-interior-space-office-m.webp');
				}
			}

			.container {
				justify-content: flex-end;
			}

			.is-layout-grid {
				.card:last-child {
					grid-column: span 2;
				}
			}
		}
		&.solutions-product-second {
			&::before {
				background-image: url('../../images/hand-pencil.webp');
				background-position: left center;
				@media (max-width: 768px) {
					background-image: url('../../images/businessman-m.webp');
				}
			}

			.container {
				justify-content: flex-end;
			}

			.wp-block-group.is-layout-grid > .card:nth-child(3) {
				grid-column: span 2;
			}
		}
		&.solutions-product-third {
			&::before {
				background-image: url('../../images/virtual-guy.webp');
				background-position: right center;
				@media (max-width: 768px) {
					background-image: url('../../images/virtual-boy-m.webp');
				}
			}

			.container {
				justify-content: flex-start;
			}
		}
		&.solutions-product-fourth {
			&::before {
				background-image: url('../../images/mouse-hand.webp');
				background-position: right center;
				@media (max-width: 768px) {
					background-image: url('../../images/woman-safety-m.webp');
				}
			}

			.container {
				justify-content: flex-start;
			}
		}
	}

	.solutions-resume {
		padding: var(--space-xl) 0;
		position: relative;
		overflow: hidden;

		.hero__content {
			position: relative;
			z-index: 1;
			padding-bottom: var(--space-xxl);

			@media (max-width: 768px) {
				padding-top: calc(var(--space-xxl) * 3);
			}

			h2 {
				font-size: var(--font-title-sm);
				@media (max-width: 768px) {
					font-size: var(--font-title-md);
				}
			}

			.is-layout-grid {
				margin-top: 0;
				align-items: center;

				@media (max-width: 768px) {
					grid-template-columns: auto auto auto;
				}

				h3 {
					margin: 0;
					font-size: var(--font-subtitle);
				}
				p {
					height: 1.5px;
					display: block;
					background: var(--smx-color-primary-tint);
				}

				&:nth-child(3) {
					column-gap: 33%;
					margin: var(--space-md) 0;

					@media (max-width: 768px) {
						grid-template-columns: 1fr;
					}
				}

				.card {
					position: relative;
					border: 1.5px solid var(--smx-color-primary-contrast);
					box-shadow: inset -134px 0 115px 0 rgba(138, 56, 254, 0.16);
					border-radius: var(--border-radius-lg);
					padding: var(--space-lg);
					background-color: transparent !important;
					backdrop-filter: blur(0.3rem);

					&:nth-child(even) {
						box-shadow: inset 134px 0 115px 0 rgba(138, 56, 254, 0.16);
					}

					p {
						height: auto;
						background: transparent;
					}

					&:before {
						content: ' ';
						background-image: url('../../images/purple-hook.svg');
						background-size: contain;
						background-repeat: no-repeat;
						position: absolute;
						top: 10%;
						right: -4.6rem;
						width: 5rem;
						height: 5rem;

						@media (max-width: 768px) {
							display: none;
						}
					}

					&:nth-child(2) {
						&:before {
							transform: scaleX(-1);
							right: auto;
							left: -4.6rem;
						}
					}
					&:nth-child(3) {
						&:before {
							transform: scaleY(-1);
						}
					}
					&:nth-child(4) {
						&:before {
							transform: scaleY(-1) scaleX(-1);
							right: auto;
							left: -4.6rem;
						}
					}
				}
			}
		}
	}

	.double-model {
		&::before {
			content: '';
			position: absolute;

			inset: -50px 0;
			background-image: url('../../images/night-sky.webp');
			background-size: 100%;
			background-position: center;
			background-repeat: no-repeat;
			z-index: 0;
			will-change: transform;
			transform: translateY(var(--parallax-offset, 0));

			@media (max-width: 768px) {
				background-size: cover;
				background-position: center bottom;
			}
		}
		.video-area {
			position: absolute;
			top: 36%;
			left: 50%;
			transform: translateX(-50%);

			width: 50%;
			max-width: 612px;

			height: auto;

			pointer-events: none;
			object-fit: cover;
			z-index: 0;

			mix-blend-mode: lighten;
			--webkit-mix-blend-mode: lighten;

			video {
				width: 100%;
			}

			@media (max-width: 768px) {
				top: 34%;
				width: 100%;
			}
		}

		.video-area {
			opacity: 1;
			transition: opacity 0.4s ease;
		}

		.video-area.is-hidden {
			opacity: 0;
			pointer-events: none;
		}

		.inner {
			mix-blend-mode: plus-lighter;
			--webkit-mix-blend-mode: plus-lighter;
		}

		section {
			display: flex;
			align-items: center;
		}

		.platform-title {
			font-size: var(--font-title-md);
		}
	}

	.evolution-section {
		padding: var(--space-lg) 0;

		.evolution-model {
			margin-top: var(--space-md);
			gap: 0;
			align-items: end;
			flex-direction: column;
			justify-content: end;
			min-height: 12rem;
			padding: var(--space-md) 0;

			@media (max-width: 768px) {
				flex-direction: column;
				display: flex;
				align-items: start;
			}

			.wp-block-group {
				background: var(--smx-color-primary);
				padding: var(--space-md);
				box-shadow: inset 0 -2rem 4rem rgba(0, 0, 0, 0.55);

				h5 {
					margin: 0;
					border-bottom: 1px solid rgba(var(--smx-color-primary-tint-rgb), 0.8);
					font-size: var(--font-size-base);
					margin-bottom: var(--space-sm);
					padding-bottom: var(--space-sm);
				}

				p {
					height: auto;
					background: transparent;
					font-size: var(--font-text);
					margin-top: 0;
				}

				&:nth-child(1) {
					background: #cc008c !important;
					height: 72%;
					border-radius: var(--border-radius-md) 0 0 var(--border-radius-md);
					@media (max-width: 768px) {
						border-radius: var(--border-radius-md) var(--border-radius-md) 0 0;
					}
				}
				&:nth-child(2) {
					height: 86%;
					border-radius: var(--border-radius-md) 0 0 0;
					background: #bd00cc !important;
					@media (max-width: 768px) {
						border-radius: 0 var(--border-radius-md) 0 0;
					}
				}
				&:nth-child(3) {
					height: 100%;
					border-radius: var(--border-radius-md) 0 0 0;
					background: #bb38fe !important;

					@media (max-width: 768px) {
						border-radius: 0 var(--border-radius-md) 0 0;
					}
				}
				&:nth-child(4) {
					height: 112%;
					border-radius: var(--border-radius-md) var(--border-radius-md)
						var(--border-radius-md) 0;
					background: var(--smx-color-primary) !important;

					@media (max-width: 768px) {
						border-radius: 0 var(--border-radius-md) var(--border-radius-md)
							var(--border-radius-md);
					}
				}
			}
		}

		/**ANIM support**/
		.evolution-model .wp-block-group {
			opacity: 0;
			transform-origin: bottom;
			transform: scaleY(0);
			transition:
				transform 0.6s cubic-bezier(0.22, 1, 0.36, 1),
				opacity 0.4s;
		}

		/* Mobile*/
		@media (max-width: 768px) {
			.evolution-model .wp-block-group {
				transform-origin: left;
				transform: scaleX(0);
			}
		}

		/* Active */
		.evolution-model.is-visible .wp-block-group {
			opacity: 1;
			transform: scale(1);
		}
	}

	a.wp-block-button__link {
		background: linear-gradient(
			0deg,
			var(--smx-color-primary-contrast) 0%,
			var(--smx-color-primary) 100%
		);
	}

	.business-lines-title {
		height: 0;
		overflow: visible;
		position: relative;
		h2 {
			display: inline-block;
			position: relative;
			line-height: 1;
			margin: 0;
			top: -3rem;
			left: 50%;
			transform: translateX(-50%);
			font-size: var(--font-subtitle);
			padding: var(--space-md) var(--space-lg);
			border-radius: var(--border-radius-lg) var(--border-radius-lg) 0 0;
			background: var(--smx-color-background-light);
		}
	}
}

#motorPlatform {
	position: relative;
	height: calc(var(--smx-total, 3) * 100vh);
}

#motorPlatform .inner {
	position: sticky;
	top: 0;
	height: 100vh;
	overflow: hidden;
}

#motorPlatform .track {
	will-change: transform;
	transition: transform 0.6s cubic-bezier(0.22, 1, 0.36, 1);
}

#motorPlatform section {
	height: 100vh;
}

@media (max-width: 768px) {
	#motorPlatform {
		height: auto;
		overflow: hidden;
		scroll-snap-type: none;
		position: relative;
		padding-bottom: var(--space-xxl);

		.video-area {
			top: 26%;
		}

		.solutions-engine {
			p {
				font-size: 1rem;
				padding: var(--space-lg) 0;
				border-bottom: 1px solid var(--smx-color-primary-contrast);
				border-radius: 0;

				&:last-child {
					border-bottom: none;
				}
			}
		}
	}

	#motorPlatform section {
		height: auto !important;
	}

	#motorPlatform .inner {
		height: auto !important;
	}

	.solutions-product {
		background: linear-gradient(0deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100%);

		.container-content {
			padding-left: var(--space-md) !important;
			padding-right: var(--space-md) !important;
		}
	}

	.business-lines-title {
		background: var(--smx-color-white) !important;
	}
}

@keyframes lights {
	0% {
		color: hsl(230, 40%, 80%);
		text-shadow:
			0 0 1em hsla(320, 100%, 50%, 0.2),
			0 0 0.125em hsla(320, 100%, 60%, 0.3),
			-1em -0.125em 0.5em hsla(40, 100%, 60%, 0),
			1em 0.125em 0.5em hsla(200, 100%, 60%, 0);
	}

	30% {
		color: hsl(230, 80%, 90%);
		text-shadow:
			0 0 1em hsla(320, 100%, 50%, 0.5),
			0 0 0.125em hsla(320, 100%, 60%, 0.5),
			-0.5em -0.125em 0.25em hsla(40, 100%, 60%, 0.2),
			0.5em 0.125em 0.25em hsla(200, 100%, 60%, 0.4);
	}

	40% {
		color: hsl(230, 100%, 95%);
		text-shadow:
			0 0 1em hsla(320, 100%, 50%, 0.5),
			0 0 0.125em hsla(320, 100%, 90%, 0.5),
			-0.25em -0.125em 0.125em hsla(40, 100%, 60%, 0.2),
			0.25em 0.125em 0.125em hsla(200, 100%, 60%, 0.4);
	}

	70% {
		color: hsl(230, 80%, 90%);
		text-shadow:
			0 0 1em hsla(320, 100%, 50%, 0.5),
			0 0 0.125em hsla(320, 100%, 60%, 0.5),
			0.5em -0.125em 0.25em hsla(40, 100%, 60%, 0.2),
			-0.5em 0.125em 0.25em hsla(200, 100%, 60%, 0.4);
	}

	100% {
		color: hsl(230, 40%, 80%);
		text-shadow:
			0 0 1em hsla(320, 100%, 50%, 0.2),
			0 0 0.125em hsla(320, 100%, 60%, 0.3),
			1em -0.125em 0.5em hsla(40, 100%, 60%, 0),
			-1em 0.125em 0.5em hsla(200, 100%, 60%, 0);
	}
}