/*****************************************
* Author: Arun Sengupta *
* Copyright 2025, INDEX STUDIO    *
*****************************************/

body {
  font-family: "Source Sans Pro", sans-serif;
}
h1,
h2,
h3,
h4 {
  font-family: "DM Serif Display", serif;
}
a {
  text-decoration: none;
}

/*****************/

.wrap {
  box-sizing: border-box;
  max-width: 1240px;
  padding: 0 20px;
  margin: 0px auto;
}

/*******NavBar & Header**********/

.logo {
  max-width: 100%;
}
.navbar-brand {margin-top: 12px;}
.navbar-nav {margin-top: 12px;}
.nav-item {
  margin-left: 15px;
}
.nav-link {
  color: #3c6cb3;
  font: 400 14px "Poppins", arial;
}
.nav-link.active {
  color: #3c6cb3 !important;
  font-weight: 600;
}

.nav-link:hover {
  color: #24d2a4;
}

.dropdown-menu {
  border-radius: 0;
  padding: 0;
  border: 1px solid #24D2A4;
}

.dropdown-item {
  color: #3c6cb3;
  font: 400 14px "Poppins", arial;
  transition: all 0.3s;
  padding: 10px 20px;
}

.dropdown-item.active{
  background-color: #fff;
  color: #3c6cb3;
  font-weight: 600;
}

.dropdown-item:hover{
  background-color: #24D2A4;
  color: #fff;
}

.header-shadow {
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
  transition: box-shadow 0.3s ease-in-out;
}

.expert-talk {
  background-color: #24d2a6;
  font: 400 14px "Poppins", arial;
  color: #fff;
  border-radius: 0;
  margin-left: 15px;
  padding: 10px 25px;
  border: 1px solid transparent;
}
.expert-talk:hover {
  border: 1px solid #24d2a4;
  color: #24d2a4;
}
.bg-gradient {
  margin-top: 80px;
  background: #24d2a4;
  background: linear-gradient(
    90deg,
    rgb(36, 210, 164) 0%,
    rgb(91, 83, 205) 100%
  ) !important;
  
}

.main-heading {
  font: 700 54px "Bricolage Grotesque", arial;
}
.para {
  font: 400 21px "Mulish", arial;
}

.box-btn a {
  display: inline-block;
  font: 600 14px "Poppins", arial;
  padding: 15px 25px;
  margin-right: 15px;
  position: relative;
  z-index: 1;
  transition: all 0.3s;
}

.box-btn a.explore-btn {
  background-color: #fff;
  color: #4a7ac1;
}
.box-btn a.learn-btn {
  background-color: #3c6cb3;
  color: #fff;
}
.box-btn a.cnt-btn {
  background-color: #24d2a4;
  color: #fff;
  border: 1px solid transparent;
}
.box-btn a.explore-btn:hover {
  background-color: #4a7ac1;
  color: #fff;
}

.box-btn a.learn-btn:hover {
  background-color: #24d2a6;
}
.box-btn a.about-btn {
  border: 1px solid #fff;
}
.box-btn a.about-btn:hover {
  background-color: #4a7ac1;
  border: 1px solid transparent;
}
.box-btn a.cnt-btn:hover {
  background-color: transparent;
  border: 1px solid #24d2a4;
}

.swirls-bg {
  background-image: url(../img/swirls.svg);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center 240px;
}


.mid-head {
  font: 700 40px "Bricolage Grotesque", arial;
}
.mid-head-2 {
  font: 700 22px "Bricolage Grotesque", arial;
}
.sub-head {
  font: 700 20px "Bricolage Grotesque", arial;
}

.mid-para {
  font: 400 18px "Mulish", arial;
  line-height: 150%;
}

.service-card {
  background-color: #fff;
  min-height: 250px;
  padding: 50px;
  height: 100% !important;
  transition: all 0.3s;
}

.service-card:hover{
  box-shadow: 0px 4px 45px 3px rgba(0, 0, 0, 0.25);
}

