@import url("https://fonts.googleapis.com/css2?family=Figtree:ital,wght@0,300..900;1,300..900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Outfit:wght@100..900&display=swap");


* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

a,
a:hover {
  text-decoration: none;
}

body {
  font-size: 20px;
  font-weight: 500;
  font-family: "Figtree", sans-serif;
  line-height: 28px;
  overflow-x: hidden !important;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "Figtree", sans-serif;
  font-weight: 700;
}

img {
  max-width: 100%;
  max-height: 100%;
}

.sp1 {
  padding: 130px 0 100px;
}

.sp2 {
  padding: 130px 0;
}

.sp3 {
  padding: 40px 0 20px;
}

.sp4 {
  padding: 100px 0 70px;
}

.sp5 {
  padding: 70px 0 70px;
}

.sp6 {
  padding: 30px 0 30px;
}

.sp7 {
  padding: 50px 0 50px;
}

.sp8 {
  padding: 80px 0 80px;
}

.space10 {
  height: 10px;
}

.space14 {
  height: 14px;
}

.space12 {
  height: 12px;
}

.space16 {
  height: 16px;
}

.space20 {
  height: 20px;
}

.space24 {
  height: 24px;
}

.space30 {
  height: 30px;
}

.space32 {
  height: 32px;
}

.space40 {
  height: 40px;
}

.space50 {
  height: 50px;
}

.space60 {
  height: 60px;
}

.space70 {
  height: 70px;
}

.space80 {
  height: 80px;
}

.space90 {
  height: 90px;
}

.space100 {
  height: 100px;
}

@keyframes animation-6 {
  0% {
    transform: rotate(0);
  }

  100% {
    transform: rotate(-1000deg);
  }
}

@keyframes animation-7 {
  0% {
    transform: rotate(0);
  }

  100% {
    transform: rotate(-1000deg);
  }
}

.keyframe5 {
  position: relative;
  animation-name: animation-7;
  animation-duration: 40s;
  animation-iteration-count: infinite;
  animation-direction: alternate;
  animation-timing-function: cubic-bezier(0.59, 0.59, 1, 1);
}

.keyframe4 {
  position: relative;
  animation-name: animation-6;
  animation-duration: 200s;
  animation-iteration-count: infinite;
  animation-direction: alternate;
  animation-timing-function: cubic-bezier(0.59, 0.59, 1, 1);
}

@keyframes marquee {
  0% {
    transform: translateX(0);
  }

  100% {
    transform: translatex(-100%);
  }
}

@keyframes marquee-2 {
  0% {
    transform: translateX(-100%);
  }

  100% {
    transform: translatex(0);
  }
}

@keyframes animation-4 {
  0% {
    transform: scale(1);
    transform: translateY(10px);
  }

  100% {
    transform: scale(1);
  }
}

.aniamtion-key-3 {
  position: relative;
  animation-name: animation-4;
  animation-duration: 2s;
  animation-iteration-count: infinite;
  animation-direction: alternate;
}

@keyframes preloader {
  0% {
    transform: scale(0, 0);
    opacity: 0.5;
  }

  100% {
    transform: scale(1, 1);
    opacity: 0;
  }
}

@keyframes fade-in-down {
  0% {
    transform: translate3d(0, -50px, 0);
  }

  100% {
    opacity: 1;
    transform: none;
  }
}

@keyframes animation-1 {
  0% {
    transform: translateY(0);
  }

  100% {
    transform: translateY(10px);
  }
}

@keyframes animation-2 {
  0% {
    transform: scale(1);
    transform: translateY(10px);
  }

  100% {
    transform: scale(1);
  }
}

.aniamtion-key-1 {
  position: relative;
  animation-name: animation-1;
  animation-duration: 2s;
  animation-iteration-count: infinite;
  animation-direction: alternate;
}

.aniamtion-key-2 {
  position: relative;
  animation-name: animation-2;
  animation-duration: 2s;
  animation-iteration-count: infinite;
  animation-direction: alternate;
}

@keyframes pulse-border {
  0% {
    transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1);
    opacity: 1;
  }

  100% {
    transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5);
    opacity: 0;
  }
}

@keyframes animation-5 {
  0% {
    transform: scale(1);
  }

  100% {
    transform: scale(1.1);
  }
}

.aniamtion-key-5 {
  position: relative;
  animation-name: animation-5;
  animation-duration: 1.3s;
  animation-iteration-count: infinite;
  animation-direction: alternate;
  transition: all 0.4s ease-in-out;
}

/*============= TYPHOGRAPHY CSS AREA ENDS===============*/
/*============= COMMON CSS AREA ===============*/
.heading1 h1 {
  color: var(--white-100, #FFF);
  text-align: center;
  font-family: "Figtree", sans-serif;
  font-size: 65px;
  font-style: normal;
  font-weight: 700;
  line-height: 75px;
  transition: all 0.4s ease-in-out;
  margin-bottom: 16px;
  text-transform: capitalize;
}

@media (max-width: 767px) {
  .heading1 h1 {
    font-size: 34px;
    line-height: 50px;
  }
}

.heading2 h2 {
  color: var(--Text-Color, #0D0E10);
  font-family: "Figtree", sans-serif;
  font-size: 44px;
  font-style: normal;
  font-weight: 700;
  transition: all 0.4s ease-in-out;
  line-height: 54px;
  text-transform: capitalize;
}

@media (max-width: 767px) {
  .heading2 h2 {
    font-size: 32px;
    line-height: 42px;
  }
}

.heading3 h1 {
  color: var(--white-100, #FFF);
  font-family: "Figtree", sans-serif;
  font-size: 45px;
  font-style: normal;
  font-weight: 700;
  transition: all 0.4s ease-in-out;
  line-height: 70px;
  text-transform: capitalize;
}

@media (max-width: 767px) {
  .heading3 h1 {
    font-size: 32px;
    line-height: 42px;
  }
}

.heading4 h2 {
  color: var(--Text-Color, #0D0E10);
  text-align: center;
  font-family: "Figtree", sans-serif;
  font-size: 40px;
  font-style: normal;
  font-weight: 700;
  line-height: 48px;
  transition: all 0.4s ease-in-out;
  text-transform: capitalize;
}

@media (max-width: 767px) {
  .heading4 h2 {
    font-size: 32px;
    line-height: 42px;
  }
}

.heading5 span.seo {
  font-size: 18px;
  font-weight: 500;
  color: #4B24EE;
  display: inline-block;
  border-radius: 4px;
  padding: 8px;
  transition: all 0.4s ease-in-out;
  line-height: 18px;
  background: #EDE9FD;
}

.heading5 h1 {
  font-family: "Figtree", sans-serif;
  font-size: 65px;
  line-height: 70px;
  font-weight: 700;
  transition: all 0.4s ease-in-out;
  color: var(--Text-Color, #0D0E10);
  text-transform: capitalize;
}

@media (max-width: 767px) {
  .heading5 h1 {
    font-size: 32px;
    line-height: 42px;
  }
}

.heading5 p {
  font-family: "Figtree", sans-serif;
  font-weight: 500;
  color: #676879;
  transition: all 0.4s ease-in-out;
  font-size: 16px;
  line-height: 26px;
}

.heading6 span.seo {
  font-size: 18px;
  font-weight: 500;
  color: #4B24EE;
  display: inline-block;
  border-radius: 4px;
  padding: 8px;
  transition: all 0.4s ease-in-out;
  line-height: 18px;
  background: #EDE9FD;
}

.heading6 h2 {
  font-family: "Figtree", sans-serif;
  font-size: 40px;
  line-height: 48px;
  font-weight: 700;
  color: var(--Text-Color, #0D0E10);
  transition: all 0.4s ease-in-out;
  text-transform: capitalize;
}

@media (max-width: 767px) {
  .heading6 h2 {
    font-size: 32px;
    line-height: 42px;
  }
}

.heading6 p {
  font-family: "Figtree", sans-serif;
  font-weight: 500;
  color: #676879;
  transition: all 0.4s ease-in-out;
  font-size: 16px;
  line-height: 26px;
}

.tags span {
  font-family: "Figtree", sans-serif;
  font-weight: 500;
  color: #010ca8;
  transition: all 0.4s ease-in-out;
  font-size: 16px;
  line-height: 16px;
  display: inline-block;
  padding: 8px 12px;
  border-radius: 32px;
  background: #F8F4FF;
}

.bg-none {
  background: none !important;
}

.tags2 span {
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-weight: 700;
  color: #581164;
  transition: all 0.4s ease-in-out;
  line-height: 16px;
  display: inline-block;
  background: #F7F3F7;
  padding: 8px;
  border-radius: 4px;
}

.tags2 span img {
  margin: -4px 6px 0 0;
}

.tags2 span p {
  font-size: 16px;
  font-weight: 500;
  color: #676879;
  font-family: "Figtree", sans-serif;
  line-height: 26px;
}

.tags3 span {
  font-weight: 500;
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  display: inline-block;
  color: #5C3EF4;
  padding: 8px 12px;
  border-radius: 32px;
  line-height: 16px;
  background: #E8E6F9;
}

/*============= COMMON CSS AREA ENDS ===============*/
/*============= HEADER CSS AREA ===============*/
.header-area.homepage1 {
  position: absolute;
  width: 100%;
  z-index: 9999;
}

.header-area {
  position: relative;
  z-index: 10000;
}

.header-area.homepage1 .navbar {
  display: block;
}

.header-area,
.mega-container {
  overflow: visible;
}

.header-area.homepage1 .header-elements {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 24px;
  background: var(--Liner, linear-gradient(92deg, rgba(255, 255, 255, 0.4) -10.29%, rgba(255, 255, 255, 0.1) 98.27%));
  padding: 10px 24px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 35px;
  transition: all 0.4s ease-in-out;
}

.header-area.homepage1 .header-elements .site-log {
  margin-top: 5px;
}

.header-area.homepage1 .header-elements .main-menu .nav-item .nav-link.active {
  background: none;
  color: var(--white-100, #FFF);
  opacity: 0.7;
}

.header-area.homepage1 .header-elements .main-menu ul li {
  display: inline-block;
  position: relative;
}

.header-area.homepage1 .header-elements .main-menu ul li:hover ul.dropdown-padding {
  visibility: visible;
  transition: all 0.5s ease-in-out;
  opacity: 1;
  z-index: 9;
  top: 50px;
  position: absolute;
}

.header-area.homepage1 .header-elements .main-menu ul li a {
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-weight: 500;
  color: var(--white-100, #FFF);
  display: inline-block;
  transition: all 0.4s ease-in-out;
  padding: 0 10px;
}

.header-area.homepage1 .header-elements .main-menu ul li ul.dropdown-padding {
  visibility: hidden;
  opacity: 0;
  box-shadow: rgba(0, 0, 0, 0.2) 0px 20px 30px;
  position: absolute;
  background: var(--white-100, #FFF);
  top: 100px;
  width: 220px;
  z-index: 1;
  transition: all 0.4s ease-in-out;
  border-radius: 5px;
  padding: 15px;
}

.header-area.homepage1 .header-elements .main-menu ul li ul.dropdown-padding li.main-small-menu {
  position: relative;
}

.header-area.homepage1 .header-elements .main-menu ul li ul.dropdown-padding li.main-small-menu:hover>a {
  color: #433CE7;
  transition: all 0.4s ease-in-out;
  padding-left: 25px;
}

.header-area.homepage1 .header-elements .main-menu ul li ul.dropdown-padding li.main-small-menu:hover>a::after {
  color: #433CE7;
  transition: all 0.4s ease-in-out;
  visibility: visible;
  opacity: 1;
}

.header-area.homepage1 .header-elements .main-menu ul li ul.dropdown-padding li.main-small-menu a {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.header-area.homepage1 .header-elements .main-menu ul li ul.dropdown-padding li.main-small-menu ul.small-dropdown {
  visibility: hidden;
  opacity: 0;
  box-shadow: rgba(0, 0, 0, 0.2) 0px 20px 30px;
  background: var(--white-100, #FFF);
  position: absolute;
  top: 70px;
  width: 220px;
  z-index: 1;
  left: 195px;
  transition: all 0.4s ease-in-out;
  border-radius: 5px;
  padding: 15px;
}

.header-area.homepage1 .header-elements .main-menu ul li ul.dropdown-padding li.main-small-menu:hover ul.small-dropdown {
  visibility: visible;
  transition: all 0.5s ease-in-out;
  opacity: 1;
  z-index: 9;
  top: 0;
  position: absolute;
}

.header-area.homepage1 .header-elements .main-menu ul li ul.dropdown-padding li {
  display: block;
}

.header-area.homepage1 .header-elements .main-menu ul li ul.dropdown-padding li a {
  font-family: "Figtree", sans-serif;
  font-weight: 500;
  color: var(--Text-Color, #0D0E10);
  padding: 8px;
  display: inline-block;
  position: relative;
  z-index: 1;
  border-radius: 4px;
  transition: all 0.4s ease-in-out;
}

.header-area.homepage1 .header-elements .main-menu ul li ul.dropdown-padding li a::after {
  position: absolute;
  content: "";
  height: 2px;
  width: 10px;
  transition: all 0.4s ease-in-out;
  z-index: -1;
  background: #433CE7;
  left: 10px;
  top: 22px;
  border-radius: 4px;
  display: inline-block;
  visibility: hidden;
  opacity: 0;
  transition: all 0.4s ease-in-out;
}

.header-area.homepage1 .header-elements .main-menu ul li ul.dropdown-padding li a:hover {
  transition: all 0.4s ease-in-out;
  color: #433CE7;
  padding-left: 25px;
}

.header-area.homepage1 .header-elements .main-menu ul li ul.dropdown-padding li a:hover::after {
  transition: all 0.4s ease-in-out;
  border-radius: 4px;
  visibility: visible;
  transition: all 0.4s ease-in-out;
  opacity: 1;
}

.header-area.homepage1 .navbar-expand {
  display: block;
}

.header-area.homepage1.sticky {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  transform: translate3d(0, 0, 0);
  z-index: 111;
  animation-name: fade-in-down;
  animation-duration: 1s;
  animation-fill-mode: forwards;
  background-color: var(--Text-Color, #0D0E10);
  transition: all 0.4s ease-in-out;
  z-index: 99;
}

.header-area.homepage1.sticky .header-elements {
  margin-top: 0;
  transform: all 0.4s ease-in-out;
  border: none;
  background: none;
  padding: 14px 0;
}

.header-area.homepage2 {
  position: absolute;
  width: 100%;
  z-index: 2;
}

.header-area.homepage2 .navbar {
  display: block;
}

.header-area.homepage2 .header-elements {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0px 0px;
  transition: all 0.4s ease-in-out;
  width: 100%;
}

.header-area.homepage2 .header-elements .site-logo {
  flex: 1 1 0%;
  display: flex;
  justify-content: flex-start;
  margin-top: 5px;
}

.header-area.homepage2 .header-elements .main-menu {
  flex: 0 0 auto;
  display: flex;
  justify-content: center;
  align-items: center;
}

.header-area.homepage2 .header-elements .header-buttons {
  flex: 1 1 0%;
  display: flex;
  justify-content: flex-end;
  align-items: center;
}

.header-area.homepage2 .header-elements .main-menu .nav-item .nav-link.active {
  background: none;
  color: #ffff;
}

.header-area.homepage2 .header-elements .main-menu ul li {
  display: inline-block;
  position: relative;
}

.header-area.homepage2 .header-elements .main-menu ul li:hover>a {
  color: #813ef9;
  transition: all 0.4s ease-in-out;
}

.header-area.homepage2 .header-elements .main-menu ul li:hover ul.dropdown-padding {
  visibility: visible;
  transition: all 0.5s ease-in-out;
  opacity: 1;
  z-index: 9;
  top: 50px;
  position: absolute;
}

.header-area.homepage2 {
  position: absolute;
  width: 100%;
  z-index: 2;
  background: #010ca8;
}

.header-area.homepage2 .header-elements .main-menu ul li a {
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 18px;
  font-weight: 600;
  color: #fff;
  display: inline-block;
  transition: all 0.4s ease-in-out;
  padding: 0 10px;
}

.header-area.homepage2 .header-elements .main-menu ul li ul.dropdown-padding {
  visibility: hidden;
  opacity: 0;
  box-shadow: rgba(0, 0, 0, 0.2) 0px 20px 30px;
  position: absolute;
  background: #fff;
  top: 100px;
  width: 220px;
  z-index: 1;
  transition: all 0.4s ease-in-out;
  border-radius: 5px;
  padding: 15px;
}

.header-area.homepage2 .header-elements .main-menu ul li ul.dropdown-padding li.main-small-menu {
  position: relative;
}

.header-area.homepage2 .header-elements .main-menu ul li ul.dropdown-padding li.main-small-menu:hover>a {
  color: #FC4B3E;
  transition: all 0.4s ease-in-out;
  padding-left: 25px;
}

.header-area.homepage2 .header-elements .main-menu ul li ul.dropdown-padding li.main-small-menu:hover>a::after {
  color: #FC4B3E;
  transition: all 0.4s ease-in-out;
  visibility: visible;
  opacity: 1;
}

.header-area.homepage2 .header-elements .main-menu ul li ul.dropdown-padding li.main-small-menu a {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.header-area.homepage2 .header-elements .main-menu ul li ul.dropdown-padding li.main-small-menu ul.small-dropdown {
  visibility: hidden;
  opacity: 0;
  box-shadow: rgba(0, 0, 0, 0.2) 0px 20px 30px;
  background: var(--white-100, #FFF);
  position: absolute;
  top: 70px;
  width: 220px;
  z-index: 1;
  left: 195px;
  transition: all 0.4s ease-in-out;
  border-radius: 5px;
  padding: 15px;
}

.header-area.homepage2 .header-elements .main-menu ul li ul.dropdown-padding li.main-small-menu:hover ul.small-dropdown {
  visibility: visible;
  transition: all 0.5s ease-in-out;
  opacity: 1;
  z-index: 9;
  top: 0;
  position: absolute;
}

.header-area.homepage2 .header-elements .main-menu ul li ul.dropdown-padding li {
  display: block;
}

.header-area.homepage2 .header-elements .main-menu ul li ul.dropdown-padding li a {
  font-family: "Figtree", sans-serif !important;
  ;
  font-weight: 500;
  color: var(--Text-Color, #0D0E10);
  padding: 8px;
  display: inline-block;
  position: relative;
  z-index: 1;
  border-radius: 4px;
  transition: all 0.4s ease-in-out;
}

.header-area.homepage2 .header-elements .main-menu ul li ul.dropdown-padding li a::after {
  position: absolute;
  content: "";
  height: 2px;
  width: 10px;
  transition: all 0.4s ease-in-out;
  z-index: -1;
  background: #FC4B3E;
  left: 10px;
  top: 22px;
  border-radius: 4px;
  display: inline-block;
  visibility: hidden;
  opacity: 0;
  transition: all 0.4s ease-in-out;
}

.header-area.homepage2 .header-elements .main-menu ul li ul.dropdown-padding li a:hover {
  transition: all 0.4s ease-in-out;
  color: #FC4B3E;
  padding-left: 25px;
}

.header-area.homepage2 .header-elements .main-menu ul li ul.dropdown-padding li a:hover::after {
  transition: all 0.4s ease-in-out;
  border-radius: 4px;
  visibility: visible;
  transition: all 0.4s ease-in-out;
  opacity: 1;
}

.header-area.homepage2 .header-elements .header-buttons .header-btn2 {
  margin: 0 7px 0 22px;
}

.header-area.homepage2.sticky {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  transform: translate3d(0, 0, 0);
  z-index: 111;
  animation-name: fade-in-down;
  animation-fill-mode: forwards;
  background-color: #010ca8;
  transition: all 0.4s ease-in-out;
  z-index: 99;
}

.header-area.homepage2.sticky .header-elements {
  margin-top: 0;
  transition: all 0.4s ease-in-out;
  border: none;
  background: none;
  padding: 0px 0;
}

.header-area.homepage3 {
  position: absolute;
  width: 100%;
  z-index: 2;
}

.header-area.homepage3 .navbar {
  display: block;
}

.header-area.homepage3 .header-elements {
  display: flex;
  align-self: center;
  justify-content: space-between;
  transition: all 0.4s ease-in-out;
  padding: 24px 0 0 0;
}

.header-area.homepage3 .header-elements .site-logo {
  margin-top: 14px;
}

.header-area.homepage3 .header-elements .main-menu {
  display: flex;
  align-items: center;
  padding: 12px 16px;
  transition: all 0.4s ease-in-out;
  background: #EDE9FD;
  border-radius: 4px;
}

.header-area.homepage3 .header-elements .main-menu .nav-item .nav-link.active {
  background: none;
  color: #4B24EE;
}

.header-area.homepage3 .header-elements .main-menu ul li {
  display: inline-block;
  position: relative;
}

.header-area.homepage3 .header-elements .main-menu ul li:hover>a {
  color: #4B24EE;
  transition: all 0.4s ease-in-out;
}

.header-area.homepage3 .header-elements .main-menu ul li:hover ul.dropdown-padding {
  visibility: visible;
  transition: all 0.5s ease-in-out;
  opacity: 1;
  z-index: 9;
  top: 50px;
  position: absolute;
}

.header-area.homepage3 .header-elements .main-menu ul li a {
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 16px;
  font-weight: 500;
  color: var(--Text-Color, #0D0E10);
  display: inline-block;
  transition: all 0.4s ease-in-out;
  padding: 0 10px;
}

.header-area.homepage3 .header-elements .main-menu ul li ul.dropdown-padding {
  visibility: hidden;
  opacity: 0;
  box-shadow: rgba(0, 0, 0, 0.2) 0px 20px 30px;
  position: absolute;
  background: var(--white-100, #FFF);
  top: 100px;
  width: 220px;
  z-index: 1;
  transition: all 0.4s ease-in-out;
  border-radius: 5px;
  padding: 15px;
}

.header-area.homepage3 .header-elements .main-menu ul li ul.dropdown-padding li.main-small-menu {
  position: relative;
}

.header-area.homepage3 .header-elements .main-menu ul li ul.dropdown-padding li.main-small-menu:hover>a {
  color: #4B24EE;
  transition: all 0.4s ease-in-out;
  padding-left: 25px;
}

.header-area.homepage3 .header-elements .main-menu ul li ul.dropdown-padding li.main-small-menu:hover>a::after {
  color: #FC4B3E;
  transition: all 0.4s ease-in-out;
  visibility: visible;
  opacity: 1;
}

.header-area.homepage3 .header-elements .main-menu ul li ul.dropdown-padding li.main-small-menu a {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.header-area.homepage3 .header-elements .main-menu ul li ul.dropdown-padding li.main-small-menu ul.small-dropdown {
  visibility: hidden;
  opacity: 0;
  box-shadow: rgba(0, 0, 0, 0.2) 0px 20px 30px;
  background: var(--white-100, #FFF);
  position: absolute;
  top: 70px;
  width: 220px;
  z-index: 1;
  left: 195px;
  transition: all 0.4s ease-in-out;
  border-radius: 5px;
  padding: 15px;
}

.header-area.homepage3 .header-elements .main-menu ul li ul.dropdown-padding li.main-small-menu:hover ul.small-dropdown {
  visibility: visible;
  transition: all 0.5s ease-in-out;
  opacity: 1;
  z-index: 9;
  top: 0;
  position: absolute;
}

.header-area.homepage3 .header-elements .main-menu ul li ul.dropdown-padding li {
  display: block;
}

.header-area.homepage3 .header-elements .main-menu ul li ul.dropdown-padding li a {
  font-family: "Figtree", sans-serif !important;
  ;
  font-weight: 500;
  color: var(--Text-Color, #0D0E10);
  padding: 8px;
  display: inline-block;
  position: relative;
  z-index: 1;
  border-radius: 4px;
  transition: all 0.4s ease-in-out;
}

.header-area.homepage3 .header-elements .main-menu ul li ul.dropdown-padding li a::after {
  position: absolute;
  content: "";
  height: 2px;
  width: 10px;
  transition: all 0.4s ease-in-out;
  z-index: -1;
  background: #4B24EE;
  left: 10px;
  top: 22px;
  border-radius: 4px;
  display: inline-block;
  visibility: hidden;
  opacity: 0;
  transition: all 0.4s ease-in-out;
}

.header-area.homepage3 .header-elements .main-menu ul li ul.dropdown-padding li a:hover {
  transition: all 0.4s ease-in-out;
  color: #4B24EE;
  padding-left: 25px;
}

.header-area.homepage3 .header-elements .main-menu ul li ul.dropdown-padding li a:hover::after {
  transition: all 0.4s ease-in-out;
  border-radius: 4px;
  visibility: visible;
  transition: all 0.4s ease-in-out;
  opacity: 1;
}

.header-area.homepage3 .header-elements .header-padding ul li a {
  padding: 0 14px;
}

.header-area.homepage3.sticky {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  transform: translate3d(0, 0, 0);
  z-index: 111;
  animation-name: fade-in-down;
  animation-fill-mode: forwards;
  background-color: var(--white-100, #FFF);
  box-shadow: 0px 4px 30px 0px rgba(0, 0, 0, 0.08);
  transition: all 0.4s ease-in-out;
  z-index: 99;
}

.header-area.homepage3.sticky .header-elements {
  margin-top: 0;
  transition: all 0.4s ease-in-out;
  border: none;
  background: none;
  padding: 14px 0;
}

.header-area.homepage3.sticky .header-elements .main-menu {
  background: none;
  transition: all 0.4s ease-in-out;
}

.header-area.homepage4 {
  position: absolute;
  width: 100%;
  z-index: 2;
}

.header-area.homepage4 .navbar {
  display: block;
}

.header-area.homepage4 .header-elements {
  display: flex;
  align-self: center;
  justify-content: space-between;
  padding: 16px 16px;
  transition: all 0.4s ease-in-out;
  background: var(--white-100, #FFF);
  border-radius: 0 0 4px 4px;
}

.header-area.homepage4 .header-elements .site-logo {
  margin-top: 5px;
  display: flex;
  align-items: center;
}

.header-area.homepage4 .header-elements .main-menu {
  display: flex;
  align-items: center;
  margin-left: 50px;
}

.header-area.homepage4 .header-elements .main-menu .nav-item .nav-link.active {
  background: none;
  color: #581164;
}

.header-area.homepage4 .header-elements .main-menu ul li {
  display: inline-block;
  position: relative;
}

.header-area.homepage4 .header-elements .main-menu ul li:hover>a {
  color: #581164;
  transition: all 0.4s ease-in-out;
}

.header-area.homepage4 .header-elements .main-menu ul li:hover ul.dropdown-padding {
  visibility: visible;
  transition: all 0.5s ease-in-out;
  opacity: 1;
  z-index: 9;
  top: 50px;
  position: absolute;
}

.header-area.homepage4 .header-elements .main-menu ul li a {
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 16px;
  font-weight: 500;
  color: var(--Text-Color, #0D0E10);
  display: inline-block;
  transition: all 0.4s ease-in-out;
  padding: 0 10px;
}

.header-area.homepage4 .header-elements .main-menu ul li ul.dropdown-padding {
  visibility: hidden;
  opacity: 0;
  box-shadow: rgba(0, 0, 0, 0.2) 0px 20px 30px;
  position: absolute;
  background: var(--white-100, #FFF);
  top: 100px;
  width: 220px;
  z-index: 1;
  transition: all 0.4s ease-in-out;
  border-radius: 5px;
  padding: 15px;
}

.header-area.homepage4 .header-elements .main-menu ul li ul.dropdown-padding li.main-small-menu {
  position: relative;
}

.header-area.homepage4 .header-elements .main-menu ul li ul.dropdown-padding li.main-small-menu:hover>a {
  color: #581164;
  transition: all 0.4s ease-in-out;
  padding-left: 25px;
}

.header-area.homepage4 .header-elements .main-menu ul li ul.dropdown-padding li.main-small-menu:hover>a::after {
  color: #581164;
  transition: all 0.4s ease-in-out;
  visibility: visible;
  opacity: 1;
}

.header-area.homepage4 .header-elements .main-menu ul li ul.dropdown-padding li.main-small-menu a {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.header-area.homepage4 .header-elements .main-menu ul li ul.dropdown-padding li.main-small-menu ul.small-dropdown {
  visibility: hidden;
  opacity: 0;
  box-shadow: rgba(0, 0, 0, 0.2) 0px 20px 30px;
  background: var(--white-100, #FFF);
  position: absolute;
  top: 70px;
  width: 220px;
  z-index: 1;
  left: 195px;
  transition: all 0.4s ease-in-out;
  border-radius: 5px;
  padding: 15px;
}

.header-area.homepage4 .header-elements .main-menu ul li ul.dropdown-padding li.main-small-menu:hover ul.small-dropdown {
  visibility: visible;
  transition: all 0.5s ease-in-out;
  opacity: 1;
  z-index: 9;
  top: 0;
  position: absolute;
}

.header-area.homepage4 .header-elements .main-menu ul li ul.dropdown-padding li {
  display: block;
}

.header-area.homepage4 .header-elements .main-menu ul li ul.dropdown-padding li a {
  font-family: "Figtree", sans-serif !important;
  ;
  font-weight: 500;
  color: var(--Text-Color, #0D0E10);
  padding: 8px;
  display: inline-block;
  position: relative;
  z-index: 1;
  border-radius: 4px;
  transition: all 0.4s ease-in-out;
}

.header-area.homepage4 .header-elements .main-menu ul li ul.dropdown-padding li a::after {
  position: absolute;
  content: "";
  height: 2px;
  width: 10px;
  transition: all 0.4s ease-in-out;
  z-index: -1;
  background: #581164;
  left: 10px;
  top: 22px;
  border-radius: 4px;
  display: inline-block;
  visibility: hidden;
  opacity: 0;
  transition: all 0.4s ease-in-out;
}

.header-area.homepage4 .header-elements .main-menu ul li ul.dropdown-padding li a:hover {
  transition: all 0.4s ease-in-out;
  color: #581164;
  padding-left: 25px;
}

.header-area.homepage4 .header-elements .main-menu ul li ul.dropdown-padding li a:hover::after {
  transition: all 0.4s ease-in-out;
  border-radius: 4px;
  visibility: visible;
  transition: all 0.4s ease-in-out;
  opacity: 1;
}

.header-area.homepage4 .header-elements .main-menu .header-btn2 {
  margin: 0 16px 0 22px;
}

.header-area.homepage4.sticky {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  transform: translate3d(0, 0, 0);
  z-index: 111;
  animation-name: fade-in-down;
  animation-fill-mode: forwards;
  background-color: var(--white-100, #FFF);
  box-shadow: 0px 4px 30px 0px rgba(0, 0, 0, 0.08);
  transition: all 0.4s ease-in-out;
  z-index: 99;
}

.header-area.homepage4.sticky .header-elements {
  padding: 14px;
  transition: all 0.4s ease-in-out;
}

.header-area.homepage5 {
  position: absolute;
  width: 100%;
  z-index: 9999;
}

.header-area.homepage5 .navbar {
  display: block;
}

.header-area.homepage5 .header-elements {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 24px;
  background: var(--Liner, linear-gradient(92deg, rgba(255, 255, 255, 0.4) -10.29%, rgba(255, 255, 255, 0.1) 98.27%));
  padding: 10px 24px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 35px;
  transition: all 0.4s ease-in-out;
}

.header-area.homepage5 .header-elements .site-log {
  margin-top: 5px;
}

.header-area.homepage5 .header-elements .main-menu .nav-item .nav-link.active {
  background: none;
  color: #5C3EF4;
}

.header-area.homepage5 .header-elements .main-menu ul li {
  display: inline-block;
  position: relative;
}

.header-area.homepage5 .header-elements .main-menu ul li:hover>a {
  color: #5C3EF4;
  transition: all 0.4s ease-in-out;
}

.header-area.homepage5 .header-elements .main-menu ul li:hover {
  color: #5C3EF4;
}

.header-area.homepage5 .header-elements .main-menu ul li:hover ul.dropdown-padding {
  visibility: visible;
  transition: all 0.5s ease-in-out;
  opacity: 1;
  z-index: 9;
  top: 50px;
  position: absolute;
}

.header-area.homepage5 .header-elements .main-menu ul li a {
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-weight: 500;
  color: var(--white-100, #FFF);
  display: inline-block;
  transition: all 0.4s ease-in-out;
  padding: 0 10px;
}

.header-area.homepage5 .header-elements .main-menu ul li ul.dropdown-padding {
  visibility: hidden;
  opacity: 0;
  box-shadow: rgba(0, 0, 0, 0.2) 0px 20px 30px;
  position: absolute;
  background: var(--white-100, #FFF);
  top: 100px;
  width: 220px;
  z-index: 1;
  transition: all 0.4s ease-in-out;
  border-radius: 5px;
  padding: 15px;
}

.header-area.homepage5 .header-elements .main-menu ul li ul.dropdown-padding li.main-small-menu {
  position: relative;
}

.header-area.homepage5 .header-elements .main-menu ul li ul.dropdown-padding li.main-small-menu:hover>a {
  color: #5C3EF4;
  transition: all 0.4s ease-in-out;
  padding-left: 25px;
}

.header-area.homepage5 .header-elements .main-menu ul li ul.dropdown-padding li.main-small-menu:hover>a::after {
  color: #5C3EF4;
  transition: all 0.4s ease-in-out;
  visibility: visible;
  opacity: 1;
}

.header-area.homepage5 .header-elements .main-menu ul li ul.dropdown-padding li.main-small-menu a {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.header-area.homepage5 .header-elements .main-menu ul li ul.dropdown-padding li.main-small-menu ul.small-dropdown {
  visibility: hidden;
  opacity: 0;
  box-shadow: rgba(0, 0, 0, 0.2) 0px 20px 30px;
  background: var(--white-100, #FFF);
  position: absolute;
  top: 70px;
  width: 220px;
  z-index: 1;
  left: 195px;
  transition: all 0.4s ease-in-out;
  border-radius: 5px;
  padding: 15px;
}

.header-area.homepage5 .header-elements .main-menu ul li ul.dropdown-padding li.main-small-menu:hover ul.small-dropdown {
  visibility: visible;
  transition: all 0.5s ease-in-out;
  opacity: 1;
  z-index: 9;
  top: 0;
  position: absolute;
}

.header-area.homepage5 .header-elements .main-menu ul li ul.dropdown-padding li {
  display: block;
}

.header-area.homepage5 .header-elements .main-menu ul li ul.dropdown-padding li a {
  font-family: "Figtree", sans-serif;
  font-weight: 500;
  color: var(--Text-Color, #0D0E10);
  padding: 8px;
  display: inline-block;
  position: relative;
  z-index: 1;
  border-radius: 4px;
  transition: all 0.4s ease-in-out;
}

.header-area.homepage5 .header-elements .main-menu ul li ul.dropdown-padding li a::after {
  position: absolute;
  content: "";
  height: 2px;
  width: 10px;
  transition: all 0.4s ease-in-out;
  z-index: -1;
  background: #5C3EF4;
  left: 10px;
  top: 22px;
  border-radius: 4px;
  display: inline-block;
  visibility: hidden;
  opacity: 0;
  transition: all 0.4s ease-in-out;
}

.header-area.homepage5 .header-elements .main-menu ul li ul.dropdown-padding li a:hover {
  transition: all 0.4s ease-in-out;
  color: #5C3EF4;
  padding-left: 25px;
}

.header-area.homepage5 .header-elements .main-menu ul li ul.dropdown-padding li a:hover::after {
  transition: all 0.4s ease-in-out;
  border-radius: 4px;
  visibility: visible;
  transition: all 0.4s ease-in-out;
  opacity: 1;
}

.header-area.homepage5 .navbar-expand {
  display: block;
}

.header-area.homepage5.sticky {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  transform: translate3d(0, 0, 0);
  z-index: 111;
  animation-name: fade-in-down;
  animation-duration: 1s;
  animation-fill-mode: forwards;
  background: var(--Text-Color, #0D0E10);
  transition: all 0.4s ease-in-out;
  z-index: 99;
}

.header-area.homepage5.sticky .header-elements {
  margin-top: 0;
  transform: all 0.4s ease-in-out;
  border: none;
  background: none;
}

/*============= HEADER CSS AREA ENDS===============*/
/*============= WELCOME CSS AREA ===============*/
.welocme1-section-area {
  position: relative;
  padding: 190px 0 400px;
}

@media (max-width: 767px) {
  .welocme1-section-area {
    padding: 120px 0 270px;
  }
}

.welocme1-section-area .welcome-content-header {
  text-align: center;
  position: relative;
  z-index: 2;
}

.welocme1-section-area .welcome-content-header .elementors-img {
  position: absolute;
  top: -175px;
  left: 15%;
  right: 15%;
  z-index: -1;
}

.welocme1-section-area .welcome-content-header p {
  color: var(--white-100, #FFF);
  text-align: center;
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 28px;
  opacity: 0.8;
}

.welocme1-section-area .welcome-content-header h1 {
  color: var(--white-100, #FFF);
  text-align: center;
  font-family: "Figtree", sans-serif;
  font-size: 65px;
  font-style: normal;
  font-weight: 700;
  line-height: 75px;
  margin-bottom: 16px;
  position: relative;
}

@media (max-width: 767px) {
  .welocme1-section-area .welcome-content-header h1 {
    font-size: 34px;
    line-height: 50px;
  }
}

.welocme1-section-area .welcome-content-header .welcome-btnarea .header-btn {
  margin-top: 32px;
}

.welocme1-section-area .welcome-content-header .welcome-btnarea .header-btn1 {
  margin-top: 32px;
  margin-left: 16px;
}

@media (max-width: 767px) {
  .welocme1-section-area .welcome-content-header .welcome-btnarea .header-btn1 {
    margin-left: 0;
  }
}

.welcome2-section-area {
  padding: 190px 0 76px;
  position: relative;
}

@media (max-width: 767px) {
  .welcome2-section-area {
    padding: 120px 0 70px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .welcome2-section-area {
    padding: 150px 0 0;
  }
}

.welcome2-section-area .welcome2-header {
  /* padding: 0 35px 0 0; */
}

@media (max-width: 767px) {
  .welcome2-section-area .welcome2-header {
    padding: 0;
  }
}

.welcome2-section-area .welcome2-header span {
  display: inline-block;
  background: var(--Title-Liner, linear-gradient(92deg, rgba(255, 255, 255, 0.4) -119.44%, rgba(255, 255, 255, 0.1) 98.36%));
  color: var(--white-100, #FFF);
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  padding: 8px 12px;
  border-radius: 35px;
  margin-bottom: 16px;
}

.welcome2-section-area .welcome2-header p {
  color: rgba(255, 255, 255, 0.8);
  font-family: "Figtree", sans-serif;
  font-size: 18px;
  font-style: normal;
  font-weight: 500;
  line-height: 28px;
  margin-top: 16px;
}

.welcome2-section-area .welcome2-header .header-btn2 {
  margin-top: 32px;
}

.welcome2-section-area .welcome2-header .header-btn3 {
  margin-top: 32px;
  margin-left: 16px;
}

@media (max-width: 767px) {
  .welcome2-section-area .welcome2-header .header-btn3 {
    margin-left: 0;
  }
}

.welcome2-section-area .header-images-area {
  position: relative;
}

@media (max-width: 767px) {
  .welcome2-section-area .header-images-area {
    margin-top: 30px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .welcome2-section-area .header-images-area {
    margin-top: 30px;
  }
}

/* .welcome2-section-area .header-images-area .header-elements1 {
  position: absolute;
} */
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .welcome2-section-area .header-images-area .header-elements1 {
    height: 100%;
    width: 100%;
  }
}

.welcome2-section-area .header-images-area .header-elements1 img {
  height: 100%;
  width: 100%;
  -o-object-fit: contain;
  object-fit: contain;
}

.welcome2-section-area .header-images-area .header-elements2 {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  position: relative;
  z-index: 1;
}

.welcome2-section-area .header-images-area .header-elements2 img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

.welcome3-section-area {
  padding: 170px 0 200px;
  position: relative;
}

@media (max-width: 767px) {
  .welcome3-section-area {
    padding: 150px 0 50px;
  }
}

.welcome3-section-area .welcome3-header .unlock {
  display: inline-block;
  font-size: 16px;
  font-weight: 700;
  color: #4B24EE;
  font-family: "Figtree", sans-serif;
  padding: 16px;
  text-decoration: underline;
  line-height: 16px;
}

@media (max-width: 767px) {
  .welcome3-section-area .welcome3-header {
    margin-bottom: 30px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .welcome3-section-area .welcome3-header {
    margin-bottom: 30px;
  }
}

.welcome3-section-area .welcome3-images {
  position: relative;
}

.welcome3-section-area .welcome3-images .header3-img2 {
  position: absolute;
  width: 235px;
  height: 201px;
  -o-object-fit: cover;
  object-fit: cover;
  left: -100px;
  bottom: -100px;
}

@media (max-width: 767px) {
  .welcome3-section-area .welcome3-images .header3-img2 {
    position: relative;
    width: 100%;
    height: 100%;
    margin-top: 20px;
    left: 0;
    bottom: 0;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .welcome3-section-area .welcome3-images .header3-img2 {
    position: relative;
    width: 100%;
    height: 100%;
    margin-top: 20px;
    left: 0;
    bottom: 0;
  }
}

.welcome3-section-area .welcome3-images img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

.welcome4-section-area {
  position: relative;
  padding: 150px 0 60px;
}

@media (max-width: 767px) {
  .welcome4-section-area {
    padding: 150px 0 0;
  }
}

.welcome4-section-area .welcome4-header.heading5 {
  position: relative;
  padding: 0 45px 0 0;
}

.welcome4-section-area .welcome4-header.heading5 p {
  color: var(--Text-Color, #0D0E10);
}

@media (max-width: 767px) {
  .welcome4-section-area .welcome4-header.heading5 {
    padding: 0;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .welcome4-section-area .welcome4-header.heading5 {
    padding: 0;
  }
}

.welcome4-section-area .welcome4-header.heading5 span {
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-weight: 700;
  color: #581164;
  transition: all 0.4s ease-in-out;
  line-height: 16px;
  display: inline-block;
  background: #E7D8ED;
  padding: 8px;
  border-radius: 4px;
}

.welcome4-section-area .welcome4-header.heading5 span img {
  margin: -4px 6px 0 0;
}

.welcome4-section-area .welcome4-header.heading5 span p {
  font-size: 16px;
  font-weight: 500;
  color: #000 !important;
  font-family: "Figtree", sans-serif;
  line-height: 26px;
}

.welcome4-section-area .welcome4-header.heading5 .btn-area .header-btn6 {
  text-decoration: underline;
}

.welcome4-section-area .welcome4-header.heading5 .btn-area .header-btn6 i {
  margin: 0 6px 0 0;
}

.welcome4-section-area .welcome4-images-area {
  position: relative;
}

.welcome4-section-area .welcome4-images-area .main-img {
  position: relative;
  z-index: 1;
}

.welcome4-section-area .welcome4-images-area .main-img img {
  height: 100%;
  width: 100%;
  border-radius: 4px;
  position: relative;
  z-index: 1;
}

.welcome4-section-area .welcome4-images-area .main-img .header4-bg2 {
  position: absolute;
  height: 420px;
  width: 420px;
  -o-object-fit: cover;
  object-fit: cover;
  left: 13%;
  top: 26%;
  border-radius: 50%;
  z-index: -1;
}

@media (max-width: 767px) {
  .welcome4-section-area .welcome4-images-area .main-img .header4-bg2 {
    position: absolute;
    width: 250px;
    left: 40px;
    top: 22%;
    height: 250px;
  }
}

.welcome4-section-area .welcome4-images-area .header4-img1 {
  height: 136px;
  width: 288px;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 4px;
  position: absolute;
  top: 40%;
  right: -50px;
  z-index: 2;
}

@media (max-width: 767px) {
  .welcome4-section-area .welcome4-images-area .header4-img1 {
    position: relative;
    width: 100%;
    left: 0;
    top: 20px;
    height: 100%;
    right: 0;
  }
}

.welcome4-section-area .welcome4-images-area .header4-img2 {
  height: 250px;
  width: 250px;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 4px;
  position: absolute;
  bottom: 50px;
  left: -50px;
  z-index: 1;
}

@media (max-width: 767px) {
  .welcome4-section-area .welcome4-images-area .header4-img2 {
    position: relative;
    width: 100%;
    left: 0;
    top: -40px;
    height: 100%;
  }
}

.welcome4-section-area .welcome4-images-area .header4-elements {
  position: absolute;
  top: 37%;
  left: -50px;
}

@media (max-width: 767px) {
  .welcome4-section-area .welcome4-images-area .header4-elements {
    display: none;
  }
}

.welcome4-section-area .welcome4-images-area p {
  color: var(--Text-Color, #0D0E10);
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-weight: 700;
  display: inline-block;
  background: var(--white-100, #FFF);
  padding: 8px;
  line-height: 16px;
  border-radius: 4px;
  position: absolute;
  bottom: 80px;
  right: -30px;
  z-index: 1;
}

.welcome4-section-area .welcome4-images-area p span {
  color: #581164;
}

@media (max-width: 767px) {
  .welcome4-section-area .welcome4-images-area p {
    position: relative;
    left: 0;
  }
}

.welcome5-section-area {
  padding: 60px 0 60px;
  position: relative;
  z-index: 1;
}

.welcome5-section-area .elements1 {
  position: absolute;
  top: 10%;
  z-index: -1;
}

.welcome5-section-area .elements2 {
  position: absolute;
  top: 35%;
  left: 100px;
  z-index: -1;
}

.welcome5-section-area .elements3 {
  position: absolute;
  right: 0px;
  top: 10%;
  z-index: -1;
}

.welcome5-section-area .elements4 {
  position: absolute;
  top: 35%;
  right: 0;
  z-index: -1;
  transform: rotate(180deg);
}

.welcome5-section-area .welcome5-header-area {
  margin-top: 120px;
}

.welcome5-section-area .welcome5-header-area .header-btn9 {
  margin-left: 16px;
}

@media (max-width: 767px) {
  .welcome5-section-area .welcome5-header-area .header-btn9 {
    margin-left: 0;
    margin-top: 20px;
  }
}

.welcome5-section-area .welcome5-images-area {
  position: relative;
  z-index: 1;
}

.welcome5-section-area .welcome5-images-area .img1 img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 4px;
}

.welcome5-section-area .welcome5-images-area .img1 .header5-img2 {
  height: 190px;
  width: 258px;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 4px;
  position: absolute;
  bottom: 50px;
  right: 0;
}

@media (max-width: 767px) {
  .welcome5-section-area .welcome5-images-area .img1 .header5-img2 {
    height: 100%;
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    border-radius: 4px;
    position: relative;
    top: 20px;
  }
}

.welcome5-section-area .welcome5-images-area .content-elements {
  text-align: center;
  position: absolute;
  bottom: 200px;
  right: -157px;
  z-index: -1;
}

@media (max-width: 767px) {
  .welcome5-section-area .welcome5-images-area .content-elements {
    display: none;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .welcome5-section-area .welcome5-images-area .content-elements {
    display: none;
  }
}

.welcome5-section-area .welcome5-images-area .content-elements p {
  color: var(--white-100, #FFF);
  font-size: 24px;
  line-height: 28px;
  font-weight: 700;
  font-family: "Figtree", sans-serif;
}

.welcome5-section-area .welcome5-images-area .content-elements img {
  position: relative;
  right: 30px;
  top: 10px;
}

.welcome5-section-area .welcome5-images-area .content1-elements {
  text-align: center;
  position: absolute;
  top: 120px;
  left: -100px;
  z-index: -1;
}

@media (max-width: 767px) {
  .welcome5-section-area .welcome5-images-area .content1-elements {
    display: none;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .welcome5-section-area .welcome5-images-area .content1-elements {
    display: none;
  }
}

.welcome5-section-area .welcome5-images-area .content1-elements p {
  color: var(--white-100, #FFF);
  font-size: 24px;
  line-height: 28px;
  font-weight: 700;
  font-family: "Figtree", sans-serif;
  text-align: center;
  position: relative;
  left: -140px;
}

.welcome5-section-area .welcome5-images-area .content1-elements img {
  position: relative;
  top: 10px;
}

.welcome5-section-area .welcome5-images-area .content2-elements {
  text-align: center;
  position: absolute;
  bottom: 170px;
  left: -50px;
  z-index: -1;
}

@media (max-width: 767px) {
  .welcome5-section-area .welcome5-images-area .content2-elements {
    display: none;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .welcome5-section-area .welcome5-images-area .content2-elements {
    display: none;
  }
}

.welcome5-section-area .welcome5-images-area .content2-elements p {
  color: var(--white-100, #FFF);
  font-size: 24px;
  line-height: 28px;
  font-weight: 700;
  font-family: "Figtree", sans-serif;
  position: relative;
  left: -50px;
}

.welcome5-section-area .welcome5-images-area .content2-elements img {
  position: relative;
  left: 0px;
  top: 10px;
}

/*============= WELCOME CSS AREA ENDS ===============*/
/*============= PRELOADER CSS AREA===============*/
#preloader {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: var(--white-100, #FFF);
  z-index: 999999;
}

.preloader {
  width: 70px;
  height: 70px;
  display: inline-block;
  padding: 0px;
  text-align: left;
  box-sizing: border-box;
  position: absolute;
  top: 50%;
  left: 50%;
  margin-left: -25px;
  margin-top: -25px;
}

.preloader span {
  position: absolute;
  display: inline-block;
  width: 70px;
  height: 70px;
  border-radius: 100%;
  background: #433CE7;
  animation: preloader 1.3s linear infinite;
}

.preloader span:last-child {
  animation-delay: -0.8s;
  -webkit-animation-delay: -0.8s;
}

#preloader {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: var(--white-100, #FFF);
  z-index: 999999;
}

.preloader4 {
  width: 70px;
  height: 70px;
  display: inline-block;
  padding: 0px;
  text-align: left;
  box-sizing: border-box;
  position: absolute;
  top: 50%;
  left: 50%;
  margin-left: -25px;
  margin-top: -25px;
}

.preloader4 span {
  position: absolute;
  display: inline-block;
  width: 70px;
  height: 70px;
  border-radius: 100%;
  background: #581164;
  animation: preloader 1.3s linear infinite;
}

.preloader4 span:last-child {
  animation-delay: -0.8s;
  -webkit-animation-delay: -0.8s;
}

.progress-wrap {
  position: fixed;
  right: 30px;
  bottom: 30px;
  height: 56px;
  width: 56px;
  cursor: pointer;
  display: block;
  border-radius: 50px;
  box-shadow: inset 0 0 0 2px rgba(0, 0, 0, 0.1);
  z-index: 10000;
  opacity: 0;
  visibility: hidden;
  transform: translateY(15px);
  transition: all 200ms linear;
}

.progress-wrap.active-progress {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.progress-wrap::after {
  position: absolute;
  font-family: "FontAwesome";
  content: "\f062";
  text-align: center;
  line-height: 56px;
  font-size: 18px;
  color: #433CE7;
  left: 0;
  top: 0;
  height: 56px;
  width: 56px;
  cursor: pointer;
  display: block;
  z-index: 1;
  transition: all 200ms linear;
}

.progress-wrap:hover::after {
  opacity: 0;
}

.progress-wrap::before {
  position: absolute;
  font-family: "FontAwesome";
  content: "\f062";
  text-align: center;
  line-height: 56px;
  font-size: 18px;
  opacity: 0;
  left: 0;
  top: 0;
  height: 56px;
  width: 56px;
  cursor: pointer;
  display: block;
  z-index: 2;
  transition: all 200ms linear;
}

.progress-wrap:hover::before {
  opacity: 1;
}

.progress-wrap svg path {
  fill: none;
}

.progress-wrap svg.progress-circle path {
  stroke: #433CE7;
  stroke-width: 4;
  box-sizing: border-box;
  transition: all 200ms linear;
}

.progress-wrap.active-progress {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

/*============= PRELOADER CSS AREA ENDS===============*/
/*============= BUTTON CSS AREA ===============*/
a.header-btn {
  display: inline-block;
  border-radius: 25px;
  background: #813ef9;
  color: var(--white-100, #FFF);
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 16px;
  padding: 16px 28px;
  transition: all 0.4s ease-in-out;
  position: relative;
  z-index: 1;
}

a.header-btn::after {
  position: absolute;
  content: "";
  left: 50%;
  right: 50%;
  height: 20px;
  width: 20px;
  top: 14px;
  border-radius: 50%;
  background: #2921D3;
  visibility: hidden;
  opacity: 0;
  z-index: -1;
  transition: all 0.4s ease-in-out;
}

a.header-btn:hover {
  transform: translateY(-5px);
  transition: all 0.4s ease-in-out;
}

a.header-btn:hover::after {
  visibility: visible;
  opacity: 1;
  height: 100%;
  width: 100%;
  transition: all 0.4s ease-in-out;
  z-index: -1;
  border-radius: 25px;
  left: 0;
  top: 0;
}

a.header-btn i {
  margin-left: 4px;
  transform: rotate(-45deg);
}

a.header-btn1 {
  display: inline-block;
  border-radius: 25px;
  border: 1px solid var(--white-100, #FFF);
  color: var(--white-100, #FFF);
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 16px;
  padding: 16px 28px;
  transition: all 0.4s ease-in-out;
  position: relative;
  z-index: 1;
}

a.header-btn1::after {
  position: absolute;
  content: "";
  left: 50%;
  right: 50%;
  height: 20px;
  width: 20px;
  top: 14px;
  border-radius: 50%;
  background: #2921D3;
  border: 1px solid #2921D3;
  visibility: hidden;
  opacity: 0;
  z-index: -1;
  transition: all 0.4s ease-in-out;
}

a.header-btn1:hover {
  transform: translateY(-5px);
  transition: all 0.4s ease-in-out;
  border: 1px solid #2921D3;
}

a.header-btn1:hover::after {
  visibility: visible;
  opacity: 1;
  height: 100%;
  width: 100%;
  transition: all 0.4s ease-in-out;
  z-index: -1;
  border-radius: 25px;
  left: 0;
  top: 0;
}

a.header-btn1 i {
  margin-left: 4px;
  transform: rotate(-45deg);
}

.header-btn2 {
  border-radius: 10px;
  border: 2px solid #fff;
  color: var(--white-100, #FFF);
  text-align: center;
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 16px;
  display: inline-block;
  padding: 10px 24px;
  /* transition: all 0.4s ease-in-out; */
  z-index: 1;
  position: relative;
}

.header-btn2::after {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  left: 35px;
  top: 15px;
  z-index: -1;
  /* transition: all 0.4s ease-in-out; */
  background: #fff;
  border-radius: 10px;
  visibility: hidden;
  opacity: 0;
}

.header-btn2:hover {
  background: #1d4ed8 !important;
  color: #ffffff !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 6px 20px rgba(37, 99, 235, 0.35) !important;
}

.header-btn2:hover::after {
  height: 100%;
  width: 100%;
  border-radius: 10px;
  left: 0;
  top: 0;
  visibility: visible;
  opacity: 1;
}

.header-btn3 {
  border-radius: 10px;
  border: 2px solid #fff;
  color: var(--white-100, #FFF);
  text-align: center;
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 16px;
  display: inline-block;
  padding: 10px 24px;
  /* transition: all 0.4s ease-in-out; */
  z-index: 1;
  position: relative;
}

.header-btn3::after {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  left: 35px;
  top: 15px;
  z-index: -1;
  /* transition: all 0.4s ease-in-out; */
  background: #fff;
  border-radius: 10px;
  visibility: hidden;
  opacity: 0;
}

.header-btn3:hover {
  background: #1d4ed8 !important;
  color: #ffffff !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 6px 20px rgba(37, 99, 235, 0.35) !important;
}

.header-btn3:hover::after {
  height: 100%;
  width: 100%;
  border: 2px solid #fff;
  transition: all 0.3s ease-in-out;
  border-radius: 10px;
  left: 0;
  top: 0;
  visibility: visible;
  opacity: 1;
}

.header-btn4 {
  font-family: "Figtree", sans-serif;
  font-weight: 700;
  font-size: 16px;
  color: var(--Text-Color, #0D0E10);
  display: inline-block;
  padding: 16px;
  transition: all 0.4s ease-in-out;
}

.header-btn4:hover {
  color: #4B24EE;
  transition: all 0.4s ease-in-out;
}

.header-btn5 {
  font-family: "Figtree", sans-serif;
  font-weight: 700;
  font-size: 16px;
  color: var(--white-100, #FFF);
  display: inline-block;
  position: relative;
  z-index: 1;
  line-height: 16px;
  padding: 16px;
  border-radius: 5px;
  background: #4B24EE;
  transition: all 0.4s ease-in-out;
}

.header-btn5::after {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  left: 44%;
  bottom: 0;
  right: 44%;
  top: 35%;
  background: #EDE9FD;
  transition: all 0.4s ease-in-out;
  border-radius: 50%;
  z-index: -1;
  visibility: hidden;
  opacity: 0;
}

.header-btn5:hover {
  color: #4B24EE;
  transition: all 0.4s ease-in-out;
}

.header-btn5:hover::after {
  height: 100%;
  width: 100%;
  border-radius: 4px;
  transition: all 0.4s ease-in-out;
  left: 0;
  visibility: visible;
  opacity: 1;
  top: 0;
}

.header-btn6 {
  font-family: "Figtree", sans-serif;
  font-weight: 700;
  font-size: 16px;
  color: #581164;
  display: inline-block;
  position: relative;
  z-index: 1;
  line-height: 16px;
  padding: 16px;
  border-radius: 5px;
  transition: all 0.4s ease-in-out;
}

.header-btn6:hover {
  color: #43054E;
  transition: all 0.4s ease-in-out;
}

.header-btn7 {
  font-family: "Figtree", sans-serif;
  font-weight: 700;
  font-size: 16px;
  color: var(--white-100, #FFF);
  display: inline-block;
  position: relative;
  z-index: 1;
  line-height: 16px;
  padding: 16px;
  border-radius: 5px;
  background: #581164;
  transition: all 0.4s ease-in-out;
}

.header-btn7::after {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  left: 44%;
  bottom: 0;
  right: 44%;
  top: 35%;
  background: #43054E;
  transition: all 0.4s ease-in-out;
  border-radius: 50%;
  z-index: -1;
  visibility: hidden;
  opacity: 0;
}

.header-btn7:hover {
  color: var(--white-100, #FFF);
  transition: all 0.4s ease-in-out;
  transform: translateY(-5px);
}

.header-btn7:hover::after {
  height: 100%;
  width: 100%;
  border-radius: 4px;
  transition: all 0.4s ease-in-out;
  left: 0;
  visibility: visible;
  opacity: 1;
  top: 0;
}

a.header-btn8 {
  display: inline-block;
  border-radius: 25px;
  background: #5C3EF4;
  color: var(--white-100, #FFF);
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 16px;
  padding: 16px 28px;
  transition: all 0.4s ease-in-out;
  position: relative;
  z-index: 1;
}

a.header-btn8::after {
  position: absolute;
  content: "";
  left: 50%;
  right: 50%;
  height: 20px;
  width: 20px;
  top: 14px;
  border-radius: 50%;
  background: #745DE6;
  visibility: hidden;
  opacity: 0;
  z-index: -1;
  transition: all 0.4s ease-in-out;
}

a.header-btn8:hover {
  transform: translateY(-5px);
  transition: all 0.4s ease-in-out;
}

a.header-btn8:hover::after {
  visibility: visible;
  opacity: 1;
  height: 100%;
  width: 100%;
  transition: all 0.4s ease-in-out;
  z-index: -1;
  border-radius: 25px;
  left: 0;
  top: 0;
}

a.header-btn8 i {
  margin-left: 4px;
  transform: rotate(-45deg);
}

a.header-btn9 {
  display: inline-block;
  border-radius: 25px;
  background: none;
  color: var(--white-100, #FFF);
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 16px;
  padding: 16px 28px;
  transition: all 0.4s ease-in-out;
  position: relative;
  border: 1px solid var(--white-100, #FFF);
  z-index: 1;
}

a.header-btn9::after {
  position: absolute;
  content: "";
  left: 50%;
  right: 50%;
  height: 20px;
  width: 20px;
  top: 14px;
  border-radius: 50%;
  background: #5C3EF4;
  visibility: hidden;
  opacity: 0;
  z-index: -1;
  transition: all 0.4s ease-in-out;
}

a.header-btn9:hover {
  transform: translateY(-5px);
  transition: all 0.4s ease-in-out;
  border: 1px solid #5C3EF4;
}

a.header-btn9:hover::after {
  visibility: visible;
  opacity: 1;
  height: 100%;
  width: 100%;
  transition: all 0.4s ease-in-out;
  z-index: -1;
  border-radius: 25px;
  left: 0;
  top: 0;
}

a.header-btn9 i {
  margin-left: 4px;
  transform: rotate(-45deg);
}

/*============= BUTTON CSS AREA ENDS ===============*/
/*============= TESTIMONIAL CSS AREA ===============*/
.swiper-3d .swiper-slide-shadow-right {
  background: none;
}

.swiper-3d .swiper-slide-shadow-left {
  background: none;
}

.swiper-container {
  width: 100%;
  height: 100%;
  position: relative;
  bottom: 170px;
  z-index: 2;
}

@media (max-width: 767px) {
  .swiper-container {
    height: 200px;
  }
}

.swiper-container .swiper-slide {
  transform: none !important;
}

.swiper-container .swiper-slide-duplicate {
  transform: none !important;
}

.swiper-container .swiper-slide-next {
  transform: none !important;
  position: relative;
  right: -35px;
}

.swiper-container .swiper-slide-active {
  position: relative;
  transform: scale(1.5) !important;
}

.swiper-container .swiper-slide-prev {
  transform: none !important;
  position: relative;
  left: -35px;
}

.swiper-container .swiper-pagination {
  position: relative;
  top: 110px;
}

@media (max-width: 767px) {
  .swiper-container .swiper-pagination {
    top: 40px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .swiper-container .swiper-pagination {
    top: 70px;
  }
}

.swiper-slide {
  background-position: center;
  background-size: cover;
}

.swiper-slide .entity-img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

.swiper-pagination-bullets .swiper-pagination-bullet {
  background: transparent;
  border: none;
  color: inherit;
  padding: 0 !important;
  font: inherit;
  height: 8px;
  line-height: 10px;
  width: 8px;
  margin: 0 6px;
  border: none;
  border-radius: 50%;
  padding: 5px;
  margin: 5px;
  background-color: #2921D3;
  position: relative;
  border: 2px solid #2921D3;
}

.swiper-pagination-bullets .swiper-pagination-bullet::after {
  position: absolute;
  content: "";
  height: 14px;
  width: 14px;
  border: 1px solid #2921D3;
  z-index: -1;
  border-radius: 50%;
  left: -5px;
  top: -5px;
  transition: all 0.3s;
  visibility: hidden;
  opacity: 0;
}

.swiper-pagination-bullets .swiper-pagination-bullet-active {
  background: #2921D3;
}

.swiper-pagination-bullets .swiper-pagination-bullet-active::after {
  visibility: visible;
  opacity: 1;
}

@media (max-width: 767px) {
  .testimonial1-section-area {
    padding: 50px 0 50px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .testimonial1-section-area {
    padding: 50px 0 50px;
  }
}

.testimonial1-section-area .testimonial1-header span {
  color: #433CE7;
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  display: inline-block;
  margin-bottom: 16px;
}

.testimonial1-section-area .testimonial-sliders .testimonial-content-slider .testimonial-slider-boxarea {
  padding: 0 30px 0 0;
}

@media (max-width: 767px) {
  .testimonial1-section-area .testimonial-sliders .testimonial-content-slider .testimonial-slider-boxarea {
    padding: 0;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .testimonial1-section-area .testimonial-sliders .testimonial-content-slider .testimonial-slider-boxarea {
    padding: 0;
  }
}

.testimonial1-section-area .testimonial-sliders .testimonial-content-slider .testimonial-slider-boxarea .testimonila-img {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.testimonial1-section-area .testimonial-sliders .testimonial-content-slider .testimonial-slider-boxarea .testimonila-img ul li {
  display: inline-block;
}

.testimonial1-section-area .testimonial-sliders .testimonial-content-slider .testimonial-slider-boxarea .testimonila-img ul li a {
  color: #433CE7;
}

.testimonial1-section-area .testimonial-sliders .testimonial-content-slider .testimonial-slider-boxarea .testimonila-img .mans-slider-info {
  display: flex;
  align-items: center;
}

.testimonial1-section-area .testimonial-sliders .testimonial-content-slider .testimonial-slider-boxarea .testimonila-img .mans-slider-info .content {
  padding-left: 16px;
}

.testimonial1-section-area .testimonial-sliders .testimonial-content-slider .testimonial-slider-boxarea .testimonila-img .mans-slider-info .content a {
  color: var(--Text-Color, #0D0E10);
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 16px;
  display: inline-block;
  margin-bottom: 8px;
}

.testimonial1-section-area .testimonial-sliders .testimonial-content-slider .testimonial-slider-boxarea .testimonila-img .mans-slider-info .content p {
  color: #676879;
  font-family: "Figtree", sans-serif;
  font-size: 12px;
  font-style: normal;
  font-weight: 500;
  line-height: 12px;
}

.testimonial1-section-area .testimonial-sliders .testimonial-content-slider .testimonial-slider-boxarea .testimonial5-all-content p {
  color: #676879;
  font-family: "Figtree", sans-serif;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: 32px;
  margin-top: 24px;
}

.testimonial1-section-area .testimonial-sliders .testimonial-arrows {
  display: flex;
  align-items: center;
  margin-top: 24px;
}

@media (max-width: 767px) {
  .testimonial1-section-area .testimonial-sliders .testimonial-arrows {
    margin-bottom: 30px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .testimonial1-section-area .testimonial-sliders .testimonial-arrows {
    margin-bottom: 30px;
  }
}

.testimonial1-section-area .testimonial-sliders .testimonial-arrows button:hover {
  background: #433CE7;
  transition: all 0.4s ease-in-out;
  color: var(--white-100, #FFF);
}

.testimonial1-section-area .testimonial-sliders .testimonial-arrows .testimonial-prev-arrow button {
  height: 40px;
  width: 40px;
  border-radius: 50%;
  line-height: 40px;
  background: #D9D8FA;
  border: none;
  outline: none;
  margin: 0 16px 0 0;
  transition: all 0.4s ease-in-out;
}

.testimonial1-section-area .testimonial-sliders .testimonial-arrows .testimonial-prev-arrow button:hover {
  background: #433CE7;
  transition: all 0.4s ease-in-out;
}

.testimonial1-section-area .testimonial-sliders .testimonial-arrows .testimonial-next-arrow button {
  height: 40px;
  width: 40px;
  border-radius: 50%;
  line-height: 40px;
  background: #D9D8FA;
  border: none;
  outline: none;
  transition: all 0.4s ease-in-out;
}

.testimonial1-section-area .testimonial-sliders .testimonial-arrows .testimonial-next-arrow button:hover {
  background: #433CE7;
  transition: all 0.4s ease-in-out;
}

.testimonial1-section-area .testimonial-sliders .teimonial-slider-nav-area .testimonial-slider-img img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

@media (max-width: 767px) {
  .testimonial2-section-area {
    padding: 50px 0 50px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .testimonial2-section-area {
    padding: 50px 0 50px;
  }
}

.testimonial2-section-area .testimonial2-header span {
  border-radius: 32px;
  background: rgba(110, 36, 255, 0.05);
  display: inline-block;
  padding: 8px 12px;
  color: #010ca8;
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  margin-bottom: 12px;
}

.testimonial2-section-area .testimonials2-boxarea .testimonial2-section-box {
  border-radius: 10px;
  border: 1px solid var(--Stroke-Color, rgba(86, 95, 118, 0.1));
  padding: 24px;
  margin-bottom: 30px;
  transition: all 0.4s ease-in-out;
}

.testimonial2-section-area .testimonials2-boxarea .testimonial2-section-box:hover {
  border-radius: 10px;
  transition: all 0.4s ease-in-out;
  background: var(--white-100, #FFF);
  box-shadow: 0px 4px 50px 0px rgba(0, 0, 0, 0.08);
}

.testimonial2-section-area .testimonials2-boxarea .testimonial2-section-box:hover .pera {
  color: var(--Text-Color, #0D0E10);
  transition: all 0.4s ease-in-out;
}

.testimonial2-section-area .testimonials2-boxarea .testimonial2-section-box .testimonials-man {
  display: flex;
  align-items: center;
}

.testimonial2-section-area .testimonials2-boxarea .testimonial2-section-box .testimonials-man .man-text {
  margin: 0 0 0 16px;
}

.testimonial2-section-area .testimonials2-boxarea .testimonial2-section-box .testimonials-man .man-text a {
  color: var(--Text-Color, #0D0E10);
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 16px;
  display: inline-block;
  margin-bottom: 8px;
}

.testimonial2-section-area .testimonials2-boxarea .testimonial2-section-box .testimonials-man .man-text span {
  color: #676879;
  font-family: "Figtree", sans-serif;
  font-size: 12px;
  font-style: normal;
  font-weight: 500;
  line-height: 12px;
  display: block;
}

.testimonial2-section-area .testimonials2-boxarea .testimonial2-section-box .pera {
  color: #676879;
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 28px;
  margin-top: 16px;
  transition: all 0.4s ease-in-out;
  margin-bottom: 16px;
}

.testimonial2-section-area .testimonials2-boxarea .testimonial2-section-box a {
  color: #676879;
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  display: inline-block;
}

.testimonial2-section-area .testimonials2-boxarea2 .testimonial2-section-box {
  border-radius: 10px;
  border: 1px solid var(--Stroke-Color, rgba(86, 95, 118, 0.1));
  padding: 24px;
  margin-bottom: 30px;
  transition: all 0.4s ease-in-out;
}

.testimonial2-section-area .testimonials2-boxarea2 .testimonial2-section-box:hover {
  border-radius: 10px;
  transition: all 0.4s ease-in-out;
  background: var(--white-100, #FFF);
  box-shadow: 0px 4px 50px 0px rgba(0, 0, 0, 0.08);
}

.testimonial2-section-area .testimonials2-boxarea2 .testimonial2-section-box:hover .pera {
  color: var(--Text-Color, #0D0E10);
  transition: all 0.4s ease-in-out;
}

.testimonial2-section-area .testimonials2-boxarea2 .testimonial2-section-box .testimonials-man {
  display: flex;
  align-items: center;
}

.testimonial2-section-area .testimonials2-boxarea2 .testimonial2-section-box .testimonials-man .man-text {
  margin: 0 0 0 16px;
}

.testimonial2-section-area .testimonials2-boxarea2 .testimonial2-section-box .testimonials-man .man-text a {
  color: var(--Text-Color, #0D0E10);
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 16px;
  display: inline-block;
  margin-bottom: 8px;
}

.testimonial2-section-area .testimonials2-boxarea2 .testimonial2-section-box .testimonials-man .man-text span {
  color: #676879;
  font-family: "Figtree", sans-serif;
  font-size: 12px;
  font-style: normal;
  font-weight: 500;
  line-height: 12px;
  display: block;
}

.testimonial2-section-area .testimonials2-boxarea2 .testimonial2-section-box .pera {
  color: #676879;
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 28px;
  margin-top: 16px;
  transition: all 0.4s ease-in-out;
  margin-bottom: 16px;
}

.testimonial2-section-area .testimonials2-boxarea2 .testimonial2-section-box a {
  color: #676879;
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  display: inline-block;
}

.testimonial3-section-area {
  background: #FAF9FD;
}

@media (max-width: 767px) {
  .testimonial3-section-area {
    padding: 50px 0 50px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .testimonial3-section-area {
    padding: 50px 0 50px;
  }
}

.testimonial3-section-area .testimonial3-slider-area .testimonial3-boxarea {
  border: 1px solid var(--Stroke-Color, rgba(86, 95, 118, 0.1));
  padding: 20px;
  transition: all 0.4s ease-in-out;
  border-radius: 4px;
}

.testimonial3-section-area .testimonial3-slider-area .testimonial3-boxarea:hover {
  background: var(--white-100, #FFF);
  transition: all 0.4s ease-in-out;
  border: 1px solid var(--white-100, #FFF);
  box-shadow: 0px 4px 50px 0px rgba(0, 0, 0, 0.08);
  border-radius: 4px;
}

.testimonial3-section-area .testimonial3-slider-area .testimonial3-boxarea:hover .img2 p {
  color: var(--Text-Color, #0D0E10);
  transition: all 0.4s ease-in-out;
}

.testimonial3-section-area .testimonial3-slider-area .testimonial3-boxarea .images-content {
  display: flex;
  align-items: center;
}

.testimonial3-section-area .testimonial3-slider-area .testimonial3-boxarea .images-content img {
  height: 50px;
  width: 50px;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 50%;
}

.testimonial3-section-area .testimonial3-slider-area .testimonial3-boxarea .images-content .content {
  margin-left: 12px;
}

.testimonial3-section-area .testimonial3-slider-area .testimonial3-boxarea .images-content .content a {
  font-family: "Figtree", sans-serif;
  font-size: 20px;
  font-weight: 600;
  color: var(--Text-Color, #0D0E10);
  line-height: 20px;
  display: inline-block;
  margin-bottom: 8px;
  transition: all 0.4s ease-in-out;
}

.testimonial3-section-area .testimonial3-slider-area .testimonial3-boxarea .images-content .content p {
  font-size: 16px;
  font-weight: 500;
  color: #676879;
  font-family: "Figtree", sans-serif;
  transition: all 0.4s ease-in-out;
}

.testimonial3-section-area .testimonial3-slider-area .testimonial3-boxarea .img2 img {
  height: 40px;
  width: 40px;
  -o-object-fit: contain;
  object-fit: contain;
}

.testimonial3-section-area .testimonial3-slider-area .testimonial3-boxarea .img2 p {
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-weight: 500;
  color: #676879;
  line-height: 28px;
  transition: all 0.4s ease-in-out;
}

.testimonial3-section-area .testimonial3-slider-area .owl-dots {
  text-align: center;
  margin-top: 30px;
}

.testimonial3-section-area .testimonial3-slider-area .owl-dots button {
  position: relative;
  height: 16px;
  width: 16px;
  border-radius: 50%;
  background: #C6B9F9;
  margin: 0 16px 0 0;
}

.testimonial3-section-area .testimonial3-slider-area .owl-dots button::after {
  position: absolute;
  content: "";
  height: 24px;
  width: 24px;
  border-radius: 50%;
  border: 1px solid #4B24EE;
  left: -5px;
  top: -5px;
  display: none;
}

.testimonial3-section-area .testimonial3-slider-area .owl-dots button.active {
  background: #4B24EE;
  height: 14px;
  width: 14px;
}

.testimonial3-section-area .testimonial3-slider-area .owl-dots button.active::after {
  display: block;
}

.testimonial2 .testimonial1-header span {
  display: inline-block;
  padding: 8px 12px;
  color: #010ca8;
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  border-radius: 32px;
  background: rgba(110, 36, 255, 0.05);
  margin-bottom: 12px;
}

.testimonial2 .testimonial-sliders .testimonial-content-slider .testimonial-slider-boxarea ul li a {
  color: #010ca8 !important;
}

.testimonial2 .testimonial-sliders .testimonial-next-arrow button:hover {
  background: #010ca8 !important;
}

.testimonial2 .testimonial-sliders .testimonial-prev-arrow button:hover {
  background: #010ca8 !important;
}

@media (max-width: 767px) {
  .testimonial-inner-section-area {
    padding: 50px 0 50px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .testimonial-inner-section-area {
    padding: 50px 0 50px;
  }
}

.testimonial-inner-section-area .testimonial2-section-box {
  border-radius: 10px;
  border: 1px solid var(--Stroke-Color, rgba(86, 95, 118, 0.1));
  padding: 24px;
  margin-bottom: 30px;
  transition: all 0.4s ease-in-out;
}

.testimonial-inner-section-area .testimonial2-section-box:hover {
  border-radius: 10px;
  transition: all 0.4s ease-in-out;
  background: var(--white-100, #FFF);
  box-shadow: 0px 4px 50px 0px rgba(0, 0, 0, 0.08);
}

.testimonial-inner-section-area .testimonial2-section-box:hover .pera {
  color: var(--Text-Color, #0D0E10);
  transition: all 0.4s ease-in-out;
}

.testimonial-inner-section-area .testimonial2-section-box .testimonials-man {
  display: flex;
  align-items: center;
}

.testimonial-inner-section-area .testimonial2-section-box .testimonials-man .man-text {
  margin: 0 0 0 16px;
}

.testimonial-inner-section-area .testimonial2-section-box .testimonials-man .man-text a {
  color: var(--Text-Color, #0D0E10);
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 16px;
  display: inline-block;
  margin-bottom: 8px;
}

.testimonial-inner-section-area .testimonial2-section-box .testimonials-man .man-text span {
  color: #676879;
  font-family: "Figtree", sans-serif;
  font-size: 12px;
  font-style: normal;
  font-weight: 500;
  line-height: 12px;
  display: block;
}

.testimonial-inner-section-area .testimonial2-section-box .pera {
  color: #676879;
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 28px;
  margin-top: 16px;
  transition: all 0.4s ease-in-out;
  margin-bottom: 16px;
}

.testimonial-inner-section-area .testimonial2-section-box a {
  color: #676879;
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  display: inline-block;
}

.testimonial-inner-section-area .testimonial3-boxarea {
  border: 1px solid var(--Stroke-Color, rgba(86, 95, 118, 0.1));
  padding: 20px;
  transition: all 0.4s ease-in-out;
  border-radius: 4px;
  margin-bottom: 30px;
}

.testimonial-inner-section-area .testimonial3-boxarea:hover {
  background: var(--white-100, #FFF);
  transition: all 0.4s ease-in-out;
  border: 1px solid var(--white-100, #FFF);
  box-shadow: 0px 4px 50px 0px rgba(0, 0, 0, 0.08);
  border-radius: 4px;
}

.testimonial-inner-section-area .testimonial3-boxarea:hover .img2 p {
  color: var(--Text-Color, #0D0E10);
  transition: all 0.4s ease-in-out;
}

.testimonial-inner-section-area .testimonial3-boxarea .images-content {
  display: flex;
  align-items: center;
}

.testimonial-inner-section-area .testimonial3-boxarea .images-content img {
  height: 50px;
  width: 50px;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 50%;
}

.testimonial-inner-section-area .testimonial3-boxarea .images-content .content {
  margin-left: 12px;
}

.testimonial-inner-section-area .testimonial3-boxarea .images-content .content a {
  font-family: "Figtree", sans-serif;
  font-size: 20px;
  font-weight: 700;
  color: var(--Text-Color, #0D0E10);
  line-height: 20px;
  display: inline-block;
  margin-bottom: 8px;
  transition: all 0.4s ease-in-out;
}

.testimonial-inner-section-area .testimonial3-boxarea .images-content .content p {
  font-size: 16px;
  font-weight: 500;
  color: #676879;
  font-family: "Figtree", sans-serif;
  transition: all 0.4s ease-in-out;
}

.testimonial-inner-section-area .testimonial3-boxarea .img2 img {
  height: 40px;
  width: 40px;
  -o-object-fit: contain;
  object-fit: contain;
}

.testimonial-inner-section-area .testimonial3-boxarea .img2 p {
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-weight: 500;
  color: #676879;
  line-height: 28px;
  transition: all 0.4s ease-in-out;
}

.testimonial-inner-section-area .pagination-area nav ul {
  justify-content: center;
}

.testimonial-inner-section-area .pagination-area nav ul li a {
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-weight: 700;
  color: var(--Text-Color, #0D0E10);
  height: 55px;
  width: 55px;
  text-align: center;
  line-height: 43px;
  border-radius: 50% !important;
  box-shadow: none;
  margin: 0 10px 0 0;
  transition: all 0.4s ease-in-out;
  border: 1px solid var(--Stroke-Color, rgba(86, 95, 118, 0.1));
}

.testimonial-inner-section-area .pagination-area nav ul li a:hover {
  background: #010ca8;
  transition: all 0.4s ease-in-out;
  color: var(--white-100, #FFF);
}

.testimonial-inner-section-area .pagination-area nav ul li a.active {
  background: #010ca8;
  color: var(--white-100, #FFF);
  transition: all 0.4s ease-in-out;
}

.testimonial-carousel-area {
  position: relative;
}

@media (max-width: 767px) {
  .testimonial-carousel-area {
    padding: 50px 0 50px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .testimonial-carousel-area {
    padding: 50px 0 50px;
  }
}

.testimonial-carousel-area .tastemonial-box-area {
  position: relative;
}

.testimonial-carousel-area .tastemonial-box-area .testimonial {
  position: absolute;
  left: 18%;
  top: 2%;
}

.testimonial-carousel-area .tastemonial-box-area .pinterest1 {
  position: absolute;
  top: 40%;
}

.testimonial-carousel-area .tastemonial-box-area .instagram3 {
  position: absolute;
  right: 0;
  top: 40%;
}

.testimonial-carousel-area .tastemonial-box-area .testimonial-main-box {
  background: #F8F9FA;
  position: relative;
  padding: 80px 80px;
  border-radius: 50%;
  overflow: hidden;
}

@media (max-width: 767px) {
  .testimonial-carousel-area .tastemonial-box-area .testimonial-main-box {
    padding: 40px;
    border-radius: 10px;
  }
}

.testimonial-carousel-area .tastemonial-box-area .testimonial-main-box .img1 img {
  height: 60px;
  width: 60px;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 50%;
  margin: 0 auto;
}

.testimonial-carousel-area .tastemonial-box-area .testimonial-main-box .team-details {
  display: flex;
  align-items: center;
  justify-content: center;
}

.testimonial-carousel-area .tastemonial-box-area .testimonial-main-box .team-details .img1 img {
  height: 50px;
  width: 50px;
  border-radius: 50%;
  -o-object-fit: cover;
  object-fit: cover;
}

.testimonial-carousel-area .tastemonial-box-area .testimonial-main-box .team-details .content {
  margin-left: 16px;
}

.testimonial-carousel-area .tastemonial-box-area .testimonial-main-box .team-details .content a {
  display: inline-block;
  font-size: 16px;
  font-weight: 700;
  color: var(--Text-Color, #0D0E10);
  font-family: "Figtree", sans-serif;
  text-align: start !important;
}

.testimonial-carousel-area .tastemonial-box-area .testimonial-main-box .team-details .content p {
  font-family: "Figtree", sans-serif;
  font-size: 12px;
  font-weight: 500;
  color: #676879;
}

.testimonial-carousel-area .tastemonial-box-area .testimonial-main-box .owl-dots {
  text-align: center;
  margin-top: 32px;
}

.testimonial-carousel-area .tastemonial-box-area .testimonial-main-box .owl-dots button {
  height: 3px;
  width: 17px;
  display: inline-block;
  background: #DAC6DE;
  border-radius: 4px;
  margin: 0 3px;
}

.testimonial-carousel-area .tastemonial-box-area .testimonial-main-box .owl-dots .owl-dot.active {
  background: #581164;
}

/*============= TESTIMONIAL CSS AREA ENDS===============*/
/*============= COUNTER CSS AREA ===============*/
.counter1-section-area {
  padding: 70px 0 100px;
}

@media (max-width: 767px) {
  .counter1-section-area {
    margin-top: -75px;
    padding: 30px 0 50px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .counter1-section-area {
    margin-top: -50px;
    padding: 30px 0 50px;
  }
}

.counter1-section-area .counter-auhtor-area {
  border-radius: var(--4, 4px);
  background: #fff;
  box-shadow: 0px 4px 30px 0px rgba(0, 0, 0, 0.08);
  align-items: center;
  justify-content: space-between;
  padding: 50px;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .counter1-section-area .counter-auhtor-area {
    padding: 50px 50px 30px 50px;
  }
}

@media (max-width: 767px) {
  .counter1-section-area .counter-auhtor-area {
    padding: 50px;
  }
}

.counter1-section-area .counter-auhtor-area .counter-box1 {
  text-align: center;
  position: relative;
  z-index: 1;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .counter1-section-area .counter-auhtor-area .counter-box1 {
    margin-bottom: 20px;
  }
}

@media (max-width: 767px) {
  .counter1-section-area .counter-auhtor-area .counter-box1 {
    margin-bottom: 20px;
  }
}

.counter1-section-area .counter-auhtor-area .counter-box1::after {
  position: absolute;
  content: "";
  height: 90px;
  width: 1px;
  background: var(--Stroke-Color, rgba(86, 95, 118, 0.1));
  top: 0;
  right: 0;
  z-index: 1;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .counter1-section-area .counter-auhtor-area .counter-box1::after {
    height: 70px;
    width: 1px;
    top: 20px;
  }
}

@media (max-width: 767px) {
  .counter1-section-area .counter-auhtor-area .counter-box1::after {
    display: none;
  }
}

.counter1-section-area .counter-auhtor-area .counter-box1 h3 {
  color: var(--Text-Color, #0D0E10);
  font-family: "Figtree", sans-serif;
  font-size: 56px;
  font-style: normal;
  font-weight: 700;
  line-height: 56px;
  margin-bottom: 16px;
}

@media (max-width: 767px) {
  .counter1-section-area .counter-auhtor-area .counter-box1 h3 {
    font-size: 32px;
    line-height: 42px;
  }
}

.counter1-section-area .counter-auhtor-area .counter-box1 p {
  color: #676879;
  font-family: "Figtree", sans-serif;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: 20px;
}

.counter1-section-area .counter-auhtor-area .counter-after::after {
  display: none;
}

/*============= COUNTER CSS AREA ENDS ===============*/
/*============= SLIDER CSS AREA ===============*/
.slider1-section-area {
  overflow: hidden;
}

.slider1-section-area .brand-single-box {
  display: inline-block;
}

.slider1-section-area .marquee-wrap {
  background-color: #433CE7;
  width: 100%;
  position: relative;
}

.slider1-section-area .marquee-wrap .marquee-text {
  animation: marquee 100s linear infinite;
  position: relative;
  width: 100%;
  white-space: nowrap;
  padding: 30px 0;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .slider1-section-area .marquee-wrap .marquee-text {
    animation: marquee 50s linear infinite;
  }
}

@media (max-width: 767px) {
  .slider1-section-area .marquee-wrap .marquee-text {
    animation: marquee 50s linear infinite;
  }
}

.slider1-section-area .marquee-wrap .marquee-text .brand-single-box {
  display: inline-block;
}

.slider1-section-area .marquee-wrap .marquee-text .brand-single-box h3 {
  color: var(--white-100, #FFF);
  font-family: "Figtree", sans-serif;
  font-size: 40px;
  font-style: normal;
  font-weight: 700;
  line-height: 40px;
}

.slider1-section-area .marquee-wrap .marquee-text .brand-single-box h3 img {
  margin: 0 10px;
}

.slider1-section-area.slider2 .marquee-wrap {
  background: #010ca8;
}

/*============= SLIDER CSS AREA ENDS===============*/
/*============= SERVICE CSS AREA ===============*/
.service1-section-area {
  overflow: hidden;
  background: #FAFAFA;
}

@media (max-width: 767px) {
  .service1-section-area {
    padding: 50px 0 50px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .service1-section-area {
    padding: 50px 0 50px;
  }
}

.service1-section-area .service1-header span {
  color: #433CE7;
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  display: inline-block;
  margin-bottom: 16px;
}

.service1-section-area .service-vertical-tabs {
  position: relative;
  width: 100%;
  border-radius: var(--4, 4px);
  background: var(--white-100, #FFF);
  padding: 32px;
  position: relative;
}

@media (max-width: 767px) {
  .service1-section-area .service-vertical-tabs {
    padding: 25px;
  }
}

.service1-section-area .service-vertical-tabs .tabs-elements {
  position: absolute;
  left: 35px;
  top: 0;
}

.service1-section-area .service-vertical-tabs .menu div span.light {
  height: 10px;
  width: 10px;
  position: absolute;
  top: 24px;
  left: 15px;
  border-radius: 100%;
  transition: 1s all cubic-bezier(0.075, 0.82, 0.165, 1);
}

.service1-section-area .service-vertical-tabs .menu div.active span.light {
  left: 0;
  height: 100%;
  width: 3px;
  top: 0;
  border-radius: 0;
}

.service1-section-area .service-vertical-tabs .menu div.active .tabs-content-area {
  background: #433CE7;
}

.service1-section-area .service-vertical-tabs .menu div.active .tabs-content-area .tabs-btn-icon {
  background: var(--white-100, #FFF);
}

.service1-section-area .service-vertical-tabs .menu div.active .tabs-content-area .tabs-btn-content h4 {
  color: var(--white-100, #FFF);
}

.service1-section-area .service-vertical-tabs .menu div.active .tabs-content-area .tabs-btn-content p {
  color: var(--white-100, #FFF);
  opacity: 0.7;
  font-weight: 500;
}

.service1-section-area .service-vertical-tabs ul.service-tabs-content {
  position: relative;
  height: 0px;
  list-style: none;
  margin: 0;
  padding: 0;
  transition: 0.5s all cubic-bezier(0.075, 0.82, 0.165, 1);
}

.service1-section-area .service-vertical-tabs ul.service-tabs-content li {
  opacity: 0;
  transform: translateX(50px);
  position: absolute;
  list-style: none;
  transition: 1s all cubic-bezier(0.075, 0.82, 0.165, 1);
}

.service1-section-area .service-vertical-tabs ul.service-tabs-content li.active {
  transition-delay: 0.3s;
  z-index: 2;
  opacity: 1;
  transform: translateX(0px);
}

.service1-section-area .service-vertical-tabs ul.service-tabs-content li.active {
  transition-delay: 0.3s;
  z-index: 2;
  opacity: 1;
  transform: translateX(0px);
}

.service1-section-area .service-vertical-tabs .service-tabs-grid {
  margin: 0 70px 0 0;
}

@media (max-width: 767px) {
  .service1-section-area .service-vertical-tabs .service-tabs-grid {
    margin: 0;
    margin-bottom: 30px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .service1-section-area .service-vertical-tabs .service-tabs-grid {
    margin: 0;
    margin-bottom: 30px;
  }
}

.service1-section-area .service-vertical-tabs .service-tabs-grid .tabs-content-area {
  background: #F6F5FE;
  position: relative;
  border-radius: 50px;
  padding: 16px;
  cursor: pointer;
}

@media (max-width: 767px) {
  .service1-section-area .service-vertical-tabs .service-tabs-grid .tabs-content-area {
    text-align: center;
    margin: 0 auto;
    border-radius: 5px;
  }
}

.service1-section-area .service-vertical-tabs .service-tabs-grid .tabs-content-area .tabs-btn-icon {
  height: 65px;
  width: 65px;
  line-height: 60px;
  text-align: center;
  border-radius: 50%;
  background: #EDECFD;
  position: absolute;
  top: 11px;
}

@media (max-width: 767px) {
  .service1-section-area .service-vertical-tabs .service-tabs-grid .tabs-content-area .tabs-btn-icon {
    position: relative;
    top: 0;
    text-align: center;
    margin: 0 auto;
    margin-bottom: 20px;
  }
}

.service1-section-area .service-vertical-tabs .service-tabs-grid .tabs-content-area .tabs-btn-content {
  padding-left: 85px;
}

@media (max-width: 767px) {
  .service1-section-area .service-vertical-tabs .service-tabs-grid .tabs-content-area .tabs-btn-content {
    padding: 0;
  }
}

.service1-section-area .service-vertical-tabs .service-tabs-grid .tabs-content-area .tabs-btn-content h4 {
  color: var(--Text-Color, #0D0E10);
  font-family: "Figtree", sans-serif;
  font-size: 20px;
  font-style: normal;
  font-weight: 600;
  line-height: 24px;
  margin-bottom: 12px;
}

@media (max-width: 767px) {
  .service1-section-area .service-vertical-tabs .service-tabs-grid .tabs-content-area .tabs-btn-content h4 {
    font-size: 18px;
  }
}

.service1-section-area .service-vertical-tabs .service-tabs-grid .tabs-content-area .tabs-btn-content p {
  color: #676879;
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
}

@media (max-width: 767px) {
  .service1-section-area .service-vertical-tabs .service-tabs-grid .tabs-content-area .tabs-btn-content p {
    font-size: 14px;
  }
}

.service1-section-area .service-vertical-tabs .service-tabs-content {
  position: relative;
}

.service1-section-area .service-vertical-tabs .service-tabs-content li .vertical-tabs-img img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

.service1-section-area .service-vertical-tabs .service-tabs-content li .vertical-tabs-img img.vertical-img2 {
  width: 363px;
  height: 226px;
  position: absolute;
  bottom: -40px;
  right: -100px;
}

@media (max-width: 767px) {
  .service1-section-area .service-vertical-tabs .service-tabs-content li .vertical-tabs-img img.vertical-img2 {
    position: relative;
    top: 0;
    left: 0;
  }
}

@media (max-width: 767px) {
  .service2-section-area {
    padding: 50px 0 50px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .service2-section-area {
    padding: 50px 0 50px;
  }
}

.service2-section-area .service2-header span {
  font-family: "Outfit", sans-serif;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color: #93c5fd;
  background: rgba(37, 99, 235, 0.15);
  border: 1px solid rgba(37, 99, 235, 0.35);
  border-radius: 100px;
  padding: 7px 20px;
  margin-bottom: 18px;
  display: inline-block;
}

.service2-section-area .service2-header h2 {
  color: #ffffff !important;
  font-family: "Outfit", sans-serif;
  font-size: 46px;
  font-weight: 700;
  line-height: 1.18;
  letter-spacing: -0.5px;
}

.service2-section-area .service2-bg-area {
  border-radius: 4px;
  transition: all 0.4s ease-in-out;
}

.service2-section-area .service2-bg-area .service2-box-area {
  background: rgba(255, 255, 255, 0.03) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  border-radius: 20px !important;
  padding: 38px 28px 34px !important;
  margin-bottom: 26px;
  transition: all 0.45s cubic-bezier(0.16, 1, 0.3, 1) !important;
  backdrop-filter: blur(16px) !important;
  -webkit-backdrop-filter: blur(16px) !important;
  height: calc(100% - 26px) !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  text-align: center !important;
  position: relative !important;
  overflow: hidden !important;
}

/* Shimmer gradient line at bottom, visible on hover */
.service2-section-area .service2-bg-area .service2-box-area::after {
  content: "" !important;
  position: absolute !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 3px !important;
  background: linear-gradient(90deg, #2563eb, #7c3aed, #06b6d4) !important;
  opacity: 0 !important;
  transition: opacity 0.4s ease !important;
  border-radius: 0 0 20px 20px !important;
}

.service2-section-area .service2-bg-area .service2-box-area:hover::after {
  opacity: 1 !important;
}

.service2-section-area .service2-bg-area .service2-box-area:hover {
  background: rgba(255, 255, 255, 0.07) !important;
  border-color: rgba(255, 255, 255, 0.2) !important;
  transform: translateY(-10px) !important;
  box-shadow: 0 30px 60px rgba(0, 0, 0, 0.35), 0 0 40px rgba(99, 102, 241, 0.12) !important;
}

.benefits-section-area {
  background: #f8f9fc;
  padding: 100px 0;
}

.benefit-card {
  margin: 15px;
  background: #fff;
  padding: 30px;
  border-radius: 10px;
  margin-bottom: 25px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
  transition: all .3s ease;
  height: 100%;
}

.benefit-card h4 {
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 10px;
  color: #111;
}

.benefit-card p {
  font-size: 14px;
  color: #555;
  margin-bottom: 10px;
}

.benefit-card span {
  font-size: 13px;
  color: #4A6CF7;
  font-weight: 500;
}

.benefit-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.12);
  transition: all 0.4s ease-in-out;
  transform: translateY(-5px);
}

.service2-section-area .service2-bg-area .service2-box-area .service2-icon,
.service2-section-area .service2-bg-area .service2-box-area .service2-icon1,
.service2-section-area .service2-bg-area .service2-box-area .service2-icon2 {
  background: rgba(37, 99, 235, 0.1) !important;
  border: 1px solid rgba(37, 99, 235, 0.25) !important;
  height: 72px !important;
  width: 72px !important;
  border-radius: 18px !important;
  margin: 0 auto 22px auto !important;
  transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: 0 0 0 0 rgba(37, 99, 235, 0) !important;
}

.service2-section-area .service2-bg-area .service2-box-area:hover .service2-icon,
.service2-section-area .service2-bg-area .service2-box-area:hover .service2-icon1,
.service2-section-area .service2-bg-area .service2-box-area:hover .service2-icon2 {
  background: rgba(37, 99, 235, 0.2) !important;
  border-color: rgba(99, 179, 237, 0.5) !important;
  transform: scale(1.08) translateY(-3px) !important;
  box-shadow: 0 0 30px rgba(37, 99, 235, 0.25) !important;
}

.service2-section-area .service2-bg-area .service2-box-area img {
  width: 34px !important;
  height: 34px !important;
  filter: brightness(0) invert(1) !important;
  transition: all 0.4s ease-in-out !important;
}

.service2-section-area .service2-bg-area .service2-box-area .service2-content a {
  color: #ffffff !important;
  font-family: "Figtree", sans-serif !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  margin-top: 10px !important;
  margin-bottom: 12px !important;
  text-decoration: none !important;
  transition: all 0.3s ease !important;
  display: block !important;
  letter-spacing: -0.2px !important;
}

.service2-section-area .service2-bg-area .service2-box-area .service2-content a:hover {
  color: #93c5fd !important;
}

.service2-section-area .service2-bg-area .service2-box-area .service2-content p {
  color: rgba(255, 255, 255, 0.60) !important;
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 14.5px !important;
  line-height: 1.7 !important;
  margin: 0 !important;
  transition: all 0.4s ease-in-out !important;
  text-align: center !important;
}

.service2-section-area .service2-bg-area .service2-box-area:hover .service2-content p {
  color: rgba(255, 255, 255, 0.85) !important;
}

.tools-section-area {
  background: #FAF9FD;
  position: relative;
}

@media (max-width: 767px) {
  .tools-section-area {
    padding: 50px 0 50px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tools-section-area {
    padding: 50px 0 50px;
  }
}

.tools-section-area .tabs3-tools-area {
  background: var(--white-100, #FFF);
  padding: 60px 100px;
  border-radius: 4px;
  overflow: hidden;
}

@media (max-width: 767px) {
  .tools-section-area .tabs3-tools-area {
    padding: 30px 30px 50px 30px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tools-section-area .tabs3-tools-area {
    padding: 30px 30px 50px 30px;
  }
}

.tools-section-area .tabs3-tools-area ul {
  justify-content: center;
}

.tools-section-area .tabs3-tools-area ul li.nav-item {
  text-align: center;
  margin: 0 30px 0 0;
}

@media (max-width: 767px) {
  .tools-section-area .tabs3-tools-area ul li.nav-item {
    width: 100%;
    margin: 0 0 16px 0;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tools-section-area .tabs3-tools-area ul li.nav-item {
    width: 100%;
    margin: 0 0 16px 0;
  }
}

.tools-section-area .tabs3-tools-area ul li.nav-item .nav-link.active {
  background: #4B24EE;
}

.tools-section-area .tabs3-tools-area ul li.nav-item .nav-link.active .content p {
  color: var(--white-100, #FFF);
}

.tools-section-area .tabs3-tools-area ul li.nav-item .nav-link.active .content .tools-icon1 {
  display: none;
  margin: 0 auto;
}

.tools-section-area .tabs3-tools-area ul li.nav-item .nav-link.active .content .active-icon1 {
  display: block;
  margin: 0 auto;
}

.tools-section-area .tabs3-tools-area ul li.nav-item .nav-link {
  background: #FAF9FD;
  border-radius: 4px;
  padding: 12px;
  text-align: center;
  min-width: 142px;
}

.tools-section-area .tabs3-tools-area ul li.nav-item .nav-link .content .tools-icon1 {
  display: inline-block;
  margin: 0 auto;
}

.tools-section-area .tabs3-tools-area ul li.nav-item .nav-link .content .active-icon1 {
  display: none;
  margin: 0 auto;
}

.tools-section-area .tabs3-tools-area ul li.nav-item .nav-link .content p {
  font-family: "Figtree", sans-serif;
  font-size: 18px;
  font-weight: 700;
  color: var(--Text-Color, #0D0E10);
}

.tools-section-area .tabs3-tools-area .tab-content .tab-pane {
  transform: rotateX(45deg) translateY(50px);
  transition: all 0.4s ease-in-out;
  opacity: 0;
}

.tools-section-area .tabs3-tools-area .tab-content .tab-pane .main-content-area .tabs-header {
  padding: 0 30px 0;
}

@media (max-width: 767px) {
  .tools-section-area .tabs3-tools-area .tab-content .tab-pane .main-content-area .tabs-header {
    padding: 0;
    margin-bottom: 30px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tools-section-area .tabs3-tools-area .tab-content .tab-pane .main-content-area .tabs-header {
    padding: 0;
    margin-bottom: 30px;
  }
}

.tools-section-area .tabs3-tools-area .tab-content .tab-pane .main-content-area .tabs-header h2 {
  text-align: start;
}

.tools-section-area .tabs3-tools-area .tab-content .tab-pane .main-content-area .tabs-header p {
  text-align: start;
}

.tools-section-area .tabs3-tools-area .tab-content .tab-pane .main-content-area .tabs-header a {
  text-align: start;
}

.tools-section-area .tabs3-tools-area .tab-content .tab-pane .main-content-area .tabs-header .list {
  display: flex;
}

.tools-section-area .tabs3-tools-area .tab-content .tab-pane .main-content-area .tabs-header .list img {
  margin: 0 30px 0 0;
}

.tools-section-area .tabs3-tools-area .tab-content .tab-pane .main-content-area .tabs-header .list p span {
  font-weight: 700;
  color: var(--Text-Color, #0D0E10) !important;
}

.tools-section-area .tabs3-tools-area .tab-content .tab-pane .main-content-area .tabs-images {
  position: relative;
}

.tools-section-area .tabs3-tools-area .tab-content .tab-pane .main-content-area .tabs-images img {
  height: 340px;
  width: 400px;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 4px;
}

@media (max-width: 767px) {
  .tools-section-area .tabs3-tools-area .tab-content .tab-pane .main-content-area .tabs-images img {
    height: 100%;
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tools-section-area .tabs3-tools-area .tab-content .tab-pane .main-content-area .tabs-images img {
    height: 100%;
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover;
  }
}

.tools-section-area .tabs3-tools-area .tab-content .tab-pane .main-content-area .tabs-images .tabs-img2 {
  width: 290px;
  height: 200px;
  -o-object-fit: cover;
  object-fit: cover;
  position: absolute;
  bottom: -100px;
  right: 0;
}

@media (max-width: 767px) {
  .tools-section-area .tabs3-tools-area .tab-content .tab-pane .main-content-area .tabs-images .tabs-img2 {
    height: 100%;
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    position: relative;
    bottom: 0;
    top: 20px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tools-section-area .tabs3-tools-area .tab-content .tab-pane .main-content-area .tabs-images .tabs-img2 {
    height: 100%;
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    position: relative;
    bottom: 0;
    top: 20px;
  }
}

.tools-section-area .tabs3-tools-area .tab-content .tab-pane.active.show {
  transform: rotateX(0) translateY(0);
  transition: all 0.4s ease-in-out;
  opacity: 1;
}

.service-inner-section-area {
  background: var(--BG, #F7F9FA);
}

@media (max-width: 767px) {
  .service-inner-section-area {
    padding: 50px 0 20px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .service-inner-section-area {
    padding: 50px 0 20px;
  }
}

.service-inner-section-area .service-inner-header span {
  background: #F0EEFA;
  padding: 8px 12px;
  line-height: 16px;
  border-radius: 32px;
  display: inline-block;
  font-size: 16px;
  font-weight: 500;
  color: #010ca8;
}

.service-inner-section-area .service-inner-boxarea {
  position: relative;
  background: var(--white-100, #FFF);
  padding: 32px 16px;
  border-radius: 4px;
  box-shadow: 0px 4px 50px 0px rgba(0, 0, 0, 0.08);
  transition: all 0.4s ease-in-out;
  z-index: 1;
  margin-bottom: 30px;
}

.service-inner-section-area .service-inner-boxarea::after {
  position: absolute;
  content: "";
  height: 30px;
  width: 30px;
  border-radius: 50%;
  transition: all 0.4s ease-in-out;
  overflow: hidden;
  opacity: 0;
  top: 40%;
  left: 40%;
  right: 40%;
  z-index: -1;
  background: #010ca8;
}

.service-inner-section-area .service-inner-boxarea:hover {
  transform: translateY(-5px);
  transition: all 0.4s ease-in-out;
}

.service-inner-section-area .service-inner-boxarea:hover::after {
  visibility: visible;
  opacity: 1;
  transition: all 0.4s ease-in-out;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  border-radius: 4px;
}

.service-inner-section-area .service-inner-boxarea:hover .icons {
  transition: all 0.4s ease-in-out;
  background: var(--white-100, #FFF);
  transition: all 0.4s ease-in-out;
}

.service-inner-section-area .service-inner-boxarea:hover .content a {
  color: var(--white-100, #FFF);
  transition: all 0.4s ease-in-out;
}

.service-inner-section-area .service-inner-boxarea:hover .content p {
  color: var(--white-100, #FFF);
  transition: all 0.4s ease-in-out;
  opacity: 0.8;
}

.service-inner-section-area .service-inner-boxarea .icons {
  height: 60px;
  width: 60px;
  text-align: center;
  line-height: 60px;
  background: #F8F4FF;
  display: inline-block;
  border-radius: 50%;
  transition: all 0.4s ease-in-out;
}

.service-inner-section-area .service-inner-boxarea .icons2 {
  background: #FFE4E2;
}

.service-inner-section-area .service-inner-boxarea .icons3 {
  background: #DDF0EB;
}

.service-inner-section-area .service-inner-boxarea .icons4 {
  background: #FBE6FF;
}

.service-inner-section-area .service-inner-boxarea .content a {
  font-family: "Figtree", sans-serif;
  font-weight: 600;
  color: var(--Text-Color, #0D0E10);
  display: inline-block;
  font-size: 20px;
  line-height: 20px;
  transition: all 0.4s ease-in-out;
}

.service-inner-section-area .service-inner-boxarea .content p {
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-weight: 500;
  color: #676879;
  line-height: 26px;
  transition: all 0.4s ease-in-out;
}

.service-inner-section-area .box2::after {
  background: #FC4B3E;
}

.service-inner-section-area .box3::after {
  background: #1E9E7A;
}

.service-inner-section-area .box4::after {
  background: #E25AFF;
}

@media (max-width: 767px) {
  .marketing-section-area {
    padding: 50px 0 50px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .marketing-section-area {
    padding: 50px 0 50px;
  }
}

.marketing-section-area .marketing-img {
  position: relative;
  z-index: 1;
}

.marketing-section-area .marketing-img img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 4px;
}

@media (max-width: 767px) {
  .marketing-section-area .marketing-img {
    margin-bottom: 30px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .marketing-section-area .marketing-img {
    margin-bottom: 30px;
  }
}

.marketing-section-area .marketing-img .marketing-bg {
  position: absolute;
  left: 0;
  z-index: -1;
}

.marketing-section-area .tabs-text-area {
  border-radius: var(--4, 4px);
  border: 1px solid var(--Stroke-Color, rgba(86, 95, 118, 0.1));
  padding: 20px 16px;
  position: relative;
  transition: all 0.4s ease-in-out;
  margin: 0 0 0 40px;
}

@media (max-width: 767px) {
  .marketing-section-area .tabs-text-area {
    margin: 0;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .marketing-section-area .tabs-text-area {
    margin: 0;
  }
}

.marketing-section-area .tabs-text-area:hover {
  border-radius: var(--4, 4px);
  background: var(--white-100, #FFF);
  transition: all 0.4s ease-in-out;
  transform: translateY(-5px);
  box-shadow: 0px 4px 50px 0px rgba(0, 0, 0, 0.08);
}

.marketing-section-area .tabs-text-area .tabs-icon {
  height: 84px;
  width: 84px;
  text-align: center;
  line-height: 84px;
  background: #E9DEFF;
  border-radius: 50%;
  display: inline-block;
  position: absolute;
}

@media (max-width: 767px) {
  .marketing-section-area .tabs-text-area .tabs-icon {
    position: relative;
  }
}

.marketing-section-area .tabs-text-area .tabs-icon1 {
  height: 84px;
  width: 84px;
  text-align: center;
  line-height: 84px;
  background: #F8DFDE;
  border-radius: 50%;
  display: inline-block;
  position: absolute;
}

@media (max-width: 767px) {
  .marketing-section-area .tabs-text-area .tabs-icon1 {
    position: relative;
  }
}

.marketing-section-area .tabs-text-area .tabs-icon2 {
  height: 84px;
  width: 84px;
  text-align: center;
  line-height: 84px;
  background: #D6EBE7;
  border-radius: 50%;
  display: inline-block;
  position: absolute;
}

@media (max-width: 767px) {
  .marketing-section-area .tabs-text-area .tabs-icon2 {
    position: relative;
  }
}

.marketing-section-area .tabs-text-area .tabs-icon3 {
  height: 84px;
  width: 84px;
  text-align: center;
  line-height: 84px;
  background: #E6DBE8;
  border-radius: 50%;
  display: inline-block;
  position: absolute;
}

@media (max-width: 767px) {
  .marketing-section-area .tabs-text-area .tabs-icon3 {
    position: relative;
  }
}

.marketing-section-area .tabs-text-area .tabs-text {
  padding-left: 100px;
}

@media (max-width: 767px) {
  .marketing-section-area .tabs-text-area .tabs-text {
    padding-left: 0;
    margin-top: 20px;
  }
}

.marketing-section-area .tabs-text-area .tabs-text a {
  color: var(--Text-Color, #0D0E10);
  font-family: "Figtree", sans-serif;
  font-size: 20px;
  font-style: normal;
  font-weight: 600;
  line-height: 20px;
  display: inline-block;
  margin-bottom: 12px;
  text-transform: capitalize;
}

.marketing-section-area .tabs-text-area .tabs-text p {
  color: #676879;
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 28px;
}

.service-sticky-area {
  position: relative;
}

.service-sticky-area .all-sticky-area {
  position: relative;
}

.service-sticky-area .all-sticky-area .sticky-area .section-area {
  position: sticky;
}

.service-sticky-area .all-sticky-area .sticky-area .section-area.bg2 {
  background: #FFEDEC;
  position: sticky;
  top: 150px !important;
}

.service-sticky-area .all-sticky-area .sticky-area .section-area.bg3 {
  background: #E8F5F2;
  position: sticky;
  top: 200px !important;
}

.service-sticky-area .all-sticky-area .sticky-area .section-area.bg4 {
  background: #EEE7EF;
  position: sticky;
  top: 250px !important;
}

.service-sticky-area .all-sticky-area .sticky-area .footer-last-content.footerbg1 {
  background: #FECDC9;
}

.service-sticky-area .all-sticky-area .sticky-area .footer-last-content.footerbg1 .header-btn8 {
  background: #FC4B3E;
}

.service-sticky-area .all-sticky-area .sticky-area .footer-last-content.footerbg2 {
  background: #C0E4DA;
}

.service-sticky-area .all-sticky-area .sticky-area .footer-last-content.footerbg2 .header-btn8 {
  background: #1E9E7A;
}

.service-sticky-area .all-sticky-area .sticky-area .footer-last-content.footerbg3 {
  background: #D0BCD3;
}

.service-sticky-area .all-sticky-area .sticky-area .footer-last-content.footerbg3 .header-btn8 {
  background: #581164;
}

.service-sticky-area .all-sticky-area .sticky-area .section-area {
  background: #F0E9FF;
  border-radius: 4px;
  position: sticky;
  top: 100px;
  margin-bottom: 100px;
}

@media (max-width: 767px) {
  .service-sticky-area .all-sticky-area .sticky-area .section-area {
    margin-bottom: 30px;
  }
}

.service-sticky-area .all-sticky-area .sticky-area .section-area .all-content {
  padding: 32px 0 0 32px;
}

.service-sticky-area .all-sticky-area .sticky-area .section-area .all-content .logo-content {
  display: flex;
  align-items: center;
}

.service-sticky-area .all-sticky-area .sticky-area .section-area .all-content .logo-content .img1 {
  height: 50px;
  width: 50px;
  line-height: 50px;
  text-align: center;
  border-radius: 50%;
  background: var(--white-100, #FFF);
  margin: 0 16px 0 0;
}

.service-sticky-area .all-sticky-area .sticky-area .section-area .all-content .logo-content h3 {
  font-family: "Figtree", sans-serif;
  font-size: 32px;
  line-height: 42px;
  font-weight: 700;
  color: var(--Text-Color, #0D0E10);
}

.service-sticky-area .all-sticky-area .sticky-area .section-area .all-content .pera-area h3 {
  font-size: 24px;
  font-family: "Figtree", sans-serif;
  font-weight: 600;
  color: var(--Text-Color, #0D0E10);
  line-height: 32px;
}

.service-sticky-area .all-sticky-area .sticky-area .section-area .all-content .pera-area .content-pera {
  margin-top: 30px;
}

.service-sticky-area .all-sticky-area .sticky-area .section-area .images {
  position: relative;
  right: -100px;
  padding: 32px 32px 0 0;
}

@media (max-width: 767px) {
  .service-sticky-area .all-sticky-area .sticky-area .section-area .images {
    right: 0;
    margin-top: 30px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .service-sticky-area .all-sticky-area .sticky-area .section-area .images {
    right: 0;
    margin-top: 30px;
  }
}

.service-sticky-area .all-sticky-area .sticky-area .section-area .images img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 4px;
}

.service-sticky-area .all-sticky-area .sticky-area .footer-last-content {
  background: #D6C2FF;
  padding: 32px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-radius: 0 0 4px 4px;
}

@media (max-width: 767px) {
  .service-sticky-area .all-sticky-area .sticky-area .footer-last-content {
    display: inline-block;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .service-sticky-area .all-sticky-area .sticky-area .footer-last-content {
    display: inline-block;
  }
}

@media (max-width: 767px) {
  .service-sticky-area .all-sticky-area .sticky-area .footer-last-content .header-btn8 {
    margin-top: 20px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .service-sticky-area .all-sticky-area .sticky-area .footer-last-content .header-btn8 {
    margin-top: 20px;
  }
}

.service-sticky-area .all-sticky-area .sticky-area .footer-last-content h3 {
  font-family: "Figtree", sans-serif;
  font-size: 24px;
  line-height: 30px;
  font-weight: 600;
  color: var(--Text-Color, #0D0E10);
}

.service-sticky-area .all-sticky-area .sticky-area .footer-last-content p {
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-weight: 500;
  color: #676879;
  line-height: 26px;
}

.all-author-service {
  position: sticky;
  top: 0;
  position: -webkit-sticky;
}

.all-author-service .footer-last-content.footerbg1 {
  background: #C0E4DA;
}

.all-author-service .footer-last-content.footerbg1 .header-btn8 {
  background: #1E9E7A;
}

.all-author-service .footer-last-content.footerbg2 {
  background: #D0BCD3;
}

.all-author-service .footer-last-content.footerbg2 .header-btn8 {
  background: #581164;
}

.all-author-service .services-author-area.bg2 {
  background: #FFEDEC;
}

.all-author-service .services-author-area.bg3 {
  background: #E8F5F2;
  position: relative;
  top: 0;
}

.all-author-service .services-author-area.bg4 {
  background: #EEE7EF;
}

.all-author-service .footer-last-content.footerbg {
  background: #FECDC9;
}

.all-author-service .footer-last-content.footerbg .header-btn8 {
  background: #FC4B3E;
}

.all-author-service .services-author-area {
  background: #F0E9FF;
  border-radius: 4px;
  padding: 32px;
}

.all-author-service .services-author-area .logo-content {
  display: flex;
  align-items: center;
}

.all-author-service .services-author-area .logo-content .img1 {
  height: 50px;
  width: 50px;
  line-height: 50px;
  text-align: center;
  border-radius: 50%;
  background: var(--white-100, #FFF);
  margin: 0 16px 0 0;
}

.all-author-service .services-author-area .logo-content h3 {
  font-family: "Figtree", sans-serif;
  font-size: 32px;
  line-height: 42px;
  font-weight: 700;
  color: var(--Text-Color, #0D0E10);
}

.all-author-service .services-author-area .pera-area h3 {
  font-size: 24px;
  font-family: "Figtree", sans-serif;
  font-weight: 700;
  color: var(--Text-Color, #0D0E10);
  line-height: 32px;
}

.all-author-service .services-author-area .pera-area .content-pera {
  margin-top: 30px;
}

.all-author-service .services-author-area .images {
  position: relative;
  right: -100px;
}

@media (max-width: 767px) {
  .all-author-service .services-author-area .images {
    right: 0;
    margin-top: 30px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .all-author-service .services-author-area .images {
    right: 0;
    margin-top: 30px;
  }
}

.all-author-service .services-author-area .images img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 4px;
}

.all-author-service .footer-last-content {
  background: #D6C2FF;
  padding: 32px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-radius: 0 0 4px 4px;
}

@media (max-width: 767px) {
  .all-author-service .footer-last-content {
    display: inline-block;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .all-author-service .footer-last-content {
    display: inline-block;
  }
}

@media (max-width: 767px) {
  .all-author-service .footer-last-content .header-btn8 {
    margin-top: 20px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .all-author-service .footer-last-content .header-btn8 {
    margin-top: 20px;
  }
}

.all-author-service .footer-last-content h3 {
  font-family: "Figtree", sans-serif;
  font-size: 24px;
  line-height: 30px;
  font-weight: 700;
  color: var(--Text-Color, #0D0E10);
}

.all-author-service .footer-last-content p {
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-weight: 500;
  color: #676879;
  line-height: 26px;
}

/*============= SERVICE CSS AREA ENDS ===============*/
/*============= FEATURES CSS AREA ===============*/
.features1-section-area {
  position: relative;
  overflow: hidden;
  z-index: 1;
}

.features1-section-area .features-elements1 {
  position: absolute;
  top: 0;
  left: 22%;
  z-index: -2;
  right: 22%;
  top: 50px;
}

@media (max-width: 767px) {
  .features1-section-area {
    padding: 50px 0 20px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .features1-section-area {
    padding: 50px 0 20px;
  }
}

.features1-section-area .features1-header span {
  color: var(--white-100, #FFF);
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  display: inline-block;
  margin-bottom: 16px;
}

.features1-section-area .features1-header h2 {
  color: var(--white-100, #FFF);
}

.features1-section-area .features-box-area {
  position: relative;
  z-index: 1;
  transition: all 0.4s ease-in-out;
}

.features1-section-area .features-box-area:hover {
  transform: translateY(-5px);
  transition: all 0.4s ease-in-out;
}

.features1-section-area .features-box-area .features-author-box {
  border-radius: var(--4, 4px);
  border: 1px solid rgba(255, 255, 255, 0.3);
  background: var(--white-10, rgba(255, 255, 255, 0.1));
  -webkit-backdrop-filter: blur(57.0340957642px);
  backdrop-filter: blur(57.0340957642px);
  padding: 32px 32px 0 32px;
  max-height: 478px;
  overflow: hidden;
  margin-bottom: 30px;
  transition: all 0.4s ease-in-out;
}

.features1-section-area .features-box-area .features-author-box:hover {
  transform: translateY(-5px);
  transition: all 0.4s ease-in-out;
}

.features1-section-area .features-box-area .features-author-box:hover .images img {
  transform: scale(1.1);
  transition: all 0.4s;
}

.features1-section-area .features-box-area .features-author-box a {
  color: var(--white-100, #FFF);
  font-family: "Figtree", sans-serif;
  font-size: 24px;
  font-style: normal;
  font-weight: 600;
  line-height: 24px;
  display: inline-block;
  margin-bottom: 16px;
}

@media (max-width: 767px) {
  .features1-section-area .features-box-area .features-author-box a {
    font-size: 20px;
    line-height: 30px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .features1-section-area .features-box-area .features-author-box a {
    font-size: 20px;
    line-height: 30px;
  }
}

.features1-section-area .features-box-area .features-author-box p {
  color: var(--white-100, #FFF);
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 28px;
  opacity: 0.7;
  margin-bottom: 32px;
}

@media (max-width: 767px) {
  .features1-section-area .features-box-area .features-author-box p {
    font-size: 16px;
    line-height: 26px;
  }
}

.features1-section-area .features-box-area .features-author-box .images {
  overflow: hidden;
  border-radius: 4px;
  transition: all 0.4s;
}

.features1-section-area .features-box-area .features-author-box .images img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  transition: all 0.4s;
}

.features1-section-area .features-box-area .features2 {
  max-height: 430px !important;
}

.more-features-scetion-area {
  overflow: hidden;
}

@media (max-width: 767px) {
  .more-features-scetion-area {
    padding: 50px 0 20px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .more-features-scetion-area {
    padding: 50px 0 20px;
  }
}

.more-features-scetion-area .more-features-header span {
  color: #433CE7;
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  display: inline-block;
  margin-bottom: 16px;
}

.more-features-scetion-area .more-features-box {
  border-radius: var(--4, 4px);
  border: 1px solid var(--Stroke-Color, rgba(86, 95, 118, 0.1));
  padding: 32px 24px;
  overflow: hidden;
  transition: all 0.4s ease-in-out;
  position: relative;
  z-index: 1;
  margin-bottom: 30px;
}

.more-features-scetion-area .more-features-box .features-content {
  position: relative;
  z-index: 3;
}

.more-features-scetion-area .more-features-box .more-elements {
  position: absolute;
  top: 0;
  left: 30px;
  z-index: -1;
}

.more-features-scetion-area .more-features-box:hover {
  transform: translateY(-5px);
  background: #433CE7;
  transition: all 0.4s ease-in-out;
}

.more-features-scetion-area .more-features-box:hover .features-icon {
  background: var(--white-100, #FFF);
  transition: all 0.4s ease-in-out;
}

.more-features-scetion-area .more-features-box:hover a {
  color: var(--white-100, #FFF);
  transition: all 0.4s ease-in-out;
}

.more-features-scetion-area .more-features-box:hover p {
  color: var(--white-100, #FFF);
  opacity: 0.7;
  transition: all 0.4s ease-in-out;
}

.more-features-scetion-area .more-features-box:hover a.learnmore {
  color: var(--white-100, #FFF);
  transition: all 0.4s ease-in-out;
}

.more-features-scetion-area .more-features-box .features-icon {
  background: #EDECFD;
  height: 60px;
  width: 60px;
  text-align: center;
  line-height: 60px;
  border-radius: 50%;
  margin-bottom: 24px;
  transition: all 0.4s ease-in-out;
}

.more-features-scetion-area .more-features-box a {
  color: var(--Text-Color, #0D0E10);
  font-family: "Figtree", sans-serif;
  font-size: 24px;
  font-style: normal;
  font-weight: 600;
  line-height: 24px;
  display: inline-block;
  margin-bottom: 16px;
  transition: all 0.4s ease-in-out;
}

@media (max-width: 767px) {
  .more-features-scetion-area .more-features-box a {
    font-size: 20px;
    line-height: 30px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .more-features-scetion-area .more-features-box a {
    font-size: 20px;
    line-height: 30px;
  }
}

.more-features-scetion-area .more-features-box p {
  color: #676879;
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 28px;
  transition: all 0.4s ease-in-out;
}

.more-features-scetion-area .more-features-box a.learnmore {
  color: var(--Text-Color, #0D0E10);
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 18px;
  display: inline-block;
  margin-bottom: 0;
  margin-top: 24px;
  transition: all 0.4s ease-in-out;
}

.more-features-scetion-area .more-features-box a.learnmore i {
  margin-left: 4px;
  transform: rotate(-45deg);
}

.features3-section-area {
  padding: 100px 0 200px;
}

@media (max-width: 767px) {
  .features3-section-area {
    padding: 50px 0 50px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .features3-section-area {
    padding: 50px 0 50px;
  }
}

.features3-section-area .features3-images {
  position: relative;
}

.features3-section-area .features3-images .img1 img {
  border-radius: 4px;
}

.features3-section-area .features3-images .img2 img {
  width: 300px;
  height: 200px;
  -o-object-fit: cover;
  object-fit: cover;
  position: absolute;
  right: -100px;
  bottom: -100px;
}

@media (max-width: 767px) {
  .features3-section-area .features3-images .img2 img {
    height: 100%;
    width: 100%;
    right: 0;
    bottom: 0;
    top: 20px;
    position: relative;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .features3-section-area .features3-images .img2 img {
    height: 100%;
    width: 100%;
    right: 0;
    bottom: 0;
    top: 20px;
    position: relative;
  }
}

@media (max-width: 767px) {
  .features3-section-area .features3-content {
    margin-top: 30px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .features3-section-area .features3-content {
    margin-top: 30px;
  }
}

.features3-section-area .features3-content .features-content-box {
  position: relative;
  background: #FAF9FD;
  padding: 16px 24px;
  border-radius: 4px;
  transition: all 0.4s ease-in-out;
}

.features3-section-area .features3-content .features-content-box:hover {
  background: var(--white-100, #FFF);
  transition: all 0.4s ease-in-out;
  box-shadow: 0px 4px 50px 0px rgba(0, 0, 0, 0.08);
  transform: translateY(-5px);
}

.features3-section-area .features3-content .features-content-box:hover::after {
  background: #4B24EE;
  transition: all 0.4s ease-in-out;
  opacity: 1;
}

.features3-section-area .features3-content .features-content-box::after {
  position: absolute;
  content: "";
  height: 100%;
  width: 6px;
  left: 0;
  top: 0;
  background: #676879;
  border-radius: 4px 0 0 4px;
  transition: all 0.4s ease-in-out;
  opacity: 0.4;
}

.features3-section-area .features3-content .features-content-box .img1 {
  height: 32px;
  width: 32px;
  -o-object-fit: cover;
  object-fit: cover;
  position: absolute;
}

.features3-section-area .features3-content .features-content-box .content {
  padding-left: 50px;
}

.features3-section-area .features3-content .features-content-box .content a {
  font-family: "Figtree", sans-serif;
  font-size: 20px;
  font-weight: 600;
  color: var(--Text-Color, #0D0E10);
  display: inline-block;
  line-height: 20px;
  transition: all 0.4s ease-in-out;
}

.features3-section-area .features3-content .features-content-box .content a:hover {
  color: #4B24EE;
  transition: all 0.4s ease-in-out;
}

.features3-section-area .features3-content .features-content-box .content p {
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-weight: 500;
  color: #676879;
  line-height: 28px;
}

.step-section-area {
  background: #FAF9FD;
  position: relative;
  z-index: 1;
}

@media (max-width: 767px) {
  .step-section-area {
    padding: 50px 0 50px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .step-section-area {
    padding: 50px 0 50px;
  }
}

@media (max-width: 767px) {
  .step-section-area .step-header-area {
    margin-bottom: 30px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .step-section-area .step-header-area {
    margin-bottom: 30px;
  }
}

.step-section-area .step-author-area {
  display: flex;
  position: relative;
  transition: all 0.4s ease-in-out;
  margin: 0 30px 0 0;
}

@media (max-width: 767px) {
  .step-section-area .step-author-area {
    margin: 0;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .step-section-area .step-author-area {
    margin: 0;
  }
}

.step-section-area .step-author-area::after {
  position: absolute;
  content: "";
  height: 100%;
  width: 1px;
  border: 1px dashed #4B24EE;
  z-index: -1;
  left: 35px;
  top: 50px;
  opacity: 0.4;
}

.step-section-area .step-author-area:hover .icons h2 {
  background: #4B24EE;
  color: var(--white-100, #FFF);
  transition: all 0.4s ease-in-out;
}

.step-section-area .step-author-area .icons h2 {
  font-family: "Figtree", sans-serif;
  font-size: 24px;
  font-weight: 700;
  color: var(--Text-Color, #0D0E10);
  background: var(--white-100, #FFF);
  position: relative;
  z-index: 1;
  height: 70px;
  width: 70px;
  text-align: center;
  border-radius: 50%;
  border: 1px solid #4B24EE;
  line-height: 70px;
  transition: all 0.4s ease-in-out;
}

.step-section-area .step-author-area .content {
  margin-left: 32px;
}

.step-section-area .step-author-area .content a {
  font-family: "Figtree", sans-serif;
  font-weight: 600;
  display: inline-block;
  color: var(--Text-Color, #0D0E10);
  font-size: 24px;
  line-height: 24px;
  transition: all 0.4s ease-in-out;
}

.step-section-area .step-author-area .content a:hover {
  color: #4B24EE;
  transition: all 0.4s ease-in-out;
}

.step-section-area .step-author-area .content p {
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-weight: 500;
  color: #676879;
}

.step-section-area .step-author-area.step2::after {
  display: none;
}

.features2 .features1-header span {
  font-family: "Figtree", sans-serif;
  font-weight: 500;
  color: #010ca8;
  transition: all 0.4s ease-in-out;
  display: inline-block;
  padding: 8px 12px;
  border-radius: 32px;
  background: var(--white-100, #FFF);
  line-height: 16px;
  font-size: 16px;
}

/*============= FEATURES CSS AREA ENDS ===============*/
/*============= OTHERS CSS AREA ===============*/
.brand-section-area {
  background: #433CE7;
  position: relative;
}

.brand-section-area .brand-header span {
  color: var(--white-100, #FFF);
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  display: inline-block;
  margin-bottom: 16px;
}

.brand-section-area .brand-header h2 {
  color: var(--white-100, #FFF);
}

.brand-section-area .brand-single-box {
  display: inline-block;
}

.brand-section-area .marquee-wrap {
  background-color: #433CE7;
  width: 100%;
  position: relative;
}

.brand-section-area .marquee-wrap .marquee-text {
  animation: marquee 35s linear infinite;
  position: relative;
  width: 100%;
  white-space: nowrap;
  margin-bottom: 30px;
  padding: 0;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .brand-section-area .marquee-wrap .marquee-text {
    animation: marquee 50s linear infinite;
  }
}

@media (max-width: 767px) {
  .brand-section-area .marquee-wrap .marquee-text {
    animation: marquee 50s linear infinite;
  }
}

.brand-section-area .marquee-wrap .marquee-text .brand-single-box {
  display: inline-block;
}

.brand-section-area .marquee-wrap .marquee-text .brand-single-box h3 {
  color: var(--white-100, #FFF);
  font-family: "Figtree", sans-serif;
  font-size: 40px;
  font-style: normal;
  font-weight: 700;
  line-height: 40px;
}

.brand-section-area .marquee-wrap .marquee-text .brand-single-box h3 img {
  margin: 0 10px;
}

.brand-section-area .marquee-wrap2 {
  background-color: #433CE7;
  width: 100%;
  position: relative;
}

.brand-section-area .marquee-wrap2 .marquee-text {
  animation: marquee-2 35s linear infinite;
  position: relative;
  width: 100%;
  white-space: nowrap;
  padding: 0;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .brand-section-area .marquee-wrap2 .marquee-text {
    animation: marquee-2 50s linear infinite;
  }
}

@media (max-width: 767px) {
  .brand-section-area .marquee-wrap2 .marquee-text {
    animation: marquee-2 50s linear infinite;
  }
}

.brand-section-area .marquee-wrap2 .marquee-text .brand-single-box img {
  height: 50px;
  width: 200px !important;
  -o-object-fit: contain;
  object-fit: contain;
}

.brand2-section-area {
  overflow: hidden;
}

@media (max-width: 767px) {
  .brand2-section-area {
    padding: 40px 0 40px;
  }
}

.brand2-section-area .brand2-header h4 {
  color: var(--Text-Color, #0D0E10);
  font-family: "Figtree", sans-serif;
  font-size: 20px;
  font-style: normal;
  font-weight: 700;
  line-height: 20px;
}

.brand2-section-area .brand2-logos {
  position: relative;
  width: 100%;
  padding: 0;
}

.brand2-section-area .brand2-logos .brand2-logo {
  display: inline-block;
  margin: 0 48px 0 0;
}

.brand2-section-area .brand2-logos .brand2-logo img {
  height: 48px;
  width: 170px;
  -o-object-fit: contain;
  object-fit: contain;
}

.brand2-section-area.brand3 {
  overflow: hidden;
}

.brand2-section-area.brand3 .slick-list.draggable {
  overflow: inherit;
}

@media (max-width: 767px) {
  .brand2-section-area.brand3 {
    padding: 40px 0 40px;
  }
}

.brand2-section-area.brand3 .brand2-header h4 {
  color: var(--Text-Color, #0D0E10);
  font-family: "Figtree", sans-serif;
  font-size: 20px;
  font-style: normal;
  font-weight: 700;
  line-height: 20px;
}

.brand2-section-area.brand3 .brand2-logos {
  position: relative;
  width: 100%;
  padding: 0;
}

.brand2-section-area.brand3 .brand2-logos .brand2-logo {
  display: inline-block;
  margin: 0 48px 0 0;
}

.brand2-section-area.brand3 .brand2-logos .brand2-logo img {
  height: 50px;
  width: 200px;
  -o-object-fit: contain;
  object-fit: contain;
}

.brand-images-area {
  position: relative;
  top: -150px;
}

@media (max-width: 767px) {
  .brand-images-area .images1 {
    margin-bottom: 20px;
  }
}

.brand-images-area .images1 img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 4px;
}

@media (max-width: 767px) {
  .download-app-area {
    padding: 50px 0 50px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .download-app-area {
    padding: 50px 0 50px;
  }
}

.download-app-area .download-header span {
  font-family: "Figtree", sans-serif;
  font-weight: 500;
  color: #010ca8;
  transition: all 0.4s ease-in-out;
  font-size: 16px;
  line-height: 16px;
  display: inline-block;
  padding: 8px 12px;
  border-radius: 32px;
  background: #F8F4FF;
}

.download-app-area .download-images {
  position: relative;
}

.download-app-area .download-images img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 4px;
}

.download-app-area .download-images ul {
  text-align: center;
}

.download-app-area .download-images ul li {
  display: inline-block;
}

.download-app-area .download-images ul li a img {
  width: 135px;
  height: 40px;
  -o-object-fit: contain;
  object-fit: contain;
}

@media (max-width: 767px) {
  .team-inner-section-area {
    padding: 50px 0 20px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .team-inner-section-area {
    padding: 50px 0 20px;
  }
}

.team-inner-section-area .blog-team-images {
  position: relative;
  box-shadow: 0px 4px 50px 0px rgba(0, 0, 0, 0.08);
  margin-bottom: 30px;
}

.team-inner-section-area .blog-team-images .img1 img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 4px 4px 0 0;
}

.team-inner-section-area .blog-team-images .content-area {
  text-align: center;
  background: var(--white-100, #FFF);
  padding: 38px 24px 24px 24px;
  border-radius: 0 0 4px 4px;
  position: relative;
}

.team-inner-section-area .blog-team-images .content-area .ceo-tags p {
  font-size: 12px;
  font-weight: 500;
  color: #010ca8;
  font-family: "Figtree", sans-serif;
  padding: 8px;
  background: var(--white-100, #FFF);
  border: 1px solid #010ca8;
  position: absolute;
  display: inline-block;
  border-radius: 25px;
  line-height: 12px;
  top: -17px;
  left: 34%;
  right: 34%;
}

.team-inner-section-area .blog-team-images .content-area a {
  display: inline-block;
  font-family: "Figtree", sans-serif;
  font-size: 32px;
  line-height: 32px;
  font-weight: 700;
  color: var(--Text-Color, #0D0E10);
}

.team-inner-section-area .blog-team-images .content-area p {
  font-family: "Figtree", sans-serif;
  font-weight: 500;
  color: #676879;
  font-size: 16px;
  line-height: 26px;
}

.team-inner-section-area .blog-team-images .content-area ul li {
  display: inline-block;
}

.team-inner-section-area .blog-team-images .content-area ul li a {
  height: 40px;
  width: 40px;
  display: inline-block;
  text-align: center;
  line-height: 40px;
  border-radius: 50%;
  background: #F6F5FE;
  font-size: 20px;
  margin: 0 4px 0 0;
  transition: all 0.4s ease-in-out;
}

.team-inner-section-area .blog-team-images .content-area ul li a:hover {
  background: #010ca8;
  color: var(--white-100, #FFF);
  transition: all 0.4s ease-in-out;
  transform: translateY(-3px);
}

.about-welcome-section-area.about3 {
  padding: 170px 0 0;
}

.about-welcome-section-area.about3 .download-images {
  position: relative;
  top: 124px;
}

@media (max-width: 767px) {
  .about-welcome-section-area.about3 .download-images {
    top: 37px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .about-welcome-section-area.about3 .download-images {
    top: 37px;
  }
}

.about-welcome-section-area.about3 .download-images img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 4px;
}

.blog-inner-section.inner-download {
  padding: 200px 0 70px;
}

@media (max-width: 767px) {
  .blog-inner-section.inner-download {
    padding: 100px 0 70px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .blog-inner-section.inner-download {
    padding: 100px 0 70px;
  }
}

.blog-inner-section.inner-download .blog-inner-boxs .content ul li {
  display: inline-block;
}

.blog-inner-section.inner-download .blog-inner-boxs .content ul li a img {
  height: 40px;
  width: 135px;
  -o-object-fit: contain;
  object-fit: contain;
  margin-top: 32px;
}

.blog-inner-section.inner-download .blog-inner-boxarea .content ul li {
  display: inline-block;
}

.blog-inner-section.inner-download .blog-inner-boxarea .content ul li a img {
  height: 40px;
  width: 135px;
  -o-object-fit: contain;
  object-fit: contain;
  margin-top: 32px;
}

.brand4-section-area {
  position: relative;
  background: #F8F9FA;
}

@media (max-width: 767px) {
  .brand4-section-area {
    padding: 50px 0 50px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .brand4-section-area {
    padding: 50px 0 50px;
  }
}

.others4-section-area {
  background: #F8F9FA;
  position: relative;
}

@media (max-width: 767px) {
  .others4-section-area {
    padding: 50px 0 50px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .others4-section-area {
    padding: 50px 0 50px;
  }
}

@media (max-width: 767px) {
  .others4-section-area .others-collaborate-area {
    padding: 0;
    margin-bottom: 30px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .others4-section-area .others-collaborate-area {
    padding: 0;
    margin-bottom: 30px;
  }
}

.others4-section-area .others-collaborate-area .listarea {
  display: flex;
}

.others4-section-area .others-collaborate-area .listarea img {
  margin: 0 20px 0 0;
}

.others4-section-area .others-collaborate-area .listarea span {
  background: none;
  color: var(--Text-Color, #0D0E10);
  font-weight: 700;
}

.others4-section-area .collaborate-img img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 4px;
}

.others4-section-area .img2 {
  position: relative;
  left: -100px;
}

@media (max-width: 767px) {
  .others4-section-area .img2 {
    margin-top: 30px;
    margin-bottom: 30px;
    left: 0;
    position: relative;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .others4-section-area .img2 {
    left: 0;
    position: relative;
  }
}

.others5-section-area {
  background: #F8F9FA;
}

@media (max-width: 767px) {
  .others5-section-area {
    padding: 50px 0 50px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .others5-section-area {
    padding: 50px 0 50px;
  }
}

.others5-section-area .all-social-area {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

@media (max-width: 767px) {
  .others5-section-area .all-social-area {
    display: block;
    justify-content: center;
    text-align: center;
  }
}

.others5-section-area .all-social-area .icons1 img {
  height: 50px;
}

.others5-section-area .all-social-area .facebook {
  text-align: center;
}

.others5-section-area .all-social-area .facebook:hover .icons1::after {
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
}

.others5-section-area .all-social-area .facebook .icons1 {
  height: 90px;
  width: 90px;
  text-align: center;
  line-height: 85px;
  border-radius: 50%;
  background: var(--white-100, #FFF);
  margin: 0 auto;
  position: relative;
  border: 1px solid #EEE7EF;
  z-index: 1;
}

.others5-section-area .all-social-area .facebook .icons1 img {
  height: 50px;
  width: 50px;
  -o-object-fit: cover;
  object-fit: cover;
}

.others5-section-area .all-social-area .facebook .icons1:hover::after {
  height: 100%;
  width: 100%;
  transition: all 0.4s ease-in-out;
  left: 0;
  top: 0;
}

.others5-section-area .all-social-area .facebook .icons1::after {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  transition: all 0.4s ease-in-out;
  background: #1877F7;
  left: 40%;
  top: 40%;
  border-radius: 50%;
  z-index: -1;
}

.others5-section-area .all-social-area .facebook a.link {
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-weight: 700;
  color: var(--Text-Color, #0D0E10);
  text-align: center;
  display: inline-block;
}

.others5-section-area .all-social-area .instagram {
  text-align: center;
}

.others5-section-area .all-social-area .instagram:hover .icons1::after {
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
}

.others5-section-area .all-social-area .instagram .icons1 {
  height: 90px;
  width: 90px;
  text-align: center;
  line-height: 80px;
  border-radius: 50%;
  background: var(--white-100, #FFF);
  border: 1px solid #EEE7EF;
  margin: 0 auto;
  position: relative;
  z-index: 1;
  font-size: 50px;
}

.others5-section-area .all-social-area .instagram .icons1:hover::after {
  height: 100%;
  width: 100%;
  transition: all 0.4s ease-in-out;
  left: 0;
  top: 0;
}

.others5-section-area .all-social-area .instagram .icons1::after {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  transition: all 0.4s ease-in-out;
  background: #581164;
  left: 40%;
  top: 40%;
  border-radius: 50%;
  z-index: -1;
}

.others5-section-area .all-social-area .instagram a.link {
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-weight: 700;
  color: var(--Text-Color, #0D0E10);
  text-align: center;
  display: inline-block;
}

.others5-section-area .all-social-area .twitter {
  text-align: center;
}

.others5-section-area .all-social-area .twitter:hover .icons1::after {
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
}

.others5-section-area .all-social-area .twitter .icons1 {
  height: 90px;
  width: 90px;
  text-align: center;
  line-height: 85px;
  border-radius: 50%;
  background: var(--white-100, #FFF);
  margin: 0 auto;
  position: relative;
  border: 1px solid #EEE7EF;
  z-index: 1;
}

.others5-section-area .all-social-area .twitter .icons1:hover::after {
  height: 100%;
  width: 100%;
  transition: all 0.4s ease-in-out;
  left: 0;
  top: 0;
}

.others5-section-area .all-social-area .twitter .icons1::after {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  transition: all 0.4s ease-in-out;
  background: #2188F7;
  left: 40%;
  top: 40%;
  border-radius: 50%;
  z-index: -1;
}

.others5-section-area .all-social-area .twitter a.link {
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-weight: 700;
  color: var(--Text-Color, #0D0E10);
  text-align: center;
  display: inline-block;
}

.others5-section-area .all-social-area .telegram {
  text-align: center;
}

.others5-section-area .all-social-area .telegram:hover .icons1::after {
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
}

.others5-section-area .all-social-area .telegram .icons1 {
  height: 90px;
  width: 90px;
  text-align: center;
  line-height: 85px;
  border-radius: 50%;
  background: var(--white-100, #FFF);
  border: 1px solid #EEE7EF;
  margin: 0 auto;
  position: relative;
  z-index: 1;
}

.others5-section-area .all-social-area .telegram .icons1:hover::after {
  height: 100%;
  width: 100%;
  transition: all 0.4s ease-in-out;
  left: 0;
  top: 0;
}

.others5-section-area .all-social-area .telegram .icons1::after {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  transition: all 0.4s ease-in-out;
  background: #00B0F2;
  left: 40%;
  top: 40%;
  border-radius: 50%;
  z-index: -1;
}

.others5-section-area .all-social-area .telegram a.link {
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-weight: 700;
  color: var(--Text-Color, #0D0E10);
  text-align: center;
  display: inline-block;
}

.others5-section-area .all-social-area .tiktok {
  text-align: center;
}

.others5-section-area .all-social-area .tiktok:hover .icons1::after {
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
}

.others5-section-area .all-social-area .tiktok .icons1 {
  height: 90px;
  width: 90px;
  text-align: center;
  line-height: 85px;
  border-radius: 50%;
  background: var(--white-100, #FFF);
  border: 1px solid #EEE7EF;
  margin: 0 auto;
  position: relative;
  z-index: 1;
}

.others5-section-area .all-social-area .tiktok .icons1:hover::after {
  height: 100%;
  width: 100%;
  transition: all 0.4s ease-in-out;
  left: 0;
  top: 0;
}

.others5-section-area .all-social-area .tiktok .icons1::after {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  transition: all 0.4s ease-in-out;
  background: var(--Text-Color, #0D0E10);
  left: 40%;
  top: 40%;
  border-radius: 50%;
  z-index: -1;
}

.others5-section-area .all-social-area .tiktok a.link {
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-weight: 700;
  color: var(--Text-Color, #0D0E10);
  text-align: center;
  display: inline-block;
}

.others5-section-area .all-social-area .youtube {
  text-align: center;
}

.others5-section-area .all-social-area .youtube:hover .icons1::after {
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
}

.others5-section-area .all-social-area .youtube .icons1 {
  height: 90px;
  width: 90px;
  text-align: center;
  line-height: 85px;
  border-radius: 50%;
  background: var(--white-100, #FFF);
  border: 1px solid #EEE7EF;
  margin: 0 auto;
  position: relative;
  z-index: 1;
}

.others5-section-area .all-social-area .youtube .icons1:hover::after {
  height: 100%;
  width: 100%;
  transition: all 0.4s ease-in-out;
  left: 0;
  top: 0;
}

.others5-section-area .all-social-area .youtube .icons1::after {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  transition: all 0.4s ease-in-out;
  background: #FF0209;
  left: 40%;
  top: 40%;
  border-radius: 50%;
  z-index: -1;
}

.others5-section-area .all-social-area .youtube a.link {
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-weight: 700;
  color: var(--Text-Color, #0D0E10);
  text-align: center;
  display: inline-block;
}

.others5-section-area .all-social-area .behance {
  text-align: center;
}

.others5-section-area .all-social-area .behance:hover .icons1::after {
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
}

.others5-section-area .all-social-area .behance .icons1 {
  height: 90px;
  width: 90px;
  text-align: center;
  line-height: 85px;
  border-radius: 50%;
  background: var(--white-100, #FFF);
  margin: 0 auto;
  border: 1px solid #EEE7EF;
  position: relative;
  z-index: 1;
}

.others5-section-area .all-social-area .behance .icons1:hover::after {
  height: 100%;
  width: 100%;
  transition: all 0.4s ease-in-out;
  left: 0;
  top: 0;
}

.others5-section-area .all-social-area .behance .icons1::after {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  transition: all 0.4s ease-in-out;
  background: #1877F7;
  left: 40%;
  top: 40%;
  border-radius: 50%;
  z-index: -1;
}

.others5-section-area .all-social-area .behance a.link {
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-weight: 700;
  color: var(--Text-Color, #0D0E10);
  text-align: center;
  display: inline-block;
}

.others5-section-area .pinterest {
  text-align: center;
}

.others5-section-area .pinterest:hover .icons1::after {
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
}

.others5-section-area .pinterest .icons1 {
  height: 90px;
  width: 90px;
  text-align: center;
  line-height: 85px;
  border-radius: 50%;
  background: var(--white-100, #FFF);
  margin: 0 auto;
  border: 1px solid #EEE7EF;
  position: relative;
  z-index: 1;
}

.others5-section-area .pinterest .icons1:hover::after {
  height: 100%;
  width: 100%;
  transition: all 0.4s ease-in-out;
  left: 0;
  top: 0;
}

.others5-section-area .pinterest .icons1::after {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  transition: all 0.4s ease-in-out;
  background: #FF0000;
  left: 40%;
  top: 40%;
  border-radius: 50%;
  z-index: -1;
}

.others5-section-area .pinterest a.link {
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-weight: 700;
  color: var(--Text-Color, #0D0E10);
  text-align: center;
  display: inline-block;
}

.others5-section-area .linkedin {
  text-align: center;
}

.others5-section-area .linkedin:hover .icons1::after {
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
}

.others5-section-area .linkedin .icons1 {
  height: 90px;
  width: 90px;
  text-align: center;
  line-height: 85px;
  border-radius: 50%;
  background: var(--white-100, #FFF);
  margin: 0 auto;
  border: 1px solid #EEE7EF;
  position: relative;
  z-index: 1;
}

.others5-section-area .linkedin .icons1:hover::after {
  height: 100%;
  width: 100%;
  transition: all 0.4s ease-in-out;
  left: 0;
  top: 0;
}

.others5-section-area .linkedin .icons1::after {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  transition: all 0.4s ease-in-out;
  background: #007EBB;
  left: 40%;
  top: 40%;
  border-radius: 50%;
  z-index: -1;
}

.others5-section-area .linkedin a.link {
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-weight: 700;
  color: var(--Text-Color, #0D0E10);
  text-align: center;
  display: inline-block;
}

.others5-section-area .github {
  text-align: center;
}

.others5-section-area .github:hover .icons1::after {
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
}

.others5-section-area .github .icons1 {
  height: 90px;
  width: 90px;
  text-align: center;
  line-height: 85px;
  border-radius: 50%;
  background: var(--white-100, #FFF);
  margin: 0 auto;
  border: 1px solid #EEE7EF;
  position: relative;
  z-index: 1;
}

.others5-section-area .github .icons1:hover::after {
  height: 100%;
  width: 100%;
  transition: all 0.4s ease-in-out;
  left: 0;
  top: 0;
}

.others5-section-area .github .icons1::after {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  transition: all 0.4s ease-in-out;
  background: var(--Text-Color, #0D0E10);
  left: 40%;
  top: 40%;
  border-radius: 50%;
  z-index: -1;
}

.others5-section-area .github a.link {
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-weight: 700;
  color: var(--Text-Color, #0D0E10);
  text-align: center;
  display: inline-block;
}

.others5-section-area .gtp {
  text-align: center;
}

.others5-section-area .gtp:hover .icons1::after {
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
}

.others5-section-area .gtp .icons1 {
  height: 90px;
  width: 90px;
  text-align: center;
  line-height: 85px;
  border-radius: 50%;
  background: var(--white-100, #FFF);
  margin: 0 auto;
  border: 1px solid #EEE7EF;
  position: relative;
  z-index: 1;
}

.others5-section-area .gtp .icons1:hover::after {
  height: 100%;
  width: 100%;
  transition: all 0.4s ease-in-out;
  left: 0;
  top: 0;
}

.others5-section-area .gtp .icons1::after {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  transition: all 0.4s ease-in-out;
  background: #0EA982;
  left: 40%;
  top: 40%;
  border-radius: 50%;
  z-index: -1;
}

.others5-section-area .gtp a.link {
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-weight: 700;
  color: var(--Text-Color, #0D0E10);
  text-align: center;
  display: inline-block;
}

.others5-section-area .reddit {
  text-align: center;
}

.others5-section-area .reddit:hover .icons1::after {
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
}

.others5-section-area .reddit .icons1 {
  height: 90px;
  width: 90px;
  text-align: center;
  line-height: 85px;
  border-radius: 50%;
  background: var(--white-100, #FFF);
  margin: 0 auto;
  border: 1px solid #EEE7EF;
  position: relative;
  z-index: 1;
}

.others5-section-area .reddit .icons1:hover::after {
  height: 100%;
  width: 100%;
  transition: all 0.4s ease-in-out;
  left: 0;
  top: 0;
}

.others5-section-area .reddit .icons1::after {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  transition: all 0.4s ease-in-out;
  background: #FF4500;
  left: 40%;
  top: 40%;
  border-radius: 50%;
  z-index: -1;
}

.others5-section-area .reddit a.link {
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-weight: 700;
  color: var(--Text-Color, #0D0E10);
  text-align: center;
  display: inline-block;
}

.others5-section-area .paypal {
  text-align: center;
}

.others5-section-area .paypal:hover .icons1::after {
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
}

.others5-section-area .paypal .icons1 {
  height: 90px;
  width: 90px;
  text-align: center;
  line-height: 85px;
  border-radius: 50%;
  background: var(--white-100, #FFF);
  border: 1px solid #EEE7EF;
  margin: 0 auto;
  position: relative;
  z-index: 1;
}

.others5-section-area .paypal .icons1:hover::after {
  height: 100%;
  width: 100%;
  transition: all 0.4s ease-in-out;
  left: 0;
  top: 0;
}

.others5-section-area .paypal .icons1::after {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  transition: all 0.4s ease-in-out;
  background: #0070BA;
  left: 40%;
  top: 40%;
  border-radius: 50%;
  z-index: -1;
}

.others5-section-area .paypal a.link {
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-weight: 700;
  color: var(--Text-Color, #0D0E10);
  text-align: center;
  display: inline-block;
}

.others5-section-area .thumb {
  text-align: center;
}

.others5-section-area .thumb:hover .icons1::after {
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
}

.others5-section-area .thumb .icons1 {
  height: 90px;
  width: 90px;
  text-align: center;
  line-height: 85px;
  border-radius: 50%;
  border: 1px solid #EEE7EF;
  background: var(--white-100, #FFF);
  margin: 0 auto;
  position: relative;
  z-index: 1;
}

.others5-section-area .thumb .icons1:hover::after {
  height: 100%;
  width: 100%;
  transition: all 0.4s ease-in-out;
  left: 0;
  top: 0;
}

.others5-section-area .thumb .icons1::after {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  transition: all 0.4s ease-in-out;
  background: var(--Text-Color, #0D0E10);
  left: 40%;
  top: 40%;
  border-radius: 50%;
  z-index: -1;
}

.others5-section-area .thumb a.link {
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-weight: 700;
  color: var(--Text-Color, #0D0E10);
  text-align: center;
  display: inline-block;
}

.homepage5-body {
  overflow-x: hidden !important;
}

@media (max-width: 767px) {
  .homepage5-body {
    overflow-x: hidden !important;
  }
}

.others-tools-section-area {
  background: #F8F9FA;
  position: relative;
}

@media (max-width: 767px) {
  .others-tools-section-area {
    padding: 50px 0 50px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .others-tools-section-area {
    padding: 50px 0 50px;
  }
}

.others-tools-section-area .tools-tabs-area ul {
  text-align: center;
  justify-content: center;
}

.others-tools-section-area .tools-tabs-area ul li.nav-item button {
  display: inline-block;
  align-items: center;
  text-align: start;
  font-size: 24px;
  font-weight: 700;
  color: var(--Text-Color, #0D0E10);
  font-family: "Figtree", sans-serif;
  background: var(--white-100, #FFF);
  padding: 12px 16px;
  line-height: 24px;
  border-radius: 54px;
  width: 270px;
  height: 74px;
  margin: 0 30px 0 0;
}

@media (max-width: 767px) {
  .others-tools-section-area .tools-tabs-area ul li.nav-item button {
    margin: 0 0 16px 0;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .others-tools-section-area .tools-tabs-area ul li.nav-item button {
    margin: 0 16px 16px 0;
  }
}

.others-tools-section-area .tools-tabs-area ul li.nav-item button .img1 {
  height: 50px;
  width: 50px;
  text-align: center;
  display: inline-block;
  line-height: 50px;
  border-radius: 50%;
  background: #7D65F6;
  margin: 0 12px 0 0;
}

.others-tools-section-area .tools-tabs-area ul li.nav-item button .img1.red {
  background: #FFEDEC;
}

.others-tools-section-area .tools-tabs-area ul li.nav-item button .img1.purple {
  background: #FCEFFF;
}

.others-tools-section-area .tools-tabs-area ul li.nav-item button .img1.green {
  background: #E8F5F2;
}

.others-tools-section-area .tools-tabs-area ul li.nav-item button.nav-link.active {
  background: #5C3EF4;
  color: var(--white-100, #FFF);
}

.others-tools-section-area .tools-tabs-area .tab-content .tab-pane {
  transform: rotateX(45deg);
  transition: all 0.4s ease-in-out;
}

.others-tools-section-area .tools-tabs-area .tab-content .tab-pane .tools5-boxarea {
  background: var(--white-100, #FFF);
  padding: 20px 16px;
  border-radius: 4px;
  position: relative;
  margin-bottom: 30px;
  transition: all 0.4s ease-in-out;
  z-index: 1;
  overflow: hidden;
}

.others-tools-section-area .tools-tabs-area .tab-content .tab-pane .tools5-boxarea::after {
  position: absolute;
  content: "";
  height: 50px;
  width: 50px;
  left: 0;
  top: 0;
  background: #5C3EF4;
  z-index: -1;
  border-radius: 4px;
  visibility: hidden;
  opacity: 0;
  transition: all 0.4s ease-in-out;
}

.others-tools-section-area .tools-tabs-area .tab-content .tab-pane .tools5-boxarea:hover {
  transform: translateY(-5px);
  transition: all 0.4s ease-in-out;
}

.others-tools-section-area .tools-tabs-area .tab-content .tab-pane .tools5-boxarea:hover .images .img1 {
  background: var(--white-100, #FFF);
  transition: all 0.4s ease-in-out;
}

.others-tools-section-area .tools-tabs-area .tab-content .tab-pane .tools5-boxarea:hover .images .content a {
  color: var(--white-100, #FFF);
  transition: all 0.4s ease-in-out;
}

.others-tools-section-area .tools-tabs-area .tab-content .tab-pane .tools5-boxarea:hover a {
  color: var(--white-100, #FFF) !important;
  transition: all 0.4s ease-in-out;
}

.others-tools-section-area .tools-tabs-area .tab-content .tab-pane .tools5-boxarea:hover p {
  color: var(--white-100, #FFF);
  transition: all 0.4s ease-in-out;
}

.others-tools-section-area .tools-tabs-area .tab-content .tab-pane .tools5-boxarea:hover::after {
  top: 0;
  left: 0;
  right: 0;
  visibility: visible;
  opacity: 1;
  transition: all 0.4s ease-in-out;
  height: 100%;
  width: 100%;
  border-radius: 4px;
}

.others-tools-section-area .tools-tabs-area .tab-content .tab-pane .tools5-boxarea .images {
  display: flex;
  align-items: center;
  transition: all 0.4s ease-in-out;
}

.others-tools-section-area .tools-tabs-area .tab-content .tab-pane .tools5-boxarea .images .img1 {
  height: 40px;
  width: 40px;
  text-align: center;
  line-height: 40px;
  background: #EEEBFE;
  border-radius: 50%;
  transition: all 0.4s ease-in-out;
}

.others-tools-section-area .tools-tabs-area .tab-content .tab-pane .tools5-boxarea .images .content a {
  font-family: "Figtree", sans-serif;
  font-weight: 600;
  color: var(--Text-Color, #0D0E10);
  font-size: 20px;
  line-height: 30px;
  display: inline-block;
  margin-left: 12px;
  transition: all 0.4s ease-in-out;
}

.others-tools-section-area .tools-tabs-area .tab-content .tab-pane .tools5-boxarea p {
  font-size: 16px;
  font-family: "Figtree", sans-serif;
  font-weight: 500;
  color: #676879;
  line-height: 26px;
  transition: all 0.4s ease-in-out;
}

.others-tools-section-area .tools-tabs-area .tab-content .tab-pane .tools5-boxarea a.learnmore {
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  color: var(--Text-Color, #0D0E10);
  font-weight: 700;
  display: inline-block;
  position: relative;
  z-index: 1;
  line-height: 16px;
  transition: all 0.4s ease-in-out;
}

.others-tools-section-area .tools-tabs-area .tab-content .tab-pane .tools5-boxarea a.learnmore::after {
  position: absolute;
  content: "";
  height: 1px;
  width: 0;
  left: 0;
  bottom: 0;
  background: var(--white-100, #FFF);
  transition: all 0.4s ease-in-out;
}

.others-tools-section-area .tools-tabs-area .tab-content .tab-pane .tools5-boxarea a.learnmore:hover {
  color: var(--white-100, #FFF);
  transition: all 0.4s ease-in-out;
}

.others-tools-section-area .tools-tabs-area .tab-content .tab-pane .tools5-boxarea a.learnmore:hover::after {
  width: 100%;
  transition: all 0.4s ease-in-out;
}

.others-tools-section-area .tools-tabs-area .tab-content .tab-pane .tools5-boxarea a.learnmore:hover i {
  transform: rotate(-45deg);
  transition: all 0.4s ease-in-out;
}

.others-tools-section-area .tools-tabs-area .tab-content .tab-pane .tools5-boxarea a.learnmore i {
  margin-left: 4px;
  transition: all 0.4s ease-in-out;
}

.others-tools-section-area .tools-tabs-area .tab-content .tab-pane.fade.show.active {
  transform: rotateX(0);
  transition: all 0.4s ease-in-out;
}

.error-section-area .error-content img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

.error-section-area .error-content .content-area h3 {
  font-family: "Figtree", sans-serif;
  font-size: 40px;
  line-height: 42px;
  font-weight: 700;
  color: var(--Text-Color, #0D0E10);
  margin-bottom: 16px;
}

.error-section-area .error-content .content-area p {
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-weight: 500;
  color: var(--Text-Color, #0D0E10);
  opacity: 0.7;
  line-height: 28px;
  margin-bottom: 24px;
}

.error-section-area .error-content .content-area .header-btn2 {
  background: #433CE7;
}

/*============= OTHERS CSS AREA ===============*/
/*============= WORKS CSS AREA ===============*/
.works1-section-area {
  position: relative;
  background: #FAFAFA;
}

@media (max-width: 767px) {
  .works1-section-area {
    padding: 50px 0 50px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .works1-section-area {
    padding: 50px 0 50px;
  }
}

.works1-section-area .works-bg-area {
  border-radius: var(--4, 4px);
  background: var(--white-100, #FFF);
  padding: 40px 0;
  position: relative;
  overflow: hidden;
  z-index: 1;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .works1-section-area .works-bg-area {
    padding: 30px;
  }
}

@media (max-width: 767px) {
  .works1-section-area .works-bg-area {
    padding: 20px;
  }
}

.works1-section-area .works-bg-area .elements-works {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  z-index: -1;
}

.works1-section-area .works-bg-area .works-header span {
  color: #433CE7;
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  display: inline-block;
  margin-bottom: 16px;
}

.works1-section-area .works-bg-area .tabs-button {
  margin-left: 60px;
  margin-right: 60px;
}

@media (max-width: 767px) {
  .works1-section-area .works-bg-area .tabs-button {
    margin-left: 0;
    margin-right: 0;
  }
}

.works1-section-area .works-bg-area .tabs-button .nav-work {
  width: 100%;
  height: 100%;
  margin: 0 auto;
  border-radius: 36px;
  background: var(--white-100, #FFF);
  box-shadow: 0px 4px 30px 0px rgba(0, 0, 0, 0.08);
  display: inline-block;
  padding: 16px 32px;
}

.works1-section-area .works-bg-area .tabs-button .nav-work a {
  color: var(--Text-Color, #0D0E10);
  text-align: center;
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 16px;
  display: inline-block;
  background: #F6F5FE;
  padding: 12px 24px;
  border-radius: 20px;
  margin: 0 16px 0 0;
}

@media (max-width: 767px) {
  .works1-section-area .works-bg-area .tabs-button .nav-work a {
    display: block;
    margin-bottom: 16px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .works1-section-area .works-bg-area .tabs-button .nav-work a {
    display: inline-block;
    margin-bottom: 16px;
  }
}

.works1-section-area .works-bg-area .tabs-button .nav-work a.active {
  background: #433CE7;
  color: var(--white-100, #FFF);
}

.works1-section-area .works-bg-area .tabContainer {
  width: 100%;
  height: 500px;
  position: relative;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .works1-section-area .works-bg-area .tabContainer {
    height: 670px;
  }
}

.works1-section-area .works-bg-area .tabContainer .Tabcondent {
  overflow: hidden;
  position: absolute;
  width: 100%;
  height: 100%;
  opacity: 0;
  border-radius: 32px;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  transition: all 0.4s ease-in-out;
  transform: translateY(50%);
}

.works1-section-area .works-bg-area .tabContainer .Tabcondent .tabs-img-content-area {
  margin-top: 40px;
}

.works1-section-area .works-bg-area .tabContainer .Tabcondent .tabs-img-content-area .tabs-auhtor-img img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 4px;
}

.works1-section-area .works-bg-area .tabContainer .Tabcondent .tabs-img-content-area .tabs-auhtor-content {
  padding: 0 0 0 40px;
}

@media (max-width: 767px) {
  .works1-section-area .works-bg-area .tabContainer .Tabcondent .tabs-img-content-area .tabs-auhtor-content {
    padding: 0;
    margin-top: 30px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .works1-section-area .works-bg-area .tabContainer .Tabcondent .tabs-img-content-area .tabs-auhtor-content {
    padding: 0;
    margin-top: 30px;
  }
}

.works1-section-area .works-bg-area .tabContainer .Tabcondent .tabs-img-content-area .tabs-auhtor-content span {
  color: #433CE7;
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  display: inline-block;
}

.works1-section-area .works-bg-area .tabContainer .Tabcondent .tabs-img-content-area .tabs-auhtor-content h2 {
  font-size: 32px;
  line-height: 42px;
}

.works1-section-area .works-bg-area .tabContainer .Tabcondent .tabs-img-content-area .tabs-auhtor-content p {
  color: #676879;
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 26px;
  margin-top: 10px;
}

.works1-section-area .works-bg-area .tabContainer .Tabcondent.active {
  width: 100%;
  height: 100%;
  opacity: 1;
  border-radius: 0px;
  transition: all 0.8s ease-in-out;
  transform: translateY(0);
}

@media (max-width: 767px) {

  .homepage6-body,
  html {
    overflow-x: hidden !important;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .homepage6-body,
  html {
    overflow-x: hidden !important;
  }
}

.works4-section-area {
  position: relative;
  padding: 100px 0 100px;
}

@media (max-width: 767px) {
  .works4-section-area {
    padding: 50px 0 50px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .works4-section-area {
    padding: 50px 0 50px;
  }
}

.works4-section-area .sticky-section-area {
  position: relative;
}

.works4-section-area .sticky-section-area .images {
  position: sticky !important;
  top: 100px;
}

.works4-section-area .sticky-section-area .sticky-text {
  margin-bottom: 50px;
  padding: 0 0 0 50px;
}

@media (max-width: 767px) {
  .works4-section-area .sticky-section-area .sticky-text {
    padding: 0;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .works4-section-area .sticky-section-area .sticky-text {
    padding: 0;
  }
}

.works4-section-area .sticky-section-area .sticky-text h3 {
  font-size: 16px;
  font-family: "Figtree", sans-serif;
  font-weight: 700;
  color: #581164;
}

.works4-section-area .sticky-section-area .sticky-text h2 {
  font-size: 32px;
  line-height: 42px;
  font-weight: 600;
}

.works4-section-area .sticky-section-area .sticky-text.text2 {
  margin-top: 130px;
  margin-bottom: 50px;
}

@media (max-width: 767px) {
  .works4-section-area .sticky-section-area .sticky-text.text2 {
    margin-top: 30px;
    margin-bottom: 30px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .works4-section-area .sticky-section-area .sticky-text.text2 {
    margin-top: 30px;
    margin-bottom: 30px;
  }
}

@media (max-width: 767px) {
  .work5-section-area {
    padding: 50px 0 20px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .work5-section-area {
    padding: 50px 0 20px;
  }
}

.work5-section-area .work5-boxarea {
  border: 1px solid #EEEFF1;
  padding: 32px;
  border-radius: 4px;
  position: relative;
  margin-bottom: 30px;
  transition: all 0.4s ease-in-out;
}

.work5-section-area .work5-boxarea:hover {
  background: var(--white-100, #FFF);
  box-shadow: 0px 4px 30px 0px rgba(0, 0, 0, 0.08);
  transition: all 0.4s ease-in-out;
  border: 1px solid var(--white-100, #FFF);
}

.work5-section-area .work5-boxarea:hover h2 {
  color: #5C3EF4;
  transition: all 0.4s ease-in-out;
}

.work5-section-area .work5-boxarea .img {
  position: absolute;
  top: 50px;
  right: -25px;
  width: 30px;
  height: 30px;
}

.work5-section-area .work5-boxarea .img1 {
  position: absolute;
  top: 50px;
  right: -25px;
  width: 30px;
  height: 30px;
}

.work5-section-area .work5-boxarea h2 {
  font-size: 120px;
  font-weight: 700;
  color: var(--Text-Color, #0D0E10);
  font-family: "Figtree", sans-serif;
  line-height: 120px;
  transition: all 0.4s ease-in-out;
}

.work5-section-area .work5-boxarea a {
  display: inline-block;
  font-size: 20px;
  font-weight: 600;
  color: var(--Text-Color, #0D0E10);
  font-family: "Figtree", sans-serif;
  line-height: 30px;
}

.work5-section-area .work5-boxarea p {
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-weight: 500;
  color: #676879;
  line-height: 26px;
  transition: all 0.4s ease-in-out;
}

/*============= WORKS CSS AREA ENDS===============*/
/*============= BLOG CSS AREA ===============*/
.blog1-section-area {
  background: #FAFAFA;
}

@media (max-width: 767px) {
  .blog1-section-area {
    padding: 50px 0 50px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .blog1-section-area {
    padding: 50px 0 50px;
  }
}

.blog1-section-area .blog1-header span {
  color: #433CE7;
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  display: inline-block;
  margin-bottom: 16px;
}

.blog1-section-area .blog1-boxarea {
  border-radius: var(--4, 4px);
  border: 1px solid var(--Stroke-Color, rgba(86, 95, 118, 0.1));
  transition: all 0.4s ease-in-out;
  margin-bottom: 30px;
}

.blog1-section-area .blog1-boxarea:hover {
  border-radius: var(--4, 4px);
  background: var(--white-100, #FFF);
  box-shadow: 0px 4px 30px 0px rgba(0, 0, 0, 0.08);
}

.blog1-section-area .blog1-boxarea:hover .blog-img {
  transition: all 0.4s ease-in-out;
}

.blog1-section-area .blog1-boxarea:hover .blog-img::after {
  height: 100%;
  width: 100%;
  transition: all 0.6s ease-in-out;
  z-index: 1;
  top: 0;
  bottom: auto;
}

.blog1-section-area .blog1-boxarea:hover .blog-img img {
  transform: scale(1.1);
  transition: all 0.4s ease-in-out;
}

.blog1-section-area .blog1-boxarea .blog-img {
  overflow: hidden;
  border-radius: 4px 4px 0 0;
  position: relative;
  z-index: 1;
  transition: all 0.6s ease-in-out;
}

.blog1-section-area .blog1-boxarea .blog-img::after {
  position: absolute;
  content: "";
  height: 0;
  width: 100%;
  z-index: 1;
  bottom: 0;
  left: 0;
  transition: all 0.4s ease-in-out;
  background: #433CE7;
  opacity: 0.3;
}

.blog1-section-area .blog1-boxarea .blog-img img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  transition: all 0.4s ease-in-out;
}

.blog1-section-area .blog1-boxarea .blog-all-content-area {
  padding: 24px;
}

.blog1-section-area .blog1-boxarea .blog-all-content-area .blog1-content {
  display: flex;
  align-items: center;
}

.blog1-section-area .blog1-boxarea .blog-all-content-area .blog1-content img {
  margin: 0 10px 0 0;
}

.blog1-section-area .blog1-boxarea .blog-all-content-area .blog1-content a {
  color: #676879;
  font-family: "Figtree", sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  display: inline-block;
  transition: all 0.4s ease-in-out;
}

.blog1-section-area .blog1-boxarea .blog-all-content-area .blog-main-content a {
  color: var(--Text-Color, #0D0E10);
  font-family: "Figtree", sans-serif;
  font-size: 20px;
  font-style: normal;
  font-weight: 600;
  line-height: 28px;
  display: inline-block;
  margin-bottom: 16px;
  margin-top: 16px;
  transition: all 0.4s ease-in-out;
}

.blog1-section-area .blog1-boxarea .blog-all-content-area .blog-main-content a:hover {
  color: #433CE7;
  transition: all 0.4s ease-in-out;
}

.blog1-section-area .blog1-boxarea .blog-all-content-area .blog-main-content p {
  color: #676879;
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 28px;
  transition: all 0.4s ease-in-out;
}

.blog1-section-area .blog1-boxarea .blog-all-content-area .blog-main-content a.learnmore {
  color: var(--Text-Color, #0D0E10);
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 18px;
  display: inline-block;
  margin-top: 24px;
  margin-bottom: 0;
  transition: all 0.4s ease-in-out;
}

.blog1-section-area .blog1-boxarea .blog-all-content-area .blog-main-content a.learnmore:hover {
  color: #433CE7;
  transition: all 0.4s ease-in-out;
}

.blog1-section-area .blog1-boxarea .blog-all-content-area .blog-main-content a.learnmore i {
  margin-left: 4px;
  transform: rotate(-45deg);
}

.blog2-section-area {
  background: var(--BG, #F7F9FA);
}

@media (max-width: 767px) {
  .blog2-section-area {
    padding: 50px 0 20px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .blog2-section-area {
    padding: 50px 0 20px;
  }
}

.blog2-section-area .blog2-header span {
  border-radius: 32px;
  background: rgba(110, 36, 255, 0.05);
  color: #010ca8;
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  display: inline-block;
  padding: 8px 12px;
  margin-bottom: 12px;
}

.blog2-section-area .blog-box-area2 {
  border-radius: 10px;
  border: 1px solid var(--Stroke-Color, rgba(86, 95, 118, 0.1));
  transition: all 0.4s ease-in-out;
  margin-bottom: 30px;
}

.blog2-section-area .blog-box-area2:hover {
  border: 1px solid var(--BG, #F7F9FA);
}

.blog2-section-area .blog-box-area2:hover .blog-all-boxarea {
  border-radius: 0 0 10px 10px;
  background: var(--white-100, #FFF);
  box-shadow: 0px 4px 50px 0px rgba(0, 0, 0, 0.08);
  transition: all 0.4s ease-in-out;
}

.blog2-section-area .blog-box-area2:hover .blog2-img {
  transition: all 0.4s ease-in-out;
}

.blog2-section-area .blog-box-area2:hover .blog2-img::after {
  height: 100%;
  width: 100%;
  transition: all 0.4s ease-in-out;
}

.blog2-section-area .blog-box-area2:hover .blog2-img img {
  transform: scale(1.1);
  transition: all 0.4s ease-in-out;
}

.blog2-section-area .blog-box-area2 .blog2-img {
  overflow: hidden;
  transition: all 0.4s ease-in-out;
  border-radius: 10px 10px 0 0;
  position: relative;
}

.blog2-section-area .blog-box-area2 .blog2-img::after {
  position: absolute;
  content: "";
  height: 0;
  width: 100%;
  transition: all 0.4s ease-in-out;
  z-index: 1;
  left: 0;
  top: 0;
  background: #010ca8;
  opacity: 0.3;
  border-radius: 10px 10px 0 0;
}

.blog2-section-area .blog-box-area2 .blog2-img img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 4px 4px 0 0;
  transition: all 0.4s ease-in-out;
}

.blog2-section-area .blog-box-area2 .blog-all-boxarea {
  padding: 24px;
  transition: all 0.4s ease-in-out;
  border-radius: 0 0 10px 10px;
}

.blog2-section-area .blog-box-area2 .blog-all-boxarea .blog-tags-area {
  display: flex;
  align-items: center;
}

.blog2-section-area .blog-box-area2 .blog-all-boxarea .blog-tags-area a {
  color: #676879;
  font-family: "Figtree", sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 14px;
  transition: all 0.4s ease-in-out;
  display: inline-block;
}

.blog2-section-area .blog-box-area2 .blog-all-boxarea .blog-tags-area .date {
  transition: all 0.4s ease-in-out;
  margin: -7px 0 0 16px;
}

.blog2-section-area .blog-box-area2 .blog-all-boxarea .blog-tags-area .date a img {
  transition: all 0.4s ease-in-out;
  margin: 0 6px 0 0;
}

.blog2-section-area .blog-box-area2 .blog-all-boxarea .blog2-content a {
  color: var(--Text-Color, #0D0E10);
  font-family: "Figtree", sans-serif;
  font-size: 20px;
  font-style: normal;
  font-weight: 600;
  line-height: 20px;
  display: inline-block;
  margin-bottom: 16px;
  margin-top: 16px;
  text-transform: capitalize;
  transition: all 0.4s ease-in-out;
}

.blog2-section-area .blog-box-area2 .blog-all-boxarea .blog2-content a:hover {
  color: #010ca8;
  transition: all 0.4s ease-in-out;
}

.blog2-section-area .blog-box-area2 .blog-all-boxarea .blog2-content p {
  color: #676879;
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  transition: all 0.4s ease-in-out;
  line-height: 28px;
}

.blog2-section-area .blog-box-area2 .blog-all-boxarea .blog2-content .readmore {
  color: var(--Text-Color, #0D0E10);
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 18px;
  text-transform: capitalize;
  margin-bottom: 0 !important;
  transition: all 0.4s ease-in-out;
  margin-top: 20px !important;
}

.blog2-section-area .blog-box-area2 .blog-all-boxarea .blog2-content .readmore:hover {
  color: #010ca8;
  transition: all 0.4s ease-in-out;
}

.blog2-section-area .blog-box-area2 .blog-all-boxarea .blog2-content .readmore i {
  margin-left: 4px;
  transform: rotate(-45deg);
}

.blog-inner-section {
  padding: 100px 0 70px 0;
}

@media (max-width: 767px) {
  .blog-inner-section {
    padding: 50px 0 20px 0;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .blog-inner-section {
    padding: 50px 0 20px 0;
  }
}

.blog-inner-section .blog-inner-content .blog-inner-header span {
  font-family: "Figtree", sans-serif;
  font-weight: 500;
  color: #010ca8;
  transition: all 0.4s ease-in-out;
  font-size: 16px;
  line-height: 16px;
  display: inline-block;
  padding: 8px 12px;
  border-radius: 32px;
  background: #F8F4FF;
}

.blog-inner-section .blog-inner-content .content-area {
  margin-top: 20px;
}

.blog-inner-section .blog-inner-content .blog-inner-boxs {
  box-shadow: 0px 4px 50px 0px rgba(0, 0, 0, 0.08);
  padding: 32px;
  border-radius: 4px;
  transition: all 0.4s ease-in-out;
}

.blog-inner-section .blog-inner-content .blog-inner-boxs:hover .images::after {
  height: 100%;
  width: 100%;
  border-radius: 4px;
  transition: all 0.4s ease-in-out;
}

.blog-inner-section .blog-inner-content .blog-inner-boxs:hover .images img {
  transform: scale(1.1);
  transition: all 0.4s ease-in-out;
  rotate: -4deg;
}

.blog-inner-section .blog-inner-content .blog-inner-boxs .images {
  transition: all 0.4s ease-in-out;
  overflow: hidden;
  border-radius: 4px;
  position: relative;
}

.blog-inner-section .blog-inner-content .blog-inner-boxs .images::after {
  position: absolute;
  content: "";
  height: 0;
  width: 100%;
  left: 0;
  top: 0;
  background: #010ca8;
  opacity: 0.5;
  transition: all 0.4s ease-in-out;
}

.blog-inner-section .blog-inner-content .blog-inner-boxs .images img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 4px;
  transition: all 0.4s ease-in-out;
}

.blog-inner-section .blog-inner-content .blog-inner-boxs .content {
  padding: 0 0 0 30px;
}

@media (max-width: 767px) {
  .blog-inner-section .blog-inner-content .blog-inner-boxs .content {
    padding: 0;
    margin-top: 30px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .blog-inner-section .blog-inner-content .blog-inner-boxs .content {
    padding: 0;
    margin-top: 30px;
  }
}

.blog-inner-section .blog-inner-content .blog-inner-boxs .content a {
  font-family: "Figtree", sans-serif;
  font-size: 24px;
  line-height: 30px;
  font-weight: 600;
  color: var(--Text-Color, #0D0E10);
  display: block;
  transition: all 0.4s ease-in-out;
}

.blog-inner-section .blog-inner-content .blog-inner-boxs .content a:hover {
  color: #010ca8;
  transition: all 0.4s ease-in-out;
}

.blog-inner-section .blog-inner-content .blog-inner-boxs .content p {
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-weight: 500;
  color: #676879;
  line-height: 26px;
}

.blog-inner-section .blog-inner-content .blog-inner-boxarea {
  position: relative;
  margin-bottom: 30px;
  padding: 24px;
  box-shadow: 0px 4px 50px 0px rgba(0, 0, 0, 0.08);
  background: var(--white-100, #FFF);
  border-radius: 4px;
}

.blog-inner-section .blog-inner-content .blog-inner-boxarea:hover .images::after {
  height: 100%;
  width: 100%;
  transition: all 0.4s ease-in-out;
}

.blog-inner-section .blog-inner-content .blog-inner-boxarea:hover .images img {
  transition: all 0.4s ease-in-out;
  transform: scale(1.1) rotate(-4deg);
}

.blog-inner-section .blog-inner-content .blog-inner-boxarea .images {
  transition: all 0.4s ease-in-out;
  overflow: hidden;
  border-radius: 4px;
  position: relative;
}

.blog-inner-section .blog-inner-content .blog-inner-boxarea .images::after {
  position: absolute;
  content: "";
  height: 0;
  width: 100%;
  left: 0;
  top: 0;
  background: #010ca8;
  opacity: 0.5;
  transition: all 0.4s ease-in-out;
}

.blog-inner-section .blog-inner-content .blog-inner-boxarea .images img {
  height: 100%;
  width: 100%;
  border-radius: 4px;
  transition: all 0.4s ease-in-out;
}

.blog-inner-section .blog-inner-content .blog-inner-boxarea .content a {
  font-family: "Figtree", sans-serif;
  font-size: 24px;
  line-height: 30px;
  font-weight: 600;
  color: var(--Text-Color, #0D0E10);
  display: block;
  transition: all 0.4s ease-in-out;
}

.blog-inner-section .blog-inner-content .blog-inner-boxarea .content a:hover {
  color: #010ca8;
  transition: all 0.4s ease-in-out;
}

.blog-inner-section .blog-inner-content .blog-inner-boxarea .content p {
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-weight: 500;
  color: #676879;
  line-height: 26px;
}

.blog-artical-area {
  background: var(--BG, #F7F9FA);
  position: relative;
}

@media (max-width: 767px) {
  .blog-artical-area {
    padding: 50px 0 50px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .blog-artical-area {
    padding: 50px 0 50px;
  }
}

.blog-artical-area .blog-artical-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

@media (max-width: 767px) {
  .blog-artical-area .blog-artical-header {
    display: inline-block;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .blog-artical-area .blog-artical-header {
    display: inline-block;
  }
}

.blog-artical-area .blog-artical-header h2 {
  font-size: 42px;
  line-height: 52px;
}

@media (max-width: 767px) {
  .blog-artical-area .blog-artical-header h2 {
    font-size: 32px;
    line-height: 42px;
  }
}

@media (max-width: 767px) {
  .blog-artical-area .blog-artical-header ul {
    margin-top: 20px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .blog-artical-area .blog-artical-header ul {
    margin-top: 20px;
  }
}

.blog-artical-area .blog-artical-header ul li button {
  background: #F8F4FF;
  display: inline-block;
  font-family: "Figtree", sans-serif;
  font-size: 18px;
  font-weight: 700;
  color: #010ca8;
  padding: 8px 24px;
  line-height: 16px;
  border-radius: 32px;
  margin: 0 16px 0 0;
  border: none;
  outline: none;
  cursor: pointer;
}

@media (max-width: 767px) {
  .blog-artical-area .blog-artical-header ul li button {
    margin-bottom: 10px;
    text-align: center;
  }
}

.blog-artical-area .blog-artical-header ul li .nav-link.active {
  background: #010ca8;
  color: var(--white-100, #FFF);
}

.blog-artical-area .blog-inner-tabs {
  box-shadow: 0px 4px 50px 0px rgba(0, 0, 0, 0.08);
  padding: 24px 16px;
  border-radius: 4px;
  position: relative;
  margin: 0 30px 30px 0;
}

@media (max-width: 767px) {
  .blog-artical-area .blog-inner-tabs {
    margin: 0 0 30px 0;
  }
}

.blog-artical-area .blog-inner-tabs:hover .img1::after {
  height: 100%;
  width: 100%;
  transition: all 0.4s ease-in-out;
}

.blog-artical-area .blog-inner-tabs:hover .img1 img {
  transform: scale(1.1) rotate(-4deg);
  transition: all 0.4s ease-in-out;
}

.blog-artical-area .blog-inner-tabs .img1 {
  overflow: hidden;
  transition: all 0.4s ease-in-out;
  border-radius: 4px;
  position: relative;
  z-index: 1;
}

.blog-artical-area .blog-inner-tabs .img1::after {
  position: absolute;
  content: "";
  height: 0;
  width: 100%;
  border-radius: 4px;
  background: #010ca8;
  opacity: 0.5;
  transition: all 0.4s ease-in-out;
  left: 0;
  top: 0;
}

.blog-artical-area .blog-inner-tabs .img1 img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  transition: all 0.4s ease-in-out;
  border-radius: 4px;
}

.blog-artical-area .blog-inner-tabs .content-area span {
  background: #F8F4FF;
  font-family: "Figtree", sans-serif;
  font-weight: 500;
  color: #010ca8;
  display: inline-block;
  padding: 8px 12px;
  line-height: 16px;
  font-size: 16px;
  border-radius: 32px;
}

.blog-artical-area .blog-inner-tabs .content-area a {
  font-family: "Figtree", sans-serif;
  font-size: 24px;
  line-height: 30px;
  font-weight: 600;
  color: var(--Text-Color, #0D0E10);
  display: block;
  transition: all 0.4s ease-in-out;
}

.blog-artical-area .blog-inner-tabs .content-area a:hover {
  color: #010ca8;
  transition: all 0.4s ease-in-out;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .blog-artical-area .blog-inner-tabs .content-area a {
    font-size: 20px;
    line-height: 30px;
  }
}

.blog-artical-area .blog-inner-tabs .content-area p {
  font-size: 16px;
  font-family: "Figtree", sans-serif;
  font-weight: 500;
  color: #676879;
  line-height: 26px;
}

.blog-inner-section.inner-section2 {
  padding: 100px 0 100px;
}

@media (max-width: 767px) {
  .blog-inner-section.inner-section2 {
    padding: 50px 0 50px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .blog-inner-section.inner-section2 {
    padding: 50px 0 50px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .blog-inner-section.inner-section2 .blog-inner-boxarea .content a {
    font-size: 20px;
    line-height: 30px;
  }
}

.blog-inner-section.inner-section2 .blog-inner-boxarea .content a.readmore {
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-weight: 700;
  color: var(--Text-Color, #0D0E10);
  display: inline-block;
  position: relative;
  z-index: 1;
  line-height: 20px;
  transition: all 0.4s ease-in-out;
}

.blog-inner-section.inner-section2 .blog-inner-boxarea .content a.readmore::after {
  position: absolute;
  content: "";
  height: 0;
  width: 0;
  left: 0;
  bottom: 0;
  background: #010ca8;
  transition: all 0.4s ease-in-out;
}

.blog-inner-section.inner-section2 .blog-inner-boxarea .content a.readmore:hover {
  color: #010ca8;
  transition: all 0.4s ease-in-out;
}

.blog-inner-section.inner-section2 .blog-inner-boxarea .content a.readmore:hover::after {
  height: 1px;
  width: 100%;
  transition: all 0.4s ease-in-out;
}

.blog-inner-section.inner-section2 .blog-inner-boxarea .content a.readmore i {
  margin-left: 4px;
  transform: rotate(-45deg);
}

.blog-inner-section.inner-section2 .pagination-area nav ul {
  justify-content: center;
}

.blog-inner-section.inner-section2 .pagination-area nav ul li a {
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-weight: 700;
  color: var(--Text-Color, #0D0E10);
  height: 55px;
  width: 55px;
  text-align: center;
  line-height: 43px;
  border-radius: 50%;
  box-shadow: none;
  margin: 0 10px 0 0;
  transition: all 0.4s ease-in-out;
  border: 1px solid var(--Stroke-Color, rgba(86, 95, 118, 0.1));
}

.blog-inner-section.inner-section2 .pagination-area nav ul li a:hover {
  background: #010ca8;
  transition: all 0.4s ease-in-out;
  color: var(--white-100, #FFF);
}

.blog-inner-section.inner-section2 .pagination-area nav ul li a.active {
  background: #010ca8;
  color: var(--white-100, #FFF);
  transition: all 0.4s ease-in-out;
}

.blog-right-details-area {
  background: var(--BG, #F7F9FA);
  position: relative;
}

@media (max-width: 767px) {
  .blog-right-details-area {
    padding: 50px 0 50px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .blog-right-details-area {
    padding: 50px 0 50px;
  }
}

.blog-right-details-area .blog-right-area {
  padding: 0 40px 0 0;
}

@media (max-width: 767px) {
  .blog-right-details-area .blog-right-area {
    padding: 0;
    margin-bottom: 30px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .blog-right-details-area .blog-right-area {
    padding: 0;
    margin-bottom: 30px;
  }
}

.blog-right-details-area .blog-right-area .img1-inner img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 4px;
}

.blog-right-details-area .blog-right-area .blog-list-area {
  display: flex;
}

.blog-right-details-area .blog-right-area .blog-list-area .img1 img {
  margin: 0 30px 0 0;
}

.blog-right-details-area .blog-right-area .blog-list-area .content span {
  font-weight: 700;
  color: var(--Text-Color, #0D0E10);
  display: inline-block;
}

.blog-right-details-area .blog-right-area .blogs-widget-area .blogs-widget-section {
  margin-bottom: 30px;
}

.blog-right-details-area .blog-right-area .blogs-widget-area .blogs-widget-section .img1 img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 4px;
}

.blog-right-details-area .blog-right-area .blogs-widget-area .blogs-widget-section .content h3 {
  font-size: 32px;
  line-height: 42px;
}

.blog-right-details-area .blog-right-area .img3 img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 4px;
  transition: all 0.4s ease-in-out;
}

.blog-right-details-area .blog-right-area .peragraph-box {
  padding: 50px 85px;
  background: #F0EEFA;
  border-radius: 4px;
}

@media (max-width: 767px) {
  .blog-right-details-area .blog-right-area .peragraph-box {
    padding: 30px;
  }
}

.blog-right-details-area .blog-right-area .peragraph-box p {
  font-size: 24px;
  font-family: "Figtree", sans-serif;
  font-weight: 700;
  color: var(--Text-Color, #0D0E10);
  line-height: 34px;
}

.blog-right-details-area .blog-team-area .blog-team-images {
  position: relative;
  box-shadow: 0px 4px 50px 0px rgba(0, 0, 0, 0.08);
}

.blog-right-details-area .blog-team-area .blog-team-images .img1 img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 4px 4px 0 0;
}

.blog-right-details-area .blog-team-area .blog-team-images .content-area {
  text-align: center;
  background: var(--white-100, #FFF);
  padding: 38px 24px 24px 24px;
  border-radius: 0 0 4px 4px;
  position: relative;
}

.blog-right-details-area .blog-team-area .blog-team-images .content-area .ceo-tags p {
  font-size: 12px;
  font-weight: 500;
  color: #010ca8;
  font-family: "Figtree", sans-serif;
  padding: 8px;
  background: var(--white-100, #FFF);
  border: 1px solid #010ca8;
  position: absolute;
  display: inline-block;
  border-radius: 25px;
  line-height: 12px;
  top: -17px;
  left: 40%;
}

.blog-right-details-area .blog-team-area .blog-team-images .content-area a {
  display: inline-block;
  font-family: "Figtree", sans-serif;
  font-size: 32px;
  line-height: 32px;
  font-weight: 700;
  color: var(--Text-Color, #0D0E10);
}

.blog-right-details-area .blog-team-area .blog-team-images .content-area p {
  font-family: "Figtree", sans-serif;
  font-weight: 500;
  color: #676879;
  font-size: 16px;
  line-height: 26px;
}

.blog-right-details-area .blog-team-area .blog-team-images .content-area ul li {
  display: inline-block;
}

.blog-right-details-area .blog-team-area .blog-team-images .content-area ul li a {
  height: 40px;
  width: 40px;
  display: inline-block;
  text-align: center;
  line-height: 40px;
  border-radius: 50%;
  background: #F6F5FE;
  font-size: 20px;
  margin: 0 4px 0 0;
  transition: all 0.4s ease-in-out;
}

.blog-right-details-area .blog-team-area .blog-team-images .content-area ul li a:hover {
  background: #010ca8;
  color: var(--white-100, #FFF);
  transition: all 0.4s ease-in-out;
  transform: translateY(-3px);
}

.blog-right-details-area .blog-team-area .catagories-area {
  background: var(--white-100, #FFF);
  padding: 24px;
  border-radius: 4px;
  position: relative;
  box-shadow: 0px 4px 50px 0px rgba(0, 0, 0, 0.08);
}

.blog-right-details-area .blog-team-area .catagories-area h2 {
  font-size: 32px;
  line-height: 42px;
}

.blog-right-details-area .blog-team-area .catagories-area ul li a {
  font-size: 20px;
  font-weight: 700;
  color: var(--Text-Color, #0D0E10);
  display: inline-block;
  font-family: "Figtree", sans-serif;
  line-height: 30px;
  background: #F6F5FE;
  border-radius: 4px;
  padding: 16px 16px 16px 22px;
  transition: all 0.4s ease-in-out;
  position: relative;
  z-index: 1;
}

.blog-right-details-area .blog-team-area .catagories-area ul li a::after {
  position: absolute;
  content: "";
  height: 100%;
  width: 6px;
  left: 0;
  top: 0;
  border-radius: 0 4px 4px 0;
  transition: all 0.4s ease-in-out;
  z-index: -1;
  background: #010ca8;
}

.blog-right-details-area .blog-team-area .catagories-area ul li a:hover {
  transition: all 0.4s ease-in-out;
  color: var(--white-100, #FFF);
  transform: translateY(-5px);
}

.blog-right-details-area .blog-team-area .catagories-area ul li a:hover::after {
  width: 100%;
  height: 100%;
  transition: all 0.4s ease-in-out;
}

.blog-right-area.blog-left {
  padding: 0 0 0 50px;
}

@media (max-width: 767px) {
  .blog-right-area.blog-left {
    padding: 0;
    margin-top: 30px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .blog-right-area.blog-left {
    padding: 0;
    margin-top: 30px;
  }
}

.blog-right-area.blog-left .img1-inner img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 4px;
}

.blog4-section-area {
  background: #F8F9FA;
  position: relative;
}

.blog4-section-area .blog4-boxarea {
  position: relative;
  margin-bottom: 30px;
}

.blog4-section-area .blog4-boxarea:hover .img1::after {
  height: 100%;
  width: 100%;
}

.blog4-section-area .blog4-boxarea:hover .img1 img {
  transform: scale(1.1) rotate(-4deg);
  transition: all 0.4s ease-in-out;
}

.blog4-section-area .blog4-boxarea .img1 {
  transition: all 0.4s ease-in-out;
  border-radius: 4px;
  position: relative;
  z-index: 1;
  overflow: hidden;
}

.blog4-section-area .blog4-boxarea .img1::after {
  position: absolute;
  content: "";
  height: 0;
  width: 100%;
  left: 0;
  top: 0;
  background: #581164;
  transition: all 0.4s ease-in-out;
  opacity: 0.5;
  border-radius: 4px;
}

.blog4-section-area .blog4-boxarea .img1 img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  transition: all 0.4s ease-in-out;
}

.blog4-section-area .blog4-boxarea .blog-content {
  background: var(--white-100, #FFF);
  border-radius: 5px;
  padding: 24px 16px;
  transition: all 0.4s ease-in-out;
  position: relative;
  margin: -135px 16px 0 16px;
  z-index: 2;
}

.blog4-section-area .blog4-boxarea .blog-content .date {
  display: flex;
  align-items: center;
}

.blog4-section-area .blog4-boxarea .blog-content .date a {
  font-size: 16px;
  font-weight: 500;
  color: #676879;
  font-family: "Figtree", sans-serif;
  display: inline-block;
}

.blog4-section-area .blog4-boxarea .blog-content .date a img {
  margin: -3px 6px 0 0;
}

.blog4-section-area .blog4-boxarea .blog-content .date .social {
  margin: 0 16px 0 0;
}

.blog4-section-area .blog4-boxarea .blog-content a {
  font-family: "Figtree", sans-serif;
  font-size: 20px;
  font-weight: 600;
  color: var(--Text-Color, #0D0E10);
  display: inline-block;
  line-height: 28px;
  transition: all 0.4s ease-in-out;
}

.blog4-section-area .blog4-boxarea .blog-content a:hover {
  color: #581164;
  transition: all 0.4s ease-in-out;
}

.blog4-section-area .blog4-boxarea .blog-content p {
  font-size: 16px;
  font-family: "Figtree", sans-serif;
  font-weight: 500;
  color: #676879;
  line-height: 26px;
}

.blog4-section-area .blog4-boxarea .blog-content .readmore {
  font-size: 16px;
  font-family: "Figtree", sans-serif;
  font-weight: 700;
  color: var(--Text-Color, #0D0E10);
  display: inline-block;
}

.blog4-section-area .blog4-boxarea .blog-content .readmore i {
  margin-left: 4px;
  transform: rotate(-45deg);
}

/*============= BLOG CSS AREA ENDS ===============*/
/*============= FOOTER CSS AREA ===============*/
.footer-section-area {
  position: relative;
  overflow: hidden;
  z-index: 1;
  padding: 0 0 28px 0;
}

.footer-section-area .footer-elements {
  position: absolute;
  top: 0;
  left: 22%;
  right: 22%;
  z-index: -1;
}

@media (max-width: 767px) {
  .footer-section-area .footer-header {
    padding: 40px 0 40px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .footer-section-area .footer-header {
    padding: 40px 0 40px;
  }
}

.footer-section-area .footer-header h2 {
  color: var(--white-100, #FFF);
  margin-bottom: 20px;
  font-family: "Figtree", sans-serif !important;
  ;
}

.footer-section-area .footer-header span {
  color: var(--white-100, #FFF);
  font-family: "Figtree", sans-serif;
  font-size: 20px;
  font-style: normal;
  font-weight: 700;
  line-height: 20px;
  display: inline-block;
}

.footer-section-area .footer-header span img {
  margin: 0 16px;
}

.footer-section-area .footer-header .header-btn {
  margin-top: 32px;
}

.footer-section-area .footer-last-section {
  background: var(--white-10, rgba(255, 255, 255, 0.1));
  border-radius: var(--4, 4px);
  border: 1px solid rgba(255, 255, 255, 0.3);
  -webkit-backdrop-filter: blur(57.0340957642px);
  backdrop-filter: blur(57.0340957642px);
  padding: 50px 70px 28px 70px;
}

@media (max-width: 767px) {
  .footer-section-area .footer-last-section {
    padding: 30px;
  }
}

@media (max-width: 767px) {
  .footer-section-area .footer-last-section .footer-auhtor-area {
    margin-bottom: 30px;
  }
}

.footer-section-area .footer-last-section .footer-auhtor-area h3 {
  color: var(--white-100, #FFF);
  font-family: "Figtree", sans-serif;
  font-size: 24px;
  font-style: normal;
  font-weight: 700;
  line-height: 24px;
}

.footer-section-area .footer-last-section .footer-auhtor-area p {
  color: #BDBDC5;
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 26px;
  display: inline-block;
  margin-top: 24px;
}

.footer-section-area .footer-last-section .footer-auhtor-area ul {
  margin-bottom: 24px;
}

.footer-section-area .footer-last-section .footer-auhtor-area ul li a {
  color: #BDBDC5;
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  display: inline-block;
  margin-top: 24px;
  transition: all 0.4s ease-in-out;
}

.footer-section-area .footer-last-section .footer-auhtor-area ul li a:hover {
  color: var(--white-100, #FFF);
  transition: all 0.4s ease-in-out;
  padding-left: 5px;
}

.footer-section-area .footer-last-section .footer-auhtor-area ul.social-links li {
  display: inline-block;
  margin: 0 6px 0 0;
}

.footer-section-area .footer-last-section .footer-auhtor-area ul.social-links li::after {
  display: none;
}

.footer-section-area .footer-last-section .footer-auhtor-area ul.social-links li a {
  height: 32px;
  width: 32px;
  display: inline-block;
  line-height: 33px;
  text-align: center;
  border-radius: 50%;
  transition: all 0.4s ease-in-out;
  color: var(--Text-Color, #0D0E10);
  background: #F6F5FE;
  font-size: 14px;
}

.footer-section-area .footer-last-section .footer-auhtor-area ul.social-links li a:hover {
  background: #433CE7;
  transition: all 0.4s ease-in-out;
  color: var(--white-100, #FFF);
  padding-left: 0;
  transform: translateY(-3px);
}

.footer-section-area .footer-last-section .copyright-social-area {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 20px;
  border-top: 1px solid #505065;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .footer-section-area .footer-last-section .copyright-social-area {
    display: inline-block;
  }
}

@media (max-width: 767px) {
  .footer-section-area .footer-last-section .copyright-social-area {
    display: inline-block;
  }
}

.footer-section-area .footer-last-section .copyright-social-area ul li {
  display: inline-block;
  position: relative;
  margin: 0 20px 0 0;
}

.footer-section-area .footer-last-section .copyright-social-area ul li::after {
  position: absolute;
  content: "";
  height: 12px;
  width: 1px;
  background: #505065;
  right: -13px;
  top: 10px;
}

.footer-section-area .footer-last-section .copyright-social-area ul li p {
  color: #BDBDC5;
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  display: inline-block;
}

.footer-section-area .footer-last-section .copyright-social-area ul li a {
  color: #BDBDC5;
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  display: inline-block;
  position: relative;
  z-index: 1;
}

.footer-section-area .footer-last-section .copyright-social-area ul .copy::after {
  display: none;
}

.footer-section-area .footer-last-section .copyright-social-area ul .terms::after {
  display: none;
}

.footer2-section-area {
  position: relative;
  overflow: hidden;
  z-index: 1;
  padding: 0 0 80px 0;
}

@media (max-width: 767px) {
  .footer2-section-area {
    padding: 0 0 30px 0;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .footer2-section-area {
    padding: 0 0 30px 0;
  }
}

@media (max-width: 767px) {
  .footer2-section-area .footer-header {
    padding: 40px 0 40px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .footer2-section-area .footer-header {
    padding: 40px 0 40px;
  }
}

.footer2-section-area .footer-header h2 {
  color: var(--white-100, #FFF);
  margin-bottom: 20px;
  font-family: "Figtree", sans-serif !important;
  ;
  font-weight: 700;
}

.footer2-section-area .footer-header span {
  color: var(--white-100, #FFF);
  font-family: "Figtree", sans-serif;
  font-size: 20px;
  font-style: normal;
  font-weight: 700;
  line-height: 20px;
  display: inline-block;
}

.footer2-section-area .footer-header span img {
  margin: 0 16px;
}

.footer2-section-area .footer-header .header-btn2 {
  margin-top: 32px;
  background: #010ca8;
}

.footer2-section-area .footer2-last-section {
  background: var(--white-100, #FFF);
  border-radius: var(--4, 4px);
  border: 1px solid rgba(255, 255, 255, 0.3);
  -webkit-backdrop-filter: blur(57.0340957642px);
  backdrop-filter: blur(57.0340957642px);
  padding: 50px 70px 28px 70px;
}

@media (max-width: 767px) {
  .footer2-section-area .footer2-last-section {
    padding: 30px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .footer2-section-area .footer2-last-section {
    padding: 30px;
  }
}

@media (max-width: 767px) {
  .footer2-section-area .footer2-last-section .footer-auhtor-area {
    margin-bottom: 30px;
  }
}

.footer2-section-area .footer2-last-section .footer-auhtor-area h3 {
  color: var(--Text-Color, #0D0E10);
  font-family: "Figtree", sans-serif;
  font-size: 24px;
  font-style: normal;
  font-weight: 700;
  line-height: 24px;
}

.footer2-section-area .footer2-last-section .footer-auhtor-area p {
  color: #676879;
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 26px;
  display: inline-block;
  margin-top: 24px;
  margin-bottom: 20px;
}

.footer2-section-area .footer2-last-section .footer-auhtor-area ul {
  margin-bottom: 24px;
}

.footer2-section-area .footer2-last-section .footer-auhtor-area ul li a {
  color: #676879;
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  display: inline-block;
  margin-top: 24px;
  transition: all 0.4s ease-in-out;
}

.footer2-section-area .footer2-last-section .footer-auhtor-area ul li a:hover {
  color: #010ca8;
  transition: all 0.4s ease-in-out;
  padding-left: 5px;
}

.footer2-section-area .footer2-last-section .footer-auhtor-area ul.social-links li {
  display: inline-block;
  margin: 0 6px 0 0;
}

.footer2-section-area .footer2-last-section .footer-auhtor-area ul.social-links li::after {
  display: none;
}

.footer2-section-area .footer2-last-section .footer-auhtor-area ul.social-links li a {
  height: 32px;
  width: 32px;
  display: inline-block;
  line-height: 33px;
  text-align: center;
  border-radius: 50%;
  transition: all 0.4s ease-in-out;
  color: var(--Text-Color, #0D0E10);
  background: #F6F5FE;
  font-size: 16px;
}

.footer2-section-area .footer2-last-section .footer-auhtor-area ul.social-links li a:hover {
  background: #010ca8;
  transition: all 0.4s ease-in-out;
  color: var(--white-100, #FFF);
  padding-left: 0;
  transform: translateY(-3px);
}

.footer2-section-area .footer2-last-section .copyright-social-area {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 20px;
  border-top: 1px solid #CFCFCF;
}

@media (max-width: 767px) {
  .footer2-section-area .footer2-last-section .copyright-social-area {
    display: inline-block;
  }
}

.footer2-section-area .footer2-last-section .copyright-social-area ul li {
  display: inline-block;
  position: relative;
  margin: 0 20px 0 0;
}

.footer2-section-area .footer2-last-section .copyright-social-area ul li::after {
  position: absolute;
  content: "";
  height: 12px;
  width: 1px;
  background: #DDDDDD;
  right: -13px;
  top: 10px;
}

.footer2-section-area .footer2-last-section .copyright-social-area ul li p {
  color: #676879;
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  display: inline-block;
}

.footer2-section-area .footer2-last-section .copyright-social-area ul li a {
  color: #676879;
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  display: inline-block;
  position: relative;
  cursor: pointer;
  z-index: 1;
}

.footer2-section-area .footer2-last-section .copyright-social-area ul .terms::after {
  display: none;
}

.footer2-section-area .footer2-last-section .copyright-social-area ul .copy::after {
  display: none;
}

.footer3-section-area {
  position: relative;
  overflow: hidden;
  z-index: 1;
}

.footer3-section-area .footer-header h2 {
  color: var(--white-100, #FFF);
  margin-bottom: 20px;
  font-family: "Figtree", sans-serif !important;
  ;
  font-weight: 700;
}

.footer3-section-area .footer-header span {
  color: var(--white-100, #FFF);
  font-family: "Figtree", sans-serif;
  font-size: 20px;
  font-style: normal;
  font-weight: 700;
  line-height: 20px;
  display: inline-block;
}

.footer3-section-area .footer-header span img {
  margin: 0 16px;
}

.footer3-section-area .footer-header .header-btn2 {
  margin-top: 32px;
}

.footer3-section-area .footer2-last-section {
  background: var(--white-100, #FFF);
  border-radius: var(--4, 4px);
  border: 1px solid rgba(255, 255, 255, 0.3);
  -webkit-backdrop-filter: blur(57.0340957642px);
  backdrop-filter: blur(57.0340957642px);
  padding: 80px 0 24px 0;
}

@media (max-width: 767px) {
  .footer3-section-area .footer2-last-section {
    padding: 40px 0 24px 0;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .footer3-section-area .footer2-last-section {
    padding: 40px 0 24px 0;
  }
}

@media (max-width: 767px) {
  .footer3-section-area .footer2-last-section .footer-auhtor-area {
    margin-bottom: 30px;
  }
}

.footer3-section-area .footer2-last-section .footer-auhtor-area h3 {
  color: var(--Text-Color, #0D0E10);
  font-family: "Figtree", sans-serif;
  font-size: 24px;
  font-style: normal;
  font-weight: 700;
  line-height: 24px;
}

.footer3-section-area .footer2-last-section .footer-auhtor-area p {
  color: #676879;
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 26px;
  display: inline-block;
  margin-top: 24px;
}

.footer3-section-area .footer2-last-section .footer-auhtor-area ul {
  margin-bottom: 24px;
}

.footer3-section-area .footer2-last-section .footer-auhtor-area ul li a {
  color: #676879;
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  display: inline-block;
  margin-top: 24px;
  transition: all 0.4s ease-in-out;
}

.footer3-section-area .footer2-last-section .footer-auhtor-area ul li a:hover {
  color: #4B24EE;
  transition: all 0.4s ease-in-out;
  padding-left: 5px;
}

.footer3-section-area .footer2-last-section .footer-auhtor-area ul.social-links li {
  display: inline-block;
  margin: 0 6px 0 0;
}

.footer3-section-area .footer2-last-section .footer-auhtor-area ul.social-links li::after {
  display: none;
}

.footer3-section-area .footer2-last-section .footer-auhtor-area ul.social-links li a {
  height: 32px;
  width: 32px;
  display: inline-block;
  line-height: 33px;
  text-align: center;
  border-radius: 50%;
  transition: all 0.4s ease-in-out;
  color: var(--Text-Color, #0D0E10);
  background: #F6F5FE;
  font-size: 16px;
}

.footer3-section-area .footer2-last-section .footer-auhtor-area ul.social-links li a:hover {
  background: #4B24EE;
  transition: all 0.4s ease-in-out;
  color: var(--white-100, #FFF);
  padding-left: 0;
  transform: translateY(-3px);
}

.footer3-section-area .footer2-last-section .copyright-social-area {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 20px;
  border-top: 1px solid #CFCFCF;
}

@media (max-width: 767px) {
  .footer3-section-area .footer2-last-section .copyright-social-area {
    display: inline-block;
  }
}

.footer3-section-area .footer2-last-section .copyright-social-area ul li {
  display: inline-block;
  position: relative;
  margin: 0 20px 0 0;
}

.footer3-section-area .footer2-last-section .copyright-social-area ul li::after {
  position: absolute;
  content: "";
  height: 12px;
  width: 1px;
  background: var(--Stroke-Color, rgba(86, 95, 118, 0.1));
  right: -13px;
  top: 10px;
}

.footer3-section-area .footer2-last-section .copyright-social-area ul li p {
  color: #676879;
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  display: inline-block;
}

.footer3-section-area .footer2-last-section .copyright-social-area ul li a {
  color: #676879;
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  display: inline-block;
  position: relative;
  cursor: pointer;
  z-index: 1;
}

.footer3-section-area .footer2-last-section .copyright-social-area ul .copy::after {
  display: none;
}

.footer3-section-area .footer2-last-section .copyright-social-area ul .terms::after {
  display: none;
}

.cta3-section-area {
  padding: 80px 0 80px;
}

@media (max-width: 767px) {
  .cta3-section-area {
    padding: 40px 0 40px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .cta3-section-area {
    padding: 40px 0 40px;
  }
}

.cta3-section-area .cta3-header-area h2 {
  color: var(--white-100, #FFF);
}

.cta3-section-area .cta3-header-area ul li {
  display: inline-block;
  font-size: 20px;
  font-weight: 700;
  color: var(--white-100, #FFF);
  font-family: "Figtree", sans-serif;
}

.cta3-section-area .cta3-header-area ul li img {
  margin: 0 16px;
}

.cta3-section-area .cta3-header-area a.header-btn5 {
  background: var(--white-100, #FFF);
  color: #4B24EE;
  transition: all 0.4s ease-in-out;
}

.login-footer {
  background: var(--white-100, #FFF);
  padding: 50px 0;
}

@media (max-width: 767px) {
  .login-footer {
    padding: 25px 0;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .login-footer {
    padding: 25px 0;
  }
}

.login-footer .copyright-social-area {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

@media (max-width: 767px) {
  .login-footer .copyright-social-area {
    display: inline-block;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .login-footer .copyright-social-area {
    display: inline-block;
  }
}

@media (max-width: 767px) {
  .login-footer .copyright-social-area img {
    margin-bottom: 20px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .login-footer .copyright-social-area img {
    margin-bottom: 20px;
  }
}

.login-footer .copyright-social-area ul li {
  display: inline-block;
  position: relative;
  margin: 0 20px 0 0;
}

.login-footer .copyright-social-area ul li::after {
  position: absolute;
  content: "";
  height: 12px;
  width: 1px;
  background: #DDDDDD;
  right: -13px;
  top: 10px;
}

.login-footer .copyright-social-area ul li p {
  color: #676879;
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  display: inline-block;
}

.login-footer .copyright-social-area ul li a {
  color: #676879;
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  display: inline-block;
  position: relative;
  cursor: pointer;
  z-index: 1;
}

.login-footer .copyright-social-area ul.social-links li {
  margin: 0 6px 0 0;
}

.login-footer .copyright-social-area ul.social-links li::after {
  display: none;
}

.login-footer .copyright-social-area ul.social-links li a {
  height: 32px;
  width: 32px;
  display: inline-block;
  line-height: 32px;
  text-align: center;
  border-radius: 50%;
  transition: all 0.4s ease-in-out;
  color: var(--Text-Color, #0D0E10);
  background: #F6F5FE;
  font-size: 16px;
}

.login-footer .copyright-social-area ul.social-links li a svg {
  margin-left: 2px;
}

.login-footer .copyright-social-area ul.social-links li a:hover {
  background: #010ca8;
  transition: all 0.4s ease-in-out;
  color: var(--white-100, #FFF);
}

.cta4-section-area {
  position: relative;
  padding: 200px 0;
  background: #581164;
}

@media (max-width: 767px) {
  .cta4-section-area {
    padding: 50px 0 50px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .cta4-section-area {
    padding: 50px 0 50px;
  }
}

.cta4-section-area .cta-bg-area {
  position: relative;
}

.cta4-section-area .cta-bg-area .cta-content-area {
  padding: 0 50px;
}

.cta4-section-area .cta-bg-area .cta-content-area h2 {
  color: var(--white-100, #FFF);
}

.cta4-section-area .cta-bg-area .cta-content-area p {
  color: var(--white-100, #FFF);
  opacity: 0.8;
}

@media (max-width: 767px) {
  .cta4-section-area .cta-bg-area .cta-content-area {
    padding: 0;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .cta4-section-area .cta-bg-area .cta-content-area {
    padding: 0;
  }
}

.cta4-section-area .cta-bg-area .cta-content-area .header-btn7 {
  background: var(--white-100, #FFF);
  color: #581164;
}

.cta4-section-area .cta-bg-area .cta-content-area .header-btn7:hover {
  color: var(--white-100, #FFF);
}

.cta4-section-area .cta-bg-area .cta-content-area .header-btn8 {
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-weight: 700;
  color: var(--white-100, #FFF);
  border: 1px solid var(--white-100, #FFF);
  display: inline-block;
  padding: 15px;
  line-height: 16px;
  border-radius: 4px;
  margin-left: 16px;
  position: relative;
  background: none;
  transition: all 0.4s ease-in-out;
}

.cta4-section-area .cta-bg-area .cta-content-area .header-btn8::after {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  left: 44%;
  bottom: 0;
  right: 44%;
  top: 35%;
  background: #43054E;
  transition: all 0.4s ease-in-out;
  border-radius: 50%;
  z-index: -1;
  visibility: hidden;
  opacity: 0;
}

.cta4-section-area .cta-bg-area .cta-content-area .header-btn8:hover {
  color: var(--white-100, #FFF);
  transition: all 0.4s ease-in-out;
  transform: translateY(-5px);
  border: 1px solid #43054E;
}

.cta4-section-area .cta-bg-area .cta-content-area .header-btn8:hover::after {
  height: 100%;
  width: 100%;
  border-radius: 4px;
  transition: all 0.4s ease-in-out;
  left: 0;
  visibility: visible;
  opacity: 1;
  top: 0;
}

.footer2-section-area.footer4-section {
  background: var(--white-100, #FFF);
  padding: 80px 0 0 0;
}

.footer2-section-area.footer4-section .footer2-last-section {
  background: none;
  padding: 0;
  border: none;
}

.footer2-section-area.footer4-section .footer2-last-section .footer-auhtor-area h3 {
  color: var(--Text-Color, #0D0E10);
}

.footer2-section-area.footer4-section .footer2-last-section .footer-auhtor-area p {
  color: #565658;
}

.footer2-section-area.footer4-section .footer2-last-section .footer-auhtor-area ul li a {
  color: #565658;
}

.footer2-section-area.footer4-section .footer2-last-section .footer-auhtor-area ul li a:hover {
  color: #581164;
}

.footer2-section-area.footer4-section .footer2-last-section .footer-auhtor-area ul.social-links li {
  display: inline-block;
  margin: 0 6px 0 0;
}

.footer2-section-area.footer4-section .footer2-last-section .footer-auhtor-area ul.social-links li::after {
  display: none;
}

.footer2-section-area.footer4-section .footer2-last-section .footer-auhtor-area ul.social-links li a {
  height: 32px;
  width: 32px;
  display: inline-block;
  line-height: 32px;
  text-align: center;
  border-radius: 50%;
  transition: all 0.4s ease-in-out;
  color: #581164;
  background: #F7F3F7;
  font-size: 16px;
}

.footer2-section-area.footer4-section .footer2-last-section .footer-auhtor-area ul.social-links li a:hover {
  background: #581164;
  transition: all 0.4s ease-in-out;
  color: var(--white-100, #FFF);
  padding-left: 0;
  transform: translateY(-3px);
}

.footer2-section-area.footer4-section .copyright-social-area {
  padding: 16px 0 24px;
  border-top: 1px solid #CFCFCF;
}

.footer2-section-area.footer4-section .copyright-social-area ul li::after {
  background: #CFCFCF;
}

.footer2-section-area.footer4-section .copyright-social-area ul li a {
  color: #565658;
}

.footer2-section-area.footer4-section .copyright-social-area ul li p {
  color: #565658;
}

.footer2-section-area.footer4-section .copyright-social-area ul li.pera::after {
  display: none;
}

.footer2-section-area.footer5-section {
  background: var(--white-100, #FFF);
  padding: 80px 0 0 10px;
}

.footer2-section-area.footer5-section .footer2-last-section {
  background: none;
  padding: 0;
  border: none;
}

.footer2-section-area.footer5-section .footer2-last-section .footer-auhtor-area h3 {
  color: var(--Text-Color, #0D0E10);
}

.footer2-section-area.footer5-section .footer2-last-section .footer-auhtor-area p {
  color: #565658;
}

.footer2-section-area.footer5-section .footer2-last-section .footer-auhtor-area ul li a {
  color: #565658;
}

.footer2-section-area.footer5-section .footer2-last-section .footer-auhtor-area ul li a:hover {
  color: #5C3EF4;
}

.footer2-section-area.footer5-section .footer2-last-section .footer-auhtor-area ul.social-links li {
  display: inline-block;
  margin: 0 6px 0 0;
}

.footer2-section-area.footer5-section .footer2-last-section .footer-auhtor-area ul.social-links li::after {
  display: none;
}

.footer2-section-area.footer5-section .footer2-last-section .footer-auhtor-area ul.social-links li a {
  height: 32px;
  width: 32px;
  display: inline-block;
  line-height: 32px;
  text-align: center;
  border-radius: 50%;
  transition: all 0.4s ease-in-out;
  color: #1d3987;
  background: #F7F3F7;
  font-size: 16px;
}

.footer2-section-area.footer5-section .footer2-last-section .footer-auhtor-area ul.social-links li a:hover {
  background: #1d3987;
  transition: all 0.4s ease-in-out;
  color: var(--white-100, #FFF);
  padding-left: 0;
  transform: translateY(-3px);
}

.footer2-section-area.footer5-section .copyright-social-area {
  padding: 16px 0 24px;
  border-top: 1px solid #CFCFCF;
}

.footer2-section-area.footer5-section .copyright-social-area ul li::after {
  background: #CFCFCF;
}

.footer2-section-area.footer5-section .copyright-social-area ul li a {
  color: #565658;
}

.footer2-section-area.footer5-section .copyright-social-area ul li p {
  color: #565658;
}

.footer2-section-area.footer5-section .copyright-social-area ul li.pera::after {
  display: none;
}

.cta5-section-area {
  position: relative;
  overflow: hidden;
}

@media (max-width: 767px) {
  .cta5-section-area {
    padding: 40px 0 40px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .cta5-section-area {
    padding: 40px 0 40px;
  }
}

.cta5-section-area .elements4 {
  position: absolute;
  top: 0;
  left: 0;
}

.cta5-section-area .elements5 {
  position: absolute;
  bottom: 0;
  right: 0;
}

.cta5-section-area .elements6 {
  position: absolute;
  top: 0;
  right: 0;
}

.cta5-section-area .elements7 {
  position: absolute;
  bottom: 0;
  left: 0;
}

.cta5-section-area .cta5-header h2 {
  color: var(--white-100, #FFF);
}

.cta5-section-area .cta5-header p {
  color: var(--white-100, #FFF);
  opacity: 0.8;
}

.cta5-section-area .cta5-header .header-btn9 {
  margin-left: 24px;
}

@media (max-width: 767px) {
  .cta5-section-area .cta5-header .header-btn9 {
    margin-left: 0;
    margin-top: 20px;
  }
}

/*============= FOOTER CSS AREA ENDS===============*/
/*============= MOBILE-MENU CSS AREA  ===============*/
.mobile-haeder1 {
  background: #433CE7;
  position: fixed;
}

.mobile-haeder1 .mobile-header-elements .dots-menu {
  color: var(--white-100, #FFF);
  cursor: pointer;
}

.mobile-sidebar1 {
  max-height: 100%;
  overflow-y: scroll;
}

.mobile-sidebar1 .menu-close {
  color: var(--white-100, #FFF);
  cursor: pointer;
}

.mobile-sidebar1 .mobile-nav .mobile-nav-list li a {
  font-family: "Figtree", sans-serif;
  font-weight: 500 !important;
  color: var(--white-100, #FFF);
}

.mobile-sidebar1 .mobile-nav .mobile-nav-list li span::after {
  background: var(--white-100, #FFF);
  color: var(--white-100, #FFF);
}

.mobile-sidebar1 .mobile-nav .mobile-nav-list li span::before {
  background: var(--white-100, #FFF);
  color: var(--white-100, #FFF);
}

.mobile-sidebar1 .mobile-nav .mobile-nav-list li ul li a {
  font-weight: 500 !important;
}

.mobile-sidebar1 .mobile-nav .allmobilesection .mobile-get {
  display: inline-block;
  border-radius: 25px;
  background: #433CE7;
  color: var(--white-100, #FFF);
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 16px;
  padding: 16px 28px;
  transition: all 0.4s ease-in-out;
  position: relative;
  z-index: 1;
  width: 100%;
  text-align: center;
  margin-top: 30px;
}

.mobile-sidebar1 .mobile-nav .allmobilesection .mobile-get::after {
  position: absolute;
  content: "";
  left: 50%;
  right: 50%;
  height: 20px;
  width: 20px;
  top: 14px;
  border-radius: 50%;
  background: #2921D3;
  visibility: hidden;
  opacity: 0;
  z-index: -1;
  transition: all 0.4s ease-in-out;
}

.mobile-sidebar1 .mobile-nav .allmobilesection .mobile-get:hover {
  transform: translateY(-5px);
  transition: all 0.4s ease-in-out;
}

.mobile-sidebar1 .mobile-nav .allmobilesection .mobile-get:hover::after {
  visibility: visible;
  opacity: 1;
  height: 100%;
  width: 100%;
  transition: all 0.4s ease-in-out;
  z-index: -1;
  border-radius: 25px;
  left: 0;
  top: 0;
}

.mobile-sidebar1 .mobile-nav .allmobilesection .mobile-get svg {
  margin-left: 4px;
  transform: rotate(-45deg);
}

.mobile-sidebar1 .mobile-nav .allmobilesection .single-footer h3 {
  font-family: "Figtree", sans-serif;
  font-size: 24px;
  line-height: 30px;
  color: var(--white-100, #FFF);
  font-weight: 700;
  margin-bottom: 16px;
  margin-top: 30px;
}

.mobile-sidebar1 .mobile-nav .allmobilesection .single-footer .footer4-contact-info .contact-info-single {
  display: flex;
  color: var(--white-100, #FFF);
}

.mobile-sidebar1 .mobile-nav .allmobilesection .single-footer .footer4-contact-info .contact-info-single svg {
  margin: 0 10px 0 0;
  counter-reset: var(--white-100, #FFF);
}

.mobile-sidebar1 .mobile-nav .allmobilesection .single-footer .footer4-contact-info .contact-info-single a {
  font-family: "Figtree", sans-serif;
  font-weight: 500;
  color: var(--white-100, #FFF);
  opacity: 0.7;
  font-size: 16px;
}

.mobile-sidebar1 .mobile-nav .allmobilesection .single-footer .footer4-contact-info .social-links-mobile-menu ul li {
  display: inline-block;
  height: 40px;
  width: 40px;
  border-radius: 50%;
  background: var(--white-100, #FFF);
  color: var(--Text-Color, #0D0E10);
  transition: all 0.4s ease-in-out;
  display: inline-block;
  text-align: center;
  margin: 0 6px 0 0;
  cursor: pointer;
}

.mobile-sidebar1 .mobile-nav .allmobilesection .single-footer .footer4-contact-info .social-links-mobile-menu ul li:hover {
  background: #433CE7;
  color: var(--white-100, #FFF);
  transition: all 0.4s ease-in-out;
}

.mobile-sidebar1 .mobile-nav .allmobilesection .single-footer .footer4-contact-info .social-links-mobile-menu ul li:hover a svg {
  color: var(--white-100, #FFF);
}

.mobile-sidebar1 .mobile-nav .allmobilesection .single-footer .footer4-contact-info .social-links-mobile-menu ul li a {
  line-height: 0px;
}

.mobile-sidebar1 .mobile-nav .allmobilesection .single-footer .footer4-contact-info .social-links-mobile-menu ul li a:hover {
  color: var(--white-100, #FFF);
  transition: all 0.4s ease-in-out;
}

.mobile-haeder2 {
  background: #010ca8;
  position: fixed;
}

.mobile-haeder2 .mobile-header-elements .dots-menu {
  color: var(--white-100, #FFF);
  cursor: pointer;
}

.mobile-sidebar2 {
  max-height: 100%;
  overflow-y: scroll;
  background: #010ca8;
}

.mobile-sidebar2 .menu-close {
  color: var(--white-100, #FFF);
  cursor: pointer;
}

.mobile-sidebar2 .mobile-nav.mobile-nav2 .mobile-nav-list.nav-list2 li a {
  font-family: "Figtree", sans-serif !important;
  ;
  font-weight: 500 !important;
  color: var(--white-100, #FFF);
}

.mobile-sidebar2 .mobile-nav.mobile-nav2 .mobile-nav-list.nav-list2 li span::after {
  background: var(--white-100, #FFF);
  color: var(--white-100, #FFF);
}

.mobile-sidebar2 .mobile-nav.mobile-nav2 .mobile-nav-list.nav-list2 li span::before {
  background: var(--white-100, #FFF);
  color: var(--white-100, #FFF);
}

.mobile-sidebar2 .mobile-nav.mobile-nav2 .mobile-nav-list.nav-list2 li ul li a {
  font-weight: 500 !important;
  font-family: "Figtree", sans-serif !important;
  ;
}

.mobile-sidebar2 .mobile-nav.mobile-nav2 .mobile-nav-list.nav-list2 li ul.sub-menu li a {
  font-family: "Figtree", sans-serif !important;
  ;
  font-weight: 500 !important;
}

.mobile-sidebar2 .mobile-nav.mobile-nav2 .allmobilesection .header-btn2 {
  width: 100% !important;
  text-align: center;
  margin-top: 30px;
}

.mobile-sidebar2 .mobile-nav.mobile-nav2 .allmobilesection .single-footer h3 {
  font-family: "Figtree", sans-serif;
  font-size: 24px;
  line-height: 30px;
  color: var(--white-100, #FFF);
  font-weight: 700;
  margin-bottom: 16px;
  margin-top: 30px;
}

.mobile-sidebar2 .mobile-nav.mobile-nav2 .allmobilesection .single-footer .footer4-contact-info .contact-info-single {
  display: flex;
  color: var(--white-100, #FFF);
}

.mobile-sidebar2 .mobile-nav.mobile-nav2 .allmobilesection .single-footer .footer4-contact-info .contact-info-single svg {
  margin: 0 10px 0 0;
  counter-reset: var(--white-100, #FFF);
}

.mobile-sidebar2 .mobile-nav.mobile-nav2 .allmobilesection .single-footer .footer4-contact-info .contact-info-single a {
  font-family: "Figtree", sans-serif;
  font-weight: 500;
  color: var(--white-100, #FFF);
  opacity: 0.7;
  font-size: 16px;
}

.mobile-sidebar2 .mobile-nav.mobile-nav2 .allmobilesection .single-footer .footer4-contact-info .social-links-mobile-menu ul li {
  display: inline-block;
  height: 40px;
  width: 40px;
  border-radius: 50%;
  background: var(--white-100, #FFF);
  color: var(--white-100, #FFF);
  transition: all 0.4s ease-in-out;
  display: inline-block;
  text-align: center;
  margin: 0 6px 0 0;
  cursor: pointer;
}

.mobile-sidebar2 .mobile-nav.mobile-nav2 .allmobilesection .single-footer .footer4-contact-info .social-links-mobile-menu ul li:hover {
  background: #FC4B3E;
  color: var(--white-100, #FFF);
  transition: all 0.4s ease-in-out;
}

.mobile-sidebar2 .mobile-nav.mobile-nav2 .allmobilesection .single-footer .footer4-contact-info .social-links-mobile-menu ul li:hover a svg {
  color: var(--white-100, #FFF);
}

.mobile-sidebar2 .mobile-nav.mobile-nav2 .allmobilesection .single-footer .footer4-contact-info .social-links-mobile-menu ul li a {
  line-height: 0px;
}

.mobile-sidebar2 .mobile-nav.mobile-nav2 .allmobilesection .single-footer .footer4-contact-info .social-links-mobile-menu ul li a:hover {
  color: var(--white-100, #FFF);
  transition: all 0.4s ease-in-out;
}

.mobile-haeder3 {
  background: #4B24EE;
  position: fixed;
}

.mobile-haeder3 .mobile-header-elements .dots-menu {
  color: var(--white-100, #FFF);
  cursor: pointer;
}

.mobile-sidebar3 {
  max-height: 100%;
  overflow-y: scroll;
  background: #4B24EE;
}

.mobile-sidebar3 .menu-close {
  color: var(--white-100, #FFF);
  cursor: pointer;
}

.mobile-sidebar3 .mobile-nav.mobile-nav2 .mobile-nav-list.nav-list2 li a {
  font-family: "Figtree", sans-serif !important;
  ;
  font-weight: 500 !important;
  color: var(--white-100, #FFF);
}

.mobile-sidebar3 .mobile-nav.mobile-nav2 .mobile-nav-list.nav-list2 li span::after {
  background: var(--white-100, #FFF);
  color: var(--white-100, #FFF);
}

.mobile-sidebar3 .mobile-nav.mobile-nav2 .mobile-nav-list.nav-list2 li span::before {
  background: var(--white-100, #FFF);
  color: var(--white-100, #FFF);
}

.mobile-sidebar3 .mobile-nav.mobile-nav2 .mobile-nav-list.nav-list2 li ul li a {
  font-weight: 500 !important;
  font-family: "Figtree", sans-serif !important;
  ;
}

.mobile-sidebar3 .mobile-nav.mobile-nav2 .mobile-nav-list.nav-list2 li ul.sub-menu li a {
  font-family: "Figtree", sans-serif !important;
  ;
  font-weight: 500 !important;
}

.mobile-sidebar3 .mobile-nav.mobile-nav2 .allmobilesection .header-btn5 {
  width: 100% !important;
  text-align: center;
  margin-top: 30px;
  background: var(--white-100, #FFF);
  color: #4B24EE;
}

.mobile-sidebar3 .mobile-nav.mobile-nav2 .allmobilesection .single-footer h3 {
  font-family: "Figtree", sans-serif;
  font-size: 24px;
  line-height: 30px;
  color: var(--white-100, #FFF);
  font-weight: 700;
  margin-bottom: 16px;
  margin-top: 30px;
}

.mobile-sidebar3 .mobile-nav.mobile-nav2 .allmobilesection .single-footer .footer4-contact-info .contact-info-single {
  display: flex;
  color: var(--white-100, #FFF);
}

.mobile-sidebar3 .mobile-nav.mobile-nav2 .allmobilesection .single-footer .footer4-contact-info .contact-info-single svg {
  margin: 0 10px 0 0;
  counter-reset: var(--white-100, #FFF);
}

.mobile-sidebar3 .mobile-nav.mobile-nav2 .allmobilesection .single-footer .footer4-contact-info .contact-info-single a {
  font-family: "Figtree", sans-serif;
  font-weight: 500;
  color: var(--white-100, #FFF);
  opacity: 0.7;
  font-size: 16px;
}

.mobile-sidebar3 .mobile-nav.mobile-nav2 .allmobilesection .single-footer .footer4-contact-info .social-links-mobile-menu ul li {
  display: inline-block;
  height: 40px;
  width: 40px;
  border-radius: 50%;
  background: var(--white-100, #FFF);
  color: var(--white-100, #FFF);
  transition: all 0.4s ease-in-out;
  display: inline-block;
  text-align: center;
  margin: 0 6px 0 0;
  cursor: pointer;
}

.mobile-sidebar3 .mobile-nav.mobile-nav2 .allmobilesection .single-footer .footer4-contact-info .social-links-mobile-menu ul li:hover {
  background: #FAF9FD;
  color: var(--Text-Color, #0D0E10);
  transition: all 0.4s ease-in-out;
}

.mobile-sidebar3 .mobile-nav.mobile-nav2 .allmobilesection .single-footer .footer4-contact-info .social-links-mobile-menu ul li:hover a svg {
  color: var(--white-100, #FFF);
}

.mobile-sidebar3 .mobile-nav.mobile-nav2 .allmobilesection .single-footer .footer4-contact-info .social-links-mobile-menu ul li a {
  line-height: 0px;
}

.mobile-sidebar3 .mobile-nav.mobile-nav2 .allmobilesection .single-footer .footer4-contact-info .social-links-mobile-menu ul li a:hover {
  color: var(--white-100, #FFF);
  transition: all 0.4s ease-in-out;
}

.mobile-haeder4 {
  background: #581164;
  position: fixed;
}

.mobile-haeder4 .mobile-header-elements .dots-menu {
  color: var(--white-100, #FFF);
  cursor: pointer;
}

.mobile-sidebar4 {
  max-height: 100%;
  overflow-y: scroll;
  background: #581164;
}

.mobile-sidebar4 .menu-close {
  color: var(--white-100, #FFF);
  cursor: pointer;
}

.mobile-sidebar4 .mobile-nav.mobile-nav2 .mobile-nav-list.nav-list2 li a {
  font-family: "Figtree", sans-serif !important;
  ;
  font-weight: 500 !important;
  color: var(--white-100, #FFF);
}

.mobile-sidebar4 .mobile-nav.mobile-nav2 .mobile-nav-list.nav-list2 li span::after {
  background: var(--white-100, #FFF);
  color: var(--white-100, #FFF);
}

.mobile-sidebar4 .mobile-nav.mobile-nav2 .mobile-nav-list.nav-list2 li span::before {
  background: var(--white-100, #FFF);
  color: var(--white-100, #FFF);
}

.mobile-sidebar4 .mobile-nav.mobile-nav2 .mobile-nav-list.nav-list2 li ul li a {
  font-weight: 500 !important;
  font-family: "Figtree", sans-serif !important;
  ;
}

.mobile-sidebar4 .mobile-nav.mobile-nav2 .mobile-nav-list.nav-list2 li ul.sub-menu li a {
  font-family: "Figtree", sans-serif !important;
  ;
  font-weight: 500 !important;
}

.mobile-sidebar4 .mobile-nav.mobile-nav2 .allmobilesection .header-btn7 {
  width: 100% !important;
  text-align: center;
  margin-top: 30px;
  background: none;
  color: var(--white-100, #FFF);
  border: 1px solid var(--white-100, #FFF);
}

.mobile-sidebar4 .mobile-nav.mobile-nav2 .allmobilesection .header-btn7::after {
  background: var(--white-100, #FFF);
}

.mobile-sidebar4 .mobile-nav.mobile-nav2 .allmobilesection .header-btn7:hover {
  color: #581164;
}

.mobile-sidebar4 .mobile-nav.mobile-nav2 .allmobilesection .single-footer h3 {
  font-family: "Figtree", sans-serif;
  font-size: 24px;
  line-height: 30px;
  color: var(--white-100, #FFF);
  font-weight: 700;
  margin-bottom: 16px;
  margin-top: 30px;
}

.mobile-sidebar4 .mobile-nav.mobile-nav2 .allmobilesection .single-footer .footer4-contact-info .contact-info-single {
  display: flex;
  color: var(--white-100, #FFF);
}

.mobile-sidebar4 .mobile-nav.mobile-nav2 .allmobilesection .single-footer .footer4-contact-info .contact-info-single svg {
  margin: 0 10px 0 0;
  counter-reset: var(--white-100, #FFF);
}

.mobile-sidebar4 .mobile-nav.mobile-nav2 .allmobilesection .single-footer .footer4-contact-info .contact-info-single a {
  font-family: "Figtree", sans-serif;
  font-weight: 500;
  color: var(--white-100, #FFF);
  opacity: 0.7;
  font-size: 16px;
}

.mobile-sidebar4 .mobile-nav.mobile-nav2 .allmobilesection .single-footer .footer4-contact-info .social-links-mobile-menu ul li {
  display: inline-block;
  height: 40px;
  width: 40px;
  border-radius: 50%;
  background: var(--white-100, #FFF);
  color: var(--white-100, #FFF);
  transition: all 0.4s ease-in-out;
  display: inline-block;
  text-align: center;
  margin: 0 6px 0 0;
  cursor: pointer;
}

.mobile-sidebar4 .mobile-nav.mobile-nav2 .allmobilesection .single-footer .footer4-contact-info .social-links-mobile-menu ul li:hover {
  background: #FAF9FD;
  color: var(--Text-Color, #0D0E10);
  transition: all 0.4s ease-in-out;
}

.mobile-sidebar4 .mobile-nav.mobile-nav2 .allmobilesection .single-footer .footer4-contact-info .social-links-mobile-menu ul li:hover a svg {
  color: var(--white-100, #FFF);
}

.mobile-sidebar4 .mobile-nav.mobile-nav2 .allmobilesection .single-footer .footer4-contact-info .social-links-mobile-menu ul li a {
  line-height: 0px;
}

.mobile-sidebar4 .mobile-nav.mobile-nav2 .allmobilesection .single-footer .footer4-contact-info .social-links-mobile-menu ul li a:hover {
  color: var(--white-100, #FFF);
  transition: all 0.4s ease-in-out;
}

.mobile-haeder5 {
  background: #5C3EF4;
  position: fixed;
}

.mobile-haeder5 .mobile-header-elements .dots-menu {
  color: var(--white-100, #FFF);
  cursor: pointer;
}

.mobile-sidebar5 {
  max-height: 100%;
  overflow-y: scroll;
  background: #5C3EF4;
}

.mobile-sidebar5 .menu-close {
  color: var(--white-100, #FFF);
  cursor: pointer;
}

.mobile-sidebar5 .mobile-nav .mobile-nav-list li a {
  font-family: "Figtree", sans-serif;
  font-weight: 500 !important;
  color: var(--white-100, #FFF);
}

.mobile-sidebar5 .mobile-nav .mobile-nav-list li span::after {
  background: var(--white-100, #FFF);
  color: var(--white-100, #FFF);
}

.mobile-sidebar5 .mobile-nav .mobile-nav-list li span::before {
  background: var(--white-100, #FFF);
  color: var(--white-100, #FFF);
}

.mobile-sidebar5 .mobile-nav .mobile-nav-list li ul li a {
  font-weight: 500 !important;
}

.mobile-sidebar5 .mobile-nav .allmobilesection .header-btn9 {
  display: inline-block;
  border-radius: 25px;
  transition: all 0.4s ease-in-out;
  position: relative;
  z-index: 1;
  width: 100%;
  text-align: center;
  margin-top: 30px;
}

.mobile-sidebar5 .mobile-nav .allmobilesection .header-btn9::after {
  background: var(--white-100, #FFF);
}

.mobile-sidebar5 .mobile-nav .allmobilesection .header-btn9:hover {
  color: #5C3EF4;
}

.mobile-sidebar5 .mobile-nav .allmobilesection .header-btn9 svg {
  transform: rotate(-45deg);
}

.mobile-sidebar5 .mobile-nav .allmobilesection .single-footer h3 {
  font-family: "Figtree", sans-serif;
  font-size: 24px;
  line-height: 30px;
  color: var(--white-100, #FFF);
  font-weight: 700;
  margin-bottom: 16px;
  margin-top: 30px;
}

.mobile-sidebar5 .mobile-nav .allmobilesection .single-footer .footer4-contact-info .contact-info-single {
  display: flex;
  color: var(--white-100, #FFF);
}

.mobile-sidebar5 .mobile-nav .allmobilesection .single-footer .footer4-contact-info .contact-info-single svg {
  margin: 0 10px 0 0;
  counter-reset: var(--white-100, #FFF);
}

.mobile-sidebar5 .mobile-nav .allmobilesection .single-footer .footer4-contact-info .contact-info-single a {
  font-family: "Figtree", sans-serif;
  font-weight: 500;
  color: var(--white-100, #FFF);
  opacity: 0.7;
  font-size: 16px;
}

.mobile-sidebar5 .mobile-nav .allmobilesection .single-footer .footer4-contact-info .social-links-mobile-menu ul li {
  display: inline-block;
  height: 40px;
  width: 40px;
  border-radius: 50%;
  background: var(--white-100, #FFF);
  color: var(--Text-Color, #0D0E10);
  transition: all 0.4s ease-in-out;
  display: inline-block;
  text-align: center;
  margin: 0 6px 0 0;
  cursor: pointer;
}

.mobile-sidebar5 .mobile-nav .allmobilesection .single-footer .footer4-contact-info .social-links-mobile-menu ul li:hover {
  background: var(--white-100, #FFF);
  color: var(--white-100, #FFF);
  transition: all 0.4s ease-in-out;
}

.mobile-sidebar5 .mobile-nav .allmobilesection .single-footer .footer4-contact-info .social-links-mobile-menu ul li:hover a svg {
  color: var(--white-100, #FFF);
}

.mobile-sidebar5 .mobile-nav .allmobilesection .single-footer .footer4-contact-info .social-links-mobile-menu ul li a {
  line-height: 0px;
}

.mobile-sidebar5 .mobile-nav .allmobilesection .single-footer .footer4-contact-info .social-links-mobile-menu ul li a:hover {
  color: var(--white-100, #FFF);
  transition: all 0.4s ease-in-out;
}

/*============= MOBILE-MENU  AREA ENDS===============*/
/*============= GENERATION CSS AREA ===============*/
.genaration2-section-area {
  background: var(--BG, #F7F9FA);
}

@media (max-width: 767px) {
  .genaration2-section-area {
    padding: 0px 0 50px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .genaration2-section-area {
    padding: 50px 0 50px;
  }
}

.genaration2-section-area .genaration2-header span {
  background: rgba(110, 36, 255, 0.05);
  display: inline-block;
  border-radius: 35px;
  color: #010ca8;
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  padding: 8px 12px;
  margin-bottom: 16px;
}

.genaration2-section-area .tabs-area {
  border-radius: 36px;
  background: var(--white-100, var(--white-100, #FFF));
  box-shadow: 0px 4px 50px 0px rgba(0, 0, 0, 0.08);
  text-align: center;
  justify-content: center;
  padding: 16px 24px;
  margin: 0 110px;
}

@media (max-width: 767px) {
  .genaration2-section-area .tabs-area {
    margin: 0;
    padding: 16px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .genaration2-section-area .tabs-area {
    margin: 0;
    padding: 16px;
  }
}

.genaration2-section-area .tabs-area ul {
  justify-content: center;
}

.genaration2-section-area .tabs-area ul li button {
  color: var(--Text-Color, #0D0E10);
  text-align: center;
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 16px;
  display: inline-block;
  background: #F6F5FE;
  padding: 12px 24px;
  border-radius: 20px;
  margin: 0 16px 0 0;
  border: none !important;
}

@media (max-width: 767px) {
  .genaration2-section-area .tabs-area ul li button {
    margin: 0 8px;
    margin-bottom: 10px;

  }

  .mobile-logo {
    width: 200px !important;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .genaration2-section-area .tabs-area ul li button {
    margin: 0 8px;
    margin-bottom: 5px;
  }

}

.genaration2-section-area .tabs-area .nav-pills .nav-link.active,
.genaration2-section-area .tabs-area .nav-pills .show>.nav-link {
  background: #010ca8;
}

.genaration2-section-area .tabs-content-area .tab-pane {
  transform: rotateX(45deg) translateY(50px);
  transition: all 0.4s ease-in-out;
  opacity: 0;
}

.genaration2-section-area .tabs-content-area .tab-pane .tabs-contents .tabs-images img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 15px;
  padding: 25px 0px;
}

@media (max-width: 767px) {
  .genaration2-section-area .tabs-content-area .tab-pane .tabs-contents .tabs-images img {
    margin-bottom: 30px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .genaration2-section-area .tabs-content-area .tab-pane .tabs-contents .tabs-images img {
    margin-bottom: 30px;
  }
}

.tabs-text-area {
  padding: 20px;
}

/* .genaration2-section-area .tabs-content-area .tab-pane .tabs-contents .tabs-text-area {
  border-radius: var(--4, 4px);
  border: 1px solid var(--Stroke-Color, rgba(86, 95, 118, 0.1));
  padding: 20px 16px;
  position: relative;
  transition: all 0.4s ease-in-out;
  margin: 0 0 0 40px;
  text-align: left;
} */
@media (max-width: 767px) {
  .genaration2-section-area .tabs-content-area .tab-pane .tabs-contents .tabs-text-area {
    margin: 0;
    text-align: center !important;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .genaration2-section-area .tabs-content-area .tab-pane .tabs-contents .tabs-text-area {
    margin: 0;

  }
}

/* .genaration2-section-area .tabs-content-area .tab-pane .tabs-contents .tabs-text-area:hover {
  border-radius: var(--4, 4px);
  background: var(--white-100, #FFF);
  transition: all 0.4s ease-in-out;
  transform: translateY(-5px);
  box-shadow: 0px 4px 50px 0px rgba(0, 0, 0, 0.08);
} */
.genaration2-section-area .tabs-content-area .tab-pane .tabs-contents .tabs-text-area .tabs-icon {
  height: 84px;
  width: 84px;
  text-align: center;
  line-height: 84px;
  background: #E9DEFF;
  border-radius: 50%;
  display: inline-block;
  position: absolute;
}

@media (max-width: 767px) {
  .genaration2-section-area .tabs-content-area .tab-pane .tabs-contents .tabs-text-area .tabs-icon {
    position: relative;
  }
}

.genaration2-section-area .tabs-content-area .tab-pane .tabs-contents .tabs-text-area .tabs-icon1 {
  height: 84px;
  width: 84px;
  text-align: center;
  line-height: 84px;
  background: #F8DFDE;
  border-radius: 50%;
  display: inline-block;
  position: absolute;
}

@media (max-width: 767px) {
  .genaration2-section-area .tabs-content-area .tab-pane .tabs-contents .tabs-text-area .tabs-icon1 {
    position: relative;
  }
}

.genaration2-section-area .tabs-content-area .tab-pane .tabs-contents .tabs-text-area .tabs-icon2 {
  height: 84px;
  width: 84px;
  text-align: center;
  line-height: 84px;
  background: #D6EBE7;
  border-radius: 50%;
  display: inline-block;
  position: absolute;
}

@media (max-width: 767px) {
  .genaration2-section-area .tabs-content-area .tab-pane .tabs-contents .tabs-text-area .tabs-icon2 {
    position: relative;
  }
}

.genaration2-section-area .tabs-content-area .tab-pane .tabs-contents .tabs-text-area .tabs-text {
  padding-left: 100px;
}

@media (max-width: 767px) {
  .genaration2-section-area .tabs-content-area .tab-pane .tabs-contents .tabs-text-area .tabs-text {
    padding-left: 0;
    margin-top: 20px;
  }
}

.genaration2-section-area .tabs-content-area .tab-pane .tabs-contents .tabs-text-area .tabs-text a {
  color: var(--Text-Color, #0D0E10);
  font-family: "Figtree", sans-serif;
  font-size: 20px;
  font-style: normal;
  font-weight: 600;
  line-height: 20px;
  display: inline-block;
  margin-bottom: 12px;
  text-transform: capitalize;
}

.genaration2-section-area .tabs-content-area .tab-pane .tabs-contents .tabs-text-area .tabs-text p {
  color: #676879;
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 28px;
}

.genaration2-section-area .tabs-content-area .tab-pane.show.active {
  transform: rotateX(0deg) translateY(0);
  opacity: 1;
}

/*============= GENERATION CSS AREA ENDS ===============*/
/*============= PROCESS CSS AREA ===============*/
@media (max-width: 767px) {
  .process-section-area {
    padding: 50px 0 50px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .process-section-area {
    padding: 50px 0 50px;
  }
}

.process-section-area .process-header span {
  display: inline-block;
  padding: 8px 12px;
  color: #010ca8;
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  border-radius: 32px;
  background: rgba(110, 36, 255, 0.05);
  margin-bottom: 12px;
}

.process-section-area .process-images img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 4px;
}

.process-section-area .process-images-content {
  padding: 0 0 0 50px;
}

@media (max-width: 767px) {
  .process-section-area .process-images-content {
    padding: 0;
    margin-top: 30px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .process-section-area .process-images-content {
    padding: 0;
    margin-top: 30px;
  }
}

.process-section-area .process-images-content span {
  display: inline-block;
  padding: 8px 12px;
  color: #010ca8;
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  border-radius: 32px;
  background: rgba(110, 36, 255, 0.05);
  margin-bottom: 20px;
}

.process-section-area .process-images-content h2 {
  text-align: start !important;
  margin-bottom: 16px;
  font-size: 32px;
  line-height: 40px;
}

@media (max-width: 767px) {
  .process-section-area .process-images-content h2 {
    font-size: 30px;
  }
}

.process-section-area .process-images-content p {
  color: #676879;
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 28px;
}

.process-section-area .process-section2 {
  padding: 0px 0;
  position: relative;
}

@media (max-width: 767px) {
  .process-section-area .process-section2 {
    padding: 0 10px 30px 10px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .process-section-area .process-section2 {
    padding: 0 10px 30px 10px;
  }
}

@media (max-width: 767px) {
  .process-section-area .process-section2 .process-images-content {
    margin-bottom: 30px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .process-section-area .process-section2 .process-images-content {
    margin-bottom: 30px;
  }
}

.process-section-area .process-section2 .process-elements1 {
  position: absolute;
  right: 47%;
  left: 48%;
  z-index: -1;
  top: 0;
  rotate: 8deg;
}

.process-section-area .process-section2 .process-elements2 {
  position: absolute;
  bottom: 0;
  position: absolute;
  right: 45%;
  left: 44%;
  z-index: -1;
  rotate: -4deg;
}

.process-section-area .process-section2 .process-images-content {
  padding: 0 50px 0 0;
}

@media (max-width: 767px) {
  .process-section-area .process-section2 .process-images-content {
    padding: 0;
    margin-top: 30px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .process-section-area .process-section2 .process-images-content {
    padding: 0;
    margin-top: 30px;
  }
}

@media (max-width: 767px) {
  .process-inner-area {
    padding: 50px 0 50px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .process-inner-area {
    padding: 50px 0 50px;
  }
}

.process-inner-area .process-inner-header span {
  font-family: "Figtree", sans-serif;
  font-weight: 500;
  color: #010ca8;
  transition: all 0.4s ease-in-out;
  font-size: 16px;
  line-height: 16px;
  display: inline-block;
  padding: 8px 12px;
  border-radius: 32px;
  background: #F8F4FF;
}

.process-inner-area .process-images img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 4px;
}

.process-inner-area .process-content-area {
  padding: 0 0 0 50px;
  position: relative;
}

@media (max-width: 767px) {
  .process-inner-area .process-content-area {
    padding: 0;
    margin-top: 60px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .process-inner-area .process-content-area {
    padding: 0;
    margin-top: 60px;
  }
}

.process-inner-area .process-content-area span {
  font-size: 300px;
  text-align: center;
  position: absolute;
  z-index: -1;
  color: #F4F4F6;
  opacity: 0.7;
  font-weight: 700;
  display: inline-block;
  top: 60px;
  font-family: "Figtree", sans-serif;
}

.process-inner-area .process-content-area h2 {
  font-size: 32px;
  line-height: 42px;
}

.process-inner-area .process-content-area.content2 {
  padding: 0 50px 0 0;
}

@media (max-width: 767px) {
  .process-inner-area .process-content-area.content2 {
    padding: 0;
    margin-bottom: 60px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .process-inner-area .process-content-area.content2 {
    padding: 0;
    margin-bottom: 80px;
  }
}

.more-features-scetion-area.more-features2 {
  background: var(--BG, #F7F9FA);
}

.more-features-scetion-area.more-features2 .more-features-header span {
  font-family: "Figtree", sans-serif;
  font-weight: 500;
  color: #010ca8;
  transition: all 0.4s ease-in-out;
  font-size: 16px;
  line-height: 16px;
  display: inline-block;
  padding: 8px 12px;
  border-radius: 32px;
  background: #F0EEFA;
}

.more-features-scetion-area.more-features2 .more-features-box {
  position: relative;
  z-index: 1;
}

.more-features-scetion-area.more-features2 .more-features-box:hover {
  background: none;
}

.more-features-scetion-area.more-features2 .more-features-box:hover .more-elements {
  z-index: 2;
  transition: all 0.4s ease-in-out;
}

.more-features-scetion-area.more-features2 .more-features-box:hover::after {
  width: 100%;
  right: 0;
  top: 0;
  border-radius: 4px;
  opacity: 1;
  height: 100%;
}

.more-features-scetion-area.more-features2 .more-features-box:hover::before {
  width: 100%;
  left: 0;
  top: 0;
  border-radius: 4px;
  opacity: 1;
  height: 100%;
}

.more-features-scetion-area.more-features2 .more-features-box::after {
  position: absolute;
  content: "";
  height: 100%;
  width: 100%;
  border-radius: 4px;
  transition: all 0.4s ease-in-out;
  right: -200px;
  top: 0;
  overflow: hidden;
  opacity: 0;
  background: #010ca8;
  z-index: -1;
}

.more-features-scetion-area.more-features2 .more-features-box::before {
  position: absolute;
  content: "";
  height: 100%;
  width: 100%;
  border-radius: 4px;
  transition: all 0.4s ease-in-out;
  left: -200px;
  top: 0;
  overflow: hidden;
  opacity: 0;
  background: #010ca8;
  z-index: -2;
}

/*============= PROCESS CSS AREA ENDS ===============*/
/*============= TEMPLETE CSS AREA ===============*/
@media (max-width: 767px) {
  .templete1-section-area {
    padding: 50px 0 50px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .templete1-section-area {
    padding: 50px 0 50px;
  }
}

.templete1-section-area .templete-header span {
  border-radius: 32px;
  background: rgba(110, 36, 255, 0.05);
  color: #010ca8;
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  display: inline-block;
  padding: 8px 12px;
  margin-bottom: 12px;
}

.templete1-section-area .tabs-carousel-area .nav.nav-pills {
  justify-content: center;
}

.templete1-section-area .tabs-carousel-area .nav.nav-pills .nav-link {
  border-radius: 20px;
  background: #F6F5FE;
  color: var(--Text-Color, #0D0E10);
  text-align: center;
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  border: none;
  line-height: 16px;
  padding: 12px 24px;
  margin: 0 16px 0 0;
}

@media (max-width: 767px) {
  .templete1-section-area .tabs-carousel-area .nav.nav-pills .nav-link {
    margin-bottom: 10px;
  }
}

.templete1-section-area .tabs-carousel-area .nav.nav-pills .nav-link.active {
  background: #010ca8;
  color: var(--white-100, #FFF);
  border: none;
}

.templete1-section-area .tabs-carousel-area .tab-carousel-section .owl-nav button {
  height: 40px;
  width: 40px;
  text-align: center;
  line-height: 40px;
  background: #F0E9FF;
  border-radius: 50%;
  transition: all 0.4s ease-in-out;
}

.templete1-section-area .tabs-carousel-area .tab-carousel-section .owl-nav button:hover {
  transition: all 0.4s ease-in-out;
  background: #010ca8;
  color: var(--white-100, #FFF);
}

@media (max-width: 767px) {
  .templete1-section-area .tabs-carousel-area .tab-carousel-section .owl-nav {
    text-align: center;
    margin-bottom: 30px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .templete1-section-area .tabs-carousel-area .tab-carousel-section .owl-nav {
    text-align: center;
    margin-bottom: 30px;
  }
}

.templete1-section-area .tabs-carousel-area .tab-carousel-section .owl-prev {
  position: absolute;
  top: 50%;
  left: -70px;
}

@media (max-width: 767px) {
  .templete1-section-area .tabs-carousel-area .tab-carousel-section .owl-prev {
    position: relative;
    left: -3px;
    top: 30px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .templete1-section-area .tabs-carousel-area .tab-carousel-section .owl-prev {
    position: relative;
    left: -3px;
    top: 30px;
  }
}

.templete1-section-area .tabs-carousel-area .tab-carousel-section .owl-next {
  position: absolute;
  top: 50%;
  right: -70px;
}

@media (max-width: 767px) {
  .templete1-section-area .tabs-carousel-area .tab-carousel-section .owl-next {
    position: relative;
    right: -3px;
    top: 30px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .templete1-section-area .tabs-carousel-area .tab-carousel-section .owl-next {
    position: relative;
    right: -3px;
    top: 30px;
  }
}

.templete1-section-area .tabs-carousel-area .tab-carousel-section .tabs-carousel-img {
  position: relative;
  z-index: -1;
  transition: all 0.4s ease-in-out;
}

.templete1-section-area .tabs-carousel-area .tab-carousel-section .tabs-carousel-img:hover .tabs-morebtn {
  visibility: visible;
  opacity: 1;
  margin-top: 0;
  transition: all 0.6s ease-in-out;
  z-index: 2;
}

.templete1-section-area .tabs-carousel-area .tab-carousel-section .tabs-carousel-img:hover::after {
  visibility: visible;
  transition: all 0.4s ease-in-out;
}

.templete1-section-area .tabs-carousel-area .tab-carousel-section .tabs-carousel-img img {
  border-radius: 4px;
}

.templete1-section-area .tabs-carousel-area .tab-carousel-section .tabs-carousel-img::after {
  position: absolute;
  content: "";
  height: 70px;
  width: 70px;
  transition: all 0.4s ease-in-out;
  border-radius: 50%;
  background: #010ca8;
  opacity: 0;
  left: 30%;
  right: 30%;
  top: 45%;
  visibility: hidden;
}

.templete1-section-area .tabs-carousel-area .tab-carousel-section .tabs-carousel-img:hover::after {
  height: 100%;
  width: 100%;
  border-radius: 4px;
  transition: all 0.4s ease-in-out;
  top: 0;
  left: 0;
  opacity: 0.5;
}

.templete1-section-area .tabs-carousel-area .tab-carousel-section .tabs-carousel-img .tabs-morebtn {
  text-align: center;
  position: absolute;
  top: 45%;
  z-index: 2;
  left: 20%;
  right: 20%;
  visibility: hidden;
  opacity: 0;
  transition: all 0.4s ease-in-out;
  margin-top: 20px;
}

.templete1-section-area .tabs-carousel-area .tab-carousel-section .tabs-carousel-img .tabs-morebtn .header-btn2::after {
  background: #010ca8 !important;
}

.templete1-section-area .tabs-carousel-area .tab-content .tab-pane {
  transform: rotateX(45deg) translateY(50px);
  transition: all 0.4s ease-in-out;
}

.templete1-section-area .tabs-carousel-area .tab-content .tab-pane.show.active {
  transform: rotateX(0) translateY(0);
  opacity: 1;
}

@media (max-width: 767px) {
  .pricing-paln-section-area {
    padding: 50px 0 20px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .pricing-paln-section-area {
    padding: 50px 0 20px;
  }
}

.pricing-paln-section-area .pricing-plans .toggle-inner {
  width: 75px;
  margin: 0 auto;
  height: 35px;
  border: 1px solid #4B24EE;
  border-radius: 25px;
  position: relative;
  background: #4B24EE;
}

.pricing-paln-section-area .pricing-plans .toggle-inner input {
  position: absolute;
  left: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  border-radius: 25px;
  right: 0;
  z-index: 1;
  opacity: 0;
  cursor: pointer;
}

.pricing-paln-section-area .pricing-plans .custom-toggle {
  position: absolute;
  height: 25px;
  width: 25px;
  background-color: #ffffff;
  top: 4px;
  left: 5px;
  border-radius: 50%;
  transition: 300ms all;
}

.pricing-paln-section-area .pricing-plans .toggle-inner .t-month,
.pricing-paln-section-area .pricing-plans .toggle-inner .t-year {
  position: absolute;
  left: -70px;
  top: 5px;
  color: var(--Text-Color, #0D0E10);
  transition: 300ms all;
  font-size: 18px;
  font-weight: 700;
  line-height: 16px;
  margin: 0 -8px;
}

.pricing-paln-section-area .pricing-plans .toggle-inner .t-year {
  left: unset;
  right: -60px;
  opacity: 0.5;
}

.pricing-paln-section-area .pricing-plans .active>.toggle-inner .t-month {
  opacity: 0.5;
}

.pricing-paln-section-area .pricing-plans .active>.toggle-inner .t-year {
  opacity: 1;
}

.pricing-paln-section-area .pricing-plans .toggle-inner input:checked+span {
  left: 43px;
}

.pricing-paln-section-area .tab-content .price-box {
  margin-bottom: 30px;
}

.pricing-paln-section-area .tab-content .price-box .hadding .pricing-area {
  background: #FAF9FD;
  padding: 24px;
  border-radius: 4px;
  transition: all 0.4s ease-in-out;
  position: relative;
  z-index: 1;
  margin-bottom: 8px;
}

.pricing-paln-section-area .tab-content .price-box .hadding .pricing-area::after {
  position: absolute;
  content: "";
  height: 30px;
  width: 30px;
  border-radius: 50%;
  top: 40%;
  left: 40%;
  right: 40%;
  transition: all 0.4s ease-in-out;
  z-index: -1;
  background: #4B24EE;
  visibility: hidden;
  opacity: 0;
  border-radius: 4px;
}

.pricing-paln-section-area .tab-content .price-box .hadding .pricing-area:hover::after {
  background: #4B24EE;
  transition: all 0.4s ease-in-out;
  height: 100%;
  width: 100%;
  border-radius: 4px;
  left: 0;
  top: 0;
  right: 0;
  opacity: 1;
  visibility: visible;
}

.pricing-paln-section-area .tab-content .price-box .hadding .pricing-area:hover h3 {
  color: var(--white-100, #FFF);
  transition: all 0.4s ease-in-out;
}

.pricing-paln-section-area .tab-content .price-box .hadding .pricing-area:hover h2 {
  color: var(--white-100, #FFF);
  transition: all 0.4s ease-in-out;
}

.pricing-paln-section-area .tab-content .price-box .hadding .pricing-area:hover h2 span {
  color: var(--white-100, #FFF);
  opacity: 0.8;
  transition: all 0.4s ease-in-out;
}

.pricing-paln-section-area .tab-content .price-box .hadding .pricing-area:hover p {
  color: var(--white-100, #FFF);
  opacity: 0.8;
  transition: all 0.4s ease-in-out;
}

.pricing-paln-section-area .tab-content .price-box .hadding .pricing-area:hover .header-btn5 {
  background: var(--white-100, #FFF);
  transition: all 0.4s ease-in-out;
}

.pricing-paln-section-area .tab-content .price-box .hadding .pricing-area:hover .header-btn5::after {
  background: var(--white-100, #FFF);
}

.pricing-paln-section-area .tab-content .price-box .hadding .pricing-area h3 {
  font-family: "Figtree", sans-serif;
  font-size: 20px;
  font-weight: 700;
  color: var(--Text-Color, #0D0E10);
  transition: all 0.4s ease-in-out;
}

.pricing-paln-section-area .tab-content .price-box .hadding .pricing-area h2 {
  font-size: 60px;
  font-weight: 700;
  color: var(--Text-Color, #0D0E10);
  font-family: "Figtree", sans-serif;
  transition: all 0.4s ease-in-out;
}

.pricing-paln-section-area .tab-content .price-box .hadding .pricing-area h2 span {
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-weight: 500;
  color: #676879;
  display: inline-block;
  transition: all 0.4s ease-in-out;
}

.pricing-paln-section-area .tab-content .price-box .hadding .pricing-area p {
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-weight: 500;
  color: #676879;
  transition: all 0.4s ease-in-out;
}

.pricing-paln-section-area .tab-content .price-box .hadding .pricing-area a.header-btn5 {
  width: 100%;
  text-align: center;
  background: none;
  border: 1px solid #4B24EE;
  color: #4B24EE;
  transition: all 0.4s ease-in-out;
}

.pricing-paln-section-area .tab-content .price-box .hadding .pricing-area.bg2 {
  background: #4B24EE;
  position: relative;
}

.pricing-paln-section-area .tab-content .price-box .hadding .pricing-area.bg2 .popular {
  background: var(--white-100, #FFF);
  border: 1px solid #4B24EE;
  display: inline-block;
  border-radius: 5px;
  padding: 8px;
  position: absolute;
  left: 39%;
  right: 38%;
  top: -17px;
}

.pricing-paln-section-area .tab-content .price-box .hadding .pricing-area.bg2 .popular p {
  font-family: "Figtree", sans-serif;
  font-size: 12px;
  font-weight: 700;
  color: #4B24EE;
  line-height: 12px;
}

.pricing-paln-section-area .tab-content .price-box .hadding .pricing-area.bg2 h2 {
  color: var(--white-100, #FFF);
}

.pricing-paln-section-area .tab-content .price-box .hadding .pricing-area.bg2 h3 {
  color: var(--white-100, #FFF);
}

.pricing-paln-section-area .tab-content .price-box .hadding .pricing-area.bg2 p {
  color: var(--white-100, #FFF);
  opacity: 0.8;
}

.pricing-paln-section-area .tab-content .price-box .hadding .pricing-area.bg2 span {
  color: var(--white-100, #FFF);
  opacity: 0.8;
}

.pricing-paln-section-area .tab-content .price-box .hadding .pricing-area.bg2 .header-btn5 {
  background: var(--white-100, #FFF);
}

.pricing-paln-section-area .tab-content .price-box .hadding .price-list ul li {
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-weight: 500;
  color: #676879;
  padding: 16px 0;
  line-height: 16px;
  border-bottom: 1px solid var(--Stroke-Color, rgba(86, 95, 118, 0.1));
  transition: all 0.4s ease-in-out;
}

.pricing-paln-section-area .tab-content .price-box .hadding .price-list ul li img {
  margin: 0 8px 0 0;
}

.pricing-paln-section-area .tab-content .price-box .hadding .price-list ul li:nth-child(3) {
  border-bottom: none;
}

.pricing2 {
  background: var(--BG, #F7F9FA);
}

.pricing2 .pricing-header span {
  background: #F0EEFA;
  padding: 8px 12px;
  line-height: 16px;
  border-radius: 32px;
  display: inline-block;
  font-size: 16px;
  font-weight: 500;
  color: #010ca8;
}

.pricing2 .pricing-plans .toggle-inner {
  background: #010ca8;
}

.pricing2 .pricing-plans .tab-content .price-box .pricing-area {
  background: var(--white-100, #FFF);
}

.pricing2 .pricing-plans .tab-content .price-box .pricing-area::after {
  background: #010ca8 !important;
}

.pricing2 .pricing-plans .tab-content .price-box .pricing-area .header-btn2 {
  width: 100%;
  text-align: center;
  background: var(--white-100, #FFF);
  border: 1px solid #010ca8;
  color: #010ca8;
}

.pricing2 .pricing-plans .tab-content .price-box .pricing-area .header-btn2::after {
  left: 50%;
  right: 50%;
  background: #FC4B3E !important;
}

.pricing2 .pricing-plans .tab-content .price-box .pricing-area .header-btn2:hover {
  color: var(--white-100, #FFF);
}

.pricing2 .pricing-plans .tab-content .price-box .pricing-area .header-btn2:hover::after {
  left: 0;
  top: 0;
  right: 0;
}

.pricing2 .pricing-plans .tab-content .price-box .bg2 {
  background: #010ca8 !important;
}

.pricing2 .pricing-plans .tab-content .price-box .bg2 .popular {
  border: 1px solid #010ca8;
  color: #010ca8;
}

.bg-none .pricing-plans .tab-content .price-box .pricing-area {
  box-shadow: 0px 4px 50px 0px rgba(0, 0, 0, 0.08);
}

.pricing-paln-section-area .pricing-plans.compare-paln {
  background: var(--white-100, #FFF);
  box-shadow: 0px 4px 50px 0px rgba(0, 0, 0, 0.08);
  border-radius: 4px;
  padding: 60px 32px !important;
  position: relative;
  text-align: center;
}

.pricing-paln-section-area .pricing-plans.compare-paln .plan-toggle-wrap1 {
  margin-top: 100px;
}

@media (max-width: 767px) {
  .pricing-paln-section-area .pricing-plans.compare-paln .plan-toggle-wrap1 {
    margin-top: 0;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .pricing-paln-section-area .pricing-plans.compare-paln .plan-toggle-wrap1 {
    margin-top: 0;
  }
}

.pricing-paln-section-area .pricing-plans.compare-paln .tab-content.bg2 {
  background: #FFF6F5 !important;
}

.pricing-paln-section-area .pricing-plans.compare-paln h3 {
  font-size: 20px !important;
  font-family: "Figtree", sans-serif;
  font-weight: 700;
  color: var(--Text-Color, #0D0E10);
}

.pricing-paln-section-area .pricing-plans.compare-paln .tab-content {
  background: #F8F4FF;
  padding: 32px;
  position: relative;
  width: 230px;
  left: 60px;
}

@media (max-width: 767px) {
  .pricing-paln-section-area .pricing-plans.compare-paln .tab-content {
    width: 100%;
    left: 0;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .pricing-paln-section-area .pricing-plans.compare-paln .tab-content {
    width: 100%;
    left: 0;
  }
}

.pricing-paln-section-area .pricing-plans.compare-paln .tab-content h2 {
  font-family: "Figtree", sans-serif;
  font-size: 60px;
  font-weight: 700;
  color: var(--Text-Color, #0D0E10);
}

.pricing-paln-section-area .pricing-plans.compare-paln .tab-content p {
  font-size: 16px;
  font-weight: 500;
  color: #676879;
}

.pricing-paln-section-area .pricing-plans.compare-paln .tab-content .header-btn2 {
  background: var(--white-100, #FFF);
  border: 1px solid #FC4B3E;
  color: #FC4B3E;
}

.pricing-paln-section-area .pricing-plans.compare-paln .tab-content .header-btn2::after {
  background: #FC4B3E;
  color: var(--white-100, #FFF);
}

.pricing-paln-section-area .pricing-plans.compare-paln .tab-content .header-btn2:hover {
  color: var(--white-100, #FFF);
}

@media (max-width: 767px) {
  .pricing-paln-section-area .pricing-plans.compare-paln .table-area {
    overflow-x: hidden;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .pricing-paln-section-area .pricing-plans.compare-paln .table-area {
    overflow-y: hidden;
  }
}

.pricing-paln-section-area .pricing-plans.compare-paln .table-area .price-table {
  width: 100%;
  text-align: start;
}

.pricing-paln-section-area .pricing-plans.compare-paln .table-area .price-table tbody tr {
  border-top: 1px solid var(--Stroke-Color, rgba(86, 95, 118, 0.1));
  border-bottom: 1px solid var(--Stroke-Color, rgba(86, 95, 118, 0.1));
}

.pricing-paln-section-area .pricing-plans.compare-paln .table-area .price-table tbody tr td {
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-weight: 500;
  color: #676879;
  line-height: 26px;
  padding: 16px 0;
  position: relative;
}

.pricing-paln-section-area .pricing-plans.compare-paln .table-area .price-table tbody tr .check {
  left: -45%;
  position: relative;
  z-index: 1;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .pricing-paln-section-area .pricing-plans.compare-paln .table-area .price-table tbody tr .check {
    left: 0;
  }
}

@media (max-width: 767px) {
  .pricing-paln-section-area .pricing-plans.compare-paln .table-area .price-table tbody tr .check {
    display: none;
  }
}

.pricing-paln-section-area .pricing-plans.compare-paln .table-area .price-table tbody tr .check::after {
  position: absolute;
  content: "";
  left: -106px;
  top: 0;
  background: #F8F4FF;
  width: 230px;
  height: 58px;
  z-index: -1;
}

.pricing-paln-section-area .pricing-plans.compare-paln .table-area .price-table tbody tr .check-icons2 {
  position: relative;
  left: -25%;
  z-index: 1;
}

@media (max-width: 767px) {
  .pricing-paln-section-area .pricing-plans.compare-paln .table-area .price-table tbody tr .check-icons2 {
    display: none;
  }
}

.pricing-paln-section-area .pricing-plans.compare-paln .table-area .price-table tbody tr .check-icons2::after {
  position: absolute;
  content: "";
  left: -103px;
  top: 0;
  background: #FFF6F5;
  width: 230px;
  height: 58px;
  z-index: -1;
}

.pricing-paln-section-area .pricing-plans.compare-paln .table-area .price-table tbody tr .check-icons3 {
  position: relative;
  left: -4%;
  z-index: 1;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .pricing-paln-section-area .pricing-plans.compare-paln .table-area .price-table tbody tr .check-icons3 {
    left: 0;
  }
}

@media (max-width: 767px) {
  .pricing-paln-section-area .pricing-plans.compare-paln .table-area .price-table tbody tr .check-icons3 {
    display: none;
  }
}

.pricing-paln-section-area .pricing-plans.compare-paln .table-area .price-table tbody tr .check-icons3::after {
  position: absolute;
  content: "";
  left: -114px;
  top: 0;
  background: #F8F4FF;
  width: 230px;
  height: 58px;
  z-index: -1;
}

@media (max-width: 767px) {
  .pricicng-paln3 {
    padding: 50px 0 20px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .pricicng-paln3 {
    padding: 50px 0 20px;
  }
}

.pricicng-paln3 .pricing-plans .plan-toggle-wrap .toggle-inner {
  background: #581164;
  border: 1px solid #581164;
}

.pricicng-paln3 .pricing-plans .price-box .pricing-area {
  background: #FAF9FD;
}

.pricicng-paln3 .pricing-plans .price-box .pricing-area p {
  color: var(--white-100, #FFF);
  transition: all 0.4s ease-in-out;
  padding-bottom: 24px;
  border-bottom: 1px solid #DBDCE0;
}

.pricicng-paln3 .pricing-plans .price-box .pricing-area ul li {
  font-size: 16px;
  font-weight: 400;
  color: #676879;
  line-height: 16px;
  transition: all 0.4s ease-in-out;
  font-family: "Figtree", sans-serif;
}

.pricicng-paln3 .pricing-plans .price-box .pricing-area ul li img {
  margin: 0 6px 0 0;
}

.pricicng-paln3 .pricing-plans .price-box .pricing-area::after {
  top: 0 !important;
  width: 100% !important;
  background: #581164 !important;
  height: 0 !important;
  left: 0 !important;
}

.pricicng-paln3 .pricing-plans .price-box .bg2 {
  background: #581164 !important;
}

.pricicng-paln3 .pricing-plans .price-box .bg2 .popular {
  border: 1px solid #581164 !important;
}

.pricicng-paln3 .pricing-plans .price-box .bg2 .popular p {
  color: #581164 !important;
  border-bottom: 0;
  padding-bottom: 0;
}

.pricicng-paln3 .pricing-plans .price-box .bg2 ul li {
  color: var(--white-100, #FFF);
  transition: all 0.4s ease-in-out;
}

.pricicng-paln3 .pricing-plans .price-box .bg2 .header-btn7 {
  background: var(--white-100, #FFF);
  color: #581164;
  border: 1px solid var(--white-100, #FFF);
}

.pricicng-paln3 .pricing-plans .price-box .header-btn7 {
  width: 100%;
  background: #581164;
  color: var(--white-100, #FFF);
  text-align: center;
}

.pricicng-paln3 .pricing-plans .price-box .header-btn7::after {
  display: none;
}

.pricicng-paln3 .pricing-plans .price-box:hover .header-btn7 {
  background: var(--white-100, #FFF);
  color: #581164;
}

.pricicng-paln3 .pricing-plans .price-box:hover .pricing-area::after {
  width: 100% !important;
  height: 100% !important;
}

.pricicng-paln3 .pricing-plans .price-box:hover .pricing-area h3 {
  color: var(--white-100, #FFF);
  transition: all 0.4s ease-in-out;
}

.pricicng-paln3 .pricing-plans .price-box:hover .pricing-area h2 {
  color: var(--white-100, #FFF);
  transition: all 0.4s ease-in-out;
}

.pricicng-paln3 .pricing-plans .price-box:hover .pricing-area h2 span {
  transition: all 0.4s ease-in-out;
  color: var(--white-100, #FFF);
}

.pricicng-paln3 .pricing-plans .price-box:hover .pricing-area p {
  color: var(--white-100, #FFF);
  transition: all 0.4s ease-in-out;
}

.pricicng-paln3 .pricing-plans .price-box:hover .pricing-area ul li {
  color: var(--white-100, #FFF);
  transition: all 0.4s ease-in-out;
}

@media (max-width: 767px) {
  .pricing5-section-area {
    padding: 50px 0 20px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .pricing5-section-area {
    padding: 50px 0 20px;
  }
}

.pricing5-section-area .pricing-plans .plan-toggle-wrap .toggle-inner {
  background: #5C3EF4;
  border: 1px solid #5C3EF4;
}

.pricing5-section-area .pricing-plans .price-box .pricing-area {
  background: #FAF9FD;
}

.pricing5-section-area .pricing-plans .price-box .pricing-area p {
  color: var(--white-100, #FFF);
  transition: all 0.4s ease-in-out;
  padding-bottom: 24px;
  border-bottom: 1px solid #DBDCE0;
}

.pricing5-section-area .pricing-plans .price-box .pricing-area ul li {
  font-size: 16px;
  font-weight: 400;
  color: #676879;
  line-height: 16px;
  transition: all 0.4s ease-in-out;
  font-family: "Figtree", sans-serif;
}

.pricing5-section-area .pricing-plans .price-box .pricing-area ul li img {
  margin: 0 6px 0 0;
}

.pricing5-section-area .pricing-plans .price-box .pricing-area::after {
  top: 0 !important;
  width: 100% !important;
  background: #5C3EF4 !important;
  height: 0 !important;
  left: 0 !important;
}

.pricing5-section-area .pricing-plans .price-box .bg2 {
  background: #5C3EF4 !important;
}

.pricing5-section-area .pricing-plans .price-box .bg2 .popular {
  border: 1px solid #5C3EF4 !important;
}

.pricing5-section-area .pricing-plans .price-box .bg2 .popular p {
  color: #5C3EF4 !important;
  border-bottom: 0;
  padding-bottom: 0;
}

.pricing5-section-area .pricing-plans .price-box .bg2 ul li {
  color: var(--white-100, #FFF);
  transition: all 0.4s ease-in-out;
}

.pricing5-section-area .pricing-plans .price-box .bg2 .header-btn8 {
  background: var(--white-100, #FFF);
  color: #5C3EF4;
  border: 1px solid var(--white-100, #FFF);
}

.pricing5-section-area .pricing-plans .price-box .header-btn8 {
  width: 100%;
  background: #5C3EF4;
  color: var(--white-100, #FFF);
  text-align: center;
}

.pricing5-section-area .pricing-plans .price-box .header-btn8::after {
  display: none;
}

.pricing5-section-area .pricing-plans .price-box:hover .header-btn8 {
  background: var(--white-100, #FFF);
  color: #5C3EF4;
}

.pricing5-section-area .pricing-plans .price-box:hover .pricing-area::after {
  width: 100% !important;
  height: 100% !important;
}

.pricing5-section-area .pricing-plans .price-box:hover .pricing-area h3 {
  color: var(--white-100, #FFF);
  transition: all 0.4s ease-in-out;
}

.pricing5-section-area .pricing-plans .price-box:hover .pricing-area h2 {
  color: var(--white-100, #FFF);
  transition: all 0.4s ease-in-out;
}

.pricing5-section-area .pricing-plans .price-box:hover .pricing-area h2 span {
  transition: all 0.4s ease-in-out;
  color: var(--white-100, #FFF);
}

.pricing5-section-area .pricing-plans .price-box:hover .pricing-area p {
  color: var(--white-100, #FFF);
  transition: all 0.4s ease-in-out;
}

.pricing5-section-area .pricing-plans .price-box:hover .pricing-area ul li {
  color: var(--white-100, #FFF);
  transition: all 0.4s ease-in-out;
}

/*============= TEMPLETE CSS AREA ENDS ===============*/
/*============= COMPLAINT CSS AREA ===============*/
.complaint-section-area {
  background: var(--BG, #F7F9FA);
}

@media (max-width: 767px) {
  .complaint-section-area {
    padding: 50px 0 50px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .complaint-section-area {
    padding: 50px 0 50px;
  }
}

@media (max-width: 767px) {
  .complaint-section-area .complaint-header {
    margin-bottom: 30px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .complaint-section-area .complaint-header {
    margin-bottom: 30px;
  }
}

.complaint-section-area .complaint-header span {
  color: #010ca8;
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  border-radius: 32px;
  background: rgba(110, 36, 255, 0.05);
  padding: 8px 12px;
  display: inline-block;
  margin-bottom: 12px;
}

.complaint-section-area .complaint-header h2 {
  text-align: start !important;
}

.complaint-section-area .complaint-header p {
  color: #676879;
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 28px;
  margin-top: 16px;
}

.complaint-section-area .complaint-header .complaint-list {
  display: flex;
  align-items: center;
  margin-top: 8px;
}

@media (max-width: 767px) {
  .complaint-section-area .complaint-header .complaint-list {
    display: inline-block;
  }
}

.complaint-section-area .complaint-header .complaint-list ul {
  margin: 0 80px 0 0;
}

.complaint-section-area .complaint-header .complaint-list ul li {
  display: flex;
  align-items: center;
  margin-top: 26px;
}

.complaint-section-area .complaint-header .complaint-list ul li a {
  color: var(--Text-Color, #0D0E10);
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  display: inline-block;
}

.complaint-section-area .complaint-header .complaint-list ul li a img {
  margin: 0 8px 0 0;
}

.complaint-section-area .complaint-header .header-btn2 {
  margin-top: 32px;
  background: #010ca8;
}

.complaint-section-area .contact-mail .main-contact-box {
  position: relative;
}

.complaint-section-area .contact-mail .main-contact-box .main-contact-img .angle-border {
  position: absolute;
  left: -122px;
  top: 22%;
}

.complaint-section-area .contact-mail .main-contact-box .main-contact-img .instagram-icon {
  height: 64px;
  width: 64px;
  text-align: center;
  border-radius: 50%;
  line-height: 64px;
  display: inline-block;
  background: var(--white-100, #FFF);
  position: absolute;
  left: -150px;
  top: 0;
  box-shadow: 0px 6px 32px rgba(0, 0, 0, 0.15);
}

.complaint-section-area .contact-mail .main-contact-box .main-contact-content {
  border-radius: var(--4, 4px);
  background: var(--white-100, #FFF);
  padding: 24px;
  position: relative;
  z-index: 1;
  box-shadow: 0px 4px 50px 0px rgba(0, 0, 0, 0.08);
}

.complaint-section-area .contact-mail .main-contact-box .main-contact-content .mail-icon {
  height: 70px;
  width: 70px;
  text-align: center;
  line-height: 70px;
  background: #F8F4FF;
  border-radius: 50%;
}

.complaint-section-area .contact-mail .main-contact-box .main-contact-content .mail-content h3 {
  color: var(--Text-Color, #0D0E10);
  font-family: "Figtree", sans-serif;
  font-size: 20px;
  font-style: normal;
  font-weight: 700;
  line-height: 20px;
  margin-top: 16px;
  margin-bottom: 16px;
  text-transform: capitalize;
}

.complaint-section-area .contact-mail .main-contact-box .main-contact-content .mail-content p {
  color: #676879;
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 28px;
}

.complaint-section-area .contact-mail .main-contact-box.box2 {
  position: relative;
}

.complaint-section-area .contact-mail .main-contact-box.box2 .main-contact-img .angle-border {
  position: absolute;
  right: -122px;
  left: inherit;
  top: 22%;
}

.complaint-section-area .contact-mail .main-contact-box.box2 .main-contact-img .instagram-icon {
  height: 64px;
  width: 64px;
  text-align: center;
  border-radius: 50%;
  line-height: 64px;
  display: inline-block;
  background: var(--white-100, #FFF);
  position: absolute;
  right: -150px;
  left: inherit;
  top: 0;
  box-shadow: 0px 6px 32px rgba(0, 0, 0, 0.15);
}

.complaint-section-area .contact-mail .main-contact-box.box2 .main-contact-content {
  border-radius: var(--4, 4px);
  background: var(--white-100, #FFF);
  padding: 24px;
  position: relative;
  z-index: 1;
  box-shadow: 0px 4px 50px 0px rgba(0, 0, 0, 0.08);
}

.complaint-section-area .contact-mail .main-contact-box.box2 .main-contact-content .mail-icon {
  height: 70px;
  width: 70px;
  text-align: center;
  line-height: 70px;
  background: #F8F4FF;
  border-radius: 50%;
}

.complaint-section-area .contact-mail .main-contact-box.box2 .main-contact-content .mail-content h3 {
  color: var(--Text-Color, #0D0E10);
  font-family: "Figtree", sans-serif;
  font-size: 20px;
  font-style: normal;
  font-weight: 700;
  line-height: 20px;
  margin-top: 16px;
  margin-bottom: 16px;
  text-transform: capitalize;
}

.complaint-section-area .contact-mail .main-contact-box.box2 .main-contact-content .mail-content p {
  color: #676879;
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 28px;
}

/*============= COMPLAINT CSS AREA ENDS ===============*/
/*============= FAQ CSS AREA ===============*/
@media (max-width: 767px) {
  .faq3-section-area {
    padding: 50px 0 30px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .faq3-section-area {
    padding: 50px 0 30px;
  }
}

.faq3-section-area .faq3-widgets-area {
  padding: 0 0 0 50px;
}

@media (max-width: 767px) {
  .faq3-section-area .faq3-widgets-area {
    padding: 0;
    margin-top: 30px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .faq3-section-area .faq3-widgets-area {
    padding: 0;
    margin-top: 30px;
  }
}

.faq3-section-area .faq3-widgets-area .accordion .accordion-item {
  padding: 24px 0;
  border-top: 1px solid var(--Stroke-Color, rgba(86, 95, 118, 0.1));
  border-bottom: 0;
}

.faq3-section-area .faq3-widgets-area .accordion .accordion-item button {
  box-shadow: none;
  background: none;
  font-size: 20px;
  font-weight: 700;
  color: var(--Text-Color, #0D0E10);
  font-family: "Figtree", sans-serif;
  line-height: 24px;
  padding: 0;
}

.faq3-section-area .faq3-widgets-area .accordion .accordion-item .accordion-body {
  font-size: 16px;
  font-weight: 500;
  font-family: "Figtree", sans-serif;
  color: #676879;
  padding: 0;
  margin-top: 20px;
}

.faq3-section-area .faq3-widgets-area .accordion .accordion-item .accordion-button::after {
  flex-shrink: 0;
  width: 16px;
  height: 2px;
  margin-left: auto;
  content: "";
  background-color: var(--white-100, #FFF);
  filter: brightness(0);
  z-index: 2;
  position: absolute;
  right: 22px;
}

.faq3-section-area .faq3-widgets-area .accordion .accordion-item .accordion-button::before {
  flex-shrink: 0;
  width: 2px;
  height: 16px;
  margin-left: auto;
  content: "";
  background-color: var(--white-100, #FFF);
  filter: brightness(0);
  position: absolute;
  right: 29px;
  z-index: 3;
  display: none;
}

.faq3-section-area .faq3-widgets-area .accordion .accordion-button.collapsed.accordion-button::before {
  display: block;
}

@media (max-width: 767px) {
  .faq-inner-section-area {
    padding: 50px 0 50px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .faq-inner-section-area {
    padding: 50px 0 50px;
  }
}

.faq-inner-section-area .faq-all-area .accordion .accordion-item {
  padding: 24px;
  border: 1px solid var(--Stroke-Color, rgba(86, 95, 118, 0.1));
  border-radius: 4px;
}

.faq-inner-section-area .faq-all-area .accordion .accordion-item button {
  box-shadow: none;
  background: none;
  font-size: 20px;
  font-weight: 700;
  color: var(--Text-Color, #0D0E10);
  font-family: "Figtree", sans-serif;
  line-height: 24px;
  padding: 0;
}

.faq-inner-section-area .faq-all-area .accordion .accordion-item .accordion-body {
  font-size: 16px;
  font-weight: 500;
  font-family: "Figtree", sans-serif;
  color: #676879;
  padding: 0;
  margin-top: 20px;
}

.faq-inner-section-area .faq-all-area .accordion .accordion-item .accordion-button::after {
  flex-shrink: 0;
  width: 16px;
  height: 2px;
  margin-left: auto;
  content: "";
  background-color: var(--white-100, #FFF);
  filter: brightness(0);
  z-index: 2;
}

.faq-inner-section-area .faq-all-area .accordion .accordion-item .accordion-button::before {
  flex-shrink: 0;
  width: 2px;
  height: 16px;
  margin-left: auto;
  content: "";
  background-color: var(--white-100, #FFF);
  filter: brightness(0);
  position: absolute;
  right: 7px;
  z-index: 3;
  display: none;
}

.faq-inner-section-area .faq-all-area .accordion .accordion-button.collapsed.accordion-button::before {
  display: block;
}

.faq5-section-area {
  background: #F8F9FA;
}

@media (max-width: 767px) {
  .faq5-section-area {
    padding: 50px 0 50px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .faq5-section-area {
    padding: 50px 0 50px;
  }
}

.faq5-section-area .faq3-widgets-area {
  padding: 0 0 0 50px;
}

@media (max-width: 767px) {
  .faq5-section-area .faq3-widgets-area {
    padding: 0;
    margin-top: 30px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .faq5-section-area .faq3-widgets-area {
    padding: 0;
    margin-top: 30px;
  }
}

.faq5-section-area .faq3-widgets-area .accordion {
  background: #F8F9FA;
}

.faq5-section-area .faq3-widgets-area .accordion .accordion-item {
  padding: 24px 0;
  border-top: 1px solid var(--Stroke-Color, rgba(86, 95, 118, 0.1));
  border-bottom: 0;
  background: #F8F9FA;
}

.faq5-section-area .faq3-widgets-area .accordion .accordion-item button {
  box-shadow: none;
  background: none;
  font-size: 20px;
  font-weight: 700;
  color: var(--Text-Color, #0D0E10);
  font-family: "Figtree", sans-serif;
  line-height: 24px;
  padding: 0;
}

.faq5-section-area .faq3-widgets-area .accordion .accordion-item .accordion-body {
  font-size: 16px;
  font-weight: 500;
  font-family: "Figtree", sans-serif;
  color: #676879;
  padding: 0;
  margin-top: 20px;
}

.faq5-section-area .faq3-widgets-area .accordion .accordion-item .accordion-button::after {
  flex-shrink: 0;
  width: 16px;
  height: 2px;
  margin-left: auto;
  content: "";
  background-color: var(--white-100, #FFF);
  filter: brightness(0);
  z-index: 2;
  position: absolute;
  right: 22px;
}

.faq5-section-area .faq3-widgets-area .accordion .accordion-item .accordion-button::before {
  flex-shrink: 0;
  width: 2px;
  height: 16px;
  margin-left: auto;
  content: "";
  background-color: var(--white-100, #FFF);
  filter: brightness(0);
  position: absolute;
  right: 29px;
  z-index: 3;
  display: none;
}

.faq5-section-area .faq3-widgets-area .accordion .accordion-button.collapsed.accordion-button::before {
  display: block;
}

/*============= FAQ CSS AREA ENDS ===============*/
/*============= ABOUT CSS AREA ===============*/
.about-welcome-section-area {
  padding: 170px 0 200px;
}

.about-welcome-section-area .about-welcome-header h1 {
  font-size: 60px;
  line-height: 60px;
}

@media (max-width: 767px) {
  .about-welcome-section-area .about-welcome-header h1 {
    font-size: 32px;
    line-height: 42px;
  }
}

.about-welcome-section-area .about-welcome-header a {
  font-family: "Figtree", sans-serif;
  font-size: 18px;
  font-weight: 500;
  color: var(--white-100, #FFF);
  display: inline-block;
}

.about-welcome-section-area .about-welcome-header a i {
  margin: 0 4px;
}

.about-welcome-section-area .about-welcome-header a span {
  font-weight: 700;
  color: var(--white-100, #FFF);
}

.about-welcome-section-area.about2 {
  padding: 130px 0 100px;
}

.about-section-area {
  padding: 100px 0 100px 0;
}

@media (max-width: 767px) {
  .about-section-area {
    padding: 50px 0 50px 0;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .about-section-area {
    padding: 50px 0 50px 0;
  }
}

@media (max-width: 767px) {
  .about-section-area .about-header-area {
    margin-bottom: 30px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .about-section-area .about-header-area {
    margin-bottom: 30px;
  }
}

.about-section-area .about-header-area span {
  background: #F8F4FF;
  padding: 8px 12px;
  line-height: 16px;
  border-radius: 32px;
  display: inline-block;
  font-size: 16px;
  font-weight: 500;
  color: #010ca8;
}

.about-section-area .about-header-area h2 {
  text-align: start;
}

.about-section-area .about-header-area p {
  font-family: "Figtree", sans-serif;
  font-weight: 500;
  color: #676879;
  font-size: 16px;
}

.about-section-area .images img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 4px;
}

/*============= ABOUT CSS AREA ENDS===============*/
/*============= CONTACT CSS AREA ===============*/
.about-welcome-section-area .contact-inner-header {
  padding: 0 50px 0 0;
}

@media (max-width: 767px) {
  .about-welcome-section-area .contact-inner-header {
    padding: 0;
    margin-bottom: 30px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .about-welcome-section-area .contact-inner-header {
    padding: 0;
    margin-bottom: 30px;
  }
}

.about-welcome-section-area .contact-inner-header p {
  color: var(--white-100, #FFF);
  opacity: 0.8;
  font-family: "Figtree", sans-serif;
  font-weight: 500;
  font-size: 16px;
  line-height: 26px;
}

.about-welcome-section-area .contact-inner-header h3 {
  font-family: "Figtree", sans-serif;
  font-size: 20px;
  font-weight: 700;
  color: var(--white-100, #FFF);
  line-height: 20px;
}

.about-welcome-section-area .contact-box-area .contact-boxs {
  background: var(--white-100, #FFF);
  padding: 16px 20px;
  position: relative;
  border-radius: 4px;
  transition: all 0.4s ease-in-out;
}

.about-welcome-section-area .contact-box-area .contact-boxs:hover {
  transform: translateY(-5px);
  transition: all 0.4s ease-in-out;
}

.about-welcome-section-area .contact-box-area .contact-boxs .img1 {
  height: 60px;
  width: 60px;
  text-align: center;
  line-height: 60px;
  display: inline-block;
  background: #F8F4FF;
  transition: all 0.4s ease-in-out;
  border-radius: 50%;
  position: absolute;
}

.about-welcome-section-area .contact-box-area .contact-boxs .content {
  padding-left: 80px;
  margin-top: 5px;
}

.about-welcome-section-area .contact-box-area .contact-boxs .content p {
  font-family: "Figtree", sans-serif;
  font-size: 20px;
  font-weight: 700;
  color: var(--Text-Color, #0D0E10);
}

.about-welcome-section-area .contact-box-area .contact-boxs .content a {
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-weight: 500;
  color: #676879;
  display: inline-block;
}

.about-welcome-section-area .conatact-header-boxarea {
  background: var(--white-100, #FFF);
  padding: 40px;
  border-radius: 4px;
}

.about-welcome-section-area .conatact-header-boxarea .input-area input {
  width: 100%;
  outline: none;
  border: 1px solid var(--Stroke-Color, rgba(86, 95, 118, 0.1));
  padding: 15px 13px;
  border-radius: 4px;
  height: 50px;
  font-family: "Figtree", sans-serif;
  font-size: 16px;
}

.about-welcome-section-area .conatact-header-boxarea .input-area textarea {
  width: 100%;
  outline: none;
  border: 1px solid var(--Stroke-Color, rgba(86, 95, 118, 0.1));
  padding: 15px 13px;
  border-radius: 4px;
  height: 125px;
  font-family: "Figtree", sans-serif;
  font-size: 16px;
}

.about-welcome-section-area .conatact-header-boxarea .div button {
  outline: none;
  border: none;
}

.map-section-area .mapouter .gmap_canvas {
  position: relative;
  top: 7px;
}

.map-section-area .mapouter .gmap_canvas iframe {
  width: 100%;
  height: 565px;
}

.about-welcome-section-area.login {
  padding: 100px 0 100px;
}

@media (max-width: 767px) {
  .about-welcome-section-area.login {
    padding: 100px 0 50px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .about-welcome-section-area.login {
    padding: 100px 0 50px;
  }
}

.about-welcome-section-area.login .logo4 {
  height: 80px;
  width: 265px;
}

.about-welcome-section-area.login .login-boxarea {
  background: var(--white-100, #FFF);
  padding: 50px;
  border-radius: 4px;
}

@media (max-width: 767px) {
  .about-welcome-section-area.login .login-boxarea {
    padding: 24px;
  }
}

.about-welcome-section-area.login .login-boxarea .icons {
  height: 100px;
  width: 100px;
  text-align: center;
  line-height: 100px;
  border-radius: 50%;
  background: #F8F4FF;
  transition: all 0.4s ease-in-out;
  margin: 0 auto;
}

.about-welcome-section-area.login .login-boxarea .input-area h4 {
  font-family: "Figtree", sans-serif;
  font-size: 20px;
  line-height: 20px;
  font-weight: 700;
  color: var(--Text-Color, #0D0E10);
}

.about-welcome-section-area.login .login-boxarea .input-area input {
  width: 100%;
  outline: none;
  border: none;
  background: #F8F4FF;
  padding: 20px;
  height: 60px;
  border-radius: 30px;
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  color: var(--Text-Color, #0D0E10);
  font-weight: 500;
}

.about-welcome-section-area.login .login-boxarea .input-area input::-moz-placeholder {
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-weight: 500;
  color: #676879;
}

.about-welcome-section-area.login .login-boxarea .input-area input::placeholder {
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-weight: 500;
  color: #676879;
}

.about-welcome-section-area.login .login-boxarea .input-area .header-btn2 {
  background: #010ca8;
  border: none;
  outline: none;
  width: 100%;
  padding: 22px;
  border-radius: 30px;
}

.about-welcome-section-area.login .login-boxarea .input-area .header-btn2::after {
  left: 50%;
}

.about-welcome-section-area.login .login-boxarea .input-area .header-btn2:hover {
  border-radius: 30px;
}

.about-welcome-section-area.login .login-boxarea .input-area .header-btn2:hover::after {
  left: 0;
  border-radius: 30px;
}

.about-welcome-section-area.login .login-boxarea .sign-text {
  display: flex;
  align-items: center;
  text-align: center;
  justify-content: center;
}

.about-welcome-section-area.login .login-boxarea .sign-text a {
  font-family: "Figtree", sans-serif;
  font-weight: 700;
  color: #010ca8;
  font-size: 16px;
  margin-left: 14px;
  display: inline-block;
  text-decoration: underline;
}

.about-welcome-section-area.login .login-boxarea .div a {
  font-family: "Figtree", sans-serif;
  font-weight: 700;
  color: #010ca8;
  font-size: 16px;
  margin-left: 14px;
  display: inline-block;
  text-decoration: underline;
  text-align: center;
}

.about-welcome-section-area.login .login-boxarea ul {
  display: flex;
  align-items: center;
}

.about-welcome-section-area.login .login-boxarea ul li p {
  margin: 0 10px;
}

.about-welcome-section-area.login .login-boxarea .btn-area .header-btn2 {
  display: block;
  width: 100%;
  background: #F8F4FF;
  font-family: "Figtree", sans-serif;
  color: #676879;
}

.about-welcome-section-area.login .login-boxarea .btn-area .header-btn2::after {
  left: 50%;
}

.about-welcome-section-area.login .login-boxarea .btn-area .header-btn2:hover::after {
  display: none;
}

.about-welcome-section-area.login .login-boxarea .btn-area .header-btn2 img {
  margin: 0 12px 0 0;
}

/*============= CONTACT CSS AREA ENDS ===============*/
/*============= RTL CSS AREA ===============*/
@media only screen and (min-width: 768px) and (max-width: 991px) {

  .rtl-homepage,
  html {
    overflow-x: hidden !important;
  }
}

.rtl-homepage .preloader {
  margin-left: 25px;
  margin-top: -25px;
}

.rtl-homepage .header-area.homepage3 {
  position: absolute;
  width: 100%;
  z-index: 2;
}

.rtl-homepage .header-area.homepage3 .navbar {
  display: block;
}

.rtl-homepage .header-area.homepage3 .header-elements {
  display: flex;
  align-self: center;
  justify-content: space-between;
  transition: all 0.4s ease-in-out;
  padding: 24px 0 0 0;
}

.rtl-homepage .header-area.homepage3 .header-elements .site-logo {
  margin-top: 5px;
}

.rtl-homepage .header-area.homepage3 .header-elements .main-menu {
  display: flex;
  align-items: center;
  padding: 12px 16px;
  transition: all 0.4s ease-in-out;
  background: #EDE9FD;
  border-radius: 4px;
}

.rtl-homepage .header-area.homepage3 .header-elements .main-menu .nav-item .nav-link.active {
  background: none;
  color: #4B24EE;
}

.main-menu .nav-item:hover {
  color: #fff !important;
}

.rtl-homepage .header-area.homepage3 .header-elements .main-menu ul li {
  display: inline-block;
  position: relative;
}

.rtl-homepage .header-area.homepage3 .header-elements .main-menu ul li:hover>a {
  color: #4B24EE;
  transition: all 0.4s ease-in-out;
}

.rtl-homepage .header-area.homepage3 .header-elements .main-menu ul li:hover>a svg {
  padding: 0 !important;
}

.rtl-homepage .header-area.homepage3 .header-elements .main-menu ul li:hover ul.dropdown-padding {
  visibility: visible;
  transition: all 0.5s ease-in-out;
  opacity: 1;
  z-index: 9;
  top: 50px;
  position: absolute;
}

.rtl-homepage .header-area.homepage3 .header-elements .main-menu ul li a {
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 16px;
  font-weight: 500;
  color: var(--Text-Color, #0D0E10);
  display: inline-block;
  transition: all 0.4s ease-in-out;
  padding: 0 10px;
}

.rtl-homepage .header-area.homepage3 .header-elements .main-menu ul li ul.dropdown-padding {
  visibility: hidden;
  opacity: 0;
  box-shadow: rgba(0, 0, 0, 0.2) 0px 20px 30px;
  position: absolute;
  background: var(--white-100, #FFF);
  top: 100px;
  width: 220px;
  z-index: 1;
  transition: all 0.4s ease-in-out;
  border-radius: 5px;
  padding: 15px;
}

.rtl-homepage .header-area.homepage3 .header-elements .main-menu ul li ul.dropdown-padding li.main-small-menu {
  position: relative;
}

.rtl-homepage .header-area.homepage3 .header-elements .main-menu ul li ul.dropdown-padding li.main-small-menu:hover>a {
  color: #4B24EE;
  transition: all 0.4s ease-in-out;
  padding-right: 25px;
}

.rtl-homepage .header-area.homepage3 .header-elements .main-menu ul li ul.dropdown-padding li.main-small-menu:hover>a::after {
  color: #FC4B3E;
  transition: all 0.4s ease-in-out;
  visibility: visible;
  opacity: 1;
}

.rtl-homepage .header-area.homepage3 .header-elements .main-menu ul li ul.dropdown-padding li.main-small-menu a {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.rtl-homepage .header-area.homepage3 .header-elements .main-menu ul li ul.dropdown-padding li.main-small-menu ul.small-dropdown {
  visibility: hidden;
  opacity: 0;
  box-shadow: rgba(0, 0, 0, 0.2) 0px 20px 30px;
  background: var(--white-100, #FFF);
  position: absolute;
  top: 70px;
  width: 220px;
  z-index: 1;
  left: -225px;
  transition: all 0.4s ease-in-out;
  border-radius: 5px;
  padding: 15px;
}

.rtl-homepage .header-area.homepage3 .header-elements .main-menu ul li ul.dropdown-padding li.main-small-menu:hover ul.small-dropdown {
  visibility: visible;
  transition: all 0.5s ease-in-out;
  opacity: 1;
  z-index: 9;
  top: 0;
  position: absolute;
}

.rtl-homepage .header-area.homepage3 .header-elements .main-menu ul li ul.dropdown-padding li {
  display: block;
}

.rtl-homepage .header-area.homepage3 .header-elements .main-menu ul li ul.dropdown-padding li a {
  font-family: "Figtree", sans-serif !important;
  ;
  font-weight: 500;
  color: var(--Text-Color, #0D0E10);
  padding: 8px;
  display: inline-block;
  position: relative;
  z-index: 1;
  border-radius: 4px;
  transition: all 0.4s ease-in-out;
}

.rtl-homepage .header-area.homepage3 .header-elements .main-menu ul li ul.dropdown-padding li a::after {
  position: absolute;
  content: "";
  height: 2px;
  width: 10px;
  transition: all 0.4s ease-in-out;
  z-index: -1;
  background: #4B24EE;
  right: 10px;
  left: inherit;
  top: 22px;
  border-radius: 4px;
  display: inline-block;
  visibility: hidden;
  opacity: 0;
  transition: all 0.4s ease-in-out;
}

.rtl-homepage .header-area.homepage3 .header-elements .main-menu ul li ul.dropdown-padding li a:hover {
  transition: all 0.4s ease-in-out;
  color: #4B24EE;
  padding-right: 25px;
}

.rtl-homepage .header-area.homepage3 .header-elements .main-menu ul li ul.dropdown-padding li a:hover::after {
  transition: all 0.4s ease-in-out;
  border-radius: 4px;
  visibility: visible;
  transition: all 0.4s ease-in-out;
  opacity: 1;
}

.rtl-homepage .header-area.homepage3 .header-elements .header-padding ul li a {
  padding: 0 14px;
}

.rtl-homepage .mobile-sidebar.mobile-sidebar3 .menu-close {
  right: inherit;
  left: 20px;
}

.rtl-homepage .mobile-sidebar.mobile-sidebar3 .footer4-contact-info .contact-info-single .contact-info-icon svg {
  margin: 0 0 0 6px;
}

.rtl-homepage .mobile-sidebar.mobile-sidebar3 .footer4-contact-info .contact-info-single .contact-info-text {
  margin-right: 10px;
}

.rtl-homepage .mobile-sidebar.mobile-sidebar3 .mobile-nav.mobile-nav2 ul li span::after {
  left: 8px;
  right: inherit;
}

.rtl-homepage .mobile-sidebar.mobile-sidebar3 .mobile-nav.mobile-nav2 ul li span::before {
  left: 0;
  right: inherit;
}

.rtl-homepage .header-area.homepage3.sticky {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  transform: translate3d(0, 0, 0);
  z-index: 111;
  animation-name: fade-in-down;
  animation-fill-mode: forwards;
  background-color: var(--white-100, #FFF);
  box-shadow: 0px 4px 30px 0px rgba(0, 0, 0, 0.08);
  transition: all 0.4s ease-in-out;
  z-index: 99;
}

.rtl-homepage .header-area.homepage3.sticky .header-elements {
  margin-top: 0;
  transition: all 0.4s ease-in-out;
  border: none;
  background: none;
  padding: 14px 0;
}

.rtl-homepage .header-area.homepage3.sticky .header-elements .main-menu {
  background: none;
  transition: all 0.4s ease-in-out;
}

.rtl-homepage .welcome3-section-area .welcome3-header .header-btn5:hover::after {
  right: 0;
  left: inherit;
}

.rtl-homepage .tools-section-area .tabs3-tools-area .tab-content .tab-pane .main-content-area .tabs-header {
  padding: 0 0 0 30px;
}

.rtl-homepage .tools-section-area .tabs3-tools-area .tab-content .tab-pane .main-content-area .tabs-header .list img {
  margin: 0 0 0 30px;
}

.rtl-homepage .tools-section-area .tabs3-tools-area .tab-content .tab-pane .main-content-area .tabs-header .header-btn5:hover::after {
  right: 0;
  left: inherit;
}

.rtl-homepage .tools-section-area .tabs3-tools-area .tab-content .tab-pane .main-content-area .tabs-images .tabs-img2 {
  left: 0;
  right: inherit;
}

.rtl-homepage .features3-section-area .features3-images .img2 img {
  left: -100px;
  right: inherit;
}

@media (max-width: 767px) {
  .rtl-homepage .features3-section-area .features3-images .img2 img {
    left: 0;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .rtl-homepage .features3-section-area .features3-images .img2 img {
    left: 0;
  }
}

@media (max-width: 767px) {
  .rtl-homepage .features3-section-area .features-content-box {
    margin-bottom: 30px;
  }
}

.rtl-homepage .features3-section-area .features-content-box .content {
  padding-left: 0;
  padding-right: 50px;
}

.rtl-homepage .step-section-area .step-author-area {
  margin: 0;
}

.rtl-homepage .step-section-area .step-author-area::after {
  right: 35px;
  left: inherit;
}

.rtl-homepage .step-section-area .step-author-area .content {
  margin-right: 32px;
}

.rtl-homepage .step-section-area .step-header-area .header-btn5:hover::after {
  right: 0;
}

.rtl-homepage .testimonial3-section-area .testimonial3-slider-area-rtl .testimonial3-boxarea {
  border: 1px solid var(--Stroke-Color, rgba(86, 95, 118, 0.1));
  padding: 20px;
  transition: all 0.4s ease-in-out;
  border-radius: 4px;
}

.rtl-homepage .testimonial3-section-area .testimonial3-slider-area-rtl .testimonial3-boxarea:hover {
  background: var(--white-100, #FFF);
  transition: all 0.4s ease-in-out;
  border: 1px solid var(--white-100, #FFF);
  box-shadow: 0px 4px 50px 0px rgba(0, 0, 0, 0.08);
  border-radius: 4px;
}

.rtl-homepage .testimonial3-section-area .testimonial3-slider-area-rtl .testimonial3-boxarea:hover .img2 p {
  color: var(--Text-Color, #0D0E10);
  transition: all 0.4s ease-in-out;
}

.rtl-homepage .testimonial3-section-area .testimonial3-slider-area-rtl .testimonial3-boxarea .images-content {
  display: flex;
  align-items: center;
}

.rtl-homepage .testimonial3-section-area .testimonial3-slider-area-rtl .testimonial3-boxarea .images-content img {
  height: 50px;
  width: 50px;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 50%;
}

.rtl-homepage .testimonial3-section-area .testimonial3-slider-area-rtl .testimonial3-boxarea .images-content .content {
  margin-right: 12px;
}

.rtl-homepage .testimonial3-section-area .testimonial3-slider-area-rtl .testimonial3-boxarea .images-content .content a {
  font-family: "Figtree", sans-serif;
  font-size: 20px;
  font-weight: 700;
  color: var(--Text-Color, #0D0E10);
  line-height: 20px;
  display: inline-block;
  margin-bottom: 8px;
  transition: all 0.4s ease-in-out;
}

.rtl-homepage .testimonial3-section-area .testimonial3-slider-area-rtl .testimonial3-boxarea .images-content .content p {
  font-size: 16px;
  font-weight: 500;
  color: #676879;
  font-family: "Figtree", sans-serif;
  transition: all 0.4s ease-in-out;
}

.rtl-homepage .testimonial3-section-area .testimonial3-slider-area-rtl .testimonial3-boxarea .img2 img {
  height: 40px;
  width: 40px;
  -o-object-fit: contain;
  object-fit: contain;
}

.rtl-homepage .testimonial3-section-area .testimonial3-slider-area-rtl .testimonial3-boxarea .img2 p {
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-weight: 500;
  color: #676879;
  line-height: 28px;
  transition: all 0.4s ease-in-out;
}

.rtl-homepage .testimonial3-section-area .testimonial3-slider-area-rtl .owl-dots {
  text-align: center;
  margin-top: 30px;
}

.rtl-homepage .testimonial3-section-area .testimonial3-slider-area-rtl .owl-dots button {
  position: relative;
  height: 16px;
  width: 16px;
  border-radius: 50%;
  background: #C6B9F9;
  margin: 0 16px 0 0;
}

.rtl-homepage .testimonial3-section-area .testimonial3-slider-area-rtl .owl-dots button::after {
  position: absolute;
  content: "";
  height: 24px;
  width: 24px;
  border-radius: 50%;
  border: 1px solid #4B24EE;
  left: -5px;
  top: -5px;
  display: none;
}

.rtl-homepage .testimonial3-section-area .testimonial3-slider-area-rtl .owl-dots button.active {
  background: #4B24EE;
  height: 14px;
  width: 14px;
}

.rtl-homepage .testimonial3-section-area .testimonial3-slider-area-rtl .owl-dots button.active::after {
  display: block;
}

.rtl-homepage .faq3-section-area .faq3-header .header-btn5:hover::after {
  right: 0;
  left: inherit;
}

.rtl-homepage .faq3-section-area .faq3-widgets-area {
  padding: 0 50px 0 0;
}

@media (max-width: 767px) {
  .rtl-homepage .faq3-section-area .faq3-widgets-area {
    padding: 0;
    margin-bottom: 30px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .rtl-homepage .faq3-section-area .faq3-widgets-area {
    padding: 0;
    margin-bottom: 30px;
  }
}

.rtl-homepage .faq3-section-area .faq3-widgets-area .accordion .accordion-item button::after {
  right: inherit;
  left: 0;
}

.rtl-homepage .faq3-section-area .faq3-widgets-area .accordion .accordion-item button::before {
  right: inherit;
  left: 6px;
}

.rtl-homepage .cta3-section-area .cta3-header-area .header-btn5:hover::after {
  left: inherit;
  right: 0;
}

.rtl-homepage .pricing-paln-section-area .pricing-plans .tab-content .price-box .header-btn5::after {
  display: none;
}

.rtl-homepage .pricing-paln-section-area .pricing-plans .tab-content .price-box .hadding .price-list ul li img {
  margin: 0 0 0 6px;
}

.video-box {
  /* background:#fff; */
  padding: 0px 0px;
  border-radius: 100px;
  /* box-shadow:0 5px 20px rgba(0,0,0,0.08); */
  margin-bottom: 30px;
}

.ratio>* {
  border-radius: 25px !important;
}

/*============= RTL CSS AREA ENDS ===============*/
/*# sourceMappingURL=master.css.map */
/* custom css for form  */
/* Modal container */
.demo-modal-design {
  background: #010ca8;
  border-radius: 18px;
  padding: 20px;
  color: #fff;
}

/* Header */
.custom-modal-header {
  border: none;
  position: relative;
}

.custom-modal-header .modal-title {
  font-size: 26px;
  font-weight: 700;
  letter-spacing: .5px;
}

.close-btn {
  position: absolute;
  right: 20px;
  top: 15px;
}

/* Main title */
.modal-heading {
  font-size: 32px;
  font-weight: 700;
  text-align: center;
  margin-bottom: 12px;
}

/* Subtitle */
.modal-subtitle {
  text-align: center;
  font-size: 17px;
  color: #e2e8f0;
  margin-bottom: 40px;
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
}

/* Labels */
.demo-modal-design label {
  font-size: 14px;
  margin-bottom: 8px;
  font-weight: 500;
}

/* Inputs */
.demo-modal-design .form-control {
  border-radius: 12px;
  border: none;
  padding: 16px;
  font-size: 15px;
}

.demo-modal-design .form-control:focus {
  box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.25);
}

/* Button */
.demo-submit-btn {
  width: 150px;
  padding: 16px;
  border: none;
  border-radius: 12px;
  font-weight: 600;
  font-size: 18px;
  margin-top: 15px;
  background: #4550edb0;
  color: white;
  transition: all .3s ease;
}

.demo-submit-btn:hover {
  background: linear-gradient(90deg, #1d4ed8, #1e40af);
  transform: translateY(-2px);
}

.demo-submit-btn1 {
  width: 200px;
  padding: 16px;
  border: none;
  border-radius: 12px;
  font-weight: 600;
  font-size: 18px;
  margin-top: 15px;
  background: #4550edb0;
  color: white;
  transition: all .3s ease;
}

.demo-submit-btn1:hover {
  background: linear-gradient(90deg, #1d4ed8, #1e40af);
  transform: translateY(-2px);
}

/* Responsive */
@media (max-width:768px) {

  .demo-modal-design {
    padding: 30px;
  }

  .modal-heading {
    font-size: 24px;
  }

  .modal-subtitle {
    font-size: 15px;
  }

}

/* BENEFITS SECTION */

.benefits-section-area {
  background: #f8f9fc;
  padding: 100px 0;
}

.benefit-card {
  background: #fff;
  padding: 30px;
  border-radius: 10px;
  margin-bottom: 25px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
  transition: all .3s ease;
  height: 100%;
}

.benefit-card h4 {
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 10px;
  color: #111;
}

.benefit-card p {
  font-size: 14px;
  color: #3b3e43;
  margin-bottom: 10px;
}

.benefit-card span {
  font-size: 13px;
  color: #4A6CF7;
  font-weight: 500;
}

.benefit-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.12);
}

@media (max-width:991px) {

  .benefits-section-area {
    padding: 70px 0;
  }

  .benefit-card {
    margin: 15px;
    padding: 25px;
  }

  .heading4 h2 {
    font-size: 28px;
  }

}

@media (max-width:576px) {

  .heading4 h2 {
    font-size: 24px;
  }

  .benefit-card h4 {
    font-size: 16px;
  }

}

/* BENEFITS TABLE */

.obligo-benefits-table {
  background: #fff;
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
}

.obligo-benefits-table thead {
  background: #6c3df4;
  color: #fff;
}

.obligo-benefits-table thead th {
  padding: 18px;
  font-weight: 600;
  border: none;
}

.obligo-benefits-table tbody td {
  padding: 16px;
  border-bottom: 1px solid #eee;
  font-size: 14px;
}

.obligo-benefits-table tbody tr:hover {
  background: #f9f9ff;
  transition: .3s;
}

.benefits-table-section {
  background: #f8f9fc;
  /* padding:100px 0; */
}

@media (max-width:768px) {

  .obligo-benefits-table thead {
    display: none;
  }

  .obligo-benefits-table tr {
    display: block;
    margin-bottom: 15px;
    border: 1px solid #eee;
    border-radius: 8px;
  }

  .obligo-benefits-table td {
    display: block;
    text-align: left;
    padding: 12px;
  }

}

.suite-features {
  margin-top: 40px;
}

.suite-feature-card {
  background: #ffffff;
  padding: 25px;
  border-radius: 12px;
  margin-bottom: 25px;
  transition: all 0.35s ease;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.05);
  height: 100%;
}

.suite-feature-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.12);
  border-left: 4px solid #6c3cff;
}

.suite-feature-card h4 {
  font-size: 20px;
  font-weight: 600;
  margin: 10px 0;
}

.suite-feature-card p {
  font-size: 14px;
  color: #555;
}

.suite-icon img {
  width: 40px;
  margin-bottom: 8px;
}

.suite-feature-card {
  background: #ffffff;
  border-radius: 12px;
  padding: 20px;
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.06);
  transition: all .3s ease;
  height: 100%;
}

.suite-feature-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 15px 40px rgba(0, 0, 0, 0.12);
}

.suite-feature-card h4 {
  font-size: 18px;
  font-weight: 600;
  margin-top: 10px;
}

.suite-feature-card p {
  font-size: 14px;
  color: #666;
}

.suite-icon img {
  width: 40px;
}

.mobile-sidebar {
  position: fixed;
  left: -100%;
  top: 0;
  width: 280px;
  height: 100%;
  background: #fff;
  transition: 0.3s;
  z-index: 9999;
}

.mobile-sidebar.active {
  left: 0;
}

.benefits-section {
  padding: 20px 0;
  background: #f8f9ff;
  font-family: "Figtree", sans-serif;
}

.section-title {
  text-align: center;
  margin-bottom: 10px;
}

.section-title h2 {
  font-size: 36px;
  font-weight: 700;
  color: #2d2d2d;
}

.section-title p {
  color: #666;
  max-width: 650px;
  margin: auto;
}

.benefits-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 25px;
}

.benefit-card {
  background: #fff;
  padding: 30px 10px;
  border-radius: 12px;
  text-align: center;
  transition: 0.3s;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08);
}

.benefit-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.12);
}

.icon {
  font-size: 35px;
  margin-bottom: 15px;
}

.benefit-card h3 {
  font-size: 20px;
  margin-bottom: 10px;
  color: #333;
}

.benefit-card p {
  font-size: 15px;
  color: #676879;
  line-height: 1.6;
}

.mobile-sidebar {
  position: fixed;
  top: 0;
  left: -100%;
  width: 280px;
  height: 100%;
  background: #fff;
  z-index: 9999;
  transition: 0.4s;
}

.mobile-sidebar.active {
  left: 0;
}

.mobile-sidebar.mobile-menu-active {
  left: 0;
  visibility: visible;
  opacity: 1;
  transition: all .3s;
  background-color: #343ecc;
}

.custm_Size {
  width: 180px;
}

/* Default state */
.main-menu .nav-link {
  color: #000;
  position: relative;
  transition: 0.3s;
}

/* Underline effect (hidden by default) */
.main-menu .nav-link::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -5px;
  width: 0%;
  height: 2px;
  background: #fff;
  transition: 0.3s;
}

/* Hover effect */
.main-menu .nav-link:hover {
  color: #fff !important;
}

/* Show underline on hover */
.main-menu .nav-link:hover::after {
  width: 100%;
}

.custm_btn {
  display: inline-block;
  margin-top: 25px;
  padding: 14px 30px;
  font-size: 16px;
  font-weight: 600;
  color: #1e1b4b;
  background: #fff;
  border-radius: 10px;
  text-decoration: none;
  transition: all 0.3s ease;
}

.custm_btn:hover {
  background: #e0e7ff;
  transform: translateY(-3px);
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
  color: #1e1b4b;
}

.custm_btn_secondary {
  display: inline-block;
  margin-top: 25px;
  padding: 14px 30px;
  font-size: 16px;
  font-weight: 600;
  color: #fff !important;
  background: rgba(255, 255, 255, 0.08);
  border: 2px solid rgba(255, 255, 255, 0.7);
  border-radius: 10px;
  text-decoration: none;
  transition: all 0.3s ease;
  backdrop-filter: blur(5px);
}

.custm_btn_secondary:hover {
  background: #fff;
  border-color: #fff;
  transform: translateY(-3px);
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.25);
  color: #1e1b4b !important;
}

.header-elements1 {
  animation: float 4s ease-in-out infinite;
}

@keyframes float {

  0%,
  100% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(-10px);
  }
}

.welcome2-header span {
  background: rgba(255, 255, 255, 0.1);
  padding: 6px 14px;
  border-radius: 20px;
  font-size: 14px;
  color: #c7d2fe;
  display: inline-block;
  margin-bottom: 20px;
}

.welcome2-header h1 {
  font-size: 45px;
  font-weight: 700;
  color: #fff;
  line-height: 1.2;
  margin-bottom: 20px;
}

.welcome2-header p {
  color: #cbd5f1;
  font-size: 16px;
  line-height: 1.7;
  max-width: 90%;
}

.welcome2-section-area {
  background: linear-gradient(135deg, #010db0 0%, #010173 100%);
  padding: 120px 0;
  position: relative;
  overflow: hidden;
}

.header-images-area {
  position: relative;
  text-align: center;
}

.header-elements1 img {
  width: 100%;
  /* max-width: 520px; */
  border-radius: 25px;
  /* box-shadow: 0 25px 60px rgba(0, 0, 0, 0.4); */
  /* border: 4px solid rgba(255,255,255,0.1);  */
  backdrop-filter: blur(10px);
  transition: transform 0.4s ease;
}

.header-elements1 img:hover {
  transform: translateY(-10px) scale(1.02);
}

.header-images-area::before {
  content: "";
  position: absolute;
  width: 300px;
  height: 300px;
  background: radial-gradient(circle, rgba(99, 102, 241, 0.6), transparent 70%);
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  filter: blur(80px);
  z-index: 0;
}

.header-elements1 {
  position: relative;
  z-index: 1;
}

.header-elements1 {
  animation: float 4s ease-in-out infinite;
}

@keyframes float {

  0%,
  100% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(-10px);
  }
}

.welcome2-section-area {
  padding-bottom: 50px;
}

/* new section */
/* Redesigned Premium Feature Section */
.feature-section {
  padding: 50px 0 !important;
  background-color: #ffffff !important;
  background-image: radial-gradient(rgba(37, 99, 235, 0.08) 1.5px, transparent 1.5px) !important;
  background-size: 28px 28px !important;
  position: relative !important;
  overflow: hidden !important;
}

.feature-section::before {
  content: "" !important;
  position: absolute !important;
  top: -10% !important;
  right: -10% !important;
  width: 450px !important;
  height: 450px !important;
  background: radial-gradient(circle, rgba(37, 99, 235, 0.06) 0%, transparent 70%) !important;
  pointer-events: none !important;
  z-index: 1 !important;
}

.feature-section::after {
  content: "" !important;
  position: absolute !important;
  bottom: -10% !important;
  left: -10% !important;
  width: 450px !important;
  height: 450px !important;
  background: radial-gradient(circle, rgba(147, 51, 234, 0.04) 0%, transparent 70%) !important;
  pointer-events: none !important;
  z-index: 1 !important;
}

.feature-image-wrapper {
  position: relative !important;
  background: #ffffff !important;
  /* padding: 10px !important;
  border-radius: 20px !important;
  border: 1px solid rgba(226, 232, 240, 0.8) !important;
  box-shadow: 0 25px 50px rgba(15, 23, 42, 0.06) !important; */
  transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1) !important;
  z-index: 2 !important;
}

/* 
.feature-image-wrapper:hover {
  transform: translateY(-5px) scale(1.005) !important;
  box-shadow: 0 35px 70px rgba(15, 23, 42, 0.1) !important;
} */

.feature-image-wrapper img {
  border-radius: 14px !important;
  width: 100% !important;
  height: auto !important;
  display: block !important;
}

/* Feature Content Styling */
.feature-badge-tag {
  display: inline-block !important;
  padding: 6px 14px !important;
  background: rgba(37, 99, 235, 0.08) !important;
  color: #2563eb !important;
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: 0.05em !important;
  border-radius: 9999px !important;
  margin-bottom: 20px !important;
}

.feature-title {
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 40px !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  color: #0f172a !important;
  margin-bottom: 20px !important;
  letter-spacing: -0.02em !important;
  text-transform: none !important;
}

.feature-text-gradient {
  background: linear-gradient(135deg, #2563eb 0%, #010ca8 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
  display: inline !important;
}

.feature-description {
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 16px !important;
  font-weight: 400 !important;
  color: #475569 !important;
  line-height: 1.7 !important;
  margin-bottom: 30px !important;
}

/* Custom curved SVG background positioning */
.feature-bg-curves {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  pointer-events: none !important;
  z-index: 1 !important;
}

.feature-bg-curves svg {
  width: 100% !important;
  height: 100% !important;
}

/* Redesigned micro-cards grid */
.feature-cards-grid {
  display: flex !important;
  flex-direction: column !important;
  gap: 16px !important;
  margin-top: 30px !important;
}

.feature-card-item {
  display: flex !important;
  align-items: center !important;
  gap: 18px !important;
  padding: 16px 20px !important;
  background: rgba(255, 255, 255, 0.7) !important;
  backdrop-filter: blur(10px) !important;
  border: 1px solid rgba(226, 232, 240, 0.8) !important;
  border-radius: 16px !important;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.02) !important;
}

/* .feature-card-item:hover {
  transform: translateY(-2px) !important;
  background: #ffffff !important;
  border-color: rgba(37, 99, 235, 0.3) !important;
  box-shadow: 0 12px 24px rgba(37, 99, 235, 0.08) !important;
} */

.card-icon-box {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 44px !important;
  height: 44px !important;
  border-radius: 12px !important;
  flex-shrink: 0 !important;
  transition: all 0.3s ease !important;
}

.feature-card-item:hover .card-icon-box {
  transform: scale(1.08) !important;
}

.card-icon-box.blue-theme {
  background: rgba(37, 99, 235, 0.08) !important;
  color: #2563eb !important;
}

.card-icon-box.cyan-theme {
  background: rgba(6, 182, 212, 0.08) !important;
  color: #0891b2 !important;
}

.card-icon-box.purple-theme {
  background: rgba(147, 51, 234, 0.08) !important;
  color: #9333ea !important;
}

.card-info {
  display: flex !important;
  flex-direction: column !important;
  text-align: left !important;
}

.card-info h4 {
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 16px !important;
  font-weight: 750 !important;
  color: #0f172a !important;
  margin: 0 0 4px 0 !important;
}

.card-info p {
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 14px !important;
  font-weight: 400 !important;
  color: #64748b !important;
  margin: 0 !important;
  line-height: 1.45 !important;
}

/* Staggered Slide In Animations */
@keyframes slideInLeft {
  from {
    opacity: 0;
    transform: translateX(-30px);
  }

  to {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes slideInRight {
  from {
    opacity: 0;
    transform: translateX(30px);
  }

  to {
    opacity: 1;
    transform: translateX(0);
  }
}

.animate-slide-in-left {
  opacity: 0;
  animation: slideInLeft 0.8s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

.animate-slide-in-right {
  opacity: 0;
  animation: slideInRight 0.8s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

.badge-delay-1 {
  animation-delay: 0.1s;
}

.badge-delay-2 {
  animation-delay: 0.25s;
}

.badge-delay-3 {
  animation-delay: 0.4s;
}

.badge-delay-4 {
  animation-delay: 0.55s;
}

@media (max-width: 991px) {
  .feature-section {
    padding: 60px 0 !important;
  }

  .feature-title {
    font-size: 30px !important;
  }
}

/* Redesigned Premium About Modern Section with Left Content & Right Image/Cards Stack */
.about-modern {
  padding: 50px 0 !important;
  background-color: #f8fafc !important;
  position: relative !important;
  overflow: hidden !important;
}

/* Unique Tech-Mesh and Radial Lights in Background */
.about-bg-elements {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  pointer-events: none !important;
  z-index: 1 !important;
  overflow: hidden !important;
}

.about-grid-overlay {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background-image: radial-gradient(rgba(37, 99, 235, 0.04) 1.5px, transparent 1.5px) !important;
  background-size: 24px 24px !important;
}

.about-glow-orb-1 {
  position: absolute !important;
  top: -10% !important;
  left: -10% !important;
  width: 600px !important;
  height: 600px !important;
  background: radial-gradient(circle, rgba(37, 99, 235, 0.08) 0%, transparent 70%) !important;
  filter: blur(40px) !important;
}

.about-glow-orb-2 {
  position: absolute !important;
  bottom: -15% !important;
  right: -10% !important;
  width: 500px !important;
  height: 500px !important;
  background: radial-gradient(circle, rgba(147, 51, 234, 0.06) 0%, transparent 70%) !important;
  filter: blur(40px) !important;
}

.about-bg-curves {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  z-index: 1 !important;
  pointer-events: none !important;
}

.about-bg-curves svg {
  width: 100% !important;
  height: 100% !important;
  display: block !important;
}

/* Left Content Area */
.about-content-block {
  text-align: left !important;
}

.about-badge-tag {
  display: inline-block !important;
  padding: 6px 14px !important;
  background: rgba(37, 99, 235, 0.08) !important;
  color: #2563eb !important;
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: 0.05em !important;
  border-radius: 9999px !important;
  margin-bottom: 20px !important;
}

.about-title {
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 40px !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  color: #0f172a !important;
  margin-bottom: 20px !important;
  letter-spacing: -0.02em !important;
}

.about-text-gradient {
  background: linear-gradient(135deg, #2563eb 0%, #010ca8 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
  display: inline !important;
}

.about-description {
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 16px !important;
  font-weight: 400 !important;
  color: #475569 !important;
  line-height: 1.7 !important;
  margin-bottom: 0 !important;
}

/* Right Side Showcase Browser Container */
.about-dashboard-frame {
  position: relative !important;
  background: #ffffff !important;
  border: 1px solid rgba(226, 232, 240, 0.8) !important;
  border-radius: 20px !important;
  padding: 35px 20px 20px 20px !important;
  box-shadow: 0 30px 60px rgba(15, 23, 42, 0.08), 0 0 40px rgba(37, 99, 235, 0.04) !important;
  transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1) !important;
  z-index: 2 !important;
}

.about-dashboard-frame:hover {
  transform: translateY(-6px) scale(1.01) !important;
  border-color: rgba(37, 99, 235, 0.3) !important;
  box-shadow: 0 40px 80px rgba(15, 23, 42, 0.12), 0 0 60px rgba(37, 99, 235, 0.08) !important;
}

.frame-ui-dots {
  position: absolute !important;
  top: 14px !important;
  left: 20px !important;
  display: flex !important;
  gap: 6px !important;
}

.frame-ui-dots span {
  width: 8px !important;
  height: 8px !important;
  border-radius: 50% !important;
  display: inline-block !important;
}

.dot-red {
  background-color: #ef4444 !important;
}

.dot-yellow {
  background-color: #f59e0b !important;
}

.dot-green {
  background-color: #10b981 !important;
}

.about-image-wrapper {
  overflow: hidden !important;
  border-radius: 12px !important;
  background: #f8fafc !important;
  border: 1px solid rgba(226, 232, 240, 0.5) !important;
}

.about-showcase-img {
  width: 100% !important;
  height: auto !important;
  display: block !important;
  transition: transform 0.6s ease !important;
}

.about-dashboard-frame:hover .about-showcase-img {
  transform: scale(1.02) !important;
}

/* Right Side Feature Cards Stack */
.about-feature-cards-stack {
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
}

.about-mini-card {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 12px 14px !important;
  background: #ffffff !important;
  border: 1px solid rgba(226, 232, 240, 0.8) !important;
  border-radius: 14px !important;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.02) !important;
  z-index: 2 !important;
}

.about-mini-card:hover {
  transform: translateX(4px) !important;
  border-color: rgba(37, 99, 235, 0.25) !important;
  box-shadow: 0 8px 16px rgba(37, 99, 235, 0.06) !important;
}

.about-mini-card .card-icon {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 36px !important;
  height: 36px !important;
  border-radius: 10px !important;
  flex-shrink: 0 !important;
  transition: transform 0.3s ease !important;
}

.about-mini-card .card-icon img {
  width: 16px !important;
  height: 16px !important;
}

.about-mini-card:hover .card-icon {
  transform: scale(1.08) rotate(3deg) !important;
}

.about-mini-card .card-icon.blue-theme {
  background: rgba(37, 99, 235, 0.08) !important;
}

.about-mini-card .card-icon.cyan-theme {
  background: rgba(6, 182, 212, 0.08) !important;
}

.about-mini-card .card-icon.purple-theme {
  background: rgba(147, 51, 234, 0.08) !important;
}

.about-mini-card .card-icon.orange-theme {
  background: rgba(249, 115, 22, 0.08) !important;
}

.card-details {
  text-align: left !important;
}

.card-details h4 {
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 14.5px !important;
  font-weight: 750 !important;
  color: #0f172a !important;
  margin: 0 0 2px 0 !important;
}

.card-details p {
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 14px !important;
  font-weight: 400 !important;
  color: #64748b !important;
  margin: 0 !important;
  line-height: 1.45 !important;
}

@media (max-width: 991px) {
  .about-modern {
    padding: 60px 0 !important;
  }

  .about-title {
    font-size: 30px !important;
  }
}

/* Premium Alternating Features Redesign */
.modern-feature-section {
  position: relative !important;
  padding: 50px 0 !important;
  padding-top: 0px !important;
  background-color: #ffffff !important;
  overflow: hidden !important;
}

.modern-feature-section.alt {
  background-color: #f8fafc !important;
  /* Alternating background color */
}

/* Unique SVG Curves Container for each feature section */
.feature-section-bg {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  z-index: 1 !important;
  pointer-events: none !important;
}

.feature-section-bg svg {
  width: 100% !important;
  height: 100% !important;
  display: block !important;
}

/* Feature Content Styling */
.feature-content-block {
  position: relative !important;
  z-index: 2 !important;
  text-align: left !important;
}

.feature-badge-tag {
  display: inline-block !important;
  padding: 6px 14px !important;
  background: rgba(37, 99, 235, 0.08) !important;
  color: #2563eb !important;
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: 0.05em !important;
  border-radius: 9999px !important;
  margin-bottom: 20px !important;
}

.feature-section-title {
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 40px !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  color: #0f172a !important;
  margin-bottom: 20px !important;
  letter-spacing: -0.02em !important;
}

.feature-section-desc {
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 16px !important;
  font-weight: 400 !important;
  color: #475569 !important;
  line-height: 1.7 !important;
  margin-bottom: 24px !important;
}

.feature-section-sub-title {
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 20px !important;
  font-weight: 800 !important;
  color: #0f172a !important;
  margin: 28px 0 10px 0 !important;
}

/* Premium Dashboard Mockup Browser Frame for Features */
.mockup-container-wrapper {
  position: relative !important;
  display: inline-block !important;
  width: 100% !important;
  max-width: 580px !important;
  z-index: 2 !important;
}

.mockup-glow-behind {
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  width: 80% !important;
  height: 80% !important;
  border-radius: 50% !important;
  filter: blur(80px) !important;
  opacity: 0.15 !important;
  pointer-events: none !important;
  z-index: 1 !important;
  transition: all 0.5s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.mockup-container-wrapper:hover .mockup-glow-behind {
  opacity: 0.28 !important;
  width: 90% !important;
  height: 90% !important;
}

.mockup-glow-behind.blue-glow {
  background: radial-gradient(circle, #2563eb 0%, transparent 70%) !important;
}

.mockup-glow-behind.cyan-glow {
  background: radial-gradient(circle, #06b6d4 0%, transparent 70%) !important;
}

.mockup-glow-behind.purple-glow {
  background: radial-gradient(circle, #a855f7 0%, transparent 70%) !important;
}

.feature-mockup-frame {
  position: relative !important;
  background: rgba(255, 255, 255, 0.75) !important;
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
  border: 1px solid rgba(226, 232, 240, 0.7) !important;
  border-radius: 24px !important;
  padding: 40px 24px 24px 24px !important;
  box-shadow:
    0 4px 6px rgba(15, 23, 42, 0.01),
    0 20px 40px rgba(15, 23, 42, 0.05),
    inset 0 0 0 1px rgba(255, 255, 255, 0.6) !important;
  transition: all 0.5s cubic-bezier(0.16, 1, 0.3, 1) !important;
  z-index: 2 !important;
  display: block !important;
  width: 100% !important;
}

.mockup-container-wrapper:hover .feature-mockup-frame {
  transform: translateY(-6px) scale(1.015) !important;
  border-color: rgba(37, 99, 235, 0.35) !important;
  background: rgba(255, 255, 255, 0.85) !important;
  box-shadow:
    0 10px 15px rgba(15, 23, 42, 0.02),
    0 30px 60px rgba(15, 23, 42, 0.08),
    inset 0 0 0 1px rgba(255, 255, 255, 0.8) !important;
}

.feature-mockup-frame img {
  width: 100% !important;
  height: auto !important;
  object-fit: cover !important;
  border-radius: 12px !important;
  border: 1px solid rgba(226, 232, 240, 0.4) !important;
}

/* SECTION */
.industry-section {
  padding: 40px 0;
  background: #f9fafb;
  text-align: center;
}

/* TITLE */
.sub-title {
  color: #64748b;
  font-size: 14px;
  display: block;
  margin-bottom: 10px;
  position: relative;
}

.sub-title::after {
  content: "";
  display: block;
  width: 50px;
  height: 3px;
  background: #7c3aed;
  margin: 10px auto 0;
  border-radius: 2px;
}

.main-title {
  font-size: 36px;
  font-weight: 600;
  color: #334155;
}

/* GRID */
.industry-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 20px;
  margin-top: 40px;
}

/* CARD */
.industry-card {
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  padding: 25px 15px;
  transition: 0.3s;
  cursor: pointer;
}

/* ICON */
.industry-card img {
  width: 40px;
  margin-bottom: 10px;
  opacity: 0.7;
}

/* TEXT */
.industry-card h4 {
  font-size: 16px;
  color: #334155;
  margin: 0;
}

/* HOVER */
.industry-card:hover {
  border-color: #010ca8;
  transform: translateY(-5px);
}

/* ACTIVE CARD (LIKE GREEN BORDER IN IMAGE) */
.industry-card.active {
  border: 2px solid #010ca8;
}

/* RESPONSIVE */
@media (max-width: 992px) {
  .industry-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (max-width: 576px) {
  .industry-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* ICON STYLE */
.industry-card i {
  font-size: 28px;
  color: #94a3b8;
  margin-bottom: 12px;
  display: block;
  transition: 0.3s;
}

/* HOVER EFFECT */
.industry-card:hover i {
  color: #010ca8;
}

/* ACTIVE ICON */
.industry-card.active i {
  color: #010ca8;
}

/* SECTION */
.ecosystem-section {
  padding: 50px 0;
  background: #ffffff;
}

/* TITLE */
.eco-title {
  font-size: 32px;
  font-weight: 600;
  color: #334155;
  margin-bottom: 20px;
}

/* DESCRIPTION */
.eco-desc {
  color: #64748b;
  font-size: 15px;
  max-width: 800px;
  margin: 0 auto 10px;
  line-height: 1.6;
}

/* LOGOS ROW */
.eco-logos {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 40px;
  margin-top: 40px;
  flex-wrap: wrap;
}

/* LOGO IMAGE */
.eco-logos img {
  height: 100px;
  object-fit: contain;
  opacity: 0.8;
  transition: 0.3s;
}

/* HOVER EFFECT */
.eco-logos img:hover {
  opacity: 1;
  transform: scale(1.1);
}

/* RESPONSIVE */
@media (max-width: 768px) {
  .eco-logos {
    gap: 25px;
  }

  .eco-logos img {
    height: 35px;
  }
}


/* SECTION */
.benefits-section {
  padding: 0px 0;
  background: linear-gradient(to bottom, #f8fafc, #eef2ff);
}

/* TITLE */
.section-title h2 {
  font-size: 40px;
  font-weight: 700;
  color: #0f172a;
}

.badge-title {
  display: inline-block;
  background: rgba(99, 102, 241, 0.1);
  color: #6366f1;
  padding: 6px 14px;
  border-radius: 20px;
  font-size: 14px;
  margin-bottom: 10px;
}

/* GRID */
.benefits-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
  margin-top: 10px !important;
}

/* CARD */
.benefit-card {
  background: rgba(255, 255, 255, 0.7);
  backdrop-filter: blur(10px);
  border-radius: 16px;

  padding-top: 20px;
  text-align: center;
  transition: 0.3s;
  border: 1px solid rgba(255, 255, 255, 0.4);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
  max-height: 240px;
}

/* ICON */
.benefit-card .icon {
  font-size: 28px;
  width: 60px;
  height: 60px;
  margin: 0 auto 15px;
  background: #010ca8e8;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
}

/* TEXT */
.benefit-card h3 {
  font-size: 17px;
  margin-bottom: 10px;
  color: #000;
}

.benefit-card p {
  font-size: 16px;
  color: #676879;
}

/* HOVER EFFECT */
.benefit-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.1);
}

/* RESPONSIVE */
@media (max-width: 992px) {
  .benefits-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 576px) {
  .benefits-grid {
    grid-template-columns: 1fr;
  }
}

.benefit-card .icon {
  width: 60px;
  height: 60px;
  margin: 0 auto 15px;
  background: linear-gradient(135deg, #1852da, #1e3a8a);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.benefit-card .icon i {
  color: #fff;
  font-size: 22px;
}

/* BACKGROUND */


/* SECTION */
.video-modern {
  padding: 120px 0;
  background: linear-gradient(to bottom, #f8fafc, #eef2ff);
  position: relative;
}

/* HEADER */
.video-header h2 {
  font-size: 38px;
  font-weight: 700;
  color: #0f172a;
}

.video-header p {
  color: #64748b;
  margin-top: 10px;
}

/* GRID */
.video-wrapper-main {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 30px;
  margin-top: 50px;
}

/* CARD */
.video-box-modern {
  position: relative;
  border-radius: 18px;
  overflow: hidden;
  cursor: pointer;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.1);
  transition: 0.4s;
}

/* IMAGE */
.video-box-modern img {
  width: 100%;
  display: block;
  transition: 0.4s;
}

/* DARK OVERLAY */
.video-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(0, 0, 0, 0.6), transparent);
  opacity: 0.7;
}

/* PLAY BUTTON */
.play-btn {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 70px;
  height: 70px;
  background: linear-gradient(135deg, #2563eb, #1d4ed8);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 22px;
  transition: 0.3s;
}

/* TAG */
.video-tag {
  position: absolute;
  bottom: 20px;
  left: 20px;
  background: rgba(255, 255, 255, 0.15);
  color: #fff;
  padding: 6px 14px;
  border-radius: 20px;
  font-size: 12px;
}

/* HOVER */
.video-box-modern:hover {
  transform: translateY(-10px);
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.2);
}

.video-box-modern:hover img {
  transform: scale(1.08);
}

.video-box-modern:hover .play-btn {
  transform: translate(-50%, -50%) scale(1.2);
}

/* RESPONSIVE */
@media (max-width: 992px) {
  .video-wrapper-main {
    grid-template-columns: 1fr;
  }
}

/* Premium Industry Solutions Section Redesign */
.industry1-clean {
  position: relative !important;
  padding: 50px 0 !important;
  background: #ffffff !important;
  overflow: hidden !important;
}

.industry-bg-svg-wrapper {
  position: absolute !important;
  inset: 0 !important;
  overflow: hidden !important;
  z-index: 1 !important;
  pointer-events: none !important;
}

.industry-glow-spot {
  position: absolute !important;
  border-radius: 50% !important;
  filter: blur(140px) !important;
  opacity: 0.12 !important;
  pointer-events: none !important;
}

.industry-glow-spot.spot-blue {
  width: 500px !important;
  height: 500px !important;
  background: radial-gradient(circle, #2563eb 0%, transparent 70%) !important;
  top: -100px !important;
  left: -100px !important;
}

.industry-glow-spot.spot-cyan {
  width: 600px !important;
  height: 600px !important;
  background: radial-gradient(circle, #06b6d4 0%, transparent 70%) !important;
  bottom: -150px !important;
  right: -150px !important;
}

.industry-mesh-overlay {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background-image: radial-gradient(rgba(37, 99, 235, 0.03) 1.5px, transparent 1.5px) !important;
  background-size: 24px 24px !important;
  z-index: 1 !important;
  pointer-events: none !important;
}

.industry-blob {
  position: absolute !important;
  width: 350px !important;
  height: 350px !important;
  border-radius: 50% !important;
  filter: blur(120px) !important;
  opacity: 0.08 !important;
  z-index: 1 !important;
  pointer-events: none !important;
}

.industry-blob.blue-blob {
  top: 10% !important;
  left: -5% !important;
  background: radial-gradient(circle, #2563eb, transparent) !important;
}

.industry-blob.purple-blob {
  bottom: 10% !important;
  right: -5% !important;
  background: radial-gradient(circle, #a855f7, transparent) !important;
}

/* Individual modern cards style */
.industry1-grid {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  gap: 30px !important;
  margin-top: 40px !important;
}

.industry1-item {
  flex: 1 1 calc(33.333% - 20px) !important;
  min-width: 300px !important;
  max-width: 380px !important;
  background: #ffffff !important;
  border: 1px solid rgba(226, 232, 240, 0.8) !important;
  border-radius: 24px !important;
  padding: 32px !important;
  box-shadow: 0 4px 6px rgba(15, 23, 42, 0.01), 0 10px 30px rgba(15, 23, 42, 0.03) !important;
  transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1) !important;
  text-align: center !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
}

/* Hover highlights */
.industry1-item:hover {
  transform: translateY(-8px) scale(1.02) !important;
  box-shadow: 0 20px 40px rgba(15, 23, 42, 0.06) !important;
}

.industry1-item.legal-card-hover:hover {
  border-color: rgba(37, 99, 235, 0.35) !important;
  box-shadow: 0 20px 40px rgba(37, 99, 235, 0.05) !important;
}

.industry1-item.finance-card-hover:hover {
  border-color: rgba(6, 182, 212, 0.35) !important;
  box-shadow: 0 20px 40px rgba(6, 182, 212, 0.05) !important;
}

.industry1-item.manufacturing-card-hover:hover {
  border-color: rgba(147, 51, 234, 0.35) !important;
  box-shadow: 0 20px 40px rgba(147, 51, 234, 0.05) !important;
}

.industry1-item.real-estate-card-hover:hover {
  border-color: rgba(249, 115, 22, 0.35) !important;
  box-shadow: 0 20px 40px rgba(249, 115, 22, 0.05) !important;
}

.industry1-item.logistics-card-hover:hover {
  border-color: rgba(236, 72, 153, 0.35) !important;
  box-shadow: 0 20px 40px rgba(236, 72, 153, 0.05) !important;
}

/* Icon wrappers */
.industry1-item .icon-wrapper {
  width: 56px !important;
  height: 56px !important;
  border-radius: 16px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin-bottom: 24px !important;
  transition: all 0.3s ease !important;
}

.icon-wrapper.blue-theme {
  background: rgba(37, 99, 235, 0.08) !important;
  color: #2563eb !important;
}

.icon-wrapper.cyan-theme {
  background: rgba(6, 182, 212, 0.08) !important;
  color: #06b6d4 !important;
}

.icon-wrapper.purple-theme {
  background: rgba(147, 51, 234, 0.08) !important;
  color: #a855f7 !important;
}

.icon-wrapper.orange-theme {
  background: rgba(249, 115, 22, 0.08) !important;
  color: #f97316 !important;
}

.icon-wrapper.magenta-theme {
  background: rgba(236, 72, 153, 0.08) !important;
  color: #ec4899 !important;
}

.industry-svg-icon {
  width: 24px !important;
  height: 24px !important;
}

/* Card typography details */
.industry1-item h4 {
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 20px !important;
  font-weight: 800 !important;
  color: #0f172a !important;
  margin-bottom: 12px !important;
}

.industry1-item p {
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 15px !important;
  font-weight: 400 !important;
  color: #64748b !important;
  line-height: 1.6 !important;
  margin-bottom: 0 !important;
}

/* Industry section with link grid */
.industry-section {
  padding: 50px 0 !important;
  background: #ffffff !important;
  position: relative !important;
}

.industry-grid {
  display: grid !important;
  grid-template-columns: repeat(5, 1fr) !important;
  gap: 24px !important;
  margin-top: 40px !important;
}

.industry-card {
  background: #ffffff !important;
  border: 1px solid rgba(226, 232, 240, 0.8) !important;
  border-radius: 20px !important;
  padding: 30px 20px !important;
  box-shadow: 0 4px 6px rgba(15, 23, 42, 0.01) !important;
  transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1) !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  text-decoration: none !important;
}

.industry-card:hover {
  transform: translateY(-6px) scale(1.02) !important;
  box-shadow: 0 15px 30px rgba(15, 23, 42, 0.04) !important;
}

.industry-card.legal-card-hover:hover {
  border-color: rgba(37, 99, 235, 0.3) !important;
}

.industry-card.finance-card-hover:hover {
  border-color: rgba(6, 182, 212, 0.3) !important;
}

.industry-card.manufacturing-card-hover:hover {
  border-color: rgba(147, 51, 234, 0.3) !important;
}

.industry-card.real-estate-card-hover:hover {
  border-color: rgba(249, 115, 22, 0.3) !important;
}

.industry-card.logistics-card-hover:hover {
  border-color: rgba(236, 72, 153, 0.3) !important;
}

/* Small icon wrapper inside the link cards */
.card-icon-small {
  width: 48px !important;
  height: 48px !important;
  border-radius: 12px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin-bottom: 16px !important;
  transition: all 0.3s ease !important;
}

.card-icon-small.blue-theme {
  background: rgba(37, 99, 235, 0.06) !important;
  color: #2563eb !important;
}

.card-icon-small.cyan-theme {
  background: rgba(6, 182, 212, 0.06) !important;
  color: #06b6d4 !important;
}

.card-icon-small.purple-theme {
  background: rgba(147, 51, 234, 0.06) !important;
  color: #a855f7 !important;
}

.card-icon-small.orange-theme {
  background: rgba(249, 115, 22, 0.06) !important;
  color: #f97316 !important;
}

.card-icon-small.magenta-theme {
  background: rgba(236, 72, 153, 0.06) !important;
  color: #ec4899 !important;
}

.industry-svg-icon-small {
  width: 20px !important;
  height: 20px !important;
}

.industry-card h4 {
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 16px !important;
  font-weight: 700 !important;
  color: #0f172a !important;
  margin: 0 !important;
}

/* Responsiveness for industry sections */
@media (max-width: 991px) {
  .industry-grid {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

@media (max-width: 768px) {
  .industry-grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

@media (max-width: 480px) {
  .industry-grid {
    grid-template-columns: 1fr !important;
  }
}

/* SECTION */
.ecosystem-section {
  padding: 50px 0;
  background: #ffffff;
}

/* TITLE */
.eco-title {
  font-size: 32px;
  font-weight: 600;
  color: #334155;
  margin-bottom: 20px;
}

/* DESCRIPTION */
.eco-desc {
  color: #64748b;
  font-size: 15px;
  max-width: 800px;
  margin: 0 auto 10px;
  line-height: 1.6;
}

/* LOGOS ROW */
.eco-logos {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 40px;
  margin-top: 40px;
  flex-wrap: wrap;
}

/* LOGO IMAGE */
.eco-logos img {
  height: 100px;
  object-fit: contain;
  opacity: 0.8;
  transition: 0.3s;
}

/* HOVER EFFECT */
.eco-logos img:hover {
  opacity: 1;
  transform: scale(1.1);
}

/* RESPONSIVE */
@media (max-width: 768px) {
  .eco-logos {
    gap: 25px;
  }

  .eco-logos img {
    height: 35px;
  }
}


/* SECTION */
.benefits-section {
  padding: 0px 0;
  background: linear-gradient(to bottom, #f8fafc, #eef2ff);
}

/* TITLE */
.section-title h2 {
  font-size: 36px;
  font-weight: 700;
  color: #0f172a;
}

.badge-title {
  display: inline-block;
  background: rgba(99, 102, 241, 0.1);
  color: #6366f1;
  padding: 6px 14px;
  border-radius: 20px;
  font-size: 14px;
  margin-bottom: 10px;
}

/* GRID */
.benefits-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
  margin-top: 10px !important;
}

/* CARD */
.benefit-card {
  background: rgba(255, 255, 255, 0.7);
  backdrop-filter: blur(10px);
  border-radius: 16px;

  padding-top: 20px;
  text-align: center;
  transition: 0.3s;
  border: 1px solid rgba(255, 255, 255, 0.4);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
  max-height: 240px;
}

/* ICON */
.benefit-card .icon {
  font-size: 28px;
  width: 60px;
  height: 60px;
  margin: 0 auto 15px;
  background: #010ca8e8;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
}

/* TEXT */
.benefit-card h3 {
  font-size: 17px;
  margin-bottom: 10px;
  color: #000;
}

.benefit-card p {
  font-size: 16px;
  color: #676879;
}

/* HOVER EFFECT */
.benefit-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.1);
}

/* RESPONSIVE */
@media (max-width: 992px) {
  .benefits-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 576px) {
  .benefits-grid {
    grid-template-columns: 1fr;
  }
}

.benefit-card .icon {
  width: 60px;
  height: 60px;
  margin: 0 auto 15px;
  background: linear-gradient(135deg, #1852da, #1e3a8a);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.benefit-card .icon i {
  color: #fff;
  font-size: 22px;
}

/* BACKGROUND */
/* ==========================================================================
   REDESIGNED CTA SECTION (PREMIUM)
   ========================================================================== */
/* ==========================================================================
   REDESIGNED CTA SECTION (LIGHT THEME & SVG ANIMATIONS)
   ========================================================================== */
.cta-modern.cta-light {
  position: relative !important;
  padding: 75px 0 !important;
  background: #f8fafc !important;
  overflow: hidden !important;
  color: #1e293b !important;
  border-top: 1px solid #f1f5f9 !important;
  border-bottom: 1px solid #f1f5f9 !important;
}

.cta-svg-bg-wrapper {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  z-index: 1 !important;
  pointer-events: none !important;
}

.cta-bg-svg {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

/* LEFT SIDE - Mockup */
.cta-light .cta-image {
  position: relative !important;
  display: inline-block !important;
  width: 100% !important;
  max-width: 500px !important;
  z-index: 2 !important;
}

.cta-light .cta-image img {
  width: 100% !important;
  height: auto !important;
  border-radius: 20px !important;
  border: 1px solid #e2e8f0 !important;
  box-shadow: 0 20px 40px rgba(15, 23, 42, 0.08) !important;
  position: relative !important;
  z-index: 2 !important;
  transition: transform 0.5s cubic-bezier(0.25, 1, 0.5, 1) !important;
}

.cta-light .cta-image:hover img {
  transform: translateY(-5px) !important;
}

/* RIGHT SIDE - Old Content & Light Theme Typography */
.cta-light .cta-content {
  position: relative !important;
  z-index: 2 !important;
  padding-left: 20px !important;
}

.cta-light .cta-content h2 {
  font-size: 40px !important;
  font-weight: 700 !important;
  color: #0f172a !important;
  margin-bottom: 20px !important;
  letter-spacing: -1.2px !important;
  line-height: 1.15 !important;
}

.cta-light .cta-content p {
  font-size: 16.5px !important;
  color: #475569 !important;
  line-height: 1.65 !important;
  margin-bottom: 30px !important;
}

/* Star Ratings Restored */
.cta-light .cta-ratings {
  display: flex !important;
  gap: 25px !important;
  margin-bottom: 35px !important;
  border-bottom: 1px solid #e2e8f0 !important;
  padding-bottom: 20px !important;
  width: fit-content !important;
}

.cta-light .cta-ratings div {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  color: #2563eb !important;
  background: rgba(37, 99, 235, 0.05) !important;
  border: 1px solid rgba(37, 99, 235, 0.1) !important;
  padding: 6px 16px !important;
  border-radius: 20px !important;
  box-shadow: 0 2px 4px rgba(37, 99, 235, 0.02) !important;
  transition: all 0.3s ease !important;
}

.cta-light .cta-ratings div:hover {
  background: rgba(37, 99, 235, 0.08) !important;
  border-color: rgba(37, 99, 235, 0.2) !important;
  transform: translateY(-1px) !important;
}

.cta-light .cta-ratings i {
  color: #eab308 !important;
}

/* Buttons Restored */
.cta-light .cta-buttons {
  display: flex !important;
  gap: 15px !important;
}

.cta-light .btn-primary {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  background: #2563eb !important;
  color: #ffffff !important;
  padding: 14px 30px !important;
  border-radius: 30px !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  transition: all 0.3s ease !important;
  box-shadow: 0 4px 14px rgba(37, 99, 235, 0.25) !important;
  border: none !important;
}

.cta-light .btn-primary:hover {
  background: #1d4ed8 !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 6px 20px rgba(37, 99, 235, 0.35) !important;
  color: #ffffff !important;
}

.cta-light .btn-outline {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  background: transparent !important;
  border: 2px solid #cbd5e1 !important;
  color: #334155 !important;
  padding: 12px 28px !important;
  border-radius: 30px !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  transition: all 0.3s ease !important;
}

.cta-light .btn-outline:hover {
  border-color: #334155 !important;
  background: rgba(51, 65, 85, 0.04) !important;
  transform: translateY(-2px) !important;
  color: #1e293b !important;
}

/* ==========================================================================
   SVG BACKGROUND ANIMATIONS
   ========================================================================== */
.cta-circuit-1 {
  stroke-dasharray: 1000;
  stroke-dashoffset: 1000;
  animation: cta-flow-line 10s linear infinite;
}

.cta-circuit-2 {
  stroke-dasharray: 15, 8;
  animation: cta-dash-flow 30s linear infinite;
}

.cta-node {
  transform-box: fill-box;
  transform-origin: center;
  animation: cta-pulse-node 3s infinite ease-in-out;
}

.cta-node-2 {
  animation-delay: 0.6s;
}

.cta-node-3 {
  animation-delay: 1.2s;
}

.cta-node-4 {
  animation-delay: 1.8s;
}

.cta-node-5 {
  animation-delay: 2.4s;
}

.cta-orbit-dash {
  transform-box: fill-box;
  transform-origin: center;
  animation: cta-rotate-orbit 40s linear infinite;
}

.cta-orbit-dash-rev {
  transform-box: fill-box;
  transform-origin: center;
  animation: cta-rotate-orbit-rev 50s linear infinite;
}

@keyframes cta-flow-line {
  0% {
    stroke-dashoffset: 1000;
  }

  100% {
    stroke-dashoffset: 0;
  }
}

@keyframes cta-dash-flow {
  0% {
    stroke-dashoffset: 400;
  }

  100% {
    stroke-dashoffset: 0;
  }
}

@keyframes cta-pulse-node {

  0%,
  100% {
    transform: scale(1);
    opacity: 0.6;
  }

  50% {
    transform: scale(1.35);
    opacity: 1;
  }
}

@keyframes cta-rotate-orbit {
  0% {
    transform: rotate(0deg);
  }

  100% {
    transform: rotate(360deg);
  }
}

@keyframes cta-rotate-orbit-rev {
  0% {
    transform: rotate(360deg);
  }

  100% {
    transform: rotate(0deg);
  }
}

/* Responsive */
@media (max-width: 991px) {
  .cta-modern.cta-light {
    padding: 50px 0 !important;
  }

  .cta-light .cta-image {
    margin-bottom: 50px !important;
    display: block !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .cta-light .cta-content {
    padding-left: 0 !important;
    text-align: center !important;
  }

  .cta-light .cta-ratings {
    margin: 0 auto 35px !important;
  }

  .cta-light .cta-buttons {
    justify-content: center !important;
  }
}

@media (max-width: 767px) {
  .cta-light .cta-content h2 {
    font-size: 34px !important;
  }
}

/* SECTION */
.video-modern {
  padding: 120px 0;
  background: linear-gradient(to bottom, #f8fafc, #eef2ff);
  position: relative;
}

/* HEADER */
.video-header h2 {
  font-size: 38px;
  font-weight: 700;
  color: #0f172a;
}

.video-header p {
  color: #64748b;
  margin-top: 10px;
}

/* GRID */
.video-wrapper-main {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 30px;
  margin-top: 50px;
}

/* CARD */
.video-box-modern {
  position: relative;
  border-radius: 18px;
  overflow: hidden;
  cursor: pointer;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.1);
  transition: 0.4s;
}

/* IMAGE */
.video-box-modern img {
  width: 100%;
  display: block;
  transition: 0.4s;
}

/* DARK OVERLAY */
.video-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(0, 0, 0, 0.6), transparent);
  opacity: 0.7;
}

/* PLAY BUTTON */
.play-btn {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 70px;
  height: 70px;
  background: linear-gradient(135deg, #2563eb, #1d4ed8);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 22px;
  transition: 0.3s;
}

/* TAG */
.video-tag {
  position: absolute;
  bottom: 20px;
  left: 20px;
  background: rgba(255, 255, 255, 0.15);
  color: #fff;
  padding: 6px 14px;
  border-radius: 20px;
  font-size: 12px;
}

/* HOVER */
.video-box-modern:hover {
  transform: translateY(-10px);
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.2);
}

.video-box-modern:hover img {
  transform: scale(1.08);
}

.video-box-modern:hover .play-btn {
  transform: translate(-50%, -50%) scale(1.2);
}

/* RESPONSIVE */
@media (max-width: 992px) {
  .video-wrapper-main {
    grid-template-columns: 1fr;
  }
}



.service2-section-area {
  position: relative;
  overflow: hidden;
  background: linear-gradient(145deg, #020b2a 0%, #010da8 45%, #020b2a 100%) !important;
  background-image:
    linear-gradient(rgba(255, 255, 255, 0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.04) 1px, transparent 1px) !important;
  background-size: 50px 50px !important;
  padding-bottom: 80px;
}

.service2-section-area::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: radial-gradient(circle at 50% 50%, rgba(99, 102, 241, 0.15) 0%, transparent 60%);
  pointer-events: none;
  z-index: 0;
}

/* particles layer */
#particles-js {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 0;
  pointer-events: none;
}

.welcome2-header {
  position: relative;
  z-index: 1;
}

.custm_btn,
.custm_btn_secondary {
  position: relative;
  z-index: 3;
}

/* content above particles */
.content-layer {
  position: relative;
  z-index: 2;
}

.usecase-pro {
  position: relative !important;
  padding: 50px 0 !important;
  background: #ffffff !important;
  overflow: hidden !important;
}

.usecase-bg-svg-wrapper {
  position: absolute !important;
  inset: 0 !important;
  overflow: hidden !important;
  z-index: 1 !important;
  pointer-events: none !important;
}

.usecase-mesh-overlay {
  position: absolute !important;
  inset: 0 !important;
  background-image: radial-gradient(rgba(37, 99, 235, 0.03) 1.5px, transparent 1.5px) !important;
  background-size: 24px 24px !important;
  z-index: 1 !important;
  pointer-events: none !important;
}

.usecase-glow-spot {
  position: absolute !important;
  border-radius: 50% !important;
  filter: blur(140px) !important;
  opacity: 0.1 !important;
  pointer-events: none !important;
}

.usecase-glow-spot.spot-blue {
  width: 600px !important;
  height: 600px !important;
  background: radial-gradient(circle, #2563eb 0%, transparent 70%) !important;
  top: -150px !important;
  right: -100px !important;
}

.usecase-glow-spot.spot-purple {
  width: 600px !important;
  height: 600px !important;
  background: radial-gradient(circle, #a855f7 0%, transparent 70%) !important;
  bottom: -150px !important;
  left: -100px !important;
}

.usecase-grid {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 30px !important;
  position: relative !important;
  z-index: 2 !important;
}

.usecase-card {
  background: #ffffff !important;
  border: 1px solid rgba(226, 232, 240, 0.8) !important;
  border-radius: 24px !important;
  padding: 40px 30px !important;
  box-shadow: 0 4px 6px rgba(15, 23, 42, 0.01), 0 10px 30px rgba(15, 23, 42, 0.02) !important;
  transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1) !important;
  text-align: center !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
}

.usecase-card:hover {
  transform: translateY(-8px) scale(1.02) !important;
  box-shadow: 0 20px 40px rgba(15, 23, 42, 0.05) !important;
  border-color: rgba(37, 99, 235, 0.3) !important;
}

.usecase-card .icon-wrapper {
  width: 56px !important;
  height: 56px !important;
  border-radius: 16px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin-bottom: 24px !important;
  transition: all 0.3s ease !important;
}

.usecase-card .icon-wrapper.blue-theme {
  background: rgba(37, 99, 235, 0.08) !important;
  color: #2563eb !important;
}

.usecase-card .icon-wrapper.cyan-theme {
  background: rgba(6, 182, 212, 0.08) !important;
  color: #06b6d4 !important;
}

.usecase-card .icon-wrapper.purple-theme {
  background: rgba(147, 51, 234, 0.08) !important;
  color: #a855f7 !important;
}

.usecase-svg-icon {
  width: 24px !important;
  height: 24px !important;
}

.usecase-card h4 {
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 20px !important;
  font-weight: 800 !important;
  color: #0f172a !important;
  margin-bottom: 14px !important;
}

.usecase-card p {
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 15px !important;
  font-weight: 400 !important;
  color: #64748b !important;
  line-height: 1.6 !important;
  margin: 0 !important;
}

@media (max-width: 991px) {
  .usecase-grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

@media (max-width: 768px) {
  .usecase-grid {
    grid-template-columns: 1fr !important;
  }
}

.sector-section {
  padding: 80px 0;
  background: linear-gradient(135deg, #f8fafc, #eef2f7);
}

.section-title {
  font-weight: 700;
  font-size: 32px;
  color: #1e293b;
}

.sector-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 25px;
  margin-top: 40px;
}

.sector-card {
  background: #fff;
  padding: 35px 20px;
  text-align: center;
  border-radius: 16px;
  transition: 0.4s ease;
  border: 1px solid #e2e8f0;
  cursor: pointer;
  position: relative;
  overflow: hidden;
}

.sector-card i {
  font-size: 32px;
  margin-bottom: 15px;
  color: #2563eb;
  transition: 0.3s;
}

.sector-card h4 {
  font-size: 18px;
  font-weight: 600;
  color: #1e293b;
}

/* Hover Effect */
.sector-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 15px 40px rgba(0, 0, 0, 0.08);
}

.sector-card:hover i {
  transform: scale(1.2);
  color: #0ea5e9;
}

/* Active Card */
.sector-card.active {
  background: #2563eb;
  color: #fff;
  border: none;
}

.sector-card.active i {
  color: #fff;
}

.sector-card.active h4 {
  color: #fff;
}

.mega-menu {
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  background: #f9fafb;
  display: none;
  z-index: 999;
  padding: 20px 0;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.08);
}

.mega-menu.active {
  display: block;
}

.mega-container {
  max-width: 1200px;
  margin: auto;
  display: flex;
  gap: 60px;
  position: relative;
}

/* LEFT */
.mega-left {
  width: 30%;
  border-right: 2px solid #e5e7eb;
}

.mega-left h3 {
  font-size: 24px;
  font-weight: 700;
  margin-bottom: 10px;
}

.mega-left p {
  font-size: 14px;
  color: #6b7280;
  margin-bottom: 20px;
  line-height: 1.6;
}

.mega-btn {
  background: #1d4ed8;
  color: #fff;
  padding: 12px 20px;
  border-radius: 8px;
  text-decoration: none;
  transition: 0.3s;
}

.mega-btn:hover {
  background: #2563eb;
  color: #fff;

}

/* RIGHT */
.mega-right {
  width: 70%;
}

.mega-right h4 {
  font-size: 18px;
  margin-bottom: 20px;
}

/* GRID */
.industry-grid-menu {
  display: grid;
  grid-template-columns: repeat(1, 0.5fr);
  gap: 15px;
}

/* CARD */
.industry-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px;
  background: #fff;
  border-radius: 10px;
  text-decoration: none;
  color: #111;
  border: 1px solid #e5e7eb;
  transition: 0.3s;
}

.industry-item i {
  font-size: 18px;
  color: #2563eb;
}

/* HOVER EFFECT */
.industry-item:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08);
  border-color: #2563eb;
}

/* CLOSE BUTTON */
.mega-close {
  position: absolute;
  top: 0;
  right: 0;
  font-size: 20px;
  cursor: pointer;
}

.custm-width {
  max-width: 1440px;
}

/* SECTION */

/* FLEX */
.hero-wrap {
  display: block;
  align-items: center;
}

/* LEFT */
.hero-content {
  width: 55%;
  /* z-index: 2; */
}

.breadcrumb {
  font-size: 14px;
  color: #666;
  /* margin-bottom: 15px; */
}


.hero-content h1 {
  font-size: 35px;
  font-weight: 700;
  line-height: 1.3;
}

/* underline */
.underline {
  width: 60px;
  height: 3px;
  background: #010ca8;
  margin: 0px 0 15px;
}

.hero-content p {
  color: #555;
  /* max-width: 500px; */
  line-height: 1.7;
}

/* RIGHT IMAGE */
.hero-image {
  position: absolute;
  right: 0;
  top: 0;
  width: 50%;
  height: 100%;
  clip-path: polygon(15% 0, 100% 0, 100% 100%, 0% 100%);
  overflow: hidden;
}

.hero-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* RESPONSIVE */
@media (max-width: 992px) {
  .hero-wrap {
    flex-direction: column;
  }

  .hero-content {
    width: 100%;
  }

  .hero-image {
    position: relative;
    width: 100%;
    height: 300px;
    clip-path: none;
    margin-top: 30px;
  }
}

#subtitle {
  font-size: 20px;
  margin-bottom: 10px;
}

/* SECTION */
.industry-challenge {
  padding: 40px 0 0px;
  background: #f9fafb;
}

/* CENTER CONTENT WIDTH */


/* TAG */
.section-tag {
  color: #fff !important;
  background: #0b1ea8;

  border-radius: 20px;
  padding: 5px 20px;
  font-weight: 600;
  display: inline-block;
  margin-bottom: 10px;
}

/* HEADING */
.industry-challenge h2 {
  font-size: 28px;
  font-weight: 600;
  /* margin-bottom: 20px; */
  color: #111827;
}

/* DESCRIPTION */
.section-desc {
  color: #4b5563;
  line-height: 1.7;
  margin-bottom: 25px;
}

/* LIST */
.challenge-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

/* EACH ITEM */
.challenge-list li {
  position: relative;
  padding-left: 28px;
  margin-bottom: 14px;
  color: #374151;
  line-height: 1.6;
}

/* CUSTOM BULLET */
.challenge-list li::before {
  content: "";
  width: 8px;
  height: 8px;
  background: #2563eb;
  border-radius: 50%;
  position: absolute;
  left: 0;
  top: 8px;
}

/* NOTE */
.section-note {
  margin-top: 25px;
  color: #6b7280;
  font-size: 14px;
  border-left: 3px solid #e5e7eb;
  padding-left: 12px;
}

.industry-solution-clean {
  padding: 50px 0;
  background: #f8fafc;
}

/* HEADER */
.solution-header {
  max-width: 1000px;
  margin-bottom: 50px;
}

.section-tag {
  color: #010ca8;
  font-weight: 600;
  display: inline-block;
  margin-bottom: 10px;
}

.solution-header h2 {
  font-size: 32px;
  font-weight: 700;
  margin-bottom: 15px;
}

.solution-intro {
  font-size: 20px;
  font-weight: 500;
  color: #111827;
  margin-bottom: 15px;
}

.solution-desc {
  color: #4b5563;
  line-height: 1.7;
}

/* GRID */
.solution-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 40px 60px;
}

/* ITEM */
.solution-item {
  max-width: 420px;
}

/* TITLE */
.solution-item h5 {
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 8px;
  color: #010ca8;
}

/* TEXT */
.solution-item p {
  color: #555;
  line-height: 1.6;
  margin: 0;
}

.industry-benefits-clean {
  padding: 50px 0;
  background: #ffffff;
  text-align: center;
  justify-self: center;
}

/* CENTER WIDTH */
.benefits-wrapper {
  max-width: 900px;
}

/* TAG */
.section-tag {
  color: #010ca8;
  font-weight: 600;
  display: inline-block;
  margin-bottom: 10px;
}

/* HEADING */
.industry-benefits-clean h2 {
  font-size: 28px;
  font-weight: 600;
  margin-bottom: 30px;
  color: #111827;
}

/* LIST */
.benefits-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

/* ITEM */
.benefits-list li {
  font-size: 18px;
  color: #111827;
  margin-bottom: 18px;
  line-height: 1.6;
  position: relative;
  padding-left: 20px;
}

/* SUBTLE DOT (VERY CLEAN) */
.benefits-list li::before {
  content: "";
  width: 6px;
  height: 6px;
  background: #2563eb;
  border-radius: 50%;
  position: absolute;
  left: 0;
  top: 10px;
}

/* HOVER EFFECT (SUBTLE) */
.benefits-list li:hover {
  color: #2563eb;
  transition: 0.3s;
}

/* DEFAULT */
.industry-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 16px;
  border-radius: 10px;
  transition: 0.3s;
  text-decoration: none;
  color: #222;
  position: relative;
}

/* HOVER */
.industry-item:hover {
  background: #f3f6ff;
}

/* ACTIVE STATE */
.industry-item.active {
  background: #eef2ff;
  border: 1px solid #4f46e5;
}

/* UNDERLINE EFFECT */
.industry-item.active span {
  position: relative;
  color: #4f46e5;
  font-weight: 600;
}

.industry-item.active span::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -3px;
  width: 100%;
  height: 2px;
  background: #4f46e5;
}

.industry-item span::after {
  transition: width 0.3s ease;
  width: 0;
}

.industry-item.active span::after {
  width: 100%;
}

.nav-link.active span {
  position: relative;
  color: #fff;
}

.nav-link.active span::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -5px;
  width: 0%;
  height: 2px;
  background: #fff;
  transition: 0.3s;
}

#welcome2-section-area,
.welcome2-section-area {
  position: relative;
  overflow: hidden;
}

/* PARTICLE LAYER */
#particles-hero {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
}

/* CONTENT ABOVE PARTICLES */
.content-layer {
  position: relative;
  z-index: 2;
}

.cta-modern {
  position: relative;
  z-index: 5;
}

.cta-buttons a {
  position: relative;
  z-index: 10;
  cursor: pointer;
}

.hero-icertis {
  background: #dce8f4;
  padding: 100px 0 20px;
  overflow: hidden;
}

.hero-wrap {
  display: flex;
  align-items: center;
  position: relative;
}

/* LEFT CONTENT */
.hero-content {
  flex: 1;
  /* max-width: 600px; */
  /* z-index: 2; */
}

.hero-content .tag {
  font-size: 40px !important;
  font-weight: 700 !important;
  color: #333;
  line-height: 1.3;
  margin-bottom: 20px;
}

.hero-content h5 {
  font-size: 18px;
  color: #0b1ea8ed;
  margin-bottom: 15px;
}

.hero-content p {
  font-size: 17px;
  color: #555;
  line-height: 1.7;
}

/* UNDERLINE */
.underline {
  width: 50px;
  height: 3px;
  background: #6c3cff;
  margin: 15px 0 20px;
  border-radius: 10px;
}

/* RIGHT IMAGE */
.hero-image {
  flex: 1;
  position: relative;
  height: 500px;
}

/* ANGLED SHAPE */
.hero-img-shape {
  position: absolute;
  right: -100px;
  top: 0;
  width: 120%;
  height: 100%;
  overflow: hidden;

  clip-path: polygon(20% 0, 100% 0, 100% 100%, 0% 100%);
}

/* IMAGE */
.hero-img-shape img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* OPTIONAL OVERLAY (gradient like screenshot) */
.hero-img-shape::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(to left,
      rgba(0, 0, 0, 0.1),
      rgba(255, 255, 255, 0.2));
}

/* RESPONSIVE */
@media (max-width: 992px) {
  .hero-wrap {
    flex-direction: column;
  }

  .cta-modern {
    text-align: center;
  }

  .hero-image {
    width: 100%;
    height: 300px;
    margin-top: 30px;
  }

  .hero-img-shape {
    position: relative;
    clip-path: none;
    width: 100%;
    right: 0;
  }
}

.hero-img-shape {
  position: absolute;
  right: -120px;
  top: 0;
  width: 115%;
  height: 100%;
  overflow: hidden;
  clip-path: polygon(18% 0, 100% 0, 100% 100%, 0% 100%);
}

.hero-label {
  color: #6c3cff;
  font-size: 16px;
  margin-bottom: 10px;
}

.breadcrumb {
  font-size: 14px;
  color: #6b7280;
  margin-bottom: 10px;
}

/* WRAPPER */
.bc-wrap {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  margin-bottom: 15px;
}

/* ITEMS */
.bc-item {
  color: #6b7280;
  text-decoration: none;
  padding: 4px 10px;
  border-radius: 20px;
  transition: 0.3s;
}

/* HOVER */
.bc-item:hover {
  background: #eef2ff;
  color: #4f46e5;
}

/* ACTIVE */
.bc-item.active {
  background: #ede9fe;
  color: #6c3cff;
  font-weight: 500;
}

/* SEPARATOR */
.bc-sep {
  color: #cbd5e1;
  font-size: 13px;
}

.industry-challenge {
  padding: 40px 0;
  background: #f8fafc;
  text-align: center;
}

.challenge-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 25px;
}

/* CARD */
.challenge-card {
  background: #fff;
  border-radius: 14px;
  padding: 25px;
  border: 1px solid #e6ecf2;
  display: flex;
  gap: 15px;
  align-items: flex-start;
  transition: 0.3s ease;
}

/* ICON */
.challenge-icon {
  width: 50px;
  height: 50px;
  background: #eef4ff;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.challenge-icon i {
  font-size: 30px;
  color: #2563eb;
}

/* TEXT */
.challenge-card p {
  margin: 0;
  font-size: 15px;
  color: #444;
  line-height: 1.6;
}

/* HOVER */
.challenge-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
}

/* RESPONSIVE */
@media (max-width: 992px) {
  .challenge-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 576px) {
  .challenge-grid {
    grid-template-columns: 1fr;
  }
}

/* SECTION */
.industry-solution-clean {
  padding: 30px 0 20px;
  background: linear-gradient(180deg, #f8fafc, #eef3f9);
}

/* HEADER */
.solution-header {
  max-width: 1000px;
  margin: auto;
  text-align: center;
  margin-bottom: 20px;
}

.solution-header h2 {
  font-size: 28px;
  font-weight: 600;
  margin-bottom: 15px;
}

.solution-intro {
  color: #6b7280;
  margin-bottom: 10px;
}

.solution-desc {
  color: #555;
  line-height: 1.7;
}

/* GRID */
.solution-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 25px;
}

/* CARD */
.solution-card {
  background: #fff;
  border-radius: 14px;
  padding: 25px;
  border: 1px solid #e6ecf2;
  display: flex;
  gap: 15px;
  align-items: flex-start;
  transition: 0.3s ease;
}

/* ICON */
.solution-icon {
  width: 50px;
  height: 50px;
  background: #eef4ff;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.solution-icon i {
  font-size: 30px;
  color: #2563eb;
}

/* CONTENT */
.solution-content h5 {
  font-size: 17px;
  font-weight: 600;
  margin-bottom: 6px;
}

.solution-content p {
  font-size: 16px;
  color: #555;
  margin: 0;
}

/* HOVER */
.solution-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.08);
}

/* RESPONSIVE */
@media (max-width: 992px) {
  .solution-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 576px) {
  .solution-grid {
    grid-template-columns: 1fr;
  }
}

/* COMMON GRID */
.challenge-grid,
.solution-grid,
.benefits-grid {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

/* COMMON CARD */
.challenge-card,
.solution-card,
.benefit-card {

  height: auto;
  place-items: center;
  text-align: center;
  display: block;
  background: #eef3f9;
  border-radius: 14px;
  padding: 25px;
  border: 1px solid #e6ecf2;
  transition: 0.3s ease;
}

/* COMMON ICON */
.challenge-icon,
.solution-icon,
.benefit-icon {
  width: 55px;
  height: 55px;
  background: linear-gradient(135deg, #eef2ff, #e0e7ff);
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 15px;
}

.challenge-icon i,
.solution-icon i,
.benefit-icon i {
  font-size: 25px;
  color: #4f46e5;
}

/* TEXT */
.challenge-card p,
.solution-card p,
.benefit-card p {
  font-size: 17px;
  color: #6b7280;
}

.solution-card h5,
.benefit-card h5 {
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 8px;
}

/* HOVER */
.challenge-card:hover,
.solution-card:hover,
.benefit-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.08);
}

/* RESPONSIVE */
@media (max-width: 992px) {

  .challenge-grid,
  .solution-grid,
  .benefits-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 576px) {

  .challenge-grid,
  .solution-grid,
  .benefits-grid {
    grid-template-columns: 1fr;
  }
}

.mobile-submenu {
  display: none;
  padding-left: 15px;
}

.mobile-submenu li {
  margin: 8px 0;
}

.mobile-submenu a {
  color: #fff;
  font-size: 14px;
}

.solution-premium {
  margin-top: 60px;
  border-top: 1px solid #eee;
}

/* ROW */
.solution-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 30px 0;
  border-bottom: 1px solid #eee;
  transition: all 0.3s ease;
}

/* LEFT */
.solution-left {
  display: flex;
  align-items: center;
  gap: 18px;
  width: 35%;
}

/* ICON */
.solution-icon {
  width: 50px;
  height: 50px;
  background: linear-gradient(135deg, #eff0f7, #010ca85e);
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 20px;
  transition: 0.3s;
}

/* TITLE */
.solution-left h5 {
  font-size: 18px;
  font-weight: 600;
  margin: 0;
}

/* RIGHT */
.solution-right {
  width: 60%;
}

.solution-right p {
  margin: 0;
  color: #666;
  font-size: 15px;
  line-height: 1.6;
}

/* HOVER EFFECT */
.solution-row:hover {
  background: #f9faff;
  padding-left: 10px;
}

.solution-row:hover .solution-icon {
  transform: scale(1.1);
}

@media (max-width: 768px) {
  .solution-row {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }

  .solution-left,
  .solution-right {
    width: 100%;
  }
}

/* ROW BASE */
.solution-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 28px 25px;
  border-bottom: 1px solid #eee;
  border-radius: 14px;
  /* ✅ rounded */
  transition: all 0.3s ease;
}

/* ICON BOX */
.solution-icon {
  width: 52px;
  height: 52px;
  background: #eef2ff;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #5b6cff;
  font-size: 20px;
  transition: all 0.3s ease;
}

/* TEXT */
.solution-left h5,
.solution-right p {
  transition: all 0.3s ease;
}

/* 🔥 HOVER EFFECT */
.solution-row:hover {
  background: linear-gradient(135deg, #2b3cff, #4f5eff);
  /* premium blue */
  transform: translateY(-2px);
}

/* TEXT WHITE ON HOVER */
.solution-row:hover h5,
.solution-row:hover p {
  color: #fff;
}

/* ICON WHITE ON HOVER */
.solution-row:hover .solution-icon {
  background: #fff;
  color: #2b3cff;
}

/* OPTIONAL: subtle shadow */
.solution-row:hover {
  box-shadow: 0 10px 25px rgba(43, 60, 255, 0.25);
}

.section-tabs {
  position: sticky;
  top: 70px;
  /* adjust based on header height */
  z-index: 2;
  background: rgba(255, 255, 255, 0.9);
  /* backdrop-filter: blur(10px); */
  border-bottom: 1px solid #f2f6fa;
}

.tabs-container {
  display: flex;
  justify-content: center;
  gap: 30px;
  padding: 5px 0;
}

.tab-link {
  text-decoration: none;
  color: #555;
  font-weight: 600;
  position: relative;
  padding: 8px 10px;
  transition: 0.3s;
  margin: 10px 0px;
}

/* ACTIVE TAB */
.tab-link.active {
  color: #1d4ed8;
}

/* UNDERLINE ANIMATION */
.tab-link::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -6px;
  width: 0%;
  height: 2px;
  background: #1d4ed8;
  transition: 0.3s;
}

.tab-link.active::after {
  width: 100%;
}



.tab-link {
  display: flex;
  align-items: center;
  gap: 8px;
  text-decoration: none;
  color: #555;
  font-weight: 600;
  padding: 8px 14px;
  border-radius: 8px;
  transition: 0.3s;
}

/* ICON STYLE */
.tab-link i {
  font-size: 17px;
  opacity: 0.8;
}

/* ACTIVE TAB */
.tab-link.active {
  color: #1d4ed8;
  background: rgba(29, 78, 216, 0.08);
}

/* HOVER */
.tab-link:hover {
  color: #1d4ed8;
}

/* demo form  */
/* MODAL BACKDROP */
.demo-modal .modal-content {
  background: linear-gradient(#010DB0 11.48%, #010173 96.12%);
  border: none;
}

/* MAIN BOX */
.demo-modal-box {
  background: #0013c1;
  border-radius: 20px;
  padding: 40px;
  position: relative;
  color: #fff;
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.4);

  /* 👇 IMPORTANT */
  backdrop-filter: none;
}

/* CLOSE BUTTON */
.modal-close {
  position: absolute;
  top: 20px;
  right: 20px;
  background: transparent;
  border: none;
  color: #fff;
  font-size: 20px;
  cursor: pointer;
}

/* HEADER */
.demo-header h2 {
  font-size: 28px;
  font-weight: 700;
}

.demo-header p {
  color: rgba(255, 255, 255, 0.8);
  margin-top: 8px;
}

.modal-backdrop.show {
  opacity: 0.85 !important;
  background: #020617;
}

/* BADGE */
.demo-badge {
  display: inline-block;
  background: rgba(255, 255, 255, 0.15);
  padding: 6px 14px;
  border-radius: 20px;
  font-size: 13px;
  margin-bottom: 10px;
}

/* FORM */
.demo-form {
  margin-top: 25px;
}

/* INPUT GROUP */
.form-group {
  margin-bottom: 16px;
  width: 100%;
}

.form-group label {
  font-size: 14px;
  margin-bottom: 5px;
  display: block;
}

/* INPUT */
.form-group input {
  width: 100%;
  padding: 14px;
  border-radius: 10px;
  border: none;
  outline: none;

  background: #f8fafc;
  color: #111;
  font-weight: 500;
}

/* ROW */
.form-row {
  display: flex;
  gap: 15px;
}

.demo-submit-btn {
  width: 100%;
  margin-top: 20px;
  padding: 16px;

  background: linear-gradient(135deg, #fff, #fff);
  color: #010485;

  border: none;
  border-radius: 12px;
  font-weight: 600;
  font-size: 16px;

  transition: 0.3s;
}

.demo-submit-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 25px rgba(59, 130, 246, 0.4);
  color: #fff;

}

.modal-dialog {
  max-width: 720px;
}

/* ================= MOBILE + TABLET TABS ================= */
@media (max-width: 768px) {

  .section-tabs {
    position: fixed;
    /* 🔥 FIX */
    top: 87px;
    /* mobile header height */
    left: 0;
    width: 100%;

    z-index: 2;
    background: #fff;
    border-bottom: 1px solid #e5e7eb;
  }

  .tabs-container {
    display: flex;
    gap: 10px;
    padding: 0px;

    overflow-x: auto;
    white-space: nowrap;
    scroll-behavior: smooth;

    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }

  .tabs-container::-webkit-scrollbar {
    display: none;
  }

  .tab-link {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 6px;

    padding: 0px 10px;
    border-radius: 20px;

    font-size: 13px;
    font-weight: 600;

    background: #f3f4f6;
    color: #555;

    transition: 0.3s ease;
  }

  .tab-link i {
    font-size: 12px;
  }

  .tab-link.active {
    background: #1d4ed8;
    color: #fff;
  }

  .tab-link:hover {
    background: #1d4ed8;
    color: #fff;
  }
}

.index_z {
  z-index: 1;
}

.read-more-btn {
  position: relative;
  z-index: 5;
  display: inline-block;
}

/* ITEM */
.solution-premium-item {
  display: flex !important;
  align-items: flex-start !important;
  gap: 25px !important;
  padding: 25px 0 !important;
  border-bottom: 1px solid #eee !important;
  transition: all 0.3s ease !important;
  width: 100% !important;
}

/* HOVER EFFECT */
.solution-premium-item:hover {
  transform: translateX(6px) !important;
}

/* NUMBER (LEFT SIDE) */
.solution-number {
  font-size: 22px !important;
  font-weight: 700 !important;
  color: #2432ac !important;
  min-width: 40px !important;
  transition: 0.3s !important;
}

/* ACTIVE COLOR ON HOVER */
.solution-premium-item:hover .solution-number {
  color: #5a67ff !important;
}

.solution-premium {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  width: 100% !important;
  margin-top: 40px !important;
  border-top: 1px solid #eee !important;
  position: relative !important;
}

/* CONTENT */
.solution-content h5 {
  font-size: 18px !important;
  font-weight: 600 !important;
  margin-bottom: 6px !important;
}

.solution-content p {
  font-size: 16px !important;
  color: #666 !important;
  line-height: 1.6 !important;
  max-width: 800px !important;
}

.footer_img img {
  width: 80%;
}

.video-thumbnail {
  width: 100%;
  height: 380px;
  object-fit: cover;
  display: block;
  border-radius: 20px;
}

.video-wrapper:hover .play-btn {
  transform: translate(-50%, -50%) scale(1.1);
}

.video-wrapper video {
  width: 100%;
  height: 380px;
  object-fit: cover;
  border-radius: 20px;
  display: block;
}

.video-wrapper {
  position: relative;
  border-radius: 20px;
  overflow: hidden;
}

.custom-video {
  width: 100%;
  display: block;
}

.custom-play-btn {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 80px;
  height: 80px;
  border-radius: 50%;
  background: rgba(27, 13, 215, 0.6);
  color: #fff;
  font-size: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: .3s;
  z-index: 10;
}

.security-page {
  padding: 100px 0 20px;
  background: #f7f9fc;
  font-family: Arial, sans-serif;
}

.security-hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 30px;
  flex-wrap: wrap;
}

.security-content {
  width: 600px;
}

.security-image {
  flex: 1;
  text-align: center;
}

.security-image img {
  max-width: 100%;
  width: 100%;
}

.c-tag .tag {
  display: inline-block;
  background: #e9f2ff;
  color: #0d47a1;
  padding: 8px 18px;
  border-radius: 30px;
  font-size: 13px;
  font-weight: 700;
  margin-bottom: 20px;
}

.security-content h1 {
  line-height: 1.2;
  margin-bottom: 20px;
}

.security-content h1 span {
  color: #0b46d3;
}

.security-content p {
  line-height: 1.8;
}

.badge-list {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 30px;
}

.badge-list span {
  padding: 1px 12px;
  background: #010ca8;
  color: #fff;
  border-radius: 30px;
  box-shadow: 0 4px 15px rgba(0, 0, 0, .08);
  font-size: 14px;
  font-weight: 600;
}

.security-layer-section {
  padding: 40px 0;
  background: #f8fbff;
  position: relative;
  overflow: hidden;
}

/* Background Lines */

.security-layer-section::before {
  content: "";
  position: absolute;
  width: 700px;
  height: 700px;
  border: 1px dashed rgba(16, 82, 255, .12);
  border-radius: 50%;
  top: -300px;
  left: -250px;
}

.security-layer-section::after {
  content: "";
  position: absolute;
  width: 500px;
  height: 500px;
  border: 1px dashed rgba(16, 82, 255, .08);
  border-radius: 50%;
  bottom: -220px;
  right: -180px;
}

.section-heading {
  text-align: center;
  max-width: 700px;
  margin: auto;
  margin-bottom: 30px;
}



.section-heading h2 {
  margin: 20px 0;
  color: #111827;
}

.section-heading p {
  font-size: 20px;
  line-height: 30px;
}

.security-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 35px;
}

.custmlayer {
  max-width: 1600px;
}

/* Card */

.security-card {
  position: relative;
  background: #fff;
  border-radius: 24px;
  padding: 30px 25px;
  text-align: center;
  overflow: hidden;
  transition: .4s;
  border: 1px solid #edf2ff;
  box-shadow: 0 10px 35px rgba(0, 0, 0, .05);
}

/* Animated Top Line */

.security-card::before {
  content: "";
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 4px;
  background: linear-gradient(135deg, #010ca8, #010ca8);
  transition: .5s;
}

.security-card:hover::before {
  left: 0;
}

/* Corner Decoration */

.security-card::after {
  content: "";
  position: absolute;
  width: 140px;
  height: 140px;
  border: 1px dashed rgba(36, 83, 212, .12);
  border-radius: 50%;
  top: -70px;
  right: -70px;
}

/* Hover */

.security-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 20px 45px rgba(36, 83, 212, .15);
}

/* Icon */

.security-icon {
  width: 90px;
  height: 90px;
  margin: auto;
  margin-bottom: 25px;
  border-radius: 50%;
  background: linear-gradient(135deg, #010ca8, #010ca8);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 38px;
  position: relative;
}

.security-icon::before {
  content: "";
  position: absolute;
  width: 115px;
  height: 115px;
  border: 2px dashed #fff;
  border-radius: 50%;
}

/* Text */

.security-card h3 {
  font-size: 20px;
  font-weight: 600;
  margin-bottom: 18px;
}

.security-card p {
  color: #667085;
  font-size: 17px;
  line-height: 30px;
}

/* Responsive */

@media(max-width:991px) {

  .security-grid {
    grid-template-columns: 1fr;
  }

  .section-heading h2 {
    font-size: 36px;
  }

  .security-card {
    padding: 35px 25px;
  }

  .security-card h3 {
    font-size: 24px;
  }

}

.encryption-section {
  padding: 40px 0;
  background: #f8fbff;
  overflow: hidden;
}

.encryption-wrapper {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 80px;
  flex-wrap: wrap;
}

.encryption-content {
  flex: 1;
  min-width: 320px;
}



.section-tag i {
  font-size: 14px;
}



.encryption-content p {
  margin: 25px 0 40px;
  line-height: 32px;
}

.encryption-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 22px;
  margin-top: 40px;
}

.list-item {
  background: #fff;
  border: 1px solid #edf1f7;
  border-radius: 18px;
  padding: 17px 5px;
  display: flex;
  align-items: center;
  gap: 18px;
  min-height: 110px;
  transition: .35s;
  box-shadow: 0 5px 20px rgba(0, 0, 0, .04);
}

.list-item:hover {
  transform: translateY(-5px);
  box-shadow: 0 15px 35px rgba(34, 87, 255, .12);
  border-color: #d9e5ff;
}

.list-icon {
  width: 62px;
  height: 62px;
  min-width: 62px;
  border-radius: 50%;
  background: #edf4ff;
  display: flex;
  align-items: center;
  justify-content: center;
}

.list-icon i {
  font-size: 25px;
  color: #010ca8;
}

.divider {
  width: 1px;
  height: 55px;
  background: #e5e7eb;
}

.list-content {
  flex: 1;
}

.list-content h5 {
  margin: 0 0 6px;
  font-size: 17px;
  font-weight: 600;
  color: #162033;
}

.list-content p {
  margin: 0;
  color: #5f6b7a;
  font-size: 18px;
  line-height: 28px;
}

@media(max-width:991px) {

  .encryption-list {
    grid-template-columns: 1fr;
  }

  .list-item {
    min-height: auto;
  }

  .list-content h5 {
    font-size: 20px;
  }

  .list-content p {
    font-size: 16px;
    line-height: 24px;
  }

}

/* Right Side */

.encryption-image {
  flex: 1;
  min-width: 320px;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
}

.encryption-image img {
  width: 100%;
  max-width: 520px;
  position: relative;
  z-index: 2;
  animation: float 4s ease-in-out infinite;
}

/* Decorative circles */

.circle {
  position: absolute;
  border-radius: 50%;
  z-index: 1;
}

.circle.one {
  width: 650px;
  height: 650px;
  background: linear-gradient(135deg, #0057ff, #6ec6ff);
  opacity: .08;
}

.circle.two {
  width: 610px;
  height: 610px;
  /* border:2px dashed #555555; */
  animation: rotate 60s linear infinite;
}

/* .circle{
    border: 2px solid rgb(1 12 168 / 22%);
    box-shadow: 0 0 20px rgb(1 12 168 / 36%), 0 0 50px rgb(1 12 168 / 23%);
} */
.circle {
  border: 2px solid rgba(75, 124, 255, .15);
  box-shadow:
    0 0 20px rgba(75, 124, 255, .15),
    0 0 50px rgba(75, 124, 255, .08);
}

/* Animation */

@keyframes float {

  0%,
  100% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(-12px);
  }
}

@keyframes rotate {
  from {
    transform: rotate(0deg);
  }

  to {
    transform: rotate(360deg);
  }
}

/* Responsive */

@media(max-width:991px) {

  .encryption-wrapper {
    flex-direction: column-reverse;
    gap: 50px;
  }

  .encryption-content h2 {
    font-size: 36px;
  }

  .encryption-list {
    grid-template-columns: 1fr;
  }

}

.role-section {
  padding: 40px 0;
  background: #f8fbff;
  position: relative;
  overflow: hidden;
}

.role-heading {
  text-align: center;
  max-width: 850px;
  margin: auto auto 30px;
}


.role-heading h2 {
  color: #172033;
  margin: 15px 0;
}

.role-heading p {
  font-size: 17px;
  line-height: 32px;
}

/* Cards */

.role-wrapper {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 35px;
  position: relative;
}

.role-line {
  position: absolute;
  top: 45px;
  left: 12%;
  width: 76%;
  height: 3px;
  background: linear-gradient(to right, #4f7cff, #010ca8);
  z-index: 0;
  opacity: .25;
}

.role-card {
  position: relative;
  z-index: 2;
  background: #fff;
  border-radius: 22px;
  padding: 40px 30px;
  text-align: center;
  border: 1px solid #edf2ff;
  box-shadow: 0 10px 35px rgba(0, 0, 0, .05);
  transition: .35s;
}

.role-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 20px 45px rgba(37, 99, 235, .12);
}

.role-card.active {
  border: 2px solid #2563eb;
}

.role-icon {
  width: 82px;
  height: 82px;
  margin: auto;
  margin-bottom: 22px;
  border-radius: 50%;
  background: linear-gradient(135deg, #2563eb, #010ca8);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 34px;
  box-shadow: 0 10px 30px rgba(37, 99, 235, .25);
}

.role-card h3 {
  font-size: 26px;
  margin-bottom: 15px;
}

.role-card p {
  color: #667085;
  line-height: 30px;
  font-size: 17px;
}

/* Bottom Note */

.permission-note {
  margin-top: 60px;
  background: #fff;
  border-left: 5px solid #010ca8;
  border-radius: 14px;
  padding: 22px 25px;
  font-size: 17px;
  box-shadow: 0 5px 20px rgba(0, 0, 0, .05);
}

.permission-note i {
  color: #010ca8;
  margin-right: 10px;
  font-size: 20px;
}

/* Mobile */

@media(max-width:991px) {

  .role-wrapper {
    grid-template-columns: 1fr;
  }

  .role-line {
    display: none;
  }

  .role-heading h2 {
    font-size: 34px;
  }

}

.compliance-section {
  padding: 40px 0;
  background: linear-gradient(to bottom, #f8fbff, #ffffff);
  position: relative;
  overflow: hidden;
}

.section-title {
  max-width: 800px;
  margin: auto;
  text-align: center;
  margin-bottom: 30px;
}



.section-title h2 {
  margin: 15px 0;
}

.section-title p {
  color: #212529;
  font-size: 20px;
  line-height: 30px;
  font-weight: 500;
}

/* Grid */

.compliance-grid {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 30px;
}

/* Card */

.compliance-card {
  position: relative;
  background: #fff;
  padding: 45px 35px;
  border-radius: 22px;
  overflow: hidden;
  transition: .35s;
  border: 1px solid #edf2ff;
  box-shadow: 0 10px 35px rgba(0, 0, 0, .05);
  flex: 0 1 380px;
  width: 100%;
  max-width: 380px;
}

/* Top Gradient */

.compliance-card::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 5px;
  background: linear-gradient(90deg, #2563eb, #55c2ff);
}

/* Background Circle */

.compliance-card::after {
  content: "";
  position: absolute;
  width: 160px;
  height: 160px;
  border-radius: 50%;
  background: rgba(37, 99, 235, .04);
  right: -60px;
  top: -60px;
}

/* Hover */

.compliance-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 20px 45px rgba(37, 99, 235, .12);
}

/* Icon */

.icon-box {
  width: 80px;
  height: 80px;
  border-radius: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 34px;
  margin-bottom: 25px;
  color: #fff;
}

.iso {
  background: linear-gradient(135deg, #2563eb, #010ca8);
}

.gdpr {
  background: linear-gradient(135deg, #2563eb, #010ca8);
}

.hipaa {
  background: linear-gradient(135deg, #2563eb, #010ca8);
}

/* Text */

.compliance-card h3 {
  font-size: 28px;
  color: #172033;
  margin-bottom: 18px;
}

.compliance-card p {
  color: #667085;
  line-height: 30px;
  font-size: 17px;
}

/* Mobile */

@media(max-width:991px) {

  .compliance-grid {
    grid-template-columns: 1fr;
  }

  .section-title h2 {
    font-size: 34px;
  }

}

.azure-section {
  padding: 40px 0;
  background: #fff;
}


.section-heading h2 {
  margin-bottom: 15px;
}

.section-heading p {

  line-height: 30px;
  max-width: 900px;
  margin-bottom: 50px;
}

.azure-card {
  background: #fff;
  border: 1px solid #e7e7e7;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(0, 0, 0, .05);
  transition: .3s;
}

.azure-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 20px 40px rgba(0, 87, 255, .08);
}

.azure-card h3 {
  margin: 0;
  padding: 22px 25px;
  font-size: 24px;
  font-weight: 700;
  color: #1d2939;
  border-bottom: 1px solid #ececec;
  background: #eaeaea;
}

.azure-card ul {
  list-style: none;
  margin: 0;
  padding: 25px;
}

.azure-card ul li {
  position: relative;
  padding-left: 28px;
  margin-bottom: 20px;
  font-size: 17px;
}

.azure-card ul li:last-child {
  margin-bottom: 0;
}

.azure-card ul li::before {
  content: "✓";
  position: absolute;
  left: 0;
  top: 0;
  color: #00a870;
  font-weight: bold;
}

/* cta */
.security-contact-section {
  padding: 30px 0;
  background: #f0f0f0;
}

.security-contact-card {
  max-width: 1750px;
  margin: auto;
  padding: 40px 50px;
  border-radius: 30px;
  text-align: center;
  position: relative;
  overflow: hidden;

  background: linear-gradient(135deg, #0113b3, #0d1579);

  box-shadow:
    0 20px 60px rgba(11, 92, 255, .20);
}

/* Decorative circles */

.security-contact-card::before {
  content: "";
  position: absolute;
  width: 280px;
  height: 280px;
  border-radius: 50%;
  background: rgba(255, 255, 255, .08);
  top: -120px;
  left: -120px;
}

.security-contact-card::after {
  content: "";
  position: absolute;
  width: 220px;
  height: 220px;
  border-radius: 50%;
  background: rgba(255, 255, 255, .08);
  bottom: -100px;
  right: -80px;
}

/* Icon */

.security-icon {
  width: 90px;
  height: 90px;
  margin: auto;
  border-radius: 50%;
  background: linear-gradient(135deg, #2563eb, #010ca8);
  backdrop-filter: blur(8px);

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

  margin-bottom: 25px;
}

.security-icon i {
  font-size: 30px;
  color: #fff;
}

.section-label {
  display: inline-block;
  padding: 8px 18px;
  border-radius: 30px;
  background: rgba(255, 255, 255, .18);
  color: #fff;
  font-size: 13px;
  letter-spacing: 1px;
  font-weight: 600;
}

.security-contact-card h2 {
  color: #fff;
  margin: 25px 0 20px;
}

.security-contact-card p {
  color: rgba(255, 255, 255, .92);
  max-width: 760px;
  margin: auto;
  line-height: 32px;
  font-size: 17px;
}

/* Buttons */

.security-btns {
  margin-top: 40px;
  display: flex;
  justify-content: center;
  gap: 20px;
  flex-wrap: wrap;
}

.mega-btn-group {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.custm_width1 {
  width: 1500px;
}

/* Video Section Background & Wrapper */
.video-section-area {
  position: relative;
  overflow: hidden;
  background: radial-gradient(circle at 50% 50%, #fafcff 0%, #edf2f9 100%);
  padding: 50px 0;
}

.video-section-area h2 {
  color: #0f172a !important;
  /* Rich Dark Slate Title */
}

.video-bg-svg-wrapper {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  pointer-events: none;
}

.video-mesh-overlay {
  position: absolute;
  inset: 0;
  background-image: radial-gradient(rgba(37, 99, 235, 0.12) 1px, transparent 1px);
  background-size: 24px 24px;
  opacity: 0.3;
}

.video-glow-spot {
  position: absolute;
  width: 450px;
  height: 450px;
  border-radius: 50%;
  filter: blur(120px);
  opacity: 0.12;
  pointer-events: none;
}

.video-glow-spot.spot-blue {
  background: #2563eb;
  top: -10%;
  left: -5%;
}

.video-glow-spot.spot-purple {
  background: #a855f7;
  bottom: -10%;
  right: -5%;
}

.story-badge {
  display: inline-block;
  font-family: "Figtree", sans-serif;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 2px;
  color: #2563eb;
  margin-bottom: 12px;
  padding: 6px 16px;
  background: rgba(37, 99, 235, 0.05);
  border-radius: 100px;
  border: 1px solid rgba(37, 99, 235, 0.1);
}

/* Video Accordion Section Card Finishing */
.video-accordion-container {
  display: flex;
  gap: 20px;
  width: 100%;
  height: 520px;
  margin-top: 40px;
}

.video-accordion-item {
  position: relative;
  flex: 1;
  height: 100%;
  border-radius: 24px;
  overflow: hidden;
  cursor: pointer;
  background: #090d16;
  border: 1px solid rgba(37, 99, 235, 0.08);
  transition: flex 0.6s cubic-bezier(0.25, 1, 0.5, 1),
    transform 0.4s cubic-bezier(0.25, 1, 0.5, 1),
    box-shadow 0.4s cubic-bezier(0.25, 1, 0.5, 1),
    border-color 0.4s cubic-bezier(0.25, 1, 0.5, 1);
  box-shadow: 0 10px 30px rgba(9, 13, 22, 0.04);
}

/* Glowing border and lift effect on active card */
.video-accordion-container:hover .video-accordion-item {
  flex: 0.55;
}

.video-accordion-container .video-accordion-item:hover,
.video-accordion-container .video-accordion-item.active {
  flex: 4.8;
}

.video-accordion-container .video-accordion-item.active {
  border-color: rgba(37, 99, 235, 0.35);
  box-shadow: 0 25px 50px rgba(37, 99, 235, 0.12), 0 0 0 1px rgba(37, 99, 235, 0.15);
}

/* Background image */
.video-accordion-bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  z-index: 0;
  transition: filter 0.6s cubic-bezier(0.25, 1, 0.5, 1),
    transform 0.6s cubic-bezier(0.25, 1, 0.5, 1);
}

.video-accordion-item:not(.active) .video-accordion-bg {
  filter: brightness(0.5) contrast(1.1) saturate(0.8);
}

.video-accordion-item.active .video-accordion-bg {
  filter: brightness(0.85) contrast(1) saturate(1);
  transform: scale(1.03);
}

.video-accordion-item:hover .video-accordion-bg,
.video-accordion-item.active:hover .video-accordion-bg {
  filter: brightness(1) contrast(1) saturate(1) !important;
  transform: scale(1.04);
}

/* Gradient overlay */
.video-accordion-item::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(to top,
      rgba(9, 13, 22, 0.85) 0%,
      rgba(9, 13, 22, 0.3) 50%,
      rgba(9, 13, 22, 0) 100%);
  z-index: 1;
  pointer-events: none;
  transition: opacity 0.4s ease;
  opacity: 0.6;
}

.video-accordion-item.active::before {
  opacity: 0.4;
}

/* Remove dark black overlay completely on hover */
.video-accordion-item:hover::before,
.video-accordion-item.active:hover::before {
  opacity: 0 !important;
}

/* Content Container */
.video-accordion-content {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 40px;
  z-index: 2;
  color: #fff;
  opacity: 0;
  visibility: hidden;
  transform: translateY(15px);
  transition: opacity 0.35s cubic-bezier(0.25, 1, 0.5, 1) 0.15s,
    visibility 0.35s cubic-bezier(0.25, 1, 0.5, 1) 0.15s,
    transform 0.35s cubic-bezier(0.25, 1, 0.5, 1) 0.15s;
}

.video-accordion-item:hover .video-accordion-content,
.video-accordion-item.active .video-accordion-content {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

/* Brand badge */
.video-accordion-logo {
  font-family: "Outfit", "Inter", sans-serif;
  font-size: 24px;
  font-weight: 700;
  margin-bottom: 16px;
  color: #ffffff;
  letter-spacing: -0.5px;
  display: inline-block;
  padding: 4px 0;
  border-bottom: 2px solid #2563eb;
}

/* Quote/Testimonial Text */
.video-accordion-quote {
  font-family: "Figtree", sans-serif;
  font-size: 18px;
  line-height: 1.6;
  color: #cbd5e1;
  max-width: 75%;
  font-weight: 400;
  margin: 0;
}

.video-accordion-quote strong,
.video-accordion-quote b {
  color: #ffffff;
  font-weight: 700;
}

/* Play button */
.video-accordion-play {
  position: absolute;
  bottom: 40px;
  right: 40px;
  width: 60px;
  height: 60px;
  border: 2px solid rgba(255, 255, 255, 0.85);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #ffffff;
  font-size: 18px;
  background: rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(8px);
  transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  cursor: pointer;
  z-index: 3;
}

.video-accordion-play i {
  margin-left: 4px;
  /* visual alignment of play triangle */
}

.video-accordion-item.active .video-accordion-play {
  opacity: 1;
  transform: translateY(0);
}

.video-accordion-item:not(.active) .video-accordion-play {
  opacity: 0;
  transform: translateY(10px);
}

.video-accordion-item:hover .video-accordion-play:hover,
.video-accordion-item.active .video-accordion-play:hover {
  background: #ffffff;
  color: #0f172a;
  transform: scale(1.08);
  border-color: #ffffff;
  box-shadow: 0 0 20px rgba(255, 255, 255, 0.4);
}

/* Responsive Styles */
@media (max-width: 991px) {
  .video-accordion-container {
    flex-direction: column;
    height: auto;
    gap: 15px;
  }

  .video-accordion-item {
    height: 280px;
    flex: none !important;
    width: 100%;
  }

  .video-accordion-content {
    padding: 24px;
  }

  .video-accordion-logo {
    font-size: 22px;
    margin-bottom: 10px;
  }

  .video-accordion-quote {
    font-size: 15px;
    max-width: 85%;
  }

  .video-accordion-play {
    bottom: 24px;
    right: 24px;
    width: 44px;
    height: 44px;
    font-size: 13px;
  }
}

/* Magnific Popup Premium Customizations */
.mfp-bg {
  background: rgba(15, 23, 42, 0.85) !important;
  /* Slate dark overlay */
  backdrop-filter: blur(8px);
  /* premium glassmorphic backdrop blur */
  opacity: 0;
  transition: opacity 0.35s ease;
}

.mfp-bg.mfp-ready {
  opacity: 1 !important;
}

.mfp-bg.mfp-removing {
  opacity: 0 !important;
}

/* Lightbox Wrapper Container & Scale Transitions */
.mfp-wrap {
  opacity: 0;
  transition: opacity 0.35s ease, transform 0.35s cubic-bezier(0.25, 1, 0.5, 1);
  transform: scale(0.96);
}

.mfp-wrap.mfp-ready {
  opacity: 1 !important;
  transform: scale(1);
}

.mfp-wrap.mfp-removing {
  opacity: 0 !important;
  transform: scale(0.96);
}

/* Video wrapper frame with rounded corners & shadow */
.mfp-iframe-scaler {
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 30px 70px rgba(0, 0, 0, 0.6);
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: #000;
}

/* White popup container for Magnific Popup HTML5 Inline Player */
.white-popup {
  position: relative;
  background: #000;
  padding: 0;
  width: 100%;
  max-width: 960px;
  margin: 40px auto;
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 30px 70px rgba(0, 0, 0, 0.7);
  border: 1px solid rgba(255, 255, 255, 0.12);
  line-height: 0;
  /* fixes inline video white strip spacing */
}

.premium-lightbox-video {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 20px;
  outline: none;
}

/* Custom Close button styling for Iframe & Inline Popups */
.mfp-iframe-holder .mfp-close,
.mfp-inline-holder .mfp-close {
  color: rgba(255, 255, 255, 0.8) !important;
  right: 10px;
  top: -45px;
  font-size: 26px;
  width: 32px;
  height: 32px;
  line-height: 32px;
  transition: all 0.25s cubic-bezier(0.25, 1, 0.5, 1);
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.15);
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.mfp-iframe-holder .mfp-close:hover,
.mfp-inline-holder .mfp-close:hover {
  color: #ffffff !important;
  background: rgba(255, 255, 255, 0.2);
  border-color: rgba(255, 255, 255, 0.3);
  transform: scale(1.05);
}

/* CSS Tooltip for Close Button matching reference */
.mfp-iframe-holder .mfp-close::after,
.mfp-inline-holder .mfp-close::after {
  content: "Close";
  position: absolute;
  bottom: -28px;
  right: 0;
  background: #111;
  color: #eee;
  font-size: 11px;
  font-family: "Figtree", sans-serif;
  padding: 3px 8px;
  border-radius: 4px;
  border: 1px solid rgba(255, 255, 255, 0.18);
  line-height: 1.2;
  opacity: 0;
  pointer-events: none;
  transition: all 0.2s ease;
  white-space: nowrap;
}

.mfp-iframe-holder .mfp-close:hover::after,
.mfp-inline-holder .mfp-close:hover::after {
  opacity: 1;
}

/*=========================================
CONTACT SECTION
==========================================*/
.ob-contact-section {
  background: #f7f9ff;
  padding: 100px 0;
  padding-bottom: 20px;
  position: relative;
}

.contact-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 18px;
  border-radius: 50px;
  background: #eef2ff;
  color: #2d5bff;
  font-weight: 600;
  font-size: 13px;
  margin-bottom: 20px;
}

.contact-title {
  font-size: 40px;
  font-weight: 700;
  margin-bottom: 20px;
  color: #0f172a;
}

.contact-subtitle {
  max-width: 700px;
  margin: auto;
  color: #000000;
  line-height: 1.8;
}

.contact-form-box {
  background: #fff;
  border-radius: 22px;
  padding: 35px;
  box-shadow: 0 15px 45px rgba(40, 60, 120, .08);
}

.input-box {
  display: flex;
  align-items: center;
  border: 1px solid #e8ebf5;
  border-radius: 12px;
  padding: 0 18px;
  height: 60px;
  background: #fff;
}

.input-box i {
  color: #4464ff;
  margin-right: 15px;
  width: 18px;
}

.input-box input {
  border: 0;
  width: 100%;
  outline: none;
  background: none;
}

.textarea-box {
  align-items: flex-start;
  height: auto;
  padding-top: 18px;
}

.textarea-box textarea {
  width: 100%;
  border: 0;
  outline: none;
  resize: none;
  background: none;
}

.contact-bottom {
  margin-top: 30px;
  display: flex;
  align-items: center;
  gap: 20px;
  flex-wrap: wrap;
}

.contact-btn {
  background: linear-gradient(90deg, #2748ff, #5d6dff);
  color: #fff;
  border: 0;
  padding: 16px 38px;
  border-radius: 10px;
  font-weight: 600;
  transition: .3s;
}

.contact-btn:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 25px rgba(61, 86, 255, .35);
}

.privacy-text {
  display: flex;
  gap: 15px;
  color: #000000;
  font-size: 14px;
}

.privacy-text i {
  color: #4a64ff;
  margin-top: 5px;
}

.contact-info-card {
  position: relative;
  overflow: hidden;

  background-image: url("../images/contact-ai.png");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;

  border-radius: 22px;
  height: 100%;

  display: flex;
  justify-content: center;
  align-items: center;
  padding: 30px;
}

.ai-img {
  width: 100%;
  max-width: 550px;
}

.email-card {
  position: absolute;
  bottom: 35px;
  left: 35px;
  right: 35px;
  background: #fff;
  border-radius: 18px;
  padding: 25px;
  display: flex;
  align-items: center;
  gap: 18px;
  box-shadow: 0 20px 40px rgba(0, 0, 0, .08);
}

.email-icon {
  width: 80px;
  height: 62px;
  background: #3454ff;
  color: #fff;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 22px;
}

.email-card span {
  color: #3556ff;
  font-weight: 700;
  font-size: 13px;
}

.email-card h5 {
  margin: 8px 0;
  font-weight: 700;
}

.email-card p {
  margin: 0;
  color: #000000;
}

.contact-features {
  border-radius: 22px;
  margin-top: 45px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  box-shadow: 0 10px 40px rgba(0, 0, 0, .06);
}

.feature-item {
  padding: 28px;
  display: flex;
  gap: 18px;
  align-items: center;
}

.feature-item:not(:last-child) {
  border-right: 1px solid #edf0f7;
}

.feature-icon {
  width: 70px;
  height: 54px;
  border-radius: 50%;
  background: #eef2ff;
  color: #3152ff;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 22px;
}

.feature-item h6 {
  font-weight: 700;
  margin-bottom: 6px;
}

.feature-item p {
  margin: 0;
  color: #000000;
  font-size: 14px;
}

@media(max-width:991px) {

  .contact-title {
    font-size: 34px;
  }

  .contact-info-card {
    min-height: 450px;
  }

  .contact-features {
    grid-template-columns: 1fr;
  }

  .feature-item {
    border-right: 0 !important;
    border-bottom: 1px solid #edf0f7;
  }

  .feature-item:last-child {
    border-bottom: 0;
  }

  .contact-bottom {
    flex-direction: column;
    align-items: flex-start;
  }

}

/*=====================================
 BLOG SECTION
======================================*/

.ob-blog-area {
  position: relative;
  padding: 110px 0;
  background: #fff;
  overflow: hidden;
}

.ob-blog-area .container {
  position: relative;
  z-index: 5;
}

/* Decorative Blur */

.ob-blur {
  position: absolute;
  border-radius: 50%;
  filter: blur(120px);
  z-index: 1;
}

.blur-one {
  width: 350px;
  height: 350px;
  background: #edf1ff;
  top: -120px;
  left: -120px;
}

.blur-two {
  width: 300px;
  height: 300px;
  background: #efeaff;
  right: -120px;
  bottom: -120px;
}

/*==========================
 Heading
===========================*/

.ob-blog-heading {
  max-width: 760px;
  margin: auto;
  margin-bottom: 55px;
}

.ob-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 9px 22px;
  border-radius: 40px;
  background: #eef2ff;
  color: #3157ff;
  font-weight: 700;
  font-size: 14px;
  letter-spacing: .4px;
  margin-bottom: 22px;
}

.ob-blog-heading h2 {
  font-size: 40px;
  line-height: 1.1;
  font-weight: 700;
  margin-bottom: 22px;
}

.ob-blog-heading p {
  line-height: 34px;
  margin-bottom: 20px;
}

.ob-view-all {
  color: #2d57ff;
  text-decoration: none;
  font-size: 18px;
  font-weight: 700;
}

.ob-view-all i {
  margin-left: 8px;
  transition: .3s;
}

.ob-view-all:hover i {
  transform: translateX(8px);
}

/*=========================
 Category Tabs
==========================*/

.ob-blog-tabs {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: 18px;
  background: #fff;
  border-radius: 70px;
  padding: 20px 28px;
  margin-bottom: 65px;
  box-shadow: 0 10px 40px rgba(20, 40, 120, .08);
}

.ob-blog-tabs a {
  text-decoration: none;
  color: #141b39;
  font-weight: 700;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 25px;
  border-radius: 40px;
  transition: .35s;
}

.ob-blog-tabs a i {
  color: #4f67ff;
}

.ob-blog-tabs a:hover {
  background: #3157ff;
  color: #fff;
}

.ob-blog-tabs a:hover i {
  color: #fff;
}

.ob-blog-tabs a.active {
  background: #3157ff;
  color: #fff;
}

.ob-blog-tabs a.active i {
  color: #fff;
}

/*=========================
 Cards
==========================*/

.ob-blog-card {
  background: #fff;
  border-radius: 24px;
  overflow: hidden;
  box-shadow: 0 18px 55px rgba(30, 45, 100, .12);
  transition: .45s;
  height: 100%;
}

.ob-blog-card:hover {
  transform: translateY(-12px);
  box-shadow: 0 25px 70px rgba(30, 45, 100, .18);
}

.ob-blog-image {
  position: relative;
  overflow: hidden;
}

.ob-blog-image img {
  width: 100%;
  height: 265px;
  object-fit: cover;
  transition: .6s;
}

.ob-blog-card:hover .ob-blog-image img {
  transform: scale(1.08);
}

.ob-category {
  position: absolute;
  left: 22px;
  bottom: 22px;
  padding: 10px 18px;
  color: #fff;
  border-radius: 30px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .4px;
}

.ob-category.blue {
  background: #010ca8;
}

.ob-category.purple {
  background: #010ca8;
}

.ob-category.green {
  background: #010ca8;
}

.ob-icon {
  position: absolute;
  top: 20px;
  left: 20px;
  width: 58px;
  height: 58px;
  border-radius: 50%;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  color: #3157ff;
  box-shadow: 0 8px 25px rgba(0, 0, 0, .12);
}

.ob-blog-content {
  padding: 30px;
}

.ob-meta {
  display: flex;
  gap: 30px;
  color: #7b8398;
  font-size: 15px;
  margin-bottom: 18px;
}

.ob-meta span {
  display: flex;
  align-items: center;
  gap: 8px;
}

.ob-meta i {
  color: #3157ff;
}

.ob-blog-content h3 {
  margin-bottom: 18px;
}

.ob-blog-content h3 a {
  text-decoration: none;
  color: #121b3d;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.25;
  transition: .3s;
}

.ob-blog-content h3 a:hover {
  color: #010ca8;
}

.ob-blog-content p {
  line-height: 32px;
  font-size: 17px;
  margin-bottom: 28px;
}

.ob-author {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-top: 1px solid #eef1f8;
  padding-top: 25px;
}

.ob-user {
  display: flex;
  align-items: center;
  gap: 14px;
}

.ob-user img {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  object-fit: cover;
}

.ob-user h6 {
  margin: 0;
  font-size: 18px;
  font-weight: 700;
  color: #172040;
}

.ob-user small {
  color: #7b8598;
  font-size: 14px;
}

.ob-arrow {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: #eef2ff;
  display: flex;
  justify-content: center;
  align-items: center;
  text-decoration: none;
  color: #3157ff;
  font-size: 18px;
  transition: .35s;
}

.ob-arrow:hover {
  background: #3157ff;
  color: #fff;
  transform: rotate(-45deg);
}

/*==========================
 Responsive
===========================*/

@media(max-width:991px) {

  .ob-blog-heading h2 {
    font-size: 42px;
  }

  .ob-blog-heading p {
    font-size: 18px;
    line-height: 30px;
  }

  .ob-blog-tabs {
    justify-content: flex-start;
    overflow-x: auto;
    flex-wrap: nowrap;
    padding: 15px;
  }

  .ob-blog-tabs::-webkit-scrollbar {
    display: none;
  }

  .ob-blog-content h3 a {
    font-size: 28px;
  }

}

@media(max-width:767px) {

  .ob-blog-area {
    padding: 80px 0;
  }

  .ob-blog-heading h2 {
    font-size: 34px;
  }

  .ob-blog-heading p {
    font-size: 16px;
    line-height: 28px;
  }

  .ob-blog-image img {
    height: 220px;
  }

  .ob-blog-content {
    padding: 22px;
  }

  .ob-blog-content h3 a {
    font-size: 24px;
  }

  .ob-meta {
    flex-direction: column;
    gap: 8px;
  }

  .ob-author {
    flex-direction: column;
    gap: 20px;
    align-items: flex-start;
  }

}

/* ==========================================================================
   PREMIUM WHITE HEADER & RESOURCES DROPDOWN MENUS (By Antigravity)
   ========================================================================== */

/* 1. Header Container and Background */
.header-area.homepage2 {
  background-color: #ffffff !important;
  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.03) !important;
  border-bottom: 1px solid rgba(226, 232, 240, 0.8) !important;
  position: absolute;
  width: 100%;
  z-index: 99;
  transition: all 0.4s ease-in-out;
}

/* Sticky state header background */
.header-area.homepage2.sticky {
  background-color: #ffffff !important;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05) !important;
  border-bottom: 1px solid rgba(226, 232, 240, 0.8) !important;
}

/* 2. Menu Links Color and Styling */
.header-area.homepage2 .header-elements .main-menu ul li a {
  color: #334155 !important;
  /* Slate-700 */
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 16px !important;
  font-weight: 600 !important;
  transition: all 0.25s ease-in-out;
  padding: 8px 14px !important;
  border-radius: 6px !important;
}

/* Menu links hover state */
.header-area.homepage2 .header-elements .main-menu ul li:hover>a {
  color: #2563eb !important;
  /* Premium Blue */
  background-color: transparent !important;
}

/* Active Link State */
.header-area.homepage2 .header-elements .main-menu .nav-item .nav-link.active {
  color: #2563eb !important;
  background: none !important;
}

.header-area.homepage2 .header-elements .main-menu .nav-item .nav-link.active span {
  color: #2563eb !important;
}

/* Disable Underline Animation */
.main-menu .nav-link::after {
  display: none !important;
}

/* 3. Resources Custom Dropdown Menu styling */
.dropdown-custom {
  position: relative;
}

.dropdown-toggle-custom {
  display: flex !important;
  align-items: center;
  gap: 6px;
  cursor: pointer;
}

.dropdown-arrow {
  font-size: 11px;
  transition: transform 0.2s ease;
  color: #64748b;
}

.dropdown-menu-custom {
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%) translateY(10px);
  background: #ffffff;
  border-radius: 12px;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.08);
  border: 1px solid rgba(226, 232, 240, 0.8);
  min-width: 280px;
  opacity: 0;
  visibility: hidden;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
  z-index: 1000;
  padding: 12px;
  margin: 0;
  list-style: none;
}

/* Show dropdown menu on hover */
.dropdown-custom:hover .dropdown-menu-custom {
  opacity: 1;
  visibility: visible;
  transform: translateX(-50%) translateY(2px);
}

.dropdown-custom:hover .dropdown-arrow {
  transform: rotate(180deg);
  color: #2563eb;
}

/* Dropdown list item styles */
.dropdown-menu-custom li {
  display: block !important;
  margin-bottom: 4px;
}

.dropdown-menu-custom li:last-child {
  margin-bottom: 0;
}

.dropdown-menu-custom li a {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 8px 12px !important;
  border-radius: 8px !important;
  background-color: transparent !important;
  text-decoration: none !important;
  transition: all 0.2s ease !important;
  text-align: left;
}

.dropdown-menu-custom li a:hover {
  background-color: #f1f5f9 !important;
}

.dropdown-menu-custom li a:hover .mega-icon-wrapper-large {
  background-color: #2563eb !important;
  color: #ffffff !important;
  transform: scale(1.05) !important;
}

/* Dropdown Icon */
.dropdown-icon {
  font-size: 16px;
  color: #2563eb;
  margin-top: 3px;
  transition: transform 0.2s ease;
  width: 20px;
  text-align: center;
}

/* Dropdown text details */
.dropdown-text {
  display: flex;
  flex-direction: column;
}

.dropdown-text strong {
  font-family: "Figtree", sans-serif;
  font-size: 14px;
  font-weight: 600;
  color: #1e293b;
  line-height: 1.3;
}

.dropdown-text span {
  font-family: "Figtree", sans-serif;
  font-size: 11px;
  color: #64748b;
  font-weight: 400;
  margin-top: 2px;
  line-height: 1.2;
}

/* 4. Action Buttons Override (Request Demo & Free Trial) */
.header-buttons {
  display: inline-flex !important;
  align-items: center !important;
  gap: 12px !important;
  flex-shrink: 0 !important;
  white-space: nowrap !important;
}

/* Request Demo (Outline Button) */
.header-area.homepage2 .header-elements .header-buttons .header-btn2 {
  border-radius: 50px !important;
  border: 1px solid transparent !important;
  background: rgba(0, 0, 0, 0.05) !important;
  color: #334155 !important;
  font-family: "Figtree", sans-serif !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  padding: 10px 22px !important;
  transition: all 0.3s ease-in-out !important;
  margin-left: 0 !important;
  overflow: hidden;
  box-shadow: none !important;
  white-space: nowrap !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
}

.header-area.homepage2 .header-elements .header-buttons .header-btn2::after {
  display: none !important;
  /* Disable old effect */
}

.header-area.homepage2 .header-elements .header-buttons .header-btn2:hover {
  background: #1d4ed8 !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 6px 20px rgba(37, 99, 235, 0.35) !important;
  color: #ffffff !important;
}

/* Free Trial (Solid Filled Button) */
.header-area.homepage2 .header-elements .header-buttons .header-btn3 {
  border-radius: 50px !important;
  border: none !important;
  color: #ffffff !important;
  background: #2563eb !important;
  font-family: "Figtree", sans-serif !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  padding: 10px 22px !important;
  transition: all 0.3s ease-in-out !important;
  margin-left: 0 !important;
  overflow: hidden;
  box-shadow: 0 4px 14px rgba(37, 99, 235, 0.25) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  white-space: nowrap !important;
  flex-shrink: 0 !important;
}

.header-area.homepage2 .header-elements .header-buttons .header-btn3::after {
  display: none !important;
}

.header-area.homepage2 .header-elements .header-buttons .header-btn3:hover {
  background: #1d4ed8 !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 6px 20px rgba(37, 99, 235, 0.35) !important;
  color: #ffffff !important;
}

/* Adjust page contents top padding for premium header spacing */
.hero-icertis {
  padding-top: 130px !important;
}

.ob-blog-area {
  padding-top: 140px !important;
}

.ob-contact-section {
  padding-top: 90px !important;
}

.solutions-page-offset {
  padding-top: 140px !important;
}

/* ==========================================================================
   CUSTOM MEGA MENU DESIGN (Centering, Hover BG, Close Inside)
   ========================================================================== */

/* Set parent container relative for absolute positioning alignment */
.header-area.homepage2 .container {
  position: relative !important;
}

/* Main mega menu container overrides */
.header-area.homepage2 .mega-menu {
  position: absolute !important;
  top: 100% !important;
  left: 50% !important;
  transform: translateX(-50%) translateY(10px) !important;
  width: 1100px !important;
  max-width: 1100px !important;
  background: #ffffff !important;
  border-radius: 20px !important;
  border: 1px solid rgba(226, 232, 240, 0.8) !important;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.08) !important;
  padding: 16px 24px !important;
  display: block !important;
  opacity: 0 !important;
  visibility: hidden !important;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
  z-index: 1000 !important;
}

/* Active State for Mega Menu (triggered by JS) */
.header-area.homepage2 .mega-menu.active {
  opacity: 1 !important;
  visibility: visible !important;
  transform: translateX(-50%) translateY(2px) !important;
}

/* Active/Hover Arrow state for Solutions menu link */
#solutionToggle.menu-active .dropdown-arrow,
.nav-item:hover #solutionToggle .dropdown-arrow {
  transform: rotate(180deg) !important;
  color: #2563eb !important;
}

#solutionToggle.menu-active,
.header-area.homepage2 .header-elements .main-menu ul li:hover>#solutionToggle {
  color: #2563eb !important;
  background-color: transparent !important;
}

/* Container flex layout */
.mega-container-custom {
  display: flex !important;
  gap: 20px !important;
  position: relative !important;
}

/* Left Section: Industries and Platform */
.mega-left-custom {
  flex: none !important;
  width: 520px !important;
  padding-right: 20px !important;
  border-right: 1px solid #e2e8f0 !important;
}

/* Right Section: Resources and CTA */
.mega-right-custom {
  flex: 1.2 !important;
}

/* Section Header Titles */
.mega-section-title {
  font-family: "Figtree", sans-serif !important;
  ;
  text-transform: uppercase !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  color: #94a3b8 !important;
  letter-spacing: 0.1em !important;
  margin-bottom: 8px !important;
  text-align: left !important;
}

.mega-section-title.mt-4 {
  margin-top: 12px !important;
}

/* Grid Layout for Industries */
.mega-grid-industries {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 6px 16px !important;
}

.mega-grid-item {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  text-decoration: none !important;
  color: #334155 !important;
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 14px !important;
  font-weight: 600 !important;
  transition: all 0.2s ease !important;
  padding: 4px 6px !important;
  border-radius: 8px !important;
  background: transparent !important;
  text-align: left !important;
}

.mega-grid-item:hover {
  color: #2563eb !important;
  background: #f1f5f9 !important;
}

/* Premium Icon Tiles for Grid */
.mega-icon-wrapper {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 28px !important;
  height: 28px !important;
  border-radius: 6px !important;
  background-color: #eff6ff !important;
  color: #2563eb !important;
  transition: all 0.2s ease !important;
  flex-shrink: 0 !important;
}

.mega-grid-item:hover .mega-icon-wrapper {
  background-color: #2563eb !important;
  color: #ffffff !important;
  transform: scale(1.05) !important;
}

.mega-icon-wrapper i {
  font-size: 12px !important;
}

/* Right Panel List Layout */
.mega-vertical-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
}

.mega-list-item {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  text-decoration: none !important;
  color: inherit !important;
  transition: all 0.2s ease !important;
  background: transparent !important;
  text-align: left !important;
  padding: 4px 8px !important;
  border-radius: 8px !important;
  margin-left: -8px !important;
  width: calc(100% + 16px) !important;
}

.mega-list-item:hover {
  background: #f1f5f9 !important;
}

/* Premium Large Icon Tiles for List Items */
.mega-icon-wrapper-large {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 34px !important;
  height: 34px !important;
  border-radius: 8px !important;
  background-color: #eff6ff !important;
  color: #2563eb !important;
  transition: all 0.2s ease !important;
  flex-shrink: 0 !important;
}

.mega-list-item:hover .mega-icon-wrapper-large {
  background-color: #2563eb !important;
  color: #ffffff !important;
  transform: scale(1.05) !important;
}

.mega-icon-wrapper-large i {
  font-size: 14px !important;
}

.mega-list-text {
  display: flex !important;
  flex-direction: column !important;
  text-align: left !important;
}

.mega-list-text strong {
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 13px !important;
  font-weight: 700 !important;
  color: #1e293b !important;
  line-height: 1.2 !important;
}

.mega-list-text span {
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 11px !important;
  color: #64748b !important;
  font-weight: 400 !important;
  margin-top: 2px !important;
  line-height: 1.2 !important;
}

.mega-list-item:hover .mega-list-text strong {
  color: #2563eb !important;
}

.mega-grid-text {
  display: flex !important;
  flex-direction: column !important;
  text-align: left !important;
}

.mega-grid-text strong {
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 13px !important;
  font-weight: 700 !important;
  color: #1e293b !important;
  line-height: 1.2 !important;
  transition: color 0.2s ease !important;
}

.mega-grid-text span {
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 10px !important;
  color: #64748b !important;
  font-weight: 400 !important;
  margin-top: 1px !important;
  line-height: 1.2 !important;
}

.mega-grid-item:hover .mega-grid-text strong {
  color: #2563eb !important;
}

/* Bottom CTA link */
.mega-bottom-cta {
  margin-top: 4px !important;
  text-align: left !important;
}

.mega-cta-link {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 13px !important;
  font-weight: 700 !important;
  color: #2563eb !important;
  text-decoration: none !important;
  transition: all 0.2s ease !important;
}

.mega-cta-link:hover {
  gap: 10px !important;
  color: #1d4ed8 !important;
}

/* Close Button styling inside container */
.mega-close-custom {
  position: absolute !important;
  top: -4px !important;
  right: -4px !important;
  width: 28px !important;
  height: 28px !important;
  background: #f1f5f9 !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 10px !important;
  color: #64748b !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
  border: 1px solid rgba(226, 232, 240, 0.8) !important;
}

.mega-close-custom:hover {
  background: #e2e8f0 !important;
  color: #1e293b !important;
  transform: scale(1.05) !important;
}

/* ==========================================================================
   CLEAN HERO SECTION STYLING (By Antigravity)
   ========================================================================== */

.hero-section-clean {
  position: relative !important;
  background-color: #fbfdff !important;
  background-image:
    linear-gradient(to right, rgba(226, 232, 240, 0.4) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(226, 232, 240, 0.4) 1px, transparent 1px) !important;
  background-size: 50px 50px !important;
  padding-top: 100px !important;
  padding-bottom: 30px !important;
  overflow: hidden !important;
}

/* Background Curve Overlay */
.hero-bg-curves {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  pointer-events: none !important;
  z-index: 1 !important;
}

/* Header Text Badge */
.hero-badge {
  display: inline-flex !important;
  align-items: center !important;
  padding: 6px 14px !important;
  background: #eff6ff !important;
  border: 1px solid #dbeafe !important;
  color: #2563eb !important;
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 14px !important;
  font-weight: 600 !important;
  border-radius: 9999px !important;
  margin-bottom: 24px !important;
  letter-spacing: 0.02em !important;
}

/* Title and Gradients */
.hero-title {
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 45px !important;
  font-weight: 700 !important;
  line-height: 1.15 !important;
  color: #0f172a !important;
  margin-bottom: 32px !important;
  letter-spacing: -0.02em !important;
  text-transform: none !important;
  /* Prevent global uppercase capitalization */
}

.text-gradient {
  background: linear-gradient(135deg, #0025b6 0%, #a855f7 50%, #2563eb 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
  display: inline !important;
  /* Inline to flow natively inside h1 */
  font-size: inherit !important;
  font-weight: inherit !important;
  font-family: inherit !important;
  padding: 0 !important;
  margin: 0 !important;
  border-radius: 0 !important;
  line-height: inherit !important;
}

/* Button Group and Actions */
.hero-btn-group {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 16px !important;
  margin-top: 10px !important;
}

.hero-btn-primary {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 12px 26px !important;
  background: linear-gradient(135deg, #2563eb 0%, #010ca8 100%) !important;
  color: #ffffff !important;
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 15px !important;
  font-weight: 700 !important;
  border-radius: 9999px !important;
  text-decoration: none !important;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
  box-shadow: 0 4px 12px rgba(37, 99, 235, 0.25) !important;
  height: 48px !important;
  line-height: 1.2 !important;
  border: none !important;
}

.hero-btn-primary:hover {
  background: linear-gradient(135deg, #1d4ed8 0%, #010880 100%) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 20px rgba(37, 99, 235, 0.4) !important;
  color: #ffffff !important;
}

.btn-arrow-circle {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 22px !important;
  height: 22px !important;
  background: #ffffff !important;
  color: #2563eb !important;
  border-radius: 50% !important;
  transition: transform 0.3s ease !important;
}

.hero-btn-primary:hover .btn-arrow-circle {
  transform: rotate(45deg) !important;
}

.hero-btn-secondary {
  display: inline-flex !important;
  align-items: center !important;
  padding: 12px 26px !important;
  background: #ffffff !important;
  color: #2563eb !important;
  border: 1.5px solid #2563eb !important;
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 15px !important;
  font-weight: 700 !important;
  border-radius: 9999px !important;
  text-decoration: none !important;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
  box-shadow: 0 4px 12px rgba(37, 99, 235, 0.05) !important;
  height: 48px !important;
  line-height: 1.2 !important;
}

.hero-btn-secondary:hover {
  background: rgba(37, 99, 235, 0.04) !important;
  border-color: #010ca8 !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 20px rgba(37, 99, 235, 0.15) !important;
  color: #010ca8 !important;
}

/* Staggered Load Animations */
@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.animate-fade-in-up {
  opacity: 0;
  animation: fadeInUp 0.8s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

.hero-badge.animate-fade-in-up {
  animation-delay: 0.1s;
}

.hero-title.animate-fade-in-up {
  animation-delay: 0.25s;
}

.hero-btn-group.animate-fade-in-up {
  animation-delay: 0.4s;
}

/* Right-side dashboard layout */
.hero-image-wrapper {
  position: relative !important;
  border-radius: 16px !important;

  transition: transform 0.3s ease, box-shadow 0.3s ease !important;
  z-index: 2 !important;
  max-width: 900px !important;
  margin: 0 auto !important;
  width: 100% !important;
}

/* .hero-image-wrapper:hover {
  transform: translateY(-5px) !important;
  box-shadow: 0 30px 60px rgba(15, 23, 42, 0.12) !important;
} */

.hero-image-wrapper img {
  border-radius: 12px !important;
  width: 100% !important;
  height: auto !important;
  display: block !important;
}

/* Floating AI Agent Badge */
.hero-floating-badge {
  position: absolute !important;
  bottom: 24px !important;
  left: -24px !important;
  background: rgba(255, 255, 255, 0.9) !important;
  backdrop-filter: blur(10px) !important;
  border: 1px solid rgba(226, 232, 240, 0.8) !important;
  border-radius: 12px !important;
  padding: 10px 16px !important;
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  box-shadow: 0 10px 25px rgba(15, 23, 42, 0.1) !important;
  z-index: 10 !important;
}

.badge-icon-sparkle {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 26px !important;
  height: 26px !important;
  background: #f0fdf4 !important;
  color: #16a34a !important;
  border-radius: 6px !important;
}

.badge-text-sparkle {
  display: flex !important;
  flex-direction: column !important;
  text-align: left !important;
}

.badge-text-sparkle strong {
  font-size: 12px !important;
  color: #0f172a !important;
  font-weight: 700 !important;
}

.badge-text-sparkle span {
  font-size: 10px !important;
  color: #64748b !important;
}

/* Floating animation */
@keyframes floatAnimation {
  0% {
    transform: translateY(0px);
  }

  50% {
    transform: translateY(-8px);
  }

  100% {
    transform: translateY(0px);
  }
}

.ani-float {
  animation: floatAnimation 4s ease-in-out infinite !important;
}

/* Responsive adjustments */
@media (max-width: 991px) {
  .hero-section-clean {
    padding-top: 150px !important;
    padding-bottom: 80px !important;
  }

  .hero-title {
    font-size: 42px !important;
  }

  .hero-floating-badge {
    display: none !important;
  }
}

@media (max-width: 767px) {
  .hero-section-clean {
    padding-top: 130px !important;
    padding-bottom: 60px !important;
  }

  .hero-title {
    font-size: 34px !important;
  }

  .hero-btn-group {
    flex-direction: column !important;
    align-items: stretch !important;
  }

  .hero-btn-primary,
  .hero-btn-secondary {
    justify-content: center !important;
  }
}

/* ==========================================================
   WHY CHOOSE OBLIGO AI — wc-* NAMESPACE (conflict-free)
   ========================================================== */

.wc-section {
  position: relative;
  padding: 40px 0 90px;
  background:
    linear-gradient(rgba(255, 255, 255, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.035) 1px, transparent 1px),
    linear-gradient(145deg, #448bfe 0%, #404363 50%, #1030c3 100%) !important;
  background-size: 52px 52px,
    52px 52px,
    cover !important;
  overflow: hidden;
  isolation: isolate;
}

.wc-section::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 60% 50% at 50% 0%, rgba(99, 102, 241, 0.18) 0%, transparent 60%),
    radial-gradient(ellipse 40% 40% at 80% 90%, rgba(6, 182, 212, 0.10) 0%, transparent 55%);
  pointer-events: none;
  z-index: 0;
}

.wc-container {
  position: relative;
  z-index: 2;
}

/* Badge */
.wc-badge {
  display: inline-block;
  font-family: "Outfit", sans-serif;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 2.5px;
  color: #fff;
  background: rgba(37, 99, 235, 0.15);
  border: 1px solid rgba(37, 99, 235, 0.35);
  border-radius: 100px;
  padding: 7px 20px;
  margin-bottom: 18px;
}

/* Title */
.wc-title {
  font-family: "Outfit", sans-serif;
  font-size: 40px;
  font-weight: 700;
  color: #ffffff;
  line-height: 1.18;
  letter-spacing: -0.5px;
  margin: 0 0 12px;
}

@media (max-width: 767px) {
  .wc-title {
    font-size: 32px;
  }
}

/* Card */
.wc-card {
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: 20px;
  padding: 38px 28px 34px;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
  overflow: hidden;
  transition: transform 0.42s cubic-bezier(0.16, 1, 0.3, 1),
    background 0.42s ease,
    border-color 0.42s ease,
    box-shadow 0.42s ease;
  height: 100%;
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}

/* Bottom gradient bar (hidden by default) */
.wc-card-bar {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: linear-gradient(90deg, #2563eb, #7c3aed, #06b6d4);
  opacity: 0;
  transition: opacity 0.4s ease;
  border-radius: 0 0 20px 20px;
}

.wc-card:hover {
  transform: translateY(-10px);
  border: 2px solid #fff;
}

.wc-card:hover .wc-card-bar {
  opacity: 1;
}

/* Icon */
.wc-card-icon {
  width: 72px;
  height: 72px;
  border-radius: 18px;
  background: rgba(37, 99, 235, 0.12);
  border: 1px solid #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 22px;
  transition: all 0.42s cubic-bezier(0.16, 1, 0.3, 1);
  box-shadow: 0 0 0 0 rgba(37, 99, 235, 0);
}

.wc-card-icon img {
  width: 34px;
  height: 34px;
  filter: brightness(0) invert(1);
  transition: transform 0.42s cubic-bezier(0.16, 1, 0.3, 1);
}

.wc-card:hover .wc-card-icon {
  background: rgba(37, 99, 235, 0.22);
  border-color: rgba(99, 179, 237, 0.5);
  transform: scale(1.08) translateY(-3px);
  box-shadow: 0 0 30px rgba(37, 99, 235, 0.28);
}

.wc-card:hover .wc-card-icon img {
  transform: scale(1.05);
}

/* Card Title */
.wc-card-title {
  font-family: "Outfit", sans-serif;
  font-size: 20px;
  font-weight: 700;
  color: #ffffff;
  line-height: 1.3;
  letter-spacing: -0.2px;
  margin: 0 0 12px;
  transition: color 0.3s ease;
}

.wc-card:hover .wc-card-title {
  color: #fff;
}

/* Card Text */
.wc-card-text {
  font-family: "Figtree", sans-serif;
  font-size: 14.5px;
  color: rgba(255, 255, 255, 0.58);
  line-height: 1.7;
  margin: 0;
  transition: color 0.3s ease;
}

.wc-card:hover .wc-card-text {
  color: rgba(255, 255, 255, 0.82);
}

/* ==========================================
   PREMIUM MOBILE MENU REDESIGN
   ========================================== */

.mobile-haeder2 {
  background: rgba(8, 12, 33, 0.8) !important;
  backdrop-filter: blur(16px) !important;
  -webkit-backdrop-filter: blur(16px) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.2) !important;
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  z-index: 999 !important;
  padding: 12px 0 !important;
}

.mobile-header-elements {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}

.mobile-header-elements .mobile-logo img {
  height: 32px !important;
  width: auto !important;
}

.mobile-header-elements .mobile-nav-icon {
  border: 1px solid rgba(255, 255, 255, 0.15) !important;
  background: rgba(255, 255, 255, 0.03) !important;
  color: #fff !important;
  width: 40px !important;
  height: 40px !important;
  border-radius: 8px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 18px !important;
  transition: all 0.3s ease !important;
  cursor: pointer !important;
}

.mobile-header-elements .mobile-nav-icon:hover {
  background: rgba(255, 255, 255, 0.1) !important;
  border-color: rgba(255, 255, 255, 0.3) !important;
  transform: scale(1.05) !important;
}

/* Sidebar Menu */
.mobile-sidebar2 {
  position: fixed !important;
  left: -340px !important;
  top: 0 !important;
  width: 340px !important;
  height: 100% !important;
  background: radial-gradient(circle at top right, #0e1630, #080c1d) !important;
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
  z-index: 1000 !important;
  padding: 30px 24px !important;
  border-right: 1px solid rgba(255, 255, 255, 0.08) !important;
  box-shadow: 15px 0 40px rgba(0, 0, 0, 0.5) !important;
  visibility: hidden !important;
  opacity: 0 !important;
  transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1) !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  overflow-y: auto !important;
  scrollbar-width: none !important;
}

.mobile-sidebar2::-webkit-scrollbar {
  display: none !important;
}

.mobile-sidebar2.active,
.mobile-sidebar2.mobile-menu-active {
  left: 0 !important;
  visibility: visible !important;
  opacity: 1 !important;
}

.mobile-sidebar2 .logosicon-area {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin-bottom: 30px !important;
  position: relative !important;
  padding-bottom: 15px !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
}

.mobile-sidebar2 .logosicon-area .logos img {
  height: 32px !important;
  width: auto !important;
}

.mobile-sidebar2 .menu-close {
  font-size: 14px !important;
  width: 32px !important;
  height: 32px !important;
  border-radius: 50% !important;
  border: 1px solid rgba(255, 255, 255, 0.15) !important;
  background: rgba(255, 255, 255, 0.03) !important;
  color: rgba(255, 255, 255, 0.8) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: all 0.3s ease !important;
  cursor: pointer !important;
  position: static !important;
}

.mobile-sidebar2 .menu-close:hover {
  background: rgba(255, 255, 255, 0.1) !important;
  color: #fff !important;
  transform: rotate(90deg) !important;
  border-color: rgba(255, 255, 255, 0.3) !important;
}

.mobile-sidebar2 .mobile-nav2 {
  flex-grow: 1 !important;
  display: flex !important;
  flex-direction: column !important;
}

.mobile-sidebar2 .mobile-nav-list {
  margin-top: 0 !important;
  padding-left: 0 !important;
  list-style: none !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
}

.mobile-sidebar2 .mobile-nav-list>li {
  position: relative !important;
}

.mobile-sidebar2 .mobile-nav-list>li>a {
  font-family: "Figtree", sans-serif !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  color: rgba(255, 255, 255, 0.8) !important;
  padding: 10px 12px !important;
  display: block !important;
  border-radius: 8px !important;
  transition: all 0.3s ease !important;
  text-decoration: none !important;
}

.mobile-sidebar2 .mobile-nav-list>li>a:hover {
  color: #fff !important;
  background: rgba(255, 255, 255, 0.04) !important;
  padding-left: 16px !important;
}

/* Accordion Submenu Toggles */
.mobile-sidebar2 span.submenu-button {
  position: absolute !important;
  width: 100% !important;
  height: 40px !important;
  top: 0 !important;
  left: 0 !important;
  z-index: 3 !important;
  cursor: pointer !important;
  background: transparent !important;
}

.mobile-sidebar2 span.submenu-button::before,
.mobile-sidebar2 span.submenu-button::after {
  position: absolute !important;
  content: "" !important;
  background: rgba(255, 255, 255, 0.6) !important;
  transition: all 0.3s ease !important;
}

/* Horizontal line of the plus icon */
.mobile-sidebar2 span.submenu-button::before {
  height: 2px !important;
  width: 12px !important;
  right: 16px !important;
  top: 19px !important;
}

/* Vertical line of the plus icon */
.mobile-sidebar2 span.submenu-button::after {
  height: 12px !important;
  width: 2px !important;
  right: 21px !important;
  top: 14px !important;
}

.mobile-sidebar2 span.submenu-button.submenu-opened::after {
  transform: scaleY(0) !important;
  opacity: 0 !important;
}

.mobile-sidebar2 span.submenu-button.submenu-opened::before {
  background: #3b82f6 !important;
}

/* Dropdown Submenus */
.mobile-sidebar2 .mobile-submenu {
  display: none;
  list-style: none !important;
  padding: 6px 8px !important;
  margin: 4px 10px 8px 10px !important;
  background: rgba(255, 255, 255, 0.02) !important;
  border: 1px solid rgba(255, 255, 255, 0.05) !important;
  border-radius: 8px !important;
}

.mobile-sidebar2 .mobile-submenu.open-sub {
  display: block !important;
}

.mobile-sidebar2 .mobile-submenu li {
  margin-bottom: 2px !important;
}

.mobile-sidebar2 .mobile-submenu li:last-child {
  margin-bottom: 0 !important;
}

.mobile-sidebar2 .mobile-submenu li a {
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  color: rgba(255, 255, 255, 0.7) !important;
  padding: 8px 10px !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  border-radius: 6px !important;
  transition: all 0.2s ease !important;
  text-decoration: none !important;
}

.mobile-sidebar2 .mobile-submenu li a:hover {
  color: #fff !important;
  background: rgba(255, 255, 255, 0.04) !important;
  padding-left: 14px !important;
}

.mobile-sidebar2 .mobile-submenu li a i {
  font-size: 12px !important;
  width: 24px !important;
  height: 24px !important;
  border-radius: 6px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: rgba(255, 255, 255, 0.04) !important;
  transition: all 0.2s ease !important;
}

/* Custom sector icon styling */
.mobile-sidebar2 .mobile-submenu li a[href*="solutions"] i,
.mobile-sidebar2 .mobile-submenu li a[href*="legal"] i {
  color: #3b82f6 !important;
  background: rgba(59, 130, 246, 0.12) !important;
}

.mobile-sidebar2 .mobile-submenu li a[href*="finance"] i {
  color: #06b6d4 !important;
  background: rgba(6, 182, 212, 0.12) !important;
}

.mobile-sidebar2 .mobile-submenu li a[href*="manufacturing"] i {
  color: #a855f7 !important;
  background: rgba(168, 85, 247, 0.12) !important;
}

.mobile-sidebar2 .mobile-submenu li a[href*="realestate"] i {
  color: #f97316 !important;
  background: rgba(249, 115, 22, 0.12) !important;
}

.mobile-sidebar2 .mobile-submenu li a[href*="logistics"] i {
  color: #ec4899 !important;
  background: rgba(236, 72, 153, 0.12) !important;
}

.mobile-sidebar2 .mobile-submenu li a[href*="blog"] i {
  color: #10b981 !important;
  background: rgba(16, 185, 129, 0.12) !important;
}

.mobile-sidebar2 .mobile-submenu li a i.fa-book {
  color: #f59e0b !important;
  background: rgba(245, 158, 11, 0.12) !important;
}

/* Call to Action Button Group */
.mobile-sidebar2 .allmobilesection {
  margin-top: 25px !important;
  padding-top: 20px !important;
  border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
}

.mobile-sidebar2 .allmobilesection .btn-area {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
}

.mobile-sidebar2 .allmobilesection .btn-area a.header-btn2 {
  background: linear-gradient(90deg, #2563eb, #06b6d4) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 8px !important;
  padding: 12px 20px !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  text-align: center !important;
  display: block !important;
  box-shadow: 0 4px 15px rgba(37, 99, 235, 0.25) !important;
  transition: all 0.3s ease !important;
  text-decoration: none !important;
}

.mobile-sidebar2 .allmobilesection .btn-area a.header-btn2:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 6px 20px rgba(37, 99, 235, 0.4) !important;
}

.mobile-sidebar2 .allmobilesection .btn-area a.header-btn3 {
  background: rgba(255, 255, 255, 0.05) !important;
  color: #fff !important;
  border: 1px solid rgba(255, 255, 255, 0.15) !important;
  border-radius: 8px !important;
  padding: 12px 20px !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  text-align: center !important;
  display: block !important;
  transition: all 0.3s ease !important;
  text-decoration: none !important;
}

.mobile-sidebar2 .allmobilesection .btn-area a.header-btn3:hover {
  background: rgba(255, 255, 255, 0.1) !important;
  border-color: rgba(255, 255, 255, 0.25) !important;
}

/* Footer Section inside Mobile Sidebar */
.mobile-sidebar2 .mobile-menu-footer {
  margin-top: 25px !important;
  text-align: center !important;
}

.mobile-sidebar2 .mobile-menu-footer .contact-email {
  font-size: 12.5px !important;
  color: rgba(255, 255, 255, 0.4) !important;
  margin-bottom: 12px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
}

.mobile-sidebar2 .mobile-menu-footer .social-icons {
  display: flex !important;
  justify-content: center !important;
  gap: 12px !important;
}

.mobile-sidebar2 .mobile-menu-footer .social-icons a {
  width: 32px !important;
  height: 32px !important;
  border-radius: 50% !important;
  background: rgba(255, 255, 255, 0.05) !important;
  color: rgba(255, 255, 255, 0.6) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 13px !important;
  transition: all 0.2s ease !important;
  text-decoration: none !important;
}

.mobile-sidebar2 .mobile-menu-footer .social-icons a:hover {
  background: #2563eb !important;
  color: #fff !important;
  transform: translateY(-2px) !important;
}

/* ==========================================
   PREMIUM MODAL REDESIGN (BLUE & WHITE)
   ========================================== */

.obligo-premium-modal {
  position: relative !important;
  background: #ffffff !important;
  border: 1px solid rgba(37, 99, 235, 0.12) !important;
  border-radius: 20px !important;
  padding: 40px 30px !important;
  box-shadow: 0 20px 50px rgba(8, 12, 33, 0.08), 0 4px 12px rgba(8, 12, 33, 0.04) !important;
  color: #1e293b !important;
  overflow: hidden !important;
}

/* Top radial gradient light source inside the modal - soft blue */
.obligo-premium-modal::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  width: 340px !important;
  height: 180px !important;
  background: radial-gradient(circle, rgba(37, 99, 235, 0.06) 0%, rgba(37, 99, 235, 0) 70%) !important;
  filter: blur(20px) !important;
  pointer-events: none !important;
  z-index: 1 !important;
}

.premium-modal-body {
  position: relative !important;
  z-index: 2 !important;
}

/* Close Button - Clean Grey / Blue-grey hover */
.premium-modal-close {
  position: absolute !important;
  top: 18px !important;
  right: 18px !important;
  width: 32px !important;
  height: 32px !important;
  border-radius: 50% !important;
  border: 1px solid rgba(30, 41, 59, 0.08) !important;
  background: rgba(30, 41, 59, 0.02) !important;
  color: rgba(30, 41, 59, 0.5) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 13px !important;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
  cursor: pointer !important;
  z-index: 10 !important;
  outline: none !important;
}

.premium-modal-close:hover {
  background: rgba(30, 41, 59, 0.06) !important;
  border-color: rgba(30, 41, 59, 0.18) !important;
  color: #1e293b !important;
  transform: rotate(90deg) !important;
}

/* Header Area */
.premium-modal-header {
  margin-bottom: 25px !important;
}

.premium-modal-badge {
  display: inline-block !important;
  background: rgba(37, 99, 235, 0.08) !important;
  border: 1px solid rgba(37, 99, 235, 0.2) !important;
  color: #2563eb !important;
  padding: 5px 12px !important;
  border-radius: 30px !important;
  font-size: 10.5px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.8px !important;
  margin-bottom: 12px !important;
}

.premium-modal-header h2 {
  font-family: "Figtree", sans-serif !important;
  font-size: 28px !important;
  font-weight: 700 !important;
  color: #0f172a !important;
  /* Deep Navy/Slate */
  margin-bottom: 8px !important;
  letter-spacing: -0.5px !important;
}

.premium-modal-header p {
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 14.5px !important;
  color: #475569 !important;
  /* Muted Slate */
  max-width: 480px !important;
  margin: 0 auto !important;
  line-height: 1.5 !important;
}

/* Form Group & Controls */
.premium-form-group {
  position: relative !important;
}

.premium-form-group label {
  display: block !important;
  font-family: "Figtree", sans-serif !important;
  font-size: 11.5px !important;
  font-weight: 600 !important;
  color: #475569 !important;
  /* Slate Label */
  text-transform: uppercase !important;
  letter-spacing: 0.8px !important;
  margin-bottom: 6px !important;
  text-align: left !important;
}

.premium-form-control {
  width: 100% !important;
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 14.5px !important;
  font-weight: 500 !important;
  padding: 12px 16px !important;
  background: #f8fafc !important;
  /* Light Slate bg */
  border: 1px solid #e2e8f0 !important;
  /* Soft Slate border */
  border-radius: 10px !important;
  color: #0f172a !important;
  /* Dark Text */
  outline: none !important;
  transition: all 0.25s ease !important;
  box-shadow: none !important;
}

.premium-form-control::placeholder {
  color: #94a3b8 !important;
  /* Placeholder light slate */
}

.premium-form-control:focus {
  background: #ffffff !important;
  border-color: #2563eb !important;
  /* Obligo Blue focus */
  box-shadow: 0 0 14px rgba(37, 99, 235, 0.15) !important;
}

/* Submit Button */
.premium-submit-btn {
  width: 100% !important;
  padding: 14px 28px !important;
  border-radius: 10px !important;
  font-family: "Figtree", sans-serif !important;
  font-weight: 700 !important;
  font-size: 15px !important;
  background: linear-gradient(90deg, #2563eb, #1d4ed8) !important;
  /* Gradient Blue */
  color: #fff !important;
  border: none !important;
  box-shadow: 0 4px 15px rgba(37, 99, 235, 0.2) !important;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
  cursor: pointer !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  text-transform: none !important;
}

.premium-submit-btn:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 24px rgba(37, 99, 235, 0.35) !important;
  background: linear-gradient(90deg, #1d4ed8, #1e40af) !important;
}

.premium-submit-btn:active {
  transform: translateY(0) !important;
}

@media (max-width: 767px) {
  .obligo-premium-modal {
    padding: 30px 20px !important;
  }

  .premium-modal-header h2 {
    font-size: 24px !important;
  }
}

/* ==================================================
   OBLIGO PREMIUM INTEGRATIONS SECTION STYLE
   ================================================== */

.obligo-integrations-section {
  background: #ffffff !important;
  position: relative !important;
  overflow: hidden !important;
  min-height: 760px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-items: center !important;
}

/* Background Concentric Rings & Radial Glow */
.obligo-integrations-bg-container {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  pointer-events: none !important;
  z-index: 1 !important;
  background-color: #ffffff !important;
  background-image: radial-gradient(circle at center 55%,
      rgba(35, 105, 255, 0.07) 0%,
      rgba(35, 105, 255, 0.02) 40%,
      transparent 75%) !important;
  overflow: hidden !important;
}

/* Technical Fading Dot Grid */
.obligo-integrations-grid-mask {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background-image: radial-gradient(rgba(35, 105, 255, 0.05) 1.5px, transparent 1.5px) !important;
  background-size: 28px 28px !important;
  background-position: center center !important;
  mask-image: radial-gradient(circle at center 55%, black 40%, transparent 80%) !important;
  -webkit-mask-image: radial-gradient(circle at center 55%, black 40%, transparent 80%) !important;
  opacity: 0.8 !important;
}

/* Soft Blur Glow Flares */
.obligo-integrations-glow-blob {
  position: absolute !important;
  width: 500px !important;
  height: 500px !important;
  border-radius: 50% !important;
  filter: blur(150px) !important;
  opacity: 0.08 !important;
  pointer-events: none !important;
  z-index: 1 !important;
}

.obligo-integrations-glow-left {
  background: radial-gradient(circle, #1764ff 0%, transparent 70%) !important;
  top: 15% !important;
  left: -150px !important;
}

.obligo-integrations-glow-right {
  background: radial-gradient(circle, #2874ff 0%, transparent 70%) !important;
  bottom: 15% !important;
  right: -150px !important;
}

/* Orbit Lines & Slow Spin Animations */
.obligo-integrations-orbit {
  position: absolute !important;
  left: 50% !important;
  top: 55% !important;
  transform: translate(-50%, -50%) !important;
  border-radius: 50% !important;
  border: 1px solid rgba(30, 100, 255, 0.09) !important;
  transform-origin: center center !important;
}

.obligo-integrations-orbit-dashed {
  border-style: dashed !important;
  border-color: rgba(30, 100, 255, 0.12) !important;
}

.obligo-integrations-orbit-700 {
  width: 700px !important;
  height: 700px !important;
}

.obligo-integrations-orbit-900 {
  width: 900px !important;
  height: 900px !important;
  animation: obligo-spin-clockwise 220s linear infinite !important;
}

.obligo-integrations-orbit-1100 {
  width: 1100px !important;
  height: 1100px !important;
}

.obligo-integrations-orbit-1300 {
  width: 1300px !important;
  height: 1300px !important;
  animation: obligo-spin-counter 280s linear infinite !important;
}

.obligo-integrations-orbit-1500 {
  width: 1500px !important;
  height: 1500px !important;
}

/* Background Rotating/Pulsing Dots */
.obligo-integrations-dot {
  position: absolute !important;
  width: 8px !important;
  height: 8px !important;
  background: #1764FF !important;
  border-radius: 50% !important;
  opacity: 0.65 !important;
  animation: obligo-dot-pulse 4s infinite ease-in-out !important;
}

.obligo-integrations-dot-1 {
  top: 15% !important;
  left: 85% !important;
}

.obligo-integrations-dot-2 {
  top: 80% !important;
  left: 10% !important;
  animation-delay: 1.5s !important;
}

.obligo-integrations-dot-3 {
  top: 45% !important;
  left: 5% !important;
  animation-delay: 3s !important;
}

/* Technical Crosshairs */
.obligo-integrations-crosshair {
  position: absolute !important;
  width: 12px !important;
  height: 12px !important;
  border-top: 1.5px solid rgba(23, 100, 255, 0.25) !important;
  border-left: 1.5px solid rgba(23, 100, 255, 0.25) !important;
}

.obligo-integrations-crosshair-1 {
  top: 50% !important;
  left: 0 !important;
  transform: translate(-50%, -50%) rotate(-45deg) !important;
}

.obligo-integrations-crosshair-2 {
  top: 50% !important;
  right: 0 !important;
  transform: translate(50%, -50%) rotate(135deg) !important;
}

@keyframes obligo-dot-pulse {

  0%,
  100% {
    transform: scale(1) !important;
    opacity: 0.4 !important;
  }

  50% {
    transform: scale(1.6) !important;
    opacity: 0.95 !important;
  }
}

@keyframes obligo-spin-clockwise {
  0% {
    transform: translate(-50%, -50%) rotate(0deg) !important;
  }

  100% {
    transform: translate(-50%, -50%) rotate(360deg) !important;
  }
}

@keyframes obligo-spin-counter {
  0% {
    transform: translate(-50%, -50%) rotate(0deg) !important;
  }

  100% {
    transform: translate(-50%, -50%) rotate(-360deg) !important;
  }
}

/* Container & Header */
.obligo-integrations-container {
  position: relative !important;
  z-index: 2 !important;
  max-width: 1400px !important;
}

.obligo-integrations-header {
  text-align: center !important;
  margin-bottom: 33px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
}

.obligo-integrations-badge {
  display: inline-flex !important;
  align-items: center !important;
  background: #F2F6FF !important;
  color: #1764FF !important;
  border: 1px solid #E2EBFF !important;
  border-radius: 30px !important;
  padding: 10px 20px !important;
  font-family: "Figtree", sans-serif !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: 1.5px !important;
  margin-bottom: 24px !important;
}

.obligo-integrations-title {
  font-family: "Figtree", sans-serif !important;
  font-size: 40px !important;
  font-weight: 700 !important;
  line-height: 1.08 !important;
  color: #08183F !important;
  text-align: center !important;
  max-width: 850px !important;
  margin-bottom: 20px !important;
}

.obligo-integrations-highlight {
  color: #2874FF !important;
}

.obligo-integrations-subtitle {
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 18px !important;
  line-height: 1.6 !important;
  color: #53617A !important;
  text-align: center !important;
  max-width: 700px !important;
}

/* Wrapper & Connector Line */
.obligo-integrations-wrapper {
  position: relative !important;
  width: 100% !important;
}

.obligo-integrations-connector {
  position: absolute !important;
  top: 75px !important;
  /* aligns with center of 150px logo circle */
  left: 0 !important;
  width: 100% !important;
  height: 150px !important;
  z-index: 1 !important;
  pointer-events: none !important;
}

/* Grid Layout */
.obligo-integrations-grid {
  max-width: 1350px !important;
  margin: 0 auto !important;
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 38px !important;
  position: relative !important;
  z-index: 2 !important;
}

.obligo-integrations-item {
  position: relative !important;
  padding-top: 75px !important;
  /* allows logo to float top overlap */
}

/* Circular Logo */
.obligo-integrations-logo-circle {
  width: 150px !important;
  height: 150px !important;
  border-radius: 50% !important;
  background: #FFFFFF !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: 1.5px solid #DCE8FF !important;
  box-shadow:
    0 15px 40px rgba(28, 76, 160, 0.10),
    0 0 30px rgba(40, 115, 255, 0.05) !important;
  position: absolute !important;
  top: 0 !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  z-index: 3 !important;
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.3s ease !important;
}

.obligo-integrations-logo-circle img {
  max-width: 82px !important;
  max-height: 82px !important;
  object-fit: contain !important;
}

/* Hover Animation on Logo Circle */
.obligo-integrations-item:hover .obligo-integrations-logo-circle {
  transform: translateX(-50%) translateY(-6px) !important;
  box-shadow: 0 20px 50px rgba(30, 100, 255, 0.15) !important;
}

/* Card Panel */
.obligo-integrations-panel {
  position: relative !important;
  z-index: 2 !important;
  background: rgba(255, 255, 255, 0.92) !important;
  border: 1px solid #E5ECF8 !important;
  border-radius: 22px !important;
  box-shadow: 0 15px 45px rgba(24, 55, 105, 0.08) !important;
  padding: 95px 32px 30px 32px !important;
  min-height: 290px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  text-align: center !important;
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.3s ease !important;
}

.obligo-integrations-item:hover .obligo-integrations-panel {
  transform: translateY(-3px) !important;
  border-color: #2874FF !important;
}

.obligo-integrations-panel-title {
  font-family: "Figtree", sans-serif !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  color: #08183F !important;
  margin-bottom: 12px !important;
  text-align: center !important;
}

.obligo-integrations-panel-desc {
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 14.5px !important;
  line-height: 1.7 !important;
  color: #5A6780 !important;
  margin-bottom: 24px !important;
  text-align: center !important;
  flex-grow: 1 !important;
}

/* Status Pill */
.obligo-integrations-status-wrapper {
  width: 100% !important;
  display: flex !important;
  justify-content: center !important;
  margin-top: auto !important;
}

.obligo-integrations-status-pill {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  padding: 8px 18px !important;
  border-radius: 30px !important;
  background: #F0F5FF !important;
  color: #1764FF !important;
  border: 1px solid #D9E4FF !important;
  font-family: "Figtree", sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
}

.obligo-integrations-check {
  font-weight: 700 !important;
}

/* CTA Bottom Area */
.obligo-integrations-cta-container {
  text-align: center !important;
  margin-top: 55px !important;
}

.obligo-integrations-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 58px !important;
  padding: 0 32px !important;
  background: #FFFFFF !important;
  color: #1764FF !important;
  border: 1.5px solid #1764FF !important;
  border-radius: 30px !important;
  font-family: "Figtree", sans-serif !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  transition: all 0.3s ease !important;
  box-shadow: 0 4px 12px rgba(23, 100, 255, 0.05) !important;
}

.obligo-integrations-btn:hover {
  background: #1764FF !important;
  color: #FFFFFF !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 24px rgba(23, 100, 255, 0.15) !important;
}

/* Responsive Rules */
@media (max-width: 1199px) {
  .obligo-integrations-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 40px !important;
    max-width: 720px !important;
  }

  .obligo-integrations-logo-circle {
    width: 130px !important;
    height: 130px !important;
  }

  .obligo-integrations-logo-circle img {
    max-width: 72px !important;
    max-height: 72px !important;
  }

  .obligo-integrations-item {
    padding-top: 65px !important;
  }

  .obligo-integrations-panel {
    padding-top: 85px !important;
  }
}

@media (max-width: 767px) {
  .obligo-integrations-title {
    font-size: 34px !important;
  }

  .obligo-integrations-subtitle {
    font-size: 15px !important;
  }

  .obligo-integrations-grid {
    grid-template-columns: 1fr !important;
    gap: 45px !important;
    max-width: 320px !important;
  }

  .obligo-integrations-logo-circle {
    width: 110px !important;
    height: 110px !important;
  }

  .obligo-integrations-logo-circle img {
    max-width: 60px !important;
    max-height: 60px !important;
  }

  .obligo-integrations-item {
    padding-top: 55px !important;
  }

  .obligo-integrations-panel {
    padding-top: 75px !important;
    width: 100% !important;
    max-width: 100% !important;
  }
}

/* ==================================================
   OBLIGO PREMIUM PRICING PAGE STYLES
   ================================================== */

.obligo-pricing-section {
  background: #ffffff !important;
  position: relative !important;
  overflow: hidden !important;
  padding: 100px 0 !important;
  min-height: 800px !important;
}

/* Tech Background Dot Grid & Soft Blue Blobs */
.obligo-pricing-bg {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  pointer-events: none !important;
  z-index: 1 !important;
  background-image: radial-gradient(rgba(35, 105, 255, 0.04) 1.5px, transparent 1.5px) !important;
  background-size: 28px 28px !important;
  mask-image: radial-gradient(circle at center, black 40%, transparent 90%) !important;
  -webkit-mask-image: radial-gradient(circle at center, black 40%, transparent 90%) !important;
}

/* Glow blobs with dynamic keyframe shifting */
.obligo-pricing-glow {
  position: absolute !important;
  width: 600px !important;
  height: 600px !important;
  border-radius: 50% !important;
  filter: blur(160px) !important;
  opacity: 0.09 !important;
  pointer-events: none !important;
  z-index: 1 !important;
}

.obligo-pricing-glow-1 {
  background: radial-gradient(circle, rgba(23, 100, 255, 0.16) 0%, transparent 70%) !important;
  top: -100px !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  animation: obligo-glow-shift-1 25s infinite ease-in-out !important;
}

.obligo-pricing-glow-2 {
  background: radial-gradient(circle, rgba(40, 116, 255, 0.12) 0%, transparent 70%) !important;
  bottom: -150px !important;
  left: 10% !important;
  animation: obligo-glow-shift-2 30s infinite ease-in-out !important;
}

/* Concentric Background Orbits */
.obligo-pricing-orbit {
  position: absolute !important;
  left: 50% !important;
  top: 50% !important;
  transform: translate(-50%, -50%) !important;
  border-radius: 50% !important;
  border: 1px solid rgba(30, 100, 255, 0.05) !important;
  pointer-events: none !important;
  z-index: 1 !important;
  transform-origin: center center !important;
}

.obligo-pricing-orbit-dashed {
  border-style: dashed !important;
  border-color: rgba(30, 100, 255, 0.09) !important;
  animation: obligo-spin-clockwise 180s linear infinite !important;
}

.obligo-pricing-orbit-800 {
  width: 800px !important;
  height: 800px !important;
}

.obligo-pricing-orbit-1200 {
  width: 1200px !important;
  height: 1200px !important;
}

/* Flowing SVG Connections & Node Pulsing */
.obligo-pricing-path-flow-1 {
  stroke-dasharray: 12 12;
  animation: obligo-flow-forward 45s linear infinite !important;
}

.obligo-pricing-path-flow-2 {
  stroke-dasharray: 10 10;
  animation: obligo-flow-backward 55s linear infinite !important;
}

.obligo-pricing-node-pulse-1,
.obligo-pricing-node-pulse-2,
.obligo-pricing-node-pulse-3,
.obligo-pricing-node-pulse-4 {
  transform-origin: center center !important;
  animation: obligo-node-glow 3.5s infinite ease-in-out !important;
}

.obligo-pricing-node-pulse-2 {
  animation-delay: 0.9s !important;
}

.obligo-pricing-node-pulse-3 {
  animation-delay: 1.8s !important;
}

.obligo-pricing-node-pulse-4 {
  animation-delay: 2.7s !important;
}

/* Keyframe Animations */
@keyframes obligo-flow-forward {
  from {
    stroke-dashoffset: 2000;
  }

  to {
    stroke-dashoffset: 0;
  }
}

@keyframes obligo-flow-backward {
  from {
    stroke-dashoffset: -2000;
  }

  to {
    stroke-dashoffset: 0;
  }
}

@keyframes obligo-node-glow {

  0%,
  100% {
    opacity: 0.35;
    transform: scale(0.9);
  }

  50% {
    opacity: 0.95;
    transform: scale(1.35);
  }
}

@keyframes obligo-glow-shift-1 {

  0%,
  100% {
    transform: translateX(-50%) translate(0, 0) scale(1);
  }

  50% {
    transform: translateX(-50%) translate(-6%, 4%) scale(1.12);
  }
}

@keyframes obligo-glow-shift-2 {

  0%,
  100% {
    transform: translate(0, 0) scale(1);
  }

  50% {
    transform: translate(4%, -6%) scale(1.15);
  }
}

/* Header & Toggle */
.obligo-pricing-container {
  position: relative !important;
  z-index: 2 !important;
  max-width: 1320px !important;
}

.obligo-pricing-badge {
  display: inline-flex !important;
  align-items: center !important;
  background: #F2F6FF !important;
  color: #1764FF !important;
  border: 1px solid #E2EBFF !important;
  border-radius: 30px !important;
  padding: 8px 18px !important;
  font-family: "Figtree", sans-serif !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: 1px !important;
  margin-bottom: 20px !important;
}

.obligo-pricing-title {
  font-family: "Figtree", sans-serif !important;
  font-size: 40px !important;
  font-weight: 700 !important;
  line-height: 1.15 !important;
  color: #08183F !important;
  margin-bottom: 20px !important;
}

.obligo-pricing-highlight {
  color: #2874FF !important;
}

.obligo-pricing-subtitle {
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 18px !important;
  line-height: 1.6 !important;
  color: #53617A !important;
  max-width: 650px !important;
  margin: 0 auto 50px auto !important;
}

/* Switch Toggle Button */
.obligo-pricing-toggle-wrapper {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: #F4F7FC !important;
  padding: 6px !important;
  border-radius: 50px !important;
  border: 1px solid #E4ECF8 !important;
  margin-bottom: 60px !important;
}

.obligo-pricing-toggle-btn {
  border: none !important;
  background: transparent !important;
  padding: 10px 24px !important;
  border-radius: 50px !important;
  font-family: "Figtree", sans-serif !important;
  font-size: 14.5px !important;
  font-weight: 700 !important;
  color: #53617A !important;
  cursor: pointer !important;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.obligo-pricing-toggle-btn.active {
  background: #ffffff !important;
  color: #1764FF !important;
  box-shadow: 0 4px 15px rgba(23, 100, 255, 0.08) !important;
}

.obligo-pricing-discount-badge {
  background: #2874FF !important;
  color: #ffffff !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  padding: 2px 8px !important;
  border-radius: 20px !important;
  margin-left: 6px !important;
}

/* Pricing Grid */
.obligo-pricing-grid {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 32px !important;
  margin-bottom: 80px !important;
}

.obligo-pricing-card {
  background: rgba(255, 255, 255, 0.9) !important;
  border: 1px solid #E4ECF8 !important;
  border-radius: 24px !important;
  padding: 48px 40px !important;
  box-shadow: 0 15px 45px rgba(24, 55, 105, 0.04) !important;
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.obligo-pricing-card:hover {
  transform: translateY(-8px) !important;
  box-shadow: 0 25px 60px rgba(24, 55, 105, 0.09) !important;
  border-color: #D6E3F8 !important;
}

/* Popular Accent Card */
.obligo-pricing-card.popular {
  border: 2px solid #1764FF !important;
  box-shadow: 0 20px 50px rgba(23, 100, 255, 0.08) !important;
}

.obligo-pricing-card.popular:hover {
  box-shadow: 0 30px 65px rgba(23, 100, 255, 0.14) !important;
}

.obligo-pricing-popular-badge {
  position: absolute !important;
  top: -16px !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  background: linear-gradient(135deg, #1764FF 0%, #2874FF 100%) !important;
  color: #ffffff !important;
  font-family: "Figtree", sans-serif !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 0.8px !important;
  padding: 6px 20px !important;
  border-radius: 30px !important;
  box-shadow: 0 4px 12px rgba(23, 100, 255, 0.2) !important;
}

/* Card Header elements */
.obligo-pricing-card-title {
  font-family: "Figtree", sans-serif !important;
  font-size: 22px !important;
  font-weight: 700 !important;
  color: #08183F !important;
  margin-bottom: 12px !important;
  text-align: left !important;
}

.obligo-pricing-card-desc {
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 14.5px !important;
  line-height: 1.6 !important;
  color: #53617A !important;
  margin-bottom: 30px !important;
  text-align: left !important;
  min-height: 48px !important;
}

/* Pricing Tag */
.obligo-pricing-rate {
  display: flex !important;
  align-items: baseline !important;
  margin-bottom: 32px !important;
}

.obligo-pricing-currency {
  font-family: "Figtree", sans-serif !important;
  font-size: 32px !important;
  font-weight: 700 !important;
  color: #08183F !important;
  align-self: flex-start !important;
}

.obligo-pricing-amount {
  font-family: "Figtree", sans-serif !important;
  font-size: 58px !important;
  font-weight: 800 !important;
  color: #08183F !important;
  line-height: 1 !important;
}

.obligo-pricing-period {
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 15px !important;
  color: #53617A !important;
  margin-left: 6px !important;
}

/* Pricing Features */
.obligo-pricing-features-title {
  font-family: "Figtree", sans-serif !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  letter-spacing: 0.5px !important;
  color: #08183F !important;
  text-transform: uppercase !important;
  margin-bottom: 20px !important;
  text-align: left !important;
}

.obligo-pricing-features-list {
  list-style: none !important;
  padding-left: 0 !important;
  margin-bottom: 40px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 15px !important;
  flex-grow: 1 !important;
}

.obligo-pricing-features-list li {
  display: flex !important;
  align-items: flex-start !important;
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 14.5px !important;
  color: #53617A !important;
  text-align: left !important;
  line-height: 1.4 !important;
}

.obligo-pricing-features-list li i {
  color: #1764FF !important;
  font-size: 15px !important;
  margin-right: 12px !important;
  margin-top: 3px !important;
}

.obligo-pricing-features-list li.disabled {
  color: #A0ACC0 !important;
}

.obligo-pricing-features-list li.disabled i {
  color: #C8D4E6 !important;
}

/* Action CTA Buttons */
.obligo-pricing-action-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 54px !important;
  border-radius: 14px !important;
  font-family: "Figtree", sans-serif !important;
  font-size: 15.5px !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.obligo-pricing-action-btn-outline {
  background: #ffffff !important;
  color: #1764FF !important;
  border: 1.5px solid #1764FF !important;
}

.obligo-pricing-action-btn-outline:hover {
  background: #1764FF !important;
  color: #ffffff !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 6px 18px rgba(23, 100, 255, 0.12) !important;
}

.obligo-pricing-action-btn-solid {
  background: linear-gradient(135deg, #1764FF 0%, #2874FF 100%) !important;
  color: #ffffff !important;
  border: none !important;
  box-shadow: 0 4px 15px rgba(23, 100, 255, 0.15) !important;
}

.obligo-pricing-action-btn-solid:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 24px rgba(23, 100, 255, 0.3) !important;
}

/* ==================================================
   OBLIGO PREMIUM FAQ STYLES
   ================================================== */

.obligo-pricing-faq-section {
  padding: 80px 0 100px 0 !important;
  background: #F9FBFE !important;
  border-top: 1px solid #E4ECF8 !important;
  position: relative !important;
}

.obligo-pricing-faq-title {
  font-family: "Figtree", sans-serif !important;
  font-size: 38px !important;
  font-weight: 800 !important;
  color: #08183F !important;
  margin-bottom: 50px !important;
}

.obligo-pricing-faq-wrapper {
  max-width: 850px !important;
  margin: 0 auto !important;
}

.obligo-pricing-faq-item {
  background: #ffffff !important;
  border: 1px solid #E4ECF8 !important;
  border-radius: 16px !important;
  margin-bottom: 18px !important;
  overflow: hidden !important;
  box-shadow: 0 4px 15px rgba(24, 55, 105, 0.02) !important;
  transition: all 0.3s ease !important;
}

.obligo-pricing-faq-item.active {
  border-color: #1764FF !important;
  box-shadow: 0 10px 25px rgba(23, 100, 255, 0.06) !important;
}

.obligo-pricing-faq-trigger {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 24px 30px !important;
  cursor: pointer !important;
  user-select: none !important;
}

.obligo-pricing-faq-question {
  font-family: "Figtree", sans-serif !important;
  font-size: 17.5px !important;
  font-weight: 700 !important;
  color: #08183F !important;
  text-align: left !important;
}

.obligo-pricing-faq-icon {
  font-size: 14px !important;
  color: #1764FF !important;
  transition: transform 0.3s ease !important;
}

.obligo-pricing-faq-item.active .obligo-pricing-faq-icon {
  transform: rotate(180deg) !important;
}

.obligo-pricing-faq-content {
  max-height: 0;
  overflow: hidden !important;
  transition: max-height 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.obligo-pricing-faq-answer {
  padding: 0 30px 24px 30px !important;
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 15px !important;
  line-height: 1.7 !important;
  color: #53617A !important;
  text-align: left !important;
}

/* Responsive Pricing Rules */
@media (max-width: 1199px) {
  .obligo-pricing-grid {
    grid-template-columns: 1fr !important;
    gap: 30px !important;
    max-width: 500px !important;
    margin: 0 auto 60px auto !important;
  }

  .obligo-pricing-card {
    padding: 40px 30px !important;
  }
}

@media (max-width: 767px) {
  .obligo-pricing-title {
    font-size: 34px !important;
  }

  .obligo-pricing-subtitle {
    font-size: 15px !important;
  }

  .obligo-pricing-amount {
    font-size: 46px !important;
  }
}

/* Background SVGs Styling */
.obligo-pricing-bg-svg-wrapper {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  z-index: 1 !important;
  pointer-events: none !important;
  opacity: 0.85 !important;
}

.obligo-pricing-bg-svg-wrapper svg {
  width: 100% !important;
  height: 100% !important;
}

/* ==================================================
   OBLIGO PREMIUM BLOG PAGE STYLES
   ================================================= */

.obligo-blog-section {
  background: #ffffff !important;
  position: relative !important;
  overflow: hidden !important;
  padding: 100px 0 !important;
  min-height: 800px !important;
}

/* Tech Grid & Animating Glow Blobs */
.obligo-blog-bg {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  pointer-events: none !important;
  z-index: 1 !important;
  background-image: radial-gradient(rgba(23, 100, 255, 0.04) 1.5px, transparent 1.5px) !important;
  background-size: 26px 26px !important;
  mask-image: radial-gradient(circle at center, black 50%, transparent 95%) !important;
  -webkit-mask-image: radial-gradient(circle at center, black 50%, transparent 95%) !important;
}

.obligo-blog-glow {
  position: absolute !important;
  width: 550px !important;
  height: 550px !important;
  border-radius: 50% !important;
  filter: blur(150px) !important;
  opacity: 0.08 !important;
  pointer-events: none !important;
  z-index: 1 !important;
}

.obligo-blog-glow-1 {
  background: #1764FF !important;
  top: -80px !important;
  left: 15% !important;
  animation: obligo-glow-shift-1 22s infinite ease-in-out !important;
}

.obligo-blog-glow-2 {
  background: #2874FF !important;
  bottom: -100px !important;
  right: 15% !important;
  animation: obligo-glow-shift-2 26s infinite ease-in-out !important;
}

/* Header Elements */
.obligo-blog-container {
  position: relative !important;
  z-index: 2 !important;
  max-width: 1320px !important;
}

.obligo-blog-badge {
  display: inline-flex !important;
  align-items: center !important;
  background: #F2F6FF !important;
  color: #1764FF !important;
  border: 1px solid #E2EBFF !important;
  border-radius: 30px !important;
  padding: 8px 18px !important;
  font-family: "Figtree", sans-serif !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: 0.8px !important;
  margin-bottom: 20px !important;
}

.obligo-blog-title {
  font-family: "Figtree", sans-serif !important;
  font-size: 40px !important;
  font-weight: 700 !important;
  line-height: 1.15 !important;
  color: #08183F !important;
  margin-bottom: 20px !important;
}

.obligo-blog-highlight {
  color: #2874FF !important;
}

.obligo-blog-subtitle {
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 18px !important;
  line-height: 1.6 !important;
  color: #53617A !important;
  max-width: 650px !important;
  margin: 0 auto 50px auto !important;
}

/* Category Tabs Menu */
.obligo-blog-tabs {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 15px !important;
  background: rgba(244, 247, 252, 0.7) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
  border: 1px solid #E4ECF8 !important;
  border-radius: 50px !important;
  padding: 10px 15px !important;
  margin: 0 auto 60px auto !important;
  max-width: fit-content !important;
}

.obligo-blog-tab-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  background: transparent !important;
  color: #53617A !important;
  border: none !important;
  border-radius: 40px !important;
  padding: 10px 22px !important;
  font-family: "Figtree", sans-serif !important;
  font-size: 14.5px !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  cursor: pointer !important;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.obligo-blog-tab-btn i {
  font-size: 14px !important;
}

.obligo-blog-tab-btn:hover {
  color: #1764FF !important;
}

.obligo-blog-tab-btn.active {
  background: #ffffff !important;
  color: #1764FF !important;
  box-shadow: 0 4px 15px rgba(23, 100, 255, 0.08) !important;
}

/* Cards Layout */
.obligo-blog-grid {
  margin-bottom: 50px !important;
}

.obligo-blog-card {
  background: #ffffff !important;
  border: 1px solid #E4ECF8 !important;
  border-radius: 20px !important;
  overflow: hidden !important;
  height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  box-shadow: 0 12px 35px rgba(24, 55, 105, 0.03) !important;
  transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.obligo-blog-card:hover {
  transform: translateY(-6px) !important;
  box-shadow: 0 20px 45px rgba(24, 55, 105, 0.08) !important;
  border-color: #D6E3F8 !important;
}

.obligo-blog-image-wrapper {
  position: relative !important;
  overflow: hidden !important;
  height: 250px !important;
  background: #F4F7FC !important;
}

.obligo-blog-image-wrapper img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  transition: transform 0.5s ease !important;
}

.obligo-blog-card:hover .obligo-blog-image-wrapper img {
  transform: scale(1.05) !important;
}

/* Category Overlay Badges */
.obligo-blog-category-badge {
  position: absolute !important;
  left: 20px !important;
  bottom: 20px !important;
  font-family: "Figtree", sans-serif !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.5px !important;
  padding: 6px 14px !important;
  border-radius: 30px !important;
  color: #ffffff !important;
  text-transform: uppercase !important;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1) !important;
}

.obligo-blog-category-badge.ai {
  background: linear-gradient(135deg, #1764FF 0%, #2874FF 100%) !important;
}

.obligo-blog-category-badge.contract {
  background: linear-gradient(135deg, #9F3FF5 0%, #B867FF 100%) !important;
}

.obligo-blog-category-badge.compliance {
  background: linear-gradient(135deg, #1764FF 0%, #2874FF 100%) !important;
}

/* Icon badge top left */
.obligo-blog-icon-tag {
  position: absolute !important;
  top: 20px !important;
  right: 20px !important;
  width: 44px !important;
  height: 44px !important;
  border-radius: 50% !important;
  background: rgba(255, 255, 255, 0.9) !important;
  backdrop-filter: blur(5px) !important;
  -webkit-backdrop-filter: blur(5px) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #1764FF !important;
  font-size: 16px !important;
  box-shadow: 0 4px 15px rgba(24, 55, 105, 0.08) !important;
}

/* Content Panel */
.obligo-blog-content {
  padding: 30px !important;
  display: flex !important;
  flex-direction: column !important;
  flex-grow: 1 !important;
}

.obligo-blog-meta {
  display: flex !important;
  gap: 20px !important;
  margin-bottom: 15px !important;
}

.obligo-blog-meta-item {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 13.5px !important;
  color: #7A89A0 !important;
}

.obligo-blog-meta-item i {
  color: #1764FF !important;
  font-size: 12px !important;
}

.obligo-blog-card-title {
  margin-bottom: 12px !important;
  text-align: left !important;
}

.obligo-blog-card-title a {
  font-family: "Figtree", sans-serif !important;
  font-size: 21px !important;
  font-weight: 700 !important;
  color: #08183F !important;
  line-height: 1.35 !important;
  text-decoration: none !important;
  transition: color 0.25s ease !important;
}

.obligo-blog-card-title a:hover {
  color: #1764FF !important;
}

.obligo-blog-card-desc {
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 14.5px !important;
  line-height: 1.6 !important;
  color: #53617A !important;
  margin-bottom: 25px !important;
  text-align: left !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 3 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  flex-grow: 1 !important;
}

/* Author Details footer */
.obligo-blog-author-row {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  border-top: 1px solid #E4ECF8 !important;
  padding-top: 20px !important;
  margin-top: auto !important;
}

.obligo-blog-user-box {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
}

.obligo-blog-avatar {
  width: 44px !important;
  height: 44px !important;
  border-radius: 50% !important;
  object-fit: cover !important;
}

.obligo-blog-avatar-icon {
  width: 44px !important;
  height: 44px !important;
  border-radius: 50% !important;
  background: #F4F7FC !important;
  color: #1764FF !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 16px !important;
  border: 1px solid #E2EBFF !important;
  box-shadow: 0 4px 10px rgba(24, 55, 105, 0.02) !important;
}

.obligo-blog-user-info {
  text-align: left !important;
}

.obligo-blog-user-info h6 {
  font-family: "Figtree", sans-serif !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  color: #08183F !important;
  margin: 0 0 2px 0 !important;
}

.obligo-blog-user-info small {
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 12px !important;
  color: #7A89A0 !important;
}

.obligo-blog-arrow-link {
  width: 36px !important;
  height: 36px !important;
  border-radius: 50% !important;
  background: #F4F7FC !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #1764FF !important;
  font-size: 13px !important;
  text-decoration: none !important;
  transition: all 0.3s ease !important;
}

.obligo-blog-card:hover .obligo-blog-arrow-link {
  background: #1764FF !important;
  color: #ffffff !important;
  transform: translateX(4px) !important;
}

/* Responsive Blog Rules */
@media (max-width: 991px) {
  .obligo-blog-title {
    font-size: 34px !important;
  }

  .obligo-blog-subtitle {
    font-size: 15px !important;
    margin-bottom: 40px !important;
  }

  .obligo-blog-tabs {
    padding: 8px 12px !important;
    gap: 8px !important;
  }

  .obligo-blog-tab-btn {
    padding: 8px 16px !important;
    font-size: 13.5px !important;
  }
}

/* ==================================================
   OBLIGO PREMIUM BLOG DETAILS PAGE STYLES
   ================================================= */

.obligo-blog-details-section {
  background: #ffffff !important;
  position: relative !important;
  overflow: clip !important;
  padding: 100px 0 !important;
}

.obligo-blog-details-bg {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  pointer-events: none !important;
  z-index: 1 !important;
  background-image: radial-gradient(rgba(23, 100, 255, 0.03) 1.5px, transparent 1.5px) !important;
  background-size: 26px 26px !important;
  mask-image: radial-gradient(circle at center, black 40%, transparent 95%) !important;
  -webkit-mask-image: radial-gradient(circle at center, black 40%, transparent 95%) !important;
}

.obligo-blog-details-glow {
  position: absolute !important;
  width: 600px !important;
  height: 600px !important;
  border-radius: 50% !important;
  filter: blur(150px) !important;
  opacity: 0.08 !important;
  pointer-events: none !important;
  z-index: 1 !important;
}

.obligo-blog-details-glow-1 {
  background: #1764FF !important;
  top: -50px !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
}

.obligo-blog-details-container {
  position: relative !important;
  z-index: 2 !important;
  max-width: 1200px !important;
}

/* Hero Header */
.obligo-blog-details-header {
  text-align: center !important;
  margin-bottom: 50px !important;
  max-width: 850px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.obligo-blog-details-category {
  display: inline-flex !important;
  align-items: center !important;
  background: #F2F6FF !important;
  color: #1764FF !important;
  border: 1px solid #E2EBFF !important;
  border-radius: 30px !important;
  padding: 6px 16px !important;
  font-family: "Figtree", sans-serif !important;
  font-size: 12.5px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  margin-bottom: 25px !important;
}

.obligo-blog-details-title {
  font-family: "Figtree", sans-serif !important;
  font-size: 40px !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  color: #08183F !important;
  margin-bottom: 25px !important;
}

.obligo-blog-details-meta {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 25px !important;
  flex-wrap: wrap !important;
}

.obligo-blog-details-meta-item {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 14px !important;
  color: #7A89A0 !important;
}

.obligo-blog-details-meta-item i {
  color: #1764FF !important;
}

/* Featured Header Image */
.obligo-blog-details-hero-img-box {
  border-radius: 24px !important;
  overflow: hidden !important;
  box-shadow: 0 20px 50px rgba(24, 55, 105, 0.08) !important;
  margin-bottom: 60px !important;
  max-height: 520px !important;
}

.obligo-blog-details-hero-img-box img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

/* Content & Sidebar Columns */
.obligo-blog-details-body {
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 16.5px !important;
  line-height: 1.85 !important;
  color: #4A5668 !important;
  text-align: left !important;
}

.obligo-blog-details-body h2 {
  font-family: "Figtree", sans-serif !important;
  font-size: 28px !important;
  font-weight: 700 !important;
  color: #08183F !important;
  margin-top: 45px !important;
  margin-bottom: 20px !important;
}

.obligo-blog-details-body h3 {
  font-family: "Figtree", sans-serif !important;
  font-size: 22px !important;
  font-weight: 700 !important;
  color: #08183F !important;
}

.obligo-blog-details-body p {
  margin-bottom: 25px !important;
}

.obligo-blog-details-body blockquote {
  background: #F8FAFC !important;
  border-left: 4px solid #1764FF !important;
  border-radius: 4px 12px 12px 4px !important;
  padding: 30px !important;
  margin: 35px 0 !important;
  font-style: italic !important;
  font-size: 18px !important;
  line-height: 1.7 !important;
  color: #08183F !important;
}

.obligo-blog-details-body ul:not(.obligo-article-list) {
  list-style: none !important;
  padding-left: 0 !important;
  margin-top: 15px !important;
  margin-bottom: 30px !important;
}

.obligo-blog-details-body ul:not(.obligo-article-list) li {
  position: relative !important;
  padding-left: 36px !important;
  margin-bottom: 14px !important;
  font-family: "Figtree", sans-serif !important;
  font-size: 16px !important;
  line-height: 1.65 !important;
  color: #1E293B !important;
}

.obligo-blog-details-body ul:not(.obligo-article-list) li::before {
  content: "\f00c" !important;
  font-family: "Font Awesome 6 Free" !important;
  font-weight: 900 !important;
  position: absolute !important;
  left: 0 !important;
  top: 3px !important;
  width: 22px !important;
  height: 22px !important;
  border-radius: 50% !important;
  background: #1764FF !important;
  color: #ffffff !important;
  font-size: 11px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: 0 3px 8px rgba(23, 100, 255, 0.25) !important;
}

/* Sidebar Widgets */
.obligo-blog-details-sidebar {
  position: sticky !important;
  top: 130px !important;
  z-index: 10 !important;
}

.obligo-blog-details-widget {
  background: #ffffff !important;
  border: 1px solid #E4ECF8 !important;
  border-radius: 20px !important;
  padding: 30px !important;
  box-shadow: 0 10px 30px rgba(24, 55, 105, 0.02) !important;
  margin-bottom: 30px !important;
}

.obligo-blog-details-widget-title {
  font-family: "Figtree", sans-serif !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  color: #08183F !important;
  margin-bottom: 20px !important;
  border-bottom: 2px solid #F4F7FC !important;
  padding-bottom: 12px !important;
  text-align: left !important;
}

/* Recent Posts widget */
.obligo-blog-details-recent-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 20px !important;
}

.obligo-blog-details-recent-item {
  display: flex !important;
  gap: 15px !important;
  align-items: center !important;
}

.obligo-blog-details-recent-img {
  width: 65px !important;
  height: 65px !important;
  border-radius: 12px !important;
  object-fit: cover !important;
}

.obligo-blog-details-recent-info {
  text-align: left !important;
}

.obligo-blog-details-recent-info h5 {
  margin: 0 0 6px 0 !important;
}

.obligo-blog-details-recent-info h5 a {
  font-family: "Figtree", sans-serif !important;
  font-size: 14.5px !important;
  font-weight: 700 !important;
  color: #08183F !important;
  line-height: 1.4 !important;
  text-decoration: none !important;
  transition: color 0.2s ease !important;
}

.obligo-blog-details-recent-info h5 a:hover {
  color: #1764FF !important;
}

.obligo-blog-details-recent-date {
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 12px !important;
  color: #7A89A0 !important;
}

/* Newsletter Widget */
.obligo-blog-details-newsletter-desc {
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 14px !important;
  color: #53617A !important;
  margin-bottom: 20px !important;
  text-align: left !important;
  line-height: 1.5 !important;
}

.obligo-blog-details-newsletter-form input {
  width: 100% !important;
  height: 48px !important;
  border-radius: 12px !important;
  border: 1px solid #E4ECF8 !important;
  padding: 0 18px !important;
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 14.5px !important;
  margin-bottom: 12px !important;
  outline: none !important;
  transition: border-color 0.3s ease !important;
}

.obligo-blog-details-newsletter-form input:focus {
  border-color: #1764FF !important;
}

.obligo-blog-details-newsletter-form button {
  width: 100% !important;
  height: 48px !important;
  border-radius: 12px !important;
  background: #1764FF !important;
  color: #ffffff !important;
  border: none !important;
  font-family: "Figtree", sans-serif !important;
  font-size: 14.5px !important;
  font-weight: 700 !important;
  cursor: pointer !important;
  transition: background 0.3s ease !important;
}

.obligo-blog-details-newsletter-form button:hover {
  background: #2874FF !important;
}

/* Social Share */
.obligo-blog-details-share-row {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  flex-wrap: wrap !important;
}

.obligo-blog-details-share-btn {
  width: 40px !important;
  height: 40px !important;
  border-radius: 50% !important;
  background: #F4F7FC !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #53617A !important;
  font-size: 14px !important;
  text-decoration: none !important;
  transition: all 0.3s ease !important;
}

.obligo-blog-details-share-btn:hover {
  background: #1764FF !important;
  color: #ffffff !important;
}

/* Related section bottom */
.obligo-blog-details-related-area {
  padding: 80px 0 100px 0 !important;
  background: #F9FBFE !important;
  border-top: 1px solid #E4ECF8 !important;
}

.obligo-blog-details-related-title {
  font-family: "Figtree", sans-serif !important;
  font-size: 32px !important;
  font-weight: 800 !important;
  color: #08183F !important;
  margin-bottom: 40px !important;
}

@media (max-width: 991px) {
  .obligo-blog-details-title {
    font-size: 34px !important;
  }

  .obligo-blog-details-sidebar {
    margin-top: 50px !important;
    position: static !important;
  }
}

/* Table of Contents Styling */
.obligo-blog-details-toc-list {
  list-style: none !important;
  padding-left: 0 !important;
  margin: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
}

.obligo-blog-details-toc-link {
  font-family: "Figtree", sans-serif !important;
  font-size: 14.5px !important;
  font-weight: 600 !important;
  color: #7A89A0 !important;
  text-decoration: none !important;
  display: block !important;
  border-left: 2px solid transparent !important;
  padding-left: 12px !important;
  transition: all 0.25s ease !important;
  text-align: left !important;
}

.obligo-blog-details-toc-link:hover,
.obligo-blog-details-toc-link.active {
  color: #1764FF !important;
  border-left-color: #1764FF !important;
}

/* ==================================================
   OBLIGO PREMIUM REDESIGNED FOOTER STYLES
   ================================================= */
.obligo-premium-footer {
  position: relative !important;
  background: linear-gradient(180deg, #FFFFFF 0%, #F4F7FF 100%) !important;
  padding: 50px 0 40px 0 !important;
  border-top: 1px solid rgba(23, 100, 255, 0.05) !important;
  overflow: clip !important;
}

/* Background effects */
.obligo-premium-footer::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  pointer-events: none !important;
  background-image: radial-gradient(rgba(23, 100, 255, 0.07) 1.5px, transparent 1.5px) !important;
  background-size: 24px 24px !important;
  z-index: 1 !important;
}

.obligo-footer-glow {
  position: absolute !important;
  border-radius: 50% !important;
  filter: blur(140px) !important;
  opacity: 0.65 !important;
  pointer-events: none !important;
  z-index: 1 !important;
}

.obligo-footer-glow-1 {
  top: -80px !important;
  left: 10% !important;
  width: 300px !important;
  height: 300px !important;
  background: rgba(23, 100, 255, 0.28) !important;
}

.obligo-footer-glow-2 {
  bottom: -80px !important;
  right: 10% !important;
  width: 350px !important;
  height: 350px !important;
  background: rgba(147, 51, 234, 0.18) !important;
}

.obligo-premium-footer .container {
  position: relative !important;
  z-index: 2 !important;
}

/* SVG Wave Divider */
.obligo-footer-wave-divider {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 40px !important;
  overflow: hidden !important;
  pointer-events: none !important;
  z-index: 3 !important;
}

.obligo-footer-wave-divider svg {
  width: 100% !important;
  height: 100% !important;
  display: block !important;
}

/* Brand area */
.obligo-footer-logo {
  /* height: 36px !important; */
  width: 150px !important;
  margin-bottom: 20px !important;
}

.obligo-footer-desc {
  font-family: "Figtree", sans-serif !important;
  font-size: 14.5px !important;
  line-height: 1.65 !important;
  color: #475569 !important;
  margin-bottom: 24px !important;
  font-weight: 400 !important;
}

/* Social icons */
.obligo-footer-social {
  display: flex !important;
  gap: 12px !important;
}

.obligo-footer-social a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 38px !important;
  height: 38px !important;
  border-radius: 50% !important;
  background: #ffffff !important;
  color: #1764FF !important;
  text-decoration: none !important;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
  border: 1px solid rgba(23, 100, 255, 0.1) !important;
}

.obligo-footer-social a:hover {
  background: #1764FF !important;
  color: #ffffff !important;
  transform: translateY(-3px) !important;
  box-shadow: 0 8px 20px rgba(23, 100, 255, 0.25) !important;
  border-color: #1764FF !important;
}

.obligo-footer-svg {
  width: 18px !important;
  height: 18px !important;
  transition: transform 0.25s ease !important;
}

.obligo-footer-social a:hover .obligo-footer-svg {
  transform: scale(1.1) !important;
}

/* Columns styling */
.obligo-footer-heading {
  font-family: "Figtree", sans-serif !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 1.5px !important;
  color: #0F172A !important;
  margin-bottom: 24px !important;
  position: relative !important;
  padding-bottom: 10px !important;
}

.obligo-footer-heading::after {
  content: "" !important;
  position: absolute !important;
  bottom: 0 !important;
  left: 0 !important;
  width: 24px !important;
  height: 2px !important;
  background: #1764FF !important;
  border-radius: 2px !important;
}

/* Links column */
.obligo-footer-links-list {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
}

.obligo-footer-links-list li a {
  font-family: "Figtree", sans-serif !important;
  font-size: 14.5px !important;
  font-weight: 500 !important;
  color: #475569 !important;
  text-decoration: none !important;
  transition: all 0.2s ease !important;
  display: inline-block !important;
}

.obligo-footer-links-list li a:hover {
  color: #1764FF !important;
  transform: translateX(4px) !important;
}

/* Contact column */
.obligo-footer-contact-desc {
  font-family: "Figtree", sans-serif !important;
  font-size: 14.5px !important;
  color: #475569 !important;
  margin-bottom: 20px !important;
  line-height: 1.6 !important;
}

.obligo-footer-contact-item {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
  padding: 14px 18px !important;
  background: #ffffff !important;
  border: 1px solid rgba(23, 100, 255, 0.08) !important;
  border-radius: 12px !important;
  transition: all 0.3s ease !important;
}

.obligo-footer-contact-item:hover {
  border-color: rgba(23, 100, 255, 0.25) !important;
  box-shadow: 0 10px 25px rgba(23, 100, 255, 0.06) !important;
}

.obligo-footer-contact-icon {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 40px !important;
  height: 40px !important;
  border-radius: 8px !important;
  background: rgba(23, 100, 255, 0.08) !important;
  color: #1764FF !important;
}

.obligo-footer-contact-icon .obligo-footer-svg {
  width: 20px !important;
  height: 20px !important;
}

.obligo-footer-contact-info {
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
}

.obligo-footer-contact-info span {
  font-family: "Figtree", sans-serif !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  color: #94A3B8 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
}

.obligo-footer-contact-info a {
  font-family: "Figtree", sans-serif !important;
  font-size: 14.5px !important;
  font-weight: 600 !important;
  color: #0F172A !important;
  text-decoration: none !important;
  transition: color 0.2s ease !important;
}

.obligo-footer-contact-info a:hover {
  color: #1764FF !important;
}

/* Bottom Bar */
.obligo-footer-bottom {
  margin-top: 50px !important;
  padding-top: 24px !important;
  border-top: 1px solid rgba(23, 100, 255, 0.08) !important;
}

.obligo-footer-copy {
  font-family: "Figtree", sans-serif !important;
  font-size: 13.5px !important;
  color: #64748B !important;
  margin: 0 !important;
}

.obligo-footer-copy a {
  color: #1764FF !important;
  text-decoration: none !important;
  font-weight: 600 !important;
  transition: color 0.2s ease !important;
}

.obligo-footer-copy a:hover {
  color: #0d4cd3 !important;
  text-decoration: underline !important;
}

.obligo-footer-legal {
  display: inline-flex !important;
  align-items: center !important;
  gap: 12px !important;
}

.obligo-footer-legal a {
  font-family: "Figtree", sans-serif !important;
  font-size: 13.5px !important;
  color: #64748B !important;
  text-decoration: none !important;
  transition: color 0.2s ease !important;
}

.obligo-footer-legal a:hover {
  color: #1764FF !important;
}

.obligo-footer-legal .separator {
  color: #cbd5e1 !important;
  font-size: 12px !important;
}

/* Responsive fixes */
@media (max-width: 991px) {
  .obligo-premium-footer {
    padding: 40px 0 30px 0 !important;
  }

  .obligo-footer-heading {
    margin-bottom: 16px !important;
    margin-top: 8px !important;
  }

  .obligo-footer-bottom {
    margin-top: 30px !important;
  }
}

/* ==================================================
   OBLIGO PREMIUM PRICING COMING SOON STYLES
   ================================================== */
.obligo-coming-soon-section {
  padding: 120px 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 85vh !important;
}

.obligo-notify-form-wrapper {
  max-width: 580px !important;
  margin: 0 auto 75px auto !important;
  background: rgba(255, 255, 255, 0.4) !important;
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
  border: 1px solid rgba(23, 100, 255, 0.1) !important;
  padding: 16px !important;
  border-radius: 24px !important;
  box-shadow:
    0 20px 50px rgba(24, 55, 105, 0.04),
    0 0 0 1px rgba(255, 255, 255, 0.4) inset !important;
  transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.obligo-notify-form-wrapper:focus-within {
  border-color: rgba(23, 100, 255, 0.35) !important;
  box-shadow:
    0 30px 60px rgba(23, 100, 255, 0.08),
    0 0 0 1px rgba(255, 255, 255, 0.6) inset !important;
  transform: translateY(-2px) !important;
}

.obligo-notify-form {
  display: flex !important;
  gap: 12px !important;
  align-items: center !important;
}

.obligo-input-group {
  position: relative !important;
  flex-grow: 1 !important;
  display: flex !important;
  align-items: center !important;
}

.obligo-input-icon {
  position: absolute !important;
  left: 20px !important;
  color: #1764FF !important;
  font-size: 18px !important;
  pointer-events: none !important;
}

.obligo-notify-form input[type="email"] {
  width: 100% !important;
  height: 54px !important;
  background: #ffffff !important;
  border: 1px solid #E4ECF8 !important;
  border-radius: 14px !important;
  padding: 0 20px 0 54px !important;
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 15px !important;
  color: #08183F !important;
  outline: none !important;
  transition: all 0.3s ease !important;
}

.obligo-notify-form input[type="email"]:focus {
  border-color: #1764FF !important;
  box-shadow: 0 0 0 4px rgba(23, 100, 255, 0.1) !important;
}

.obligo-notify-btn {
  width: auto !important;
  padding: 0 32px !important;
  white-space: nowrap !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}

.obligo-notify-btn i {
  transition: transform 0.3s ease !important;
}

.obligo-notify-btn:hover i {
  transform: translateX(4px) !important;
}

.obligo-notify-message {
  margin-top: 12px !important;
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 14px !important;
  font-weight: 500 !important;
  display: none !important;
  text-align: center !important;
}

.obligo-notify-message.success {
  display: block !important;
  color: #10B981 !important;
}

.obligo-notify-message.error {
  display: block !important;
  color: #EF4444 !important;
}

/* Expectations Grid */
.obligo-expectations-grid {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 32px !important;
  max-width: 1100px !important;
  margin: 0 auto !important;
}

.obligo-expectation-card {
  background: rgba(255, 255, 255, 0.6) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
  border: 1px solid rgba(228, 236, 248, 0.8) !important;
  border-radius: 20px !important;
  padding: 40px 32px !important;
  box-shadow: 0 10px 30px rgba(24, 55, 105, 0.02) !important;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
  text-align: center !important;
}

.obligo-expectation-card:hover {
  transform: translateY(-5px) !important;
  background: #ffffff !important;
  border-color: #1764FF !important;
  box-shadow: 0 20px 40px rgba(24, 55, 105, 0.06) !important;
}

.obligo-expectation-icon-wrapper {
  width: 60px !important;
  height: 60px !important;
  border-radius: 16px !important;
  background: rgba(23, 100, 255, 0.08) !important;
  color: #1764FF !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 24px !important;
  margin: 0 auto 24px auto !important;
  transition: all 0.3s ease !important;
}

.obligo-expectation-card:hover .obligo-expectation-icon-wrapper {
  background: #1764FF !important;
  color: #ffffff !important;
  transform: scale(1.05) rotate(5deg) !important;
}

.obligo-expectation-title {
  font-family: "Figtree", sans-serif !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  color: #08183F !important;
  margin-bottom: 12px !important;
}

.obligo-expectation-desc {
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 14px !important;
  line-height: 1.6 !important;
  color: #53617A !important;
  margin: 0 !important;
}

@media (max-width: 991px) {
  .obligo-expectations-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 24px !important;
  }
}

@media (max-width: 767px) {
  .obligo-coming-soon-section {
    padding: 80px 0 !important;
  }

  .obligo-notify-form-wrapper {
    padding: 12px !important;
    border-radius: 20px !important;
  }

  .obligo-notify-form {
    flex-direction: column !important;
    gap: 10px !important;
  }

  .obligo-input-group {
    width: 100% !important;
  }

  .obligo-notify-btn {
    width: 100% !important;
  }

  .obligo-expectations-grid {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
  }
}

/* ==================================================
   OBLIGO USER GUIDE PAGE STYLES
   ================================================== */
.obligo-userguide-hero {
  padding: 100px 0 60px 0 !important;
  background: #ffffff !important;
  position: relative !important;
  overflow: hidden !important;
}

.obligo-userguide-hero .obligo-pricing-bg {
  opacity: 0.8 !important;
}

.obligo-userguide-hero-container {
  position: relative !important;
  z-index: 2 !important;
  max-width: 1200px !important;
}

.obligo-userguide-badge {
  display: inline-flex !important;
  align-items: center !important;
  background: #F2F6FF !important;
  color: #1764FF !important;
  border: 1px solid #E2EBFF !important;
  border-radius: 30px !important;
  padding: 8px 18px !important;
  font-family: "Figtree", sans-serif !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: 1.5px !important;
  margin-bottom: 20px !important;
}

.obligo-userguide-title {
  font-family: "Figtree", sans-serif !important;
  font-size: 40px !important;
  font-weight: 700 !important;
  line-height: 1.15 !important;
  color: #08183F !important;
  margin-bottom: 20px !important;
}

.obligo-userguide-highlight {
  color: #2874FF !important;
}

.obligo-userguide-subtitle {
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 18px !important;
  line-height: 1.6 !important;
  color: #53617A !important;
  max-width: 750px !important;
  margin: 0 auto !important;
}

/* Userguide Layout */
.obligo-userguide-section {
  padding: 0 0 100px 0 !important;
  background: #F9FBFE !important;
  position: relative !important;
}

.obligo-userguide-container {
  max-width: 1300px !important;
}

/* Sticky Sidebar Navigation */
.obligo-userguide-sidebar-wrapper {
  position: sticky !important;
  top: 100px !important;
  z-index: 10 !important;
}

.obligo-userguide-sidebar {
  background: #ffffff !important;
  border: 1px solid #E4ECF8 !important;
  border-radius: 20px !important;
  padding: 24px !important;
  box-shadow: 0 10px 30px rgba(24, 55, 105, 0.03) !important;
}

.obligo-userguide-sidebar-title {
  font-family: "Figtree", sans-serif !important;
  font-size: 16px !important;
  font-weight: 800 !important;
  color: #08183F !important;
  margin-bottom: 20px !important;
  padding-bottom: 12px !important;
  border-bottom: 1px solid #E4ECF8 !important;
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
}

.obligo-userguide-menu {
  list-style: none !important;
  padding-left: 0 !important;
  margin-bottom: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}

.obligo-userguide-menu-link {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 12px 16px !important;
  border-radius: 12px !important;
  color: #53617A !important;
  font-family: "Figtree", sans-serif !important;
  font-size: 14.5px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.obligo-userguide-menu-link i {
  font-size: 16px !important;
  color: #8A9BB5 !important;
  transition: color 0.3s ease !important;
  width: 20px !important;
  text-align: center !important;
}

.obligo-userguide-menu-link:hover {
  background: #F2F6FF !important;
  color: #1764FF !important;
}

.obligo-userguide-menu-link:hover i {
  color: #1764FF !important;
}

.obligo-userguide-menu-link.active {
  background: linear-gradient(135deg, #1764FF 0%, #2874FF 100%) !important;
  color: #ffffff !important;
  box-shadow: 0 4px 15px rgba(23, 100, 255, 0.2) !important;
}

.obligo-userguide-menu-link.active i {
  color: #ffffff !important;
}

/* Userguide Content Cards */
.obligo-userguide-content-wrapper {
  display: flex !important;
  flex-direction: column !important;
  gap: 40px !important;
}

.obligo-userguide-card {
  background: #ffffff !important;
  border: 1px solid #E4ECF8 !important;
  border-radius: 24px !important;
  padding: 48px !important;
  box-shadow: 0 10px 40px rgba(24, 55, 105, 0.03) !important;
  scroll-margin-top: 130px !important;
}

.obligo-userguide-card-header {
  display: flex !important;
  align-items: center !important;
  gap: 20px !important;
  margin-bottom: 24px !important;
  padding-bottom: 20px !important;
  border-bottom: 1px solid #F0F4FC !important;
}

.obligo-userguide-icon-box {
  width: 56px !important;
  height: 56px !important;
  border-radius: 16px !important;
  background: rgba(23, 100, 255, 0.08) !important;
  color: #1764FF !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 24px !important;
}

.obligo-userguide-card-title {
  font-family: "Figtree", sans-serif !important;
  font-size: 28px !important;
  font-weight: 800 !important;
  color: #08183F !important;
  margin-bottom: 0 !important;
}

.obligo-userguide-desc {
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 16px !important;
  line-height: 1.65 !important;
  color: #53617A !important;
  margin-bottom: 30px !important;
}

/* Steps Styling */
.obligo-userguide-steps-title {
  font-family: "Figtree", sans-serif !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  color: #08183F !important;
  margin-top: 28px !important;
  margin-bottom: 16px !important;
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
}

.obligo-userguide-steps-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 20px !important;
  margin-bottom: 30px !important;
}



.obligo-userguide-step-item {
  display: flex !important;
  align-items: flex-start !important;
  gap: 16px !important;
  padding: 20px !important;
  border-radius: 16px !important;
  background: #F9FBFE !important;
  border: 1px solid #E8EFF9 !important;
  transition: all 0.3s ease !important;
}

.obligo-userguide-step-item:hover {
  background: #ffffff !important;
  border-color: #1764FF !important;
  box-shadow: 0 10px 25px rgba(23, 100, 255, 0.04) !important;
}

.obligo-userguide-step-number {
  flex-shrink: 0 !important;
  width: 32px !important;
  height: 32px !important;
  border-radius: 50% !important;
  background: #1764FF !important;
  color: #ffffff !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-family: "Figtree", sans-serif !important;
  font-size: 14px !important;
  font-weight: 700 !important;
}

.obligo-userguide-step-content {
  flex-grow: 1 !important;
}

.obligo-userguide-step-title {
  font-family: "Figtree", sans-serif !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  color: #08183F !important;
  margin-bottom: 6px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.obligo-userguide-step-desc {
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 14.5px !important;
  line-height: 1.55 !important;
  color: #53617A !important;
  margin-bottom: 0 !important;
}

.obligo-userguide-step-sublist {
  list-style: none !important;
  padding-left: 0 !important;
  margin-top: 12px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}

.obligo-userguide-step-sublist li {
  position: relative !important;
  padding-left: 20px !important;
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 14px !important;
  color: #53617A !important;
  line-height: 1.5 !important;
}

.obligo-userguide-step-sublist li::before {
  content: "•" !important;
  color: #1764FF !important;
  font-weight: 700 !important;
  position: absolute !important;
  left: 5px !important;
  top: 0 !important;
}

/* Callouts / Tips */
.obligo-userguide-tips-box {
  background: rgba(23, 100, 255, 0.03) !important;
  border-left: 4px solid #1764FF !important;
  border-radius: 0 16px 16px 0 !important;
  padding: 24px !important;
  margin-top: 30px !important;
}

.obligo-userguide-tips-title {
  font-family: "Figtree", sans-serif !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  color: #1764FF !important;
  margin-bottom: 12px !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.obligo-userguide-tips-list {
  list-style: none !important;
  padding-left: 0 !important;
  margin-bottom: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
}

.obligo-userguide-tips-list li {
  position: relative !important;
  padding-left: 24px !important;
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 14.5px !important;
  line-height: 1.55 !important;
  color: #53617A !important;
}

.obligo-userguide-tips-list li i {
  position: absolute !important;
  left: 0 !important;
  top: 4px !important;
  color: #1764FF !important;
  font-size: 14px !important;
}

/* Workflows & Examples */
.obligo-userguide-workflow-wrapper {
  background: #F9FBFE !important;
  border: 1px dashed #D3E0F4 !important;
  border-radius: 16px !important;
  padding: 24px !important;
  margin-top: 24px !important;
}

.obligo-userguide-workflow-title {
  font-family: "Figtree", sans-serif !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  color: #08183F !important;
  margin-bottom: 16px !important;
}

.obligo-userguide-example-box {
  background: #ffffff !important;
  border: 1px solid #E4ECF8 !important;
  border-radius: 12px !important;
  padding: 16px 20px !important;
  margin-top: 16px !important;
}

.obligo-userguide-example-badge {
  display: inline-block !important;
  background: #FFF2E8 !important;
  color: #FF6A00 !important;
  border: 1px solid #FFD8BF !important;
  border-radius: 4px !important;
  font-family: "Figtree", sans-serif !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  padding: 2px 6px !important;
  text-transform: uppercase !important;
  margin-bottom: 8px !important;
}

.obligo-userguide-example-header {
  font-family: "Figtree", sans-serif !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  color: #08183F !important;
  margin-bottom: 6px !important;
}

.obligo-userguide-example-text {
  font-family: "Figtree", sans-serif !important;
  ;
  font-size: 13.5px !important;
  line-height: 1.6 !important;
  color: #53617A !important;
  margin-bottom: 0 !important;
}

/* Responsive Rules */
@media (max-width: 991px) {
  .obligo-userguide-sidebar-wrapper {
    position: relative !important;
    top: 0 !important;
    margin-bottom: 40px !important;
  }

  .obligo-userguide-hero {
    padding: 100px 0 40px 0 !important;
  }

  .obligo-userguide-title {
    font-size: 34px !important;
  }

  .obligo-userguide-card {
    padding: 30px !important;
  }
}

/* ==========================================================================
   SOLUTIONS SHOWCASE REDESIGN
   ========================================================================== */
.solutions-hero-section {
  position: relative !important;
  padding: 100px 0 20px !important;
  background: linear-gradient(180deg, rgba(23, 100, 255, 0.05) 0%, rgba(255, 255, 255, 0) 100%), #fafbfc !important;
  overflow: hidden !important;
}

.solutions-hero-section::before {
  content: "" !important;
  position: absolute !important;
  top: -20% !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  width: 600px !important;
  height: 600px !important;
  background: radial-gradient(circle, rgba(23, 100, 255, 0.08) 0%, rgba(23, 100, 255, 0) 70%) !important;
  z-index: 1 !important;
  pointer-events: none !important;
}

.solutions-pretitle {
  display: inline-block !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  color: #1764FF !important;
  text-transform: uppercase !important;
  letter-spacing: 2px !important;
  margin-bottom: 12px !important;
  position: relative !important;
  z-index: 2 !important;
}

.solutions-title {
  font-size: 40px !important;
  font-weight: 700 !important;
  color: #0c1a30 !important;
  margin-bottom: 20px !important;
  position: relative !important;
  z-index: 2 !important;
  letter-spacing: -1px !important;
}

.solutions-subtitle {
  font-size: 19px !important;
  color: #526077 !important;
  line-height: 1.6 !important;
  max-width: 780px !important;
  margin: 0 auto !important;
  position: relative !important;
  z-index: 2 !important;
}

.solutions-showcase-section {
  padding: 80px 0 120px !important;
  background: #fafbfc !important;
}

.showcase-item {
  margin-bottom: 120px !important;
}

.showcase-item:last-child {
  margin-bottom: 0 !important;
}

/* Alternate row layout */
.showcase-item:nth-child(even) {
  flex-direction: row-reverse !important;
}

.showcase-content {
  position: relative !important;
  padding: 0 50px !important;
}

.showcase-number {
  font-size: 110px !important;
  font-weight: 900 !important;
  color: rgba(23, 100, 255, 0.04) !important;
  position: absolute !important;
  top: -50px !important;
  left: 50px !important;
  line-height: 1 !important;
  z-index: 1 !important;
  font-family: "Figtree", sans-serif !important;
  ;
}

.showcase-badge {
  display: inline-block !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  color: #1764FF !important;
  letter-spacing: 1.5px !important;
  margin-bottom: 15px !important;
  position: relative !important;
  z-index: 2 !important;
}

.showcase-content h2 {
  font-size: 32px !important;
  font-weight: 800 !important;
  color: #0c1a30 !important;
  margin-bottom: 20px !important;
  line-height: 1.3 !important;
  position: relative !important;
  z-index: 2 !important;
}

.showcase-content p {
  font-size: 16px !important;
  color: #526077 !important;
  line-height: 1.7 !important;
  margin-bottom: 25px !important;
  position: relative !important;
  z-index: 2 !important;
}

.showcase-bullets {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 0 35px 0 !important;
  position: relative !important;
  z-index: 2 !important;
}

.showcase-bullets li {
  font-size: 15px !important;
  color: #3b485c !important;
  margin-bottom: 12px !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}

.showcase-bullets li i {
  color: #10b981 !important;
  font-size: 16px !important;
}

.showcase-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  background: #1764FF !important;
  color: #ffffff !important;
  padding: 12px 28px !important;
  border-radius: 30px !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  transition: all 0.3s ease !important;
  box-shadow: 0 4px 15px rgba(23, 100, 255, 0.2) !important;
  position: relative !important;
  z-index: 2 !important;
  width: fit-content !important;
}

.showcase-btn:hover {
  background: #004ee6 !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 25px rgba(23, 100, 255, 0.3) !important;
  color: #ffffff !important;
}

.showcase-btn i {
  transition: transform 0.3s ease !important;
}

.showcase-btn:hover i {
  transform: translateX(4px) !important;
}

/* Image styling with wrapper & glows */
.showcase-image-wrapper {
  position: relative !important;
  padding: 10px !important;
}

.showcase-image-glow {
  position: absolute !important;
  top: 5% !important;
  left: 5% !important;
  width: 90% !important;
  height: 90% !important;
  background: radial-gradient(circle, rgba(23, 100, 255, 0.15) 0%, rgba(23, 100, 255, 0) 70%) !important;
  z-index: 1 !important;
  filter: blur(20px) !important;
}

.showcase-image {
  width: 100% !important;
  border-radius: 24px !important;
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.08) !important;
  border: 1px solid #e5e9f2 !important;
  position: relative !important;
  z-index: 2 !important;
  transition: transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
}

.showcase-image-wrapper:hover .showcase-image {
  transform: scale(1.02) translateY(-4px) !important;
}

@media (max-width: 991px) {
  .solutions-title {
    font-size: 34px !important;
  }

  .showcase-item {
    margin-bottom: 80px !important;
  }

  .showcase-content {
    padding: 0 15px !important;
    text-align: center !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
  }

  .showcase-number {
    left: 50% !important;
    transform: translateX(-50%) !important;
    top: -40px !important;
  }

  .showcase-content h2 {
    font-size: 26px !important;
  }

  .showcase-bullets {
    align-self: center !important;
    margin: 0 auto 30px !important;
    text-align: left !important;
    width: fit-content !important;
  }

  .showcase-image-wrapper {
    margin-top: 30px !important;
  }
}

/* Global Font Family Standardization */
h1,
h2,
h3,
h4,
h5,
h6,
p,
ul,
ol,
li,
a {
  font-family: "Figtree", sans-serif !important;
}

/* WhatsApp Floating Button */
.whatsapp-float {
  position: fixed !important;
  right: 30px !important;
  bottom: 100px !important;
  /* Floats exactly above the progress-wrap */
  width: 56px !important;
  height: 56px !important;
  background-color: #25D366 !important;
  color: #FFFFFF !important;
  border-radius: 50px !important;
  text-align: center !important;
  box-shadow: 0 4px 15px rgba(37, 211, 102, 0.3) !important;
  z-index: 9999 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: all 0.3s ease-in-out !important;
  text-decoration: none !important;
}

.whatsapp-float:hover {
  background-color: #20ba5a !important;
  transform: scale(1.1) rotate(5deg) !important;
  box-shadow: 0 6px 20px rgba(37, 211, 102, 0.45) !important;
  color: #FFFFFF !important;
}

.whatsapp-float i {
  font-size: 30px !important;
  color: #FFFFFF !important;
}

/* Subtle pulse animation for WhatsApp button */
.whatsapp-float::before {
  content: "" !important;
  position: absolute !important;
  width: 100% !important;
  height: 100% !important;
  border-radius: 50px !important;
  background-color: #25D366 !important;
  opacity: 0.4 !important;
  z-index: -1 !important;
  animation: wa-pulse 2s infinite !important;
}

@keyframes wa-pulse {
  0% {
    transform: scale(1);
    opacity: 0.4;
  }

  100% {
    transform: scale(1.5);
    opacity: 0;
  }
}

/* Redesigned Modern Benefits Section */
.modern-benefits-section {
  position: relative !important;
  padding: 30px 0 !important;
  background: #FFFFFF !important;
  overflow: hidden !important;
}

.modern-benefits-bg {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  z-index: 1 !important;
  pointer-events: none !important;
}

.modern-benefits-section .container {
  position: relative !important;
  z-index: 2 !important;
}

/* Header style styling */
.modern-benefits-section .section-title h2 {
  font-family: "Figtree", sans-serif !important;
  font-size: 40px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  color: #0F172A !important;
  margin-bottom: 20px !important;
}

.modern-benefits-section .section-title p {
  font-family: "Figtree", sans-serif !important;
  font-size: 16.5px !important;
  color: #475569 !important;
  max-width: 600px !important;
  margin: 0 auto 50px !important;
}

/* Grid Layout */
.modern-benefits-grid {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 24px !important;
}

/* Benefit Card Design */
.modern-benefit-card {
  background: rgba(255, 255, 255, 0.75) !important;
  border: 1px solid rgba(37, 99, 235, 0.15) !important;
  border-radius: 20px !important;
  padding: 35px 24px !important;
  text-align: center !important;
  transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1) !important;
  box-shadow: 0 10px 30px rgba(37, 99, 235, 0.03) !important;
  position: relative !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
}

.modern-benefit-card::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background: linear-gradient(135deg, rgba(37, 99, 235, 0.05) 0%, rgba(99, 102, 241, 0.05) 100%) !important;
  opacity: 0 !important;
  transition: opacity 0.4s ease !important;
  z-index: 1 !important;
}

/* Card Hover States */
.modern-benefit-card:hover {
  transform: translateY(-6px) !important;
  border-color: rgba(37, 99, 235, 0.4) !important;
  box-shadow: 0 20px 40px rgba(37, 99, 235, 0.1) !important;
}

.modern-benefit-card:hover::before {
  opacity: 1 !important;
}

/* Icon styling */
.modern-benefit-icon {
  position: relative !important;
  z-index: 2 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 56px !important;
  height: 56px !important;
  border-radius: 14px !important;
  background: rgba(37, 99, 235, 0.08) !important;
  color: #2563eb !important;
  margin: 0 auto 24px !important;
  transition: all 0.4s ease !important;
}

.modern-benefit-card:hover .modern-benefit-icon {
  background: #2563eb !important;
  color: #FFFFFF !important;
  transform: scale(1.05) !important;
}

/* Text and Description */
.modern-benefit-card h3 {
  position: relative !important;
  z-index: 2 !important;
  font-family: "Figtree", sans-serif !important;
  font-size: 19px !important;
  font-weight: 700 !important;
  color: #0F172A !important;
  margin-bottom: 12px !important;
}

.modern-benefit-card p {
  position: relative !important;
  z-index: 2 !important;
  font-family: "Figtree", sans-serif !important;
  font-size: 14.5px !important;
  line-height: 1.6 !important;
  color: #475569 !important;
  margin: 0 !important;
}

/* Responsive Breakpoints */
@media (max-width: 1200px) {
  .modern-benefits-grid {
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 20px !important;
  }
}

@media (max-width: 991px) {
  .modern-benefits-section {
    padding: 80px 0 !important;
  }

  .modern-benefits-grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }

  .modern-benefits-section .section-title h2 {
    font-size: 34px !important;
  }
}

@media (max-width: 576px) {
  .modern-benefits-grid {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }

  .modern-benefit-card {
    padding: 30px 20px !important;
  }
}

/* Custom Elevated Blog Design Styles */
.obligo-blog-hero-head {
  max-width: 820px !important;
  margin: 0 auto 60px auto !important;
}

.obligo-blog-badge-dot {
  width: 8px !important;
  height: 8px !important;
  border-radius: 50% !important;
  background: #1764FF !important;
  display: inline-block !important;
  margin-right: 8px !important;
  box-shadow: 0 0 10px #1764FF !important;
  animation: obligo-dot-pulse 2s infinite ease-in-out !important;
}

@keyframes obligo-dot-pulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.4; transform: scale(1.3); }
}

.obligo-blog-card-footer {
  border-top: 1px solid #EEF3FA !important;
  padding-top: 18px !important;
  margin-top: auto !important;
  display: flex !important;
  justify-content: flex-end !important;
  align-items: center !important;
}

.obligo-blog-action-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 12px !important;
  font-family: "Figtree", sans-serif !important;
  font-size: 14.5px !important;
  font-weight: 700 !important;
  color: #1764FF !important;
  text-decoration: none !important;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.obligo-blog-btn-arrow {
  width: 40px !important;
  height: 40px !important;
  border-radius: 50% !important;
  background: #F2F6FF !important;
  color: #1764FF !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 14px !important;
  border: 1px solid #E2EBFF !important;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.obligo-blog-card:hover .obligo-blog-action-btn {
  color: #0d4ed8 !important;
}

.obligo-blog-card:hover .obligo-blog-btn-arrow {
  background: linear-gradient(135deg, #1764FF 0%, #2874FF 100%) !important;
  color: #ffffff !important;
  border-color: #1764FF !important;
  transform: translateX(6px) !important;
  box-shadow: 0 6px 20px rgba(23, 100, 255, 0.35) !important;
}

.obligo-blog-back-btn {
  display: inline-flex !important;
  align-items: center !important;
  background: #ffffff !important;
  color: #475569 !important;
  border: 1px solid #E2E8F0 !important;
  border-radius: 30px !important;
  padding: 10px 22px !important;
  font-family: "Figtree", sans-serif !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  transition: all 0.3s ease !important;
  box-shadow: 0 4px 12px rgba(0,0,0,0.03) !important;
}

.obligo-blog-back-btn:hover {
  color: #1764FF !important;
  border-color: #1764FF !important;
  background: #F8FAFC !important;
  transform: translateX(-4px) !important;
  box-shadow: 0 6px 18px rgba(23, 100, 255, 0.1) !important;
}


/* ==========================================================================
   ULTRA-PREMIUM WORLD-CLASS BLOG DESIGN STYLES
   ========================================================================== */

.obligo-blog-section-pro {
  background: #F8FAFC !important;
  position: relative !important;
  overflow: hidden !important;
  padding: 0px 0 40px 0 !important;
}

.obligo-blog-mesh-bg {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 600px !important;
  background: radial-gradient(circle at 50% -100px, rgba(37, 99, 235, 0.08) 0%, rgba(99, 102, 241, 0.03) 50%, transparent 80%) !important;
  pointer-events: none !important;
}

.obligo-blog-pro-hero {
  max-width: 820px !important;
  margin: 0 auto 50px auto !important;
}

.obligo-blog-pill-badge {
  display: inline-flex !important;
  align-items: center !important;
  background: rgba(37, 99, 235, 0.08) !important;
  color: #2563EB !important;
  border: 1px solid rgba(37, 99, 235, 0.18) !important;
  border-radius: 50px !important;
  padding: 6px 16px !important;
  font-family: "Figtree", sans-serif !important;
  font-size: 12.5px !important;
  font-weight: 800 !important;
  letter-spacing: 1px !important;
  margin-bottom: 24px !important;
  text-transform: uppercase !important;
}

.obligo-blog-pulse-dot {
  width: 7px !important;
  height: 7px !important;
  border-radius: 50% !important;
  background: #2563EB !important;
  display: inline-block !important;
  margin-right: 8px !important;
  box-shadow: 0 0 10px #2563EB !important;
  animation: obligo-pulse-glow 2s infinite ease-in-out !important;
}

@keyframes obligo-pulse-glow {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.3; transform: scale(1.4); }
}

.obligo-blog-pro-title {
  font-family: "Figtree", sans-serif !important;
  font-size: 46px !important;
  font-weight: 800 !important;
  color: #0F172A !important;
  line-height: 1.15 !important;
  letter-spacing: -0.02em !important;
  margin-bottom: 20px !important;
}

.obligo-blog-pro-subtitle {
  font-family: "Figtree", sans-serif !important;
  font-size: 18px !important;
  line-height: 1.65 !important;
  color: #475569 !important;
  margin: 0 auto !important;
}

/* Featured Spotlight Card */
.obligo-blog-featured-wrap {
  border-radius: 24px !important;
  background: #ffffff !important;
  border: 1px solid #E2E8F0 !important;
  box-shadow: 0 20px 40px -15px rgba(15, 23, 42, 0.05) !important;
  overflow: hidden !important;
  transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.obligo-blog-featured-wrap:hover {
  box-shadow: 0 25px 50px -12px rgba(37, 99, 235, 0.12) !important;
  border-color: #CBD5E1 !important;
}

.obligo-blog-featured-img-box {
  position: relative !important;
  height: 420px !important;
  overflow: hidden !important;
  background: #0F172A !important;
}

.obligo-blog-featured-img-box img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.obligo-blog-featured-wrap:hover .obligo-blog-featured-img-box img {
  transform: scale(1.04) !important;
}

.obligo-blog-featured-badges {
  position: absolute !important;
  top: 24px !important;
  left: 24px !important;
  display: flex !important;
  gap: 8px !important;
  z-index: 2 !important;
}

.obligo-blog-featured-content {
  padding: 48px !important;
}

.obligo-blog-meta {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  margin-bottom: 16px !important;
}

.obligo-blog-meta-item {
  font-family: "Figtree", sans-serif !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  color: #64748B !important;
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
}

.obligo-blog-meta-item i {
  color: #2563EB !important;
}

.obligo-blog-meta-dot {
  color: #CBD5E1 !important;
  font-size: 14px !important;
}

.obligo-blog-featured-title {
  font-family: "Figtree", sans-serif !important;
  font-size: 28px !important;
  font-weight: 800 !important;
  line-height: 1.3 !important;
  color: #0F172A !important;
  margin-bottom: 16px !important;
  letter-spacing: -0.01em !important;
}

.obligo-blog-featured-title a {
  color: #0F172A !important;
  text-decoration: none !important;
  transition: color 0.25s ease !important;
}

.obligo-blog-featured-title a:hover {
  color: #2563EB !important;
}

.obligo-blog-featured-desc {
  font-family: "Figtree", sans-serif !important;
  font-size: 16px !important;
  line-height: 1.65 !important;
  color: #475569 !important;
  margin: 0 !important;
}

.obligo-blog-btn-primary {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  background: linear-gradient(135deg, #2563EB 0%, #1D4ED8 100%) !important;
  color: #ffffff !important;
  font-family: "Figtree", sans-serif !important;
  font-size: 14.5px !important;
  font-weight: 700 !important;
  padding: 12px 26px !important;
  border-radius: 50px !important;
  text-decoration: none !important;
  box-shadow: 0 8px 20px -4px rgba(37, 99, 235, 0.4) !important;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.obligo-blog-btn-primary:hover {
  background: linear-gradient(135deg, #1D4ED8 0%, #1E40AF 100%) !important;
  color: #ffffff !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 12px 25px -4px rgba(37, 99, 235, 0.5) !important;
}

.obligo-blog-btn-primary i {
  transition: transform 0.3s ease !important;
}

.obligo-blog-btn-primary:hover i {
  transform: translateX(4px) !important;
}

/* Section Headings */
.obligo-blog-section-heading {
  font-family: "Figtree", sans-serif !important;
  font-size: 24px !important;
  font-weight: 800 !important;
  color: #0F172A !important;
  letter-spacing: -0.01em !important;
}

/* Grid Cards Pro */
.obligo-blog-card-pro {
  background: #ffffff !important;
  border: 1px solid #E2E8F0 !important;
  border-radius: 20px !important;
  overflow: hidden !important;
  height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  box-shadow: 0 10px 30px -10px rgba(15, 23, 42, 0.04) !important;
  transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.obligo-blog-card-pro:hover {
  transform: translateY(-6px) !important;
  box-shadow: 0 20px 40px -10px rgba(37, 99, 235, 0.12) !important;
  border-color: #CBD5E1 !important;
}

.obligo-blog-card-img-wrap {
  position: relative !important;
  height: 230px !important;
  overflow: hidden !important;
  background: #F1F5F9 !important;
}

.obligo-blog-card-img-wrap img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.obligo-blog-card-pro:hover .obligo-blog-card-img-wrap img {
  transform: scale(1.05) !important;
}

/* Floating Pill Tags */
.obligo-blog-pill-tag {
  font-family: "Figtree", sans-serif !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  letter-spacing: 0.8px !important;
  padding: 6px 14px !important;
  border-radius: 30px !important;
  text-transform: uppercase !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1) !important;
}

.obligo-blog-card-img-wrap .obligo-blog-pill-tag {
  position: absolute !important;
  top: 18px !important;
  left: 18px !important;
  z-index: 2 !important;
}

.obligo-blog-pill-tag.featured {
  background: rgba(15, 23, 42, 0.85) !important;
  color: #FACC15 !important;
  border: 1px solid rgba(250, 204, 21, 0.3) !important;
}

.obligo-blog-pill-tag.contract {
  background: rgba(37, 99, 235, 0.9) !important;
  color: #ffffff !important;
}

.obligo-blog-pill-tag.compliance {
  background: rgba(37, 99, 235, 0.9) !important;
  color: #ffffff !important;
}

.obligo-blog-pill-tag.ai {
  background: rgba(139, 92, 246, 0.9) !important;
  color: #ffffff !important;
}

/* Card Body Pro */
.obligo-blog-card-body {
  padding: 28px !important;
  display: flex !important;
  flex-direction: column !important;
  flex-grow: 1 !important;
}

.obligo-blog-card-pro-title {
  font-family: "Figtree", sans-serif !important;
  font-size: 20px !important;
  font-weight: 800 !important;
  line-height: 1.35 !important;
  color: #0F172A !important;
  margin-bottom: 12px !important;
}

.obligo-blog-card-pro-title a {
  color: #0F172A !important;
  text-decoration: none !important;
  transition: color 0.25s ease !important;
}

.obligo-blog-card-pro-title a:hover {
  color: #2563EB !important;
}

.obligo-blog-card-pro-desc {
  font-family: "Figtree", sans-serif !important;
  font-size: 14.5px !important;
  line-height: 1.6 !important;
  color: #64748B !important;
  margin-bottom: 24px !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 3 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  flex-grow: 1 !important;
}

.obligo-blog-card-pro-footer {
  border-top: 1px solid #F1F5F9 !important;
  padding-top: 18px !important;
  margin-top: auto !important;
  display: flex !important;
  justify-content: flex-start !important;
}

.obligo-blog-link-pro {
  font-family: "Figtree", sans-serif !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  color: #2563EB !important;
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center !important;
  transition: all 0.25s ease !important;
}

.obligo-blog-link-pro i {
  transition: transform 0.25s ease !important;
}

.obligo-blog-card-pro:hover .obligo-blog-link-pro {
  color: #1D4ED8 !important;
}

.obligo-blog-card-pro:hover .obligo-blog-link-pro i {
  transform: translateX(5px) !important;
}

@media (max-width: 991px) {
  .obligo-blog-featured-content {
    padding: 32px !important;
  }
  .obligo-blog-featured-img-box {
    height: 300px !important;
  }
  .obligo-blog-pro-title {
    font-size: 34px !important;
  }
}


/* ==========================================================================
   FIXED PREVIEW & EXECUTIVE STYLING FOR BLOG (HEADER OVERLAP & BADGES)
   ========================================================================== */

.obligo-blog-section-pro {
  background: #F8FAFC !important;
  position: relative !important;
  overflow: hidden !important;
  padding-top: 90px !important;
  padding-bottom: 0px !important;
}

.obligo-blog-mesh-bg {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 600px !important;
  background: radial-gradient(circle at 50% 0px, rgba(23, 100, 255, 0.06) 0%, rgba(37, 99, 235, 0.02) 60%, transparent 80%) !important;
  pointer-events: none !important;
}

.obligo-blog-pro-hero {
  max-width: 820px !important;
  margin: 0 auto 50px auto !important;
}

.obligo-blog-pill-badge {
  display: inline-flex !important;
  align-items: center !important;
  background: #EFF6FF !important;
  color: #1764FF !important;
  border: 1px solid #DBEAFE !important;
  border-radius: 50px !important;
  padding: 6px 18px !important;
  font-family: "Figtree", sans-serif !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  letter-spacing: 1px !important;
  margin-bottom: 20px !important;
  text-transform: uppercase !important;
}

.obligo-blog-pulse-dot {
  width: 7px !important;
  height: 7px !important;
  border-radius: 50% !important;
  background: #1764FF !important;
  display: inline-block !important;
  margin-right: 8px !important;
  box-shadow: 0 0 10px #1764FF !important;
  animation: obligo-pulse-glow 2s infinite ease-in-out !important;
}

.obligo-blog-pro-title {
  font-family: "Figtree", sans-serif !important;
  font-size: 42px !important;
  font-weight: 800 !important;
  color: #08183F !important;
  line-height: 1.2 !important;
  letter-spacing: -0.02em !important;
  margin-bottom: 16px !important;
}

.obligo-blog-pro-subtitle {
  font-family: "Figtree", sans-serif !important;
  font-size: 17px !important;
  line-height: 1.65 !important;
  color: #53617A !important;
  margin: 0 auto !important;
}

/* Featured Card Fixes */
.obligo-blog-featured-wrap {
  border-radius: 20px !important;
  background: #ffffff !important;
  border: 1px solid #E2ECF8 !important;
  box-shadow: 0 15px 35px rgba(8, 24, 63, 0.05) !important;
  overflow: hidden !important;
  transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.obligo-blog-featured-wrap:hover {
  box-shadow: 0 25px 50px rgba(8, 24, 63, 0.1) !important;
  border-color: #CBD5E1 !important;
}

.obligo-blog-featured-img-box {
  position: relative !important;
  height: 380px !important;
  overflow: hidden !important;
  background: #08183F !important;
}

.obligo-blog-featured-img-box img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.obligo-blog-featured-wrap:hover .obligo-blog-featured-img-box img {
  transform: scale(1.04) !important;
}

.obligo-blog-featured-badges {
  position: absolute !important;
  top: 20px !important;
  left: 20px !important;
  display: flex !important;
  gap: 8px !important;
  z-index: 5 !important;
}

.obligo-blog-featured-content {
  padding: 40px 45px !important;
}

.obligo-blog-featured-title {
  font-family: "Figtree", sans-serif !important;
  font-size: 26px !important;
  font-weight: 800 !important;
  line-height: 1.35 !important;
  color: #08183F !important;
  margin-bottom: 16px !important;
  letter-spacing: -0.01em !important;
}

.obligo-blog-featured-title a {
  color: #08183F !important;
  text-decoration: none !important;
  transition: color 0.25s ease !important;
}

.obligo-blog-featured-title a:hover {
  color: #1764FF !important;
}

.obligo-blog-featured-desc {
  font-family: "Figtree", sans-serif !important;
  font-size: 15.5px !important;
  line-height: 1.65 !important;
  color: #53617A !important;
  margin: 0 !important;
}

.obligo-blog-btn-primary {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  background: #1764FF !important;
  color: #ffffff !important;
  font-family: "Figtree", sans-serif !important;
  font-size: 14.5px !important;
  font-weight: 700 !important;
  padding: 12px 26px !important;
  border-radius: 50px !important;
  text-decoration: none !important;
  box-shadow: 0 6px 18px rgba(23, 100, 255, 0.3) !important;
  transition: all 0.3s ease !important;
}

.obligo-blog-btn-primary:hover {
  background: #0d4ed8 !important;
  color: #ffffff !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 10px 25px rgba(23, 100, 255, 0.4) !important;
}

/* Grid Cards Fixing Badges Over Images */
.obligo-blog-card-pro {
  background: #ffffff !important;
  border: 1px solid #E2ECF8 !important;
  border-radius: 18px !important;
  overflow: hidden !important;
  height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  box-shadow: 0 10px 30px rgba(8, 24, 63, 0.03) !important;
  transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.obligo-blog-card-pro:hover {
  transform: translateY(-6px) !important;
  box-shadow: 0 20px 40px rgba(8, 24, 63, 0.08) !important;
  border-color: #D6E3F8 !important;
}

.obligo-blog-card-img-wrap {
  position: relative !important;
  height: 220px !important;
  overflow: hidden !important;
  background: #F4F7FC !important;
}

.obligo-blog-card-img-wrap img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  transition: transform 0.5s ease !important;
}

.obligo-blog-card-pro:hover .obligo-blog-card-img-wrap img {
  transform: scale(1.05) !important;
}

.obligo-blog-card-img-wrap .obligo-blog-pill-tag {
  position: absolute !important;
  top: 16px !important;
  left: 16px !important;
  z-index: 5 !important;
  margin: 0 !important;
}

/* Pill Badge Styles Floating Over Image */
.obligo-blog-pill-tag {
  font-family: "Figtree", sans-serif !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.5px !important;
  padding: 6px 14px !important;
  border-radius: 30px !important;
  text-transform: uppercase !important;
  color: #ffffff !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
  display: inline-block !important;
}

.obligo-blog-pill-tag.featured {
  background: #08183F !important;
  color: #FACC15 !important;
  border: 1px solid rgba(250, 204, 21, 0.3) !important;
}

.obligo-blog-pill-tag.contract {
  background: linear-gradient(135deg, #1764FF 0%, #2874FF 100%) !important;
}

.obligo-blog-pill-tag.compliance {
  background: linear-gradient(135deg, #1764FF 0%, #2874FF 100%) !important;
}

.obligo-blog-pill-tag.ai {
  background: linear-gradient(135deg, #1764FF 0%, #2874FF 100%) !important;
}

/* Card Body & Text */
.obligo-blog-card-body {
  padding: 26px !important;
  display: flex !important;
  flex-direction: column !important;
  flex-grow: 1 !important;
}

.obligo-blog-card-pro-title {
  font-family: "Figtree", sans-serif !important;
  font-size: 19.5px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
  color: #08183F !important;
  margin-bottom: 12px !important;
}

.obligo-blog-card-pro-title a {
  color: #08183F !important;
  text-decoration: none !important;
  transition: color 0.25s ease !important;
}

.obligo-blog-card-pro-title a:hover {
  color: #1764FF !important;
}

.obligo-blog-card-pro-desc {
  font-family: "Figtree", sans-serif !important;
  font-size: 14.5px !important;
  line-height: 1.6 !important;
  color: #53617A !important;
  margin-bottom: 22px !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 3 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  flex-grow: 1 !important;
}

.obligo-blog-card-pro-footer {
  border-top: 1px solid #E4ECF8 !important;
  padding-top: 16px !important;
  margin-top: auto !important;
}

.obligo-blog-link-pro {
  font-family: "Figtree", sans-serif !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  color: #1764FF !important;
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center !important;
  transition: all 0.25s ease !important;
}

.obligo-blog-card-pro:hover .obligo-blog-link-pro {
  color: #0d4ed8 !important;
}

.obligo-blog-card-pro:hover .obligo-blog-link-pro i {
  transform: translateX(5px) !important;
}


/* ==========================================================================
   ELEGANT & CLEAN BLOG DETAILS LEFT CONTENT TYPOGRAPHY & LIST STYLES
   ========================================================================== */

.obligo-blog-details-body {
  font-family: "Figtree", sans-serif !important;
  color: #334155 !important;
}

.obligo-blog-details-body h2 {
  font-family: "Figtree", sans-serif !important;
  font-size: 25px !important;
  font-weight: 800 !important;
  color: #08183F !important;
  line-height: 1.35 !important;
  margin-top: 42px !important;
  margin-bottom: 20px !important;
  padding-left: 16px !important;
  border-left: 4px solid #1764FF !important;
  letter-spacing: -0.01em !important;
}

.obligo-blog-details-body h3 {
  font-family: "Figtree", sans-serif !important;
  font-size: 18.5px !important;
  font-weight: 700 !important;
  color: #08183F !important;
  line-height: 1.4 !important;
  margin-top: 18px !important;
  margin-bottom: 10px !important;
}

.obligo-blog-details-body p {
  font-family: "Figtree", sans-serif !important;
  font-size: 16px !important;
  line-height: 1.8 !important;
  color: #475569 !important;
  margin-bottom: 22px !important;
}

/* Styled Bullet Lists Container */
.obligo-blog-details-body .obligo-article-list {
  list-style: none !important;
  margin-top: 25px !important;
  margin-bottom: 35px !important;
  background: #F8FAFC !important;
  border: 1px solid #E2E8F0 !important;
  border-radius: 16px !important;
  padding: 28px 32px 28px 32px !important;
  padding-left: 32px !important;
}

.obligo-blog-details-body .obligo-article-list li {
  position: relative !important;
  padding-left: 34px !important;
  margin-bottom: 14px !important;
  font-family: "Figtree", sans-serif !important;
  font-size: 16px !important;
  line-height: 1.65 !important;
  color: #1E293B !important;
}

.obligo-blog-details-body .obligo-article-list li:last-child {
  margin-bottom: 0 !important;
}

.obligo-blog-details-body .obligo-article-list li::before {
  content: "\f00c" !important;
  font-family: "Font Awesome 6 Free" !important;
  font-weight: 900 !important;
  position: absolute !important;
  left: 0 !important;
  top: 3px !important;
  width: 22px !important;
  height: 22px !important;
  border-radius: 50% !important;
  background: #1764FF !important;
  color: #ffffff !important;
  font-size: 11px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: 0 3px 8px rgba(23, 100, 255, 0.25) !important;
}


/* ==========================================================================
   OBLIGO PREMIUM PRICING & PLANS SECTION STYLES
   ========================================================================== */

.obligo-pricing-hero-area {
  position: relative !important;
  padding: 90px 0 20px 0 !important;
  background: linear-gradient(180deg, #F8FAFC 0%, #FFFFFF 100%) !important;
  overflow: hidden !important;
}

.obligo-pricing-bg-glow {
  position: absolute !important;
  top: -100px !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  width: 800px !important;
  height: 500px !important;
  background: radial-gradient(circle, rgba(23, 100, 255, 0.08) 0%, rgba(255, 255, 255, 0) 70%) !important;
  pointer-events: none !important;
  z-index: 1 !important;
}

.relative-z {
  position: relative !important;
  z-index: 5 !important;
}

.max-w-750 {
  max-width: 750px !important;
}

.obligo-pricing-badge-pill {
  font-family: "Figtree", sans-serif !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 1px !important;
  color: #1764FF !important;
  background: rgba(23, 100, 255, 0.08) !important;
  padding: 8px 18px !important;
  border-radius: 30px !important;
  display: inline-block !important;
  margin-bottom: 20px !important;
  border: 1px solid rgba(23, 100, 255, 0.15) !important;
}

.obligo-pricing-main-title {
  font-family: "Figtree", sans-serif !important;
  font-size: 40px !important;
  font-weight: 700 !important;
  color: #08183F !important;
  line-height: 1.25 !important;
  margin-bottom: 20px !important;
  letter-spacing: -0.02em !important;
}

.obligo-pricing-sub-desc {
  font-family: "Figtree", sans-serif !important;
  font-size: 17px !important;
  line-height: 1.7 !important;
  color: #53617A !important;
  margin-bottom: 40px !important;
}

/* Interactive Toggle Switcher */
.obligo-pricing-toggle-wrap {
  display: inline-flex !important;
  align-items: center !important;
  background: #EFF4FB !important;
  padding: 6px !important;
  border-radius: 40px !important;
  border: 1px solid #E2E8F0 !important;
  margin-bottom: 50px !important;
  box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.03) !important;
}

.obligo-toggle-btn {
  font-family: "Figtree", sans-serif !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  color: #64748B !important;
  background: transparent !important;
  border: none !important;
  padding: 12px 26px !important;
  border-radius: 30px !important;
  cursor: pointer !important;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
  position: relative !important;
  display: flex !important;
  align-items: center !important;
}

.obligo-toggle-btn.active {
  background: #ffffff !important;
  color: #08183F !important;
  box-shadow: 0 4px 15px rgba(8, 24, 63, 0.08) !important;
}

.obligo-save-badge {
  font-size: 11px !important;
  font-weight: 700 !important;
  background: linear-gradient(135deg, #1764FF 0%, #2874FF 100%) !important;
  color: #ffffff !important;
  padding: 3px 9px !important;
  border-radius: 12px !important;
  margin-left: 10px !important;
}

/* Pricing Cards */
.obligo-price-card {
  background: #ffffff !important;
  border: 1px solid #E2E8F0 !important;
  border-radius: 24px !important;
  padding: 40px 32px !important;
  position: relative !important;
  height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1) !important;
  box-shadow: 0 10px 30px rgba(8, 24, 63, 0.03) !important;
}

.obligo-price-card:hover {
  transform: translateY(-8px) !important;
  border-color: #CBD5E1 !important;
  box-shadow: 0 20px 45px rgba(8, 24, 63, 0.08) !important;
}

.obligo-price-card.featured {
  border: 2px solid #1764FF !important;
  box-shadow: 0 20px 50px rgba(23, 100, 255, 0.12) !important;
}

.obligo-featured-badge {
  position: absolute !important;
  top: -15px !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  background: linear-gradient(135deg, #1764FF 0%, #2874FF 100%) !important;
  color: #ffffff !important;
  font-family: "Figtree", sans-serif !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  letter-spacing: 0.8px !important;
  padding: 6px 18px !important;
  border-radius: 30px !important;
  box-shadow: 0 4px 15px rgba(23, 100, 255, 0.3) !important;
}

.obligo-price-card-header {
  text-align: left !important;
  margin-bottom: 25px !important;
  border-bottom: 1px solid #F1F5F9 !important;
  padding-bottom: 25px !important;
}

.obligo-plan-type {
  font-family: "Figtree", sans-serif !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 1px !important;
  color: #1764FF !important;
  display: block !important;
  margin-bottom: 6px !important;
}

.obligo-plan-name {
  font-family: "Figtree", sans-serif !important;
  font-size: 26px !important;
  font-weight: 700 !important;
  color: #08183F !important;
  margin-bottom: 8px !important;
}

.obligo-plan-tagline {
  font-family: "Figtree", sans-serif !important;
  font-size: 14px !important;
  color: #64748B !important;
  margin-bottom: 20px !important;
  line-height: 1.5 !important;
}

.obligo-plan-price-box {
  display: flex !important;
  align-items: baseline !important;
  gap: 4px !important;
}

.obligo-plan-currency {
  font-family: "Figtree", sans-serif !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  color: #08183F !important;
}

.obligo-plan-amount {
  font-family: "Figtree", sans-serif !important;
  font-size: 42px !important;
  font-weight: 800 !important;
  color: #08183F !important;
  line-height: 1 !important;
  letter-spacing: -0.02em !important;
}

.obligo-plan-period {
  font-family: "Figtree", sans-serif !important;
  font-size: 14px !important;
  color: #64748B !important;
  font-weight: 600 !important;
}

/* Setup fee chips */
.obligo-setup-fees {
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
  margin-top: 15px !important;
}

.obligo-setup-chip {
  font-family: "Figtree", sans-serif !important;
  font-size: 12px !important;
  color: #475569 !important;
  background: #F8FAFC !important;
  border: 1px solid #E2E8F0 !important;
  padding: 5px 12px !important;
  border-radius: 8px !important;
  display: inline-block !important;
}

/* Key Specs Box */
.obligo-plan-specs {
  background: #F8FAFC !important;
  border: 1px solid #F1F5F9 !important;
  border-radius: 14px !important;
  padding: 16px 20px !important;
  margin-bottom: 25px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
}

.obligo-spec-item {
  font-family: "Figtree", sans-serif !important;
  font-size: 14px !important;
  color: #334155 !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}

.obligo-spec-item i {
  color: #1764FF !important;
  font-size: 14px !important;
  width: 18px !important;
}

/* Features List */
.obligo-plan-features {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 0 35px 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 14px !important;
  flex-grow: 1 !important;
  text-align: left !important;
}

.obligo-plan-features li {
  font-family: "Figtree", sans-serif !important;
  font-size: 14.5px !important;
  color: #334155 !important;
  display: flex !important;
  align-items: flex-start !important;
  gap: 12px !important;
  line-height: 1.5 !important;
}

.obligo-plan-features li i.fa-circle-check {
  color: #1764FF !important;
  font-size: 16px !important;
  margin-top: 2px !important;
}

.obligo-plan-features li.obligo-sub-feature {
  padding-left: 28px !important;
  font-size: 13px !important;
  color: #64748B !important;
}

.obligo-plan-features li.obligo-sub-feature i {
  font-size: 11px !important;
  margin-top: 4px !important;
}

/* Plan Action Buttons */
.obligo-plan-footer {
  margin-top: auto !important;
}

.obligo-plan-btn {
  width: 100% !important;
  height: 52px !important;
  border-radius: 30px !important;
  font-family: "Figtree", sans-serif !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  text-decoration: none !important;
  transition: all 0.3s ease !important;
}

.obligo-plan-btn.btn-outline {
  background: #ffffff !important;
  border: 1.5px solid #CBD5E1 !important;
  color: #08183F !important;
}

.obligo-plan-btn.btn-outline:hover {
  background: #08183F !important;
  border-color: #08183F !important;
  color: #ffffff !important;
  box-shadow: 0 10px 25px rgba(8, 24, 63, 0.15) !important;
}

.obligo-plan-btn.btn-primary {
  background: linear-gradient(135deg, #1764FF 0%, #2874FF 100%) !important;
  border: none !important;
  color: #ffffff !important;
  box-shadow: 0 8px 25px rgba(23, 100, 255, 0.25) !important;
}

.obligo-plan-btn.btn-primary:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 12px 30px rgba(23, 100, 255, 0.35) !important;
  color: #ffffff !important;
}

/* Comparison Table Section */
.obligo-pricing-table-section {
  padding: 40px 20px !important;
  background: #ffffff !important;
}

.obligo-table-section-title {
  font-family: "Figtree", sans-serif !important;
  font-size: 34px !important;
  font-weight: 700 !important;
  color: #08183F !important;
  margin-bottom: 15px !important;
}

.obligo-table-section-desc {
  font-family: "Figtree", sans-serif !important;
  font-size: 16px !important;
  color: #64748B !important;
}

.obligo-comparison-table-wrap {
  border-radius: 20px !important;
  border: 1px solid #E2E8F0 !important;
  box-shadow: 0 15px 40px rgba(8, 24, 63, 0.04) !important;
  overflow: hidden !important;
}

.obligo-comparison-table {
  margin: 0 !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  width: 100% !important;
}

.obligo-comparison-table thead th {
    background: #ebe8ff !important;
    color: #1764ff !important;
  font-family: "Figtree", sans-serif !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  padding: 20px 24px !important;
  border: none !important;
  text-align: center !important;
}

.obligo-comparison-table thead th.feature-col {
  text-align: left !important;
  width: 34% !important;
}

.obligo-comparison-table thead th.highlight-col {
  background: #1764FF !important;
  color:#fff!important;
}

.obligo-comparison-table tbody tr.table-group-header td {
  background: #F1F5F9 !important;
  font-family: "Figtree", sans-serif !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  color: #334155 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  padding: 14px 24px !important;
  border-bottom: 1px solid #E2E8F0 !important;
}

.obligo-comparison-table tbody tr td {
  padding: 16px 24px !important;
  font-family: "Figtree", sans-serif !important;
  font-size: 15px !important;
  color: #334155 !important;
  border-bottom: 1px solid #F1F5F9 !important;
  text-align: center !important;
  vertical-align: middle !important;
}

.obligo-comparison-table tbody tr td.feature-title {
  text-align: left !important;
  font-weight: 600 !important;
  color: #08183F !important;
}

.obligo-comparison-table tbody tr td.highlight-col {
  background: #F8FAFC !important;
  font-weight: 700 !important;
}

/* CTA Banner */
.obligo-pricing-cta-section {
  padding: 60px 0 100px 0 !important;
}

.obligo-pricing-cta-card {
  background: linear-gradient(135deg, #08183F 0%, #112A66 100%) !important;
  border-radius: 24px !important;
  padding: 50px 45px !important;
  color: #ffffff !important;
  box-shadow: 0 20px 50px rgba(8, 24, 63, 0.15) !important;
}

.obligo-cta-title {
  font-family: "Figtree", sans-serif !important;
  font-size: 28px !important;
  font-weight: 800 !important;
  color: #ffffff !important;
  margin-bottom: 12px !important;
}

.obligo-cta-desc {
  font-family: "Figtree", sans-serif !important;
  font-size: 16px !important;
  color: #94A3B8 !important;
  line-height: 1.6 !important;
  margin: 0 !important;
}

.obligo-cta-btn {
  background: linear-gradient(135deg, #1764FF 0%, #2874FF 100%) !important;
  color: #ffffff !important;
  font-family: "Figtree", sans-serif !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  padding: 14px 32px !important;
  border-radius: 30px !important;
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center !important;
  transition: all 0.3s ease !important;
  box-shadow: 0 8px 25px rgba(23, 100, 255, 0.3) !important;
}

.obligo-cta-btn:hover {
  transform: translateY(-2px) !important;
  color: #ffffff !important;
  box-shadow: 0 12px 30px rgba(23, 100, 255, 0.45) !important;
}

/* =========================================================================
   OBLIGO AI - MULTI-LANGUAGE SELECTOR DROPDOWN STYLING
   ========================================================================= */
.lang-selector-wrapper {
  position: relative;
  display: inline-flex;
  align-items: center;
  margin-right: 12px;
}
.lang-dropdown-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  background: rgba(255, 255, 255, 0.95) !important;
  border: 1px solid rgba(226, 232, 240, 0.9) !important;
  padding: 5px 10px !important;
  border-radius: 30px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #08183F !important;
  cursor: pointer !important;
  transition: all 0.25s ease !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04) !important;
}

.lang-dropdown-btn::after {
  display: none !important;
  content: none !important;
}

.lang-dropdown-btn:hover {
  background: #ffffff !important;
  border-color: #2563eb !important;
  box-shadow: 0 4px 12px rgba(37, 99, 235, 0.15) !important;
  color: #2563eb !important;
}

.lang-dropdown-btn .currentLangFlag {
  font-size: 16px;
  line-height: 1;
}

.lang-dropdown-btn .currentLangName {
  font-weight: 600;
  max-width: 170px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.lang-dropdown-btn .lang-arrow {
  transition: transform 0.25s ease;
}

.lang-dropdown-btn[aria-expanded="true"] .lang-arrow {
  transform: rotate(180deg);
}

/* Language Dropdown Loading State */
.lang-dropdown-btn.is-loading {
  pointer-events: none !important;
  border-color: #2563eb !important;
  background: #f8fafc !important;
  color: #2563eb !important;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.2) !important;
}

.lang-spinner {
  display: inline-block !important;
  width: 14px !important;
  height: 14px !important;
  border: 2px solid rgba(37, 99, 235, 0.25) !important;
  border-top-color: #2563eb !important;
  border-radius: 50% !important;
  animation: langBtnSpin 0.7s linear infinite !important;
  vertical-align: middle !important;
}

.lang-option.is-translating {
  opacity: 0.75;
  pointer-events: none;
}

.lang-option.is-translating::after {
  content: '';
  display: inline-block;
  width: 12px;
  height: 12px;
  border: 2px solid rgba(37, 99, 235, 0.3);
  border-top-color: #2563eb;
  border-radius: 50%;
  margin-left: auto;
  animation: langBtnSpin 0.7s linear infinite;
}

@keyframes langBtnSpin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

.lang-dropdown-menu {
  max-height: 320px;
  overflow-y: auto;
  min-width: 240px;
  border-radius: 14px !important;
  border: 1px solid #e2e8f0 !important;
  box-shadow: 0 12px 30px rgba(8, 24, 63, 0.15) !important;
  padding: 8px !important;
  background: #ffffff !important;
}

.lang-dropdown-menu::-webkit-scrollbar {
  width: 5px;
}

.lang-dropdown-menu::-webkit-scrollbar-thumb {
  background: #cbd5e1;
  border-radius: 4px;
}

.lang-dropdown-menu .lang-option {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 9px 14px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: #334155 !important;
  border-radius: 8px !important;
  transition: all 0.2s ease !important;
  text-decoration: none !important;
}

.lang-dropdown-menu .lang-option:hover {
  background: #f1f5f9 !important;
  color: #2563eb !important;
}

.lang-dropdown-menu .lang-option.active {
  background: #eff6ff !important;
  color: #2563eb !important;
  font-weight: 700 !important;
}

/* =========================================================================
   LANGUAGE SWITCHER - Hide Google Translate Banner & Prevent Top Space Gap
   ========================================================================= */

/* Hide Google Translate Banner & Tooltips completely */
.VIpgJd-ZVi9od-ORHb-OEVmcd,
.goog-te-banner-frame,
iframe.goog-te-banner-frame,
.goog-te-banner,
#goog-gt-tt,
.goog-te-balloon-frame,
.goog-te-spinner-pos,
.goog-te-menu-frame,
.goog-te-gadget-icon,
.VIpgJd-ZVi9od-a9v-OEVmcd,
.VIpgJd-ZVi9od-l4e-fli22c {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  height: 0 !important;
  width: 0 !important;
  pointer-events: none !important;
}

/* Eliminate top empty whitespace injected onto body/html by Google Translate */
body {
  top: 0px !important;
  margin-top: 0px !important;
  position: static !important;
}

html {
  top: 0px !important;
  margin-top: 0px !important;
}

.goog-tooltip,
.goog-tooltip:hover {
  display: none !important;
}

.goog-text-highlight {
  background-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

/* Keep the translate engine mount off-screen */
#google_translate_element {
  position: absolute !important;
  left: -9999px !important;
  top: -9999px !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  pointer-events: none !important;
  opacity: 0 !important;
}

/* RTL Support for Arabic */
html[dir="rtl"] {
  direction: rtl;
  text-align: right;
}