/*----------------------------------------------------
@File: Default Styles
@Author: picmaticweb
@URL: https://themeforest.net/user/picmaticweb/portfolio
Author E-mail: 

This file contains the styling for the actual template, this
is the file you need to edit to change the look of the
template.


@Default Styles

Table of Content:
01/ Variables
02/ predefine
03/ header
04/ banner
04/ button
05/ clients logo
06/ features
07/ price
08/ testimonial
09/ video
10/ subscribe
11/ team
12/ accordion 
13/ integration-single 
14/ job
15/ blog
16/ contact
17/ footer


=====================================================================*/
/*----------------------------------------------------*/
/*font Variables*/
/*Color Variables*/
/*=================== fonts ====================*/
@import url("https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Plus+Jakarta+Sans:ital,wght@0,200..800;1,200..800&display=swap");
.col-md-offset-right-1,
.col-lg-offset-right-1 {
  margin-right: 8.33333333%;
}

/*---------------------------------------------------- */
/*----------------------------------------------------*/
:root {
  --saas-global-color: #000000;
  --saas-gray-dark: #0f172a;
  --saas-gray: #475569;
  --saas-purple: #7977f5;
  --saas-heading: #ffffff;
  --saas-white: #ffffff;
  --saas-description: #d1d1d1;
  --saas-blue: #2b5bfd;
  --saas-Be-Vietnam-Pro: "Be Vietnam Pro", sans-serif;
  --saas-Plus-Jakarta-Sans: "Plus Jakarta Sans", sans-serif;
  --saas-Lexend: "Lexend", sans-serif;
  --saas-Inter: "Inter", sans-serif;
}

/*---------------------------------------------------- */
/*----------------------------------------------------*/
body {
  font-family: var(--saas-Inter);
}

body .body_wrapper {
  background-color: var(--saas-global-color);
}

:focus {
  outline: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: var(--saas-Inter);
  font-weight: 600;
  color: var(--saas-heading);
}

p {
  font-family: var(--saas-Inter);
  font-weight: 400;
  font-size: 18px;
  line-height: 28px;
  color: var(--saas-description);
}

/** === Predefined Global Classes === **/
button:focus {
  outline: none;
}

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

.custom-container {
  max-width: 1420px;
}

.pt-100 {
  padding-top: 100px;
}
.pb-100 {
  padding-bottom: 100px;
}
/**===== section padding scss =====**/
.sec_padding {
  padding: 120px 0px;
}

.sec_padding_two {
  padding: 100px 0px;
}

/** ===== section title scss ====== **/
.section_title {
  margin-bottom: 70px;
}
.section_title h5 {
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
  color: var(--saas-purple);
  font-family: var(--saas-Inter);
  text-transform: capitalize;
  margin-bottom: 10px;
}
.section_title h2 {
  font-size: 40px;
  line-height: 60px;
  letter-spacing: -0.5px;
  margin-bottom: 12px;
}
.section_title p {
  line-height: 30px;
  color: var(--saas-description);
}
.section_title.text-center {
  max-width: 804px;
  margin-left: auto;
  margin-right: auto;
}
.section_title.white h2,
.section_title.white p {
  color: #fff;
}

.section_title_two {
  margin-bottom: 50px;
}
.section_title_two h5 {
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
  color: var(--saas-purple);
  font-family: var(--saas-Inter);
  text-transform: uppercase;
  margin-bottom: 10px;
}
.section_title_two h2 {
  font-size: 48px;
  line-height: 60px;
  font-family: var(--saas-Inter);
  margin-bottom: 12px;
}
.section_title_two p {
  font-size: 18px;
  line-height: 30px;
  color: var(--saas-description);
  font-family: var(--saas-Inter);
}
.section_title_two.text-center {
  max-width: 750px;
  margin-left: auto;
  margin-right: auto;
}

.section_title_three h2 {
  font-size: 48px;
  font-family: var(--saas-Inter);
  font-weight: 600;
  margin-bottom: 10px;
  color: var(--saas-white);
}

.section_title_four {
  margin-bottom: 70px;
}
.section_title_four h2 {
  color: #fff;
  font-size: 60px;
}

/* End Title Area css
============================================================================================ */
/*---------------------------------------------------- */
/*----------------------------------------------------*/
/*----------------------------------------------
    # Need Help Style
----------------------------------------------*/
/* .need-help-container {
  position: fixed;
  right: 20px;
  bottom: 20px;
  z-index: 9999;
  cursor: pointer;
  transition: transform 0.3s ease;
} */
/* .need-help-container img {
  max-width: 240px;
  height: auto;
  display: block;
} */
/* .need-help-container img {
  box-shadow: 0 4px 30px rgb(183 160 216 / 20%);
  width: 60px;
  height: 60px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.15);
  cursor: pointer;
  transition: transform 0.3s ease;
}
.need-help-container:hover {
  transform: scale(1.1);
} */
.need-help-container {
  position: fixed;
  bottom: 30px;
  right: 30px;
  z-index: 9999;
  cursor: pointer;
}

.gif-wrapper {
  width: 70px;
  height: 70px;
  border-radius: 50%;
  overflow: hidden;
  box-shadow:
    0 0 15px rgba(30, 144, 255, 0.5),
    0 0 30px rgba(30, 144, 255, 0.3),
    0 0 45px rgba(30, 144, 255, 0.2);
}

.need-help-container .background-video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transform: scale(1.1); /* Hides black edges */
}

.need-help-tooltip {
  position: absolute;
  right: 90px;
  top: 50%;
  transform: translateY(-50%);
  background: #ffffff;
  padding: 15px 20px;
  border-radius: 12px;
  min-width: 280px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
  opacity: 0;
  visibility: hidden;
  transition:
    opacity 0.3s ease,
    visibility 0.3s ease;
  pointer-events: none;
}

.need-help-tooltip::after {
  content: "";
  position: absolute;
  right: -18px;
  top: 50%;
  transform: translateY(-50%);
  border: 10px solid transparent;
  border-left-color: #ffffff;
}

.need-help-tooltip h4 {
  margin: 0 0 8px 0;
  font-size: 16px;
  font-weight: 600;
  color: #1a1a1a;
}

.need-help-tooltip p {
  margin: 0;
  font-size: 14px;
  color: #666;
  line-height: 1.4;
}

.need-help-container.show-tooltip .need-help-tooltip {
  opacity: 1;
  visibility: visible;
}

.need-help-container.hidden {
  display: none;
}

.need-help-container.scrolling .need-help-tooltip {
  opacity: 0;
  visibility: hidden;
}
/*----------------------------------------------
    # Preloader style here
----------------------------------------------*/
.preloader {
  align-items: center;
  cursor: default;
  display: flex;
  height: 100%;
  justify-content: center;
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  z-index: 9999999;
}
.preloader .animation-preloader {
  z-index: 1000;
}
.preloader .animation-preloader .spinner {
  animation: spinner 1s infinite linear;
  border-radius: 50%;
  border: 3px solid rgba(0, 0, 0, 0.2);
  border-top-color: var(--saas-purple);
  height: 9em;
  margin: 0 auto 3.5em auto;
  width: 9em;
}
.spinner-bg {
  width: 100%;
  max-width: 600px;
  margin: 0 auto 20px auto;
  display: flex;
  align-items: center;
  justify-content: center;
}

.spinner-bg img {
  width: 100%;
  height: auto;
  max-width: 100%;
  display: block;
}

/* Responsive adjustments */
@media (max-width: 768px) {
  .spinner-bg {
    max-width: 400px;
  }
}

@media (max-width: 480px) {
  .spinner-bg {
    max-width: 300px;
  }
}

/* .preloader .animation-preloader .spinner {
  width: 9em;
  height: 9em;
  border-radius: 50%;
  animation: spinner 1s linear infinite;

  background: conic-gradient(
    #FF5757 0deg 72deg,
    #FF914D 72deg 144deg,
    #FFD014 144deg 216deg,
    #38B6FF 216deg 288deg,
    #0097B2 288deg 360deg
  );
  
  -webkit-mask: 
    radial-gradient(farthest-side, transparent calc(100% - 6px), black 0);
          mask: radial-gradient(farthest-side, transparent calc(100% - 6px), black 0);
} */

@media (max-width: 767px) {
  .preloader .animation-preloader .spinner {
    width: 7.5em;
    height: 7.5em;
    margin: 0 auto 1.5em auto;
  }
}
.preloader .animation-preloader .txt-loading {
  font-size: 5em;
  font-weight: 700;
  text-align: center;
  user-select: none;
}
@media (max-width: 767px) {
  .preloader .animation-preloader .txt-loading {
    font-size: 2.5em;
  }
}
.preloader .animation-preloader .txt-loading .letters-loading {
  color: #191919;
  position: relative;
}
.preloader
  .animation-preloader
  .txt-loading
  .letters-loading:nth-child(2):before {
  animation-delay: 0.2s;
}
.preloader
  .animation-preloader
  .txt-loading
  .letters-loading:nth-child(3):before {
  animation-delay: 0.4s;
}
.preloader
  .animation-preloader
  .txt-loading
  .letters-loading:nth-child(4):before {
  animation-delay: 0.6s;
}
.preloader
  .animation-preloader
  .txt-loading
  .letters-loading:nth-child(5):before {
  animation-delay: 0.8s;
}
.preloader
  .animation-preloader
  .txt-loading
  .letters-loading:nth-child(6):before {
  animation-delay: 1s;
}
.preloader
  .animation-preloader
  .txt-loading
  .letters-loading:nth-child(7):before {
  animation-delay: 1.2s;
}
.preloader
  .animation-preloader
  .txt-loading
  .letters-loading:nth-child(8):before {
  animation-delay: 1.4s;
}
.preloader .animation-preloader .txt-loading .letters-loading::before {
  animation: letters-loading 4s infinite;
  color: var(--saas-gray);
  content: attr(data-text-preloader);
  left: 0;
  opacity: 0;
  font-family: var(--saas-Inter);
  position: absolute;
  top: -8px;
  transform: rotateY(-90deg);
}
.preloader p {
  font-family: var(--saas-Inter);
  font-size: 15px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 8px;
  color: var(--saas-description);
}
.preloader .loader {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  font-size: 0;
  z-index: 1;
  pointer-events: none;
}
.preloader .loader .row {
  height: 100%;
}
.preloader .loader .loader-section {
  padding: 0px;
}
.preloader .loader .loader-section .bg {
  background-color: #000;
  height: 100%;
  left: 0;
  width: 100%;
  /* transition: all 800ms cubic-bezier(0.77, 0, 0.175, 1); */
}
.preloader.loaded .animation-preloader {
  /* opacity: 0; */
  /* transition: 0.3s ease-out; */
}
/* .preloader.loaded .loader-section .bg {
  width: 0;
  transition: 0.7s;
  -webkit-transition: 0.7s;
  -moz-transition: 0.7s;
  -ms-transition: 0.7s;
  -o-transition: 0.7s;
} */

@-webkit-keyframes spinner {
  to {
    -webkit-transform: rotateZ(360deg);
    transform: rotateZ(360deg);
  }
}
@keyframes spinner {
  to {
    -webkit-transform: rotateZ(360deg);
    transform: rotateZ(360deg);
  }
}
@-webkit-keyframes letters-loading {
  0%,
  75%,
  100% {
    opacity: 0;
    transform: rotateY(-90deg);
  }
  25%,
  50% {
    opacity: 1;
    transform: rotateY(0deg);
  }
}
@keyframes letters-loading {
  0%,
  75%,
  100% {
    opacity: 0;
    transform: rotateY(-90deg);
  }
  25%,
  50% {
    opacity: 1;
    transform: rotateY(0deg);
  }
}
@keyframes loaderspin {
  0% {
    transform: translate(-50%, -50%) rotate(0deg);
  }
  100% {
    transform: translate(-50%, -50%) rotate(360deg);
  }
}
/*---------------------------------------------------- */
/*----------------------------------------------------*/
.navbar {
  border: 0px;
  padding: 0px;
  background: transparent;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 100;
  transition: all 0.3s;
}
.navbar .navbar-brand {
  margin-right: 0;
}
.navbar .navbar-brand.sticky_logo img + img {
  display: none;
}
.navbar.border_bottom {
  border-bottom: 1px solid rgba(24, 44, 76, 0.1);
}
.navbar .container-fluid {
  padding-left: 40px;
  padding-right: 40px;
}

.menu > .nav-item {
  margin-left: 36px;
  position: relative;
  padding-bottom: 35px;
  padding-top: 35px;
  transition: all 0.1s linear;
  cursor: pointer;
}
.menu > .nav-item:first-child {
  margin-left: 0;
}
.menu > .nav-item > .nav-link {
  font-family: var(--saas-Inter);
  font-size: 16px;
  font-weight: 600;
  color: var(--saas-white);
  padding: 0;
  position: relative;
}
@media (min-width: 992px) {
  .menu > .nav-item > .nav-link {
    padding-right: 15px;
  }
}
.menu > .nav-item > .nav-link:after {
  display: none;
}
.menu > .nav-item .mobile_dropdown_icon {
  display: none;
}
@media (min-width: 992px) {
  .menu > .nav-item .mobile_dropdown_icon {
    display: block;
    position: absolute;
    right: 0px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 19px;
    transition: all 0.2s;
    z-index: -1;
  }
}
.menu > .nav-item.submenu .dropdown-menu {
  margin: 0px;
  border: 0px;
  border-radius: 8px;
  left: -30px;
  min-width: 200px;
  padding: 15px 0px;
  background: #fff;
  top: 100%;
  box-shadow: 0px 6px 20px 0px rgba(1, 6, 33, 0.08);
}
@media (min-width: 992px) {
  .menu > .nav-item.submenu .dropdown-menu {
    transform: translateY(20px);
    transition: all 0.3s ease-in;
    opacity: 0;
    visibility: hidden;
    display: block;
  }
}
.menu > .nav-item.submenu .dropdown-menu .nav-item {
  display: block;
  width: 100%;
  padding: 0px 30px;
  position: relative;
}
.menu > .nav-item.submenu .dropdown-menu .nav-item:not(:first-child) {
  margin-top: 14px;
}
.menu > .nav-item.submenu .dropdown-menu .nav-item .nav-link {
  padding: 0px;
  white-space: nowrap;
  font-size: 14px;
  font-weight: 500;
  color: #091c1e;
  transition: color 0.2s linear;
}
.menu > .nav-item.submenu .dropdown-menu .nav-item .nav-link:after {
  display: none;
}
@media (min-width: 992px) {
  .menu > .nav-item.submenu .dropdown-menu .nav-item .mobile_dropdown_icon {
    right: 10px;
  }
}
.menu > .nav-item.submenu .dropdown-menu .nav-item:hover > .nav-link,
.menu
  > .nav-item.submenu
  .dropdown-menu
  .nav-item:hover
  > .mobile_dropdown_icon,
.menu > .nav-item.submenu .dropdown-menu .nav-item:focus > .nav-link,
.menu
  > .nav-item.submenu
  .dropdown-menu
  .nav-item:focus
  > .mobile_dropdown_icon,
.menu > .nav-item.submenu .dropdown-menu .nav-item.active > .nav-link,
.menu
  > .nav-item.submenu
  .dropdown-menu
  .nav-item.active
  > .mobile_dropdown_icon {
  color: var(--saas-purple);
}
.menu > .nav-item.submenu .dropdown-menu .nav-item > .dropdown-menu {
  transition: transform 0.3s ease-in;
}
.menu > .nav-item.submenu .dropdown-menu .nav-item > .dropdown-menu:before {
  display: none;
}
@media (min-width: 992px) {
  .menu > .nav-item.submenu .dropdown-menu .nav-item > .dropdown-menu {
    position: absolute;
    left: 100%;
    top: -15px;
    opacity: 0;
    display: block;
    visibility: hidden;
    transform: translateY(20px);
    transition: all 0.3s ease-in;
  }
}
.menu > .nav-item.active > .nav-link {
  color: var(--saas-purple);
}
.menu > .nav-item.active > .mobile_dropdown_icon {
  color: var(--saas-purple);
}
.menu > .nav-item:hover .nav-link,
.menu > .nav-item:hover > .mobile_dropdown_icon {
  color: var(--saas-purple);
}
@media (min-width: 992px) {
  .menu > .nav-item:hover .dropdown-menu {
    opacity: 1;
    transform: translateY(0);
    visibility: visible;
  }
}
@media (min-width: 992px) and (min-width: 992px) {
  .menu > .nav-item:hover .dropdown-menu > .nav-item:hover .dropdown-menu {
    transform: scaleY(1);
    opacity: 1;
    visibility: visible;
  }
}

@media (min-width: 992px) {
  .menu_white .menu > .nav-item > .nav-link,
  .menu_white .menu > .nav-item > .mobile_dropdown_icon {
    color: #fff;
  }
}
@media (min-width: 992px) {
  .menu_white .menu > .nav-item:hover .nav-link,
  .menu_white .menu > .nav-item.active .nav-link {
    color: #fff;
  }
}
.menu_white .nav_right .login_btn {
  backdrop-filter: blur(20px);
}
.menu_white .nav_right .login_btn.button_radius {
  border-radius: 45px;
}

.menu_blue .menu > .nav-item .dropdown-menu > .nav-item:hover > .nav-link,
.menu_blue .menu > .nav-item .dropdown-menu > .nav-item.active > .nav-link {
  color: var(--saas-purple);
}
@media (min-width: 992px) {
  .menu_blue
    .menu
    > .nav-item
    .dropdown-menu
    > .nav-item:hover
    .mobile_dropdown_icon,
  .menu_blue
    .menu
    > .nav-item
    .dropdown-menu
    > .nav-item.active
    .mobile_dropdown_icon {
    color: var(--saas-purple);
  }
}
.menu_blue .nav_right .login_btn:hover {
  background: var(--saas-purple);
  color: #fff;
}

.nav_right .login_btn,
.nav_right .signup_btn {
  font-size: 16px;
  font-weight: 600;
  font-family: var(--saas-Inter);
  color: #1f0343;
  line-height: 1.1;
  display: inline-flex;
  padding: 15px 20px;
  background: #fff;
  border: 1px solid rgba(31, 3, 67, 0.12);
  border-radius: 8px;
  transition: all 0.3s linear;
}
.nav_right .login_btn:hover,
.nav_right .signup_btn:hover {
  background: var(--saas-purple);
  border-color: var(--saas-purple);
  color: #fff;
}
.nav_right .login_btn:hover .btn_text span:first-child,
.nav_right .signup_btn:hover .btn_text span:first-child {
  transform: translateY(0);
}
.nav_right .login_btn:hover .btn_text span:last-child,
.nav_right .signup_btn:hover .btn_text span:last-child {
  transform: translateY(-24px);
}
.nav_right .signup_btn {
  border: 1px solid var(--saas-purple);
  background: var(--saas-purple);
  margin-left: 10px;
  transition: all 0.2s linear;
  color: #fff;
}
.nav_right .signup_btn:hover {
  color: var(--saas-purple);
  background: #fff;
  border-color: #fff;
}

.dark_menu .login_btn,
.dark_menu .signup_btn {
  color: #1b1f41;
}
/* .navbar.show-menu,
.navbar-collapse.show,
.navbar-collapse.collapsing {
  background: #000;
  transition: none;
} */
@media (max-width: 991px) {
  .navbar:has(.navbar-collapse.show),
  .navbar:has(.navbar-collapse.collapsing) {
    background: #000;
    transition: none;
  }
}
.navbar.navbar_fixed {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 999;
  background: #000;
  box-shadow: 0px 4px 10px 0px rgba(12, 0, 46, 0.05);
  padding: 0px;
}
.navbar.navbar_fixed .menu > .nav-item > .nav-link {
  color: var(--saas-white);
}
.navbar.navbar_fixed .menu > .nav-item.active > .nav-link {
  color: var(--saas-purple);
}
.navbar.navbar_fixed .navbar-brand.sticky_logo img {
  display: none;
}
.navbar.navbar_fixed .navbar-brand.sticky_logo img + img {
  display: block;
}
.navbar.navbar_fixed .menu > .nav-item {
  padding-top: 24px;
  padding-bottom: 24px;
  transition: all 0.2s linear;
}
.navbar.navbar_fixed .nav_right .signup_btn:hover {
  background: var(--saas-purple);
  border-color: var(--saas-purple);
  color: #fff;
  box-shadow: 0px 4px 10px 0px rgba(132, 56, 255, 0.25);
}
.navbar.navbar_fixed .nav_right.nav_right_two .signup_btn:hover {
  background: #182c4c;
  color: #fff;
  border-color: #182c4c;
  box-shadow: 0px 4px 10px 0px rgba(24, 44, 76, 0.25);
}
.navbar.navbar_fixed.menu_white .menu > .nav-item > .nav-link,
.navbar.navbar_fixed.menu_white .menu > .nav-item > .mobile_dropdown_icon {
  color: #091c1e;
}
.navbar.navbar_fixed.menu_white .menu > .nav-item:hover > .nav-link,
.navbar.navbar_fixed.menu_white .menu > .nav-item:hover > .mobile_dropdown_icon,
.navbar.navbar_fixed.menu_white .menu > .nav-item.active > .nav-link,
.navbar.navbar_fixed.menu_white
  .menu
  > .nav-item.active
  > .mobile_dropdown_icon {
  color: var(--saas-purple);
}
.navbar.navbar_fixed.menu_white .nav_right .login_btn {
  backdrop-filter: blur(0px);
}
.navbar.navbar_fixed.menu_white .nav_right .login_btn:hover {
  box-shadow: 0px 4px 10px 0px rgba(132, 56, 255, 0.35);
}
.navbar.navbar_fixed.menu_blue .menu > .nav-item:hover > .nav-link,
.navbar.navbar_fixed.menu_blue .menu > .nav-item.active > .nav-link {
  color: var(--saas-purple);
}
@media (min-width: 992px) {
  .navbar.navbar_fixed.menu_blue
    .menu
    > .nav-item:hover
    > .mobile_dropdown_icon,
  .navbar.navbar_fixed.menu_blue
    .menu
    > .nav-item.active
    > .mobile_dropdown_icon {
    color: var(--saas-purple);
  }
}
.navbar.navbar_fixed.menu_blue
  .menu
  > .nav-item
  .dropdown-menu
  > .nav-item:hover
  > .nav-link,
.navbar.navbar_fixed.menu_blue
  .menu
  > .nav-item
  .dropdown-menu
  > .nav-item.active
  > .nav-link {
  color: var(--saas-purple);
}
@media (min-width: 992px) {
  .navbar.navbar_fixed.menu_blue
    .menu
    > .nav-item
    .dropdown-menu
    > .nav-item:hover
    > .mobile_dropdown_icon,
  .navbar.navbar_fixed.menu_blue
    .menu
    > .nav-item
    .dropdown-menu
    > .nav-item.active
    > .mobile_dropdown_icon {
    color: var(--saas-purple);
  }
}
.navbar.navbar_fixed.menu_blue .nav_right .login_btn {
  background: var(--saas-purple);
  color: #fff;
}
.navbar.navbar_fixed.menu_blue .nav_right .login_btn:hover {
  box-shadow: 0px 4px 10px 0px rgba(56, 111, 251, 0.35);
}
.navbar.navbar_fixed .menu_toggle .hamburger span {
  background: #ffffff;
}
.navbar.navbar_fixed .menu_toggle .hamburger-cross span {
  background: #ffffff;
}

.menu_white .menu_toggle .hamburger span {
  background: #fff;
}
.menu_white .menu_toggle .hamburger-cross span {
  background: #fff;
}

.navbar-toggler {
  position: relative;
  width: 30px;
  height: 20px;
  border-radius: 0px;
  padding: 0px;
  border: 0px;
  margin: 25px 0px;
}
.navbar-toggler:focus {
  outline: none;
  box-shadow: none;
}

.menu_toggle {
  width: 22px;
  height: 22px;
  position: relative;
  cursor: pointer;
  display: block;
}
.menu_toggle .hamburger {
  position: absolute;
  height: 100%;
  width: 100%;
  display: block;
}
.menu_toggle .hamburger span {
  width: 0%;
  height: 2px;
  position: relative;
  top: 0;
  left: 0;
  margin: 4px 0;
  display: block;
  background: #ffffff;
  border-radius: 3px;
  -webkit-transition: 0.2s ease-in-out;
  transition: 0.2s ease-in-out;
}
.menu_toggle .hamburger span:nth-child(1) {
  transition-delay: 0s;
}
.menu_toggle .hamburger span:nth-child(2) {
  transition-delay: 0.125s;
}
.menu_toggle .hamburger span:nth-child(3) {
  transition-delay: 0.2s;
}
.menu_toggle .hamburger-cross {
  position: absolute;
  height: 100%;
  width: 100%;
  transform: rotate(45deg);
  display: block;
}
.menu_toggle .hamburger-cross span {
  display: block;
  background: #ffffff;
  border-radius: 3px;
  -webkit-transition: 0.2s ease-in-out;
  transition: 0.2s ease-in-out;
}
.menu_toggle .hamburger-cross span:nth-child(1) {
  height: 100%;
  width: 2px;
  position: absolute;
  top: 0;
  left: 10px;
  transition-delay: 0.3s;
}
.menu_toggle .hamburger-cross span:nth-child(2) {
  width: 100%;
  height: 2px;
  position: absolute;
  left: 0;
  top: 10px;
  transition-delay: 0.4s;
}

.collapsed .menu_toggle .hamburger span {
  width: 100%;
}
.collapsed .menu_toggle .hamburger span:nth-child(1) {
  transition-delay: 0.3s;
}
.collapsed .menu_toggle .hamburger span:nth-child(2) {
  transition-delay: 0.4s;
}
.collapsed .menu_toggle .hamburger span:nth-child(3) {
  transition-delay: 0.5s;
}
.collapsed .menu_toggle .hamburger-cross span:nth-child(1) {
  height: 0%;
  transition-delay: 0s;
}
.collapsed .menu_toggle .hamburger-cross span:nth-child(2) {
  width: 0%;
  transition-delay: 0.2s;
}

@media (max-width: 1199px) {
  .menu > .nav-item {
    margin-left: 18px;
  }
  .nav_right .signup_btn {
    margin-left: 0;
  }
  .nav_right .login_btn,
  .nav_right .signup_btn {
    padding: 12px;
  }
}
@media (max-width: 991px) {
  .navbar .navbar-collapse {
    position: absolute;
    left: 0;
    top: 100%;
    background: #000;
    box-shadow: 4px 6px 10px rgba(12, 0, 46, 0.05);
    z-index: 8;
    width: 100%;
  }
  .navbar.navbar_fixed .navbar-collapse {
    background: #000;
  }
  .navbar.navbar_fixed .menu > .nav-item > .nav-link {
    color: var(--saas-white);
  }

  .menu,
  .nav_right {
    max-width: 720px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 15px;
    padding-right: 15px;
  }
  .menu > .nav-item {
    margin-left: 0;
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left: 0;
    padding-right: 0;
  }
  .menu > .nav-item .nav-link {
    position: relative;
  }
  .menu > .nav-item.submenu .dropdown-menu {
    padding-left: 15px;
    padding-right: 15px;
    margin-top: 10px;
  }
  .menu > .nav-item.submenu .dropdown-menu .nav-item {
    padding-left: 0;
    padding-right: 0;
  }
  .menu > .nav-item.submenu .dropdown-menu .nav-item .mobile_dropdown_icon {
    top: 0px;
  }
  .menu > .nav-item .mobile_dropdown_icon {
    display: block;
    position: absolute;
    right: 5px;
    top: 15px;
    font-size: 19px;
    transition: all 0.2s;
  }
  /* .nav_right {
    padding-bottom: 20px;
    padding-top: 10px;
  } */
  .navbar.navbar_fixed .menu > .nav-item {
    padding-top: 10px;
    padding-bottom: 10px;
  }
  .menu_blue .menu > .nav-item.active > .mobile_dropdown_icon,
  .menu_blue .menu > .nav-item.active > .nav-link {
    color: var(--saas-purple);
  }
  .menu_blue .nav_right .login_btn {
    background: var(--saas-purple);
    color: #fff;
    padding: 12px 18px;
  }
  .menu_white .nav_right .login_btn {
    background: #fff;
    color: #1f0343;
    backdrop-filter: blur(0px);
    padding: 12px 18px;
  }
}
@media (max-width: 370px) {
  .navbar-brand {
    padding-right: 5px;
  }
  .navbar-brand img {
    max-width: 100%;
  }
}
/*---------------------------------------------------- */
/*----------------------------------------------------*/
.saas_banner_area {
  padding: 230px 0px 140px;
  overflow: visible;
  position: relative;
  z-index: 1;
}
.saas_banner_area .breadcrumb-bg-img {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top center;
  z-index: -1;
}
/* .saas_banner_area::before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background: url(../img/home-one/main-banner-1.webp) no-repeat top center/cover;
  z-index: -1;
} */

.saas_banner_content {
  padding-right: 0px;
}
.saas_banner_content h1 {
  font-size: 40px;
  line-height: 45px;
  font-family: var(--saas-Inter);
  color: var(--saas-heading);
  margin-bottom: 20px;
  letter-spacing: -2.1px;
}
.saas_banner_content p {
  color: var(--saas-description);
  font-size: 16px;
  line-height: 28px;
  margin-bottom: 38px;
}

.saas_banner_area .saas_banner_content img {
  width: 100%;
}

.subcribes {
  margin-bottom: 35px;
}
.subcribes .form-control {
  width: 100%;
  border-radius: 45px;
  background: #fff;
  padding: 8px 100px 8px 30px;
  height: 75px;
  border: 0px;
  font-size: 16px;
  color: #999999;
  font-family: var(--saas-Inter);
  font-weight: 500;
}
.subcribes .form-control.placeholder {
  color: var(--sass-gray-dark);
}
.subcribes .form-control:-moz-placeholder {
  color: var(--sass-gray-dark);
}
.subcribes .form-control::-moz-placeholder {
  color: var(--sass-gray-dark);
}
.subcribes .form-control::-webkit-input-placeholder {
  color: var(--sass-gray-dark);
}
.subcribes .btn_submit {
  font-size: 16px;
  font-weight: 600;
  font-family: var(--saas-Inter);
  background: var(--saas-purple);
  border-radius: 45px;
  padding: 16px 20px;
  color: #fff;
  position: absolute;
  right: 8px;
  top: 50%;
  transform: translateY(-50%);
  transition: all 0.2s linear;
}
.subcribes .btn_submit:hover {
  background: var(--saas-gray-dark);
}

.saas_banner_img {
  position: relative;
  text-align: right;
  right: -48px;
}
.saas_banner_img_container {
  /* position: absolute;
  right: -100px;
  bottom: -729px; */
  position: absolute;
  /* bottom: -500px;
  right: -40px; */
  /* bottom: -490px; */
  top: -350px;
  right: 50px;
  z-index: 3;
  max-width: 1021px;
}
.saas_banner_img_container img {
  /* width: 800px; */
  width: 650px;
}
.floating_mascout_section {
  position: relative;
}
.saas_features_content_img_mascot_1 {
  position: absolute;
  left: 100px;
  bottom: -370px;
  z-index: 3;
  /* animation: float 6s ease-in-out infinite; */
}
.saas_features_content_img_mascot_1 img {
  transform: scaleX(-1) rotate(-10deg);
  width: 230px;
}
.saas_features_content_img_mascot_2 {
  position: absolute;
  left: 80px;
  bottom: 100px;
  z-index: 3;
}
.saas_features_content_img_mascot_2 img {
  width: 230px;
  /* transform: scaleX(-1); */
}
.saas_banner_img .dash_one,
.saas_banner_img .dash_two {
  position: absolute;
}
.saas_banner_img .video_popup {
  width: 120px;
  height: 120px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(31, 3, 67, 0.1);
  background: #fff;
  position: absolute;
  left: 59%;
  top: 46%;
  transform: translate(-50%, -50%);
  font-size: 28px;
  color: var(--sass-gray-dark);
  box-shadow: 0px 5px 17px -1px rgba(29, 29, 29, 0.2);
  transition: all 0.3s linear;
}
.saas_banner_img .video_popup:hover {
  transform: scale(1.1) translate(-50%, -50%);
}

.ornaments li {
  position: absolute;
  z-index: -1;
}
.ornaments li:nth-child(1) {
  top: 180px;
  left: 0;
}
.ornaments li:nth-child(2) {
  bottom: 150px;
  left: 650px;
}
.ornaments li:nth-child(3) {
  top: 130px;
  right: 350px;
}

.saas_banner_area_two {
  padding: 180px 0px 0px;
  position: relative;
  z-index: 1;
  overflow: hidden;
}
.saas_banner_area_two::before {
  content: "";
  width: 100%;
  height: 100%;
  background: url(../img/home-two/banner_bg_two.png) no-repeat center
    center/cover;
  position: absolute;
  left: 0;
  top: 0;
  z-index: -1;
}

.saas_banner_content_two h2 {
  font-size: 70px;
  line-height: 84px;
  font-weight: 700;
  font-family: var(--saas-Inter);
  letter-spacing: -1.4px;
  margin-bottom: 30px;
  color: #fff;
}
.saas_banner_content_two h2 span {
  display: inline-block;
}
.saas_banner_content_two p {
  max-width: 720px;
  margin: 0 auto;
  line-height: 30px;
  margin-bottom: 40px;
  color: #fff;
}
.saas_banner_content_two .banner_img {
  margin-top: 90px;
  max-width: 100%;
  position: relative;
}
.saas_banner_content_two .banner_img .line_shap {
  position: absolute;
  top: -48px;
  right: -20px;
  z-index: -1;
}

.saas_banner_area_three {
  padding: 180px 0px;
  position: relative;
  overflow: hidden;
  z-index: 1;
}

.sass_banner_content {
  position: relative;
  z-index: 2;
}
.sass_banner_content h2 {
  font-family: var(--saas-Inter);
  font-size: 74px;
  font-weight: 600;
  line-height: 90px;
  letter-spacing: -2px;
  color: #14141f;
}
.sass_banner_content p {
  font-size: 20px;
  line-height: 32px;
  color: #14141f;
  margin-bottom: 40px;
}
.sass_banner_content .credit_text {
  font-size: 16px;
  color: #182c4c;
  margin-top: 20px;
  margin-bottom: 0px;
}
.sass_banner_content .credit_text i {
  color: #ff4998;
}
.sass_banner_content .ratting_icon {
  margin-top: 50px;
}
.sass_banner_content .ratting_icon a {
  margin-right: 60px;
  display: inline-block;
}

.banner_subscribe {
  display: flex;
}
.banner_subscribe .form-control {
  flex: 1;
  border-radius: 8px;
  border: 1px solid rgba(24, 44, 76, 0.1);
  height: 60px;
  padding-left: 60px;
  font-size: 16px;
  color: #182c4c;
  position: relative;
  z-index: 0;
  background: transparent;
  width: 333px;
}
.banner_subscribe .form-control.placeholder {
  color: #182c4c;
}
.banner_subscribe .form-control:-moz-placeholder {
  color: #182c4c;
}
.banner_subscribe .form-control::-moz-placeholder {
  color: #182c4c;
}
.banner_subscribe .form-control::-webkit-input-placeholder {
  color: #182c4c;
}
.banner_subscribe .form-control:focus {
  outline: none;
  box-shadow: none;
  border-color: var(--saas-purple);
}
.banner_subscribe .theme_btn {
  border: 0px;
  margin-left: 12px;
  transition: all 0.3s linear;
  box-shadow: none;
}
.banner_subscribe .theme_btn i {
  transition: all 0.3s linear;
  display: inline-block;
}
.banner_subscribe .theme_btn:hover {
  background: #182c4c;
}

.input_group {
  position: relative;
}
.input_group img {
  position: absolute;
  left: 25px;
  top: 50%;
  transform: translateY(-50%);
  z-index: -1;
}

.banner_img_three {
  position: relative;
  text-align: center;
  z-index: 1;
}
.banner_img_three .one,
.banner_img_three .two,
.banner_img_three .three,
.banner_img_three .four,
.banner_img_three .five {
  position: absolute;
}
.banner_img_three .one {
  left: 20px;
  top: 90px;
}
.banner_img_three .two {
  left: 20px;
  top: 190px;
}
.banner_img_three .three {
  right: 20px;
  bottom: -20px;
}
.banner_img_three .four {
  right: -200px;
  top: 50%;
  transform: translateY(-50%);
  z-index: -1;
}
.banner_img_three .five {
  left: 35px;
  bottom: -29px;
}

.saas_banner_area_four {
  position: relative;
  z-index: 1;
  padding-top: 200px;
  overflow: hidden;
}
.saas_banner_area_four .banner_shap {
  position: absolute;
  top: 0px;
  right: 200px;
  z-index: -1;
}
.saas_banner_area_four .saas_banner_content_two h2 {
  font-weight: 600;
  font-size: 80px;
  color: #fff;
}
.saas_banner_area_four .saas_banner_content_two p {
  color: #fff;
  max-width: 800px;
}
.saas_banner_area_four .subcribes_two,
.saas_banner_area_four .ratting_site_icon {
  max-width: 815px;
  margin-left: auto;
  margin-right: auto;
}
.saas_banner_area_four .banner_img {
  border-top-left-radius: 25px;
  border-top-right-radius: 25px;
}

.subcribes_two .input_group img {
  z-index: 2;
}
.subcribes_two .form-control {
  border-radius: 16px;
  padding-left: 60px;
}
.subcribes_two .btn_submit {
  border-radius: 10px;
  background: var(--saas-purple);
  padding: 16px 30px;
  font-size: 18px;
}
.subcribes_two .btn_submit i {
  transition: all 0.3s linear;
  display: inline-block;
}
.subcribes_two .btn_submit:hover i {
  transform: translateX(5px);
}

.ratting_site_icon {
  display: flex;
  width: 100%;
  margin-top: 70px;
}
.ratting_site_icon .item {
  width: 25%;
  padding: 0px 5px;
}
.ratting_site_icon .item img {
  max-width: 100%;
}

.saas_banner_area_five {
  padding-top: 170px;
  overflow: hidden;
}

.app_banner_content {
  position: relative;
  z-index: 1;
}
.app_banner_content h2 {
  font-size: 80px;
  line-height: 94px;
  letter-spacing: -2px;
  color: #fff;
  margin-bottom: 30px;
}
.app_banner_content p {
  font-size: 18px;
  line-height: 30px;
  color: #fff;
}
.app_banner_content .saas_btn {
  margin-top: 30px;
}
.app_banner_content .ratting_text {
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
  margin-top: 25px;
}
.app_banner_content .ratting_text img {
  margin-right: 5px;
  vertical-align: text-bottom;
}

.app_banner_img {
  position: relative;
  z-index: 0;
}
.app_banner_img .app_img {
  margin-left: 40px;
}
.app_banner_img .app_img.two {
  position: absolute;
  bottom: 20px;
  right: -50px;
}
.app_banner_img .app_shap_one,
.app_banner_img .app_shap_two {
  position: absolute;
  z-index: -1;
}
.app_banner_img .app_shap_one {
  left: -80px;
  top: -70px;
}
.app_banner_img .app_shap_two {
  bottom: 0;
  right: -300px;
}