.service-card h3 {
  font: 700 18px "Bricolage Grotesque", arial;
  color: #3c6cb3;
  margin-top: 25px;
}
.service-card p {
  font: 400 15px "Mulish", arial;
  color: #363636;
  margin-top: 15px;
}
.service-img img {
  max-width: 100%;
}
.achievement-box {
  padding: 10px 0;
}

.achievement-box h3 {
  font: 700 24px "Bricolage Grotesque", arial;
  color: #000;
}
.achievement-box p {
  font: 400 16px "Mulish", arial;
  color: #363636;
}
.achievement-box-br {
  border-left: 2px solid #24d2a4;
  padding-left: 40px;
}

/**** Section Background ****/

.blue-bg 	{background-color: #ecfefa;}

.purple-bg	{background-color: #5B53CD;}

.green-bg	{background-color: #24D2A4;}

/****/

.blue-bottom-border {
  border-bottom: 1px solid #24d2a4;
  padding: 25px 0;
}
.transparent-bottom-border {
  border-bottom: 1px solid transparent;
  padding: 25px 0;
}

.split-bg-section {
  min-height: 600px;
  overflow: hidden;
}

.bg-left {
  background-color: #5b53cd;
}

.bg-right {
  background-image: url("../img/contact-right.png");
  background-size: cover;
  background-position: center;
}

.content-mid {
  height: 600px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.content-mid p {
  font: 700 30px "Bricolage Grotesque", arial;
  color: #fff;
  max-width: 520px;
}

.alert-success{
  font: 400 20px "Mulish", arial!important;
  color: #fff!important;
  background-color: #5b53cd!important;
  padding: 15px!important;
  margin-bottom: 15px!important;
}

/**** Inner Pages Style ****/

.inner-para	{width: 55%;}
.about-gradient-padding { padding-bottom: 180px!important;}
.about-banner {
	position: relative;
	top: -150px;
	height: 300px;
	margin-bottom: -85px;
    background-image: url("../img/about-banner.png");
    background-size: cover;
    background-repeat: no-repeat;
}

.about-number{
	font: 700 30px "Bricolage Grotesque", arial;
	color: #24d2a4;
}
.about-num-text{
	font: 400 16px "Mulish", arial;
	color: #363636;
	margin-top: 5px;
}
.grey-bottom-border{
	border-bottom: 1px solid #C5C5C5;
	margin-bottom: 20px;
}
.about-why img{
	max-width: 67px;
	height: auto;
}
.about-why h3{
	font: 700 22px "Bricolage Grotesque", arial;
	color: #fff;
	margin: 15px 0 10px 0;
}
.about-why p{
	font: 400 16px "Poppins", arial;
	color: #fff;
	width: 80%;
	margin-bottom: 50px;
}

.support-box{
	height: 100%;
	background-color: #fff;
	padding: 30px;
}
.support-box img{
	max-width: 60px;
	height: 60px;
}
.support-box h3{
	font: 700 18px "Bricolage Grotesque", arial;
	color: #24d2a4;
	margin: 20px 0 10px 0;
}

.support-box p{
	font: 400 15px "Mulish", arial;
	color: #363636;
	width: 95%;
}
.testi-box{
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
}
.testi-img{
	max-width: 208px;
	width: 100%;
	border-radius: 50%;
	background-color: #f5f5f5;
}

.testi-box h3{
	font: 700 18px "Bricolage Grotesque", arial;
	color: #24d2a4;
	margin-top: 15px;
}
.testi-box p{
	font: 400 15px "Mulish", arial;
	color: #363636;
}

/**** What we Do pages style ****/

.top-sub-head{
  font: 700 23px "Bricolage Grotesque", arial;
}

.what-mid-head{
  width: 50%;
  margin-bottom: 35px;
}

/* .sub-right-img{margin-top: 180px;} */

.sub-left-box h3{
  font: 700 25px "Bricolage Grotesque", arial;
	color: #24d2a4;
  margin-bottom: 20px;
}

.sub-left-box p{
  font: 400 16px "Mulish", arial;
	color: #363636;
  padding-bottom: 10px;
  margin-top: 25px;
  border-bottom: 1px solid #C5C5C5;
}

.what-box-h{
  font: 700 25px "Bricolage Grotesque", arial;
	color: #24d2a4;
  margin-bottom: 20px;
  margin-top: 60px;
}

.what-box {
  width: 98%;
}

.what-box-p {
  font: 400 16px "Mulish", arial;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100px;
  color: #363636;
  border-right: 1px solid #C5C5C5;
}

.what-box-p p{
  padding: 0;
  padding-right: 15px;
}

.what-box-p:last-child {
  border-right: none;
}

.sub-mid-sec {margin-top: 100px;}

.approach-box{
  border-bottom: 1px solid #24d2a4;
  width: 55%;
  margin-bottom: 30px;
  padding-bottom: 10px;
}

.approach-box:last-child{
  border: 0;
  margin-bottom: 0px;
  padding-bottom: 0px;
}
.approach-box p{
  font: 400 16px "Poppins", arial;
	color: #363636;
}

.sub-service-box{
  background-color: #fff;
  height: 100%;
  padding: 45px 35px
}

.approach-box-2{
  width: 85%;
  margin-left: 100px;
  margin-top: 30px;
}

.approach-box-2 p{
  font: 400 16px "Poppins", arial;
	color: #363636;
  padding-bottom: 20px;
}

.approach-border{
  border-bottom: 1px solid #24d2a4;
  margin-bottom: 50px;
}

.approach-adjust-1{
  margin-left: 18%;
}
.approach-adjust-2{
  margin-left: 32%;
}

.sub-service-box h3{
  font: 700 18px "Bricolage Grotesque", arial;
	color: #3C6CB3;
}

.sub-service-box p{
  font: 400 15px "Mulish", arial;
	color: #363636;
  margin-top: 15px;
}

.form-box-head{
  font: 700 33px "Bricolage Grotesque", arial;
	color: #fff;
  margin-top: 160px
}

.form-box-p{
  font: 400 22px "Mulish", arial;
	color: #fff;
}

.cnt-form{
  padding: 50px 60px;
  background-color: #5B53CD;
}

.cnt-form .form-control{
  border: 0;
  border-bottom: 1px solid #D9D9D9;
  background-color: transparent;
  border-radius: 0;
  padding: 10px 0;
  font: 400 15px "Mulish", arial;
	color: #fff;
  margin-bottom: 35px;
}

.cnt-form .form-control::placeholder {
  color: #fff;
  opacity: 1;
}

.cnt-form .btn{
    width: 100%;
    border: 0;
    border-radius: 0;
    padding: 20px;
    margin-top: 30px;
    font: 600 14px "Poppins", arial;
    background: #fff;
    color: #5B53CD;
}

.cnt-form .btn:hover{
    background: #24D2A4;
    color: #fff;
}
.what-form{
  background-color: #fff;
  width: 80%;
  position: relative;
  top: 125px;
  z-index: 1;
  box-shadow: 0px 4px 17px 4px rgba(0, 0, 0, 0.06);
}
.what-form .form-control{
  background-color: #fff;
  color: #666;
}
.what-form .form-control::placeholder {
  color: #666;
  opacity: 1;
}


.what-form .btn{
    background: #5B53CD;
    color: #fff;
}

.what-form .btn:hover{
    background: #24D2A4;
    color: #fff;
}

.cnt-bg-head{
  font: 700 23px "Bricolage Grotesque", arial;
	color: #fff;
}

.cnt-para{
  font: 400 22px "Mulish", arial;
  line-height: 150%;
  color: #363636;
}

.cnt-address{
  font: 400 16px "Mulish", arial;
  color: #363636;
}

/**** Product Page ****/
.product-padding{
  padding-top: 100px;
}

.product-top-font{
  font-size: 19px;
}

.pro-top-btn{
  margin-bottom: -50px;
}

.pro-banner{
  position: relative;
  bottom: -65px;
}

.pro-key-text{
  font: 700 25px "Bricolage Grotesque", arial;
  color: #24d2a4;
  margin: 30px 0;
}

.pro-benefit-box h3{
  font: 700 18px "Mulish", arial;
  color: #363636;
}

.pro-benefit-box p{
  font: 400 16px "Mulish", arial;
  color: #363636;
  width: 76%;
  margin-top: -2px
}

.pro-core-text{
  font: 400 32px "Bricolage Grotesque", arial;
  color: #fff;
  margin-bottom: 40px;
}

.pro-card {
  background-color: #fff;
  padding: 35px;
  height: 100% !important;
  transition: all 0.3s;
}

.pro-card h3 {
  font: 700 18px "Bricolage Grotesque", arial;
  color: #3c6cb3;
  margin-top: 25px;
}
.pro-card p {
  font: 400 15px "Mulish", arial;
  color: #363636;
  margin-top: 15px;
}
.pro-img img {
  max-width: 100%;
  height: 38px;
}

.pro-key-case h3{
	font: 700 22px "Bricolage Grotesque", arial;
	color: #363636;
	margin: 15px 0 10px 0;
}
.pro-key-case p{
	font: 400 16px "Poppins", arial;
	color: #363636;
	width: 80%;
	margin-bottom: 50px;
}
/**** Footer ***/

.footer-bg {
  background-image: url("../img/footer-bg.svg");
  background-size: cover;
  background-position: bottom;
  background-color: #F8F8F8;
  height: 450px;
  padding-top: 50px;
}

.footer-list {
  list-style-type: none;
  margin-top: 5px;
}
.footer-list li {
  display: inline-block;
  position: relative;
  font: 400 14px "Mulish", arial;
  color: #000;
}

.footer-list li a {
  color: #000;
}
.footer-list li span {
  display: inline-block;
  margin: 0 15px;
}

.footer-head {
  font: 700 20px "Bricolage Grotesque", arial;
}

.footer-left-text {
  font: 400 16px "Mulish", arial;
}


.what-footer{
  padding-top: 200px;
  height: 555px;
}



/**** Custom Section Padding ****/

.padding-100 { padding: 100px 0; }

.padding-b-100{ padding-bottom: 100px;}

.padding-125 { 
  padding-top: 125px; 
  padding-bottom: 125px; 
}

.padding-b-350 { padding-bottom: 350px; }


/**** Text Colors ****/
.text-white {
  color: #fff;
}
.text-black {
  color: #363636;
}

.text-l-black{
  color: #363636;
}
.text-green {
  color: #24d2a4;
}
.text-blue {
  color: #3c6cb3;
}
/*****************/
.clear {
  clear: both;
  height: 0px;
  line-height: 0px;
}
.spacer {
  clear: both;
  height: 5px;
  line-height: 5px;
}
.spacer-large {
  clear: both;
  height: 10px;
  line-height: 10px;
}
.spacer-huge {
  clear: both;
  height: 20px;
  line-height: 20px;
}
.spacer-big {
  clear: both;
  height: 30px;
  line-height: 20px;
}
.spacer-mega {
  clear: both;
  height: 40px;
  line-height: 20px;
}
.spacer-wow {
  clear: both;
  height: 60px;
  line-height: 20px;
}
.adjust-margin {
  margin-top: -50px;
}

.w-90 {width: 90%;}
.w-70 {width: 70%;}

/**** Media Queries ****/



@media screen and (min-width: 1600px) {

  .swirls-bg {
    background-position: center 110px;
  }

}


@media screen and (max-width: 990px) {
  .navbar-toggler {
    border: 0;
  }
  .navbar-toggler-icon {
    background-image: url("../img/menu-bar.png");
  }
  .navbar-toggler:focus {
    outline: none;
    box-shadow: none;
  }

  .navbar-toggler.toggled .navbar-toggler-icon {
    background-image: url("../img/close-icon.png");
  }

  .expert-talk {
    margin: 15px 0;
  }
  .achievement-box-br {
    margin-bottom: 35px;
  }

  .no-border {
    border: none !important;
    padding-left: 0 !important;
  }
}




@media screen and (max-width: 768px) {
  .navbar-nav{
    box-shadow: rgba(36, 210, 164, 0.5) 0px 43px 82px 0px;
    background: rgba(36, 210, 164, 0.1);
  }

  .padding-100 { padding: 50px 0;}
  .padding-125 {padding: 50px 0;}
  .padding-b-100 {padding-bottom: 50px;}
  .logo {
    max-width: 180px;
  }
  .bg-layer {
    flex-direction: column;
  }

  .bg-left,
  .bg-right {
    min-height: 400px;
    width: 100%;
  }

  .content-mid {
    height: auto;
    padding: 3rem 1rem;
  }

  .content-mid p {
    font-size: 20px;
    width: 100%;
    padding: 20px;
  }

  .main-heading {
    font-size: 34px;
  }
  .mid-head {
    font-size: 27px;
  }

  .sub-head {
    font-size: 18px;
  }
  .para {
    font-size: 17px;
  }

  .mid-para {
    width: 100% !important;
    font-size: 16px;
  }

  .swirls-bg{
    background-position: center 300px;
  }
  .service-card {
    min-height: 100%;
    padding: 20px;
  }
  .service-card h3 {
    color: #000;
  }
  .service-img {
    margin-top: 25px;
    padding-left: 5px;
  }
  .box-btn a.cnt-btn {
    margin-left: 20px;
  }

  .support-box {
	margin-bottom: 20px;
	height: auto;
  }

  .about-banner {
      position: relative;
      top: -110px;
      height: 200px;
      margin-bottom: -70px;
  }	
  .about-why p {width: 100%;}

  .testi-box {margin-bottom: 35px;}

  .inner-para{width: 100%;}

  .adjust-margin {
    margin-top: 0px;
  }

  .w-90{width: 100%;}
  .what-box{width: 100%;}
  .sub-right-img {margin-top: 50px;}
  .what-mid-head{width: 100%;}
  .approach-box {width: 100%;}
  .what-form{
    width: 100%;
    padding: 30px;
    top: 0;
    margin-top: 35px;
    margin-bottom: 100px;
  }
.approach-box-2 {
  margin-left: 0;
  width: 100%;
}
  .what-box-p{
    border: 0;
    border-bottom: 1px solid #C5C5C5;
  }
  .form-box-head{
    margin-top: 100px;
    font-size: 27px;
  }
  .sub-service-box {height: auto; margin-bottom: 30px;}
  .footer-bg {
    height: 530px;
    background-image: url("../img/footer-mobile-bg.svg");
    background-size: auto;
    background-repeat: no-repeat;
    padding-top: 30px;
  }
  .footer-head {
    display: block;
    margin-bottom: 15px;
  }
  .footer-list {
    margin: 0;
    padding: 0;
  }

    
  .dropdown-menu {
    border:0;
    border-left: 2px solid #24D2A4;
    margin-bottom: 10px;
  }

  .dropdown-item {
    padding: 5px 5px 6px 16px;
  }

  .dropdown-item.active{
    background-color: #fff;
    color: #3c6cb3;
    font-weight: 600;
  }

  .dropdown-item:hover{
    background-color: #24D2A4;
    color: #fff;
  }

  .approach-adjust-1 {margin-left: 0;}
  .approach-adjust-2 {margin-left: 0;}
}

@media screen and (max-width: 500px) {
  .swirls-bg {
    background-position: -105px 325px;
    background-size: 860px;
  }
  .padding-b-350 {
    padding-bottom: 205px;
}

.pro-core-text{font-size: 24px;}
}