@font-face {
  font-family: Yekanbakhfanum;
  src: url('../fonts/YekanBakhFaNum-Regular.woff2') format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: auto;
}

@font-face {
  font-family: Yekanbakhfanum;
  src: url('../fonts/YekanBakhFaNum-Bold.woff2') format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: auto;
}

.hero-banner {
  object-fit: cover;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  height: 1080px;
  display: flex;
  position: relative;
}

.body {
  direction: rtl;
  background-color: #070c37;
  font-family: Yekanbakhfanum, Arial, sans-serif;
  overflow: visible;
}

.hero_section {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  background-image: url('../images/back-pattern.svg');
  background-position: 50% 0;
  background-repeat: repeat-x;
  background-size: contain;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  max-width: none;
  height: 100%;
  min-height: 800px;
  text-decoration: none;
  display: flex;
  position: relative;
  overflow: visible;
}

.to-shadow-and-star {
  z-index: -1;
  opacity: 1;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 50%;
  text-decoration: none;
  display: flex;
  position: absolute;
  top: 0;
  left: auto;
}

.top-shadow {
  object-fit: cover;
  justify-content: center;
  align-items: center;
  width: 100%;
  max-width: 825px;
  height: 825px;
  text-decoration: none;
  display: flex;
  position: absolute;
  top: -400px;
  left: 710px;
}

.stars {
  justify-content: center;
  align-items: center;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  text-decoration: none;
  display: flex;
}

.stars-2 {
  object-fit: cover;
  justify-content: center;
  align-items: center;
  width: 100%;
  max-width: 748.342px;
  height: 525.392px;
  text-decoration: none;
  display: flex;
}

.blue-shadow---text {
  opacity: .8;
  mix-blend-mode: screen;
  object-fit: cover;
  margin-left: auto;
  margin-right: auto;
  position: absolute;
  top: 250px;
  left: auto;
}

.header-text-content {
  z-index: 3;
  grid-row-gap: 50px;
  flex-direction: column;
  order: -1;
  justify-content: center;
  align-self: center;
  align-items: center;
  height: auto;
  padding-top: 50px;
  text-decoration: none;
  display: flex;
  position: absolute;
  inset: 0% 0% auto;
}

.logo-bar {
  grid-row-gap: 9px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  max-width: 276px;
  text-decoration: none;
  display: flex;
}

.sgb-logo---mini-2 {
  object-fit: cover;
  overflow: hidden;
}

.line-shadow {
  object-fit: cover;
  justify-content: center;
  align-items: center;
  width: 100%;
  max-width: 263px;
  height: 9px;
  text-decoration: none;
  display: flex;
}

.hero_text {
  grid-row-gap: 16px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  max-width: 900px;
  text-decoration: none;
  display: flex;
}