.saas_breadcrumb_area {
  position: relative;
  z-index: 1;
  padding: 210px 0px 160px;
  overflow: hidden;
}
.saas_breadcrumb_area .breadcrumb-bg-img {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: -1;
}

.breadcrumb-divider {
  width: 100%;
  display: block;
  margin-top: -2px;
}

.breadcrumb-divider svg {
  width: 100%;
  height: 8px;
  display: block;
}
.career-breadcrumb-divider svg {
  width: 100%;
  height: 4px;
  display: block;
}
/* .saas_breadcrumb_area .b_shap {
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  width: 100%;
  height: 100%;
  object-fit: cover;
} */

.saas_breadcrumb_text {
  text-align: left;
  max-width: 800px;
  margin-left: 0;
  margin-right: 0;
}
.saas_breadcrumb_text h1 {
  font-size: 64px;
  line-height: 78px;
  letter-spacing: -0.4px;
  color: var(--saas-white);
  margin-bottom: 15px;
}
.saas_breadcrumb_text p {
  margin-bottom: 18px;
}
.saas_breadcrumb_text .breadcrumb {
  margin-bottom: 0;
}
.saas_breadcrumb_text .breadcrumb li {
  font-size: 16px;
  font-weight: 600;
  letter-spacing: -0.2px;
  color: var(--saas-white);
  position: relative;
  margin-right: 6px;
}
.saas_breadcrumb_text .breadcrumb li a {
  color: #a1a1aa;
}
.saas_breadcrumb_text .breadcrumb li + li {
  margin-left: 12px;
}
.saas_breadcrumb_text .breadcrumb li + li:before {
  content: "/";
  position: absolute;
  left: -12px;
  color: #60687a;
}

.single_breadcrumb {
  padding: 190px 0px 160px;
}
.single_breadcrumb .saas_breadcrumb_text {
  max-width: 1050px;
}

.saas_breadcrumb_area_career .saas_breadcrumb_text {
  text-align: left;
  max-width: 800px;
  margin-left: 0;
  margin-right: 0;
}
.saas_breadcrumb_area_career .saas_breadcrumb_text p {
  font-size: 20px;
  color: var(--saas-white);
}

.saas_breadcrumb_area_news {
  padding-top: 380px;
  padding-bottom: 450px;
}
.saas_breadcrumb_area_news .saas_breadcrumb_text {
  text-align: left;
  max-width: 800px;
  margin-left: 0;
  margin-right: 0;
}
/*---------------------------------------------------- */
/*----------------------------------------------------*/
.saas_btn {
  color: #fff;
  font-size: 18px;
  line-height: 28px;
  font-weight: 600;
  padding: 16px 29px;
  border-radius: 10px;
  display: inline-block;
  transition: all 0.3s linear;
  background: var(--saas-purple);
  letter-spacing: -0.1px;
  box-shadow: 0px 4px 12px -2px rgba(141, 71, 255, 0.5);
  position: relative;
  z-index: 1;
}

.saas_btn_core {
  background: #ff5757;
  box-shadow: 0px 4px 12px -2px rgba(255, 87, 87, 0.5);
}
.saas_btn_cxas {
  background: #ffa113;
  box-shadow: 0px 4px 12px -2px rgba(255, 161, 19, 0.5);
}
.saas_btn_scale {
  background: #38b6ff;
  box-shadow: 0px 4px 12px -2px rgba(56, 182, 255, 0.5);
}
.saas_btn_ava {
  background: #ffd014;
  box-shadow: 0px 4px 12px -2px rgba(255, 208, 20, 0.5);
}

.saas_btn_outline {
  background: none;
  color: #fff;
  border: 2px solid #fff;
  padding: 12px 23px;
}

.saas_sm_btn {
  font-size: 16px;
  padding: 10px 25px;
}

.tab-content .saas_btn {
  margin-top: 25px;
}

.saas_btn .btn_text {
  overflow: hidden;
  width: 100%;
  position: relative;
}
.saas_btn .btn_text span {
  position: absolute;
  z-index: 1;
  top: 0;
  width: 100%;
  text-align: center;
  transition: transform 0.5s ease;
  display: block;
}
.saas_btn .btn_text span:first-child {
  transform: translateY(24px);
}
.saas_btn .btn_text span:last-child {
  position: relative;
}
.saas_btn .btn_text span i {
  vertical-align: middle;
}
.saas_btn:hover {
  color: #fff;
  box-shadow: none;
}
.saas_btn:hover .btn_text span:first-child {
  transform: translateY(0);
}
.saas_btn:hover .btn_text span:last-child {
  transform: translateY(-24px);
}
.saas_btn.white {
  background: #fff;
  color: var(--saas-purple);
}
.saas_btn.white:hover {
  color: var(--saas-purple);
}

.saas_btn_read_more {
  font-size: 16px;
  line-height: 28px;
  background: #7977f5;
  /* box-shadow: 0px 4px 12px -2px rgba(56, 182, 255, 0.5); */
  padding: 10px 20px;
}

.btn_text {
  overflow: hidden;
  width: 100%;
  position: relative;
  display: block;
}
.btn_text span {
  position: absolute;
  z-index: 1;
  top: 0;
  width: 100%;
  text-align: center;
  transition: transform 0.5s ease;
  display: block;
}
.btn_text span:first-child {
  transform: translateY(24px);
}
.btn_text span:last-child {
  position: relative;
}
.btn_text span i {
  vertical-align: middle;
}

/*---------------------------------------------------- */
/*----------------------------------------------------*/
.saas_client_logo_area {
  position: relative;
}
.saas_client_logo_area .container {
  position: absolute;
  bottom: 0;
  z-index: 30;
  left: 50%;
  transform: translateX(-50%);
}
.saas_client_logo_area .min_client_area {
  border-bottom: 0px;
  padding-bottom: 0;
}

.client_title {
  font-size: 18px;
  line-height: 32px;
  color: var(--saas-description);
  font-weight: 400;
  font-family: var(--saas-Inter);
  opacity: 0.8;
}
.client_title .split-line {
  display: inline-block !important;
}
.client_title span {
  opacity: 1;
  font-weight: 600;
  margin: 0px 6px;
}
.client_title.white {
  color: #fff;
}

.client_title_two {
  font-size: 24px;
  line-height: 34px;
  color: #0f172a;
  font-weight: 600;
  margin-bottom: 40px;
}
.client_title_two span {
  color: var(--saas-purple);
}

.min_client_area {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid #d9dbe9;
  padding-bottom: 40px;
  margin-top: 50px;
}
.min_client_area .item {
  width: 14.2857142857%;
  text-align: center;
  padding: 10px;
}
.min_client_area img {
  opacity: 0.5;
  transition: 0.3s;
  cursor: pointer;
  max-width: 100%;
}
.min_client_area img:hover {
  opacity: 1;
}

.saas_client_logo_two {
  padding-top: 100px;
}
.saas_client_logo_two .min_client_area {
  border-bottom: 1px solid #d9dbe9;
}

.saas_client_logo_three {
  padding-bottom: 80px;
}

.saas_client_logo_area_dark {
  padding-top: 100px;
}
.saas_client_logo_area_dark .min_client_area {
  border-color: #515151;
}
.client-logo-slider .swiper-slide {
  display: flex;
  align-items: center;
  justify-content: space-around;
}

.client-logo-slider img {
  opacity: 0.5;
  transition: 0.3s;
  cursor: pointer;
  max-width: 100%;
}

.subscribe_inner {
  background: linear-gradient(140deg, #245fe7 0%, #2b5bfd 100%);
  border-radius: 40px;
  padding: 85px;
  position: relative;
  z-index: 1;
  overflow: hidden;
  text-align: center;
  margin-bottom: -150px;
}
.subscribe_inner .section_title_two {
  max-width: 856px;
  margin: 0 auto 50px;
}
.subscribe_inner .section_title_two h2,
.subscribe_inner .section_title_two p {
  color: #fff;
}
.subscribe_inner .note {
  font-size: 16px;
  color: #fff;
  margin-top: 20px;
}
.subscribe_inner .note a {
  text-decoration: underline;
  color: #fff;
}

.subscribe_form {
  max-width: 526px;
  margin-left: auto;
  margin-right: auto;
  position: relative;
}
.subscribe_form .form-control {
  border-radius: 12px;
  box-shadow: 0px 4px 30px 0px rgba(29, 41, 57, 0.08);
  background: #fff;
  padding: 10px 150px 10px 25px;
  height: 62px;
  border: 0px;
}
.subscribe_form .theme_btn {
  position: absolute;
  right: 4px;
  top: 4px;
  bottom: 4px;
  background: var(--saas-purple);
  border-radius: 8px;
  padding: 10px 25px;
  font-size: 16px;
  color: #fff;
  font-weight: 600;
  transition: all 0.3s linear;
  border: 0px;
}
.subscribe_form .theme_btn:hover {
  background: #111;
  color: #fff;
}

.marquee {
  width: 100%;
  display: inline-flex;
  overflow: hidden;
}
.marquee .slide {
  width: auto;
  display: inline-block;
  padding: 1rem 0px;
}

/*---------------------------------------------------- */
/*----------------------------------------------------*/
.saas_features_area {
  padding: 120px 0px;
  position: relative;
  overflow: hidden;
  z-index: 1;
}

.saas_features_area::before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background:
    linear-gradient(
      360deg,
      rgba(255, 255, 255, 0) 0%,
      rgba(0, 0, 0, 1) 50%,
      rgba(0, 0, 0, 1) 100%
    ),
    url(../img/home-one/GLOBE.webp) no-repeat bottom center / contain;
  z-index: -1;
}
.custom_saas_features_area::before {
  background: none;
}
.saas_features_item {
  align-items: center;
}
.saas_features_item.two .saas_features_content {
  padding-right: 0;
  padding-left: 70px;
}
.saas_features_item.two .saas_features_img {
  align-items: start;
  /* background: url("../img/home-one/patern_bg_two.png") no-repeat center
    center/cover; */
}
.saas_features_item.three .saas_features_img {
  align-items: start;
  justify-content: flex-end;
  z-index: 1;
}
.saas_features_item.three .saas_features_img .img_small {
  z-index: 0;
  right: 250px;
  top: 30px;
  left: auto;
  border-radius: 20px;
}
.saas_features_item + .saas_features_item {
  margin-top: 110px;
}

.saas_features_content {
  padding-right: 72px;
}
.saas_features_content h6 {
  font-size: 16px;
  text-transform: capitalize;
  color: var(--saas-purple);
  font-family: var(--saas-Inter);
  font-weight: 600;
  margin-bottom: 12px;
  line-height: 24px;
}
.saas_features_content h2 {
  font-size: 35px;
  line-height: 54px;
  letter-spacing: -0.4px;
  margin-bottom: 16px;
}
.saas_features_content p {
  margin-bottom: 25px;
  text-align: left;
}
.saas_features_content .features_item_list {
  margin-bottom: 20px;
}
.saas_features_content .features_item_list h5 {
  font-size: 20px;
}
.saas_features_content .features_item_list p {
  font-size: 18px;
  margin-bottom: 10px;
}
.saas_features_content .saas_btn {
  margin-top: 20px;
}

.saas_features_img {
  border-radius: 20px;
  position: relative;
  padding: 35px;
  height: 100%;
  align-items: baseline;
  display: flex;
  min-height: 500px;
  justify-content: flex-end;
  /* background: url("../img/home-one/patern_bg.png") no-repeat center center/cover; */
}
.saas_features_img img {
  margin-right: -35px;
  border-radius: 20px 0 0 20px;
}
.saas_features_img .img_small {
  position: absolute;
  top: 70px;
  left: 35px;
}
.saas_features_img .img_small_cxas {
  top: 170px;
}
.saas_features_img .img_small img {
  box-shadow: 0px 32px 64px -16px rgba(15, 23, 42, 0.2);
  border-radius: 20px;
}

.saas_list li {
  padding-left: 45px;
  position: relative;
  font-size: 16px;
  color: var(--saas-description);
  font-weight: 600;
  margin-bottom: 14px;
  line-height: 34px;
}
.saas_list li .icon {
  width: 34px;
  height: 34px;
  /* background: #f2f2f2; */
  /* border-radius: 8px; */
  /* border: 1px solid #e6e6e6; */
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  left: 0;
  top: 0;
}

.saas_features_area_two .saas_features_content h2 {
  font-family: var(--saas-Inter);
  font-weight: 600;
}

h2.wow.fadeInUp.home_5_testi {
  font-size: 60px;
  font-weight: 600;
  line-height: 74px;
}

.saas_features_area_three {
  padding-bottom: 220px;
}
.saas_features_area_three .section_title {
  margin-bottom: 20px;
}

