/** Shopify CDN: Minification failed

Line 16:9 Unexpected "{"
Line 16:18 Expected ":"
Line 16:25 Unexpected "{"
Line 17:13 Expected identifier but found whitespace
Line 17:15 Unexpected "{"
Line 17:24 Expected ":"
Line 17:53 Expected ":"
Line 18:16 Expected identifier but found whitespace
Line 18:18 Unexpected "{"
Line 18:27 Expected ":"
... and 37 more hidden warnings

**/
.custom-{{ section.id }} {
	padding-top: {{ section.settings.rn-padding-top }}px;
	padding-bottom: {{ section.settings.rn-padding-bottom }}px;
	background-color: {{ section.settings.c-bg-color }};
}
.page-width {}
.custom-progress *{
	letter-spacing: 0;
}
.custom-progress p{
	margin: 0;
}
.custom-progress {}
.custom-progress-div1 {
	display: flex;
	margin-bottom: 80px;
}
.custom-progress-div1-title {
	color: var(--main-color);
	font-family: var(--font-head-family);
	font-size: 40px;
	font-style: normal;
	font-weight: 400;
	line-height: 56px; /* 140% */
	letter-spacing: -1.6px;
	width: 56%;
}
.custom-progress-div1-text {
	color: var(--Gray);
	font-family: var(--font-body-family);
	font-size: 18px;
	font-style: normal;
	font-weight: 400;
	line-height: 25.2px; /* 140% */
	width: 49%;
}
.custom-progress-div2 {
	display: flex;
	gap: 48px;
}
.custom-progress-div2-content {
	width: 50%;
}
.custom-progress-div2-img {
	width: 100%;
	height: 387px;
	object-fit: contain;
}
.custom-progress-div2-text {
	color: var(--main-color);
	text-align: center;
	leading-trim: both;
	text-edge: cap;
	font-family: var(--font-body-family);
	font-size: 16px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
	margin-top: 48px;
}
.custom-progress-div2-bar-container {
	width: 50%;
    display: flex;
    flex-direction: column;
	justify-content: flex-end;
	position: relative;
}
.custom-progress-div2-bar-continer-spans {
	display: flex;
    justify-content: space-between;
    align-items: flex-end;
}
.custom-progress-div2-bar-continer-spans > span{
	color: var(--main-color);
	text-align: center;
	font-family: var(--font-body-family);
	font-size: 16px;
	font-style: normal;
	font-weight: 400;
	line-height: 22.4px; /* 140% */
	position: relative;
}
.custom-progress-div2-bar-continer-spans > span::before{
	content: '';
    position: absolute;
    height: 412px;
    width: 1px;
    background-color: none;
    border-right: 1px dashed #88B8C9;
    left: 50%;
    transform: translateX(-50%);
	bottom: 28px;
	opacity: 0.2;
}
.custom-progress-div2-bar1-div {
	position: absolute;
    left: 9px;
    top: 25%;
	z-index: 1;
	width: 100%;
}
.custom-progress-div2-bar1-title {
	color: var(--main-color);
	font-family: var(--font-body-family);
	font-size: 16px;
	font-style: normal;
	font-weight: 400;
	line-height: 22.4px; /* 140% */
	margin-bottom: 13px;
}
.custom-progress-div2-bar1 {
	{% if section.settings.r-bar1-img != blank %}
		background-image: url('{{ section.settings.r-bar1-img | img_url: '' }}');
		{% else %}
		background-color: rgb(216, 216, 216);
	{% endif %}
	height: 56px;
	width: 0%;
	display: block !important;
	transition: .5s ease-out;
}
.custom-progress-div2-bar1.active {
	width: {{ section.settings.rn-bar1 }}%;
}
.custom-progress-div2-bar2-div {
	position: absolute;
    left: 9px;
    bottom: 40px;
	z-index: 1;
	width: 100%;
}
.custom-progress-div2-bar2-title {
	color: var(--main-color);
	    font-family: var(--font-head-family);
	/* font-family: "Wulkan Display"; */
	font-size: 16px;
	font-style: italic;
	font-weight: 400;
	line-height: 22.4px; /* 140% */
	margin-bottom: 13px;
}
.custom-progress-div2-bar2 {
	height: 56px;
	width: 0%;
	background-color: var(--main-color);
	display: block !important;
	transition: .5s ease-out;
}
.custom-progress-div2-bar2.active {
	width: {{ section.settings.rn-bar2 }}%;
}