.hero_text1 {
  opacity: 1;
  direction: rtl;
  text-align: center;
  -webkit-text-fill-color: transparent;
  background-image: linear-gradient(#86e1ff, #0091eb);
  -webkit-background-clip: text;
  background-clip: text;
  width: 100%;
  max-width: 350px;
  margin-top: 0;
  margin-bottom: 0;
  font-family: Yekanbakhfanum, Arial, sans-serif;
  font-size: 44px;
  font-weight: 800;
  line-height: 130%;
  text-decoration: none;
}

.hero_text2 {
  opacity: 1;
  direction: rtl;
  color: #fff;
  text-align: right;
  max-width: 350px;
  margin-top: 0;
  margin-bottom: 0;
  font-family: Yekanbakhfanum, Arial, sans-serif;
  font-size: 18px;
  font-weight: 400;
  line-height: 150%;
  text-decoration: none;
}

.cta {
  grid-column-gap: 11px;
  opacity: 1;
  pointer-events: auto;
  cursor: pointer;
  background-color: #0a7cff;
  border-radius: 48px;
  flex: 0 auto;
  justify-content: center;
  align-items: center;
  max-width: 346.44px;
  margin-bottom: 20px;
  padding: 16px 28px;
  text-decoration: none;
  transition: background-color .5s, box-shadow .5s;
  display: flex;
  overflow: hidden;
  box-shadow: 0 16px 32px #0a7cff7a, 0 4px 8px #0a7cff1f, 0 2px 6px #0a7cff3d, 0 1px 3px #0a7cff3d, inset 1px 1px 2px #ffffff3d;
}

.cta:hover {
  background-color: #056de4;
  box-shadow: 0 0 8px 6px #0a7cff40, 0 16px 32px #0a7cff7a, 0 4px 8px #0a7cff1f, 0 2px 6px #0a7cff3d, 0 1px 3px #0a7cff3d, inset 1px 1px 2px #ffffff3d;
}

.btn-label {
  flex: 0 auto;
  justify-content: center;
  align-items: flex-start;
  padding-right: .5px;
  text-decoration: none;
  display: flex;
}

.cta_text {
  color: #fff;
  text-align: center;
  margin-top: 0;
  margin-bottom: 0;
  font-family: Yekanbakhfanum, Arial, sans-serif;
  font-size: 16px;
  font-weight: 700;
  line-height: 24px;
  text-decoration: none;
}

.fire-icon {
  justify-content: center;
  align-items: flex-start;
  width: 24px;
  max-width: 157.5px;
  text-decoration: none;
  display: flex;
}

.icon {
  justify-content: flex-start;
  align-items: flex-start;
  width: 32px;
  padding: 1px 3px;
  text-decoration: none;
  display: flex;
  overflow: hidden;
}

.header-bottom-vector {
  object-fit: fill;
  order: 1;
  align-self: center;
  width: auto;
  height: auto;
  overflow: visible;
}

.back-pattern {
  border: undefinedpx undefined undefined;
  opacity: .1;
  object-fit: cover;
  position: absolute;
  top: 0;
  left: 0;
}

.section {
  height: 100vh;
}

.div-block {
  object-fit: fill;
  justify-content: center;
  align-items: flex-start;
  width: 100%;
  height: 100%;
  display: flex;
  position: absolute;
  inset: 0% 0% auto;
}

.right_shadow {
  z-index: -1;
  position: absolute;
  inset: 0% -50% 0% auto;
}

.left_shadow {
  z-index: -1;
  position: absolute;
  inset: 0% auto 0% -50%;
}

.character_div {
  z-index: 1;
  width: auto;
  max-width: 40%;
  height: auto;
  position: absolute;
  inset: 40% auto auto 5%;
}

.character_image {
  object-fit: fill;
}

.xbox_controller {
  z-index: 1;
  opacity: 1;
  max-width: 25%;
  position: absolute;
  inset: 30% auto 0% -10%;
  overflow: visible;
}

.play_station {
  z-index: 1;
  opacity: 1;
  max-width: 30%;
  position: absolute;
  inset: 25% -5% 0% auto;
}

.moraba {
  z-index: 1;
  width: 90px;
  position: absolute;
  inset: 38% -1% 0% auto;
}

.dayere {
  z-index: 2;
  width: 90px;
  position: absolute;
  inset: 27% 15% 0% auto;
}

.mosalas {
  object-fit: fill;
  width: 90px;
  position: absolute;
  inset: 20% 10% 0% auto;
}

.zarbdar {
  z-index: 2;
  width: 90px;
  position: absolute;
  inset: 45% 18% 0% auto;
}

.big_peyk {
  z-index: 2;
  position: absolute;
  inset: 27% auto 0% 5%;
}

.mini_peyk {
  z-index: 2;
  position: absolute;
  inset: 32% auto 0% 4%;
}

.dollar_cash {
  width: 100px;
  position: absolute;
  inset: 45% auto 0% 20%;
}

.dollar_symbol {
  position: absolute;
  inset: 40% 23% 0% auto;
}

.star_symbol {
  width: 120px;
  height: auto;
  position: absolute;
  inset: 35% auto 0% 15%;
}

.big_star {
  position: absolute;
  inset: 35% auto 0% 22%;
}

.mini_star {
  position: absolute;
  inset: 32% auto 0% 20%;
}

.dayere_blur {
  max-width: 20%;
  position: absolute;
  inset: -7% -5% 0% auto;
}

.mosalas_blur {
  opacity: .8;
  max-width: 20%;
  position: absolute;
  inset: -10% 15% auto auto;
}

.moraba_blur {
  position: absolute;
  inset: -9% auto 0% 10%;
}

.zarbdar_blur {
  opacity: .8;
  position: absolute;
  inset: -8% auto 0% -2%;
}

._3d-logo {
  z-index: 1;
  vertical-align: middle;
  width: 150px;
  position: absolute;
  inset: 20% 22% 0% auto;
  overflow: clip;
}

.hero_text_top {
  grid-column-gap: 36px;
  grid-row-gap: 36px;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  display: flex;
}

.what-prop-section {
  grid-row-gap: 36px;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  height: auto;
  margin-top: 150px;
  margin-bottom: 100px;
  padding-top: 180px;
  display: flex;
  position: relative;
  overflow: visible;
}

.prop_texts {
  grid-row-gap: 36px;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  max-width: 1000px;
  padding-left: 54px;
  padding-right: 54px;
  text-decoration: none;
  display: flex;
}

.div-top-note {
  grid-column-gap: 29px;
  flex: 0 auto;
  justify-content: flex-start;
  align-items: center;
  text-decoration: none;
  display: flex;
}

.div-liner {
  justify-content: center;
  align-items: center;
  width: 100px;
  text-decoration: none;
  display: flex;
  overflow: hidden;
}

.line {
  grid-column-gap: 10px;
  background-image: linear-gradient(270deg, #f2f0f5 0%, #f2f0f500 100%);
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  padding: 10px;
  text-decoration: none;
  display: flex;
  overflow: hidden;
}

.dot {
  grid-column-gap: 10px;
  background-color: #3faffc1a;
  border-radius: 100px;
  justify-content: flex-start;
  align-items: center;
  width: 18px;
  height: 18px;
  padding: 5px 6px;
  text-decoration: none;
  display: flex;
}

.dot-2 {
  grid-row-gap: 10px;
  background-color: #f2f0f5;
  border-radius: 100px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 7px;
  padding: 10px;
  text-decoration: none;
  display: flex;
  overflow: hidden;
}

.text {
  color: #f2f0f5;
  text-transform: uppercase;
  margin-top: 0;
  margin-bottom: 0;
  font-family: Yekanbakhfanum, Arial, sans-serif;
  font-size: 14px;
  font-weight: 700;
  line-height: 19.6px;
  text-decoration: none;
}

.prop_title {
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  max-width: 508px;
  padding-left: 2px;
  padding-right: 2px;
  text-decoration: none;
  display: flex;
}

.prop_top_text {
  color: #fff;
  text-align: center;
  width: 100%;
  margin-top: 0;
  margin-bottom: 0;
  font-family: Yekanbakhfanum, Arial, sans-serif;
  font-size: 44px;
  font-weight: 700;
  line-height: 62.4px;
  text-decoration: none;
}

.prop_bottom_text {
  direction: rtl;
  color: #0000;
  text-align: center;
  -webkit-text-fill-color: transparent;
  background-image: linear-gradient(270deg, #f2f0f5, #0098ff);
  -webkit-background-clip: text;
  background-clip: text;
  width: 100%;
  margin-top: 0;
  margin-bottom: 0;
  font-family: Yekanbakhfanum, Arial, sans-serif;
  font-size: 44px;
  font-weight: 700;
  line-height: 62.4px;
  text-decoration: none;
}

.prop_paragraph_div {
  grid-row-gap: 16px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  min-width: 615px;
  max-width: none;
  text-decoration: none;
  display: flex;
}

.prop_p_sub3 {
  direction: rtl;
  color: #fff;
  text-align: center;
  letter-spacing: 0;
  width: 100%;
  margin-top: 0;
  margin-bottom: 0;
  font-family: Yekanbakhfanum, Arial, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  text-decoration: none;
}

.prop_p_text_bottom {
  direction: rtl;
  color: #00aeef;
  text-align: center;
  letter-spacing: 0;
  width: 100%;
  margin-top: 0;
  margin-bottom: 0;
  font-family: Yekanbakhfanum, Arial, sans-serif;
  font-size: 16px;
  font-weight: 700;
  line-height: 24px;
  text-decoration: none;
}

.prop_background {
  z-index: -1;
  justify-content: center;
  align-items: center;
  max-width: 1100px;
  display: flex;
  position: absolute;
  top: 250px;
  left: auto;
}

.image-2 {
  object-fit: cover;
  display: block;
  overflow: hidden;
}

.prop_background_light {
  box-sizing: border-box;
  opacity: .65;
  -webkit-backdrop-filter: blur(50px);
  backdrop-filter: blur(50px);
  object-fit: fill;
  background-image: radial-gradient(circle closest-corner, #6e57ff75, #8f5dff00 57%, #6e56ff00 100%, #915dff00);
  border-radius: 0;
  width: 80%;
  height: 500px;
  margin-top: 0;
  padding-top: 0;
  position: absolute;
  inset: auto;
  overflow: hidden;
}

.prop_table_area {
  grid-column-gap: 4px;
  direction: rtl;
  flex: 0 auto;
  justify-content: center;
  align-items: center;
  padding-top: 1px;
  padding-bottom: 1px;
  text-decoration: none;
  display: flex;
}

.div-tb-title {
  grid-row-gap: 10px;
  direction: ltr;
  background-image: linear-gradient(#f2f0f51a, #00aeef);
  border-radius: 24px;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  padding: 1px;
  text-decoration: none;
  display: flex;
}

.div-tb-enter {
  grid-row-gap: 16px;
  background-image: linear-gradient(#070b32, #131d76);
  border-radius: 24px;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-end;
  width: 100%;
  max-width: 420px;
  padding: 36px 24px;
  text-decoration: none;
  display: flex;
  overflow: hidden;
}

.prop-head-title {
  margin-top: 0;
  margin-bottom: 0;
  font-family: Yekanbakhfanum, Arial, sans-serif;
}

.table-prop-content {
  grid-row-gap: 10px;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-end;
  width: 100%;
  text-decoration: none;
  display: flex;
}

.text-with-tick {
  grid-column-gap: 10px;
  flex: 0 auto;
  justify-content: center;
  align-items: center;
  text-decoration: none;
  display: flex;
}

.prop-content-text {
  direction: rtl;
  color: #fff;
  letter-spacing: -.3px;
  margin-top: 0;
  margin-bottom: 0;
  font-family: Yekanbakhfanum, Arial, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
  text-decoration: none;
}

.dot-3 {
  grid-column-gap: 10px;
  justify-content: center;
  align-items: center;
  width: 24px;
  height: 24px;
  text-decoration: none;
  display: flex;
  position: relative;
}

.ellipse {
  object-fit: cover;
  justify-content: center;
  align-items: center;
  width: 24px;
  height: 24px;
  text-decoration: none;
  display: flex;
}

.tick {
  object-fit: cover;
  position: absolute;
  top: 0;
  left: 34px;
}

.div-tb-title---enter {
  grid-row-gap: 16px;
  background-image: linear-gradient(#070b32, #131d76);
  border-radius: 24px;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-end;
  width: 220px;
  padding: 36px;
  text-decoration: none;
  display: flex;
  overflow: hidden;
}

.table-title {
  direction: rtl;
  color: #0098ff;
  letter-spacing: -.3px;
  margin-top: 0;
  margin-bottom: 0;
  font-family: Yekanbakhfanum, Arial, sans-serif;
  font-size: 16px;
  font-weight: 700;
  line-height: 24px;
  text-decoration: none;
}

.tetris-1 {
  object-fit: cover;
  position: absolute;
  inset: 10% 10% auto auto;
}

.crown {
  object-fit: fill;
  width: 70px;
  height: auto;
  position: absolute;
  top: 208px;
  left: 150px;
}

.electric {
  object-fit: fill;
  width: 70px;
  height: auto;
  position: absolute;
  top: 140px;
  left: 200px;
}

.tetris-2 {
  object-fit: cover;
  position: absolute;
  inset: 60% auto auto 5%;
}

.assault_rifle {
  aspect-ratio: auto;
  object-fit: fill;
  flex: 0 auto;
  align-self: auto;
  width: 300px;
  height: auto;
  position: absolute;
  inset: 0 auto auto -5%;
  overflow: clip;
}

.ak-47 {
  direction: rtl;
  object-fit: fill;
  width: 300px;
  height: auto;
  position: absolute;
  inset: 30% -5% auto auto;
  overflow: clip;
}

.table-title-span {
  direction: rtl;
  color: #a0d2f8;
  letter-spacing: -.3px;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 16px;
  font-weight: 700;
  line-height: 24px;
  text-decoration: none;
}

.sectinon-feature {
  grid-row-gap: 60px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  padding-bottom: 100px;
  text-decoration: none;
  display: flex;
  position: relative;
  overflow: visible;
}

.feature-title {
  grid-row-gap: 24px;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  width: auto;
  max-width: none;
  height: auto;
  padding-left: 0;
  padding-right: 0;
  text-decoration: none;
  display: flex;
}

.feature-top-title {
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  padding-left: 2px;
  padding-right: 2px;
  text-decoration: none;
  display: flex;
}

.feature-top-text {
  direction: rtl;
  color: #0000;
  text-align: center;
  -webkit-text-fill-color: transparent;
  background-image: linear-gradient(270deg, #f2f0f5, #0098ff);
  -webkit-background-clip: text;
  background-clip: text;
  width: 100%;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 44px;
  font-weight: 700;
  line-height: 62.4px;
  text-decoration: none;
}

.feature-sub-text {
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  max-width: 616px;
  text-decoration: none;
  display: flex;
}

.feature_sub_text {
  direction: rtl;
  color: #fff;
  text-align: right;
  letter-spacing: 0;
  width: 100%;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  text-decoration: none;
}

.feature-row {
  grid-column-gap: 50px;
  justify-content: space-between;
  align-items: flex-start;
  width: 100%;
  max-width: 1300px;
  margin-left: 0;
  margin-right: 0;
  padding-left: 50px;
  padding-right: 50px;
  text-decoration: none;
  display: flex;
}

.feature-box {
  grid-row-gap: 10px;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  max-width: 370px;
  text-decoration: none;
  display: flex;
  position: relative;
}

.info {
  grid-row-gap: 28px;
  flex-direction: column;
  justify-content: center;
  align-items: flex-end;
  text-decoration: none;
  display: flex;
  position: relative;
  overflow: visible;
}

.icon-2 {
  background-image: linear-gradient(142.77deg, #0a0fdb 6%, #8d00a6);
  border-radius: 13px;
  justify-content: center;
  align-items: center;
  padding: 10px;
  display: flex;
  overflow: hidden;
}

.brain--streamline-core {
  object-fit: cover;
  overflow: hidden;
}

.feature-content-box {
  grid-row-gap: 24px;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-end;
  text-decoration: none;
  display: flex;
}

.texts {
  grid-row-gap: 24px;
  flex-direction: column;
  justify-content: center;
  align-items: flex-end;
  text-decoration: none;
  display: flex;
}

.feature-title-with-span {
  grid-column-gap: 2px;
  grid-row-gap: 2px;
  direction: rtl;
  justify-content: center;
  align-items: center;
  display: flex;
}

.feature-text {
  direction: rtl;
  color: #cac6dd;
  text-align: right;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 16px;
  font-weight: 400;
  line-height: 32px;
  text-decoration: none;
}

.gradient {
  opacity: .4;
  -webkit-backdrop-filter: blur(120px);
  backdrop-filter: blur(120px);
  mix-blend-mode: color-dodge;
  object-fit: cover;
  border-radius: 200px;
  position: absolute;
  top: 276px;
  left: 0;
  overflow: hidden;
}

.feature-box-title {
  direction: rtl;
  color: #099bfe;
  text-align: right;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 24px;
  font-weight: 700;
  line-height: 120%;
  text-decoration: none;
}

.gradient-2 {
  opacity: .4;
  -webkit-backdrop-filter: blur(120px);
  backdrop-filter: blur(120px);
  mix-blend-mode: color-dodge;
  object-fit: cover;
  border-radius: 200px;
  position: absolute;
  top: 303px;
  left: 0;
  overflow: hidden;
}

.feature-icon-div {
  grid-column-gap: 10px;
  background-image: linear-gradient(142.77deg, #0a0fdb 6%, #8d00a6);
  border-radius: 13px;
  flex: 0 auto;
  justify-content: center;
  align-items: center;
  padding: 10px;
  text-decoration: none;
  display: flex;
  overflow: hidden;
}

.gradient-3 {
  opacity: .4;
  -webkit-backdrop-filter: blur(120px);
  backdrop-filter: blur(120px);
  mix-blend-mode: color-dodge;
  object-fit: cover;
  border-radius: 200px;
  position: absolute;
  top: 271px;
  left: 0;
  overflow: hidden;
}

.tetris-4 {
  object-fit: cover;
  position: absolute;
  top: 30%;
  left: 7%;
}

.tetris-3 {
  object-fit: cover;
  position: absolute;
  top: 5%;
  left: auto;
  right: 45%;
}

.right-shadow---perpple {
  object-fit: cover;
  justify-content: center;
  align-items: center;
  width: 100%;
  max-width: 525px;
  height: 525px;
  text-decoration: none;
  display: flex;
  position: absolute;
  top: 138px;
  left: 1675px;
}

.tilt-proof-1 {
  color: #d6ddf8;
  text-align: right;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 28px;
  font-weight: 700;
  line-height: 120%;
  text-decoration: none;
}

.feature-title-span {
  color: #d6ddf8;
  text-align: right;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 20px;
  font-weight: 700;
  line-height: 120%;
  text-decoration: none;
}

.section-upgrade {
  grid-row-gap: 120px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  padding-bottom: 100px;
  text-decoration: none;
  display: flex;
  position: relative;
  overflow: visible;
}

.left-shadow---blue {
  object-fit: cover;
  justify-content: center;
  align-items: center;
  width: 100%;
  max-width: 825px;
  height: 825px;
  text-decoration: none;
  display: flex;
  position: absolute;
  top: 186px;
  left: -360px;
}

.right-almas {
  object-fit: cover;
  position: absolute;
  top: 60%;
  left: auto;
  right: 0;
}

.right-liner {
  object-fit: cover;
  position: absolute;
  top: 70%;
  left: auto;
  right: 0;
}

.right-dayere {
  object-fit: cover;
  position: absolute;
  top: 80%;
  left: auto;
  right: 10%;
}

.right-mosalas {
  object-fit: cover;
  position: absolute;
  top: 85%;
  left: auto;
  right: -1%;
}

.dayere-left {
  object-fit: contain;
  position: absolute;
  top: 2%;
  left: -2%;
}

.mosalas-left {
  object-fit: cover;
  position: absolute;
  top: 15%;
  left: 2%;
}

.almas-left {
  object-fit: cover;
  position: absolute;
  top: 35%;
  left: 1%;
}

.back-pattern-2 {
  border: undefinedpx undefined undefined;
  opacity: .05;
  object-fit: cover;
  position: absolute;
  top: 80px;
  left: 190px;
}

.upgrade-title {
  grid-row-gap: 12px;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  max-width: 1440px;
  text-decoration: none;
  display: flex;
}

.upgrade-title-text {
  direction: rtl;
  color: #0000;
  text-align: center;
  -webkit-text-fill-color: transparent;
  background-image: linear-gradient(270deg, #f2f0f5, #0098ff);
  -webkit-background-clip: text;
  background-clip: text;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 44px;
  font-weight: 700;
  line-height: 64px;
  text-decoration: none;
}

.upgrade-all-content {
  grid-column-gap: 56px;
  direction: ltr;
  background-image: url('../images/back-pattern_1.svg');
  background-position: 50%;
  background-repeat: repeat-x;
  background-size: cover;
  flex: 0 auto;
  justify-content: center;
  align-items: center;
  text-decoration: none;
  display: flex;
  position: relative;
}

.upgrade-box-2 {
  grid-row-gap: 56px;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  max-width: 361px;
  text-decoration: none;
  display: flex;
}

.upgrade-info {
  grid-row-gap: 28px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  text-decoration: none;
  display: flex;
}

.shield-1--streamline-plump {
  object-fit: cover;
  overflow: hidden;
}

.content-style-3 {
  grid-row-gap: 24px;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  text-decoration: none;
  display: flex;
}

.texts-2 {
  grid-row-gap: 24px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-decoration: none;
  display: flex;
}

.text-16 {
  direction: rtl;
  color: #d6ddf8;
  text-align: center;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 24px;
  font-weight: 700;
  line-height: 120%;
  text-decoration: none;
}

.text-17 {
  opacity: .5;
  direction: rtl;
  color: #cac6dd;
  text-align: center;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 16px;
  font-weight: 400;
  line-height: 32px;
  text-decoration: none;
}

.upgrade-logo-ellipse {
  object-fit: cover;
  justify-content: center;
  align-items: center;
  width: 140px;
  height: 140px;
  text-decoration: none;
  display: flex;
  position: absolute;
  inset: auto;
}

.section---roadmap {
  grid-row-gap: 10px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  padding-bottom: 100px;
  text-decoration: none;
  display: flex;
  overflow: visible;
}

.roadmap-div {
  grid-column-gap: 100px;
  direction: ltr;
  flex: 0 auto;
  justify-content: center;
  align-items: center;
  padding-left: 50px;
  padding-right: 50px;
  text-decoration: none;
  display: flex;
}

.roadmap-all-box {
  flex-direction: column;
  justify-content: center;
  align-items: flex-end;
  width: 100%;
  max-width: 550px;
  text-decoration: none;
  display: flex;
}

.road_box {
  grid-column-gap: 24px;
  justify-content: flex-end;
  align-items: center;
  width: 100%;
  height: 250px;
  display: flex;
}

.road_text_box {
  grid-row-gap: 16px;
  flex-direction: column;
  justify-content: center;
  align-items: flex-end;
  width: 100%;
  max-width: 450px;
  text-decoration: none;
  display: flex;
}

.road_text_title {
  direction: rtl;
  color: #0098ff;
  text-align: right;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 24px;
  font-weight: 700;
  line-height: 120%;
  text-decoration: none;
}

.road_text_content {
  direction: rtl;
  color: #fff;
  text-align: right;
  width: 100%;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 16px;
  font-weight: 400;
  line-height: 32px;
  text-decoration: none;
}

.number-side {
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 250px;
  text-decoration: none;
  display: flex;
}

.number {
  grid-row-gap: 10px;
  background-color: #fff;
  border-radius: 100px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 6px;
  text-decoration: none;
  display: flex;
}

.number_dot {
  grid-row-gap: 10px;
  background-color: #0098ff;
  border-radius: 100px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 64px;
  height: 64px;
  padding: 10px;
  text-decoration: none;
  display: flex;
}

.road_number {
  color: #fff;
  text-align: center;
  width: 100%;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 32px;
  font-weight: 700;
  line-height: 64px;
  text-decoration: none;
}

.line-2 {
  object-fit: cover;
  justify-content: center;
  align-items: center;
  width: 4px;
  height: 87px;
  text-decoration: none;
  display: block;
  overflow: hidden;
}

.right {
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  max-width: 657px;
  text-decoration: none;
  display: flex;
  position: relative;
}

.div-title-3 {
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  max-width: 508px;
  padding-left: 2px;
  padding-right: 2px;
  text-decoration: none;
  display: flex;
}

.road_pic_title {
  direction: rtl;
  color: #fff;
  text-align: center;
  width: 100%;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 44px;
  font-weight: 700;
  line-height: 62.4px;
  text-decoration: none;
}

.road_pic_subtitle {
  direction: rtl;
  color: #0000;
  text-align: center;
  -webkit-text-fill-color: transparent;
  background-image: linear-gradient(270deg, #f2f0f5, #0098ff);
  -webkit-background-clip: text;
  background-clip: text;
  width: 100%;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 44px;
  font-weight: 700;
  line-height: 62.4px;
  text-decoration: none;
}

.q-6c12dbaepng {
  mix-blend-mode: lighten;
  object-fit: cover;
}

._5313336-1 {
  object-fit: cover;
  position: absolute;
  inset: 30% 30% auto auto;
}

.section---video {
  grid-row-gap: 10px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  padding-bottom: 100px;
  text-decoration: none;
  display: flex;
  position: relative;
  overflow: visible;
}

.video-div {
  z-index: 3;
  grid-row-gap: 50px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  max-width: 1209px;
  text-decoration: none;
  display: flex;
  position: relative;
}

.div-background {
  border-radius: 1200px;
  position: absolute;
  top: auto;
  left: auto;
  right: auto;
  overflow: hidden;
}

.video_title {
  grid-row-gap: 24px;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  padding-left: 54px;
  padding-right: 54px;
  text-decoration: none;
  display: flex;
}

.video_title_text {
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  padding-left: 2px;
  padding-right: 2px;
  text-decoration: none;
  display: flex;
}

.video-title {
  direction: rtl;
  color: #0000;
  text-align: center;
  -webkit-text-fill-color: transparent;
  background-image: linear-gradient(270deg, #f2f0f5, #0098ff);
  -webkit-background-clip: text;
  background-clip: text;
  width: 100%;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 44px;
  font-weight: 700;
  line-height: 62.4px;
  text-decoration: none;
}

.video-paragraph {
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  text-decoration: none;
  display: flex;
}

.video_sub_text {
  direction: rtl;
  color: #fff;
  text-align: center;
  letter-spacing: -.3px;
  max-width: 750px;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  text-decoration: none;
}

.div-video-player {
  grid-row-gap: 10px;
  background-image: linear-gradient(#0098ff, #070c37);
  border-radius: 26px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: auto;
  padding: 4px;
  text-decoration: none;
  display: flex;
  position: relative;
  overflow: hidden;
}

.div-video {
  background-color: #050827;
  border-radius: 24px;
  justify-content: center;
  align-items: flex-start;
  width: 100%;
  height: auto;
  padding: 10px;
  text-decoration: none;
  display: flex;
  overflow: hidden;
}

.video_thm {
  vertical-align: baseline;
  object-fit: cover;
  border-radius: 20px;
  width: 100%;
  height: auto;
  display: block;
}

.play_btn {
  cursor: pointer;
  object-fit: cover;
  justify-content: center;
  align-items: center;
  width: 180px;
  height: 180px;
  text-decoration: none;
  transition: all .2s;
  display: flex;
  position: static;
  top: auto;
  left: auto;
}

.play_btn:hover {
  mix-blend-mode: normal;
  transform: scale(1.2);
}

.golden-cup {
  object-fit: contain;
  width: 250px;
  max-width: 100%;
  height: auto;
  position: absolute;
  inset: 0 auto auto -9%;
  overflow: visible;
}

.right-shadow---bule {
  object-fit: cover;
  justify-content: center;
  align-items: center;
  width: 100%;
  max-width: 825px;
  height: 825px;
  text-decoration: none;
  display: flex;
  position: absolute;
  top: 306.048px;
  left: 1535px;
}

.faq---section {
  grid-row-gap: 10px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  padding-bottom: 100px;
  text-decoration: none;
  display: flex;
  position: relative;
}

.faq-area {
  grid-row-gap: 50px;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  max-width: 960px;
  text-decoration: none;
  display: flex;
}

.faq_title {
  direction: rtl;
  color: #0000;
  text-align: center;
  -webkit-text-fill-color: transparent;
  background-image: linear-gradient(270deg, #f2f0f5, #0098ff);
  -webkit-background-clip: text;
  background-clip: text;
  width: 100%;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 44px;
  font-weight: 700;
  line-height: 62.4px;
  text-decoration: none;
}

.faq_box {
  grid-row-gap: 8px;
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  direction: rtl;
  background-color: #ffffff0d;
  border: 1px solid #ffffff1a;
  border-radius: 16px;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  padding: 48px;
  text-decoration: none;
  display: flex;
}

.faq_row {
  grid-row-gap: 10px;
  border: 1.5px solid #0098ff;
  border-radius: 12px;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  padding: 16px;
  text-decoration: none;
  display: flex;
}

.faq_content {
  grid-row-gap: 16px;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  text-decoration: none;
  display: flex;
}

.faq_card_icon {
  justify-content: space-between;
  align-items: center;
  width: 100%;
  text-decoration: none;
  display: flex;
}

.faq_add {
  object-fit: cover;
}

.faq_text {
  color: #fff;
  text-align: right;
  width: 100%;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 18px;
  font-weight: 700;
  line-height: 32px;
  text-decoration: none;
}

.faq_body_text {
  direction: rtl;
  color: #ffffff80;
  text-align: right;
  width: 100%;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 16px;
  font-weight: 400;
  line-height: 28px;
  text-decoration: none;
}

.faq_row_close {
  grid-row-gap: 10px;
  border: 1px solid #ffffff0d;
  border-radius: 12px;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  padding: 16px;
  text-decoration: none;
  display: flex;
}

.faq_icon_plus {
  opacity: .9;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  text-decoration: none;
  display: flex;
}

.left-shadow---perpple {
  object-fit: cover;
  justify-content: center;
  align-items: center;
  width: 100%;
  max-width: 718px;
  height: 718px;
  text-decoration: none;
  display: flex;
  position: absolute;
  top: -3px;
  left: -360px;
}

.section---sound {
  grid-row-gap: 10px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  padding-bottom: 100px;
  text-decoration: none;
  display: flex;
}

.sound-area {
  grid-row-gap: 50px;
  direction: ltr;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  height: 542.192px;
  text-decoration: none;
  display: flex;
}

.sound_title {
  direction: rtl;
  color: #0000;
  text-align: center;
  -webkit-text-fill-color: transparent;
  background-image: linear-gradient(270deg, #f2f0f5, #0098ff);
  -webkit-background-clip: text;
  background-clip: text;
  width: 100%;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 44px;
  font-weight: 700;
  line-height: 62.4px;
  text-decoration: none;
}

.sound-guide {
  grid-column-gap: 60px;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  text-decoration: none;
  display: flex;
}

.sound_left {
  grid-row-gap: 24px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  max-width: 600px;
  margin-left: 16px;
  margin-right: 16px;
  padding-left: 16px;
  padding-right: 16px;
  text-decoration: none;
  display: flex;
}

.sound_text_box {
  grid-row-gap: 24px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  text-decoration: none;
  display: flex;
}

.sound_text_sub {
  opacity: .5;
  direction: rtl;
  color: #fff;
  text-align: right;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 16px;
  font-weight: 400;
  line-height: 32px;
  text-decoration: none;
}

.sound_middle_text {
  direction: rtl;
  color: #fff;
  text-align: center;
  width: 100%;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 16px;
  font-weight: 700;
  line-height: 32px;
  text-decoration: none;
}

.player {
  grid-column-gap: 39px;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  padding-left: 16px;
  padding-right: 16px;
  text-decoration: none;
  display: flex;
}

.play-2 {
  object-fit: cover;
  justify-content: center;
  align-items: center;
  width: 87px;
  height: 87px;
  text-decoration: none;
  display: flex;
}

.sound-wave {
  object-fit: cover;
  justify-content: center;
  align-items: center;
  width: 100%;
  max-width: 340px;
  height: 77px;
  text-decoration: none;
  display: flex;
}

.sound_right {
  flex: 0 auto;
  justify-content: flex-start;
  align-items: center;
  text-decoration: none;
  display: flex;
  position: relative;
}

.microphone {
  object-fit: contain;
  border-radius: 24px;
}

.canvas {
  object-fit: cover;
  position: absolute;
  top: 170px;
  left: 148px;
  overflow: hidden;
}

.gradient-4 {
  opacity: .4;
  -webkit-backdrop-filter: blur(120px);
  backdrop-filter: blur(120px);
  mix-blend-mode: color-dodge;
  object-fit: cover;
  border-radius: 200px;
  position: absolute;
  top: 94.5957px;
  left: 0;
  overflow: hidden;
}

.section---end-cta {
  grid-row-gap: 10px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  padding-bottom: 120px;
  text-decoration: none;
  display: flex;
}

.cta-section {
  grid-row-gap: 10px;
  background-image: url('https://d3e54v103j8qbb.cloudfront.net/img/background-image.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  border: 1px solid #fff3;
  border-radius: 24px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  max-width: 1200px;
  height: 450px;
  min-height: 450px;
  padding: 1px;
  text-decoration: none;
  display: flex;
  position: relative;
  overflow: hidden;
}

.mask-group {
  object-fit: cover;
  background-color: #050928;
  justify-content: center;
  align-items: center;
  width: 100%;
  max-width: 1196px;
  height: 450px;
  text-decoration: none;
  display: flex;
}

.end_cta_content {
  grid-row-gap: 36px;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  max-width: 913px;
  text-decoration: none;
  display: flex;
  position: absolute;
  inset: auto;
}

.end_cta_title {
  direction: rtl;
  text-align: center;
  -webkit-text-fill-color: transparent;
  background-image: linear-gradient(#86e1ff, #0091eb);
  -webkit-background-clip: text;
  background-clip: text;
  width: 100%;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 44px;
  font-weight: 800;
  line-height: 100%;
  text-decoration: none;
}

.end_cta_subtext {
  direction: rtl;
  color: #fff;
  text-align: center;
  width: 650px;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 16px;
  font-weight: 400;
  line-height: 150%;
  text-decoration: none;
}

.end_cta {
  grid-column-gap: 11px;
  background-color: #0a7cff;
  border-radius: 48px;
  flex: 0 auto;
  justify-content: center;
  align-items: center;
  max-width: 346.44px;
  padding: 16px 28px;
  text-decoration: none;
  display: flex;
  overflow: hidden;
  box-shadow: 0 16px 32px #0a7cff7a, 0 4px 8px #0a7cff1f, 0 2px 6px #0a7cff3d, 0 1px 3px #0a7cff3d, inset 1px 1px 2px #ffffff3d;
}

.divbtn-label {
  flex: 0 auto;
  justify-content: center;
  align-items: flex-start;
  padding-right: .5px;
  text-decoration: none;
  display: flex;
}

.text-33 {
  direction: rtl;
  color: #fff;
  text-align: center;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 16px;
  font-weight: 700;
  line-height: 24px;
  text-decoration: none;
}

.section---footer {
  grid-row-gap: 10px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  padding: 10px 10px 30px;
  text-decoration: none;
  display: flex;
}

.footer {
  direction: ltr;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  max-width: 1400px;
  height: 64px;
  padding-left: 50px;
  padding-right: 50px;
  text-decoration: none;
  display: flex;
}

.social-area {
  grid-row-gap: 10px;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  max-width: 280px;
  text-decoration: none;
  display: flex;
}

.socials {
  grid-column-gap: 30px;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  text-decoration: none;
  display: flex;
}

.x-logo {
  opacity: 1;
  object-fit: cover;
  overflow: hidden;
}

.footer_text {
  direction: rtl;
  color: #ffffff80;
  letter-spacing: -.0001em;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 13px;
  font-weight: 400;
  line-height: 26px;
  text-decoration: none;
}

.sgb-logo {
  grid-row-gap: 10px;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-end;
  width: 100%;
  max-width: 280px;
  text-decoration: none;
  display: flex;
}

.sgb-logo_end {
  object-fit: cover;
  overflow: hidden;
}

.instagram_logo {
  opacity: 1;
  object-fit: cover;
  overflow: hidden;
}

.youtube_logo {
  opacity: 1;
  mix-blend-mode: normal;
  object-fit: cover;
  overflow: hidden;
}

.underline_white {
  opacity: .15;
  background-color: #fff0;
  background-image: linear-gradient(90deg, #fff0, #fff);
  width: 100%;
  height: 1px;
}

.underline_blue {
  opacity: 1;
  background-color: #fff0;
  background-image: linear-gradient(90deg, #00a3e200, #00a3e2);
  width: 100%;
  height: 1px;
}

.prop_bg_image {
  object-fit: cover;
  display: block;
  overflow: hidden;
}

.div-tb-content {
  grid-row-gap: 10px;
  direction: ltr;
  background-image: linear-gradient(#f2f0f51a 0%, #00aeef 100%);
  border-radius: 24px;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  padding: 1px;
  text-decoration: none;
  display: flex;
}

.upgrade-column-line {
  background-image: linear-gradient(#fff0, #fff 50%, #fff0);
  width: 1px;
  height: 500px;
}

.upgrade-left-underline {
  background-image: linear-gradient(90deg, #fff0, #fff);
  width: 100%;
  height: 1px;
}

.upgrade-right-underline {
  background-image: linear-gradient(90deg, #fff, #fff0);
  width: 100%;
  height: 1px;
}

.feature-box-bg-light {
  z-index: -1;
  box-sizing: border-box;
  opacity: .65;
  -webkit-backdrop-filter: blur(50px);
  backdrop-filter: blur(50px);
  object-fit: fill;
  background-image: radial-gradient(circle closest-corner, #1b0b97, #8f5dff00 57%, #6e56ff00 100%, #915dff00);
  border-radius: 0;
  width: 500px;
  height: 500px;
  margin-top: 0;
  padding-top: 0;
  position: absolute;
  inset: auto;
  overflow: hidden;
}

.perpple-shadow {
  z-index: -2;
  position: absolute;
  top: 0;
  right: -40%;
}

.blue-shadow {
  z-index: -2;
  position: absolute;
  top: 0;
  left: -40%;
}

.road_line {
  background-color: #fff;
  width: 3px;
  height: 100%;
}

.road_line-start, .road_line-end {
  background-color: #fff0;
  width: 3px;
  height: 100%;
}

.right_blue_shadow {
  z-index: -2;
  position: absolute;
  inset: auto -40% auto auto;
}

.left_perpple_shadow {
  z-index: -2;
  position: absolute;
  inset: auto auto auto -40%;
}

.image-3, .video_bg {
  position: absolute;
  top: 0;
}

.sound_text_title {
  direction: rtl;
  color: #0098ff;
  text-align: right;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 24px;
  font-weight: 700;
  line-height: 120%;
  text-decoration: none;
}

.video_play {
  grid-column-gap: 10px;
  cursor: pointer;
  background-image: linear-gradient(#273c8d, #230f5b);
  border-radius: 43.5px;
  justify-content: center;
  align-items: center;
  width: 87px;
  height: 87px;
  padding: 0;
  text-decoration: none;
  transition: box-shadow .2s;
  display: flex;
  box-shadow: 28px -11px 137px #2c4bcd;
}

.video_play:hover {
  box-shadow: 0 0 15px 15px #1f48ff33, 28px -11px 137px #2c4bcd;
}

.media-play_arrow {
  object-fit: cover;
  width: 36px;
  height: 36px;
  overflow: hidden;
}

.star_bg_cta {
  position: absolute;
  top: 0;
}

.body-large {
  margin-bottom: 0;
  font-size: 18px;
  line-height: 160%;
  text-decoration: none;
}

.body-large.text-color-light {
  opacity: .7;
  direction: rtl;
  color: #d6d6d6;
  text-align: right;
  width: 100%;
  height: auto;
}

.what-question {
  direction: rtl;
  color: #fff;
  text-align: right;
  flex: 1;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 18px;
  line-height: 150%;
}

.plus-icon {
  width: 100%;
  max-width: 24px;
  height: 24px;
  margin-top: 0;
}

.what-answer-block {
  grid-column-gap: .5rem;
  grid-row-gap: .5rem;
  flex-flow: column;
  justify-content: center;
  align-items: flex-end;
  width: 100%;
  height: auto;
  padding-top: 16px;
  padding-bottom: 0;
  display: flex;
}

.answer-block {
  text-align: right;
  background-color: #0000;
  justify-content: flex-end;
  align-items: center;
  width: 100%;
  height: auto;
  display: flex;
  position: static;
  overflow: hidden;
}

.question-block {
  grid-column-gap: 12px;
  white-space: pre-wrap;
  width: 100%;
  padding: 30px 0 0;
  display: flex;
}

.question-block.top {
  justify-content: space-between;
  align-items: center;
  height: auto;
  padding-top: 0;
}

.question-inner {
  grid-column-gap: 20px;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  display: flex;
}

.what-i-do {
  border: 1px solid #ffffff0d;
  border-radius: 16px;
  flex-direction: column;
  justify-content: center;
  align-items: flex-end;
  width: 100%;
  height: auto;
  padding: 16px 24px;
  display: flex;
  position: static;
}

.prop_slider {
  background-color: #070c3700;
  height: auto;
  display: none;
}

.background-video {
  width: 100%;
  height: auto;
}

.video_player {
  width: auto;
  height: auto;
  position: absolute;
  inset: auto;
}

.background-video-2 {
  width: 100%;
  height: 700px;
  overflow: visible;
}

.background-video-3 {
  width: 100%;
  height: 700px;
  position: relative;
}

.lightbox-video-thumbnail {
  width: 100%;
  height: 0%;
  padding-bottom: 54.25%;
}

.video-lightbox {
  justify-content: center;
  align-items: center;
  width: 100%;
  display: flex;
  position: relative;
}

.play-button-wrapper {
  color: #fff;
  letter-spacing: .18em;
  text-transform: uppercase;
  background-color: #000;
  border-radius: 999em;
  justify-content: center;
  align-items: center;
  width: 6em;
  height: 6em;
  padding-left: .3em;
  font-size: 1.2em;
  font-weight: 600;
  display: none;
  position: absolute;
}

.play-button-wrapper.is-mobile {
  display: none;
}

.play-button-text {
  font-size: 1.4em;
}

.background-video-4 {
  width: 100%;
  height: 600px;
}

.vimeo-player-overlay {
  pointer-events: none;
  background-color: #00000059;
  position: absolute;
  inset: 0%;
}

.unmute-icon {
  width: 1em;
  height: 1em;
  font-size: 1.9em;
}

.custom-video-wrapper {
  z-index: 1;
  justify-content: center;
  align-items: center;
  display: flex;
  position: relative;
}

.vimeo-embed {
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0%;
}

.play-pause--icon {
  width: 1em;
  height: 1em;
  font-size: 1.7em;
}

.video-play-pause-toggle {
  cursor: pointer;
  justify-content: center;
  align-items: center;
  position: absolute;
  inset: 1.5em 1.5em auto auto;
}

.video-pause-wrapper {
  z-index: 1;
  color: #000;
  border-radius: 999em;
  flex: none;
  justify-content: center;
  align-items: center;
  display: flex;
  position: absolute;
  inset: 0%;
}

.video-play-pause-wrapper {
  background-color: #ffffffe6;
  border-radius: 999em;
  width: 5em;
  height: 5em;
  transition: all .25s;
}

.video-play-pause-wrapper:hover {
  transform: scale(1.2);
}

.video-play-pause-wrapper:active {
  transform: scale(.95);
}

.video-vimeo-wrapper {
  width: 100%;
  height: 0%;
  padding-top: 56.25%;
  position: relative;
  overflow: hidden;
}

.video-play-wrapper {
  z-index: 0;
  color: #000;
  border-radius: 999em;
  flex: none;
  justify-content: center;
  align-items: center;
  padding-left: .2em;
  display: flex;
  position: absolute;
  inset: 0%;
}

.video-unmute-wrapper {
  z-index: 3;
  -webkit-backdrop-filter: blur(9px);
  backdrop-filter: blur(9px);
  color: #000;
  cursor: pointer;
  background-color: #ffffffb3;
  border-radius: 999em;
  flex: none;
  justify-content: center;
  align-items: center;
  width: 7em;
  height: 7em;
  font-size: 1em;
  transition: all .25s cubic-bezier(.165, .84, .44, 1);
  display: flex;
  box-shadow: 0 10px 4em #00000073;
}

.video-unmute-wrapper:hover {
  transform: scale(1.2);
}

.video-unmute-wrapper:active {
  transform: scale(.95);
}

.video-unmute-button {
  justify-content: center;
  align-items: center;
  display: flex;
  position: absolute;
}

.global_video_wrap {
  z-index: 0;
  object-fit: cover;
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0%;
}

.global_video_background {
  opacity: .1;
  object-fit: cover;
  background-color: #fff;
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0%;
}

.global_video_img {
  height: 100%;
}

.global_video_vid {
  object-fit: cover;
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0%;
}

.global_video_overlay {
  background-color: #000;
  position: absolute;
  inset: 0%;
}

.insert-your-video-embed-here {
  z-index: 99;
  object-fit: cover;
  border-radius: 10px;
  width: 100%;
  height: auto;
  position: static;
  top: 4%;
  left: 3%;
  overflow: hidden;
}

.upgrade-box-1 {
  grid-row-gap: 56px;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  max-width: 361px;
  text-decoration: none;
  display: flex;
}

.all_section {
  width: auto;
  height: auto;
  position: relative;
  overflow: hidden;
}

.video_preview {
  width: 100%;
  height: auto;
}

.code-embed {
  border-radius: 16px;
  width: 100%;
  height: auto;
  overflow: visible;
}

.char_div_int {
  justify-content: space-around;
  align-items: center;
  width: 100%;
  height: auto;
  display: flex;
  position: relative;
}

.right_text_div, .left_text_div {
  height: auto;
  padding-bottom: 0%;
}

.sgb_character_div {
  object-fit: fill;
  justify-content: center;
  align-items: center;
  width: auto;
  height: auto;
  display: flex;
  position: relative;
}

.char_back_blue {
  z-index: -2;
  box-sizing: border-box;
  object-fit: fill;
  width: 200%;
  max-width: none;
  height: auto;
  position: absolute;
  inset: 0% -50% 0% 0%;
  overflow: visible;
}

.sgb-character {
  width: auto;
  height: auto;
  position: static;
}

.sgb-char {
  z-index: -1;
  position: absolute;
  left: auto;
  right: auto;
}

.div-block-3 {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  justify-content: flex-end;
  align-items: center;
  display: flex;
}

.sgb-char-2 {
  width: 200px;
}

.char2_shadow {
  z-index: -2;
  width: 200%;
  max-width: none;
  height: auto;
  position: absolute;
  top: 0;
  left: -50%;
  right: auto;
  overflow: visible;
}

.div-block-4 {
  position: relative;
}

.hero-bottom {
  z-index: 1;
  object-fit: fill;
  flex-flow: column;
  flex: 0 auto;
  order: 1;
  justify-content: center;
  align-self: center;
  align-items: center;
  width: 100%;
  height: auto;
  min-height: auto;
  display: flex;
  position: absolute;
  bottom: 0;
}

.hero_text-outside {
  z-index: 3;
  grid-row-gap: 24px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  max-width: none;
  height: auto;
  padding-bottom: 0;
  text-decoration: none;
  display: flex;
  position: absolute;
  inset: 6.5% auto auto;
}

.top-perpple-shadow {
  width: 50%;
  position: absolute;
  inset: -70% auto auto;
}

.hero-title-text {
  opacity: 1;
  direction: rtl;
  text-align: center;
  -webkit-text-fill-color: transparent;
  background-image: linear-gradient(#86e1ff, #0091eb);
  -webkit-background-clip: text;
  background-clip: text;
  width: 100%;
  max-width: 350px;
  margin-top: 0;
  margin-bottom: 0;
  font-family: Yekanbakhfanum, Arial, sans-serif;
  font-size: 44px;
  font-weight: 800;
  line-height: 130%;
  text-decoration: none;
}

.hero-title-sub {
  opacity: 1;
  direction: rtl;
  color: #fff;
  text-align: right;
  max-width: 350px;
  margin-top: 0;
  margin-bottom: 0;
  font-family: Yekanbakhfanum, Arial, sans-serif;
  font-size: 18px;
  font-weight: 400;
  line-height: 150%;
  text-decoration: none;
}

.hero-cta {
  grid-column-gap: 16px;
  opacity: 1;
  pointer-events: auto;
  cursor: pointer;
  background-color: #0a7cff;
  border-radius: 48px;
  flex: 0 auto;
  justify-content: center;
  align-items: center;
  width: 320px;
  max-width: 350px;
  margin-bottom: 20px;
  padding: 16px 28px;
  text-decoration: none;
  transition: background-color .5s, box-shadow .5s;
  display: flex;
  overflow: hidden;
  box-shadow: 0 16px 32px #0a7cff7a, 0 4px 8px #0a7cff1f, 0 2px 6px #0a7cff3d, 0 1px 3px #0a7cff3d, inset 1px 1px 2px #ffffff3d;
}

.hero-cta:hover {
  background-color: #056de4;
  box-shadow: 0 0 8px 6px #0a7cff40, 0 16px 32px #0a7cff7a, 0 4px 8px #0a7cff1f, 0 2px 6px #0a7cff3d, 0 1px 3px #0a7cff3d, inset 1px 1px 2px #ffffff3d;
}

.hero-right_text_div, .hero-left_text_div {
  height: auto;
  padding-bottom: 0%;
}

.bold-text, .bold-text-2 {
  direction: rtl;
}

.features {
  grid-row-gap: 24px;
  direction: ltr;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  max-width: 798px;
  text-decoration: none;
  display: flex;
}

.feature-row-2 {
  grid-column-gap: 24px;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 170px;
  display: flex;
}

.sgb-feature-box {
  grid-row-gap: 24px;
  background-color: #ffffff0d;
  background-image: linear-gradient(45deg, #03072480, #06245a80);
  border: 1px solid #362ab880;
  border-radius: 16px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  max-width: 250px;
  height: 170px;
  padding: 20px;
  text-decoration: none;
  transition: all .2s;
  display: flex;
  overflow: hidden;
}

.sgb-feature-box:hover {
  box-shadow: 0 0 25px 5px #0ea9fa40;
}

.chart {
  object-fit: cover;
}

.sgb-feature-title {
  direction: rtl;
  color: #fff;
  text-align: center;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  text-decoration: none;
}

.div-block-5 {
  grid-column-gap: 60px;
  grid-row-gap: 60px;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  padding-bottom: 100px;
  display: flex;
}

.upgrade-title-copy {
  grid-row-gap: 12px;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  max-width: 1440px;
  text-decoration: none;
  display: flex;
}

.bold-text-3, .bold-text-4 {
  font-weight: 400;
}

.div-block-6 {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  direction: ltr;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  display: flex;
}

.bold-text-5, .bold-text-6 {
  direction: rtl;
  color: #099bfe;
}

.bold-text-7, .bold-text-8, .bold-text-9 {
  direction: rtl;
}

.bold-text-10, .bold-text-11 {
  direction: rtl;
  color: #099bfe;
}

.bold-text-12, .bold-text-13 {
  direction: rtl;
}

.prop_p_sub4 {
  direction: rtl;
  color: #00aeef;
  text-align: center;
  letter-spacing: 0;
  width: 100%;
  margin-top: 0;
  margin-bottom: 0;
  font-family: Yekanbakhfanum, Arial, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  text-decoration: none;
}

.slide, .slide-2, .slide-3 {
  width: auto;
}

.key-metrics-all-number._02, .key-metrics-all-number._03, .key-metrics-all-number._01 {
  -webkit-text-fill-color: transparent;
  background-color: #fff;
  -webkit-background-clip: text;
  background-clip: text;
}

.dsc-sub-text-3 {
  color: #fff;
  text-align: center;
  margin-top: 0;
  margin-bottom: 0;
  font-family: Yekanbakhfanum, Arial, sans-serif;
  font-size: 18px;
  font-weight: 400;
  line-height: 100%;
  text-decoration: none;
}

.sgb-record-sub-title {
  direction: rtl;
  color: #0189eb;
  text-align: right;
  margin-top: 0;
  margin-bottom: 0;
  font-family: Yekanbakhfanum, Arial, sans-serif;
  font-size: 24px;
  line-height: 150%;
}

.sgb-records-info {
  grid-column-gap: 50px;
  flex: 0 auto;
  justify-content: center;
  align-items: flex-start;
  max-width: 1400px;
  margin-top: 24px;
  padding-left: 16px;
  padding-right: 16px;
  text-decoration: none;
  display: flex;
  position: relative;
}

.dsc-text-3 {
  grid-row-gap: 16px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-decoration: none;
  display: flex;
}

.sgb-dsc-sub-text {
  color: #fff;
  text-align: center;
  width: 100%;
  margin-top: 0;
  margin-bottom: 0;
  font-family: Yekanbakhfanum, Arial, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 100%;
  text-decoration: none;
}

.sgb-dsc-box {
  grid-row-gap: 24px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-decoration: none;
  display: flex;
}

.record-underline {
  opacity: .25;
  background-image: linear-gradient(90deg, #fff0, #fff 50%, #fff0);
  width: 100%;
  height: 1.5px;
}

.sgb-record-sub-title-2 {
  direction: rtl;
  color: #fff;
  text-align: center;
  width: 100%;
  margin-top: 0;
  margin-bottom: 0;
  font-family: Yekanbakhfanum, Arial, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 180%;
  text-decoration: none;
}

.sgb-dsc-text {
  color: #0098ff;
  text-align: center;
  margin-top: 0;
  margin-bottom: 0;
  font-family: Yekanbakhfanum, Arial, sans-serif;
  font-size: 20px;
  font-weight: 700;
  line-height: 100%;
  text-decoration: none;
}

.key-metrics-numbers {
  z-index: 3;
  -webkit-text-fill-color: transparent;
  background-color: #fff;
  -webkit-background-clip: text;
  background-clip: text;
  justify-content: center;
  align-items: flex-start;
  height: 54px;
  display: flex;
  overflow: hidden;
}

.candle-stick-model-middle {
  width: 300px;
  position: absolute;
  inset: -50% auto 0% -15%;
}

.sgb-record-text {
  grid-column-gap: 4px;
  grid-row-gap: 4px;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  width: auto;
  max-width: none;
  text-decoration: none;
  display: flex;
}

.number-and-count-section {
  grid-column-gap: 28px;
  grid-row-gap: 28px;
  direction: ltr;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: auto;
  max-width: none;
  height: auto;
  text-decoration: none;
  display: flex;
}

.group {
  object-fit: cover;
  justify-content: center;
  align-items: center;
  width: 100%;
  max-width: 290.638px;
  height: 200px;
  text-decoration: none;
  display: flex;
}

.sgb-records {
  grid-column-gap: 40px;
  justify-content: flex-end;
  align-items: flex-start;
  width: 100%;
  margin-bottom: 24px;
  text-decoration: none;
  display: flex;
}

.record-text-content {
  grid-row-gap: 36px;
  flex-direction: column;
  justify-content: space-between;
  align-self: center;
  align-items: center;
  width: 100%;
  max-width: none;
  height: 100%;
  min-height: auto;
  max-height: none;
  text-decoration: none;
  display: flex;
}

.sgb-record-title {
  color: #fff;
  text-align: right;
  width: 100%;
  margin-top: 0;
  margin-bottom: 0;
  font-family: Yekanbakhfanum, Arial, sans-serif;
  font-size: 44px;
  font-weight: 700;
  line-height: 100%;
  text-decoration: none;
}

.key-metrics-dsc {
  color: #fff;
  padding-top: 0;
  padding-bottom: 0;
  padding-right: 8px;
  font-family: Yekanbakhfanum, Arial, sans-serif;
  font-size: 24px;
  font-weight: 600;
  line-height: 52px;
}

.record-underline-2 {
  opacity: .25;
  background-image: linear-gradient(90deg, #fff0, #fff 50%, #fff0);
  width: 100%;
  height: 1.5px;
}

.sgb-gold-logo {
  object-fit: cover;
  width: 150px;
  height: 100%;
  overflow: hidden;
}

.key-metrics-counter-number {
  color: #fff;
  text-align: center;
  padding-top: 0;
  padding-bottom: 0;
  font-family: Yekanbakhfanum, Arial, sans-serif;
  font-size: 54px;
  font-weight: 700;
  line-height: 52px;
}

.big-shadow-for-records {
  z-index: -1;
  position: absolute;
  inset: -50% -25% auto auto;
}

.sgb-record-sub-title-copy {
  direction: rtl;
  color: #fff;
  text-align: right;
  margin-top: 0;
  margin-bottom: 0;
  font-family: Yekanbakhfanum, Arial, sans-serif;
  font-size: 18px;
  font-weight: 400;
  line-height: 150%;
}

.div-block-7 {
  flex-flow: column;
  justify-content: center;
  align-items: flex-start;
  margin-top: 16px;
  margin-bottom: 16px;
  display: flex;
}

.sgb-records-title {
  direction: rtl;
  color: #0000;
  text-align: center;
  -webkit-text-fill-color: transparent;
  background-image: linear-gradient(270deg, #f2f0f5, #0098ff);
  -webkit-background-clip: text;
  background-clip: text;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 44px;
  font-weight: 700;
  line-height: 64px;
  text-decoration: none;
}

.cta-area {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  flex-flow: row;
  justify-content: center;
  align-items: flex-end;
  width: 100%;
  min-width: auto;
  display: flex;
}

.cta-box {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: auto;
  display: flex;
}

.cta-record {
  grid-column-gap: 11px;
  opacity: 1;
  pointer-events: auto;
  cursor: pointer;
  background-color: #0a7cff;
  border-radius: 48px;
  flex: 0 auto;
  justify-content: center;
  align-items: center;
  width: 100%;
  max-width: none;
  margin-bottom: 20px;
  padding: 16px 24px;
  text-decoration: none;
  transition: background-color .5s, box-shadow .5s;
  display: flex;
  overflow: hidden;
}

.cta-record:hover {
  background-color: #0026ff;
}

.section---ps5 {
  grid-row-gap: 10px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  padding-bottom: 100px;
  text-decoration: none;
  display: flex;
}

.ps5-area {
  grid-row-gap: 32px;
  direction: ltr;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  height: auto;
  text-decoration: none;
  display: flex;
}

.ps5-title {
  direction: rtl;
  color: #0000;
  text-align: center;
  -webkit-text-fill-color: transparent;
  background-image: linear-gradient(270deg, #f2f0f5, #0098ff);
  -webkit-background-clip: text;
  background-clip: text;
  width: 100%;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 44px;
  font-weight: 700;
  line-height: 62.4px;
  text-decoration: none;
}

.ps5-content {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  justify-content: center;
  align-items: center;
  width: 100%;
  max-width: 1200px;
  display: flex;
}

.image-4 {
  width: 450px;
}

.ps5-form-side {
  direction: rtl;
  background-color: #010d681a;
  border: 1.5px solid #04389d;
  border-radius: 24px;
  justify-content: center;
  align-items: center;
  width: 550px;
  height: auto;
  margin-left: 0;
  padding: 24px;
  display: flex;
  box-shadow: 0 0 25px 10px #0349a340;
}

.order_form-success {
  background-color: #070c3700;
  width: 100%;
}

.fs-range_values {
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  margin-top: 1.25rem;
  padding-left: 0;
  padding-right: 0;
  display: flex;
}

.form_radio-icon {
  background-color: #30354e14;
  width: 1.4rem;
  height: 1.4rem;
  margin-top: 0;
  margin-left: 0;
  margin-right: .5rem;
}

.form_radio-icon.w--redirected-checked {
  background-color: #fff;
  border-width: .4rem;
  border-color: #3c6ce5;
  width: 1.4rem;
  height: 1.4rem;
}

.form_radio-icon.w--redirected-focus {
  box-shadow: none;
  outline-offset: .1rem;
  outline: .1rem solid #000;
  width: 1.4rem;
  height: 1.4rem;
}

.form_radio {
  cursor: pointer;
  background-color: #30354e14;
  border-radius: 99rem;
  flex-direction: row;
  align-items: center;
  margin-bottom: 0;
  padding: .9rem;
  display: flex;
}

.form_input {
  color: #fff;
  background-color: #099bfe1a;
  border: 1px solid #eee;
  border-radius: 99rem;
  min-height: 3.25rem;
  margin-bottom: 0;
  padding: .5rem 1.25rem;
  font-size: 1.125rem;
}

.form_input:focus {
  outline-offset: 0rem;
  border-style: none;
  outline: .1rem solid #4574ff;
}

.form_input::placeholder {
  color: #222;
}

.form_field-wrapper {
  width: 100%;
}

.button {
  color: #fff;
  text-align: center;
  background-color: #3c6ce5;
  border-radius: 99rem;
  padding: .75rem 1.5rem;
  font-weight: 600;
  transition: all .25s;
}

.button:hover {
  background-color: #2756cf;
  transform: scale(1.05)rotate(3deg);
}

.button.is-large {
  background-color: #0098ff;
  margin-top: 32px;
  padding: 1rem 2rem;
  font-size: 1.125rem;
}

.button.is-large:hover {
  background-color: #0026ff;
  transform: none;
}

.form-cols {
  grid-column-gap: .75rem;
  grid-row-gap: .75rem;
  grid-template-rows: auto;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
  grid-auto-columns: 1fr;
  width: 100%;
  margin-top: 16px;
  display: grid;
}

.fs-rangeslider_wrapper {
  align-items: center;
  margin-left: .5rem;
  margin-right: .5rem;
  padding-top: .5rem;
  padding-bottom: 1rem;
  font-size: 1.125rem;
  display: block;
  position: relative;
}

.fs-rangeslider_handle {
  z-index: 1;
  cursor: grab;
  background-color: #2756cf;
  border-radius: 100rem;
  flex: none;
  width: 1.5rem;
  height: 1.5rem;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  box-shadow: 1px 1px 12px #0003;
  outline-offset: 0rem !important;
  outline-color: #000 !important;
}

.fs-rangeslider_handle:focus {
  outline-offset: 0rem;
  background-color: #3c6ce5;
  outline: .1rem solid #302e33;
}

.fs-rangeslider_track {
  background-color: #30354e14;
  border-radius: 999rem;
  height: .7rem;
  margin-left: auto;
  margin-right: auto;
  padding-left: 0;
  padding-right: 0;
  position: relative;
}

.fs-rangeslider_fill {
  background-color: #3c6ce5;
  border-radius: 999px;
  width: 20%;
  height: 100%;
  position: absolute;
}

.order_form {
  direction: rtl;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  display: flex;
}

.spacer-small {
  width: 100%;
  padding-top: 1rem;
}

.fs-rangeslider_input {
  display: none;
}

.order_form-block {
  width: 100%;
  max-width: 35rem;
}

.form_label {
  color: #fff;
  margin-bottom: .5rem;
  margin-left: .4rem;
  font-size: 16px;
}

.order_form-error {
  border-radius: 16px;
  width: 100%;
  margin-top: 24px;
}

.ps5-title-area {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  text-align: center;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  display: flex;
}

.ps5-sub-title {
  direction: rtl;
  color: #fff;
  font-size: 16px;
}

.success-text {
  color: #0098ff;
  margin-top: 24px;
  font-size: 18px;
  font-weight: 700;
}

.error-text {
  color: #b10000;
  font-size: 16px;
  font-weight: 700;
}

.error-div {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.hero-cta-area {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  justify-content: center;
  align-items: center;
  display: flex;
}

.ps5-cta {
  grid-column-gap: 16px;
  opacity: 1;
  pointer-events: auto;
  cursor: pointer;
  background-color: #740aff;
  border-radius: 48px;
  flex: 0 auto;
  justify-content: center;
  align-items: center;
  width: 320px;
  max-width: 350px;
  margin-bottom: 20px;
  padding: 16px 28px;
  text-decoration: none;
  transition: background-color .5s, box-shadow .5s;
  display: flex;
  overflow: hidden;
  box-shadow: 0 16px 32px #740aff66, 0 4px 8px #740aff1f, 0 2px 6px #740aff33, 0 1px 3px #740aff33, inset 1px 1px 2px #ffffff3d;
}

.ps5-cta:hover {
  background-color: #6507e0;
  box-shadow: 0 0 8px 6px #740aff40, 0 16px 32px #740aff66, 0 4px 8px #740aff1a, 0 2px 6px #740aff33, 0 1px 3px #740aff33, inset 1px 1px 2px #ffffff3d;
}

.ps5-span {
  color: #0098ff;
  font-size: 24px;
  font-weight: 700;
}

@media screen and (min-width: 1280px) {
  .hero_text1, .hero_text2, .cta {
    opacity: 1;
  }

  .header-bottom-vector {
    overflow: visible;
  }

  .character_div {
    flex: 0 auto;
    order: 0;
    display: block;
    position: absolute;
    inset: 40% auto auto 5%;
    overflow: visible;
  }

  .mosalas {
    position: absolute;
    inset: 20% 10% 0% auto;
  }

  .zarbdar {
    z-index: 2;
    position: absolute;
    inset: 45% 18% 0% auto;
  }

  ._3d-logo {
    width: 150px;
    right: 22%;
  }

  .golden-cup {
    left: -8%;
  }

  .hero_text-outside {
    top: 7%;
  }

  .hero-title-text, .hero-title-sub, .hero-cta, .cta-record, .ps5-cta {
    opacity: 1;
  }
}

@media screen and (min-width: 1440px) {
  .hero_text {
    grid-row-gap: 100px;
  }

  .hero_text1, .hero_text2, .cta {
    opacity: 1;
  }

  .header-bottom-vector {
    overflow: visible;
  }

  .character_div {
    left: 5%;
  }

  .zarbdar {
    max-width: 100%;
  }

  .dayere_blur {
    top: -8%;
  }

  ._3d-logo {
    right: 22%;
  }

  .hero_text_top {
    grid-column-gap: 50px;
    grid-row-gap: 50px;
    flex-flow: column;
    justify-content: center;
    align-items: center;
    display: flex;
  }

  .what-prop-section {
    padding-top: 180px;
  }

  .dayere-left {
    top: 2%;
    left: -2%;
  }

  .golden-cup {
    left: -8%;
  }

  .hero_text-outside {
    grid-row-gap: 50px;
    top: 7%;
  }

  .hero-title-text, .hero-title-sub, .hero-cta {
    opacity: 1;
  }

  .key-metrics-numbers {
    height: 62px;
  }

  .key-metrics-dsc {
    color: #fff;
    font-size: 24px;
    line-height: 62px;
  }

  .key-metrics-counter-number {
    color: #fff;
    font-size: 55px;
    line-height: 62px;
  }

  .cta-record, .ps5-cta {
    opacity: 1;
  }
}

@media screen and (min-width: 1920px) {
  .hero_section {
    min-height: 950px;
  }

  .to-shadow-and-star {
    justify-content: flex-start;
    align-items: center;
    height: 80%;
    margin-top: 0;
    left: auto;
    right: auto;
  }

  .stars {
    height: auto;
    margin-top: 0;
  }

  .header-text-content {
    flex: 0 auto;
    order: -1;
  }

  .hero_text {
    grid-row-gap: 24px;
  }

  .hero_text1 {
    opacity: 1;
    max-width: 400px;
    font-size: 54px;
  }

  .hero_text2 {
    opacity: 1;
    max-width: 400px;
  }

  .cta {
    opacity: 1;
  }

  .header-bottom-vector {
    object-fit: cover;
    overflow: visible;
  }

  .div-block {
    background-position: 50% 100%;
  }

  .right_shadow {
    z-index: -2;
    display: block;
    position: absolute;
    left: -20%;
  }

  .left_shadow {
    inset: 0% -20% 0% auto;
  }

  .character_div {
    left: 5%;
  }

  .xbox_controller {
    left: -2%;
  }

  .play_station {
    right: -2%;
  }

  .moraba {
    top: 40%;
    right: -1%;
  }

  .dayere {
    top: 30%;
    right: 9%;
  }

  .mosalas {
    right: 5%;
  }

  .zarbdar {
    top: 48%;
    right: 7%;
  }

  .big_peyk {
    left: 6%;
  }

  .mini_peyk {
    left: 5%;
  }

  .dollar_cash {
    width: 150px;
    top: 30%;
    left: 10%;
  }

  .dollar_symbol {
    width: 150px;
    top: 30%;
    right: 10%;
  }

  .star_symbol {
    top: 30%;
    left: 12%;
  }

  .big_star {
    top: 30%;
    left: 16%;
  }

  .mini_star {
    top: 25%;
    left: 17%;
  }

  .dayere_blur {
    max-width: 12%;
    top: -10%;
  }

  ._3d-logo {
    width: 200px;
    top: 20%;
    right: 15%;
  }

  .what-prop-section {
    padding-top: 150px;
  }

  .prop_paragraph_div {
    max-width: 900px;
  }

  .golden-cup {
    left: -4%;
  }

  .perpple-shadow {
    right: -50%;
  }

  .char_div_int {
    grid-column-gap: 300px;
    grid-row-gap: 300px;
    justify-content: center;
    align-items: center;
    padding-left: 0;
    padding-right: 0;
  }

  .hero_text-outside {
    grid-row-gap: 100px;
    top: 7%;
  }

  .hero-title-text {
    opacity: 1;
    max-width: 400px;
    font-size: 54px;
  }

  .hero-title-sub {
    opacity: 1;
    max-width: 400px;
  }

  .hero-cta {
    opacity: 1;
  }

  .key-metrics-dsc {
    font-size: 24px;
  }

  .cta-record, .ps5-cta {
    opacity: 1;
  }
}

@media screen and (max-width: 991px) {
  .header-text-content {
    height: auto;
  }

  .hero_text1 {
    opacity: 1;
    max-width: none;
    padding-bottom: 16px;
    font-size: 32px;
  }

  .hero_text2 {
    opacity: 1;
    text-align: center;
    width: 100%;
    max-width: 100%;
  }

  .cta {
    opacity: 1;
  }

  .character_div {
    top: 60%;
  }

  .xbox_controller {
    max-width: 35%;
    top: 50%;
    left: -14%;
  }

  .play_station {
    max-width: 40%;
    top: 50%;
    right: -7%;
  }

  .moraba {
    width: 60px;
    top: 50%;
  }

  .dayere {
    width: 60px;
    top: 54%;
    right: 22%;
  }

  .mosalas {
    width: 60px;
    top: 45%;
  }

  .zarbdar {
    width: 60px;
    top: 65%;
  }

  .big_peyk {
    width: 70px;
    top: 45%;
  }

  .mini_peyk {
    top: 50%;
  }

  .dollar_cash {
    width: 70px;
    top: 10%;
  }

  .dollar_symbol {
    width: 90px;
    top: 10%;
    right: 20%;
  }

  .star_symbol {
    top: 55%;
  }

  .big_star {
    top: 54%;
  }

  .mini_star {
    top: 52%;
  }

  .dayere_blur {
    max-width: 30%;
    top: -7%;
  }

  .mosalas_blur {
    max-width: 30%;
    top: -8%;
  }

  .moraba_blur {
    max-width: 30%;
    top: -10%;
  }

  .zarbdar_blur {
    max-width: 30%;
    top: -9%;
    left: -5%;
  }

  ._3d-logo {
    width: 100px;
    top: 44%;
    right: 18%;
  }

  .hero_text_top {
    padding-left: 20px;
    padding-right: 20px;
  }

  .what-prop-section {
    margin-top: 72px;
    margin-bottom: 90px;
    padding-top: 72px;
  }

  .prop_top_text {
    font-size: 32px;
  }

  .prop_bottom_text {
    direction: rtl;
    font-size: 32px;
  }

  .div-tb-enter {
    width: auto;
    max-width: 400px;
    padding-left: 16px;
    padding-right: 16px;
  }

  .prop-head-title {
    direction: rtl;
    font-size: 16px;
  }

  .table-prop-content {
    width: auto;
  }

  .prop-content-text {
    font-size: 12px;
  }

  .div-tb-title---enter {
    width: 150px;
    padding-left: 12px;
    padding-right: 16px;
  }

  .tetris-1 {
    width: 60px;
    max-width: 100%;
    height: auto;
    top: -2%;
    left: auto;
    right: auto;
  }

  .crown {
    width: 40px;
    top: 10%;
    left: 15%;
  }

  .electric {
    width: 40px;
    top: 7%;
    left: 20%;
  }

  .tetris-2 {
    width: 60px;
    height: auto;
    top: 105%;
    left: 2%;
  }

  .assault_rifle {
    top: -10%;
    left: -12%;
  }

  .ak-47 {
    top: -10%;
    right: -15%;
  }

  .sectinon-feature {
    padding-bottom: 90px;
  }

  .feature-top-text {
    text-align: right;
    font-size: 30px;
    line-height: 150%;
  }

  .feature-row {
    grid-column-gap: 24px;
  }

  .feature-title-with-span {
    flex-flow: column;
  }

  .feature-text {
    font-size: 14px;
  }

  .feature-box-title {
    font-size: 20px;
  }

  .tetris-4 {
    top: 20%;
  }

  .tetris-3 {
    top: 2%;
  }

  .section-upgrade {
    padding-bottom: 90px;
  }

  .right-almas {
    width: 60px;
    height: auto;
    top: 0%;
  }

  .right-liner {
    width: 70px;
    height: auto;
    top: 10%;
  }

  .right-dayere {
    width: 60px;
    height: auto;
    top: 12%;
  }

  .right-mosalas {
    width: 90px;
    height: auto;
    top: 18%;
  }

  .dayere-left {
    width: 50px;
    height: auto;
  }

  .mosalas-left {
    width: 80px;
    height: auto;
    top: 10%;
    left: 5%;
  }

  .almas-left {
    width: 60px;
    height: auto;
    top: 20%;
  }

  .upgrade-title-text {
    font-size: 32px;
  }

  .upgrade-all-content {
    justify-content: center;
    align-items: center;
    padding-left: 20px;
    padding-right: 20px;
  }

  .section---roadmap {
    padding-bottom: 90px;
  }

  .roadmap-div {
    flex-flow: column;
  }

  .roadmap-all-box {
    order: 1;
  }

  .road_pic_title, .road_pic_subtitle {
    font-size: 32px;
  }

  .section---video {
    padding-bottom: 90px;
  }

  .video-div {
    padding-left: 20px;
    padding-right: 20px;
  }

  .video-title {
    font-size: 32px;
  }

  .video_thm {
    width: auto;
    height: auto;
  }

  .golden-cup {
    top: 10%;
    left: -15%;
  }

  .faq---section {
    padding-bottom: 90px;
    padding-left: 20px;
    padding-right: 20px;
  }

  .faq_title {
    font-size: 32px;
  }

  .section---sound {
    height: auto;
    padding-bottom: 90px;
  }

  .sound-area {
    height: auto;
  }

  .sound_title {
    font-size: 32px;
  }

  .sound-guide {
    flex-flow: column;
  }

  .sound_text_box {
    justify-content: center;
    align-items: center;
  }

  .sound_text_sub, .sound_middle_text {
    text-align: center;
  }

  .section---end-cta {
    padding-left: 20px;
    padding-right: 20px;
  }

  .end_cta_title {
    font-size: 32px;
    line-height: 150%;
  }

  .upgrade-column-line {
    width: 1px;
    min-width: 1px;
  }

  .video_bg {
    padding-left: 20px;
    padding-right: 20px;
  }

  .sound_text_title {
    text-align: center;
  }

  .prop_slider {
    display: none;
  }

  .play-button-wrapper.is-mobile {
    display: flex;
    transform: rotate(-17deg);
  }

  .video-play-pause-wrapper:hover {
    transform: none;
  }

  .video-play-pause-wrapper:active, .video-play-wrapper:active {
    transform: scale(.9);
  }

  .video-unmute-wrapper:hover {
    transform: none;
  }

  .video-unmute-wrapper:active {
    transform: scale(.9);
  }

  .insert-your-video-embed-here {
    border-radius: 7px;
  }

  .char_div_int {
    flex-flow: column;
    justify-content: center;
    align-items: center;
  }

  .right_text_div {
    width: auto;
    height: auto;
    min-height: auto;
    padding-bottom: 0%;
  }

  .left_text_div {
    order: 1;
    padding-bottom: 0%;
    padding-left: 54px;
    padding-right: 54px;
  }

  .div-block-3 {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
    padding-left: 24px;
    padding-right: 24px;
  }

  .hero_text-outside {
    grid-row-gap: 60px;
    margin-top: 100px;
    margin-bottom: 50px;
    position: static;
  }

  .top-perpple-shadow {
    width: 70%;
    top: -60%;
  }

  .hero-title-text {
    opacity: 1;
    max-width: none;
    padding-bottom: 16px;
    font-size: 32px;
  }

  .hero-title-sub {
    opacity: 1;
    text-align: center;
    width: 100%;
    max-width: 100%;
  }

  .hero-cta {
    opacity: 1;
  }

  .hero-right_text_div {
    width: auto;
    height: auto;
    min-height: auto;
    padding-bottom: 0%;
  }

  .hero-left_text_div {
    order: 1;
    padding-bottom: 0%;
    padding-left: 54px;
    padding-right: 54px;
  }

  .features {
    padding-left: 24px;
    padding-right: 24px;
  }

  .sgb-feature-box {
    order: 1;
  }

  .div-block-5 {
    padding-bottom: 90px;
  }

  .sgb-records-info {
    grid-column-gap: 50px;
    grid-row-gap: 50px;
    flex-flow: column;
    justify-content: center;
    align-items: center;
  }

  .sgb-dsc-box.count3 {
    order: 5;
  }

  .sgb-dsc-box.count2 {
    order: 3;
  }

  .sgb-dsc-box.count1 {
    order: 1;
  }

  .record-underline {
    order: 2;
  }

  .sgb-record-sub-title-2 {
    text-align: center;
  }

  .candle-stick-model-middle {
    width: 250px;
    inset: -10% auto auto -15%;
  }

  .number-and-count-section {
    grid-column-gap: 24px;
    grid-row-gap: 24px;
    flex-flow: column;
    order: 1;
  }

  .record-text-content {
    grid-row-gap: 16px;
    order: -1;
  }

  .record-underline-2 {
    order: 4;
  }

  .big-shadow-for-records {
    top: -25%;
    left: auto;
    right: auto;
  }

  .sgb-record-sub-title-copy {
    font-size: 18px;
    font-weight: 400;
  }

  .sgb-records-title {
    font-size: 32px;
  }

  .cta-record {
    opacity: 1;
  }

  .section---ps5 {
    height: auto;
    padding-bottom: 90px;
  }

  .ps5-area {
    height: auto;
  }

  .ps5-title {
    font-size: 32px;
  }

  .ps5-content {
    flex-flow: column;
  }

  .ps5-cta {
    opacity: 1;
  }
}

@media screen and (max-width: 767px) {
  .hero_section {
    min-height: 900px;
  }

  .header-text-content {
    width: auto;
    padding-top: 40px;
  }

  .hero_text {
    height: auto;
  }

  .hero_text1 {
    opacity: 1;
    max-width: none;
    padding-bottom: 16px;
    font-size: 32px;
    font-weight: 700;
  }

  .hero_text2 {
    opacity: 1;
    font-size: 16px;
  }

  .cta {
    opacity: 1;
  }

  .character_div {
    max-width: none;
    top: 65%;
  }

  .character_image {
    width: 400px;
    max-width: none;
    height: auto;
  }

  .xbox_controller {
    top: 50%;
  }

  .play_station {
    top: 48%;
  }

  .moraba {
    top: 55%;
  }

  .dayere {
    top: 52%;
  }

  .mosalas {
    top: 45%;
    right: 5%;
  }

  .zarbdar {
    top: 60%;
  }

  .big_peyk {
    top: 47%;
  }

  .mini_peyk {
    top: 52%;
  }

  .dollar_cash {
    top: 10%;
    left: 10%;
  }

  .dollar_symbol {
    top: 10%;
    right: 10%;
  }

  .star_symbol {
    top: 55%;
  }

  .big_star {
    top: 52%;
  }

  .mini_star {
    top: 50%;
  }

  .dayere_blur, .mosalas_blur {
    top: -5%;
  }

  .moraba_blur {
    top: -6%;
    left: 14%;
  }

  .zarbdar_blur {
    top: -7%;
  }

  ._3d-logo {
    top: 43%;
    right: 18%;
  }

  .what-prop-section {
    direction: rtl;
    margin-top: 100px;
    padding-left: 0;
    padding-right: 0;
  }

  .prop_texts {
    padding-left: 20px;
    padding-right: 20px;
  }

  .prop_paragraph_div {
    min-width: 0;
    max-width: 100%;
  }

  .prop_p_sub3 {
    max-width: 100%;
  }

  .prop_table_area {
    justify-content: center;
    align-items: stretch;
    display: none;
  }

  .div-tb-title {
    align-items: center;
    width: 100%;
    height: auto;
    min-height: auto;
    margin-left: auto;
    margin-right: auto;
  }

  .div-tb-enter {
    max-width: 600px;
    height: 100%;
    padding-left: 16px;
    padding-right: 16px;
  }

  .prop-head-title {
    grid-column-gap: 8px;
    grid-row-gap: 8px;
    text-align: right;
    flex-flow: row;
    justify-content: center;
    align-items: center;
    display: flex;
  }

  .prop-content-text {
    text-align: right;
  }

  .div-tb-title---enter {
    justify-content: flex-start;
    align-items: flex-end;
    width: 100%;
    height: 100%;
    padding-left: 16px;
    padding-right: 16px;
  }

  .tetris-1 {
    top: -5%;
    right: auto;
  }

  .crown {
    top: auto;
    bottom: -15%;
    left: 5%;
  }

  .electric {
    top: auto;
    bottom: -10%;
    left: 10%;
  }

  .tetris-2 {
    top: 105%;
    left: auto;
    right: 5%;
  }

  .assault_rifle {
    top: -15%;
    left: -17%;
  }

  .ak-47 {
    top: -15%;
    right: -20%;
  }

  .sectinon-feature {
    padding-bottom: 90px;
  }

  .feature-top-text {
    font-size: 24px;
  }

  .feature-row {
    grid-row-gap: 24px;
    flex-flow: column;
    justify-content: center;
    align-items: center;
    padding-left: 24px;
    padding-right: 24px;
  }

  .feature-title-with-span {
    flex-flow: row;
  }

  .tetris-4 {
    width: 60px;
    height: auto;
  }

  .tetris-3 {
    width: 60px;
    height: auto;
    inset: 10% auto 0% 0%;
  }

  .section-upgrade {
    padding-bottom: 90px;
  }

  .right-almas {
    top: 5%;
  }

  .right-liner {
    top: 11%;
  }

  .right-mosalas {
    top: 15%;
  }

  .dayere-left {
    top: 5%;
  }

  .mosalas-left {
    left: 7%;
  }

  .almas-left {
    top: 14%;
  }

  .section---roadmap, .section---video {
    padding-bottom: 90px;
  }

  .div-video-player, .div-video {
    height: auto;
  }

  .video_thm {
    width: auto;
    height: auto;
  }

  .golden-cup {
    width: 150px;
    left: -10%;
  }

  .faq---section {
    padding-bottom: 90px;
  }

  .faq_box {
    padding: 24px;
  }

  .section---sound {
    padding-bottom: 90px;
  }

  .sound_text_box {
    justify-content: center;
    align-items: center;
  }

  .sound_text_sub, .sound_middle_text {
    text-align: center;
  }

  .cta-section {
    padding: 1px;
  }

  .end_cta_content {
    padding-left: 20px;
    padding-right: 20px;
  }

  .end_cta_title {
    font-size: 28px;
  }

  .end_cta_subtext {
    width: 100%;
  }

  .footer {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
    flex-flow: column;
    height: 100%;
  }

  .social-area {
    order: 1;
    justify-content: center;
    align-items: center;
  }

  .socials {
    justify-content: center;
    align-items: center;
  }

  .sgb-logo, .sgb-logo_end {
    order: -1;
  }

  .div-tb-content {
    height: auto;
  }

  .what-question {
    line-height: 150%;
  }

  .prop_slider {
    direction: ltr;
    display: block;
  }

  .mask {
    direction: rtl;
    width: auto;
  }

  .play-button-wrapper.is-mobile {
    font-size: 2.2vw;
  }

  .video-play-pause-toggle {
    top: 1em;
    right: 1em;
  }

  .video-play-pause-wrapper {
    font-size: .8em;
  }

  .video-unmute-wrapper {
    font-size: .9em;
  }

  .insert-your-video-embed-here {
    border-radius: 6px;
  }

  .slide-nav {
    direction: rtl;
    position: static;
  }

  .left-arrow {
    direction: rtl;
  }

  .right_text_div {
    text-align: center;
    width: 100%;
  }

  .sgb-character {
    width: 90%;
  }

  .hero_text-outside {
    grid-row-gap: 32px;
    height: auto;
    margin-top: 25px;
  }

  .top-perpple-shadow {
    width: 80%;
  }

  .hero-title-text {
    opacity: 1;
    max-width: none;
    padding-bottom: 16px;
    font-size: 32px;
    font-weight: 700;
  }

  .hero-title-sub {
    opacity: 1;
    font-size: 16px;
  }

  .hero-cta {
    opacity: 1;
  }

  .hero-right_text_div {
    text-align: center;
    width: 100%;
  }

  .hero-left_text_div {
    padding-left: 24px;
    padding-right: 24px;
  }

  .features {
    grid-row-gap: 8px;
  }

  .feature-row-2 {
    grid-row-gap: 8px;
    flex-flow: column;
    height: auto;
  }

  .sgb-feature-box {
    grid-column-gap: 24px;
    flex-flow: row;
    order: -1;
    justify-content: space-between;
    align-self: center;
    align-items: center;
    max-width: 100%;
    height: auto;
    padding: 24px;
  }

  .chart {
    order: 1;
  }

  .sgb-feature-title {
    order: 2;
  }

  .div-block-5 {
    padding-bottom: 90px;
  }

  .div-block-6 {
    grid-column-gap: 24px;
    grid-row-gap: 24px;
    flex-flow: column;
    justify-content: center;
    align-items: center;
    display: flex;
  }

  .prop_p_sub4 {
    max-width: 100%;
  }

  .slide {
    direction: rtl;
    width: 40%;
    padding-left: 1%;
    padding-right: 1%;
  }

  .slide-2 {
    direction: rtl;
    padding-left: 1%;
    padding-right: 1%;
  }

  .slide-3 {
    direction: rtl;
    padding-left: 2%;
    padding-right: 1%;
  }

  .sgb-record-sub-title {
    font-size: 18px;
    line-height: 150%;
  }

  .key-metrics-numbers {
    height: 42px;
  }

  .candle-stick-model-middle {
    width: 200px;
    top: -5%;
    left: -20%;
  }

  .sgb-record-text {
    justify-content: center;
    align-items: center;
  }

  .group {
    max-width: 250px;
    height: auto;
  }

  .sgb-records {
    grid-row-gap: 24px;
    flex-flow: column;
    justify-content: center;
    align-items: center;
  }

  .sgb-record-title {
    font-size: 44px;
  }

  .key-metrics-dsc, .key-metrics-counter-number {
    font-size: 44px;
    line-height: 42px;
  }

  .sgb-record-sub-title-copy {
    font-size: 18px;
    line-height: 150%;
  }

  .div-block-7 {
    justify-content: center;
    align-items: center;
  }

  .cta-area {
    flex-flow: column;
    justify-content: center;
    align-items: center;
  }

  .cta-box {
    width: 100%;
  }

  .cta-record {
    opacity: 1;
  }

  .section---ps5 {
    padding-bottom: 90px;
  }

  .ps5-content {
    padding-left: 8px;
    padding-right: 8px;
  }

  .ps5-form-side {
    width: 500px;
  }

  .hero-cta-area {
    flex-flow: column;
  }

  .ps5-cta {
    opacity: 1;
  }

  .right-arrow {
    direction: rtl;
  }
}

@media screen and (max-width: 479px) {
  .hero_section {
    height: 100vh;
    min-height: 600px;
    max-height: 700px;
  }

  .header-text-content {
    grid-row-gap: 24px;
  }

  .logo-bar {
    text-align: center;
  }

  .sgb-logo---mini-2 {
    max-width: 80%;
    height: auto;
  }

  .hero_text {
    grid-row-gap: 24px;
  }

  .hero_text1 {
    opacity: 1;
    padding-bottom: 0;
  }

  .hero_text2 {
    opacity: 1;
    font-size: 14px;
  }

  .cta {
    opacity: 1;
  }

  .header-bottom-vector {
    object-fit: fill;
  }

  .character_div {
    top: 70%;
  }

  .character_image {
    width: 300px;
  }

  .xbox_controller {
    max-width: 45%;
    top: 60%;
    left: -16%;
  }

  .play_station {
    max-width: 50%;
    top: 60%;
    right: -22%;
  }

  .moraba {
    width: 40px;
    top: 72%;
  }

  .dayere {
    width: 40px;
    top: 64%;
  }

  .mosalas {
    width: 40px;
    top: 56%;
    right: 2%;
  }

  .zarbdar {
    width: 40px;
    top: 75%;
    right: 16%;
  }

  .big_peyk {
    width: 50px;
    top: 55%;
  }

  .mini_peyk {
    z-index: 2;
    width: 40px;
    top: 60%;
  }

  .dollar_cash {
    top: 7%;
  }

  .dollar_symbol {
    top: 5%;
    right: 1%;
  }

  .star_symbol {
    width: 70px;
    top: 80%;
  }

  .big_star {
    width: 30px;
    max-width: 50%;
    top: 78%;
    left: 25%;
  }

  .mini_star {
    width: 15px;
    top: 76%;
    left: 30%;
  }

  .dayere_blur {
    top: -3%;
  }

  .mosalas_blur, .moraba_blur {
    top: -4%;
  }

  .zarbdar_blur {
    top: -5%;
  }

  ._3d-logo {
    width: 70px;
    top: 80%;
    left: auto;
    right: 5%;
  }

  .what-prop-section {
    margin-top: 50px;
    margin-bottom: 60px;
    padding-top: 50px;
  }

  .prop_top_text, .prop_bottom_text {
    font-size: 24px;
    line-height: 150%;
  }

  .prop_p_sub3, .prop_p_text_bottom {
    font-size: 14px;
  }

  .prop_table_area {
    display: none;
  }

  .div-tb-title {
    direction: rtl;
  }

  .div-tb-enter {
    direction: ltr;
    width: 100%;
    max-width: none;
  }

  .div-tb-title---enter {
    direction: ltr;
    width: 100%;
  }

  .tetris-1 {
    width: 40px;
    top: -2%;
    right: auto;
  }

  .crown {
    top: -7%;
    left: 2%;
    right: auto;
  }

  .electric {
    top: -7%;
    left: auto;
    right: 2%;
  }

  .tetris-2 {
    width: 40px;
    top: 105%;
    left: 5%;
    right: auto;
  }

  .assault_rifle {
    width: 150px;
    top: -5%;
  }

  .ak-47 {
    width: 150px;
    top: -7%;
  }

  .sectinon-feature {
    grid-row-gap: 60px;
    padding-bottom: 60px;
  }

  .feature-title {
    order: 1;
    padding-left: 16px;
    padding-right: 16px;
  }

  .feature-top-text {
    text-align: center;
    line-height: 150%;
  }

  .feature_sub_text {
    text-align: center;
    font-size: 14px;
  }

  .feature-title-with-span {
    flex-flow: row;
    justify-content: center;
    align-items: center;
    width: 100%;
  }

  .feature-box-title {
    width: auto;
  }

  .tetris-4 {
    width: 40px;
    top: 22%;
  }

  .tetris-3 {
    width: 40px;
    right: 15%;
  }

  .feature-title-span {
    width: auto;
    font-size: 16px;
  }

  .section-upgrade {
    grid-row-gap: 44px;
    padding-bottom: 60px;
  }

  .right-almas {
    width: 35px;
    top: 5%;
  }

  .right-liner {
    width: 40px;
    top: 9%;
  }

  .right-dayere {
    width: 40px;
    top: 9%;
    right: 15%;
  }

  .right-mosalas {
    width: 60px;
    top: 12%;
  }

  .dayere-left {
    width: 35px;
    top: 5%;
  }

  .mosalas-left {
    width: 50px;
    top: 9%;
    left: 9%;
  }

  .almas-left {
    width: 35px;
    top: 13%;
  }

  .upgrade-title-text {
    font-size: 24px;
    line-height: 150%;
  }

  .upgrade-all-content {
    grid-row-gap: 24px;
    flex-flow: column;
    order: 0;
    align-self: center;
  }

  .upgrade-box-2 {
    grid-row-gap: 24px;
    order: 1;
  }

  .upgrade-info {
    grid-row-gap: 24px;
  }

  .upgrade-logo-ellipse {
    display: none;
  }

  .section---roadmap {
    padding-bottom: 40px;
  }

  .roadmap-div {
    grid-row-gap: 24px;
    padding-left: 12px;
    padding-right: 12px;
  }

  .road_box {
    grid-column-gap: 16px;
  }

  .road_text_title {
    direction: rtl;
    font-size: 17px;
  }

  .road_text_content {
    font-size: 14px;
  }

  .number_dot {
    width: 32px;
    height: 32px;
  }

  .road_number {
    font-size: 16px;
  }

  .road_pic_title, .road_pic_subtitle {
    font-size: 24px;
    line-height: 150%;
  }

  .section---video {
    padding-bottom: 60px;
  }

  .video-div {
    grid-row-gap: 40px;
    padding-left: 12px;
    padding-right: 12px;
  }

  .video_title {
    padding-left: 0;
    padding-right: 0;
  }

  .video-title {
    font-size: 24px;
    line-height: 150%;
  }

  .video_sub_text {
    font-size: 14px;
  }

  .golden-cup {
    width: 120px;
    top: 30%;
    left: -20%;
  }

  .faq---section {
    padding-bottom: 60px;
    padding-left: 12px;
    padding-right: 12px;
  }

  .faq-area {
    grid-row-gap: 44px;
  }

  .faq_title {
    font-size: 24px;
    line-height: 150%;
  }

  .faq_box {
    padding: 10px;
  }

  .section---sound {
    padding-bottom: 60px;
  }

  .sound-area {
    grid-row-gap: 44px;
    justify-content: center;
    width: 100%;
    padding-left: 12px;
    padding-right: 12px;
  }

  .sound_title {
    font-size: 24px;
    line-height: 150%;
  }

  .sound-guide {
    justify-content: center;
    align-items: center;
  }

  .sound_left {
    justify-content: center;
    align-items: center;
    max-width: 500px;
  }

  .sound_text_box {
    justify-content: center;
    align-items: center;
  }

  .sound_text_sub, .sound_middle_text {
    text-align: center;
    font-size: 14px;
  }

  .player {
    grid-column-gap: 24px;
    justify-content: space-between;
    align-items: center;
    max-width: 100%;
  }

  .sound-wave {
    width: 50%;
    max-width: 100%;
    height: auto;
  }

  .sound_right {
    justify-content: center;
    align-items: center;
    max-width: 100%;
  }

  .microphone {
    max-width: 50%;
    height: auto;
  }

  .canvas {
    max-width: 50%;
    height: auto;
    top: 40%;
  }

  .section---end-cta {
    padding-bottom: 60px;
    padding-left: 12px;
    padding-right: 12px;
  }

  .cta-section {
    padding-top: 1px;
    padding-bottom: 1px;
  }

  .mask-group {
    max-width: 100%;
    overflow: visible;
  }

  .end_cta_title {
    font-size: 24px;
    line-height: 150%;
  }

  .end_cta_subtext, .text-33 {
    font-size: 14px;
  }

  .footer_text {
    text-align: center;
    line-height: 150%;
  }

  .sgb-logo_end {
    height: auto;
  }

  .div-tb-content {
    direction: rtl;
    direction: rtl;
  }

  .upgrade-column-line, .upgrade-left-underline, .upgrade-right-underline {
    display: none;
  }

  .feature-box-bg-light {
    width: 350px;
    height: 350px;
  }

  .sound_text_title {
    font-size: 18px;
  }

  .video_play {
    width: 60px;
    min-width: auto;
    max-width: 100%;
    height: 60px;
    min-height: 100%;
  }

  .body-large {
    font-size: 16px;
  }

  .body-large.text-color-light {
    font-size: 14px;
  }

  .what-question {
    font-size: 16px;
  }

  .prop_slider {
    background-color: #fff0;
    width: 100%;
    display: block;
    left: auto;
    right: auto;
  }

  .mask {
    direction: ltr;
  }

  .insert-your-video-embed-here {
    border-radius: 6px;
  }

  .icon-right {
    opacity: .5;
    justify-content: center;
    align-items: center;
    width: auto;
    height: auto;
    display: flex;
  }

  .slide-nav {
    direction: rtl;
    position: static;
    inset: auto 0% -2%;
  }

  .icon-left {
    opacity: .5;
    object-fit: fill;
    justify-content: center;
    align-items: center;
    width: auto;
    height: auto;
    display: flex;
  }

  .left-arrow {
    justify-content: center;
    align-items: center;
    display: flex;
  }

  .upgrade-box-1 {
    grid-row-gap: 24px;
    order: -1;
  }

  .all_section {
    flex-flow: column;
    justify-content: flex-start;
    align-items: center;
    display: flex;
  }

  .char_div_int {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
  }

  .right_text_div, .left_text_div {
    padding-left: 16px;
    padding-right: 16px;
  }

  .sgb_character_div {
    justify-content: center;
    align-self: center;
    align-items: center;
    display: flex;
    left: auto;
    right: auto;
  }

  .sgb-character {
    width: 70%;
  }

  .sgb-char {
    left: auto;
  }

  .div-block-3 {
    flex-flow: column;
  }

  .hero-bottom {
    inset: auto 0% 0%;
    overflow: visible;
  }

  .hero_text-outside {
    grid-row-gap: 24px;
    margin-top: 0;
  }

  .top-perpple-shadow {
    top: -50%;
  }

  .hero-title-text {
    opacity: 1;
    padding-bottom: 0;
  }

  .hero-title-sub {
    opacity: 1;
    font-size: 14px;
  }

  .hero-cta {
    grid-column-gap: 8px;
    opacity: 1;
    width: 100%;
    padding-left: 16px;
    padding-right: 16px;
  }

  .hero-right_text_div, .hero-left_text_div {
    padding-left: 16px;
    padding-right: 16px;
  }

  .sgb-feature-box {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
    padding-left: 16px;
    padding-right: 16px;
  }

  .div-block-5 {
    grid-column-gap: 44px;
    grid-row-gap: 44px;
    padding-bottom: 60px;
  }

  .prop_p_sub4 {
    font-size: 14px;
  }

  .slide {
    direction: rtl;
    width: 100%;
  }

  .slide-2 {
    width: 100%;
    padding-right: 2%;
  }

  .slide-3 {
    width: 100%;
    padding-left: 2%;
    padding-right: 2%;
  }

  .key-metrics-all-number._01 {
    font-size: 12px;
  }

  .dsc-sub-text-3, .sgb-record-sub-title {
    font-size: 14px;
  }

  .sgb-records-info {
    padding-left: 8px;
    padding-right: 8px;
  }

  .sgb-dsc-sub-text {
    font-size: 14px;
  }

  .sgb-dsc-box.count3, .sgb-dsc-box.count2, .sgb-dsc-box.count1 {
    width: 100%;
  }

  .sgb-record-sub-title-2 {
    font-size: 14px;
  }

  .sgb-dsc-text {
    font-size: 16px;
    line-height: 150%;
  }

  .candle-stick-model-middle {
    width: 100px;
    top: 0%;
    left: -5%;
  }

  .sgb-record-text {
    justify-content: center;
    align-items: center;
  }

  .number-and-count-section {
    grid-column-gap: 12px;
    grid-row-gap: 12px;
    max-width: 1600px;
  }

  .group {
    width: 50%;
  }

  .sgb-records {
    grid-column-gap: 8px;
    grid-row-gap: 24px;
  }

  .sgb-record-title {
    font-size: 24px;
    line-height: 150%;
  }

  .key-metrics-dsc {
    font-size: 16px;
    font-weight: 600;
    line-height: 40px;
  }

  .sgb-gold-logo {
    width: 150px;
  }

  .key-metrics-counter-number {
    font-size: 32px;
    font-weight: 600;
    line-height: 40px;
  }

  .sgb-record-sub-title-copy {
    font-size: 14px;
  }

  .sgb-records-title {
    font-size: 24px;
    line-height: 150%;
  }

  .cta-record {
    opacity: 1;
    padding-left: 18px;
    padding-right: 18px;
  }

  .section---ps5 {
    padding-bottom: 60px;
  }

  .ps5-area {
    grid-row-gap: 44px;
    justify-content: center;
    width: 100%;
    padding-left: 12px;
    padding-right: 12px;
  }

  .ps5-title {
    font-size: 24px;
    line-height: 150%;
  }

  .ps5-content {
    padding-left: 0;
    padding-right: 0;
  }

  .ps5-form-side {
    width: 100%;
    padding: 16px 8px 16px 12px;
  }

  .form_input {
    min-height: 28px;
  }

  .form-cols {
    grid-template-rows: auto;
    grid-template-columns: minmax(0, 1fr);
  }

  .order_form {
    width: 100%;
  }

  .order_form-block {
    max-width: none;
  }

  .ps5-sub-title {
    line-height: 150%;
  }

  .hero-cta-area {
    padding-left: 8px;
    padding-right: 8px;
  }

  .ps5-cta {
    grid-column-gap: 8px;
    opacity: 1;
    width: 100%;
    padding-left: 16px;
    padding-right: 16px;
  }
}

#w-node-cc949aba-2ecb-4c79-3df1-e695a473da8f-e15f4aed, #w-node-cc949aba-2ecb-4c79-3df1-e695a473da93-e15f4aed {
  grid-area: span 1 / span 3 / span 1 / span 3;
}

#w-node-cc949aba-2ecb-4c79-3df1-e695a473da99-e15f4aed {
  grid-area: span 1 / span 6 / span 1 / span 6;
}


@font-face {
  font-family: 'Yekanbakhfanum';
  src: url('../fonts/YekanBakhFaNum-Regular.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: auto;
}
@font-face {
  font-family: 'Yekanbakhfanum';
  src: url('../fonts/YekanBakhFaNum-Bold.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: auto;
}