.feature_item_inner {
  background: linear-gradient(175deg, #7579ff 0%, #b224ef 100%);
  border-radius: 20px;
  padding: 90px;
}
.feature_item_inner + .feature_item_inner {
  margin-top: 80px;
}
.feature_item_inner .saas_features_img_two {
  position: relative;
}
.feature_item_inner .saas_features_img_two .img_two {
  position: absolute;
  right: 0;
  box-shadow: 0px 3px 29px 0px rgba(143, 139, 139, 0.25);
  border-radius: 10px;
}
.feature_item_inner .saas_feature_content_two h2,
.feature_item_inner .saas_feature_content_two p {
  color: #fff;
}
.feature_item_inner .saas_feature_content_two h2 {
  font-size: 38px;
  line-height: 48px;
  letter-spacing: -0.03px;
  margin-bottom: 20px;
}
.feature_item_inner .saas_feature_content_two p {
  margin-bottom: 20px;
}
.feature_item_inner .saas_feature_content_two .theme_btn_two {
  box-shadow: none;
  color: var(--saas-purple);
}
.feature_item_inner .saas_feature_content_two .theme_btn_two i {
  margin-left: 4px;
}
.feature_item_inner .saas_feature_content_two .theme_btn_two:hover {
  color: #fff;
}
.feature_item_inner.two {
  background: linear-gradient(175deg, #f74fac 0%, #fcb24f 100%);
}
.feature_item_inner.two .saas_features_img_two .img_two {
  top: 120px;
  right: 60px;
}
.feature_item_inner.three {
  background: linear-gradient(175deg, #ff7a00 0%, #ffd439 100%);
}
.feature_item_inner.three .saas_features_img_two {
  padding-top: 50px;
}
.feature_item_inner.three .saas_features_img_two .img_two {
  top: -30px;
}

.features_list {
  margin-bottom: 40px;
}
.features_list li {
  font-size: 18px;
  line-height: 28px;
  font-weight: 500;
  color: #fff;
  margin-bottom: 7px;
}
.features_list li i {
  border-radius: 50%;
  font-size: 18px;
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  top: 0px;
  position: relative;
  margin-right: 10px;
}

.app_features_area {
  padding: 120px 0px;
}

.app_features_item {
  align-items: center;
}
.app_features_item:not(:last-child) {
  margin-bottom: 130px;
}
.app_features_item .saas_features_img {
  padding-bottom: 0;
  justify-content: center;
  background: transparent;
}
.app_features_item .saas_features_img .img_small {
  bottom: 120px;
  right: 60px;
  left: auto;
  top: auto;
}
.app_features_item .app_features_content {
  padding-left: 50px;
}
.app_features_item .app_features_content h2 {
  color: #fff;
  font-size: 60px;
  line-height: 74px;
  font-weight: 600;
  letter-spacing: -1.5px;
  margin-bottom: 38px;
}
.app_features_item .app_features_content p {
  color: #fff;
  font-size: 18px;
  line-height: 34px;
}
.app_features_item .app_features_content .features_item_list {
  position: relative;
  padding-left: 42px;
  padding-right: 80px;
  margin-bottom: 35px;
}
.app_features_item .app_features_content .features_item_list:before {
  content: "";
  position: absolute;
  background: url('data:image/svg+xml,<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M12.8682 2.62891C13.2308 2.99154 13.2308 3.57947 12.8682 3.94211L5.4396 11.3707C5.07696 11.7333 4.48903 11.7333 4.12639 11.3707L0.412109 7.65639C0.0494793 7.29376 0.0494793 6.70582 0.412109 6.34319C0.774738 5.98056 1.36268 5.98056 1.72531 6.34319L4.78299 9.40088L11.555 2.62891C11.9176 2.26628 12.5055 2.26628 12.8682 2.62891Z" fill="white"/></svg>');
  left: 0;
  top: 5px;
  color: #fff;
  width: 25px;
  height: 25px;
  border-radius: 50%;
  background-color: var(--saas-purple);
  background-position: 6px center;
  background-repeat: no-repeat;
}
.app_features_item .app_features_content .features_item_list h5 {
  font-size: 24px;
  font-weight: 600;
  color: #fff;
  font-family: var(--saas-Inter);
  line-height: 34px;
  margin-bottom: 15px;
}
.app_features_item .app_features_content .features_item_list p {
  font-size: 18px;
  font-weight: 400;
  color: #fff;
  font-family: var(--saas-Inter);
  line-height: 30px;
}
.app_features_item.two .app_features_content {
  padding-left: 0px;
  padding-right: 50px;
}
.app_features_item.two .app_features_content p {
  margin-bottom: 35px;
}
.app_features_item.two .app_features_content .features_list li {
  font-size: 23px;
  margin-bottom: 25px;
  position: relative;
  padding-left: 40px;
}
.app_features_item.two .app_features_content .features_list li:before {
  content: "";
  position: absolute;
  background: url('data:image/svg+xml,<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M12.8682 2.62891C13.2308 2.99154 13.2308 3.57947 12.8682 3.94211L5.4396 11.3707C5.07696 11.7333 4.48903 11.7333 4.12639 11.3707L0.412109 7.65639C0.0494793 7.29376 0.0494793 6.70582 0.412109 6.34319C0.774738 5.98056 1.36268 5.98056 1.72531 6.34319L4.78299 9.40088L11.555 2.62891C11.9176 2.26628 12.5055 2.26628 12.8682 2.62891Z" fill="white"/></svg>');
  left: 0;
  top: 2px;
  color: #fff;
  width: 25px;
  height: 25px;
  border-radius: 50%;
  background-color: var(--saas-purple);
  background-position: 6px center;
  background-repeat: no-repeat;
}
.saas_faq_area {
  position: relative;
  z-index: 1;
  background: linear-gradient(0deg, rgba(248, 240, 229, 0.5) 0%, #f8f0e5 100%);
}

.faq_inner .accordion-item {
  border: 0px;
  border-radius: 0px;
  border-bottom: 1px solid rgb(131 131 131 / 9%);
  margin-bottom: 10px;
  background: transparent;
}
.faq_inner .accordion-item .accordion-header .accordion-button {
  padding: 15px 15px 20px;
  background: transparent;
  font-size: 22px;
  line-height: 32px;
  color: var(--saas-white);
  font-weight: 600;
  border: 0px;
  box-shadow: none;
}
.faq_inner .accordion-item .accordion-header .accordion-button:after {
  color: var(--saas-white);
}
.faq_inner
  .accordion-item
  .accordion-header
  .accordion-button:not(.collapsed)::after {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23212529'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
  transform: rotate(-180deg);
}
.faq_inner .accordion-item .accordion-body {
  color: var(--saas-description);
  font-size: 18px;
  line-height: 30px;
  padding-top: 0;
  padding-left: 15px;
  padding-bottom: 28px;
}

.faq_inner_two .accordion-item .accordion-header .accordion-button {
  color: var(--saas-white);
}

.promo_content h2,
.promo_content p {
  color: #fff;
}
.promo_content h2 {
  font-size: 52px;
  line-height: 68px;
  letter-spacing: -1.8px;
  margin-bottom: 20px;
}
.promo_content p {
  line-height: 32px;
}
.promo_content .saas_btn {
  background: #fff;
  color: var(--saas-purple);
  border-color: #fff;
  margin-top: 25px;
}
.promo_content .saas_btn:hover {
  background: var(--saas-purple);
  color: #fff;
  border-color: var(--saas-purple);
}

.promo_content_bg {
  background: linear-gradient(90deg, #2563eb 0%, #1d4ed8 100%);
  border-radius: 20px;
  padding: 100px 320px;
  position: relative;
  z-index: 1;
  margin-top: 90px;
}
.promo_content_bg .shap_one,
.promo_content_bg .shap_two {
  position: absolute;
  z-index: -1;
}
.promo_content_bg .shap_one {
  left: 0;
  top: 0;
}
.promo_content_bg .shap_two {
  bottom: 100px;
  right: 200px;
}
.promo_content_bg .saas_btn:hover {
  background: #fff;
  color: var(--saas-purple);
}

.promo_area_dark .saas_btn {
  background: var(--saas-purple);
  color: #fff;
}
.promo_area_dark .saas_btn:hover {
  background: #fff;
  color: var(--saas-purple);
}

.promo_area_three .promo_content .saas_btn {
  background: none;
  color: #fff;
  border: 2px solid #fff;
}

/* .service_tab_inner {
  padding-left: 25px;
  padding-right: 25px;
} */
/* .service_tab_inner .nav-tabs { */
/* border-bottom: 2px solid rgba(57, 57, 57, 0.12); */
/* border-bottom: none;
  justify-content: center; */
/* } */
.service_tab_inner .nav-tabs .nav-item {
  width: 11%;
  /* border-bottom: 2px solid rgba(57, 57, 57, 0.12);
  margin-bottom: 70px; */
}
.service_tab_inner .nav-tabs {
  position: relative;
  border-bottom: none;
  /* padding-bottom: 10px; */
}

.service_tab_inner .nav-tabs::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 4px;
  background: url('data:image/svg+xml;utf8,<svg width="100%" height="7" viewBox="0 0 1920 7" preserveAspectRatio="none" xmlns="http://www.w3.org/2000/svg"><path d="M0 3.5H384" stroke="%23FF5757" stroke-width="7"/><path d="M384 3.5H768" stroke="%23FF914D" stroke-width="7"/><path d="M768 3.5H1152" stroke="%23FFD014" stroke-width="7"/><path d="M1152 3.5H1536" stroke="%2338B6FF" stroke-width="7"/><path d="M1536 3.5H1920" stroke="%230097B2" stroke-width="7"/></svg>')
    no-repeat center;
  background-size: contain;
}

.service_tab_button {
  text-align: center;
  border: 0px !important;
  border-radius: 0px;
  font-size: 16px;
  font-weight: 600;
  color: #6d737c;
  font-family: var(--saas-Inter);
  padding-bottom: 20px;
  position: relative;
}
.service_tab_button:before {
  content: "";
  position: absolute;
  left: 0;
  bottom: -1px;
  width: 100%;
  height: 2px;
  /* background: var(--saas-white); */
  opacity: 0;
}
.service_tab_button.active,
.service_tab_button:hover {
  background: transparent !important;
  color: var(--saas-white) !important;
}
.service_tab_button.active::before,
.service_tab_button:hover::before {
  opacity: 1;
}
.service_tab_button.active .icon,
.service_tab_button:hover .icon {
  background: var(--saas-purple);
  box-shadow: 0px 4px 12px -2px rgba(56, 111, 251, 0.35);
}
.service_tab_button.active .icon svg path,
.service_tab_button:hover .icon svg path {
  stroke: #fff;
}
.service_tab_button .icon {
  width: 72px;
  height: 72px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #191919;
  border-radius: 14px;
  margin: 0 auto 25px;
  transition: all 0.3s ease;
}

.service_tab_content {
  padding: 20px 30px;
  background: var(--saas-white);
  border-radius: 16px;
  /* border: 1px solid #e0e2e7; */
  /* top: -250px;
  margin-top: 40px; */
  position: relative;
}
.service_tab_content .tab_item_content img {
  position: absolute;
  top: -20px;
}
.service_tab_content .accordion-header {
  display: none;
}
.service_tab_content .accordion-item {
  border: 0px;
  background: transparent;
}
.service_tab_content .accordion-item .flex-row-reverse .tab_item_content {
  padding-left: 0;
  /* padding-right: 70px; */
}
.service_tab_content .accordion-item .tab_img {
  border-radius: 20px;
}
.service_tab_content .tab_item_content {
  /* padding-left: 70px; */
  text-align: center;
}
.service_tab_content .tab_item_content h3 {
  font-size: 32px;
  font-weight: 600;
  margin-bottom: 15px;
  color: var(--saas-white);
}
.service_tab_content .tab_item_content .saas_btn {
  margin-top: 20px;
}

.service_tab_item {
  margin-top: 25px;
}
.service_tab_item ul {
  padding: 0;
}
.service_tab_item ul li {
  list-style: none;
  padding: 0;
}
.service_tab_item p {
  color: var(--saas-white);
}
.service_tab_item h4 {
  font-size: 20px;
  font-weight: 600;
  color: var(--saas-white);
  line-height: 1.1;
  letter-spacing: -0.3px;
  margin-bottom: 12px;
}

.promo_tab_image {
  background: linear-gradient(135deg, #7977f5 0%, #008edd 100%);
  border-radius: 10px;
  overflow: hidden;
  padding: 40px;
  height: 100%;
}

.promo_tab_image img {
  border-radius: 10px;
}

.promo_tab_box {
  padding-left: 10px;
}
.promo_tab_box .section_title_two {
  margin-bottom: 30px;
}
.promo_tab_box .nav .nav-item {
  width: 100%;
  display: block;
}
.promo_tab_box .nav {
  gap: 15px;
}
.promo_tab_box .nav .nav-item .nav-link {
  text-align: left;
  display: flex;
  background: #191919;
  padding: 15px;
  border-radius: 12px;
  transition: all 0.3s ease;
  position: relative;
  overflow: hidden;
  align-items: flex-start;
  cursor: pointer;
}
.promo_tab_box .nav .nav-item .nav-link img {
  margin-right: 20px;
}
.promo_tab_box .nav .nav-item .nav-link h5 {
  font-size: 18px;
  font-weight: 500;
  font-family: var(--saas-Inter);
  color: var(--saas-white);
  margin-bottom: 0;
}
.promo_tab_box .nav .nav-item .nav-link p {
  font-size: 16px;
  margin-bottom: 0;
}
.tab-content {
  overflow: hidden;
  height: 100%;
}
.tab-content .brand-1-bg {
  background: #ff3d3d !important;
}
.tab-content .brand-2-bg {
  background: #ff9008 !important;
}
.tab-content .brand-3-bg {
  background: #ffcc00 !important;
}
.tab-content .brand-4-bg {
  background: #38b6ff !important;
}
.tab-content .brand-5-bg {
  background: #0097b2 !important;
}
.promo_tab_box .brand-1.active {
  background: #ff3d3d !important;
}
.promo_tab_box .brand-2.active {
  background: #ff9008 !important;
}
.promo_tab_box .brand-3.active {
  background: #ffcc00 !important;
}
.promo_tab_box .brand-4.active {
  background: #38b6ff !important;
}
.promo_tab_box .brand-5.active {
  background: #0097b2 !important;
}

/* .promo_tab_box .nav .nav-item .nav-link .tab_progress {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 2px;
}
.promo_tab_box .nav .nav-item .nav-link .tab_progress .progress-bar {
  background: var(--saas-purple);
  height: 100%;
} */
.promo_tab_box .nav .nav-item .nav-link.active {
  background: var(--saas-purple);
  /* border-color: var(--saas-purple); */
}

.features_area_two {
  background: #000000;
  position: relative;
  z-index: 1;
}
.features_area_two .service_category_area {
  padding-top: 120px;
}

.features_tab_inner {
  padding: 12px;
  border-radius: 12px;
  background: #191919;
  position: relative;
  z-index: 1;
}
/* .features_tab_inner:before {
  content: "";
  background: url(../img/home-two/tab_shap.png) no-repeat center top/cover;
  position: absolute;
  width: 60px;
  height: 74px;
  right: -50px;
  top: -60px;
  z-index: -1;
} */
.features_tab_inner .nav {
  background: #f5f6fa;
  border-radius: 14px;
  padding: 8px;
}
.features_tab_inner .nav .nav-item {
  width: 16.6666666667%;
}
.features_tab_inner .nav .nav-item .nav-link {
  padding: 15px 15px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  font-size: 16px;
  font-weight: 400;
  color: #1d2939;
  transition: all 0.3s ease;
  width: 100%;
  text-align: left;
}
.features_tab_inner .nav .nav-item .nav-link .icon {
  width: 46px;
  height: 46px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #ff5757;
  margin-right: 16px;
  flex-shrink: 0;
}
.features_tab_inner .nav .nav-item .nav-link.active {
  background: #fff;
  box-shadow: 0px 16px 40px 0px rgba(24, 44, 76, 0.07);
}
.features_tab_inner .nav .nav-item .nav-link.active .icon {
  background: #ff5757;
}
.features_tab_inner .nav .nav-item .nav-link.active .icon svg path {
  stroke: #fff;
}
.features_tab_inner .nav .nav-item:nth-child(2) .nav-link .icon {
  background: #ff8e00;
}
.features_tab_inner .nav .nav-item:nth-child(2) .nav-link .icon svg path {
  stroke: #ff8e00;
}
.features_tab_inner .nav .nav-item:nth-child(2) .nav-link.active .icon {
  background: #ff8e00;
}
.features_tab_inner
  .nav
  .nav-item:nth-child(2)
  .nav-link.active
  .icon
  svg
  path {
  stroke: #fff;
}
.features_tab_inner .nav .nav-item:nth-child(3) .nav-link .icon {
  background: #ffd014;
}
.features_tab_inner .nav .nav-item:nth-child(3) .nav-link .icon svg path {
  stroke: #ffd014;
}
.features_tab_inner .nav .nav-item:nth-child(3) .nav-link.active .icon {
  background: #ffd014;
}
.features_tab_inner
  .nav
  .nav-item:nth-child(3)
  .nav-link.active
  .icon
  svg
  path {
  stroke: #fff;
}
.features_tab_inner .nav .nav-item:nth-child(4) .nav-link .icon {
  background: #38b6ff;
}
.features_tab_inner .nav .nav-item:nth-child(4) .nav-link .icon svg path {
  stroke: #38b6ff;
}
.features_tab_inner .nav .nav-item:nth-child(4) .nav-link.active .icon {
  background: #38b6ff;
}
.features_tab_inner
  .nav
  .nav-item:nth-child(4)
  .nav-link.active
  .icon
  svg
  path {
  stroke: #fff;
}
.features_tab_inner .nav .nav-item:nth-child(5) .nav-link .icon {
  background: #0097b2;
}
.features_tab_inner .nav .nav-item:nth-child(5) .nav-link .icon svg path {
  stroke: #0097b2;
}
.features_tab_inner .nav .nav-item:nth-child(5) .nav-link.active .icon {
  background: #0097b2;
}
.features_tab_inner
  .nav
  .nav-item:nth-child(5)
  .nav-link.active
  .icon
  svg
  path {
  stroke: #fff;
}
.features_tab_inner .nav .nav-item:nth-child(6) .nav-link .icon {
  background: #ff5757;
}
.features_tab_inner .nav .nav-item:nth-child(6) .nav-link .icon svg path {
  stroke: #ff5757;
}
.features_tab_inner .nav .nav-item:nth-child(6) .nav-link.active .icon {
  background: #ff5757;
}
.features_tab_inner .nav .nav-item:nth-child(7) .nav-link .icon {
  background: #ffa113;
}
.features_tab_inner .nav .nav-item:nth-child(7) .nav-link .icon svg path {
  stroke: #ffa113;
}
.features_tab_inner .nav .nav-item:nth-child(7) .nav-link.active .icon {
  background: #ffa113;
}
.features_tab_inner .nav .nav-item:nth-child(8) .nav-link .icon {
  background: #ffd014;
}
.features_tab_inner .nav .nav-item:nth-child(8) .nav-link .icon svg path {
  stroke: #ffd014;
}
.features_tab_inner .nav .nav-item:nth-child(8) .nav-link.active .icon {
  background: #ffd014;
}
.features_tab_inner .nav .nav-item:nth-child(9) .nav-link .icon {
  background: #38b6ff;
}
.features_tab_inner .nav .nav-item:nth-child(9) .nav-link .icon svg path {
  stroke: #38b6ff;
}
.features_tab_inner .nav .nav-item:nth-child(9) .nav-link.active .icon {
  background: #38b6ff;
}
.features_tab_inner .nav .nav-item:nth-child(10) .nav-link .icon {
  background: #0097b2;
}
.features_tab_inner .nav .nav-item:nth-child(10) .nav-link .icon svg path {
  stroke: #0097b2;
}
.features_tab_inner .nav .nav-item:nth-child(10) .nav-link.active .icon {
  background: #0097b2;
}
.features_tab_inner .nav .nav-item:nth-child(11) .nav-link .icon {
  background: #ff5757;
}
.features_tab_inner .nav .nav-item:nth-child(11) .nav-link .icon svg path {
  stroke: #ff5757;
}
.features_tab_inner .nav .nav-item:nth-child(11) .nav-link.active .icon {
  background: #ff5757;
}
.features_tab_inner
  .nav
  .nav-item:nth-child(6)
  .nav-link.active
  .icon
  svg
  path {
  stroke: #fff;
}
.features_tab_inner .saas_features_img img {
  border-radius: 22px;
  box-shadow: 0px 2.16px 6.47px 0px rgba(13, 10, 44, 0.08);
  max-width: 100%;
  margin-right: 0;
}
.features_tab_inner .saas_features_content h2 {
  font-size: 32px;
  line-height: 42px;
  margin-bottom: 15px;
}
.features_tab_inner .saas_features_content .saas_list {
  margin-bottom: 20px;
}
.features_tab_inner .saas_features_content .saas_list li {
  padding-left: 30px;
  line-height: 25px;
}
.features_tab_inner .saas_features_content .saas_list li i {
  color: var(--saas-purple);
  position: absolute;
  left: 0;
  top: 4px;
  font-size: 18px;
}

.promo_area_two {
  padding-top: 110px;
}

.promo_item {
  padding-left: 80px;
  padding-right: 80px;
}
.promo_item img {
  margin-bottom: 25px;
}
.promo_item h4 {
  font-size: 18px;
  line-height: 24px;
  font-weight: 600;
}
.promo_item p {
  font-size: 16px;
  line-height: 24px;
}

.promo_dash_img {
  background: rgba(43, 91, 253, 0.16);
  border-top-left-radius: 24px;
  border-top-right-radius: 24px;
  padding: 90px 0px 0px;
  margin-top: 60px;
}

.promo_area_dark {
  position: relative;
  padding: 170px 0px;
  z-index: 1;
}
.promo_area_dark:before {
  content: "";
  width: 100%;
  height: 100%;
  background: url(../img/home-four/shap_2.png) no-repeat center top/cover;
  z-index: -1;
  position: absolute;
  left: 0;
  top: 0;
}
.promo_area_dark .promo_content h2 {
  font-size: 60px;
  font-family: var(--saas-Inter);
  font-weight: 500;
  letter-spacing: -0.01px;
  margin-bottom: 25px;
}
.promo_area_dark .promo_content p {
  color: #98a2b3;
  margin-bottom: 12px;
}
.promo_area_dark .promo_content .theme_btn_two.purple {
  font-size: 18px;
}

.app_promo_area {
  background: linear-gradient(26deg, #0017e4 0%, #3793ff 100%);
  padding-top: 80px;
}

.app_promo_content {
  padding-top: 50px;
}
.app_promo_content h2 {
  color: #fff;
  font-size: 72px;
  letter-spacing: -0.2px;
  font-family: var(--saas-Inter);
  line-height: 85px;
  margin-bottom: 25px;
}
.app_promo_content h2 .split-line {
  display: inline-flex !important;
  column-gap: 10px;
}
.app_promo_content h2 .split-line img {
  bottom: -8px;
  position: relative;
}
.app_promo_content p {
  color: #fff;
  font-size: 20px;
  line-height: 34px;
  margin-bottom: 40px;
}
.app_promo_content .playstore_btn {
  margin-right: 16px;
}
.app_promo_content .playstore_btn svg {
  transition: all 0.3s ease;
}
.app_promo_content .playstore_btn:hover svg {
  transform: scale(1.05);
}

.promo_area_three .promo_content h2 {
  font-size: 50px;
  background: linear-gradient(
    90deg,
    rgb(167 212 255) 0%,
    rgb(206 182 255) 100%
  );
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
.promo_area_three .promo_content p {
  color: var(--saas-white);
  margin-bottom: 40px;
}
.promo_area_three {
  position: relative;
  padding: 200px 0;
  z-index: 1;
}
.promo_area_three::before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  /* background: url(../img/home-one/GLOBE.webp) no-repeat bottom center / cover; */
  background:
    linear-gradient(
      to bottom,
      #000 0%,
      rgba(0, 0, 0, 0.8) 5%,
      rgba(0, 0, 0, 0.5) 10%,
      rgba(0, 0, 0, 0.3) 15%,
      rgba(0, 0, 0, 0.1) 20%,
      rgba(0, 0, 0, 0) 25%
    ),
    url(../img/home-one/GLOBE.webp) center / cover no-repeat;
  z-index: -1;
}
.custom_promo_area_three::before {
  background: none;
}
.promo_area .promo_tab_content h2 {
  font-size: 32px;
  line-height: 42px;
  margin-bottom: 15px;
}
.promo_area .promo_tab_content p {
  margin-bottom: 25px;
  color: var(--saas-white);
}
.promo_area .promo_tab_content .saas_list {
  margin-bottom: 20px;
}
.promo_area .promo_tab_content li {
  padding-left: 30px;
  line-height: 25px;
  color: var(--saas-white);
}
.promo_area .promo_tab_content .saas_list li i {
  color: var(--saas-white);
  position: absolute;
  left: 0;
  top: 4px;
  font-size: 18px;
}
/*---------------------------------------------------- */
/*----------------------------------------------------*/
.service_category_area {
  position: relative;
  z-index: 1;
  padding: 0 0 50px;
}
.service_category_area .shap {
  position: absolute;
  top: 55%;
  transform: translate(-50%, -50%);
  left: 50%;
  z-index: -1;
}
/* .service_category_area .col-lg-4:nth-child(2) .service_item .icon {
  background-color: #ffc147;
}
.service_category_area .col-lg-4:nth-child(3) .service_item .icon {
  background-color: #155cff;
}
.service_category_area .col-lg-4:nth-child(4) .service_item .icon {
  background-color: #46bcff;
}
.service_category_area .col-lg-4:nth-child(5) .service_item .icon {
  background-color: #ff9054;
}
.service_category_area .col-lg-4:nth-child(6) .service_item .icon {
  background-color: #00b478;
} */

.service_item {
  border-radius: 26px;
  border: 1px solid rgba(15, 23, 42, 0.1);
  transition: all 0.3s ease-in-out;
  padding: 30px;
  margin-bottom: 30px;
  cursor: default;
  max-height: 100%;
}
.service_item .icon {
  width: 80px;
  height: 80px;
  border-radius: 25px;
  /* background-color: #ff5f85; */
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 30px;
}
.service_item .icon {
  transition: transform 0.3s ease;
}

.service_item:hover .icon {
  transform: rotate(360deg);
}
.service_item h4 {
  font-size: 24px;
  font-weight: 600;
  margin-bottom: 14px;
}
.service_item p {
  margin-bottom: 0;
  line-height: 32px;
}
.service_item:hover {
  box-shadow: 0px 6px 50px 0px rgba(24, 44, 76, 0.13);
  transform: translateY(-8px);
}

.service_category_area_two .service_item {
  background: #f8f9fc;
  box-shadow: none;
}

.custom_service_category_area .service_item_dark {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 20px;
}

.service_item_dark {
  background: #191919;
  box-shadow: none;
}
.service_item_dark .icon {
  background: transparent !important;
  width: max-content;
  height: max-content;
  border-radius: 0px;
}
.custom_saas_features_area .service_item_dark h4 {
  font-size: 18px;
}
.custom_saas_features_area .service_item_dark p {
  font-size: 14px;
}

.service_item_dark h4,
.service_item_dark p {
  color: #fff;
}
.service_item_dark:hover {
  box-shadow: 0px 6px 10px 0px rgba(0, 0, 0, 0.3);
}
.service_category_area {
  position: relative;
  /* overflow: hidden; */
}

.service_category_area::before,
.service_category_area::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  filter: blur(200px);
  z-index: -1;
  pointer-events: none;
}

.service_category_area::before {
  width: 500px;
  height: 500px;
  background: rgba(138, 43, 226, 0.3);
  top: 10%;
  left: 0;
}

.service_category_area::after {
  width: 500px;
  height: 450px;
  background: rgba(124, 43, 255, 0.3);
  bottom: 10%;
  right: 15%;
}

/* Ensure content stays above the glow */
.service_category_area .container {
  position: relative;
  z-index: 1;
}
.about_img {
  border-radius: 10px;
  overflow: hidden;
  position: relative;
  margin-top: 20px;
  margin-bottom: 60px;
}

img.about_mission_img {
  border-radius: 8px;
}

.saas_about_content {
  padding-left: 80px;
}
.saas_about_content h2 {
  font-size: 43px;
  line-height: 60px;
  letter-spacing: -0.3px;
  color: var(--saas-white);
  margin-bottom: 20px;
}
.saas_about_content p {
  text-align: left;
}
.saas_about_content .saas_btn {
  margin-top: 25px;
}

/* .fact_inner {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  padding-left: 80px;
  padding-right: 80px;
  grid-gap: 70px;
  margin-top: 170px;
}
.fact_inner .skill_fact_item {
  display: flex;
  align-items: center;
}
.fact_inner .skill_fact_item .number {
  font-size: 48px;
  font-weight: 600;
  color: var(--saas-white);
  font-family: var(--saas-Inter);
  margin-right: 20px;
}
.fact_inner .skill_fact_item p {
  margin-bottom: 0;
  font-size: 18px;
} */
.fact_inner {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  padding-left: 80px;
  padding-right: 80px;
  grid-gap: 70px;
  margin-top: 170px;
}

.fact_inner .skill_fact_item {
  display: flex;
  align-items: center;
}

.fact_inner .skill_fact_item .icon {
  flex-shrink: 0; /* Prevent icon from shrinking */
}

.fact_inner .skill_fact_item .number {
  font-size: 48px;
  font-weight: 600;
  color: var(--saas-white);
  font-family: var(--saas-Inter);
  margin-right: 20px;
}

.fact_inner .skill_fact_item p {
  margin-bottom: 0;
  font-size: 18px;
}

/* Tablet Landscape - 3 columns but smaller spacing */
@media (max-width: 1200px) {
  .fact_inner {
    padding-left: 40px;
    padding-right: 40px;
    grid-gap: 40px;
    margin-top: 120px;
  }

  .fact_inner .skill_fact_item .number {
    font-size: 42px;
  }

  .fact_inner .skill_fact_item p {
    font-size: 16px;
  }
}

/* Tablet Portrait - 2 columns */
@media (max-width: 991px) {
  .fact_inner {
    grid-template-columns: repeat(2, 1fr);
    padding-left: 30px;
    padding-right: 30px;
    grid-gap: 40px;
    margin-top: 100px;
  }

  .fact_inner .skill_fact_item .number {
    font-size: 38px;
  }
}

/* Mobile Landscape */
@media (max-width: 768px) {
  .fact_inner {
    grid-template-columns: 1fr;
    padding-left: 20px;
    padding-right: 20px;
    grid-gap: 30px;
    margin-top: 80px;
  }

  .fact_inner .skill_fact_item {
    justify-content: center;
    text-align: center;
    flex-direction: column;
  }

  .fact_inner .skill_fact_item .icon {
    margin-bottom: 15px;
  }

  .fact_inner .skill_fact_item .number {
    font-size: 36px;
    margin-right: 0;
    margin-bottom: 10px;
  }

  .fact_inner .skill_fact_item p {
    font-size: 16px;
  }
}

/* Mobile Portrait - Stack vertically */
@media (max-width: 576px) {
  .fact_inner {
    padding-left: 15px;
    padding-right: 15px;
    grid-gap: 25px;
    margin-top: 60px;
  }

  .fact_inner .skill_fact_item .icon svg {
    width: 35px;
    height: 35px;
  }

  .fact_inner .skill_fact_item .number {
    font-size: 32px;
  }

  .fact_inner .skill_fact_item p {
    font-size: 15px;
  }
}

/* Extra Small Mobile */
@media (max-width: 375px) {
  .fact_inner {
    margin-top: 50px;
    grid-gap: 20px;
  }

  .fact_inner .skill_fact_item .icon svg {
    width: 30px;
    height: 30px;
  }

  .fact_inner .skill_fact_item .number {
    font-size: 28px;
  }

  .fact_inner .skill_fact_item p {
    font-size: 14px;
  }
}
.mission_content .section_title {
  margin-bottom: 30px;
}
.mission_content .nav-tabs .nav-item {
  /* margin-right: 40px; */
}
.mission_content .nav-tabs .nav-item .nav-link {
  padding-left: 0;
  padding-right: 0;
  font-size: 22px;
  /* padding-right: 0; */
}
.mission_content .nav-tabs .nav-item .nav-link:before {
  /* background: var(--saas-purple); */
}
.mission_content .nav-tabs .nav-item .nav-link.active,
.mission_content .nav-tabs .nav-item .nav-link:hover {
  color: var(--saas-purple);
}
.mission_content .tab-content .tab-pane {
  padding-top: 30px;
}
.mission_content .tab-content p {
  font-size: 18px;
  line-height: 28px;
}
.mission_content .tab-content .saas_list li {
  padding-left: 36px;
  color: #d1d1d1;
}
.mission_content .tab-content .saas_list li i,
.mission_content .tab-content .saas_list li img {
  position: absolute;
  left: 0;
  top: 5px;
}

/*---------------------------------------------------- */
/*----------------------------------------------------*/
.testimonial_area_one {
  overflow: hidden;
  background: linear-gradient(0deg, #000 0%, #000 100%);
  position: relative;
  z-index: 1;
}
/* .testimonial_area_one .service_tab_area::before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background: url(../img/home-one/EARTH.png) no-repeat bottom center / contain;
  z-index: -1;
} */
/* .bg-map {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: auto;
  object-fit: contain;
  z-index: -1;
} */
.testimonial_area_one .service_tab_area {
  padding-top: 120px;
}
.testimonial_area_one .service_tab_area .section_title {
  margin-bottom: 60px;
}
.testimonial_area_one .saas_accordion_area {
  margin-top: 100px;
}

.testimonial_area_two {
  overflow: hidden;
  position: relative;
  z-index: 1;
  background: linear-gradient(0deg, rgba(250, 239, 245, 0.5) 0%, #faeff5 100%);
}
.testimonial_area_two.black:before {
  display: none;
}
.testimonial_area_two.black .testimonial_slider_one .item {
  background: #1c1c22;
}
.testimonial_area_two.black .testimonial_slider_one .item p {
  color: #fff;
}
.testimonial_area_two.black .testimonial_slider_one .item .client_info h5 {
  color: #fff;
}
.testimonial_area_two.black .testimonial_slider_one .item .client_info h6 {
  color: #979797;
}
.testimonial_area_two.black .testimonial_slider_one .item .quote_icon::before {
  background: #4e5066;
}
.testimonial_area_two.black .custom_nav .slick-arrow {
  border: 1px solid #191919;
  background: #191919;
  color: #fff;
  line-height: 44px;
}
.testimonial_area_two.black .custom_nav .slick-arrow:hover {
  background: #fff;
  border-color: #fff;
  color: #14141f;
}

.testimonial_area_four {
  overflow: hidden;
  position: relative;
  z-index: 1;
}
.testimonial_area_four.black:before {
  display: none;
}
.testimonial_area_four.black .testimonial_slider_one .item {
  background: #1c1c22;
}
.testimonial_area_four.black .testimonial_slider_one .item p {
  color: #fff;
}
.testimonial_area_four.black .testimonial_slider_one .item .client_info h5 {
  color: #fff;
}
.testimonial_area_four.black .testimonial_slider_one .item .client_info h6 {
  color: #979797;
}
.testimonial_area_four.black .testimonial_slider_one .item .quote_icon .icon {
  background: var(--saas-purple);
}
.testimonial_area_four.black .testimonial_slider_one .item .quote_icon::before {
  background: #4e5066;
}

.black .custom_nav .slick-arrow {
  border: 1px solid #c5d1e0;
  background: transparent;
  color: #fff;
  line-height: 44px;
}
.black .custom_nav .slick-arrow:hover {
  background: #fff;
  border-color: #fff;
  color: #14141f;
}

.testimonial_slider_one {
  margin-right: -640px;
}
.testimonial_slider_one .item {
  padding: 50px;
  background: #fff;
  border-radius: 20px;
  margin: 0 10px;
}
.testimonial_slider_one .item .ratting {
  margin-bottom: 8px;
}
.testimonial_slider_one .item .ratting i {
  color: #f59e0b;
}
.testimonial_slider_one .item p {
  line-height: 34px;
}
.testimonial_slider_one .item .quote_icon {
  position: relative;
  margin-top: 35px;
  margin-bottom: 12px;
}
.testimonial_slider_one .item .quote_icon::before {
  content: "";
  width: 530px;
  height: 1px;
  background: #eaecf0;
  display: block;
  flex: 1;
}
.testimonial_slider_one .item .quote_icon .icon {
  width: 48px;
  height: 48px;
  background: var(--saas-purple);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.testimonial_slider_one .item .client_info {
  display: flex;
  align-items: center;
}
.testimonial_slider_one .item .client_info img {
  border-radius: 50%;
  margin-right: 15px;
}
.testimonial_slider_one .item .client_info h5 {
  font-size: 18px;
  font-weight: 600;
  color: #344054;
}
.testimonial_slider_one .item .client_info h6 {
  font-size: 18px;
  color: #344054;
  font-family: var(--saas-Inter);
  font-weight: 400;
  margin-bottom: 0;
}

.testimonial_slider_two .item {
  border-radius: 12px;
  /* background: #000; */
  /* border: 1px solid var(--saas-description); */
  padding: 20px;
  margin: 0px 12px;
  /* box-shadow: 0px 4px 40px 0px rgba(20, 20, 31, 0.05); */
  background: rgba(255, 255, 255, 0.1);
  box-shadow: 0 4px 10px rgb(183 160 216 / 20%);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border: 1px solid rgba(255, 255, 255, 0.3);
}
.testimonial_slider_two p {
  color: var(--saas-description);
  text-align: justify;
  font-size: 13px;
  margin: 0;
  line-height: 22px;
}
.testimonial_slider_two .item .t_logo {
  /* margin-bottom: 30px; */
  align-items: center;
}
.testimonial_slider_two .item img {
  max-width: 100%;
}
.testimonial_slider_two .item .ratting {
  margin-bottom: 8px;
}
.testimonial_slider_two .item .ratting i {
  color: #ffd014;
  margin-left: 2px;
}
.testimonial_slider_two .item .client_info {
  display: flex;
  align-items: center;
  /* margin-top: 55px; */
}
.testimonial_slider_two .item .client_info img {
  border-radius: 50%;
  width: 70px;
  height: 70px;
  margin-right: 15px;
}
.testimonial_slider_two .item .client_info h5 {
  font-family: var(--saas-Inter);
  font-size: 16px;
  font-weight: 600;
  color: var(--saas-description);
  margin-bottom: 5px;
}
.testimonial_slider_two .item .client_info h6 {
  color: var(--saas-description);
  font-size: 14px;
  font-weight: 400;
  margin-bottom: 0;
}

.custom_nav {
  text-align: center;
  margin-top: 60px;
}
.custom_nav .slick-arrow {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  line-height: 44px;
  border: 1px solid #191919;
  color: var(--saas-description);
  background: #191919;
  margin: 0px 5px;
  transition: all 0.3s linear;
}
.custom_nav .slick-arrow:hover {
  background: #191919;
  border-color: #191919;
  color: #fff;
}

.testimonial_area_three {
  background: linear-gradient(20deg, #0017e4 0%, #3793ff 100%);
}

.testimonial_area_five {
  position: relative;
  overflow: hidden;
  z-index: 1;
}
.testimonial_area_five:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  background: url(../img/home-five/shapes.png) no-repeat top center/cover;
  z-index: -1;
  width: 100%;
  height: 100%;
}

/*---------------------------------------------------- */
.portfolio_filter {
  display: flex;
  justify-content: center;
  margin-bottom: 50px;
}
.portfolio_filter .work_portfolio_item {
  font-size: 16px;
  line-height: 28px;
  color: #1d2939;
  text-align: center;
  padding: 7px 15px;
  border: 1px solid #e6e8f1;
  border-radius: 4px;
  margin: 4px;
  cursor: pointer;
}
.portfolio_filter .work_portfolio_item:hover,
.portfolio_filter .work_portfolio_item.active {
  background: var(--saas-purple);
  color: #fff;
  border-color: var(--saas-purple);
}

.portfolio_item {
  margin-bottom: 40px;
}
.portfolio_item .portfolio_img {
  overflow: hidden;
  display: block;
  position: relative;
}
.portfolio_item .portfolio_img img {
  transition: all 0.3s linear;
  max-width: 100%;
}
.portfolio_item .portfolio_img .hover_content {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: linear-gradient(
    180deg,
    rgba(4, 14, 41, 0.1) 0%,
    rgb(4, 14, 41) 100%
  );
  opacity: 0;
  transition: opacity 300ms linear;
  display: flex;
  align-items: flex-end;
  width: 100%;
  padding: 30px;
}
.portfolio_item .portfolio_img .hover_content a {
  overflow: hidden;
  display: inline-block;
}
.portfolio_item .portfolio_img .hover_content h3 {
  color: #fff;
  transform: translateY(35px);
  transition: all 0.4s linear;
}
.portfolio_item .portfolio_img .hover_content .portfolio_category a {
  color: #b8c2da;
}
.portfolio_item .portfolio_img .hover_content .portfolio_category a:hover {
  color: #fff;
}
.portfolio_item h3 {
  font-size: 28px;
  line-height: 36px;
  margin-top: 22px;
  transition: all 0.3s linear;
}
.portfolio_item .portfolio_category a {
  font-size: 16px;
  color: #60687a;
}
.portfolio_item .portfolio_category a:hover {
  color: var(--saas-purple);
}
.portfolio_item:hover .portfolio_img img {
  transform: scale(1.1) translateX(10px);
}
.portfolio_item:hover .portfolio_img .hover_content {
  opacity: 1;
}
.portfolio_item:hover .portfolio_img .hover_content h3 {
  transform: translateY(0);
}
.portfolio_item:hover h3 {
  color: var(--saas-purple);
}

.portfolio_area_two .portfolio_item h3 {
  font-size: 24px;
  line-height: 1.25;
}

.portfolio_area_masonry .portfolio_item {
  margin-bottom: 24px;
  cursor: pointer;
}
.portfolio_area_masonry .portfolio_item h3 {
  margin-bottom: 0;
}

.portfolio_single_area {
  padding-top: 120px;
}

.single_portfolio_content {
  padding: 100px;
}
.single_portfolio_content h2 {
  font-size: 48px;
  line-height: 56px;
  letter-spacing: -0.2px;
  margin-bottom: 25px;
}
.single_portfolio_content h3 {
  font-size: 44px;
  line-height: 50px;
  letter-spacing: -2.2px;
  margin-bottom: 18px;
}
.single_portfolio_content p {
  margin-bottom: 25px;
  text-align: justify;
}
.single_portfolio_content ul li {
  font-family: var(--saas-Inter);
  font-weight: 400;
  font-size: 18px;
  line-height: 28px;
  color: var(--saas-description);
  margin-bottom: 5px;
}
.single_portfolio_content .read_more_btn {
  font-size: 22px;
  margin-top: 40px;
}
.single_portfolio_content .pr_info {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px 20px;
  border-top: 1px solid rgba(2, 2, 2, 0.15);
  margin-top: 100px;
  padding-top: 50px;
}
.single_portfolio_content .pr_info span {
  font-size: 20px;
  color: #7d7d82;
  font-weight: 400;
  letter-spacing: -0.5px;
  display: inline-block;
  margin-bottom: 8px;
}
.single_portfolio_content .pr_info h6 {
  font-size: 26px;
  font-weight: 500;
  color: #ffffff;
}
.single_portfolio_content .item + .item {
  margin-top: 60px;
}

.gallery_item {
  margin-bottom: 25px;
}

/*----------------------------------------------------*/
.team_area {
  /* background: #191919; */
  padding: 170px 0;
}
.team_area .row {
  margin-bottom: -30px;
}

.team_item {
  margin-bottom: 30px;
}
.team_item .team_img {
  border-radius: 8px;
  overflow: hidden;
  position: relative;
  z-index: 1;
}
.team_item .team_img img {
  transition: all 0.3s linear;
  width: 100%;
}
.team_item .team_img .team_social {
  text-align: center;
  position: absolute;
  /* top: 50%; */
  bottom: -25px;
  transform: translateY(-50%);
  /* left: 0; */
  left: -110px;
  text-align: center;
  width: 100%;
}
.team_item .team_img .team_social li {
  display: inline-block;
}
.team_item .team_img .team_social li a {
  background: #f9f9f9;
  color: #1d2939;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  height: 40px;
  width: 40px;
  transition: all 0.3s linear;
  transform: scale(0);
}
.team_item .team_img .team_social li a:hover {
  background: var(--saas-purple);
  color: #fff;
}
.team_item .team_text {
  padding-top: 25px;
  text-align: center;
}
.team_item .team_text h5 {
  font-size: 20px;
  font-weight: 600;
  margin-bottom: 2px;
}
.team_item .team_text p {
  font-size: 16px;
  margin-bottom: 0;
}
.team_item:hover .team_img img {
  transform: scale(1.1);
}
.team_item:hover .team_img .team_social {
  opacity: 1;
}
.team_item:hover .team_img .team_social li a {
  transform: scale(1);
  opacity: 1;
}

/*---------------------------------------------------- */
/*----------------------------------------------------*/
.saas_accordion_area {
  position: relative;
  z-index: 1;
  overflow: hidden;
}
.saas_accordion_area .tab_shap {
  position: absolute;
  top: 0;
  right: 0;
  z-index: -1;
}

.saas_accordion_item {
  border: 0px;
  border-radius: 0px;
  /* padding-right: 50px; */
  position: relative;
}
.saas_accordion_item:before {
  content: "";
  width: 1px;
  height: 100%;
  background: #e6e6e6;
  position: absolute;
  left: 0;
  top: 0;
}
.saas_accordion_item .accordion-item {
  border: 0px;
  background: transparent;
  position: relative;
  padding-top: 5px;
}
.saas_accordion_item .accordion-item:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 3px;
  height: 0px;
  background: var(--saas-purple);
  transition: height 0.5s ease 0s;
}
.saas_accordion_item .accordion-item.is-active:before {
  height: 100%;
}
.saas_accordion_item .accordion-header .accordion-button {
  padding: 15px;
  font-size: 20px;
  color: #38b6ff;
  font-family: var(--saas-Inter);
  line-height: 30px;
  letter-spacing: -0.8px;
  font-weight: 500;
  border: 0px;
  box-shadow: none;
  background: transparent;
}
.saas_accordion_item .accordion-header .accordion-button:after {
  width: 17px;
  background-size: 17px;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23d1d1d1'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}
.saas_accordion_item .accordion-header .accordion-button img {
  margin-right: 15px;
}
.saas_accordion_item .accordion-header .accordion-button.collapsed {
  color: var(--saas-white);
}
.saas_accordion_item .accordion-body {
  padding-left: 63px;
  padding-top: 0px;
  font-size: 16px;
  line-height: 25px;
  color: var(--saas-white);
}

.accordion_img {
  border-radius: 12px;
}

.saas_accordion_item_two {
  position: relative;
}
.saas_accordion_item_two:before {
  content: "";
  width: 1px;
  height: 100%;
  background: #e6e6e6;
  position: absolute;
  left: 0;
  top: 0;
}
.saas_accordion_item_two .accordion-item:before {
  width: 3px;
}
.saas_accordion_item_two .accordion-item .accordion-header .accordion-button {
  color: #fff;
  padding-left: 30px;
}
.saas_accordion_item_two
  .accordion-item
  .accordion-header
  .accordion-button:after {
  filter: brightness(100);
}
.saas_accordion_item_two
  .accordion-item
  .accordion-header
  .accordion-button.collapsed {
  color: #fff;
}
.saas_accordion_item_two .accordion-item .accordion-body {
  color: #fff;
  padding-left: 30px;
}

.process_inner {
  position: relative;
  z-index: 1;
  margin-top: 80px;
}
.process_inner:before {
  content: "";
  width: 100%;
  background: url(../img/home-three/line.png) no-repeat center center/cover;
  position: absolute;
  top: 10px;
  left: 0;
  height: 100px;
  z-index: -1;
}
.process_inner [class*="col-"] {
  counter-increment: css-counter;
}
.process_inner .process_item {
  padding: 0px 45px;
}
.process_inner .process_item .icon {
  width: 124px;
  height: 124px;
  border-radius: 12px;
  background: var(--saas-purple);
  box-shadow: 0px 20px 70px 0px rgba(43, 91, 253, 0.3);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 35px;
  position: relative;
}
.process_inner .process_item .icon:before {
  content: "0" counter(css-counter);
  position: absolute;
  width: 42px;
  height: 42px;
  background: #fff;
  border-radius: 100%;
  color: #14141f;
  font-weight: 600;
  font-size: 16px;
  line-height: 42px;
  text-align: center;
  font-family: var(--saas-Inter);
  right: -18px;
  top: -18px;
}
.process_inner .process_item h5 {
  font-size: 24px;
  line-height: 35px;
  font-weight: 600;
  font-family: var(--saas-Inter);
  letter-spacing: -0.8px;
  color: #14141f;
  margin-bottom: 15px;
}

.saas_price_area {
  position: relative;
  z-index: 1;
}
.saas_price_area .price_shap {
  position: absolute;
  top: 0;
  right: 0;
  z-index: -1;
}

.price_note {
  font-size: 18px;
  color: #696a72;
  line-height: 30px;
  margin-top: 30px;
}
.price_note a {
  text-decoration: underline;
  color: #14141f;
  transition: all 0.3s linear;
}
.price_note a:hover {
  color: var(--saas-purple);
}

.saas_price_item {
  border: 1px solid #e6e6e6;
  border-radius: 12px;
  padding: 40px 30px 35px;
  transition: all 0.3s linear;
  background: #fff;
  cursor: pointer;
}
.saas_price_item .price_header {
  margin-bottom: 25px;
}
.saas_price_item .price_header h3 {
  font-size: 20px;
  font-weight: 600;
  color: #14141f;
}
.saas_price_item .price_header h2 {
  font-size: 48px;
  font-weight: 600;
  color: #14141f;
}
.saas_price_item ul {
  margin-bottom: 40px;
}
.saas_price_item ul li {
  font-size: 18px;
  font-family: var(--saas-Inter);
  color: #344054;
  line-height: 30px;
  margin-bottom: 8px;
}
.saas_price_item ul li.opacity {
  opacity: 0.3;
}
.saas_price_item ul li i {
  font-size: 14px;
}
.saas_price_item ul li img {
  margin-right: 6px;
}
.saas_price_item .price_btn {
  display: block;
  text-align: center;
  border-radius: 4px;
  font-size: 16px;
  font-weight: 600;
  font-family: var(--saas-Inter);
  color: #14141f;
  background: #e3e8f4;
  padding: 16px 20px;
  margin-top: 10px;
  transition: all 0.3s linear;
}
.saas_price_item .price_btn.black {
  background: #14141f;
  color: #fff;
}
.saas_price_item .price_btn:hover {
  background: var(--saas-purple);
  color: #fff;
}
.saas_price_item:hover {
  border-color: var(--saas-purple);
}
.saas_price_item:hover h2 {
  color: var(--saas-purple);
}

.sec_border {
  position: relative;
  z-index: 1;
}
.sec_border:before,
.sec_border:after {
  content: "";
  width: 100%;
  height: 2px;
  background: rgb(67, 65, 71);
  background: linear-gradient(
    90deg,
    rgba(67, 65, 71, 0) 0%,
    rgba(102, 112, 133, 0.96) 50%,
    rgba(67, 65, 71, 0) 100%
  );
  position: absolute;
  left: 0;
}
.sec_border:before {
  top: 0;
}
.sec_border:after {
  bottom: 0;
}

.price_tab .nav-item .nav-link {
  color: #fff;
  font-weight: 600;
  font-size: 16px;
  font-family: var(--saas-Inter);
  transition: all 0.2s;
}
.price_tab .nav-item .nav-link.active {
  background: #fff;
  color: #344054;
}

.price_content .saas_price_item {
  background: linear-gradient(
    178deg,
    rgba(3, 8, 3, 0.4) -4%,
    rgb(19, 21, 25) 23%
  );
  position: relative;
  z-index: 1;
  border: 0px;
  overflow: hidden;
  border-radius: 16px;
}
.price_content .saas_price_item:before {
  content: "";
  left: 1px;
  right: 1px;
  top: 1px;
  bottom: 1px;
  position: absolute;
  background: rgb(67, 65, 71);
  background: linear-gradient(0deg, rgb(19, 21, 25) 100%, rgb(51, 53, 58) 90%);
  border-radius: 16px;
  z-index: -1;
  opacity: 0;
  transition: all 0.3s linear;
}
.price_content .saas_price_item .price_header {
  position: relative;
  padding-right: 50px;
}
.price_content .saas_price_item .price_header h3 {
  font-size: 16px;
  font-weight: 400;
  color: #fff;
  font-family: var(--saas-Inter);
}
.price_content .saas_price_item .price_header h2 {
  font-size: 24px;
  font-weight: 600;
  color: #fff;
  font-family: var(--saas-Inter);
  margin-bottom: 13px;
}
.price_content .saas_price_item .price_header .badge {
  font-size: 14px;
  font-weight: 500;
  padding: 5px 10px;
  border-radius: 45px;
  background: rgba(255, 255, 255, 0.12);
  border: 1px solid rgba(255, 255, 255, 0.2);
  color: #fff;
  font-family: var(--saas-Inter);
  position: absolute;
  top: 0;
  right: 0;
}
.price_content .saas_price_item .price_middle {
  padding: 30px 0px;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
  margin-bottom: 32px;
}
.price_content .saas_price_item .price_middle h2 {
  font-size: 60px;
  font-weight: 500;
  font-family: var(--saas-Inter);
  color: #fff;
  line-height: 1;
  margin-bottom: 10px;
}
.price_content .saas_price_item .price_middle h2 small {
  font-size: 30px;
}
.price_content .saas_price_item .price_middle p {
  font-size: 16px;
  color: #fff;
  margin-bottom: 28px;
}
.price_content .saas_price_item .price_btn {
  padding: 11px 20px;
  background: rgba(255, 255, 255, 0.42);
  color: #fff;
}
.price_content .saas_price_item ul {
  margin-bottom: 10px;
}
.price_content .saas_price_item ul li {
  font-size: 16px;
  line-height: 25px;
  color: #fff;
  margin-bottom: 12px;
}
.price_content .saas_price_item ul li i {
  font-size: 14px;
  color: var(--saas-purple);
  margin-right: 10px;
}
.price_content .saas_price_item ul li img {
  vertical-align: middle;
  margin-right: 12px;
}
.price_content .saas_price_item ul li a {
  width: 13px;
  height: 13px;
  background: rgba(255, 255, 255, 0.42);
  border-radius: 50%;
  font-size: 9px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #14141f;
  font-weight: 900;
  margin-left: 7px;
  top: -1px;
  position: relative;
}
.price_content .saas_price_item:hover {
  background: linear-gradient(
    0deg,
    rgba(255, 255, 255, 0.05) 0%,
    rgba(186, 147, 248, 0.5) 100%
  );
}
.price_content .saas_price_item:hover:before {
  background: rgb(67, 65, 71);
  background: linear-gradient(
    0deg,
    #372f48 100%,
    rgba(186, 147, 248, 0.05) 90%
  );
  opacity: 1;
}
.price_content .saas_price_item:hover .price_btn {
  background: #fff;
  color: var(--saas-purple);
}

.fun_fact_area {
  background: linear-gradient(26deg, #0017e4 0%, #3793ff 100%);
  padding: 100px 0px;
  position: relative;
  z-index: 1;
}
.fun_fact_area:before {
  content: "";
  width: 100%;
  background: url(../img/home-four/shap.png) no-repeat center center/cover;
  height: 100%;
  position: absolute;
  z-index: -1;
  left: 0;
  top: 0;
}
.fun_fact_area [class*="col-"]:last-child .fact_item::before {
  display: none;
}

.fact_item {
  text-align: center;
  position: relative;
}
.fact_item:before {
  content: "";
  width: 4px;
  height: 100%;
  background: #fff;
  position: absolute;
  right: -20px;
}
.fact_item h3 {
  font-size: 48px;
  font-weight: 700;
  letter-spacing: -0.5px;
  color: #fff;
  font-family: var(--saas-Inter);
  margin-bottom: 20px;
}
.fact_item h5 {
  margin-bottom: 0;
  font-size: 20px;
  font-weight: 500;
  letter-spacing: 0.2px;
  color: #fff;
}

/*---------------------------------------------------- */
/*----------------------------------------------------*/
.blog_item {
  display: flex;
  flex-direction: column;
  flex: 1 0 0;
  align-self: stretch;
  margin-bottom: 60px;
  padding: 30px;
  background: linear-gradient(
    180deg,
    rgba(27, 0, 89, 0.5) 0%,
    rgba(16, 8, 37, 0.5) 100%
  );
  box-shadow: 0 4px 10px rgb(158 130 197 / 20%);
  /* backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border: 1px solid rgba(255, 255, 255, 0.3); */
  border-radius: 30px;
  height: -webkit-fill-available;
}
.blog_item .blog_img {
  display: block;
  overflow: hidden;
}
.blog_item .blog_img img {
  transition: all 0.3s linear;
}
.blog_item .blog_content {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  flex: 1;
  gap: 30px;
  padding-top: 35px;
}
.blog_item .blog_content .read_more_btn {
  margin-top: 10px;
}
.blog_item h2 {
  font-size: 44px;
  line-height: 52px;
  letter-spacing: -0.2px;
  margin-bottom: 22px;
  transition: color 0.2s linear;
}
.blog_item:hover .blog_img img {
  transform: scale(1.1);
}
.blog_item:hover h2 {
  color: var(--saas-purple);
}
.single_breadcrumb_blog h1 {
  font-size: 45px;
  line-height: 65px;
}

.read_more_btn {
  font-size: 16px;
  font-weight: 600;
  color: var(--saas-purple);
  display: inline-block;
  position: relative;
  transition: color 0.3s linear;
}
.read_more_btn:before,
.read_more_btn:after {
  content: "";
  position: absolute;
  width: 100%;
  height: 2px;
  background: var(--saas-purple);
  transition: all 0.3s linear;
  left: 0;
  right: auto;
  bottom: 0;
}
.read_more_btn:after {
  width: 0;
  right: 0;
  left: auto;
  background: var(--saas-purple);
  transition: all 0.3s linear 0.1s;
}
.read_more_btn:hover {
  color: var(--saas-purple);
}
.read_more_btn:hover:after {
  width: 100%;
  right: auto;
  left: 0;
}
.read_more_btn:hover:before {
  width: 0;
  right: 0;
  left: auto;
}

.blog_meta {
  margin-bottom: 10px;
}
.blog_meta a {
  font-size: 16px;
  font-weight: 500;
  font-family: "Plus Jakarta Sans", sans-serif;
  color: var(--saas-description);
  opacity: 0.8;
  position: relative;
}
.blog_meta a + a::before {
  content: "";
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--saas-gray);
  display: inline-block;
  vertical-align: middle;
  margin: 0px 6px 0px 2px;
}

.blog_sidebar {
  padding-left: 50px;
}

.sidebar_widget .widget_title {
  font-size: 20px;
  font-weight: 700;
  font-family: "Plus Jakarta Sans", sans-serif;
  letter-spacing: -0.2px;
  margin-bottom: 25px;
}
.sidebar_widget .search-form {
  position: relative;
  z-index: 1;
}
.sidebar_widget .search-form .form-control {
  font-size: 16px;
  border: 1px solid #e6e8f1;
  border-radius: 4px !important;
  padding-left: 20px;
  height: 52px;
  color: #808695;
  z-index: 0;
}
.sidebar_widget .search-form .form-control:focus {
  border-color: var(--saas-purple);
  box-shadow: none;
}
.sidebar_widget .search-form button {
  border: 0px;
  padding: 16px;
  background: transparent;
  position: absolute;
  color: var(--saas-purple);
  height: 100%;
  right: 0;
}
.sidebar_widget .categories_list {
  margin-bottom: 0;
}
.sidebar_widget .categories_list li a {
  font-size: 16px;
  color: var(--saas-description);
  line-height: 28px;
  font-family: var(--saas-Inter);
  position: relative;
  transition: all 0.3s;
}
.sidebar_widget .categories_list li a:before {
  content: "";
  width: 100%;
  height: 1px;
  background: var(--saas-white);
  position: absolute;
  left: 0;
  bottom: 0;
  transform: scaleX(0);
  transition: all 0.3s;
  transform-origin: left bottom;
}
.sidebar_widget .categories_list li a span {
  color: var(--saas-white);
  font-weight: 600;
  margin-left: 4px;
  display: inline-block;
}
.sidebar_widget .categories_list li a:hover {
  color: var(--saas-white);
}
.sidebar_widget .categories_list li a:hover:before {
  transform: scaleX(1);
}
.sidebar_widget .categories_list li + li {
  margin-top: 6px;
}
.sidebar_widget .recent_post_item .post_img {
  display: block;
  margin-right: 20px;
}
.sidebar_widget .recent_post_item h4 {
  font-size: 16px;
  line-height: 26px;
  margin-bottom: 5px;
  transition: all 0.2s;
}
.sidebar_widget .recent_post_item span {
  color: var(--saas-description);
  opacity: 0.8;
  font-size: 14px;
  font-weight: 500;
  font-family: "Plus Jakarta Sans", sans-serif;
}
.sidebar_widget .recent_post_item + .recent_post_item {
  margin-top: 25px;
}
.sidebar_widget .recent_post_item:hover h4 {
  color: var(--saas-purple);
}
.sidebar_widget + .sidebar_widget {
  margin-top: 40px;
}

.tags_lists a {
  font-size: 16px;
  line-height: 28px;
  display: inline-block;
  background: #191919;
  color: var(--saas-white);
  font-family: "Inter", sans-serif;
  border-radius: 4px;
  padding: 8px 14px;
  margin: 4px 2px;
  transition: all 0.3s;
}
.tags_lists a:hover {
  background: var(--saas-purple);
  color: #fff;
}

.pagination {
  margin-top: 60px;
}
.pagination .page-numbers {
  width: 52px;
  height: 52px;
  text-align: center;
  border: 1px solid #e6e8f1;
  border-radius: 4px;
  font-size: 16px;
  font-weight: 600;
  line-height: 52px;
  color: var(--saas-white);
  display: inline-block;
  margin-right: 8px;
  transition: all 0.3s linear;
}
.pagination .page-numbers:hover,
.pagination .page-numbers.current {
  background: var(--saas-purple);
  border-color: var(--saas-purple);
  color: #fff;
}

.blog_grid_item h2 {
  font-size: 24px;
  line-height: 36px;
  margin-bottom: 10px;
}

.blog_single .blog_content {
  padding-top: 35px;
}
.blog_single .blog_content p + p {
  margin-bottom: 30px;
}
.blog_single .blog_content ul li {
  color: var(--saas-white);
  margin-bottom: 10px;
}
.blog_single .blog_content .blockquote {
  background: #0a0a0a;
  border-radius: 4px;
  padding: 35px 25px 35px 85px;
  position: relative;
  z-index: 1;
}
.blog_single .blog_content .blockquote::before {
  content: "";
  width: 47px;
  height: 37px;
  position: absolute;
  background: url(../img/blog-grid/quote.svg) no-repeat;
  top: 45px;
  left: 20px;
  z-index: -1;
}
.blog_single .blog_content .blockquote h6 {
  font-size: 20px;
  line-height: 32px;
  font-style: italic;
  font-weight: 600;
}
.blog_single .blog_content h4 {
  font-size: 28px;
  margin-bottom: 20px;
  margin-top: 40px;
}

.blog_navbar {
  padding-top: 30px;
  border-top: 1px solid #e6e8f1;
  margin-top: 35px;
}
.blog_navbar a {
  font-size: 16px;
  color: var(--saas-purple);
  font-weight: 500;
  transition: all 0.3s;
}
.blog_navbar a i {
  font-size: 14px;
}
.blog_navbar a.post_prev i {
  margin-right: 10px;
}
.blog_navbar a.post_next i {
  margin-left: 10px;
}
.blog_navbar a:hover {
  color: var(--saas-purple);
}

.blog_title {
  font-size: 32px;
  line-height: 44px;
  margin-bottom: 30px;
}

.comment_inner {
  margin-top: 60px;
}

.comment_box .post_comment {
  margin-top: 30px;
}
.comment_box .post_comment .comment {
  display: flex;
  align-items: flex-start;
}
.comment_box .post_comment .comment .rounded-img {
  width: 90px;
  height: 90px;
  border-radius: 50%;
  margin-right: 25px;
}
.comment_box .post_comment .comment .comment_text h6 {
  font-size: 20px;
  margin-bottom: 8px;
  color: #1d2939;
}
.comment_box .post_comment .comment .comment_text span {
  font-size: 15px;
  color: #344054;
  font-family: var(--saas-Inter);
  margin-bottom: 8px;
}
.comment_box .post_comment .comment .comment_text p {
  color: #344054;
  margin-bottom: 20px;
}
.comment_box .post_comment .comment .comment_text .comment_reply {
  font-size: 15px;
  font-weight: 500;
  color: #1d2939;
  transition: all 0.3s;
  float: right;
}
.comment_box .post_comment .comment .comment_text .comment_reply i {
  margin-right: 4px;
}
.comment_box .post_comment .comment .comment_text .comment_reply:hover {
  color: var(--saas-purple);
}
.comment_box .post_comment .reply_comment {
  margin-left: 100px;
}

.blog_comment_box {
  margin-top: 65px;
}

.comment_form .form-group {
  margin-bottom: 20px;
}
.comment_form .form-group .form-control {
  font-size: 16px;
  border: 1px solid #e6e8f1;
  border-radius: 8px;
  padding-left: 25px;
  color: #808695;
  height: 64px;
}
.comment_form .form-group .form-control:focus {
  border-color: var(--saas-purple);
  box-shadow: none;
}
.comment_form .form-group textarea.form-control {
  height: 220px;
  padding-top: 20px;
}
.comment_form .comment-form-cookies-consent {
  color: #808695;
  font-size: 16px;
  margin-bottom: 30px;
}
.comment_form .comment-form-cookies-consent input {
  display: none;
}
.comment_form .comment-form-cookies-consent input:checked + label:before {
  background: var(--saas-purple);
  border-color: var(--saas-purple);
}
.comment_form .comment-form-cookies-consent input:checked + label:after {
  display: block;
}
.comment_form .comment-form-cookies-consent label {
  position: relative;
  padding-left: 25px;
}
.comment_form .comment-form-cookies-consent label:before {
  content: "";
  width: 15px;
  height: 15px;
  border: 1px solid #001f6d;
  position: absolute;
  left: 0;
  top: 8px;
}
.comment_form .comment-form-cookies-consent label:after {
  content: "";
  width: 5px;
  height: 10px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  position: absolute;
  left: 5px;
  top: 9px;
  transform: rotate(45deg);
  display: none;
}
.comment_form .saas_btn {
  border: 0px;
  padding: 15px 35px;
}

/*---------------------------------------------------- */
/*----------------------------------------------------*/
.saas_content {
  padding-left: 0;
  padding-right: 100px;
}
.saas_content p {
  margin-bottom: 30px;
}

.contact_info_item {
  display: flex;
  max-width: 300px;
  margin-top: 20px;
}
.contact_info_item .icon {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: var(--saas-purple);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 18px;
}
.contact_info_item .contect_text {
  flex: 1;
}
.contact_info_item .contect_text p {
  font-size: 18px;
  color: var(--saas-white);
  font-weight: 500;
  margin-bottom: 0;
}
.contact_info_item .contect_text p a {
  color: var(--saas-white);
  transition: all 0.3s linear;
}
.contact_info_item .contect_text p a:hover {
  color: var(--saas-purple);
}
.application-form-section {
  margin: 100px 0;
}
.contact_form {
  background: rgba(255, 255, 255, 0.1);
  box-shadow: 0 4px 10px rgb(183 160 216 / 20%);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border: 1px solid rgba(255, 255, 255, 0.3);
  border-radius: 20px;
  padding: 50px;
}
.contact_form h3 {
  font-size: 26px;
  font-weight: 700;
  margin-bottom: 40px;
  text-align: center;
}
.contact_form .form-group {
  margin-bottom: 20px;
}
.contact_form .form-group .form-control {
  height: 72px;
  border-radius: 8px;
  padding-left: 25px;
  border: 1px solid #fff;
  background: #fff;
  color: #747373;
}
.contact_form .form-group .form-control::placeholder {
  color: #747373;
}
.contact_form .form-group .form-control:focus {
  outline: none;
  box-shadow: none;
  border-color: var(--saas-purple);
  box-shadow: none;
}
.contact_form .form-group textarea.form-control {
  height: 220px;
  padding-top: 20px;
}
.contact_form .form-group .select {
  width: 100%;
  padding-left: 25px;
  height: 72px;
  border: 1px solid #fff;
  line-height: 72px;
  font-size: 18px;
}
.contact_form .form-group .select .current {
  font-weight: 500;
  color: #0f0e0e;
}
.contact_form .form-group .select:focus {
  outline: none;
  box-shadow: none;
  border-color: var(--saas-purple);
  box-shadow: none;
}
.contact_form .form-group .saas_btn {
  border: 0px;
  padding: 16px 30px;
}

.location_area {
  padding-bottom: 90px;
}

.location_item {
  background: #191919;
  border: 1px solid #191919;
  box-shadow: 0px 6px 60px 0px rgba(24, 44, 76, 0.03);
  padding: 30px;
  border-radius: 20px;
  margin-bottom: 30px;
  min-width: 100%;
}
.location_item h3 {
  font-size: 25px;
  margin-bottom: 20px;
}
.location_item p {
  font-size: 18px;
  line-height: 30px;
  font-weight: 600;
  color: #ffffff;
}
.location_item .email,
.location_item .phone {
  display: block;
  font-size: 18px;
  font-weight: 600;
  color: #ffffff;
  transition: all 0.2s;
  line-height: 32px;
}
.location_item .email:hover,
.location_item .phone:hover {
  color: var(--saas-purple);
}
.location_item .email {
  text-decoration: underline;
}
.location_item .phone {
  font-weight: 400;
}
.location_item .read_more_btn {
  margin-top: 30px;
}

/*---------------------404 Page--------------------- */

.error_area .setting_icon {
  position: absolute;
  left: 130px;
  top: 100px;
  z-index: -1;
  animation: round 3s linear infinite;
}
@media (max-width: 1200px) {
  .error_area .setting_icon {
    left: 0;
  }
}
@media (max-width: 576px) {
  .error_area .setting_icon {
    left: 0;
    width: 120px;
    top: 24px;
  }
}
.error_area h1 {
  font-size: 280px;
  font-weight: 800;
  font-family: var(--saas-Inter);
  color: var(--saas-purple);
  letter-spacing: -38px;
  margin-bottom: 0;
}
.error_area h1 span {
  color: #ff5f85;
  display: inline-block;
  position: relative;
}
@media (max-width: 576px) {
  .error_area h1 {
    font-size: 150px;
    letter-spacing: -28px;
    line-height: 1;
  }
}
.error_area h2 {
  font-size: 48px;
  color: #0f0e0e;
  margin-bottom: 25px;
  margin-bottom: 10px;
}
@media (max-width: 576px) {
  .error_area h2 {
    font-size: 32px;
  }
}
.error_area p {
  margin-bottom: 42px;
}

@keyframes round {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(180deg);
  }
}

/*---------------------------------------------------- */
/*----------------------------------------------------*/
.footer_area {
  padding-top: 120px;
}

.f_widget .f_title {
  font-size: 18px;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.6);
  font-family: var(--saas-Inter);
  margin-bottom: 25px;
}
.f_widget .f_title.f_title_dark {
  color: #1d2939;
}
.f_widget.f_about_widget {
  padding-right: 80px;
}
.f_widget.f_about_widget .f_logo {
  display: inline-block;
}
.f_widget.f_about_widget p {
  font-size: 16px;
  line-height: 26px;
  color: #a1a1aa;
}
.f_widget.f_about_widget .f_social_icon {
  margin-top: 30px;
}
.f_widget.f_about_widget .f_social_icon li {
  margin-right: 5px;
}
.f_widget.f_about_widget .f_social_icon li a {
  color: rgba(255, 255, 255, 0.6);
  width: 28px;
  height: 28px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s linear;
  font-size: 13px;
  background: #27272a;
}
.f_widget.f_about_widget .f_social_icon li a:hover {
  background: var(--saas-purple);
  color: #fff;
}
.f_widget .link_widget li {
  margin-bottom: 15px;
}
.f_widget .link_widget li a {
  color: rgba(255, 255, 255, 0.6);
  font-size: 16px;
  line-height: 26px;
  font-weight: 400;
  font-family: var(--saas-Inter);
  transition: all 0.2s linear;
}
.f_widget .link_widget li a:hover {
  color: var(--saas-purple);
}
.f_widget .link_widget.dark_link li a {
  color: #1d2939;
}
.f_widget .link_widget.dark_link li a:hover {
  color: var(--saas-purple);
}

.newsletter_form {
  position: relative;
}
.newsletter_form .form-control {
  font-size: 16px;
  font-weight: 400;
  border: 1px solid rgba(14, 21, 32, 0.25);
  background: #fff;
  border-radius: 45px;
  padding: 10px 25px;
  font-family: var(--saas-Inter);
  height: 56px;
}
.newsletter_form .form-control:focus {
  border-color: var(--saas-purple);
  box-shadow: none;
  outline: none;
}
.newsletter_form .theme_btn {
  font-size: 16px;
  font-weight: 600;
  border-radius: 45px;
  padding: 10px 25px;
  background: var(--saas-purple);
  font-family: var(--saas-Inter);
  border: 0px;
  color: #fff;
  transition: all 0.2s linear;
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
}
.newsletter_form .theme_btn:hover {
  background: var(--saas-gray-dark);
  color: #fff;
}
.newsletter_form.newsletter_form_two .form-control {
  background: #f8f9fc;
  border-radius: 5px;
}
.newsletter_form.newsletter_form_two .theme_btn {
  background: var(--saas-purple);
  position: relative;
  border-radius: 5px;
  padding: 15px 38px;
  margin-top: 12px;
}
.newsletter_form.newsletter_form_two .theme_btn:hover {
  background: #fff;
  color: #111;
}

.footer_bottom {
  border-top: 1px solid rgba(14, 21, 32, 0.1);
  padding: 28px 0px 20px;
  margin-top: 90px;
}
.footer_bottom p {
  font-size: 16px;
  line-height: 28px;
  color: #0e1520;
}

.f_social_icon li {
  display: inline-block;
}
.f_social_icon li:not(:last-child) {
  margin-right: 15px;
}
.f_social_icon li a {
  font-size: 16px;
  color: #0e1520;
  transition: all 0.2s linear;
}
.f_social_icon li a:hover {
  color: var(--saas-purple);
}

.footer_area_two {
  padding-top: 260px;
  overflow: hidden;
}
.footer_area_two .f_widget .f_title {
  letter-spacing: 3px;
  font-size: 13px;
}
.footer_area_two .footer_bottom {
  border-top-color: #3f3f46;
}
.footer_area_two .footer_bottom p {
  color: rgba(255, 255, 255, 0.6);
}

.footer_area_two img {
  margin-top: -30px;
}

.footer_shap {
  position: relative;
  z-index: 0;
}
.footer_shap:before {
  content: "";
  width: 1650px;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background: url(../img/home-three/f_shap.png) no-repeat left bottom/cover;
  z-index: -1;
}

.footer_area_three {
  padding-top: 110px;
  position: relative;
  overflow: hidden;
  z-index: 1;
}
.footer_area_three .f_widget.f_about_widget p,
.footer_area_three .footer_bottom p {
  color: #fff;
}
.footer_area_three .f_widget .link_widget li a {
  color: #fff;
}
.footer_area_three .f_widget .link_widget li a:hover {
  color: var(--saas-purple);
}

/*---------------------------------------------------- */ /*# sourceMappingURL=style.css.map */
/* Custom */
.saas_custom_about_area .fact_inner {
  grid-gap: 0px;
  padding-right: 0;
  margin-top: 30px;
  margin-bottom: 25px;
}
.saas_custom_about_area .fact_inner .skill_fact_item {
  border: 1px solid #ffffff;
  padding: 10px 20px;
  flex-direction: column;
  align-items: start;
}
.saas_custom_about_area .fact_inner .skill_fact_item .number {
  font-size: 35px;
}
.saas_custom_about_area .saas_about_content span {
  color: var(--saas-white);
  text-align: center;
  font-size: 20px;
  font-weight: 400;
  line-height: 1;
  display: inline-block;
  border-radius: 30px;
  border: 1px solid var(--saas-white);
  padding: 10px 25px;
  white-space: nowrap;
  margin-bottom: 25px;
}
.saas_custom_about_area .saas_about_content p {
  text-align: justify;
}
.testimonial_slider_two .item .text-content {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: stretch;
  flex: 1;
  gap: 10px;
  max-height: 100%;
}
.navbar .white-logo {
  display: inline-block;
}
.navbar .dark-logo {
  display: none;
}
/* .navbar.navbar_fixed .white-logo {
  display: none;
}
.navbar.navbar_fixed .dark-logo {
  display: inline-block;
} */
.service_tab_area .contact_info_item {
  margin-top: 0;
  margin-bottom: 20px;
}
.service_tab_area .contact_info_item .icon {
  background: none;
  width: unset;
  height: unset;
}
.service_tab_area .contact_info_item .contect_text p a {
  color: var(--saas-global-color);
}

.saas_about_area .fact_inner {
  justify-items: center;
  margin: 170px auto 0;
  max-width: 1300px;
  width: 100%;
  padding: 0;
}
/* .saas_about_area {
  position: relative;
  padding: 200px 0;

  z-index: 1;
}
.saas_about_area::before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background: url(../img/about_us_bg.webp) no-repeat bottom center / cover;
  z-index: -1;
} */
/* .service_item .icon {
  transition: 0.5s;
}
.service_item .icon svg:hover .icon svg {
  transition: 0.5s;
} */
.roadmap_area {
  background:
    linear-gradient(360deg, rgba(255, 255, 255, 0) 0%, rgba(0, 0, 0, 1) 100%),
    url("/assets/img/home-one/roadmap-gradient.png");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.methodology-image-wrapper,
.roadmap-image-wrapper {
  width: 100%;
  margin: 0;
  padding: 0;
  /* background: linear-gradient(135deg, #1e3c72 0%, #2a5298 50%, #7e22ce 100%); */
}

.methodology-full-width,
.roadmap-full-width {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
  max-width: 100%;
}
.methodology-full-width {
  padding-bottom: 100px;
}
.roadmap_area .service_tab_content {
  background: #191919;
}
/* .roadmap-image-wrapper {
  min-height: 400px;
} */

.service_tab_area .container-fluid {
  max-width: 100%;
  padding: 0;
}
.saas_banner_area {
  position: relative;
  overflow: hidden;
  /* Keep all your existing padding and styles */
}

.saas_banner_img {
  position: relative;
}

.saas_banner_img_container {
  position: relative;
  margin-bottom: -886px; /* Move mascot down so body extends below section */
  /* Adjust this value to control where the cut-off happens */
}

.saas_banner_img_container img {
  max-width: 100%;
  height: auto;
  display: block;
  max-width: 1038px;
}
.custom_saas_btn_office {
  background: none;
  color: #fff;
  border: 2px solid #fff;
  box-shadow: none;
}
.custom_saas_btn_office:hover {
  color: #fff;
}
.service_tab_item ul li::marker {
  color: #fff !important;
}
.saas_features_img_ava .img_small {
  top: 170px;
}
@keyframes float {
  0% {
    box-shadow: 0 5px 15px 0px rgba(0, 0, 0, 0.6);
    transform: scaleX(-1) translateY(0px);
  }
  50% {
    box-shadow: 0 25px 15px 0px rgba(0, 0, 0, 0.2);
    transform: scaleX(-1) translateY(-20px);
  }
  100% {
    box-shadow: 0 5px 15px 0px rgba(0, 0, 0, 0.6);
    transform: scaleX(-1) translateY(0px);
  }
}
/* Career Page */
.saas_breadcrumb_area_career {
  /* padding: 290px 0px 120px; */
  /* padding-top: 300px;
  padding-bottom: 150px; */
  padding-top: 380px;
  padding-bottom: 450px;
  /* background: url(/assets/img/career_breadcrumb_bg.webp) 100% 100% no-repeat; */
  background-size: cover;
}
.saas_breadcrumb_area_career::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}

.saas_breadcrumb_area_career h1 {
  font-size: 55px;
  margin-bottom: 0px;
}

.saas_breadcrumb_area_career .saas_breadcrumb_text .tags {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 15px;
}
.saas_breadcrumb_area_career .saas_breadcrumb_text .tags p {
  margin-bottom: 0;
}
.legality_section_contents ul li {
  color: var(--saas-white);
  margin-bottom: 10px;
}
.legality-link {
  color: var(--saas-purple);
  text-decoration: underline;
}
.saas_breadcrumb_area_career .saas_breadcrumb_text .tags span {
  color: var(--saas-white);
  font-family: var(--saas-Inter);
  font-size: 24px;
  font-weight: 400;
  display: inline-block;
  margin-bottom: 10px;
}
/*=====================================
 45. Home5 Testimonial Section
========================================*/
.home5-testimonial-section {
  position: relative;
  overflow: hidden;
}
.home5-testimonial-section .testimonial-card5 .author-img {
  height: 100%;
}
.home5-testimonial-section .testimonial-card5 .author-img img {
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}
.home5-testimonial-section .testimonial-card5 .testimonial-content-wrap {
  background-color: #191919;
  height: 100%;
}
.home5-testimonial-section
  .testimonial-card5
  .testimonial-content-wrap
  .testimonal-content {
  padding: 100px 120px 240px 90px;
}
@media (max-width: 1499px) {
  .home5-testimonial-section
    .testimonial-card5
    .testimonial-content-wrap
    .testimonal-content {
    padding: 80px 70px 220px 50px;
  }
}
@media (max-width: 1199px) {
  .home5-testimonial-section
    .testimonial-card5
    .testimonial-content-wrap
    .testimonal-content {
    padding: 80px 20px 180px 20px;
  }
}
@media (max-width: 991px) {
  .home5-testimonial-section
    .testimonial-card5
    .testimonial-content-wrap
    .testimonal-content {
    padding: 70px 20px 70px 20px;
  }
}
.home5-testimonial-section
  .testimonial-card5
  .testimonial-content-wrap
  .testimonal-content
  > span {
  color: var(--saas-white);
  font-family: var(--saas-Inter);
  font-size: 16px;
  font-weight: 500;
  display: inline-block;
  margin-bottom: 15px;
}
.home5-testimonial-section
  .testimonial-card5
  .testimonial-content-wrap
  .testimonal-content
  p {
  color: var(--saas-white);
  font-family: var(--saas-Inter);
  font-size: 30px;
  font-weight: 400;
  line-height: 1.3;
  margin-bottom: 30px;
}
@media (max-width: 991px) {
  .home5-testimonial-section
    .testimonial-card5
    .testimonial-content-wrap
    .testimonal-content
    p {
    font-size: 24px;
  }
}
.home5-testimonial-section
  .testimonial-card5
  .testimonial-content-wrap
  .testimonal-content
  .author-area
  .content {
  line-height: 1;
}
.home5-testimonial-section
  .testimonial-card5
  .testimonial-content-wrap
  .testimonal-content
  .author-area
  .content
  h6 {
  color: var(--saas-white);
  font-family: var(--saas-Inter);
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 7px;
}
.home5-testimonial-section
  .testimonial-card5
  .testimonial-content-wrap
  .testimonal-content
  .author-area
  .content
  span {
  color: #b0babe;
  font-family: var(--saas-Inter);
  font-size: 14px;
  font-weight: 500;
}
.home5-testimonial-section .slider-btn-area {
  position: absolute;
  bottom: -3px;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  z-index: 9;
  width: 100%;
  padding-right: 20px;
  background-color: var(--saas-global-color);
  -webkit-clip-path: polygon(8% 0%, 100% 0%, 100% 100%, 0% 100%);
  clip-path: polygon(8% 0%, 100% 0%, 100% 100%, 0% 100%);
  height: 140px;
  padding-left: 120px;
  padding-right: 120px;
}
@media (max-width: 1499px) {
  .home5-testimonial-section .slider-btn-area {
    padding-left: 70px;
    padding-right: 70px;
  }
}
@media (max-width: 1199px) {
  .home5-testimonial-section .slider-btn-area {
    padding-left: 40px;
    padding-right: 40px;
    height: 80px;
    -webkit-clip-path: polygon(5% 0%, 100% 0%, 100% 100%, 0% 100%);
    clip-path: polygon(5% 0%, 100% 0%, 100% 100%, 0% 100%);
  }
}
.home5-testimonial-section .slider-btn-area .franctional-pagi5 {
  color: var(--saas-description);
  font-family: var(--saas-Inter);
  font-size: 24px;
  font-weight: 400;
}
@media (max-width: 576px) {
  .home5-testimonial-section .slider-btn-area .franctional-pagi5 {
    top: unset;
    position: relative;
    right: unset;
    display: flex;
  }
}
.home5-testimonial-section
  .slider-btn-area
  .franctional-pagi5
  .swiper-pagination-current {
  color: var(--saas-white);
  font-family: var(--saas-Inter);
  font-size: 24px;
  font-weight: 400;
}
.home5-testimonial-section
  .slider-btn-area
  .franctional-pagi5
  .swiper-pagination-total {
  color: var(--saas-description);
  font-family: var(--saas-Inter);
  font-size: 16px;
  font-weight: 400;
}
.slider-btn-group {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.slider-btn-group .slider-btn {
  height: 40px;
  width: 40px;
  background-color: var(--saas-global-color);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: 0.4s;
  cursor: pointer;
  border: 1px solid var(--saas-white);
}
.slider-btn-group .slider-btn svg {
  fill: var(--saas-white);
  transition: 0.4s;
}
.slider-btn-group .slider-btn:hover {
  background-color: var(--saas-purple);
  border-color: var(--saas-purple);
}
.slider-btn-group .slider-btn:hover svg {
  fill: var(--saas-white);
}
.slider-btn-group .slider-btn.swiper-button-disabled {
  opacity: 0.2;
}
.slider-btn-group.w-100 {
  max-width: 100px;
  min-width: 100px;
  width: 100%;
}

/*=====================================
 61. Career Page
========================================*/
.career-page {
  padding: 100px 0;
}
.career-page .section-title1 h2 {
  padding-top: 0;
  max-width: 735px;
}
.career-page .position-apply-area {
  display: flex;
  gap: 20px;
}
.career-page .position-apply-area .icon svg {
  fill: var(--saas-purple);
}
.career-page .position-apply-area .content {
  margin-top: -10px;
}
.career-page .position-apply-area .content p {
  color: var(--saas-description);
  font-family: var(--saas-Inter);
  font-size: 16px;
  font-weight: 400;
  line-height: 1.7;
  margin-bottom: 20px;
}
.career-page .position-apply-area .content a {
  color: var(--saas-purple);
  font-family: var(--saas-Inter);
  font-size: 15px;
  font-weight: 500;
  transition: 0.35s;
  display: flex;
  align-items: center;
  gap: 8px;
}
.career-page .position-apply-area .content a svg {
  transition: 0.35s;
  fill: var(--saas-purple);
}
.career-page .position-apply-area .content a:hover {
  color: var(--saas-white);
}
.career-page .position-apply-area .content a:hover svg {
  fill: var(--saas-white);
  transform: rotate(45deg);
}
.career-page .career-img a img {
  min-height: 320px;
  -o-object-fit: cover;
  object-fit: cover;
  width: 100%;
  height: auto;
}
.career-page .event-img-slider {
  position: relative;
}
.career-page .event-img-slider .event-pagination {
  width: unset;
  display: inline-flex;
  justify-content: center;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 30px;
  z-index: 99;
}
.career-page .event-img-slider .event-pagination .swiper-pagination-bullet {
  height: 10px;
  width: 10px;
  opacity: 1;
  background-color: rgba(255, 255, 255, 0.5);
}
.career-page
  .event-img-slider
  .event-pagination
  .swiper-pagination-bullet.swiper-pagination-bullet-active {
  background-color: #fff;
}
.career-page .review-and-counter-area {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid #eee;
}
@media (min-width: 1200px) and (max-width: 1399px) {
  .career-page .review-and-counter-area {
    gap: 50px;
  }
}
@media (max-width: 1199px) {
  .career-page .review-and-counter-area {
    flex-direction: column;
    padding-top: 40px;
  }
}
.career-page .review-and-counter-area .counter-wrap {
  display: flex;
  align-items: center;
  justify-content: space-between;
  max-width: 100%;
  width: 100%;
}
@media (max-width: 1199px) {
  .career-page .review-and-counter-area .counter-wrap {
    border-top: 1px solid #eee;
    width: 100%;
    margin-top: 40px;
  }
}
@media (max-width: 767px) {
  .career-page .review-and-counter-area .counter-wrap {
    flex-wrap: wrap;
    justify-content: center;
  }
}
.career-page .review-and-counter-area .counter-wrap .single-counter {
  display: flex;
  gap: 30px;
  width: 33.33%;
  border-right: 1px solid #eee;
  padding: 30px 45px;
}
@media (max-width: 1399px) {
  .career-page .review-and-counter-area .counter-wrap .single-counter {
    padding: 30px 20px;
  }
}
@media (max-width: 1199px) {
  .career-page .review-and-counter-area .counter-wrap .single-counter {
    padding: 30px 20px;
  }
}
@media (max-width: 767px) {
  .career-page .review-and-counter-area .counter-wrap .single-counter {
    width: 50%;
    border: none;
  }
}
@media (max-width: 576px) {
  .career-page .review-and-counter-area .counter-wrap .single-counter {
    width: 100%;
    border: none;
  }
}
.career-page
  .review-and-counter-area
  .counter-wrap
  .single-counter:first-child {
  padding-left: 0;
}
@media (max-width: 576px) {
  .career-page
    .review-and-counter-area
    .counter-wrap
    .single-counter:first-child {
    padding: 30px 20px;
  }
}
.career-page .review-and-counter-area .counter-wrap .single-counter:last-child {
  padding-right: 0;
  border: none;
}
@media (max-width: 576px) {
  .career-page
    .review-and-counter-area
    .counter-wrap
    .single-counter:last-child {
    padding: 30px 20px;
  }
}
.career-page .review-and-counter-area .counter-wrap .single-counter .icon svg {
  fill: var(--saas-white);
}
.career-page .review-and-counter-area .counter-wrap .single-counter .content {
  margin-top: -4px;
}
.career-page
  .review-and-counter-area
  .counter-wrap
  .single-counter
  .content
  .number {
  display: flex;
  align-items: center;
  line-height: 1;
  margin-bottom: 13px;
}
.career-page
  .review-and-counter-area
  .counter-wrap
  .single-counter
  .content
  .number
  h2 {
  margin-bottom: 0;
  color: var(--saas-white);
  font-family: var(--saas-Inter);
  font-size: 40px;
  font-weight: 600;
  line-height: 1;
}
.career-page
  .review-and-counter-area
  .counter-wrap
  .single-counter
  .content
  .number
  > span {
  color: var(--saas-white);
  font-family: var(--saas-Inter);
  font-size: 40px;
  font-weight: 600;
  line-height: 1;
}
.career-page .review-and-counter-area .counter-wrap .single-counter .content p {
  color: var(--saas-description);
  font-family: var(--saas-Inter);
  font-size: 15px;
  font-weight: 500;
}

.fact-and-benefits-section .section-title1 {
  gap: 0;
  justify-content: center;
  align-items: center;
  max-width: 500px;
  width: 100%;
}
.fact-and-benefits-section .section-title1 h2 {
  margin-bottom: 15px;
}

.job-post-section {
  background-color: #000000;
  padding: 130px 0;
}
.job-post-section .section-title1 {
  gap: 0;
  max-width: 700px;
  width: 100%;
}
.job-post-section .section-title1 h2 {
  margin-bottom: 15px;
  padding-top: 0;
}

.job-post-section .single-job-card {
  padding: 50px;
  background-color: #191919;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 25px;
  border-radius: 20px;
  height: -webkit-fill-available;
}

.job-post-section .saas_btn {
  padding: 10px 25px;
  font-size: 16px;
}
@media (max-width: 991px) {
  .job-post-section .single-job-card {
    flex-wrap: wrap;
  }
}
@media (max-width: 576px) {
  .job-post-section .single-job-card {
    padding: 30px 20px;
  }
}
.job-post-section .single-job-card .job-list-content {
  display: flex;
  align-items: center;
  gap: 20px;
  max-width: 780px;
  width: 100%;
}
@media (max-width: 767px) {
  .job-post-section .single-job-card .job-list-content {
    flex-wrap: wrap;
  }
}
.job-post-section .single-job-card .job-list-content .post-name {
  line-height: 1;
  /* max-width: 300px; */
  width: 100%;
}
.job-post-section .single-job-card .job-list-content .post-name h4 {
  color: var(--saas-white);
  font-family: var(--saas-Inter);
  font-size: 24px;
  font-weight: 400;
  margin-bottom: 9px;
}
.job-post-section .single-job-card .job-list-content .post-name span {
  color: var(--saas-description);
  font-family: var(--saas-Inter);
  font-size: 16px;
  font-weight: 500;
}
.job-post-section .single-job-card .job-list-content .job-discription ul {
  width: 500px;
  -moz-columns: 2;
  columns: 2;
  -moz-column-gap: 40px;
  column-gap: 40px;
  list-style: none;
  padding-left: 0;
}
@media (max-width: 1199px) {
  .job-post-section .single-job-card .job-list-content .job-discription ul {
    -moz-columns: 1;
    columns: 1;
    width: 300px;
  }
}
.job-post-section .single-job-card .job-list-content .job-discription ul li {
  color: var(--saas-white);
  font-family: var(--saas-Inter);
  font-size: 15px;
  font-weight: 500;
  position: relative;
  padding-left: 18px;
  margin-bottom: 10px;
}
.job-post-section
  .single-job-card
  .job-list-content
  .job-discription
  ul
  li::before {
  content: "";
  height: 8px;
  width: 8px;
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, 0.5);
  position: absolute;
  left: 0;
  top: 6px;
}
.job-post-section
  .single-job-card
  .job-list-content
  .job-discription
  ul
  li
  span {
  color: var(--saas-description);
  padding-right: 5px;
}

/*=====================================
 57.Event Page
========================================*/
.event-details-page .section-title1 {
  border-bottom: 1px solid #eee;
  padding-bottom: 25px;
  margin-bottom: 25px;
}
.event-details-page .section-title1 h2 {
  max-width: 100%;
  padding-top: 0;
}
.event-details-page .section-title1.two {
  border-bottom: none;
  margin-bottom: 0;
  padding-bottom: 15px;
  padding-top: 100px;
}
.event-details-page .event-info {
  -moz-columns: 2;
  columns: 2;
}
@media (max-width: 767px) {
  .event-details-page .event-info {
    -moz-columns: 1;
    columns: 1;
  }
}
.event-details-page .event-info li {
  color: var(--saas-description);
  font-family: var(--saas-Inter);
  font-size: 16px;
  font-weight: 500;
  margin-bottom: 7px;
  display: flex;
  gap: 15px;
}
.event-details-page .event-info li strong {
  color: var(--saas-white);
  font-weight: 600;
}
.event-details-page .event-img-slider {
  position: relative;
}
.event-details-page .event-img-slider .event-img a img {
  min-height: 320px;
  -o-object-fit: cover;
  object-fit: cover;
}
.event-details-page .event-img-slider .event-pagination {
  width: unset;
  display: inline-flex;
  justify-content: center;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 30px;
  z-index: 99;
}
.event-details-page
  .event-img-slider
  .event-pagination
  .swiper-pagination-bullet {
  height: 10px;
  width: 10px;
  opacity: 1;
  background-color: rgba(255, 255, 255, 0.5);
}
.event-details-page
  .event-img-slider
  .event-pagination
  .swiper-pagination-bullet.swiper-pagination-bullet-active {
  background-color: #fff;
}
.event-details-page .pic-cap-and-sicial {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 50px;
}
.event-details-page .pic-cap-and-sicial .pic-cap {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  color: var(--saas-description);
  font-family: var(--saas-Inter);
  font-size: 14px;
  font-weight: 500;
  line-height: 1;
}
.event-details-page .pic-cap-and-sicial .pic-cap svg {
  fill: var(--saas-description);
}
.event-details-page .pic-cap-and-sicial .social-link {
  gap: 10px;
}
.event-details-page .pic-cap-and-sicial .social-link li a {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  border: 1px solid #eee;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: 0.35s;
}
.event-details-page .pic-cap-and-sicial .social-link li a i {
  transition: 0.35s;
  color: var(--saas-purple);
}
.event-details-page .pic-cap-and-sicial .social-link li a:hover {
  background-color: var(--saas-purple);
  border-color: var(--saas-purple);
}
.event-details-page .pic-cap-and-sicial .social-link li a:hover i {
  color: var(--saas-white);
}
.event-details-page h3 {
  color: var(--saas-white);
  font-family: var(--saas-Inter);
  font-size: 30px;
  font-weight: 400;
}
.event-details-page p {
  color: var(--saas-description);
  font-family: var(--saas-Inter);
  font-size: 16px;
  font-weight: 400;
  line-height: 30px;
  margin-bottom: 10px;
}
.event-details-page .event-fetures {
  padding-left: 30px;
  position: relative;
}
@media (max-width: 576px) {
  .event-details-page .event-fetures {
    padding-left: 20px;
  }
}
.event-details-page .event-fetures::before {
  height: 10px;
  width: 10px;
  border-radius: 50%;
  background-color: var(--saas-purple);
  content: "";
  position: absolute;
  left: 0;
  top: 4px;
}
.event-details-page .event-fetures h6 {
  color: var(--saas-white);
  font-family: var(--saas-Inter);
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 10px;
}
.event-details-page .event-fetures .feature-list {
  padding-top: 10px;
  padding-left: 1.5rem;
}
.event-details-page .event-fetures .feature-list li {
  color: var(--saas-description);
  font-family: var(--saas-Inter);
  font-size: 15px;
  font-weight: 500;
  list-style: decimal;
  margin-bottom: 12px;
}
.event-details-page .event-fetures .feature-list li:last-child {
  margin-bottom: 0;
}
.event-details-page .event-fetures.two::before {
  display: none;
  visibility: hidden;
}
.event-details-page .event-fetures.two .meal-list {
  display: flex;
  align-items: baseline;
  gap: 20px;
}
.event-details-page .event-fetures.two .meal-list li {
  color: var(--saas-description);
  font-family: var(--saas-Inter);
  font-size: 15px;
  font-weight: 500;
}

.event-sidebar .event-speakers-area .single-speakers {
  border: 1px solid #eee;
  border-bottom: unset;
  padding: 10px;
}
.event-sidebar .event-speakers-area .single-speakers .speakers-content {
  padding: 20px;
}
.event-sidebar .event-speakers-area .single-speakers .speakers-content h5 {
  margin-bottom: 0;
}
.event-sidebar .event-speakers-area .single-speakers .speakers-content h5 a {
  color: var(--saas-white);
  text-align: center;
  font-family: var(--saas-Inter);
  font-size: 20px;
  font-weight: 400;
  transition: 0.35s;
}
.event-sidebar
  .event-speakers-area
  .single-speakers
  .speakers-content
  h5
  a:hover {
  color: var(--saas-purple);
}
.event-sidebar .event-speakers-area .single-speakers .speakers-content span {
  color: var(--saas-description);
  text-align: center;
  font-family: var(--saas-Inter);
  font-size: 14px;
  font-weight: 400;
}
.event-sidebar
  .event-speakers-area
  .single-speakers
  .speakers-content
  .social-link {
  justify-content: center;
  gap: 10px;
  padding-top: 15px;
}
.event-sidebar
  .event-speakers-area
  .single-speakers
  .speakers-content
  .social-link
  li
  a {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  border: 1px solid #eee;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: 0.35s;
}
.event-sidebar
  .event-speakers-area
  .single-speakers
  .speakers-content
  .social-link
  li
  a
  i {
  transition: 0.35s;
  color: var(--saas-purple);
}
.event-sidebar
  .event-speakers-area
  .single-speakers
  .speakers-content
  .social-link
  li
  a:hover {
  background-color: var(--saas-purple);
  border-color: var(--saas-purple);
}
.event-sidebar
  .event-speakers-area
  .single-speakers
  .speakers-content
  .social-link
  li
  a:hover
  i {
  color: var(--saas-white);
}
.event-sidebar .event-speakers-area .slider-btn-group {
  background-color: #f4f9fd;
  padding: 25px 20px;
}
.event-sidebar
  .event-speakers-area
  .slider-btn-group
  .event-fractional-pagination {
  position: relative;
  right: unset;
  bottom: unset;
  left: unset;
  top: unset;
  width: unset;
  color: var(--saas-white);
  font-family: var(--saas-Inter);
  font-size: 24px;
  font-weight: 400;
}
@media (max-width: 576px) {
  .event-sidebar
    .event-speakers-area
    .slider-btn-group
    .event-fractional-pagination {
    top: unset;
    position: relative;
    right: unset;
    display: flex;
  }
}
.event-sidebar
  .event-speakers-area
  .slider-btn-group
  .event-fractional-pagination
  .swiper-pagination-current {
  color: var(--saas-white);
  font-family: var(--saas-Inter);
  font-size: 24px;
  font-weight: 400;
}
.event-sidebar
  .event-speakers-area
  .slider-btn-group
  .event-fractional-pagination
  .swiper-pagination-total {
  color: var(--saas-description);
  font-family: var(--saas-Inter);
  font-size: 16px;
  font-weight: 400;
}
.event-sidebar .register-btn a {
  width: 100%;
  justify-content: center;
}
.event-sidebar .event-location-map iframe {
  width: 100%;
  min-height: 390px;
}
.event-sidebar .single-widgets {
  border: 1px solid #eee;
  padding: 45px 30px;
}
.event-sidebar .single-widgets .widget-title {
  line-height: 1;
  margin-bottom: 25px;
}
.event-sidebar .single-widgets .widget-title h4 {
  color: var(--saas-white);
  font-family: var(--saas-Inter);
  font-size: 25px;
  font-weight: 400;
  margin-bottom: 0;
}
.event-sidebar .single-widgets .widget-cnt {
  display: flex;
  align-items: center;
  gap: 20px;
  margin-bottom: 30px;
}
.event-sidebar .single-widgets .widget-cnt:last-child {
  margin-bottom: 0;
}
.event-sidebar .single-widgets .widget-cnt .wi a img {
  max-width: 86px;
  min-width: 86px;
  height: 86px;
  -o-object-fit: cover;
  object-fit: cover;
}
.event-sidebar .single-widgets .widget-cnt .wc > a {
  color: var(--saas-description);
  font-family: var(--saas-Inter);
  font-size: 14px;
  font-weight: 500;
  margin-bottom: 10px;
  display: inline-block;
  line-height: 1;
  transition: 0.35s;
}
@media (max-width: 1199px) {
  .event-sidebar .single-widgets .widget-cnt .wc > a {
    font-size: 12px;
  }
}
.event-sidebar .single-widgets .widget-cnt .wc > a:hover {
  color: var(--saas-purple);
}
.event-sidebar .single-widgets .widget-cnt .wc h5 {
  margin-bottom: 0;
}
.event-sidebar .single-widgets .widget-cnt .wc h5 a {
  color: var(--saas-white);
  font-family: var(--saas-Inter);
  font-size: 18px;
  font-weight: 400;
  transition: 0.35s;
}
@media (max-width: 1199px) {
  .event-sidebar .single-widgets .widget-cnt .wc h5 a {
    font-size: 16px;
  }
}
.event-sidebar .single-widgets .widget-cnt .wc h5 a:hover {
  color: var(--saas-purple);
}
.event-sidebar .sponsore-section {
  background-color: #f4f9fd;
  padding: 50px 30px;
}
.event-sidebar .sponsore-section .widget-title {
  margin-bottom: 27px;
}
.event-sidebar .sponsore-section .widget-title h4 {
  color: var(--saas-white);
  font-family: var(--saas-Inter);
  font-size: 25px;
  font-weight: 400;
}
.event-sidebar .sponsore-section .sponser-category h6 {
  color: var(--saas-white);
  font-family: var(--saas-Inter);
  font-size: 18px;
  font-weight: 500;
  margin-bottom: 20px;
  border-bottom: 1px solid #eee;
  padding-bottom: 13px;
}
.event-sidebar .sponsore-section .sponser-category h6 strong {
  font-weight: 700;
}
.event-sidebar .sponsore-section .sponser-category .sponser-list a {
  height: 54px;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #fff;
  padding: 5px 10px;
}

.event-card {
  position: relative;
}
.event-card .event-img img {
  min-height: 350px;
  -o-object-fit: cover;
  object-fit: cover;
}
.event-card .event-content {
  background: linear-gradient(
    73deg,
    rgba(13, 23, 32, 0.8) 0%,
    rgba(13, 23, 32, 0.1) 60.4%
  );
  padding: 30px;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: end;
}
@media (max-width: 576px) {
  .event-card .event-content {
    padding: 30px 20px;
  }
}
.event-card .event-content h6 {
  font-size: 16px;
  font-family: var(--saas-Inter);
  color: var(--saas-white);
  margin-bottom: 7px;
  font-weight: 400;
}
.event-card .event-content h4 {
  font-size: 28px;
  font-family: var(--saas-Inter);
  color: var(--saas-white);
  margin-bottom: 10px;
  font-weight: 400;
}
@media (max-width: 576px) {
  .event-card .event-content h4 {
    font-size: 24px;
  }
}
.event-card .event-content ul {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 7px;
  margin-bottom: 25px;
}
.event-card .event-content ul li {
  padding-right: 10px;
}
.event-card .event-content ul li a {
  color: var(--saas-white);
  font-size: 15px;
  font-weight: 400;
  display: flex;
  align-items: baseline;
  gap: 7px;
}
.event-card .event-content ul li a svg {
  fill: var(--saas-white);
}
/*=====================================
 08. Case Study Section
========================================*/
.single-scroll-container {
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  padding-top: 100px;
  padding-bottom: 100px;
}
.single-scroll-container .horizontal-scrolling-content {
  max-width: 750px;
  width: 100%;
}
.single-scroll-container .horizontal-scrolling-content p {
  color: var(--saas-white);
  font-family: var(--font-montserrat);
  font-size: 16px;
  font-weight: 400;
  line-height: 30px;
  margin-bottom: 130px;
}
.single-scroll-container .horizontal-scrolling-content .section-title1 {
  margin-bottom: 10px;
}
.single-scroll-container .horizontal-scrolling-content .section-title1 span {
  color: var(--saas-white);
  border-color: var(--saas-white);
}
.single-scroll-container .horizontal-scrolling-content .section-title1 h2 {
  color: var(--saas-white);
  margin-bottom: 0;
}
.single-scroll-container .horizontal-scrolling-content.two {
  display: flex;
  flex-direction: column;
  justify-content: space-evenly;
  gap: 30px;
  padding: 80px 0px;
  height: 100%;
}
@media (max-width: 767px) {
  .single-scroll-container .horizontal-scrolling-content.two {
    gap: 100px;
  }
}
@media (max-width: 576px) {
  .single-scroll-container .horizontal-scrolling-content.two {
    gap: 70px;
  }
}
.single-scroll-container .horizontal-scrolling-content.two .name-degi {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  padding-top: 15px;
}
.single-scroll-container .horizontal-scrolling-content.two .name-degi h5 {
  color: var(--saas-white);
  font-family: var(--saas-Inter);
  font-size: 20px;
  font-weight: 400;
  margin-bottom: 0;
}
.single-scroll-container .horizontal-scrolling-content.two .name-degi span {
  color: #cacaca;
  font-family: var(--font-montserrat);
  font-size: 15px;
  font-weight: 500;
}
.single-scroll-container
  .horizontal-scrolling-content.two
  .horizental-scrolling-bottom-content
  .consulting {
  display: flex;
  align-items: center;
  gap: 20px;
  position: relative;
  /* padding-bottom: 25px;
  margin-bottom: 30px; */
}
/* .single-scroll-container
  .horizontal-scrolling-content.two
  .horizental-scrolling-bottom-content
  .consulting::after {
  content: "";
  height: 1px;
  width: 100%;
  background: linear-gradient(90deg, #d9d9d9 0%, rgba(217, 217, 217, 0) 100%);
  position: absolute;
  left: 0;
  bottom: 0;
} */
.single-scroll-container
  .horizontal-scrolling-content.two
  .horizental-scrolling-bottom-content
  .consulting
  svg {
  fill: var(--saas-white);
}
.single-scroll-container
  .horizontal-scrolling-content.two
  .horizental-scrolling-bottom-content
  .consulting
  p {
  margin-bottom: 0;
  max-width: 280px;
  width: 100%;
  line-height: 25px;
}
.single-scroll-container
  .horizontal-scrolling-content.two
  .horizental-scrolling-bottom-content
  .features {
  display: flex;
  align-items: center;
  gap: 30px;
  flex-wrap: wrap;
}
@media (max-width: 1399px) {
  .single-scroll-container
    .horizontal-scrolling-content.two
    .horizental-scrolling-bottom-content
    .features {
    gap: 20px;
  }
}
.single-scroll-container
  .horizontal-scrolling-content.two
  .horizental-scrolling-bottom-content
  .features
  li {
  line-height: 1;
  color: var(--saas-white);
  text-align: center;
  font-family: Montserrat;
  font-size: 15px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  border-radius: 16px;
  border: 1px solid #fff;
  padding: 5px 20px;
  background-color: var(--saas-white);
}
@media (min-width: 1400px) and (max-width: 1599px) {
  .single-scroll-container.two {
    background-position: 70%;
  }
}
@media (max-width: 1399px) {
  .single-scroll-container.two {
    background-position: 70%;
  }
}
@media (max-width: 1199px) {
  .single-scroll-container.two {
    background-position: 80%;
  }
}
@media (max-width: 576px) {
  .single-scroll-container.two {
    background-position: 74%;
  }
}
.single-scroll-container.three {
  width: 100%;
  min-height: 630px;
  position: relative;
}
@media (max-width: 767px) {
  .single-scroll-container.three {
    min-height: unset;
  }
}
.single-scroll-container.three .horizontal-scrolling-content {
  width: 100%;
  max-width: uns;
}
.single-scroll-container.three .horizontal-scrolling-content .section-title1 {
  max-width: 444px;
  width: 100%;
  display: block;
  margin-bottom: 50px;
}
.single-scroll-container.three
  .horizontal-scrolling-content
  .section-title1
  h6 {
  margin-bottom: 7px;
  color: var(--saas-white);
  font-family: var(--saas-Inter);
  font-size: 18px;
  font-weight: 400;
}
.single-scroll-container.three
  .horizontal-scrolling-content
  .section-title1
  ul {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  padding-top: 18px;
}
.single-scroll-container.three
  .horizontal-scrolling-content
  .section-title1
  ul
  li {
  line-height: 1;
  padding-right: 20px;
}
.single-scroll-container.three
  .horizontal-scrolling-content
  .section-title1
  ul
  li:last-child {
  padding-right: 0;
}
.single-scroll-container.three
  .horizontal-scrolling-content
  .section-title1
  ul
  li
  a {
  color: var(--saas-white);
  font-family: var(--font-montserrat);
  font-size: 14px;
  font-weight: 500;
  display: flex;
  align-items: baseline;
  gap: 8px;
}
.single-scroll-container.three
  .horizontal-scrolling-content
  .section-title1
  ul
  li
  a
  svg {
  fill: var(--saas-white);
}
.single-scroll-container.three .content-right {
  position: absolute;
  bottom: 100px;
  right: 90px;
  max-width: 444px;
  width: 100%;
  display: flex;
  align-items: start;
  gap: 20px;
}
@media (max-width: 1399px) {
  .single-scroll-container.three .content-right {
    max-width: 400px;
  }
}
@media (max-width: 767px) {
  .single-scroll-container.three .content-right {
    position: relative;
    right: unset;
    bottom: unset;
    padding-top: 70px;
  }
}
.single-scroll-container.three .content-right .icon svg {
  fill: var(--saas-white);
}
.single-scroll-container.three .content-right .content {
  margin-top: -7px;
}
.single-scroll-container.three .content-right .content p {
  color: var(--saas-white);
  font-family: var(--saas-Inter);
  font-size: 20px;
  font-weight: 400;
  line-height: 30px;
  margin-bottom: 0;
}
.blog-sidebar .single-widgets {
  border: 1px solid #eee;
  padding: 45px 30px;
}
.blog-sidebar .single-widgets.widget_search {
  border: none;
  padding: 0;
}
.blog-sidebar .single-widgets.widget_search .wp-block-search__inside-wrapper {
  display: flex;
  align-items: center;
}
.blog-sidebar
  .single-widgets.widget_search
  .wp-block-search__inside-wrapper
  input {
  background-color: var(--saas-white);
  height: 56px;
  color: var(--sass-description);
  font-family: var(--font-montserrat);
  font-size: 16px;
  font-weight: 400;
  border: none;
  outline: none;
  width: 100%;
  padding: 10px 30px;
  border-radius: unset;
}
.blog-sidebar
  .single-widgets.widget_search
  .wp-block-search__inside-wrapper
  button {
  min-width: 68px;
  max-width: 68px;
  height: 56px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
  outline: none;
  background-color: var(--saas-purple);
  border-radius: 8px;
}
.blog-sidebar
  .single-widgets.widget_search
  .wp-block-search__inside-wrapper
  button
  svg {
  fill: var(--saas-white);
}
.blog-sidebar .single-widgets .widget-title {
  line-height: 1;
  margin-bottom: 25px;
}
.blog-sidebar .single-widgets .widget-title h4 {
  color: var(--saas-white);
  font-family: var(--saas-Inter);
  font-size: 25px;
  font-weight: 400;
  margin-bottom: 0;
}
.blog-sidebar .single-widgets .wp-block-categoris-cloud {
  line-height: 1;
}
.blog-sidebar .single-widgets .wp-block-categoris-cloud li {
  line-height: 1;
  margin-bottom: 20px;
}
.blog-sidebar .single-widgets .wp-block-categoris-cloud li:last-child {
  margin-bottom: 0;
}
.blog-sidebar .single-widgets .wp-block-categoris-cloud li a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: var(--saas-white);
  font-family: var(--font-montserrat);
  font-size: 16px;
  font-weight: 500;
  transition: 0.35s;
}
.blog-sidebar .single-widgets .wp-block-categoris-cloud li a:hover {
  color: var(--primary-color);
}
.blog-sidebar .single-widgets .widget-cnt {
  display: flex;
  align-items: center;
  gap: 20px;
  margin-bottom: 30px;
}
.blog-sidebar .single-widgets .widget-cnt:last-child {
  margin-bottom: 0;
}
.blog-sidebar .single-widgets .widget-cnt .wi a img {
  max-width: 86px;
  min-width: 86px;
  height: 86px;
  -o-object-fit: cover;
  object-fit: cover;
}
.blog-sidebar .single-widgets .widget-cnt .wc > a {
  color: var(--sass-description);
  font-family: var(--font-montserrat);
  font-size: 14px;
  font-weight: 500;
  margin-bottom: 10px;
  display: inline-block;
  line-height: 1;
  transition: 0.35s;
}
@media (max-width: 1199px) {
  .blog-sidebar .single-widgets .widget-cnt .wc > a {
    font-size: 12px;
  }
}
.blog-sidebar .single-widgets .widget-cnt .wc > a:hover {
  color: var(--primary-color);
}
.blog-sidebar .single-widgets .widget-cnt .wc h5 {
  margin-bottom: 0;
}
.blog-sidebar .single-widgets .widget-cnt .wc h5 a {
  color: var(--saas-white);
  font-family: var(--saas-Inter);
  font-size: 18px;
  font-weight: 400;
  transition: 0.35s;
}
@media (max-width: 1199px) {
  .blog-sidebar .single-widgets .widget-cnt .wc h5 a {
    font-size: 16px;
  }
}
.blog-sidebar .single-widgets .widget-cnt .wc h5 a:hover {
  color: var(--primary-color);
}
.blog-sidebar .single-widgets .wp-block-tag-cloud {
  margin-bottom: 0;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 15px;
}
.blog-sidebar .single-widgets .wp-block-tag-cloud a {
  color: var(--sass-description);
  font-family: var(--font-montserrat);
  font-size: 16px;
  font-weight: 500;
  transition: 0.35s;
  line-height: 1;
}
.blog-sidebar .single-widgets .wp-block-tag-cloud a:hover {
  color: var(--primary-color);
}
.blog-sidebar
  .single-widgets.widget_search
  .wp-block-search__inside-wrapper
  select {
  background-color: #191919;
  height: 56px;
  color: var(--saas-description);
  font-family: var(--saas-Inter);
  font-size: 16px;
  font-weight: 400;
  border: none;
  outline: none;
  width: 100%;
  padding: 10px 30px;
  border-radius: 8px;
}
.blog-sidebar
  .single-widgets.widget_search
  .wp-block-search__inside-wrapper
  input {
  background-color: #191919;
  height: 56px;
  color: var(--saas-description);
  font-family: var(--saas-Inter);
  font-size: 16px;
  font-weight: 400;
  border: none;
  outline: none;
  width: 100%;
  padding: 10px 30px;
  border-radius: 8px;
}
.clearable-input {
  position: relative;
  width: 100%;
}
.clearable-input .clear-btn {
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  background: none !important;
  border: none;
  font-size: 18px;
  color: #999;
  cursor: pointer;
  display: none;
  line-height: 1;
}
.job-post-section input,
.job-post-section input:-webkit-autofill,
.job-post-section input:-webkit-autofill:hover,
.job-post-section input:-webkit-autofill:focus {
  background-color: #191919 !important;

  /* force full background override */
  -webkit-box-shadow: 0 0 0 1000px #191919 inset !important;
  box-shadow: 0 0 0 1000px #191919 inset !important;

  /* removes the white edges */
  border-radius: 10px; /* match your input’s border radius */
  border: none !important;

  /* text color */
  -webkit-text-fill-color: #ffffff !important;
  color: #ffffff !important;
  outline: none !important;
}

.widget_search .search-text {
  display: none;
  margin-left: 5px;
}
.custom-select-wrapper {
  position: relative;
  width: 100%;
  max-width: 300px;
}
.custom-select option {
  border: none;
}
.custom-select-wrapper select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background: transparent;
  background-image: none;
  padding-right: 30px; /* space for icon */
}
.custom-select-wrapper::after {
  content: "\e64b";
  font-family: "themify";
  font-size: 12px;
  color: #666;
  position: absolute;
  top: 50%;
  right: 15px;
  transform: translateY(-50%);
  pointer-events: none;
}
.company-map iframe {
  width: 100%;
  height: 100%;
  min-height: 250px;
  border-radius: 20px;
  /* filter: grayscale(199%) invert(98%) contrast(122%); */
}
.contact-page .company-map {
  width: 100%;
  height: 100%;
}
.methodology_section {
  background:
    linear-gradient(360deg, rgba(255, 255, 255, 0) 0%, rgba(0, 0, 0, 1) 100%),
    url(/assets/img/home-one/roadmap-gradient.png);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
/* .methodology_section {
  position: relative;
  overflow: hidden;
  z-index: 1;
}
.methodology_section::before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background: linear-gradient(
      360deg,
      rgba(255, 255, 255, 0) 0%,
      rgba(0, 0, 0, 1) 50%,
      rgba(0, 0, 0, 1) 100%
    ),
    url(../img/SCALE-METHODOLOGY.webp) no-repeat bottom center / contain;
  z-index: -1;
} */
/* ------------------------------------------------------------ */
/* ChatBot */
/* ------------------------------------------------------------ */
/* Need Help Button */
/* .need-help-container {
  position: fixed;
  bottom: 30px;
  right: 30px;
  width: 60px;
  height: 60px;
  cursor: pointer;
  z-index: 999;
  transition: transform 0.3s ease;
} */

/* .need-help-container.active {
  display: block;
}

.need-help-container img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  filter: drop-shadow(0 4px 8px rgba(0, 0, 0, 0.2));
}

.need-help-container:hover {
  transform: scale(1.1);
} */

/* Chatbot Container */
.chatbot-container {
  position: fixed;
  bottom: 30px;
  right: 30px;
  width: 380px;
  height: 550px;
  /* background: #191919; */
  border-radius: 16px;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.15);
  display: none;
  flex-direction: column;
  z-index: 1000;
  overflow: hidden;
}

.chatbot-container.show {
  display: flex;
  animation: slideUp 0.3s ease;
}

@keyframes slideUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Chatbot Header */
.chatbot-header {
  /* background: linear-gradient(135deg, #7977f5 0%, #008edd 100%); */
  background: linear-gradient(
    135deg,
    rgba(121, 119, 245, 0.3) 0%,
    rgba(0, 142, 221, 0.3) 100%
  );

  box-shadow: 0 4px 30px rgb(183 160 216 / 20%);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border: 1px solid rgba(255, 255, 255, 0.1);
  /* background: #008edd; */
  color: white;
  padding: 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.chatbot-header-content {
  display: flex;
  align-items: center;
  gap: 12px;
}

.bot-avatar {
  width: 50px;
  height: 50px;
  border-radius: 50%;
}

.chatbot-header h3 {
  margin: 0;
  font-size: 16px;
  font-weight: 600;
}

.status-indicator {
  font-size: 12px;
  opacity: 0.9;
}

.close-chatbot {
  background: transparent;
  border: none;
  color: white;
  font-size: 28px;
  cursor: pointer;
  line-height: 1;
  padding: 0;
  width: 30px;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 4px;
  transition: background 0.2s;
}

.close-chatbot:hover {
  background: rgba(255, 255, 255, 0.2);
}

/* Messages Area */
.chatbot-messages {
  flex: 1;
  overflow-y: auto;
  padding: 20px;
  /* background: #f8f9fa; */
  background: #191919;
}

.message {
  margin-bottom: 16px;
  display: flex;
  animation: fadeIn 0.3s ease;
}

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.message-content {
  max-width: 75%;
  padding: 12px 16px;
  border-radius: 12px;
  word-wrap: break-word;
}

.bot-message .message-content {
  background: white;
  color: #333;
  border-bottom-left-radius: 4px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.user-message {
  justify-content: flex-end;
}

.user-message .message-content {
  background: linear-gradient(135deg, #7977f5 0%, #008edd 100%);
  color: white;
  border-bottom-right-radius: 4px;
}

/* Input Container */
.chatbot-input-container {
  padding: 16px;
  /* background: white; */
  background: #191919;
  border-top: 1px solid #e9ecef;
  display: flex;
  gap: 10px;
}

#chatbot-input {
  flex: 1;
  padding: 12px 16px;
  border: 1px solid #dee2e6;
  border-radius: 24px;
  font-size: 14px;
  outline: none;
  transition: border-color 0.2s;
  color: var(--saas-white);
  background: #191919;
}

#chatbot-input:focus {
  border-color: #008edd;
}

#send-btn {
  width: 44px;
  height: 44px;
  background: linear-gradient(135deg, #7977f5 0%, #008edd 100%);
  border: none;
  border-radius: 50%;
  color: white;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.2s;
}

#send-btn:hover {
  transform: scale(1.05);
}

#send-btn:active {
  transform: scale(0.95);
}

/* Scrollbar Styling */
.chatbot-messages::-webkit-scrollbar {
  width: 6px;
}

.chatbot-messages::-webkit-scrollbar-track {
  background: #f1f1f1;
}

.chatbot-messages::-webkit-scrollbar-thumb {
  background: #888;
  border-radius: 3px;
}

.chatbot-messages::-webkit-scrollbar-thumb:hover {
  background: #555;
}

/* Responsive */
@media (max-width: 480px) {
  .chatbot-container {
    bottom: 20px;
    right: 20px;
  }

  .need-help-container {
    bottom: 15px;
    right: 15px;
  }
  .need-help-container i {
    font-size: 30px;
    width: 50px;
    height: 50px;
  }
  .need-help-container img {
    max-width: 180px;
  }
  .need-help-tooltip {
    right: 70px;
    padding: 10px 20px;
  }
  .need-help-tooltip h4 {
    margin: 0 0 5px 0;
    font-size: 14px;
  }
  .need-help-tooltip p {
    font-size: 12px;
  }
}
.legality_section {
  padding: 100px 0;
}
.legality_section .update-date {
  display: flex;
  align-items: center;
  gap: 48px;
  line-height: 1;
}
.legality_section .update-date h6 {
  margin-bottom: 0;
  color: var(--saas-white);
  font-family: var(--saas-Inter);
  font-size: 14px;
  font-weight: 500;
  line-height: 1;
  position: relative;
}
.legality_section .update-date h6 i {
  color: var(--saas-white);
}
.legality_section .update-date h6::after {
  content: "";
  width: 28px;
  height: 1px;
  background-color: var(--saas-white);
  position: absolute;
  right: -38px;
  top: 50%;
  transform: translateY(-50%);
}
.legality_section .update-date p {
  color: var(--saas-white);
  font-family: var(--saas-Inter);
  font-size: 14px;
  font-weight: 400;
  margin-bottom: 0;
}
.legality_section .legality_section_contents p {
  font-size: 14px;
  text-align: justify;
}
.apply-position-section {
  padding: 150px 0;
}
.apply-position-section .job-summary-area ul {
  background-color: #f1f1f1;
  padding: 20px 25px;
  border-radius: 0;
}
/* .apply-position-section ul {
  list-style: none;
} */
.apply-position-section ul li {
  color: var(--saas-white);
  font-family: var(--saas-Inter);
  font-size: 16px;
  font-weight: 500;
  margin-bottom: 10px;
  padding-left: 5px;
  position: relative;
}
.apply-position-section .job-extra p {
  margin-bottom: 5px;
}
.apply-position-section .job-extra p > b {
  color: var(--saas-white);
}
.apply-position-section strong {
  color: var(--saas-white);
  font-family: var(--saas-Inter);
  font-size: 24px;
  font-weight: 400;
}
.apply-position-section p {
  text-align: justify;
}
.apply-position-section .team-left-side-container p.pad {
  color: var(--saas-white);
  font-size: 24px;
  font-weight: 500;
  margin: 40px 0 15px;
}
.apply-position-right-side {
  position: sticky;
  top: 90px;
}
.apply-position-section .job-summary-area {
  position: unset;
  border-radius: 10px;
  border: 1px solid #eee;
  padding: 20px;
  top: 50px;
}
.apply-position-section .job-summary-area ul {
  background-color: #191919;
  padding: 20px 25px;
  border-radius: 10px;
  list-style: none;
}
/* .apply-position-section ul li::before {
  content: "";
  height: 10px;
  width: 10px;
  border-radius: 50%;
  border: 1px solid var(--saas-white);
  position: absolute;
  left: 0;
  top: 6px;
} */
.apply-position-section .job-summary-area ul li {
  padding-left: 18px;
  position: relative;
  color: var(--saas-description);
  font-family: var(--saas-Inter);
  font-size: 16px;
  margin-bottom: 16px;
}
.apply-position-section .job-summary-area ul li span {
  color: var(--saas-white);
}
.contact-form-area .upload-file-area .custom-upload-field {
  border: 1px solid #eee;
  background-color: var(--saas-white);
  height: 50px;
  display: flex;
  align-items: center;
  border-radius: 8px;
}
.contact-form-area .upload-file-area .custom-upload-field .upload-pdf-icon {
  width: 60px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-right: 1px solid #eee;
  height: 100%;
}
.contact-form-area .upload-file-area .custom-upload-field .custom-upload {
  padding-left: 30px;
  color: #747373;
}
input[type="file" i] {
  appearance: none;
  background-color: initial;
  cursor: default;
  align-items: baseline;
  color: inherit;
  text-align: start !important;
  text-overflow: ellipsis !important;
  padding: initial;
  border: initial;
  white-space: pre;
}
.contact-form-area .form-check {
  min-height: unset;
  margin-bottom: 0;
}
.contact-form-area.two .form-check .form-check-input[type="checkbox"] {
  border-radius: unset;
}
.contact-form-area .form-check .form-check-input {
  cursor: pointer;
  height: 14px;
  width: 14px;
}
.contact-form-area .form-check .form-check-label {
  cursor: pointer;
  color: #fff;
  font-family: var(--saas-Inter);
  font-size: 14px;
  font-weight: 400;
}
.contact-form-area
  .upload-file-area
  .custom-upload-field
  .custom-upload::-webkit-file-upload-button {
  display: none;
}
.team-left-side-container {
  width: 100%;
}
.apply-position-section .team-left-side-container p.pad {
  color: var(--saas-white);
  font-size: 24px;
  font-weight: 500;
  margin: 40px 0 15px;
}
.apply-position-section ul li:last-child {
  margin-bottom: 0;
}
.team-left-side-container ul {
  padding: 0;
}
.team-left-side-container ul li.cent {
  text-align: start;
  padding: 20px 0;
  border-bottom: 1px solid #eee;
}
.team-left-side-container ul li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 50px;
}
.team-left-side-container ul li.cent {
  text-align: start;
  padding: 20px 0;
  border-bottom: 1px solid #eee;
}
.team-left-side-container a {
  color: var(--saas-white);
  font-size: 18px;
}
.team-left-side-container .position-detail p {
  display: flex;
  align-items: center;
  gap: 5px;
}
.team-left-side-container ul li .details-btn a {
  min-width: 40px;
  height: 40px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: 0.35s;
  margin-top: 0;
  border: 1px solid var(--saas-purple);
}

.team-left-side-container ul li .details-btn a svg {
  fill: var(--saas-purple);
}
.location-map {
  border-radius: 20px;
}
.location-map .icon {
  background-color: var(--saas-purple);
  padding: 15px;
  border-radius: 50%;
}
.location-map iframe {
  width: 100%;
  height: 100%;
  min-height: 450px;
  border-radius: 0 20px 20px 0;
}
.team-slider-wrapper {
  position: relative;
  padding: 0 50px;
}

.teamSwiper {
  padding-bottom: 20px; /* Reduced since we're removing pagination */
}

.teamSwiper .swiper-slide {
  height: auto;
}

/* Hide Pagination */
.teamSwiper .swiper-pagination {
  display: none;
}

/* More Button Slide Styling */
.team_more_item {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 300px;
  background: linear-gradient(
    135deg,
    #7977f5 0%,
    #6b7ff5 40%,
    #5a8df0 70%,
    #008edd 100%
  );
  border-radius: 10px;
  transition: transform 0.3s ease;
}

.team_more_link {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  text-decoration: none;
  color: white;
}

.team_more_content {
  text-align: center;
}

.team_more_content i {
  font-size: 48px;
  margin-bottom: 20px;
  display: block;
}

.team_more_content h5 {
  color: white;
  font-size: 24px;
  margin-bottom: 10px;
}

.team_more_content p {
  color: rgba(255, 255, 255, 0.9);
  margin: 0;
}

/* Navigation Buttons */
.team-next,
.team-prev {
  width: 40px;
  height: 40px;
  background: #191919;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease;
}
.team-prev {
  left: -5px;
  top: 40%;
}
.team-next {
  right: -5px;
  top: 40%;
}

/* Hide default Swiper arrows */
.team-next:after,
.team-prev:after {
  content: "";
  display: none;
}

/* Font Awesome Icon Styling */
.team-next i,
.team-prev i {
  font-size: 18px;
  color: var(--saas-white);
  transition: color 0.3s ease;
}

.team-next:hover i,
.team-prev:hover i {
  color: var(--saas-white);
}

.team-next.swiper-button-disabled,
.team-prev.swiper-button-disabled {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

/* Responsive */
@media (max-width: 768px) {
  .team-slider-wrapper {
    padding: 0 30px;
  }

  .team_more_item {
    min-height: 350px;
  }

  .team-next,
  .team-prev {
    width: 35px;
    height: 35px;
  }

  .team-next i,
  .team-prev i {
    font-size: 16px;
  }
}

/* Asia Entry Solutions Hover Tabs */

.asia-hover-tabs .promo_tab_image {
  background: var(--saas-purple);
}
.asia-hover-tabs .nav-item {
  margin-bottom: 0;
}

.asia-hover-tabs .nav-link {
  cursor: pointer;
  transition: all 0.3s ease;
  border-radius: 12px;
  padding: 20px 15px;
  margin-bottom: 10px;
  background: transparent !important;
  align-items: center !important;
  border-radius: 0 !important;
  border-bottom: 1px solid #aeaeae !important;
}

.asia-hover-tabs .nav-link:hover,
.asia-hover-tabs .nav-link.active {
  /* transform: translateX(8px); */
  background: rgba(255, 255, 255, 0.1);
}

/* .asia-hover-tabs .nav-link .content {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
} */

.asia-hover-tabs .nav-link .icon {
  transition: transform 0.3s ease;
}

.asia-hover-tabs .nav-link:hover .icon,
.asia-hover-tabs .nav-link.active .icon {
  transform: scale(1.1);
}

.asia-hover-tabs .nav-link h5 {
  font-size: 15px;
  font-weight: 600;
  margin: 0;
  line-height: 1.3;
  transition: color 0.3s ease;
}

/* Content area styling */
#pills-tabContent-asia .tab-pane {
  min-height: 400px;
  display: none;
  opacity: 0;
  transition: opacity 0.4s ease;
}

#pills-tabContent-asia .tab-pane.active {
  display: block;
  animation: fadeInContent 0.4s ease forwards;
}

@keyframes fadeInContent {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

#pills-tabContent-asia .promo_tab_content {
  padding: 40px;
}

#pills-tabContent-asia .promo_tab_content .icon img {
  filter: drop-shadow(0 4px 6px rgba(0, 0, 0, 0.1));
}