@media screen and (max-width: 768px) {
	.custom-{{ section.id }} {
		padding-top: {{ section.settings.rn-padding-top-mob }}px;
		padding-bottom: {{ section.settings.rn-padding-bottom-mob }}px;
	}
	.custom-progress-div2-text{
	font-size: 14px;}
	.custom-progress-div2-bar2.active {
		width: {{ section.settings.rn-bar2-mob }}%;
	}
	.custom-progress-div2-bar1.active {
		width: {{ section.settings.rn-bar1-mob }}%;
	}
	.custom-progress-div1 {
		margin-bottom: 40px;
		flex-direction: column;
	}
	.custom-progress-div1-title {
		font-size: 28px;
		font-style: normal;
		font-weight: 400;
		line-height: 40.8px; /* 140% */
		letter-spacing: -1.28px;
		width: 100%;
		margin-bottom: 12px;
	}
	.custom-progress-div1-text {
		font-size: 18px;
		font-style: normal;
		font-weight: 400;
		line-height: 25.2px; /* 140% */
		width: 100%;
	}
	.custom-progress-div2 {
		flex-direction: column;
		gap: 20px;
	}
	.custom-progress-div2-content {
		width: 100%;
	}
	.custom-progress-div2-img {
		height: 229px;
	}
	.custom-progress-div2-bar-container {
		width: 100%;
		height: 325px;
	}
	.custom-progress-div2-bar-continer-spans > span::before{
		height: 300px;
	}
	.custom-progress-div2-bar1-div {
		top: 20%;
	}
	.custom-progress-div2-bar2-div {
		bottom: 29px;
	}

}

/* ahsan bhai styling */
.cs_timeline-line::before {
  content: "";
  display: inline-block;
  width: 16px;
  height: 16px;
  background-size: contain;
  margin-right: 6px;
  position: absolute;
  left: -1px;
  top: -8px !important;
  width: 12px;
  height: 12px;
  border-radius: 1000px;
  z-index: 9999;
  background: #e1f3fa;
  transition: all 0.4s ease;
}

/* Desktop line animation - smooth color change from left to right */
.cs_timeline-line_des.animated-line {
  position: relative;
  
}

.cs_timeline-line_des.animated-line::after {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 0%;
  border-right: 1px solid rgba(243, 105, 174, 1);
  background: transparent;
  animation: lineGrowRight 1.2s ease-out forwards;
  z-index: 1;
}

@keyframes lineGrowRight {
  from {
    width: 0%;
  }
  to {
    width: 100%;
  }
}

/* Mobile line animation - smooth color change from top to bottom */
.cs_timeline-line_mbl.animated-line {
  position: relative;
  overflow: visible;
}

.cs_timeline-line_mbl.animated-line::after {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  height: 0%;
  border-bottom: 1px solid #F3D53D;
  background: transparent;
  animation: lineGrowDown 0.4s ease-out forwards;
  z-index: 1;
}

@keyframes lineGrowDown {
  from {
    height: 0%;
  }
  to {
    height: 100%;
  }
}

/* Animation classes for dot */
.cs_timeline-line.animated-dot {
   background: #F3D53D;
  border-color: #F3D53D;
  border-style: solid; 
}

.cs_timeline-line.animated-dot::before {
  background: #F3D53D;
  border-color: #F3D53D;
}

.new-ani{
  border: 1px solid #F3D53D;
   top: -7px;
}

.new-ani::before{
  background: #F3D53D;
  border: none;

}
  .custom-progress-div2-bar1-div {
    position: absolute;
    left: 9px;
    top: 20%;
    z-index: 1;
    width: 100%;
}

.custom-progress-div2-bar-container {
    width: 50%;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    position: relative;
    min-height: 300px;
    max-height: 320px;
    min-width: 400px;
    overflow: hidden;
}

@media (max-width:786px) {

 .custom-progress-div2-bar-container {	
	min-height: 300px;
	min-width:100% !important;
}
}