.tmpl-invent {
	&__join,
	&__join-google-cloud,
	&__join-developer {
		@include media-min($large) {
			background: linear-gradient(to right, #87120c 41%, transparent 41%),
				url("https://static.pingcap.com/files/2024/11/14200525/1000011067.jpg") #000;
			background-size: cover;
			background-position: right;
			.block-columns__column {
				display: flex;
			}
		}
		@include media-min(1200px) {
			background-size: contain;
		}
		.content {
			background-color: #87120c;
			padding: 36px 30px 40px 30px;
			@include media-min($large) {
				padding: 36px 60px 68px 0;
				width: 40%;
			}
			.block-title {
				margin-bottom: 40px;
				h4 {
					@include media-min($medium) {
						font-size: 40px;
						font-weight: 700;
						line-height: 48px;
					}
					@include media-min($large) {
						font-size: 60px;
						font-weight: 700;
						line-height: 64px;
					}
				}
			}
			p {
				font-size: 22px;
				font-weight: 300;
				line-height: 28px;
				text-align: left;
				color: #fff;
			}
			ul {
				margin-top: 16px;
				color: #fff;
			}
		}
		.image {
			position: relative;
			flex: 1;
			img {
				width: 100%;
				@include media-min($large) {
					opacity: 0;
					height: 100%;
				}
			}
			.info {
				position: absolute;
				bottom: 0;
				left: 0;
				right: 0;
				padding: 100px 0 20px 20px;
				background: linear-gradient(180deg, transparent, rgba(0, 0, 0, 0.2) 20%, #000000 100%);
				color: #fff;
				p {
					color: #fff;
				}
				.text {
					display: flex;
					align-items: center;
					gap: 10px;
					margin-top: 10px;
				}
				svg {
					vertical-align: text-top;
				}
			}
		}
	}
	&__join-developer {
		padding-top: 42.5px;
		@include media-min($medium) {
			padding-top: 0;
		}
		@include media-min($large) {
			background: linear-gradient(to right, #3c174c 41%, transparent 41%),
				url(https://static.pingcap.com/files/2024/11/28184334/ALEXXA.jpg) #000;
			background-repeat: no-repeat;
			background-size: cover;
			background-position: right;
		}
		.content {
			background-color: #3c174c;
		}
	}
	&__join-google-cloud {
		@include media-min($large) {
			background: linear-gradient(to right, #87120c 41%, transparent 41%),
				url("https://static.pingcap.com/files/2025/03/19205837/20250320-115814.jpeg") #000;
			background-repeat: no-repeat;
			background-size: cover;
			background-position: right;
		}
	}
	&__join-aws {
		@include media-min($large) {
			background: linear-gradient(to right, #87120c 41%, transparent 41%),
				url("https://static.pingcap.com/files/2025/11/20230728/canaletto-26077571.jpg") #000;
			background-repeat: no-repeat;
			background-size: cover;
			background-position: right;
		}
	}
	&__join-aws-apac {
		@include media-min($large) {
			background: linear-gradient(to right, #87120c 41%, transparent 41%),
				url("https://static.pingcap.com/files/2026/04/15194329/20260416-104001-2.jpeg") #000;
			background-repeat: no-repeat;
			background-size: cover;
			background-position: right;
		}
	}
}