#pills-tabContent-asia .promo_tab_content h2 {
  font-size: 32px;
  font-weight: 700;
  margin-bottom: 20px;
  color: #1a1a1a;
}

#pills-tabContent-asia .promo_tab_content p {
  font-size: 16px;
  line-height: 1.8;
  color: #555;
  margin: 0;
}

/* Responsive adjustments */
@media (max-width: 992px) {
  .asia-hover-tabs .nav-link {
    padding: 15px 10px;
  }

  .asia-hover-tabs .nav-link h5 {
    font-size: 14px;
  }

  .asia-hover-tabs .nav-link .icon img {
    width: 35px !important;
  }

  #pills-tabContent-asia .promo_tab_content {
    padding: 30px;
  }

  #pills-tabContent-asia .promo_tab_content h2 {
    font-size: 26px;
  }
}

@media (max-width: 768px) {
  #pills-tabContent-asia .tab-pane {
    min-height: 300px;
  }

  #pills-tabContent-asia .promo_tab_content {
    padding: 25px;
  }

  #pills-tabContent-asia .promo_tab_content .icon img {
    width: 50px !important;
  }
}
/* Onboarding Process */
.timeline-wrapper {
  position: relative;
  padding: 150px 0 100px 0;
}

/* Timeline Line */
.timeline-line {
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 0 auto;
  max-width: 1300px;
}

