@charset "UTF-8";
/* ========== Home 10 : Hero Section Style ============= */
@import url("https://fonts.cdnfonts.com/css/clash-display");
/* ========== Home 10 : Process Section Style ============= */
@import url("https://fonts.cdnfonts.com/css/clash-display");

/*======= Base Class ========*/
:root {
  --bs-primary: #9831ff;
  --bs-primary-rgb: 49, 71, 255;
  --l2-primary: #a259ff;
  --l2-primary-rgb: 162, 89, 255;
  --l2-secondary: #0a102f;
  --l2-secondary-rgb: 10, 16, 47;
  --l3-primary: #ffc900;
  --l3-primary-rgb: 255, 201, 0;
  --l4-primary: #4b2aad;
  --l4-primary-rgb: 75, 42, 173;
  --l5-primary: #ff9966;
  --l5-primary-rgb: 255, 153, 102;
  --l5-secondary: #1b1c1d;
  --l5-secondary-rgb: 27, 28, 29;
  --l6-primary: #3147ff;
  --l6-primary-rgb: 49, 71, 255;
  --l7-primary: #191919;
  --l7-primary-rgb: 25, 25, 25;
  --l7-secondary: #a259ff;
  --l7-secondary-rgb: 162, 89, 255;
  --l8-primary: #c1ff00;
  --l8-primary-rgb: 193, 255, 0;
  --l9-primary: #324438;
  --l9-primary-rgb: 50, 68, 56;
  --l9-secondary: #f4b905;
  --l9-secondary-rgb: 244, 185, 5;
  --l10-primary: #2d2b92;
  --l10-primary-rgb: 45, 43, 146;
  --l10-secondary: #ffd874;
  --l10-secondary-rgb: 255, 216, 116;
  --body-color: #0a102f;
  --body-color-rgb: 10, 16, 47;
  --black-2: #121212;
  --black-2-rgb: 18, 18, 18;
  --black-3: #1b1c1d;
  --black-3-rgb: 27, 28, 29;
  --black-4: #191919;
  --black-4-rgb: 25, 25, 25;
  --cream: #fdfbf9;
  --cream-rgb: 253, 251, 249;
  --offwhite: #faf9f5;
  --offwhite-rgb: 250, 249, 245;
  --font-family-base: Inter, sans-serif;
  --font-family-heading: Plus Jakarta Sans, sans-serif;
  --font-wight-heading: 800;
  --font-dm-sans: DM Sans, sans-serif;
}

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

body {
  font-family: var(--font-family-base);
  font-size: 1rem;
  line-height: 1.56;
}

span,
a {
  display: inline-block;
}

a {
  text-decoration: none;
}

ul {
  list-style: none;
  padding-left: initial;
}

img {
  display: block;
}

h1,
h2,
h3,
h4 {
  font-weight: var(--font-weight-heading);
  font-family: var(--font-family-heading);
}

p {
  font-size: 16px;
  line-height: 1.67;
  margin-bottom: initial;
  color: rgba(10, 16, 47, 0.8);
}

@media (min-width: 576px) {
  p {
    font-size: 18px;
  }
}

ul {
  list-style: none;
  /* Optional: Removes default bullet points */
  padding-left: 0;
}

ul li {
  color: white;
}

#pricing {
  padding-top: 60px;
  padding-bottom: 120px;
  margin-top: 0;
  margin-bottom: 0;
}

.pricing-card__price-block {
  display: inline-flex;
  align-items: baseline;
  /* Aligns price and /mo on the same line */
  gap: 4px;
  /* Adds a small space between the price and /mo */
}

.pricing-card__price-block span {
  font-size: 0.8em;
  /* Adjust the size of /mo if needed */
  line-height: 1;
  /* Ensure consistent vertical alignment */
}

.home-10_process-section {
  padding-top: 80px;
  /* Increase the top padding */
  padding-bottom: 120px;
  /* Maintain or adjust bottom padding if needed */
}

.customer-section .team-card-2 {
  text-align: center;
  margin-bottom: 30px;
}

.customer-section .team-card-2 img {
  margin: 0 auto 15px auto;
  border-radius: 10px;
}

.customer-section .team-card-2__body h4 {
  font-weight: 600;
  margin-top: 10px;
  margin-bottom: 5px;
}

.customer-section .team-card-2__body p {
  font-size: 14px;
  color: #666;
}

/*!
 * Bootstrap Grid v5.3.0-alpha3 (https://getbootstrap.com/)
 * Copyright 2011-2023 The Bootstrap Authors
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
 */
.container {
  --bs-gutter-x: 1.5rem;
  --bs-gutter-y: 0;
  width: 100%;
  padding-right: calc(var(--bs-gutter-x) * 0.5);
  padding-left: calc(var(--bs-gutter-x) * 0.5);
  margin-right: auto;
  margin-left: auto;
}

@media (min-width: 480px) {
  .container {
    max-width: 480px;
  }
}

@media (min-width: 576px) {
  .container {
    max-width: 540px;
  }
}

@media (min-width: 768px) {
  .container {
    max-width: 720px;
  }
}

@media (min-width: 992px) {
  .container {
    max-width: 960px;
  }
}

@media (min-width: 1200px) {
  .container {
    max-width: 1140px;
  }
}

@media (min-width: 1400px) {
  .container {
    max-width: 1320px;
  }
}

.row {
  --bs-gutter-x: 1.5rem;
  --bs-gutter-y: 0;
  display: flex;
  flex-wrap: wrap;
  margin-top: calc(-1 * var(--bs-gutter-y));
  margin-right: calc(-0.5 * var(--bs-gutter-x));
  margin-left: calc(-0.5 * var(--bs-gutter-x));
}

.row>* {
  box-sizing: border-box;
  flex-shrink: 0;
  width: 100%;
  max-width: 100%;
  padding-right: calc(var(--bs-gutter-x) * 0.5);
  padding-left: calc(var(--bs-gutter-x) * 0.5);
  margin-top: var(--bs-gutter-y);
}

.col-auto {
  flex: 0 0 auto;
  width: auto;
}

.col-8 {
  flex: 0 0 auto;
  width: 66.66666667%;
}

.col-10 {
  flex: 0 0 auto;
  width: 83.33333333%;
}

@media (min-width: 480px) {
  .col-xs-7 {
    flex: 0 0 auto;
    width: 58.33333333%;
  }

  .col-xs-8 {
    flex: 0 0 auto;
    width: 66.66666667%;
  }

  .col-xs-10 {
    flex: 0 0 auto;
    width: 83.33333333%;
  }

  .col-xs-11 {
    flex: 0 0 auto;
    width: 91.66666667%;
  }
}

@media (min-width: 576px) {
  .col-sm-6 {
    flex: 0 0 auto;
    width: 50%;
  }

  .col-sm-7 {
    flex: 0 0 auto;
    width: 58.33333333%;
  }

  .col-sm-9 {
    flex: 0 0 auto;
    width: 75%;
  }

  .col-sm-10 {
    flex: 0 0 auto;
    width: 83.33333333%;
  }

  .col-sm-12 {
    flex: 0 0 auto;
    width: 100%;
  }
}

@media (min-width: 768px) {
  .col-md-4 {
    flex: 0 0 auto;
    width: 33.33333333%;
  }

  .col-md-6 {
    flex: 0 0 auto;
    width: 50%;
  }

  .col-md-8 {
    flex: 0 0 auto;
    width: 66.66666667%;
  }

  .col-md-9 {
    flex: 0 0 auto;
    width: 75%;
  }

  .col-md-10 {
    flex: 0 0 auto;
    width: 83.33333333%;
  }
}

@media (min-width: 992px) {
  .col-lg-auto {
    flex: 0 0 auto;
    width: auto;
  }

  .col-lg-3 {
    flex: 0 0 auto;
    width: 25%;
  }

  .col-lg-4 {
    flex: 0 0 auto;
    width: 33.33333333%;
  }

  .col-lg-5 {
    flex: 0 0 auto;
    width: 41.66666667%;
  }

  .col-lg-6 {
    flex: 0 0 auto;
    width: 50%;
  }

  .col-lg-7 {
    flex: 0 0 auto;
    width: 58.33333333%;
  }

  .col-lg-8 {
    flex: 0 0 auto;
    width: 66.66666667%;
  }
}

