@charset "UTF-8";
html {
  scroll-behavior: smooth;
}

body {
  font-family: "Be Vietnam Pro", sans-serif;
  font-size: 1rem;
}

h1, h2, h3, h4, h5, h6 {
  font-family: "Plus Jakarta Sans", sans-serif !important;
  font-weight: 700;
  line-height: 1.3;
  color: #1E1B4B;
}

h1, .fs-1 {
  font-size: clamp(2rem, 5vw + 1rem, 3.052rem) !important; /* 32px → 49px */
}

p, span, li, a {
  letter-spacing: -0.4px;
  line-height: 1.65;
  color: #4B5563;
}

/*** page
-------------------------------------------------------------- ****/
.pageBox {text-align: center;}
.pageBox a {border:1px solid #ddd;display:inline-block;margin-right:6px;color: #707070;width:60px;height:34px;font:bold 14px/34px arial;}
.pageBox a:hover,.pageBox a:active{background:#3aa9f2;color: #FFFFFF;text-decoration: none;}
.pageBox b {background: #3aa9f2;color: #FFFFFF;text-decoration: none;border: 1px solid #ddd;display: inline-block;margin-right: 6px;width: 34px;height: 34px;font: bold 14px / 34px arial;}
.pageBox .cur { background: #3aa9f2;border: 1px solid #3aa9f2;text-decoration: none;}

button {
  font-family: "Plus Jakarta Sans", sans-serif !important;
}

.header {
  width: 100%;
  height: 120px;
  position: fixed;
  top: 0;
  left: 0;
  transition: 0.35s ease-in-out;
  z-index: 999;
}
.header nav ul li a {
  font-family: "Plus Jakarta Sans", sans-serif;
  transition: 0.35s ease-in-out;
}
.header nav ul li a:hover, .header nav ul li a.active {
  color: #76C162 !important;
}
@media (max-width: 767px) {
  .header {
    height: 90px;
  }
}

.header-logo {
  width: 120px;
}

#preloader {
  width: 100%;
  height: 100%;
  background-color: #FFF;
  opacity: 0;
  visibility: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
  transition: 0.5s ease-in-out;
}
#preloader .spinner {
  width: 60px;
  height: 60px;
  position: relative;
  margin: 100px auto;
}
#preloader .double-bounce1,
#preloader .double-bounce2 {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background-color: #76C162;
  opacity: 0.6;
  position: absolute;
  top: 0;
  left: 0;
  -webkit-animation: sk-bounce 2s infinite ease-in-out;
  animation: sk-bounce 2s infinite ease-in-out;
}
#preloader .double-bounce2 {
  -webkit-animation-delay: -1s;
  animation-delay: -1s;
}
@-webkit-keyframes sk-bounce {
  0%, 100% {
    -webkit-transform: scale(0);
  }
  50% {
    -webkit-transform: scale(1);
  }
}
@keyframes sk-bounce {
  0%, 100% {
    transform: scale(0);
    -webkit-transform: scale(0);
  }
  50% {
    transform: scale(1);
    -webkit-transform: scale(1);
  }
}
#preloader.active {
  visibility: visible;
  opacity: 1;
}

.hero-banner {
  padding-top: 230px;
  padding-bottom: 130px;
  overflow: hidden;
  position: relative;
}
.hero-banner .container {
  z-index: 10;
}
.hero-banner .hero-heading {
  font-size: calc(3rem + 1.5vw) !important;
}
@media (max-width: 1199px) {
  .hero-banner .hero-heading {
    font-size: calc(2.8rem + 1.5vw) !important;
  }
}
@media (max-width: 575px) {
  .hero-banner .hero-heading {
    font-size: calc(2.5rem + 1.5vw) !important;
  }
}
.hero-banner .hero-img {
  width: 100%;
}
@media (max-width: 575px) {
  .hero-banner .hero-img {
    width: 100%;
    height: 400px;
    object-fit: cover;
  }
}
@media (max-width: 767px) {
  .hero-banner {
    padding-top: 130px;
    padding-bottom: 80px;
  }
}

section.about-us,
section.features,
section.benefits,
section.integrations,
section.testimonials,
section.pricings,
section.faq,
section.team,
section.news {
  padding: 130px 0;
}
@media (max-width: 767px) {
  section.about-us,
  section.features,
  section.benefits,
  section.integrations,
  section.testimonials,
  section.pricings,
  section.faq,
  section.team,
  section.news {
    padding: 80px 0;
  }
}

section.achievement {
  padding: 100px 0;
}
section.achievement:before, section.achievement:after {
  content: "";
  width: 1000px;
  height: 1000px;
  background-size: 100%;
  position: absolute;
  z-index: 1;
}
section.achievement:before {
  background-image: url("../images/blur-yellow.webp");
  top: -720px;
  left: -200px;
}
section.achievement:after {
  background-image: url("../images/blur-green.webp");
  right: -200px;
  bottom: -720px;
}

