/*
font-family: "Roboto", sans-serif;
font-family: "Work Sans", sans-serif;
*/

/*General*/
*{margin: 0; padding:0; box-sizing:border-box; outline: none;}
html {scroll-behavior: smooth;}
body{padding: 0; margin:0; font-family: "Inter", sans-serif; font-size: 16px; line-height: 26px; color: #232323;}
.container{max-width: 1320px; width: 100%; margin: 0 auto; padding: 0 15px}
a{transition: 400ms all; text-decoration: none}
img{display: block; max-width: 100%}
p{margin: 0 0 20px}
p:last-child{margin-bottom: 0px;}

h2{font-size: 48px; line-height: 48px; color: #1b315e; font-weight: 600; margin-bottom: 28px}
.text-center{text-align: center;}

.theme-btn {font-size: 16px; font-weight: 600; color: #000; border: 1px solid #ccc; border-radius: 5px; padding: 13px 54px 13px 24px; display: inline-block; background-image: url(images/right-arrow.svg); background-repeat: no-repeat; background-position: 85%; background-size: 14px; transition: all 400ms}
.theme-btn:hover{padding-right: 60px; border-color:#FBA81E}
.theme-btn-2{font-size: 16px; font-weight: 600; background: #FBA81E; color: #fff; border: 1px solid #FBA81E; border-radius: 5px; padding: 13px 25px 13px 25px; display: inline-block; transition: all 400ms}
.theme-btn-2:hover{color: #FBA81E; background: transparent;}

.heading {position: relative; padding-bottom: 25px;}
.heading::after {content: ''; width: 140px; height: 5px; background: #fba81e; position: absolute; bottom: 0px; left: 0; border-radius: 50px; }
.heading.center::after{left: 50%; transform: translate(-50%);}

/*Main Header*/
.site-header{padding: 20px 0; transition: 400ms all; position: fixed; top: 0; left: 0; background: #1b315e; width: 100%; z-index: 99}
.site-header.fixed{box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .2); padding: 13px 0}
.site-header .inner{display: flex; justify-content: space-between; align-items: center;}
.site-header .inner .logo{}
.site-header .inner .menu ul{display: flex; list-style: none; align-items: center; column-gap: 10px}
.site-header .inner .menu ul li a{font-size: 16px; color: #fff; padding: 12px 20px; border-radius: 5px; font-weight: 500; line-height: normal;}
.site-header .inner .menu ul li a:hover, .site-header .inner .menu ul li.header-btn a, .site-header .inner .menu ul li.active a{background-color: #FBA81E; color: #fff}

.site-header .inner .menu {display: flex; align-items: center; }
.mobile-menu {display: none !important; width: 42px; height: 42px; background: transparent; border: none; display: flex; justify-content: center; align-items: flex-end; row-gap: 6px; flex-direction: column; }
.mobile-menu span{width: 36px; height: 3px; border-radius: 10px; background: #FBA81E; display: inline-block;}
.mobile-menu span:nth-child(2){width: 30px}

/*Main Footer*/
.main-footer{background: #1b2853; padding: 180px 0 80px; width: 100%; display: flex; color: #fff}
.main-footer .inner {display: flex; column-gap: 30px; width: 100%; align-items: center;}
.main-footer .inner .col{width: 100%}
.main-footer .inner .col.footer-menu ul{display: flex; list-style: none; align-items: center; column-gap: 26px}
.main-footer .inner .col.footer-menu ul li a{font-size: 16px; position: relative; color: #fff;  font-weight: 400; line-height: normal;}
.main-footer .inner .col.footer-menu ul li a::before{content:''; position: absolute; left: 0; bottom: -5px; width: 0%; transition: 400ms all; height: 2px; background: #fff}
.main-footer .inner .col.footer-menu ul li a:hover::before{width: 100%}
.main-footer .inner .col.copyright p{text-align: right; font-weight: 400; font-size: 16px;}

/*Middle Section*/
.hero-section{padding: 150px 0 60px; width: 100%; display: flex;}
.hero-section .inner{display: flex; column-gap: 150px; justify-content: space-between; align-items: center;}
.hero-section .inner .left-box, .hero-section .inner .right-box{width: 100%}
.hero-section .inner .left-box{color: #232323;}
.hero-section .inner .left-box h1{font-size: 44px; line-height: 56px; font-weight: 600; color: rgb(38, 50, 56); margin-bottom: 20px}
.hero-section .inner .left-box .form {margin-top: 20px; font-size: 14px; }
.hero-section .inner .left-box .form form {display: flex; max-width: 500px; column-gap: 15px; align-items: flex-end;}
.hero-section .inner .left-box .form form .group {width: 100%; display: flex; flex-direction: column; color: #000; font-size: 16px; letter-spacing: 0; font-weight: 500; row-gap: 5px; }
.hero-section .inner .left-box .form form .group input {height: 44px; border: 1px solid #d7d4d4; border-radius: 5px; padding: 0 20px; font-size: 14px; }
.hero-section .inner .left-box .form form .action input {height: 44px; border: 1px solid #fba81e; cursor: pointer; border-radius: 5px; padding: 0 20px; font-size: 16px; background: #fba81e; color: #fff; font-weight: 600; text-transform: uppercase; font-family: "Roboto", sans-serif; }
.hero-section .inner .left-box .form a{color: #232323; text-decoration: underline;}
.hero-section .inner .left-box .form a:hover{color: #fba81e}
.hero-section .inner .right-box img{width: 100%}

.process-section {background: #f0f1f3; padding: 80px 0}
.process-section .inner {display: flex; column-gap: 150px; align-items: center;}
.process-section .inner .left-box{width: 49%}
.process-section .inner .right-box {display: flex; column-gap: 30px; row-gap: 30px; flex-wrap: wrap; width: 65%; align-items: flex-start;} 
.process-section .inner .right-box .box-list {font-size: 16px; line-height: 24px; transition: all 400ms; color: #232323; padding: 32px; background: #fff; display: flex; flex-direction: column; justify-content: flex-start; width: calc(50% - 15px); border-radius: 15px; }
.process-section .inner .right-box .box-list img {width: 72px; height: 72px; background: rgb(251 168 30 / 28%); border-radius: 9px; padding: 18px; margin-bottom: 23px; }
.process-section .inner .right-box .box-list h3 {font-size: 20px; line-height: 28px; font-weight: 600; color: #1b315e; margin-bottom: 10px; }
.process-section .inner .right-box .box-list:nth-child(2){margin-top: 20px}
.process-section .inner .right-box .box-list:nth-child(3){margin-top: -43px}
.process-section .inner .right-box .box-list:hover{box-shadow: 0 25px 25px #00000026;}
.process-section .inner .right-box .box-list:hover img{background: #FBA81E}

.about-section{padding: 40px 0 90px}
.about-section .inner{box-shadow: 0 10px 25px #00000026; border-radius: 20px; padding: 70px 120px; display: flex; column-gap: 120px; align-items: center; background: #ffffff; background: radial-gradient(circle,rgba(255, 255, 255, 1) 28%, rgba(251, 168, 30, 0.17) 100%);}
.about-section .inner .left-box{width: 48%}
.about-section .inner .left-box img{border-radius: 15px}
.about-section .inner .right-box {width: 52%; }
.about-section .inner .right-box h2 {font-size: 34px; }

.service-section{padding: 100px 0;}
.service-section .title-bar{text-align: center;}
.service-section .title-bar p {max-width: 600px; margin: 0 auto;}
.service-section .service-list{justify-content: space-between; flex-wrap: wrap; margin: 40px 0; display: flex; column-gap: 30px; row-gap: 30px}
.service-section .service-list .list {width: calc(33.33% - 21.5px); overflow: hidden; border: 1px solid #ebe6b7; border-radius: 10px; transition: all 400ms}
.service-section .service-list .list:hover{box-shadow: 0 25px 25px #00000026;}
.service-section .service-list .list img{width: 100%; height: 240px; object-fit: cover;}
.service-section .service-list .list .content-box h3{font-size: 20px; line-height: 28px; font-weight: 600; color: #1b315e; margin-bottom: 10px;}
.service-section .service-list .list .content-box {padding: 32px; font-size: 14px; color: #232323; line-height: 20px; }
.service-section .button-box{text-align: center; margin-top: 20px; width: 100%; display: inline-block;}

.what-do-section{padding: 90px 0; background: #f1f1f1;}
.what-do-section .inner{display: flex; column-gap: 140px; align-items: center; flex-direction: column; row-gap:40px;}
.what-do-section .inner .left-box, .what-do-section .inner .right-box{width: 100%}
.what-do-section .inner .left-box{color: #232323; text-align: center;}
.what-do-section .inner .right-box {display: flex; row-gap: 30px; flex-wrap: wrap; column-gap: 30px; }
.what-do-section .inner .right-box .list{font-size: 16px; width: calc(50% - 15px); line-height: 24px; color: #364153; position: relative; background: #fff; border-radius: 5px; overflow: hidden; padding: 32px}
.what-do-section .inner .right-box .list:before{content: ''; width: 0px; height: 100%; transition: 400ms all; position: absolute; left: 0; top: 0; background: #FBA81E}
.what-do-section .inner .right-box .list:hover{box-shadow: 0 25px 25px #00000026;}
.what-do-section .inner .right-box .list:hover:before{width: 5px}
.what-do-section .inner .right-box .list h3{font-size: 24px; line-height: 32px; font-weight: 600; color: #1b315e; margin-bottom: 10px;}

.owl-stage {display: inline-flex; }
.happy-client{padding: 100px 0; overflow: hidden;}
.happy-client .title-bar{text-align: center;}
.happy-client .title-bar p {max-width: 600px; margin: 0 auto;}
.client-slider{margin: 60px 0 40px}
.client-slider .owl-nav, .client-slider .owl-dots { display: none !important; }
.client-slider .owl-stage {transition-timing-function: linear !important; -webkit-transition-timing-function: linear !important; align-items: center;}
.client-slider .owl-item {display: flex; justify-content: center; align-items: center; padding: 0 30px}
.client-slider .owl-prev, .client-slider .owl-next { display: none !important; }

.testimonail-section{padding: 80px 0 80px; overflow: hidden;}
.testimonail-section .container{max-width: 890px}
.testimonail-section .inner{overflow: hidden;}
.testimonail-section .title-bar{text-align: center; margin-bottom: 35px}
.testimonial-slider .owl-prev, .testimonial-slider .owl-next { display: none !important; }
.testimonial-slider .item {text-align: center; display: flex; flex-direction: column; row-gap: 30px; padding: 0 20px}
.testimonial-slider .item .sub-text {color: rgb(135, 144, 157); max-width: 577px; margin: 0 auto 20px; }
.testimonial-slider .item .main-text {color: #18181b; font-weight: 500}
.testimonial-slider .item .main-text::before{content: '“';}
.testimonial-slider .item .main-text::after{content: '”';}
.testimonial-slider .item .author-info {font-size: 16px; line-height: 24px; color: #18181b; }
.testimonial-slider .item .author-info h4{color: #18181b; font-size: 18px; font-weight: 500; margin-bottom: 5px}
.testimonial-slider .owl-dots {display: flex; margin-top: 50px; justify-content: center; column-gap: 8px; }
.testimonial-slider .owl-dots .owl-dot {background-color: #717377; width: 8px; height: 8px; border-radius: 50px; opacity: 0.2; transition: .4s;}
.testimonial-slider .owl-dots .owl-dot.active {background-color: #FBA81E !important; width: 30px; height: 8px; border-radius: 100px;  opacity: 1; }

.contact-section{padding: 10px 0 0px; margin-bottom: -100px; position: relative;}
.contact-section .inner{box-shadow: 0 10px 25px #00000026; border-radius: 20px; padding: 50px 90px; display: flex; column-gap: 120px; align-items: center; background: #ffffff; }
.contact-section .inner .left-box{width: 100%; color: #232323; text-align: center;}
.contact-section .inner .left-box h2{font-size: 35px; line-height: 53px; color: rgb(19, 34, 56); margin-bottom: 15px}
.contact-section .inner .left-box .contact-detail {display: flex; flex-wrap: wrap; column-gap: 30px; row-gap: 20px; margin: 20px 0;}
.contact-section .inner .left-box .contact-detail .item {display: flex; width: calc(50% - 15px); align-items: center; column-gap: 20px; padding: 20px; text-align: left;}
.contact-section .inner .left-box .contact-detail .item:hover{box-shadow: 0 7px 25px #00000015; border-radius: 5px}
.contact-section .inner .left-box .contact-detail .item .icon {min-width: 48px; min-height: 48px; padding: 0 10px; display: flex; align-items: center; justify-content: center; background: rgb(251 168 30 / 28%); border-radius: 4px; max-width: 48px; max-height: 48px; }
.contact-section .inner .left-box .contact-detail .item .icon img {width: 22px; }
.contact-section .inner .left-box .contact-detail .item .text {color: rgb(19, 34, 56); font-size: 14px; display: flex; flex-direction: column; line-height: 20px; font-weight: 600; }
.contact-section .inner .left-box .contact-detail .item .text label{font-weight: 400}
.contact-section .inner .left-box .contact-detail .item .text a{color: rgb(19, 34, 56);}
.contact-section .inner .left-box .contact-detail .item .text a:hover, .contact-section .inner .left-box .contact-detail .item:hover .text a{color: #FBA81E;}
.contact-section .inner .left-box .social-icon {display: flex; column-gap: 10px; justify-content: center; margin-top: 50px; align-items: center;}
.contact-section .inner .left-box .social-icon a{width: 48px; height: 48px; border-radius: 100px; display: flex; align-items: center; justify-content: center; border:1px solid #FBA81E}
.contact-section .inner .left-box .social-icon a img{height: 22px}


.client-section{padding: 80px 0; background: #1b2853}
.client-section .container .inner {display: flex; column-gap: 30px; row-gap: 20px; color: #fff; align-items: center;}
.client-section .container .inner .left-box, .client-section .container .inner .button-box{width: 50%;}
.client-section .container .inner h2{color: #fff; font-size: 32px; line-height: 38px;}
.client-section .container .inner .button-box{display: flex; column-gap: 15px; justify-content: flex-end;}
.client-section .container .inner .button-box .theme-btn{border-color: #fff; color: #fff; background: transparent !important; padding: 13px 25px 13px 25px !important;}
.client-section .container .inner .button-box .theme-btn:hover{border-color: #fba81e !important; background: #FBA81E !important;}
.client-section .container .inner .button-box a{display: flex; align-items: center; column-gap:10px}
.client-section .container .inner .button-box a img{width: 20px;}

/*Responsive Css*/
@media screen and (max-width: 1179px) {
	h2 {font-size: 40px; line-height: 40px;}

	.main-footer .inner .col.footer-menu ul{column-gap: 15px}
	.hero-section .inner .left-box h1{font-size: 40px; line-height: 46px}
	.hero-section .inner .left-box br{display: none}

	.about-section .inner{padding: 70px; column-gap: 60px}
	.about-section {padding: 20px 0 70px; }
	.about-section .inner .right-box h2 {font-size: 32px; line-height: 40px; }

	.process-section .inner{column-gap: 60px}
	.process-section{padding: 60px 0}

	.service-section {padding: 60px 0; }
	.service-section .service-list .list .content-box{padding: 25px;}
	.service-section .button-box{margin-top: 0}

	.what-do-section{padding: 60px 0}
	.what-do-section .inner{column-gap: 60px}

	.happy-client{padding: 60px 0;}
	.testimonail-section {padding: 60px 0 10px; overflow: hidden; }
	.contact-section .inner{padding: 50px; column-gap: 50px}
}

@media screen and (max-width: 1000px) {
	body{font-size: 16px; line-height: 22px}
	.mobile-menu{display: flex !important;}
	.site-header .inner .menu ul {position: absolute; display: none; top: 80px; left: 0; width: 100%; flex-direction: column; justify-content: flex-start; padding: 15px 0px; background: #fff; }
	.site-header .inner .menu ul.open{display: block;}
	.site-header .inner .menu ul li {width: 100%; border-bottom: 1px solid #ccc; padding: 10px 15px; }
	.site-header .inner .menu ul li:last-child{border: none}
	.site-header .inner .menu ul li a {display: inline-block; width: 100%; padding:0 }
	.site-header .inner .menu ul li.header-btn a{text-align: center;  padding: 12px 20px;}

	.main-footer {padding: 160px 0 40px}
	.main-footer .inner{flex-direction: column; justify-content: center; row-gap: 30px}
	.main-footer .inner .col{text-align: center;}
	.main-footer .inner .col a {text-align: center; }
	.main-footer .inner .col a img{display: inline-block;}
	.main-footer .inner .col.footer-menu ul {column-gap: 30px; justify-content: center; }
	.main-footer .inner .col.copyright p{text-align: center;}

	.hero-section {padding: 110px 0 60px;}
	.hero-section .inner{column-gap: 50px}
	.hero-section .inner .left-box h1 {font-size: 34px; line-height: 42px;}

	.about-section .inner {padding: 30px; column-gap: 30px; }
	.process-section .inner{flex-direction: column; row-gap: 30px}
	.process-section .inner .left-box {width: 100%; }
	.process-section .inner .right-box{width: 100%}
	.process-section .inner .right-box .box-list:nth-child(3) {margin-top: -20px; }
	.service-section .service-list .list {width: calc(50% - 15px);}
	.service-section .service-list{justify-content: center;}
	.contact-section .inner {padding: 30px; column-gap: 30px; }

	.client-section {padding: 60px 0;}
}

@media screen and (max-width: 767px) {
	h2 {font-size: 32px; line-height: 36px; margin-bottom: 15px}

	.site-header .inner .logo img {width: 170px;}
	.site-header .inner .menu ul{top: 70px}
	.main-footer .inner .col.footer-menu ul{flex-wrap: wrap; row-gap: 10px}

	.hero-section .inner{flex-direction: column-reverse; row-gap: 25px}
	.hero-section {padding: 100px 0 40px}
	.hero-section .inner .left-box h1 {font-size: 30px; line-height: 36px; }

	.service-section .service-list .list {width: 100%;}

	.about-section {padding: 0px 0 40px; }
	.about-section .inner{flex-direction: column; row-gap: 20px; padding: 20px}
	.about-section .inner .left-box, .about-section .inner .right-box {width: 100%; }
	.about-section .inner .right-box h2 {font-size: 26px; line-height: 30px; }

	.process-section {padding: 40px 0; }
	.process-section .inner .right-box {row-gap: 20px; }
	.process-section .inner .right-box .box-list{padding: 24px; width: 100%; margin: 0 !important}

	.service-section {padding: 40px 0; }
	.service-section .service-list .list .content-box {padding: 20px; }

	.what-do-section {padding: 40px 0; }
	.what-do-section .inner {flex-direction: column; row-gap: 30px; }

	.happy-client {padding: 40px 0; }
	.testimonial-slider .item{row-gap: 20px; padding: 0}
	.testimonial-slider .item .sub-text{margin: 0}

	.contact-section{padding: 40px 0 0px}
	.contact-section .inner{padding: 20px; flex-direction: column; row-gap: 30px}
	.contact-section .inner .left-box, .contact-section .inner .right-box{width: 100%}
	.contact-section .inner .left-box .contact-detail .item{padding: 10px; column-gap: 10px}
	.contact-section .inner .left-box .contact-detail{row-gap: 10px}

	.contact-section .inner .left-box h2 {font-size: 26px; line-height: 38px;}
	.contact-section .form {margin: 10px 0 0; }
	.contact-section .form form{row-gap: 20px}
	.contact-section .form form .control-group{width: 100% !important}
	.contact-section .form form .control-group input{height: 44px; font-size: 16px;}

	.testimonail-section {padding: 40px 0 10px;}
	.client-section {padding: 40px 0;}

	.client-slider {margin: 40px 0 10px; }
	.client-section .container .inner{row-gap: 30px; flex-direction: column;}
	.client-section .container .inner .left-box, .client-section .container .inner .button-box{width: 100%;}
	.client-section .container .inner .button-box a{padding: 13px !important;}
	.service-section .service-list{margin-bottom: 0;}

	.what-do-section .inner .right-box .list, .contact-section .inner .left-box .contact-detail .item{width: 100%;}
}