@media (min-width: 1200px) {
  .col-xl-auto {
    flex: 0 0 auto;
    width: auto;
  }

  .col-xl-5 {
    flex: 0 0 auto;
    width: 41.66666667%;
  }

  .col-xl-6 {
    flex: 0 0 auto;
    width: 50%;
  }

  .offset-xl-1 {
    margin-left: 8.33333333%;
  }
}

@media (min-width: 1400px) {
  .col-xxl-auto {
    flex: 0 0 auto;
    width: auto;
  }

  .col-xxl-4 {
    flex: 0 0 auto;
    width: 33.33333333%;
  }

  .col-xxl-6 {
    flex: 0 0 auto;
    width: 50%;
  }

  .col-xxl-7 {
    flex: 0 0 auto;
    width: 58.33333333%;
  }
}

h1,
h2,
h3,
h4 {
  margin-bottom: 0;
}

/* ========== Component : Feature Card Style 3============= */

/* ========== Component : Feature Card 5 Style ============= */
/* ========== Component : process Card Style ============= */

/* ========== Component : Testimonial Card Style ============= */

/* ========== Component : Pricing Card Style 1============= */
.pricing-card {
  border: 2px solid #0a102f;
  border-radius: 10px;
  padding: 30px;
  transition: all 0.4s;
}

@media (min-width: 1200px) {
  .pricing-card {
    padding: 40px;
  }
}

.pricing-card__head {
  text-align: center;
  padding-bottom: 25px;
  margin-bottom: 40px;
  border-bottom: 1px solid rgba(10, 16, 47, 0.1);
  font-family: "Inter", sans-serif;
}

.pricing-card__plan {
  font-weight: 700;
  font-size: 20px;
  line-height: 1.4;
  margin-bottom: 20px;
  font-family: "Inter", sans-serif;
}

.pricing-card__price-block {
  font-weight: 400;
  font-size: 28px;
  line-height: 2.86;
  font-family: "Inter", sans-serif;
}

.pricing-card__price-block span {
  font-weight: 700;
  font-size: 58px;
  line-height: 1.38;
}

.pricing-card p {
  font-weight: 400;
  font-size: 14px;
  line-height: 1.43;
  color: rgba(10, 16, 47, 0.7);
}

.pricing-card__body {
  display: flex;
  flex-direction: column;
  row-gap: 20px;
}

@media (min-width: 992px) {
  .pricing-card__body {
    row-gap: 35px;
  }
}

.pricing-card__list {
  display: flex;
  justify-content: center;
  flex-direction: column;
  row-gap: 20px;
}

.pricing-card__list li {
  display: flex;
  column-gap: 12px;
  padding-left: 20px;
  padding-right: 20px;
  font-weight: 600;
  font-size: 16px;
  line-height: 1.5;
  font-family: "Inter", sans-serif;
  color: #0a102f;
}

.pricing-card__list li::before {
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  content: "\f005";
}

.pricing-card.active {
  box-shadow: 10px 10px rgba(var(--body-color-rgb));
  border-radius: 10px;
}

.pricing-card:hover {
  box-shadow: 10px 10px rgba(var(--body-color-rgb));
  border-radius: 10px;
}

/* ========== Component : Pricing Card Style 2 ============= */

/* ========== Component : Pricing Card Style 3 ============= */

/* ========== Component : Pricing Card Style 4 ============= */

/* ========== Component : Pricing Card Style 5 ============= */

/* ========== Component : Pricing Card Style 6 ============= */

/* ========== Component : Course Card ============= */

/* ========== Component : Blog Card ============= */

/* ========== Component : Blog Card Large ============= */

/* ========== Component : Team Card Style ============= */

/* ========== Component : Team Card 2 Style ============= */
.team-card-2 {
  display: flex;
  flex-direction: column;
  row-gap: 24px;
  background: #faf9f5;
  border-radius: 10px;
  padding: 20px;
  transition: all 0.4s;
}

.team-card-2:hover {
  background: #ead9ff;
  box-shadow: 0px 4px 80px rgba(0, 0, 0, 0.08);
}

.team-card-2 img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  border-radius: 10px;
}

.team-card-2__body {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  column-gap: 10px;
}

.team-card-2__name {
  font-size: 18px;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: 0em;
  color: #0a102f;
  margin-bottom: 5px;
  font-family: "Inter", sans-serif;
}

@media (min-width: 576px) {
  .team-card-2__name {
    font-size: 20px;
  }
}

.team-card-2__position {
  font-size: 16px;
  line-height: 1.4;
  font-weight: 400;
  color: rgba(10, 16, 47, 0.8);
  margin-bottom: 15px;
}

@media (min-width: 576px) {
  .team-card-2__position {
    font-size: 18px;
  }
}

.team-card-2-row {
  justify-content: center;
  --bs-gutter-y: 30px;
}

/* ========== Component : service Card Style ============= */

/* ========== Component : Service Card Style ============= */

/* ========== Component : Career Card Style ============= */

/* ========== Component : List Style  ============= */

.list-social {
  --color: #0a102f;
  --backgroundColor: rgba(10, 16, 47, 0.1);
  --hovBackground: #3147ff;
  --hovColor: #ffffff;
  display: inline-flex;
  column-gap: 12px;
  list-style: none;
  flex-wrap: wrap;
  margin-bottom: 0;
  position: relative;
  z-index: 99;
}

.list-social li a {
  display: flex;
  justify-content: center;
  align-items: center;
  min-width: 30px;
  max-width: 30px;
  min-height: 30px;
  max-height: 30px;
  border-radius: 500px;
  font-size: 13px;
  background: var(--backgroundColor);
  color: var(--color);
  transition: 0.4s;
}

.list-social li a:hover {
  color: var(--hovColor);
  background-color: var(--hovBackground);
  border-color: var(--hovBackground);
}

/* Sideabr List Styles */

/* ========== Component  : Portfolio Widget Style ============= */
.portfolio-widget_image-block {
  margin-bottom: 24px;
  border-radius: 10px;
  overflow: hidden;
  height: 100%;
}

.portfolio-widget_image-block img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  object-position: center top;
  transition: all 0.4s;
}

.portfolio-widget_image-block img:hover {
  transform: scale(1.1) rotate(3deg);
}

.portfolio-widget__title {
  font-family: var(--font-family-base);
  color: #0a102f;
  font-weight: 600;
  line-height: 1.33;
  letter-spacing: -0.0208333333em;
  font-size: 20px;
}

@media (min-width: 768px) {
  .portfolio-widget__title {
    font-size: 22px;
  }
}

@media (min-width: 992px) {
  .portfolio-widget__title {
    font-size: 24px;
  }
}

.portfolio-widget__title-block {
  display: flex;
  justify-content: space-between;
  margin-bottom: 10px;
  flex-direction: column;
  row-gap: 10px;
}

@media (min-width: 576px) {
  .portfolio-widget__title-block {
    row-gap: 20px;
    margin-bottom: 20px;
  }
}

@media (min-width: 992px) {
  .portfolio-widget__title-block {
    flex-direction: initial;
    margin-bottom: 20px;
    column-gap: 20px;
  }
}

.portfolio-widget__category {
  font-size: 16px;
  line-height: 1.4;
  font-weight: 600;
  line-height: 1.67;
  color: #0a102f;
}

@media (min-width: 576px) {
  .portfolio-widget__category {
    font-size: 18px;
  }
}

.portfolio-widget:hover .btn-link {
  color: var(--bs-primary);
}

.portfolio-widget:hover .btn-link:after {
  left: 10px;
}

/* ========== Component  : Tastimonial widget Large Style ============= */

/* ========== Component  : Tastimonial widget Large 2 Style ============= */

/* ========== Component : Tastimonial widget Large 3 Style ============= */

/* ========== widget : Tastimonial widget 2============= */

/* ========== widget : Tastimonial widget 2============= */

/* ========== widget : Tastimonial widget 3============= */

/* ========== widget : Tastimonial widget 4============= */

/* ========== Component  : Feature Widget Style 1============= */

/* ========== Component  : Feature Widget Style 2 ============= */

/* Applied on : Landing - SEO Agency*/

/* ========== Component  : Feature Widget Style 3 ============= */

/* ========== Component  : Feature Widget Style 5 ============= */
.feature-widget-5 {
  display: flex;
  column-gap: 20px;
  border-radius: 20px;
  transition: 300ms;
  height: 100%;
  row-gap: 15px;
  flex-direction: column;
  padding: 20px;
}

@media (min-width: 480px) {
  .feature-widget-5 {
    padding: 30px;
    flex-direction: row;
  }
}

