/* Base Container Styles */
.elcogen-product-schema {
	width: 100%;
	background-color: var(--color-light-blue-100);
	padding: var(--spacing-section-vertical) var(--spacing-baseline-12);
}

.elcogen-product-schema__container {
	max-width: var(--container-default);
	margin: 0 auto;
}

/* Heading Styles */
.elcogen-product-schema__heading {
	/* Typography now controlled by universal .elcogen-widget-title class in global CSS */
	margin: 0 0 var(--spacing-baseline-40) 0;
	text-align: center;
}

.elcogen-product-schema__content {
	width: fit-content;
	margin-inline: auto;
}

/* Product Cards Row */
.elcogen-product-schema__cards {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: var(--spacing-baseline-08);
	padding-inline: 1.5rem;
	align-items: stretch;
}
@media (max-width: 40rem) {
	.elcogen-product-schema__cards {
		padding-inline: 0;
	}
	.elcogen-product-schema__card-logo img {
		max-width: 75% !important;
	}

	.elcogen-product-schema__card {
		padding-inline: var(--spacing-baseline-4) !important;
	}
}

.elcogen-product-schema__card {
	background-color: var(--color-background-primary);
	border-radius: var(--radius-large);
	padding: var(--spacing-baseline-24);
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	flex: 1;
	max-width: 16.75rem;
	transition: var(--transition-background);
}

.elcogen-product-schema__card:hover {
	background-color: var(--card-hover-background);
}

/* Product Image */
.elcogen-product-schema__card-image {
	margin-bottom: var(--spacing-baseline-16);
}

.elcogen-product-schema__card-image img {
	width: 10.25rem;
	height: 10.25rem;
	object-fit: cover;
	border-radius: var(--radius-large);
	mix-blend-mode: multiply;
}

/* Product Logo */
.elcogen-product-schema__card-logo {
	margin-bottom: var(--spacing-baseline-16);
}

.elcogen-product-schema__card-logo img {
	max-width: 7.5rem;
	height: auto;
	mix-blend-mode: multiply;
}

/* Product Description */
.elcogen-product-schema__card-description {
	font-family: var(--font-family-body);
	font-weight: var(--font-weight-regular);
	font-size: var(--font-size-body-large);
	line-height: var(--line-height-body-large);
	color: var(--color-text-secondary);
	margin: 0 0 var(--spacing-baseline-16) 0;
	flex-grow: 1;
}

.elcogen-product-schema__card-description p {
	margin: 0;
}

.elcogen-product-schema__card-description p + p {
	margin-top: var(--spacing-baseline-08);
}

/* Product Button */
.elcogen-product-schema__card-button {
	display: inline-block;
	font-family: var(--font-family-body);
	font-weight: var(--font-weight-bold);
	font-size: var(--font-size-body-base);
	line-height: var(--line-height-body-base);
	color: var(--color-white);
	background-color: var(--color-dark-neutral);
	border-radius: var(--radius-pill);
	padding: var(--button-padding-small);
	text-decoration: none;
	transition: var(--transition-background);
}

.elcogen-product-schema__card-button:hover {
	background-color: var(--color-dark-neutral-hover);
}

/* Arrow Connector */
.elcogen-product-schema__arrow {
	display: flex;
	align-items: center;
	justify-content: center;
}

@media (max-width: 48rem) {
	.elcogen-product-schema__cards {
		gap: 0 !important;
	}
	.elcogen-product-schema__card:last-child {
		border-top-left-radius: 0 !important;
		border-bottom-left-radius: 0 !important;
	}
	.elcogen-product-schema__card:first-child {
		border-top-right-radius: 0 !important;
		border-bottom-right-radius: 0 !important;
	}
	.elcogen-product-schema__card:not(:first-child):not(:last-child) {
		border-radius: 0 !important;
	}
	.elcogen-product-schema__arrow {
		display: none;
	}
}

.elcogen-product-schema__arrow svg {
	width: var(--spacing-baseline-40);
	height: var(--spacing-baseline-40);
}

.elcogen-product-schema__arrow svg path {
	stroke: var(--color-dark-neutral-hover);
	stroke-width: 2;
	stroke-linecap: round;
	stroke-linejoin: round;
}

/* Flow Diagram Styles */
.elcogen-product-schema__flow {
	margin-top: 3rem;
	width: 100%;
}

.elcogen-product-schema__explanation {
	font-family: var(--font-family-body);
	font-size: var(--font-size-body-large);
	line-height: var(--line-height-body-large);
	color: var(--color-text-secondary);
	text-align: center;
	max-width: 61.875rem;
	margin: var(--spacing-baseline-16) 0 0;
	padding-inline: 1rem;
}

.elcogen-product-schema__explanation p {
	margin: 0;
}

.elcogen-product-schema__explanation p + p {
	margin-top: var(--spacing-baseline-08);
}

/* Link styling - styled as regular text with subtle hover */
.elcogen-product-schema__link {
	display: inline-block;
	text-decoration: none;
	color: inherit;
	transition: opacity 0.2s ease;
}

.elcogen-product-schema__link:hover {
	opacity: 0.8;
	text-decoration: none;
}

.elcogen-product-schema__transition-1 {
	margin-bottom: var(--spacing-baseline-12);
}

.elcogen-product-schema__curved-border {
	height: 2.375rem;
	border-left: 2px solid var(--color-dark-neutral-hover);
	border-right: 2px solid var(--color-dark-neutral-hover);
	border-bottom: 2px solid var(--color-dark-neutral-hover);
	border-top: none;
	border-bottom-left-radius: 1.5rem;
	border-bottom-right-radius: 1.5rem;
}

.elcogen-product-schema__branching {
	width: fit-content;
	margin: 0 auto;
}

