/* ==========================================================================
   Image Text block
   ========================================================================== */

.lc-block-image-text {
	background-color: var(--wp--preset--color--primary-40);
	border-radius: var(--wp--custom--border-radius--large);
	margin-block-start: var(--wp--preset--spacing--xx-large) !important;
	margin-block-end: var(--wp--preset--spacing--xx-large) !important;

	.lc-block-image-text__container {
		max-width: var(--wp--style--global--wide-size);
		margin: 0 auto;
		display: grid;
		align-items: start;
		gap: var(--wp--preset--spacing--x-large);

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

	.lc-block-image-text__image-wrapper {
		position: relative;
		width: 100%;
		aspect-ratio: 100/96;

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

		&::after {
			content: '';
			position: absolute;
			inset: 0;
			aspect-ratio: 100/96;
			background: url('../../img/block-image-text-mask-green-left.png') center/contain no-repeat;
			pointer-events: none;
			z-index: 1;
			border-radius: var(--wp--custom--border-radius--large);
		}
	}

	.lc-block-image-text__img {
		width: 100%;
		aspect-ratio: 100/96;
		object-fit: cover;
		padding: var(--wp--preset--spacing--medium);
	}

	.lc-block-image-text__content {
		padding: var(--wp--preset--spacing--x-large);

		@media (max-width: 768px) {
			padding: var(--wp--preset--spacing--small) var(--wp--preset--spacing--medium);
		}
	}

	.lc-block-image-text__pre-title {
		font-size: var(--wp--preset--font-size--body);
		font-weight: 600;
		color: var(--wp--preset--color--neutral-10);
	}

	.lc-block-image-text__title {
		margin-top: var(--wp--preset--spacing--small);
		color: var(--wp--preset--color--neutral-10);
	}

	.lc-block-image-text__text {
		color: var(--wp--preset--color--neutral-10);

		p {
			margin-top: var(--wp--preset--spacing--medium);
		}
	}

	.wp-block-buttons {
		display: flex;
		flex-wrap: wrap;
		gap: var(--wp--preset--spacing--small);
		margin-top: var(--wp--preset--spacing--medium);
	}
}

.lc-block-image-text--left {
	.lc-block-image-text__container {
		grid-template-columns: 2fr 3fr;

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

.lc-block-image-text--right {
	.lc-block-image-text__container {
		grid-template-columns: 3fr 2fr;

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

	.lc-block-image-text__image {
		order: 2;
	}

	.lc-block-image-text__content {
		order: 1;
	}

	.lc-block-image-text__image-wrapper::after {
		background-image: url('../../img/block-image-text-mask-green-right.png');
	}
}

/* Blue color variant */
.lc-block-image-text--blue {
	background-color: var(--wp--preset--color--secondary-30);

	.lc-block-image-text__image-wrapper::after {
		background-image: url('../../img/block-image-text-mask-blue-left.png');
	}

	&.lc-block-image-text--right .lc-block-image-text__image-wrapper::after {
		background-image: url('../../img/block-image-text-mask-blue-left.png');
		transform: scaleX(-1);
	}
}