.timeline-line::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  height: 3px;
  background: linear-gradient(
    to right,
    #fcc509 0%,
    #d77320 12.5%,
    #fb2114 25%,
    #ed2681 37.5%,
    #ab1e68 50%,
    #ea3dfe 62.5%,
    #a46dff 75%,
    #5b93ff 87.5%,
    #1b9cfc 100%
  );
  transform: translateY(-50%);
  z-index: 1;
}

/* Timeline Points */
.timeline-point {
  position: relative;
  z-index: 2;
  cursor: pointer;
  transition: transform 0.3s ease;
}

.timeline-point:hover {
  transform: scale(1.2);
}

.point-circle {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  font-weight: 600;
  color: #fff;
  transition: all 0.3s ease;
}

.timeline-point:hover .point-circle {
  box-shadow: 0 8px 30px rgba(255, 255, 255, 0.5);
}

/* Individual point colors */
.point-1 .point-circle {
  /* background: #0a2a49; */
  background: #080312;
  border: 3px solid #fcc509;
  color: #fcc509;
}
.point-2 .point-circle {
  /* background: #0a2a49; */
  background: #080312;
  border: 3px solid #d77320;
  color: #d77320;
}
.point-3 .point-circle {
  /* background: #0a2440; */
  background: #080312;
  border: 3px solid #fb2114;
  color: #fb2114;
}
.point-4 .point-circle {
  /* background: #0c1f44; */
  background: #080312;
  border: 3px solid #ed2681;
  color: #ed2681;
}
.point-5 .point-circle {
  /* background: #101a44; */
  background: #080312;
  border: 3px solid #f9257b;
  color: #f9257b;
}
.point-6 .point-circle {
  /* background: #151545; */
  background: #080312;
  border: 3px solid #ea3dfe;
  color: #ea3dfe;
}
.point-7 .point-circle {
  /* background: #1a124a; */
  background: #080312;
  border: 3px solid #a46dff;
  color: #a46dff;
}
.point-8 .point-circle {
  /* background: #201050; */
  background: #080312;
  border: 3px solid #5b93ff;
  color: #5b93ff;
}
.point-9 .point-circle {
  /* background: #230e50; */
  background: #080312;
  border: 3px solid #1b9cfc;
  color: #1b9cfc;
}

/* Content Cards */
.content-card {
  position: absolute;
  background: rgb(25 25 25 / 60%);
  border-radius: 12px;
  padding: 15px;
  min-width: 280px;
  max-width: 250px;
  opacity: 0;
  visibility: hidden;
  transform: translateY(20px);
  transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  z-index: 100;
  box-shadow: 0 20px 60px rgb(43 43 43 / 50%);
  pointer-events: none;
}

.timeline-point:hover .content-card {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  pointer-events: auto;
}

/* Alternating positions - odd numbers above, even numbers below */
.timeline-point:nth-child(odd) .content-card {
  bottom: calc(100% + 15px);
  left: 50%;
  transform: translateX(-50%) translateY(20px);
}

.timeline-point:nth-child(odd):hover .content-card {
  transform: translateX(-50%) translateY(0);
}

.timeline-point:nth-child(even) .content-card {
  top: calc(100% + 15px);
  left: 50%;
  transform: translateX(-50%) translateY(-20px);
}

.timeline-point:nth-child(even):hover .content-card {
  transform: translateX(-50%) translateY(0);
}

/* Card arrow */
.content-card::before {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
}

.timeline-point:nth-child(odd) .content-card::before {
  bottom: -10px;
  left: 50%;
  transform: translateX(-50%);
  border-top: 10px solid rgb(25 25 25 / 60%);
}

.timeline-point:nth-child(even) .content-card::before {
  top: -10px;
  left: 50%;
  transform: translateX(-50%);
  border-bottom: 10px solid rgb(25 25 25 / 60%);
}

.card-title {
  font-size: 12px;
  font-weight: 700;
  margin-bottom: 10px;
  color: #fff;
}

.card-content ul {
  list-style: none;
  padding: 0;
  margin-bottom: 0;
}

.card-content li {
  padding-left: 10px;
  position: relative;
  font-size: 10px;
  line-height: 1.6;
  color: rgba(255, 255, 255, 0.85);
}

.card-content li::before {
  content: "•";
  position: absolute;
  left: 0;
  color: #fff;
  font-weight: bold;
}

/* Responsive Design */
@media (max-width: 1200px) {
  .timeline-line {
    max-width: 100%;
  }

  .point-circle {
    width: 45px;
    height: 45px;
    font-size: 20px;
  }

  .content-card {
    min-width: 280px;
    max-width: 320px;
    padding: 25px;
  }
}

@media (max-width: 768px) {
  /* .timeline-wrapper {
    padding: 50px 0;
  } */

  .timeline-line {
    flex-direction: column;
    gap: 80px;
  }

  .timeline-line::before {
    top: 0;
    bottom: 0;
    left: 50%;
    right: auto;
    width: 3px;
    height: 100%;
    transform: translateX(-50%);
    background: linear-gradient(
      to bottom,
      #fcc509 0%,
      #d77320 12.5%,
      #fb2114 25%,
      #ed2681 37.5%,
      #ab1e68 50%,
      #ea3dfe 62.5%,
      #a46dff 75%,
      #5b93ff 87.5%,
      #1b9cfc 100%
    );
  }

  .point-circle {
    width: 50px;
    height: 50px;
  }

  /* All cards to the right on mobile */
  /* .timeline-point:nth-child(odd) .content-card,
  .timeline-point:nth-child(even) .content-card {
    top: 50%;
    bottom: auto;
    left: calc(100% + 30px);
    right: auto;
    transform: translateY(-50%) translateX(-20px);
  }

  .timeline-point:nth-child(odd):hover .content-card,
  .timeline-point:nth-child(even):hover .content-card {
    transform: translateY(-50%) translateX(0);
  }

  .timeline-point:nth-child(odd) .content-card::before,
  .timeline-point:nth-child(even) .content-card::before {
    top: 50%;
    bottom: auto;
    left: -10px;
    right: auto;
    transform: translateY(-50%);
  } */
  .content-card {
    min-width: 260px;
    max-width: 280px;
  }
}
.custom-container {
  max-width: 1400px;
}

.saas_breadcrumb_area_services {
  padding-top: 350px;
  padding-bottom: 460px;
  background-size: cover;
}
.saas_breadcrumb_area_services .saas_breadcrumb_text {
  text-align: left;
  max-width: 570px;
  margin-left: 0;
  margin-right: 0;
}
/* Service Solution */
.service-solution-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 30px;
}

.service-solution-card {
  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
  padding: 0 30px 30px 30px;
  border-style: solid;
  border-width: 0px 0px 0px 0px;
  border-radius: 10px 10px 10px 10px;
  transition:
    transform 0.3s ease,
    box-shadow 0.3s ease;
}

.service-solution-card:first-child {
  /* transform: translateY(-5px); */
  box-shadow: 0 4px 16px rgb(246 246 246 / 20%);
}
.service-solution-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 4px 16px rgb(246 246 246 / 20%);
}

.service-solution-icon-box {
  width: 75px;
  height: 90px;
  background: linear-gradient(
    150deg,
    rgba(33, 132, 251, 1) 0%,
    rgba(152, 98, 255, 1) 65%,
    rgba(152, 98, 255, 1) 100%
  );
  border-radius: 0 0 8px 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 25px;
}