section.cta {
  padding: 100px 0;
  overflow: hidden;
  position: relative;
}
section.cta:before, section.cta:after {
  content: "";
  width: 1000px;
  height: 1000px;
  background-image: url("../images/blur-yellow.webp");
  background-size: 100%;
  position: absolute;
  z-index: 1;
}
section.cta:before {
  top: -690px;
  left: -200px;
}
section.cta:after {
  bottom: -690px;
  right: -200px;
}
section.cta .row {
  z-index: 10;
}

section.sc-breadcrumb {
  background-color: #ffffff;
  padding-top: 200px;
  padding-bottom: 80px;
  position: relative;
}
section.sc-breadcrumb:before, section.sc-breadcrumb:after {
  content: "";
  width: 1200px;
  height: 1200px;
  background-size: 100%;
  opacity: 0.6;
  position: absolute;
}
section.sc-breadcrumb:before {
  background-image: url("../images/blur-yellow.webp");
  top: -700px;
  left: -200px;
}
section.sc-breadcrumb:after {
  background-image: url("../images/blur-green.webp");
  bottom: -700px;
  right: -200px;
}

.bg-primary {
  background-color: #76C162 !important;
}

.bg-dark {
  background-color: #1B1F20 !important;
}

.bg-light {
  background-color: #F9F9F9 !important;
}

.lh-base {
  line-height: 1.7 !important;
}

.btn {
  font-family: "Plus Jakarta Sans", sans-serif;
  letter-spacing: 0;
  border-radius: 12px;
  padding: 15px 27px;
  line-height: 1.5;
  border: 0;
  font-weight: 700;
  transition: 0.35s ease-in-out;
}

.btn-sm {
  padding: 12px 25px;
}

.btn-lg {
  font-size: 1.1125rem;
  padding: 18px 38px;
  display:none;
}

.btn-primary {
  background-color: #76C162 !important;
  box-shadow: 0 15px 30px rgba(118, 193, 98, 0.45) !important;
}
.btn-primary:hover {
  background-color: rgb(89.8630136986, 172.0547945205, 67.9452054795) !important;
}

.btn-secondary {
  background-color: #64748B !important;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.03) !important;
}
.btn-secondary:hover {
  background-color: rgb(78.6610878661, 91.2468619247, 109.3389121339) !important;
}

.btn-success {
  background-color: #10B981 !important;
  box-shadow: 0 15px 30px rgba(16, 185, 129, 0.45) !important;
}
.btn-success:hover {
  background-color: rgb(11.9402985075, 138.0597014925, 96.2686567164) !important;
}

.btn-danger {
  background-color: #EF4444 !important;
  box-shadow: 0 15px 30px rgba(239, 68, 68, 0.45) !important;
}
.btn-danger:hover {
  background-color: rgb(234.9802955665, 21.0197044335, 21.0197044335) !important;
}

.btn-warning {
  background-color: #F59E0B !important;
  box-shadow: 0 15px 30px rgba(245, 158, 11, 0.45) !important;
}
.btn-warning:hover {
  background-color: rgb(196.9291338583, 126.7125984252, 8.0708661417) !important;
}

.btn-info {
  background-color: #0EA5E9 !important;
  box-shadow: 0 15px 30px rgba(14, 165, 233, 0.45) !important;
}
.btn-info:hover {
  background-color: rgb(11.1093117409, 130.9311740891, 184.8906882591) !important;
}

.btn-light {
  background-color: #FFF !important;
  color: #1E1B4B !important;
  box-shadow: 0 15px 30px rgba(0, 0, 0, 0.07) !important;
}
.btn-light:hover {
  background-color: #FFF !important;
  color: #76C162 !important;
}

.btn-dark {
  background-color: #1B1F20 !important;
  box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1) !important;
}
.btn-dark:hover {
  background-color: rgb(3.6610169492, 4.2033898305, 4.3389830508) !important;
}

.btn-socmed {
  width: 35px;
  height: 35px;
  padding: 3px 0 0 0;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #FFF;
  font-size: 0.875rem;
}
.btn-socmed.btn-fb {
  background-color: #1877F2;
  box-shadow: 0 10px 25px rgba(24, 119, 242, 0.45);
}
.btn-socmed.btn-x {
  background-color: #000000;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.45);
}
.btn-socmed.btn-in {
  background-color: #0077B5;
  box-shadow: 0 10px 25px rgba(0, 119, 181, 0.45);
}
.btn-socmed:hover {
  color: #FFF !important;
}

