:root {
   --tabsH: 64px;
   --tabs-sticky-height: 64px;
   --tabs-sticky-gap: 8px;
   --stackTop: calc(var(--tabsH) + 18px);
}

@media (max-width: 560px) {
   :root {
      --tabsH: 92px;
   }
}

/*  hero-content styles start  */
.hero-section {
   padding-top: 36px;
   position: relative;
   z-index: 1;
}

@media (min-width:992px) {
   .hero-section {
      padding-top: 72px;
   }
}

.hero-content .tagline {
   border-radius: 16px;
   border: 1px solid var(--purple-light-border);
   background: rgba(80, 76, 160, 0.25);
   color: var(--white);
   text-align: center;
   font-family: var(--font-nunito);
   font-size: var(--font-12);
   font-weight: 400;
   font-style: normal;
}

.hero-content .sub-heading {
   color: var(--white);
   text-align: left;
   font-family: var(--font-nunito);
   font-size: var(--font-28);
   font-style: normal;
   font-weight: 700;
   line-height: normal;
}

.hero-content .heading {
   font-family: var(--font-sora);
   font-size: var(--font-36);
   font-style: normal;
   font-weight: 700;
   line-height: normal;
   background: linear-gradient(92deg, #FFF 10.68%, #C75ED5 49.46%, #5F20BE 88.24%);
   background-clip: text;
   -webkit-background-clip: text;
   -webkit-text-fill-color: transparent;
   text-align: left;
}

.hero-content .heading span {
   display: block;
}

.hero-content .sub-item {
   text-align: left;
}

.hero-content .sub-item:nth-child(2) {
   border: 1px solid var(--white);
   width: 1px;
   background: var(--white);
   opacity: 0.3;
}

.hero-content .batch-info {
   color: var(--white);
   font-family: var(--font-nunito);
   font-size: var(--font-16);
   font-style: normal;
   font-weight: 700;
   line-height: normal;
}

.hero-content .batch-info .batch-date {
   color: var(--amethyst-purple);
   position: relative;
   padding: 16px;
}

.hero-content .batch-info .batch-date img {
   position: absolute;
   top: 2px;
   left: 8px;
   z-index: 1;
   max-width: 100%;
   height: auto;
}

.hero-content .batch-info .batch-date span {
   position: relative;
   z-index: 2;
   margin-left: 16px;
}

/*  hero-content styles end  */


/*--------  course-credibility styles start  ----------*/
.course-credibility .course-credibility-inner {
   border-radius: 24px;
   border: 1px solid var(--purple-light-border);
   background: rgba(80, 76, 160, 0.25);
   color: var(--white);
   font-family: var(--font-nunito);
   color: var(--white);
   font-size: var(--font-16);
   font-style: normal;
   font-weight: 700;
   line-height: normal;
}

.course-credibility .course-credibility-inner .me-credibility {
   border-radius: 36px;
   border: 1px solid rgba(255, 205, 5, 0.50);
   background: rgba(255, 205, 5, 0.25);
}

.course-credibility .course-credibility-inner .learner-count {
   border-radius: 36px;
   border: 1px solid var(--purple-light-border);
   background: var(--purple-light);
}

/*--------  course-credibility styles end  ----------*/


.program-highlights .program-highlight-item {
   color: var(--white);
   font-family: var(--font-nunito);
   font-size: var(--font-16);
   font-style: normal;
   font-weight: 400;
   line-height: normal;
   border-radius: 16px;
   border: 1px solid var(--purple-light-border);
   background: var(--purple-light);
   padding: 16px;
   height: 100%;
}

@media (min-width:992px) {
   .program-highlights .program-highlight-item svg {
      width: 30px;
   }
}

/* .wrap {
   margin: 40px auto;
   padding: 0 16px 90px;
} */

/* ===== Sticky Tabs ===== */

.sticky-tabs-wrap {
   position: sticky;
   top: calc(var(--nav-sticky-offset, 0px) + var(--tabs-sticky-gap));
   z-index: 1100;
   display: block;
   padding: 6px 0;
}

.sticky-tabs-wrap .row {
   margin-left: 0;
   margin-right: 0;
}

.sticky-tabs-wrap .col-12 {
   padding-left: 0;
   padding-right: 0;
}

.sticky-tabs-wrap.is-stuck .course-tabs {
   border-color: rgba(124, 92, 255, .45);
   box-shadow: 0 10px 24px rgba(0, 0, 0, 0.25);
}

.course-tabs {
   position: relative;
   padding: 10px 0;
   backdrop-filter: blur(10px);
   box-shadow: 0 4px 16px 0 rgba(0, 0, 0, 0.12);
   border-radius: 16px;
   border: 1px solid #504CA0;
   background: var(--courses-Purple-Purple-Light, rgba(80, 76, 160, 0.60));
}


.tabs-inner {
   display: flex;
   gap: 10px;
   flex-wrap: wrap;
   align-items: center;
   /* max-width: var(--maxWidth); */
   margin: 0 auto;
   padding: 0 16px;
}

.tab {
   display: inline-flex;
   align-items: center;
   padding: 10px 14px;
   border: 1px solid rgba(255, 255, 255, .10);
   background: rgba(255, 255, 255, .03);
   border-radius: 999px;
   text-decoration: none;
   font-size: var(--font-14);
   font-family: var(--font-nunito);
   transition: .2s ease;
   white-space: nowrap;
   user-select: none;
   color: var(--white);
}

.tab:hover {
   transform: translateY(-1px);
   color: var(--white);
}

.tab.active {
   color: #fff;
   border-color: rgba(124, 92, 255, .55);
   background: #080808a3;
}

@media (max-width: 768px) {
   .course-tabs {
      border-radius: 12px;
      padding: 8px 0;
   }

   .tabs-inner {
      flex-wrap: nowrap;
      overflow-x: auto;
      overflow-y: hidden;
      -webkit-overflow-scrolling: touch;
      scrollbar-width: none;
      padding: 0 10px;
   }

   .tabs-inner::-webkit-scrollbar {
      display: none;
   }

   .tab {
      flex: 0 0 auto;
   }

   .sticky-tabs-wrap {
      padding-top: 4px;
      padding-bottom: 4px;
   }
}

/* ===== Sections ===== */
.detail-block {
   padding: 12px 0;
   /* border-bottom: 1px dashed rgba(255, 255, 255, .10); */
   scroll-margin-top: calc(var(--nav-sticky-offset, 0px) + var(--tabs-sticky-height, var(--tabsH)) + 18px);
}

.detail-block h2 {
   margin: 0 0 10px;
   font-size: 22px;
   letter-spacing: .2px;
}


.nice-list {
   margin: 10px 0 0;
   padding-left: 18px;
}

.nice-list li {
   margin: 8px 0;
}

/* ===== Module stacked sticky cards ===== */
.module-stack {
   margin-top: 18px;
   padding-bottom: 30px;
}

.module-card {
   position: sticky;
   top: var(--stackTop);
   z-index: calc(100 + var(--i));
   border-radius: var(--radius-16);
   border: 1px solid var(--purple-light-border);
   border-radius: 16px;
   background: var(--courses-Purple-Purple-Dark, #504CA0);
   padding: 18px 18px 16px;
   margin-bottom: 18px;
   transform: translateY(calc((var(--i) - 1) * 8px));
}

.module-head {
   display: flex;
   justify-content: space-between;
   gap: 16px;
   align-items: flex-start;
}

.pill {
   color: var(--white);
   font-family: var(--font-nunito);
   font-size: var(--font-16);
   font-style: normal;
   font-weight: 700;
   line-height: normal;
   text-transform: uppercase;
   margin-bottom: 16px;
}

.module-head h3 {
   font-family: var(--font-sora);
   font-size: var(--font-18);
   color: var(--white);
}

.time-pill {
   display: inline-flex;
   align-items: center;
   gap: 8px;
   font-size: var(--font-12);
   padding: 8px 12px;
   border-radius: var(--radius-16);
   background: #7951A1;
   color: rgba(255, 255, 255, .78);
   white-space: nowrap;
   font-family: var(--font-nunito);
}

/* content area inside module */
.module-content {
   margin-top: 14px;
   color: rgba(255, 255, 255, .78);
}

.module-points {
   margin: 0;
   padding-left: 18px;
}

.module-points li {
   margin: 8px 0;
}

/* ===== Long text management (Clamp + Read More) ===== */
.clamp {
   max-height: 260px;
   overflow: hidden;
   position: relative;
   border-radius: var(--radius-16);
   font-family: var(--font-nunito);
}

.clamp::after {
   content: "";
   position: absolute;
   left: 0;
   right: 0;
   bottom: 0;
   height: 74px;
   /* background: linear-gradient(to bottom, transparent, rgba(12, 15, 26, .95)); */
   pointer-events: none;
}

.clamp.expanded {
   max-height: none;
   overflow: visible;
}

.clamp.expanded::after {
   display: none;
}

.module-actions {
   display: flex;
   gap: 10px;
   margin-top: 16px;
   flex-wrap: wrap;
}

.btn {
   appearance: none;
   border: 1px solid rgba(255, 255, 255, .12);
   background: rgba(255, 255, 255, .05);
   color: rgba(255, 255, 255, .88);
   padding: 10px 14px;
   border-radius: 999px;
   cursor: pointer;
   transition: .2s ease;
   font-size: 14px;
   user-select: none;
}

.btn:hover {
   transform: translateY(-1px);
   border-color: rgba(124, 92, 255, .55);
}

/* .btn.primary {
   border-color: rgba(124, 92, 255, .55);
   background: linear-gradient(135deg, rgba(124, 92, 255, .30), rgba(92, 141, 255, .18));
} */

/* small screens */
@media (max-width: 560px) {
   .module-head {
      flex-direction: column;
      align-items: flex-start;
   }
}

/* ========================
   Contact Sidebar Form
======================== */
.contact-sidebar__form {
   background: var(--purple-light);
   border-radius: var(--radius-16);
   border: 1px solid var(--purple-light-border);
}

.contact-sidebar__title {
   color: var(--white);
   font-size: var(--font-18);
   font-family: var(--font-nunito);
   font-weight: 700;
}

.contact-sidebar__form input,
input {
   width: 100%;
   padding: 12px 16px;
   border-radius: var(--radius-8);
   border: 1px solid var(--border-grey);
   background: var(--white);
   font-family: var(--font-nunito);
   font-size: var(--font-14);
   font-weight: 400;
   line-height: normal;
   color: var(--dark-grey);
}

.contact-sidebar__form input:focus,
input:focus {
   outline: none;
}

.contact-sidebar__form input[type="checkbox"],
input[type="checkbox"] {
   width: auto;
   accent-color: var(--white);
   margin-top: 4px;
}

.contact-sidebar__form .form-checkbox {
   font-size: var(--font-14);
   color: var(--white);
   font-family: var(--font-nunito);
}

.contact-sidebar__form .form-checkbox span a {
   color: var(--white);
}

.contact-sidebar__form button {
   width: 100%;
}

.error-message {
   font-size: var(--font-12);
   font-family: var(--font-nunito);
   color: var(--white);
   margin-top: 2px;
}

.modal-body .error-message {
   color: var(--white);
}


.custom-loader {
   width: 50px;
   height: 50px;
   border: 5px solid #eee;
   border-top: 5px solid #6c3bd1;
   /* purple color */
   border-radius: 50%;
   animation: spin 1s linear infinite;
   margin: 0 auto;
}

@keyframes spin {
   0% {
      transform: rotate(0deg);
   }

   100% {
      transform: rotate(360deg);
   }
}

/* ========================
   Contact Sidebar Helpline
======================== */
.contact-sidebar__helpline {
   background: var(--purple-light);
   border-radius: var(--radius-16);
   border: 1px solid var(--purple-light-border);
   color: var(--white);
}

.contact-sidebar__helpline .contact-sidebar__title {
   font-size: var(--font-16);
   font-weight: 700;
   font-family: var(--font-nunito);
}

.contact-sidebar__helpline .contact-sidebar__helpline-item {
   display: flex;
   align-items: center;
   gap: 12px;
   /* you can adjust spacing */
   text-decoration: none;
   margin-bottom: 12px;
   /* spacing between items */
}

.contact-sidebar__helpline .contact-sidebar__helpline-item .contact-sidebar__flag {
   width: 42px;
   height: 24px;
   display: block;
}

.contact-sidebar__helpline .contact-sidebar__helpline-item .contact-sidebar__number {
   color: var(--white);
   font-family: var(--font-nunito);
   font-size: var(--font-16);
   font-weight: 500;
   line-height: normal;
}

.contact-sidebar__helpline-label {
   display: block;
   margin-top: 16px;
   font-size: var(--font-14);
   color: var(--white);
   font-family: var(--font-nunito);
   font-weight: 500;
}


/* training calendar sec start */
.training-calendar table.table_training {
   width: 100%;
   border: 1px solid var(--purple-light);
   border-radius: var(--radius-16);
   overflow: hidden;
   border-spacing: 0;
   font-family: var(--font-nunito);
}

.training-calendar table.table_training th {
   background: var(--purple-dark);

}

.training-calendar table.table_training td,
.training-calendar table.table_training th {
   padding: 16px;
   font-size: var(--font-16);
   color: var(--white);
   border-bottom: 1px solid var(--purple-light);
   text-align: left;
}

.training-calendar table.table_training tr:last-child td {
   border-bottom: 0;
}

.training-calendar table.table_training td a.href_toscroll {
   padding: 8px 24px;
   border-radius: var(--radius-8);
   background: radial-gradient(67.87% 119.58% at 51.2% 82.38%, rgba(255, 204, 0, 0.50) 0%, rgba(220, 85, 0, 0.50) 100%);
   border: none;
   font-size: var(--font-14);
   font-weight: 600;
   text-decoration: none;
}

.training-calendar .upcomming-batch-form {
   border: 1px solid var(--purple-light-border);
   background: var(--purple-dark);
   border-radius: var(--radius-16);
   padding: 24px;
}

.training-calendar .upcomming-batch-form h3 {
   color: var(--white);
   font-family: var(--font-nunito);
   font-size: var(--font-18);
   font-weight: 700;
   line-height: 1.3;
   margin: 0;
}

.training-calendar .upcomming-batch-notify-form {
   display: flex;
   align-items: center;
   justify-content: flex-end;
   gap: 12px;
   flex-wrap: wrap;
}

.training-calendar .upcomming-batch-notify-form input {
   flex: 1 1 180px;
   min-height: 42px;
   border: 1px solid var(--border-grey);
   border-radius: var(--radius-8);
   background: var(--grey);
   color: var(--dark-grey);
   font-family: var(--font-nunito);
   font-size: var(--font-16);
   font-weight: 500;
   line-height: normal;
}

.training-calendar .upcomming-batch-notify-form input::placeholder {
   color: var(--dark-grey);
   opacity: 1;
}

.training-calendar .upcomming-batch-notify-form input:focus {
   border-color: var(--purple-dark);
   outline: none;
}

.training-calendar .upcomming-batch-notify-btn {
   border: 0;
   border-radius: var(--radius-8);
   background: var(--btn-default);
   color: var(--white);
   font-family: var(--font-nunito);
   font-size: var(--font-16);
   font-weight: 700;
   line-height: normal;
   text-transform: uppercase;
   min-height: 42px;
   padding: 12px 24px;
   white-space: nowrap;
   cursor: pointer;
}

.training-calendar .upcomming-batch-notify-btn:disabled {
   opacity: 0.7;
   cursor: not-allowed;
}

.training-calendar .upcomming-batch-notify-form input.error {
   background: var(--red);
   color: var(--white);
}

.training-calendar .upcomming-batch-notify-form input.error::placeholder {
   color: var(--white);
}

.training-calendar .upcomming-batch-notify-feedback {
   flex: 1 1 100%;
   margin-top: 4px;
   font-family: var(--font-nunito);
   font-size: var(--font-14);
   line-height: normal;
}

.training-calendar .upcomming-batch-notify-feedback.is-error {
   color: var(--light-red);
}

.training-calendar .upcomming-batch-notify-feedback.is-success {
   color: var(--white);
}


@media (max-width:991px) {
   .training-calendar .upcomming-batch-form {
      padding: 16px;
   }

   .training-calendar .upcomming-batch-form h3 {
      font-size: var(--font-18);
   }

   .training-calendar .upcomming-batch-notify-form {
      justify-content: flex-start;
   }

   .training-calendar .upcomming-batch-notify-form input,
   .training-calendar .upcomming-batch-notify-btn {
      width: 100%;
      flex: 1 1 100%;
   }
}

@media (max-width:768px) {
   thead {
      display: none;
   }

   .row-2 td::before {
      content: attr(data-label);
      font-size: var(--font-14);
      font-family: Nunito Sans;
      font-weight: 500;
      text-align: left;
   }

   .training-calendar table.table_training td {
      display: flex;
      justify-content: space-between;
      gap: 16px;
      text-align: right;
      padding: 8px 12px;
      font-size: var(--font-14);
   }
}

/* training calendar sec end */

.benefits-sec .course-salary-info {
   background: var(--purple-dark);
   border-radius: var(--radius-16);
   height: 100%;
}

.benefits-sec .course-salary-info span {
   color: var(--white);
   font-family: var(--font-nunito);
   font-size: var(--font-16);
   font-style: normal;
   font-weight: 400;
   line-height: normal;
   text-align: left;
}

.benefits-sec .salary-card {
   width: min(980px, 100%);
   margin: 0 auto;
   background: var(--white);
   border-radius: var(--radius-16);
   padding: 16px;
   box-shadow: 0 0 0 1px rgba(0, 0, 0, .03) inset;
   font-family: var(--font-nunito);
}

.benefits-sec .card-title {
   font-weight: 700;
   font-size: var(--font-18);
   margin-bottom: 16px;
}

/* MOBILE scroll */
.benefits-sec .chart-shell {
   width: 100%;
}

/* WRAPPER: chart area + labels area */
.benefits-sec .chart-wrap {
   display: grid;
   grid-template-rows: auto auto;
   /* chart + labels */
   gap: 8px;
}

/* CHART (only axes & bars live here) */
.benefits-sec .chart {
   position: relative;
   height: clamp(210px, 34vw, 320px);
   border-left: 1.6px solid var(--dark-grey);
   border-bottom: 1.6px solid var(--dark-grey);
   padding: 10px 6px 0 6px;
   display: grid;
   grid-template-columns: repeat(5, minmax(0, 1fr));
   gap: clamp(10px, 2.6vw, 30px);
   align-items: end;
   padding: 26px 6px 0 6px;
}

/* dotted vertical gridlines */
/* .chart::before {
   content: "";
   position: absolute;
   inset: 0;
   pointer-events: none;
   background-image:
      repeating-linear-gradient(to right,
         transparent 0,
         transparent calc(20% - 1px),
         var(--dark-grey) calc(20% - 1px),
         var(--dark-grey) calc(20%),
         transparent calc(20%));
} */

/* each column inside chart */
.benefits-sec .bar-col {
   height: 100%;
   display: flex;
   justify-content: center;
   align-items: flex-end;
   position: relative;
   z-index: 1;
}

.benefits-sec .bar-wrap {
   width: min(34px, 6vw);
   height: 100%;
   position: relative;
   display: flex;
   align-items: flex-end;
   justify-content: center;
}

/* IMPORTANT: bar touches bottom border */
.benefits-sec .bar {
   width: 100%;
   height: calc(var(--h) * 1%);
   background: var(--amethyst-purple);
   border-radius: 4px 4px 0 0;
   box-shadow: 0 1px 0 rgba(255, 255, 255, .35) inset;
   margin-bottom: 0;
   /* ensure no gap */
}

/* value stays above bar */
.benefits-sec .value {
   position: absolute;
   left: 50%;
   bottom: calc((var(--h) * 1%) + 24px);
   transform: translateX(-50%) rotate(-90deg);
   transform-origin: center;
   font-weight: 700;
   font-size: var(--font-12);
   color: var(--bg-dark);
   white-space: nowrap;
   pointer-events: none;
}

/* LABELS AREA (below border) */
.benefits-sec .labels {
   display: grid;
   grid-template-columns: repeat(5, minmax(0, 1fr));
   gap: clamp(10px, 2.6vw, 30px);
   padding: 0 6px;
}

.benefits-sec .label-col {
   display: grid;
   justify-items: center;
   gap: 8px;
}

/* the small tick '|' touching the bottom axis line */
.benefits-sec .tick {
   width: 2px;
   height: 14px;
   background: var(--dark-grey);
   margin-top: -8px;
   border-radius: var(--radius-8);
}

.benefits-sec .role {
   text-align: center;
   font-size: var(--font-12);
   font-weight: 400;
   color: var(--dark-grey);
   line-height: normal;
   max-width: 150px;
}

@media (max-width:560px) {
   .benefits-sec .chart-shell {
      overflow-x: auto;
      -webkit-overflow-scrolling: touch;
      padding-bottom: 6px;
   }

   .benefits-sec .chart,
   .benefits-sec .labels {
      min-width: 640px;
   }

   .benefits-sec .chart {
      height: 240px;
   }
}


.hiring-company {
   background: var(--white);
   height: 100%;
   border-radius: var(--radius-8);
}

.hiring-company .heading {
   color: var(--bg-dark);
   text-align: left;
   font-family: var(--font-nunito);
   font-size: var(--font-18);
   font-style: normal;
   font-weight: 700;
   line-height: normal;
}

.hiring-company .source {
   color: var(--disable-grey);
   text-align: left;
   font-family: var(--font-nunito);
   font-size: var(--font-12);
   font-style: normal;
   font-weight: 400;
   line-height: normal;
}

.course-expert-card {
   border-radius: var(--radius-16);
   background: var(--amethyst-purple);
}

.course-expert-card .course-note {
   color: var(--white);
   font-family: var(--font-nunito);
   font-size: var(--font-18);
   font-style: normal;
   font-weight: 700;
   line-height: normal;
   text-align: center;
}

/* courses-sec styles end */


/* success-section styles start */

.success-section .item {
   border-radius: 16px;
   border: 1px solid #7951A1;
   background: rgba(80, 76, 160, 0.25);
}

.success-section .item .item-content {
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: 24px;
   width: 100%;
   flex-wrap: wrap;
}

.success-section .item .item-content .item-icon {
   width: 55px;
   height: 55px;
   display: block;
   margin: auto;
}

@media (max-width:400px) {
   .success-section .item .item-content .d-flex {
      width: 45%;
   }
}

.success-section .item .item-content .d-flex span {
   font-size: var(--font-16);
   color: var(--white);
   font-family: var(--font-nunito);
   font-weight: 600;
   line-height: normal;
   text-align: center;
}

/* success-section style end */

/*--------  expert-sec style start ----------*/
.expert-sec {
   background: var(--night-purple);
}

.expert-sec {
   text-align: center;
}

.expert-sec .myAdvisor {
   margin-top: 24px;
}

.expert-sec .item {
   height: auto;
   display: flex;
   flex-direction: column;
   align-items: flex-start;
   gap: 16px;
   font-family: var(--font-nunito);
   border-radius: var(--radius-8);
   border: 1px solid var(--purple-light-border);
   background: var(--purple-light);
   padding: 24px;
}

.expert-sec .item .profile-desc {
   width: 100%;
}

.expert-sec .item .profile-desc .avtar img {
   width: 74px;
   height: 74px;
   display: block;
   border-radius: 74px;
   object-fit: contain;
   border: 1px solid var(--border-grey);
}

.expert-sec .item .profile-desc .avtar-data {
   display: flex;
   flex-direction: column;
   align-items: start;
   gap: 16px;
}

.expert-sec .item .profile-desc .avtar-data .avtar-name {
   color: var(--white);
   font-size: var(--font-16);
   font-style: normal;
   font-weight: 700;
   line-height: normal;
   text-transform: uppercase;
}

.expert-sec .item .profile-desc .avtar-data .avtar-exp {
   padding: 8px 16px;
   background: var(--purple-dark);
   color: var(--white);
   text-align: center;
   font-family: var(--font-nunito);
   font-size: var(--font-14);
   font-style: normal;
   font-weight: 700;
   line-height: normal;
   border-radius: var(--radius-8);
}

.expert-sec .item .designation {
   font-weight: bold;
   font-size: var(--font-16);
   text-transform: uppercase;
   color: var(--white);
   font-weight: 400;
   text-align: left;
}

.expert-sec .item .summary {
   margin-top: 8px;
   font-size: var(--font-16);
   color: var(--white);
   font-weight: 400;
   text-align: left;
}

.expert-sec .item .summary .read-more,
.reviews-item .read-more {
   color: var(--amethyst-purple);
   font-size: 14px;
   font-style: normal;
   font-weight: 700;
   line-height: normal;
   cursor: pointer;
   display: inline;
   margin-top: 8px;
}

.expert-sec .item .summary .hidden-text,
.reviews-item .summary .hidden-text {
   display: none;
}

/*------ expert-sec style end -----*/

/*------ review-sec style start ----*/
.reviews-section {
   background: var(--night-purple);
   position: relative;
}

.reviews-section .neon-purple {
   position: absolute;
   top: 25%;
   right: 25%;
   width: 281px;
   height: 281px;
   border-radius: 281px;
   background: var(--neon-purple);
   filter: blur(100px);
}

.reviews-section .reviews-item {
   font-family: var(--font-nunito);
   border-radius: var(--radius-8);
   border: 1px solid var(--purple-light-border);
   background: var(--purple-light);
}

.reviews-section .reviews-item .reviews-img img {
   width: 50px;
   height: 50px;
   border-radius: 50px;
   display: block;
}

.reviews-section .reviews-item .name {
   color: var(--white);
   font-size: var(--font-16);
   font-style: normal;
   font-weight: 700;
   line-height: normal;
   text-align: left;
}

.reviews-section .reviews-item .location {
   color: var(--white);
   font-size: var(--font-14);
   font-style: normal;
   font-weight: 700;
   line-height: normal;
   text-align: left;
}

.reviews-section .reviews-item .summary {
   color: var(--white);
   font-size: var(--font-16);
   font-style: normal;
   font-weight: 400;
   line-height: normal;
   text-align: left;
   border-top: 1px solid var(--border-grey);
   padding-top: 16px;
   margin-top: 16px;
}

.reviews-section .reviews-item .reviews i {
   color: var(--yellow);
   font-size: var(--font-14);
}

/*------ review-sec style end ----*/

/*------ why-choose-item style start ----*/
.clientele-whychoose-sec {
   background: var(--night-purple);
   padding: 72px 0;
   position: relative;
}


.why-choose .why-choose-content .h2 {
   text-align: center;
}

.why-choose .why-choose-content {
   border-radius: var(--radius-16);
   background: var(--purple-light);
   border: 1px solid #5F20BE;
}

.why-choose .item {
   border-radius: var(--radius-16);
   background: var(--purple-light);
   height: 100%;
}

.why-choose .item p {
   text-align: center;
}

/*------related-blog-sec style start----*/
.related-sec .item {
   border-radius: var(--radius-8);
   border: 1px solid var(--purple-light-border);
   background: var(--purple-light);
   font-family: var(--font-nunito);
   height: 100%;
}

.related-sec .item h3 {
   color: var(--white);
   font-size: var(--font-18);
   font-style: normal;
   font-weight: 700;
   line-height: normal;
   text-align: left;
   display: -webkit-box;
   -webkit-box-orient: vertical;
   -webkit-line-clamp: 2;
   overflow: hidden;
   text-overflow: ellipsis;
}

@media (min-width: 768px) {
   .related-sec .item h3 {
      min-height: 60px;
   }
}

.related-sec .item p {
   color: var(--white);
   font-size: var(--font-16);
   font-style: normal;
   font-weight: 500;
   line-height: normal;
   text-align: left;
   display: -webkit-box;
   -webkit-box-orient: vertical;
   -webkit-line-clamp: 2;
   overflow: hidden;
   text-overflow: ellipsis;
}

/*------related-blog-sec style start----*/

/********* faq style start *****/

.faq-sec {
   background: var(--night-purple);
   padding: 72px 0;
}

.faq-sec .faq-sec-title {
   text-align: center;
}

.faq-item {
   background: transparent;
   border: 1px solid var(--purple-light-border);
   border-radius: var(--radius-8);
   overflow: hidden;
}

.faq-question {
   width: 100%;
   background: transparent;
   border: 0;
   cursor: pointer;
   padding: 16px;
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: 16px;
   color: var(--night-purple);
   font-size: var(--font-18);
   font-family: var(--font-sora);
   font-weight: 600;
   text-align: left;
}

.faq-question[aria-expanded="true"] {
   border-bottom: 1px solid var(--purple-light-border);
}

.faq-question span {
   color: var(--white);
}

/* .faq-item:not(.is-open) .faq-question {
   border-bottom: 1px solid var(--border-grey);
} */

/* Arrow icon (right side) */
.faq-icon {
   display: inline-flex;
   align-items: center;
   justify-content: center;
   flex: 0 0 auto;
   position: relative;
}

/* Down arrow default */
.faq-icon::before {
   content: "";
   width: 10px;
   height: 10px;
   border-right: 2px solid var(--neon-purple);
   border-bottom: 2px solid var(--neon-purple);
   transform: rotate(45deg);
   transition: transform 0.2s ease;
}

/* Up arrow when open */
.faq-item.is-open .faq-icon::before {
   transform: rotate(-135deg);
   /* up */
}

/* Answer panel */
.faq-answer {
   max-height: 0;
   overflow: hidden;
   transition: max-height 0.25s ease;
}

.faq-answer-inner {
   padding: 16px;
   font-family: var(--font-nunito);
   font-size: var(--font-16);
   line-height: 1.6;
   color: var(--white);
}

/* Responsive */
@media (max-width: 768px) {
   .faq-title {
      font-size: var(--font-28);
   }

   .faq-question {
      font-size: var(--font-16);
      padding: 14px 14px;
   }

   .faq-icon {
      width: 26px;
      height: 26px;
   }

   .faq-answer-inner {
      font-size: var(--font-16);
      padding: 12px 14px 14px 14px;
   }
}

@media (max-width: 420px) {
   .faq-item {
      border-radius: var(--radius-8);
   }
}

/******** faq style end *******/


/*>>>>>>>> swiper style start <<<<<<<<<<<<*/
.navigation {
   width: 100%;
   gap: 24px;
   margin-top: 24px;
}

.swiper-horizontal > .swiper-pagination-bullets,
.swiper-pagination-bullets.swiper-pagination-horizontal,
.swiper-pagination-custom,
.swiper-pagination-fraction {
   width: 10% !important;
   display: flex;
   /* left: 50% !important;
  transform: translateX(-50%); */
   position: relative !important;
   bottom: 0 !important;
}

.swiper-pagination .swiper-pagination-bullet {
   width: 100%;
   height: 4px;
   border-radius: 0;
   margin: 0 !important;
   background: var(--white);
   opacity: 1;
}

.swiper-pagination .swiper-pagination-bullet[aria-label="Go to slide 1"] {
   border-radius: 5px 0 0 5px;
}

.swiper-pagination .swiper-pagination-bullet:first-child {
   border-radius: 5px 0 0 5px;
}

.swiper-pagination .swiper-pagination-bullet:last-child {
   border-radius: 0 5px 5px 0;
}

.swiper-button-next,
.swiper-button-prev {
   position: relative !important;
   margin: 0 !important;
}

.swiper-button-next:after,
.swiper-button-prev:after {
   content: '' !important;
   font-family: none !important;
   position: relative !important;
   font-size: 0 !important;
}

.swiper-button-next svg,
.swiper-button-prev svg {
   height: auto !important;
   width: auto !important;
}

.swiper-pagination-bullet-active {
   background-color: var(--amethyst-purple) !important;
}

/*>>>>>>>> swiper style end <<<<<<<<<<<*/