@media (min-width: 992px) {
  .feature-widget-5 {
    column-gap: 25px;
    border-radius: 25px;
  }
}

@media (min-width: 1200px) {
  .feature-widget-5 {
    column-gap: 40px;
    border-radius: 40px;
  }
}

.feature-widget-5__icon img {
  max-width: 50px;
}

@media (min-width: 768px) {
  .feature-widget-5__icon img {
    max-width: initial;
  }
}

.feature-widget-5__title {
  font-weight: 500;
  line-height: 1.33;
  letter-spacing: 0.04166666em;
  font-size: 20px;
  font-family: "Clash Display", sans-serif;
  margin-bottom: 15px;
}

@media (min-width: 768px) {
  .feature-widget-5__title {
    font-size: 22px;
  }
}

@media (min-width: 992px) {
  .feature-widget-5__title {
    font-size: 24px;
  }
}

.feature-widget-5 p {
  font-size: 16px;
  line-height: 1.67;
  font-weight: 400;
}

@media (min-width: 576px) {
  .feature-widget-5 p {
    font-size: 18px;
  }
}

.feature-widget-5-divider>* {
  border-bottom: 1px solid rgba(34, 31, 26, 0.1);
}

@media (min-width: 992px) {
  .feature-widget-5-divider>* {
    border-right: 1px solid rgba(34, 31, 26, 0.1);
  }

  .feature-widget-5-divider>*:nth-last-child(-n + 2) {
    border-bottom: 0;
  }

  .feature-widget-5-divider>*:nth-last-child(-n + 2)>div {
    padding-bottom: 0;
  }

  .feature-widget-5-divider>*:nth-of-type(-n + 2)>div {
    padding-top: 0;
  }

  .feature-widget-5-divider>*:nth-of-type(2n) {
    border-right: 0px;
  }
}

/* ========== Widget : Feature Style 6 ============= */

/* ========== widget : Feature Style 1============= */

/* ============Component  : Process Widget ============== */

/* ============ Process Widget 2 ============== */
.process-widget-2-row {
  --bs-gutter-y: 30px;
  justify-content: center;
}

.process-widget-2-row>* {
  position: relative;
  z-index: 1;
}

.process-widget-2-row>*::before {
  content: "";
  border: 2px dashed #221f1a;
  width: 90%;
  position: absolute;
  top: 40px;
  transform: translateX(50%);
  z-index: -1;
  display: none;
}

@media (min-width: 992px) {
  .process-widget-2-row>*:not(:last-child):before {
    display: block;
  }
}

.process-widget-2 {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  row-gap: 30px;
  max-width: 336px;
}

.process-widget-2__count {
  display: flex;
  justify-content: center;
  align-items: center;
  background: #b2a2c6;
  border: 1px solid rgba(34, 31, 26, 0.1);
  width: 60px;
  height: 60px;
  border-radius: 500px;
  font-weight: 600;
  font-family: "General Sans", sans-serif;
  line-height: 1.2;
  font-size: 26px;
  color: #221f1a;
}

@media (min-width: 768px) {
  .process-widget-2__count {
    font-size: 30px;
  }
}

@media (min-width: 992px) {
  .process-widget-2__count {
    font-size: 34px;
  }
}

@media (min-width: 768px) {
  .process-widget-2__count {
    width: 70px;
    height: 70px;
  }
}

@media (min-width: 992px) {
  .process-widget-2__count {
    width: 80px;
    height: 80px;
  }
}

.process-widget-2__count:hover {
  background: #710dfd;
  color: #fff0d9;
}

.process-widget-2__title {
  font-weight: 500;
  font-size: 26px;
  letter-spacing: 1px;
  color: #221f1a;
  font-family: "Clash Display", sans-serif;
  margin-bottom: 15px;
}

@media (min-width: 768px) {
  .process-widget-2__title {
    font-size: 28px;
  }
}

@media (min-width: 992px) {
  .process-widget-2__title {
    font-size: 30px;
  }
}

.process-widget-2 p {
  font-weight: 400;
  font-size: 20px;
  line-height: 1.6;
  color: rgba(34, 31, 26, 0.8);
  letter-spacing: -0.5px;
}

/* ========== Component   : Video Widget ============= */

/* ========== Component   : service Style ============= */

/* ========== Component   : rating Style ============= */

/* ========== Component  :Team Widget =========== */

/* ========== Component : Fact Widget   ============= */

/* Applied on : Landing - Web Hosting*/

/* ========== widget : Sidebar BLog============= */

/* ========== widget : Blog Comment Widget============= */

/* ========== Component : Content Widget   ============= */

/* ========== Component : Career Widget   ============= */

/* ========== Component : Accordion Style 1 ============= */

/* ========== Component : Accordion Style 2 ============= */

/* ========== Component : Accordion Style 3 ============= */

/* ========== Component : Accordion Style 4 ============= */

/* ========== Component : Accordion Style 5 ============= */

/* ========== Component : Accordion Style 6 used in l06 ============= */

/* ========== Component : Accordion Style 7 usen in faq page 3 ============= */

/* ======== Newsletter Section =========== */
/* ======== Newsletter Form 1 =========== */

/* ======== Newsletter Form 2 =========== */

/* ======== Form box Style =========== */

/* ========== Component : Badge Style  ============= */
.site-menu-main {
  margin-bottom: 0;
  padding-left: 0;
}

@media (min-width: 992px) {
  .site-menu-main {
    display: flex;
    margin-bottom: 0;
    padding-left: 0;
  }
}

.site-menu-main li {
  list-style: none;
}

.site-menu-main a {
  text-decoration: none;
}

.site-menu-main .nav-item {
  display: inherit;
}

.site-menu-main .nav-link-item {
  color: #fff;
  font-size: 16px;
  font-weight: 600;
  font-style: normal;
  line-height: 1.5;
  position: relative;
  transition: 0.3s;
}

.site-menu-main .nav-link-item:hover {
  color: #5e70ff;
}

@media (min-width: 992px) {
  .site-menu-main .nav-link-item {
    padding-top: 25px !important;
    padding-bottom: 23px !important;
    padding-left: 18px !important;
    padding-right: 18px !important;
    color: #fff;
  }

  .site-menu-main .nav-link-item:hover {
    color: #5e70ff;
  }
}

@media (min-width: 1200px) {
  .site-menu-main .nav-link-item {
    padding-top: 15px !important;
    padding-bottom: 13px !important;
    padding-left: 25px !important;
    padding-right: 25px !important;
  }
}

.mobile-menu-head,
.mobile-menu-trigger {
  display: none;
}

/*responsive*/
@media (max-width: 991px) {
  .site-header .mobile-menu-trigger {
    display: flex;
    height: 30px;
    width: 30px;
    margin-left: 15px;
    cursor: pointer;
    align-items: center;
    justify-content: center;
  }

  .site-header .mobile-menu-trigger span {
    display: block;
    height: 2px;
    background-color: #fff;
    width: 24px;
    position: relative;
  }

  .site-header .mobile-menu-trigger span:before,
  .site-header .mobile-menu-trigger span:after {
    content: "";
    position: absolute;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #fff;
  }

  .site-header .mobile-menu-trigger span:before {
    top: -6px;
  }

  .site-header .mobile-menu-trigger span:after {
    top: 6px;
  }

  .site-header .menu-block {
    position: fixed;
    width: 470px;
    max-width: 100%;
    background-color: #fff;
    right: 0;
    top: 0;
    height: 100%;
    overflow: hidden;
    transform: translate(100%);
    padding: 0 16px 60px;
    z-index: 1099;
  }


  @media (max-width: 991px) {
    .site-header .menu-block {
      position: fixed;
      width: 470px;
      max-width: 100%;
      background-color: #0a102f;
      right: 140;
      top: 0;
      height: 100%;
      overflow: hidden;
      transform: translate(100%);
      padding: 0 16px 60px;
      z-index: 1099;
    }

    .site-header .menu-block.active {
      right: 160px !important;
    }


  }

  .site-menu-main>li {
    line-height: 1;
    margin: 0;
    display: block;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  }

  .site-menu-main>li>a {
    line-height: 50px;
    padding: 18px;
    display: flex;
    align-items: center;
  }
}

@media (max-width: 991px) and (min-width: 992px) {
  .site-menu-main>li>a {
    display: block;
  }
}

