.approach-orbit {
	--color-section-accent: var(--color-trusted);
}

.approach-orbit__layout {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	align-items: stretch;
	gap: var(--space-approach-orbit-columns);
}

.approach-orbit__diagram {
	--orbit-start-angle: -129deg;
	position: relative;
	min-width: 0;
	block-size: var(--size-approach-orbit-diagram);
	overflow: hidden;
	border-radius: var(--radius-approach-orbit-diagram);
	background: var(--color-audit-card);
}

.approach-orbit__ring,
.approach-orbit__core {
	position: absolute;
	inset: 50% auto auto 50%;
	border-radius: 50%;
	transform: translate(-50%, -50%);
}

.approach-orbit__ring {
	border: 1px solid var(--color-approach-orbit-ring);
}

.approach-orbit__ring--inner {
	inline-size: var(--size-approach-orbit-ring-inner);
	block-size: var(--size-approach-orbit-ring-inner);
}

.approach-orbit__ring--middle {
	inline-size: var(--size-approach-orbit-ring-middle);
	block-size: var(--size-approach-orbit-ring-middle);
}

.approach-orbit__ring--outer {
	inline-size: var(--size-approach-orbit-ring-outer);
	block-size: var(--size-approach-orbit-ring-outer);
}

.approach-orbit__core {
	z-index: 2;
	display: grid;
	inline-size: var(--size-approach-orbit-core);
	block-size: var(--size-approach-orbit-core);
	place-items: center;
	background: var(--color-page);
}

.approach-orbit__core-inner {
	display: grid;
	inline-size: var(--size-approach-orbit-core-inner);
	block-size: var(--size-approach-orbit-core-inner);
	place-items: center;
	overflow: hidden;
	border: 1px solid var(--color-border);
	border-radius: 50%;
	background: var(--color-white);
	box-shadow: var(--shadow-approach-orbit);
}

.approach-orbit__logo {
	inline-size: var(--size-approach-orbit-logo-inline);
	block-size: var(--size-approach-orbit-logo-block);
	object-fit: contain;
}

.approach-orbit__orbit-position {
	--orbit-offset: 0deg;
	--orbit-angle: calc(var(--orbit-start-angle) + var(--orbit-offset));
	position: absolute;
	inset: 50% auto auto 50%;
	z-index: 3;
	inline-size: 0;
	block-size: 0;
	transform: rotate(var(--orbit-angle));
}

.approach-orbit__orbit-position--idea { --orbit-offset: 0deg; }
.approach-orbit__orbit-position--research { --orbit-offset: 72deg; }
.approach-orbit__orbit-position--discussion { --orbit-offset: 144deg; }
.approach-orbit__orbit-position--partnership { --orbit-offset: 216deg; }
.approach-orbit__orbit-position--dataset { --orbit-offset: 288deg; }

.approach-orbit__orbit-motion {
	display: block;
	inline-size: 0;
	block-size: 0;
	animation: approach-orbit-spin var(--dur-approach-orbit) linear infinite;
}

.approach-orbit__orbit-item {
	display: grid;
	inline-size: var(--size-approach-orbit-node);
	block-size: var(--size-approach-orbit-node);
	place-items: center;
	border: 1px solid var(--color-border);
	border-radius: 50%;
	background: var(--color-page);
	box-shadow: var(--shadow-approach-orbit);
	transform: translateX(var(--size-approach-orbit-radius)) translate(-50%, -50%) rotate(calc(var(--orbit-angle) * -1));
	animation: approach-orbit-counter-spin var(--dur-approach-orbit) linear infinite;
}

.approach-orbit__orbit-icon {
	inline-size: var(--size-approach-orbit-node-icon);
	block-size: var(--size-approach-orbit-node-icon);
	color: var(--color-trusted);
}

.approach-orbit__content,
.approach-orbit__heading {
	display: flex;
	min-width: 0;
	flex-direction: column;
}

.approach-orbit__content {
	gap: var(--space-approach-orbit-content);
}

.approach-orbit__heading {
	gap: var(--space-approach-orbit-heading);
}

