/* Integrations Light — white card + OEM logo overlay image. Figma 693:491. */

.rw-block-integrations-light .card {
	position: relative;
	background: var(--rw-color-white);
	color: var(--rw-color-primary-green);
	border-radius: var(--rw-radius-lg);
	padding: 4.375rem 3rem; /* Figma 70/48 */
	overflow: hidden;
	isolation: isolate;
	min-height: 23.75rem;
}

.rw-block-integrations-light .intro {
	position: relative;
	z-index: 2;
	display: flex;
	flex-direction: column;
	max-width: 40.375rem;
}

/* Figma spacing: eyebrow→text-block 40px, H2→desc 24px, heading-group→CTA 32px. */
.rw-block-integrations-light .heading-group {
	display: flex;
	flex-direction: column;
	gap: 2.5rem;
	margin-bottom: var(--rw-space-lg);
}

.rw-block-integrations-light .text-block {
	display: flex;
	flex-direction: column;
	gap: var(--rw-space-md);
}

.rw-block-integrations-light h2 {
	font-family: var(--rw-font-text);
	font-weight: 700;
	font-size: var(--rw-h3-size);
	line-height: var(--rw-h3-line);
	letter-spacing: var(--rw-h3-tracking);
	color: var(--rw-color-primary-green);
	margin: 0;
}

.rw-block-integrations-light .desc {
	font-family: var(--rw-font-text);
	font-size: var(--rw-p1-size);
	line-height: var(--rw-p1-line);
	letter-spacing: var(--rw-p1-tracking);
	color: var(--rw-color-primary-green);
	opacity: 0.8;
	margin: 0;
}

.rw-block-integrations-light .cta {
	align-self: flex-start;
}

/* Logo composition — absolute right, full card height. */
.rw-block-integrations-light .logos-overlay {
	position: absolute;
	right: 0;
	top: 0;
	bottom: 0;
	height: 100%;
	width: auto;
	max-width: 55%;
	object-fit: contain;
	object-position: right center;
	z-index: 1;
	pointer-events: none;
	user-select: none;
}

@media (max-width: 767px) {
	.rw-block-integrations-light .card {
		padding: 2rem 1.5rem;
		padding-bottom: 0;
	}
	.rw-block-integrations-light .heading-group {
		gap: var(--rw-space-sm);
		margin-bottom: var(--rw-space-md);
	}
	.rw-block-integrations-light .text-block {
		gap: var(--rw-space-sm);
	}
	.rw-block-integrations-light .logos-overlay {
		position: relative;
		display: block;
		height: auto;
		max-width: 100%;
		margin-top: var(--rw-space-lg);
	}
}