.service-solution-icon-box svg {
  width: 40px;
  height: 40px;
  stroke: white;
  fill: none;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.service-solution-title {
  font-size: 18px;
  font-weight: 600;
  color: var(--saas-purple);
  margin-bottom: 15px;
}

.service-solution-description {
  font-size: 14px;
  line-height: 1.6;
  color: var(--saas-description);
  margin-bottom: 0px;
}

.service-solution-link {
  color: var(--saas-purple);
  font-weight: 600;
  font-size: 15px;
  text-decoration: none;
  display: inline-block;
  transition: color 0.3s ease;
}

.service-solution-link:hover {
  color: #0056b3;
}

@media (max-width: 768px) {
  .service-solution-grid {
    grid-template-columns: 1fr;
  }
}

/* Overlay background */
/* .service-popup-template {
  display: none;
}

.service-popup-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.65);
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease;
  z-index: 9999;
}

.service-popup-overlay.active {
  opacity: 1;
  pointer-events: all;
}

.service-popup-card {
  background: #3a3a3a;
  color: #fff;
  border-radius: 20px;
  padding: 60px 70px;
  max-width: 760px;
  width: 90%;
  transform: scale(0.95);
  transition: transform 0.3s ease;
}

.service-popup-overlay.active .service-popup-card {
  transform: scale(1);
}

.service-popup-card h2 {
  font-size: 38px;
  margin-bottom: 15px;
}

.service-popup-card p {
  font-size: 17px;
  line-height: 1.6;
  margin-bottom: 20px;
  opacity: 0.9;
}

.service-popup-card ul li {
  font-size: 16px;
  margin-bottom: 10px;
}

.service-popup-card i {
  color: #7c6cff;
  margin-right: 8px;
} */
/* Popup Overlay */
.service-popup-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.7);
  display: flex;
  justify-content: center;
  align-items: center;
  opacity: 0;
  visibility: hidden;
  transition:
    opacity 0.3s ease,
    visibility 0.3s ease;
  z-index: 9999;
}

.service-popup-overlay.active {
  opacity: 1;
  visibility: visible;
}

/* Popup Card */
.service-popup-card {
  background: #fff;
  border-radius: 15px;
  padding: 40px;
  max-width: 600px;
  width: 90%;
  position: relative;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.3);
  transform: scale(0.9);
  transition: transform 0.3s ease;
}

.service-popup-overlay.active .service-popup-card {
  transform: scale(1);
}

/* Close Button */
.service-popup-close {
  position: absolute;
  top: 15px;
  right: 15px;
  background: transparent;
  border: none;
  font-size: 24px;
  color: var(--saas-purple);
  cursor: pointer;
  width: 35px;
  height: 35px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  transition: all 0.3s ease;
}

.service-popup-close:hover {
  background: #f0f0f0;
  color: #000;
  transform: rotate(90deg);
}

/* Popup Content Styling */
.service-popup-card h2 {
  margin-bottom: 20px;
  color: #333;
  font-size: 28px;
}

.service-popup-card p {
  margin-bottom: 20px;
  color: #666;
  line-height: 1.6;
}

.service-popup-card .saas_list {
  padding-left: 0;
}

.service-popup-card .saas_list li {
  margin-bottom: 10px;
  padding-left: 15px;
  color: #555;
  display: flex;
  align-items: center;
  gap: 10px;
}

.service-popup-card .saas_list li i {
  color: var(--saas-purple);
  font-size: 18px;
}

/* Hide template content */
.service-popup-template {
  display: none;
}

/* Make service cards clickable */
.service-card {
  cursor: pointer;
  transition: transform 0.3s ease;
}

.service-card:hover {
  transform: translateY(-5px);
}
.gradient-container {
  position: relative;
  overflow: hidden;
}

.gradient-container .glow-left,
.gradient-container .glow-right {
  position: absolute;
  top: 0;
  bottom: 0;
  height: 100%;
  width: 900px;
  filter: blur(180px);
  pointer-events: none;
  z-index: 3;
}
.gradient-container .glow-right {
  top: -999px;
}

.gradient-container .glow-left {
  left: -200px;
  background: radial-gradient(
    circle at right center,
    rgba(83, 49, 167, 0.75),
    rgba(54, 23, 130, 0.18) 40%,
    transparent 75%
  );
}

.gradient-container .glow-right {
  right: -200px;
  background: radial-gradient(
    circle at left center,
    rgba(28, 24, 104, 1),
    rgba(0, 80, 200, 0.15) 40%,
    transparent 75%
  );
}

.gradient-container > *:not(.glow-left):not(.glow-right) {
  position: relative;
  z-index: 3;
}

/*----------------------------------------*/
/*   SideBar CSS
/*----------------------------------------*/

/* Sidebar Header */
.sidebar-header .sidebar-title h4 {
  font-size: 24px;
  font-weight: 600;
  color: var(--saas-white);
}
.nice-select {
  -webkit-tap-highlight-color: transparent;
  background-color: #fff;
  border-radius: 5px;
  border: solid 1px #e8e8e8;
  box-sizing: border-box;
  clear: both;
  cursor: pointer;
  display: block;
  float: left;
  font-family: inherit;
  font-size: 14px;
  font-weight: 400;
  height: 42px;
  line-height: 40px;
  outline: 0;
  padding-left: 18px;
  padding-right: 30px;
  position: relative;
  text-align: left !important;
  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  white-space: nowrap;
  width: auto;
}

.sidebar-header .nice-select::after {
  display: none;
}

.sidebar-header .nice-select.open::before {
  transform: translateY(-50%) rotate(-180deg);
}

.sidebar-header .nice-select::before {
  content: "\33";
  font-family: "ElegantIcons";
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  right: 10px;
  color: #6a737c;
  font-size: 18px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  transition: all 0.15s ease-in-out;
}

.sidebar-header .nice-select .current {
  font-size: 16px;
  color: var(--saas-description);
  font-weight: 400;
}

/* Right Sidebar Widget */
.right-sidebar-widget .widget-content {
  background: var(--saas-white);
}

.right-sidebar-widget .widget-content ul li {
  line-height: 40px;
}

.right-sidebar-widget .widget-content ul li span {
  font-size: 16px;
  color: var(--saas-description);
}

.right-sidebar-widget .widget-content ul li .name {
  font-weight: 500;
  color: #2c2c2c;
  margin-right: 5px;
}

.right-sidebar-widget .widget-content ul li .value {
  font-weight: 400;
}

/* Sticky Sidebar Widget */
.sticky_sidebar_widget {
  position: sticky;
  top: 90px;
  left: 0;
}

/* Single Sidebar Widget */
.single-sidebar-widget {
  border-radius: 6px;
  background-color: #191919;
}

.single-sidebar-widget
  .form-check
  .form-check-input:checked[type="radio"]
  ~ .form-check-label {
  color: var(--saas-description);
}

.single-sidebar-widget.widget-shadow {
  box-shadow: 0 10px 30px 0 rgba(0, 0, 0, 0.1);
}

.single-sidebar-widget.widget-border {
  border: 1px solid var(--saas-global-color);
  box-sizing: border-box;
}

.single-sidebar-widget .widget-title {
  background: linear-gradient(
    150deg,
    rgb(19 127 255) 0%,
    rgba(152, 98, 255, 1) 65%,
    rgba(152, 98, 255, 1) 100%
  );
  border-top-left-radius: 6px;
  border-top-right-radius: 6px;
  padding: 20px 0 20px 25px;
}

.single-sidebar-widget .widget-title h5 {
  font-size: 18px;
  font-weight: 600;
  color: var(--saas-white);
  margin: 0;
}

.single-sidebar-widget .widget-content {
  background: #191919;
  padding: 20px;
}

.single-sidebar-widget .widget-content label {
  color: var(--saas-description);
}

.single-sidebar-widget .form-control {
  height: 60px;
  background-color: #191919;
  border-radius: 5px;
  border-color: #191919;
  color: #a8a8b2;
  font-size: 14px;
  padding: 10px 20px;
}

.single-sidebar-widget .form-control:focus {
  border-color: var(--saas-purple);
  box-shadow: none;
}

.single-sidebar-widget .form-control:placeholder-shown {
  font-size: 14px;
  font-weight: 400;
  color: #9199a1;
}

.single-sidebar-widget .input-search-field input {
  padding: 0 24px;
  background-color: #191919;
  color: #9199a1;
  font-size: 14px;
  font-weight: 400;
}

.single-sidebar-widget .input-search-field input::placeholder {
  color: #9199a1;
  font-size: 14px;
  font-weight: 400;
}

.single-sidebar-widget .input-search-field .btn {
  background-color: var(--saas-purple);
  height: 60px;
  vertical-align: middle;
  padding: 19px 20px;
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  border: none;
}

.single-sidebar-widget .input-search-field .btn i {
  font-size: 20px;
  color: #fff;
  display: inline-block;
}

.single-sidebar-widget .select-location {
  position: relative;
}

.single-sidebar-widget .select-location .arrow-icon {
  position: absolute;
  top: 50%;
  right: 20px;
  transform: translateY(-50%) rotate(0);
}

.single-sidebar-widget .select-location .arrow-icon i {
  display: inline-block;
  font-size: 15px;
  color: #9199a1;
}

.single-sidebar-widget .select-location .es-input {
  background-image: none;
}

/* Category List Widget */
.catagory-list-widget .catagory-list .catagory-item .catagory-link {
  display: flex;
  justify-content: space-between;
  padding: 9px 20px 9px 52px;
  font-weight: 400;
  color: var(--saas-description);
  transition: all 0.3s ease-out;
  line-height: 22px;
  position: relative;
}

.catagory-list-widget .catagory-list .catagory-item .catagory-link::before {
  content: "\f00c";
  font-family: "Font Awesome 7 Free";
  font-style: normal;
  font-weight: 900;
  font-variant: normal;
  text-transform: none;
  font-size: 14px;
  line-height: 1;
  position: absolute;
  color: var(--saas-purple);
  left: 20px;
  top: 14px;
  display: inline-block;
  visibility: hidden;
  opacity: 0;
  transition: all 0.3s ease-out;
}

.catagory-list-widget .catagory-list .catagory-item .catagory-link.active {
  color: var(--saas-purple);
}

.catagory-list-widget
  .catagory-list
  .catagory-item
  .catagory-link.active::before {
  visibility: visible;
  opacity: 1;
}

.catagory-list-widget .catagory-list .catagory-item .catagory-link:hover {
  background-color: #222222;
}

.catagory-list-widget .catagory-list .catagory-item .catagory-link .text {
  font-size: 14px;
}

.catagory-list-widget .catagory-list .catagory-item .catagory-link .number {
  font-size: 12px;
}

/*----------------------------------------*/
/*  Job Details CSS
/*----------------------------------------*/

/* Job Post Widget */
.job-post-widget .single-job-post {
  background-color: #191919;
  padding: 40px;
  border-radius: 10px;
  transition: all 0.3s ease-out;
  box-shadow: 0 10px 30px 0 rgba(0, 0, 0, 0.1);
}

.job-post-widget .single-job-post:hover {
  box-shadow: 0 20px 45px 0 rgba(51, 77, 114, 0.15);
}

.job-post-widget .single-job-post:hover .job-title {
  color: var(--saas-purple);
}

.job-post-widget .single-job-post .post-header {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
}

.job-post-widget .single-job-post .post-header .timestamp {
  font-size: 14px;
  color: var(--saas-description);
  font-weight: 400;
}

.job-post-widget .single-job-post .post-content {
  margin-top: 25px;
}

