/* start land section */
header {
    padding-bottom: 7rem;
    border-bottom-left-radius: 32px;
    border-bottom-right-radius: 32px;
}
.land-section h1{
    color: var(--mainColor2);
    opacity: 87%;
    font-weight: bold;
    line-height: 86.2px;
    position: relative;
    display: inline-block;

}

.land-section h1::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 15px;
    background-color: var(--highlightblue);
    right: 0;
    bottom: 30px;
    z-index: -1;

}

@media (max-width : 375px) {
    .land-section h1::after {
      display: none;
    }

    .land-section h1 {
        line-height: 50px;
    }
}

/* end land section */


/* start services */
.services {
    margin-bottom: 10rem;
}


.services .h2 {
    font-size: 36px;
font-weight: 600;
line-height: 67.46px;
text-align: center;
color: var(--black);

}

.services .top-title {
    margin-bottom: 7rem;
}
.services .services-card {
     display: flex ;
     flex-direction: column;
     gap:20px;
     border-radius: 24px;
     -webkit-border-radius: 24px;
     -moz-border-radius: 24px;
     -ms-border-radius: 24px;
     -o-border-radius: 24px;
     box-shadow: 0px 24px 32px 0px #0309320A;
     transition: all 0.5s ;
     -webkit-transition: all 0.5s ;
     -moz-transition: all 0.5s ;
     -ms-transition: all 0.5s ;
     -o-transition: all 0.5s ;
}

.services .services-card .services-icon {
    width: 80px;
    height: 80px;
    border-radius: 50% !important;
    -webkit-border-radius: 50% !important;
    -moz-border-radius: 50% !important;
    -ms-border-radius: 50% !important;
    -o-border-radius: 50% !important;
    background-color: #F8F3E7;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 1.5rem;
}

.services .services-card h4 {
    font-size: 18px;
    font-weight: 700;
    line-height: 21px;
    text-align: right;
    color: var(--black);

}

.services .services-card p {
    font-size: 17px;
    font-weight: 400;
    line-height: 25px;
    text-align: right;
    color: #6C87AE;
    

}

.services .flip-card {
    min-width: 380px;
    height: 330px;
    perspective: 1000px;
    cursor: pointer;
    
  }


  @media (max-width : 1200px) {
    .services .flip-card {
        min-width: 300px;
        
        
      }
    
  }


  
  .services .flip-card-inner {
    position: relative;
    width: 100%;
    height: 100%;
    text-align: center;
    transition: transform 0.6s;
    transform-style: preserve-3d;
  }
  
  .services .flip-card:hover .flip-card-inner {
    transform: rotateY(180deg);
    -webkit-transform: rotateY(180deg);
    -moz-transform: rotateY(180deg);
    -ms-transform: rotateY(180deg);
    -o-transform: rotateY(180deg);
}
  
.services .flip-card-front,  .services .flip-card-back {
    position: absolute;
    width: 100%;
    height: 100%;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
  }
  

  
  .services .flip-card-back {
    transform: rotateY(180deg);
    background-color: var(--mainColor2);
  
  }
 

  .services .flip-card-back.services-card h4 {
      color: var(--white);
  }
  .services .flip-card-back.services-card p {
    color: #e3e3e3;
    font-size: 17px;
    font-weight: 400;
    line-height: 30px;
    text-align: right;

}

/* end services */


/* start with-muser */

.with-muser {
    overflow: hidden;
    
}
.with-muser .container {
    position: relative;
    background: linear-gradient(145.08deg, #B8860B 3.73%, #EEB830 132.69%);
    border-radius: 20px;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    -ms-border-radius: 20px;
    -o-border-radius: 20px;
    
   

}

.with-muser .container .plus1 {
    position: absolute;
    z-index: 1;
    left: -10px;
    top: -50px;
}

.with-muser .container .plus2 {
    position: absolute;
    z-index: 1;
    left: -60px;
    bottom: 50px;
}
.with-muser .container .plus3 {
    position: absolute;
    z-index: 1;
    left: 120px;
    bottom: -25px;
}
.with-muser .container .plus4 {
    position: absolute;
    z-index: 1;
    right: 30px;
    bottom: -37px;
}

.with-muser .container .plus5 {
    position: absolute;
    z-index: 1;
    right: -50px;
    top: 40px;
}
.with-muser .container .plus6 {
    position: absolute;
    z-index: 1;
    right: 80px;
    top: -30px;
}
.with-muser h3 {
font-size: 32px;
font-weight: 700;
line-height: 59.97px;
text-align: center;
color: var(--white);

}

.with-muser p {
font-size: 20px;
font-weight: 400;
line-height: 40px;
text-align: center;
color: var(--white);

}

.with-muser .btn-trynow {
    padding-left: 4.5rem; 
    padding-right: 4.5rem;
    font-size: 17px !important;
}

@media (max-width : 380px) {
    .with-muser .btn-trynow {
        padding-left: 0;
        padding-right: 0;
    }
}

/* end with-muser */