.tmpl-saas {
	&__banner {
		background-color: #000;
		background-size: contain;

		@include media-min($xlarge) {
			background-size: cover;
		}
		@include media-min($large) {
			.banner-default__text-content--center {
				padding-top: 120px;
				padding-bottom: 200px;
				grid-column: 3 / span 8;
			}

			h1 {
				font-size: 72px;
				line-height: 86px;
			}
		}
		p {
			font-weight: 300;
			text-align: center;
			color: #a2adb9;
			margin-left: auto;
			margin-right: auto;
			@include media-min($large) {
				font-size: 26px;
				line-height: 34px;
			}
			+ p {
				margin-top: 36px;
			}
		}
	}
	&__slide {
		.tab-content {
			padding: 16px;
			@include media-min($medium) {
				padding: 32px;
			}
			.title-mono {
				font-weight: 400;
				font-size: 16px;
				line-height: 26px;
				margin-top: 16px;
				@include media-min($medium) {
					margin-top: 24px;
					font-size: 20px;
				}
			}
			ul {
				padding-left: 24px;
				margin-top: 16px;
				@include media-min($medium) {
					margin-top: 24px;
				}
				li {
					font-weight: 500;
					font-size: 20px;
					line-height: 34px;
					@include media-min($medium) {
						font-size: 26px;
					}
				}
			}
			img {
				width: auto;
				max-height: 148px;
			}
			&-wrap {
				width: 100%;
				display: flex;
				flex-direction: column;
				gap: 32px;
				@include media-min($medium) {
					flex-direction: row;
				}
			}
			&.red {
				flex: 1;
				background: #f350483d;
				.title-mono,
				li {
					color: #f35149;
				}
			}
			&.green {
				flex: 1;
				background: #1aa8a82e;
				.title-mono,
				li {
					color: #1aa8a8;
				}
			}
		}
	}
	&__compare {
		.cards-container {
			--num-cols: 1;

			display: grid;
			grid-template-columns: repeat(var(--num-cols), 1fr);
			gap: var(--grid-column-gutter);

			@include media-min($medium) {
				--num-cols: 2;
			}
		}
		.card {
			background: rgba(58, 19, 17, 0.5);
			border: 1px dashed #3b3b3b;
			padding: 30px 40px;
			.label {
				color: #dc150b;
				font-family: var(--font-moderat-mono);
				font-weight: 500;
				font-size: 15px;
				line-height: 29px;
			}
			h3 {
				font-weight: 700;
				font-size: 24px;
				line-height: 30px;
				color: #fff;
				margin: 10px 0;
			}
			p {
				margin-top: 10px;
			}
			&.blue {
				background: #031d35;
				border-color: #031d35;
				display: flex;
				flex-direction: column;
				gap: 32px;
				@include media-min($medium) {
					align-items: center;
					flex-direction: row;
				}
				.label {
					color: #509dea;
				}
			}
		}
	}
}