#ep-spacer {
	height: auto !important;
}

#ep-pin {
	position: relative !important;
	/* sticky nahi */
	height: auto !important;
	overflow: visible !important;
}

.ep-wrap {
	display: flex;
	gap: 56px;
	max-width: 100%;
	width: 100%;
	margin: 0 auto;
	align-items: center;
}

/* LEFT — only paragraph */
.ep-left {
	width: 48%;
	position: sticky;
	top: 40%;
	transform: translateY(-50%);
	align-self: flex-start;
}

.ep-para {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	font-family: "Plus Jakarta Sans", sans-serif;
	font-size: 16px;
	color: #393838;
	line-height: 120%;
	opacity: 0;
	transform: translateY(14px);
	transition: opacity 0.5s ease, transform 0.5s ease;
	pointer-events: none;
	padding: 0 10%;
}

.ep-para.active {
	opacity: 1;
	transform: translateY(0);
	pointer-events: auto
}

.ep-para.exit {
	opacity: 0;
	transform: translateY(-14px);
	transition: opacity 0.35s ease, transform 0.35s ease
}

/* RIGHT */
.ep-right {
	width: 50%;
	height: auto !important;
	overflow: visible !important;
	mask-image: none !important;
	-webkit-mask-image: none !important;
}

#ep-track {
	transform: none !important;
	transition: none !important;
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.ep-card {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 15px;
	padding: 32px 32px;
	border-radius: 32px 0 32px 32px;
	background: linear-gradient(135deg, #38469D 0%, #376DB1 100%);
	border: 2px solid #DBE5EA;
	opacity: 0.45;
	transition: border-color 0.45s, opacity 0.45s;
	flex-shrink: 0;
}

.ep-card.active {
	border-color: rgba(255, 255, 255, 0.42);
	opacity: 1
}

.ep-card-title-wrap h5 {
	font-family: "Gilory Font Family", Sans-serif;
	font-size: 22px;
	font-weight: 500;
	color: #fff
}

.ep-card-title-wrap p {
	font-family: "Plus Jakarta Sans", sans-serif;
	font-size: 16px;
	color: #ffffff;
	line-height: 120%;
	margin-bottom: 0px;
	display: none;
}

.ep-icon {
	width: 64px;
	height: 64px;
	background: #ffffff;
	border-radius: 16px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	border-color: #AACCDB;
	border-style: solid;
	border-width: 1px;
	padding: 10px 10px;
}

.ep-icon svg {
	width: 20px;
	height: 20px;
	stroke: #fff;
	fill: none;
	stroke-width: 1.8;
	stroke-linecap: round;
	stroke-linejoin: round
}

@media(max-width:1024px) {
	.ep-card {
		padding: 22px 22px;
	}

	.ep-card-title-wrap h5 {
		font-size: 18px;
	}

	.ep-card-title-wrap p {
		font-size: 14px;
	}
}

@media(max-width:767px) {
	#ep-spacer {
		height: auto !important
	}

	#ep-pin {
		position: relative;
		height: auto;
		overflow: visible
	}

	.ep-progress-bar {
		display: none
	}

	.ep-wrap {
		flex-direction: column;
		gap: 24px;
		padding: 40px 0px
	}

	.ep-left {
		width: 100%;
		display: none;
	}

	.ep-right {
		width: 100%;
		overflow: visible;
		mask-image: none;
		-webkit-mask-image: none
	}

	#ep-track {
		transform: none !important;
		transition: none;
		gap: 14px
	}

	.ep-card {
		opacity: 1 !important
	}

	.ep-para {
		position: relative;
		opacity: 1 !important;
		transform: none !important;
		display: none;
		transition: none
	}

	.ep-para.active {
		display: block
	}

	.ep-card-title-wrap p {
		display: block;
	}
}