@use "../../../plugins/bootstrap-5.1.3/scss/functions";
@use "../../../plugins/bootstrap-5.1.3/scss/variables";
@use "../../../plugins/bootstrap-5.1.3/scss/mixins";
@use "../../../plugins/bootstrap-5.1.3/scss/utilities";
@use "../../../plugins/bootstrap-5.1.3/scss/reboot";
@media (prefers-reduced-motion: no-preference) {
  :root {
    scroll-behavior: auto !important;
  }
}

:root {
  --primary: #CD0511;
  --consumed-by-js: $primary;
  --bs-primary: #CD0511;
  --bs-primary-rgb: 205, 5, 17;
  --success: #179149;
  --consumed-by-js: $success;
  --bs-success: #179149;
  --bs-success-rgb: 23, 145, 73;
  --bs-dark: #161616;
  --bs-dark-rgb: 22, 22, 22;
  --bs-font-open-sans:'Open Sans', sans-serif;
  --bs-body-font-family: var(--bs-font-open-sans);
  --bs-body-color: #161616;
  --bs-link-color: $primary;
}

@use "../../../plugins/bootstrap-5.1.3/scss/bootstrap";
.font-roboto-flex body,
.font-roboto-flex p,
.font-roboto-flex h1, .font-roboto-flex h2, .font-roboto-flex h3, .font-roboto-flex h4, .font-roboto-flex h5, .font-roboto-flex h6,
.font-roboto-flex span,
.font-roboto-flex div,
.font-roboto-flex a,
.font-roboto-flex li,
.font-roboto-flex ul, .font-roboto-flex ol,
.font-roboto-flex button,
.font-roboto-flex input,
.font-roboto-flex textarea,
.font-roboto-flex label,
.font-roboto-flex strong,
.font-roboto-flex em {
  font-family: "Roboto Flex", sans-serif;
}

.h1 {
  font-size: 60px !important;
  font-style: normal !important;
  text-transform: unset;
  font-weight: 600 !important;
  line-height: 61px !important;
}

@media (max-width: 1400px) {
  .h1 {
    font-size: 2.5rem !important;
  }
}

@media (max-width: 1200px) {
  .h1 {
    font-size: 48px !important;
    line-height: normal !important;
  }
}

@media (max-width: 1200px) {
  h2.h1 {
    font-size: 40px !important;
  }
}

ul.dropdown-menu {
  padding-bottom: 1rem;
}

ul.dropdown-menu li.dropdown a:first-child {
  padding-top: 0;
}

ul.dropdown-menu li.dropdown a:last-child {
  padding-bottom: 0 !important;
}

.gap-32 {
  gap: 32px;
}

.max-width-600 {
  max-width: 600px;
}

.swiper-pagination-bullet-active {
  background: #CD0511 !important;
}

.terms-no-link {
  font-size: 12px;
  padding-top: 10px;
  color: #A8A8A8;
}

.hover-btn:hover {
  background-color: #2D2D2D !important;
  border: 1px solid #2D2D2D !important;
}

.fs-15 {
  font-size: 15px;
}

@media (min-width: 992px) {
  ul.dropdown-menu {
    padding-left: 16px !important;
  }
}

.smallCardItem {
  border-radius: 20px;
  gap: 12px;
  padding: 20px;
}

.smallCardItem .textContent h3 {
  font-weight: 700;
}

.smallCardItem .imgWrap {
  border-radius: 20px;
  background-color: #F4F4F4;
  width: 65px;
  height: 65px;
  aspect-ratio: 1;
}

.custom-gap-20 {
  row-gap: 20px;
}

.hero__section {
  min-height: 100%;
  padding-top: 0 !important;
  height: calc(100vh - 92px);
}

@media only screen and (min-width: 1400px) {
  .hero__section {
    max-height: 800px;
  }
}

.bg-semi-white-2 {
  background-color: #F4F4F4;
}

.border-color-dark:not(:hover) {
  border-color: #161616 !important;
}

.width-fit-content {
  width: fit-content;
}

.max-width-400 {
  max-width: 400px;
}

section:last-of-type {
  padding: unset;
}

.mt-100 {
  margin-top: 100px;
}

.mt-32 {
  margin-top: 32px;
}

.bg-light-blue {
  background-color: #CEECED;
}

.bg-light-orange {
  background-color: #FFEDD1;
}

.bg-light-green {
  background-color: #D2EDCE;
}

.fw-600 {
  font-weight: 600 !important;
}

.fs-32 {
  font-size: 32px;
}

.pt-200 {
  padding-top: 200px;
}

#as-seen {
  background-color: #FEFEFE;
}

#as-seen .outer-custom-gap {
  column-gap: 115px;
}

@media only screen and (max-width: 1200px) {
  #as-seen .outer-custom-gap {
    column-gap: 60px;
  }
}

#as-seen .inner-custom-gap {
  column-gap: 60px;
}

@media only screen and (max-width: 768px) {
  #as-seen .inner-custom-gap {
    flex-wrap: wrap;
    column-gap: 24px;
    row-gap: 24px;
  }
  #as-seen .inner-custom-gap .mobile-flex-basis {
    flex-basis: calc(50% - 12px);
  }
}

@media only screen and (max-width: 768px) {
  #as-seen .firstItem {
    flex-basis: 100%;
  }
}

.custom-py-24px {
  padding-top: 24px;
  padding-bottom: 24px;
}

.custom-row-gap-24px {
  row-gap: 24px;
}

.clientCards__section {
  padding-top: 100px;
  padding-bottom: 200px;
}

.clientCards__section .clientCard {
  border-radius: 20px;
  padding: 32px;
}

.clientCards__section .clientCard .nameWrap {
  gap: 12px;
}

.clientCards__section .clientCard .nameWrap .circle {
  border-radius: 50%;
  aspect-ratio: 1;
  width: 50px;
  height: 50px;
}

.fw-700 {
  font-weight: 700;
}

.cards__section {
  padding-top: 105px;
  padding-bottom: 100px;
}

.cards__section .cardItem {
  border-radius: 20px;
  height: 100%;
  overflow: hidden;
}

.cards__section .cardItem .textContent {
  padding: 29px 29px 0 29px;
}

.cards__section .cardItem .imgContent img {
  max-width: 100%;
  transition: all 300ms ease;
}

.cards__section .cardItem .imgContent img:hover {
  transform: scale(1.1);
}

@media only screen and (min-width: 1200px) {
  .desktop-px-112 {
    padding-left: 120px;
    padding-right: 120px;
  }
  .desktop-pb-200 {
    padding-bottom: 200px;
  }
}

@media only screen and (max-width: 768px) {
  .hero__section {
    height: unset;
  }
  .cards__section {
    padding-top: 80px;
    padding-bottom: 55px;
  }
  .clientCards__section {
    padding-top: 80px;
    padding-bottom: 95px;
  }
  .mobile-pb-80 {
    padding-bottom: 80px !important;
  }
  .mobile-pt-80 {
    padding-top: 80px !important;
  }
}

@media only screen and (max-width: 576px) {
  .custom-pl {
    padding-left: calc(var(--bs-gutter-x) * .5);
  }
  .learnSwiper .swiper-slide:last-child, .clientSwiper .swiper-slide:last-child {
    padding-right: calc(var(--bs-gutter-x) * .5);
  }
}

@media only screen and (max-width: 380px) and (max-height: 700px) {
  .hero__section .fs-20 {
    font-size: 16px !important;
  }
  .hero__section .gap-3 {
    gap: 0 !important;
  }
  .hero__section .btn {
    margin-top: 0 !important;
  }
}