@media (max-width: 991px) {
  .site-header .menu-block .mobile-menu-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
    z-index: 501;
    position: sticky;
    top: 0;
    padding-top: 20px;
    padding-bottom: 30px;
    background-color: #0a102f;
  }

  .site-header .menu-block .mobile-menu-head .current-menu-title {
    font-size: 15px;
    font-weight: 500;
    color: #000000;
    visibility: hidden;
  }

  .site-header .menu-block .mobile-menu-head .mobile-menu-close {
    height: 50px;
    width: 50px;
    border-left: 1px solid rgba(0, 0, 0, 0.1);
    cursor: pointer;
    line-height: 50px;
    text-align: center;
    color: #fff;
    font-size: 40px;
  }
}

@media (max-width: 991px) and (min-width: 992px) {
  .site-header .menu-block .mobile-menu-head .mobile-menu-close {
    color: #000000;
  }
}

@media (max-width: 991px) {
  .site-header .menu-block .site-menu-main {
    height: auto;
    overflow-x: hidden;
    overflow-y: auto;
  }
}

@media (max-width: 991px) {
  .menu-overlay {
    position: fixed;
    background-color: rgba(0, 0, 0, 0.5);
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 1098;
    visibility: hidden;
    opacity: 0;
  }

  .menu-overlay.active {
    position: fixed;
    background-color: rgba(0, 0, 0, 0.5);
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 1098;
    visibility: visible;
    opacity: 1;
  }
}

/*Custom Css for menu*/
@media (min-width: 992px) {
  .site-menu-main a {
    display: flex;
    align-items: center;
  }
}

/*Preloader css*/

/*Header Css StaRT*/
.site-navbar {
  display: flex;
  position: relative;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
}

@media (min-width: 992px) {
  .site-navbar {
    flex-flow: row nowrap;
    justify-content: flex-start;
    padding-top: 0px;
  }
}

.site-navbar .menu-block-wrapper {
  flex-grow: 1;
  align-items: center;
}

@media (min-width: 992px) {
  .site-navbar .menu-block-wrapper {
    display: flex !important;
    flex-basis: auto;
    justify-content: center;
  }
}

.site-header {
  padding-top: 15px;
  padding-bottom: 15px;
  background: #710dfd;
}

.site-header--sticky:not(.mobile-sticky-enable) {
  position: absolute !important;
  top: 0;
  right: 0;
  width: 100%;
  z-index: 999;
}

@media (min-width: 992px) {
  .site-header--sticky:not(.mobile-sticky-enable) {
    position: fixed !important;
    transition: 0.4s;
  }
}

.site-header--menu-left .menu-block .site-menu-main {
  justify-content: flex-start;
  padding-left: 15px;
}

@media (min-width: 1200px) {
  .site-header--menu-left .menu-block {
    width: 100%;
  }
}

.site-header .header-cta-btn-wrapper {
  display: none;
  margin-left: 30px;
}

@media (min-width: 992px) {
  .site-header .header-cta-btn-wrapper {
    display: flex;
    align-items: center;
    column-gap: 30px;
  }
}

.site-header .header-cta-btn-wrapper a {
  --bs-btn-padding-y: 12px;
}

.brand-logo {
  display: flex;
}

.brand-logo img {
  max-height: 30px;
}

.brand-logo .logo-dark {
  display: none;
}

/* Landing Specific Header Adjustment */
/* Header */
/* ========== Component : Button Style  ============= */
.btn-masco {
  --btn-spacing-y: 18px;
  --btn-spacing-x: 42px;
  --btn-radius: 3px;
  --btn-bg: #3147ff;
  --btn-color: #fff;
  --btn-border-width: 1px;
  --btn-border-color: #3147ff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  column-gap: 12px;
  font-style: normal;
  font-weight: 700;
  font-size: 16px;
  line-height: 1.5;
  z-index: 0;
  position: relative;
  border-width: var(--btn-border-width);
  border-style: solid;
  border-color: var(--btn-border-color);
  border-radius: var(--btn-radius);
  padding-left: var(--btn-spacing-x);
  padding-right: var(--btn-spacing-x);
  padding-top: var(--btn-spacing-y);
  padding-bottom: var(--btn-spacing-y);
  background-color: var(--btn-bg);
  color: var(--btn-color);
  transition: all 0.3s;
}

.btn-masco:not(.btn-fill--up):not(.btn-fill--down):not(.btn-fill--slide):not(.btn-fill--slide-reverse):not(.btn-fill--slide-left):not(.btn-shadow):not(.btn-shadow--reverse) {
  transition: all 0.3s ease-in-out;
}

.btn-masco:not(.btn-fill--up):not(.btn-fill--down):not(.btn-fill--slide):not(.btn-fill--slide-reverse):not(.btn-fill--slide-left):not(.btn-shadow):not(.btn-shadow--reverse):hover {
  background-color: var(--btn-hover-bg);
  color: var(--btn-hover-color);
  border-color: var(--btn-hover-border-color);
}

.btn-masco--header {
  --btn-spacing-y: 13px;
  --btn-spacing-x: 33px;
}

.btn-link {
  font-weight: 700;
  font-size: 16px;
  line-height: 1.5;
  color: #0a102f;
  transition: 0.3s;
  text-decoration: none;
}

.btn-arrow {
  display: inline-flex;
  column-gap: 10px;
}

.btn-arrow:hover::after {
  left: 5px;
}

.btn-arrow::after {
  font-weight: 900;
  font-family: "Font Awesome 6 Free";
  content: "\f061";
  font-size: inherit;
  position: relative;
  top: 1px;
  left: 0px;
  transition: 0.4s left;
  color: inherit;
}

/* ---------- Button Shadow ---------- */

/* ---------- Button Fill Up ---------- */

/* ---------- Button Slide & Slide Reverse ---------- */

/* ---------- Button Slide Down ---------- */

/* ---------- Button Slide Left ---------- */
.btn-fill--slide-left {
  overflow: hidden;
}

@keyframes slide-left-initial {
  100% {
    -webkit-transform: translate3d(0, -105%, 0);
    transform: translate3d(0, -105%, 0);
  }
}

