/**************************************
***********SERVICES HOME***************
***************************************
1.SERVICES HOME POSTS
**************************************/



/**************************************
**********SERVICES HOME POSTS**********
***************************************/




@media (min-width: 1024px) {

	.home-services {
		position: relative;
		
	}

	.home-services-inner {
		position: relative;
		overflow: hidden;
		transition: width .5s;
	}

	.home-services-flex {
		position: relative;
		height: calc(100vh - 100px);
		min-height: 620px;
		padding-top: 90px;
		width:fit-content;

		display: flex;
		align-items: center;
	}
	
	@media (min-width: 1560px) {

		.home-services-section-text {
			padding-left: calc( (100vw - 1560px) / 2);
			min-width: 860px;
		}

		.home-services-section-text-inner {
			height: 600px;
			background-color: #f6f6f8;
			border-bottom-left-radius: 20px;
	
			display: flex;
			align-items: flex-start;
			flex-shrink:0;
		}

	}

	@media (min-width: 1024px) and (max-width: 1559px) {

		.home-services-section-text {
			padding-left: 20px;
			min-width: 860px;
		}

		.home-services-section-text-inner {
			height: 600px;
			background-color: #f6f6f8;
			border-bottom-left-radius: 20px;
	
			display: flex;
			align-items: flex-start;
			flex-shrink:0;
		}

	}


	.home-services-section-title {
		position: relative;
		margin: 0;
		padding: 0 0 10px 20px;
		max-width: 860px;
		background-color: #fff;
		border-bottom-right-radius: 20px;
		
		flex: 1 1 auto;
		display: inline-flex;
		flex-flow: row wrap;
		row-gap:20px;
		
	}

	.home-services-section-title::before {
		position: absolute;
		content: "";
		bottom: -20px;
		left: 0;
		transform: rotate(-180deg);
		background: transparent;
		width: 20px;
		height: 20px;
		border-bottom-right-radius: 20px;
		box-shadow: 5px 5px 0 5px #fff;
	}


	.home-services-section-title-part {
		height: 80px;
		overflow: hidden;

		white-space: normal;
		display: inline-flex;
		flex-flow: row wrap;
		gap:20px;
	}

	
	.home-services-section-title-part span {
		font-family: 'Gotham Pro';
		font-size: 70px;
		color: rgba(35, 55, 72, .2);
		letter-spacing: 0px;
		font-weight: 900;
		line-height: 1;
	}


	.home-services-section-title .__green {
		color: rgba(0, 167, 157, 1);
		font-weight: 900;
	}

	.home-services-section-title .__dark {
		color: rgba(75, 75, 75, 1);
		font-weight: 300;
	}





	.home-services-conteiner-content {
		position: relative;
		padding:  30px 120px 30px 40px;
		background-color: #f6f6f8;
		border-top-left-radius: 20px;
	}


	.home-services-conteiner-list {
		display: flex;
	}


	.home-service-accordion {
		position: relative;
		margin: 0;
		padding: 0;
		width: 140px;
		height: 540px;
		background-color: #fff;
		display: flex;
		overflow: hidden;
		transition: width .5s ease-in-out;
	}

	.home-service-accordion.active {
		width: 620px;
		transition: width .5s ease-in-out;
	}

	.home-service-accordion.first {
		border-radius: 20px 0 0 0;
	}

	.home-service-accordion.last {
		border-radius: 0 0 20px 0;
	}

	.home-service-accordion::before {
		content:"";
		position: absolute;
		top:0;
		bottom: 0;
		left: 0;
		right: 0;
		border-left:1px solid rgba(215, 215, 215, .7);
		border-top:1px solid rgba(215, 215, 215, .5);
		border-bottom:1px solid rgba(215, 215, 215, .5);
	}

	.home-service-accordion.first::before {
		border-radius: 20px 0 0 0;
		border-left:1px solid rgba(215, 215, 215, .5);
	}

	.home-service-accordion.last::before {
		border-right:1px solid rgba(215, 215, 215, .7);
		border-radius: 0 0 20px 0;
	}


	.home-service-accordion-title {
		position: relative;
		transform: rotateY(180deg) rotateX(180deg);
		padding: 20px 0;
		min-width: 140px;

		display: flex;
		flex-flow: column nowrap;
		justify-content: space-between;
		align-items: center;
	}



	.home-service-accordion-title-text  {
		position: relative;
		margin: 0;
		padding: 0 ;

		font-family: 'Gotham Pro';
		font-size: 22px;
		line-height: 1.6;
		letter-spacing: 1.5px;
		font-weight: 700;
		color: #233748;
		white-space: nowrap;
		writing-mode: vertical-rl;
	}

	.home-service-accordion-btn {
		position: relative;
		width: 42px;
		height: 42px;
		background-color: rgba(0, 167, 157, 1);
		border-radius: 50%;
		overflow: hidden;
		transition: transform .3s;
				
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.home-service-accordion-btn::before {
		content:"+";
		position: relative;
		color: #fff;
		font-size: 26px;
		line-height: 1;
		font-weight: 900;
	}

	.home-service-accordion.active .home-service-accordion-btn {
		transform: rotate(45deg);
		transition: transform .3s;
	}



	.home-service-accordion-description {
		position: absolute;
		top:0;
		bottom:0;
		left: 140px;
		padding:0;
		margin: 0;		
		width: 480px;
		height: 540px;

		overflow: hidden;
	}




	.home-service-accordion-subtitle {
		width: 460px;
		margin: 0;
		padding: 10px 20px 0 0;
		font-family: 'Gotham Pro';
		font-weight: 500;
		font-size: 18px;
		line-height: 1.8;
		color: #233748;
		letter-spacing: 1px;
	}

	.home-service-accordion-text {
		width: 460px;
		padding: 20px 20px 20px 0;
		font-family: 'Gotham Pro';
		font-weight: 300;
		font-size: 17px;
		line-height: 1.8;
		color: #4B4B4B;
		letter-spacing: 1px;
	}



	.home-section-service-btn-conteiner {
		position: relative;
		padding-right: calc( 50vw - 80px - 480px );		
	}

	.home-section-service-btn-conteiner-bg {
		background-color: #f6f6f8;
		height: 600px;
		border-top-right-radius: 20px;
		margin-right: 480px;

		display: flex;
		align-items: flex-end;
	}


	.home-section-service-btn-wrap {
		position: relative;
		background-color: #fff;
		padding: 40px 0 0 40px;
		border-top-left-radius: 120px;
	}

	.home-section-service-btn-wrap::before {
		position: absolute;
		content: "";
		bottom: 0;
		left: -20px;
		background: transparent;
		width: 20px;
		height: 20px;
		border-bottom-right-radius: 20px;
		box-shadow: 5px 5px 0 5px #fff;
		z-index: 2;
	}

	.home-section-service-btn-wrap::after {
		position: absolute;
		content: "";
		top: -20px;
		right: 0;
		background: transparent;
		width: 20px;
		height: 20px;
		border-bottom-right-radius: 20px;
		box-shadow: 5px 5px 0 5px #fff;
		z-index: 2;
	}


}






@media (min-width: 640px) and (max-width: 1023px) {

	.home-services {
		position: relative;
		padding: 120px 0 60px 0;
	}

	.home-services-inner {
		position: relative;
		width: 100%;
		overflow: hidden;
	}

	.home-services-flex {
		position: relative;
		display: flex;
		flex-direction: column;
	}

	.home-services-section-text {
	
	}

	.home-services-section-text-inner {
		background-color: #f6f6f8;
		border-bottom-left-radius: 20px;

		display: flex;
		align-items: flex-start;
		flex-shrink:0;
	}


	.home-services-section-title {
		position: relative;
		margin: 0;
		padding: 0 20px 10px 20px;
		background-color: #fff;
		border-bottom-right-radius: 20px;
		
		flex: 1 1 auto;
		display: inline-flex;
		flex-flow: row wrap;
		row-gap:20px;
		
	}


	.home-services-section-title-part {

		display: inline-flex;
		flex-flow: row wrap;
		gap:20px;
	}

	
	.home-services-section-title-part span {
		font-family: 'Gotham Pro';
		font-size: 60px;
		color: rgba(35, 55, 72, .2);
		letter-spacing: 0px;
		font-weight: 900;
		line-height: 1;
	}


	.home-services-section-title .__green {
		color: rgba(0, 167, 157, 1);
		font-weight: 900;
	}

	.home-services-section-title .__dark {
		color: rgba(75, 75, 75, 1);
		font-weight: 300;
	}





	.home-services-conteiner-content {
		position: relative;
		margin: 60px 20px 60px 20px;
		padding: 20px;
		background-color: #f6f6f8;
		border-radius: 20px;
		box-shadow: 0 20px 40px -14px rgba(0, 0, 0, 0.25);
	}


	.home-services-conteiner-list {
		display: flex;
		flex-direction: column;
		border:1px solid rgba(215, 215, 215, .7);
		border-radius:20px;
		overflow: hidden;
	}


	.home-service-accordion {		
		position: relative;
		display: flex;
		flex-direction: column;
		background-color: #fff;
	}

	.home-service-accordion::before {
		content:"";
		position: absolute;
		left:0;
		right: 0;
		bottom: 0;
		height: 1px;
		background-color: rgba(215, 215, 215, .7);
	}

	.home-service-accordion.last::before {
		display: none;
	}

	.home-service-accordion.first {
		border-radius: 20px 20px 0 0;
	}

	.home-service-accordion.last {
		border-radius: 0 0 20px 20px;
	}



	.home-service-accordion-title {
		position: relative;
		padding: 20px;

		display: flex;

		justify-content: space-between;
		align-items: center;
	}



	.home-service-accordion-title-text  {
		position: relative;
		margin: 0;
		padding: 0 ;

		font-family: 'Gotham Pro';
		font-size: 22px;
		line-height: 1.6;
		letter-spacing: 1.5px;
		font-weight: 700;
		color: #233748;
	}

	.home-service-accordion-btn {
		position: relative;
		width: 42px;
		height: 42px;
		background-color: rgba(0, 167, 157, 1);
		border-radius: 50%;
		overflow: hidden;

		display: flex;
		justify-content: center;
		align-items: center;
	}

	.home-service-accordion-btn::before {
		content:"+";
		position: relative;
		color: #fff;
		font-size: 26px;
		line-height: 1;
		font-weight: 900;
	}


	.home-service-accordion .home-service-accordion-btn {
		transform: rotate(0);
		transition: transform .3s;
	}

	.home-service-accordion.active .home-service-accordion-btn {
		transform: rotate(135deg);
		transition: transform .3s;
	}




	.home-service-accordion-description {
		position: relative;
		padding:0;
		margin: 0;		
		overflow: hidden;
		display: none;
	}


	.home-service-accordion.active .home-service-accordion-description {
		display:block;
		padding: 20px;
	}


	.home-service-accordion-subtitle {
		margin: 0;
		padding: 10px 20px 0 0;
		font-family: 'Gotham Pro';
		font-weight: 500;
		font-size: 18px;
		line-height: 1.8;
		color: #233748;
		letter-spacing: 1px;
	}

	.home-service-accordion-text {
		padding: 20px 20px 20px 0;
		font-family: 'Gotham Pro';
		font-weight: 300;
		font-size: 17px;
		line-height: 1.8;
		color: #4B4B4B;
		letter-spacing: 1px;
	}


	.home-section-service-btn-conteiner {
		position: relative;
		display: flex;
		align-content: center;
		justify-content: center;
			
	}

	.home-section-service-btn-conteiner-bg {


	}


	.home-section-service-btn-wrap {
		position: relative;
		background-color: #fff;
		padding: 0 20px;
	}





}












@media  (max-width: 639px) {

	.home-services {
		position: relative;
		padding: 120px 0 60px 0;
	}

	.home-services-inner {
		position: relative;
		width: 100%;
		overflow: hidden;
	}

	.home-services-flex {
		position: relative;
		display: flex;
		flex-direction: column;
	}

	.home-services-section-text {
	
	}

	.home-services-section-text-inner {
		background-color: #f6f6f8;
		border-bottom-left-radius: 20px;

		display: flex;
		align-items: flex-start;
		flex-shrink:0;
	}


	.home-services-section-title {
		position: relative;
		margin: 0;
		padding: 0 20px 10px 20px;
		background-color: #fff;
		border-bottom-right-radius: 20px;
		
		flex: 1 1 auto;
		display: inline-flex;
		flex-flow: row wrap;
		row-gap:20px;
		
	}


	.home-services-section-title-part {

		display: inline-flex;
		flex-flow: row wrap;
		gap:20px;
	}

	
	.home-services-section-title-part span {
		font-family: 'Gotham Pro';
		font-size: 42px;
		color: rgba(35, 55, 72, .2);
		letter-spacing: 0px;
		font-weight: 900;
		line-height: 1;
	}


	.home-services-section-title .__green {
		color: rgba(0, 167, 157, 1);
		font-weight: 900;
	}

	.home-services-section-title .__dark {
		color: rgba(75, 75, 75, 1);
		font-weight: 300;
	}





	.home-services-conteiner-content {
		position: relative;
		margin: 20px 10px 40px 10px;
		padding: 15px 10px 15px 10px;
		background-color: #f6f6f8;
		border-radius: 10px;
		box-shadow: 0 20px 40px -14px rgba(0, 0, 0, 0.25);
	}


	.home-services-conteiner-list {
		display: flex;
		flex-direction: column;
		border:1px solid rgba(215, 215, 215, .7);
		border-radius:10px;
		overflow: hidden;
	}


	.home-service-accordion {		
		position: relative;
		display: flex;
		flex-direction: column;
		background-color: #fff;
	}

	.home-service-accordion::before {
		content:"";
		position: absolute;
		left:0;
		right: 0;
		bottom: 0;
		height: 1px;
		background-color: rgba(215, 215, 215, .7);
	}

	.home-service-accordion.last::before {
		display:none;
	}

	.home-service-accordion.first {
		border-radius: 10px 10px 0 0;
	}

	.home-service-accordion.last {
		border-radius: 0 0 10px 10px;
	}



	.home-service-accordion-title {
		position: relative;
		padding: 20px 10px;

		display: flex;

		justify-content: space-between;
		align-items: center;
	}



	.home-service-accordion-title-text  {
		position: relative;
		margin: 0;
		padding: 0 ;

		font-family: 'Gotham Pro';
		font-size: 18px;
		line-height: 1.4;
		letter-spacing: 1.5px;
		font-weight: 700;
		color: #233748;
	}

	.home-service-accordion-btn {
		position: relative;
		min-width: 32px;
		height: 32px;
		background-color: rgba(0, 167, 157, 1);
		border-radius: 50%;
		overflow: hidden;

		display: flex;
		justify-content: center;
		align-items: center;
	}

	.home-service-accordion-btn::before {
		content:"+";
		position: relative;
		color: #fff;
		font-size: 20px;
		padding-bottom: 2px;
		font-weight: 700;
	}


	.home-service-accordion .home-service-accordion-btn {
		transform: rotate(0);
		transition: transform .3s;
	}

	.home-service-accordion.active .home-service-accordion-btn {
		transform: rotate(135deg);
		transition: transform .3s;
	}



	.home-service-accordion-description {
		position: relative;
		padding:0;
		margin: 0;		
		overflow: hidden;
		display: none;
	}


	.home-service-accordion.active .home-service-accordion-description {
		display:block;
		padding: 20px 10px;
	}


	.home-service-accordion-subtitle {
		margin: 0;
		padding: 0;
		font-family: 'Gotham Pro';
		font-weight: 500;
		font-size: 16px;
		line-height: 1.8;
		color: #233748;
		letter-spacing: 1px;
	}

	.home-service-accordion-text {
		padding: 20px 0 20px 0;
		font-family: 'Gotham Pro';
		font-weight: 300;
		font-size: 16px;
		line-height: 1.8;
		color: #4B4B4B;
		letter-spacing: 1px;
	}


	.home-section-service-btn-conteiner {
		position: relative;
		display: flex;
		align-content: center;
		justify-content: center;
			
	}

	.home-section-service-btn-conteiner-bg {


	}


	.home-section-service-btn-wrap {
		position: relative;
		background-color: #fff;
		padding: 40px 20px;
	}



}