/* fkm-contact-strip — استایل ویجت (بارگذاری فقط هنگام استفاده) */
.ycs-strip {
	--_stripe: var(--ycs-stripe, #d6d6d6);
	--_phone: var(--ycs-phone, #64006f);
	--_phone-hover: var(--ycs-phone-hover, #007065);
	--_line: var(--ycs-line, #007065);
	width: 100%;
	text-align: center;
	direction: rtl;
}
.ycs-stripe-line {
	width: 100%;
	height: var(--ycs-stripe-h, 20px);
	opacity: var(--ycs-stripe-op, 0.9);
	background-image: repeating-linear-gradient(
		-45deg,
		transparent 0,
		transparent 4px,
		var(--_stripe) 4px,
		var(--_stripe) 8px
	);
}
.ycs-content {
	padding: 26px 14px 20px;
}
.ycs-intro {
	margin: 0 0 13px;
	color: #454b50;
	font-size: clamp(19px, 1.75vw, 25px);
	font-weight: 800;
	line-height: 1.55;
}
.ycs-support {
	margin: 0 0 10px;
	color: #006f63;
	font-size: clamp(19px, 1.8vw, 25px);
	font-weight: 900;
	line-height: 1.55;
}
.ycs-phone-wrap {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0 12px 15px;
}
.ycs-phone {
	direction: ltr;
	color: var(--_phone);
	font-size: clamp(27px, 2.35vw, 32px);
	font-weight: 900;
	line-height: 1;
	text-decoration: none;
	letter-spacing: 0.3px;
	transition: transform 0.25s ease, color 0.25s ease;
}
.ycs-phone:hover {
	color: var(--_phone-hover);
	transform: translateY(-1px);
}
.ycs-underline {
	position: absolute;
	right: 4px;
	left: 4px;
	bottom: 0;
	width: calc(100% - 8px);
	height: 14px;
	overflow: visible;
}
.ycs-underline path {
	fill: none;
	stroke: var(--_line);
	stroke-width: var(--ycs-line-w, 4);
	stroke-linecap: round;
	stroke-dasharray: 230;
	stroke-dashoffset: 230;
	animation: ycsDrawLine var(--ycs-line-speed, 2.4s) ease-in-out infinite;
}
@keyframes ycsDrawLine {
	0% {
		stroke-dashoffset: 230;
		opacity: 0.35;
	}
	45%,
	72% {
		stroke-dashoffset: 0;
		opacity: 1;
	}
	100% {
		stroke-dashoffset: -230;
		opacity: 0.35;
	}
}
@media (max-width: 640px) {
	.ycs-stripe-line { height: calc(var(--ycs-stripe-h, 20px) * 0.8); }
	.ycs-content { padding: 22px 4px 18px; }
}

/* حالت‌های داینامیک */
.ycs-once .ycs-underline path {
	animation: ycsDrawLineOnce var(--ycs-line-speed, 2.4s) ease-in-out 1 forwards;
}
@keyframes ycsDrawLineOnce {
	0% { stroke-dashoffset: 230; opacity: 0.35; }
	45%, 72% { stroke-dashoffset: 0; opacity: 1; }
	100% { stroke-dashoffset: 0; opacity: 1; }
}