.approach-orbit__title {
	display: flex;
	flex-direction: column;
	font-size: var(--fs-approach-orbit-title);
	letter-spacing: var(--tracking-approach-orbit-title);
}

.approach-orbit__items {
	display: flex;
	min-block-size: 0;
	flex: 1;
	flex-direction: column;
	gap: var(--space-approach-orbit-items);
	margin: 0;
	padding: 0;
	list-style: none;
}

.approach-orbit__item {
	display: flex;
	min-width: 0;
	min-block-size: 0;
	flex: 1;
	align-items: center;
	justify-content: space-between;
	gap: var(--space-approach-orbit-item-copy);
	padding: var(--space-approach-orbit-item-block) var(--space-approach-orbit-item-inline);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-approach-orbit-item);
	background: var(--color-white);
}

.approach-orbit__item-main {
	display: flex;
	min-width: 0;
	align-items: center;
	gap: var(--space-approach-orbit-item-copy);
}

.approach-orbit__item-icon {
	inline-size: var(--size-approach-orbit-item-icon);
	block-size: var(--size-approach-orbit-item-icon);
	flex: none;
	color: var(--color-trusted);
}

.approach-orbit__item strong,
.approach-orbit__item-number {
	font-size: var(--fs-approach-orbit-item);
	font-weight: var(--fw-bold);
	line-height: 1;
	letter-spacing: var(--tracking-approach-orbit-item);
}

.approach-orbit__item-number {
	flex: none;
	color: var(--color-process-mid);
}

@keyframes approach-orbit-spin {
	to { transform: rotate(360deg); }
}

@keyframes approach-orbit-counter-spin {
	from { transform: translateX(var(--size-approach-orbit-radius)) translate(-50%, -50%) rotate(calc(var(--orbit-angle) * -1)); }
	to { transform: translateX(var(--size-approach-orbit-radius)) translate(-50%, -50%) rotate(calc((var(--orbit-angle) * -1) - 360deg)); }
}

@media (max-width: 1023px) {
	.approach-orbit__layout {
		display: flex;
		flex-direction: column;
		gap: var(--space-approach-orbit-layout-mobile);
	}

	.approach-orbit__content {
		order: 1;
		gap: var(--space-approach-orbit-content-mobile);
	}

	.approach-orbit__heading {
		align-items: center;
		gap: var(--space-approach-orbit-heading-mobile);
		text-align: center;
	}

	.approach-orbit__eyebrow {
		font-size: var(--fs-approach-orbit-eyebrow-mobile);
	}

	.approach-orbit__title {
		font-size: var(--fs-approach-orbit-title-mobile);
		letter-spacing: var(--tracking-approach-orbit-title-mobile);
	}

	.approach-orbit__items {
		flex: none;
		gap: var(--space-approach-orbit-items-mobile);
	}

	.approach-orbit__item {
		min-block-size: var(--size-approach-orbit-item-mobile);
		flex: none;
		gap: var(--space-approach-orbit-item-copy-mobile);
		padding: var(--space-approach-orbit-item-padding-mobile);
		border-radius: var(--radius-approach-orbit-item-mobile);
	}

	.approach-orbit__item-main {
		gap: var(--space-approach-orbit-item-copy-mobile);
	}

	.approach-orbit__item-icon {
		inline-size: var(--size-approach-orbit-item-icon-mobile);
		block-size: var(--size-approach-orbit-item-icon-mobile);
	}

	.approach-orbit__item strong,
	.approach-orbit__item-number {
		font-size: var(--fs-approach-orbit-item-mobile);
		letter-spacing: var(--tracking-approach-orbit-item-mobile);
	}

	.approach-orbit__diagram {
		--orbit-start-angle: -140deg;
		order: 2;
		inline-size: 100%;
		block-size: var(--size-approach-orbit-diagram-mobile);
		border-radius: var(--radius-approach-orbit-diagram-mobile);
	}

}

@media (prefers-reduced-motion: reduce) {
	.approach-orbit__orbit-motion,
	.approach-orbit__orbit-item {
		animation: none;
	}
}