.elcogen-product-schema__center-icon-wrapper {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--spacing-baseline-08);
	position: relative;
	z-index: 1;
	padding: 0 var(--spacing-baseline-08);
}

.elcogen-product-schema__center-icon-wrapper svg {
	width: 1.375rem;
	height: 1.625rem;
	flex-shrink: 0; /* Prevent arrow from shrinking */
}

.elcogen-product-schema__center-icon-wrapper svg path {
	fill: var(--color-text-primary);
}

/* When no center icon, remove gap */
.elcogen-product-schema__center-icon-wrapper:not(:has(.elcogen-product-schema__center-icon)) {
	gap: 0;
}

.elcogen-product-schema__center-icon {
	width: 7.5rem;
	height: 7.5rem;
	display: flex;
	align-items: center;
	justify-content: center;
}

.elcogen-product-schema__center-icon img {
	max-width: 100%;
	max-height: 100%;
	object-fit: contain;
}

.elcogen-product-schema__flow-applications {
	display: flex;
	justify-content: center;
	gap: var(--spacing-baseline-32);
	flex-wrap: wrap;
	width: fit-content;
	margin: 0 auto;
}

.elcogen-product-schema__flow-app-item {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--spacing-baseline-08);
	wisth: var(--spacing-baseline-64);
	flex: 1;
	white-space: nowrap;
}

.elcogen-product-schema__flow-app-item svg {
	width: 1.375rem;
	height: 1.625rem;
}

.elcogen-product-schema__flow-app-item svg path {
	fill: var(--color-text-primary);
}

.elcogen-product-schema__summary {
	margin-top: var(--spacing-baseline-32);
}

.elcogen-product-schema__app-icon {
	width: 3rem;
	height: 3rem;
	display: flex;
	align-items: center;
	justify-content: center;
}

.elcogen-product-schema__app-icon img,
.elcogen-product-schema__app-icon svg {
	max-width: 100%;
	max-height: 100%;
}

.elcogen-product-schema__app-name {
	font-family: var(--font-family-body);
	font-weight: var(--font-weight-regular);
	font-size: var(--font-size-body-large);
	line-height: var(--line-height-body-base);
	color: var(--color-text-secondary);
	text-align: center;
}

/* Bottom CTA Section */
.elcogen-product-schema__bottom-cta {
	margin-top: var(--spacing-baseline-40);
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--spacing-baseline-16);
	text-align: center;
}

.elcogen-product-schema__cta-explanation {
	font-family: var(--font-family-body);
	font-size: var(--font-size-body-large);
	line-height: var(--line-height-body-large);
	color: var(--color-text-secondary);
	text-align: center;
	max-width: 50rem;
	margin: 0;
}

.elcogen-product-schema__cta-explanation p {
	margin: 0;
}

.elcogen-product-schema__cta-explanation p + p {
	margin-top: var(--spacing-baseline-08);
}

/* Bottom CTA Button - Blue Primary Style (matching hero carousel) */
.elcogen-product-schema__bottom-cta .elcogen-button--primary {
	background-color: #0c28c4 !important;
	border-color: #0c28c4 !important;
	color: #FFFFFF !important;
	border-radius: var(--radius-pill);
	transition: var(--transition-all);
}

.elcogen-product-schema__bottom-cta .elcogen-button--primary:hover {
	background-color: #091c8f !important;
	border-color: #091c8f !important;
	color: #FFFFFF !important;
	transform: translateY(-0.125rem);
}

.elcogen-product-schema__bottom-cta .elcogen-button--primary:active {
	background-color: #061561 !important;
	border-color: #061561 !important;
	color: #FFFFFF !important;
	transform: translateY(0);
}

/* Mobile Responsive Styles */
@media (max-width: 48rem) {
	.elcogen-product-schema {
		padding: var(--spacing-section-vertical-mobile) var(--spacing-baseline-12);
	}

	.elcogen-product-schema__heading {
		/* Typography now controlled by universal .elcogen-widget-title class in global CSS */
		margin-bottom: var(--spacing-baseline-32);
	}

	.elcogen-product-schema__bottom-cta {
		margin-top: var(--spacing-baseline-32);
	}

	.elcogen-product-schema__cta-explanation {
		font-size: var(--font-size-body-base);
		line-height: var(--line-height-body-base);
	}

	.elcogen-product-schema__cards {
		gap: 0;
		border-radius: var(--radius-large);
		overflow: hidden;
	}

	.elcogen-product-schema__card {
		padding: var(--spacing-baseline-12);
		max-width: 100%;
		flex: 1 0 0;
		border-radius: 0;
	}

	.elcogen-product-schema__card:first-child {
		border-top-left-radius: var(--radius-large);
		border-bottom-left-radius: var(--radius-large);
	}

	.elcogen-product-schema__card:last-child {
		border-top-right-radius: var(--radius-large);
		border-bottom-right-radius: var(--radius-large);
	}

	.elcogen-product-schema__card-image img {
		width: 4.3125rem;
		height: 4.3125rem;
	}

	.elcogen-product-schema__card-description {
		font-size: var(--font-size-body-medium);
		line-height: var(--line-height-body-medium);
	}

	.elcogen-product-schema__arrow {
		transform: rotate(90deg);
	}

	/* Flow Diagram Mobile Styles */
	.elcogen-product-schema__explanation {
		font-size: var(--font-size-body-base);
		line-height: var(--line-height-body-base);
	}

	.elcogen-product-schema__flow-applications {
		display: grid;
		grid-template-columns: repeat(4, 1fr);
		gap: var(--spacing-baseline-12);
	}

	.elcogen-product-schema__app-icon {
		width: 2.5rem;
		height: 2.5rem;
	}

	.elcogen-product-schema__app-name {
		font-size: var(--font-size-body-small);
	}
}