@import url("https://cdn.hugeicons.com/font/hgi-stroke-rounded.css");
@import "./header.css";
:root {
  --white: #ffffff;
  --text: #0d0e10;
  --primary: #433ce7;
  --primary-dark: #2921d3;
  --secondary: #2563EB;
  --body: #676879;
  --purple: #5c3ef4;
  --violet: #581164;
  --bg-light: #fafafa;
  --tag: #f8f4ff;
  --tag2: #f7f3f7;

  --font-primary: "Whitney SSm", sans-serif;

  --radius-4: 4px;
  --radius-25: 25px;
  --radius-32: 32px;

  --transition: all 0.4s ease-in-out;
  --transition-fast: all 200ms linear;
}
html {
        scroll-behavior: smooth;
      }
.primary-text{
  color: var(--secondary);
}

.sub-head {
  font-weight: 600;
  color: var(--secondary);
  margin-bottom: 20px;
}

/* @import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Raleway:ital,wght@0,100..900;1,100..900&display=swap'); */
@font-face {
  font-family: "Whitney SSm";
  src: url("../fonts/Whitney-SSm-Book.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

* {
  box-sizing: border-box;
  font-family: "Whitney SSm", Arial, sans-serif !important;
}

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

body {
  font-size: 18px;
  font-weight: 500;
  /* font-family: var(--font-primary); */
  line-height: 28px;
  overflow-x: hidden !important;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: 700;

  text-transform: capitalize;
}

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

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

.sp2 {
  padding: 130px 0;
}

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

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

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

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

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

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

.sp10 {
  padding: 150px 0 40px;
}

.space10 {
  height: 10px;
}

.space14 {
  height: 14px;
}

.space12 {
  height: 12px;
}

.space16 {
  height: 16px;
}

.space20 {
  height: 20px;
}

.space24 {
  height: 24px;
}

.space30 {
  height: 30px;
}

.space32 {
  height: 32px;
}

.space40 {
  height: 40px;
}

.space50 {
  height: 50px;
}

.space60 {
  height: 60px;
}

.space70 {
  height: 70px;
}

.space80 {
  height: 80px;
}

.space90 {
  height: 90px;
}

.space100 {
  height: 100px;
}

@keyframes animation-6 {
  0% {
    transform: rotate(0);
  }
  100% {
    transform: rotate(-1000deg);
  }
}
@keyframes animation-7 {
  0% {
    transform: rotate(0);
  }
  100% {
    transform: rotate(-1000deg);
  }
}
.keyframe5 {
  position: relative;
  animation-name: animation-7;
  animation-duration: 40s;
  animation-iteration-count: infinite;
  animation-direction: alternate;
  animation-timing-function: cubic-bezier(0.59, 0.59, 1, 1);
}

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

@keyframes marquee {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translatex(-100%);
  }
}
@keyframes marquee-2 {
  0% {
    transform: translateX(-100%);
  }
  100% {
    transform: translatex(0);
  }
}
@keyframes animation-4 {
  0% {
    transform: scale(1);
    transform: translateY(10px);
  }
  100% {
    transform: scale(1);
  }
}
.aniamtion-key-3 {
  position: relative;
  animation-name: animation-4;
  animation-duration: 2s;
  animation-iteration-count: infinite;
  animation-direction: alternate;
}

@keyframes preloader {
  0% {
    transform: scale(0, 0);
    opacity: 0.5;
  }
  100% {
    transform: scale(1, 1);
    opacity: 0;
  }
}
@keyframes fade-in-down {
  0% {
    transform: translate3d(0, -50px, 0);
  }
  100% {
    opacity: 1;
    transform: none;
  }
}
@keyframes animation-1 {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(10px);
  }
}
@keyframes animation-2 {
  0% {
    transform: scale(1);
    transform: translateY(10px);
  }
  100% {
    transform: scale(1);
  }
}
.aniamtion-key-1 {
  position: relative;
  animation-name: animation-1;
  animation-duration: 2s;
  animation-iteration-count: infinite;
  animation-direction: alternate;
}

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

@keyframes pulse-border {
  0% {
    transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1);
    opacity: 1;
  }
  100% {
    transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5);
    opacity: 0;
  }
}
@keyframes animation-5 {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(1.1);
  }
}
.aniamtion-key-5 {
  position: relative;
  animation-name: animation-5;
  animation-duration: 1.3s;
  animation-iteration-count: infinite;
  animation-direction: alternate;
  transition: var(--transition);
}
.cta-button-dark {
  background-color: #fff; font-size: 18px; padding: 10px 30px; border-radius: 200px; border: 1px solid transparent;
  color: var(--secondary); text-decoration: none;
}
.cta-button-dark:hover {
  background-color: transparent; border: 1px solid #fff; color: #fff;
}
.cta-button-light {
  background-color: transparent; font-size: 18px; padding: 10px 30px; border-radius: 200px; border: 1px solid #fff;
  color: #fff; text-decoration: none;
}
.cta-button-light:hover {
  background-color: #fff; border: 1px solid #fff; color: var(--secondary);
}
/*============= TYPHOGRAPHY CSS AREA ENDS===============*/
/*============= COMMON CSS AREA ===============*/
.heading1 h1 {
  color: var(--white-100, #fff);
  text-align: center;
  font-family: var(--font-primary);
  font-size: 65px;
  font-style: normal;
  font-weight: 700;
  line-height: 75px;
  transition: var(--transition);
  margin-bottom: 16px;
  text-transform: capitalize;
}
@media (max-width: 767px) {
  .heading1 h1 {
    font-size: 34px;
    line-height: 50px;
  }
  .hero {
  padding: 40px 0%;
}
}

.heading2 h2 {
  color: var(--Text-Color, #0d0e10);
  font-family: var(--font-primary);
  font-size: 44px;
  font-style: normal;
  font-weight: 700;
  transition: var(--transition);
  line-height: 54px;
  text-transform: capitalize;
}
@media (max-width: 767px) {
  .heading2 h2 {
    font-size: 32px;
    line-height: 42px;
  }
}

.heading3 h1 {
  font-family: var(--font-primary);
  font-size: 46px;
  font-style: normal;
  font-weight: 700;
  transition: var(--transition);
  line-height: 60px;
  text-transform: capitalize;
}
@media (max-width: 767px) {
  .heading3 h1 {
    font-size: 32px;
    line-height: 42px;
  }
}

.heading4 h2 {
  color: var(--Text-Color, #0d0e10);
  text-align: center;
  font-family: var(--font-primary);
  font-size: 36px;
  font-style: normal;
  line-height: 48px;
  transition: var(--transition);
  text-transform: capitalize;
}
@media (max-width: 767px) {
  .heading4 h2 {
    font-size: 26px;
    line-height: 36px;
  }
}

.heading5 span.seo {
  font-size: 18px;
  font-weight: 500;
  color: var(--secondary);
  display: inline-block;
  border-radius: 4px;
  padding: 8px;
  transition: var(--transition);
  line-height: 18px;
  background: #ede9fd;
}
.heading5 h1 {
  font-family: var(--font-primary);
  font-size: 65px;
  line-height: 70px;
  font-weight: 700;
  transition: var(--transition);
  color: var(--Text-Color, #0d0e10);
  text-transform: capitalize;
}
@media (max-width: 767px) {
  .heading5 h1 {
    font-size: 32px;
    line-height: 42px;
  }
}
.heading5 p {
  font-family: var(--font-primary);
  font-weight: 500;
  color: var(--body);
  transition: var(--transition);
  font-size: 16px;
  line-height: 26px;
}


.heading6 h2 {
  font-family: var(--font-primary);
  font-size: 40px;
  line-height: 48px;
  font-weight: 700;
  color: var(--Text-Color, #0d0e10);
  transition: var(--transition);
  text-transform: capitalize;
}
@media (max-width: 767px) {
  .heading6 h2 {
    font-size: 32px;
    line-height: 42px;
  }
}
.heading6 p {
  font-family: var(--font-primary);
  font-weight: 500;
  color: var(--body);
  transition: var(--transition);
  font-size: 16px;
  line-height: 26px;
}

.tags span {
  font-family: var(--font-primary);
  font-weight: 500;
  color: var(--secondary);
  transition: var(--transition);
  font-size: 16px;
  line-height: 16px;
  display: inline-block;
  padding: 8px 12px;
  border-radius: 32px;
  background: var(--tag);
}

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

.tags2 span {
  font-family: var(--font-primary);
  font-size: 16px;
  font-weight: 700;
  color: var(--violet);
  transition: var(--transition);
  line-height: 16px;
  display: inline-block;
  background: var(--tag2);
  padding: 8px;
  border-radius: 4px;
}
.tags2 span img {
  margin: -4px 6px 0 0;
}
.tags2 span p {
  font-size: 16px;
  font-weight: 500;
  color: var(--body);
  font-family: var(--font-primary);
  line-height: 26px;
}

.tags3 span {
  font-weight: 500;
  font-family: var(--font-primary);
  font-size: 16px;
  display: inline-block;
  color: var(--purple);
  padding: 8px 12px;
  border-radius: 32px;
  line-height: 16px;
  background: #e8e6f9;
}

/*============= COMMON CSS AREA ENDS ===============*/
/*============= HEADER CSS AREA ===============*/
.header-area.homepage1 {
  position: absolute;
  width: 100%;
  z-index: 99999999;
}
.header-area.homepage1 .navbar {
  display: block;
}
.header-area.homepage1 .header-elements {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 24px;
  background: var(
    --Liner,
    linear-gradient(
      92deg,
      rgba(255, 255, 255, 0.4) -10.29%,
      rgba(255, 255, 255, 0.1) 98.27%
    )
  );
  padding: 10px 24px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 35px;
  transition: var(--transition);
}
.header-area.homepage1 .header-elements .site-log {
  margin-top: 5px;
}
.header-area.homepage1 .header-elements .main-menu .nav-item .nav-link.active {
  background: none;
  color: var(--white-100, #fff);
  opacity: 0.7;
}
.header-area.homepage1 .header-elements .main-menu ul li {
  display: inline-block;
  position: relative;
}
.header-area.homepage1
  .header-elements
  .main-menu
  ul
  li:hover
  ul.dropdown-padding {
  visibility: visible;
  transition: all 0.5s ease-in-out;
  opacity: 1;
  z-index: 9;
  top: 50px;
  position: absolute;
}
.header-area.homepage1 .header-elements .main-menu ul li a {
  font-family: var(--font-primary);
  font-size: 16px;
  font-weight: 500;
  color: var(--white-100, #fff);
  display: inline-block;
  transition: var(--transition);
  padding: 0 10px;
}
.header-area.homepage1 .header-elements .main-menu ul li ul.dropdown-padding {
  visibility: hidden;
  opacity: 0;
  box-shadow: rgba(0, 0, 0, 0.2) 0px 20px 30px;
  position: absolute;
  background: var(--white-100, #fff);
  top: 100px;
  width: 220px;
  z-index: 1;
  transition: var(--transition);
  border-radius: 5px;
  padding: 15px;
}
.header-area.homepage1
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li.main-small-menu {
  position: relative;
}
.header-area.homepage1
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li.main-small-menu:hover
  > a {
  color: var(--primary);
  transition: var(--transition);
  padding-left: 25px;
}
.header-area.homepage1
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li.main-small-menu:hover
  > a::after {
  color: var(--primary);
  transition: var(--transition);
  visibility: visible;
  opacity: 1;
}
.header-area.homepage1
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li.main-small-menu
  a {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.header-area.homepage1
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li.main-small-menu
  ul.small-dropdown {
  visibility: hidden;
  opacity: 0;
  box-shadow: rgba(0, 0, 0, 0.2) 0px 20px 30px;
  background: var(--white-100, #fff);
  position: absolute;
  top: 70px;
  width: 220px;
  z-index: 1;
  left: 195px;
  transition: var(--transition);
  border-radius: 5px;
  padding: 15px;
}
.header-area.homepage1
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li.main-small-menu:hover
  ul.small-dropdown {
  visibility: visible;
  transition: all 0.5s ease-in-out;
  opacity: 1;
  z-index: 9;
  top: 0;
  position: absolute;
}
.header-area.homepage1
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li {
  display: block;
}
.header-area.homepage1
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li
  a {
  font-family: var(--font-primary);
  font-weight: 500;
  color: var(--Text-Color, #0d0e10);
  padding: 8px;
  display: inline-block;
  position: relative;
  z-index: 1;
  border-radius: 4px;
  transition: var(--transition);
}
.header-area.homepage1
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li
  a::after {
  position: absolute;
  content: "";
  height: 2px;
  width: 10px;
  transition: var(--transition);
  z-index: -1;
  background: var(--primary);
  left: 10px;
  top: 22px;
  border-radius: 4px;
  display: inline-block;
  visibility: hidden;
  opacity: 0;
  transition: var(--transition);
}
.header-area.homepage1
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li
  a:hover {
  transition: var(--transition);
  color: var(--primary);
  padding-left: 25px;
}
.header-area.homepage1
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li
  a:hover::after {
  transition: var(--transition);
  border-radius: 4px;
  visibility: visible;
  transition: var(--transition);
  opacity: 1;
}
.header-area.homepage1 .navbar-expand {
  display: block;
}

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

.header-area.homepage2 {
  position: absolute;
  width: 100%;
  z-index: 2;
}
.header-area.homepage2 .navbar {
  display: block;
}
.header-area.homepage2 .header-elements {
  display: flex;
  align-self: center;
  justify-content: space-between;
  padding: 8px 0;
  transition: var(--transition);
}
.header-area.homepage2 .header-elements .site-logo {
  margin-top: 5px;
}
.header-area.homepage2 .header-elements .main-menu {
  display: flex;
  align-items: center;
}
.header-area.homepage2 .header-elements .main-menu .nav-item .nav-link.active {
  background: none;
  color: var(--secondary);
}
.header-area.homepage2 .header-elements .main-menu ul li {
  display: inline-block;
  position: relative;
}
.header-area.homepage2 .header-elements .main-menu ul li:hover > a {
  color: var(--secondary);
  transition: var(--transition);
}
.header-area.homepage2
  .header-elements
  .main-menu
  ul
  li:hover
  ul.dropdown-padding {
  visibility: visible;
  transition: all 0.5s ease-in-out;
  opacity: 1;
  z-index: 9;
  top: 50px;
  position: absolute;
}
.header-area.homepage2 .header-elements .main-menu ul li a {
  font-family: "Figtree", sans-serif !important;
  font-size: 16px;
  font-weight: 500;
  color: #000000;
  display: inline-block;
  transition: var(--transition);
  padding: 0 10px;
}
.header-area.homepage2 .header-elements .main-menu ul li ul.dropdown-padding {
  visibility: hidden;
  opacity: 0;
  box-shadow: rgba(0, 0, 0, 0.2) 0px 20px 30px;
  position: absolute;
  background: var(--white-100, #fff);
  top: 100px;
  width: 220px;
  z-index: 1;
  transition: var(--transition);
  border-radius: 5px;
  padding: 15px;
}
.header-area.homepage2
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li.main-small-menu {
  position: relative;
}
.header-area.homepage2
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li.main-small-menu:hover
  > a {
  color: var(--secondary);
  transition: var(--transition);
  padding-left: 25px;
}
.header-area.homepage2
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li.main-small-menu:hover
  > a::after {
  color: #fc4b3e;
  transition: var(--transition);
  visibility: visible;
  opacity: 1;
}
.header-area.homepage2
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li.main-small-menu
  a {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.header-area.homepage2
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li.main-small-menu
  ul.small-dropdown {
  visibility: hidden;
  opacity: 0;
  box-shadow: rgba(0, 0, 0, 0.2) 0px 20px 30px;
  background: var(--white-100, #fff);
  position: absolute;
  top: 70px;
  width: 220px;
  z-index: 1;
  left: 195px;
  transition: var(--transition);
  border-radius: 5px;
  padding: 15px;
}
.header-area.homepage2
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li.main-small-menu:hover
  ul.small-dropdown {
  visibility: visible;
  transition: all 0.5s ease-in-out;
  opacity: 1;
  z-index: 9;
  top: 0;
  position: absolute;
}
.header-area.homepage2
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li {
  display: block;
}
.header-area.homepage2
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li
  a {
  font-family: "Figtree", sans-serif !important;
  font-weight: 500;
  color: var(--Text-Color, #0d0e10);
  padding: 8px;
  display: inline-block;
  position: relative;
  z-index: 1;
  border-radius: 4px;
  transition: var(--transition);
}
.header-area.homepage2
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li
  a::after {
  position: absolute;
  content: "";
  height: 2px;
  width: 10px;
  transition: var(--transition);
  z-index: -1;
  background: #fc4b3e;
  left: 10px;
  top: 22px;
  border-radius: 4px;
  display: inline-block;
  visibility: hidden;
  opacity: 0;
  transition: var(--transition);
}
.header-area.homepage2
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li
  a:hover {
  transition: var(--transition);
  color: #fc4b3e;
  padding-left: 25px;
}
.header-area.homepage2
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li
  a:hover::after {
  transition: var(--transition);
  border-radius: 4px;
  visibility: visible;
  transition: var(--transition);
  opacity: 1;
}
.header-area.homepage2 .header-elements .main-menu .header-btn2 {
  margin: 0 16px 0 22px;
}

.header-area.homepage2.sticky {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  transform: translate3d(0, 0, 0);
  z-index: 111;
  animation-name: fade-in-down;
  animation-fill-mode: forwards;
  background-color: var(--secondary);
  transition: var(--transition);
  z-index: 99;
}
.header-area.homepage2.sticky .header-elements {
  margin-top: 0;
  transition: var(--transition);
  border: none;
  background: none;
  padding: 7px 0;
}

.header-area.homepage3 {
  position: absolute;
  width: 100%;
  z-index: 2;
}
.header-area.homepage3 .navbar {
  display: block;
}
.header-area.homepage3 .header-elements {
  display: flex;
  align-self: center;
  justify-content: space-between;
  transition: var(--transition);
  padding: 24px 0 0 0;
}
.header-area.homepage3 .header-elements .site-logo {
  margin-top: 14px;
}
.header-area.homepage3 .header-elements .main-menu {
  display: flex;
  align-items: center;
  padding: 12px 16px;
  transition: var(--transition);
  background: #ede9fd;
  border-radius: 4px;
}
.header-area.homepage3 .header-elements .main-menu .nav-item .nav-link.active {
  background: none;
  color: var(--secondary);
}
.header-area.homepage3 .header-elements .main-menu ul li {
  display: inline-block;
  position: relative;
}
.header-area.homepage3 .header-elements .main-menu ul li:hover > a {
  color: var(--secondary);
  transition: var(--transition);
}
.header-area.homepage3
  .header-elements
  .main-menu
  ul
  li:hover
  ul.dropdown-padding {
  visibility: visible;
  transition: all 0.5s ease-in-out;
  opacity: 1;
  z-index: 9;
  top: 50px;
  position: absolute;
}
.header-area.homepage3 .header-elements .main-menu ul li a {
  font-family: "Figtree", sans-serif !important;
  font-size: 16px;
  font-weight: 500;
  color: var(--Text-Color, #0d0e10);
  display: inline-block;
  transition: var(--transition);
  padding: 0 10px;
}
.header-area.homepage3 .header-elements .main-menu ul li ul.dropdown-padding {
  visibility: hidden;
  opacity: 0;
  box-shadow: rgba(0, 0, 0, 0.2) 0px 20px 30px;
  position: absolute;
  background: var(--white-100, #fff);
  top: 100px;
  width: 220px;
  z-index: 1;
  transition: var(--transition);
  border-radius: 5px;
  padding: 15px;
}
.header-area.homepage3
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li.main-small-menu {
  position: relative;
}
.header-area.homepage3
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li.main-small-menu:hover
  > a {
  color: var(--secondary);
  transition: var(--transition);
  padding-left: 25px;
}
.header-area.homepage3
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li.main-small-menu:hover
  > a::after {
  color: #fc4b3e;
  transition: var(--transition);
  visibility: visible;
  opacity: 1;
}
.header-area.homepage3
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li.main-small-menu
  a {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.header-area.homepage3
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li.main-small-menu
  ul.small-dropdown {
  visibility: hidden;
  opacity: 0;
  box-shadow: rgba(0, 0, 0, 0.2) 0px 20px 30px;
  background: var(--white-100, #fff);
  position: absolute;
  top: 70px;
  width: 220px;
  z-index: 1;
  left: 195px;
  transition: var(--transition);
  border-radius: 5px;
  padding: 15px;
}
.header-area.homepage3
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li.main-small-menu:hover
  ul.small-dropdown {
  visibility: visible;
  transition: all 0.5s ease-in-out;
  opacity: 1;
  z-index: 9;
  top: 0;
  position: absolute;
}
.header-area.homepage3
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li {
  display: block;
}
.header-area.homepage3
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li
  a {
  font-family: "Figtree", sans-serif !important;
  font-weight: 500;
  color: var(--Text-Color, #0d0e10);
  padding: 8px;
  display: inline-block;
  position: relative;
  z-index: 1;
  border-radius: 4px;
  transition: var(--transition);
}
.header-area.homepage3
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li
  a::after {
  position: absolute;
  content: "";
  height: 2px;
  width: 10px;
  transition: var(--transition);
  z-index: -1;
  background: var(--secondary);
  left: 10px;
  top: 22px;
  border-radius: 4px;
  display: inline-block;
  visibility: hidden;
  opacity: 0;
  transition: var(--transition);
}
.header-area.homepage3
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li
  a:hover {
  transition: var(--transition);
  color: var(--secondary);
  padding-left: 25px;
}
.header-area.homepage3
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li
  a:hover::after {
  transition: var(--transition);
  border-radius: 4px;
  visibility: visible;
  transition: var(--transition);
  opacity: 1;
}
.header-area.homepage3 .header-elements .header-padding ul li a {
  padding: 0 14px;
}

.header-area.homepage3.sticky {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  transform: translate3d(0, 0, 0);
  z-index: 111;
  animation-name: fade-in-down;
  animation-fill-mode: forwards;
  background-color: var(--white-100, #fff);
  box-shadow: 0px 4px 30px 0px rgba(0, 0, 0, 0.08);
  transition: var(--transition);
  z-index: 99;
}
.header-area.homepage3.sticky .header-elements {
  margin-top: 0;
  transition: var(--transition);
  border: none;
  background: none;
  padding: 14px 0;
}
.header-area.homepage3.sticky .header-elements .main-menu {
  background: none;
  transition: var(--transition);
}

.header-area.homepage4 {
  position: absolute;
  width: 100%;
  z-index: 2;
}
.header-area.homepage4 .navbar {
  display: block;
}
.header-area.homepage4 .header-elements {
  display: flex;
  align-self: center;
  justify-content: space-between;
  padding: 16px 16px;
  transition: var(--transition);
  background: var(--white-100, #fff);
  border-radius: 0 0 4px 4px;
}
.header-area.homepage4 .header-elements .site-logo {
  margin-top: 5px;
  display: flex;
  align-items: center;
}
.header-area.homepage4 .header-elements .main-menu {
  display: flex;
  align-items: center;
  margin-left: 50px;
}
.header-area.homepage4 .header-elements .main-menu .nav-item .nav-link.active {
  background: none;
  color: var(--violet);
}
.header-area.homepage4 .header-elements .main-menu ul li {
  display: inline-block;
  position: relative;
}
.header-area.homepage4 .header-elements .main-menu ul li:hover > a {
  color: var(--violet);
  transition: var(--transition);
}
.header-area.homepage4
  .header-elements
  .main-menu
  ul
  li:hover
  ul.dropdown-padding {
  visibility: visible;
  transition: all 0.5s ease-in-out;
  opacity: 1;
  z-index: 9;
  top: 50px;
  position: absolute;
}
.header-area.homepage4 .header-elements .main-menu ul li a {
  font-family: "Figtree", sans-serif !important;
  font-size: 16px;
  font-weight: 500;
  color: var(--Text-Color, #0d0e10);
  display: inline-block;
  transition: var(--transition);
  padding: 0 10px;
}
.header-area.homepage4 .header-elements .main-menu ul li ul.dropdown-padding {
  visibility: hidden;
  opacity: 0;
  box-shadow: rgba(0, 0, 0, 0.2) 0px 20px 30px;
  position: absolute;
  background: var(--white-100, #fff);
  top: 100px;
  width: 220px;
  z-index: 1;
  transition: var(--transition);
  border-radius: 5px;
  padding: 15px;
}
.header-area.homepage4
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li.main-small-menu {
  position: relative;
}
.header-area.homepage4
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li.main-small-menu:hover
  > a {
  color: var(--violet);
  transition: var(--transition);
  padding-left: 25px;
}
.header-area.homepage4
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li.main-small-menu:hover
  > a::after {
  color: var(--violet);
  transition: var(--transition);
  visibility: visible;
  opacity: 1;
}
.header-area.homepage4
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li.main-small-menu
  a {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.header-area.homepage4
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li.main-small-menu
  ul.small-dropdown {
  visibility: hidden;
  opacity: 0;
  box-shadow: rgba(0, 0, 0, 0.2) 0px 20px 30px;
  background: var(--white-100, #fff);
  position: absolute;
  top: 70px;
  width: 220px;
  z-index: 1;
  left: 195px;
  transition: var(--transition);
  border-radius: 5px;
  padding: 15px;
}
.header-area.homepage4
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li.main-small-menu:hover
  ul.small-dropdown {
  visibility: visible;
  transition: all 0.5s ease-in-out;
  opacity: 1;
  z-index: 9;
  top: 0;
  position: absolute;
}
.header-area.homepage4
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li {
  display: block;
}
.header-area.homepage4
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li
  a {
  font-family: "Figtree", sans-serif !important;
  font-weight: 500;
  color: var(--Text-Color, #0d0e10);
  padding: 8px;
  display: inline-block;
  position: relative;
  z-index: 1;
  border-radius: 4px;
  transition: var(--transition);
}
.header-area.homepage4
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li
  a::after {
  position: absolute;
  content: "";
  height: 2px;
  width: 10px;
  transition: var(--transition);
  z-index: -1;
  background: var(--violet);
  left: 10px;
  top: 22px;
  border-radius: 4px;
  display: inline-block;
  visibility: hidden;
  opacity: 0;
  transition: var(--transition);
}
.header-area.homepage4
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li
  a:hover {
  transition: var(--transition);
  color: var(--violet);
  padding-left: 25px;
}
.header-area.homepage4
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li
  a:hover::after {
  transition: var(--transition);
  border-radius: 4px;
  visibility: visible;
  transition: var(--transition);
  opacity: 1;
}
.header-area.homepage4 .header-elements .main-menu .header-btn2 {
  margin: 0 16px 0 22px;
}

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

.header-area.homepage5 {
  position: absolute;
  width: 100%;
  z-index: 9999;
}
.header-area.homepage5 .navbar {
  display: block;
}
.header-area.homepage5 .header-elements {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 24px;
  background: var(
    --Liner,
    linear-gradient(
      92deg,
      rgba(255, 255, 255, 0.4) -10.29%,
      rgba(255, 255, 255, 0.1) 98.27%
    )
  );
  padding: 10px 24px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 35px;
  transition: var(--transition);
}
.header-area.homepage5 .header-elements .site-log {
  margin-top: 5px;
}
.header-area.homepage5 .header-elements .main-menu .nav-item .nav-link.active {
  background: none;
  color: var(--purple);
}
.header-area.homepage5 .header-elements .main-menu ul li {
  display: inline-block;
  position: relative;
}
.header-area.homepage5 .header-elements .main-menu ul li:hover > a {
  color: var(--purple);
  transition: var(--transition);
}
.header-area.homepage5 .header-elements .main-menu ul li:hover {
  color: var(--purple);
}
.header-area.homepage5
  .header-elements
  .main-menu
  ul
  li:hover
  ul.dropdown-padding {
  visibility: visible;
  transition: all 0.5s ease-in-out;
  opacity: 1;
  z-index: 9;
  top: 50px;
  position: absolute;
}
.header-area.homepage5 .header-elements .main-menu ul li a {
  font-family: var(--font-primary);
  font-size: 16px;
  font-weight: 500;
  color: var(--white-100, #fff);
  display: inline-block;
  transition: var(--transition);
  padding: 0 10px;
}
.header-area.homepage5 .header-elements .main-menu ul li ul.dropdown-padding {
  visibility: hidden;
  opacity: 0;
  box-shadow: rgba(0, 0, 0, 0.2) 0px 20px 30px;
  position: absolute;
  background: var(--white-100, #fff);
  top: 100px;
  width: 220px;
  z-index: 1;
  transition: var(--transition);
  border-radius: 5px;
  padding: 15px;
}
.header-area.homepage5
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li.main-small-menu {
  position: relative;
}
.header-area.homepage5
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li.main-small-menu:hover
  > a {
  color: var(--purple);
  transition: var(--transition);
  padding-left: 25px;
}
.header-area.homepage5
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li.main-small-menu:hover
  > a::after {
  color: var(--purple);
  transition: var(--transition);
  visibility: visible;
  opacity: 1;
}
.header-area.homepage5
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li.main-small-menu
  a {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.header-area.homepage5
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li.main-small-menu
  ul.small-dropdown {
  visibility: hidden;
  opacity: 0;
  box-shadow: rgba(0, 0, 0, 0.2) 0px 20px 30px;
  background: var(--white-100, #fff);
  position: absolute;
  top: 70px;
  width: 220px;
  z-index: 1;
  left: 195px;
  transition: var(--transition);
  border-radius: 5px;
  padding: 15px;
}
.header-area.homepage5
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li.main-small-menu:hover
  ul.small-dropdown {
  visibility: visible;
  transition: all 0.5s ease-in-out;
  opacity: 1;
  z-index: 9;
  top: 0;
  position: absolute;
}
.header-area.homepage5
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li {
  display: block;
}
.header-area.homepage5
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li
  a {
  font-family: var(--font-primary);
  font-weight: 500;
  color: var(--Text-Color, #0d0e10);
  padding: 8px;
  display: inline-block;
  position: relative;
  z-index: 1;
  border-radius: 4px;
  transition: var(--transition);
}
.header-area.homepage5
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li
  a::after {
  position: absolute;
  content: "";
  height: 2px;
  width: 10px;
  transition: var(--transition);
  z-index: -1;
  background: var(--purple);
  left: 10px;
  top: 22px;
  border-radius: 4px;
  display: inline-block;
  visibility: hidden;
  opacity: 0;
  transition: var(--transition);
}
.header-area.homepage5
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li
  a:hover {
  transition: var(--transition);
  color: var(--purple);
  padding-left: 25px;
}
.header-area.homepage5
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li
  a:hover::after {
  transition: var(--transition);
  border-radius: 4px;
  visibility: visible;
  transition: var(--transition);
  opacity: 1;
}
.header-area.homepage5 .navbar-expand {
  display: block;
}

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

/*============= HEADER CSS AREA ENDS===============*/
/*============= WELCOME CSS AREA ===============*/
.welocme1-section-area {
  position: relative;
  padding: 190px 0 400px;
}
@media (max-width: 767px) {
  .welocme1-section-area {
    padding: 120px 0 270px;
  }
}
.welocme1-section-area .welcome-content-header {
  text-align: center;
  position: relative;
  z-index: 2;
}
.welocme1-section-area .welcome-content-header .elementors-img {
  position: absolute;
  top: -175px;
  left: 15%;
  right: 15%;
  z-index: -1;
}
.welocme1-section-area .welcome-content-header p {
  color: var(--white-100, #fff);
  text-align: center;
  font-family: var(--font-primary);
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 28px;
  opacity: 0.8;
}
.welocme1-section-area .welcome-content-header h1 {
  color: var(--white-100, #fff);
  text-align: center;
  font-family: var(--font-primary);
  font-size: 65px;
  font-style: normal;
  font-weight: 700;
  line-height: 75px;
  margin-bottom: 16px;
  position: relative;
}
@media (max-width: 767px) {
  .welocme1-section-area .welcome-content-header h1 {
    font-size: 34px;
    line-height: 50px;
  }
}
.welocme1-section-area .welcome-content-header .welcome-btnarea .header-btn {
  margin-top: 32px;
}
.welocme1-section-area .welcome-content-header .welcome-btnarea .header-btn1 {
  margin-top: 32px;
  margin-left: 16px;
}
@media (max-width: 767px) {
  .welocme1-section-area .welcome-content-header .welcome-btnarea .header-btn1 {
    margin-left: 0;
  }
}

.welcome2-section-area {
  padding: 100px 0 76px;
  position: relative;
  background-color: #00328f;
}

.welcome2-section-area  .sub-head-tag{
  background-color: #ffffff50 !important;
}

@media (max-width: 767px) {
  .welcome2-section-area {
    padding: 50px 0 70px;
  }
  .brand2-section-area{
    padding: 40px 0 !important;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .welcome2-section-area {
    padding: 150px 0 0;
  }
}
.welcome2-section-area .welcome2-header {
  padding: 0 35px 0 0;
}
@media (max-width: 767px) {
  .welcome2-section-area .welcome2-header {
    padding: 0;
  }
}
.sub-head-tag {
  display: inline-block;
  background: #549eff;
background: linear-gradient(281deg, rgba(84, 158, 255, 1) 0%, rgba(7, 79, 174, 1) 85%);
  color: var(--white);
  font-family: var(--font-primary);
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  padding: 8px 20px;
  border-radius: 35px;
  margin-bottom: 16px;
}
.welcome2-section-area .welcome2-header p {
  color: rgb(0 0 0 / 80%);
  font-family: var(--font-primary);
  font-size: 18px;
  font-style: normal;
  font-weight: 500;
  line-height: 28px;
  margin-top: 16px;
}
.welcome2-section-area .welcome2-header .header-btn2 {
  margin-top: 32px;
}
.welcome2-section-area .welcome2-header .header-btn3 {
  margin-top: 32px;
  margin-left: 16px;
}
@media (max-width: 767px) {
  .welcome2-section-area .welcome2-header .header-btn3 {
    margin-left: 0;
  }
}
.welcome2-section-area .header-images-area {
  position: relative;
}
@media (max-width: 767px) {
  .welcome2-section-area .header-images-area {
    margin-top: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .welcome2-section-area .header-images-area {
    margin-top: 30px;
  }
}
.welcome2-section-area .header-images-area .header-elements1 {
  position: absolute;
  transform: translate(0px, 35px);
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .welcome2-section-area .header-images-area .header-elements1 {
    height: 100%;
    width: 100%;
  }
}
.welcome2-section-area .header-images-area .header-elements1 img {
  height: 100%;
  width: 100%;
  -o-object-fit: contain;
  object-fit: contain;
}
.welcome2-section-area .header-images-area .header-elements2 {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  position: relative;
  z-index: 1;
  transform: translateX(-120px);
}
.welcome2-section-area .header-images-area .header-elements2 img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

.welcome3-section-area {
  padding: 170px 0 200px;
  position: relative;
}
@media (max-width: 767px) {
  .welcome3-section-area {
    padding: 150px 0 50px;
  }
}
.welcome3-section-area .welcome3-header .unlock {
  display: inline-block;
  font-size: 16px;
  font-weight: 700;
  color: var(--secondary);
  font-family: var(--font-primary);
  padding: 16px;
  text-decoration: underline;
  line-height: 16px;
}
@media (max-width: 767px) {
  .welcome3-section-area .welcome3-header {
    margin-bottom: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .welcome3-section-area .welcome3-header {
    margin-bottom: 30px;
  }
}
.welcome3-section-area .welcome3-images {
  position: relative;
}
.welcome3-section-area .welcome3-images .header3-img2 {
  position: absolute;
  width: 235px;
  height: 201px;
  -o-object-fit: cover;
  object-fit: cover;
  left: -100px;
  bottom: -100px;
}
@media (max-width: 767px) {
  .welcome3-section-area .welcome3-images .header3-img2 {
    position: relative;
    width: 100%;
    height: 100%;
    margin-top: 20px;
    left: 0;
    bottom: 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .welcome3-section-area .welcome3-images .header3-img2 {
    position: relative;
    width: 100%;
    height: 100%;
    margin-top: 20px;
    left: 0;
    bottom: 0;
  }
}
.welcome3-section-area .welcome3-images img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

.welcome4-section-area {
  position: relative;
  padding: 150px 0 60px;
}
@media (max-width: 767px) {
  .welcome4-section-area {
    padding: 150px 0 0;
  }
}
.welcome4-section-area .welcome4-header.heading5 {
  position: relative;
  padding: 0 45px 0 0;
}
.welcome4-section-area .welcome4-header.heading5 p {
  color: var(--Text-Color, #0d0e10);
}
@media (max-width: 767px) {
  .welcome4-section-area .welcome4-header.heading5 {
    padding: 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .welcome4-section-area .welcome4-header.heading5 {
    padding: 0;
  }
}
.welcome4-section-area .welcome4-header.heading5 span {
  font-family: var(--font-primary);
  font-size: 16px;
  font-weight: 700;
  color: var(--violet);
  transition: var(--transition);
  line-height: 16px;
  display: inline-block;
  background: #e7d8ed;
  padding: 8px;
  border-radius: 4px;
}
.welcome4-section-area .welcome4-header.heading5 span img {
  margin: -4px 6px 0 0;
}
.welcome4-section-area .welcome4-header.heading5 span p {
  font-size: 16px;
  font-weight: 500;
  color: #000 !important;
  font-family: var(--font-primary);
  line-height: 26px;
}
.welcome4-section-area .welcome4-header.heading5 .btn-area .header-btn6 {
  text-decoration: underline;
}
.welcome4-section-area .welcome4-header.heading5 .btn-area .header-btn6 i {
  margin: 0 6px 0 0;
}
.welcome4-section-area .welcome4-images-area {
  position: relative;
}
.welcome4-section-area .welcome4-images-area .main-img {
  position: relative;
  z-index: 1;
}
.welcome4-section-area .welcome4-images-area .main-img img {
  height: 100%;
  width: 100%;
  border-radius: 4px;
  position: relative;
  z-index: 1;
}
.welcome4-section-area .welcome4-images-area .main-img .header4-bg2 {
  position: absolute;
  height: 420px;
  width: 420px;
  -o-object-fit: cover;
  object-fit: cover;
  left: 13%;
  top: 26%;
  border-radius: 50%;
  z-index: -1;
}
@media (max-width: 767px) {
  .welcome4-section-area .welcome4-images-area .main-img .header4-bg2 {
    position: absolute;
    width: 250px;
    left: 40px;
    top: 22%;
    height: 250px;
  }
}
.welcome4-section-area .welcome4-images-area .header4-img1 {
  height: 136px;
  width: 288px;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 4px;
  position: absolute;
  top: 40%;
  right: -50px;
  z-index: 2;
}
@media (max-width: 767px) {
  .welcome4-section-area .welcome4-images-area .header4-img1 {
    position: relative;
    width: 100%;
    left: 0;
    top: 20px;
    height: 100%;
    right: 0;
  }
}
.welcome4-section-area .welcome4-images-area .header4-img2 {
  height: 250px;
  width: 250px;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 4px;
  position: absolute;
  bottom: 50px;
  left: -50px;
  z-index: 1;
}
@media (max-width: 767px) {
  .welcome4-section-area .welcome4-images-area .header4-img2 {
    position: relative;
    width: 100%;
    left: 0;
    top: -40px;
    height: 100%;
  }
}
.welcome4-section-area .welcome4-images-area .header4-elements {
  position: absolute;
  top: 37%;
  left: -50px;
}
@media (max-width: 767px) {
  .welcome4-section-area .welcome4-images-area .header4-elements {
    display: none;
  }
}
.welcome4-section-area .welcome4-images-area p {
  color: var(--Text-Color, #0d0e10);
  font-family: var(--font-primary);
  font-size: 16px;
  font-weight: 700;
  display: inline-block;
  background: var(--white-100, #fff);
  padding: 8px;
  line-height: 16px;
  border-radius: 4px;
  position: absolute;
  bottom: 80px;
  right: -30px;
  z-index: 1;
}
.welcome4-section-area .welcome4-images-area p span {
  color: var(--violet);
}
@media (max-width: 767px) {
  .welcome4-section-area .welcome4-images-area p {
    position: relative;
    left: 0;
  }
}

.welcome5-section-area {
  padding: 60px 0 60px;
  position: relative;
  z-index: 1;
}
.welcome5-section-area .elements1 {
  position: absolute;
  top: 10%;
  z-index: -1;
}
.welcome5-section-area .elements2 {
  position: absolute;
  top: 35%;
  left: 100px;
  z-index: -1;
}
.welcome5-section-area .elements3 {
  position: absolute;
  right: 0px;
  top: 10%;
  z-index: -1;
}
.welcome5-section-area .elements4 {
  position: absolute;
  top: 35%;
  right: 0;
  z-index: -1;
  transform: rotate(180deg);
}
.welcome5-section-area .welcome5-header-area {
  margin-top: 120px;
}
.welcome5-section-area .welcome5-header-area .header-btn9 {
  margin-left: 16px;
}
@media (max-width: 767px) {
  .welcome5-section-area .welcome5-header-area .header-btn9 {
    margin-left: 0;
    margin-top: 20px;
  }
}
.welcome5-section-area .welcome5-images-area {
  position: relative;
  z-index: 1;
}
.welcome5-section-area .welcome5-images-area .img1 img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 4px;
}
.welcome5-section-area .welcome5-images-area .img1 .header5-img2 {
  height: 190px;
  width: 258px;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 4px;
  position: absolute;
  bottom: 50px;
  right: 0;
}
@media (max-width: 767px) {
  .welcome5-section-area .welcome5-images-area .img1 .header5-img2 {
    height: 100%;
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    border-radius: 4px;
    position: relative;
    top: 20px;
  }
}
.welcome5-section-area .welcome5-images-area .content-elements {
  text-align: center;
  position: absolute;
  bottom: 200px;
  right: -157px;
  z-index: -1;
}
@media (max-width: 767px) {
  .welcome5-section-area .welcome5-images-area .content-elements {
    display: none;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .welcome5-section-area .welcome5-images-area .content-elements {
    display: none;
  }
}
.welcome5-section-area .welcome5-images-area .content-elements p {
  color: var(--white-100, #fff);
  font-size: 24px;
  line-height: 28px;
  font-weight: 700;
  font-family: var(--font-primary);
}
.welcome5-section-area .welcome5-images-area .content-elements img {
  position: relative;
  right: 30px;
  top: 10px;
}
.welcome5-section-area .welcome5-images-area .content1-elements {
  text-align: center;
  position: absolute;
  top: 120px;
  left: -100px;
  z-index: -1;
}
@media (max-width: 767px) {
  .welcome5-section-area .welcome5-images-area .content1-elements {
    display: none;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .welcome5-section-area .welcome5-images-area .content1-elements {
    display: none;
  }
}
.welcome5-section-area .welcome5-images-area .content1-elements p {
  color: var(--white-100, #fff);
  font-size: 24px;
  line-height: 28px;
  font-weight: 700;
  font-family: var(--font-primary);
  text-align: center;
  position: relative;
  left: -140px;
}
.welcome5-section-area .welcome5-images-area .content1-elements img {
  position: relative;
  top: 10px;
}
.welcome5-section-area .welcome5-images-area .content2-elements {
  text-align: center;
  position: absolute;
  bottom: 170px;
  left: -50px;
  z-index: -1;
}
@media (max-width: 767px) {
  .welcome5-section-area .welcome5-images-area .content2-elements {
    display: none;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .welcome5-section-area .welcome5-images-area .content2-elements {
    display: none;
  }
}
.welcome5-section-area .welcome5-images-area .content2-elements p {
  color: var(--white-100, #fff);
  font-size: 24px;
  line-height: 28px;
  font-weight: 700;
  font-family: var(--font-primary);
  position: relative;
  left: -50px;
}
.welcome5-section-area .welcome5-images-area .content2-elements img {
  position: relative;
  left: 0px;
  top: 10px;
}

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

.preloader {
  width: 70px;
  height: 70px;
  display: inline-block;
  padding: 0px;
  text-align: left;
  box-sizing: border-box;
  position: absolute;
  top: 50%;
  left: 50%;
  margin-left: -25px;
  margin-top: -25px;
}
.preloader span {
  position: absolute;
  display: inline-block;
  width: 70px;
  height: 70px;
  border-radius: 100%;
  background: #0091d4;
  animation: preloader 1.3s linear infinite;
}

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

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

.preloader4 {
  width: 70px;
  height: 70px;
  display: inline-block;
  padding: 0px;
  text-align: left;
  box-sizing: border-box;
  position: absolute;
  top: 50%;
  left: 50%;
  margin-left: -25px;
  margin-top: -25px;
}
.preloader4 span {
  position: absolute;
  display: inline-block;
  width: 70px;
  height: 70px;
  border-radius: 100%;
  background: var(--violet);
  animation: preloader 1.3s linear infinite;
}

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

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

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

.progress-wrap::after {
  position: absolute;
  font-family: "FontAwesome";
  content: "\f062";
  text-align: center;
  line-height: 56px;
  font-size: 18px;
  color: var(--primary);
  left: 0;
  top: 0;
  height: 56px;
  width: 56px;
  cursor: pointer;
  display: block;
  z-index: 1;
  transition: var(--transition-fast);
}

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

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

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

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

.progress-wrap svg.progress-circle path {
  stroke: var(--primary);
  stroke-width: 4;
  box-sizing: border-box;
  transition: var(--transition-fast);
}

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

/*============= PRELOADER CSS AREA ENDS===============*/
/*============= BUTTON CSS AREA ===============*/
a.header-btn {
  display: inline-block;
  border-radius: 25px;
  background: var(--primary);
  color: var(--white-100, #fff);
  font-family: var(--font-primary);
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 16px;
  padding: 16px 28px;
  transition: var(--transition);
  position: relative;
  z-index: 1;
}
a.header-btn::after {
  position: absolute;
  content: "";
  left: 50%;
  right: 50%;
  height: 20px;
  width: 20px;
  top: 14px;
  border-radius: 50%;
  background: var(--primary-dark);
  visibility: hidden;
  opacity: 0;
  z-index: -1;
  transition: var(--transition);
}
a.header-btn:hover {
  transform: translateY(-5px);
  transition: var(--transition);
}
a.header-btn:hover::after {
  visibility: visible;
  opacity: 1;
  height: 100%;
  width: 100%;
  transition: var(--transition);
  z-index: -1;
  border-radius: 25px;
  left: 0;
  top: 0;
}
a.header-btn i {
  margin-left: 4px;
  transform: rotate(-45deg);
}

a.header-btn1 {
  display: inline-block;
  border-radius: 25px;
  border: 1px solid var(--white-100, #fff);
  color: var(--white-100, #fff);
  font-family: var(--font-primary);
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 16px;
  padding: 16px 28px;
  transition: var(--transition);
  position: relative;
  z-index: 1;
}
a.header-btn1::after {
  position: absolute;
  content: "";
  left: 50%;
  right: 50%;
  height: 20px;
  width: 20px;
  top: 14px;
  border-radius: 50%;
  background: var(--primary-dark);
  border: 1px solid var(--primary-dark);
  visibility: hidden;
  opacity: 0;
  z-index: -1;
  transition: var(--transition);
}
a.header-btn1:hover {
  transform: translateY(-5px);
  transition: var(--transition);
  border: 1px solid var(--primary-dark);
}
a.header-btn1:hover::after {
  visibility: visible;
  opacity: 1;
  height: 100%;
  width: 100%;
  transition: var(--transition);
  z-index: -1;
  border-radius: 25px;
  left: 0;
  top: 0;
}
a.header-btn1 i {
  margin-left: 4px;
  transform: rotate(-45deg);
}

.header-btn2 {
  border-radius: 25px;
  background: var(--secondary);
  color: var(--white-100, #fff);
  text-align: center;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 16px;
  display: flex;
  padding: 16px 24px;
  transition: var(--transition);
  z-index: 1;
  position: relative;
  align-items: center;
  justify-content: center;
  gap: 6px;
  border: none;

}
.header-btn2::after {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  left: 35px;
  top: 15px;
  z-index: -1;
  transition: var(--transition);
  background: #000;
  border-radius: 25px;
  visibility: hidden;
  opacity: 0;
}
.header-btn2:hover {
  color: var(--white-100, #fff);
  transition: var(--transition);
  border-radius: 25px;
}
.header-btn2:hover::after {
  height: 100%;
  width: 100%;
  transition: var(--transition);
  border-radius: 25px;
  left: 0;
  top: 0;
  visibility: visible;
  opacity: 1;
}

.header-btn3 {
  border-radius: 25px;
  border: 1px solid var(--secondary);
  color: var(--secondary);
  text-align: center;
  font-family: var(--font-primary);
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 16px;
  display: flex;
  padding: 14px 24px;
  transition: var(--transition);
  z-index: 1;
  position: relative;
  align-items: center;
  justify-content: center;
  gap: 6px;
}
.header-btn3::after {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  left: 35px;
  top: 15px;
  z-index: -1;
  transition: var(--transition);
  background: #2563EB;
  border-radius: 25px;
  visibility: hidden;
  opacity: 0;
}
.header-btn3:hover {
  color: var(--white-100, #fff);
  transition: var(--transition);
  border-radius: 25px;
  border: 1px solid var(--secondary);
}
.header-btn3:hover::after {
  height: 100%;
  width: 100%;
  transition: var(--transition);
  border-radius: 25px;
  left: 0;
  top: 0;
  visibility: visible;
  opacity: 1;
}

.header-btn4 {
  font-family: var(--font-primary);
  font-weight: 700;
  font-size: 16px;
  color: var(--Text-Color, #0d0e10);
  display: inline-block;
  padding: 16px;
  transition: var(--transition);
}
.header-btn4:hover {
  color: var(--secondary);
  transition: var(--transition);
}

.header-btn5 {
  font-family: var(--font-primary);
  font-weight: 700;
  font-size: 16px;
  color: var(--white-100, #fff);
  display: inline-block;
  position: relative;
  z-index: 1;
  line-height: 16px;
  padding: 16px;
  border-radius: 5px;
  background: var(--secondary);
  transition: var(--transition);
}
.header-btn5::after {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  left: 44%;
  bottom: 0;
  right: 44%;
  top: 35%;
  background: #5600ff;
  transition: var(--transition);
  border-radius: 50%;
  z-index: -1;
  visibility: hidden;
  opacity: 0;
}
.header-btn5:hover {
  color: var(--secondary);
  transition: var(--transition);
}
.header-btn5:hover::after {
  height: 100%;
  width: 100%;
  border-radius: 4px;
  transition: var(--transition);
  left: 0;
  visibility: visible;
  opacity: 1;
  top: 0;
}

.header-btn6 {
  font-family: var(--font-primary);
  font-weight: 700;
  font-size: 16px;
  color: var(--violet);
  display: inline-block;
  position: relative;
  z-index: 1;
  line-height: 16px;
  padding: 16px;
  border-radius: 5px;
  transition: var(--transition);
}
.header-btn6:hover {
  color: #43054e;
  transition: var(--transition);
}

.header-btn7 {
  font-family: var(--font-primary);
  font-weight: 700;
  font-size: 16px;
  color: var(--white-100, #fff);
  display: inline-block;
  position: relative;
  z-index: 1;
  line-height: 16px;
  padding: 16px;
  border-radius: 5px;
  background: var(--violet);
  transition: var(--transition);
}
.header-btn7::after {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  left: 44%;
  bottom: 0;
  right: 44%;
  top: 35%;
  background: #43054e;
  transition: var(--transition);
  border-radius: 50%;
  z-index: -1;
  visibility: hidden;
  opacity: 0;
}
.header-btn7:hover {
  color: var(--white-100, #fff);
  transition: var(--transition);
  transform: translateY(-5px);
}
.header-btn7:hover::after {
  height: 100%;
  width: 100%;
  border-radius: 4px;
  transition: var(--transition);
  left: 0;
  visibility: visible;
  opacity: 1;
  top: 0;
}

a.header-btn8 {
  display: inline-block;
  border-radius: 25px;
  background: var(--purple);
  color: var(--white-100, #fff);
  font-family: var(--font-primary);
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 16px;
  padding: 16px 28px;
  transition: var(--transition);
  position: relative;
  z-index: 1;
}
a.header-btn8::after {
  position: absolute;
  content: "";
  left: 50%;
  right: 50%;
  height: 20px;
  width: 20px;
  top: 14px;
  border-radius: 50%;
  background: #745de6;
  visibility: hidden;
  opacity: 0;
  z-index: -1;
  transition: var(--transition);
}
a.header-btn8:hover {
  transform: translateY(-5px);
  transition: var(--transition);
}
a.header-btn8:hover::after {
  visibility: visible;
  opacity: 1;
  height: 100%;
  width: 100%;
  transition: var(--transition);
  z-index: -1;
  border-radius: 25px;
  left: 0;
  top: 0;
}
a.header-btn8 i {
  margin-left: 4px;
  transform: rotate(-45deg);
}

a.header-btn9 {
  display: inline-block;
  border-radius: 25px;
  background: none;
  color: var(--white-100, #fff);
  font-family: var(--font-primary);
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 16px;
  padding: 16px 28px;
  transition: var(--transition);
  position: relative;
  border: 1px solid var(--white-100, #fff);
  z-index: 1;
}
a.header-btn9::after {
  position: absolute;
  content: "";
  left: 50%;
  right: 50%;
  height: 20px;
  width: 20px;
  top: 14px;
  border-radius: 50%;
  background: var(--purple);
  visibility: hidden;
  opacity: 0;
  z-index: -1;
  transition: var(--transition);
}
a.header-btn9:hover {
  transform: translateY(-5px);
  transition: var(--transition);
  border: 1px solid var(--purple);
}
a.header-btn9:hover::after {
  visibility: visible;
  opacity: 1;
  height: 100%;
  width: 100%;
  transition: var(--transition);
  z-index: -1;
  border-radius: 25px;
  left: 0;
  top: 0;
}
a.header-btn9 i {
  margin-left: 4px;
  transform: rotate(-45deg);
}

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

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

.swiper-container {
  width: 100%;
  height: 100%;
  position: relative;
  bottom: 170px;
  z-index: 2;
}
@media (max-width: 767px) {
  .swiper-container {
    height: 200px;
  }
}
.swiper-container .swiper-slide {
  transform: none !important;
}
.swiper-container .swiper-slide-duplicate {
  transform: none !important;
}
.swiper-container .swiper-slide-next {
  transform: none !important;
  position: relative;
  right: -35px;
}
.swiper-container .swiper-slide-active {
  position: relative;
  transform: scale(1.5) !important;
}
.swiper-container .swiper-slide-prev {
  transform: none !important;
  position: relative;
  left: -35px;
}
.swiper-container .swiper-pagination {
  position: relative;
  top: 110px;
}
@media (max-width: 767px) {
  .swiper-container .swiper-pagination {
    top: 40px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .swiper-container .swiper-pagination {
    top: 70px;
  }
}

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

.swiper-pagination-bullets .swiper-pagination-bullet {
  background: transparent;
  border: none;
  color: inherit;
  padding: 0 !important;
  font: inherit;
  height: 8px;
  line-height: 10px;
  width: 8px;
  margin: 0 6px;
  border: none;
  border-radius: 50%;
  padding: 5px;
  margin: 5px;
  background-color: var(--primary-dark);
  position: relative;
  border: 2px solid var(--primary-dark);
}
.swiper-pagination-bullets .swiper-pagination-bullet::after {
  position: absolute;
  content: "";
  height: 14px;
  width: 14px;
  border: 1px solid var(--primary-dark);
  z-index: -1;
  border-radius: 50%;
  left: -5px;
  top: -5px;
  transition: all 0.3s;
  visibility: hidden;
  opacity: 0;
}
.swiper-pagination-bullets .swiper-pagination-bullet-active {
  background: var(--primary-dark);
}
.swiper-pagination-bullets .swiper-pagination-bullet-active::after {
  visibility: visible;
  opacity: 1;
}

@media (max-width: 767px) {
  .testimonial1-section-area {
    padding: 50px 0 50px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .testimonial1-section-area {
    padding: 50px 0 50px;
  }
}
.testimonial1-section-area .testimonial1-header span {
  color: var(--primary);
  font-family: var(--font-primary);
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  display: inline-block;
  margin-bottom: 16px;
}
.testimonial1-section-area
  .testimonial-sliders
  .testimonial-content-slider
  .testimonial-slider-boxarea {
  padding: 0 30px 0 0;
}
@media (max-width: 767px) {
  .testimonial1-section-area
    .testimonial-sliders
    .testimonial-content-slider
    .testimonial-slider-boxarea {
    padding: 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .testimonial1-section-area
    .testimonial-sliders
    .testimonial-content-slider
    .testimonial-slider-boxarea {
    padding: 0;
  }
}
.testimonial1-section-area
  .testimonial-sliders
  .testimonial-content-slider
  .testimonial-slider-boxarea
  .testimonila-img {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.testimonial1-section-area
  .testimonial-sliders
  .testimonial-content-slider
  .testimonial-slider-boxarea
  .testimonila-img
  ul
  li {
  display: inline-block;
}
.testimonial1-section-area
  .testimonial-sliders
  .testimonial-content-slider
  .testimonial-slider-boxarea
  .testimonila-img
  ul
  li
  a {
  color: var(--primary);
}
.testimonial1-section-area
  .testimonial-sliders
  .testimonial-content-slider
  .testimonial-slider-boxarea
  .testimonila-img
  .mans-slider-info {
  display: flex;
  align-items: center;
}
.testimonial1-section-area
  .testimonial-sliders
  .testimonial-content-slider
  .testimonial-slider-boxarea
  .testimonila-img
  .mans-slider-info
  .content {
  padding-left: 16px;
}
.testimonial1-section-area
  .testimonial-sliders
  .testimonial-content-slider
  .testimonial-slider-boxarea
  .testimonila-img
  .mans-slider-info
  .content
  a {
  color: var(--Text-Color, #0d0e10);
  font-family: var(--font-primary);
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 16px;
  display: inline-block;
  margin-bottom: 8px;
}
.testimonial1-section-area
  .testimonial-sliders
  .testimonial-content-slider
  .testimonial-slider-boxarea
  .testimonila-img
  .mans-slider-info
  .content
  p {
  color: var(--body);
  font-family: var(--font-primary);
  font-size: 12px;
  font-style: normal;
  font-weight: 500;
  line-height: 12px;
}
.testimonial1-section-area
  .testimonial-sliders
  .testimonial-content-slider
  .testimonial-slider-boxarea
  .testimonial5-all-content
  p {
  color: var(--body);
  font-family: var(--font-primary);
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: 32px;
  margin-top: 24px;
}
.testimonial1-section-area .testimonial-sliders .testimonial-arrows {
  display: flex;
  align-items: center;
  margin-top: 24px;
}
@media (max-width: 767px) {
  .testimonial1-section-area .testimonial-sliders .testimonial-arrows {
    margin-bottom: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .testimonial1-section-area .testimonial-sliders .testimonial-arrows {
    margin-bottom: 30px;
  }
}
.testimonial1-section-area
  .testimonial-sliders
  .testimonial-arrows
  button:hover {
  background: var(--primary);
  transition: var(--transition);
  color: var(--white-100, #fff);
}
.testimonial1-section-area
  .testimonial-sliders
  .testimonial-arrows
  .testimonial-prev-arrow
  button {
  height: 40px;
  width: 40px;
  border-radius: 50%;
  line-height: 40px;
  background: #d9d8fa;
  border: none;
  outline: none;
  margin: 0 16px 0 0;
  transition: var(--transition);
}
.testimonial1-section-area
  .testimonial-sliders
  .testimonial-arrows
  .testimonial-prev-arrow
  button:hover {
  background: var(--primary);
  transition: var(--transition);
}
.testimonial1-section-area
  .testimonial-sliders
  .testimonial-arrows
  .testimonial-next-arrow
  button {
  height: 40px;
  width: 40px;
  border-radius: 50%;
  line-height: 40px;
  background: #d9d8fa;
  border: none;
  outline: none;
  transition: var(--transition);
}
.testimonial1-section-area
  .testimonial-sliders
  .testimonial-arrows
  .testimonial-next-arrow
  button:hover {
  background: var(--primary);
  transition: var(--transition);
}
.testimonial1-section-area
  .testimonial-sliders
  .teimonial-slider-nav-area
  .testimonial-slider-img
  img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

@media (max-width: 767px) {
  .testimonial2-section-area {
    padding: 50px 0 50px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .testimonial2-section-area {
    padding: 50px 0 50px;
  }
}
.testimonial2-section-area .testimonial2-header span {
  border-radius: 32px;
  background: rgba(110, 36, 255, 0.05);
  display: inline-block;
  padding: 8px 12px;
  color: var(--secondary);
  font-family: var(--font-primary);
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  margin-bottom: 12px;
}
.testimonial2-section-area .testimonials2-boxarea .testimonial2-section-box {
  border-radius: 10px;
  border: 1px solid var(--Stroke-Color, rgba(86, 95, 118, 0.1));
  padding: 24px;
  margin-bottom: 30px;
  transition: var(--transition);
}
.testimonial2-section-area
  .testimonials2-boxarea
  .testimonial2-section-box:hover {
  border-radius: 10px;
  transition: var(--transition);
  background: var(--white-100, #fff);
  box-shadow: 0px 4px 50px 0px rgba(0, 0, 0, 0.08);
}
.testimonial2-section-area
  .testimonials2-boxarea
  .testimonial2-section-box:hover
  .pera {
  color: var(--Text-Color, #0d0e10);
  transition: var(--transition);
}
.testimonial2-section-area
  .testimonials2-boxarea
  .testimonial2-section-box
  .testimonials-man {
  display: flex;
  align-items: center;
}
.testimonial2-section-area
  .testimonials2-boxarea
  .testimonial2-section-box
  .testimonials-man
  .man-text {
  margin: 0 0 0 16px;
}
.testimonial2-section-area
  .testimonials2-boxarea
  .testimonial2-section-box
  .testimonials-man
  .man-text
  a {
  color: var(--Text-Color, #0d0e10);
  font-family: var(--font-primary);
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 16px;
  display: inline-block;
  margin-bottom: 8px;
}
.testimonial2-section-area
  .testimonials2-boxarea
  .testimonial2-section-box
  .testimonials-man
  .man-text
  span {
  color: var(--body);
  font-family: var(--font-primary);
  font-size: 12px;
  font-style: normal;
  font-weight: 500;
  line-height: 12px;
  display: block;
}
.testimonial2-section-area
  .testimonials2-boxarea
  .testimonial2-section-box
  .pera {
  color: var(--body);
  font-family: var(--font-primary);
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 28px;
  margin-top: 16px;
  transition: var(--transition);
  margin-bottom: 16px;
}
.testimonial2-section-area .testimonials2-boxarea .testimonial2-section-box a {
  color: var(--body);
  font-family: var(--font-primary);
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  display: inline-block;
}
.testimonial2-section-area .testimonials2-boxarea2 .testimonial2-section-box {
  border-radius: 10px;
  border: 1px solid var(--Stroke-Color, rgba(86, 95, 118, 0.1));
  padding: 24px;
  margin-bottom: 30px;
  transition: var(--transition);
}
.testimonial2-section-area
  .testimonials2-boxarea2
  .testimonial2-section-box:hover {
  border-radius: 10px;
  transition: var(--transition);
  background: var(--white-100, #fff);
  box-shadow: 0px 4px 50px 0px rgba(0, 0, 0, 0.08);
}
.testimonial2-section-area
  .testimonials2-boxarea2
  .testimonial2-section-box:hover
  .pera {
  color: var(--Text-Color, #0d0e10);
  transition: var(--transition);
}
.testimonial2-section-area
  .testimonials2-boxarea2
  .testimonial2-section-box
  .testimonials-man {
  display: flex;
  align-items: center;
}
.testimonial2-section-area
  .testimonials2-boxarea2
  .testimonial2-section-box
  .testimonials-man
  .man-text {
  margin: 0 0 0 16px;
}
.testimonial2-section-area
  .testimonials2-boxarea2
  .testimonial2-section-box
  .testimonials-man
  .man-text
  a {
  color: var(--Text-Color, #0d0e10);
  font-family: var(--font-primary);
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 16px;
  display: inline-block;
  margin-bottom: 8px;
}
.testimonial2-section-area
  .testimonials2-boxarea2
  .testimonial2-section-box
  .testimonials-man
  .man-text
  span {
  color: var(--body);
  font-family: var(--font-primary);
  font-size: 12px;
  font-style: normal;
  font-weight: 500;
  line-height: 12px;
  display: block;
}
.testimonial2-section-area
  .testimonials2-boxarea2
  .testimonial2-section-box
  .pera {
  color: var(--body);
  font-family: var(--font-primary);
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 28px;
  margin-top: 16px;
  transition: var(--transition);
  margin-bottom: 16px;
}
.testimonial2-section-area .testimonials2-boxarea2 .testimonial2-section-box a {
  color: var(--body);
  font-family: var(--font-primary);
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  display: inline-block;
}

.testimonial3-section-area {
  background:
    url("../images/all-images/map-bg.svg") right top / 620px auto no-repeat,
    linear-gradient(281deg, rgba(84, 158, 255, 1) 0%, rgba(7, 79, 174, 1) 85%);

  padding: 80px 0;
}

@media (max-width: 767px) {
  .testimonial3-section-area {
    padding: 50px 0 50px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .testimonial3-section-area {
    padding: 50px 0 50px;
  }
}
.testimonial3-section-area .testimonial3-slider-area .testimonial3-boxarea {
  border: 1px solid var(--Stroke-Color, rgba(86, 95, 118, 0.1));
  padding: 20px;
  transition: var(--transition);
  border-radius: 20px;
  background-color: #fff;
}
.testimonial3-section-area
  .testimonial3-slider-area
  .testimonial3-boxarea:hover {
  background: var(--white-100, #fff);
  transition: var(--transition);
  box-shadow: 0px 4px 50px 0px rgba(0, 0, 0, 0.08);
}
.testimonial3-section-area
  .testimonial3-slider-area
  .testimonial3-boxarea:hover
  .img2
  p {
  color: var(--Text-Color, #0d0e10);
  transition: var(--transition);
}
.testimonial3-section-area
  .testimonial3-slider-area
  .testimonial3-boxarea
  .images-content {
  display: flex;
  align-items: center;
}
.testimonial3-section-area
  .testimonial3-slider-area
  .testimonial3-boxarea
  .images-content
  img {
  height: 50px;
  width: 50px;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 50%;
}
.testimonial3-section-area
  .testimonial3-slider-area
  .testimonial3-boxarea
  .images-content
  .content {
  margin-left: 12px;
}
.testimonial3-section-area
  .testimonial3-slider-area
  .testimonial3-boxarea
  .images-content
  .content
  a {
  font-family: var(--font-primary);
  font-size: 20px;
  font-weight: 600;
  color: var(--Text-Color, #0d0e10);
  line-height: 20px;
  display: inline-block;
  margin-bottom: 8px;
  transition: var(--transition);
}
.testimonial3-section-area
  .testimonial3-slider-area
  .testimonial3-boxarea
  .images-content
  .content
  p {
  font-size: 16px;
  font-weight: 500;
  color: var(--body);
  font-family: var(--font-primary);
  transition: var(--transition);
}
.testimonial3-section-area
  .testimonial3-slider-area
  .testimonial3-boxarea
  .img2
  img {
  height: 40px;
  width: 40px;
  -o-object-fit: contain;
  object-fit: contain;
}
.testimonial3-section-area
  .testimonial3-slider-area
  .testimonial3-boxarea
  .img2
  p {
  font-family: var(--font-primary);
  font-size: 16px;
  font-weight: 500;
  color: var(--body);
  line-height: 28px;
  transition: var(--transition);
}
.testimonial3-section-area .testimonial3-slider-area .owl-dots {
  text-align: center;
  margin-top: 30px;
}
.testimonial3-section-area .testimonial3-slider-area .owl-dots button {
  position: relative;
  height: 16px;
  width: 16px;
  border-radius: 50%;
  background: #fff;
  margin: 0 16px 0 0;
}
.testimonial3-section-area .testimonial3-slider-area .owl-dots button::after {
  position: absolute;
  content: "";
  height: 24px;
  width: 24px;
  border-radius: 50%;
  border: 1px solid var(--white);
  left: -5px;
  top: -5px;
  display: none;
}
.testimonial3-section-area .testimonial3-slider-area .owl-dots button.active {
  background: var(--white);
  height: 14px;
  width: 14px;
}
.testimonial3-section-area
  .testimonial3-slider-area
  .owl-dots
  button.active::after {
  display: block;
}

.testimonial2 .testimonial1-header span {
  display: inline-block;
  padding: 8px 12px;
  color: var(--secondary);
  font-family: var(--font-primary);
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  border-radius: 32px;
  background: rgba(110, 36, 255, 0.05);
  margin-bottom: 12px;
}
.testimonial2
  .testimonial-sliders
  .testimonial-content-slider
  .testimonial-slider-boxarea
  ul
  li
  a {
  color: var(--secondary) !important;
}
.testimonial2 .testimonial-sliders .testimonial-next-arrow button:hover {
  background: var(--secondary) !important;
}
.testimonial2 .testimonial-sliders .testimonial-prev-arrow button:hover {
  background: var(--secondary) !important;
}

@media (max-width: 767px) {
  .testimonial-inner-section-area {
    padding: 50px 0 50px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .testimonial-inner-section-area {
    padding: 50px 0 50px;
  }
}
.testimonial-inner-section-area .testimonial2-section-box {
  border-radius: 10px;
  border: 1px solid var(--Stroke-Color, rgba(86, 95, 118, 0.1));
  padding: 24px;
  margin-bottom: 30px;
  transition: var(--transition);
}
.testimonial-inner-section-area .testimonial2-section-box:hover {
  border-radius: 10px;
  transition: var(--transition);
  background: var(--white-100, #fff);
  box-shadow: 0px 4px 50px 0px rgba(0, 0, 0, 0.08);
}
.testimonial-inner-section-area .testimonial2-section-box:hover .pera {
  color: var(--Text-Color, #0d0e10);
  transition: var(--transition);
}
.testimonial-inner-section-area .testimonial2-section-box .testimonials-man {
  display: flex;
  align-items: center;
}
.testimonial-inner-section-area
  .testimonial2-section-box
  .testimonials-man
  .man-text {
  margin: 0 0 0 16px;
}
.testimonial-inner-section-area
  .testimonial2-section-box
  .testimonials-man
  .man-text
  a {
  color: var(--Text-Color, #0d0e10);
  font-family: var(--font-primary);
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 16px;
  display: inline-block;
  margin-bottom: 8px;
}
.testimonial-inner-section-area
  .testimonial2-section-box
  .testimonials-man
  .man-text
  span {
  color: var(--body);
  font-family: var(--font-primary);
  font-size: 12px;
  font-style: normal;
  font-weight: 500;
  line-height: 12px;
  display: block;
}
.testimonial-inner-section-area .testimonial2-section-box .pera {
  color: var(--body);
  font-family: var(--font-primary);
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 28px;
  margin-top: 16px;
  transition: var(--transition);
  margin-bottom: 16px;
}
.testimonial-inner-section-area .testimonial2-section-box a {
  color: var(--body);
  font-family: var(--font-primary);
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  display: inline-block;
}
.testimonial-inner-section-area .testimonial3-boxarea {
  border: 1px solid var(--Stroke-Color, rgba(86, 95, 118, 0.1));
  padding: 20px;
  transition: var(--transition);
  border-radius: 4px;
  margin-bottom: 30px;
}
.testimonial-inner-section-area .testimonial3-boxarea:hover {
  background: var(--white-100, #fff);
  transition: var(--transition);
  border: 1px solid var(--white-100, #fff);
  box-shadow: 0px 4px 50px 0px rgba(0, 0, 0, 0.08);
  border-radius: 4px;
}
.testimonial-inner-section-area .testimonial3-boxarea:hover .img2 p {
  color: var(--Text-Color, #0d0e10);
  transition: var(--transition);
}
.testimonial-inner-section-area .testimonial3-boxarea .images-content {
  display: flex;
  align-items: center;
}
.testimonial-inner-section-area .testimonial3-boxarea .images-content img {
  height: 50px;
  width: 50px;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 50%;
}
.testimonial-inner-section-area .testimonial3-boxarea .images-content .content {
  margin-left: 12px;
}
.testimonial-inner-section-area
  .testimonial3-boxarea
  .images-content
  .content
  a {
  font-family: var(--font-primary);
  font-size: 20px;
  font-weight: 700;
  color: var(--Text-Color, #0d0e10);
  line-height: 20px;
  display: inline-block;
  margin-bottom: 8px;
  transition: var(--transition);
}
.testimonial-inner-section-area
  .testimonial3-boxarea
  .images-content
  .content
  p {
  font-size: 16px;
  font-weight: 500;
  color: var(--body);
  font-family: var(--font-primary);
  transition: var(--transition);
}
.testimonial-inner-section-area .testimonial3-boxarea .img2 img {
  height: 40px;
  width: 40px;
  -o-object-fit: contain;
  object-fit: contain;
}
.testimonial-inner-section-area .testimonial3-boxarea .img2 p {
  font-family: var(--font-primary);
  font-size: 16px;
  font-weight: 500;
  color: var(--body);
  line-height: 28px;
  transition: var(--transition);
}
.testimonial-inner-section-area .pagination-area nav ul {
  justify-content: center;
}
.testimonial-inner-section-area .pagination-area nav ul li a {
  font-family: var(--font-primary);
  font-size: 16px;
  font-weight: 700;
  color: var(--Text-Color, #0d0e10);
  height: 55px;
  width: 55px;
  text-align: center;
  line-height: 43px;
  border-radius: 50% !important;
  box-shadow: none;
  margin: 0 10px 0 0;
  transition: var(--transition);
  border: 1px solid var(--Stroke-Color, rgba(86, 95, 118, 0.1));
}
.testimonial-inner-section-area .pagination-area nav ul li a:hover {
  background: var(--secondary);
  transition: var(--transition);
  color: var(--white-100, #fff);
}
.testimonial-inner-section-area .pagination-area nav ul li a.active {
  background: var(--secondary);
  color: var(--white-100, #fff);
  transition: var(--transition);
}

.testimonial-carousel-area {
  position: relative;
}
@media (max-width: 767px) {
  .testimonial-carousel-area {
    padding: 50px 0 50px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .testimonial-carousel-area {
    padding: 50px 0 50px;
  }
}
.testimonial-carousel-area .tastemonial-box-area {
  position: relative;
}
.testimonial-carousel-area .tastemonial-box-area .testimonial {
  position: absolute;
  left: 18%;
  top: 2%;
}
.testimonial-carousel-area .tastemonial-box-area .pinterest1 {
  position: absolute;
  top: 40%;
}
.testimonial-carousel-area .tastemonial-box-area .instagram3 {
  position: absolute;
  right: 0;
  top: 40%;
}
.testimonial-carousel-area .tastemonial-box-area .testimonial-main-box {
  background: #f8f9fa;
  position: relative;
  padding: 80px 80px;
  border-radius: 50%;
  overflow: hidden;
}
@media (max-width: 767px) {
  .testimonial-carousel-area .tastemonial-box-area .testimonial-main-box {
    padding: 40px;
    border-radius: 10px;
  }
}
.testimonial-carousel-area
  .tastemonial-box-area
  .testimonial-main-box
  .img1
  img {
  height: 60px;
  width: 60px;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 50%;
  margin: 0 auto;
}
.testimonial-carousel-area
  .tastemonial-box-area
  .testimonial-main-box
  .team-details {
  display: flex;
  align-items: center;
  justify-content: center;
}
.testimonial-carousel-area
  .tastemonial-box-area
  .testimonial-main-box
  .team-details
  .img1
  img {
  height: 50px;
  width: 50px;
  border-radius: 50%;
  -o-object-fit: cover;
  object-fit: cover;
}
.testimonial-carousel-area
  .tastemonial-box-area
  .testimonial-main-box
  .team-details
  .content {
  margin-left: 16px;
}
.testimonial-carousel-area
  .tastemonial-box-area
  .testimonial-main-box
  .team-details
  .content
  a {
  display: inline-block;
  font-size: 16px;
  font-weight: 700;
  color: var(--Text-Color, #0d0e10);
  font-family: var(--font-primary);
  text-align: start !important;
}
.testimonial-carousel-area
  .tastemonial-box-area
  .testimonial-main-box
  .team-details
  .content
  p {
  font-family: var(--font-primary);
  font-size: 12px;
  font-weight: 500;
  color: var(--body);
}
.testimonial-carousel-area
  .tastemonial-box-area
  .testimonial-main-box
  .owl-dots {
  text-align: center;
  margin-top: 32px;
}
.testimonial-carousel-area
  .tastemonial-box-area
  .testimonial-main-box
  .owl-dots
  button {
  height: 3px;
  width: 17px;
  display: inline-block;
  background: #dac6de;
  border-radius: 4px;
  margin: 0 3px;
}
.testimonial-carousel-area
  .tastemonial-box-area
  .testimonial-main-box
  .owl-dots
  .owl-dot.active {
  background: var(--violet);
}

/*============= TESTIMONIAL CSS AREA ENDS===============*/
/*============= COUNTER CSS AREA ===============*/
.counter1-section-area {
  padding: 70px 0 100px;
}
@media (max-width: 767px) {
  .counter1-section-area {
    margin-top: -75px;
    padding: 30px 0 50px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .counter1-section-area {
    margin-top: -50px;
    padding: 30px 0 50px;
  }
}
.counter1-section-area .counter-auhtor-area {
  border-radius: var(--4, 4px);
  background: #fff;
  box-shadow: 0px 4px 30px 0px rgba(0, 0, 0, 0.08);
  align-items: center;
  justify-content: space-between;
  padding: 50px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .counter1-section-area .counter-auhtor-area {
    padding: 50px 50px 30px 50px;
  }
}
@media (max-width: 767px) {
  .counter1-section-area .counter-auhtor-area {
    padding: 50px;
  }
}
.counter1-section-area .counter-auhtor-area .counter-box1 {
  text-align: center;
  position: relative;
  z-index: 1;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .counter1-section-area .counter-auhtor-area .counter-box1 {
    margin-bottom: 20px;
  }
}
@media (max-width: 767px) {
  .counter1-section-area .counter-auhtor-area .counter-box1 {
    margin-bottom: 20px;
  }
}
.counter1-section-area .counter-auhtor-area .counter-box1::after {
  position: absolute;
  content: "";
  height: 90px;
  width: 1px;
  background: var(--Stroke-Color, rgba(86, 95, 118, 0.1));
  top: 0;
  right: 0;
  z-index: 1;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .counter1-section-area .counter-auhtor-area .counter-box1::after {
    height: 70px;
    width: 1px;
    top: 20px;
  }
}
@media (max-width: 767px) {
  .counter1-section-area .counter-auhtor-area .counter-box1::after {
    display: none;
  }
}
.counter1-section-area .counter-auhtor-area .counter-box1 h3 {
  color: var(--Text-Color, #0d0e10);
  font-family: var(--font-primary);
  font-size: 56px;
  font-style: normal;
  font-weight: 700;
  line-height: 56px;
  margin-bottom: 16px;
}
@media (max-width: 767px) {
  .counter1-section-area .counter-auhtor-area .counter-box1 h3 {
    font-size: 32px;
    line-height: 42px;
  }
}
.counter1-section-area .counter-auhtor-area .counter-box1 p {
  color: var(--body);
  font-family: var(--font-primary);
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: 20px;
}
.counter1-section-area .counter-auhtor-area .counter-after::after {
  display: none;
}

/*============= COUNTER CSS AREA ENDS ===============*/
/*============= SLIDER CSS AREA ===============*/
.slider1-section-area {
  overflow: hidden;
}
.slider1-section-area .brand-single-box {
  display: inline-block;
}
.slider1-section-area .marquee-wrap {
  background-color: var(--primary);
  width: 100%;
  position: relative;
}
.slider1-section-area .marquee-wrap .marquee-text {
  animation: marquee 100s linear infinite;
  position: relative;
  width: 100%;
  white-space: nowrap;
  padding: 30px 0;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .slider1-section-area .marquee-wrap .marquee-text {
    animation: marquee 50s linear infinite;
  }
}
@media (max-width: 767px) {
  .slider1-section-area .marquee-wrap .marquee-text {
    animation: marquee 50s linear infinite;
  }
}
.slider1-section-area .marquee-wrap .marquee-text .brand-single-box {
  display: inline-block;
}
.slider1-section-area .marquee-wrap .marquee-text .brand-single-box h3 {
  color: var(--white-100, #fff);
  font-family: var(--font-primary);
  font-size: 40px;
  font-style: normal;
  font-weight: 700;
  line-height: 40px;
}
.slider1-section-area .marquee-wrap .marquee-text .brand-single-box h3 img {
  margin: 0 10px;
}

.slider1-section-area.slider2 .marquee-wrap {
  background: var(--secondary);
}

/*============= SLIDER CSS AREA ENDS===============*/
/*============= SERVICE CSS AREA ===============*/
.service1-section-area {
  overflow: hidden;
  background: var(--bg-light);
}
@media (max-width: 767px) {
  .service1-section-area {
    padding: 50px 0 50px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .service1-section-area {
    padding: 50px 0 50px;
  }
}
.service1-section-area .service1-header span {
  color: var(--primary);
  font-family: var(--font-primary);
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  display: inline-block;
  margin-bottom: 16px;
}
.service1-section-area .service-vertical-tabs {
  position: relative;
  width: 100%;
  border-radius: var(--4, 4px);
  background: var(--white-100, #fff);
  padding: 32px;
  position: relative;
}
@media (max-width: 767px) {
  .service1-section-area .service-vertical-tabs {
    padding: 25px;
  }
}
.service1-section-area .service-vertical-tabs .tabs-elements {
  position: absolute;
  left: 35px;
  top: 0;
}
.service1-section-area .service-vertical-tabs .menu div span.light {
  height: 10px;
  width: 10px;
  position: absolute;
  top: 24px;
  left: 15px;
  border-radius: 100%;
  transition: 1s all cubic-bezier(0.075, 0.82, 0.165, 1);
}
.service1-section-area .service-vertical-tabs .menu div.active span.light {
  left: 0;
  height: 100%;
  width: 3px;
  top: 0;
  border-radius: 0;
}
.service1-section-area
  .service-vertical-tabs
  .menu
  div.active
  .tabs-content-area {
  background: var(--primary);
}
.service1-section-area
  .service-vertical-tabs
  .menu
  div.active
  .tabs-content-area
  .tabs-btn-icon {
  background: var(--white-100, #fff);
}
.service1-section-area
  .service-vertical-tabs
  .menu
  div.active
  .tabs-content-area
  .tabs-btn-content
  h4 {
  color: var(--white-100, #fff);
}
.service1-section-area
  .service-vertical-tabs
  .menu
  div.active
  .tabs-content-area
  .tabs-btn-content
  p {
  color: var(--white-100, #fff);
  opacity: 0.7;
  font-weight: 500;
}
.service1-section-area .service-vertical-tabs ul.service-tabs-content {
  position: relative;
  height: 0px;
  list-style: none;
  margin: 0;
  padding: 0;
  transition: 0.5s all cubic-bezier(0.075, 0.82, 0.165, 1);
}
.service1-section-area .service-vertical-tabs ul.service-tabs-content li {
  opacity: 0;
  transform: translateX(50px);
  position: absolute;
  list-style: none;
  transition: 1s all cubic-bezier(0.075, 0.82, 0.165, 1);
}
.service1-section-area
  .service-vertical-tabs
  ul.service-tabs-content
  li.active {
  transition-delay: 0.3s;
  z-index: 2;
  opacity: 1;
  transform: translateX(0px);
}
.service1-section-area
  .service-vertical-tabs
  ul.service-tabs-content
  li.active {
  transition-delay: 0.3s;
  z-index: 2;
  opacity: 1;
  transform: translateX(0px);
}
.service1-section-area .service-vertical-tabs .service-tabs-grid {
  margin: 0 70px 0 0;
}
@media (max-width: 767px) {
  .service1-section-area .service-vertical-tabs .service-tabs-grid {
    margin: 0;
    margin-bottom: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .service1-section-area .service-vertical-tabs .service-tabs-grid {
    margin: 0;
    margin-bottom: 30px;
  }
}
.service1-section-area
  .service-vertical-tabs
  .service-tabs-grid
  .tabs-content-area {
  background: #f6f5fe;
  position: relative;
  border-radius: 50px;
  padding: 16px;
  cursor: pointer;
}
@media (max-width: 767px) {
  .service1-section-area
    .service-vertical-tabs
    .service-tabs-grid
    .tabs-content-area {
    text-align: center;
    margin: 0 auto;
    border-radius: 5px;
  }
}
.service1-section-area
  .service-vertical-tabs
  .service-tabs-grid
  .tabs-content-area
  .tabs-btn-icon {
  height: 65px;
  width: 65px;
  line-height: 60px;
  text-align: center;
  border-radius: 50%;
  background: #edecfd;
  position: absolute;
  top: 11px;
}
@media (max-width: 767px) {
  .service1-section-area
    .service-vertical-tabs
    .service-tabs-grid
    .tabs-content-area
    .tabs-btn-icon {
    position: relative;
    top: 0;
    text-align: center;
    margin: 0 auto;
    margin-bottom: 20px;
  }
}
.service1-section-area
  .service-vertical-tabs
  .service-tabs-grid
  .tabs-content-area
  .tabs-btn-content {
  padding-left: 85px;
}
@media (max-width: 767px) {
  .service1-section-area
    .service-vertical-tabs
    .service-tabs-grid
    .tabs-content-area
    .tabs-btn-content {
    padding: 0;
  }
}
.service1-section-area
  .service-vertical-tabs
  .service-tabs-grid
  .tabs-content-area
  .tabs-btn-content
  h4 {
  color: var(--Text-Color, #0d0e10);
  font-family: var(--font-primary);
  font-size: 20px;
  font-style: normal;
  font-weight: 600;
  line-height: 24px;
  margin-bottom: 12px;
}
@media (max-width: 767px) {
  .service1-section-area
    .service-vertical-tabs
    .service-tabs-grid
    .tabs-content-area
    .tabs-btn-content
    h4 {
    font-size: 18px;
  }
}
.service1-section-area
  .service-vertical-tabs
  .service-tabs-grid
  .tabs-content-area
  .tabs-btn-content
  p {
  color: var(--body);
  font-family: var(--font-primary);
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
}
@media (max-width: 767px) {
  .service1-section-area
    .service-vertical-tabs
    .service-tabs-grid
    .tabs-content-area
    .tabs-btn-content
    p {
    font-size: 14px;
  }
}
.service1-section-area .service-vertical-tabs .service-tabs-content {
  position: relative;
}
.service1-section-area
  .service-vertical-tabs
  .service-tabs-content
  li
  .vertical-tabs-img
  img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}
.service1-section-area
  .service-vertical-tabs
  .service-tabs-content
  li
  .vertical-tabs-img
  img.vertical-img2 {
  width: 363px;
  height: 226px;
  position: absolute;
  bottom: -40px;
  right: -100px;
}
@media (max-width: 767px) {
  .service1-section-area
    .service-vertical-tabs
    .service-tabs-content
    li
    .vertical-tabs-img
    img.vertical-img2 {
    position: relative;
    top: 0;
    left: 0;
  }
}

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


.service2-section-area .service2-header h2 {
  color: var(--white-100, #fff) !important;
}
.service2-section-area .service2-bg-area {
  border-radius: 4px;
  transition: var(--transition);
}
.service2-section-area .service2-bg-area .service2-box-area {
  background: var(--BG, #f7f9fa);
  padding: 24px;
  margin-bottom: 30px;
  transition: var(--transition);
  border-radius: 4px;
}
.service2-section-area .service2-bg-area .service2-box-area:hover {
  background: #0374a1;
  transition: var(--transition);
  transform: translateY(-5px);
}
.service2-section-area
  .service2-bg-area
  .service2-box-area:hover
  .service2-icon {
  background: var(--white-100, #fff);
  transition: var(--transition);
}
.service2-section-area
  .service2-bg-area
  .service2-box-area:hover
  .service2-icon1 {
  background: var(--white-100, #fff);
  transition: var(--transition);
}
.service2-section-area
  .service2-bg-area
  .service2-box-area:hover
  .service2-icon2 {
  background: var(--white-100, #fff);
  transition: var(--transition);
}
.service2-section-area
  .service2-bg-area
  .service2-box-area:hover
  .service2-content
  a {
  color: var(--white-100, #fff);
  transition: var(--transition);
  font-weight: 600;
}
.service2-section-area
  .service2-bg-area
  .service2-box-area:hover
  .service2-content
  p {
  color: var(--white-100, #fff);
  transition: var(--transition);
}
.service2-section-area .service2-bg-area .service2-box-area .service2-icon {
  background: #f8dfde;
  height: 80px;
  width: 80px;
  text-align: center;
  border-radius: 50%;
  line-height: 80px;
  transition: var(--transition);
  margin: 0 auto;
}
.service2-section-area .service2-bg-area .service2-box-area .service2-icon1 {
  background: #e9deff;
  height: 80px;
  width: 80px;
  text-align: center;
  border-radius: 50%;
  line-height: 80px;
  margin: 0 auto;
  transition: var(--transition);
}
.service2-section-area .service2-bg-area .service2-box-area .service2-icon2 {
  background: #d6ebe7;
  height: 80px;
  width: 80px;
  text-align: center;
  border-radius: 50%;
  line-height: 80px;
  transition: var(--transition);
  margin: 0 auto;
}
.service2-section-area
  .service2-bg-area
  .service2-box-area
  .service2-content
  a {
  color: var(--Text-Color, #0d0e10);
  text-align: center;
  text-overflow: ellipsis;
  font-family: var(--font-primary);
  font-size: 20px;
  font-style: normal;
  font-weight: 600;
  line-height: 20px;
  display: inline-block;
  margin-bottom: 16px;
  transition: var(--transition);
  margin-top: 16px;
}
.service2-section-area
  .service2-bg-area
  .service2-box-area
  .service2-content
  p {
  color: var(--body);
  text-align: center;
  font-family: var(--font-primary);
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  transition: var(--transition);
  line-height: 28px;
}
.service2-section-area
  .service2-bg-area
  .service2-box-area
  .service2-content
  .readmore {
  font-family: var(--font-primary);
  font-size: 16px;
  font-weight: 700;
  color: var(--Text-Color, #0d0e10);
  display: inline-block;
  line-height: 16px;
  transition: var(--transition);
  margin-bottom: 0;
  margin-top: 24px;
}
.service2-section-area
  .service2-bg-area
  .service2-box-area
  .service2-content
  .readmore
  i {
  margin-left: 4px;
  transform: rotate(-45deg);
}

.tools-section-area {
  background: #faf9fd;
  position: relative;
}
@media (max-width: 767px) {
  .tools-section-area {
    padding: 50px 0 50px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tools-section-area {
    padding: 50px 0 50px;
  }
}
.tools-section-area .tabs3-tools-area {
  background: var(--white-100, #fff);
  padding: 60px 100px;
  border-radius: 4px;
  overflow: hidden;
}
@media (max-width: 767px) {
  .tools-section-area .tabs3-tools-area {
    padding: 30px 30px 50px 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tools-section-area .tabs3-tools-area {
    padding: 30px 30px 50px 30px;
  }
}
.tools-section-area .tabs3-tools-area ul {
  justify-content: center;
}
.tools-section-area .tabs3-tools-area ul li.nav-item {
  text-align: center;
  margin: 0 30px 0 0;
}
@media (max-width: 767px) {
  .tools-section-area .tabs3-tools-area ul li.nav-item {
    width: 100%;
    margin: 0 0 16px 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tools-section-area .tabs3-tools-area ul li.nav-item {
    width: 100%;
    margin: 0 0 16px 0;
  }
}
.tools-section-area .tabs3-tools-area ul li.nav-item .nav-link.active {
  background: var(--secondary);
}
.tools-section-area
  .tabs3-tools-area
  ul
  li.nav-item
  .nav-link.active
  .content
  p {
  color: var(--white-100, #fff);
}
.tools-section-area
  .tabs3-tools-area
  ul
  li.nav-item
  .nav-link.active
  .content
  .tools-icon1 {
  display: none;
  margin: 0 auto;
}
.tools-section-area
  .tabs3-tools-area
  ul
  li.nav-item
  .nav-link.active
  .content
  .active-icon1 {
  display: block;
  margin: 0 auto;
}
.tools-section-area .tabs3-tools-area ul li.nav-item .nav-link {
  background: #faf9fd;
  border-radius: 4px;
  padding: 12px;
  text-align: center;
  min-width: 142px;
}
.tools-section-area
  .tabs3-tools-area
  ul
  li.nav-item
  .nav-link
  .content
  .tools-icon1 {
  display: inline-block;
  margin: 0 auto;
}
.tools-section-area
  .tabs3-tools-area
  ul
  li.nav-item
  .nav-link
  .content
  .active-icon1 {
  display: none;
  margin: 0 auto;
}
.tools-section-area .tabs3-tools-area ul li.nav-item .nav-link .content p {
  font-family: var(--font-primary);
  font-size: 18px;
  font-weight: 700;
  color: var(--Text-Color, #0d0e10);
}
.tools-section-area .tabs3-tools-area .tab-content .tab-pane {
  transform: rotateX(45deg) translateY(50px);
  transition: var(--transition);
  opacity: 0;
}
.tools-section-area
  .tabs3-tools-area
  .tab-content
  .tab-pane
  .main-content-area
  .tabs-header {
  padding: 0 30px 0;
}
@media (max-width: 767px) {
  .tools-section-area
    .tabs3-tools-area
    .tab-content
    .tab-pane
    .main-content-area
    .tabs-header {
    padding: 0;
    margin-bottom: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tools-section-area
    .tabs3-tools-area
    .tab-content
    .tab-pane
    .main-content-area
    .tabs-header {
    padding: 0;
    margin-bottom: 30px;
  }
}
.tools-section-area
  .tabs3-tools-area
  .tab-content
  .tab-pane
  .main-content-area
  .tabs-header
  h2 {
  text-align: start;
}
.tools-section-area
  .tabs3-tools-area
  .tab-content
  .tab-pane
  .main-content-area
  .tabs-header
  p {
  text-align: start;
}
.tools-section-area
  .tabs3-tools-area
  .tab-content
  .tab-pane
  .main-content-area
  .tabs-header
  a {
  text-align: start;
}
.tools-section-area
  .tabs3-tools-area
  .tab-content
  .tab-pane
  .main-content-area
  .tabs-header
  .list {
  display: flex;
}
.tools-section-area
  .tabs3-tools-area
  .tab-content
  .tab-pane
  .main-content-area
  .tabs-header
  .list
  img {
  margin: 0 30px 0 0;
}
.tools-section-area
  .tabs3-tools-area
  .tab-content
  .tab-pane
  .main-content-area
  .tabs-header
  .list
  p
  span {
  font-weight: 700;
  color: var(--Text-Color, #0d0e10) !important;
}
.tools-section-area
  .tabs3-tools-area
  .tab-content
  .tab-pane
  .main-content-area
  .tabs-images {
  position: relative;
}
.tools-section-area
  .tabs3-tools-area
  .tab-content
  .tab-pane
  .main-content-area
  .tabs-images
  img {
  height: 340px;
  width: 400px;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 4px;
}
@media (max-width: 767px) {
  .tools-section-area
    .tabs3-tools-area
    .tab-content
    .tab-pane
    .main-content-area
    .tabs-images
    img {
    height: 100%;
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tools-section-area
    .tabs3-tools-area
    .tab-content
    .tab-pane
    .main-content-area
    .tabs-images
    img {
    height: 100%;
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover;
  }
}
.tools-section-area
  .tabs3-tools-area
  .tab-content
  .tab-pane
  .main-content-area
  .tabs-images
  .tabs-img2 {
  width: 290px;
  height: 200px;
  -o-object-fit: cover;
  object-fit: cover;
  position: absolute;
  bottom: -100px;
  right: 0;
}
@media (max-width: 767px) {
  .tools-section-area
    .tabs3-tools-area
    .tab-content
    .tab-pane
    .main-content-area
    .tabs-images
    .tabs-img2 {
    height: 100%;
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    position: relative;
    bottom: 0;
    top: 20px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tools-section-area
    .tabs3-tools-area
    .tab-content
    .tab-pane
    .main-content-area
    .tabs-images
    .tabs-img2 {
    height: 100%;
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    position: relative;
    bottom: 0;
    top: 20px;
  }
}
.tools-section-area .tabs3-tools-area .tab-content .tab-pane.active.show {
  transform: rotateX(0) translateY(0);
  transition: var(--transition);
  opacity: 1;
}

.service-inner-section-area {
  background: var(--BG, #f7f9fa);
}
@media (max-width: 767px) {
  .service-inner-section-area {
    padding: 50px 0 20px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .service-inner-section-area {
    padding: 50px 0 20px;
  }
}
.service-inner-section-area .service-inner-header span {
  background: #f0eefa;
  padding: 8px 12px;
  line-height: 16px;
  border-radius: 32px;
  display: inline-block;
  font-size: 16px;
  font-weight: 500;
  color: var(--secondary);
}
.service-inner-section-area .service-inner-boxarea {
  position: relative;
  background: var(--white-100, #fff);
  padding: 32px 16px;
  border-radius: 4px;
  box-shadow: 0px 4px 50px 0px rgba(0, 0, 0, 0.08);
  transition: var(--transition);
  z-index: 1;
  margin-bottom: 30px;
}
.service-inner-section-area .service-inner-boxarea::after {
  position: absolute;
  content: "";
  height: 30px;
  width: 30px;
  border-radius: 50%;
  transition: var(--transition);
  overflow: hidden;
  opacity: 0;
  top: 40%;
  left: 40%;
  right: 40%;
  z-index: -1;
  background: var(--secondary);
}
.service-inner-section-area .service-inner-boxarea:hover {
  transform: translateY(-5px);
  transition: var(--transition);
}
.service-inner-section-area .service-inner-boxarea:hover::after {
  visibility: visible;
  opacity: 1;
  transition: var(--transition);
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  border-radius: 4px;
}
.service-inner-section-area .service-inner-boxarea:hover .icons {
  transition: var(--transition);
  background: var(--white-100, #fff);
  transition: var(--transition);
}
.service-inner-section-area .service-inner-boxarea:hover .content a {
  color: var(--white-100, #fff);
  transition: var(--transition);
}
.service-inner-section-area .service-inner-boxarea:hover .content p {
  color: var(--white-100, #fff);
  transition: var(--transition);
  opacity: 0.8;
}
.service-inner-section-area .service-inner-boxarea .icons {
  height: 60px;
  width: 60px;
  text-align: center;
  line-height: 60px;
  background: var(--tag);
  display: inline-block;
  border-radius: 50%;
  transition: var(--transition);
}
.service-inner-section-area .service-inner-boxarea .icons2 {
  background: #ffe4e2;
}
.service-inner-section-area .service-inner-boxarea .icons3 {
  background: #ddf0eb;
}
.service-inner-section-area .service-inner-boxarea .icons4 {
  background: #fbe6ff;
}
.service-inner-section-area .service-inner-boxarea .content a {
  font-family: var(--font-primary);
  font-weight: 600;
  color: var(--Text-Color, #0d0e10);
  display: inline-block;
  font-size: 20px;
  line-height: 20px;
  transition: var(--transition);
}
.service-inner-section-area .service-inner-boxarea .content p {
  font-family: var(--font-primary);
  font-size: 16px;
  font-weight: 500;
  color: var(--body);
  line-height: 26px;
  transition: var(--transition);
}
.service-inner-section-area .box2::after {
  background: #fc4b3e;
}
.service-inner-section-area .box3::after {
  background: #1e9e7a;
}
.service-inner-section-area .box4::after {
  background: #e25aff;
}

@media (max-width: 767px) {
  .marketing-section-area {
    padding: 50px 0 50px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .marketing-section-area {
    padding: 50px 0 50px;
  }
}
.marketing-section-area .marketing-img {
  position: relative;
  z-index: 1;
}
.marketing-section-area .marketing-img img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 4px;
}
@media (max-width: 767px) {
  .marketing-section-area .marketing-img {
    margin-bottom: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .marketing-section-area .marketing-img {
    margin-bottom: 30px;
  }
}
.marketing-section-area .marketing-img .marketing-bg {
  position: absolute;
  left: 0;
  z-index: -1;
}
.marketing-section-area .tabs-text-area {
  border-radius: var(--4, 4px);
  border: 1px solid var(--Stroke-Color, rgba(86, 95, 118, 0.1));
  padding: 20px 16px;
  position: relative;
  transition: var(--transition);
  margin: 0 0 0 40px;
}
@media (max-width: 767px) {
  .marketing-section-area .tabs-text-area {
    margin: 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .marketing-section-area .tabs-text-area {
    margin: 0;
  }
}
.marketing-section-area .tabs-text-area:hover {
  border-radius: var(--4, 4px);
  background: var(--white-100, #fff);
  transition: var(--transition);
  transform: translateY(-5px);
  box-shadow: 0px 4px 50px 0px rgba(0, 0, 0, 0.08);
}
.marketing-section-area .tabs-text-area .tabs-icon {
  height: 84px;
  width: 84px;
  text-align: center;
  line-height: 84px;
  background: #e9deff;
  border-radius: 50%;
  display: inline-block;
  position: absolute;
}
@media (max-width: 767px) {
  .marketing-section-area .tabs-text-area .tabs-icon {
    position: relative;
  }
}
.marketing-section-area .tabs-text-area .tabs-icon1 {
  height: 84px;
  width: 84px;
  text-align: center;
  line-height: 84px;
  background: #f8dfde;
  border-radius: 50%;
  display: inline-block;
  position: absolute;
}
@media (max-width: 767px) {
  .marketing-section-area .tabs-text-area .tabs-icon1 {
    position: relative;
  }
}
.marketing-section-area .tabs-text-area .tabs-icon2 {
  height: 84px;
  width: 84px;
  text-align: center;
  line-height: 84px;
  background: #d6ebe7;
  border-radius: 50%;
  display: inline-block;
  position: absolute;
}
@media (max-width: 767px) {
  .marketing-section-area .tabs-text-area .tabs-icon2 {
    position: relative;
  }
}
.marketing-section-area .tabs-text-area .tabs-icon3 {
  height: 84px;
  width: 84px;
  text-align: center;
  line-height: 84px;
  background: #e6dbe8;
  border-radius: 50%;
  display: inline-block;
  position: absolute;
}
@media (max-width: 767px) {
  .marketing-section-area .tabs-text-area .tabs-icon3 {
    position: relative;
  }
}
.marketing-section-area .tabs-text-area .tabs-text {
  padding-left: 100px;
}
@media (max-width: 767px) {
  .marketing-section-area .tabs-text-area .tabs-text {
    padding-left: 0;
    margin-top: 20px;
  }
}
.marketing-section-area .tabs-text-area .tabs-text a {
  color: var(--Text-Color, #0d0e10);
  font-family: var(--font-primary);
  font-size: 20px;
  font-style: normal;
  font-weight: 600;
  line-height: 20px;
  display: inline-block;
  margin-bottom: 12px;
  text-transform: capitalize;
}
.marketing-section-area .tabs-text-area .tabs-text p {
  color: var(--body);
  font-family: var(--font-primary);
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 28px;
}

.service-sticky-area {
  position: relative;
}
.service-sticky-area .all-sticky-area {
  position: relative;
}
.service-sticky-area .all-sticky-area .sticky-area .section-area {
  position: sticky;
}
.service-sticky-area .all-sticky-area .sticky-area .section-area.bg2 {
  background: #ffedec;
  position: sticky;
  top: 150px !important;
}
.service-sticky-area .all-sticky-area .sticky-area .section-area.bg3 {
  background: #e8f5f2;
  position: sticky;
  top: 200px !important;
}
.service-sticky-area .all-sticky-area .sticky-area .section-area.bg4 {
  background: #eee7ef;
  position: sticky;
  top: 250px !important;
}
.service-sticky-area
  .all-sticky-area
  .sticky-area
  .footer-last-content.footerbg1 {
  background: #fecdc9;
}
.service-sticky-area
  .all-sticky-area
  .sticky-area
  .footer-last-content.footerbg1
  .header-btn8 {
  background: #fc4b3e;
}
.service-sticky-area
  .all-sticky-area
  .sticky-area
  .footer-last-content.footerbg2 {
  background: #c0e4da;
}
.service-sticky-area
  .all-sticky-area
  .sticky-area
  .footer-last-content.footerbg2
  .header-btn8 {
  background: #1e9e7a;
}
.service-sticky-area
  .all-sticky-area
  .sticky-area
  .footer-last-content.footerbg3 {
  background: #d0bcd3;
}
.service-sticky-area
  .all-sticky-area
  .sticky-area
  .footer-last-content.footerbg3
  .header-btn8 {
  background: var(--violet);
}
.service-sticky-area .all-sticky-area .sticky-area .section-area {
  background: #f0e9ff;
  border-radius: 4px;
  position: sticky;
  top: 100px;
  margin-bottom: 100px;
}
@media (max-width: 767px) {
  .service-sticky-area .all-sticky-area .sticky-area .section-area {
    margin-bottom: 30px;
  }
}
.service-sticky-area .all-sticky-area .sticky-area .section-area .all-content {
  padding: 32px 0 0 32px;
}
.service-sticky-area
  .all-sticky-area
  .sticky-area
  .section-area
  .all-content
  .logo-content {
  display: flex;
  align-items: center;
}
.service-sticky-area
  .all-sticky-area
  .sticky-area
  .section-area
  .all-content
  .logo-content
  .img1 {
  height: 50px;
  width: 50px;
  line-height: 50px;
  text-align: center;
  border-radius: 50%;
  background: var(--white-100, #fff);
  margin: 0 16px 0 0;
}
.service-sticky-area
  .all-sticky-area
  .sticky-area
  .section-area
  .all-content
  .logo-content
  h3 {
  font-family: var(--font-primary);
  font-size: 32px;
  line-height: 42px;
  font-weight: 700;
  color: var(--Text-Color, #0d0e10);
}
.service-sticky-area
  .all-sticky-area
  .sticky-area
  .section-area
  .all-content
  .pera-area
  h3 {
  font-size: 24px;
  font-family: var(--font-primary);
  font-weight: 600;
  color: var(--Text-Color, #0d0e10);
  line-height: 32px;
}
.service-sticky-area
  .all-sticky-area
  .sticky-area
  .section-area
  .all-content
  .pera-area
  .content-pera {
  margin-top: 30px;
}
.service-sticky-area .all-sticky-area .sticky-area .section-area .images {
  position: relative;
  right: -100px;
  padding: 32px 32px 0 0;
}
@media (max-width: 767px) {
  .service-sticky-area .all-sticky-area .sticky-area .section-area .images {
    right: 0;
    margin-top: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .service-sticky-area .all-sticky-area .sticky-area .section-area .images {
    right: 0;
    margin-top: 30px;
  }
}
.service-sticky-area .all-sticky-area .sticky-area .section-area .images img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 4px;
}
.service-sticky-area .all-sticky-area .sticky-area .footer-last-content {
  background: #d6c2ff;
  padding: 32px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-radius: 0 0 4px 4px;
}
@media (max-width: 767px) {
  .service-sticky-area .all-sticky-area .sticky-area .footer-last-content {
    display: inline-block;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .service-sticky-area .all-sticky-area .sticky-area .footer-last-content {
    display: inline-block;
  }
}
@media (max-width: 767px) {
  .service-sticky-area
    .all-sticky-area
    .sticky-area
    .footer-last-content
    .header-btn8 {
    margin-top: 20px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .service-sticky-area
    .all-sticky-area
    .sticky-area
    .footer-last-content
    .header-btn8 {
    margin-top: 20px;
  }
}
.service-sticky-area .all-sticky-area .sticky-area .footer-last-content h3 {
  font-family: var(--font-primary);
  font-size: 24px;
  line-height: 30px;
  font-weight: 600;
  color: var(--Text-Color, #0d0e10);
}
.service-sticky-area .all-sticky-area .sticky-area .footer-last-content p {
  font-family: var(--font-primary);
  font-size: 16px;
  font-weight: 500;
  color: var(--body);
  line-height: 26px;
}

.all-author-service {
  position: sticky;
  top: 0;
  position: -webkit-sticky;
}
.all-author-service .footer-last-content.footerbg1 {
  background: #c0e4da;
}
.all-author-service .footer-last-content.footerbg1 .header-btn8 {
  background: #1e9e7a;
}
.all-author-service .footer-last-content.footerbg2 {
  background: #d0bcd3;
}
.all-author-service .footer-last-content.footerbg2 .header-btn8 {
  background: var(--violet);
}
.all-author-service .services-author-area.bg2 {
  background: #ffedec;
}
.all-author-service .services-author-area.bg3 {
  background: #e8f5f2;
  position: relative;
  top: 0;
}
.all-author-service .services-author-area.bg4 {
  background: #eee7ef;
}
.all-author-service .footer-last-content.footerbg {
  background: #fecdc9;
}
.all-author-service .footer-last-content.footerbg .header-btn8 {
  background: #fc4b3e;
}
.all-author-service .services-author-area {
  background: #f0e9ff;
  border-radius: 4px;
  padding: 32px;
}
.all-author-service .services-author-area .logo-content {
  display: flex;
  align-items: center;
}
.all-author-service .services-author-area .logo-content .img1 {
  height: 50px;
  width: 50px;
  line-height: 50px;
  text-align: center;
  border-radius: 50%;
  background: var(--white-100, #fff);
  margin: 0 16px 0 0;
}
.all-author-service .services-author-area .logo-content h3 {
  font-family: var(--font-primary);
  font-size: 32px;
  line-height: 42px;
  font-weight: 700;
  color: var(--Text-Color, #0d0e10);
}
.all-author-service .services-author-area .pera-area h3 {
  font-size: 24px;
  font-family: var(--font-primary);
  font-weight: 700;
  color: var(--Text-Color, #0d0e10);
  line-height: 32px;
}
.all-author-service .services-author-area .pera-area .content-pera {
  margin-top: 30px;
}
.all-author-service .services-author-area .images {
  position: relative;
  right: -100px;
}
@media (max-width: 767px) {
  .all-author-service .services-author-area .images {
    right: 0;
    margin-top: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .all-author-service .services-author-area .images {
    right: 0;
    margin-top: 30px;
  }
}
.all-author-service .services-author-area .images img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 4px;
}
.all-author-service .footer-last-content {
  background: #d6c2ff;
  padding: 32px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-radius: 0 0 4px 4px;
}
@media (max-width: 767px) {
  .all-author-service .footer-last-content {
    display: inline-block;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .all-author-service .footer-last-content {
    display: inline-block;
  }
}
@media (max-width: 767px) {
  .all-author-service .footer-last-content .header-btn8 {
    margin-top: 20px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .all-author-service .footer-last-content .header-btn8 {
    margin-top: 20px;
  }
}
.all-author-service .footer-last-content h3 {
  font-family: var(--font-primary);
  font-size: 24px;
  line-height: 30px;
  font-weight: 700;
  color: var(--Text-Color, #0d0e10);
}
.all-author-service .footer-last-content p {
  font-family: var(--font-primary);
  font-size: 16px;
  font-weight: 500;
  color: var(--body);
  line-height: 26px;
}

/*============= SERVICE CSS AREA ENDS ===============*/
/*============= FEATURES CSS AREA ===============*/
.features1-section-area {
  position: relative;
  overflow: hidden;
  z-index: 1;
}
.features1-section-area .features-elements1 {
  position: absolute;
  top: 0;
  left: 22%;
  z-index: -2;
  right: 22%;
  top: 50px;
}
@media (max-width: 767px) {
  .features1-section-area {
    padding: 50px 0 20px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .features1-section-area {
    padding: 50px 0 20px;
  }
}
.features1-section-area .features1-header span {
  color: var(--white-100, #fff);
  font-family: var(--font-primary);
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  display: inline-block;
  margin-bottom: 16px;
}
.features1-section-area .features1-header h2 {
  color: var(--white-100, #fff);
}
.features1-section-area .features-box-area {
  position: relative;
  z-index: 1;
  transition: var(--transition);
}
.features1-section-area .features-box-area:hover {
  transform: translateY(-5px);
  transition: var(--transition);
}
.features1-section-area .features-box-area .features-author-box {
  border-radius: var(--4, 4px);
  border: 1px solid rgba(255, 255, 255, 0.3);
  background: var(--white-10, rgba(255, 255, 255, 0.1));
  -webkit-backdrop-filter: blur(57.0340957642px);
  backdrop-filter: blur(57.0340957642px);
  padding: 32px 32px 0 32px;
  max-height: 478px;
  overflow: hidden;
  margin-bottom: 30px;
  transition: var(--transition);
}
.features1-section-area .features-box-area .features-author-box:hover {
  transform: translateY(-5px);
  transition: var(--transition);
}
.features1-section-area
  .features-box-area
  .features-author-box:hover
  .images
  img {
  transform: scale(1.1);
  transition: all 0.4s;
}
.features1-section-area .features-box-area .features-author-box a {
  color: var(--white-100, #fff);
  font-family: var(--font-primary);
  font-size: 24px;
  font-style: normal;
  font-weight: 600;
  line-height: 24px;
  display: inline-block;
  margin-bottom: 16px;
}
@media (max-width: 767px) {
  .features1-section-area .features-box-area .features-author-box a {
    font-size: 20px;
    line-height: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .features1-section-area .features-box-area .features-author-box a {
    font-size: 20px;
    line-height: 30px;
  }
}
.features1-section-area .features-box-area .features-author-box p {
  color: var(--white-100, #fff);
  font-family: var(--font-primary);
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 28px;
  opacity: 0.7;
  margin-bottom: 32px;
}
@media (max-width: 767px) {
  .features1-section-area .features-box-area .features-author-box p {
    font-size: 16px;
    line-height: 26px;
  }
}
.features1-section-area .features-box-area .features-author-box .images {
  overflow: hidden;
  border-radius: 4px;
  transition: all 0.4s;
}
.features1-section-area .features-box-area .features-author-box .images img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  transition: all 0.4s;
}
.features1-section-area .features-box-area .features2 {
  max-height: 430px !important;
}

.more-features-scetion-area {
  overflow: hidden;
}
@media (max-width: 767px) {
  .more-features-scetion-area {
    padding: 50px 0 20px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .more-features-scetion-area {
    padding: 50px 0 20px;
  }
}
.more-features-scetion-area .more-features-header span {
  color: var(--primary);
  font-family: var(--font-primary);
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  display: inline-block;
  margin-bottom: 16px;
}
.more-features-scetion-area .more-features-box {
  border-radius: var(--4, 4px);
  border: 1px solid var(--Stroke-Color, rgba(86, 95, 118, 0.1));
  padding: 32px 24px;
  overflow: hidden;
  transition: var(--transition);
  position: relative;
  z-index: 1;
  margin-bottom: 30px;
}
.more-features-scetion-area .more-features-box .features-content {
  position: relative;
  z-index: 3;
}
.more-features-scetion-area .more-features-box .more-elements {
  position: absolute;
  top: 0;
  left: 30px;
  z-index: -1;
}
.more-features-scetion-area .more-features-box:hover {
  transform: translateY(-5px);
  background: var(--primary);
  transition: var(--transition);
}
.more-features-scetion-area .more-features-box:hover .features-icon {
  background: var(--white-100, #fff);
  transition: var(--transition);
}
.more-features-scetion-area .more-features-box:hover a {
  color: var(--white-100, #fff);
  transition: var(--transition);
}
.more-features-scetion-area .more-features-box:hover p {
  color: var(--white-100, #fff);
  opacity: 0.7;
  transition: var(--transition);
}
.more-features-scetion-area .more-features-box:hover a.learnmore {
  color: var(--white-100, #fff);
  transition: var(--transition);
}
.more-features-scetion-area .more-features-box .features-icon {
  background: #edecfd;
  height: 60px;
  width: 60px;
  text-align: center;
  line-height: 60px;
  border-radius: 50%;
  margin-bottom: 24px;
  transition: var(--transition);
}
.more-features-scetion-area .more-features-box a {
  color: var(--Text-Color, #0d0e10);
  font-family: var(--font-primary);
  font-size: 24px;
  font-style: normal;
  font-weight: 600;
  line-height: 24px;
  display: inline-block;
  margin-bottom: 16px;
  transition: var(--transition);
}
@media (max-width: 767px) {
  .more-features-scetion-area .more-features-box a {
    font-size: 20px;
    line-height: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .more-features-scetion-area .more-features-box a {
    font-size: 20px;
    line-height: 30px;
  }
}
.more-features-scetion-area .more-features-box p {
  color: var(--body);
  font-family: var(--font-primary);
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 28px;
  transition: var(--transition);
}
.more-features-scetion-area .more-features-box a.learnmore {
  color: var(--Text-Color, #0d0e10);
  font-family: var(--font-primary);
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 18px;
  display: inline-block;
  margin-bottom: 0;
  margin-top: 24px;
  transition: var(--transition);
}
.more-features-scetion-area .more-features-box a.learnmore i {
  margin-left: 4px;
  transform: rotate(-45deg);
}

.features3-section-area {
  padding: 100px 0 200px;
}
@media (max-width: 767px) {
  .features3-section-area {
    padding: 50px 0 50px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .features3-section-area {
    padding: 50px 0 50px;
  }
}
.features3-section-area .features3-images {
  position: relative;
}
.features3-section-area .features3-images .img1 img {
  border-radius: 4px;
}
.features3-section-area .features3-images .img2 img {
  width: 300px;
  height: 200px;
  -o-object-fit: cover;
  object-fit: cover;
  position: absolute;
  right: -100px;
  bottom: -100px;
}
@media (max-width: 767px) {
  .features3-section-area .features3-images .img2 img {
    height: 100%;
    width: 100%;
    right: 0;
    bottom: 0;
    top: 20px;
    position: relative;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .features3-section-area .features3-images .img2 img {
    height: 100%;
    width: 100%;
    right: 0;
    bottom: 0;
    top: 20px;
    position: relative;
  }
}
@media (max-width: 767px) {
  .features3-section-area .features3-content {
    margin-top: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .features3-section-area .features3-content {
    margin-top: 30px;
  }
}
.features3-section-area .features3-content .features-content-box {
  position: relative;
  background: #faf9fd;
  padding: 16px 24px;
  border-radius: 4px;
  transition: var(--transition);
}
.features3-section-area .features3-content .features-content-box:hover {
  background: var(--white-100, #fff);
  transition: var(--transition);
  box-shadow: 0px 4px 50px 0px rgba(0, 0, 0, 0.08);
  transform: translateY(-5px);
}
.features3-section-area .features3-content .features-content-box:hover::after {
  background: var(--secondary);
  transition: var(--transition);
  opacity: 1;
}
.features3-section-area .features3-content .features-content-box::after {
  position: absolute;
  content: "";
  height: 100%;
  width: 6px;
  left: 0;
  top: 0;
  background: var(--body);
  border-radius: 4px 0 0 4px;
  transition: var(--transition);
  opacity: 0.4;
}
.features3-section-area .features3-content .features-content-box .img1 {
  height: 32px;
  width: 32px;
  -o-object-fit: cover;
  object-fit: cover;
  position: absolute;
}
.features3-section-area .features3-content .features-content-box .content {
  padding-left: 50px;
}
.features3-section-area .features3-content .features-content-box .content a {
  font-family: var(--font-primary);
  font-size: 20px;
  font-weight: 600;
  color: var(--Text-Color, #0d0e10);
  display: inline-block;
  line-height: 20px;
  transition: var(--transition);
}
.features3-section-area
  .features3-content
  .features-content-box
  .content
  a:hover {
  color: var(--secondary);
  transition: var(--transition);
}
.features3-section-area .features3-content .features-content-box .content p {
  font-family: var(--font-primary);
  font-size: 16px;
  font-weight: 500;
  color: var(--body);
  line-height: 28px;
}

.step-section-area {
  background: #faf9fd;
  position: relative;
  z-index: 1;
}
@media (max-width: 767px) {
  .step-section-area {
    padding: 50px 0 50px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .step-section-area {
    padding: 50px 0 50px;
  }
}
@media (max-width: 767px) {
  .step-section-area .step-header-area {
    margin-bottom: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .step-section-area .step-header-area {
    margin-bottom: 30px;
  }
}
.step-section-area .step-author-area {
  display: flex;
  position: relative;
  transition: var(--transition);
  margin: 0 30px 0 0;
}
@media (max-width: 767px) {
  .step-section-area .step-author-area {
    margin: 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .step-section-area .step-author-area {
    margin: 0;
  }
}
.step-section-area .step-author-area::after {
  position: absolute;
  content: "";
  height: 100%;
  width: 1px;
  border: 1px dashed var(--secondary);
  z-index: -1;
  left: 35px;
  top: 50px;
  opacity: 0.4;
}
.step-section-area .step-author-area:hover .icons h2 {
  background: var(--secondary);
  color: var(--white-100, #fff);
  transition: var(--transition);
}
.step-section-area .step-author-area .icons h2 {
  font-family: var(--font-primary);
  font-size: 24px;
  font-weight: 700;
  color: var(--Text-Color, #0d0e10);
  background: var(--white-100, #fff);
  position: relative;
  z-index: 1;
  height: 70px;
  width: 70px;
  text-align: center;
  border-radius: 50%;
  border: 1px solid var(--secondary);
  line-height: 70px;
  transition: var(--transition);
}
.step-section-area .step-author-area .content {
  margin-left: 32px;
}
.step-section-area .step-author-area .content a {
  font-family: var(--font-primary);
  font-weight: 600;
  display: inline-block;
  color: var(--Text-Color, #0d0e10);
  font-size: 24px;
  line-height: 24px;
  transition: var(--transition);
}
.step-section-area .step-author-area .content a:hover {
  color: var(--secondary);
  transition: var(--transition);
}
.step-section-area .step-author-area .content p {
  font-family: var(--font-primary);
  font-size: 16px;
  font-weight: 500;
  color: var(--body);
}
.step-section-area .step-author-area.step2::after {
  display: none;
}

.features2 .features1-header span {
  font-family: var(--font-primary);
  font-weight: 500;
  color: var(--secondary);
  transition: var(--transition);
  display: inline-block;
  padding: 8px 12px;
  border-radius: 32px;
  background: var(--white-100, #fff);
  line-height: 16px;
  font-size: 16px;
}

/*============= FEATURES CSS AREA ENDS ===============*/
/*============= OTHERS CSS AREA ===============*/
.brand-section-area {
  background: var(--primary);
  position: relative;
}
.brand-section-area .brand-header span {
  color: var(--white-100, #fff);
  font-family: var(--font-primary);
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  display: inline-block;
  margin-bottom: 16px;
}
.brand-section-area .brand-header h2 {
  color: var(--white-100, #fff);
}
.brand-section-area .brand-single-box {
  display: inline-block;
}
.brand-section-area .marquee-wrap {
  background-color: var(--primary);
  width: 100%;
  position: relative;
}
.brand-section-area .marquee-wrap .marquee-text {
  animation: marquee 35s linear infinite;
  position: relative;
  width: 100%;
  white-space: nowrap;
  margin-bottom: 30px;
  padding: 0;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .brand-section-area .marquee-wrap .marquee-text {
    animation: marquee 50s linear infinite;
  }
}
@media (max-width: 767px) {
  .brand-section-area .marquee-wrap .marquee-text {
    animation: marquee 50s linear infinite;
  }
}
.brand-section-area .marquee-wrap .marquee-text .brand-single-box {
  display: inline-block;
}
.brand-section-area .marquee-wrap .marquee-text .brand-single-box h3 {
  color: var(--white-100, #fff);
  font-family: var(--font-primary);
  font-size: 40px;
  font-style: normal;
  font-weight: 700;
  line-height: 40px;
}
.brand-section-area .marquee-wrap .marquee-text .brand-single-box h3 img {
  margin: 0 10px;
}
.brand-section-area .marquee-wrap2 {
  background-color: var(--primary);
  width: 100%;
  position: relative;
}
.brand-section-area .marquee-wrap2 .marquee-text {
  animation: marquee-2 35s linear infinite;
  position: relative;
  width: 100%;
  white-space: nowrap;
  padding: 0;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .brand-section-area .marquee-wrap2 .marquee-text {
    animation: marquee-2 50s linear infinite;
  }
}
@media (max-width: 767px) {
  .brand-section-area .marquee-wrap2 .marquee-text {
    animation: marquee-2 50s linear infinite;
  }
}
.brand-section-area .marquee-wrap2 .marquee-text .brand-single-box img {
  height: 50px;
  width: 200px !important;
  -o-object-fit: contain;
  object-fit: contain;
}

.brand2-section-area {
  overflow: hidden;
}
@media (max-width: 767px) {
  .brand2-section-area {
    padding: 40px 0 40px;
  }
}
.brand2-section-area .brand2-header h4 {
  color: var(--Text-Color, #0d0e10);
  font-family: var(--font-primary);
  font-size: 20px;
  font-style: normal;
  font-weight: 700;
  line-height: 30px;
}
.brand2-section-area .brand2-logos {
  position: relative;
  width: 100%;
  padding: 0;
}
.brand2-section-area .brand2-logos .brand2-logo {
  display: inline-block;
  margin: 0 48px 0 0;
}
.brand2-section-area .brand2-logos .brand2-logo img {
  height: 48px;
  width: 170px;
  -o-object-fit: contain;
  object-fit: contain;
}

.brand2-section-area.brand3 {
  overflow: hidden;
}
.brand2-section-area.brand3 .slick-list.draggable {
  overflow: inherit;
}
@media (max-width: 767px) {
  .brand2-section-area.brand3 {
    padding: 40px 0 40px;
  }
}
.brand2-section-area.brand3 .brand2-header h4 {
  color: var(--Text-Color, #0d0e10);
  font-family: var(--font-primary);
  font-size: 20px;
  font-style: normal;
  font-weight: 700;
  line-height: 20px;
}
.brand2-section-area.brand3 .brand2-logos {
  position: relative;
  width: 100%;
  padding: 0;
}
.brand2-section-area.brand3 .brand2-logos .brand2-logo {
  display: inline-block;
  margin: 0 48px 0 0;
}
.brand2-section-area.brand3 .brand2-logos .brand2-logo img {
  height: 50px;
  width: 200px;
  -o-object-fit: contain;
  object-fit: contain;
}

.brand-images-area {
  position: relative;
  top: -150px;
}
@media (max-width: 767px) {
  .brand-images-area .images1 {
    margin-bottom: 20px;
  }
}
.brand-images-area .images1 img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 4px;
}

@media (max-width: 767px) {
  .download-app-area {
    padding: 50px 0 50px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .download-app-area {
    padding: 50px 0 50px;
  }
}
.download-app-area .download-header span {
  font-family: var(--font-primary);
  font-weight: 500;
  color: var(--secondary);
  transition: var(--transition);
  font-size: 16px;
  line-height: 16px;
  display: inline-block;
  padding: 8px 12px;
  border-radius: 32px;
  background: var(--tag);
}
.download-app-area .download-images {
  position: relative;
}
.download-app-area .download-images img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 4px;
}
.download-app-area .download-images ul {
  text-align: center;
}
.download-app-area .download-images ul li {
  display: inline-block;
}
.download-app-area .download-images ul li a img {
  width: 135px;
  height: 40px;
  -o-object-fit: contain;
  object-fit: contain;
}

@media (max-width: 767px) {
  .team-inner-section-area {
    padding: 50px 0 20px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .team-inner-section-area {
    padding: 50px 0 20px;
  }
}
.team-inner-section-area .blog-team-images {
  position: relative;
  box-shadow: 0px 4px 50px 0px rgba(0, 0, 0, 0.08);
  margin-bottom: 30px;
}
.team-inner-section-area .blog-team-images .img1 img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 4px 4px 0 0;
}
.team-inner-section-area .blog-team-images .content-area {
  text-align: center;
  background: var(--white-100, #fff);
  padding: 38px 24px 24px 24px;
  border-radius: 0 0 4px 4px;
  position: relative;
}
.team-inner-section-area .blog-team-images .content-area .ceo-tags p {
  font-size: 12px;
  font-weight: 500;
  color: var(--secondary);
  font-family: var(--font-primary);
  padding: 8px;
  background: var(--white-100, #fff);
  border: 1px solid var(--secondary);
  position: absolute;
  display: inline-block;
  border-radius: 25px;
  line-height: 12px;
  top: -17px;
  left: 34%;
  right: 34%;
}
.team-inner-section-area .blog-team-images .content-area a {
  display: inline-block;
  font-family: var(--font-primary);
  font-size: 32px;
  line-height: 32px;
  font-weight: 700;
  color: var(--Text-Color, #0d0e10);
}
.team-inner-section-area .blog-team-images .content-area p {
  font-family: var(--font-primary);
  font-weight: 500;
  color: var(--body);
  font-size: 16px;
  line-height: 26px;
}
.team-inner-section-area .blog-team-images .content-area ul li {
  display: inline-block;
}
.team-inner-section-area .blog-team-images .content-area ul li a {
  height: 40px;
  width: 40px;
  display: inline-block;
  text-align: center;
  line-height: 40px;
  border-radius: 50%;
  background: #f6f5fe;
  font-size: 20px;
  margin: 0 4px 0 0;
  transition: var(--transition);
}
.team-inner-section-area .blog-team-images .content-area ul li a:hover {
  background: var(--secondary);
  color: var(--white-100, #fff);
  transition: var(--transition);
  transform: translateY(-3px);
}

.about-welcome-section-area.about3 {
  padding: 170px 0 0;
}
.about-welcome-section-area.about3 .download-images {
  position: relative;
  top: 124px;
}
@media (max-width: 767px) {
  .about-welcome-section-area.about3 .download-images {
    top: 37px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .about-welcome-section-area.about3 .download-images {
    top: 37px;
  }
}
.about-welcome-section-area.about3 .download-images img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 4px;
}

.blog-inner-section.inner-download {
  padding: 200px 0 70px;
}
@media (max-width: 767px) {
  .blog-inner-section.inner-download {
    padding: 100px 0 70px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .blog-inner-section.inner-download {
    padding: 100px 0 70px;
  }
}
.blog-inner-section.inner-download .blog-inner-boxs .content ul li {
  display: inline-block;
}
.blog-inner-section.inner-download .blog-inner-boxs .content ul li a img {
  height: 40px;
  width: 135px;
  -o-object-fit: contain;
  object-fit: contain;
  margin-top: 32px;
}
.blog-inner-section.inner-download .blog-inner-boxarea .content ul li {
  display: inline-block;
}
.blog-inner-section.inner-download .blog-inner-boxarea .content ul li a img {
  height: 40px;
  width: 135px;
  -o-object-fit: contain;
  object-fit: contain;
  margin-top: 32px;
}

.brand4-section-area {
  position: relative;
  background: #f8f9fa;
}
@media (max-width: 767px) {
  .brand4-section-area {
    padding: 50px 0 50px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .brand4-section-area {
    padding: 50px 0 50px;
  }
}

.others4-section-area {
  background: #f8f9fa;
  position: relative;
}
@media (max-width: 767px) {
  .others4-section-area {
    padding: 50px 0 50px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .others4-section-area {
    padding: 50px 0 50px;
  }
}
@media (max-width: 767px) {
  .others4-section-area .others-collaborate-area {
    padding: 0;
    margin-bottom: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .others4-section-area .others-collaborate-area {
    padding: 0;
    margin-bottom: 30px;
  }
}
.others4-section-area .others-collaborate-area .listarea {
  display: flex;
}
.others4-section-area .others-collaborate-area .listarea img {
  margin: 0 20px 0 0;
}
.others4-section-area .others-collaborate-area .listarea span {
  background: none;
  color: var(--Text-Color, #0d0e10);
  font-weight: 700;
}
.others4-section-area .collaborate-img img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 4px;
}
.others4-section-area .img2 {
  position: relative;
  left: -100px;
}
@media (max-width: 767px) {
  .others4-section-area .img2 {
    margin-top: 30px;
    margin-bottom: 30px;
    left: 0;
    position: relative;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .others4-section-area .img2 {
    left: 0;
    position: relative;
  }
}

.others5-section-area {
  background: #f8f9fa;
}
@media (max-width: 767px) {
  .others5-section-area {
    padding: 50px 0 50px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .others5-section-area {
    padding: 50px 0 50px;
  }
}
.others5-section-area .all-social-area {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
@media (max-width: 767px) {
  .others5-section-area .all-social-area {
    display: block;
    justify-content: center;
    text-align: center;
  }
}
.others5-section-area .all-social-area .icons1 img {
  height: 50px;
}
.others5-section-area .all-social-area .facebook {
  text-align: center;
}
.others5-section-area .all-social-area .facebook:hover .icons1::after {
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
}
.others5-section-area .all-social-area .facebook .icons1 {
  height: 90px;
  width: 90px;
  text-align: center;
  line-height: 85px;
  border-radius: 50%;
  background: var(--white-100, #fff);
  margin: 0 auto;
  position: relative;
  border: 1px solid #eee7ef;
  z-index: 1;
}
.others5-section-area .all-social-area .facebook .icons1 img {
  height: 50px;
  width: 50px;
  -o-object-fit: cover;
  object-fit: cover;
}
.others5-section-area .all-social-area .facebook .icons1:hover::after {
  height: 100%;
  width: 100%;
  transition: var(--transition);
  left: 0;
  top: 0;
}
.others5-section-area .all-social-area .facebook .icons1::after {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  transition: var(--transition);
  background: #1877f7;
  left: 40%;
  top: 40%;
  border-radius: 50%;
  z-index: -1;
}
.others5-section-area .all-social-area .facebook a.link {
  font-family: var(--font-primary);
  font-size: 16px;
  font-weight: 700;
  color: var(--Text-Color, #0d0e10);
  text-align: center;
  display: inline-block;
}
.others5-section-area .all-social-area .instagram {
  text-align: center;
}
.others5-section-area .all-social-area .instagram:hover .icons1::after {
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
}
.others5-section-area .all-social-area .instagram .icons1 {
  height: 90px;
  width: 90px;
  text-align: center;
  line-height: 80px;
  border-radius: 50%;
  background: var(--white-100, #fff);
  border: 1px solid #eee7ef;
  margin: 0 auto;
  position: relative;
  z-index: 1;
  font-size: 50px;
}
.others5-section-area .all-social-area .instagram .icons1:hover::after {
  height: 100%;
  width: 100%;
  transition: var(--transition);
  left: 0;
  top: 0;
}
.others5-section-area .all-social-area .instagram .icons1::after {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  transition: var(--transition);
  background: var(--violet);
  left: 40%;
  top: 40%;
  border-radius: 50%;
  z-index: -1;
}
.others5-section-area .all-social-area .instagram a.link {
  font-family: var(--font-primary);
  font-size: 16px;
  font-weight: 700;
  color: var(--Text-Color, #0d0e10);
  text-align: center;
  display: inline-block;
}
.others5-section-area .all-social-area .twitter {
  text-align: center;
}
.others5-section-area .all-social-area .twitter:hover .icons1::after {
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
}
.others5-section-area .all-social-area .twitter .icons1 {
  height: 90px;
  width: 90px;
  text-align: center;
  line-height: 85px;
  border-radius: 50%;
  background: var(--white-100, #fff);
  margin: 0 auto;
  position: relative;
  border: 1px solid #eee7ef;
  z-index: 1;
}
.others5-section-area .all-social-area .twitter .icons1:hover::after {
  height: 100%;
  width: 100%;
  transition: var(--transition);
  left: 0;
  top: 0;
}
.others5-section-area .all-social-area .twitter .icons1::after {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  transition: var(--transition);
  background: #2188f7;
  left: 40%;
  top: 40%;
  border-radius: 50%;
  z-index: -1;
}
.others5-section-area .all-social-area .twitter a.link {
  font-family: var(--font-primary);
  font-size: 16px;
  font-weight: 700;
  color: var(--Text-Color, #0d0e10);
  text-align: center;
  display: inline-block;
}
.others5-section-area .all-social-area .telegram {
  text-align: center;
}
.others5-section-area .all-social-area .telegram:hover .icons1::after {
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
}
.others5-section-area .all-social-area .telegram .icons1 {
  height: 90px;
  width: 90px;
  text-align: center;
  line-height: 85px;
  border-radius: 50%;
  background: var(--white-100, #fff);
  border: 1px solid #eee7ef;
  margin: 0 auto;
  position: relative;
  z-index: 1;
}
.others5-section-area .all-social-area .telegram .icons1:hover::after {
  height: 100%;
  width: 100%;
  transition: var(--transition);
  left: 0;
  top: 0;
}
.others5-section-area .all-social-area .telegram .icons1::after {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  transition: var(--transition);
  background: #00b0f2;
  left: 40%;
  top: 40%;
  border-radius: 50%;
  z-index: -1;
}
.others5-section-area .all-social-area .telegram a.link {
  font-family: var(--font-primary);
  font-size: 16px;
  font-weight: 700;
  color: var(--Text-Color, #0d0e10);
  text-align: center;
  display: inline-block;
}
.others5-section-area .all-social-area .tiktok {
  text-align: center;
}
.others5-section-area .all-social-area .tiktok:hover .icons1::after {
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
}
.others5-section-area .all-social-area .tiktok .icons1 {
  height: 90px;
  width: 90px;
  text-align: center;
  line-height: 85px;
  border-radius: 50%;
  background: var(--white-100, #fff);
  border: 1px solid #eee7ef;
  margin: 0 auto;
  position: relative;
  z-index: 1;
}
.others5-section-area .all-social-area .tiktok .icons1:hover::after {
  height: 100%;
  width: 100%;
  transition: var(--transition);
  left: 0;
  top: 0;
}
.others5-section-area .all-social-area .tiktok .icons1::after {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  transition: var(--transition);
  background: var(--Text-Color, #0d0e10);
  left: 40%;
  top: 40%;
  border-radius: 50%;
  z-index: -1;
}
.others5-section-area .all-social-area .tiktok a.link {
  font-family: var(--font-primary);
  font-size: 16px;
  font-weight: 700;
  color: var(--Text-Color, #0d0e10);
  text-align: center;
  display: inline-block;
}
.others5-section-area .all-social-area .youtube {
  text-align: center;
}
.others5-section-area .all-social-area .youtube:hover .icons1::after {
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
}
.others5-section-area .all-social-area .youtube .icons1 {
  height: 90px;
  width: 90px;
  text-align: center;
  line-height: 85px;
  border-radius: 50%;
  background: var(--white-100, #fff);
  border: 1px solid #eee7ef;
  margin: 0 auto;
  position: relative;
  z-index: 1;
}
.others5-section-area .all-social-area .youtube .icons1:hover::after {
  height: 100%;
  width: 100%;
  transition: var(--transition);
  left: 0;
  top: 0;
}
.others5-section-area .all-social-area .youtube .icons1::after {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  transition: var(--transition);
  background: #ff0209;
  left: 40%;
  top: 40%;
  border-radius: 50%;
  z-index: -1;
}
.others5-section-area .all-social-area .youtube a.link {
  font-family: var(--font-primary);
  font-size: 16px;
  font-weight: 700;
  color: var(--Text-Color, #0d0e10);
  text-align: center;
  display: inline-block;
}
.others5-section-area .all-social-area .behance {
  text-align: center;
}
.others5-section-area .all-social-area .behance:hover .icons1::after {
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
}
.others5-section-area .all-social-area .behance .icons1 {
  height: 90px;
  width: 90px;
  text-align: center;
  line-height: 85px;
  border-radius: 50%;
  background: var(--white-100, #fff);
  margin: 0 auto;
  border: 1px solid #eee7ef;
  position: relative;
  z-index: 1;
}
.others5-section-area .all-social-area .behance .icons1:hover::after {
  height: 100%;
  width: 100%;
  transition: var(--transition);
  left: 0;
  top: 0;
}
.others5-section-area .all-social-area .behance .icons1::after {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  transition: var(--transition);
  background: #1877f7;
  left: 40%;
  top: 40%;
  border-radius: 50%;
  z-index: -1;
}
.others5-section-area .all-social-area .behance a.link {
  font-family: var(--font-primary);
  font-size: 16px;
  font-weight: 700;
  color: var(--Text-Color, #0d0e10);
  text-align: center;
  display: inline-block;
}
.others5-section-area .pinterest {
  text-align: center;
}
.others5-section-area .pinterest:hover .icons1::after {
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
}
.others5-section-area .pinterest .icons1 {
  height: 90px;
  width: 90px;
  text-align: center;
  line-height: 85px;
  border-radius: 50%;
  background: var(--white-100, #fff);
  margin: 0 auto;
  border: 1px solid #eee7ef;
  position: relative;
  z-index: 1;
}
.others5-section-area .pinterest .icons1:hover::after {
  height: 100%;
  width: 100%;
  transition: var(--transition);
  left: 0;
  top: 0;
}
.others5-section-area .pinterest .icons1::after {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  transition: var(--transition);
  background: #ff0000;
  left: 40%;
  top: 40%;
  border-radius: 50%;
  z-index: -1;
}
.others5-section-area .pinterest a.link {
  font-family: var(--font-primary);
  font-size: 16px;
  font-weight: 700;
  color: var(--Text-Color, #0d0e10);
  text-align: center;
  display: inline-block;
}
.others5-section-area .linkedin {
  text-align: center;
}
.others5-section-area .linkedin:hover .icons1::after {
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
}
.others5-section-area .linkedin .icons1 {
  height: 90px;
  width: 90px;
  text-align: center;
  line-height: 85px;
  border-radius: 50%;
  background: var(--white-100, #fff);
  margin: 0 auto;
  border: 1px solid #eee7ef;
  position: relative;
  z-index: 1;
}
.others5-section-area .linkedin .icons1:hover::after {
  height: 100%;
  width: 100%;
  transition: var(--transition);
  left: 0;
  top: 0;
}
.others5-section-area .linkedin .icons1::after {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  transition: var(--transition);
  background: #007ebb;
  left: 40%;
  top: 40%;
  border-radius: 50%;
  z-index: -1;
}
.others5-section-area .linkedin a.link {
  font-family: var(--font-primary);
  font-size: 16px;
  font-weight: 700;
  color: var(--Text-Color, #0d0e10);
  text-align: center;
  display: inline-block;
}
.others5-section-area .github {
  text-align: center;
}
.others5-section-area .github:hover .icons1::after {
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
}
.others5-section-area .github .icons1 {
  height: 90px;
  width: 90px;
  text-align: center;
  line-height: 85px;
  border-radius: 50%;
  background: var(--white-100, #fff);
  margin: 0 auto;
  border: 1px solid #eee7ef;
  position: relative;
  z-index: 1;
}
.others5-section-area .github .icons1:hover::after {
  height: 100%;
  width: 100%;
  transition: var(--transition);
  left: 0;
  top: 0;
}
.others5-section-area .github .icons1::after {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  transition: var(--transition);
  background: var(--Text-Color, #0d0e10);
  left: 40%;
  top: 40%;
  border-radius: 50%;
  z-index: -1;
}
.others5-section-area .github a.link {
  font-family: var(--font-primary);
  font-size: 16px;
  font-weight: 700;
  color: var(--Text-Color, #0d0e10);
  text-align: center;
  display: inline-block;
}
.others5-section-area .gtp {
  text-align: center;
}
.others5-section-area .gtp:hover .icons1::after {
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
}
.others5-section-area .gtp .icons1 {
  height: 90px;
  width: 90px;
  text-align: center;
  line-height: 85px;
  border-radius: 50%;
  background: var(--white-100, #fff);
  margin: 0 auto;
  border: 1px solid #eee7ef;
  position: relative;
  z-index: 1;
}
.others5-section-area .gtp .icons1:hover::after {
  height: 100%;
  width: 100%;
  transition: var(--transition);
  left: 0;
  top: 0;
}
.others5-section-area .gtp .icons1::after {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  transition: var(--transition);
  background: #0ea982;
  left: 40%;
  top: 40%;
  border-radius: 50%;
  z-index: -1;
}
.others5-section-area .gtp a.link {
  font-family: var(--font-primary);
  font-size: 16px;
  font-weight: 700;
  color: var(--Text-Color, #0d0e10);
  text-align: center;
  display: inline-block;
}
.others5-section-area .reddit {
  text-align: center;
}
.others5-section-area .reddit:hover .icons1::after {
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
}
.others5-section-area .reddit .icons1 {
  height: 90px;
  width: 90px;
  text-align: center;
  line-height: 85px;
  border-radius: 50%;
  background: var(--white-100, #fff);
  margin: 0 auto;
  border: 1px solid #eee7ef;
  position: relative;
  z-index: 1;
}
.others5-section-area .reddit .icons1:hover::after {
  height: 100%;
  width: 100%;
  transition: var(--transition);
  left: 0;
  top: 0;
}
.others5-section-area .reddit .icons1::after {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  transition: var(--transition);
  background: #ff4500;
  left: 40%;
  top: 40%;
  border-radius: 50%;
  z-index: -1;
}
.others5-section-area .reddit a.link {
  font-family: var(--font-primary);
  font-size: 16px;
  font-weight: 700;
  color: var(--Text-Color, #0d0e10);
  text-align: center;
  display: inline-block;
}
.others5-section-area .paypal {
  text-align: center;
}
.others5-section-area .paypal:hover .icons1::after {
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
}
.others5-section-area .paypal .icons1 {
  height: 90px;
  width: 90px;
  text-align: center;
  line-height: 85px;
  border-radius: 50%;
  background: var(--white-100, #fff);
  border: 1px solid #eee7ef;
  margin: 0 auto;
  position: relative;
  z-index: 1;
}
.others5-section-area .paypal .icons1:hover::after {
  height: 100%;
  width: 100%;
  transition: var(--transition);
  left: 0;
  top: 0;
}
.others5-section-area .paypal .icons1::after {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  transition: var(--transition);
  background: #0070ba;
  left: 40%;
  top: 40%;
  border-radius: 50%;
  z-index: -1;
}
.others5-section-area .paypal a.link {
  font-family: var(--font-primary);
  font-size: 16px;
  font-weight: 700;
  color: var(--Text-Color, #0d0e10);
  text-align: center;
  display: inline-block;
}
.others5-section-area .thumb {
  text-align: center;
}
.others5-section-area .thumb:hover .icons1::after {
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
}
.others5-section-area .thumb .icons1 {
  height: 90px;
  width: 90px;
  text-align: center;
  line-height: 85px;
  border-radius: 50%;
  border: 1px solid #eee7ef;
  background: var(--white-100, #fff);
  margin: 0 auto;
  position: relative;
  z-index: 1;
}
.others5-section-area .thumb .icons1:hover::after {
  height: 100%;
  width: 100%;
  transition: var(--transition);
  left: 0;
  top: 0;
}
.others5-section-area .thumb .icons1::after {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  transition: var(--transition);
  background: var(--Text-Color, #0d0e10);
  left: 40%;
  top: 40%;
  border-radius: 50%;
  z-index: -1;
}
.others5-section-area .thumb a.link {
  font-family: var(--font-primary);
  font-size: 16px;
  font-weight: 700;
  color: var(--Text-Color, #0d0e10);
  text-align: center;
  display: inline-block;
}

.homepage5-body {
  overflow-x: hidden !important;
}
@media (max-width: 767px) {
  .homepage5-body {
    overflow-x: hidden !important;
  }
}

.others-tools-section-area {
  background: #f8f9fa;
  position: relative;
}
@media (max-width: 767px) {
  .others-tools-section-area {
    padding: 50px 0 50px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .others-tools-section-area {
    padding: 50px 0 50px;
  }
}
.others-tools-section-area .tools-tabs-area ul {
  text-align: center;
  justify-content: center;
}
.others-tools-section-area .tools-tabs-area ul li.nav-item button {
  display: inline-block;
  align-items: center;
  text-align: start;
  font-size: 24px;
  font-weight: 700;
  color: var(--Text-Color, #0d0e10);
  font-family: var(--font-primary);
  background: var(--white-100, #fff);
  padding: 12px 16px;
  line-height: 24px;
  border-radius: 54px;
  width: 270px;
  height: 74px;
  margin: 0 30px 0 0;
}
@media (max-width: 767px) {
  .others-tools-section-area .tools-tabs-area ul li.nav-item button {
    margin: 0 0 16px 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .others-tools-section-area .tools-tabs-area ul li.nav-item button {
    margin: 0 16px 16px 0;
  }
}
.others-tools-section-area .tools-tabs-area ul li.nav-item button .img1 {
  height: 50px;
  width: 50px;
  text-align: center;
  display: inline-block;
  line-height: 50px;
  border-radius: 50%;
  background: #7d65f6;
  margin: 0 12px 0 0;
}
.others-tools-section-area .tools-tabs-area ul li.nav-item button .img1.red {
  background: #ffedec;
}
.others-tools-section-area .tools-tabs-area ul li.nav-item button .img1.purple {
  background: #fcefff;
}
.others-tools-section-area .tools-tabs-area ul li.nav-item button .img1.green {
  background: #e8f5f2;
}
.others-tools-section-area
  .tools-tabs-area
  ul
  li.nav-item
  button.nav-link.active {
  background: var(--purple);
  color: var(--white-100, #fff);
}
.others-tools-section-area .tools-tabs-area .tab-content .tab-pane {
  transform: rotateX(45deg);
  transition: var(--transition);
}
.others-tools-section-area
  .tools-tabs-area
  .tab-content
  .tab-pane
  .tools5-boxarea {
  background: var(--white-100, #fff);
  padding: 20px 16px;
  border-radius: 4px;
  position: relative;
  margin-bottom: 30px;
  transition: var(--transition);
  z-index: 1;
  overflow: hidden;
}
.others-tools-section-area
  .tools-tabs-area
  .tab-content
  .tab-pane
  .tools5-boxarea::after {
  position: absolute;
  content: "";
  height: 50px;
  width: 50px;
  left: 0;
  top: 0;
  background: var(--purple);
  z-index: -1;
  border-radius: 4px;
  visibility: hidden;
  opacity: 0;
  transition: var(--transition);
}
.others-tools-section-area
  .tools-tabs-area
  .tab-content
  .tab-pane
  .tools5-boxarea:hover {
  transform: translateY(-5px);
  transition: var(--transition);
}
.others-tools-section-area
  .tools-tabs-area
  .tab-content
  .tab-pane
  .tools5-boxarea:hover
  .images
  .img1 {
  background: var(--white-100, #fff);
  transition: var(--transition);
}
.others-tools-section-area
  .tools-tabs-area
  .tab-content
  .tab-pane
  .tools5-boxarea:hover
  .images
  .content
  a {
  color: var(--white-100, #fff);
  transition: var(--transition);
}
.others-tools-section-area
  .tools-tabs-area
  .tab-content
  .tab-pane
  .tools5-boxarea:hover
  a {
  color: var(--white-100, #fff) !important;
  transition: var(--transition);
}
.others-tools-section-area
  .tools-tabs-area
  .tab-content
  .tab-pane
  .tools5-boxarea:hover
  p {
  color: var(--white-100, #fff);
  transition: var(--transition);
}
.others-tools-section-area
  .tools-tabs-area
  .tab-content
  .tab-pane
  .tools5-boxarea:hover::after {
  top: 0;
  left: 0;
  right: 0;
  visibility: visible;
  opacity: 1;
  transition: var(--transition);
  height: 100%;
  width: 100%;
  border-radius: 4px;
}
.others-tools-section-area
  .tools-tabs-area
  .tab-content
  .tab-pane
  .tools5-boxarea
  .images {
  display: flex;
  align-items: center;
  transition: var(--transition);
}
.others-tools-section-area
  .tools-tabs-area
  .tab-content
  .tab-pane
  .tools5-boxarea
  .images
  .img1 {
  height: 40px;
  width: 40px;
  text-align: center;
  line-height: 40px;
  background: #eeebfe;
  border-radius: 50%;
  transition: var(--transition);
}
.others-tools-section-area
  .tools-tabs-area
  .tab-content
  .tab-pane
  .tools5-boxarea
  .images
  .content
  a {
  font-family: var(--font-primary);
  font-weight: 600;
  color: var(--Text-Color, #0d0e10);
  font-size: 20px;
  line-height: 30px;
  display: inline-block;
  margin-left: 12px;
  transition: var(--transition);
}
.others-tools-section-area
  .tools-tabs-area
  .tab-content
  .tab-pane
  .tools5-boxarea
  p {
  font-size: 16px;
  font-family: var(--font-primary);
  font-weight: 500;
  color: var(--body);
  line-height: 26px;
  transition: var(--transition);
}
.others-tools-section-area
  .tools-tabs-area
  .tab-content
  .tab-pane
  .tools5-boxarea
  a.learnmore {
  font-family: var(--font-primary);
  font-size: 16px;
  color: var(--Text-Color, #0d0e10);
  font-weight: 700;
  display: inline-block;
  position: relative;
  z-index: 1;
  line-height: 16px;
  transition: var(--transition);
}
.others-tools-section-area
  .tools-tabs-area
  .tab-content
  .tab-pane
  .tools5-boxarea
  a.learnmore::after {
  position: absolute;
  content: "";
  height: 1px;
  width: 0;
  left: 0;
  bottom: 0;
  background: var(--white-100, #fff);
  transition: var(--transition);
}
.others-tools-section-area
  .tools-tabs-area
  .tab-content
  .tab-pane
  .tools5-boxarea
  a.learnmore:hover {
  color: var(--white-100, #fff);
  transition: var(--transition);
}
.others-tools-section-area
  .tools-tabs-area
  .tab-content
  .tab-pane
  .tools5-boxarea
  a.learnmore:hover::after {
  width: 100%;
  transition: var(--transition);
}
.others-tools-section-area
  .tools-tabs-area
  .tab-content
  .tab-pane
  .tools5-boxarea
  a.learnmore:hover
  i {
  transform: rotate(-45deg);
  transition: var(--transition);
}
.others-tools-section-area
  .tools-tabs-area
  .tab-content
  .tab-pane
  .tools5-boxarea
  a.learnmore
  i {
  margin-left: 4px;
  transition: var(--transition);
}
.others-tools-section-area
  .tools-tabs-area
  .tab-content
  .tab-pane.fade.show.active {
  transform: rotateX(0);
  transition: var(--transition);
}

.error-section-area .error-content img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}
.error-section-area .error-content .content-area h3 {
  font-family: var(--font-primary);
  font-size: 40px;
  line-height: 42px;
  font-weight: 700;
  color: var(--Text-Color, #0d0e10);
  margin-bottom: 16px;
}
.error-section-area .error-content .content-area p {
  font-family: var(--font-primary);
  font-size: 16px;
  font-weight: 500;
  color: var(--Text-Color, #0d0e10);
  opacity: 0.7;
  line-height: 28px;
  margin-bottom: 24px;
}
.error-section-area .error-content .content-area .header-btn2 {
  background: var(--primary);
}

/*============= OTHERS CSS AREA ===============*/
/*============= WORKS CSS AREA ===============*/
.works1-section-area {
  position: relative;
  background: var(--bg-light);
}
@media (max-width: 767px) {
  .works1-section-area {
    padding: 50px 0 50px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .works1-section-area {
    padding: 50px 0 50px;
  }
}
.works1-section-area .works-bg-area {
  border-radius: var(--4, 4px);
  background: var(--white-100, #fff);
  padding: 40px 0;
  position: relative;
  overflow: hidden;
  z-index: 1;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .works1-section-area .works-bg-area {
    padding: 30px;
  }
}
@media (max-width: 767px) {
  .works1-section-area .works-bg-area {
    padding: 20px;
  }
}
.works1-section-area .works-bg-area .elements-works {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  z-index: -1;
}
.works1-section-area .works-bg-area .works-header span {
  color: var(--primary);
  font-family: var(--font-primary);
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  display: inline-block;
  margin-bottom: 16px;
}
.works1-section-area .works-bg-area .tabs-button {
  margin-left: 60px;
  margin-right: 60px;
}
@media (max-width: 767px) {
  .works1-section-area .works-bg-area .tabs-button {
    margin-left: 0;
    margin-right: 0;
  }
}
.works1-section-area .works-bg-area .tabs-button .nav-work {
  width: 100%;
  height: 100%;
  margin: 0 auto;
  border-radius: 36px;
  background: var(--white-100, #fff);
  box-shadow: 0px 4px 30px 0px rgba(0, 0, 0, 0.08);
  display: inline-block;
  padding: 16px 32px;
}
.works1-section-area .works-bg-area .tabs-button .nav-work a {
  color: var(--Text-Color, #0d0e10);
  text-align: center;
  font-family: var(--font-primary);
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 16px;
  display: inline-block;
  background: #f6f5fe;
  padding: 12px 24px;
  border-radius: 20px;
  margin: 0 16px 0 0;
}
@media (max-width: 767px) {
  .works1-section-area .works-bg-area .tabs-button .nav-work a {
    display: block;
    margin-bottom: 16px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .works1-section-area .works-bg-area .tabs-button .nav-work a {
    display: inline-block;
    margin-bottom: 16px;
  }
}
.works1-section-area .works-bg-area .tabs-button .nav-work a.active {
  background: var(--primary);
  color: var(--white-100, #fff);
}
.works1-section-area .works-bg-area .tabContainer {
  width: 100%;
  height: 500px;
  position: relative;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .works1-section-area .works-bg-area .tabContainer {
    height: 670px;
  }
}
.works1-section-area .works-bg-area .tabContainer .Tabcondent {
  overflow: hidden;
  position: absolute;
  width: 100%;
  height: 100%;
  opacity: 0;
  border-radius: 32px;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  transition: var(--transition);
  transform: translateY(50%);
}
.works1-section-area
  .works-bg-area
  .tabContainer
  .Tabcondent
  .tabs-img-content-area {
  margin-top: 40px;
}
.works1-section-area
  .works-bg-area
  .tabContainer
  .Tabcondent
  .tabs-img-content-area
  .tabs-auhtor-img
  img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 4px;
}
.works1-section-area
  .works-bg-area
  .tabContainer
  .Tabcondent
  .tabs-img-content-area
  .tabs-auhtor-content {
  padding: 0 0 0 40px;
}
@media (max-width: 767px) {
  .works1-section-area
    .works-bg-area
    .tabContainer
    .Tabcondent
    .tabs-img-content-area
    .tabs-auhtor-content {
    padding: 0;
    margin-top: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .works1-section-area
    .works-bg-area
    .tabContainer
    .Tabcondent
    .tabs-img-content-area
    .tabs-auhtor-content {
    padding: 0;
    margin-top: 30px;
  }
}
.works1-section-area
  .works-bg-area
  .tabContainer
  .Tabcondent
  .tabs-img-content-area
  .tabs-auhtor-content
  span {
  color: var(--primary);
  font-family: var(--font-primary);
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  display: inline-block;
}
.works1-section-area
  .works-bg-area
  .tabContainer
  .Tabcondent
  .tabs-img-content-area
  .tabs-auhtor-content
  h2 {
  font-size: 32px;
  line-height: 42px;
}
.works1-section-area
  .works-bg-area
  .tabContainer
  .Tabcondent
  .tabs-img-content-area
  .tabs-auhtor-content
  p {
  color: var(--body);
  font-family: var(--font-primary);
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 26px;
  margin-top: 10px;
}
.works1-section-area .works-bg-area .tabContainer .Tabcondent.active {
  width: 100%;
  height: 100%;
  opacity: 1;
  border-radius: 0px;
  transition: all 0.8s ease-in-out;
  transform: translateY(0);
}

@media (max-width: 767px) {
  .homepage6-body,
  html {
    overflow-x: hidden !important;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .homepage6-body,
  html {
    overflow-x: hidden !important;
  }
}

.works4-section-area {
  position: relative;
  padding: 100px 0 100px;
}
@media (max-width: 767px) {
  .works4-section-area {
    padding: 50px 0 50px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .works4-section-area {
    padding: 50px 0 50px;
  }
}
.works4-section-area .sticky-section-area {
  position: relative;
}
.works4-section-area .sticky-section-area .images {
  position: sticky !important;
  top: 100px;
}
.works4-section-area .sticky-section-area .sticky-text {
  margin-bottom: 50px;
  padding: 0 0 0 50px;
}
@media (max-width: 767px) {
  .works4-section-area .sticky-section-area .sticky-text {
    padding: 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .works4-section-area .sticky-section-area .sticky-text {
    padding: 0;
  }
}
.works4-section-area .sticky-section-area .sticky-text h3 {
  font-size: 16px;
  font-family: var(--font-primary);
  font-weight: 700;
  color: var(--violet);
}
.works4-section-area .sticky-section-area .sticky-text h2 {
  font-size: 32px;
  line-height: 42px;
  font-weight: 600;
}
.works4-section-area .sticky-section-area .sticky-text.text2 {
  margin-top: 130px;
  margin-bottom: 50px;
}
@media (max-width: 767px) {
  .works4-section-area .sticky-section-area .sticky-text.text2 {
    margin-top: 30px;
    margin-bottom: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .works4-section-area .sticky-section-area .sticky-text.text2 {
    margin-top: 30px;
    margin-bottom: 30px;
  }
}

@media (max-width: 767px) {
  .work5-section-area {
    padding: 50px 0 20px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .work5-section-area {
    padding: 50px 0 20px;
  }
}
.work5-section-area .work5-boxarea {
  border: 1px solid #eeeff1;
  padding: 32px;
  border-radius: 4px;
  position: relative;
  margin-bottom: 30px;
  transition: var(--transition);
}
.work5-section-area .work5-boxarea:hover {
  background: var(--white-100, #fff);
  box-shadow: 0px 4px 30px 0px rgba(0, 0, 0, 0.08);
  transition: var(--transition);
  border: 1px solid var(--white-100, #fff);
}
.work5-section-area .work5-boxarea:hover h2 {
  color: var(--purple);
  transition: var(--transition);
}
.work5-section-area .work5-boxarea .img {
  position: absolute;
  top: 50px;
  right: -25px;
  width: 30px;
  height: 30px;
}
.work5-section-area .work5-boxarea .img1 {
  position: absolute;
  top: 50px;
  right: -25px;
  width: 30px;
  height: 30px;
}
.work5-section-area .work5-boxarea h2 {
  font-size: 120px;
  font-weight: 700;
  color: var(--Text-Color, #0d0e10);
  font-family: var(--font-primary);
  line-height: 120px;
  transition: var(--transition);
}
.work5-section-area .work5-boxarea a {
  display: inline-block;
  font-size: 20px;
  font-weight: 600;
  color: var(--Text-Color, #0d0e10);
  font-family: var(--font-primary);
  line-height: 30px;
}
.work5-section-area .work5-boxarea p {
  font-family: var(--font-primary);
  font-size: 16px;
  font-weight: 500;
  color: var(--body);
  line-height: 26px;
  transition: var(--transition);
}

/*============= WORKS CSS AREA ENDS===============*/
/*============= BLOG CSS AREA ===============*/
.blog1-section-area {
  background: var(--bg-light);
}
@media (max-width: 767px) {
  .blog1-section-area {
    padding: 50px 0 50px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .blog1-section-area {
    padding: 50px 0 50px;
  }
}
.blog1-section-area .blog1-header span {
  color: var(--primary);
  font-family: var(--font-primary);
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  display: inline-block;
  margin-bottom: 16px;
}
.blog1-section-area .blog1-boxarea {
  border-radius: var(--4, 4px);
  border: 1px solid var(--Stroke-Color, rgba(86, 95, 118, 0.1));
  transition: var(--transition);
  margin-bottom: 30px;
}
.blog1-section-area .blog1-boxarea:hover {
  border-radius: var(--4, 4px);
  background: var(--white-100, #fff);
  box-shadow: 0px 4px 30px 0px rgba(0, 0, 0, 0.08);
}
.blog1-section-area .blog1-boxarea:hover .blog-img {
  transition: var(--transition);
}
.blog1-section-area .blog1-boxarea:hover .blog-img::after {
  height: 100%;
  width: 100%;
  transition: all 0.6s ease-in-out;
  z-index: 1;
  top: 0;
  bottom: auto;
}
.blog1-section-area .blog1-boxarea:hover .blog-img img {
  transform: scale(1.1);
  transition: var(--transition);
}
.blog1-section-area .blog1-boxarea .blog-img {
  overflow: hidden;
  border-radius: 4px 4px 0 0;
  position: relative;
  z-index: 1;
  transition: all 0.6s ease-in-out;
}
.blog1-section-area .blog1-boxarea .blog-img::after {
  position: absolute;
  content: "";
  height: 0;
  width: 100%;
  z-index: 1;
  bottom: 0;
  left: 0;
  transition: var(--transition);
  background: var(--primary);
  opacity: 0.3;
}
.blog1-section-area .blog1-boxarea .blog-img img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  transition: var(--transition);
}
.blog1-section-area .blog1-boxarea .blog-all-content-area {
  padding: 24px;
}
.blog1-section-area .blog1-boxarea .blog-all-content-area .blog1-content {
  display: flex;
  align-items: center;
}
.blog1-section-area .blog1-boxarea .blog-all-content-area .blog1-content img {
  margin: 0 10px 0 0;
}
.blog1-section-area .blog1-boxarea .blog-all-content-area .blog1-content a {
  color: var(--body);
  font-family: var(--font-primary);
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  display: inline-block;
  transition: var(--transition);
}
.blog1-section-area .blog1-boxarea .blog-all-content-area .blog-main-content a {
  color: var(--Text-Color, #0d0e10);
  font-family: var(--font-primary);
  font-size: 20px;
  font-style: normal;
  font-weight: 600;
  line-height: 28px;
  display: inline-block;
  margin-bottom: 16px;
  margin-top: 16px;
  transition: var(--transition);
}
.blog1-section-area
  .blog1-boxarea
  .blog-all-content-area
  .blog-main-content
  a:hover {
  color: var(--primary);
  transition: var(--transition);
}
.blog1-section-area .blog1-boxarea .blog-all-content-area .blog-main-content p {
  color: var(--body);
  font-family: var(--font-primary);
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 28px;
  transition: var(--transition);
}
.blog1-section-area
  .blog1-boxarea
  .blog-all-content-area
  .blog-main-content
  a.learnmore {
  color: var(--Text-Color, #0d0e10);
  font-family: var(--font-primary);
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 18px;
  display: inline-block;
  margin-top: 24px;
  margin-bottom: 0;
  transition: var(--transition);
}
.blog1-section-area
  .blog1-boxarea
  .blog-all-content-area
  .blog-main-content
  a.learnmore:hover {
  color: var(--primary);
  transition: var(--transition);
}
.blog1-section-area
  .blog1-boxarea
  .blog-all-content-area
  .blog-main-content
  a.learnmore
  i {
  margin-left: 4px;
  transform: rotate(-45deg);
}

.blog2-section-area {
  background: var(--BG, #f7f9fa);
}
@media (max-width: 767px) {
  .blog2-section-area {
    padding: 50px 0 20px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .blog2-section-area {
    padding: 50px 0 20px;
  }
}

.blog2-section-area .blog-box-area2 {
  border-radius: 10px;
  border: 1px solid var(--Stroke-Color, rgba(86, 95, 118, 0.1));
  transition: var(--transition);
  margin-bottom: 30px;
}
.blog2-section-area .blog-box-area2:hover {
  border: 1px solid var(--BG, #f7f9fa);
}
.blog2-section-area .blog-box-area2:hover .blog-all-boxarea {
  border-radius: 0 0 10px 10px;
  background: var(--white-100, #fff);
  box-shadow: 0px 4px 50px 0px rgba(0, 0, 0, 0.08);
  transition: var(--transition);
}
.blog2-section-area .blog-box-area2:hover .blog2-img {
  transition: var(--transition);
}
.blog2-section-area .blog-box-area2:hover .blog2-img::after {
  height: 100%;
  width: 100%;
  transition: var(--transition);
}
.blog2-section-area .blog-box-area2:hover .blog2-img img {
  transform: scale(1.1);
  transition: var(--transition);
}
.blog2-section-area .blog-box-area2 .blog2-img {
  overflow: hidden;
  transition: var(--transition);
  border-radius: 10px 10px 0 0;
  position: relative;
}
.blog2-section-area .blog-box-area2 .blog2-img::after {
  position: absolute;
  content: "";
  height: 0;
  width: 100%;
  transition: var(--transition);
  z-index: 1;
  left: 0;
  top: 0;
  background: var(--secondary);
  opacity: 0.3;
  border-radius: 10px 10px 0 0;
}
.blog2-section-area .blog-box-area2 .blog2-img img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 4px 4px 0 0;
  transition: var(--transition);
}
.blog2-section-area .blog-box-area2 .blog-all-boxarea {
  padding: 24px;
  transition: var(--transition);
  border-radius: 0 0 10px 10px;
}
.blog2-section-area .blog-box-area2 .blog-all-boxarea .blog-tags-area {
  display: flex;
  align-items: center;
}
.blog2-section-area .blog-box-area2 .blog-all-boxarea .blog-tags-area a {
  color: var(--body);
  font-family: var(--font-primary);
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 14px;
  transition: var(--transition);
  display: inline-block;
}
.blog2-section-area .blog-box-area2 .blog-all-boxarea .blog-tags-area .date {
  transition: var(--transition);
  margin: -7px 0 0 16px;
}
.blog2-section-area
  .blog-box-area2
  .blog-all-boxarea
  .blog-tags-area
  .date
  a
  img {
  transition: var(--transition);
  margin: 0 6px 0 0;
}
.blog2-section-area .blog-box-area2 .blog-all-boxarea .blog2-content a {
  color: var(--Text-Color, #0d0e10);
  font-family: var(--font-primary);
  font-size: 20px;
  font-style: normal;
  font-weight: 600;
  line-height: 20px;
  display: inline-block;
  margin-bottom: 16px;
  margin-top: 16px;
  text-transform: capitalize;
  transition: var(--transition);
}
.blog2-section-area .blog-box-area2 .blog-all-boxarea .blog2-content a:hover {
  color: var(--secondary);
  transition: var(--transition);
}
.blog2-section-area .blog-box-area2 .blog-all-boxarea .blog2-content p {
  color: var(--body);
  font-family: var(--font-primary);
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  transition: var(--transition);
  line-height: 28px;
}
.blog2-section-area .blog-box-area2 .blog-all-boxarea .blog2-content .readmore {
  color: var(--Text-Color, #0d0e10);
  font-family: var(--font-primary);
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 18px;
  text-transform: capitalize;
  margin-bottom: 0 !important;
  transition: var(--transition);
  margin-top: 20px !important;
}
.blog2-section-area
  .blog-box-area2
  .blog-all-boxarea
  .blog2-content
  .readmore:hover {
  color: var(--secondary);
  transition: var(--transition);
}
.blog2-section-area
  .blog-box-area2
  .blog-all-boxarea
  .blog2-content
  .readmore
  i {
  margin-left: 4px;
  transform: rotate(-45deg);
}

.blog-inner-section {
  padding: 100px 0 70px 0;
}
@media (max-width: 767px) {
  .blog-inner-section {
    padding: 50px 0 20px 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .blog-inner-section {
    padding: 50px 0 20px 0;
  }
}
.blog-inner-section .blog-inner-content .blog-inner-header span {
  font-family: var(--font-primary);
  font-weight: 500;
  color: var(--secondary);
  transition: var(--transition);
  font-size: 16px;
  line-height: 16px;
  display: inline-block;
  padding: 8px 12px;
  border-radius: 32px;
  background: var(--tag);
}
.blog-inner-section .blog-inner-content .content-area {
  margin-top: 20px;
}
.blog-inner-section .blog-inner-content .blog-inner-boxs {
  box-shadow: 0px 4px 50px 0px rgba(0, 0, 0, 0.08);
  padding: 32px;
  border-radius: 4px;
  transition: var(--transition);
}
.blog-inner-section .blog-inner-content .blog-inner-boxs:hover .images::after {
  height: 100%;
  width: 100%;
  border-radius: 4px;
  transition: var(--transition);
}
.blog-inner-section .blog-inner-content .blog-inner-boxs:hover .images img {
  transform: scale(1.1);
  transition: var(--transition);
  rotate: -4deg;
}
.blog-inner-section .blog-inner-content .blog-inner-boxs .images {
  transition: var(--transition);
  overflow: hidden;
  border-radius: 4px;
  position: relative;
}
.blog-inner-section .blog-inner-content .blog-inner-boxs .images::after {
  position: absolute;
  content: "";
  height: 0;
  width: 100%;
  left: 0;
  top: 0;
  background: var(--secondary);
  opacity: 0.5;
  transition: var(--transition);
}
.blog-inner-section .blog-inner-content .blog-inner-boxs .images img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 4px;
  transition: var(--transition);
}
.blog-inner-section .blog-inner-content .blog-inner-boxs .content {
  padding: 0 0 0 30px;
}
@media (max-width: 767px) {
  .blog-inner-section .blog-inner-content .blog-inner-boxs .content {
    padding: 0;
    margin-top: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .blog-inner-section .blog-inner-content .blog-inner-boxs .content {
    padding: 0;
    margin-top: 30px;
  }
}
.blog-inner-section .blog-inner-content .blog-inner-boxs .content a {
  font-family: var(--font-primary);
  font-size: 24px;
  line-height: 30px;
  font-weight: 600;
  color: var(--Text-Color, #0d0e10);
  display: block;
  transition: var(--transition);
}
.blog-inner-section .blog-inner-content .blog-inner-boxs .content a:hover {
  color: var(--secondary);
  transition: var(--transition);
}
.blog-inner-section .blog-inner-content .blog-inner-boxs .content p {
  font-family: var(--font-primary);
  font-size: 16px;
  font-weight: 500;
  color: var(--body);
  line-height: 26px;
}
.blog-inner-section .blog-inner-content .blog-inner-boxarea {
  position: relative;
  margin-bottom: 30px;
  padding: 24px;
  box-shadow: 0px 4px 50px 0px rgba(0, 0, 0, 0.08);
  background: var(--white-100, #fff);
  border-radius: 4px;
}
.blog-inner-section
  .blog-inner-content
  .blog-inner-boxarea:hover
  .images::after {
  height: 100%;
  width: 100%;
  transition: var(--transition);
}
.blog-inner-section .blog-inner-content .blog-inner-boxarea:hover .images img {
  transition: var(--transition);
  transform: scale(1.1) rotate(-4deg);
}
.blog-inner-section .blog-inner-content .blog-inner-boxarea .images {
  transition: var(--transition);
  overflow: hidden;
  border-radius: 4px;
  position: relative;
}
.blog-inner-section .blog-inner-content .blog-inner-boxarea .images::after {
  position: absolute;
  content: "";
  height: 0;
  width: 100%;
  left: 0;
  top: 0;
  background: var(--secondary);
  opacity: 0.5;
  transition: var(--transition);
}
.blog-inner-section .blog-inner-content .blog-inner-boxarea .images img {
  height: 100%;
  width: 100%;
  border-radius: 4px;
  transition: var(--transition);
}
.blog-inner-section .blog-inner-content .blog-inner-boxarea .content a {
  font-family: var(--font-primary);
  font-size: 24px;
  line-height: 30px;
  font-weight: 600;
  color: var(--Text-Color, #0d0e10);
  display: block;
  transition: var(--transition);
}
.blog-inner-section .blog-inner-content .blog-inner-boxarea .content a:hover {
  color: var(--secondary);
  transition: var(--transition);
}
.blog-inner-section .blog-inner-content .blog-inner-boxarea .content p {
  font-family: var(--font-primary);
  font-size: 16px;
  font-weight: 500;
  color: var(--body);
  line-height: 26px;
}

.blog-artical-area {
  background: var(--BG, #f7f9fa);
  position: relative;
}
@media (max-width: 767px) {
  .blog-artical-area {
    padding: 50px 0 50px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .blog-artical-area {
    padding: 50px 0 50px;
  }
}
.blog-artical-area .blog-artical-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
@media (max-width: 767px) {
  .blog-artical-area .blog-artical-header {
    display: inline-block;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .blog-artical-area .blog-artical-header {
    display: inline-block;
  }
}
.blog-artical-area .blog-artical-header h2 {
  font-size: 42px;
  line-height: 52px;
}
@media (max-width: 767px) {
  .blog-artical-area .blog-artical-header h2 {
    font-size: 32px;
    line-height: 42px;
  }
}
@media (max-width: 767px) {
  .blog-artical-area .blog-artical-header ul {
    margin-top: 20px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .blog-artical-area .blog-artical-header ul {
    margin-top: 20px;
  }
}
.blog-artical-area .blog-artical-header ul li button {
  background: var(--tag);
  display: inline-block;
  font-family: var(--font-primary);
  font-size: 18px;
  font-weight: 700;
  color: var(--secondary);
  padding: 8px 24px;
  line-height: 16px;
  border-radius: 32px;
  margin: 0 16px 0 0;
  border: none;
  outline: none;
  cursor: pointer;
}
@media (max-width: 767px) {
  .blog-artical-area .blog-artical-header ul li button {
    margin-bottom: 10px;
    text-align: center;
  }
}
.blog-artical-area .blog-artical-header ul li .nav-link.active {
  background: var(--secondary);
  color: var(--white-100, #fff);
}
.blog-artical-area .blog-inner-tabs {
  box-shadow: 0px 4px 50px 0px rgba(0, 0, 0, 0.08);
  padding: 24px 16px;
  border-radius: 4px;
  position: relative;
  margin: 0 30px 30px 0;
}
@media (max-width: 767px) {
  .blog-artical-area .blog-inner-tabs {
    margin: 0 0 30px 0;
  }
}
.blog-artical-area .blog-inner-tabs:hover .img1::after {
  height: 100%;
  width: 100%;
  transition: var(--transition);
}
.blog-artical-area .blog-inner-tabs:hover .img1 img {
  transform: scale(1.1) rotate(-4deg);
  transition: var(--transition);
}
.blog-artical-area .blog-inner-tabs .img1 {
  overflow: hidden;
  transition: var(--transition);
  border-radius: 4px;
  position: relative;
  z-index: 1;
}
.blog-artical-area .blog-inner-tabs .img1::after {
  position: absolute;
  content: "";
  height: 0;
  width: 100%;
  border-radius: 4px;
  background: var(--secondary);
  opacity: 0.5;
  transition: var(--transition);
  left: 0;
  top: 0;
}
.blog-artical-area .blog-inner-tabs .img1 img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  transition: var(--transition);
  border-radius: 4px;
}
.blog-artical-area .blog-inner-tabs .content-area span {
  background: var(--tag);
  font-family: var(--font-primary);
  font-weight: 500;
  color: var(--secondary);
  display: inline-block;
  padding: 8px 12px;
  line-height: 16px;
  font-size: 16px;
  border-radius: 32px;
}
.blog-artical-area .blog-inner-tabs .content-area a {
  font-family: var(--font-primary);
  font-size: 24px;
  line-height: 30px;
  font-weight: 600;
  color: var(--Text-Color, #0d0e10);
  display: block;
  transition: var(--transition);
}
.blog-artical-area .blog-inner-tabs .content-area a:hover {
  color: var(--secondary);
  transition: var(--transition);
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .blog-artical-area .blog-inner-tabs .content-area a {
    font-size: 20px;
    line-height: 30px;
  }
}
.blog-artical-area .blog-inner-tabs .content-area p {
  font-size: 16px;
  font-family: var(--font-primary);
  font-weight: 500;
  color: var(--body);
  line-height: 26px;
}

.blog-inner-section.inner-section2 {
  padding: 100px 0 100px;
}
@media (max-width: 767px) {
  .blog-inner-section.inner-section2 {
    padding: 50px 0 50px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .blog-inner-section.inner-section2 {
    padding: 50px 0 50px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .blog-inner-section.inner-section2 .blog-inner-boxarea .content a {
    font-size: 20px;
    line-height: 30px;
  }
}
.blog-inner-section.inner-section2 .blog-inner-boxarea .content a.readmore {
  font-family: var(--font-primary);
  font-size: 16px;
  font-weight: 700;
  color: var(--Text-Color, #0d0e10);
  display: inline-block;
  position: relative;
  z-index: 1;
  line-height: 20px;
  transition: var(--transition);
}
.blog-inner-section.inner-section2
  .blog-inner-boxarea
  .content
  a.readmore::after {
  position: absolute;
  content: "";
  height: 0;
  width: 0;
  left: 0;
  bottom: 0;
  background: var(--secondary);
  transition: var(--transition);
}
.blog-inner-section.inner-section2
  .blog-inner-boxarea
  .content
  a.readmore:hover {
  color: var(--secondary);
  transition: var(--transition);
}
.blog-inner-section.inner-section2
  .blog-inner-boxarea
  .content
  a.readmore:hover::after {
  height: 1px;
  width: 100%;
  transition: var(--transition);
}
.blog-inner-section.inner-section2 .blog-inner-boxarea .content a.readmore i {
  margin-left: 4px;
  transform: rotate(-45deg);
}
.blog-inner-section.inner-section2 .pagination-area nav ul {
  justify-content: center;
}
.blog-inner-section.inner-section2 .pagination-area nav ul li a {
  font-family: var(--font-primary);
  font-size: 16px;
  font-weight: 700;
  color: var(--Text-Color, #0d0e10);
  height: 55px;
  width: 55px;
  text-align: center;
  line-height: 43px;
  border-radius: 50%;
  box-shadow: none;
  margin: 0 10px 0 0;
  transition: var(--transition);
  border: 1px solid var(--Stroke-Color, rgba(86, 95, 118, 0.1));
}
.blog-inner-section.inner-section2 .pagination-area nav ul li a:hover {
  background: var(--secondary);
  transition: var(--transition);
  color: var(--white-100, #fff);
}
.blog-inner-section.inner-section2 .pagination-area nav ul li a.active {
  background: var(--secondary);
  color: var(--white-100, #fff);
  transition: var(--transition);
}

.blog-right-details-area {
  background: var(--BG, #f7f9fa);
  position: relative;
}
@media (max-width: 767px) {
  .blog-right-details-area {
    padding: 50px 0 50px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .blog-right-details-area {
    padding: 50px 0 50px;
  }
}
.blog-right-details-area .blog-right-area {
  padding: 0 40px 0 0;
}
@media (max-width: 767px) {
  .blog-right-details-area .blog-right-area {
    padding: 0;
    margin-bottom: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .blog-right-details-area .blog-right-area {
    padding: 0;
    margin-bottom: 30px;
  }
}
.blog-right-details-area .blog-right-area .img1-inner img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 4px;
}
.blog-right-details-area .blog-right-area .blog-list-area {
  display: flex;
}
.blog-right-details-area .blog-right-area .blog-list-area .img1 img {
  margin: 0 30px 0 0;
}
.blog-right-details-area .blog-right-area .blog-list-area .content span {
  font-weight: 700;
  color: var(--Text-Color, #0d0e10);
  display: inline-block;
}
.blog-right-details-area
  .blog-right-area
  .blogs-widget-area
  .blogs-widget-section {
  margin-bottom: 30px;
}
.blog-right-details-area
  .blog-right-area
  .blogs-widget-area
  .blogs-widget-section
  .img1
  img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 4px;
}
.blog-right-details-area
  .blog-right-area
  .blogs-widget-area
  .blogs-widget-section
  .content
  h3 {
  font-size: 32px;
  line-height: 42px;
}
.blog-right-details-area .blog-right-area .img3 img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 4px;
  transition: var(--transition);
}
.blog-right-details-area .blog-right-area .peragraph-box {
  padding: 50px 85px;
  background: #f0eefa;
  border-radius: 4px;
}
@media (max-width: 767px) {
  .blog-right-details-area .blog-right-area .peragraph-box {
    padding: 30px;
  }
}
.blog-right-details-area .blog-right-area .peragraph-box p {
  font-size: 24px;
  font-family: var(--font-primary);
  font-weight: 700;
  color: var(--Text-Color, #0d0e10);
  line-height: 34px;
}
.blog-right-details-area .blog-team-area .blog-team-images {
  position: relative;
  box-shadow: 0px 4px 50px 0px rgba(0, 0, 0, 0.08);
}
.blog-right-details-area .blog-team-area .blog-team-images .img1 img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 4px 4px 0 0;
}
.blog-right-details-area .blog-team-area .blog-team-images .content-area {
  text-align: center;
  background: var(--white-100, #fff);
  padding: 38px 24px 24px 24px;
  border-radius: 0 0 4px 4px;
  position: relative;
}
.blog-right-details-area
  .blog-team-area
  .blog-team-images
  .content-area
  .ceo-tags
  p {
  font-size: 12px;
  font-weight: 500;
  color: var(--secondary);
  font-family: var(--font-primary);
  padding: 8px;
  background: var(--white-100, #fff);
  border: 1px solid var(--secondary);
  position: absolute;
  display: inline-block;
  border-radius: 25px;
  line-height: 12px;
  top: -17px;
  left: 40%;
}
.blog-right-details-area .blog-team-area .blog-team-images .content-area a {
  display: inline-block;
  font-family: var(--font-primary);
  font-size: 32px;
  line-height: 32px;
  font-weight: 700;
  color: var(--Text-Color, #0d0e10);
}
.blog-right-details-area .blog-team-area .blog-team-images .content-area p {
  font-family: var(--font-primary);
  font-weight: 500;
  color: var(--body);
  font-size: 16px;
  line-height: 26px;
}
.blog-right-details-area .blog-team-area .blog-team-images .content-area ul li {
  display: inline-block;
}
.blog-right-details-area
  .blog-team-area
  .blog-team-images
  .content-area
  ul
  li
  a {
  height: 40px;
  width: 40px;
  display: inline-block;
  text-align: center;
  line-height: 40px;
  border-radius: 50%;
  background: #f6f5fe;
  font-size: 20px;
  margin: 0 4px 0 0;
  transition: var(--transition);
}
.blog-right-details-area
  .blog-team-area
  .blog-team-images
  .content-area
  ul
  li
  a:hover {
  background: var(--secondary);
  color: var(--white-100, #fff);
  transition: var(--transition);
  transform: translateY(-3px);
}
.blog-right-details-area .blog-team-area .catagories-area {
  background: var(--white-100, #fff);
  padding: 24px;
  border-radius: 4px;
  position: relative;
  box-shadow: 0px 4px 50px 0px rgba(0, 0, 0, 0.08);
}
.blog-right-details-area .blog-team-area .catagories-area h2 {
  font-size: 32px;
  line-height: 42px;
}
.blog-right-details-area .blog-team-area .catagories-area ul li a {
  font-size: 20px;
  font-weight: 700;
  color: var(--Text-Color, #0d0e10);
  display: inline-block;
  font-family: var(--font-primary);
  line-height: 30px;
  background: #f6f5fe;
  border-radius: 4px;
  padding: 16px 16px 16px 22px;
  transition: var(--transition);
  position: relative;
  z-index: 1;
}
.blog-right-details-area .blog-team-area .catagories-area ul li a::after {
  position: absolute;
  content: "";
  height: 100%;
  width: 6px;
  left: 0;
  top: 0;
  border-radius: 0 4px 4px 0;
  transition: var(--transition);
  z-index: -1;
  background: var(--secondary);
}
.blog-right-details-area .blog-team-area .catagories-area ul li a:hover {
  transition: var(--transition);
  color: var(--white-100, #fff);
  transform: translateY(-5px);
}
.blog-right-details-area .blog-team-area .catagories-area ul li a:hover::after {
  width: 100%;
  height: 100%;
  transition: var(--transition);
}

.blog-right-area.blog-left {
  padding: 0 0 0 50px;
}
@media (max-width: 767px) {
  .blog-right-area.blog-left {
    padding: 0;
    margin-top: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .blog-right-area.blog-left {
    padding: 0;
    margin-top: 30px;
  }
}
.blog-right-area.blog-left .img1-inner img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 4px;
}

.blog4-section-area {
  background: #f8f9fa;
  position: relative;
}
.blog4-section-area .blog4-boxarea {
  position: relative;
  margin-bottom: 30px;
}
.blog4-section-area .blog4-boxarea:hover .img1::after {
  height: 100%;
  width: 100%;
}
.blog4-section-area .blog4-boxarea:hover .img1 img {
  transform: scale(1.1) rotate(-4deg);
  transition: var(--transition);
}
.blog4-section-area .blog4-boxarea .img1 {
  transition: var(--transition);
  border-radius: 4px;
  position: relative;
  z-index: 1;
  overflow: hidden;
}
.blog4-section-area .blog4-boxarea .img1::after {
  position: absolute;
  content: "";
  height: 0;
  width: 100%;
  left: 0;
  top: 0;
  background: var(--violet);
  transition: var(--transition);
  opacity: 0.5;
  border-radius: 4px;
}
.blog4-section-area .blog4-boxarea .img1 img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  transition: var(--transition);
}
.blog4-section-area .blog4-boxarea .blog-content {
  background: var(--white-100, #fff);
  border-radius: 5px;
  padding: 24px 16px;
  transition: var(--transition);
  position: relative;
  margin: -135px 16px 0 16px;
  z-index: 2;
}
.blog4-section-area .blog4-boxarea .blog-content .date {
  display: flex;
  align-items: center;
}
.blog4-section-area .blog4-boxarea .blog-content .date a {
  font-size: 16px;
  font-weight: 500;
  color: var(--body);
  font-family: var(--font-primary);
  display: inline-block;
}
.blog4-section-area .blog4-boxarea .blog-content .date a img {
  margin: -3px 6px 0 0;
}
.blog4-section-area .blog4-boxarea .blog-content .date .social {
  margin: 0 16px 0 0;
}
.blog4-section-area .blog4-boxarea .blog-content a {
  font-family: var(--font-primary);
  font-size: 20px;
  font-weight: 600;
  color: var(--Text-Color, #0d0e10);
  display: inline-block;
  line-height: 28px;
  transition: var(--transition);
}
.blog4-section-area .blog4-boxarea .blog-content a:hover {
  color: var(--violet);
  transition: var(--transition);
}
.blog4-section-area .blog4-boxarea .blog-content p {
  font-size: 16px;
  font-family: var(--font-primary);
  font-weight: 500;
  color: var(--body);
  line-height: 26px;
}
.blog4-section-area .blog4-boxarea .blog-content .readmore {
  font-size: 16px;
  font-family: var(--font-primary);
  font-weight: 700;
  color: var(--Text-Color, #0d0e10);
  display: inline-block;
}
.blog4-section-area .blog4-boxarea .blog-content .readmore i {
  margin-left: 4px;
  transform: rotate(-45deg);
}

/*============= BLOG CSS AREA ENDS ===============*/
.cta3-modern{
  position: relative;
  overflow: hidden;
  padding: 90px 0;
  background: url("../images/all-images/cta-bg1.jpg") center/cover no-repeat;
}

.cta3-modern .cta3-overlay{
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(120deg,
    rgba(0, 44, 139, 0.7),
    rgba(0, 0, 0, 0.5)
  );
}

.cta3-modern::before{
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  background-image: radial-gradient(rgba(255,255,255,0.18) 1px, transparent 1px);
  background-size: 18px 18px;
  opacity: 0.35;
}

.cta3-modern::after{
  content: "";
  position: absolute;
  width: 500px;
  height: 500px;
  border-radius: 50%;
  background: rgba(255,255,255,0.12);
  top: -180px;
  left: -180px;
  filter: blur(30px);
  z-index: 2;
}

.cta3-modern .container,
.cta3-modern .cta3-header-area{
  position: relative;
  z-index: 5;
}


.cta3-modern ul{
  margin: 0;
  padding: 0;
  list-style: none;

  display: flex;
  justify-content: center;
  align-items: center;
  gap: 18px;
  flex-wrap: wrap;
}

.cta3-modern ul li{
  color: rgba(255,255,255,0.92) !important;
  font-size: 18px;
  display: flex;
  font-weight: 400;
  gap: 10px;
  align-items: center;
}

.cta3-modern .cta3-divider-dot{
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: rgba(255,255,255,0.75);
}

.cta3-modern .cta3-btns{
  display: flex;
  justify-content: center;
  gap: 14px;
  flex-wrap: wrap;
}

.cta3-modern .header-btn2:hover,
.cta3-modern .header-btn3:hover{
  transform: translateY(-2px);
}


@media (max-width: 480px){
  .cta3-modern h2{
    font-size: 26px !important;
  }

  .cta3-modern ul li{
    font-size: 14px;
  }
}




@media (max-width: 767px) {
  .cta3-modern{
    padding: 70px 0;
    border-radius: 18px;
  }

  .cta3-modern h2{
    font-size: 32px !important;
  }

  .cta3-modern ul{
    gap: 12px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .cta3-section-area {
    padding: 40px 0 40px;
  }
}
.cta3-section-area .cta3-header-area h2 {
  color: var(--white-100, #fff);
}

.login-footer {
  background: var(--white-100, #fff);
  padding: 50px 0;
}
@media (max-width: 767px) {
  .login-footer {
    padding: 25px 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .login-footer {
    padding: 25px 0;
  }
}
.login-footer .copyright-social-area {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
@media (max-width: 767px) {
  .login-footer .copyright-social-area {
    display: inline-block;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .login-footer .copyright-social-area {
    display: inline-block;
  }
}
@media (max-width: 767px) {
  .login-footer .copyright-social-area img {
    margin-bottom: 20px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .login-footer .copyright-social-area img {
    margin-bottom: 20px;
  }
}
.login-footer .copyright-social-area ul li {
  display: inline-block;
  position: relative;
  margin: 0 20px 0 0;
}
.login-footer .copyright-social-area ul li::after {
  position: absolute;
  content: "";
  height: 12px;
  width: 1px;
  background: #dddddd;
  right: -13px;
  top: 10px;
}
.login-footer .copyright-social-area ul li p {
  color: var(--body);
  font-family: var(--font-primary);
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  display: inline-block;
}
.login-footer .copyright-social-area ul li a {
  color: var(--body);
  font-family: var(--font-primary);
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  display: inline-block;
  position: relative;
  cursor: pointer;
  z-index: 1;
}
.login-footer .copyright-social-area ul.social-links li {
  margin: 0 6px 0 0;
}
.login-footer .copyright-social-area ul.social-links li::after {
  display: none;
}
.login-footer .copyright-social-area ul.social-links li a {
  height: 32px;
  width: 32px;
  display: inline-block;
  line-height: 32px;
  text-align: center;
  border-radius: 50%;
  transition: var(--transition);
  color: var(--Text-Color, #0d0e10);
  background: #f6f5fe;
  font-size: 16px;
}
.login-footer .copyright-social-area ul.social-links li a svg {
  margin-left: 2px;
}
.login-footer .copyright-social-area ul.social-links li a:hover {
  background: var(--secondary);
  transition: var(--transition);
  color: var(--white-100, #fff);
}

.cta4-section-area {
  position: relative;
  padding: 200px 0;
  background: var(--violet);
}
@media (max-width: 767px) {
  .cta4-section-area {
    padding: 50px 0 50px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .cta4-section-area {
    padding: 50px 0 50px;
  }
}
.cta4-section-area .cta-bg-area {
  position: relative;
}
.cta4-section-area .cta-bg-area .cta-content-area {
  padding: 0 50px;
}
.cta4-section-area .cta-bg-area .cta-content-area h2 {
  color: var(--white-100, #fff);
}
.cta4-section-area .cta-bg-area .cta-content-area p {
  color: var(--white-100, #fff);
  opacity: 0.8;
}
@media (max-width: 767px) {
  .cta4-section-area .cta-bg-area .cta-content-area {
    padding: 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .cta4-section-area .cta-bg-area .cta-content-area {
    padding: 0;
  }
}
.cta4-section-area .cta-bg-area .cta-content-area .header-btn7 {
  background: var(--white-100, #fff);
  color: var(--violet);
}
.cta4-section-area .cta-bg-area .cta-content-area .header-btn7:hover {
  color: var(--white-100, #fff);
}
.cta4-section-area .cta-bg-area .cta-content-area .header-btn8 {
  font-family: var(--font-primary);
  font-size: 16px;
  font-weight: 700;
  color: var(--white-100, #fff);
  border: 1px solid var(--white-100, #fff);
  display: inline-block;
  padding: 15px;
  line-height: 16px;
  border-radius: 4px;
  margin-left: 16px;
  position: relative;
  background: none;
  transition: var(--transition);
}
.cta4-section-area .cta-bg-area .cta-content-area .header-btn8::after {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  left: 44%;
  bottom: 0;
  right: 44%;
  top: 35%;
  background: #43054e;
  transition: var(--transition);
  border-radius: 50%;
  z-index: -1;
  visibility: hidden;
  opacity: 0;
}
.cta4-section-area .cta-bg-area .cta-content-area .header-btn8:hover {
  color: var(--white-100, #fff);
  transition: var(--transition);
  transform: translateY(-5px);
  border: 1px solid #43054e;
}
.cta4-section-area .cta-bg-area .cta-content-area .header-btn8:hover::after {
  height: 100%;
  width: 100%;
  border-radius: 4px;
  transition: var(--transition);
  left: 0;
  visibility: visible;
  opacity: 1;
  top: 0;
}

.footer2-section-area.footer4-section {
  background: var(--white-100, #fff);
  padding: 80px 0 0 0;
}
.footer2-section-area.footer4-section .footer2-last-section {
  background: none;
  padding: 0;
  border: none;
}
.footer2-section-area.footer4-section
  .footer2-last-section
  .footer-auhtor-area
  h3 {
  color: var(--Text-Color, #0d0e10);
}
.footer2-section-area.footer4-section
  .footer2-last-section
  .footer-auhtor-area
  p {
  color: #565658;
}
.footer2-section-area.footer4-section
  .footer2-last-section
  .footer-auhtor-area
  ul
  li
  a {
  color: #565658;
}
.footer2-section-area.footer4-section
  .footer2-last-section
  .footer-auhtor-area
  ul
  li
  a:hover {
  color: var(--violet);
}
.footer2-section-area.footer4-section
  .footer2-last-section
  .footer-auhtor-area
  ul.social-links
  li {
  display: inline-block;
  margin: 0 6px 0 0;
}
.footer2-section-area.footer4-section
  .footer2-last-section
  .footer-auhtor-area
  ul.social-links
  li::after {
  display: none;
}
.footer2-section-area.footer4-section
  .footer2-last-section
  .footer-auhtor-area
  ul.social-links
  li
  a {
  height: 32px;
  width: 32px;
  display: inline-block;
  line-height: 32px;
  text-align: center;
  border-radius: 50%;
  transition: var(--transition);
  color: var(--violet);
  background: var(--tag2);
  font-size: 16px;
}
.footer2-section-area.footer4-section
  .footer2-last-section
  .footer-auhtor-area
  ul.social-links
  li
  a:hover {
  background: var(--violet);
  transition: var(--transition);
  color: var(--white-100, #fff);
  padding-left: 0;
  transform: translateY(-3px);
}
.footer2-section-area.footer4-section .copyright-social-area {
  padding: 16px 0 24px;
  border-top: 1px solid #cfcfcf;
}
.footer2-section-area.footer4-section .copyright-social-area ul li::after {
  background: #cfcfcf;
}
.footer2-section-area.footer4-section .copyright-social-area ul li a {
  color: #565658;
}
.footer2-section-area.footer4-section .copyright-social-area ul li p {
  color: #565658;
}
.footer2-section-area.footer4-section .copyright-social-area ul li.pera::after {
  display: none;
}

.footer2-section-area.footer5-section {
  background: var(--white-100, #fff);
  padding: 80px 0 0 0;
}
.footer2-section-area.footer5-section .footer2-last-section {
  background: none;
  padding: 0;
  border: none;
}
.footer2-section-area.footer5-section
  .footer2-last-section
  .footer-auhtor-area
  h3 {
  color: var(--Text-Color, #0d0e10);
}
.footer2-section-area.footer5-section
  .footer2-last-section
  .footer-auhtor-area
  p {
  color: #565658;
}
.footer2-section-area.footer5-section
  .footer2-last-section
  .footer-auhtor-area
  ul
  li
  a {
  color: #565658;
}
.footer2-section-area.footer5-section
  .footer2-last-section
  .footer-auhtor-area
  ul
  li
  a:hover {
  color: var(--purple);
}
.footer2-section-area.footer5-section
  .footer2-last-section
  .footer-auhtor-area
  ul.social-links
  li {
  display: inline-block;
  margin: 0 6px 0 0;
}
.footer2-section-area.footer5-section
  .footer2-last-section
  .footer-auhtor-area
  ul.social-links
  li::after {
  display: none;
}
.footer2-section-area.footer5-section
  .footer2-last-section
  .footer-auhtor-area
  ul.social-links
  li
  a {
  height: 32px;
  width: 32px;
  display: inline-block;
  line-height: 32px;
  text-align: center;
  border-radius: 50%;
  transition: var(--transition);
  color: var(--purple);
  background: var(--tag2);
  font-size: 16px;
}
.footer2-section-area.footer5-section
  .footer2-last-section
  .footer-auhtor-area
  ul.social-links
  li
  a:hover {
  background: var(--purple);
  transition: var(--transition);
  color: var(--white-100, #fff);
  padding-left: 0;
  transform: translateY(-3px);
}
.footer2-section-area.footer5-section .copyright-social-area {
  padding: 16px 0 24px;
  border-top: 1px solid #cfcfcf;
}
.footer2-section-area.footer5-section .copyright-social-area ul li::after {
  background: #cfcfcf;
}
.footer2-section-area.footer5-section .copyright-social-area ul li a {
  color: #565658;
}
.footer2-section-area.footer5-section .copyright-social-area ul li p {
  color: #565658;
}
.footer2-section-area.footer5-section .copyright-social-area ul li.pera::after {
  display: none;
}

.cta5-section-area {
  position: relative;
  overflow: hidden;
}
@media (max-width: 767px) {
  .cta5-section-area {
    padding: 40px 0 40px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .cta5-section-area {
    padding: 40px 0 40px;
  }
}
.cta5-section-area .elements4 {
  position: absolute;
  top: 0;
  left: 0;
}
.cta5-section-area .elements5 {
  position: absolute;
  bottom: 0;
  right: 0;
}
.cta5-section-area .elements6 {
  position: absolute;
  top: 0;
  right: 0;
}
.cta5-section-area .elements7 {
  position: absolute;
  bottom: 0;
  left: 0;
}
.cta5-section-area .cta5-header h2 {
  color: var(--white-100, #fff);
}
.cta5-section-area .cta5-header p {
  color: var(--white-100, #fff);
  opacity: 0.8;
}
.cta5-section-area .cta5-header .header-btn9 {
  margin-left: 24px;
}
@media (max-width: 767px) {
  .cta5-section-area .cta5-header .header-btn9 {
    margin-left: 0;
    margin-top: 20px;
  }
}

/*============= FOOTER CSS AREA ENDS===============*/
/*============= MOBILE-MENU CSS AREA  ===============*/
.mobile-haeder1 {
  background: var(--primary);
  position: fixed;
}
.mobile-haeder1 .mobile-header-elements .dots-menu {
  color: var(--white-100, #fff);
  cursor: pointer;
}

.mobile-sidebar1 {
  max-height: 100%;
  overflow-y: scroll;
}
.mobile-sidebar1 .menu-close {
  color: var(--white-100, #fff);
  cursor: pointer;
}
.mobile-sidebar1 .mobile-nav .mobile-nav-list li a {
  font-family: var(--font-primary);
  font-weight: 500 !important;
  color: var(--white-100, #fff);
}
.mobile-sidebar1 .mobile-nav .mobile-nav-list li span::after {
  background: var(--white-100, #fff);
  color: var(--white-100, #fff);
}
.mobile-sidebar1 .mobile-nav .mobile-nav-list li span::before {
  background: var(--white-100, #fff);
  color: var(--white-100, #fff);
}
.mobile-sidebar1 .mobile-nav .mobile-nav-list li ul li a {
  font-weight: 500 !important;
}
.mobile-sidebar1 .mobile-nav .allmobilesection .mobile-get {
  display: inline-block;
  border-radius: 25px;
  background: var(--primary);
  color: var(--white-100, #fff);
  font-family: var(--font-primary);
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 16px;
  padding: 16px 28px;
  transition: var(--transition);
  position: relative;
  z-index: 1;
  width: 100%;
  text-align: center;
  margin-top: 30px;
}
.mobile-sidebar1 .mobile-nav .allmobilesection .mobile-get::after {
  position: absolute;
  content: "";
  left: 50%;
  right: 50%;
  height: 20px;
  width: 20px;
  top: 14px;
  border-radius: 50%;
  background: var(--primary-dark);
  visibility: hidden;
  opacity: 0;
  z-index: -1;
  transition: var(--transition);
}
.mobile-sidebar1 .mobile-nav .allmobilesection .mobile-get:hover {
  transform: translateY(-5px);
  transition: var(--transition);
}
.mobile-sidebar1 .mobile-nav .allmobilesection .mobile-get:hover::after {
  visibility: visible;
  opacity: 1;
  height: 100%;
  width: 100%;
  transition: var(--transition);
  z-index: -1;
  border-radius: 25px;
  left: 0;
  top: 0;
}
.mobile-sidebar1 .mobile-nav .allmobilesection .mobile-get svg {
  margin-left: 4px;
  transform: rotate(-45deg);
}
.mobile-sidebar1 .mobile-nav .allmobilesection .single-footer h3 {
  font-family: var(--font-primary);
  font-size: 24px;
  line-height: 30px;
  color: var(--white-100, #fff);
  font-weight: 700;
  margin-bottom: 16px;
  margin-top: 30px;
}
.mobile-sidebar1
  .mobile-nav
  .allmobilesection
  .single-footer
  .footer4-contact-info
  .contact-info-single {
  display: flex;
  color: var(--white-100, #fff);
}
.mobile-sidebar1
  .mobile-nav
  .allmobilesection
  .single-footer
  .footer4-contact-info
  .contact-info-single
  svg {
  margin: 0 10px 0 0;
  counter-reset: var(--white-100, #fff);
}
.mobile-sidebar1
  .mobile-nav
  .allmobilesection
  .single-footer
  .footer4-contact-info
  .contact-info-single
  a {
  font-family: var(--font-primary);
  font-weight: 500;
  color: var(--white-100, #fff);
  opacity: 0.7;
  font-size: 16px;
}
.mobile-sidebar1
  .mobile-nav
  .allmobilesection
  .single-footer
  .footer4-contact-info
  .social-links-mobile-menu
  ul
  li {
  display: inline-block;
  height: 40px;
  width: 40px;
  border-radius: 50%;
  background: var(--white-100, #fff);
  color: var(--Text-Color, #0d0e10);
  transition: var(--transition);
  display: inline-block;
  text-align: center;
  margin: 0 6px 0 0;
  cursor: pointer;
}
.mobile-sidebar1
  .mobile-nav
  .allmobilesection
  .single-footer
  .footer4-contact-info
  .social-links-mobile-menu
  ul
  li:hover {
  background: var(--primary);
  color: var(--white-100, #fff);
  transition: var(--transition);
}
.mobile-sidebar1
  .mobile-nav
  .allmobilesection
  .single-footer
  .footer4-contact-info
  .social-links-mobile-menu
  ul
  li:hover
  a
  svg {
  color: var(--white-100, #fff);
}
.mobile-sidebar1
  .mobile-nav
  .allmobilesection
  .single-footer
  .footer4-contact-info
  .social-links-mobile-menu
  ul
  li
  a {
  line-height: 0px;
}
.mobile-sidebar1
  .mobile-nav
  .allmobilesection
  .single-footer
  .footer4-contact-info
  .social-links-mobile-menu
  ul
  li
  a:hover {
  color: var(--white-100, #fff);
  transition: var(--transition);
}

.mobile-haeder2 {
  background: #ffffff;
  position: fixed;
}
.mobile-haeder2 .mobile-header-elements .dots-menu {
  color: #000000;
  cursor: pointer;
}

.mobile-sidebar2 {
  max-height: 100%;
  overflow-y: scroll;
  background: #ffffff;
}
.mobile-sidebar2 .menu-close {
  color: var(--white-100, #fff);
  cursor: pointer;
}
.mobile-sidebar2 .mobile-nav.mobile-nav2 .mobile-nav-list.nav-list2 li a {
  font-family: "Figtree", sans-serif !important;
  font-weight: 500 !important;
  color: #000000;
}
.mobile-sidebar2
  .mobile-nav.mobile-nav2
  .mobile-nav-list.nav-list2
  li
  span::after {
  background: var(--white-100, #fff);
  color: var(--white-100, #fff);
}
.mobile-sidebar2
  .mobile-nav.mobile-nav2
  .mobile-nav-list.nav-list2
  li
  span::before {
  background: var(--white-100, #fff);
  color: var(--white-100, #fff);
}
.mobile-sidebar2 .mobile-nav.mobile-nav2 .mobile-nav-list.nav-list2 li ul li a {
  font-weight: 500 !important;
  font-family: "Figtree", sans-serif !important;
}
.mobile-sidebar2
  .mobile-nav.mobile-nav2
  .mobile-nav-list.nav-list2
  li
  ul.sub-menu
  li
  a {
  font-family: "Figtree", sans-serif !important;
  font-weight: 500 !important;
}
.mobile-sidebar2 .mobile-nav.mobile-nav2 .allmobilesection .header-btn2 {
  width: 100% !important;
  text-align: center;
  margin-top: 30px;
}
.mobile-sidebar2 .mobile-nav.mobile-nav2 .allmobilesection .single-footer h3 {
  font-family: var(--font-primary);
  font-size: 24px;
  line-height: 30px;
  color: #000000;
  font-weight: 700;
  margin-bottom: 16px;
  margin-top: 30px;
}
.mobile-sidebar2
  .mobile-nav.mobile-nav2
  .allmobilesection
  .single-footer
  .footer4-contact-info
  .contact-info-single {
  display: flex;
  color: var(--white-100, #000000);
}
.mobile-sidebar2
  .mobile-nav.mobile-nav2
  .allmobilesection
  .single-footer
  .footer4-contact-info
  .contact-info-single
  svg {
  margin: 0 10px 0 0;
  counter-reset: var(--white-100, #fff);
}
.mobile-sidebar2
  .mobile-nav.mobile-nav2
  .allmobilesection
  .single-footer
  .footer4-contact-info
  .contact-info-single
  a {
  font-family: var(--font-primary);
  font-weight: 500;
  color: #000000;
  opacity: 0.7;
  font-size: 16px;
}
.mobile-sidebar2
  .mobile-nav.mobile-nav2
  .allmobilesection
  .single-footer
  .footer4-contact-info
  .social-links-mobile-menu
  ul
  li {
  display: inline-block;
  height: 40px;
  width: 40px;
  border-radius: 50%;
  background: var(--white-100, #fff);
  color: var(--white-100, #fff);
  transition: var(--transition);
  display: inline-block;
  text-align: center;
  margin: 0 6px 0 0;
  cursor: pointer;
}
.mobile-sidebar2
  .mobile-nav.mobile-nav2
  .allmobilesection
  .single-footer
  .footer4-contact-info
  .social-links-mobile-menu
  ul
  li:hover {
  background: #fc4b3e;
  color: var(--white-100, #fff);
  transition: var(--transition);
}
.mobile-sidebar2
  .mobile-nav.mobile-nav2
  .allmobilesection
  .single-footer
  .footer4-contact-info
  .social-links-mobile-menu
  ul
  li:hover
  a
  svg {
  color: var(--white-100, #fff);
}
.mobile-sidebar2
  .mobile-nav.mobile-nav2
  .allmobilesection
  .single-footer
  .footer4-contact-info
  .social-links-mobile-menu
  ul
  li
  a {
  line-height: 0px;
}
.mobile-sidebar2
  .mobile-nav.mobile-nav2
  .allmobilesection
  .single-footer
  .footer4-contact-info
  .social-links-mobile-menu
  ul
  li
  a:hover {
  color: var(--white-100, #fff);
  transition: var(--transition);
}

.mobile-haeder3 {
  background: var(--secondary);
  position: fixed;
}
.mobile-haeder3 .mobile-header-elements .dots-menu {
  color: var(--white-100, #fff);
  cursor: pointer;
}

.mobile-sidebar3 {
  max-height: 100%;
  overflow-y: scroll;
  background: var(--secondary);
}
.mobile-sidebar3 .menu-close {
  color: var(--white-100, #fff);
  cursor: pointer;
}
.mobile-sidebar3 .mobile-nav.mobile-nav2 .mobile-nav-list.nav-list2 li a {
  font-family: "Figtree", sans-serif !important;
  font-weight: 500 !important;
  color: var(--white-100, #fff);
}
.mobile-sidebar3
  .mobile-nav.mobile-nav2
  .mobile-nav-list.nav-list2
  li
  span::after {
  background: var(--white-100, #fff);
  color: var(--white-100, #fff);
}
.mobile-sidebar3
  .mobile-nav.mobile-nav2
  .mobile-nav-list.nav-list2
  li
  span::before {
  background: var(--white-100, #fff);
  color: var(--white-100, #fff);
}
.mobile-sidebar3 .mobile-nav.mobile-nav2 .mobile-nav-list.nav-list2 li ul li a {
  font-weight: 500 !important;
  font-family: "Figtree", sans-serif !important;
}
.mobile-sidebar3
  .mobile-nav.mobile-nav2
  .mobile-nav-list.nav-list2
  li
  ul.sub-menu
  li
  a {
  font-family: "Figtree", sans-serif !important;
  font-weight: 500 !important;
}
.mobile-sidebar3 .mobile-nav.mobile-nav2 .allmobilesection .header-btn5 {
  width: 100% !important;
  text-align: center;
  margin-top: 30px;
  background: var(--white-100, #fff);
  color: var(--secondary);
}
.mobile-sidebar3 .mobile-nav.mobile-nav2 .allmobilesection .single-footer h3 {
  font-family: var(--font-primary);
  font-size: 24px;
  line-height: 30px;
  color: var(--white-100, #fff);
  font-weight: 700;
  margin-bottom: 16px;
  margin-top: 30px;
}
.mobile-sidebar3
  .mobile-nav.mobile-nav2
  .allmobilesection
  .single-footer
  .footer4-contact-info
  .contact-info-single {
  display: flex;
  color: var(--white-100, #fff);
}
.mobile-sidebar3
  .mobile-nav.mobile-nav2
  .allmobilesection
  .single-footer
  .footer4-contact-info
  .contact-info-single
  svg {
  margin: 0 10px 0 0;
  counter-reset: var(--white-100, #fff);
}
.mobile-sidebar3
  .mobile-nav.mobile-nav2
  .allmobilesection
  .single-footer
  .footer4-contact-info
  .contact-info-single
  a {
  font-family: var(--font-primary);
  font-weight: 500;
  color: var(--white-100, #fff);
  opacity: 0.7;
  font-size: 16px;
}
.mobile-sidebar3
  .mobile-nav.mobile-nav2
  .allmobilesection
  .single-footer
  .footer4-contact-info
  .social-links-mobile-menu
  ul
  li {
  display: inline-block;
  height: 40px;
  width: 40px;
  border-radius: 50%;
  background: var(--white-100, #fff);
  color: var(--white-100, #fff);
  transition: var(--transition);
  display: inline-block;
  text-align: center;
  margin: 0 6px 0 0;
  cursor: pointer;
}
.mobile-sidebar3
  .mobile-nav.mobile-nav2
  .allmobilesection
  .single-footer
  .footer4-contact-info
  .social-links-mobile-menu
  ul
  li:hover {
  background: #faf9fd;
  color: var(--Text-Color, #0d0e10);
  transition: var(--transition);
}
.mobile-sidebar3
  .mobile-nav.mobile-nav2
  .allmobilesection
  .single-footer
  .footer4-contact-info
  .social-links-mobile-menu
  ul
  li:hover
  a
  svg {
  color: var(--white-100, #fff);
}
.mobile-sidebar3
  .mobile-nav.mobile-nav2
  .allmobilesection
  .single-footer
  .footer4-contact-info
  .social-links-mobile-menu
  ul
  li
  a {
  line-height: 0px;
}
.mobile-sidebar3
  .mobile-nav.mobile-nav2
  .allmobilesection
  .single-footer
  .footer4-contact-info
  .social-links-mobile-menu
  ul
  li
  a:hover {
  color: var(--white-100, #fff);
  transition: var(--transition);
}

.mobile-haeder4 {
  background: var(--violet);
  position: fixed;
}
.mobile-haeder4 .mobile-header-elements .dots-menu {
  color: var(--white-100, #fff);
  cursor: pointer;
}

.mobile-sidebar4 {
  max-height: 100%;
  overflow-y: scroll;
  background: var(--violet);
}
.mobile-sidebar4 .menu-close {
  color: var(--white-100, #fff);
  cursor: pointer;
}
.mobile-sidebar4 .mobile-nav.mobile-nav2 .mobile-nav-list.nav-list2 li a {
  font-family: "Figtree", sans-serif !important;
  font-weight: 500 !important;
  color: var(--white-100, #fff);
}
.mobile-sidebar4
  .mobile-nav.mobile-nav2
  .mobile-nav-list.nav-list2
  li
  span::after {
  background: var(--white-100, #fff);
  color: var(--white-100, #fff);
}
.mobile-sidebar4
  .mobile-nav.mobile-nav2
  .mobile-nav-list.nav-list2
  li
  span::before {
  background: var(--white-100, #fff);
  color: var(--white-100, #fff);
}
.mobile-sidebar4 .mobile-nav.mobile-nav2 .mobile-nav-list.nav-list2 li ul li a {
  font-weight: 500 !important;
  font-family: "Figtree", sans-serif !important;
}
.mobile-sidebar4
  .mobile-nav.mobile-nav2
  .mobile-nav-list.nav-list2
  li
  ul.sub-menu
  li
  a {
  font-family: "Figtree", sans-serif !important;
  font-weight: 500 !important;
}
.mobile-sidebar4 .mobile-nav.mobile-nav2 .allmobilesection .header-btn7 {
  width: 100% !important;
  text-align: center;
  margin-top: 30px;
  background: none;
  color: var(--white-100, #fff);
  border: 1px solid var(--white-100, #fff);
}
.mobile-sidebar4 .mobile-nav.mobile-nav2 .allmobilesection .header-btn7::after {
  background: var(--white-100, #fff);
}
.mobile-sidebar4 .mobile-nav.mobile-nav2 .allmobilesection .header-btn7:hover {
  color: var(--violet);
}
.mobile-sidebar4 .mobile-nav.mobile-nav2 .allmobilesection .single-footer h3 {
  font-family: var(--font-primary);
  font-size: 24px;
  line-height: 30px;
  color: var(--white-100, #fff);
  font-weight: 700;
  margin-bottom: 16px;
  margin-top: 30px;
}
.mobile-sidebar4
  .mobile-nav.mobile-nav2
  .allmobilesection
  .single-footer
  .footer4-contact-info
  .contact-info-single {
  display: flex;
  color: var(--white-100, #fff);
}
.mobile-sidebar4
  .mobile-nav.mobile-nav2
  .allmobilesection
  .single-footer
  .footer4-contact-info
  .contact-info-single
  svg {
  margin: 0 10px 0 0;
  counter-reset: var(--white-100, #fff);
}
.mobile-sidebar4
  .mobile-nav.mobile-nav2
  .allmobilesection
  .single-footer
  .footer4-contact-info
  .contact-info-single
  a {
  font-family: var(--font-primary);
  font-weight: 500;
  color: var(--white-100, #fff);
  opacity: 0.7;
  font-size: 16px;
}
.mobile-sidebar4
  .mobile-nav.mobile-nav2
  .allmobilesection
  .single-footer
  .footer4-contact-info
  .social-links-mobile-menu
  ul
  li {
  display: inline-block;
  height: 40px;
  width: 40px;
  border-radius: 50%;
  background: var(--white-100, #fff);
  color: var(--white-100, #fff);
  transition: var(--transition);
  display: inline-block;
  text-align: center;
  margin: 0 6px 0 0;
  cursor: pointer;
}
.mobile-sidebar4
  .mobile-nav.mobile-nav2
  .allmobilesection
  .single-footer
  .footer4-contact-info
  .social-links-mobile-menu
  ul
  li:hover {
  background: #faf9fd;
  color: var(--Text-Color, #0d0e10);
  transition: var(--transition);
}
.mobile-sidebar4
  .mobile-nav.mobile-nav2
  .allmobilesection
  .single-footer
  .footer4-contact-info
  .social-links-mobile-menu
  ul
  li:hover
  a
  svg {
  color: var(--white-100, #fff);
}
.mobile-sidebar4
  .mobile-nav.mobile-nav2
  .allmobilesection
  .single-footer
  .footer4-contact-info
  .social-links-mobile-menu
  ul
  li
  a {
  line-height: 0px;
}
.mobile-sidebar4
  .mobile-nav.mobile-nav2
  .allmobilesection
  .single-footer
  .footer4-contact-info
  .social-links-mobile-menu
  ul
  li
  a:hover {
  color: var(--white-100, #fff);
  transition: var(--transition);
}

.mobile-haeder5 {
  background: var(--purple);
  position: fixed;
}
.mobile-haeder5 .mobile-header-elements .dots-menu {
  color: var(--white-100, #fff);
  cursor: pointer;
}

.mobile-sidebar5 {
  max-height: 100%;
  overflow-y: scroll;
  background: var(--purple);
}
.mobile-sidebar5 .menu-close {
  color: var(--white-100, #fff);
  cursor: pointer;
}
.mobile-sidebar5 .mobile-nav .mobile-nav-list li a {
  font-family: var(--font-primary);
  font-weight: 500 !important;
  color: var(--white-100, #fff);
}
.mobile-sidebar5 .mobile-nav .mobile-nav-list li span::after {
  background: var(--white-100, #fff);
  color: var(--white-100, #fff);
}
.mobile-sidebar5 .mobile-nav .mobile-nav-list li span::before {
  background: var(--white-100, #fff);
  color: var(--white-100, #fff);
}
.mobile-sidebar5 .mobile-nav .mobile-nav-list li ul li a {
  font-weight: 500 !important;
}
.mobile-sidebar5 .mobile-nav .allmobilesection .header-btn9 {
  display: inline-block;
  border-radius: 25px;
  transition: var(--transition);
  position: relative;
  z-index: 1;
  width: 100%;
  text-align: center;
  margin-top: 30px;
}
.mobile-sidebar5 .mobile-nav .allmobilesection .header-btn9::after {
  background: var(--white-100, #fff);
}
.mobile-sidebar5 .mobile-nav .allmobilesection .header-btn9:hover {
  color: var(--purple);
}
.mobile-sidebar5 .mobile-nav .allmobilesection .header-btn9 svg {
  transform: rotate(-45deg);
}
.mobile-sidebar5 .mobile-nav .allmobilesection .single-footer h3 {
  font-family: var(--font-primary);
  font-size: 24px;
  line-height: 30px;
  color: var(--white-100, #fff);
  font-weight: 700;
  margin-bottom: 16px;
  margin-top: 30px;
}
.mobile-sidebar5
  .mobile-nav
  .allmobilesection
  .single-footer
  .footer4-contact-info
  .contact-info-single {
  display: flex;
  color: var(--white-100, #fff);
}
.mobile-sidebar5
  .mobile-nav
  .allmobilesection
  .single-footer
  .footer4-contact-info
  .contact-info-single
  svg {
  margin: 0 10px 0 0;
  counter-reset: var(--white-100, #fff);
}
.mobile-sidebar5
  .mobile-nav
  .allmobilesection
  .single-footer
  .footer4-contact-info
  .contact-info-single
  a {
  font-family: var(--font-primary);
  font-weight: 500;
  color: var(--white-100, #fff);
  opacity: 0.7;
  font-size: 16px;
}
.mobile-sidebar5
  .mobile-nav
  .allmobilesection
  .single-footer
  .footer4-contact-info
  .social-links-mobile-menu
  ul
  li {
  display: inline-block;
  height: 40px;
  width: 40px;
  border-radius: 50%;
  background: var(--white-100, #fff);
  color: var(--Text-Color, #0d0e10);
  transition: var(--transition);
  display: inline-block;
  text-align: center;
  margin: 0 6px 0 0;
  cursor: pointer;
}
.mobile-sidebar5
  .mobile-nav
  .allmobilesection
  .single-footer
  .footer4-contact-info
  .social-links-mobile-menu
  ul
  li:hover {
  background: var(--white-100, #fff);
  color: var(--white-100, #fff);
  transition: var(--transition);
}
.mobile-sidebar5
  .mobile-nav
  .allmobilesection
  .single-footer
  .footer4-contact-info
  .social-links-mobile-menu
  ul
  li:hover
  a
  svg {
  color: var(--white-100, #fff);
}
.mobile-sidebar5
  .mobile-nav
  .allmobilesection
  .single-footer
  .footer4-contact-info
  .social-links-mobile-menu
  ul
  li
  a {
  line-height: 0px;
}
.mobile-sidebar5
  .mobile-nav
  .allmobilesection
  .single-footer
  .footer4-contact-info
  .social-links-mobile-menu
  ul
  li
  a:hover {
  color: var(--white-100, #fff);
  transition: var(--transition);
}

/*============= MOBILE-MENU  AREA ENDS===============*/
/*============= GENERATION CSS AREA ===============*/
.genaration2-section-area {
  background: var(--white);
}
@media (max-width: 767px) {
  .genaration2-section-area {
    padding: 50px 0 50px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .genaration2-section-area {
    padding: 50px 0 50px;
  }
}

.genaration2-section-area .tabs-area {
  border-radius: 36px;
  background: var(--white-100, var(--white-100, #fff));
  box-shadow: 0px 4px 50px 0px rgba(0, 0, 0, 0.08);
  text-align: center;
  justify-content: center;
  padding: 16px 24px;
  margin: 0 100px;
}
@media (max-width: 767px) {
  .genaration2-section-area .tabs-area {
    margin: 0;
    padding: 16px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .genaration2-section-area .tabs-area {
    margin: 0;
    padding: 16px;
  }
}
.genaration2-section-area .tabs-area ul {
  justify-content: center;
}
.genaration2-section-area .tabs-area ul li button {
  color: var(--Text-Color, #0d0e10);
  text-align: center;
  font-family: var(--font-primary);
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  display: inline-block;
  background: #f6f5fe;
  padding: 12px 24px;
  border-radius: 20px;
  margin: 0 16px 0 0;
  border: none !important;
}
@media (max-width: 767px) {
  .genaration2-section-area .tabs-area ul li button {
    margin: 0 8px;
    margin-bottom: 10px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .genaration2-section-area .tabs-area ul li button {
    margin: 0 8px;
    margin-bottom: 5px;
  }
}
.genaration2-section-area .tabs-area .nav-pills .nav-link.active,
.genaration2-section-area .tabs-area .nav-pills .show > .nav-link {
  background: var(--secondary);
}
.genaration2-section-area .tabs-content-area .tab-pane {
  transform: rotateX(45deg) translateY(50px);
  transition: var(--transition);
  opacity: 0;
}
.genaration2-section-area
  .tabs-content-area
  .tab-pane
  .tabs-contents
  .tabs-images
  img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 4px;
}
@media (max-width: 767px) {
  .genaration2-section-area
    .tabs-content-area
    .tab-pane
    .tabs-contents
    .tabs-images
    img {
    margin-bottom: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .genaration2-section-area
    .tabs-content-area
    .tab-pane
    .tabs-contents
    .tabs-images
    img {
    margin-bottom: 30px;
  }
}
.genaration2-section-area
  .tabs-content-area
  .tab-pane
  .tabs-contents
  .tabs-text-area {
  border-radius: var(--4, 4px);
  border: 1px solid var(--Stroke-Color, rgba(86, 95, 118, 0.1));
  padding: 20px 16px;
  position: relative;
  transition: var(--transition);
  margin: 0 0 0 40px;
}
@media (max-width: 767px) {
  .genaration2-section-area
    .tabs-content-area
    .tab-pane
    .tabs-contents
    .tabs-text-area {
    margin: 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .genaration2-section-area
    .tabs-content-area
    .tab-pane
    .tabs-contents
    .tabs-text-area {
    margin: 0;
  }
}
.genaration2-section-area
  .tabs-content-area
  .tab-pane
  .tabs-contents
  .tabs-text-area:hover {
  border-radius: var(--4, 4px);
  background: var(--white-100, #fff);
  transition: var(--transition);
  transform: translateY(-5px);
  box-shadow: 0px 4px 50px 0px rgba(0, 0, 0, 0.08);
}
.genaration2-section-area
  .tabs-content-area
  .tab-pane
  .tabs-contents
  .tabs-text-area
  .tabs-icon {
  height: 84px;
  width: 84px;
  text-align: center;
  line-height: 84px;
  background: #e9deff;
  border-radius: 50%;
  display: inline-block;
  position: absolute;
}
@media (max-width: 767px) {
  .genaration2-section-area
    .tabs-content-area
    .tab-pane
    .tabs-contents
    .tabs-text-area
    .tabs-icon {
    position: relative;
  }
}
.genaration2-section-area
  .tabs-content-area
  .tab-pane
  .tabs-contents
  .tabs-text-area
  .tabs-icon1 {
  height: 84px;
  width: 84px;
  text-align: center;
  line-height: 84px;
  background: #f8dfde;
  border-radius: 50%;
  display: inline-block;
  position: absolute;
}
@media (max-width: 767px) {
  .genaration2-section-area
    .tabs-content-area
    .tab-pane
    .tabs-contents
    .tabs-text-area
    .tabs-icon1 {
    position: relative;
  }
}
.genaration2-section-area
  .tabs-content-area
  .tab-pane
  .tabs-contents
  .tabs-text-area
  .tabs-icon2 {
  height: 84px;
  width: 84px;
  text-align: center;
  line-height: 84px;
  background: #d6ebe7;
  border-radius: 50%;
  display: inline-block;
  position: absolute;
}
@media (max-width: 767px) {
  .genaration2-section-area
    .tabs-content-area
    .tab-pane
    .tabs-contents
    .tabs-text-area
    .tabs-icon2 {
    position: relative;
  }
}
.genaration2-section-area
  .tabs-content-area
  .tab-pane
  .tabs-contents
  .tabs-text-area
  .tabs-text {
  padding-left: 100px;
}
@media (max-width: 767px) {
  .genaration2-section-area
    .tabs-content-area
    .tab-pane
    .tabs-contents
    .tabs-text-area
    .tabs-text {
    padding-left: 0;
    margin-top: 20px;
  }
}
.genaration2-section-area
  .tabs-content-area
  .tab-pane
  .tabs-contents
  .tabs-text-area
  .tabs-text
  a {
  color: var(--Text-Color, #0d0e10);
  font-family: var(--font-primary);
  font-size: 20px;
  font-style: normal;
  font-weight: 600;
  line-height: 20px;
  display: inline-block;
  margin-bottom: 12px;
  text-transform: capitalize;
}
.genaration2-section-area
  .tabs-content-area
  .tab-pane
  .tabs-contents
  .tabs-text-area
  .tabs-text
  p {
  color: var(--body);
  font-family: var(--font-primary);
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 28px;
}
.genaration2-section-area .tabs-content-area .tab-pane.show.active {
  transform: rotateX(0deg) translateY(0);
  opacity: 1;
}

/*============= GENERATION CSS AREA ENDS ===============*/
/*============= PROCESS CSS AREA ===============*/
@media (max-width: 767px) {
  .process-section-area {
    padding: 50px 0 50px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .process-section-area {
    padding: 50px 0 50px;
  }
}

.process-section-area .process-images img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 4px;
}
.process-section-area .process-images-content {
  padding: 0 0 0 50px;
}
@media (max-width: 767px) {
  .process-section-area .process-images-content {
    padding: 0;
    margin-top: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .process-section-area .process-images-content {
    padding: 0;
    margin-top: 30px;
  }
}

.process-section-area .process-images-content h2 {
  text-align: start !important;
  margin-bottom: 16px;
  font-size: 28px;
  line-height: 40px;
}
@media (max-width: 767px) {
  .process-section-area .process-images-content h2 {
    font-size: 30px;
  }
}
.process-section-area .process-images-content p {
  color: var(--body);
  font-family: var(--font-primary);
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 28px;
}
.process-section-area .process-section2 {
  padding: 160px 0;
  position: relative;
}

.process-section-area .process-section-last{
  padding: 160px 0 0 0;
}

@media (max-width: 767px) {
  .process-section-area .process-section2 {
    padding: 0 10px 30px 10px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .process-section-area .process-section2 {
    padding: 0 10px 30px 10px;
  }
}
@media (max-width: 767px) {
  .process-section-area .process-section2 .process-images-content {
    margin-bottom: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .process-section-area .process-section2 .process-images-content {
    margin-bottom: 30px;
  }
}
.process-section-area .process-section2 .process-elements1 {
  position: absolute;
  right: 47%;
  left: 48%;
  z-index: -1;
  top: 0;
  rotate: 8deg;
}
.process-section-area .process-section2 .process-elements2 {
  position: absolute;
  bottom: 0;
  position: absolute;
  right: 45%;
  left: 44%;
  z-index: -1;
  rotate: -4deg;
}
.process-section-area .process-section2 .process-images-content {
  padding: 0 50px 0 0;
}
@media (max-width: 767px) {
  .process-section-area .process-section2 .process-images-content {
    padding: 0;
    margin-top: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .process-section-area .process-section2 .process-images-content {
    padding: 0;
    margin-top: 30px;
  }
}

@media (max-width: 767px) {
  .process-inner-area {
    padding: 50px 0 50px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .process-inner-area {
    padding: 50px 0 50px;
  }
}
.process-inner-area .process-inner-header span {
  font-family: var(--font-primary);
  font-weight: 500;
  color: var(--secondary);
  transition: var(--transition);
  font-size: 16px;
  line-height: 16px;
  display: inline-block;
  padding: 8px 12px;
  border-radius: 32px;
  background: var(--tag);
}
.process-inner-area .process-images img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 4px;
}
.process-inner-area .process-content-area {
  padding: 0 0 0 50px;
  position: relative;
}
@media (max-width: 767px) {
  .process-inner-area .process-content-area {
    padding: 0;
    margin-top: 60px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .process-inner-area .process-content-area {
    padding: 0;
    margin-top: 60px;
  }
}
.process-inner-area .process-content-area span {
  font-size: 300px;
  text-align: center;
  position: absolute;
  z-index: -1;
  color: #f4f4f6;
  opacity: 0.7;
  font-weight: 700;
  display: inline-block;
  top: 60px;
  font-family: var(--font-primary);
}
.process-inner-area .process-content-area h2 {
  font-size: 32px;
  line-height: 42px;
}
.process-inner-area .process-content-area.content2 {
  padding: 0 50px 0 0;
}
@media (max-width: 767px) {
  .process-inner-area .process-content-area.content2 {
    padding: 0;
    margin-bottom: 60px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .process-inner-area .process-content-area.content2 {
    padding: 0;
    margin-bottom: 80px;
  }
}

.more-features-scetion-area.more-features2 {
  background: var(--BG, #f7f9fa);
}
.more-features-scetion-area.more-features2 .more-features-header span {
  font-family: var(--font-primary);
  font-weight: 500;
  color: var(--secondary);
  transition: var(--transition);
  font-size: 16px;
  line-height: 16px;
  display: inline-block;
  padding: 8px 12px;
  border-radius: 32px;
  background: #f0eefa;
}
.more-features-scetion-area.more-features2 .more-features-box {
  position: relative;
  z-index: 1;
}
.more-features-scetion-area.more-features2 .more-features-box:hover {
  background: none;
}
.more-features-scetion-area.more-features2
  .more-features-box:hover
  .more-elements {
  z-index: 2;
  transition: var(--transition);
}
.more-features-scetion-area.more-features2 .more-features-box:hover::after {
  width: 100%;
  right: 0;
  top: 0;
  border-radius: 4px;
  opacity: 1;
  height: 100%;
}
.more-features-scetion-area.more-features2 .more-features-box:hover::before {
  width: 100%;
  left: 0;
  top: 0;
  border-radius: 4px;
  opacity: 1;
  height: 100%;
}
.more-features-scetion-area.more-features2 .more-features-box::after {
  position: absolute;
  content: "";
  height: 100%;
  width: 100%;
  border-radius: 4px;
  transition: var(--transition);
  right: -200px;
  top: 0;
  overflow: hidden;
  opacity: 0;
  background: var(--secondary);
  z-index: -1;
}
.more-features-scetion-area.more-features2 .more-features-box::before {
  position: absolute;
  content: "";
  height: 100%;
  width: 100%;
  border-radius: 4px;
  transition: var(--transition);
  left: -200px;
  top: 0;
  overflow: hidden;
  opacity: 0;
  background: var(--secondary);
  z-index: -2;
}

/*============= PROCESS CSS AREA ENDS ===============*/
/*============= TEMPLETE CSS AREA ===============*/
@media (max-width: 767px) {
  .templete1-section-area {
    padding: 50px 0 50px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .templete1-section-area {
    padding: 50px 0 50px;
  }
}

.templete1-section-area .tabs-carousel-area .nav.nav-pills {
  justify-content: center;
}
.templete1-section-area .tabs-carousel-area .nav.nav-pills .nav-link {
  border-radius: 20px;
  background: #f6f5fe;
  color: var(--Text-Color, #0d0e10);
  text-align: center;
  font-family: var(--font-primary);
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  border: none;
  line-height: 16px;
  padding: 12px 24px;
  margin: 0 16px 0 0;
}
@media (max-width: 767px) {
  .templete1-section-area .tabs-carousel-area .nav.nav-pills .nav-link {
    margin-bottom: 10px;
  }
}
.templete1-section-area .tabs-carousel-area .nav.nav-pills .nav-link.active {
  background: var(--secondary);
  color: var(--white-100, #fff);
  border: none;
}
.templete1-section-area
  .tabs-carousel-area
  .tab-carousel-section
  .owl-nav
  button {
  height: 40px;
  width: 40px;
  text-align: center;
  line-height: 40px;
  background: #f0e9ff;
  border-radius: 50%;
  transition: var(--transition);
  display: none;
}
.templete1-section-area
  .tabs-carousel-area
  .tab-carousel-section
  .owl-nav
  button:hover {
  transition: var(--transition);
  background: var(--secondary);
  color: var(--white-100, #fff);
}
@media (max-width: 767px) {
  .templete1-section-area .tabs-carousel-area .tab-carousel-section .owl-nav {
    text-align: center;
    margin-bottom: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .templete1-section-area .tabs-carousel-area .tab-carousel-section .owl-nav {
    text-align: center;
    margin-bottom: 30px;
  }
}
.templete1-section-area .tabs-carousel-area .tab-carousel-section .owl-prev {
  position: absolute;
  top: 50%;
  left: -70px;
}
@media (max-width: 767px) {
  .templete1-section-area .tabs-carousel-area .tab-carousel-section .owl-prev {
    position: relative;
    left: -3px;
    top: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .templete1-section-area .tabs-carousel-area .tab-carousel-section .owl-prev {
    position: relative;
    left: -3px;
    top: 30px;
  }
}
.templete1-section-area .tabs-carousel-area .tab-carousel-section .owl-next {
  position: absolute;
  top: 50%;
  right: -70px;
}
@media (max-width: 767px) {
  .templete1-section-area .tabs-carousel-area .tab-carousel-section .owl-next {
    position: relative;
    right: -3px;
    top: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .templete1-section-area .tabs-carousel-area .tab-carousel-section .owl-next {
    position: relative;
    right: -3px;
    top: 30px;
  }
}
.templete1-section-area
  .tabs-carousel-area
  .tab-carousel-section
  .tabs-carousel-img {
  position: relative;
  z-index: -1;
  transition: var(--transition);
}
.templete1-section-area
  .tabs-carousel-area
  .tab-carousel-section
  .tabs-carousel-img:hover
  .tabs-morebtn {
  visibility: visible;
  opacity: 1;
  margin-top: 0;
  transition: all 0.6s ease-in-out;
  z-index: 2;
}
.templete1-section-area
  .tabs-carousel-area
  .tab-carousel-section
  .tabs-carousel-img:hover::after {
  visibility: visible;
  transition: var(--transition);
}
.templete1-section-area
  .tabs-carousel-area
  .tab-carousel-section
  .tabs-carousel-img
  img {
  border-radius: 4px;
}
.templete1-section-area
  .tabs-carousel-area
  .tab-carousel-section
  .tabs-carousel-img::after {
  position: absolute;
  content: "";
  height: 70px;
  width: 70px;
  transition: var(--transition);
  border-radius: 50%;
  background: var(--secondary);
  opacity: 0;
  left: 30%;
  right: 30%;
  top: 45%;
  visibility: hidden;
}
.templete1-section-area
  .tabs-carousel-area
  .tab-carousel-section
  .tabs-carousel-img:hover::after {
  height: 100%;
  width: 100%;
  border-radius: 4px;
  transition: var(--transition);
  top: 0;
  left: 0;
  opacity: 0.5;
}
.templete1-section-area
  .tabs-carousel-area
  .tab-carousel-section
  .tabs-carousel-img
  .tabs-morebtn {
  text-align: center;
  position: absolute;
  top: 45%;
  z-index: 2;
  left: 20%;
  right: 20%;
  visibility: hidden;
  opacity: 0;
  transition: var(--transition);
  margin-top: 20px;
}
.templete1-section-area
  .tabs-carousel-area
  .tab-carousel-section
  .tabs-carousel-img
  .tabs-morebtn
  .header-btn2::after {
  background: var(--secondary) !important;
}
.templete1-section-area .tabs-carousel-area .tab-content .tab-pane {
  transform: rotateX(45deg) translateY(50px);
  transition: var(--transition);
}
.templete1-section-area .tabs-carousel-area .tab-content .tab-pane.show.active {
  transform: rotateX(0) translateY(0);
  opacity: 1;
}

@media (max-width: 767px) {
  .pricing-paln-section-area {
    padding: 50px 0 20px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .pricing-paln-section-area {
    padding: 50px 0 20px;
  }
}
.pricing-paln-section-area .pricing-plans .toggle-inner {
  width: 75px;
  margin: 0 auto;
  height: 35px;
  border: 1px solid var(--secondary);
  border-radius: 25px;
  position: relative;
  background: var(--secondary);
}
.pricing-paln-section-area .pricing-plans .toggle-inner input {
  position: absolute;
  left: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  border-radius: 25px;
  right: 0;
  z-index: 1;
  opacity: 0;
  cursor: pointer;
}
.pricing-paln-section-area .pricing-plans .custom-toggle {
  position: absolute;
  height: 25px;
  width: 25px;
  background-color: #ffffff;
  top: 4px;
  left: 5px;
  border-radius: 50%;
  transition: 300ms all;
}
.pricing-paln-section-area .pricing-plans .toggle-inner .t-month,
.pricing-paln-section-area .pricing-plans .toggle-inner .t-year {
  position: absolute;
  left: -70px;
  top: 5px;
  color: var(--Text-Color, #0d0e10);
  transition: 300ms all;
  font-size: 18px;
  font-weight: 700;
  line-height: 16px;
  margin: 0 -8px;
}
.pricing-paln-section-area .pricing-plans .toggle-inner .t-year {
  left: unset;
  right: -60px;
  opacity: 0.5;
}
.pricing-paln-section-area .pricing-plans .active > .toggle-inner .t-month {
  opacity: 0.5;
}
.pricing-paln-section-area .pricing-plans .active > .toggle-inner .t-year {
  opacity: 1;
}
.pricing-paln-section-area .pricing-plans .toggle-inner input:checked + span {
  left: 43px;
}
.pricing-paln-section-area .tab-content .price-box {
  margin-bottom: 30px;
}
.pricing-paln-section-area .tab-content .price-box .hadding .pricing-area {
  background: #faf9fd;
  padding: 24px;
  border-radius: 4px;
  transition: var(--transition);
  position: relative;
  z-index: 1;
  margin-bottom: 8px;
}
.pricing-paln-section-area
  .tab-content
  .price-box
  .hadding
  .pricing-area::after {
  position: absolute;
  content: "";
  height: 30px;
  width: 30px;
  border-radius: 50%;
  top: 40%;
  left: 40%;
  right: 40%;
  transition: var(--transition);
  z-index: -1;
  background: var(--secondary);
  visibility: hidden;
  opacity: 0;
  border-radius: 4px;
}
.pricing-paln-section-area
  .tab-content
  .price-box
  .hadding
  .pricing-area:hover::after {
  background: var(--secondary);
  transition: var(--transition);
  height: 100%;
  width: 100%;
  border-radius: 4px;
  left: 0;
  top: 0;
  right: 0;
  opacity: 1;
  visibility: visible;
}
.pricing-paln-section-area
  .tab-content
  .price-box
  .hadding
  .pricing-area:hover
  h3 {
  color: var(--white-100, #fff);
  transition: var(--transition);
}
.pricing-paln-section-area
  .tab-content
  .price-box
  .hadding
  .pricing-area:hover
  h2 {
  color: var(--white-100, #fff);
  transition: var(--transition);
}
.pricing-paln-section-area
  .tab-content
  .price-box
  .hadding
  .pricing-area:hover
  h2
  span {
  color: var(--white-100, #fff);
  opacity: 0.8;
  transition: var(--transition);
}
.pricing-paln-section-area
  .tab-content
  .price-box
  .hadding
  .pricing-area:hover
  p {
  color: var(--white-100, #fff);
  opacity: 0.8;
  transition: var(--transition);
}
.pricing-paln-section-area
  .tab-content
  .price-box
  .hadding
  .pricing-area:hover
  .header-btn5 {
  background: var(--white-100, #fff);
  transition: var(--transition);
}
.pricing-paln-section-area
  .tab-content
  .price-box
  .hadding
  .pricing-area:hover
  .header-btn5::after {
  background: var(--white-100, #fff);
}
.pricing-paln-section-area .tab-content .price-box .hadding .pricing-area h3 {
  font-family: var(--font-primary);
  font-size: 20px;
  font-weight: 700;
  color: var(--Text-Color, #0d0e10);
  transition: var(--transition);
}
.pricing-paln-section-area .tab-content .price-box .hadding .pricing-area h2 {
  font-size: 60px;
  font-weight: 700;
  color: var(--Text-Color, #0d0e10);
  font-family: var(--font-primary);
  transition: var(--transition);
}
.pricing-paln-section-area
  .tab-content
  .price-box
  .hadding
  .pricing-area
  h2
  span {
  font-family: var(--font-primary);
  font-size: 16px;
  font-weight: 500;
  color: var(--body);
  display: inline-block;
  transition: var(--transition);
}
.pricing-paln-section-area .tab-content .price-box .hadding .pricing-area p {
  font-family: var(--font-primary);
  font-size: 16px;
  font-weight: 500;
  color: var(--body);
  transition: var(--transition);
}
.pricing-paln-section-area
  .tab-content
  .price-box
  .hadding
  .pricing-area
  a.header-btn5 {
  width: 100%;
  text-align: center;
  background: none;
  border: 1px solid var(--secondary);
  color: var(--secondary);
  transition: var(--transition);
}
.pricing-paln-section-area .tab-content .price-box .hadding .pricing-area.bg2 {
  background: var(--secondary);
  position: relative;
}
.pricing-paln-section-area
  .tab-content
  .price-box
  .hadding
  .pricing-area.bg2
  .popular {
  background: var(--white-100, #fff);
  border: 1px solid var(--secondary);
  display: inline-block;
  border-radius: 5px;
  padding: 8px;
  position: absolute;
  left: 39%;
  right: 38%;
  top: -17px;
}
.pricing-paln-section-area
  .tab-content
  .price-box
  .hadding
  .pricing-area.bg2
  .popular
  p {
  font-family: var(--font-primary);
  font-size: 12px;
  font-weight: 700;
  color: var(--secondary);
  line-height: 12px;
}
.pricing-paln-section-area
  .tab-content
  .price-box
  .hadding
  .pricing-area.bg2
  h2 {
  color: var(--white-100, #fff);
}
.pricing-paln-section-area
  .tab-content
  .price-box
  .hadding
  .pricing-area.bg2
  h3 {
  color: var(--white-100, #fff);
}
.pricing-paln-section-area
  .tab-content
  .price-box
  .hadding
  .pricing-area.bg2
  p {
  color: var(--white-100, #fff);
  opacity: 0.8;
}
.pricing-paln-section-area
  .tab-content
  .price-box
  .hadding
  .pricing-area.bg2
  span {
  color: var(--white-100, #fff);
  opacity: 0.8;
}
.pricing-paln-section-area
  .tab-content
  .price-box
  .hadding
  .pricing-area.bg2
  .header-btn5 {
  background: var(--white-100, #fff);
}
.pricing-paln-section-area .tab-content .price-box .hadding .price-list ul li {
  font-family: var(--font-primary);
  font-size: 16px;
  font-weight: 500;
  color: var(--body);
  padding: 16px 0;
  line-height: 16px;
  border-bottom: 1px solid var(--Stroke-Color, rgba(86, 95, 118, 0.1));
  transition: var(--transition);
}
.pricing-paln-section-area
  .tab-content
  .price-box
  .hadding
  .price-list
  ul
  li
  img {
  margin: 0 8px 0 0;
}
.pricing-paln-section-area
  .tab-content
  .price-box
  .hadding
  .price-list
  ul
  li:nth-child(3) {
  border-bottom: none;
}

.pricing2 {
  background: var(--BG, #f7f9fa);
}
.pricing2 .pricing-header span {
  background: #f0eefa;
  padding: 8px 12px;
  line-height: 16px;
  border-radius: 32px;
  display: inline-block;
  font-size: 16px;
  font-weight: 500;
  color: var(--secondary);
}
.pricing2 .pricing-plans .toggle-inner {
  background: var(--secondary);
}
.pricing2 .pricing-plans .tab-content .price-box .pricing-area {
  background: var(--white-100, #fff);
}
.pricing2 .pricing-plans .tab-content .price-box .pricing-area::after {
  background: var(--secondary) !important;
}
.pricing2 .pricing-plans .tab-content .price-box .pricing-area .header-btn2 {
  width: 100%;
  text-align: center;
  background: var(--white-100, #fff);
  border: 1px solid var(--secondary);
  color: var(--secondary);
}
.pricing2
  .pricing-plans
  .tab-content
  .price-box
  .pricing-area
  .header-btn2::after {
  left: 50%;
  right: 50%;
  background: #fc4b3e !important;
}
.pricing2
  .pricing-plans
  .tab-content
  .price-box
  .pricing-area
  .header-btn2:hover {
  color: var(--white-100, #fff);
}
.pricing2
  .pricing-plans
  .tab-content
  .price-box
  .pricing-area
  .header-btn2:hover::after {
  left: 0;
  top: 0;
  right: 0;
}
.pricing2 .pricing-plans .tab-content .price-box .bg2 {
  background: var(--secondary) !important;
}
.pricing2 .pricing-plans .tab-content .price-box .bg2 .popular {
  border: 1px solid var(--secondary);
  color: var(--secondary);
}

.bg-none .pricing-plans .tab-content .price-box .pricing-area {
  box-shadow: 0px 4px 50px 0px rgba(0, 0, 0, 0.08);
}

.pricing-paln-section-area .pricing-plans.compare-paln {
  background: var(--white-100, #fff);
  box-shadow: 0px 4px 50px 0px rgba(0, 0, 0, 0.08);
  border-radius: 4px;
  padding: 60px 32px !important;
  position: relative;
  text-align: center;
}
.pricing-paln-section-area .pricing-plans.compare-paln .plan-toggle-wrap1 {
  margin-top: 100px;
}
@media (max-width: 767px) {
  .pricing-paln-section-area .pricing-plans.compare-paln .plan-toggle-wrap1 {
    margin-top: 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .pricing-paln-section-area .pricing-plans.compare-paln .plan-toggle-wrap1 {
    margin-top: 0;
  }
}
.pricing-paln-section-area .pricing-plans.compare-paln .tab-content.bg2 {
  background: #fff6f5 !important;
}
.pricing-paln-section-area .pricing-plans.compare-paln h3 {
  font-size: 20px !important;
  font-family: var(--font-primary);
  font-weight: 700;
  color: var(--Text-Color, #0d0e10);
}
.pricing-paln-section-area .pricing-plans.compare-paln .tab-content {
  background: var(--tag);
  padding: 32px;
  position: relative;
  width: 230px;
  left: 60px;
}
@media (max-width: 767px) {
  .pricing-paln-section-area .pricing-plans.compare-paln .tab-content {
    width: 100%;
    left: 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .pricing-paln-section-area .pricing-plans.compare-paln .tab-content {
    width: 100%;
    left: 0;
  }
}
.pricing-paln-section-area .pricing-plans.compare-paln .tab-content h2 {
  font-family: var(--font-primary);
  font-size: 60px;
  font-weight: 700;
  color: var(--Text-Color, #0d0e10);
}
.pricing-paln-section-area .pricing-plans.compare-paln .tab-content p {
  font-size: 16px;
  font-weight: 500;
  color: var(--body);
}
.pricing-paln-section-area
  .pricing-plans.compare-paln
  .tab-content
  .header-btn2 {
  background: var(--white-100, #fff);
  border: 1px solid #fc4b3e;
  color: #fc4b3e;
}
.pricing-paln-section-area
  .pricing-plans.compare-paln
  .tab-content
  .header-btn2::after {
  background: #fc4b3e;
  color: var(--white-100, #fff);
}
.pricing-paln-section-area
  .pricing-plans.compare-paln
  .tab-content
  .header-btn2:hover {
  color: var(--white-100, #fff);
}
@media (max-width: 767px) {
  .pricing-paln-section-area .pricing-plans.compare-paln .table-area {
    overflow-x: hidden;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .pricing-paln-section-area .pricing-plans.compare-paln .table-area {
    overflow-y: hidden;
  }
}
.pricing-paln-section-area
  .pricing-plans.compare-paln
  .table-area
  .price-table {
  width: 100%;
  text-align: start;
}
.pricing-paln-section-area
  .pricing-plans.compare-paln
  .table-area
  .price-table
  tbody
  tr {
  border-top: 1px solid var(--Stroke-Color, rgba(86, 95, 118, 0.1));
  border-bottom: 1px solid var(--Stroke-Color, rgba(86, 95, 118, 0.1));
}
.pricing-paln-section-area
  .pricing-plans.compare-paln
  .table-area
  .price-table
  tbody
  tr
  td {
  font-family: var(--font-primary);
  font-size: 16px;
  font-weight: 500;
  color: var(--body);
  line-height: 26px;
  padding: 16px 0;
  position: relative;
}
.pricing-paln-section-area
  .pricing-plans.compare-paln
  .table-area
  .price-table
  tbody
  tr
  .check {
  left: -45%;
  position: relative;
  z-index: 1;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .pricing-paln-section-area
    .pricing-plans.compare-paln
    .table-area
    .price-table
    tbody
    tr
    .check {
    left: 0;
  }
}
@media (max-width: 767px) {
  .pricing-paln-section-area
    .pricing-plans.compare-paln
    .table-area
    .price-table
    tbody
    tr
    .check {
    display: none;
  }
}
.pricing-paln-section-area
  .pricing-plans.compare-paln
  .table-area
  .price-table
  tbody
  tr
  .check::after {
  position: absolute;
  content: "";
  left: -106px;
  top: 0;
  background: var(--tag);
  width: 230px;
  height: 58px;
  z-index: -1;
}
.pricing-paln-section-area
  .pricing-plans.compare-paln
  .table-area
  .price-table
  tbody
  tr
  .check-icons2 {
  position: relative;
  left: -25%;
  z-index: 1;
}
@media (max-width: 767px) {
  .pricing-paln-section-area
    .pricing-plans.compare-paln
    .table-area
    .price-table
    tbody
    tr
    .check-icons2 {
    display: none;
  }
}
.pricing-paln-section-area
  .pricing-plans.compare-paln
  .table-area
  .price-table
  tbody
  tr
  .check-icons2::after {
  position: absolute;
  content: "";
  left: -103px;
  top: 0;
  background: #fff6f5;
  width: 230px;
  height: 58px;
  z-index: -1;
}
.pricing-paln-section-area
  .pricing-plans.compare-paln
  .table-area
  .price-table
  tbody
  tr
  .check-icons3 {
  position: relative;
  left: -4%;
  z-index: 1;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .pricing-paln-section-area
    .pricing-plans.compare-paln
    .table-area
    .price-table
    tbody
    tr
    .check-icons3 {
    left: 0;
  }
}
@media (max-width: 767px) {
  .pricing-paln-section-area
    .pricing-plans.compare-paln
    .table-area
    .price-table
    tbody
    tr
    .check-icons3 {
    display: none;
  }
}
.pricing-paln-section-area
  .pricing-plans.compare-paln
  .table-area
  .price-table
  tbody
  tr
  .check-icons3::after {
  position: absolute;
  content: "";
  left: -114px;
  top: 0;
  background: var(--tag);
  width: 230px;
  height: 58px;
  z-index: -1;
}

@media (max-width: 767px) {
  .pricicng-paln3 {
    padding: 50px 0 20px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .pricicng-paln3 {
    padding: 50px 0 20px;
  }
}
.pricicng-paln3 .pricing-plans .plan-toggle-wrap .toggle-inner {
  background: var(--violet);
  border: 1px solid var(--violet);
}
.pricicng-paln3 .pricing-plans .price-box .pricing-area {
  background: #faf9fd;
}
.pricicng-paln3 .pricing-plans .price-box .pricing-area p {
  color: var(--white-100, #fff);
  transition: var(--transition);
  padding-bottom: 24px;
  border-bottom: 1px solid #dbdce0;
}
.pricicng-paln3 .pricing-plans .price-box .pricing-area ul li {
  font-size: 16px;
  font-weight: 400;
  color: var(--body);
  line-height: 16px;
  transition: var(--transition);
  font-family: var(--font-primary);
}
.pricicng-paln3 .pricing-plans .price-box .pricing-area ul li img {
  margin: 0 6px 0 0;
}
.pricicng-paln3 .pricing-plans .price-box .pricing-area::after {
  top: 0 !important;
  width: 100% !important;
  background: var(--violet) !important;
  height: 0 !important;
  left: 0 !important;
}
.pricicng-paln3 .pricing-plans .price-box .bg2 {
  background: var(--violet) !important;
}
.pricicng-paln3 .pricing-plans .price-box .bg2 .popular {
  border: 1px solid var(--violet) !important;
}
.pricicng-paln3 .pricing-plans .price-box .bg2 .popular p {
  color: var(--violet) !important;
  border-bottom: 0;
  padding-bottom: 0;
}
.pricicng-paln3 .pricing-plans .price-box .bg2 ul li {
  color: var(--white-100, #fff);
  transition: var(--transition);
}
.pricicng-paln3 .pricing-plans .price-box .bg2 .header-btn7 {
  background: var(--white-100, #fff);
  color: var(--violet);
  border: 1px solid var(--white-100, #fff);
}
.pricicng-paln3 .pricing-plans .price-box .header-btn7 {
  width: 100%;
  background: var(--violet);
  color: var(--white-100, #fff);
  text-align: center;
}
.pricicng-paln3 .pricing-plans .price-box .header-btn7::after {
  display: none;
}
.pricicng-paln3 .pricing-plans .price-box:hover .header-btn7 {
  background: var(--white-100, #fff);
  color: var(--violet);
}
.pricicng-paln3 .pricing-plans .price-box:hover .pricing-area::after {
  width: 100% !important;
  height: 100% !important;
}
.pricicng-paln3 .pricing-plans .price-box:hover .pricing-area h3 {
  color: var(--white-100, #fff);
  transition: var(--transition);
}
.pricicng-paln3 .pricing-plans .price-box:hover .pricing-area h2 {
  color: var(--white-100, #fff);
  transition: var(--transition);
}
.pricicng-paln3 .pricing-plans .price-box:hover .pricing-area h2 span {
  transition: var(--transition);
  color: var(--white-100, #fff);
}
.pricicng-paln3 .pricing-plans .price-box:hover .pricing-area p {
  color: var(--white-100, #fff);
  transition: var(--transition);
}
.pricicng-paln3 .pricing-plans .price-box:hover .pricing-area ul li {
  color: var(--white-100, #fff);
  transition: var(--transition);
}

@media (max-width: 767px) {
  .pricing5-section-area {
    padding: 50px 0 20px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .pricing5-section-area {
    padding: 50px 0 20px;
  }
}
.pricing5-section-area .pricing-plans .plan-toggle-wrap .toggle-inner {
  background: var(--purple);
  border: 1px solid var(--purple);
}
.pricing5-section-area .pricing-plans .price-box .pricing-area {
  background: #faf9fd;
}
.pricing5-section-area .pricing-plans .price-box .pricing-area p {
  color: var(--white-100, #fff);
  transition: var(--transition);
  padding-bottom: 24px;
  border-bottom: 1px solid #dbdce0;
}
.pricing5-section-area .pricing-plans .price-box .pricing-area ul li {
  font-size: 16px;
  font-weight: 400;
  color: var(--body);
  line-height: 16px;
  transition: var(--transition);
  font-family: var(--font-primary);
}
.pricing5-section-area .pricing-plans .price-box .pricing-area ul li img {
  margin: 0 6px 0 0;
}
.pricing5-section-area .pricing-plans .price-box .pricing-area::after {
  top: 0 !important;
  width: 100% !important;
  background: var(--purple) !important;
  height: 0 !important;
  left: 0 !important;
}
.pricing5-section-area .pricing-plans .price-box .bg2 {
  background: var(--purple) !important;
}
.pricing5-section-area .pricing-plans .price-box .bg2 .popular {
  border: 1px solid var(--purple) !important;
}
.pricing5-section-area .pricing-plans .price-box .bg2 .popular p {
  color: var(--purple) !important;
  border-bottom: 0;
  padding-bottom: 0;
}
.pricing5-section-area .pricing-plans .price-box .bg2 ul li {
  color: var(--white-100, #fff);
  transition: var(--transition);
}
.pricing5-section-area .pricing-plans .price-box .bg2 .header-btn8 {
  background: var(--white-100, #fff);
  color: var(--purple);
  border: 1px solid var(--white-100, #fff);
}
.pricing5-section-area .pricing-plans .price-box .header-btn8 {
  width: 100%;
  background: var(--purple);
  color: var(--white-100, #fff);
  text-align: center;
}
.pricing5-section-area .pricing-plans .price-box .header-btn8::after {
  display: none;
}
.pricing5-section-area .pricing-plans .price-box:hover .header-btn8 {
  background: var(--white-100, #fff);
  color: var(--purple);
}
.pricing5-section-area .pricing-plans .price-box:hover .pricing-area::after {
  width: 100% !important;
  height: 100% !important;
}
.pricing5-section-area .pricing-plans .price-box:hover .pricing-area h3 {
  color: var(--white-100, #fff);
  transition: var(--transition);
}
.pricing5-section-area .pricing-plans .price-box:hover .pricing-area h2 {
  color: var(--white-100, #fff);
  transition: var(--transition);
}
.pricing5-section-area .pricing-plans .price-box:hover .pricing-area h2 span {
  transition: var(--transition);
  color: var(--white-100, #fff);
}
.pricing5-section-area .pricing-plans .price-box:hover .pricing-area p {
  color: var(--white-100, #fff);
  transition: var(--transition);
}
.pricing5-section-area .pricing-plans .price-box:hover .pricing-area ul li {
  color: var(--white-100, #fff);
  transition: var(--transition);
}

/*============= TEMPLETE CSS AREA ENDS ===============*/
/*============= COMPLAINT CSS AREA ===============*/
.complaint-section-area {
  background: var(--BG, #f7f9fa);
}
@media (max-width: 767px) {
  .complaint-section-area {
    padding: 50px 0 50px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .complaint-section-area {
    padding: 50px 0 50px;
  }
}
@media (max-width: 767px) {
  .complaint-section-area .complaint-header {
    margin-bottom: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .complaint-section-area .complaint-header {
    margin-bottom: 30px;
  }
}
.complaint-section-area .complaint-header span {
  color: var(--secondary);
  font-family: var(--font-primary);
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  border-radius: 32px;
  background: rgba(110, 36, 255, 0.05);
  padding: 8px 12px;
  display: inline-block;
  margin-bottom: 12px;
}
.complaint-section-area .complaint-header h2 {
  text-align: start !important;
}
.complaint-section-area .complaint-header p {
  color: var(--body);
  font-family: var(--font-primary);
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 28px;
  margin-top: 16px;
}
.complaint-section-area .complaint-header .complaint-list {
  display: flex;
  align-items: center;
  margin-top: 8px;
}
@media (max-width: 767px) {
  .complaint-section-area .complaint-header .complaint-list {
    display: inline-block;
  }
}
.complaint-section-area .complaint-header .complaint-list ul li {
  display: flex;
  align-items: center;
  margin-top: 16px;
}
.complaint-section-area .complaint-header .complaint-list ul li a {
  color: var(--Text-Color, #0d0e10);
  font-family: var(--font-primary);
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  display: inline-block;
  display: flex;
  align-items: center;
  gap: 8px;
}
.complaint-section-area .complaint-header .complaint-list ul li a i {
  color: var(--secondary);
}
.complaint-section-area .complaint-header .header-btn2 {
  margin-top: 32px;
  background: var(--secondary);
}
.complaint-section-area .contact-mail .main-contact-box {
  position: relative;
}
.complaint-section-area
  .contact-mail
  .main-contact-box
  .main-contact-img
  .angle-border {
  position: absolute;
  left: -122px;
  top: 22%;
}
.complaint-section-area
  .contact-mail
  .main-contact-box
  .main-contact-img
  .instagram-icon {
  height: 64px;
  width: 64px;
  text-align: center;
  border-radius: 50%;
  line-height: 64px;
  display: inline-block;
  background: var(--white-100, #fff);
  position: absolute;
  left: -150px;
  top: 0;
  box-shadow: 0px 6px 32px rgba(0, 0, 0, 0.15);
}
.complaint-section-area .contact-mail .main-contact-box .main-contact-content {
  border-radius: var(--4, 4px);
  background: var(--white-100, #fff);
  padding: 24px;
  position: relative;
  z-index: 1;
  box-shadow: 0px 4px 50px 0px rgba(0, 0, 0, 0.08);
}
.complaint-section-area
  .contact-mail
  .main-contact-box
  .main-contact-content
  .mail-icon {
  height: 70px;
  width: 70px;
  text-align: center;
  line-height: 70px;
  background: var(--tag);
  border-radius: 50%;
}
.complaint-section-area
  .contact-mail
  .main-contact-box
  .main-contact-content
  .mail-content
  h3 {
  color: var(--Text-Color, #0d0e10);
  font-family: var(--font-primary);
  font-size: 20px;
  font-style: normal;
  font-weight: 700;
  line-height: 20px;
  margin-top: 16px;
  margin-bottom: 16px;
  text-transform: capitalize;
}
.complaint-section-area
  .contact-mail
  .main-contact-box
  .main-contact-content
  .mail-content
  p {
  color: var(--body);
  font-family: var(--font-primary);
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 28px;
}
.complaint-section-area .contact-mail .main-contact-box.box2 {
  position: relative;
}
.complaint-section-area
  .contact-mail
  .main-contact-box.box2
  .main-contact-img
  .angle-border {
  position: absolute;
  right: -122px;
  left: inherit;
  top: 22%;
}
.complaint-section-area
  .contact-mail
  .main-contact-box.box2
  .main-contact-img
  .instagram-icon {
  height: 64px;
  width: 64px;
  text-align: center;
  border-radius: 50%;
  line-height: 64px;
  display: inline-block;
  background: var(--white-100, #fff);
  position: absolute;
  right: -150px;
  left: inherit;
  top: 0;
  box-shadow: 0px 6px 32px rgba(0, 0, 0, 0.15);
}
.complaint-section-area
  .contact-mail
  .main-contact-box.box2
  .main-contact-content {
  border-radius: var(--4, 4px);
  background: var(--white-100, #fff);
  padding: 24px;
  position: relative;
  z-index: 1;
  box-shadow: 0px 4px 50px 0px rgba(0, 0, 0, 0.08);
}
.complaint-section-area
  .contact-mail
  .main-contact-box.box2
  .main-contact-content
  .mail-icon {
  height: 70px;
  width: 70px;
  text-align: center;
  line-height: 70px;
  background: var(--tag);
  border-radius: 50%;
}
.complaint-section-area
  .contact-mail
  .main-contact-box.box2
  .main-contact-content
  .mail-content
  h3 {
  color: var(--Text-Color, #0d0e10);
  font-family: var(--font-primary);
  font-size: 20px;
  font-style: normal;
  font-weight: 700;
  line-height: 20px;
  margin-top: 16px;
  margin-bottom: 16px;
  text-transform: capitalize;
}
.complaint-section-area
  .contact-mail
  .main-contact-box.box2
  .main-contact-content
  .mail-content
  p {
  color: var(--body);
  font-family: var(--font-primary);
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 28px;
}

/*============= COMPLAINT CSS AREA ENDS ===============*/
/*============= FAQ CSS AREA ===============*/
@media (max-width: 767px) {
  .faq3-section-area {
    padding: 50px 0 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .faq3-section-area {
    padding: 50px 0 30px;
  }
}
.faq3-section-area .faq3-widgets-area {
  padding: 0 0 0 50px;
}
@media (max-width: 767px) {
  .faq3-section-area .faq3-widgets-area {
    padding: 0;
    margin-top: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .faq3-section-area .faq3-widgets-area {
    padding: 0;
    margin-top: 30px;
  }
}
.faq3-section-area .faq3-widgets-area .accordion .accordion-item {
  padding: 24px 0;
  border-top: 1px solid var(--Stroke-Color, rgba(86, 95, 118, 0.1));
  border-bottom: 0;
}
.faq3-section-area .faq3-widgets-area .accordion .accordion-item button {
  box-shadow: none;
  background: none;
  font-size: 20px;
  font-weight: 700;
  color: var(--Text-Color, #0d0e10);
  font-family: var(--font-primary);
  line-height: 24px;
  padding: 0;
}
.faq3-section-area
  .faq3-widgets-area
  .accordion
  .accordion-item
  .accordion-body {
  font-size: 16px;
  font-weight: 500;
  font-family: var(--font-primary);
  color: var(--body);
  padding: 0;
  margin-top: 20px;
}
.faq3-section-area
  .faq3-widgets-area
  .accordion
  .accordion-item
  .accordion-button::after {
  flex-shrink: 0;
  width: 16px;
  height: 2px;
  margin-left: auto;
  content: "";
  background-color: var(--white-100, #fff);
  filter: brightness(0);
  z-index: 2;
  position: absolute;
  right: 22px;
}
.faq3-section-area
  .faq3-widgets-area
  .accordion
  .accordion-item
  .accordion-button::before {
  flex-shrink: 0;
  width: 2px;
  height: 16px;
  margin-left: auto;
  content: "";
  background-color: var(--white-100, #fff);
  filter: brightness(0);
  position: absolute;
  right: 29px;
  z-index: 3;
  display: none;
}
.faq3-section-area
  .faq3-widgets-area
  .accordion
  .accordion-button.collapsed.accordion-button::before {
  display: block;
}

@media (max-width: 767px) {
  .faq-inner-section-area {
    padding: 50px 0 50px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .faq-inner-section-area {
    padding: 50px 0 50px;
  }
}
.faq-inner-section-area .faq-all-area .accordion .accordion-item {
  padding: 24px;
  border: 1px solid var(--Stroke-Color, rgba(86, 95, 118, 0.1));
  border-radius: 4px;
}
.faq-inner-section-area .faq-all-area .accordion .accordion-item button {
  box-shadow: none;
  background: none;
  font-size: 20px;
  font-weight: 700;
  color: var(--Text-Color, #0d0e10);
  font-family: var(--font-primary);
  line-height: 24px;
  padding: 0;
}
.faq-inner-section-area
  .faq-all-area
  .accordion
  .accordion-item
  .accordion-body {
  font-size: 16px;
  font-weight: 500;
  font-family: var(--font-primary);
  color: var(--body);
  padding: 0;
  margin-top: 20px;
}
.faq-inner-section-area
  .faq-all-area
  .accordion
  .accordion-item
  .accordion-button::after {
  flex-shrink: 0;
  width: 16px;
  height: 2px;
  margin-left: auto;
  content: "";
  background-color: var(--white-100, #fff);
  filter: brightness(0);
  z-index: 2;
}
.faq-inner-section-area
  .faq-all-area
  .accordion
  .accordion-item
  .accordion-button::before {
  flex-shrink: 0;
  width: 2px;
  height: 16px;
  margin-left: auto;
  content: "";
  background-color: var(--white-100, #fff);
  filter: brightness(0);
  position: absolute;
  right: 7px;
  z-index: 3;
  display: none;
}
.faq-inner-section-area
  .faq-all-area
  .accordion
  .accordion-button.collapsed.accordion-button::before {
  display: block;
}

.faq5-section-area {
  background: #f8f9fa;
}
@media (max-width: 767px) {
  .faq5-section-area {
    padding: 50px 0 50px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .faq5-section-area {
    padding: 50px 0 50px;
  }
}
.faq5-section-area .faq3-widgets-area {
  padding: 0 0 0 50px;
}
@media (max-width: 767px) {
  .faq5-section-area .faq3-widgets-area {
    padding: 0;
    margin-top: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .faq5-section-area .faq3-widgets-area {
    padding: 0;
    margin-top: 30px;
  }
}
.faq5-section-area .faq3-widgets-area .accordion {
  background: #f8f9fa;
}
.faq5-section-area .faq3-widgets-area .accordion .accordion-item {
  padding: 24px 0;
  border-top: 1px solid var(--Stroke-Color, rgba(86, 95, 118, 0.1));
  border-bottom: 0;
  background: #f8f9fa;
}
.faq5-section-area .faq3-widgets-area .accordion .accordion-item button {
  box-shadow: none;
  background: none;
  font-size: 20px;
  font-weight: 700;
  color: var(--Text-Color, #0d0e10);
  font-family: var(--font-primary);
  line-height: 24px;
  padding: 0;
}
.faq5-section-area
  .faq3-widgets-area
  .accordion
  .accordion-item
  .accordion-body {
  font-size: 16px;
  font-weight: 500;
  font-family: var(--font-primary);
  color: var(--body);
  padding: 0;
  margin-top: 20px;
}
.faq5-section-area
  .faq3-widgets-area
  .accordion
  .accordion-item
  .accordion-button::after {
  flex-shrink: 0;
  width: 16px;
  height: 2px;
  margin-left: auto;
  content: "";
  background-color: var(--white-100, #fff);
  filter: brightness(0);
  z-index: 2;
  position: absolute;
  right: 22px;
}
.faq5-section-area
  .faq3-widgets-area
  .accordion
  .accordion-item
  .accordion-button::before {
  flex-shrink: 0;
  width: 2px;
  height: 16px;
  margin-left: auto;
  content: "";
  background-color: var(--white-100, #fff);
  filter: brightness(0);
  position: absolute;
  right: 29px;
  z-index: 3;
  display: none;
}
.faq5-section-area
  .faq3-widgets-area
  .accordion
  .accordion-button.collapsed.accordion-button::before {
  display: block;
}

/*============= FAQ CSS AREA ENDS ===============*/
/*============= ABOUT CSS AREA ===============*/
.about-welcome-section-area {
  padding: 170px 0 200px;
}
.about-welcome-section-area .about-welcome-header h1 {
  font-size: 60px;
  line-height: 60px;
}
@media (max-width: 767px) {
  .about-welcome-section-area .about-welcome-header h1 {
    font-size: 32px;
    line-height: 42px;
  }
}
.about-welcome-section-area .about-welcome-header a {
  font-family: var(--font-primary);
  font-size: 18px;
  font-weight: 500;
  color: var(--white-100, #fff);
  display: inline-block;
}
.about-welcome-section-area .about-welcome-header a i {
  margin: 0 4px;
}
.about-welcome-section-area .about-welcome-header a span {
  font-weight: 700;
  color: var(--white-100, #fff);
}

.about-welcome-section-area.about2 {
  padding: 200px 0 100px;
}

/*  About Section CSS */

/*  About Section CSS */


/*============= CONTACT CSS AREA ===============*/
.about-welcome-section-area .contact-inner-header {
  padding: 0 50px 0 0;
}
@media (max-width: 767px) {
  .about-welcome-section-area .contact-inner-header {
    padding: 0;
    margin-bottom: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .about-welcome-section-area .contact-inner-header {
    padding: 0;
    margin-bottom: 30px;
  }
}
.about-welcome-section-area .contact-inner-header p {
  color: var(--white-100, #fff);
  opacity: 0.8;
  font-family: var(--font-primary);
  font-weight: 500;
  font-size: 16px;
  line-height: 26px;
}
.about-welcome-section-area .contact-inner-header h3 {
  font-family: var(--font-primary);
  font-size: 20px;
  font-weight: 700;
  color: var(--white-100, #fff);
  line-height: 20px;
}
.about-welcome-section-area .contact-box-area .contact-boxs {
  background: var(--white-100, #fff);
  padding: 16px 20px;
  position: relative;
  border-radius: 4px;
  transition: var(--transition);
}
.about-welcome-section-area .contact-box-area .contact-boxs:hover {
  transform: translateY(-5px);
  transition: var(--transition);
}
.about-welcome-section-area .contact-box-area .contact-boxs .img1 {
  height: 60px;
  width: 60px;
  text-align: center;
  line-height: 60px;
  display: inline-block;
  background: var(--tag);
  transition: var(--transition);
  border-radius: 50%;
  position: absolute;
}
.about-welcome-section-area .contact-box-area .contact-boxs .content {
  padding-left: 80px;
  margin-top: 5px;
}
.about-welcome-section-area .contact-box-area .contact-boxs .content p {
  font-family: var(--font-primary);
  font-size: 20px;
  font-weight: 700;
  color: var(--Text-Color, #0d0e10);
}
.about-welcome-section-area .contact-box-area .contact-boxs .content a {
  font-family: var(--font-primary);
  font-size: 16px;
  font-weight: 500;
  color: var(--body);
  display: inline-block;
}
.about-welcome-section-area .conatact-header-boxarea {
  background: var(--white-100, #fff);
  padding: 40px;
  border-radius: 4px;
}
.about-welcome-section-area .conatact-header-boxarea .input-area input {
  width: 100%;
  outline: none;
  border: 1px solid var(--Stroke-Color, rgba(86, 95, 118, 0.1));
  padding: 15px 13px;
  border-radius: 4px;
  height: 50px;
  font-family: var(--font-primary);
  font-size: 16px;
}
.about-welcome-section-area .conatact-header-boxarea .input-area textarea {
  width: 100%;
  outline: none;
  border: 1px solid var(--Stroke-Color, rgba(86, 95, 118, 0.1));
  padding: 15px 13px;
  border-radius: 4px;
  height: 125px;
  font-family: var(--font-primary);
  font-size: 16px;
}
.about-welcome-section-area .conatact-header-boxarea .div button {
  outline: none;
  border: none;
}

.map-section-area .mapouter .gmap_canvas {
  position: relative;
  top: 7px;
}
.map-section-area .mapouter .gmap_canvas iframe {
  width: 100%;
  height: 565px;
}

.about-welcome-section-area.login {
  padding: 100px 0 100px;
}
@media (max-width: 767px) {
  .about-welcome-section-area.login {
    padding: 100px 0 50px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .about-welcome-section-area.login {
    padding: 100px 0 50px;
  }
}
.about-welcome-section-area.login .logo4 {
  height: 80px;
  width: 265px;
}
.about-welcome-section-area.login .login-boxarea {
  background: var(--white-100, #fff);
  padding: 50px;
  border-radius: 4px;
}
@media (max-width: 767px) {
  .about-welcome-section-area.login .login-boxarea {
    padding: 24px;
  }
}
.about-welcome-section-area.login .login-boxarea .icons {
  height: 100px;
  width: 100px;
  text-align: center;
  line-height: 100px;
  border-radius: 50%;
  background: var(--tag);
  transition: var(--transition);
  margin: 0 auto;
}
.about-welcome-section-area.login .login-boxarea .input-area h4 {
  font-family: var(--font-primary);
  font-size: 20px;
  line-height: 20px;
  font-weight: 700;
  color: var(--Text-Color, #0d0e10);
}
.about-welcome-section-area.login .login-boxarea .input-area input {
  width: 100%;
  outline: none;
  border: none;
  background: var(--tag);
  padding: 20px;
  height: 60px;
  border-radius: 30px;
  font-family: var(--font-primary);
  font-size: 16px;
  color: var(--Text-Color, #0d0e10);
  font-weight: 500;
}
.about-welcome-section-area.login
  .login-boxarea
  .input-area
  input::-moz-placeholder {
  font-family: var(--font-primary);
  font-size: 16px;
  font-weight: 500;
  color: var(--body);
}
.about-welcome-section-area.login
  .login-boxarea
  .input-area
  input::placeholder {
  font-family: var(--font-primary);
  font-size: 16px;
  font-weight: 500;
  color: var(--body);
}
.about-welcome-section-area.login .login-boxarea .input-area .header-btn2 {
  background: var(--secondary);
  border: none;
  outline: none;
  width: 100%;
  padding: 22px;
  border-radius: 30px;
}
.about-welcome-section-area.login
  .login-boxarea
  .input-area
  .header-btn2::after {
  left: 50%;
}
.about-welcome-section-area.login
  .login-boxarea
  .input-area
  .header-btn2:hover {
  border-radius: 30px;
}
.about-welcome-section-area.login
  .login-boxarea
  .input-area
  .header-btn2:hover::after {
  left: 0;
  border-radius: 30px;
}
.about-welcome-section-area.login .login-boxarea .sign-text {
  display: flex;
  align-items: center;
  text-align: center;
  justify-content: center;
}
.about-welcome-section-area.login .login-boxarea .sign-text a {
  font-family: var(--font-primary);
  font-weight: 700;
  color: var(--secondary);
  font-size: 16px;
  margin-left: 14px;
  display: inline-block;
  text-decoration: underline;
}
.about-welcome-section-area.login .login-boxarea .div a {
  font-family: var(--font-primary);
  font-weight: 700;
  color: var(--secondary);
  font-size: 16px;
  margin-left: 14px;
  display: inline-block;
  text-decoration: underline;
  text-align: center;
}
.about-welcome-section-area.login .login-boxarea ul {
  display: flex;
  align-items: center;
}
.about-welcome-section-area.login .login-boxarea ul li p {
  margin: 0 10px;
}
.about-welcome-section-area.login .login-boxarea .btn-area .header-btn2 {
  display: block;
  width: 100%;
  background: var(--tag);
  font-family: var(--font-primary);
  color: var(--body);
}
.about-welcome-section-area.login .login-boxarea .btn-area .header-btn2::after {
  left: 50%;
}
.about-welcome-section-area.login
  .login-boxarea
  .btn-area
  .header-btn2:hover::after {
  display: none;
}
.about-welcome-section-area.login .login-boxarea .btn-area .header-btn2 img {
  margin: 0 12px 0 0;
}

/*============= CONTACT CSS AREA ENDS ===============*/
/*============= RTL CSS AREA ===============*/
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .rtl-homepage,
  html {
    overflow-x: hidden !important;
  }
}

.rtl-homepage .preloader {
  margin-left: 25px;
  margin-top: -25px;
}
.rtl-homepage .header-area.homepage3 {
  position: absolute;
  width: 100%;
  z-index: 2;
}
.rtl-homepage .header-area.homepage3 .navbar {
  display: block;
}
.rtl-homepage .header-area.homepage3 .header-elements {
  display: flex;
  align-self: center;
  justify-content: space-between;
  transition: var(--transition);
  padding: 24px 0 0 0;
}
.rtl-homepage .header-area.homepage3 .header-elements .site-logo {
  margin-top: 5px;
}
.rtl-homepage .header-area.homepage3 .header-elements .main-menu {
  display: flex;
  align-items: center;
  padding: 12px 16px;
  transition: var(--transition);
  background: #ede9fd;
  border-radius: 4px;
}
.rtl-homepage
  .header-area.homepage3
  .header-elements
  .main-menu
  .nav-item
  .nav-link.active {
  background: none;
  color: var(--secondary);
}
.rtl-homepage .header-area.homepage3 .header-elements .main-menu ul li {
  display: inline-block;
  position: relative;
}
.rtl-homepage
  .header-area.homepage3
  .header-elements
  .main-menu
  ul
  li:hover
  > a {
  color: var(--secondary);
  transition: var(--transition);
}
.rtl-homepage
  .header-area.homepage3
  .header-elements
  .main-menu
  ul
  li:hover
  > a
  svg {
  padding: 0 !important;
}
.rtl-homepage
  .header-area.homepage3
  .header-elements
  .main-menu
  ul
  li:hover
  ul.dropdown-padding {
  visibility: visible;
  transition: all 0.5s ease-in-out;
  opacity: 1;
  z-index: 9;
  top: 50px;
  position: absolute;
}
.rtl-homepage .header-area.homepage3 .header-elements .main-menu ul li a {
  font-family: "Figtree", sans-serif !important;
  font-size: 16px;
  font-weight: 500;
  color: var(--Text-Color, #0d0e10);
  display: inline-block;
  transition: var(--transition);
  padding: 0 10px;
}
.rtl-homepage
  .header-area.homepage3
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding {
  visibility: hidden;
  opacity: 0;
  box-shadow: rgba(0, 0, 0, 0.2) 0px 20px 30px;
  position: absolute;
  background: var(--white-100, #fff);
  top: 100px;
  width: 220px;
  z-index: 1;
  transition: var(--transition);
  border-radius: 5px;
  padding: 15px;
}
.rtl-homepage
  .header-area.homepage3
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li.main-small-menu {
  position: relative;
}
.rtl-homepage
  .header-area.homepage3
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li.main-small-menu:hover
  > a {
  color: var(--secondary);
  transition: var(--transition);
  padding-right: 25px;
}
.rtl-homepage
  .header-area.homepage3
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li.main-small-menu:hover
  > a::after {
  color: #fc4b3e;
  transition: var(--transition);
  visibility: visible;
  opacity: 1;
}
.rtl-homepage
  .header-area.homepage3
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li.main-small-menu
  a {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.rtl-homepage
  .header-area.homepage3
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li.main-small-menu
  ul.small-dropdown {
  visibility: hidden;
  opacity: 0;
  box-shadow: rgba(0, 0, 0, 0.2) 0px 20px 30px;
  background: var(--white-100, #fff);
  position: absolute;
  top: 70px;
  width: 220px;
  z-index: 1;
  left: -225px;
  transition: var(--transition);
  border-radius: 5px;
  padding: 15px;
}
.rtl-homepage
  .header-area.homepage3
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li.main-small-menu:hover
  ul.small-dropdown {
  visibility: visible;
  transition: all 0.5s ease-in-out;
  opacity: 1;
  z-index: 9;
  top: 0;
  position: absolute;
}
.rtl-homepage
  .header-area.homepage3
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li {
  display: block;
}
.rtl-homepage
  .header-area.homepage3
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li
  a {
  font-family: "Figtree", sans-serif !important;
  font-weight: 500;
  color: var(--Text-Color, #0d0e10);
  padding: 8px;
  display: inline-block;
  position: relative;
  z-index: 1;
  border-radius: 4px;
  transition: var(--transition);
}
.rtl-homepage
  .header-area.homepage3
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li
  a::after {
  position: absolute;
  content: "";
  height: 2px;
  width: 10px;
  transition: var(--transition);
  z-index: -1;
  background: var(--secondary);
  right: 10px;
  left: inherit;
  top: 22px;
  border-radius: 4px;
  display: inline-block;
  visibility: hidden;
  opacity: 0;
  transition: var(--transition);
}
.rtl-homepage
  .header-area.homepage3
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li
  a:hover {
  transition: var(--transition);
  color: var(--secondary);
  padding-right: 25px;
}
.rtl-homepage
  .header-area.homepage3
  .header-elements
  .main-menu
  ul
  li
  ul.dropdown-padding
  li
  a:hover::after {
  transition: var(--transition);
  border-radius: 4px;
  visibility: visible;
  transition: var(--transition);
  opacity: 1;
}
.rtl-homepage .header-area.homepage3 .header-elements .header-padding ul li a {
  padding: 0 14px;
}
.rtl-homepage .mobile-sidebar.mobile-sidebar3 .menu-close {
  right: inherit;
  left: 20px;
}
.rtl-homepage
  .mobile-sidebar.mobile-sidebar3
  .footer4-contact-info
  .contact-info-single
  .contact-info-icon
  svg {
  margin: 0 0 0 6px;
}
.rtl-homepage
  .mobile-sidebar.mobile-sidebar3
  .footer4-contact-info
  .contact-info-single
  .contact-info-text {
  margin-right: 10px;
}
.rtl-homepage
  .mobile-sidebar.mobile-sidebar3
  .mobile-nav.mobile-nav2
  ul
  li
  span::after {
  left: 8px;
  right: inherit;
}
.rtl-homepage
  .mobile-sidebar.mobile-sidebar3
  .mobile-nav.mobile-nav2
  ul
  li
  span::before {
  left: 0;
  right: inherit;
}
.rtl-homepage .header-area.homepage3.sticky {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  transform: translate3d(0, 0, 0);
  z-index: 111;
  animation-name: fade-in-down;
  animation-fill-mode: forwards;
  background-color: var(--white-100, #fff);
  box-shadow: 0px 4px 30px 0px rgba(0, 0, 0, 0.08);
  transition: var(--transition);
  z-index: 99;
}
.rtl-homepage .header-area.homepage3.sticky .header-elements {
  margin-top: 0;
  transition: var(--transition);
  border: none;
  background: none;
  padding: 14px 0;
}
.rtl-homepage .header-area.homepage3.sticky .header-elements .main-menu {
  background: none;
  transition: var(--transition);
}
.rtl-homepage
  .welcome3-section-area
  .welcome3-header
  .header-btn5:hover::after {
  right: 0;
  left: inherit;
}
.rtl-homepage
  .tools-section-area
  .tabs3-tools-area
  .tab-content
  .tab-pane
  .main-content-area
  .tabs-header {
  padding: 0 0 0 30px;
}
.rtl-homepage
  .tools-section-area
  .tabs3-tools-area
  .tab-content
  .tab-pane
  .main-content-area
  .tabs-header
  .list
  img {
  margin: 0 0 0 30px;
}
.rtl-homepage
  .tools-section-area
  .tabs3-tools-area
  .tab-content
  .tab-pane
  .main-content-area
  .tabs-header
  .header-btn5:hover::after {
  right: 0;
  left: inherit;
}
.rtl-homepage
  .tools-section-area
  .tabs3-tools-area
  .tab-content
  .tab-pane
  .main-content-area
  .tabs-images
  .tabs-img2 {
  left: 0;
  right: inherit;
}
.rtl-homepage .features3-section-area .features3-images .img2 img {
  left: -100px;
  right: inherit;
}
@media (max-width: 767px) {
  .rtl-homepage .features3-section-area .features3-images .img2 img {
    left: 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .rtl-homepage .features3-section-area .features3-images .img2 img {
    left: 0;
  }
}
@media (max-width: 767px) {
  .rtl-homepage .features3-section-area .features-content-box {
    margin-bottom: 30px;
  }
}
.rtl-homepage .features3-section-area .features-content-box .content {
  padding-left: 0;
  padding-right: 50px;
}
.rtl-homepage .step-section-area .step-author-area {
  margin: 0;
}
.rtl-homepage .step-section-area .step-author-area::after {
  right: 35px;
  left: inherit;
}
.rtl-homepage .step-section-area .step-author-area .content {
  margin-right: 32px;
}
.rtl-homepage .step-section-area .step-header-area .header-btn5:hover::after {
  right: 0;
}
.rtl-homepage
  .testimonial3-section-area
  .testimonial3-slider-area-rtl
  .testimonial3-boxarea {
  border: 1px solid var(--Stroke-Color, rgba(86, 95, 118, 0.1));
  padding: 20px;
  transition: var(--transition);
  border-radius: 4px;
}
.rtl-homepage
  .testimonial3-section-area
  .testimonial3-slider-area-rtl
  .testimonial3-boxarea:hover {
  background: var(--white-100, #fff);
  transition: var(--transition);
  border: 1px solid var(--white-100, #fff);
  box-shadow: 0px 4px 50px 0px rgba(0, 0, 0, 0.08);
  border-radius: 4px;
}
.rtl-homepage
  .testimonial3-section-area
  .testimonial3-slider-area-rtl
  .testimonial3-boxarea:hover
  .img2
  p {
  color: var(--Text-Color, #0d0e10);
  transition: var(--transition);
}
.rtl-homepage
  .testimonial3-section-area
  .testimonial3-slider-area-rtl
  .testimonial3-boxarea
  .images-content {
  display: flex;
  align-items: center;
}
.rtl-homepage
  .testimonial3-section-area
  .testimonial3-slider-area-rtl
  .testimonial3-boxarea
  .images-content
  img {
  height: 50px;
  width: 50px;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 50%;
}
.rtl-homepage
  .testimonial3-section-area
  .testimonial3-slider-area-rtl
  .testimonial3-boxarea
  .images-content
  .content {
  margin-right: 12px;
}
.rtl-homepage
  .testimonial3-section-area
  .testimonial3-slider-area-rtl
  .testimonial3-boxarea
  .images-content
  .content
  a {
  font-family: var(--font-primary);
  font-size: 20px;
  font-weight: 700;
  color: var(--Text-Color, #0d0e10);
  line-height: 20px;
  display: inline-block;
  margin-bottom: 8px;
  transition: var(--transition);
}
.rtl-homepage
  .testimonial3-section-area
  .testimonial3-slider-area-rtl
  .testimonial3-boxarea
  .images-content
  .content
  p {
  font-size: 16px;
  font-weight: 500;
  color: var(--body);
  font-family: var(--font-primary);
  transition: var(--transition);
}
.rtl-homepage
  .testimonial3-section-area
  .testimonial3-slider-area-rtl
  .testimonial3-boxarea
  .img2
  img {
  height: 40px;
  width: 40px;
  -o-object-fit: contain;
  object-fit: contain;
}
.rtl-homepage
  .testimonial3-section-area
  .testimonial3-slider-area-rtl
  .testimonial3-boxarea
  .img2
  p {
  font-family: var(--font-primary);
  font-size: 16px;
  font-weight: 500;
  color: var(--body);
  line-height: 28px;
  transition: var(--transition);
}
.rtl-homepage
  .testimonial3-section-area
  .testimonial3-slider-area-rtl
  .owl-dots {
  text-align: center;
  margin-top: 30px;
}
.rtl-homepage
  .testimonial3-section-area
  .testimonial3-slider-area-rtl
  .owl-dots
  button {
  position: relative;
  height: 16px;
  width: 16px;
  border-radius: 50%;
  background: #c6b9f9;
  margin: 0 16px 0 0;
}
.rtl-homepage
  .testimonial3-section-area
  .testimonial3-slider-area-rtl
  .owl-dots
  button::after {
  position: absolute;
  content: "";
  height: 24px;
  width: 24px;
  border-radius: 50%;
  border: 1px solid var(--secondary);
  left: -5px;
  top: -5px;
  display: none;
}
.rtl-homepage
  .testimonial3-section-area
  .testimonial3-slider-area-rtl
  .owl-dots
  button.active {
  background: var(--secondary);
  height: 14px;
  width: 14px;
}
.rtl-homepage
  .testimonial3-section-area
  .testimonial3-slider-area-rtl
  .owl-dots
  button.active::after {
  display: block;
}
.rtl-homepage .faq3-section-area .faq3-header .header-btn5:hover::after {
  right: 0;
  left: inherit;
}
.rtl-homepage .faq3-section-area .faq3-widgets-area {
  padding: 0 50px 0 0;
}
@media (max-width: 767px) {
  .rtl-homepage .faq3-section-area .faq3-widgets-area {
    padding: 0;
    margin-bottom: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .rtl-homepage .faq3-section-area .faq3-widgets-area {
    padding: 0;
    margin-bottom: 30px;
  }
}
.rtl-homepage
  .faq3-section-area
  .faq3-widgets-area
  .accordion
  .accordion-item
  button::after {
  right: inherit;
  left: 0;
}
.rtl-homepage
  .faq3-section-area
  .faq3-widgets-area
  .accordion
  .accordion-item
  button::before {
  right: inherit;
  left: 6px;
}
.rtl-homepage .cta3-section-area .cta3-header-area .header-btn5:hover::after {
  left: inherit;
  right: 0;
}
.rtl-homepage
  .pricing-paln-section-area
  .pricing-plans
  .tab-content
  .price-box
  .header-btn5::after {
  display: none;
}
.rtl-homepage
  .pricing-paln-section-area
  .pricing-plans
  .tab-content
  .price-box
  .hadding
  .price-list
  ul
  li
  img {
  margin: 0 0 0 6px;
}

/*============= RTL CSS AREA ENDS ===============*/ /*# sourceMappingURL=master.css.map */
/* Outer Box */
.engagement-box {
  padding: 38px;
  border-radius: 18px;
  border: 2px solid transparent;
  transition: all 0.35s ease;
}

/* Title */
.engagement-title {
  font-size: 27px;
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 16px;
}

/* Subtext */
.engagement-subtext {
  font-size: 16.5px;
  color: #475569;
  line-height: 1.7;
  margin-bottom: 24px;
}

/* Features List */
.engagement-features {
  list-style: none;
  padding: 0;
  margin: 0;
}

.engagement-features li {
  position: relative;
  margin-bottom: 15px;
  font-size: 15.5px;
  font-weight: 500;
  color: #1e293b;
  line-height: 1.6;
  display: flex;
  align-items: center;
  gap: 8px;
}



/* Responsive */
@media (max-width: 768px) {
  .engagement-box {
    padding: 30px;
  }
  .engagement-title {
    font-size: 23px;
  }
  .engagement-subtext {
    font-size: 15px;
  }
  .engagement-features li {
    font-size: 15px;
  }
}

fade-in {
  opacity: 0;
  transform: translateY(20px);
  animation: fadeInUp 0.7s forwards;
}
@keyframes fadeInUp {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* card animation */
.library-box {
  transition: all 0.4s ease;
  border-radius: 12px;
  padding: 40px 10px;
  background: #fff;
  cursor: pointer;
  border: 1px solid #eee;
}
.library-box:hover {
  transform: translateY(-8px) scale(1.03);
  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.08);
  border-color: #00abf0;
}
.library-box img {
  height: 70px;
  margin-bottom: 12px;
}

.library-box h6 {
  font-size: 18px;
}

.section-title h3 {
  font-weight: 700;
}
.info-box {
  padding: 25px;
  border-radius: 12px;
  transition: 0.4s;
}
.info-box:hover {
  background: #fff;
  transform: translateY(-6px);
  box-shadow: 0 15px 40px rgba(0, 0, 0, 0.07);
}
.info-box img {
  height: 45px;
  margin-bottom: 15px;
}

/* animation */
.fade-in {
  opacity: 0;
  transform: translateY(20px);
  animation: fadeUp 0.7s forwards;
}
@keyframes fadeUp {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.info-box p {
  padding: 10px 0px;
}

.info-card {
  padding: 25px;
  border-radius: 12px;
  transition: 0.4s;
}
.info-card:hover {
  background: #fff;
  transform: translateY(-6px);
  box-shadow: 0 10px 35px rgba(0, 0, 0, 0.08);
}
.info-card img {
  height: 45px;
  margin-bottom: 12px;
}

/* animation */
.fade-in {
  opacity: 0;
  transform: translateY(20px);
  animation: fadeUp 0.7s forwards;
}
@keyframes fadeUp {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.api-img-wrapper img:hover {
  transform: scale(1.02);
  transition: 0.4s ease;
}

.img-hover-effect img {
  transition: all 0.4s ease;
  transform: scale(1);
}

.img-hover-effect:hover img {
  transform: scale(1.05) translateY(-6px);
}

.reporting-analytics .analytics-box {
  background: #fff;
  border-radius: 12px;
  transition: 0.4s;
  cursor: pointer;
  border: 1px solid #eee;
}

.reporting-analytics .analytics-box:hover {
  transform: translateY(-8px);
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.12);
}

.reporting-analytics .icon-img {
  width: 65px;
  transition: 0.4s;
}

.reporting-analytics .analytics-box:hover .icon-img {
  transform: scale(1.12);
}

.analytics-sec {
  background: var(--secondary);
}

.analytics-icon {
  width: 60px;
}

.analytics-item {
  max-width: 350px;
  margin: auto;
}
.analytics-box img {
  width: 100%;
  max-width: 35px;
}

.analytics-box {
  padding: 30px;
}

.animated-img {
  opacity: 0;
  transform: translateY(20px);
  animation: fadeFloat 1.5s ease-out forwards;
}

@keyframes fadeFloat {
  0% {
    opacity: 0;
    transform: translateY(20px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

.feature-box {
  transition: all 0.35s ease;
  border: 1px solid #f1f1f1;
  border-radius: 15px;
  padding: 30px;
  background: #fff;
}

.feature-box:hover {
  transform: translateY(-8px) scale(1.03);
  border-color: var(--secondary);
  box-shadow: 0 12px 25px rgba(0, 0, 0, 0.1);
}

.feature-box:hover .feature-icon {
  background: var(--secondary);
}

.feature-box:hover .feature-icon i {
  color: #fff !important;
}

.benefit-box {
  transition: all 0.35s ease;
  border: 2px solid #eaeaea;
  background: #fff;
}

.benefit-box:hover {
  transform: translateY(-8px) scale(1.03);
  border-color: var(--secondary);
  box-shadow: 0 12px 25px rgba(0, 0, 0, 0.1);
}

.benefit-box:hover i {
  color: var(--secondary) !important;
  transform: scale(1.2);
}

.ab-test-card {
  transition: all 0.4s ease;
  border-radius: 18px;
  padding: 30px;
  background: #ffffff;
  border: 2px solid #f1f1f1;
}

.ab-test-card:hover {
  transform: translateY(-10px) scale(1.03);
  border-color: #4b7bec;
  box-shadow: 0 15px 25px rgba(0, 0, 0, 0.1);
}

.ab-test-card img {
  width: 80px;
  height: 80px;
  margin-bottom: 20px;
  transition: 0.4s ease;
}

.ab-test-card:hover img {
  transform: rotate(-8deg) scale(1.1);
}

.ab-title {
  font-weight: 700;
  color: #2d3436;
}

.ab-text {
  color: #636e72;
  font-size: 15px;
}

h1 {
  text-transform: capitalize;
}

.benefit-card {
  transition: all 0.4s ease;
  border-radius: 12px;
  background: #ffffff;
  border: 1px solid #e6e6e6;
}
.benefit-card:hover {
  transform: translateY(-10px);
  box-shadow: 0px 10px 25px rgba(0, 0, 0, 0.1);
  border-color: transparent;
}
.benefit-icon {
  font-size: 40px;
  color: var(--secondary);
  transition: 0.3s;
}
.benefit-card:hover .benefit-icon {
  transform: scale(1.1);
}

.process-step {
  background: #ffffff;
  border-radius: 14px;
  padding: 30px;
  transition: all 0.4s ease;
  border: 1px solid #e5e5e5;
}
.process-step:hover {
  transform: translateY(-10px);
  box-shadow: 0 15px 40px rgba(0, 0, 0, 0.1);
  border-color: transparent;
}
.process-icon {
  width: 65px;
  height: 65px;
  border-radius: 50%;
  background: #007bff1a;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 28px;
  color: var(--secondary);
  margin-bottom: 20px;
  transition: 0.3s;
}
.process-step:hover .process-icon {
  transform: scale(1.15);
  background: var(--secondary);
  color: #fff;
}

.workflow-card {
  transition: all 0.3s ease;
}
.workflow-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
}

.process-card {
  transition: all 0.3s ease;
  border-radius: 15px;
  border: 1px solid var(--secondary);
}
.process-card:hover {
  transform: translateY(-8px);
  border-color: var(--secondary); /* border color on hover */
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
}
.icon-box {
  font-size: 40px;
  color: var(--secondary);
  margin-bottom: 15px;
}

.deliver-card {
  padding: 30px;
  border-radius: 15px;
  transition: all 0.3s ease;
  background: #fff;
  border: 1px solid var(--secondary);
}
.deliver-card:hover {
  transform: translateY(-10px);
  border-color: #008cff;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.12);
}
.deliver-icon {
  font-size: 40px;
  color: #008cff;
  margin-bottom: 15px;
}

.process-box {
  padding: 25px;
  border-radius: 12px;
  border: 1px solid #008cff;
  transition: 0.3s ease;
}
.process-box:hover {
  border-color: #006eff;
  transform: translateY(-8px);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
}
.process-icon {
  font-size: 35px;
  margin-bottom: 10px;
  color: #008cff;
}
.side-img {
  transition: 0.4s ease;
}
.side-img:hover {
  transform: scale(1.05) rotate(-2deg);
}

.hover-shadow:hover {
  transform: translateY(-5px);
  transition: 0.3s;
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;
}

.security-card {
  transition: all 0.3s ease;
}

.security-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 1rem 2rem rgba(0, 0, 0, 0.12);
}

.security-card:hover .icon i {
  transform: scale(1.15);
}

.security-card .icon i {
  transition: transform 0.3s ease;
}

.security-img {
  transition:
    transform 0.4s ease,
    box-shadow 0.4s ease;
}

.security-img:hover {
  transform: scale(1.03);
  box-shadow: 0 1.2rem 2.5rem rgba(0, 0, 0, 0.15);
}

.security-list li {
  transition: transform 0.3s ease;
}

.security-list li:hover {
  transform: translateX(6px);
}

.compliance-box {
  transition: all 0.35s ease;
}

.compliance-box:hover {
  transform: translateY(-10px);
  box-shadow: 0 1.4rem 3rem rgba(0, 0, 0, 0.15);
}

.compliance-box i {
  transition: transform 0.35s ease;
}

.compliance-box:hover i {
  transform: scale(1.15);
}

.award-box {
  border: 1px solid #e5e7eb;
  transition: all 0.3s ease;
}

.award-box:hover {
  transform: translateY(-8px);
  box-shadow: 0 15px 25px rgba(0, 0, 0, 0.08);
  border-color: #00a6ff;
}

.feature-card {
  border: 1px solid #e5e7eb;
  transition: 0.35s ease;
  background: #fff;
}

.feature-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 15px 30px rgba(0, 0, 0, 0.08);
  border-color: #00bef8;
  background-color: #d5f4fdff !important;
}

.feature-card.highlight {
  background: #ccf2fcff;
}

.template {
  transition: 0.3s;
}
.template:hover {
  transform: translateY(-6px);
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.4);
}
.nav-tabs .nav-link {
  border: none;
}
.nav-tabs .nav-link.active {
  background: #fff;
  color: #000 !important;
  border-radius: 4px;
}

.feature-item {
  font-weight: 500;
  cursor: pointer;
  position: relative;
  display: flex;
  justify-content: space-between;
  transition: 0.3s;
}

.feature-item .arrow {
  transition: 0.3s;
}

.feature-item:hover {
  color: #000;
}

.feature-item:hover .arrow {
  transform: translateX(6px);
}

.award-box {
  border: 1px solid #e5e7eb;
  transition: all 0.3s ease;
}

.award-box:hover {
  transform: translateY(-8px);
  box-shadow: 0 15px 25px rgba(0, 0, 0, 0.08);
  border-color: #00a6ff;
}

.feature-card {
  border: 1px solid #e5e7eb;
  transition: 0.35s ease;
  background: #fff;
}

.feature-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 15px 30px rgba(0, 0, 0, 0.08);
  border-color: #00bef8;
  background-color: #d5f4fdff !important;
}

.feature-card.highlight {
  background: #ccf2fcff;
}

.template {
  transition: 0.3s;
}
.template:hover {
  transform: translateY(-6px);
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.4);
}
.nav-tabs .nav-link {
  border: none;
}
.nav-tabs .nav-link.active {
  background: #fff;
  color: #000 !important;
  border-radius: 4px;
}

.feature-item {
  font-weight: 500;
  cursor: pointer;
  position: relative;
  display: flex;
  justify-content: space-between;
  transition: 0.3s;
}

.feature-item .arrow {
  transition: 0.3s;
}

.feature-item:hover {
  color: #000;
}

.feature-item:hover .arrow {
  transform: translateX(6px);
}

.benefit-card {
  transition: all 0.4s ease;
  border-radius: 12px;
  background: #ffffff;
  border: 1px solid #e6e6e6;
}
.benefit-card:hover {
  transform: translateY(-10px);
  box-shadow: 0px 10px 25px rgba(0, 0, 0, 0.1);
  border-color: transparent;
}
.benefit-icon {
  font-size: 40px;
  color: var(--secondary);
  transition: 0.3s;
}
.benefit-card:hover .benefit-icon {
  transform: scale(1.1);
}

.process-step {
  background: #ffffff;
  border-radius: 14px;
  padding: 30px;
  transition: all 0.4s ease;
  border: 1px solid #e5e5e5;
}
.process-step:hover {
  transform: translateY(-10px);
  box-shadow: 0 15px 40px rgba(0, 0, 0, 0.1);
  border-color: transparent;
}
.process-icon {
  width: 65px;
  height: 65px;
  border-radius: 50%;
  background: #007bff1a;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 28px;
  color: var(--secondary);
  margin-bottom: 20px;
  transition: 0.3s;
}
.process-step:hover .process-icon {
  transform: scale(1.15);
  background: var(--secondary);
  color: #fff;
}

.hero {
  padding: 80px 0%;
}
.main {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
}

.enterprise-card {
  border-radius: 12px;
  padding: 40px;
  color: #000;
  border: 1px solid #fff;
  border: 3px solid var(--secondary);
  box-shadow: 1px 7px 2px 2px #ebeaea;
}

.enterprise-title {
  font-size: 40px;
  font-weight: 700;
}

.enterprise-desc {
  font-size: 16px;
  color: #000;
}

.highlight {
  color: var(--secondary);
  font-weight: 600;
}

.contact-btn {
  background-color: #ffffff;
  color: #000;
  font-weight: 600;
  padding: 10px 28px;
  border-radius: 6px;
  border: none;
}

.contact-btn:hover {
  background-color: #f1f1f1;
}

.feature-title {
  font-size: 20px;
  font-weight: 600;
  margin-bottom: 20px;
}

.feature-item {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 16px;
  font-size: 16px;
}

.feature-icon {
  color: var(--secondary);
  font-size: 20px;
}

.feature-item-tab {
  display: flex;
  gap: 20px;
}

.pricing-table {
  background: #fff;
  border-radius: 10px;
  box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1);
  overflow: hidden;
}
.pricing-header {
  background: #f1f3f5;
  text-align: center;
  padding: 20px;
  font-weight: 600;
  font-size: 1.2rem;
}
.table td,
.table th {
  vertical-align: middle;
}
.table tbody tr:hover {
  background: #f9f9f9;
  transition: 0.3s;
}
.btn-start {
  border-radius: 50px;
  padding: 5px 20px;
}
.accordion-button::after {
  transition: transform 0.3s;
}
.accordion-button.collapsed::after {
  transform: rotate(0deg);
}
.accordion-button:not(.collapsed)::after {
  transform: rotate(180deg);
}


/* ===== Brand Section (Gradient + Heading Line + Grey Logos) ===== */
.brand2-section-area{
  position: relative;
  padding: 80px 0;
  overflow: hidden;
  background: radial-gradient(circle at left top, rgba(37, 99, 235, 0.22), transparent 55%),
              radial-gradient(circle at right bottom, rgba(14, 165, 233, 0.20), transparent 55%),
              #ffffff;
}

/* Heading */
.brand2-header h4{
  font-size: 28px;
  line-height: 1.35;
  font-weight: 700;
  color: #0f172a;
  margin: 0;
}

/* Blue line under heading */
.brand2-header h4::after{
  content: "";
  display: block;
  width: 120px;
  height: 4px;
  margin: 14px auto 0;
  border-radius: 50px;
  background: #2563eb;
}

/* Logos Row */
.brand2-logos{
  display: flex;
  gap: 45px;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
}

/* Logo */
.brand2-logo img{
  max-width: 150px;
  max-height: 45px;
  object-fit: contain;

  opacity: 0.75;
  filter: grayscale(100%);
  transition: all 0.35s ease;
}

/* Hover par normal */
.brand2-logo:hover img{
  opacity: 1;
  filter: grayscale(0%);
}

/* Responsive */
@media (max-width: 991px){
  .brand2-header h4{
    font-size: 22px;
  }
  .brand2-logos{
    gap: 25px;
  }
  .brand2-logo img{
    max-width: 130px;
    max-height: 40px;
  }
}


/* Why choose us CSS */
/* =============== TrueSend Why Choose =============== */
.ts-why{
  position: relative;
  padding: 90px 0 70px;
  overflow: hidden;
  background: #061a3a;
  color: #fff;
}

.ts-why a:hover{
  color: #fff;
}

.ts-why-bg{
  position: absolute;
  inset: 0;
  background:
    radial-gradient(900px 500px at 15% 25%, rgba(62, 171, 255, .30), transparent 60%),
    radial-gradient(900px 500px at 85% 30%, rgba(108, 70, 255, .22), transparent 60%),
    linear-gradient(135deg, #0a4da6 0%, #0a84d6 45%, #0b3b8f 100%);
  opacity: 1;
  z-index: 0;
}

.ts-container{
  width: min(1200px, 92%);
  margin: 0 auto;
  position: relative;
  z-index: 2;
}

.ts-why-head{
  text-align: center;
  max-width: 820px;
  margin: 0 auto 40px;
}

.ts-why .ts-pill{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 14px;
  border-radius: 999px;
  background: rgba(255,255,255,.14);
  border: 1px solid rgba(255,255,255,.20);
  font-size: 14px;
  font-weight: 600;
  letter-spacing: .2px;
}

.ts-why-head h2{
  margin: 14px 0 10px;
  line-height: 1.15;
  letter-spacing: -.4px;
}

.ts-why-head p{
  margin: 0;
  font-size: 16px;
  line-height: 1.7;
  color: rgba(255,255,255,.85);
}

.ts-why-grid{
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
  margin-top: 30px;
}

.ts-why-card{
  text-decoration: none;
  color: inherit;
  border-radius: 18px;
  padding: 22px 18px;
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.18);
  backdrop-filter: blur(10px);
  transition: .25s ease;
  position: relative;
  overflow: hidden;
  min-height: 220px;
}

.ts-why-card::before{
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(500px 180px at 20% 10%, rgba(255,255,255,.20), transparent 55%);
  opacity: 0;
  transition: .25s ease;
}

.ts-why-card:hover{
  transform: translateY(-6px);
  background: rgba(255,255,255,.14);
  border-color: rgba(255,255,255,.28);
}

.ts-why-card:hover::before{
  opacity: 1;
}

.ts-why-icon{
  width: 48px;
  height: 48px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  background: rgba(255,255,255,.16);
  border: 1px solid rgba(255,255,255,.20);
  flex: 0 0 48px;
  margin-bottom: 16px;
}

.ts-why-icon svg{
  width: 26px;
  height: 26px;
  color: #fff;
  opacity: .95;
}

.ts-why-content{
  position: relative;
  z-index: 2;
  flex: 1;
}

.ts-why-content h3{
  margin: 2px 0 8px;
  font-size: 18px;
  font-weight: 800;
  letter-spacing: -.2px;
}

.ts-why-content p{
  margin: 0;
  font-size: 14.5px;
  line-height: 1.65;
  color: rgba(255,255,255,.82);
}

.ts-why-meta{
  margin-top: 14px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 13px;
  font-weight: 700;
  color: rgba(255,255,255,.92);
}

.ts-arrow{
  font-size: 18px;
  opacity: .9;
  transition: .25s ease;
}

.ts-why-card:hover .ts-arrow{
  transform: translateX(4px);
}

/* Stats Row */
.ts-why-stats{
  margin-top: 35px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}

.ts-stat{
  border-radius: 18px;
  padding: 18px 16px;
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.18);
  text-align: center;
}

.ts-stat h4{
  margin: 0;
  font-size: 26px;
  font-weight: 900;
  letter-spacing: -.3px;
}

.ts-stat p{
  margin: 6px 0 0;
  font-size: 14px;
  color: rgba(255,255,255,.82);
}

/* Responsive */
@media (max-width: 1100px){
  .ts-why-grid{
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 600px){
  .ts-why{
    padding: 70px 0 55px;
  }

  .ts-why-grid{
    grid-template-columns: 1fr;
  }

  .ts-why-card{
    min-height: auto;
  }

  .ts-why-stats{
    grid-template-columns: 1fr;
  }
}
/* Why Choose Us CSS */

/* Our creative Blogs */
.ts-blogs{
  padding: 90px 0;
  position: relative;
  overflow: hidden;
  background:
  radial-gradient(circle at 20% 10%, rgba(255, 255, 255, 0.92), transparent 65%),
  radial-gradient(circle at 85% 25%, rgba(255, 255, 255, 0.82), transparent 70%),
  linear-gradient(135deg,
    #a8d4ff 0%,
    #c2f3ff 30%,
    #e9e3ff 60%,
    #ffe0f2 100%
  );


}

.ts-blogs::before{
  content:"";
  position:absolute;
  inset:0;
  background-image: url("assets/images/background/noise.png");
  opacity: .08;
  pointer-events:none;
}

.ts-blogs__container{
  width: min(1200px, 92%);
  margin: 0 auto;
  position: relative;
  z-index: 2;
}

/* heading */
.ts-blogs__heading{
  text-align: center;
  margin-bottom: 35px;
  color: #ffffff;
}

.ts-blogs__tag{
  display: inline-flex;
  padding: 5px 16px;
  border-radius: 999px;
  font-weight: 600;
  font-size: 14px;
  background: rgba(255,255,255,0.16);
  border: 1px solid rgba(255,255,255,0.18);
  color: #ffffff;
}

.ts-blogs__heading h2{
  line-height: 1.15;
  font-weight: 800;
  margin-bottom: 12px;
  color: var(--text);
}

.ts-blogs__heading p{
  max-width: 720px;
  margin: 0 auto;
  color: var(--text);
}

/* grid layout */
.ts-blogs__grid{
  display: grid;
  grid-template-columns: 1.2fr 0.9fr 0.9fr;
  gap: 22px;
  align-items: stretch;
}

/* right stack */
.ts-blogs__stack{
  display: grid;
  gap: 22px;
}

/* card base */
.ts-blog-card{
  background: rgba(255,255,255,0.96);
  border-radius: 22px;
  overflow: hidden;
  box-shadow: 0 18px 55px rgba(0,0,0,0.22);
  border: 1px solid rgba(255,255,255,0.25);
  transition: transform .25s ease, box-shadow .25s ease;
}

.ts-blog-card:hover{
  transform: translateY(-6px);
  box-shadow: 0 22px 65px rgba(0,0,0,0.28);
}

.ts-blog-card__img{
  display: block;
  position: relative;
  overflow: hidden;
  border-radius: 22px;
  margin: 14px 14px 0 14px;
}

.ts-blog-card__img img{
  width: 100%;
  height: 240px;
  object-fit: cover;
  display: block;
  border-radius: 18px;
  transition: transform .35s ease;
}

.ts-blog-card:hover .ts-blog-card__img img{
  transform: scale(1.05);
}

.ts-blog-card__badge{
  position: absolute;
  right: 12px;
  bottom: 12px;
  font-size: 12px;
  font-weight: 700;
  padding: 7px 12px;
  border-radius: 999px;
  background: rgba(255,255,255,0.90);
  color: #0a2b55;
  border: 1px solid rgba(0,0,0,0.08);
}

/* content */
.ts-blog-card__content{
  padding: 16px 18px 18px 18px;
}

.ts-blog-card__content h3{
  font-size: 18px;
  line-height: 1.35;
  font-weight: 800;
  margin: 0 0 10px 0;
}

.ts-blog-card__content h3 a{
  color: #0b1b2b;
  text-decoration: none;
}

.ts-blog-card__meta{
  display: flex;
  flex-wrap: wrap;
  gap: 10px 14px;
  color: #667085;
  font-size: 13px;
  align-items: center;
}

.ts-blog-card__meta span{
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.ts-blog-card__meta i{
  font-size: 16px;
}

/* featured */
.ts-blog-card--featured{
  grid-column: 1 / 3;
  grid-row: 1 / 2;
}

.ts-blog-card--featured .ts-blog-card__img img{
  height: 330px;
}

.ts-blog-card--featured .ts-blog-card__content h3{
  font-size: 20px;
}

.ts-blog-card__link{
  margin-top: 12px;
  display: inline-flex;
  gap: 8px;
  align-items: center;
  font-weight: 800;
  text-decoration: none;
  color: #0b4db8;
}

/* small stacked */
.ts-blog-card--small .ts-blog-card__img img{
  height: 300px;
}

/* bottom cards placement */
.ts-blogs__grid > .ts-blog-card:nth-last-child(3){
  grid-column: 1 / 2;
}
.ts-blogs__grid > .ts-blog-card:nth-last-child(2){
  grid-column: 2 / 3;
}
.ts-blogs__grid > .ts-blog-card:nth-last-child(1){
  grid-column: 3 / 4;
}

/* view all */
.ts-blogs__btn{
  margin-top: 28px;
  text-align: center;
}


/* responsive */
@media (max-width: 1100px){
  .ts-blogs__grid{
    grid-template-columns: 1fr 1fr;
  }

  .ts-blog-card--featured{
    grid-column: 1 / 3;
  }

  .ts-blogs__stack{
    grid-column: 1 / 3;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto;
  }

  .ts-blogs__grid > .ts-blog-card:nth-last-child(3),
  .ts-blogs__grid > .ts-blog-card:nth-last-child(2),
  .ts-blogs__grid > .ts-blog-card:nth-last-child(1){
    grid-column: auto;
  }
}

@media (max-width: 768px){
  .ts-blogs{
    padding: 65px 0;
  }

  .ts-blogs__grid{
    grid-template-columns: 1fr;
  }

  .ts-blog-card--featured{
    grid-column: auto;
  }

  .ts-blogs__stack{
    grid-column: auto;
    grid-template-columns: 1fr;
  }

  .ts-blog-card__img img{
    height: 210px;
  }

  .ts-blog-card--featured .ts-blog-card__img img{
    height: 240px;
  }
}

/* Our creative Blogs */

/* Bulk Mailing Section  */
.Bulk-Mailing{
  padding: 90px 0;
  background: #ffffff;
}

.Bulk-Mailing .ts-why-container{
  width: min(1200px, 92%);
  margin: 0 auto;
}

.Bulk-Mailing .ts-why-head{
  margin-bottom: 55px;
}

.Bulk-Mailing .ts-why-head h2{
  line-height: 1.15;
  color: #0b1b3a;
  margin: 0 0 12px;
}

.Bulk-Mailing .ts-why-head p{
  font-size: 16px;
  line-height: 1.7;
  color: #5a6b87;
  margin: 0 auto;
  max-width: 720px;
}

/* GRID */
.Bulk-Mailing .ts-why-grid{
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 45px 70px;
}

/* ITEM */
.Bulk-Mailing .ts-why-item{
  display: flex;
  gap: 18px;
  align-items: flex-start;
}

.Bulk-Mailing .ts-why-icon{
  width: 56px;
  height: 56px;
  min-width: 56px;
  border-radius: 16px;
  display: grid;
  place-items: center;

  background: linear-gradient(135deg, rgba(0,145,255,0.16), rgba(123,75,255,0.14));
  border: 1px solid rgba(10,165,255,0.18);
  box-shadow: 0 12px 30px rgba(0,0,0,0.06);
}

.Bulk-Mailing .ts-why-icon i{
  font-size: 26px;
  color: #0b4db8;
}

/* CONTENT */
.Bulk-Mailing .ts-why-content h4{
  font-size: 20px;
  font-weight: 800;
  margin: 0 0 8px;
  color: #0b1b3a;
}

.Bulk-Mailing .ts-why-content p{
  margin: 0;
  font-size: 15px;
  line-height: 1.75;
  color: #5a6b87;
}

/* Responsive */
@media (max-width: 991px){
  .Bulk-Mailing .ts-why-grid{
    grid-template-columns: 1fr;
    gap: 28px;
  }
}

@media (max-width: 520px){
  .Bulk-Mailing .ts-why-item{
    gap: 14px;
  }

  .Bulk-Mailing .ts-why-icon{
    width: 52px;
    height: 52px;
    min-width: 52px;
    border-radius: 14px;
  }

  .Bulk-Mailing .ts-why-content h4{
    font-size: 18px;
  }
}

/* Bulk Mailing Section  */


/* Footer Section CSS */
.tsBigFooter{
  background: #fbfbf8;
  border-top: 1px solid rgba(0,0,0,0.06);
  padding: 70px 0 25px;
}

.tsBigFooter__wrap{
  width: min(1400px, 94%);
  margin: 0 auto;
}

/* BIG GRID */
.tsBigFooter__grid{
  display: grid;
  grid-template-columns: 1.1fr 1fr 1fr 1fr 1fr 1.1fr;
  gap: 55px;
  padding-bottom: 55px;
}

/* BRAND */
.tsBigFooter__logo{
  width: 150px;
  height: auto;
  display: block;
}

.tsBigFooter__brandText{
  margin: 18px 0 18px;
  font-size: 15px;
  line-height: 1.7;
  color: #5b6575;
  max-width: 270px;
}

.tsBigFooter__social{
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.tsBigFooter__social a{
  width: 38px;
  height: 38px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  border: 1px solid rgba(0,0,0,0.12);
  background: #fff;
  color: #0b1b3a;
  text-decoration: none;
  transition: 0.25s;
}

.tsBigFooter__social a:hover{
  transform: translateY(-2px);
}

/* TITLES */
.tsBigFooter__title{
  font-size: 16px;
  font-weight: 900;
  color: #0b1b3a;
  margin: 0 0 14px;
}

.tsBigFooter__mt{ margin-top: 26px; }
.tsBigFooter__mt2{ margin-top: 28px; }

/* LINKS */
.tsBigFooter__list{
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 6px;
}

.tsBigFooter__list a{
  font-size: 14.5px;
  color: #5b6575;
  text-decoration: none;
  transition: 0.2s;
  line-height: 1.4;
}

.tsBigFooter__list a:hover{
  color: #0b4db8;
}

.tsBigFooter__green{
  color: #16a34a !important;
  font-weight: 800;
}

.tsBigFooter__add{
  color: #16a34a !important;
  font-weight: 800;
}

/* CONTACT */
.tsBigFooter__small{
  margin: 0 0 6px;
  font-size: 13px;
  color: #6a7485;
  font-weight: 700;
  text-transform: lowercase;
}

.tsBigFooter__email{
  font-size: 14.5px;
  color: #5b6575;
  text-decoration: none;
  transition: 0.2s;
  line-height: 1.4;
}

.tsBigFooter__email:hover{
  color: #0b4db8;
}

.tsBigFooter__icons{
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin: 16px 0 22px;
}

.tsBigFooter__icons a{
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  border: 1px solid rgba(0,0,0,0.12);
  background: #fff;
  color: #0b1b3a;
  text-decoration: none;
  transition: 0.25s;
}

.tsBigFooter__icons a:hover{
  transform: translateY(-2px);
}

/* BADGES */
.tsBigFooter__badges{
  display: grid;
  gap: 12px;
  margin-top: 5px;
}

.tsBigFooter__badge{
  border: 1px solid rgba(0,0,0,0.10);
  background: #fff;
  border-radius: 14px;
  padding: 12px 14px;
  font-size: 13px;
  font-weight: 900;
  color: #0b1b3a;
  line-height: 1.2;
}
.tsBigFooter__badge i {
  font-size: 2rem;
  color: #ccc;
}

.tsBigFooter__badge span{
  display: inline-block;
  margin-top: 4px;
  font-size: 11px;
  font-weight: 700;
  color: #6a7485;
}

/* BOTTOM BAR */
.tsBigFooter__bottom{
  border-top: 1px solid rgba(0,0,0,0.08);
  padding-top: 18px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}

.tsBigFooter__bottom p{
  margin: 0;
  font-size: 14px;
  color: #5b6575;
}

.tsBigFooter__bottomRight{
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
}

.tsBigFooter__bottomRight a{
  font-size: 14px;
  color: #5b6575;
  text-decoration: none;
  font-weight: 700;
}

.tsBigFooter__bottomRight a:hover{
  color: #0b4db8;
}


/* RESPONSIVE */
@media (max-width: 1200px){
  .tsBigFooter__grid{
    grid-template-columns: 1.2fr 1fr 1fr;
    gap: 40px;
  }
}

@media (max-width: 768px){
  .tsBigFooter{
    padding: 55px 0 20px;
  }

  .tsBigFooter__grid{
    grid-template-columns: 1fr;
    gap: 28px;
    padding-bottom: 35px;
  }

  .tsBigFooter__brandText{
    max-width: 100%;
  }

  .tsBigFooter__badges{
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 460px){
  .tsBigFooter__badges{
    grid-template-columns: 1fr;
  }
}


/* Footer Section CSS */
/* =========================================
   TrueSend GDPR Complaint (V2 - No Overlap)
========================================= */

.ts-complaint-v2{
  position: relative;
  padding: 90px 0;
  overflow: hidden;

  background: radial-gradient(circle at 20% 15%, rgba(10,165,255,0.10), transparent 30%),
              radial-gradient(circle at 85% 40%, rgba(123,75,255,0.10), transparent 40%),
              linear-gradient(180deg, #ffffff 0%, #f7fbff 100%);
}



/* soft background blobs */
.ts-complaint-v2::before,
.ts-complaint-v2::after{
  content: "";
  position: absolute;
  width: 420px;
  height: 420px;
  border-radius: 50%;
  filter: blur(60px);
  opacity: 0.55;
  z-index: 0;
}

.ts-complaint-v2::before{
  background: rgba(10,165,255,0.18);
  top: -160px;
  left: -160px;
}

.ts-complaint-v2::after{
  background: rgba(123,75,255,0.16);
  bottom: -200px;
  right: -160px;
}

.ts-complaint-v2 .container,
.ts-complaint-v2 .row{
  position: relative;
  z-index: 2;
}

/* LEFT CONTENT */
.ts-complaint-v2 .complaint-header.heading4 span{
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-weight: 800;
  font-size: 14px;
  letter-spacing: 0.2px;
  color: #0b4db8;
  background: rgba(11,77,184,0.10);
  padding: 9px 14px;
  border-radius: 999px;
  margin-bottom: 14px;
}

.ts-complaint-v2 .complaint-header.heading4 span::before{
  content: "";
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #0aa5ff;
  box-shadow: 0 0 0 4px rgba(10,165,255,0.18);
}


/* LIST UI */
.ts-complaint-v2 .complaint-list{
  margin-top: 24px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px 22px;
  max-width: 520px;
}

.ts-complaint-v2 .complaint-list ul{
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 12px;
}

.ts-complaint-v2 .complaint-list ul li a{
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 15px;
  font-weight: 800;
  color: #0b1b3a;
  text-decoration: none;

  background: #fff;
  border: 1px solid rgba(0,0,0,0.08);
  padding: 12px 14px;
  border-radius: 14px;

  box-shadow: 0 10px 22px rgba(11, 27, 58, 0.05);
  transition: 0.25s;
}

.ts-complaint-v2 .complaint-list ul li a img{
  width: 20px;
  height: 20px;
  flex: 0 0 auto;
}

.ts-complaint-v2 .complaint-list ul li a:hover{
  transform: translateY(-2px);
  border-color: rgba(11,77,184,0.22);
  box-shadow: 0 16px 30px rgba(11, 77, 184, 0.10);
}


/* RIGHT SIDE */
.ts-complaint-v2 .contact-mail{
  position: relative;
  padding-left: 10px;
}

/* CONTACT BOX */
.ts-complaint-v2 .main-contact-box{
  background: rgba(255,255,255,0.86);
  border: 1px solid rgba(0,0,0,0.08);
  border-radius: 22px;
  padding: 22px 18px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;

  box-shadow: 0 18px 35px rgba(11, 27, 58, 0.07);
  backdrop-filter: blur(10px);
  transition: 0.25s;
}

.ts-complaint-v2 .main-contact-box:hover{
  transform: translateY(-4px);
  box-shadow: 0 25px 50px rgba(11, 27, 58, 0.12);
}

.ts-complaint-v2 .main-contact-box.box2{
  background: rgba(255,255,255,0.92);
}

/* CONTENT */
.ts-complaint-v2 .main-contact-content{
  display: flex;
  align-items: center;
  gap: 14px;
}

.ts-complaint-v2 .main-contact-content .mail-icon{
  width: 52px;
  height: 52px;
  border-radius: 16px;
  display: grid;
  place-items: center;

  background: linear-gradient(135deg, rgba(10,165,255,0.16), rgba(123,75,255,0.14));
  border: 1px solid rgba(0,0,0,0.06);
}

.ts-complaint-v2 .main-contact-content .mail-icon img{
  width: 26px;
  height: 26px;
}

.ts-complaint-v2 .main-contact-content .mail-content h3{
  margin: 0 0 6px;
  font-size: 18px;
  font-weight: 900;
  color: #071a3a;
}

.ts-complaint-v2 .main-contact-content .mail-content p{
  margin: 0;
  font-size: 14px;
  line-height: 1.5;
  color: #5b6575;
}

/* IMAGE SIDE */
.ts-complaint-v2 .main-contact-img{
  position: relative;
  width: 92px;
  min-width: 92px;
  height: 92px;
  border-radius: 20px;
  display: grid;
  place-items: center;

  background: linear-gradient(135deg, rgba(11,77,184,0.08), rgba(10,165,255,0.10));
  border: 1px solid rgba(0,0,0,0.06);
}

.ts-complaint-v2 .main-contact-img img.angle-border{
  width: 64px;
  height: auto;
  opacity: 0.9;
}

/* floating icon */
.ts-complaint-v2 .instagram-icon{
  position: absolute;
  bottom: -10px;
  right: -10px;
  width: 44px;
  height: 44px;
  border-radius: 14px;
  background: #fff;
  display: grid;
  place-items: center;
  border: 1px solid rgba(0,0,0,0.10);
  box-shadow: 0 18px 30px rgba(11, 27, 58, 0.10);
}

.ts-complaint-v2 .instagram-icon img{
  width: 22px;
  height: 22px;
}

/* spacing fix */
.ts-complaint-v2 .space50{
  height: 22px !important;
}


/* RIGHT SIDE FIX - NO OVERLAP */
.ts-complaint-v2 .ts-complaint-right{
  position: relative;
  width: 100%;
  min-height: 420px;

  display: flex;
  flex-direction: column;
  gap: 26px;

  align-items: flex-end;
}

/* cards width */
.ts-complaint-v2 .ts-card{
  width: 100%;
  max-width: 520px;
}

/* Zig-zag layout */
.ts-complaint-v2 .ts-card-1{
  margin-right: 0px;
}

.ts-complaint-v2 .ts-card-2{
  margin-right: 120px;
}

/* Responsive */
@media (max-width: 991px){
  .ts-complaint-v2 .ts-complaint-right{
    align-items: stretch;
    min-height: auto;
  }

  .ts-complaint-v2 .ts-card{
    max-width: 100%;
  }

  .ts-complaint-v2 .ts-card-2{
    margin-right: 0;
  }
}

/* RESPONSIVE */
@media (max-width: 991px){
  .ts-complaint-v2{
    padding: 70px 0;
  }

  .ts-complaint-v2 .complaint-header.heading4 h2{
    font-size: 34px;
  }

  .ts-complaint-v2 .complaint-list{
    grid-template-columns: 1fr;
    gap: 12px;
    max-width: 100%;
  }

  .ts-complaint-v2 .contact-mail{
    margin-top: 30px;
    padding-left: 0;
  }

  .ts-complaint-v2 .main-contact-box{
    border-radius: 18px;
  }
}

@media (max-width: 576px){
  .ts-complaint-v2 .complaint-header.heading4 h2{
    font-size: 28px;
  }

  .ts-complaint-v2 .main-contact-content .mail-icon{
    width: 46px;
    height: 46px;
    border-radius: 14px;
  }

  .ts-complaint-v2 .main-contact-content .mail-icon img{
    width: 22px;
    height: 22px;
  }

  .ts-complaint-v2 .main-contact-box{
    padding: 18px 14px;
  }
}

/* Show case Slide CSS */
/* ================================
   CREATIVE TABS SLIDER UI (NEW)
   ================================ */

.ts-tabs-slider-ui .tab-carousel-section .tabs-carousel-img{
  position: relative;
  overflow: hidden;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 18px 40px rgba(0,0,0,0.10);
  transition: transform 0.35s ease, box-shadow 0.35s ease;
}

.ts-tabs-slider-ui .tab-carousel-section .tabs-carousel-img img{
  width: 100%;
  height: 420px;
  object-fit: cover;
  display: block;
  border-radius: 18px;
  transition: transform 0.5s ease;
}

/* Hover: premium lift */
.ts-tabs-slider-ui .tab-carousel-section .tabs-carousel-img:hover{
  transform: translateY(-6px);
  box-shadow: 0 28px 55px rgba(0,0,0,0.16);
}

.ts-tabs-slider-ui .tab-carousel-section .tabs-carousel-img:hover img{
  transform: scale(1.06);
}

/* Old overlay remove (blue layer type) */
.ts-tabs-slider-ui .tabs-carousel-img::after{
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    180deg,
    rgba(0,0,0,0.00) 40%,
    rgba(0,0,0,0.20) 75%,
    rgba(0,0,0,0.35) 100%
  );
  opacity: 0;
  transition: opacity 0.35s ease;
  pointer-events: none;
}

.ts-tabs-slider-ui .tabs-carousel-img:hover::after{
  opacity: 1;
}

/* Button position change */
.ts-tabs-slider-ui .tabs-morebtn{
  position: absolute;
  bottom: 16px;
  right: 16px;
  z-index: 5;

  opacity: 0;
  transform: translateY(12px);
  transition: 0.35s ease;
}

.ts-tabs-slider-ui .tabs-carousel-img:hover .tabs-morebtn{
  opacity: 1;
  transform: translateY(0);
}

/* Button style (keep header-btn2 class but override safely) */
.ts-tabs-slider-ui .tabs-morebtn .header-btn2{
  padding: 12px 18px !important;
  border-radius: 999px !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  letter-spacing: 0.2px;
  display: inline-flex;
  align-items: center;
  gap: 8px;

  background: rgba(255,255,255,0.92) !important;
  color: #0b1b33 !important;
  border: 1px solid rgba(255,255,255,0.8) !important;

  box-shadow: 0 14px 30px rgba(0,0,0,0.18);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  transition: 0.25s ease;
}

/* hover on button */
.ts-tabs-slider-ui .tabs-morebtn .header-btn2:hover{
  transform: translateY(-2px);
  background: #ffffff !important;
}

/* Owl spacing fix */
.ts-tabs-slider-ui .owl-carousel .owl-stage{
  display: flex;
  align-items: stretch;
}

.ts-tabs-slider-ui .owl-carousel .owl-item{
  display: flex;
}

.ts-tabs-slider-ui .owl-carousel .owl-item .tabs-carousel-img{
  width: 100%;
}

/* Responsive height */
@media (max-width: 1200px){
  .ts-tabs-slider-ui .tab-carousel-section .tabs-carousel-img img{
    height: 390px;
  }
}

@media (max-width: 991px){
  .ts-tabs-slider-ui .tab-carousel-section .tabs-carousel-img img{
    height: 360px;
  }
}

@media (max-width: 767px){
    section {
        padding: 40px 20px;
    }
  .ts-tabs-slider-ui .tab-carousel-section .tabs-carousel-img img{
    height: 320px;
  }

  .ts-tabs-slider-ui .tabs-morebtn{
    bottom: 12px;
    right: 12px;
  }

  .ts-tabs-slider-ui .tabs-morebtn .header-btn2{
    padding: 11px 16px !important;
    font-size: 13px !important;
  }
}

/* Mobile touch: show button always */
@media (max-width: 575px){
  .ts-tabs-slider-ui .tabs-morebtn{
    opacity: 1;
    transform: translateY(0);
  }

  .ts-tabs-slider-ui .tabs-carousel-img::after{
    opacity: 1;
  }
}
/* Show Case slide CSS */




/* =======================-==================About uS CSS======================================= */

/* ================================
   ABOUT HERO BANNER
================================ */
.about-hero-banner {
  position: relative;
  width: 100%;
  min-height: 320px;
  padding: 170px 0 90px;
  overflow: hidden;
  border-radius: 0px;
}

/* Background Image */
.about-hero-banner .about-hero-bg {
  position: absolute;
  inset: 0;
  z-index: 1;
}

.about-hero-banner .about-hero-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: scale(1.06);
}

/* Overlay */
.about-hero-banner .about-hero-overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(
    90deg,
    rgba(6, 18, 45, 0.78) 0%,
    rgba(6, 18, 45, 0.45) 45%,
    rgba(6, 18, 45, 0.15) 100%
  );
}

/* Content */
.about-hero-banner .about-hero-content {
  position: relative;
  z-index: 5;
  max-width: 720px;
}

.about-hero-banner .about-hero-content h1 {
  font-size: 56px;
  line-height: 1.1;
  font-weight: 800;
  color: #ffffff;
  margin-bottom: 18px;
}

.about-hero-banner .about-hero-content p {
  font-size: 18px;
  line-height: 1.8;
  color: rgba(255, 255, 255, 0.85);
  margin-bottom: 22px;
  max-width: 620px;
}


/* Floating Shapes */
.about-hero-banner .about-hero-shape {
  position: absolute;
  z-index: 3;
  border-radius: 20px;
  opacity: 0.35;
  filter: blur(0px);
  animation: aboutFloat 7s ease-in-out infinite;
}

/* Shape 1 */
.about-hero-banner .shape1 {
  width: 120px;
  height: 120px;
  top: 20%;
  right: 18%;
  background: radial-gradient(circle at top left, #6be4ff, transparent 60%),
              radial-gradient(circle at bottom right, #a46bff, transparent 60%);
}

/* Shape 2 */
.about-hero-banner .shape2 {
  width: 90px;
  height: 90px;
  top: 55%;
  right: 8%;
  background: radial-gradient(circle at top left, #ff7ac6, transparent 60%),
              radial-gradient(circle at bottom right, #7bffb2, transparent 60%);
  animation-delay: 1.2s;
}

/* Shape 3 */
.about-hero-banner .shape3 {
  width: 160px;
  height: 160px;
  top: 15%;
  right: 2%;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 255, 255, 0.35), transparent 60%);
  animation-delay: 2.2s;
}

@keyframes aboutFloat {
  0%, 100% {
    transform: translateY(0px) rotate(0deg);
  }
  50% {
    transform: translateY(-18px) rotate(8deg);
  }
}

/* Responsive */
@media (max-width: 991px) {
  .about-hero-banner {
    padding: 90px 0 70px;
  }

  .about-hero-banner .about-hero-content h1 {
    font-size: 46px;
  }

  .about-hero-banner .about-hero-content p {
    font-size: 16px;
  }

  .about-hero-banner .shape1,
  .about-hero-banner .shape2,
  .about-hero-banner .shape3 {
    display: none;
  }
}

@media (max-width: 576px) {
  .about-hero-banner {
    padding: 75px 0 60px;
  }

  .about-hero-banner .about-hero-content h1 {
    font-size: 36px;
  }

  .about-hero-banner .about-hero-content p {
    font-size: 15px;
    line-height: 1.7;
  }
}


.ts-about-page .ts-about-page{
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color: #0b1220;
  background: #fff;
  overflow: hidden;
}
.ts-about-page .ts-about-page .container{
  width: min(1200px, 92%);
  margin: 0 auto;
}
.ts-about-page .ts-about-hero{
  padding: 90px 0 60px;
  background:
    radial-gradient(circle at 15% 20%, rgba(92, 155, 255, 0.18), transparent 55%),
    radial-gradient(circle at 85% 30%, rgba(255, 122, 196, 0.14), transparent 55%),
    linear-gradient(180deg, #f8fbff 0%, #ffffff 70%);
}
.ts-about-page .ts-hero-grid{
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 50px;
  align-items: center;
}
.ts-about-page .ts-badge{
  display: inline-flex;
  gap: 10px;
  align-items: center;
  padding: 10px 14px;
  border-radius: 999px;
  background: rgba(11, 77, 184, 0.08);
  border: 1px solid rgba(11, 77, 184, 0.10);
  color: #0b4db8;
  font-weight: 600;
  font-size: 14px;
}
.ts-about-page .ts-badge i{
  font-size: 18px;
}
.ts-about-page .ts-hero-left h1{
  margin: 16px 0 14px;
  font-size: 42px;
  line-height: 1.3;
  letter-spacing: -0.02em;
}
.ts-about-page .ts-hero-left h1 span{
  background: linear-gradient(90deg, #0b4db8 0%, #0aa5ff 45%, #7b4bff 75%, #ff2ea6 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.ts-about-page .ts-hero-left p{
  margin: 0;
  font-size: 16px;
  line-height: 1.8;
  color: rgba(11,18,32,0.72);
  max-width: 560px;
}
.ts-about-page .ts-hero-stats{
  margin-top: 28px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}
.ts-about-page .ts-stat{
  background: rgba(255,255,255,0.75);
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 18px;
  padding: 16px 16px;
  backdrop-filter: blur(10px);
}
.ts-about-page .ts-stat h3{
  margin: 0;
  font-size: 26px;
  letter-spacing: -0.02em;
}
.ts-about-page .ts-stat p{
  margin: 6px 0 0;
  font-size: 13px;
  color: rgba(11,18,32,0.60);
}
.ts-about-page .ts-hero-right{
  position: relative;
  min-height: 440px;
}
.ts-about-page .ts-hero-card{
  width: 100%;
  border-radius: 26px;
  overflow: hidden;
  background: #fff;
  border: 1px solid rgba(15, 23, 42, 0.08);
  box-shadow: 0 30px 80px rgba(2, 8, 23, 0.10);
}
.ts-about-page .ts-hero-card img{
  width: 100%;
  height: 440px;
  object-fit: cover;
  display: block;
}
.ts-about-page .ts-floating{
  position: absolute;
  display: flex;
  gap: 12px;
  align-items: center;
  padding: 14px 14px;
  border-radius: 18px;
  background: rgba(255,255,255,0.85);
  border: 1px solid rgba(15, 23, 42, 0.10);
  box-shadow: 0 18px 40px rgba(2, 8, 23, 0.10);
  backdrop-filter: blur(12px);
}
.ts-about-page .ts-floating i{
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  background: rgba(11, 77, 184, 0.10);
  color: #0b4db8;
  font-size: 20px;
}
.ts-about-page .ts-floating b{
  display: block;
  font-size: 14px;
}
.ts-about-page .ts-floating span{
  display: block;
  font-size: 13px;
  color: rgba(11,18,32,0.60);
  margin-top: 2px;
}
.ts-about-page .ts-f1{
  left: -16px;
  top: 20px;
}
.ts-about-page .ts-f2{
  right: -16px;
  bottom: 30px;
}
.ts-about-page .ts-trust-strip{
  padding: 22px 0;
  background: #ffffff;
  border-top: 1px solid rgba(15, 23, 42, 0.06);
  border-bottom: 1px solid rgba(15, 23, 42, 0.06);
}
.ts-about-page .ts-trust-grid{
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}
.ts-about-page .ts-trust-item{
  display: flex;
  gap: 10px;
  align-items: center;
  padding: 14px 14px;
  border-radius: 18px;
  background: rgba(248, 250, 252, 0.80);
  border: 1px solid rgba(15, 23, 42, 0.06);
}
.ts-about-page .ts-trust-item i{
  font-size: 18px;
  color: #0b4db8;
}
.ts-about-page .ts-trust-item p{
  margin: 0;
  font-size: 14px;
  color: rgba(11,18,32,0.72);
  font-weight: 600;
}
.ts-about-page .ts-section{
  padding: 80px 0;
}
.ts-about-page .ts-section-head{
  max-width: 820px;
  margin: 0 auto 40px;
  text-align: center;
}
.ts-about-page .ts-subtitle{
  display: inline-block;
  font-size: 14px;
  font-weight: 700;
  color: #0b4db8;
  padding: 6px 14px;
  border-radius: 999px;
  background: rgba(11, 77, 184, 0.07);
  border: 1px solid rgba(11, 77, 184, 0.10);
  margin-bottom: 14px;
}
.ts-about-page .ts-section-head h2{
  margin: 0 0 12px;
  letter-spacing: -0.02em;
  line-height: 1.3;
}
.ts-about-page .ts-section-head p{
  margin: 0;
  color: rgba(11,18,32,0.70);
  line-height: 1.8;
  font-size: 15px;
}
.ts-about-page .ts-story-grid{
  margin-top: 34px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
}
.ts-about-page .ts-story-card{
  padding: 22px 20px;
  border-radius: 22px;
  background: #fff;
  border: 1px solid rgba(15, 23, 42, 0.08);
  box-shadow: 0 18px 40px rgba(2, 8, 23, 0.06);
}
.ts-about-page .ts-story-card i{
  width: 52px;
  height: 52px;
  border-radius: 18px;
  display: grid;
  place-items: center;
  background: rgba(10, 165, 255, 0.10);
  color: #0aa5ff;
  font-size: 22px;
}
.ts-about-page .ts-story-card h3{
  margin: 14px 0 10px;
  font-size: 18px;
}
.ts-about-page .ts-story-card p{
  margin: 0;
  line-height: 1.8;
  color: rgba(11,18,32,0.70);
  font-size: 14px;
}
.ts-about-page .ts-different{
  background:
    radial-gradient(circle at 10% 20%, rgba(10, 165, 255, 0.12), transparent 55%),
    radial-gradient(circle at 90% 60%, rgba(123, 75, 255, 0.10), transparent 55%),
    linear-gradient(180deg, #ffffff 0%, #f7fbff 100%);
}
.ts-about-page .ts-diff-grid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  align-items: center;
}
.ts-about-page .ts-diff-left h2{
  margin: 0 0 12px;
  
  line-height: 1.3;
  letter-spacing: -0.02em;
}
.ts-about-page .ts-diff-left p{
  margin: 0 0 20px;
  color: rgba(11,18,32,0.70);
  line-height: 1.8;
}
.ts-about-page .ts-list{
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 12px;
}
.ts-about-page .ts-list li{
  display: flex;
  gap: 10px;
  align-items: flex-start;
  padding: 14px 14px;
  border-radius: 18px;
  background: rgba(255,255,255,0.85);
  border: 1px solid rgba(15, 23, 42, 0.08);
}
.ts-about-page .ts-list li i{
  margin-top: 2px;
  color: #16a34a;
  font-size: 18px;
}
.ts-about-page .ts-diff-right{
  position: relative;
}
.ts-about-page .ts-diff-img{
  border-radius: 26px;
  overflow: hidden;
  border: 1px solid rgba(15, 23, 42, 0.08);
  box-shadow: 0 30px 80px rgba(2, 8, 23, 0.10);
  background: #fff;
}
.ts-about-page .ts-diff-img img{
  width: 100%;
  height: 360px;
  object-fit: cover;
  display: block;
}
.ts-about-page .ts-mini-cards{
  margin-top: 16px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}
.ts-about-page .ts-mini{
  align-items: center;
  padding: 14px 14px;
  border-radius: 20px;
  background: rgba(255,255,255,0.85);
  border: 1px solid rgba(15, 23, 42, 0.08);
  backdrop-filter: blur(10px);
}
.ts-about-page .ts-mini i{
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 16px;
  background: rgba(123, 75, 255, 0.10);
  color: #7b4bff;
  font-size: 20px;
  margin-bottom: 10px
  ;
}
.ts-about-page .ts-mini b{
  display: block;
  font-size: 14px;
}
.ts-about-page .ts-mini span{
  display: block;
  font-size: 13px;
  color: rgba(11,18,32,0.60);
  margin-top: 2px;
  line-height: 1.2;
}
.ts-about-page .ts-time-grid{
  margin-top: 30px;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}
.ts-about-page .ts-time-item{
  position: relative;
  padding: 20px 18px;
  border-radius: 22px;
  background: #fff;
  border: 1px solid rgba(15, 23, 42, 0.08);
  box-shadow: 0 18px 40px rgba(2, 8, 23, 0.05);
}
.ts-about-page .ts-time-dot{
  width: 12px;
  height: 12px;
  border-radius: 999px;
  display: inline-block;
  background: #0aa5ff;
  margin-bottom: 12px;
  box-shadow: 0 0 0 5px rgba(10, 165, 255, 0.14);
}
.ts-about-page .ts-time-item h3{
  margin: 0 0 8px;
  font-size: 16px;
}
.ts-about-page .ts-time-item p{
  margin: 0;
  font-size: 14px;
  line-height: 1.8;
  color: rgba(11,18,32,0.70);
}
.ts-about-page .ts-founder{
  background: linear-gradient(180deg, #ffffff 0%, #a0c9ff 100%);
}
.ts-about-page .ts-founder-grid{
  display: grid;
  grid-template-columns: 0.9fr 1.1fr;
  gap: 40px;
  align-items: center;
}
.ts-about-page .ts-founder-img{
  border-radius: 26px;
  overflow: hidden;
  border: 1px solid rgba(15, 23, 42, 0.08);
  box-shadow: 0 30px 80px rgba(2, 8, 23, 0.10);
  background: #fff;
}
.ts-about-page .ts-founder-img img{
  width: 100%;
  height: 420px;
  object-fit: cover;
  display: block;
}
.ts-about-page .ts-founder-content h2{
  margin: 0 0 12px;
  font-size: clamp(24px, 2.8vw, 38px);
  letter-spacing: -0.02em;
  line-height: 1.15;
}
.ts-about-page .ts-founder-content p{
  margin: 0 0 20px;
  color: rgba(11,18,32,0.70);
  line-height: 1.9;
  font-size: 15px;
}
.ts-about-page .ts-founder-meta{
  display: flex;
  gap: 18px;
  align-items: center;
  justify-content: space-between;
  padding: 16px 18px;
  border-radius: 22px;
  background: rgba(255,255,255,0.85);
  border: 1px solid rgba(15, 23, 42, 0.08);
}
.ts-about-page .ts-founder-name b{
  display: block;
  font-size: 15px;
}
.ts-about-page .ts-founder-name span{
  display: block;
  font-size: 13px;
  margin-top: 4px;
  color: rgba(11,18,32,0.60);
}
.ts-about-page .ts-founder-sign{
  display: flex;
  gap: 10px;
  align-items: center;
  color: #0b4db8;
  font-weight: 700;
  font-size: 13px;
}
.ts-about-page .ts-founder-sign i{
  font-size: 18px;
}

.ts-about-page .ts-team-grid{
  margin-top: 34px;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}
.ts-about-page .ts-member{
  border-radius: 24px;
  overflow: hidden;
  background: #fff;
  border: 1px solid rgba(15, 23, 42, 0.08);
  box-shadow: 0 18px 40px rgba(2, 8, 23, 0.06);
  transition: 0.25s ease;
}
.ts-about-page .ts-member:hover{
  transform: translateY(-6px);
}
.ts-about-page .ts-member-img img{
  width: 100%;
  height: 230px;
  object-fit: cover;
  display: block;
}
.ts-about-page .ts-member-body{
  padding: 18px 18px 20px;
}
.ts-about-page .ts-member-body h3{
  font-size: 16px;
}
.ts-about-page .ts-member-body p{
  margin: 0 0 14px;
  font-size: 13px;
  color: rgba(11,18,32,0.60);
}
.ts-about-page .ts-member-links{
  display: flex;
  gap: 10px;
}
.ts-about-page .ts-member-links a{
  width: 38px;
  height: 38px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(15, 23, 42, 0.10);
  background: rgba(248,250,252,0.80);
  color: rgba(11,18,32,0.75);
  transition: 0.25s ease;
  text-decoration: none;
}
.ts-about-page .ts-member-links a:hover{
  background: rgba(11, 77, 184, 0.10);
  color: #0b4db8;
}
.ts-about-page .ts-about-faq{
  background: #fff;
  padding-bottom: 110px;
}
.ts-about-page .ts-faq-grid{
  max-width: 980px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}
.ts-about-page .ts-faq{
  border-radius: 22px;
  border: 1px solid rgba(15, 23, 42, 0.08);
  background: rgba(248,250,252,0.70);
  padding: 18px 18px;
}
.ts-about-page .ts-faq summary{
  cursor: pointer;
  display: flex;
  gap: 12px;
  align-items: center;
  justify-content: space-between;
  font-weight: 700;
  font-size: 15px;
  list-style: none;
}
.ts-about-page .ts-faq summary::-webkit-details-marker{
  display: none;
}
.ts-about-page .ts-faq summary i{
  font-size: 18px;
  color: #0b4db8;
}
.ts-about-page .ts-faq p{
  margin: 12px 0 0;
  color: rgba(11,18,32,0.70);
  line-height: 1.8;
  font-size: 14px;
}

@media (max-width: 1100px){
  .ts-about-page .ts-hero-grid{
    grid-template-columns: 1fr;
  }
  .ts-about-page .ts-hero-right{
    min-height: auto;
  }
  .ts-about-page .ts-hero-card img{
    height: 380px;
  }
  .ts-about-page .ts-f1, .ts-about-page .ts-f2{
    position: static;
    margin-top: 12px;
    width: fit-content;
  }
  .ts-about-page .ts-trust-grid{
    grid-template-columns: repeat(2, 1fr);
  }
  .ts-about-page .ts-diff-grid{
    grid-template-columns: 1fr;
  }
  .ts-about-page .ts-mini-cards{
    grid-template-columns: 1fr;
  }
  .ts-about-page .ts-time-grid{
    grid-template-columns: repeat(2, 1fr);
  }
  .ts-about-page .ts-founder-grid{
    grid-template-columns: 1fr;
  }
  .ts-about-page .ts-team-grid{
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 640px){
  .ts-about-page .ts-section{
  padding: 40px 0;
}
.ts-about-page .ts-hero-left h1{
  font-family: 32px !important;
}
  .ts-about-page .ts-about-hero{
    padding: 70px 0 40px;
  }
  .ts-about-page .ts-hero-stats{
    grid-template-columns: 1fr;
  }
  .ts-about-page .ts-trust-grid{
    grid-template-columns: 1fr;
  }
  .ts-about-page .ts-story-grid{
    grid-template-columns: 1fr;
  }
  .ts-about-page .ts-time-grid{
    grid-template-columns: 1fr;
  }
  .ts-about-page .ts-team-grid{
    grid-template-columns: 1fr;
  }
  .ts-about-page .ts-faq-grid{
    grid-template-columns: 1fr;
  }
}

/* =======================-==================About uS CSS======================================= */

/* =======================-==================Countact uS CSS======================================= */
/* ================================
   TRUE SEND CONTACT PAGE
================================ */
.truesend-contact-page {
  width: 100%;
  position: relative;
  overflow: hidden;
  background: #ffffff;
  padding: 0;
}

/* Common */
.truesend-contact-page .ts-chip {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  border-radius: 999px;
  background: rgba(90, 167, 255, 0.14);
  border: 1px solid rgba(90, 167, 255, 0.18);
  color: #0b2b55;
  font-weight: 700;
  font-size: 14px;
}

.truesend-contact-page .ts-chip i {
  font-size: 18px;
}

/* ================================
   SECTION 1: INTRO
================================ */
.truesend-contact-page .ts-contact-intro {
  padding: 90px 0 70px;
  background-color: #e6f3ff;
}

.truesend-contact-page .ts-contact-grid {
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap: 34px;
  align-items: center;
}

.truesend-contact-page .ts-contact-left h2 {
  margin-top: 16px;
  line-height: 1.3;
  font-weight: 800;
  color: #081b35;
}

.truesend-contact-page .ts-contact-left p {
  margin-top: 14px;
  font-size: 16px;
  line-height: 1.9;
  color: #4a5870;
  max-width: 620px;
}

.truesend-contact-page .ts-contact-stats {
  margin-top: 24px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}

.truesend-contact-page .ts-stat {
  background: rgba(255, 255, 255, 0.75);
  border: 1px solid rgba(255, 255, 255, 0.65);
  border-radius: 10px;
  padding: 10px;
  backdrop-filter: blur(10px);
}

.truesend-contact-page .ts-stat h4 {
  font-size: 24px;
  font-weight: 900;
  color: #0b2b55;
}

.truesend-contact-page .ts-stat p {
  margin: 0;
  font-size: 14px;
  color: #51647c;
}

/* Cards */
.truesend-contact-page .ts-contact-cards {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
}

.truesend-contact-page .ts-contact-card {
  display: flex;
  gap: 14px;
  padding: 18px;
  border-radius: 22px;
  background: rgba(255, 255, 255, 0.75);
  border: 1px solid rgba(255, 255, 255, 0.65);
  backdrop-filter: blur(10px);
  text-decoration: none;
  transition: 0.3s;
  min-height: 110px;
}

.truesend-contact-page .ts-contact-card:hover {
  transform: translateY(-4px);
  box-shadow: 0px 22px 55px rgba(14, 33, 66, 0.14);
}

.truesend-contact-page .ts-contact-icon {
  width: 52px;
  height: 52px;
  border-radius: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(90, 167, 255, 0.16);
  color: #0b2b55;
}

.truesend-contact-page .ts-contact-icon i {
  font-size: 24px;
}

.truesend-contact-page .ts-contact-text h4 {
  font-size: 16px;
  margin-bottom: 4px;
  font-weight: 800;
  color: #081b35;
}

.truesend-contact-page .ts-contact-text p {
  margin: 0;
  font-size: 14px;
  color: #4b5f78;
}

.truesend-contact-page .ts-contact-text span {
  display: inline-block;
  margin-top: 6px;
  font-size: 13px;
  font-weight: 700;
  color: #1b64ff;
}

/* ================================
   SECTION 2: FORM
================================ */
.truesend-contact-page .ts-contact-form-area {
  padding: 80px 0;
  background: #ffffff;
}

.truesend-contact-page .ts-form-grid {
  display: grid;
  grid-template-columns: 1.25fr 0.75fr;
  gap: 22px;
  align-items: start;
}

.truesend-contact-page .ts-form-card {
  border-radius: 15px;
  background: #ffffff;
  border: 1px solid rgba(20, 35, 70, 0.08);
  padding: 30px;
}

.truesend-contact-page .ts-form-head h3 {
  font-size: 26px;
  font-weight: 900;
  color: #081b35;
  margin-bottom: 8px;
}

.truesend-contact-page .ts-form-head p {
  margin: 0;
  color: #51647c;
  line-height: 1.8;
  font-size: 15px;
}

/* Form */
.truesend-contact-page .ts-form {
  margin-top: 22px;
}

.truesend-contact-page .ts-form-row {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
  margin-bottom: 14px;
}

.truesend-contact-page .ts-input label {
  font-size: 13px;
  font-weight: 800;
  color: #0b2b55;
  margin-bottom: 8px;
  display: block;
}

.truesend-contact-page .ts-input-box,
.truesend-contact-page .ts-textarea-box {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  border-radius: 10px;
  background: #f7f9ff;
  border: 1px solid rgba(20, 35, 70, 0.08);
}

.truesend-contact-page .ts-input-box i,
.truesend-contact-page .ts-textarea-box i {
  font-size: 20px;
  color: #1b64ff;
}

.truesend-contact-page input,
.truesend-contact-page select,
.truesend-contact-page textarea {
  width: 100%;
  border: none;
  outline: none;
  background: transparent;
  font-size: 14px;
  color: #081b35;
}

.truesend-contact-page textarea {
  resize: none;
}



.truesend-contact-page .ts-form-note {
  margin-top: 14px;
  font-size: 13px;
  color: #51647c;
  display: flex;
  gap: 10px;
  align-items: center;
}

.truesend-contact-page .ts-form-note i {
  color: #18a566;
  font-size: 18px;
}

/* Side Cards */
.truesend-contact-page .ts-form-side {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.truesend-contact-page .ts-side-card {
  border-radius: 15px;
  padding: 22px;
  background: #ffffff;
  border: 1px solid rgba(20, 35, 70, 0.08);
}

.truesend-contact-page .ts-side-card h4 {
  font-size: 18px;
  font-weight: 900;
  margin-bottom: 10px;
  color: #081b35;
}

.truesend-contact-page .ts-side-card p {
  margin: 0;
  font-size: 14px;
  line-height: 1.8;
  color: #51647c;
  margin-bottom: 16px;
}

.truesend-contact-page .ts-hours {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.truesend-contact-page .ts-hour-row {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  font-size: 14px;
  color: #4b5f78;
}

.truesend-contact-page .ts-hour-row b {
  color: #0b2b55;
}

.truesend-contact-page .ts-divider {
  height: 1px;
  background: rgba(20, 35, 70, 0.08);
  margin: 18px 0;
}

.truesend-contact-page .ts-mini-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  text-decoration: none;
  padding: 12px 16px;
  border-radius: 16px;
  background: #f1f6ff;
  color: #1b64ff;
  font-weight: 900;
  transition: 0.3s;
}

.truesend-contact-page .ts-mini-btn:hover {
  transform: translateY(-3px);
}

.truesend-contact-page .ts-side-gradient {
  background-color: var(--secondary);
  color: #fff;
  border: none;
}

.truesend-contact-page .ts-side-gradient h4,
.truesend-contact-page .ts-side-gradient p {
  color: #fff;
}

.truesend-contact-page .ts-mini-btn.white {
  background: rgba(255, 255, 255, 0.18);
  color: #fff;
}

/* ================================
   SECTION 3: MAP
================================ */
.truesend-contact-page .ts-contact-map-area {
  padding: 70px 0;
  background: #f9fbff;
}

.truesend-contact-page .ts-map-grid {
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 20px;
  align-items: stretch;
}

.truesend-contact-page .ts-map-box {
  border-radius: 26px;
  overflow: hidden;
  border: 1px solid rgba(20, 35, 70, 0.08);
  box-shadow: 0px 18px 55px rgba(14, 33, 66, 0.08);
  min-height: 380px;
}

.truesend-contact-page .ts-map-box iframe {
  width: 100%;
  height: 100%;
  border: none;
}

.truesend-contact-page .ts-office-box {
  border-radius: 15px;
  padding: 26px;
  background: #ffffff;
  border: 1px solid rgba(20, 35, 70, 0.08);
}

.truesend-contact-page .ts-office-box h3 {
  font-size: 24px;
  font-weight: 900;
  color: #081b35;
  margin-bottom: 10px;
}

.truesend-contact-page .ts-office-box p {
  margin: 0 0 18px;
  color: #51647c;
  line-height: 1.8;
  font-size: 14px;
}

.truesend-contact-page .ts-office-list {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.truesend-contact-page .ts-office-item {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  padding: 14px;
  border-radius: 10px;
  background: #f7f9ff;
  border: 1px solid rgba(20, 35, 70, 0.08);
}

.truesend-contact-page .ts-office-item i {
  font-size: 22px;
  color: #1b64ff;
  margin-top: 2px;
}

.truesend-contact-page .ts-office-item h5 {
  margin: 0 0 4px;
  font-size: 14px;
  font-weight: 900;
  color: #081b35;
}

.truesend-contact-page .ts-office-item p {
  margin: 0;
  font-size: 13px;
  color: #51647c;
}

.truesend-contact-page .ts-office-actions {
  display: flex;
  gap: 12px;
  margin-top: 18px;
  flex-wrap: wrap;
}


/* ================================
   SECTION 4: FAQ
================================ */
.truesend-contact-page .ts-contact-faq {
  padding: 80px 0;
  background: #ffffff;
}

.truesend-contact-page .ts-faq-head {
  text-align: center;
  max-width: 720px;
  margin: 0 auto 34px;
}

.truesend-contact-page .ts-faq-head h2 {
  margin-top: 16px;
  font-size: 40px;
  font-weight: 900;
  color: #081b35;
}

.truesend-contact-page .ts-faq-head p {
  margin-top: 10px;
  color: #51647c;
  line-height: 1.8;
  font-size: 15px;
}

.truesend-contact-page .ts-faq-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
}

.truesend-contact-page .ts-faq-item {
  border-radius: 22px;
  padding: 16px 18px;
  background: #f7f9ff;
  border: 1px solid rgba(20, 35, 70, 0.08);
}

.truesend-contact-page .ts-faq-item summary {
  cursor: pointer;
  font-weight: 900;
  font-size: 15px;
  color: #081b35;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  list-style: none;
}

.truesend-contact-page .ts-faq-item summary::-webkit-details-marker {
  display: none;
}

.truesend-contact-page .ts-faq-item summary i {
  font-size: 18px;
  color: #1b64ff;
  transition: 0.3s;
}

.truesend-contact-page .ts-faq-item[open] summary i {
  transform: rotate(180deg);
}

.truesend-contact-page .ts-faq-item p {
  margin: 12px 0 0;
  color: #51647c;
  line-height: 1.8;
  font-size: 14px;
}

/* ================================
   RESPONSIVE
================================ */
@media (max-width: 991px) {
  .truesend-contact-page .ts-contact-grid {
    grid-template-columns: 1fr;
  }

  .truesend-contact-page .ts-contact-left h2 {
    font-size: 38px;
  }

  .truesend-contact-page .ts-form-grid {
    grid-template-columns: 1fr;
  }

  .truesend-contact-page .ts-map-grid {
    grid-template-columns: 1fr;
  }

  .truesend-contact-page .ts-faq-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 576px) {
  .truesend-contact-page .ts-contact-left h2 {
    font-size: 32px;
  }

  .truesend-contact-page .ts-contact-cards {
    grid-template-columns: 1fr;
  }

  .truesend-contact-page .ts-form-row {
    grid-template-columns: 1fr;
  }

  .truesend-contact-page .ts-map-box {
    min-height: 280px;
  }
}

/* =======================-==================Countact uS CSS======================================= */

/* =======================-==================Our Solutions CSS======================================= */
.ts-solutions-page{
  font-family: Inter, sans-serif;
  color: #0b1220;
}

.ts-solutions-page .container{
  width: min(1200px, 92%);
  margin: auto;
}

/* HERO */
.ts-sol-hero{
  padding: 90px 0;
  background: linear-gradient(135deg,#f7fbff,#ffffff);
}

.ts-sol-hero-grid{
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 40px;
  align-items: center;
}




.ts-sol-tags{
  margin-top:20px;
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}

.ts-sol-tags span{
  padding:8px 14px;
  border-radius:999px;
  background:#eef6ff;
  font-size:13px;
  font-weight:600;
  color: #000;
}

.ts-sol-right img{
  width:100%;
  border-radius:20px;
}

/* GRID */
.ts-sol-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:20px;
  padding:70px 0;
}

.ts-sol-card{
  padding:24px;
  border-radius:20px;
  background:#fff;
  border:1px solid #e5e7eb;
  transition:.3s;
}

.ts-sol-card:hover{
  transform:translateY(-6px);
}

.ts-sol-card i{
  font-size:26px;
  color:#0aa5ff;
}

.ts-sol-card h3{
  margin:15px 0 10px;
}

/* FEATURES */
.ts-sol-features{
  padding:80px 0;
  background:#f9fbff;
}

.ts-sol-feature-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:20px;
}

.ts-sol-feature{
  text-align:center;
  padding:20px;
}

.ts-sol-feature i{
  font-size:28px;
  color:#7b4bff;
}

/* WHY */
.ts-sol-why{
  padding:90px 0;
}

.ts-sol-why-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:40px;
  align-items:center;
}

.ts-sol-why img{
  width:100%;
  border-radius:20px;
}

/* FAQ */
.ts-sol-faq{
  padding:80px 0;
}

.ts-sol-faq details{
  margin-top:15px;
  padding:15px;
  border-radius:15px;
  background:#f3f6fa;
}

/* RESPONSIVE */
@media(max-width:1000px){
  .ts-sol-hero-grid,
  .ts-sol-why-grid{
    grid-template-columns:1fr;
  }
  .ts-sol-grid{
    grid-template-columns:repeat(2,1fr);
  }
  .ts-sol-feature-grid{
    grid-template-columns:repeat(2,1fr);
  }
}

@media(max-width:600px){
  .ts-sol-grid,
  .ts-sol-feature-grid{
    grid-template-columns:1fr;
  }
}

/* =======================-==================Our Solutions CSS======================================= */
.solutions-features-section {
  padding: 80px 0;
  background-color: #ffffff;
}

.solutions-features-section .container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
}

.section-header {
  text-align: center;
  margin-bottom: 60px;
}

.section-header h2 {
  font-size: 42px;
  font-weight: 700;
  color: #1a1a1a;
  margin: 20px 0;
  line-height: 1.3;
}

.section-header p {
  font-size: 16px;
  color: #666666;
  max-width: 600px;
  margin: 0 auto;
}

.features-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 30px;
}

.feature-card {
  padding: 40px 30px;
  background-color: #f9f9f9;
  border-radius: 15px;
  border: 1px solid #f0f0f0;
  transition: all 0.3s ease;
  text-align: center;
}

.feature-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 15px 40px rgba(0, 0, 0, 0.08);
  border-color: #e3f0ff;
}

.feature-icon {
  margin-bottom: 25px;
  display: flex;
  justify-content: center;
}

.feature-card h3 {
  font-size: 20px;
  font-weight: 700;
  color: #1a1a1a;
  margin-bottom: 15px;
}

.feature-card p {
  font-size: 15px;
  color: #666666;
  line-height: 1.6;
}

@media (max-width: 768px) {
  .solutions-features-section {
    padding: 50px 0;
  }

  .section-header h2 {
    font-size: 28px;
  }

  .features-grid {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .feature-card {
    padding: 30px 20px;
  }
  .solutions-benefits-section {
    padding: 50px 0;
  }

  .solutions-benefits-section .row {
    flex-direction: column;
    gap: 40px;
  }

  .benefits-content h2 {
    font-size: 28px;
  }

  .benefits-list {
    margin-bottom: 20px;
  }

  .benefit-item {
    gap: 15px;
    margin-bottom: 20px;
  }
}

.solutions-benefits-section {
  padding: 80px 0;
  background: linear-gradient(135deg, #f9f5ff 0%, #f0f4ff 100%);
}

.solutions-benefits-section .container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
}

.solutions-benefits-section .row {
  display: flex;
  align-items: center;
  gap: 60px;
}

.benefits-image {
  flex: 1;
}

.benefits-image img {
  width: 100%;
  border-radius: 20px;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.1);
}

.benefits-content {
  flex: 1;
}

.benefits-content h2 {
  font-weight: 700;
  color: #1a1a1a;
  margin: 20px 0 15px 0;
  line-height: 1.3;
}

.intro-text {
  font-size: 16px;
  color: #666666;
  margin-bottom: 40px;
  line-height: 1.6;
}

.benefits-list {
  margin-bottom: 30px;
}

.benefit-item {
  display: flex;
  gap: 20px;
  margin-bottom: 25px;
}

.benefit-icon {
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  background-color: #e3f0ff;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #0066ff;
  font-weight: 700;
  font-size: 20px;
}

.benefit-text h4 {
  font-size: 16px;
  font-weight: 700;
  color: #1a1a1a;
  margin: 0 0 5px 0;
}

.benefit-text p {
  font-size: 14px;
  color: #666666;
  margin: 0;
  line-height: 1.5;
}

.our-solutions .ts-story-grid a {
    color: #252628;
    display: block;
    transition: transform 0.4s ease, box-shadow 0.4s ease;
}

.our-solutions .ts-story-grid a:hover {
    transform: scale(1.05);
    box-shadow: 0 10px 25px rgba(0,0,0,0.15);
}
/* =======================-==================Our Solutions CSS======================================= */

/* =======================-==================Our Features CSS======================================= */
.features-services-section {
  padding: 80px 0;
  background-color: #f8f9fa;
}

.features-services-section .container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
}

.section-header {
  text-align: center;
  margin-bottom: 60px;
}

.section-header h2 {
  font-size: 42px;
  font-weight: 700;
  color: #1a1a1a;
  margin-bottom: 15px;
}

.section-header p {
  font-size: 18px;
  color: #666;
  max-width: 600px;
  margin: 0 auto;
}

.services-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 30px;
}

/* security */
.tsf-security{
  background: linear-gradient(135deg,#111827,#1f2937);
  color: #fff;
  text-align: center;
  padding: 70px 0;
}

.tsf-security-grid{
  display: grid;
  grid-template-columns: repeat(4,1fr);
  gap: 20px;
  margin-top: 40px;
}

.tsf-security-grid div{
  background: rgba(255,255,255,0.08);
  padding: 20px;
  border-radius: 12px;
}

@media (max-width: 992px){
.tsf-security-grid{grid-template-columns: repeat(2,1fr);}
}


@media (max-width: 768px) {
  .tsf-security{
  padding: 50px 0;
}

  .section-header h2 {
    font-size: 28px;
  }

  .services-grid {
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 20px;
  }

  .service-card {
    padding: 30px 20px;
  }
}

.features-highlights-section {
    padding: 80px 0;
    background: linear-gradient(
        to top,
        #93c5fda1, 
        #f8fbff
    );
}

.features-highlights-section .section-header {
  margin-bottom: 60px;
}


.features-highlights-section .section-header p {
  font-size: 18px;
  color: #464646;
}

.highlights-content {
  display: grid;
  grid-template-columns: 1fr 1.5fr;
  gap: 60px;
  align-items: flex-start;
}

.highlights-tabs {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.tab-btn {
  padding: 16px 20px;
  background-color: #f8f9fa;
  border: 2px solid transparent;
  border-radius: 8px;
  cursor: pointer;
  transition: all 0.3s ease;
  font-size: 15px;
  font-weight: 600;
  color: #464646;
  text-align: left;
  display: flex;
  align-items: center;
  gap: 12px;
}

.tab-btn:hover {
  background-color: #e8ecf1;
  color: #0052cc;
}

.tab-btn.active {
  background-color: #0052cc;
  color: white;
  border-color: #0052cc;
}

.tab-icon {
  font-size: 20px;
}

.highlights-content-area {
  position: relative;
}

.tab-content {
  display: block !important;
  animation: fadeIn 0.3s ease;
}

.tab-content.active {
  display: block;
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

.tab-content h3 {
  font-size: 28px;
  font-weight: 700;
  color: #1a1a1a;
  margin-bottom: 15px;
}

.tab-content p {
  font-size: 16px;
  color: #464646;
  line-height: 1.6;
  margin-bottom: 25px;
}

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

.feature-list li {
  padding: 8px 0;
  padding-left: 30px;
  position: relative;
  color: #464646;
  font-size: 15px;
}

.feature-list li::before {
  content: '✓';
  position: absolute;
  left: 0;
  color: #00d084;
  font-weight: bold;
  font-size: 18px;
}

.fretures-services .ts-time-grid a {
    color: #252628;
    display: block;
    transition: transform 0.4s ease, box-shadow 0.4s ease;
}

.fretures-services .ts-time-grid a:hover {
    transform: scale(1.05);
    box-shadow: 0 10px 25px rgba(0,0,0,0.15);
}

@media (max-width: 768px) {
  .features-highlights-section {
    padding: 50px 0;
  }

  .highlights-content {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .highlights-tabs {
    flex-direction: row;
    flex-wrap: wrap;
  }

  .tab-btn {
    flex: 1;
    min-width: 150px;
    justify-content: center;
    flex-direction: column;
  }

  .tab-content h3 {
    font-size: 22px;
  }
}

.automation-flow{
  padding: 70px 0;
}
.slick-flow{
  display:flex;
  justify-content:space-between;
  gap:30px;
  position:relative;
  margin-top:60px;
  flex-wrap:wrap;
}

/* Gradient connecting line */
.slick-flow::before{
  content:"";
  position:absolute;
  top:35px;
  left:5%;
  width:90%;
  height:4px;
  background:linear-gradient(to right, var(--primary-light), var(--primary));
  z-index:0;
}

.slick-step{
  background:#fff;
  padding:35px 25px;
  border-radius:20px;
  box-shadow:0 15px 40px rgba(0,0,0,0.05);
  flex:1 1 220px;
  text-align:center;
  position:relative;
  z-index:2;
  transition:all .3s ease;
}

.slick-step:hover{
  transform:translateY(-12px);
  box-shadow:0 25px 50px rgba(37,99,235,0.15);
}

.step-number{
  width:70px;
  height:70px;
  margin:auto;
  background:linear-gradient(135deg,#85d2ff,var(--primary-dark));
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  font-weight:600;
  font-size:18px;
  margin-bottom:20px;
  box-shadow:0 10px 25px rgba(37,99,235,0.3);
}

.slick-step h4{
  margin-bottom:12px;
}

.slick-step p{
  font-size:14px;
  color:var(--muted);
}

/* Responsive */
@media(max-width:992px){

  .slick-flow{
    flex-direction:column;
    align-items:center;
  }

  .slick-flow::before{
    display:none;
  }

  .slick-step{
    width:100%;
    max-width:500px;
  }
} 


/* =======================-==================Our Features CSS======================================= */