.job-post-widget .single-job-post .post-content p {
  font-size: 16px;
  font-weight: 400;
  color: var(--saas-description);
  line-height: 26px;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.job-post-widget select {
  background-color: #191919;
  height: 56px;
  color: var(--saas-description);
  font-family: var(--saas-Inter);
  font-size: 16px;
  font-weight: 400;
  border: none;
  outline: none;
  width: 100%;
  padding: 10px 30px;
  border-radius: 8px;
}
.job-post-widget .custom-select-wrapper::after {
  content: "\e64b";
  font-family: "themify";
  font-size: 12px;
  color: #666;
  position: absolute;
  top: 50%;
  right: 15px;
  transform: translateY(-50%);
  pointer-events: none;
}

/* Job Description Widget */
.job-description-widget .single-description-para {
  margin-top: 25px;
}

.job-description-widget .single-description-para h6 {
  font-size: 18px;
  color: #2c2c2c;
  font-weight: 600;
  margin-bottom: 14px;
  line-height: 29.4px;
}

.job-description-widget .single-description-para h6 span {
  color: #fb4e4e;
}

.job-description-widget .single-description-para p {
  font-size: 16px;
  color: var(--saas-description);
  font-weight: 400;
  line-height: 26px;
}

.job-description-widget .single-description-para ul li {
  margin-top: 7px;
  padding-left: 28px;
  position: relative;
  font-size: 16px;
  color: var(--saas-description);
  font-weight: 400;
  line-height: 26px;
}

.job-description-widget .single-description-para ul li::before {
  content: "\5e";
  position: absolute;
  top: 4px;
  left: 0;
  font-size: 16px;
  color: var(--saas-description);
  font-family: "ElegantIcons";
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
}

.job-description-widget .single-description-para .text_body_color {
  color: #6c6c73;
}

.job-description-widget .note-text p {
  font-size: 18px;
  color: #6c6c73;
  font-weight: 400;
  font-style: italic;
  line-height: 26px;
}

.job-description-widget .note-text p span {
  font-size: 18px;
  color: #45454d;
  font-weight: 700;
  font-style: normal;
}

.job-description-widget .custom-btn i {
  transform: translate(0);
  margin-right: 5px;
}

.job-description-widget .custom-btn:hover i {
  transform: translate(0);
}

/* Job Application Modal */
.job-application-modal {
  z-index: 9999;
}

.job-application-modal .modal-dialog {
  max-width: 768px;
}

.job-application-modal .modal-dialog .modal-content {
  border-radius: 10px;
  border: 1px solid var(--black_50);
  box-shadow: 0 15px 50px 0 rgba(20, 86, 166, 0.15);
  background: var(--bs-white);
}

.job-application-modal .modal-dialog .modal-content .modal-body {
  padding: 50px 60px;
}

.job-application-modal .modal-dialog .modal-content .modal-body .theme-btn {
  color: var(--saas-description);
}

.job-application-modal
  .modal-dialog
  .modal-content
  .modal-body
  .theme-btn:hover {
  color: #fff;
}

.job-application-modal .modal-dialog .dropzone {
  padding: 20px 0;
  background-color: var(--bs-white);
  border: 2px dashed #dcdee0;
  border-radius: 5px;
}

.job-application-modal .modal-dialog .dropzone:hover {
  border-color: var(--brand_color);
}

.job-application-modal .modal-dialog .dropzone .dz-message .dz-button {
  font-weight: 700;
  color: var(--brand_color);
  font-size: 17px;
  margin-bottom: 0;
}

.job-application-modal .label {
  font-size: 16px;
  color: #2c2c2c;
  font-weight: 500;
  display: block;
  margin-bottom: 6px;
}

.job-application-modal .label span {
  color: #fb4e4e;
}

.job-application-modal .job-title {
  font-size: 24px;
}

.job-application-modal .form-control {
  height: 50px;
  background-color: var(--bs-white);
}

.job-application-modal textarea {
  height: inherit !important;
}

.job-application-modal .support {
  font-size: 14px;
  color: var(--saas-description);
  font-weight: 400;
}

.job-application-modal .iti {
  width: 100%;
}

/* Modal Backdrop */
.modal-backdrop {
  z-index: 9998;
  background-color: #172d42;
}

.modal-backdrop.show {
  opacity: 0.2;
}

/*----------------------------------------*/
/*  Feature Job Post CSS
/*----------------------------------------*/

/* Feature Job Tab */
.feature-job-tab .feature-job-list {
  display: flex;
  border: none;
  flex-direction: column;
}

.feature-job-tab .feature-job-list li {
  margin: 12px 0;
}

.feature-job-tab .feature-job-list li a {
  border: none;
  background-color: transparent;
  padding: 0;
}

/* Single Feature Job */
.single-feature-job {
  border-radius: 5px;
  box-shadow:
    0 0.3px 0.9px 0 rgba(20, 85, 166, 0.1),
    0 1.6px 3px 0 rgba(20, 85, 166, 0.13);
  background-color: #191919;
  padding: 30px;
  transition: all 0.3s ease-out;
}

.single-feature-job:hover {
  box-shadow: 0 10px 30px 0 rgba(51, 77, 114, 0.12);
}

.single-feature-job:hover .job-title {
  color: var(--saas-purple);
}

/* Job Elements */
.job-title {
  font-size: 18px;
  color: #2c2c2c;
  font-weight: 600;
  margin-bottom: 6px;
}
.job-title a {
  color: var(--saas-purple);
}

.job-location {
  font-size: 14px;
  color: #787880;
  font-weight: 400;
}

.job-location i {
  display: inline-block;
  vertical-align: middle;
  font-size: 14px;
  color: #787880;
  margin-right: 5px;
}

.job-catagory {
  font-size: 14px;
  color: #787880;
  font-weight: 400;
}

.job-catagory span {
  color: var(--brand_color);
}

/* Feature Job Description */
.feature-job-description {
  padding: 40px;
  border-radius: 10px;
  border: 1px solid var(--black_50);
  background-color: #f5f7fa;
}

.feature-job-description p {
  font-size: 16px;
  font-weight: 400;
  color: var(--saas-description);
  line-height: 26px;
}

/*----------------------------------------*/
/*  Search Job CSS
/*----------------------------------------*/

.search-job {
  top: 0%;
  transform: translateY(-50%);
  box-shadow: 0 10px 30px 0 rgba(20, 86, 166, 0.05);
  padding: 50px 50px 60px 50px;
}

.search-job h4 {
  color: #2c2c2c;
  font-weight: 600;
}

.search-job p {
  font-size: 18px;
  color: var(--saas-description);
  font-weight: 500;
}

.search-job .search-box {
  border: 1px solid var(--black_50);
  border-radius: 6px;
}

.search-job .search-box .input-field {
  position: relative;
}

.search-job .search-box .input-field span {
  position: absolute;
  display: inline-block;
  top: 6px;
  left: 15px;
  font-size: 20px;
  font-weight: 400;
  color: #a8a8b2;
}

.search-job .search-box .input-field .form-control {
  padding-left: 49px;
  border: none;
  height: 45px;
  color: #a8a8b2;
  font-size: 16px;
  font-weight: 400;
  background-color: transparent;
}

.search-job .search-box .input-field .form-control:focus {
  box-shadow: none;
}

.search-job .search-box .input-field .form-control::placeholder {
  color: #a8a8b2;
  font-size: 16px;
  font-weight: 400;
}

.search-job .search-box .custom-btn {
  line-height: 48px;
  border-radius: 6px;
  padding: 0 40px;
  transition: all 0.3s ease-out;
}

.search-job .search-box .custom-btn:hover {
  background-color: var(--brand_color);
  color: #fff;
}

/* --------------New Service Solutions-------------- */

.service-solutions-container {
  padding: 100px 0;
  max-width: 1600px;
  width: 100%;
  margin: 0 auto;
}

.service-solutions-grid {
  display: grid;
  grid-template-columns: 1fr 1.5fr 1fr;
  grid-template-rows: auto auto auto auto auto;
  gap: 20px;
  position: relative;
}

.service-solutions-card {
  background: #191919;
  border-radius: 20px;
  padding: 35px 25px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  min-height: 140px;
  transition: all 0.3s ease;
  cursor: pointer;
  position: relative;
}
.service-solutions-card h3 {
  color: var(--saas-description);
}

.service-solutions-card:hover {
  transform: translateY(-5px);
  background: #222222;
}

.service-solutions-card h3 {
  font-size: 1.5rem;
  font-weight: 600;
  line-height: 1.3;
}

/* Featured purple card */
.service-solutions-featured-card {
  /* background: linear-gradient(135deg, #7c3aed 0%, #a78bfa 100%); */
  /* background: linear-gradient(
    150deg,
    rgb(1 98 214) 0%,
    rgba(152, 98, 255, 1) 65%,
    rgba(152, 98, 255, 1) 100%
  ); */
  background: #191919;
  grid-column: 2;
  grid-row: 1 / 3;
  min-height: 440px;
  position: relative;
  overflow: visible;
  padding: 50px 30px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
}

.service-solutions-featured-card:hover {
  /* background: linear-gradient(
    150deg,
    rgb(1 98 214) 0%,
    rgba(152, 98, 255, 1) 65%,
    rgba(152, 98, 255, 1) 100%
  ); */
  background: #222222;
  transform: none;
}

.service-solutions-featured-content {
  text-align: center;
  z-index: 1;
}

.service-solutions-featured-card h2 {
  font-size: 2.5rem;
  font-weight: 700;
  margin-bottom: 20px;
}

.service-solutions-featured-card p {
  font-size: 1.1rem;
  line-height: 1.6;
  opacity: 0.95;
  max-width: 500px;
}

/* Center orb positioned at the bottom center overlapping cards below */
.service-solutions-center-orb {
  position: absolute;
  bottom: -150px;
  left: 50%;
  transform: translateX(-50%);
  width: 320px;
  height: 320px;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 100;
}

.service-solutions-orb-background {
  position: absolute;
  width: 100%;
  height: 100%;
  background: #000;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.service-solutions-center-orb .service-solutions-orb-background {
  transition: transform 1s ease;
}

.service-solutions-center-orb .service-solutions-orb-background:hover {
  transform: rotate(360deg);
}

.service-solutions-center-orb img {
  width: 300px;
  height: 300px;
  border-radius: 50%;
  object-fit: cover;
  position: relative;
  z-index: 2;
}

/* Column 3 (right) cards - adjusted height */
.service-solutions-card-right {
  min-height: 140px;
  padding: 30px 25px;
}

.service-solutions-card-right h3 {
  font-size: 1.4rem;
}

/* Bottom row cards - smaller height */
.service-solutions-card-bottom {
  min-height: 120px;
  padding: 25px 20px;
}

.service-solutions-card-bottom h3 {
  font-size: 20px;
}

/* Specific grid positions for each card */
/* Row 1 */
.service-solutions-card:nth-of-type(1) {
  grid-column: 1;
  grid-row: 1;
}

.service-solutions-featured-card {
  grid-column: 2;
  grid-row: 1 / 3;
}

.service-solutions-card:nth-of-type(3) {
  grid-column: 3;
  grid-row: 1;
}

/* Row 2 */
.service-solutions-card:nth-of-type(4) {
  grid-column: 1;
  grid-row: 2;
  background-image: url("/assets/img/services/retention.png");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.service-solutions-card:nth-of-type(5) {
  grid-column: 3;
  grid-row: 2;
  background-image: url("/assets/img/services/sales-campaign.png");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

/* Row 3 */
.service-solutions-card:nth-of-type(6) {
  grid-column: 1;
  grid-row: 3;
}

.service-solutions-card:nth-of-type(7) {
  grid-column: 3;
  grid-row: 3;
}

/* Row 4 */
.service-solutions-card:nth-of-type(8) {
  grid-column: 1;
  grid-row: 4;
  background-image: url("/assets/img/services/verification.png");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

/* Row 5 */
.service-solutions-bottom-row {
  grid-column: 2;
  grid-row: 3 / 5;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}

.service-solutions-bottom-row-right {
  grid-column: 3;
  grid-row: 4;
  display: grid;
  grid-template-rows: 1fr 1fr;
  gap: 20px;
}

.service-solutions-card-right:nth-of-type(1) {
  background-image: url("/assets/img/services/staff-augmentation.png");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.service-solutions-card-right:nth-of-type(2) {
  background-image: url("/assets/img/services/escalation.png");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.service-solutions-card-bottom:nth-of-type(1) {
  background-image: url("/assets/img/services/discrepancies.png");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.left-bottom-text {
  justify-content: space-between;
  align-items: start;
  text-align: justify;
}

.right-bottom-text {
  justify-content: space-between;
  align-items: end;
  text-align: end;
}

/* Responsive Design */
@media (max-width: 1200px) {
  .service-solutions-grid {
    gap: 15px;
  }

  .service-solutions-card {
    padding: 30px 20px;
    min-height: 140px;
  }

  .service-solutions-card h3 {
    font-size: 1.3rem;
  }

  .service-solutions-featured-card h2 {
    font-size: 2rem;
  }

  .service-solutions-featured-card p {
    font-size: 1rem;
  }

  .service-solutions-center-orb {
    width: 280px;
    height: 280px;
    bottom: -90px;
  }

  .service-solutions-center-orb img {
    width: 300px;
    height: 300px;
  }
}

@media (max-width: 1024px) {
  /* .service-solutions-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .service-solutions-featured-card {
    grid-column: 1 / -1;
    grid-row: 1;
    min-height: 300px;
  } */
  .service-solutions-card {
    padding: 20px 15px;
    min-height: 100px;
  }
  .service-solutions-card .icon img {
    max-width: 50px;
    max-height: 50px;
  }
  .service-solutions-card h3 {
    font-size: 16px;
  }
  .service-solutions-featured-card h2 {
    font-size: 25px;
  }
  .service-solutions-featured-card p {
    font-size: 13px;
  }

  .service-solutions-center-orb {
    width: 180px;
    height: 180px;
    bottom: -100px;
  }

  .service-solutions-center-orb img {
    width: 150px;
    height: 150px;
  }

  /* .service-solutions-card:nth-of-type(1) {
    grid-column: 1;
    grid-row: 2;
  }
  .service-solutions-card:nth-of-type(3) {
    grid-column: 2;
    grid-row: 2;
  }
  .service-solutions-card:nth-of-type(4) {
    grid-column: 1;
    grid-row: 3;
  }
  .service-solutions-card:nth-of-type(5) {
    grid-column: 2;
    grid-row: 3;
  }
  .service-solutions-card:nth-of-type(6) {
    grid-column: 1;
    grid-row: 4;
  }
  .service-solutions-card:nth-of-type(7) {
    grid-column: 2;
    grid-row: 4;
  }
  .service-solutions-card:nth-of-type(8) {
    grid-column: 1;
    grid-row: 5;
  }
  .service-solutions-card:nth-of-type(9) {
    grid-column: 2;
    grid-row: 5;
  }
  .service-solutions-card:nth-of-type(10) {
    grid-column: 1;
    grid-row: 6;
  }
  .service-solutions-card:nth-of-type(11) {
    grid-column: 2;
    grid-row: 6;
  }
  .service-solutions-card:nth-of-type(12) {
    grid-column: 1;
    grid-row: 7;
  } */
}

@media (max-width: 768px) {
  .service-solutions-featured-card h2 {
    font-size: 20px;
  }

  .service-solutions-featured-card p {
    font-size: 12px;
  }

  .service-solutions-card h3 {
    font-size: 12px;
  }

  .service-solutions-center-orb {
    width: 160px;
    height: 160px;
    bottom: -80px;
  }

  .service-solutions-center-orb img {
    width: 130px;
    height: 130px;
  }
}

@media (max-width: 480px) {
  .service-solutions-container {
    padding: 40px 0;
  }

  .service-solutions-grid {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 8px;
    padding: 0 10px;
  }

  /* Featured card - spans all 3 columns at top */
  .service-solutions-featured-card {
    grid-column: 1 / -1;
    grid-row: 1;
    background: #5329df;
    background: linear-gradient(
      180deg,
      rgba(83, 41, 223, 1) 0%,
      rgba(128, 107, 255, 1) 60%,
      rgba(190, 164, 255, 1) 100%
    );
    min-height: 200px;
    padding: 25px 20px 70px;
    border-radius: 14px;
    position: relative;
    text-align: center;
  }

  .service-solutions-featured-card:hover {
    background: linear-gradient(
      180deg,
      rgba(83, 41, 223, 1) 0%,
      rgba(128, 107, 255, 1) 60%,
      rgba(190, 164, 255, 1) 100%
    );
    transform: none;
  }

  .service-solutions-featured-card h2 {
    font-size: 25px;
    margin-bottom: 8px;
    color: #fff;
    font-weight: 600;
  }

  .service-solutions-featured-card p {
    font-size: 13px;
    line-height: 1.4;
    color: #fff;
    opacity: 0.95;
    margin: 0;
  }

  /* Center orb */
  .service-solutions-center-orb {
    position: absolute;
    bottom: -45px;
    left: 50%;
    transform: translateX(-50%);
    width: 90px;
    height: 90px;
    z-index: 20;
  }

  .service-solutions-orb-background {
    width: 160px;
    height: 160px;
  }

  .service-solutions-center-orb img {
    width: 150px;
    height: 150px;
  }

  /* Reset all cards */
  /* .service-solutions-card,
  .service-solutions-card-right,
  .service-solutions-card-bottom {
    grid-column: unset;
    grid-row: unset;
    min-height: 80px;
    padding: 12px;
    border-radius: 14px;
    background: #2a2a2a;
  } */

  .service-solutions-card h3,
  .service-solutions-card-right h3,
  .service-solutions-card-bottom h3 {
    font-size: 14px;
    line-height: 1.2;
    margin: 0;
    font-weight: 600;
  }

  /* Row 2: Detection & Discrepancies (left 2 cols) | Appointment Setting (right col) */
  .service-solutions-bottom-row {
    grid-column: 1 / -1;
    grid-row: 2;
    display: grid;
    grid-template-columns: 1fr 1fr;
    row-gap: 0;
    column-gap: 8px;
    order: 2;
  }

  .service-solutions-card-bottom:nth-of-type(1) {
    /* Detection */
    grid-column: 1;
    background-image: url(/assets/img/services/discrepancies-mobile.png);
  }

  .service-solutions-card-bottom:nth-of-type(2) {
    /* Appointment */
    grid-column: 2;
    grid-row: 3;
  }

  /* Row 3: Customer Services | Retention Services | Collection Services */
  .service-solutions-card:nth-of-type(1) {
    /* Customer Services */
    grid-column: 1;
    grid-row: 3;
    order: 3;
    align-items: start;
    text-align: left;
  }

  .service-solutions-card:nth-of-type(4) {
    /* Retention Services */
    grid-column: 2;
    grid-row: 3;
    order: 4;
    align-items: center;
    text-align: center;
    background-image: url(/assets/img/services/retention-mobile.png);
  }

  .service-solutions-card:nth-of-type(6) {
    /* Collection Services */
    grid-column: 3;
    grid-row: 3;
    order: 5;
    align-items: end;
    text-align: end;
  }

  /* Row 4: Sales Campaign | Tailored Solutions | Employer of Record */
  .service-solutions-card:nth-of-type(5) {
    /* Sales Campaign */
    grid-column: 1;
    grid-row: 4;
    order: 6;
    align-items: start;
    text-align: left;
    background-image: url(/assets/img/services/sales-campaign-mobile.png);
  }

  .service-solutions-card:nth-of-type(7) {
    /* Tailored Solutions */
    grid-column: 2;
    grid-row: 4;
    order: 7;
    align-items: center;
    text-align: center;
  }

  .service-solutions-card:nth-of-type(3) {
    /* Employer of Record */
    grid-column: 3;
    grid-row: 4;
    order: 8;
    align-items: end;
    text-align: end;
  }

  /* Row 5: Staff Augmentation (full width) */
  .service-solutions-bottom-row-right {
    grid-column: 1 / -1;
    grid-row: 5;
    display: flex;
    flex-direction: column;
    gap: 8px;
    order: 9;
  }

  .service-solutions-card-right:nth-of-type(1) {
    /* Staff Augmentation */
    width: 100%;
    justify-content: center;
  }

  /* Row 6: Verification Services (full width) */
  .service-solutions-card:nth-of-type(8) {
    /* Verification Services */
    grid-column: 1 / -1;
    grid-row: 6;
    order: 10;
    background-image: url(/assets/img/services/verification-mobile.png);
  }

  /* Row 7: Escalation Services (full width) */
  .service-solutions-card-right:nth-of-type(2) {
    /* Escalation Services */
    width: 100%;
    flex-direction: unset;
  }

  /* Icon sizing */
  .service-solutions-card .icon img {
    max-width: 40px;
    max-height: 40px;
    margin-bottom: 10px;
  }

  /* Text alignment */
  .left-bottom-text {
    flex-direction: column-reverse;
  }

  .right-bottom-text {
    flex-direction: column;
  }

  /* Remove hover effects */
  .service-solutions-card:hover,
  .service-solutions-card-right:hover,
  .service-solutions-card-bottom:hover {
    transform: none;
  }
}
.our_offices_bg {
  position: relative;
  padding-top: 250px !important;
  padding-bottom: 100px;
  z-index: 1;
}

.our_offices_bg::before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background:
    linear-gradient(
      to bottom,
      #000 0%,
      rgba(0, 0, 0, 0) 20%,
      rgba(0, 0, 0, 0) 80%,
      #000 100%
    ),
    url(../img/our_offices_bg_3.webp) center / cover no-repeat;
  z-index: -1;
}
.i4ewOd-pzNkMb-haAclf {
  background-color: #000 !important;
}
.testimonial_area_bg {
  position: relative;
  padding-top: 200px !important;
  padding-bottom: 0px;
  z-index: 1;
  background: #000;
}

.testimonial_area_bg::before {
  /* content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background: url(../img/testimonial_area_bg.webp) no-repeat center center /
    cover;
  z-index: -1; */
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(
      to bottom,
      #000 0%,
      rgba(0, 0, 0, 0) 20%,
      rgba(0, 0, 0, 0) 80%,
      #000 100%
    ),
    url(../img/testimonial_area_bg.webp) center / cover no-repeat;
  z-index: -1;
}
.saas_contact_area {
  position: relative;
  z-index: 1;
  padding-top: 0 !important;
}

.saas_contact_area::before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background: url(../img/contacts_bg.webp) no-repeat center center / cover;
  z-index: -1;
}
/* .our_offices_bg {
  position: relative;
  padding-top: 200px !important;
  padding-bottom: 200px;
  z-index: 1;
}

.our_offices_bg::before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: -19%;
  background: url(../img/our_offices_bg.webp) no-repeat bottom center / cover;
  z-index: -1;
} */
.testiminial_wrapper {
  position: relative;
  padding: 0 60px; /* Add space for the arrows */
}

.testimonial-prev,
.testimonial-next {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 10;
  width: 40px;
  height: 40px;
  background: #191919;
  border: none;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease;
}

.testimonial-prev:hover,
.testimonial-next:hover {
  background: #191919;
}

.testimonial-prev {
  left: 0;
}

.testimonial-next {
  right: 0;
}

.testimonial-prev i,
.testimonial-next i {
  font-size: 18px;
  color: var(--saas-white);
  transition: color 0.3s ease;
}

/* Responsive adjustments */
@media (max-width: 768px) {
  .testiminial_wrapper {
    padding: 0 40px;
  }

  .testimonial-prev,
  .testimonial-next {
    width: 40px;
    height: 40px;
  }

  .testimonial-prev i,
  .testimonial-next i {
    font-size: 16px;
  }
}
.glass-card {
  background: rgba(255, 255, 255, 0.1);

  box-shadow: 0 4px 30px rgb(183 160 216 / 20%);

  backdrop-filter: blur(10px);

  -webkit-backdrop-filter: blur(10px);

  border: 1px solid rgba(255, 255, 255, 0.3);
}

/* ============================================
   HERO SECTION
   ============================================ */
.scale-hero-section {
  position: relative;
  padding: 60px 0;
  overflow: visible;
  z-index: 1;
}

/* .scale-glow-left {
  position: absolute;
  top: -250px;
  left: -900px;
  opacity: 0.5;
}

.scale-glow-right {
  position: absolute;
  width: 700px;
  height: 700px;
  top: 125px;
  right: 200px;
  opacity: 0.5;
  filter: blur(50px);
} */

.scale-planet-top-right {
  position: absolute;
  width: 170px;
  height: 170px;
  top: 120px;
  right: 150px;
  animation: scale-float 8s ease-in-out infinite 0.5s;
  opacity: 0.9;
}

.scale-planet-mid-right {
  position: absolute;
  width: 120px;
  height: 120px;
  top: 400px;
  right: 80px;
  animation: scale-float 7s ease-in-out infinite 2s;
  opacity: 0.9;
}

@keyframes scale-float {
  0%,
  100% {
    transform: translateY(0) translateX(0);
  }
  25% {
    transform: translateY(-20px) translateX(10px);
  }
  50% {
    transform: translateY(-30px) translateX(-8px);
  }
  75% {
    transform: translateY(-15px) translateX(-12px);
  }
}

.scale-hero-content {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
}

.scale-hero-text {
  position: relative;
  z-index: 3;
}

.scale-logo-super {
  font-size: 14px;
  vertical-align: super;
  color: var(--saas-white);
}

.scale-hero-title {
  font-size: 50px;
  font-weight: 600;
  line-height: 1.1;
  color: var(--saas-heading);
  margin-bottom: 50px;
}

.scale-cta-button {
  background-color: var(--cyan);
  color: var(--saas-white);
  border: none;
  padding: 18px 40px;
  font-size: 17px;
  font-weight: 600;
  border-radius: 8px;
  cursor: pointer;
  transition: all 0.3s ease;
  font-family: var(--saas-Inter);
}

.scale-cta-button:hover {
  background-color: var(--cyan-light);
  transform: translateY(-3px);
  box-shadow: 0 10px 25px rgba(38, 198, 218, 0.4);
}

.scale-hero-visual {
  position: relative;
  height: 500px;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 3;
}

.scale-hero-image {
  max-width: 650px;
  height: auto;
  position: relative;
  z-index: 4;
}

/* ============================================
   ABOUT SERVICE SECTION
   ============================================ */
.scale-about-service {
  padding: 60px 0 0;
  position: relative;
  overflow: visible;
  z-index: 1;
}

.scale-about-glow-left {
  position: absolute;
  width: 700px;
  height: 700px;
  bottom: -600px;
  left: calc(25% - 350px - 200px);
  opacity: 0.2;
}

@media (max-width: 1400px) {
  .scale-about-glow-left {
    width: 600px;
    height: 600px;
    bottom: -500px;
    left: calc(50% - 300px - 150px);
  }
}

@media (max-width: 1024px) {
  .scale-about-glow-left {
    bottom: -400px;
    left: calc(50% - 250px - 100px);
  }
}

@media (max-width: 768px) {
  .scale-about-glow-left {
    bottom: -300px;
    left: calc(50% - 200px - 80px);
  }
}

@media (max-width: 576px) {
  .scale-about-glow-left {
    bottom: -200px;
    left: calc(50% - 150px - 50px);
  }
}

@media (max-width: 480px) {
  .scale-about-glow-left {
    bottom: -150px;
    left: calc(50% - 125px - 40px);
  }
}

.scale_elements_holder {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 0;
}

.scale-about-planet-left {
  position: absolute;
  top: 165px;
  left: calc(53vw - 660px - 80px);
  transform: translateY(-50%);
  width: 200px;
  height: auto;
}

@media (max-width: 992px) {
  .scale-about-planet-left {
    left: -50px;
  }
}

@media (max-width: 768px) {
}

@media (max-width: 576px) {
}
.scale-about-planet-center {
  position: absolute;
  width: 120px;
  height: 120px;
  bottom: 330px;
  left: clamp(35%, 42%, 45%);
  transform: translateX(-50%);
}

@media (max-width: 1200px) {
  .scale-about-planet-center {
    left: 40%;
  }
}

@media (max-width: 768px) {
  .scale-about-planet-center {
    left: 38%;
    bottom: 250px;
  }
}

@media (max-width: 576px) {
  .scale-about-planet-center {
    left: 35%;
    bottom: 200px;
  }
}
.scale-about-wrapper {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  align-items: center;
  overflow: visible;
}

.scale-about-visual-side {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}

.scale-about-image {
  max-width: 720px;
  top: -380px;
  height: auto;
  position: absolute;
  z-index: 3;
}

.scale-about-text-side {
  padding: 80px 100px 80px 80px;
  position: relative;
  z-index: 3;
  text-align: end;
}

.scale-about-title {
  font-size: 36px;
  font-weight: 700;
  color: var(--saas-heading);
  margin-bottom: 25px;
}

.scale-about-description {
  font-size: 17px;
  color: var(--saas-description);
}

/* ============================================
   SERVICE DETAILS SECTION
   ============================================ */
.scale-service-details {
  padding: 60px 0;
  position: relative;
  z-index: 1;
}

.scale-details-wrapper {
  position: relative;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  z-index: 2;
}

.scale-detail-box {
  border-radius: 0;
  padding: 50px 45px;
  position: relative;
  z-index: 2;
}

.scale-detail-box-advantages {
  position: relative;
}

.scale-advantages-glow {
  position: absolute;
  bottom: -30px;
  right: -70px;
  width: 150px;
  height: 150px;
  pointer-events: none;
  z-index: -1;
}

.scale-glow-corner {
  width: 100%;
  height: 100%;
}

.scale-detail-title {
  font-size: 28px;
  font-weight: 700;
  color: var(--saas-heading);
  margin-bottom: 25px;
}

.scale-detail-text {
  font-size: 16px;
  color: var(--saas-description);
}

.scale-advantages-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.scale-advantages-list li {
  list-style: none;
  font-size: 16px;
  color: var(--saas-description);
  padding-left: 30px;
  position: relative;
}

.scale-advantages-list li:before {
  content: "•";
  position: absolute;
  left: 10px;
  font-size: 16px;
}

/* ============================================
   IMPLEMENTATION PROCESS SECTION
   ============================================ */
.implementation-section {
  padding: 100px 0;
  position: relative;
  z-index: 1;
}

.implementation-title {
  font-size: 45px;
  font-weight: 600;
  color: var(--saas-heading);
  text-align: center;
}

.scale-implementation-diagram {
  position: relative;
  max-width: 1000px;
  margin: 0 auto;
  height: 650px;
}

.scale-step-box {
  position: absolute;
  width: 220px;
  height: 60px;
  background: transparent;
  border: 2px solid rgba(38, 198, 218, 0.35);
  border-radius: 30px;
  transition: all 0.3s ease;
}

.scale-step-box:hover {
  border-color: var(--cyan);
  box-shadow: 0 0 25px rgba(38, 198, 218, 0.4);
}

.scale-step-1 {
  top: 0;
  left: 15%;
}

.scale-step-2 {
  top: 0;
  right: 15%;
}

.scale-step-3 {
  top: 23%;
  left: 5%;
}

.scale-step-4 {
  top: 23%;
  right: 5%;
}

.scale-step-5 {
  top: 46%;
  left: 15%;
}

.scale-step-6 {
  top: 46%;
  right: 15%;
}

.scale-step-7 {
  top: 69%;
  left: 5%;
}

.scale-step-8 {
  top: 69%;
  right: 5%;
}

.scale-step-9 {
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
}

.scale-gear-center {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 280px;
  height: 280px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.scale-gear-svg {
  width: 100%;
  height: 100%;
  animation: scale-rotate 25s linear infinite;
}

@keyframes scale-rotate {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

/* ============================================
   RESPONSIVE DESIGN
   ============================================ */
@media (max-width: 1200px) {
  .scale-hero-title {
    font-size: 35px;
  }

  .scale-hero-image {
    max-width: 450px;
  }

  .scale-about-planet-left {
    left: 0;
  }
  .scale-glow-right {
    right: 0;
    top: 165px;
    right: 30px;
  }
  .scale-advantages-glow {
    bottom: -75px;
    right: 30px;
  }

  .scale-about-title {
    font-size: 32px;
  }

  .implementation-title {
    font-size: 40px;
  }

  .scale-planet-top-left,
  .scale-planet-mid-left {
    display: none;
  }
}

@media (max-width: 968px) {
  .scale-details-wrapper {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .scale-hero-title {
    font-size: 30px;
  }

  .scale-hero-visual {
    height: 300px;
  }

  .scale-about-text-side {
    padding: 60px 40px;
  }

  .scale-about-visual-side {
    padding: 40px;
  }

  .scale-implementation-diagram {
    height: 750px;
  }

  .scale-step-box {
    width: 180px;
    height: 50px;
  }
}

@media (max-width: 640px) {
  .scale-container {
    padding: 0 20px;
  }

  .scale-hero-title {
    font-size: 18px;
  }

  .implementation-title {
    font-size: 35px;
  }

  .scale-about-visual-side,
  .scale-about-text-side {
    padding: 40px 30px;
    text-align: left;
  }

  .scale-detail-box {
    padding: 35px 30px;
  }

  .scale-glow-left {
    top: 550px;
    left: -900px;
    opacity: 0.3;
  }
}
.core-hero-section {
  position: relative;
  padding: 60px 0;
  overflow: visible;
  z-index: 1;
}

.core-hero-background {
  position: relative;
}

.core-glow-left {
  position: absolute;
  top: -250px;
  left: -900px;
  max-width: 100%;
  opacity: 0.5;
}

.core-planet-top-left {
  position: absolute;
  width: 200px;
  height: 200px;
  top: 40px;
  left: -180px;
}

.core-planet-mid-left {
  position: absolute;
  width: 100px;
  height: 100px;
  top: 150px;
  left: -90px;
}

/* .core-glow-right {
  position: absolute;
  width: 700px;
  height: 700px;
  top: 125px;
  right: 200px;
  opacity: 0.5;
  filter: blur(50px);
} */

.core-planet-top-right {
  position: absolute;
  width: 170px;
  height: 170px;
  top: 120px;
  right: 150px;
  animation: core-float 8s ease-in-out infinite 0.5s;
  opacity: 0.9;
}

.core-planet-mid-right {
  position: absolute;
  width: 120px;
  height: 120px;
  top: 400px;
  right: 80px;
  animation: core-float 7s ease-in-out infinite 2s;
  opacity: 0.9;
}

@keyframes core-float {
  0%,
  100% {
    transform: translateY(0) translateX(0);
  }
  25% {
    transform: translateY(-20px) translateX(10px);
  }
  50% {
    transform: translateY(-30px) translateX(-8px);
  }
  75% {
    transform: translateY(-15px) translateX(-12px);
  }
}

.core-hero-content {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
}

.core-hero-text {
  position: relative;
  z-index: 3;
}

.core-logo-super {
  font-size: 14px;
  vertical-align: super;
  color: var(--saas-white);
}

.core-hero-title {
  font-size: 50px;
  font-weight: 600;
  line-height: 1.1;
  color: var(--saas-heading);
  margin-bottom: 50px;
  max-width: 550px;
}

.core-cta-button {
  background-color: var(--cyan);
  color: var(--saas-white);
  border: none;
  padding: 18px 40px;
  font-size: 17px;
  font-weight: 600;
  border-radius: 8px;
  cursor: pointer;
  transition: all 0.3s ease;
  font-family: var(--saas-Inter);
}

.core-cta-button:hover {
  background-color: var(--cyan-light);
  transform: translateY(-3px);
  box-shadow: 0 10px 25px rgba(38, 198, 218, 0.4);
}

.core-hero-visual {
  position: relative;
  height: 650px;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 3;
}

.core-hero-image {
  max-width: 450px;
  height: auto;
  position: absolute;
  z-index: 4;
  right: -50px;
}

/* ============================================
   ABOUT SERVICE SECTION
   ============================================ */
.core-about-service {
  padding: 60px 0 0;
  position: relative;
  overflow: visible;
  z-index: 1;
}

.core-about-background {
  position: relative;
}
.core-about-glow-left {
  position: absolute;
  width: 900px;
  height: 900px;
  bottom: -900px;
  left: calc(25% - 350px - 200px);
  opacity: 0.2;
}
.core_elements_holder {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 0;
}

.core-about-planet-left {
  position: absolute;
  top: 450px;
  left: calc(50vw - 660px - 80px);
  transform: translateY(-50%);
  width: 200px;
  height: auto;
}

.core-about-wrapper {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  align-items: center;
  overflow: visible;
}

.core-about-visual-side {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}

.core-about-image {
  max-width: 820px;
  top: -450px;
  height: auto;
  position: absolute;
  z-index: 3;
}

.core-about-text-side {
  padding: 80px 100px 80px 80px;
  position: relative;
  z-index: 3;
  text-align: end;
}

.core-about-title {
  font-size: 36px;
  font-weight: 700;
  color: var(--saas-heading);
  margin-bottom: 25px;
}

.core-about-description {
  font-size: 17px;
  color: var(--saas-description);
}

/* ============================================
   SERVICE DETAILS SECTION
   ============================================ */
.core-service-details {
  padding: 60px 0;
  position: relative;
  z-index: 1;
}

.core-details-wrapper {
  position: relative;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  z-index: 2;
}

.core-detail-box {
  border-radius: 0;
  padding: 50px 45px;
  position: relative;
  z-index: 2;
}

.core-detail-box-advantages {
  position: relative;
}

.core-advantages-glow {
  position: absolute;
  bottom: -30px;
  right: -70px;
  width: 150px;
  height: 150px;
  pointer-events: none;
  z-index: -1;
}

.core-glow-corner {
  width: 100%;
  height: 100%;
}

.core-detail-title {
  font-size: 28px;
  font-weight: 700;
  color: var(--saas-heading);
  margin-bottom: 25px;
}

.core-detail-text {
  font-size: 16px;
  color: var(--saas-description);
}
.core-advantages-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.core-advantages-list li {
  font-size: 16px;
  color: var(--saas-description);
  padding-left: 30px;
  position: relative;
}
.core-advantages-list li:before {
  content: "•";
  position: absolute;
  left: 10px;
  font-size: 16px;
}
/* ============================================
   APPLICABLE SERVICES SECTION
   ============================================ */
.core-applicable-services {
  padding: 80px 0 150px;
  position: relative;
}

.core-services-main-title {
  font-size: 48px;
  font-weight: 700;
  color: var(--saas-white);
  text-align: center;
  margin-bottom: 80px;
}

/* .core-services-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 60px 40px;
  max-width: 1400px;
  margin: 0 auto;
} */
.core-services-grid {
  display: grid;
  grid-template-columns: repeat(10, 1fr);
  gap: 60px 40px;
  max-width: 1400px;
  margin: 0 auto;
}

.core-service-item {
  grid-column: span 2;
}

.core-service-item:nth-child(6) {
  grid-column: 2 / 4;
}
@media (max-width: 992px) {
  .core-about-planet-left {
    left: -30px;
    width: 120px;
  }
}

@media (max-width: 768px) {
  /* .core-about-planet-left {
    left: -40px;
    width: 100px;
  } */
  .core-hero-image {
    max-width: 100%;
    right: -20px;
  }
  .core-hero-title {
    font-size: 20px;
  }
  .core-detail-title {
    font-size: 20px;
    margin-bottom: 10px;
  }
  .core-about-title {
    margin-bottom: 10px;
  }
  .core-hero-visual {
    height: 400px;
  }
  .core-detail-box {
    padding: 30px 25px;
  }
  .core-brand-logo img {
    width: 150px;
    height: auto;
    margin-bottom: 10px !important;
  }
  .core-planet-top-left,
  .core-planet-mid-left {
    display: none;
  }
  .core-details-wrapper,
  .core-about-wrapper {
    grid-template-columns: 1fr;
  }
  .core-about-visual-side,
  .core-about-text-side {
    padding: 40px 30px;
    text-align: left;
  }
  .core-about-title {
    font-size: 24px;
  }
  .core-detail-text,
  .core-about-description {
    font-size: 14px;
    line-height: 23px;
    margin: 0;
  }
  .core-about-image {
    top: -200px;
    max-width: 500px;
  }
  .core-about-glow-left {
    bottom: -800px;
  }
}

@media (max-width: 576px) {
  /* .core-about-planet-left {
    left: -30px;
    width: 80px;
  } */
  .core-advantages-list li {
    font-size: 14px;
    margin-bottom: 5px;
  }
}

/* Large Tablets and Small Desktops - 4 columns */
@media (max-width: 1200px) {
  .core-services-grid {
    grid-template-columns: repeat(8, 1fr);
    gap: 50px 30px;
  }

  .core-service-item:nth-child(6) {
    grid-column: span 2;
  }
}

/* Tablets - 3 columns */
@media (max-width: 992px) {
  .core-services-grid {
    grid-template-columns: repeat(6, 1fr);
    gap: 45px 25px;
  }
}

/* Small Tablets - 2 columns */
@media (max-width: 768px) {
  .core-services-grid {
    grid-template-columns: repeat(4, 1fr);
    gap: 40px 20px;
  }

  .core-service-item:nth-child(odd) {
    grid-column: 1 / 3;
  }

  .core-service-item:nth-child(even) {
    grid-column: 3 / 5;
  }
}

/* Mobile - 1 column */
@media (max-width: 480px) {
  .core-service-item {
    grid-column: 1;
  }

  /* .core-service-item:nth-child(6) {
    grid-column: 1;
  } */
}
.core-service-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 25px;
}

.core-service-icon {
  width: 120px;
  height: 120px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.3s ease;
}

.core-service-icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

/* .core-service-item:hover .core-service-icon {
  transform: translateY(-10px);
} */

.core-service-title {
  font-size: 18px;
  font-weight: 500;
  color: var(--saas-white);
  line-height: 1.4;
  margin: 0;
}

/* Responsive Design */
@media (max-width: 1400px) {
  .core-services-grid {
    gap: 50px 30px;
  }

  .core-service-icon {
    width: 100px;
    height: 100px;
  }

  .core-service-title {
    font-size: 16px;
  }
}

@media (max-width: 1200px) {
  .core-services-grid {
    grid-template-columns: repeat(4, 1fr);
    gap: 50px 30px;
  }
}

@media (max-width: 992px) {
  .core-services-main-title {
    font-size: 40px;
    margin-bottom: 60px;
  }

  /* .core-services-grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 45px 25px;
  } */

  .core-service-icon {
    width: 90px;
    height: 90px;
  }
}

@media (max-width: 768px) {
  .core-applicable-services {
    padding: 60px 0;
  }

  .core-services-main-title {
    font-size: 32px;
    margin-bottom: 50px;
  }
  /* 
  .core-services-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 40px 20px;
  } */

  .core-service-icon {
    width: 80px;
    height: 80px;
  }

  .core-service-title {
    font-size: 15px;
  }
}

@media (max-width: 576px) {
  .core-services-main-title {
    font-size: 28px;
    margin-bottom: 40px;
  }

  /* .core-services-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 35px 15px;
  } */

  .core-service-icon {
    width: 60px;
    height: 60px;
  }

  .core-service-title {
    font-size: 14px;
  }
}

@media (max-width: 480px) {
  .core-service-item {
    gap: 20px;
  }
}
/* ============================================
   ARBITRAIL CXAS SERVICE PAGE STYLES
   ============================================ */

/* ============================================
   HERO SECTION
   ============================================ */
.cxas-hero-section {
  position: relative;
  padding: 60px 0;
  overflow: visible;
  z-index: 1;
}

.cxas-hero-background {
  position: relative;
  /* top: -150px;
  left: 0;
  width: 100%;
  height: calc(100% + 300px);
  pointer-events: none;
  z-index: 0; */
}

.cxas-glow-left {
  position: absolute;
  top: -250px;
  left: -900px;
  opacity: 0.5;
  filter: blur(40px);
}

.cxas-planet-top-left {
  position: absolute;
  width: 200px;
  height: 200px;
  top: 80px;
  left: -180px;
}

.cxas-planet-mid-left {
  position: absolute;
  width: 100px;
  height: 100px;
  top: 180px;
  left: -90px;
}

.cxas-glow-right {
  position: absolute;
  width: 700px;
  height: 700px;
  left: -410px;
  opacity: 0.8;
  filter: blur(50px);
}

.cxas-planet-top-right {
  position: absolute;
  width: 170px;
  height: 170px;
  top: 120px;
  right: 150px;
  animation: cxas-float 8s ease-in-out infinite 0.5s;
  opacity: 0.9;
}

.cxas-planet-mid-right {
  position: absolute;
  width: 120px;
  height: 120px;
  top: 400px;
  right: 80px;
  animation: cxas-float 7s ease-in-out infinite 2s;
  opacity: 0.9;
}

@keyframes cxas-float {
  0%,
  100% {
    transform: translateY(0) translateX(0);
  }
  25% {
    transform: translateY(-20px) translateX(10px);
  }
  50% {
    transform: translateY(-30px) translateX(-8px);
  }
  75% {
    transform: translateY(-15px) translateX(-12px);
  }
}

.cxas-hero-content {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
}

.cxas-hero-text {
  position: relative;
  z-index: 3;
}

.cxas-logo-super {
  font-size: 14px;
  vertical-align: super;
  color: var(--saas-white);
}

.cxas-hero-title {
  font-size: 50px;
  font-weight: 600;
  line-height: 1.1;
  color: var(--saas-heading);
  margin-bottom: 50px;
}

.cxas-cta-button {
  background-color: #ff7828;
  color: var(--saas-white);
  border: none;
  padding: 18px 40px;
  font-size: 17px;
  font-weight: 600;
  border-radius: 8px;
  cursor: pointer;
  transition: all 0.3s ease;
  font-family: var(--saas-Inter);
}

.cxas-cta-button:hover {
  background-color: #ff9547;
  transform: translateY(-3px);
  box-shadow: 0 10px 25px rgba(255, 120, 40, 0.4);
}

.cxas-hero-visual {
  position: relative;
  height: 600px;
  display: flex;
  align-items: center;
  justify-content: end;
  z-index: 3;
}
.cxas-hero-visual img {
  width: 400px;
}

/* ============================================
   ABOUT SERVICE SECTION
   ============================================ */
.cxas-about-service {
  padding: 60px 0 0;
  position: relative;
  overflow: visible;
  z-index: 1;
}

.cxas-about-background {
  position: absolute;
  /* top: -100px;
  left: 0;
  width: 100%;
  height: calc(100% + 200px);
  pointer-events: none;
  z-index: 0; */
}
.cxas-service-background {
  position: absolute;
  /* top: -100px;
  left: 0;
  width: 100%;
  height: calc(100% + 200px);
  pointer-events: none;
  z-index: 0; */
}

.cxas_elements_holder {
  position: relative;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 0;
}
.cxas-about-planet-left {
  position: absolute;
  top: 0;
  right: -70px;

  /* transform: translateY(-50%); */
  width: 170px;
  height: auto;
}

.cxas-about-glow-left {
  position: absolute;
  width: 700px;
  height: 700px;
  bottom: -600px;
  left: calc(38vw - 660px - 100px);
  opacity: 0.2;
}
.cxas-about-glow-right {
  position: absolute;
  width: 700px;
  height: 700px;
  bottom: -900px;
  left: -350px;
  opacity: 1;
}
.cxas-service-glow-left {
  position: absolute;
  width: 700px;
  height: 700px;
  bottom: -300px;
  left: -120px;
  opacity: 0.5;
}

@media (max-width: 1400px) {
  .cxas-about-glow-left {
    width: 600px;
    height: 600px;
    bottom: -500px;
    left: calc(50% - 300px - 150px);
  }
}

/* Tablets */
@media (max-width: 1024px) {
  .cxas-about-glow-left {
    width: 500px;
    height: 500px;
    bottom: -400px;
    left: calc(50% - 250px - 100px);
  }
}

/* Small Tablets */
@media (max-width: 768px) {
  .cxas-about-glow-left {
    width: 400px;
    height: 400px;
    bottom: -300px;
    left: calc(50% - 200px - 80px);
  }
}

/* Mobile Landscape */
@media (max-width: 576px) {
  .cxas-about-glow-left {
    width: 300px;
    height: 300px;
    bottom: -200px;
    left: calc(50% - 150px - 50px);
  }
}

/* Mobile Portrait */
@media (max-width: 480px) {
  .cxas-about-glow-left {
    width: 250px;
    height: 250px;
    bottom: -150px;
    left: calc(50% - 125px - 40px);
  }
}

@media (max-width: 992px) {
  .cxas-about-planet-left {
    left: -50px;
    width: 120px;
  }
}

@media (max-width: 768px) {
  .cxas-about-planet-left {
    left: -40px;
    width: 100px;
  }
}

@media (max-width: 576px) {
  .cxas-about-planet-left {
    left: -30px;
    width: 80px;
  }
}

.cxas-about-planet-center {
  position: absolute;
  width: 120px;
  height: 120px;
  bottom: 330px;
  left: clamp(35%, 42%, 45%);
  transform: translateX(-50%);
}

@media (max-width: 1200px) {
  .cxas-about-planet-center {
    left: 40%;
  }
}

@media (max-width: 768px) {
  .cxas-about-planet-center {
    left: 38%;
    width: 100px;
    height: 100px;
    bottom: 250px;
  }
}

@media (max-width: 576px) {
  .cxas-about-planet-center {
    left: 35%;
    width: 80px;
    height: 80px;
    bottom: 200px;
  }
}

.cxas-about-wrapper {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  align-items: center;
  overflow: visible;
}

.cxas-about-visual-side {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}

.cxas-about-image {
  max-width: 920px;
  top: -515px;
  height: auto;
  position: absolute;
  z-index: 3;
}

.cxas-about-text-side {
  padding: 80px 100px 80px 80px;
  position: relative;
  z-index: 3;
  text-align: end;
}

.cxas-about-title {
  font-size: 36px;
  font-weight: 700;
  color: var(--saas-heading);
  margin-bottom: 25px;
}

.cxas-about-description {
  font-size: 17px;
  color: var(--saas-description);
  margin: 0;
}

/* ============================================
   SERVICE DETAILS SECTION
   ============================================ */
.cxas-service-details {
  padding: 60px 0;
  position: relative;
  z-index: 1;
}

.cxas-details-wrapper {
  position: relative;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  z-index: 2;
}

.cxas-detail-box {
  border-radius: 0;
  padding: 50px 45px;
  position: relative;
  z-index: 2;
}

.cxas-detail-box-advantages {
  position: relative;
}

.cxas-advantages-glow {
  position: absolute;
  top: -25px;
  left: -65px;
  width: 130px;
  height: 130px;
  pointer-events: none;
  z-index: -1;
}

.cxas-glow-corner {
  width: 100%;
  height: 100%;
}

.cxas-detail-title {
  font-size: 28px;
  font-weight: 700;
  color: var(--saas-heading);
  margin-bottom: 25px;
}

.cxas-detail-text {
  font-size: 16px;
  color: var(--saas-description);
}
.cxas-advantages-list {
  list-style: none;
  padding: 0;
}

.cxas-advantages-list li {
  font-size: 16px;
  color: var(--saas-description);
  padding-left: 30px;
  position: relative;
  margin-bottom: 12px;
}
.cxas-advantages-list li:before {
  content: "•";
  position: absolute;
  left: 10px;
  font-size: 16px;
}

/* ============================================
   IMPLEMENTATION PROCESS SECTION - DESKTOP
   ============================================ */
.implementation-section {
  padding: 60px 0;
  position: relative;
  overflow: hidden;
}

.implementation-title {
  font-size: 36px;
  font-weight: 700;
  color: var(--saas-heading);
  text-align: center;
  margin-bottom: 40px;
}

.cxas-process-container {
  width: 100%;
  max-width: 1440px;
  margin: 0 auto;
  display: flex;
  justify-content: center;
  align-items: center;
}

.cxas-process-wrapper {
  position: relative;
  width: 1440px;
  height: 1000px;
  transform-origin: top center;
}

.cxas-process-circle {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 600px;
  height: 600px;
  z-index: 1;
}

.cxas-process-circle img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.cxas-process-card {
  position: absolute;
  display: flex;
  align-items: center;
  gap: 15px;
  z-index: 2;
}

.cxas-process-card-content {
  background: rgba(255, 255, 255, 0.1);
  box-shadow: 0 4px 30px rgb(183 160 216 / 20%);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border: 1px solid rgba(255, 255, 255, 0.3);
  border-radius: 100px;
  padding: 16px 26px;
  max-width: 380px;
}

.cxas-process-card-title {
  font-size: 13px;
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 6px;
  line-height: 1.3;
}

.cxas-process-card-text {
  font-size: 11px;
  font-weight: 400;
  color: #ffffff;
  line-height: 1.5;
  margin: 0;
}

.cxas-process-card-number {
  width: 35px;
  height: 35px;
  background-color: #ffa113;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  font-weight: 700;
  color: #ffffff;
  flex-shrink: 0;
  box-shadow: 0 0 20px rgba(255, 236, 0, 0.5);
}

.cxas-process-card-number-left {
  position: absolute;
  right: -15px;
}

.cxas-process-card-number-right {
  position: absolute;
  left: -15px;
  z-index: 1;
}

.cxas-process-card-number-top {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: -15px;
}

.cxas-process-card-number-bottom {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: -15px;
}

.cxas-process-card-1 {
  top: 190px;
  left: 170px;
  flex-direction: row;
  text-align: end;
}

.cxas-process-card-2 {
  top: 330px;
  left: 70px;
  flex-direction: row;
  text-align: end;
}

.cxas-process-card-3 {
  top: 490px;
  left: 50px;
  flex-direction: row;
  text-align: end;
}

.cxas-process-card-4 {
  top: 635px;
  left: 115px;
  flex-direction: row;
  text-align: end;
}

.cxas-process-card-5 {
  top: 770px;
  left: 240px;
  flex-direction: row;
  text-align: end;
}

/* Card Positions - Right Side (6, 7, 8, 9, 10) - Bottom to Top */
.cxas-process-card-6 {
  top: 770px;
  right: 240px;
  flex-direction: row;
}

.cxas-process-card-7 {
  top: 635px;
  right: 115px;
  flex-direction: row;
}

.cxas-process-card-8 {
  top: 490px;
  right: 50px;
  flex-direction: row;
}

.cxas-process-card-9 {
  top: 330px;
  right: 70px;
  flex-direction: row;
}

.cxas-process-card-10 {
  top: 190px;
  right: 170px;
  flex-direction: row;
}

.cxas-process-card-11 {
  top: 75px;
  left: 50%;
  transform: translateX(-50%);
  flex-direction: column;
  text-align: center;
}

/* ============================================
   RESPONSIVE DESIGN
   ============================================ */
@media (max-width: 1399px) {
  .cxas-process-card-7 {
    right: 105px;
  }
}
@media (max-width: 1200px) {
  .cxas-hero-title {
    font-size: 45px;
  }

  .cxas-about-title {
    font-size: 32px;
  }

  .cxas-glow-left,
  .cxas-glow-right,
  .cxas-about-glow-left {
    width: 500px;
    height: 500px;
  }

  .cxas-about-planet-left {
    right: auto;
    left: -50px;
    width: 150px;
  }
  .cxas-hero-visual img {
    width: 350px;
  }
}

@media (max-width: 968px) {
  .cxas-details-wrapper {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .cxas-hero-title {
    font-size: 40px;
  }

  .cxas-hero-visual {
    height: 400px;
  }

  .cxas-about-text-side {
    padding: 60px 40px;
    text-align: left;
  }

  .cxas-about-visual-side {
    padding: 40px;
    order: -1;
  }

  .cxas-about-image {
    top: -190px;
    max-width: 500px;
  }

  .cxas-glow-left,
  .cxas-glow-right,
  .cxas-about-glow-left {
    width: 400px;
    height: 400px;
  }

  .cxas-detail-text,
  .cxas-about-description {
    font-size: 14px;
    line-height: 23px;
  }
  .cxas-detail-title,
  .cxas-about-title {
    margin-bottom: 10px;
    font-size: 28px;
  }
  .cxas-hero-visual img {
    width: 280px;
  }
}

@media (max-width: 640px) {
  .container {
    padding: 0 20px;
  }

  .cxas-hero-section {
    padding: 40px 0;
  }

  .cxas-hero-title {
    font-size: 32px;
    margin-bottom: 30px;
  }

  .cxas-about-title {
    font-size: 28px;
  }

  .cxas-about-visual-side,
  .cxas-about-text-side {
    padding: 40px 30px;
  }

  .cxas-detail-box {
    padding: 35px 30px;
  }

  .cxas-detail-title {
    font-size: 24px;
  }

  .cxas-glow-left,
  .cxas-glow-right,
  .cxas-about-glow-left {
    width: 300px;
    height: 300px;
  }

  .cxas-hero-visual {
    height: 300px;
  }

  .cxas-hero-image {
    max-width: 100%;
  }

  .implementation-title {
    font-size: 25px;
  }

  .cxas-planet-top-left,
  .cxas-planet-mid-left {
    display: none;
  }
  .cxas-hero-visual img {
    width: 200px;
  }
  .cxas-about-wrapper {
    grid-template-columns: 1fr;
    gap: 40px;
  }
}

@media (max-width: 480px) {
  .cxas-hero-title {
    font-size: 20px;
  }

  .cxas-about-title {
    font-size: 24px;
  }

  .cxas-detail-title {
    font-size: 22px;
  }

  .cxas-cta-button {
    padding: 14px 30px;
    font-size: 15px;
  }

  .cxas-detail-box {
    padding: 30px 25px;
  }

  .cxas-advantages-list li {
    font-size: 14px;
    margin-bottom: 5px;
  }
  .cxas-advantages-list li:before {
    font-size: 14px;
  }

  .cxas-about-planet-left {
    left: -20px;
    width: 80px;
  }

  .implementation-title {
    font-size: 20px;
  }
}

/* ============================================
   IMPLEMENTATION PROCESS - SCALE RESPONSIVE (Desktop)
   ============================================ */

@media (min-width: 1441px) {
  .cxas-process-container {
    overflow: visible;
  }

  .cxas-process-wrapper {
    transform: scale(1);
  }
}

@media (max-width: 1440px) and (min-width: 1201px) {
  .cxas-process-container {
    overflow: visible;
  }

  .cxas-process-wrapper {
    transform: scale(calc(100vw / 1500));
    margin-bottom: calc((1000px * (100vw / 1500)) - 1000px);
  }
}

@media (max-width: 1200px) and (min-width: 992px) {
  .cxas-process-container {
    overflow: visible;
  }

  .cxas-process-wrapper {
    transform: scale(0.75);
    margin-bottom: -250px;
  }
}

.cxas-mobile-number {
  display: none;
}
.cxas-process-popup-overlay {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.8);
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
  z-index: 9999;
  justify-content: center;
  align-items: center;
  padding: 20px;
  box-sizing: border-box;
}

.cxas-process-popup-overlay.active {
  display: flex;
}

.cxas-process-popup {
  position: relative;

  border: 1px solid rgba(255, 161, 19, 0.3);
  padding: 30px;
  max-width: 400px;
  width: 100%;
  animation: popupFadeIn 0.3s ease;
}

@keyframes popupFadeIn {
  from {
    opacity: 0;
    transform: scale(0.9) translateY(20px);
  }
  to {
    opacity: 1;
    transform: scale(1) translateY(0);
  }
}

.cxas-process-popup-close {
  position: absolute;
  top: 15px;
  right: 15px;
  width: 32px;
  height: 32px;
  background: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.3s ease;
  z-index: 10;
}

.cxas-process-popup-close:hover {
  background: rgba(255, 161, 19, 0.3);
  border-color: rgba(255, 161, 19, 0.5);
  transform: rotate(90deg);
}

.cxas-process-popup-close svg {
  width: 16px;
  height: 16px;
  stroke: #ffffff;
  stroke-width: 2;
}

.cxas-process-popup-number {
  width: 50px;
  height: 50px;
  background: linear-gradient(135deg, #ffa113 0%, #ff7828 100%);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 20px;
  box-shadow: 0 0 30px rgba(255, 161, 19, 0.5);
}

.cxas-process-popup-title {
  font-size: 18px;
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 15px;
  line-height: 1.4;
  padding-right: 30px;
}

.cxas-process-popup-text {
  font-size: 14px;
  color: rgba(255, 255, 255, 0.8);
  line-height: 1.7;
  margin: 0;
}

/* ============================================
   MOBILE STYLES - max-width: 991px
   UPDATED: Clockwise order starting from top center
   ============================================ */
@media (max-width: 991px) {
  /* Hide desktop cards content */
  .cxas-process-card {
    display: none !important;
  }

  /* Show mobile circle with numbers */
  .cxas-process-wrapper {
    position: relative;
    width: 100%;
    height: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 20px;
    transform: none;
    margin-bottom: 0;
  }

  .cxas-process-container {
    overflow: visible;
  }

  .cxas-process-circle {
    position: relative;
    top: auto;
    left: auto;
    transform: none;
    width: 320px;
    height: 320px;
  }

  /* Mobile Number Badges */
  .cxas-mobile-number {
    display: flex;
    position: absolute;
    width: 30px;
    height: 30px;
    background: linear-gradient(135deg, #ffa113 0%, #ff7828 100%);
    border-radius: 50%;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    font-weight: 700;
    color: #ffffff;
    cursor: pointer;
    z-index: 10;
    box-shadow: 0 0 20px rgba(255, 161, 19, 0.5);
    transition: all 0.3s ease;
  }

  .cxas-mobile-number:hover {
    transform: scale(1.15);
    box-shadow: 0 0 30px rgba(255, 161, 19, 0.8);
  }

  .cxas-mobile-number:active {
    transform: scale(0.95);
  }

  /* ============================================
     MATCHING DESKTOP ORDER:
     1 at top center → down left side → up right side
     ============================================ */

  /* Step 1 - Top center (12 o'clock) */
  .cxas-mobile-number[data-step="1"] {
    top: 10px;
    left: 50%;
    transform: translateX(-50%);
  }
  .cxas-mobile-number[data-step="1"]:hover {
    transform: translateX(-50%) scale(1.1);
  }

  /* Step 2 - Top left (11 o'clock) */
  .cxas-mobile-number[data-step="2"] {
    top: 30px;
    left: 70px;
  }

  /* Step 3 - Left upper (10 o'clock) */
  .cxas-mobile-number[data-step="3"] {
    top: 90px;
    left: 20px;
  }

  /* Step 4 - Left middle (9 o'clock) */
  .cxas-mobile-number[data-step="4"] {
    bottom: 125px;
    left: 10px;
  }

  /* Step 5 - Left lower (8 o'clock) */
  .cxas-mobile-number[data-step="5"] {
    bottom: 55px;
    left: 40px;
  }

  /* Step 6 - Bottom left (7 o'clock) */
  .cxas-mobile-number[data-step="6"] {
    bottom: 15px;
    left: 105px;
  }

  /* Step 7 - Bottom right (5 o'clock) */
  .cxas-mobile-number[data-step="7"] {
    bottom: 15px;
    right: 105px;
  }

  /* Step 8 - Right lower (4 o'clock) */
  .cxas-mobile-number[data-step="8"] {
    bottom: 55px;
    right: 40px;
  }

  /* Step 9 - Right middle (3 o'clock) */
  .cxas-mobile-number[data-step="9"] {
    top: 165px;
    right: 10px;
  }

  /* Step 10 - Right upper (2 o'clock) */
  .cxas-mobile-number[data-step="10"] {
    top: 90px;
    right: 20px;
  }

  /* Step 11 - Top right (1 o'clock) */
  .cxas-mobile-number[data-step="11"] {
    top: 30px;
    right: 70px;
  }

  /* Pulsing glow animation for step 1 */
  @keyframes pulseGlow {
    0%,
    100% {
      box-shadow:
        0 0 8px rgba(255, 200, 100, 0.5),
        0 0 15px rgba(255, 161, 19, 0.4);
    }
    50% {
      box-shadow:
        0 0 20px rgba(255, 220, 150, 1),
        0 0 40px rgba(255, 180, 80, 0.8),
        0 0 60px rgba(255, 161, 19, 0.6);
    }
  }

  .implementation-section.in-view .cxas-mobile-number[data-step="1"] {
    animation: pulseGlow 1.5s ease-in-out infinite;
  }

  .implementation-section.user-interacted .cxas-mobile-number[data-step="1"] {
    animation: none;
  }
  @keyframes pulseGlowScale {
    0%,
    100% {
      box-shadow:
        0 0 8px rgba(160, 210, 255, 0.5),
        0 0 15px rgba(120, 190, 255, 0.4);
    }
    50% {
      box-shadow:
        0 0 20px rgba(200, 235, 255, 1),
        0 0 40px rgba(150, 210, 255, 0.8),
        0 0 60px rgba(120, 190, 255, 0.6);
    }
  }

  .implementation-section.in-view .scale-mobile-number[data-step="1"] {
    animation: pulseGlowScale 1.5s ease-in-out infinite;
  }

  .implementation-section.user-interacted .scale-mobile-number[data-step="1"] {
    animation: none;
  }
  @keyframes pulseGlowAva {
    0%,
    100% {
      box-shadow:
        0 0 8px rgba(255, 235, 160, 0.5),
        0 0 15px rgba(255, 220, 120, 0.4);
    }
    50% {
      box-shadow:
        0 0 20px rgba(255, 245, 200, 1),
        0 0 40px rgba(255, 230, 150, 0.8),
        0 0 60px rgba(255, 220, 120, 0.6);
    }
  }

  .implementation-section.in-view .ava-mobile-number[data-step="1"] {
    animation: pulseGlowAva 1.5s ease-in-out infinite;
  }

  .implementation-section.user-interacted .ava-mobile-number[data-step="1"] {
    animation: none;
  }
}

/* ============================================
   480px BREAKPOINT - Adjusted positions for smaller circle
   ============================================ */
@media (max-width: 480px) {
  .cxas-process-circle {
    width: 280px;
    height: 280px;
  }

  /* Step 1 - Top center */
  .cxas-mobile-number[data-step="1"] {
    top: 7px;
  }

  /* Step 2 - Top left */
  .cxas-mobile-number[data-step="2"] {
    top: 25px;
    left: 60px;
  }

  /* Step 3 - Left upper */
  .cxas-mobile-number[data-step="3"] {
    top: 75px;
    left: 15px;
  }

  /* Step 4 - Left middle */
  .cxas-mobile-number[data-step="4"] {
    bottom: 106px;
    left: 5px;
  }

  /* Step 5 - Left lower */
  .cxas-mobile-number[data-step="5"] {
    bottom: 45px;
    left: 35px;
  }

  /* Step 6 - Bottom left */
  .cxas-mobile-number[data-step="6"] {
    bottom: 10px;
    left: 92px;
  }

  /* Step 7 - Bottom right */
  .cxas-mobile-number[data-step="7"] {
    bottom: 10px;
    right: 90px;
  }

  /* Step 8 - Right lower */
  .cxas-mobile-number[data-step="8"] {
    bottom: 45px;
    right: 35px;
  }

  /* Step 9 - Right middle */
  .cxas-mobile-number[data-step="9"] {
    top: 143px;
    right: 5px;
  }

  /* Step 10 - Right upper */
  .cxas-mobile-number[data-step="10"] {
    top: 75px;
    right: 15px;
  }

  /* Step 11 - Top right */
  .cxas-mobile-number[data-step="11"] {
    top: 25px;
    right: 60px;
  }

  .cxas-process-popup {
    padding: 25px;
    margin: 15px;
  }

  .cxas-process-popup-title {
    font-size: 16px;
  }

  .cxas-process-popup-text {
    font-size: 13px;
  }
}
/* ============================================
   ARBITRAIL AVA SERVICE PAGE STYLES
   ============================================ */

/* ============================================
   HERO SECTION
   ============================================ */
.ava-hero-section {
  position: relative;
  padding: 100px 0 60px;
  overflow: visible;
  z-index: 1;
}

.ava-hero-background {
  position: relative;
}

/* Left side decorations */
.ava-glow-left {
  position: absolute;
  top: -250px;
  left: -500px;
  width: 900px;
  height: 900px;
  opacity: 0.5;
  filter: blur(40px);
}

.ava-planet-top-left {
  position: absolute;
  width: 200px;
  height: 200px;
  top: 40px;
  left: -180px;
}

.ava-planet-mid-left {
  position: absolute;
  width: 100px;
  height: 100px;
  top: 140px;
  left: -90px;
}

/* Right side decorations */
/* .ava-glow-right {
  position: absolute;
  width: 700px;
  height: 700px;
  top: 125px;
  right: 200px;
  opacity: 0.5;
  filter: blur(50px);
} */

.ava-planet-top-right {
  position: absolute;
  width: 170px;
  height: 170px;
  top: 120px;
  right: 150px;
  animation: ava-float 8s ease-in-out infinite 0.5s;
  opacity: 0.9;
}

.ava-planet-mid-right {
  position: absolute;
  width: 120px;
  height: 120px;
  top: 400px;
  right: 80px;
  animation: ava-float 7s ease-in-out infinite 2s;
  opacity: 0.9;
}

@keyframes ava-float {
  0%,
  100% {
    transform: translateY(0) translateX(0);
  }
  25% {
    transform: translateY(-20px) translateX(10px);
  }
  50% {
    transform: translateY(-30px) translateX(-8px);
  }
  75% {
    transform: translateY(-15px) translateX(-12px);
  }
}

.ava-hero-content {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
}

.ava-hero-text {
  position: relative;
  z-index: 3;
}

.ava-brand-logo img {
  width: 150px;
  height: auto;
  margin-bottom: 10px !important;
}

.ava-logo-super {
  font-size: 14px;
  vertical-align: super;
  color: var(--saas-white);
}

.ava-hero-title {
  font-size: 50px;
  font-weight: 600;
  line-height: 1.1;
  color: var(--saas-heading);
  margin-bottom: 50px;
}

.ava-cta-button {
  background-color: #ffc107;
  color: #1a1a1a;
  border: none;
  padding: 18px 40px;
  font-size: 17px;
  font-weight: 600;
  border-radius: 8px;
  cursor: pointer;
  transition: all 0.3s ease;
  font-family: var(--saas-Inter);
}

.ava-cta-button:hover {
  background-color: #ffd54f;
  transform: translateY(-3px);
  box-shadow: 0 10px 25px rgba(255, 193, 7, 0.4);
}

.ava-hero-visual {
  position: relative;
  height: 500px;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 3;
}

.ava-hero-image {
  max-width: 600px;
  height: auto;
  position: relative;
  z-index: 4;
}

/* ============================================
   ABOUT SERVICE SECTION
   ============================================ */
.ava-about-service {
  padding: 60px 0 0;
  position: relative;
  overflow: visible;
  z-index: 1;
}

.ava-about-background {
  position: relative;
}

.ava_elements_holder {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 0;
}

/* Desktop - Default */
.ava-about-glow-left {
  position: absolute;
  width: 700px;
  height: 700px;
  bottom: -600px;
  left: calc(25% - 350px - 200px);
  opacity: 0.2;
}

/* Large Tablets and Small Desktops */
@media (max-width: 1400px) {
  .ava-about-glow-left {
    width: 600px;
    height: 600px;
    bottom: -500px;
    left: calc(50% - 300px - 150px);
  }
}

/* Tablets */
@media (max-width: 1024px) {
  .ava-about-glow-left {
    width: 500px;
    height: 500px;
    bottom: -400px;
    left: calc(50% - 250px - 100px);
  }
}

/* Small Tablets */
@media (max-width: 768px) {
  .ava-about-glow-left {
    width: 400px;
    height: 400px;
    bottom: -300px;
    left: calc(50% - 200px - 80px);
  }
}

@media (max-width: 576px) {
  .ava-about-glow-left {
    width: 300px;
    height: 300px;
    bottom: -200px;
    left: calc(50% - 150px - 50px);
  }
}

@media (max-width: 480px) {
  .ava-about-glow-left {
    width: 250px;
    height: 250px;
    bottom: -150px;
    left: calc(50% - 125px - 40px);
  }
}

.ava-about-planet-left {
  position: absolute;
  top: 180px;
  left: calc(50vw - 660px - 90px);
  transform: translateY(-50%);
  width: 200px;
  height: auto;
}

@media (max-width: 992px) {
  .ava-about-planet-left {
    left: -80px;
  }
}

.ava-about-wrapper {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  align-items: center;
  overflow: visible;
}

.ava-about-visual-side {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}

.ava-about-image {
  max-width: 720px;
  top: -410px;
  height: auto;
  position: absolute;
  z-index: 3;
}

.ava-about-text-side {
  padding: 80px 100px 80px 80px;
  position: relative;
  z-index: 3;
  text-align: end;
}

.ava-about-title {
  font-size: 36px;
  font-weight: 700;
  color: var(--saas-heading);
  margin-bottom: 25px;
}

.ava-about-description {
  font-size: 17px;
  color: var(--saas-description);
}

/* ============================================
   SERVICE DETAILS SECTION
   ============================================ */
.ava-service-details {
  padding: 60px 0;
  position: relative;
  z-index: 1;
}

.ava-details-wrapper {
  position: relative;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  z-index: 2;
}

.ava-detail-box {
  border-radius: 0;
  padding: 50px 45px;
  position: relative;
  z-index: 2;
}

.ava-detail-box-advantages {
  position: relative;
}

.ava-advantages-glow {
  position: absolute;
  top: 40px;
  right: -70px;
  width: 150px;
  height: 150px;
  pointer-events: none;
  z-index: -1;
}

.ava-glow-corner {
  width: 100%;
  height: 100%;
}

.ava-detail-title {
  font-size: 28px;
  font-weight: 700;
  color: var(--saas-heading);
  margin-bottom: 25px;
}

.ava-detail-text {
  font-size: 16px;
  color: var(--saas-description);
}

.ava-advantages-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.ava-advantages-list li {
  font-size: 16px;
  color: var(--saas-description);
  padding-left: 30px;
  position: relative;
  margin-bottom: 12px;
}

.ava-advantages-list li:before {
  content: "•";
  position: absolute;
  left: 10px;
  font-size: 20px;
}

/* ============================================
   AI AGENTS SECTION
   ============================================ */
.ava-ai-agents-section {
  padding: 0 0 100px;
  position: relative;
  z-index: 1;
}

.ava-ai-agents-background {
  position: relative;
}

.ava-ai-agents-glow-left {
  position: absolute;
  width: 600px;
  height: 600px;
  bottom: -400px;
  left: -200px;
  opacity: 0.5;
}

.ava-ai-agents-planet-left {
  position: absolute;
  width: 150px;
  height: 150px;
  bottom: -250px;
  left: -70px;
}

.ava-ai-agents-wrapper {
  position: relative;
  z-index: 2;
  padding: 60px 80px;
  border-radius: 0;
}

.ava-ai-agents-title {
  font-size: 30px;
  font-weight: 700;
  color: var(--saas-heading);
  text-align: center;
  margin-bottom: 40px;
}

.ava-ai-agents-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
}

.ava-ai-agent-item {
  font-size: 18px;
  color: var(--saas-description);
  text-align: center;
  padding: 15px;
}

/* ============================================
   IMPLEMENTATION PROCESS SECTION - DESKTOP
   ============================================ */
.implementation-section {
  padding: 60px 0;
  position: relative;
  overflow: hidden;
}

.implementation-title {
  font-size: 36px;
  font-weight: 700;
  color: var(--saas-heading);
  text-align: center;
  margin-bottom: 40px;
}

/* Main Container */
.ava-process-container {
  width: 100%;
  max-width: 1440px;
  margin: 0 auto;
  display: flex;
  justify-content: center;
  align-items: center;
}

/* Scalable wrapper - maintains aspect ratio */
.ava-process-wrapper {
  position: relative;
  width: 1440px;
  height: 800px;
  transform-origin: top center;
}

/* Center Circle */
.ava-process-circle {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 520px;
  height: 520px;
  z-index: 1;
}

.ava-process-circle img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

/* Content Cards Base Styles */
.ava-process-card {
  position: absolute;
  display: flex;
  align-items: center;
  gap: 15px;
  z-index: 2;
}

.ava-process-card-content {
  background: rgba(255, 255, 255, 0.1);
  box-shadow: 0 4px 30px rgb(183 160 216 / 20%);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border: 1px solid rgba(255, 255, 255, 0.3);
  border-radius: 100px;
  padding: 18px 30px;
  max-width: 405px;
}

.ava-process-card-title {
  font-size: 14px;
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 8px;
  line-height: 1.3;
}

.ava-process-card-text {
  font-size: 12px;
  font-weight: 400;
  color: #ffffff;
  line-height: 1.5;
  margin: 0;
}

.ava-process-card-number {
  width: 35px;
  height: 35px;
  background-color: #ffd014;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 15px;
  font-weight: 700;
  color: #ffffff;
  flex-shrink: 0;
  box-shadow: 0 0 20px rgba(255, 208, 20, 0.5);
}

.ava-process-card-number-left {
  position: absolute;
  right: -15px;
}

.ava-process-card-number-right {
  position: absolute;
  left: -15px;
  z-index: 1;
}

/* Card Positions - Left Side (1, 2, 3) */
.ava-process-card-1 {
  top: 100px;
  left: 155px;
  flex-direction: row;
  text-align: end;
}

.ava-process-card-2 {
  top: 340px;
  left: 50px;
  flex-direction: row;
  text-align: end;
}

.ava-process-card-3 {
  top: 570px;
  left: 155px;
  flex-direction: row;
  text-align: end;
}

/* Card Positions - Right Side (4, 5, 6) */
.ava-process-card-4 {
  top: 570px;
  right: 155px;
  flex-direction: row;
}

.ava-process-card-5 {
  top: 340px;
  right: 50px;
  flex-direction: row;
}

.ava-process-card-6 {
  top: 100px;
  right: 155px;
  flex-direction: row;
}

/* ============================================
   RESPONSIVE DESIGN
   ============================================ */
@media (max-width: 1200px) {
  .ava-hero-title {
    font-size: 35px;
  }

  .ava-about-title {
    font-size: 32px;
  }

  .ava-ai-agents-title {
    font-size: 36px;
  }

  .ava-planet-top-left,
  .ava-planet-top-right {
    width: 120px;
    height: 120px;
  }

  .ava-ai-agents-wrapper {
    padding: 50px 60px;
  }
  .ava-hero-image {
    max-width: 450px;
  }
  .ava-planet-top-left,
  .ava-planet-mid-left {
    display: none;
  }
}

@media (max-width: 968px) {
  .ava-about-wrapper,
  .ava-details-wrapper {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .ava-hero-title {
    font-size: 35px;
  }

  .ava-hero-visual {
    height: 400px;
  }

  .ava-about-text-side {
    padding: 60px 40px;
    text-align: left;
  }

  .ava-about-visual-side {
    padding: 40px;
    order: -1;
  }

  .ava-about-image {
    top: -190px;
    max-width: 400px;
  }

  .ava-ai-agents-wrapper {
    padding: 50px 40px;
  }
}

@media (max-width: 640px) {
  .container {
    padding: 0 20px;
  }

  .ava-hero-section {
    padding: 40px 0;
  }

  .ava-hero-title {
    font-size: 32px;
    margin-bottom: 30px;
  }

  .ava-about-title {
    font-size: 28px;
  }

  .ava-ai-agents-title {
    font-size: 30px;
    margin-bottom: 40px;
  }

  .ava-about-visual-side,
  .ava-about-text-side {
    padding: 40px 30px;
  }

  .ava-detail-box {
    padding: 35px 30px;
  }

  .ava-detail-title {
    font-size: 24px;
  }

  .ava-hero-visual {
    height: 300px;
  }

  .ava-hero-image {
    max-width: 100%;
  }

  .ava-ai-agents-wrapper {
    padding: 40px 30px;
  }

  .ava-ai-agent-item {
    font-size: 16px;
    padding: 15px;
  }

  .implementation-title {
    font-size: 28px;
  }
}

@media (max-width: 480px) {
  .ava-hero-title {
    font-size: 18px;
  }
  .ava-detail-title,
  .ava-ai-agents-title,
  .ava-about-title {
    font-size: 20px;
  }
  .ava-detail-text,
  .ava-about-description {
    font-size: 14px;
  }
  .ava-detail-title,
  .ava-about-title {
    margin-bottom: 10px;
  }

  .ava-cta-button {
    padding: 14px 30px;
    font-size: 15px;
  }

  .ava-detail-box {
    padding: 30px 25px;
  }

  .ava-advantages-list li {
    font-size: 14px;
    margin-bottom: 5px;
  }
  .ava-advantages-list li:before {
    font-size: 14px;
  }

  .ava-ai-agents-wrapper {
    padding: 35px 25px;
  }

  .ava-ai-agent-item {
    font-size: 15px;
    padding: 12px;
  }
  .ava-ai-agents-grid {
    grid-template-columns: 1fr;
  }

  .implementation-title {
    font-size: 24px;
  }
}

/* ============================================
   IMPLEMENTATION PROCESS - SCALE RESPONSIVE (Desktop)
   ============================================ */

/* Large screens - no scaling needed */
@media (min-width: 1441px) {
  .ava-process-container {
    overflow: visible;
  }

  .ava-process-wrapper {
    transform: scale(1);
  }
}

/* Desktop/Laptop - scale down proportionally */
@media (max-width: 1440px) and (min-width: 1201px) {
  .ava-process-container {
    overflow: visible;
  }

  .ava-process-wrapper {
    transform: scale(calc(100vw / 1500));
    margin-bottom: calc((800px * (100vw / 1500)) - 800px);
  }
}

@media (max-width: 1200px) and (min-width: 992px) {
  .ava-process-container {
    overflow: visible;
  }

  .ava-process-wrapper {
    transform: scale(0.75);
    margin-bottom: -200px;
  }
}

/* ============================================
   MOBILE IMPLEMENTATION PROCESS (max-width: 991px)
   Circle with clickable numbers and popup
   ============================================ */

/* Mobile Number Badges - Hidden on desktop */
.ava-mobile-number {
  display: none;
}

/* Process Popup - Hidden by default */
.ava-process-popup-overlay {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.8);
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
  z-index: 9999;
  justify-content: center;
  align-items: center;
  padding: 20px;
  box-sizing: border-box;
}

.ava-process-popup-overlay.active {
  display: flex;
}

.ava-process-popup {
  position: relative;
  background: linear-gradient(
    135deg,
    rgba(40, 35, 20, 0.95) 0%,
    rgba(30, 25, 15, 0.98) 100%
  );
  border: 1px solid rgba(255, 208, 20, 0.3);
  padding: 30px;
  max-width: 400px;
  width: 100%;
  box-shadow:
    0 20px 60px rgba(0, 0, 0, 0.5),
    0 0 40px rgba(255, 208, 20, 0.15);
  animation: avaPopupFadeIn 0.3s ease;
}

@keyframes avaPopupFadeIn {
  from {
    opacity: 0;
    transform: scale(0.9) translateY(20px);
  }
  to {
    opacity: 1;
    transform: scale(1) translateY(0);
  }
}

.ava-process-popup-close {
  position: absolute;
  top: 15px;
  right: 15px;
  width: 32px;
  height: 32px;
  background: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.3s ease;
  z-index: 10;
}

.ava-process-popup-close:hover {
  background: rgba(255, 208, 20, 0.3);
  border-color: rgba(255, 208, 20, 0.5);
  transform: rotate(90deg);
}

.ava-process-popup-close svg {
  width: 16px;
  height: 16px;
  stroke: #ffffff;
  stroke-width: 2;
}

.ava-process-popup-number {
  width: 50px;
  height: 50px;
  background: linear-gradient(135deg, #ffd014 0%, #ffb300 100%);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 20px;
  box-shadow: 0 0 30px rgba(255, 208, 20, 0.5);
}

.ava-process-popup-title {
  font-size: 18px;
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 15px;
  line-height: 1.4;
  padding-right: 30px;
}

.ava-process-popup-text {
  font-size: 14px;
  color: rgba(255, 255, 255, 0.8);
  line-height: 1.7;
  margin: 0;
}

/* Mobile styles for max-width: 991px */
@media (max-width: 991px) {
  /* Hide desktop cards content */
  .ava-process-card {
    display: none !important;
  }

  /* Show mobile circle with numbers */
  .ava-process-wrapper {
    position: relative;
    width: 100%;
    height: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 20px;
    transform: none;
    margin-bottom: 0;
  }

  .ava-process-container {
    overflow: visible;
  }

  .ava-process-circle {
    position: relative;
    top: auto;
    left: auto;
    transform: none;
    width: 320px;
    height: 320px;
  }

  /* Mobile Number Badges */
  .ava-mobile-number {
    display: flex;
    position: absolute;
    width: 40px;
    height: 40px;
    background: linear-gradient(135deg, #ffd014 0%, #ffb300 100%);
    border-radius: 50%;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    font-weight: 700;
    color: #ffffff;
    cursor: pointer;
    z-index: 10;
    box-shadow: 0 0 20px rgba(255, 208, 20, 0.5);
    transition: all 0.3s ease;
  }

  .ava-mobile-number:hover {
    transform: scale(1.15);
    box-shadow: 0 0 30px rgba(255, 208, 20, 0.8);
  }

  .ava-mobile-number:active {
    transform: scale(0.95);
  }

  .ava-mobile-number[data-step="1"] {
    top: 20px;
    left: 65px;
  }

  .ava-mobile-number[data-step="2"] {
    top: 50%;
    left: 0;
    transform: translateY(-50%);
  }
  .ava-mobile-number[data-step="2"]:hover {
    transform: translateY(-50%) scale(1.15);
  }

  .ava-mobile-number[data-step="3"] {
    bottom: 20px;
    left: 70px;
  }

  .ava-mobile-number[data-step="4"] {
    bottom: 20px;
    right: 70px;
  }

  .ava-mobile-number[data-step="5"] {
    top: 50%;
    right: 0;
    transform: translateY(-50%);
  }
  .ava-mobile-number[data-step="5"]:hover {
    transform: translateY(-50%) scale(1.15);
  }

  .ava-mobile-number[data-step="6"] {
    top: 20px;
    right: 65px;
  }
}

@media (max-width: 480px) {
  .ava-process-circle {
    width: 280px;
    height: 280px;
  }

  .ava-mobile-number {
    width: 36px;
    height: 36px;
    font-size: 14px;
  }

  .ava-mobile-number[data-step="2"] {
    left: 5px;
  }

  .ava-mobile-number[data-step="3"] {
    left: 55px;
  }

  .ava-mobile-number[data-step="4"] {
    right: 55px;
  }

  .ava-mobile-number[data-step="5"] {
    right: 5px;
  }

  .ava-process-popup {
    padding: 25px;
    margin: 15px;
  }

  .ava-process-popup-title {
    font-size: 16px;
  }

  .ava-process-popup-text {
    font-size: 13px;
  }
}

/* @media (max-width: 375px) {
  .ava-process-container {
    overflow: visible;
  }

  .ava-process-wrapper {
    transform: scale(0.26);
    margin-bottom: -592px;
  }
} */
/* Implementation Process */
/* Main Container */
.scale-hero-section {
  position: relative;
  padding: 60px 0;
  overflow: visible;
  z-index: 1;
}

.scale-hero-background {
  position: relative;
}

/* Left side decorations */
.scale-glow-left {
  position: absolute;
  top: -250px;
  left: -900px;
  opacity: 0.5;
}

.scale-planet-top-left {
  position: absolute;
  width: 200px;
  height: 200px;
  top: 15px;
  left: -180px;
}

.scale-planet-mid-left {
  position: absolute;
  width: 100px;
  height: 100px;
  top: 110px;
  left: -90px;
}

/* Right side decorations */
.scale-glow-right {
  position: absolute;
  width: 700px;
  height: 700px;
  top: 125px;
  right: 200px;
  opacity: 0.5;
  filter: blur(50px);
}

.scale-planet-top-right {
  position: absolute;
  width: 170px;
  height: 170px;
  top: 120px;
  right: 150px;
  animation: scale-float 8s ease-in-out infinite 0.5s;
  opacity: 0.9;
}

.scale-planet-mid-right {
  position: absolute;
  width: 120px;
  height: 120px;
  top: 400px;
  right: 80px;
  animation: scale-float 7s ease-in-out infinite 2s;
  opacity: 0.9;
}

@keyframes scale-float {
  0%,
  100% {
    transform: translateY(0) translateX(0);
  }
  25% {
    transform: translateY(-20px) translateX(10px);
  }
  50% {
    transform: translateY(-30px) translateX(-8px);
  }
  75% {
    transform: translateY(-15px) translateX(-12px);
  }
}

.scale-hero-content {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
}

.scale-hero-text {
  position: relative;
  z-index: 3;
}

.scale-logo-super {
  font-size: 14px;
  vertical-align: super;
  color: var(--saas-white);
}

.scale-hero-title {
  font-size: 50px;
  font-weight: 600;
  line-height: 1.1;
  color: var(--saas-heading);
  margin-bottom: 50px;
}

.scale-cta-button {
  background-color: var(--cyan);
  color: var(--saas-white);
  border: none;
  padding: 18px 40px;
  font-size: 17px;
  font-weight: 600;
  border-radius: 8px;
  cursor: pointer;
  transition: all 0.3s ease;
  font-family: var(--saas-Inter);
}

.scale-cta-button:hover {
  background-color: var(--cyan-light);
  transform: translateY(-3px);
  box-shadow: 0 10px 25px rgba(38, 198, 218, 0.4);
}

.scale-hero-visual {
  position: relative;
  height: 500px;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 3;
}

.scale-hero-image {
  max-width: 650px;
  height: auto;
  position: relative;
  z-index: 4;
}

/* ============================================
   ABOUT SERVICE SECTION
   ============================================ */
.scale-about-service {
  padding: 60px 0 0;
  position: relative;
  overflow: visible;
  z-index: 1;
}

.scale-about-background {
  position: relative;
}

.scale_elements_holder {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 0;
}

/* Desktop - Default */
.scale-about-glow-left {
  position: absolute;
  width: 900px;
  height: 900px;
  bottom: -900px;
  left: calc(25% - 350px - 200px);
  opacity: 0.2;
}

/* Large Tablets and Small Desktops */
@media (max-width: 1400px) {
  .scale-about-glow-left {
    width: 600px;
    height: 600px;
    bottom: -500px;
    left: calc(50% - 300px - 150px);
  }
}

/* Tablets */
@media (max-width: 1024px) {
  .scale-about-glow-left {
    bottom: -400px;
    left: calc(50% - 250px - 100px);
  }
}

/* Small Tablets */
@media (max-width: 768px) {
  .scale-about-glow-left {
    bottom: -300px;
    left: calc(50% - 200px - 80px);
  }
}

/* Mobile Landscape */
@media (max-width: 576px) {
  .scale-about-glow-left {
    bottom: -200px;
    left: calc(50% - 150px - 50px);
  }
}

/* Mobile Portrait */
@media (max-width: 480px) {
  .scale-about-glow-left {
    width: 650px;
    height: 650px;
    bottom: -250px;
    left: calc(50% - 125px - 40px);
    opacity: 0.2;
  }
}

.scale-about-planet-left {
  position: absolute;
  top: 165px;
  left: calc(53vw - 660px - 80px);
  transform: translateY(-50%);
  width: 200px;
  height: auto;
}

@media (max-width: 992px) {
  .scale-about-planet-left {
    left: -50px;
  }
}

.scale-about-planet-center {
  position: absolute;
  width: 120px;
  height: 120px;
  bottom: 330px;
  left: clamp(35%, 42%, 45%);
  transform: translateX(-50%);
}

@media (max-width: 1200px) {
  .scale-about-planet-center {
    left: 40%;
  }
}

@media (max-width: 768px) {
  .scale-about-planet-center {
    left: 38%;
    bottom: 250px;
  }
}

@media (max-width: 576px) {
  .scale-about-planet-center {
    left: 35%;
    bottom: 200px;
  }
}

.scale-about-wrapper {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  align-items: center;
  overflow: visible;
}

.scale-about-visual-side {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}

.scale-about-image {
  max-width: 720px;
  top: -380px;
  height: auto;
  position: absolute;
  z-index: 3;
}

.scale-about-text-side {
  padding: 80px 100px 80px 80px;
  position: relative;
  z-index: 3;
  text-align: end;
}

.scale-about-title {
  font-size: 36px;
  font-weight: 700;
  color: var(--saas-heading);
  margin-bottom: 25px;
}

.scale-about-description {
  font-size: 17px;
  color: var(--saas-description);
}

/* ============================================
   SERVICE DETAILS SECTION
   ============================================ */
.scale-service-details {
  padding: 60px 0;
  position: relative;
  z-index: 1;
}

.scale-details-wrapper {
  position: relative;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  z-index: 2;
}

.scale-detail-box {
  border-radius: 0;
  padding: 50px 45px;
  position: relative;
  z-index: 2;
}

.scale-detail-box-advantages {
  position: relative;
}

.scale-advantages-glow {
  position: absolute;
  bottom: -30px;
  right: -70px;
  width: 150px;
  height: 150px;
  pointer-events: none;
  z-index: -1;
}

.scale-glow-corner {
  width: 100%;
  height: 100%;
}

.scale-detail-title {
  font-size: 28px;
  font-weight: 700;
  color: var(--saas-heading);
  margin-bottom: 25px;
}

.scale-detail-text {
  font-size: 16px;
  color: var(--saas-description);
}

.scale-advantages-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.scale-advantages-list li {
  list-style: none;
  font-size: 16px;
  color: var(--saas-description);
  padding-left: 30px;
  position: relative;
}

.scale-advantages-list li:before {
  content: "•";
  position: absolute;
  left: 10px;
  font-size: 16px;
}

/* ============================================
   IMPLEMENTATION PROCESS SECTION - DESKTOP
   ============================================ */
.implementation-section {
  padding: 100px 0;
  position: relative;
  z-index: 1;
}

.implementation-title {
  font-size: 45px;
  font-weight: 600;
  color: var(--saas-heading);
  text-align: center;
}

.scale-process-container {
  width: 100%;
  max-width: 1440px;
  margin: 0 auto;
  display: flex;
  justify-content: center;
  align-items: center;
}

.scale-process-wrapper {
  position: relative;
  width: 1440px;
  height: 900px;
  transform-origin: top center;
}

.scale-process-circle {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 520px;
  height: 520px;
  z-index: 1;
}

.scale-process-circle img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.scale-process-card {
  position: absolute;
  display: flex;
  align-items: center;
  gap: 15px;
  z-index: 2;
}

.scale-process-card-content {
  background: rgba(255, 255, 255, 0.1);
  box-shadow: 0 4px 30px rgb(183 160 216 / 20%);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border: 1px solid rgba(255, 255, 255, 0.3);
  border-radius: 100px;
  padding: 18px 30px;
  max-width: 415px;
}

.scale-process-card-title {
  font-size: 14px;
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 8px;
  line-height: 1.3;
}

.scale-process-card-text {
  font-size: 12px;
  font-weight: 400;
  color: #ffffff;
  line-height: 1.5;
  margin: 0;
}

.scale-process-card-number {
  width: 35px;
  height: 35px;
  background-color: #38b6ff;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 15px;
  font-weight: 700;
  color: #ffffff;
  flex-shrink: 0;
  box-shadow: 0 0 20px rgba(0, 168, 255, 0.5);
}

.scale-process-card-number-top {
  position: absolute;
  right: 50%;
  left: 50%;
  transform: translateX(-50%);
  bottom: -15px;
}

.scale-process-card-number-left {
  position: absolute;
  right: -15px;
}

.scale-process-card-number-right {
  position: absolute;
  left: -15px;
  z-index: 1;
}

.scale-process-card-1 {
  top: 190px;
  left: 120px;
  flex-direction: row;
  text-align: end;
}

.scale-process-card-2 {
  top: 355px;
  left: 50px;
  flex-direction: row;
  text-align: end;
}

.scale-process-card-3 {
  top: 520px;
  left: 80px;
  flex-direction: row;
  text-align: end;
}

.scale-process-card-4 {
  top: 670px;
  left: 220px;
  flex-direction: row;
  text-align: end;
}

.scale-process-card-5 {
  top: 670px;
  right: 220px;
  flex-direction: row;
}

.scale-process-card-6 {
  top: 520px;
  right: 80px;
  flex-direction: row;
}

.scale-process-card-7 {
  top: 355px;
  right: 50px;
  flex-direction: row;
}

.scale-process-card-8 {
  top: 190px;
  right: 120px;
  flex-direction: row;
}

.scale-process-card-9 {
  top: 75px;
  left: 50%;
  transform: translateX(-50%);
  flex-direction: column;
  text-align: center;
}
/* @media (max-width: 1440px) and (min-width: 1201px) {
  .scale-process-container {
    overflow: visible;
  }

  .scale-process-wrapper {
    transform: scale(0.95);
  }
}

@media (max-width: 1200px) and (min-width: 992px) {
  .scale-process-container {
    overflow: visible;
  }

  .scale-process-wrapper {
    transform: scale(0.75);
    margin-bottom: -225px;
  }
} */
/* ============================================
   RESPONSIVE DESIGN
   ============================================ */
@media (max-width: 1399px) {
  .scale-hero-title {
    font-size: 40px;
  }
}
@media (max-width: 1200px) {
  .scale-hero-title {
    font-size: 35px;
  }

  .scale-hero-image {
    max-width: 450px;
  }

  .scale-about-planet-left {
    left: 0;
  }

  .scale-glow-right {
    right: 0;
    top: 165px;
    right: 30px;
  }

  .scale-advantages-glow {
    bottom: -75px;
    right: 30px;
  }

  .scale-about-title {
    font-size: 32px;
  }

  .implementation-title {
    font-size: 48px;
  }

  .scale-planet-top-left,
  .scale-planet-mid-left {
    display: none;
  }
}

@media (max-width: 968px) {
  .scale-details-wrapper {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .scale-hero-title {
    font-size: 25px;
  }

  .scale-hero-visual {
    height: 300px;
  }

  .scale-about-text-side {
    padding: 60px 40px;
  }

  .scale-about-visual-side {
    padding: 40px;
  }
}

@media (max-width: 768px) {
  .scale-planet-top-left,
  .scale-planet-mid-left {
    display: none;
  }

  .scale-about-image {
    top: -250px;
    max-width: 500px;
  }

  .scale-detail-title,
  .scale-about-title {
    font-size: 22px;
    margin-bottom: 10px;
  }

  .scale-advantages-list li,
  .scale-detail-text,
  .scale-about-description {
    font-size: 14px;
    line-height: 23px;
    margin: 0;
  }
}

@media (max-width: 640px) {
  .scale-container {
    padding: 0 20px;
  }

  .scale-hero-title {
    font-size: 18px;
  }

  .implementation-title {
    font-size: 30px;
  }

  .scale-about-visual-side,
  .scale-about-text-side {
    padding: 40px 30px;
    text-align: left;
  }

  .scale-detail-box {
    padding: 35px 30px;
  }

  .scale-glow-left {
    top: 550px;
    left: -900px;
    opacity: 0.3;
  }
  .scale-about-wrapper {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 576px) {
  .scale-hero-section {
    padding-bottom: 130px;
  }
}

@media (max-width: 480px) {
  .scale-brand-logo img {
    width: 150px;
    height: auto;
    margin-bottom: 10px !important;
  }

  .scale-hero-image {
    max-width: 250px;
  }
}

/* ============================================
   MOBILE IMPLEMENTATION PROCESS (max-width: 991px)
   Circle with clickable numbers and popup
   ============================================ */

.scale-mobile-number {
  display: none;
}

.scale-process-popup-overlay {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.8);
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
  z-index: 9999;
  justify-content: center;
  align-items: center;
  padding: 20px;
  box-sizing: border-box;
}

.scale-process-popup-overlay.active {
  display: flex;
}

.scale-process-popup {
  position: relative;
  background: linear-gradient(
    135deg,
    rgba(20, 30, 50, 0.95) 0%,
    rgba(15, 25, 40, 0.98) 100%
  );
  border: 1px solid rgba(56, 182, 255, 0.3);
  padding: 30px;
  max-width: 400px;
  width: 100%;
  box-shadow:
    0 20px 60px rgba(0, 0, 0, 0.5),
    0 0 40px rgba(56, 182, 255, 0.15);
  animation: scalePopupFadeIn 0.3s ease;
}

@keyframes scalePopupFadeIn {
  from {
    opacity: 0;
    transform: scale(0.9) translateY(20px);
  }
  to {
    opacity: 1;
    transform: scale(1) translateY(0);
  }
}

.scale-process-popup-close {
  position: absolute;
  top: 15px;
  right: 15px;
  width: 32px;
  height: 32px;
  background: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.3s ease;
  z-index: 10;
}

.scale-process-popup-close:hover {
  background: rgba(56, 182, 255, 0.3);
  border-color: rgba(56, 182, 255, 0.5);
  transform: rotate(90deg);
}

.scale-process-popup-close svg {
  width: 16px;
  height: 16px;
  stroke: #ffffff;
  stroke-width: 2;
}

.scale-process-popup-number {
  width: 50px;
  height: 50px;
  background: linear-gradient(135deg, #38b6ff 0%, #0088cc 100%);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 20px;
  box-shadow: 0 0 30px rgba(56, 182, 255, 0.5);
}

.scale-process-popup-title {
  font-size: 18px;
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 15px;
  line-height: 1.4;
  padding-right: 30px;
}

.scale-process-popup-text {
  font-size: 14px;
  color: rgba(255, 255, 255, 0.8);
  line-height: 1.7;
  margin: 0;
}

/* @media (max-width: 1399px) {
  .scale-process-card-1 {
    top: 210px;
    left: 80px;
  }
  .scale-process-card-2 {
    left: 20px;
  }
  .scale-process-card-3 {
    left: 45px;
  }
  .scale-process-card-4 {
    left: 160px;
  }
  .scale-process-card-5 {
    right: 160px;
  }
  .scale-process-card-6 {
    right: 45px;
  }
  .scale-process-card-7 {
    right: 20px;
  }
  .scale-process-card-8 {
    top: 210px;
    right: 80px;
  }
} */
@media (max-width: 991px) {
  .scale-process-card {
    display: none !important;
  }

  .scale-process-wrapper {
    position: relative;
    width: 100%;
    height: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 20px;
    transform: none;
    margin-bottom: 0;
  }

  .scale-process-container {
    overflow: visible;
  }

  .scale-process-circle {
    position: relative;
    top: auto;
    left: auto;
    transform: none;
    width: 320px;
    height: 320px;
  }

  .scale-mobile-number {
    display: flex;
    position: absolute;
    width: 30px;
    height: 30px;
    background: linear-gradient(135deg, #38b6ff 0%, #0088cc 100%);
    border-radius: 50%;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    font-weight: 700;
    color: #ffffff;
    cursor: pointer;
    z-index: 10;
    box-shadow: 0 0 20px rgba(56, 182, 255, 0.5);
    transition: all 0.3s ease;
  }

  .scale-mobile-number:hover {
    transform: scale(1.15);
    box-shadow: 0 0 30px rgba(56, 182, 255, 0.8);
  }

  .scale-mobile-number:active {
    transform: scale(0.95);
  }

  .scale-mobile-number[data-step="1"] {
    top: 10px;
    left: 50%;
    transform: translateX(-50%);
  }
  .scale-mobile-number[data-step="1"]:hover {
    transform: translateX(-50%) scale(1.15);
  }

  .scale-mobile-number[data-step="2"] {
    top: 40px;
    left: 60px;
  }

  .scale-mobile-number[data-step="3"] {
    top: 120px;
    left: 10px;
  }

  .scale-mobile-number[data-step="4"] {
    bottom: 75px;
    left: 25px;
  }

  .scale-mobile-number[data-step="5"] {
    bottom: 15px;
    left: 95px;
  }

  .scale-mobile-number[data-step="6"] {
    bottom: 15px;
    right: 95px;
  }

  .scale-mobile-number[data-step="7"] {
    bottom: 75px;
    right: 25px;
  }

  .scale-mobile-number[data-step="8"] {
    top: 120px;
    right: 10px;
  }

  .scale-mobile-number[data-step="9"] {
    top: 40px;
    right: 60px;
  }
}

@media (max-width: 480px) {
  .scale-process-circle {
    width: 280px;
    height: 280px;
  }

  .scale-mobile-number[data-step="1"] {
    top: 5px;
  }

  .scale-mobile-number[data-step="2"] {
    top: 35px;
    left: 45px;
  }

  .scale-mobile-number[data-step="3"] {
    top: 105px;
    left: 5px;
  }

  .scale-mobile-number[data-step="4"] {
    bottom: 65px;
    left: 20px;
  }

  .scale-mobile-number[data-step="5"] {
    bottom: 15px;
    left: 85px;
  }

  .scale-mobile-number[data-step="6"] {
    bottom: 15px;
    right: 85px;
  }

  .scale-mobile-number[data-step="7"] {
    bottom: 65px;
    right: 20px;
  }

  .scale-mobile-number[data-step="8"] {
    top: 105px;
    right: 5px;
  }

  .scale-mobile-number[data-step="9"] {
    top: 35px;
    right: 45px;
  }

  .scale-process-popup {
    padding: 25px;
    margin: 15px;
  }

  .scale-process-popup-title {
    font-size: 16px;
  }

  .scale-process-popup-text {
    font-size: 13px;
  }
}