/**
 * Platform paired columns (Trigger | Response).
 *
 * @package Fundamento
 */

.platform-paired-columns {
	--ppc-bg: var(--color-bg-default, #f8f7f4);
	--ppc-brand: var(--color-text-brand, #175844);
	--ppc-text: var(--color-text-default, #1b1b1b);
	--ppc-text-subtle: var(--color-neutral-600, #59554f);
	--ppc-panel-bg: var(--color-surface-overlay, #efede5);
	--ppc-item-bg: var(--color-surface-default, #fff);
	--ppc-border: var(--color-border-default, #e6e1d8);
	--ppc-max: 74rem;
	background-color: var(--ppc-bg);
	color: var(--ppc-text);
}

.platform-paired-columns__inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--space-40, 2.5rem);
	max-width: var(--ppc-max);
	margin-inline: auto;
	padding: var(--space-64, 4rem) 0 0;
}

.platform-paired-columns__heading {
	margin: 0;
	font-family: var(--font-family-display);
	font-size: 2.5rem;
	font-weight: 400;
	line-height: 1.2;
	color: var(--ppc-brand);
	text-align: center;
}

.platform-paired-columns__panel {
	display: flex;
	flex-direction: column;
	gap: var(--space-20, 1.25rem);
	width: 100%;
	padding: var(--space-20, 1.25rem);
	border-radius: 1.25rem;
	background-color: var(--ppc-panel-bg);
}

.platform-paired-columns__labels,
.platform-paired-columns__cols {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1.25rem;
	width: 100%;
}

.platform-paired-columns__label {
	font-family: var(--font-family-body);
	font-size: 1.25rem;
	font-weight: 500;
	line-height: 1.3;
	color: var(--ppc-text);
}

.platform-paired-columns__list {
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.platform-paired-columns__item {
	display: flex;
	align-items: center;
	flex: 1 1 auto;
	gap: var(--space-12, 0.75rem);
	min-height: 3.5rem;
	padding: 1.25rem;
	border: 1px solid var(--ppc-border);
	border-radius: 0.75rem;
	background-color: var(--ppc-item-bg);
}

.platform-paired-columns__item-icon {
	display: inline-flex;
	flex-shrink: 0;
	align-items: center;
	justify-content: center;
	width: 1.5rem;
	height: 1.5rem;
}

.platform-paired-columns__item-icon img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.platform-paired-columns__item-text {
	font-family: var(--font-family-body);
	font-size: 1rem;
	font-weight: 400;
	line-height: 1.4;
	color: var(--ppc-text-subtle);
}

@media (max-width: 61.99rem) {
	.platform-paired-columns__inner {
		align-items: stretch;
		gap: var(--space-40, 2.5rem);
		padding: var(--space-64, 4rem) var(--space-32, 2rem) 0;
	}

	.platform-paired-columns__heading {
		font-size: 1.5rem;
		line-height: normal;
		text-align: center;
	}

	.platform-paired-columns__panel {
		padding: var(--space-12, 0.75rem) var(--space-4, 0.25rem);
		border-radius: 0.75rem;
	}

	.platform-paired-columns__labels,
	.platform-paired-columns__cols {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: var(--space-4, 0.25rem);
	}

	.platform-paired-columns__labels {
		display: grid;
		gap: var(--space-4, 0.25rem) 1.25rem;
		text-align: center;
	}

	.platform-paired-columns__label {
		font-size: 1.25rem;
	}

	.platform-paired-columns__item {
		justify-content: center;
		min-height: 0;
		padding: var(--space-8, 0.5rem);
		border-radius: 0.5rem;
		text-align: center;
	}

	.platform-paired-columns__item-text {
		text-align: center;
	}
}

@media (max-width: 47.99rem) {
	.platform-paired-columns__inner {
		padding: var(--space-64, 4rem) var(--space-20, 1.25rem) 0;
	}

	.platform-paired-columns--ai-native-contact-centre .platform-paired-columns__inner {
		padding-top: 0;
	}

	.platform-paired-columns--ai-native-contact-centre .platform-paired-columns__heading {
		text-align: center;
	}
}

/* Journeys — Philosophy / Variables / Human Situations (Figma 2456:46767 / 2456:47109 / 2456:47279) */
.platform-paired-columns--journeys.platform-paired-columns--heading-h2 {
	--ppc-bg: var(--color-surface-default, #fff);
}

.platform-paired-columns--journeys .platform-paired-columns__inner {
	gap: var(--space-40, 2.5rem);
	padding: var(--space-80, 5rem) 0;
}

.platform-paired-columns--journeys.platform-paired-columns--heading-h2 .platform-paired-columns__inner {
	padding-bottom: var(--space-160, 10rem); /* frame 2456:46767 end */
}

.platform-paired-columns--journeys .platform-paired-columns__heading {
	font-size: 2.5rem; /* 40px default (Variables / Situations) */
	line-height: 1.2;
}

.platform-paired-columns--journeys.platform-paired-columns--heading-h2 .platform-paired-columns__heading {
	font-size: 3rem; /* 48px Philosophy */
}

.platform-paired-columns--journeys .platform-paired-columns__item-text {
	color: var(--ppc-text-subtle);
}

.platform-paired-columns__closing {
	margin: 0;
	max-width: 54.625rem;
	font-family: var(--font-family-display);
	font-size: 1.75rem;
	font-weight: 400;
	line-height: 1.2;
	color: var(--ppc-brand);
	text-align: center;
}

.platform-paired-columns--journeys .platform-paired-columns__closing {
	margin-top: 0;
}

/* Human situations closing is body MD, not H4 display */
.platform-paired-columns--journeys.platform-paired-columns--jny-human-situations .platform-paired-columns__closing,
.platform-paired-columns--journeys[data-platform-paired-columns='jny-human-situations'] .platform-paired-columns__closing {
	max-width: 58.375rem;
	font-family: var(--font-family-body);
	font-size: 1rem;
	line-height: 1.4;
	color: var(--ppc-text-subtle);
}

@media (max-width: 61.99rem) {
	.platform-paired-columns--journeys .platform-paired-columns__inner {
		padding: var(--space-64, 4rem) var(--space-40, 2.5rem);
	}

	.platform-paired-columns--journeys .platform-paired-columns__heading,
	.platform-paired-columns--journeys.platform-paired-columns--heading-h2 .platform-paired-columns__heading {
		font-size: 2rem;
	}

	.platform-paired-columns__closing {
		font-size: 1.375rem;
		text-align: left;
	}

	.platform-paired-columns--journeys[data-platform-paired-columns='jny-human-situations'] .platform-paired-columns__closing {
		font-size: 1rem;
		text-align: center;
	}
}

@media (max-width: 47.99rem) {
	.platform-paired-columns--journeys .platform-paired-columns__inner {
		padding-inline: var(--space-20, 1.25rem);
		padding-top:0;
	}
	
	.platform-paired-columns--journeys[data-platform-paired-columns="jny-philosophy"] .platform-paired-columns__inner{
		padding-top: 64px;
	}
	
	.platform-paired-columns--journeys .platform-paired-columns__heading, .platform-paired-columns--journeys.platform-paired-columns--heading-h2 .platform-paired-columns__heading{
		font-size: 24px;
		text-align: left;
	}
	.platform-paired-columns__item{
		padding :20px 16px;
		text-align: left;
		min-height: 6.5rem;
	}
	.platform-paired-columns--journeys .platform-paired-columns__item-text{
		text-align: left;
	}
	.platform-paired-columns--journeys.platform-paired-columns--heading-h2 .platform-paired-columns__inner{
		padding-bottom: 64px;
	}
	
	.platform-paired-columns--journeys[data-platform-paired-columns="jny-variables"] .platform-paired-columns__heading,.platform-paired-columns--journeys[data-platform-paired-columns="jny-human-situations"] .platform-paired-columns__heading {
		text-align: center;
	}

	.platform-paired-columns--journeys[data-platform-paired-columns="jny-variables"] .platform-paired-columns__item {
		flex-direction: column;
		align-items: center;
		justify-content: flex-start;
		gap: var(--space-8, 0.5rem);
		text-align: center;
		padding: 8px 16px;
	}
	
	.platform-paired-columns--journeys[data-platform-paired-columns="jny-human-situations"] .platform-paired-columns__item {
		flex-direction: column;
		align-items: center;
		justify-content: center;
		gap: var(--space-8, 0.5rem);
		text-align: center;
		padding: 8px 16px;
	}
	.platform-paired-columns--journeys[data-platform-paired-columns="jny-human-situations"] .platform-paired-columns__inner{
		padding-bottom:0;
	}

	.platform-paired-columns--journeys[data-platform-paired-columns="jny-variables"] .platform-paired-columns__item-text,.platform-paired-columns--journeys[data-platform-paired-columns="jny-variables"] .platform-paired-columns__closing,
	.platform-paired-columns--journeys[data-platform-paired-columns="jny-human-situations"] .platform-paired-columns__item-text{
		text-align: center;
	}
	
}