@keyframes slide-left-end {
  0% {
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }

  100% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.btn-fill--slide-left span {
  position: relative;
  display: block;
  overflow: hidden;
}

.btn-fill--slide-left::before {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -webkit-transform-origin: 100% 50%;
  -ms-transform-origin: 100% 50%;
  transform-origin: 100% 50%;
  background: var(--btn-fill-bg);
  content: "";
  -webkit-transition: -webkit-transform 0.3s cubic-bezier(0.7, 0, 0.2, 1);
  transition: transform 0.3s cubic-bezier(0.7, 0, 0.2, 1);
  transition: transform 0.3s cubic-bezier(0.7, 0, 0.2, 1),
    -webkit-transform 0.3s cubic-bezier(0.7, 0, 0.2, 1);
}

.btn-fill--slide-left:hover {
  color: #000;
  background-color: var(--btn-bg);
  -webkit-transition: -webkit-transform 0.3s cubic-bezier(0.7, 0, 0.2, 1);
  transition: transform 0.3s cubic-bezier(0.7, 0, 0.2, 1);
  transition: transform 0.3s cubic-bezier(0.7, 0, 0.2, 1),
    -webkit-transform 0.3s cubic-bezier(0.7, 0, 0.2, 1);
}

.btn-fill--slide-left:hover>span>span {
  -webkit-animation: slide-left-initial 0.2s forwards,
    slide-left-end 0.2s forwards 0.2s;
  animation: slide-left-initial 0.2s forwards, slide-left-end 0.2s forwards 0.2s;
}

.btn-fill--slide-left:hover::before {
  background-color: var(--btn-fill-bg);
  -webkit-transform: scale3d(0, 1, 1);
  transform: scale3d(0, 1, 1);
  -webkit-transform-origin: 0 50%;
  -ms-transform-origin: 0 50%;
  transform-origin: 0 50%;
}

.btn-outline {
  --btn-bg: transparent;
  --btn-color: ;
  --btn-border-width: 2px;
  --btn-border-color: #0a102f;
  --btn-hover-bg: #0a102f;
  --btn-hover-color: #ffffff;
  --btn-hover-border-color: #0a102f;
}

.btn-primary-l10 {
  --btn-bg: transparent;
  --btn-color: #ffd874;
  --btn-border-width: 2px;
  --btn-border-color: #2d2b92;
  --btn-fill-bg: #2d2b92;
  --btn-fill-color: #2d2b92;
  --btn-fill-border-color: transparent;
}

.btn-secondary-l10 {
  --btn-bg: #ffd874;
  --btn-color: #ffd874;
  --btn-border-width: 2px;
  --btn-border-color: #ffd874;
  --btn-fill-bg: #2d2b92;
  --btn-fill-color: #2d2b92;
  --btn-fill-border-color: #ffd874;
}

.btn-outline-l10 {
  --btn-bg: transparent;
  --btn-color: #2d2b92;
  --btn-border-width: 2px;
  --btn-border-color: #2d2b92;
  --btn-fill-bg: #fff0d9;
  --btn-fill-color: #ffd874;
  --btn-fill-border-color: transparent;
}

/* ========== Button Utilities  ============= */
.rounded-pill {
  --btn-radius: 500px;
}

.btn-play {
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: white;
  color: var(--bs-primary);
  min-width: 50px;
  max-width: 50px;
  min-height: 50px;
  max-height: 50px;
  border-radius: 500px;
  font-size: 16px;
}

@media (min-width: 768px) {
  .btn-play {
    min-width: 70px;
    max-width: 70px;
    min-height: 70px;
    max-height: 70px;
    border-radius: 500px;
    font-size: 20px;
  }
}

@media (min-width: 992px) {
  .btn-play {
    min-width: 80px;
    max-width: 80px;
    min-height: 80px;
    max-height: 80px;
    border-radius: 500px;
    font-size: 24px;
  }
}

@media (min-width: 1200px) {
  .btn-play {
    min-width: 100px;
    max-width: 100px;
    min-height: 100px;
    max-height: 100px;
    border-radius: 500px;
    font-size: 24px;
  }
}

.btn-play i {
  transform: scale(1);
  transition: 0.4s;
}

.btn-play:hover i {
  transform: scale(1.2);
}

/* ========== Component : Ticker Style 1 ============= */
/* ========== Component : Ticker Style 1 ============= */
/* ========== Component : Ticker Style 1 ============= */
/* ========== Component : Content Section Style ============= */
.content {
  display: flex;
  flex-direction: column;
  row-gap: 30px;
  align-items: center;
}

@media (min-width: 992px) {
  .content {
    align-items: initial;
    row-gap: 48px;
  }
}

.content-text-block {
  text-align: center;
}

@media (min-width: 992px) {
  .content-text-block {
    text-align: initial;
    padding-right: 52px;
  }
}

@media (min-width: 1200px) {
  .content-text-block {
    padding-right: 0;
  }
}

.content-text-block p {
  line-height: 1.67;
  color: rgba(10, 16, 47, 0.8);
}

.content-text-block p:first-of-type {
  margin-top: 20px;
}

.content-list {
  display: flex;
  flex-direction: column;
  row-gap: 16px;
}

.content-list-item {
  display: flex;
  column-gap: 12px;
  font-size: 18px;
  line-height: 1.67;
  font-weight: 600;
  font-family: "Inter", sans-serif;
}

/* ========== Component : Pricing Control Style  ============= */

.pricing-control-3 {
  max-width: 265px;
  min-width: 265px;
  display: inline-flex;
  border-radius: 500px;
  height: 35px;
  align-items: center;
  column-gap: 24px;
}

.pricing-control-3 span {
  font-weight: 700;
  font-size: 16px;
  line-height: 1.5;
  color: rgba(18, 18, 18, 0.6);
  cursor: pointer;
}

.pricing-control-3__indicator {
  display: block;
  width: 70px;
  height: 35px;
  background: #324438;
  border-radius: 50px;
  position: relative;
  transition: 0.4s;
}

.pricing-control-3__indicator::before {
  content: "";
  position: absolute;
  left: 5px;
  right: auto;
  top: 5px;
  width: 25px;
  height: 25px;
  background: #f4b905;
  border-radius: 500px;
  transition: 0.4s;
}

.pricing-control-3__indicator.indicator-white.active::before {
  right: 5px !important;
  left: auto !important;
}

.pricing-control-3__indicator.indicator-white {
  background: #3147ff;
}

.pricing-control-3__indicator.indicator-white::before {
  content: "";
  left: 5px;
  top: 5px;
  right: auto;
  width: 25px;
  height: 25px;
  background: #ffffff;
}

.preloader-wrapper {
  width: 100%;
  height: 100vh;
  background: #fff;
  z-index: 99999999 !important;
  position: fixed;
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
}

.lds-ellipsis {
  display: inline-block;
  position: relative;
  width: 80px;
  height: 80px;
}

.lds-ellipsis div {
  position: absolute;
  top: 33px;
  width: 13px;
  height: 13px;
  border-radius: 50%;
  background: #3147ff;
  animation-timing-function: cubic-bezier(0, 1, 1, 0);
}

.lds-ellipsis div:nth-child(1) {
  left: 8px;
  animation: lds-ellipsis1 0.6s infinite;
}

.lds-ellipsis div:nth-child(2) {
  left: 8px;
  animation: lds-ellipsis2 0.6s infinite;
}

.lds-ellipsis div:nth-child(3) {
  left: 32px;
  animation: lds-ellipsis2 0.6s infinite;
}

.lds-ellipsis div:nth-child(4) {
  left: 56px;
  animation: lds-ellipsis3 0.6s infinite;
}

@keyframes lds-ellipsis1 {
  0% {
    transform: scale(0);
  }

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

@keyframes lds-ellipsis3 {
  0% {
    transform: scale(1);
  }

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

@keyframes lds-ellipsis2 {
  0% {
    transform: translate(0, 0);
  }

  100% {
    transform: translate(24px, 0);
  }
}

/* ========== Home 1 : Hero Section Style ============= */

/* ========== Home 1 : Service Section Style ============= */

/* ========== Home 1 : Content Section 1 Style ============= */

/* ========== Home 1 : Content Section 2 Style ============= */

/* ========= Home 1  : Portfolio Section Style ============= */

/* ========== Home 1 : FAQ Section Style ============= */

/* ========== Home 2 : Hero Section Style ============= */

/* ========== Home 2 : Feature Section Style ============= */

/* ========== Home 2 : Pricing Section Style ============= */

/* ========== Home 2 : Testimonial Section Style ============= */

/* ========== Home 2 : Content Section 1 Style ============= */

/* ========== Home 2 : Content Section 2 Style ============= */

/* ========== Home 2 : Content Section 3 Style ============= */

/* ========== Home 2 : Cta ============= */

/* ========== Home 2 : Integration Section Style ============= */

/* ========== Home 3 : Hero Section Style ============= */

/* ========== Home 3 : Video Section Style ============= */

/* ========== Home 3 : Feature Section Style ============= */

/* ========== Home 3 : Content Section 1 Style ============= */

/* ========== Home 3 : Content Section 2 Style ============= */

/* ========== Home 3 : Testimonial Section Style ============= */

/* ========== Home 3 : Cta ============= */

/* ========== Home 4 : Hero Section Style ============= */

/* ========== Home 4 : Feature Section Style ============= */

/* ========== Home 4 : Content Section 1 Style ============= */

/* ========== Home 4 : Content Section 2 Style ============= */

/* ========== Home 4 : Testimonial Section Style ============= */

/* ========== Home 4 : Topic Section Style ============= */

/* ========== Home 4 : FAQ Section Style ============= */

/* ========== Home 4 : Cta ============= */

/* ========== Home 5 : Hero Section Style ============= */

/* ========== Home 5 : Content Section 1 Style ============= */

/* ========== Home 5 : Content Section 1 Style ============= */

/* ========== Home 5 : Content Section 2 Style ============= */

/* ========== Home 5 : Pricing Section Style ============= */

/* ========== Home 5 : Testimonial Section Style ============= */

/* ========== Home 5 : Service Section Style ============= */

/* ========== Home 5 : Team Section Style ============= */

/* ========== Home 5 : Process Section Style ============= */

/*=========== Home 5 : Cta ==========*/

/* ========== Home 6 : Hero Section  Style ============= */

/* ========== Home 6 : Content Section 1 Style ============= */

/* ========== Home 6 : Content Section 2 Style ============= */

/* ========== Home 6 : Brand Section Style ============= */

/* ========== Home 6 : process Section Style ============= */

/* ========== Home 6 : process Section Style ============= */

/* ========== Home 6 : Testimonial Section Style ============= */

/* ========== Home 6 : FAQ Section Style ============= */

/*=========== Home 6 : Cta ==========*/

/* ========== Home 7 : Hero Section Style ============= */

/* ========== Home 7 : Fact Section ============= */
/* ========== Home 7 : Content Section 1 Style ============= */

/* ========== Home 7 : Content Section 2 Style ============= */

/* ========== Home 7 : Testimonial Section Style ============= */

/* ========== Home 7 : Brand Section Style ============= */

/*=========== Home 7 : Cta ==========*/

/* ========== Home 7 : Pricing Section Style ============= */

/* ========== Home 8 : Hero Section  Style ============= */

/* ========== Home 8 : Service Section Style ============= */

/* ========== Home 8 : Content Section 1 Style ============= */

/* ========== Home 8 : Content Section 2 Style ============= */

/* ========== Home 8 : Team Section Style ============= */

/* ========== Home 8 : Service Section Style ============= */

/* ========== Home 8 : Content Section 3 Style ============= */

/* ========== Home 8 : Video Section Style ============= */

/* ========== Home 8 : Blog Section Style ============= */

/* ========== Home 8 : Pricing Section Style ============= */

/*=========== Home 8 : Cta ==========*/

/* ========== Home 9 : Hero Section Style ============= */

/*=========== Home 9 : feature section style ==========*/

/* ========== Home 9 : Stats Section Style ============= */

/* ========== Home 9 : Content Section 1 Style ============= */

/* ========== Home 9 : Tab Section Style ============= */
/* ========== Home 9 : Content Section 2 Style ============= */

/* ========== Home 9 : Pricing Section Style ============= */

/* ========== Home 9 : Testimonial Section Style ============= */

/* ========== Home 9 : FAQ Section Style ============= */

/*=========== Home 9 : Cta ==========*/

.home-10_hero-section {
  background: #710dfd;
  padding-top: 80px;
}

@media (min-width: 576px) {
  .home-10_hero-section {
    padding-top: 100px;
  }
}

@media (min-width: 992px) {
  .home-10_hero-section {
    padding-top: 120px;
  }
}

@media (min-width: 1200px) {
  .home-10_hero-section {
    padding-top: 160px;
  }
}

@media (min-width: 1400px) {
  .home-10_hero-section {
    padding-top: 185px;
  }
}

.home-10_hero-section .row--custom {
  --bs-gutter-y: 30px;
  justify-content: center;
}

@media (min-width: 992px) {
  .home-10_hero-section .row--custom {
    flex-direction: row-reverse;
    align-items: center;
    justify-content: space-between;
  }
}

.home-10_hero-section-wrapper {
  border-bottom: 1px solid rgba(34, 31, 26, 0.1);
  padding-bottom: 60px;
}

@media (min-width: 576px) {
  .home-10_hero-section-wrapper {
    padding-bottom: 80px;
  }
}

.home-10_hero-content-block {
  text-align: center;
}

@media (min-width: 992px) {
  .home-10_hero-content-block {
    text-align: initial;
  }
}

.home-10_hero-content-block p {
  color: #fff;
}

@media (min-width: 992px) {
  .home-10_hero-content-block p {
    max-width: 630px;
  }
}

.home-10_hero-content-block .hero-content__title {
  font-family: "Clash Display", sans-serif;
  color: white !important;
}

.home-10_hero-text-block {
  margin-bottom: 30px;
}

@media (min-width: 992px) {
  .home-10_hero-text-block {
    font-size: white;
    margin-bottom: 50px;
  }
}

.home-10_hero-button-group {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  column-gap: 24px;
  row-gap: 24px;
}

@media (min-width: 992px) {
  .home-10_hero-button-group {
    justify-content: initial;
  }
}

.home-10_hero-button-group .btn-outline-l10:hover {
  --btn-bg: #2d2b92;
}

.home-10_button-bottom-rating {
  display: flex;
  justify-content: center;
  column-gap: 20px;
  margin-top: 24px;
}

@media (min-width: 992px) {
  .home-10_button-bottom-rating {
    justify-content: initial;
  }
}

.home-10_button-bottom-rating span {
  display: flex;
  font-weight: 400;
  font-size: 16px;
  line-height: 1.5;
  color: #fff;
  column-gap: 10px;
  position: relative;
  top: 7.5px;
}

/* ========== Home 10 : Content Section 1 Style ============= */
.home-10_content-section {
  background: #fff0d9;
  position: relative;
  z-index: 1;
}

.home-10_content-section::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: #2d2b92;
  z-index: -1;
}

@media (min-width: 768px) {
  .home-10_content-section::before {
    border-radius: 30px;
  }
}

.home-10_content-section .content p {
  font-size: 16px;
  line-height: 1.67;
  font-weight: 400;
  font-family: var(--font-family-base);
  color: rgba(255, 244, 217, 0.8);
}

@media (min-width: 576px) {
  .home-10_content-section .content p {
    font-size: 18px;
  }
}

.home-10_content-section-1 .row--custom {
  justify-content: center;
  --bs-gutter-y: 30px;
}

@media (min-width: 992px) {
  .home-10_content-section-1 .row--custom {
    --bs-gutter-x: 30px;
    justify-content: space-between;
    align-items: center;
  }
}

.home-10_content-image-1 img {
  width: 100%;
}

/* ========== Home 10 : Content Section 2 Style ============= */
.home-10_content-section-2 .row--custom {
  justify-content: center;
  --bs-gutter-y: 30px;
}

@media (min-width: 992px) {
  .home-10_content-section-2 .row--custom {
    --bs-gutter-x: 30px;
    justify-content: space-between;
    align-items: center;
  }
}

.home-10_content-section-2 .content p {
  max-width: 570px;
}

.home-10_content-section-2 .content .content-list {
  max-width: 575px;
}

.home-10_content-section-2 .content .content-list li:not(:last-child) {
  padding-bottom: 15px;
  border-bottom: 1px solid rgba(253, 251, 249, 0.1);
}

@media (min-width: 992px) {
  .home-10_content-section-2 .content .content-list li:not(:last-child) {
    padding-bottom: 25px;
  }
}

.home-10_content-section-2 .content .content-list li:not(:first-child) {
  padding-top: 15px;
}

@media (min-width: 992px) {
  .home-10_content-section-2 .content .content-list li:not(:first-child) {
    padding-top: 25px;
  }
}

.home-10_content-section-2 .content .content-list-item a {
  width: 100%;
  display: flex;
  column-gap: 8px;
  justify-content: space-between;
  font-size: 26px;
  font-weight: 500;
  letter-spacing: 0.038461538em;
  font-family: "Public Sans", sans-serif;
  line-height: 1.23;
  font-size: 18px;
  font-family: "Clash Display", sans-serif;
  color: #fdfbf9;
}

@media (min-width: 768px) {
  .home-10_content-section-2 .content .content-list-item a {
    font-size: 22px;
  }
}

@media (min-width: 1200px) {
  .home-10_content-section-2 .content .content-list-item a {
    font-size: 26px;
  }
}

.home-10_content-section-2 .content .content-list-item a i {
  display: block;
  transform: rotate(335deg);
}

.home-10_content-section-2 .content .content-list-item a:hover {
  color: #ffd874;
}

.home-10_content-image-2 {
  position: relative;
}

.home-10_content-image-2 img {
  width: 100%;
}

.home-10_content-image-2-card {
  position: absolute;
  bottom: 17.2%;
  left: -8%;
  width: 99.7%;
}

.home-10_content-image-2-card img {
  box-shadow: 0px 4.49307px 89.8615px rgba(0, 0, 0, 0.15);
  border-radius: 11.2327px;
}

.home-10_process-section {
  background: #fff0d9;
}

.home-10_section-heading {
  margin-bottom: 60px;
}

@media (min-width: 992px) {
  .home-10_section-heading {
    margin-bottom: 80px;
  }
}

.home-10_section-heading__title {
  font-size: 32px;
  font-weight: 500;
  line-height: 0.94;
  font-family: "Clash Display", sans-serif;
  letter-spacing: -1px;
  color: #221f1a;
}

@media (min-width: 576px) {
  .home-10_section-heading__title {
    font-size: 40px;
  }
}

@media (min-width: 992px) {
  .home-10_section-heading__title {
    font-size: 46px;
  }
}

@media (min-width: 1200px) {
  .home-10_section-heading__title {
    font-size: 60px;
  }
}

/* ========== Home 10 : Testimonial Section Style ============= */

/* ========== Home 10 : Integration Section Style ============= */

/* ========== Home 10 : Faq Section  Style ============= */

/* ========== Home 10 : Service Section Style ============= */

/* ========== Home 9 : Service Section Style ============= */

/*=========== Home 10 : Cta ==========*/
.cta-home-10 {
  padding-top: 80px;
  background: #fff0d9;
  position: relative;
  z-index: 1;
}

.cta-home-10::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: var(--l10-primary);
  z-index: -1;
}

@media (min-width: 768px) {
  .cta-home-10::before {
    border-radius: 30px 30px 0 0;
  }
}

.cta-home-10 .cta-content-block {
  padding-bottom: 80px;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  row-gap: 30px;
  position: relative;
  z-index: 2;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

@media (min-width: 576px) {
  .cta-home-10 .cta-content-block {
    padding-bottom: 100px;
  }
}

@media (min-width: 992px) {
  .cta-home-10 .cta-content-block {
    row-gap: 50px;
  }
}

.cta-home-10 .cta-content-block .cta-text-block {
  margin-right: auto;
  margin-left: auto;
  max-width: 425px;
}

@media (min-width: 576px) {
  .cta-home-10 .cta-content-block .cta-text-block {
    max-width: 540px;
  }
}

@media (min-width: 992px) {
  .cta-home-10 .cta-content-block .cta-text-block {
    max-width: 620px;
  }
}

@media (min-width: 1200px) {
  .cta-home-10 .cta-content-block .cta-text-block {
    max-width: 720px;
  }
}

/* ========== about : Banner Section Style ============= */

/* ========== about : Content Section Style ============= */

/* ========== about : Feature Section Style ============= */

/* ========= Home 1  : Portfolio Section Style ============= */

/* ========== about : Content Section Style ============= */

/* ========== service : Pricing Section Style ============= */

/* ========== service Details Main Section Style ============= */

/*=========== CTA Base ==========*/

/* Footer Title Common */
.footer-title {
  font-family: var(--font-family-base);
  margin-bottom: 30px;
  font-size: 18px;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: 0em;
}

@media (min-width: 576px) {
  .footer-title {
    font-size: 20px;
  }
}

.copyright-border {
  border-top-width: 1px;
  border-top-style: solid;
  border-color: rgba(var(--body-color-rgb), 0.1);
}

.copyright-inner {
  padding-top: 18px;
  padding-bottom: 18px;
  margin-top: 40px;
}

@media (min-width: 576px) {
  .copyright-inner {
    margin-top: 60px;
  }
}

@media (min-width: 992px) {
  .copyright-inner {
    margin-top: 80px;
  }
}

.copyright-inner p {
  font-size: 16px;
  margin-bottom: 0;
}

.footer-list {
  display: flex;
  flex-direction: column;
  row-gap: 17px;
  margin-bottom: 0;
  font-size: 16px;
  line-height: 1.4;
  font-weight: 600;
  font-weight: 400;
}

@media (min-width: 576px) {
  .footer-list {
    font-size: 18px;
  }
}

.footer-list a {
  color: var(--body-color);
}

/* Footer Dark and Light Global */
[class*="footer--dark"] {
  color: rgba(255, 255, 255, 0.8);
}

[class*="footer--dark"] p {
  color: inherit;
}

[class*="footer--dark"] .footer-title {
  color: #fff;
}

[class*="footer--dark"] a {
  color: rgba(255, 255, 255, 0.8);
}

[class*="footer--dark"] .copyright-border {
  border-color: rgba(255, 255, 255, 0.1);
}

/* Footer Section Padding */
.footer-padding-default {
  padding-top: 60px;
}

@media (min-width: 576px) {
  .footer-padding-default {
    padding-top: 80px;
  }
}

/* Footer Variations By Color */
.footer--dark-v1 {
  background: #0a102f;
}

.footer--dark-v1 .list-social {
  --color: #fff;
  --backgroundColor: rgba(255, 255, 255, 0.1);
  --hovBackground: #3147ff;
  --hovColor: #fff;
}

.footer--dark-v1 .copyright-inner {
  border: 0;
}

.footer--dark-v1 .copyright-block {
  background: rgba(255, 255, 255, 0.05);
}

/* Footer Variations By Color */

.footer-l10 {
  background-color: var(--l10-primary);
}

.footer-l10 .list-social li a:hover {
  background-color: var(--l10-secondary);
  color: var(--l10-primary);
}

.footer-l10 a:hover {
  color: var(--l10-secondary);
}

/* ==========  Footer Style v1  ============= */
.footer {
  font-size: 16px;
  line-height: 1.4;
  font-weight: 400;
}

@media (min-width: 576px) {
  .footer {
    font-size: 18px;
  }
}

.footer__content-block {
  max-width: 416px;
}

.footer__content-block .footer-brand {
  margin-bottom: 33px;
}

.footer__content-text {
  margin-bottom: 24px;
}

.footer a.footer-link {
  text-decoration: underline;
  margin-bottom: 24px;
}

.footer .row--list-block {
  justify-content: space-between;
  --bs-gutter-y: 40px;
}

.footer .row--footer-main {
  --bs-gutter-y: 40px;
}

/* ==========  Footer Style v2  ============= */

/* ==========  Footer Style v2  ============= */

/* ========== Brand Section Style ============= */
.brand-section .brands-wrapper-inner {
  padding-top: 30px;
  padding-bottom: 30px;
}

@media (min-width: 576px) {
  .brand-section .brands-wrapper-inner {
    padding-top: 30px;
    padding-bottom: 30px;
  }
}

@media (min-width: 992px) {
  .brand-section .brands-wrapper-inner {
    padding-top: 30px;
    padding-bottom: 30px;
  }
}

.brand-section .brands-wrapper {
  display: flex;
  flex-wrap: wrap;
  row-gap: 35px;
  justify-content: center;
}

@media (min-width: 1200px) {
  .brand-section .brands-wrapper {
    justify-content: space-between;
  }
}

.brand-section .brands-wrapper.filter-grayscale img {
  width: 100%;
  max-width: auto;
}

@media (min-width: 1200px) {
  .brand-section .brands-wrapper.filter-grayscale img {
    width: auto;
    max-width: 100%;
  }
}

.brand-section .single-brand {
  padding-left: 15px;
  padding-right: 15px;
  width: 51%;
}

@media (min-width: 480px) {
  .brand-section .single-brand {
    width: 50%;
  }
}

@media (min-width: 768px) {
  .brand-section .single-brand {
    width: 33.333%;
  }
}

@media (min-width: 992px) {
  .brand-section .single-brand {
    width: 20%;
  }
}

@media (min-width: 1200px) {
  .brand-section .single-brand {
    width: auto;
  }
}

.brand-section .single-brand img {
  max-width: 100%;
}

/* ========== Testimonial masonry layout ============= */

/* ========== Component : banner Style  ============= */

/* ========== Contact main Section Style ============= */

/* ========== Contact location Style ============= */

/* ========== Contact Page 3 main Section Style ============= */

/* ========== Home 7 : Content Section 2 Style ============= */

/* ========== Home 7 : Content Section 2 Style ============= */
.pricing-2_main_pricing-section .section-heading {
  max-width: 600px;
  margin: 0 auto;
}

.pricing-2_main-pricing-control-block {
  margin-top: 30px;
  margin-bottom: 35px;
}

@media (min-width: 992px) {
  .pricing-2_main-pricing-control-block {
    margin-top: 50px;
    margin-bottom: 60px;
  }
}

/* ========== Blog Main Style ============= */

/* ========== Contact main Section Style ============= */

/* ========== Blog Main Style ============= */

/* ========== Career Main Style ============= */

/* ========== Career Details Main Style ============= */

/* Common: Background Colors */

/* Common: Background Image */

/* Common: Positioning */
.absolute-center {
  position: absolute;
  z-index: 1;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
}

/* ========== Section Button   ============= */

/* ========== Common: Spacing Combos  ============= */

.section-padding-120 {
  padding-top: 60px;
  padding-bottom: 60px;
}

@media (min-width: 676px) {
  .section-padding-120 {
    padding-top: 80px;
    padding-bottom: 80px;
  }
}

@media (min-width: 992px) {
  .section-padding-120 {
    padding-top: 100px;
    padding-bottom: 100px;
  }
}

@media (min-width: 1200px) {
  .section-padding-120 {
    padding-top: 120px;
    padding-bottom: 120px;
  }
}

.padding-top-120 {
  padding-top: 60px;
}

@media (min-width: 576px) {
  .padding-top-120 {
    padding-top: 80px;
  }
}

@media (min-width: 992px) {
  .padding-top-120 {
    padding-top: 120px;
  }
}

.padding-bottom-120 {
  padding-bottom: 60px;
}

@media (min-width: 576px) {
  .padding-bottom-120 {
    padding-bottom: 80px;
  }
}

@media (min-width: 992px) {
  .padding-bottom-120 {
    padding-bottom: 120px;
  }
}

.padding-bottom-150 {
  padding-bottom: 60px;
}

@media (min-width: 576px) {
  .padding-bottom-150 {
    padding-bottom: 80px;
  }
}

@media (min-width: 992px) {
  .padding-bottom-150 {
    padding-bottom: 120px;
  }
}

@media (min-width: 1200px) {
  .padding-bottom-150 {
    padding-bottom: 150px;
  }
}

/* ----------------------------
Common: Spacing Utilities
-------------------------------*/

/* ----------------------------
Common: Responsive Spacer
-------------------------------*/

/* ----------------------------
Common: Spacing Gutters
-------------------------------*/

.gutter-y-30 {
  --bs-gutter-y: 30px;
}

/* Common: Section Heading */
.section-heading {
  margin-bottom: 40px;
}

@media (min-width: 575px) {
  .section-heading {
    margin-bottom: 60px;
  }
}

@media (min-width: 992px) {
  .section-heading {
    margin-bottom: 80px;
  }
}

.heading-xl {
  line-height: 1.11;
  font-size: 38px;
  font-weight: 800;
  letter-spacing: -0.0111111111em;
  margin-bottom: 24px;
}

@media (min-width: 480px) {
  .heading-xl {
    font-size: 42px;
  }
}

@media (min-width: 576px) {
  .heading-xl {
    font-size: 48px;
  }
}

@media (min-width: 992px) {
  .heading-xl {
    font-size: 64px;
  }
}

@media (min-width: 1200px) {
  .heading-xl {
    font-size: 76px;
  }
}

@media (min-width: 1400px) {
  .heading-xl {
    font-size: 90px;
  }
}

.heading-xl--v2 {
  line-height: 1.11;
  font-size: 38px;
  font-weight: 500;
  letter-spacing: -0.0111111111em;
  letter-spacing: initial;
  line-height: 1.07;
}

@media (min-width: 480px) {
  .heading-xl--v2 {
    font-size: 42px;
  }
}

@media (min-width: 576px) {
  .heading-xl--v2 {
    font-size: 48px;
  }
}

@media (min-width: 992px) {
  .heading-xl--v2 {
    font-size: 64px;
  }
}

@media (min-width: 1200px) {
  .heading-xl--v2 {
    font-size: 76px;
  }
}

@media (min-width: 1400px) {
  .heading-xl--v2 {
    font-size: 90px;
  }
}

.heading-md {
  font-size: 32px;
  line-height: 1.26;
  font-weight: 800;
  margin-bottom: 20px;
}

@media (min-width: 576px) {
  .heading-md {
    font-size: 38px;
  }
}

@media (min-width: 992px) {
  .heading-md {
    font-size: 42px;
  }
}

@media (min-width: 1200px) {
  .heading-md {
    font-size: 46px;
  }
}

.heading-md--v3 {
  font-size: 34px;
  line-height: 1.2;
  font-weight: 800;
}

@media (min-width: 576px) {
  .heading-md--v3 {
    font-size: 38px;
  }
}

@media (min-width: 992px) {
  .heading-md--v3 {
    font-size: 44px;
  }
}

@media (min-width: 1200px) {
  .heading-md--v3 {
    font-size: 50px;
  }
}

.heading-lg {
  font-size: 32px;
  line-height: 1.14;
  font-weight: 700;
  font-family: "Public Sans", sans-serif;
  margin-bottom: 20px;
}

@media (min-width: 576px) {
  .heading-lg {
    font-size: 42px;
  }
}

@media (min-width: 992px) {
  .heading-lg {
    font-size: 52px;
  }
}

@media (min-width: 1200px) {
  .heading-lg {
    font-size: 56px;
  }
}

.heading-lg--clash-display {
  font-size: 32px;
  font-weight: 500;
  line-height: 0.94;
  font-family: "Clash Display", sans-serif;
  line-height: 1.13;
  font-weight: 500;
}

@media (min-width: 576px) {
  .heading-lg--clash-display {
    font-size: 40px;
  }
}

@media (min-width: 992px) {
  .heading-lg--clash-display {
    font-size: 46px;
  }
}

@media (min-width: 1200px) {
  .heading-lg--clash-display {
    font-size: 60px;
  }
}

/******* Utility Classes ********/

/******* Utility Text Colors ********/

/******* Utility Background Colors ********/

.bg-offwhite-2 {
  background: #ead9ff;
}

.text-black-3 {
  color: #221f1a;
}

.text-offwhite-2 {
  color: #fff0d9;
}

.hero-button-container {
  text-align: center;
  margin-top: 20px;
}

.hero-video-button {
  display: inline-block;
  padding: 12px 25px;
  background-color: #4b0082;
  /* Dark purple */
  color: #ffffff;
  font-size: 1rem;
  font-weight: 600;
  text-align: center;
  border-radius: 50px;
  cursor: pointer;
  transition: background-color 0.3s ease, transform 0.2s ease;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
  border: none;
}

.hero-video-button:hover {
  background-color: #663399;
  transform: translateY(-3px);
}

/* Modal Background */
.modal {
  display: none;
  /* Hidden by default */
  position: fixed;
  z-index: 1000;
  /* Ensure it appears above all other content */
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  /* Allow modal scrolling if content exceeds screen */
  background-color: rgba(0, 0, 0, 0.5);
  /* Dimmed background */
  justify-content: center;
  align-items: center;
}

/* Modal Content */
.modal-content {
  background-color: #6200ea;
  padding: 30px;
  /* Added padding for better spacing */
  border-radius: 15px;
  text-align: center;
  color: white;
  width: 450px;
  /* Slightly wider for better layout */
  box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.3);
  position: relative;
}

/* Close Button */
.modal-content .close {
  position: absolute;
  top: 10px;
  right: 10px;
  /* Adjusted to move further from the content */
  color: white;
  font-size: 32px;
  /* Increased size for better visibility */
  font-weight: bold;
  cursor: pointer;
}

/* Promo Code Container */
.promo-code-container {
  margin-top: 30px;
  /* Increased margin for more spacing */
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 15px;
  /* Increased gap for more space between elements */
}

/* Promo Code */
.promo-code {
  display: inline-block;
  background-color: #2c48e4;
  color: white;
  padding: 12px 25px;
  /* Adjusted padding for more clickable area */
  border-radius: 8px;
  font-size: 24px;
  font-weight: bold;
  user-select: all;
  /* Allow users to copy the promo code */
  box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.3);
}

