.wp-block-lazyblock-three-blocks-features {
	background: var(--gradient1);

	.content {
		border-left: 1px solid var(--border-dark);
		border-right: 1px solid var(--border-dark);
		padding: 0;

		.title {
			padding: 6rem 20px;

			.title-inset {
				max-width: calc(var(--container-width) / 2);

				.description {
					font-size: 1.2rem;
					font-weight: 300;
					line-height: 1.4;
					color: var(--text-light);
				}
			}

			h3 {
				font-size: 4rem;
				font-family: var(--font-heading);
				font-weight: normal;
				margin: 0;
				margin-bottom: 2rem;
				color: var(--text-alt);
			}
		}
	}

	.columns {
		display: flex;

		.column {
			flex: 1;
			position: relative;

			&:hover {
				.column-info {
					--featuredBlocksColor1: rgba(0, 0, 0, 1);
					--featuredBlocksColor2: rgba(0, 0, 0, 0);
				}
			}

			.column-info {
				position: absolute;
				left: 0;
				bottom: 0;
				right: 0;
				top: 0;
				display: flex;
				flex-direction: column;
				justify-content: flex-end;
				padding: 2rem;

				a {
					position: absolute;
					left: 0;
					top: 0;
					bottom: 0;
					right: 0;
				}

				h4 {
					font-size: 2rem;
					font-weight: 500;
					margin: 0;
					color: var(--text-alt);
					text-transform: uppercase;
				}

				background: linear-gradient(
					360deg,
					var(--featuredBlocksColor1) 0%,
					var(--featuredBlocksColor2) 100%
				);
				transition:
					--featuredBlocksColor1 1s,
					--featuredBlocksColor2 1s;
			}

			.column-image {
				width: 100%;
				aspect-ratio: 43 / 69;

				img {
					width: 100%;
					height: 100%;
					object-fit: cover;
					display: block;
				}
			}
		}
	}
}
