.tomorrow-progress-cta {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	min-block-size: var(--size-tomorrow-progress-section);
	background: var(--color-hero);
}

.tomorrow-progress-cta__copy {
	display: flex;
	min-inline-size: 0;
	flex-direction: column;
	align-items: flex-start;
	justify-content: center;
	gap: var(--space-tomorrow-progress-copy-gap);
	padding-inline: var(--space-tomorrow-progress-copy-inline);
	background: var(--color-hero);
	color: var(--color-white);
}

.tomorrow-progress-cta__title {
	max-inline-size: var(--size-tomorrow-progress-title);
	margin: 0;
	font-size: var(--fs-tomorrow-progress-title);
	font-weight: var(--fw-bold);
	line-height: 1.3;
}

.tomorrow-progress-cta__title em {
	color: var(--color-accent-on-dark);
	font-style: italic;
}

.tomorrow-progress-cta__link { flex: none; }

.tomorrow-progress-cta__visual {
	position: relative;
	display: grid;
	min-block-size: var(--size-tomorrow-progress-section);
	place-items: center;
	overflow: hidden;
	isolation: isolate;
}

.tomorrow-progress-cta__image,
.tomorrow-progress-cta__shade {
	position: absolute;
	inset: 0;
	inline-size: 100%;
	block-size: 100%;
}

.tomorrow-progress-cta__image {
	z-index: -2;
	object-fit: cover;
	object-position: center;
}

.tomorrow-progress-cta__shade { z-index: -1; background: var(--color-tomorrow-progress-overlay); }

.tomorrow-progress-cta__panel {
	display: flex;
	inline-size: min(calc(100% - var(--space-tomorrow-progress-panel-inline)), var(--size-tomorrow-progress-panel));
	min-block-size: 500px;
	flex-direction: column;
	justify-content: space-between;
	padding: var(--space-tomorrow-progress-panel-padding);
	border-radius: var(--radius-tomorrow-progress-panel);
	background: var(--color-page);
}

.tomorrow-progress-cta__panel-label {
	margin: 0;
	font-size: var(--fs-tomorrow-progress-label);
	font-weight: var(--fw-bold);
	line-height: 1;
}

.tomorrow-progress-cta__steps {
	display: flex;
	block-size: var(--size-tomorrow-progress-chart);
	align-items: flex-end;
	gap: var(--space-tomorrow-progress-columns-gap);
	margin: 0;
	padding: 0;
	overflow: hidden;
	list-style: none;
}

.tomorrow-progress-cta__step {
	display: grid;
	min-inline-size: 0;
	block-size: calc(var(--tomorrow-progress-height) * 1%);
	flex: 1 1 0;
	grid-template-rows: minmax(0, 1fr) var(--size-tomorrow-progress-base);
}

.tomorrow-progress-cta__step-body { overflow: hidden; }

.tomorrow-progress-cta__step-moving {
	display: block;
	block-size: 100%;
	padding: 6px 6px 0;
	border: 2px dashed var(--color-tomorrow-progress-border);
	border-block-end: 0;
	border-radius: var(--radius-tomorrow-progress-bar) var(--radius-tomorrow-progress-bar) 0 0;
	background: var(--color-audit-card);
	transform: translateY(100%);
	transition: transform var(--dur-tomorrow-progress-rise) var(--ease-out);
	transition-delay: calc(var(--tomorrow-progress-index) * var(--dur-tomorrow-progress-stagger));
}

.tomorrow-progress-cta__fill-wrap {
	display: block;
	block-size: 100%;
	overflow: hidden;
	border: 2px dashed var(--color-tomorrow-progress-border);
	border-radius: var(--radius-tomorrow-progress-fill);
	background: var(--color-white);
}

.tomorrow-progress-cta__fill {
	display: block;
	inline-size: 100%;
	block-size: 100%;
	border-radius: inherit;
	background: var(--color-white);
}

.tomorrow-progress-cta__fill--accent { background: var(--color-trusted); }

.tomorrow-progress-cta__value {
	display: grid;
	place-items: end center;
	padding: 0 6px 14px;
	border: 2px dashed var(--color-tomorrow-progress-border);
	border-block-start: 0;
	border-radius: 0 0 var(--radius-tomorrow-progress-bar) var(--radius-tomorrow-progress-bar);
	background: var(--color-audit-card);
	font-size: var(--fs-tomorrow-progress-value);
	font-weight: var(--fw-bold);
	line-height: 1;
	text-align: center;
}

.tomorrow-progress-cta.is-visible .tomorrow-progress-cta__step-moving { transform: none; }

@media (max-width: 1023px) {
	.tomorrow-progress-cta { grid-template-columns: 1fr; }

	.tomorrow-progress-cta__copy {
		min-block-size: var(--size-tomorrow-progress-copy-mobile);
		align-items: center;
		padding-block: var(--space-tomorrow-progress-copy-block-mobile);
		text-align: center;
	}

	.tomorrow-progress-cta__title {
		max-inline-size: var(--size-tomorrow-progress-title-mobile);
		font-size: var(--fs-tomorrow-progress-title-mobile);
	}

	.tomorrow-progress-cta__link {
		block-size: var(--size-principles-cta-button-mobile);
		padding-inline: var(--space-principles-cta-button-inline-mobile);
		font-size: var(--fs-navigation-mobile);
	}

	.tomorrow-progress-cta__visual { min-block-size: var(--size-tomorrow-progress-visual-mobile); }

	.tomorrow-progress-cta__panel {
		inline-size: min(calc(100% - var(--space-tomorrow-progress-panel-inline-mobile)), var(--size-tomorrow-progress-panel-mobile));
		min-block-size: 220px;
		padding: var(--space-tomorrow-progress-panel-padding-mobile);
		border-radius: var(--radius-tomorrow-progress-panel-mobile);
	}

	.tomorrow-progress-cta__steps {
		block-size: var(--size-tomorrow-progress-chart-mobile);
		gap: var(--space-tomorrow-progress-columns-gap-mobile);
	}

	.tomorrow-progress-cta__step {
		grid-template-rows: minmax(0, 1fr) var(--size-tomorrow-progress-base);
	}

	.tomorrow-progress-cta__step-moving {
		padding: 3px 3px 0;
		border-width: 1px;
		border-radius: var(--radius-tomorrow-progress-bar-mobile) var(--radius-tomorrow-progress-bar-mobile) 0 0;
	}

	.tomorrow-progress-cta__fill-wrap {
		border-width: 1px;
		border-radius: var(--radius-tomorrow-progress-fill-mobile);
	}

	.tomorrow-progress-cta__value {
		padding: 0 3px 6px;
		border-width: 1px;
		border-radius: 0 0 var(--radius-tomorrow-progress-bar-mobile) var(--radius-tomorrow-progress-bar-mobile);
	}
}

@media (prefers-reduced-motion: reduce) {
	.tomorrow-progress-cta__step-moving {
		transform: none;
		transition: none;
	}
}