.yepx-cta {
	--yepx-cta-ink: #fff;
	--yepx-cta-r: var(--yepx-radius-xl, 32px);
	box-sizing: border-box;
	display: block;
	width: 100%;
	max-width: min(75rem, calc(100% - 28px));
	margin-inline: auto;
	padding: clamp(1.75rem, 4vw, 2.5rem) clamp(1.5rem, 4vw, 3rem);
	border-radius: var(--yepx-cta-r);
	color: var(--yepx-cta-ink);
	background: var(--yepx-gradient-cta);
	overflow: visible;
}

.yepx-cta--w-wide {
	max-width: min(90vw, 77.5rem);
}

.yepx-cta--w-full {
	max-width: 100%;
	width: 100%;
}

.yepx-cta--r-sm { --yepx-cta-r: var(--yepx-radius-sm, 10px); }
.yepx-cta--r-md { --yepx-cta-r: var(--yepx-radius-md, 16px); }
.yepx-cta--r-lg { --yepx-cta-r: var(--yepx-radius-lg, 24px); }
.yepx-cta--r-xl { --yepx-cta-r: var(--yepx-radius-xl, 32px); }
.yepx-cta--r-pill { --yepx-cta-r: var(--yepx-radius-pill, 9999px); }

.yepx-cta--bg-none {
	background: transparent;
	--yepx-cta-ink: var(--yepx-color-heading, #0b2c3d);
}

.yepx-cta--tok-surface,
.yepx-cta--tok-background,
.yepx-cta--tok-hero {
	--yepx-cta-ink: var(--yepx-color-heading, #0b2c3d);
}

.yepx-cta__inner {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 1.25rem 2rem;
}

.yepx-cta__copy {
	flex: 1 1 16rem;
	min-width: 0;
}

.yepx-cta__title,
.yepx-cta .yepx-cta__title,
.yepx-cta h2.yepx-cta__title {
	margin: 0;
	color: var(--yepx-cta-ink);
	font-size: clamp(1.35rem, 2.4vw, 2rem);
	line-height: 1.25;
	font-weight: 700;
}

.yepx-cta__desc,
.yepx-cta__desc p {
	margin: 0.45rem 0 0;
	color: var(--yepx-cta-ink);
	opacity: 0.92;
	font-size: 1rem;
	line-height: 1.45;
	max-width: 36rem;
}

.yepx-cta-actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.75rem;
	flex: 0 1 auto;
}

.yepx-cta--align-left .yepx-cta__inner {
	justify-content: flex-start;
}

.yepx-cta--align-left .yepx-cta-actions {
	justify-content: flex-start;
	margin-inline-end: auto;
}

.yepx-cta--align-center .yepx-cta__inner {
	flex-direction: column;
	text-align: center;
}

.yepx-cta--align-center .yepx-cta__desc,
.yepx-cta--align-center .yepx-cta__desc p {
	margin-inline: auto;
}

.yepx-cta--align-center .yepx-cta-actions {
	justify-content: center;
}

.yepx-cta--align-right .yepx-cta__inner {
	justify-content: space-between;
}

.yepx-cta--align-right .yepx-cta-actions {
	justify-content: flex-end;
	margin-inline-start: auto;
}

.yepx-cta .yepx-btn,
.yepx-cta-actions .yepx-btn {
	min-height: 52px;
	height: 52px;
	padding: 0 1.7rem;
	border-radius: 9999px;
}

.yepx-cta .yepx-btn--primary {
	background: #fff;
	color: var(--yepx-color-navy, #0b2c3d);
}

.yepx-cta .yepx-btn--primary:hover,
.yepx-cta .yepx-btn--primary:focus {
	background: var(--yepx-color-primary, #06baf3);
	color: #fff;
}

.yepx-cta .yepx-btn--ghost,
.yepx-cta .yepx-btn--on-dark {
	background: transparent;
	color: #fff;
	border: 1px solid #fff;
}

.yepx-cta .yepx-btn--ghost:hover,
.yepx-cta .yepx-btn--on-dark:hover {
	background: #fff;
	color: var(--yepx-color-navy, #0b2c3d);
}

.yepx-cta--tok-surface .yepx-btn--primary,
.yepx-cta--tok-background .yepx-btn--primary,
.yepx-cta--tok-hero .yepx-btn--primary,
.yepx-cta--bg-none .yepx-btn--primary {
	background: var(--yepx-color-primary, #06baf3);
	color: #fff;
}

.yepx-cta--tok-surface .yepx-btn--ghost,
.yepx-cta--tok-background .yepx-btn--ghost,
.yepx-cta--tok-hero .yepx-btn--ghost,
.yepx-cta--bg-none .yepx-btn--ghost {
	color: var(--yepx-color-navy, #0b2c3d);
	border-color: var(--yepx-color-navy, #0b2c3d);
}

@media (max-width: 767px) {
	.yepx-cta--r-pill {
		--yepx-cta-r: var(--yepx-radius-xl, 32px);
	}

	.yepx-cta,
	.yepx-cta__inner,
	.yepx-cta__copy,
	.yepx-cta__title,
	.yepx-cta .yepx-cta__title,
	.yepx-cta h2.yepx-cta__title,
	.yepx-cta__desc,
	.yepx-cta__desc p {
		text-align: center;
	}

	.yepx-cta__inner {
		flex-direction: column;
		align-items: center;
	}

	.yepx-cta__copy,
	.yepx-cta__desc,
	.yepx-cta__desc p {
		margin-inline: auto;
		width: 100%;
	}

	.yepx-cta--align-left .yepx-cta-actions,
	.yepx-cta--align-right .yepx-cta-actions,
	.yepx-cta--align-center .yepx-cta-actions,
	.yepx-cta-actions {
		justify-content: center;
		margin-inline: auto;
		width: 100%;
	}

	.yepx-cta .yepx-btn {
		width: 100%;
		justify-content: center;
	}

	.yepx-home-v2 .yepx-cta.yepx-cta--no-desc.yepx-section--cta,
	.yepx-cta.yepx-cta--no-desc.yepx-section--cta,
	.yepx-cta--no-desc {
		min-height: 0;
	}

	.yepx-cta--no-desc .yepx-cta__inner {
		gap: 1.25rem;
	}

	.yepx-cta--no-desc .yepx-cta__copy {
		flex: 0 0 auto;
		min-height: 0;
	}
}