/* Copy Icon */
.copy-icon {
  background: none;
  border: none;
  color: white;
  font-size: 22px;
  /* Slightly larger for better clickability */
  cursor: pointer;
  padding: 5px;
  border-radius: 50%;
  transition: background-color 0.3s ease;
}

.copy-icon:hover {
  background-color: rgba(255, 255, 255, 0.2);
}

/* Fix the training page header background */
.training-header {
  background-color: #4b2aad !important;
  /* Dark purple */
  text-align: center;
}

/* Ensure training page title text is white */
.training-header h1 {
  color: #ffffff !important;
  font-size: 36px;
  font-weight: bold;
}

/* Fix training page paragraph text color */
.training-header p {
  color: #e0e0e0 !important;
  /* Light gray for contrast */
  font-size: 18px;
}

/* Restrict the width of the training description */
.training-description {
  max-width: 800px;
  /* Limits width to a readable size */
  margin: 0 auto;
  /* Centers it */
  text-align: left;
  /* Keeps text aligned */
  font-size: 18px;
  line-height: 1.6;
  /* Improves readability */
  padding: 2%;
}

/* Full-width background with the training module color */
.training-section {
  background-color: var(--l2-primary);
  /* Matches the module's purple */
  padding: 4rem 0;
  width: 100%;
  margin-top: 80px;
}

/* Centered container for content */
.training-container {
  max-width: 800px;
  /* Limits width for better readability */
  margin: 0 auto;
  text-align: center;
  color: white;
}

/* Ensures the paragraph width isn't too wide */
.training-container p {
  max-width: 650px;
  margin: 0 auto;
  font-size: 18px;
  line-height: 1.6;
}

/* Centering the Stripe payment button */
.stripe-payment {
  display: flex;
  justify-content: center;
  margin-top: 2rem;
}

.highlight-stat {
  font-weight: 700;
  font-size: 1.3em;
  display: inline-block;
  margin-bottom: 4px;
}