:root {
  --black: #000000;
  --white: #ffffff;
  --body-bg: #16171a;
  --lightgrey: #b7b8c0;
  --lightgrey-2: #6d6f78;
  --gradient-1: linear-gradient(90deg,
      rgba(162, 170, 240, 1) 0%,
      rgba(168, 143, 239, 1) 51%,
      rgb(205, 50, 227) 100%);
  --gradient-2: linear-gradient(87deg,
      rgba(200, 217, 237, 1) 0%,
      rgba(232, 151, 176, 1) 50%,
      rgba(221, 100, 211, 1) 100%);
  --gradient-3: linear-gradient(158deg,
      rgba(54, 207, 255, 1) 0%,
      rgba(98, 138, 255, 1) 50%,
      rgba(138, 81, 254, 1) 100%);
  --gradient-4: linear-gradient(158deg,
      rgba(56, 245, 247, 1) 0%,
      rgba(156, 199, 241, 1) 50%,
      rgba(117, 151, 249, 1) 100%);
  --gradient-5: linear-gradient(270deg,
      rgba(237, 47, 59, 1) 0%,
      rgba(247, 106, 65, 1) 50%,
      rgba(255, 190, 100, 1) 100%);
  --gradient-6: linear-gradient(to right, #0e96ee, #4eebd5, #fdd68d, #fb8c61);
  --title-font: "Jost", sans-serif;
  --paragraph-font: "Inter", sans-serif;
}

@font-face {
  font-family: "Inter";
  src: url("../fonts/inter/Inter-VariableFont.ttf") format("truetype");
  font-weight: 100 900;
  font-display: swap;
}

@font-face {
  font-family: "Inter";
  src: url("../fonts/inter/Inter-Italic-VariableFont.ttf") format("truetype");
  font-style: italic;
  font-weight: 100 900;
  font-display: swap;
}

@font-face {
  font-family: "Jost";
  src: url("../fonts/jost/Jost-VariableFont_wght.ttf") format("truetype");
  font-weight: 100 900;
  font-display: swap;
}

@font-face {
  font-family: "Jost";
  src: url("../fonts/jost/Jost-Italic-VariableFont_wght.ttf") format("truetype");
  font-style: italic;
  font-weight: 100 900;
  font-display: swap;
}

html {
  overscroll-behavior-x: none;
  overscroll-behavior-y: none;
  scroll-behavior: smooth;
}

body {
  overscroll-behavior-x: none;
  overscroll-behavior-y: none;
  scroll-behavior: smooth;
  background: var(--body-bg);
  font-family: var(--paragraph-font);
  margin: 0;
  padding: 0;
  color: #fff;
  overflow-x: hidden;
/*   height: 100dvh; */
/*   overflow-y: hidden; */
}

body.full-body {
  height: auto;
  overflow-y: auto;
}

/* lenis */
html.lenis,
html.lenis body {
  height: auto;
  overflow-x: hidden;
}

.lenis.lenis-smooth {
  scroll-behavior: auto !important;
}

.lenis.lenis-smooth [data-lenis-prevent] {
  overscroll-behavior: contain;
}

.lenis.lenis-stopped {
  overflow: hidden;
}

.lenis.lenis-scrolling iframe {
  pointer-events: none;
}



a {
  text-decoration: none;
}

.custom-container {
  padding-left: 24px;
  padding-right: 24px;
  max-width: 1180px;
  width: 100%;
  margin-right: auto;
  margin-left: auto;
}

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

.pb-70 {
  padding-bottom: 70px;
}

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

.pb-25 {
  padding-bottom: 25px;
}

.mb-25 {
  margin-bottom: 25px;
}

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

.mb-70 {
  margin-bottom: 70px;
}

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

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

.btn-1 {
  padding: 10px 20px;
  background: var(--white);
  color: var(--white);
  font-weight: 600;
  text-decoration: none;
  border-radius: 30px;
  /* margin-left: 30px; */
  display: inline-block;
  font-size: 18px;
  background: linear-gradient(117deg, rgba(22, 23, 26, 0) 0%, rgb(168 143 239 / 72%) 50%, rgba(22, 23, 26, 0) 100%);
  border: 1px solid #ffffff6b;
  transition: 0.3s ease-in-out;
}

.btn-1 i {
  transform: rotate(45deg);
}

.gradient-1 {
  background: var(--gradient-1);
}

.gradient-2 {
  background: var(--gradient-2);
}

.gradient-3 {
  background: var(--gradient-3);
}

.gradient-4 {
  background: var(--gradient-4);
}

.gradient-5 {
  background: var(--gradient-5);
}

.gradient-6 {
  background: var(--gradient-6);
}

.sec-title {
  /* background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent; */
  /* font-size: 76px; */
  padding: 10px 20px;
  font-weight: 600;
  color: var(--white);
  display: inline-flex;
  font-size: 20px;
  border-radius: 30px;
  align-items: center;
  gap: 10px;
  background: #26272b;
}

.sec-title span {
  display: block;
  width: 10px;
  height: 10px;
  border-radius: 50%;
}

.main-title {
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
  font-size: 76px;
}