.btn-scroll-up {
  width: 55px;
  height: 55px;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0;
  position: fixed;
  right: 30px;
  bottom: -100px;
  z-index: 10;
  transition: 0.5s ease-in-out;
}
.btn-scroll-up.show {
  bottom: 30px;
}
@media (max-width: 575px) {
  .btn-scroll-up {
    width: 45px;
    height: 45px;
    right: 20px;
    font-size: 0.875rem;
  }
  .btn-scroll-up.show {
    bottom: 20px;
  }
}

.text-primary {
  color: #76C162 !important;
}

.text-secondary {
  color: #666 !important;
}

.text-success {
  color: #10B981 !important;
}

.text-danger {
  color: #EF4444 !important;
}

.text-warning {
  color: #F59E0B !important;
}

.text-info {
  color: #0EA5E9 !important;
}

.text-dark {
  color: #1B1F20 !important;
}

.offcanvas-mainnav .offcanvas-img {
  width: 150px;
}
.offcanvas-mainnav ul > li > a.active {
  color: #76C162 !important;
}
.offcanvas-mainnav .dropdown-menu {
  transform: translate3d(0, 0, 0) !important;
  box-shadow: none !important;
}
.offcanvas-mainnav .dropdown-item:hover, .offcanvas-mainnav .dropdown-item.active {
  background-color: #FFF !important;
}

#sliderImgHeroBanner .slide-lg {
  width: 67.3%;
}
#sliderImgHeroBanner .slide-sm {
  width: 32.7%;
}

.card-feature {
  height: 100%;
  padding: 40px;
  border-radius: 25px;
  box-shadow: none;
  overflow: hidden;
  position: relative;
  box-shadow: 0 10px 40px rgba(27, 31, 32, 0.07);
}
.card-feature > .icon {
  width: 65px;
  height: 65px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 15px;
  background-color: #F3F7FF;
  font-size: 2rem;
  line-height: 1;
  overflow: hidden;
  position: relative;
  transition: 0.5s ease-in-out;
}
.card-feature > .icon.bg-primary {
  box-shadow: 0 15px 30px rgba(118, 193, 98, 0.45);
}
.card-feature > .icon.bg-info {
  box-shadow: 0 15px 30px rgba(14, 165, 233, 0.45);
}
.card-feature > .icon.bg-success {
  box-shadow: 0 15px 30px rgba(16, 185, 129, 0.45);
}
.card-feature > .icon.bg-warning {
  box-shadow: 0 15px 30px rgba(245, 158, 11, 0.45);
}
.card-feature > .icon.bg-danger {
  box-shadow: 0 15px 30px rgba(239, 68, 68, 0.45);
}
.card-feature > h4, .card-feature > p {
  position: relative;
  transition: 0.5s ease-in-out;
  z-index: 10;
}

.card-team,
.card-news,
.card-contact {
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.1);
}
.card-team .card-body,
.card-news .card-body,
.card-contact .card-body {
  padding: 30px;
}
.card-team .card-body .text-link,
.card-news .card-body .text-link,
.card-contact .card-body .text-link {
  transition: 0.35s ease-in-out;
}
.card-team .card-body .text-link:hover,
.card-news .card-body .text-link:hover,
.card-contact .card-body .text-link:hover {
  color: #000 !important;
}

.card-contact .card-body {
  padding: 40px;
}

.card-benefits {
  padding: 40px;
  border-radius: 25px;
  gap: 30px;
  box-shadow: 0 10px 40px rgba(118, 193, 98, 0.1);
}
.card-benefits > .card-icon {
  width: 65px;
  height: 65px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 15px;
  background-color: #F3F7FF;
  color: #FFF;
  font-size: 2rem;
  line-height: 1;
  overflow: hidden;
  position: relative;
  transition: 0.5s ease-in-out;
}
.card-benefits > .card-icon.bg-primary {
  box-shadow: 0 15px 30px rgba(118, 193, 98, 0.45);
}
.card-benefits > .card-icon.bg-info {
  box-shadow: 0 15px 30px rgba(14, 165, 233, 0.45);
}
.card-benefits > .card-icon.bg-success {
  box-shadow: 0 15px 30px rgba(16, 185, 129, 0.45);
}
.card-benefits > .card-icon.bg-warning {
  box-shadow: 0 15px 30px rgba(245, 158, 11, 0.45);
}
.card-benefits > .card-icon.bg-danger {
  box-shadow: 0 15px 30px rgba(239, 68, 68, 0.45);
}

.card-testimonial {
  padding: 40px;
  border-radius: 25px;
  box-shadow: 0 10px 40px rgba(27, 31, 32, 0.07);
}
.card-testimonial .fi {
  color: #F59E0B;
}
.card-testimonial .frame-photo {
  width: 65px;
  height: 65px;
  flex-shrink: 0;
  border-radius: 50%;
  overflow: hidden;
}

