/* fkm-steps — استایل ویجت (بارگذاری فقط هنگام استفاده) */
.yst-section {
	--_bg: var(--yst-bg, #ececec);
	--_dark: var(--yst-sh-dark, #c8c8c8);
	--_light: var(--yst-sh-light, #ffffff);
	width: 100%;
	direction: rtl;
}
.yst-section-title {
	font-size: 42px;
	font-weight: 800;
	color: #1a1a1a;
	text-align: center;
	margin: 0 0 70px;
	text-shadow: 1px 1px 2px rgba(255,255,255,0.8);
}
.yst-wrapper {
	position: relative;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 50px;
	align-items: start;
	padding-top: 30px;
}
.yst-card {
	background: var(--_bg);
	border-radius: var(--yst-radius, 45px);
	padding: 50px 35px 40px;
	box-shadow:
		10px 10px 20px var(--_dark),
		-10px -10px 20px var(--_light);
	text-align: center;
	position: relative;
	z-index: 2;
	transition: all 0.4s ease;
}
.yst-lift .yst-card:hover {
	transform: translateY(-8px);
	box-shadow:
		15px 15px 30px var(--_dark),
		-15px -15px 30px var(--_light);
}
.yst-stair .yst-card.yst-offset { transform: translateY(50px); }
.yst-stair.yst-lift .yst-card.yst-offset:hover { transform: translateY(42px); }
.yst-number {
	position: absolute;
	top: calc(var(--yst-num-size, 75px) / -2.5);
	left: 50%;
	transform: translateX(-50%);
	width: var(--yst-num-size, 75px);
	height: var(--yst-num-size, 75px);
	border-radius: calc(var(--yst-num-size, 75px) * 0.29);
	background: var(--_bg);
	box-shadow:
		8px 8px 16px var(--_dark),
		-8px -8px 16px var(--_light);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: calc(var(--yst-num-size, 75px) * 0.69);
	font-weight: 800;
	color: var(--yst-accent, #0f6b5c);
	z-index: 3;
}
.yst-icon {
	width: var(--yst-icon-size, 100px);
	height: var(--yst-icon-size, 100px);
	margin: 30px auto 25px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--yst-accent, #0f6b5c);
	font-size: calc(var(--yst-icon-size, 100px) * 0.7);
}
.yst-icon svg {
	width: 100%;
	height: 100%;
}
.yst-icon img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}
.yst-title {
	font-size: 24px;
	font-weight: 700;
	color: #1a1a1a;
	margin: 0 0 22px;
	line-height: 1.5;
}
.yst-desc {
	font-size: 16px;
	color: #555;
	line-height: 2.1;
	margin: 0;
}
/* ── ریسپانسیو ── */
@media (max-width: 1000px) {
	.yst-stair .yst-card.yst-offset { transform: none; }
	.yst-stair.yst-lift .yst-card.yst-offset:hover { transform: translateY(-8px); }
}
@media (max-width: 600px) {
	.yst-section-title {
		font-size: 28px;
		margin-bottom: 60px;
	}
	.yst-card { padding: 45px 25px 35px; }
	.yst-icon { margin: 25px auto 20px; }
	.yst-title { font-size: 20px; }
	.yst-desc {
		font-size: 14px;
		line-height: 2;
	}
}