.header-tabs {
  display: flex;
  background: var(--e-global-color-de55bc1);
  border-radius: 0 0 4px 4px;
}

.header-tabs__titles {
  display: flex;
  flex-direction: column;
  gap: 8px;
  width: 216px;
  padding: 8px;
  border-right: 1px solid var(--e-global-color-9af3f2d);
}

.header-tabs__contents {
  width: calc(100% - 216px);
}

.header-tabs__content:not(.active),
.mobile-menu__tabs:not(.active),
.mobile-menu__menu:not(.active) {
  display: none;
}

.header-tabs__title,
.header-tabs__content {
  --color-menu-100: var(--e-global-color-a8b9448);
  --color-menu-400: var(--e-global-color-d059794);
  --color-menu-700: var(--e-global-color-8534a03);
  --color-menu-800: var(--e-global-color-f8fa748);
  --color-menu-900: var(--e-global-color-f20a691);
}

.header-tabs__title.yellow,
.header-tabs__content.yellow {
  --color-menu-100: var(--e-global-color-1ed9ad6);
  --color-menu-400: var(--e-global-color-12660b2);
  --color-menu-700: var(--e-global-color-810e9b4);
  --color-menu-800: var(--e-global-color-eed9670);
  --color-menu-900: var(--e-global-color-2aec408);
}

.header-tabs__title.pink,
.header-tabs__content.pink {
  --color-menu-100: var(--e-global-color-0873894);
  --color-menu-400: var(--e-global-color-83b5ae8);
  --color-menu-700: var(--e-global-color-f5efc6f);
  --color-menu-800: var(--e-global-color-ded7340);
  --color-menu-900: var(--e-global-color-09a808a);
}

.header-tabs__title {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 16px 40px 16px 16px;
  border-radius: 4px;
  font-family: var(--e-global-typography-b5434da-font-family), sans-serif;
  font-size: var(--e-global-typography-b5434da-font-size);
  font-weight: var(--e-global-typography-b5434da-font-weight);
  line-height: var(--e-global-typography-b5434da-line-height);
  cursor: pointer;
}

.header-tabs__title:hover {
  background: var(--color-menu-100) !important;
}

.header-tabs__title.active {
  background: var(--color-menu-400) !important;
}

.header-tabs__title::before {
  content: "";
  position: absolute;
  top: calc((100% - 21px) / 2);
  right: 16px;
  width: 8px;
  height: 21px;
  background: url("data:image/svg+xml,%3Csvg width='8' height='21' viewBox='0 0 8 21' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 14.9478L2.05222 16L6.56631 11.4859C7.38662 10.6656 7.38662 9.33441 6.56631 8.51409L2.05222 4L1 5.05221L5.5141 9.5663C5.75328 9.80549 5.75328 10.1945 5.5141 10.4337L1 14.9478Z' fill='%23696969'/%3E%3C/svg%3E") center / contain no-repeat;
}

.header-tabs__title.active::before {
  background-image: url("data:image/svg+xml,%3Csvg width='8' height='21' viewBox='0 0 8 21' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7.18164 14.9478L6.12942 16L1.61533 11.4859C0.795018 10.6656 0.795018 9.33441 1.61533 8.51409L6.12942 4L7.18164 5.05221L2.66754 9.5663C2.42836 9.80549 2.42836 10.1945 2.66754 10.4337L7.18164 14.9478Z' fill='%230E0E0E'/%3E%3C/svg%3E");
}

.header-tabs__title-link {
  font-family: var(--e-global-typography-31d2326-font-family), sans-serif;
  font-size: var(--e-global-typography-31d2326-font-size);
  font-weight: var(--e-global-typography-31d2326-font-weight);
  line-height: var(--e-global-typography-31d2326-line-height);
  color: inherit !important;
  text-decoration: underline !important;
}

.header-tabs__title:hover .header-tabs__title-link {
  color: var(--color-menu-800) !important;
}

.header-tabs__title.active .header-tabs__title-link {
  color: var(--color-menu-900) !important;
}

.tab-menu__row {
  display: flex;
}

.tab-menu__row-get-started,
.tab-menu__row-support {
  border-top: 1px solid var(--e-global-color-9af3f2d);
}

.tab-menu__title {
  display: flex;
  width: 160px;
  padding: 16px 24px;
  font-family: var(--e-global-typography-5345df7-font-family), sans-serif;
  font-size: var(--e-global-typography-5345df7-font-size);
  font-weight: var(--e-global-typography-5345df7-font-weight);
  line-height: var(--e-global-typography-5345df7-line-height);
  letter-spacing: var(--e-global-typography-5345df7-letter-spacing);
  text-transform: var(--e-global-typography-5345df7-text-transform);
  color: var(--color-menu-700);
}

.tab-menu__row-use-case .tab-menu__title {
  padding: 24px 27.5px;
}

.tab-menu__row-support .tab-menu__title {
  align-items: center;
}

.tab-menu__content {
  width: calc(100% - 160px);
}

.tab-menu__row-use-case .tab-menu__content {
  padding: 8px 8px 8px 0;
}

.tab-menu__list {
  display: flex;
  flex-wrap: wrap;
  padding: 0;
  list-style: none;
}

.tab-menu__row-use-case .tab-menu__list {
  gap: 8px;
}

.tab-menu__row-get-started .tab-menu__list,
.tab-menu__row-support .tab-menu__list {
  gap: 16px 0;
  padding: 16px 0;
}