#sliderPartners {
  overflow: hidden;
}
#sliderPartners .swiper-slide > a > img {
  width: 150px;
  height: 50px;
  object-fit: contain;
}
@media (max-width: 1199px) {
  #sliderPartners .swiper-slide > a > img {
    width: 120px;
    height: 40px;
  }
}
@media (max-width: 575px) {
  #sliderPartners .swiper-slide > a > img {
    width: 100px;
  }
}

.pricing-card {
  background-color: #fff;
  padding: 40px;
  border-radius: 25px;
  box-shadow: 0 15px 50px rgba(27, 31, 32, 0.07);
}
.pricing-card.recomended {
  position: relative;
}
.pricing-card.recomended:before {
  content: "";
  width: 800px;
  height: 800px;
  background-image: url("../images/blur-yellow.webp");
  background-size: 100%;
  position: absolute;
  top: -570px;
  left: -300px;
  z-index: 1;
}

#faqAccordion .accordion-item,
#faqAccordion .accordion-button {
  border-radius: 20px;
}
#faqAccordion .accordion-item {
  box-shadow: 0 20px 30px rgba(0, 0, 0, 0.05);
}
#faqAccordion .accordion-button,
#faqAccordion .accordion-body {
  padding: 30px;
}

.nav-pills .nav-link {
  border-radius: 12px;
  padding: 12px 25px;
  font-weight: 600;
  color: #1E1B4B;
}
.nav-pills .nav-link.active {
  background-color: #1B1F20;
}
.nav-pills .nav-link.active > span {
  color: #fff;
}

.nav-pills-pricing {
  padding: 7px;
  background-color: #f6f6f6;
  border-radius: 20px;
}

.list-logo > li > a {
  width: 120px;
  height: 120px;
  border-radius: 20px;
  display: flex;
  justify-content: center;
  align-items: center;
  box-shadow: 0 10px 30px rgba(27, 31, 32, 0.07);
}
.list-logo > li > a > img {
  width: 50px;
}
@media (max-width: 575px) {
  .list-logo > li {
    width: calc(33.33333% - 1rem);
  }
  .list-logo > li > a {
    width: 100%;
    height: 100%;
    padding-top: 100%;
    position: relative;
  }
  .list-logo > li > a > img {
    width: 45px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
  }
}

.custom-cursor {
  position: fixed;
  top: 0;
  left: 0;
  pointer-events: none;
  z-index: 9999;
  width: 80px;
  height: 80px;
  background-color: rgba(0, 0, 0, 0.1);
  border-radius: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  align-items: center;
  justify-content: center;
  padding-top: 5px;
  opacity: 0;
  transition: opacity 0.3s ease, transform 0.15s ease;
  backdrop-filter: blur(10px);
}

.cursor-text {
  display: flex;
  align-items: center;
  justify-content: center;
  color: #000;
  font-weight: semibold;
  letter-spacing: 1px;
  font-family: "Plus Jakarta Sans", sans-serif;
  pointer-events: none;
}

.img-sc {
  width: 100%;
}
@media (min-width: 992px) and (max-width: 1199px) {
  .img-sc {
    width: auto;
    height: 700px;
  }
}

.page-link {
  color: #76C162;
}
.page-link:hover {
  color: #76C162;
}

.icon-contact {
  width: 45px;
  height: 45px;
  border-radius: 50%;
  line-height: 1;
}

.list-group-cst {
  box-shadow: 0 20px 30px rgba(0, 0, 0, 0.1);
}
.list-group-cst.list-group-sticky {
  position: sticky;
  top: 150px;
}

.list-group-item.active {
  background-color: #76C162;
}

.dropdown-menu {
  box-shadow: 0 20px 30px rgba(118, 193, 98, 0.1);
}

.dropdown-item {
  transition: 0.5s ease-in-out;
}
.dropdown-item:hover, .dropdown-item.active {
  background-color: #F9F9F9 !important;
  color: #76C162 !important;
}

body.scrolled .header {
  height: 85px;
  box-shadow: 0 0 100px rgba(27, 31, 32, 0.2);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
}

.footer {
  background-color: #1B1F20;
}
.footer .footer-logo {
  width: 150px;
}
.footer .form-newsletter .input-group-text {
  background-color: #333;
  color: #B6B6B6;
  border: 0;
  padding: 20px;
  border-radius: 10px 0 0 10px;
}
.footer .form-newsletter .form-control {
  background-color: #333;
  border: 0;
  box-shadow: 0;
  padding: 20px 0;
  color: #B6B6B6;
}
.footer .form-newsletter .form-control::placeholder {
  color: #B6B6B6;
}
.footer .form-newsletter .btn {
  background-color: #333;
  border-radius: 0 10px 10px 0;
  color: #76C162;
}
.footer .footer-content {
  padding-top: 100px;
  padding-bottom: 100px;
}
.footer .copyright {
  padding: 30px 0;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  display:none;
}

.justify-content-center p{margin-top: 15px;margin-bottom: 15px;}