/* ================================================
   Component: Image & Text (2 Column)
   ================================================ */

.image-text-2col__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var(--gap-3xl);
	align-items: center;
}

.image-text-2col__grid--right {
	direction: rtl;
}

.image-text-2col__grid--right > * {
	direction: ltr;
}

.image-text-2col__image img {
	width: 100%;
	height: auto;
	border-radius: var(--radius-md);
	object-fit: cover;
}

.image-text-2col__content .preheading {
	margin-bottom: var(--gap-sm);
}

.image-text-2col__content h2 {
	margin-bottom: var(--gap-lg);
}

.image-text-2col__body {
	font-family: var(--font-secondary);
	font-size: var(--font-size-md);
	line-height: var(--line-height-relaxed);
	color: var(--color-denim);
	margin-bottom: var(--gap-xl);
}

.image-text-2col__body p {
	margin-bottom: var(--gap-md);
}

.image-text-2col__body p:last-child {
	margin-bottom: 0;
}

.image-text-2col__button {
	margin-top: var(--gap-lg);
}

.image-text-2col__content .button-group {
	margin-top: var(--gap-xl);
	flex-direction: column;
	align-items: flex-start;
}

@media screen and (max-width: 992px) {
	.image-text-2col__grid {
		grid-template-columns: 1fr;
		gap: var(--gap-2xl);
	}

	.image-text-2col__grid--right {
		direction: ltr;
	}

	.image-text-2col__image {
		order: -1;
	}
}