.tab-menu__row-use-case .tab-menu__item {
  width: calc((100% - 8px) / 2);
  transition: 0.4s;
}

.tab-menu__row-use-case .item__wrap {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 16px;
  border-radius: 4px;
  background: var(--color-menu-100);
  transition: 0.4s;
}

.tab-menu__row-use-case a.item__wrap:hover {
  background: var(--color-menu-400);
}

.tab-menu__row-get-started .tab-menu__item,
.tab-menu__row-support .tab-menu__item {
  display: flex;
  flex-wrap: wrap;
  width: 50%;
  padding: 0 16px;
  cursor: pointer;
}

.tab-menu__row-use-case .item__title {
  font-family: var(--e-global-typography-7eae360-font-family), sans-serif;
  font-size: var(--e-global-typography-7eae360-font-size);
  font-weight: var(--e-global-typography-7eae360-font-weight);
  line-height: var(--e-global-typography-7eae360-line-height);
  color: var(--e-global-color-afa89fe);
}

.tab-menu__row-use-case .item__description {
  font-family: var(--e-global-typography-50d1652-font-family), sans-serif;
  font-size: var(--e-global-typography-50d1652-font-size);
  font-weight: var(--e-global-typography-50d1652-font-weight);
  line-height: var(--e-global-typography-50d1652-line-height);
  color: var(--e-global-color-afa89fe);
}

.tab-menu__row-get-started .item__link,
.tab-menu__row-support .item__link {
  font-family: var(--e-global-typography-b5434da-font-family), sans-serif;
  font-size: var(--e-global-typography-b5434da-font-size);
  font-weight: var(--e-global-typography-b5434da-font-weight);
  line-height: var(--e-global-typography-b5434da-line-height);
  color: #767676;
  transition: 0.4s;
}

.tab-menu__row-get-started .item__link:hover,
.tab-menu__row-support .item__link:hover {
  color: var(--color-menu-700);
}

.dropdown-menu {
  font-family: var(--e-global-typography-b5434da-font-family), sans-serif;
  font-size: var(--e-global-typography-b5434da-font-size);
  font-weight: var(--e-global-typography-b5434da-font-weight);
  line-height: var(--e-global-typography-b5434da-line-height);
}

.dropdown-menu__list {
  padding: 0;
  list-style: none;
}

.dropdown-menu__item {
  padding: 8px;
  border-bottom: 1px solid var(--e-global-color-500f07c);
}

.dropdown-menu .item__link {
  display: flex;
  width: 100%;
  padding: 4px;
  border-radius: 4px;
  color: var(--e-global-color-f9ca464) !important;
  cursor: pointer;
}

.dropdown-menu .item__link:hover,
.dropdown-menu .item__link:focus {
  background: var(--e-global-color-a8b9448);
  color: var(--e-global-color-afa89fe) !important;
}

.dropdown-menu .item__link.current-page {
  background: var(--e-global-color-fcdd009);
  color: var(--e-global-color-afa89fe) !important;
}

@media (min-width: 1025px) {
  .tab-menu__back {
    display: none;
  }
}

@media (max-width: 1024px) {
  .header-tabs__titles,
  .tab-menu__row-use-case .tab-menu__title {
    display: none;
  }

  .tab-menu__row {
    flex-wrap: wrap;
  }

  .tab-menu__row-get-started,
  .tab-menu__row-support {
    gap: 24px;
    padding: 24px 0;
  }

  .header-tabs__contents,
  .tab-menu__content {
    width: 100%;
  }

  .tab-menu__row-use-case .tab-menu__content {
    padding: 0 0 24px;
  }

  .tab-menu__row-get-started .tab-menu__title,
  .tab-menu__row-support .tab-menu__title {
    width: 100%;
    padding: 0;
  }

  .tab-menu__back .goback_last {
    color: var(--color-menu-700);
  }

  .tab-menu__row-get-started .tab-menu__list,
  .tab-menu__row-support .tab-menu__list {
    padding: 0;
  }

  .tab-menu__row-use-case .tab-menu__item,
  .tab-menu__row-get-started .tab-menu__item,
  .tab-menu__row-support .tab-menu__item {
    width: 100%;
  }

  .tab-menu__row-get-started .tab-menu__item,
  .tab-menu__row-support .tab-menu__item {
    padding: 0;
  }

  .tab-menu__row-get-started .tab-menu__item:nth-child(even),
  .tab-menu__row-support .tab-menu__item:nth-child(even) {
    order: 1;
  }

  .tab-menu__row .item__link {
    font-family: var(--e-global-typography-7eae360-font-family), sans-serif;
    font-size: var(--e-global-typography-7eae360-font-size);
    font-weight: var(--e-global-typography-7eae360-font-weight);
    line-height: var(--e-global-typography-7eae360-line-height);
  }

  .dropdown-menu__list {
    display: flex;
    flex-direction: column;
    gap: 16px;
  }

  .dropdown-menu__item {
    padding: 0;
    border-bottom: 0;
    font-family: var(--e-global-typography-7eae360-font-family), sans-serif;
    font-size: var(--e-global-typography-7eae360-font-size);
    font-weight: var(--e-global-typography-7eae360-font-weight);
    line-height: var(--e-global-typography-7eae360-line-height);
  }

  .dropdown-menu .item__link {
    padding: 0;
  }

  .dropdown-menu .item__link:hover,
  .dropdown-menu .item__link:focus,
  .dropdown-menu .item__link.current-page {
    background: none !important;
    color: var(--e-global-color-afa89fe) !important;
  }
}