:root {
  --icon-tick: url('data:image/svg+xml,<svg width="24" height="24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M11.3 17.5c-.7.7-1.8.7-2.4 0l-5.4-5.1c-.7-.6-.7-1.6 0-2.2.7-.7 1.7-.7 2.4 0l4.1 3.9 8.1-7.6c.7-.7 1.7-.7 2.4 0 .7.5.7 1.6 0 2.2l-9.2 8.8z" fill="%23000"/></svg>');
  --icon-tick-white: url('data:image/svg+xml,<svg width="24" height="24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M11.3 17.5c-.7.7-1.8.7-2.4 0l-5.4-5.1c-.7-.6-.7-1.6 0-2.2.7-.7 1.7-.7 2.4 0l4.1 3.9 8.1-7.6c.7-.7 1.7-.7 2.4 0 .7.5.7 1.6 0 2.2l-9.2 8.8z" fill="white"/></svg>');
  --icon-tick-primary: url('data:image/svg+xml,<svg width="24" height="24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M11.3 17.5c-.7.7-1.8.7-2.4 0l-5.4-5.1c-.7-.6-.7-1.6 0-2.2.7-.7 1.7-.7 2.4 0l4.1 3.9 8.1-7.6c.7-.7 1.7-.7 2.4 0 .7.5.7 1.6 0 2.2l-9.2 8.8z" fill="%236B57FF"/></svg>');
  --icon-close: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-x" viewBox="0 0 16 16"><path d="M4.646 4.646a.5.5 0 0 1 .708 0L8 7.293l2.646-2.647a.5.5 0 0 1 .708.708L8.707 8l2.647 2.646a.5.5 0 0 1-.708.708L8 8.707l-2.646 2.647a.5.5 0 0 1-.708-.708L7.293 8 4.646 5.354a.5.5 0 0 1 0-.708"/></svg>');
  --icon-close-white: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="white" class="bi bi-x" viewBox="0 0 16 16"><path d="M4.646 4.646a.5.5 0 0 1 .708 0L8 7.293l2.646-2.647a.5.5 0 0 1 .708.708L8.707 8l2.647 2.646a.5.5 0 0 1-.708.708L8 8.707l-2.646 2.647a.5.5 0 0 1-.708-.708L7.293 8 4.646 5.354a.5.5 0 0 1 0-.708"/></svg>');
  --eye: url('data:image/svg+xml,<svg width="22" height="22" viewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M11.0001 16.1429C15.734 16.1429 19.5716 11 19.5716 11C19.5716 11 15.734 5.85718 11.0001 5.85718C6.26627 5.85718 2.42871 11 2.42871 11C2.42871 11 6.26627 16.1429 11.0001 16.1429Z" stroke="%23333333" stroke-width="1.71429" stroke-linejoin="round"/><path d="M11.0003 13.1429C12.1837 13.1429 13.1431 12.1835 13.1431 11C13.1431 9.81658 12.1837 8.85718 11.0003 8.85718C9.81682 8.85718 8.85742 9.81658 8.85742 11C8.85742 12.1835 9.81682 13.1429 11.0003 13.1429Z" stroke="%23333333" stroke-width="1.71429" stroke-linejoin="round"/></svg>');
  --info: url('data:image/svg+xml,<svg width="16" height="16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M8 14.67c1.84 0 3.5-.75 4.71-1.96S14.67 9.84 14.67 8c0-1.84-.75-3.5-1.96-4.71S9.84 1.33 8 1.33c-1.84 0-3.5.75-4.71 1.96S1.33 6.16 1.33 8c0 1.84.75 3.5 1.96 4.71S6.16 14.67 8 14.67z" stroke="white" stroke-width="1.333" stroke-linejoin="round"/><path fill-rule="evenodd" clip-rule="evenodd" d="M8 3.67c.46 0 .83.37.83.83 0 .46-.37.83-.83.83-.46 0-.83-.37-.83-.83 0-.46.37-.83.83-.83z" fill="white"/><path d="M8.17 11.33V6.67H7.5M7 11.33h2.33" stroke="white" stroke-width="1.333" stroke-linecap="round" stroke-linejoin="round"/></svg>');
  --icon-play: url('data:image/svg+xml,<svg width="24" height="24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M18.7 9.81c1.73.97 1.73 3.41 0 4.38l-9.79 5.47C7.17 20.63 5 19.41 5 17.47V6.53c0-1.94 2.17-3.16 3.91-2.19l9.79 5.47z" fill="%23fff"/></svg>');
  --icon-stop: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><rect x="8" y="5" width="3" height="14" rx="1.5" fill="white"/><rect x="14" y="5" width="3" height="14" rx="1.5" fill="white"/></svg>');
  --icon-circle-arrow: url('data:image/svg+xml,<svg width="21" height="20" fill="none" xmlns="http://www.w3.org/2000/svg"><rect x=".75" y="-.75" width="18.5" height="18.5" rx="9.25" transform="matrix(1 0 0 -1 .93 18.5)" stroke="%23000" stroke-width="1.5"/><path d="M7.6 11.25l3.33-3.33 3.33 3.33" stroke="%23000" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg>');
  --icon-chevron-right: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m9 5l7 7l-7 7" /></svg>');
  --icon-arrow-left: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><g fill="%23fff" fill-rule="evenodd" clip-rule="evenodd"><path d="M2.461 12a.75.75 0 0 1 .75-.75l17.79.012a.75.75 0 1 1-.002 1.5L3.21 12.75a.75.75 0 0 1-.749-.75"/><path d="M10.517 4.47a.75.75 0 0 1 .001 1.06L4.06 12l6.458 6.47a.75.75 0 0 1-1.061 1.06l-6.988-7a.75.75 0 0 1 0-1.06l6.988-7a.75.75 0 0 1 1.06 0"/></g></svg>');
  --icon-arrow-right: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><path fill="%23fff" fill-rule="evenodd" d="M13.483 4.47a.75.75 0 0 1 1.06 0l6.988 7a.75.75 0 0 1 0 1.06l-6.988 7a.75.75 0 0 1-1.061-1.06l5.709-5.719L3 12.762a.75.75 0 0 1-.002-1.5l16.194-.01l-5.711-5.722a.75.75 0 0 1 0-1.06" clip-rule="evenodd"/></svg>');
  --header-icon-arrow: url('data:image/svg+xml,<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M12.1211 7.06079L8.06042 11.1215L3.99976 7.06079" stroke="%23000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>');
  --header-icon-arrow-white: url('data:image/svg+xml,<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M12.1211 7.06079L8.06042 11.1215L3.99976 7.06079" stroke="%23fff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>');
  --header-icon-arrow-primary: url('data:image/svg+xml,<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M12.1211 7.06079L8.06042 11.1215L3.99976 7.06079" stroke="%23a06dff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>');
  --header-color: #151515;
  --item-padding: 12px;
}
@media screen and (min-width: 1600px) {
  :root {
    --item-padding: 24px;
  }
}

video {
  object-fit: cover;
}

.ul-tick,
.ul-tick-white,
.ul-tick-primary,
.ul-tick-2 {
  list-style: none;
  padding: 0;
  margin: 0;
}
.ul-tick > li,
.ul-tick-white > li,
.ul-tick-primary > li,
.ul-tick-2 > li {
  padding-left: 28px;
  position: relative;
  z-index: 1;
  margin-bottom: 10px;
  --color-svg: #000;
}
.ul-tick > li::before,
.ul-tick-white > li::before,
.ul-tick-primary > li::before,
.ul-tick-2 > li::before {
  content: "";
  display: block;
  position: absolute;
  z-index: 2;
  top: 3px;
  left: 0;
  width: 18px;
  height: 18px;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: var(--icon-tick);
}

.ul-tick-white > li::before {
  background-image: var(--icon-tick-white);
}

.ul-tick-primary > li::before {
  background-image: var(--icon-tick-primary);
}

.ul-dot {
  list-style: none;
  padding: 0;
  margin: 0;
  --dot-color: var(--bs-body-color);
  --dot-top: 50%;
  --dot-size: 4px;
  --dot-img: "";
}
.ul-dot > li {
  padding-left: calc(var(--dot-size) + 16px);
  position: relative;
  z-index: 1;
  margin-bottom: 10px;
}
.ul-dot > li::before {
  content: "";
  display: block;
  position: absolute;
  z-index: 2;
  top: var(--dot-top);
  left: 4px;
  transform: translateY(-50%);
  width: var(--dot-size);
  height: var(--dot-size);
  border-radius: 100%;
  background-color: var(--dot-color);
  background-image: var(--dot-img);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% 100%;
}

.bg-img {
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

@media screen and (min-width: 992px) {
  .bg-mobile {
    background: none !important;
  }
}

.bg-position-top {
  background-position: center top !important;
}

.bg-position-left-top {
  background-position: left top !important;
}

.bg-linear-gradient {
  background: linear-gradient(180deg, #6b57ff 0%, #998bff 100%), #fff;
}

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

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

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

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

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

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

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

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

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

.max-width-50 {
  max-width: 50%;
}

@media screen and (min-width: 992px) {
  .rounded-lg-3 {
    border-radius: 2rem !important;
  }
}
.swal2-container .swal2-popup {
  border-radius: 24px;
  padding: 3em 1.25em;
}
.swal2-container .swal2-styled {
  box-shadow: none !important;
  background-color: var(--bs-primary) !important;
  border-radius: 88px !important;
  border: 2px solid var(--bs-primary) !important;
  padding: 6px 2em;
}
.swal2-container .swal2-styled.swal2-cancel {
  background-color: transparent !important;
  color: var(--bs-primary) !important;
}
.swal2-container .swal2-styled:hover {
  background-color: var(--bs-primary) !important;
  color: #ffffff !important;
}
.swal2-container .swal2-close {
  padding: 10px;
  font-size: 1.875rem;
}
.swal2-container .swal2-close:hover {
  color: var(--bs-primary) !important;
}

.fade-in {
  animation-fill-mode: forwards;
  animation: fadeInUp 1s 0.2s ease both;
}

@keyframes fadeInUp {
  0% {
    opacity: 0;
    transform: translateY(30px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
.cookies-eu-banner {
  position: fixed;
  z-index: 20;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  background-color: #fff;
  box-shadow: 0px -4px 8px 0px rgba(0, 0, 0, 0.1);
}

.link-hover-underline::after {
  border-bottom-color: #a06dff;
}

.header-mobile {
  overflow: hidden;
}

.header {
  position: relative;
  z-index: 20;
  color: var(--bs-dark);
  border-bottom: solid 1px rgba(255, 255, 255, 0);
}
@media screen and (min-width: 1600px) {
  .header .container {
    max-width: 1600px;
  }
}
.header.header-fixed {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
}
.header ul {
  padding: 0;
  margin: 0;
  list-style: none;
}
.header .header-inner {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: space-between;
}
.header .navbar-store svg {
  width: 32px;
  height: 32px;
}
.header .navbar-toggler {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  padding: 0;
  background-color: transparent;
  border: 0;
  border-radius: 0;
}
.header .navbar-toggler:focus {
  outline: none;
  box-shadow: none;
}
.header .navbar-toggler span {
  position: relative;
  z-index: 1;
  display: block;
  width: 100%;
  height: 2.6px;
  background-color: var(--bs-dark);
  border-radius: 3px;
  transition: all 0.3s ease;
}
.header .navbar-toggler span::before, .header .navbar-toggler span::after {
  position: absolute;
  left: 0;
  display: block;
  width: 100%;
  height: 2.6px;
  content: "";
  background-color: var(--bs-dark);
  border-radius: 3px;
  transition: all 0.3s ease;
}
.header .navbar-toggler span::before {
  top: -7px;
}
.header .navbar-toggler span::after {
  bottom: -7px;
}
.header .navbar-toggler[aria-expanded=true] span {
  background-color: transparent;
}
.header .navbar-toggler[aria-expanded=true] span::before {
  top: 0;
  transform: rotate(45deg);
}
.header .navbar-toggler[aria-expanded=true] span::after {
  bottom: 0;
  transform: rotate(-45deg);
}
.header .navbar-store,
.header .navbar-toggler {
  color: inherit;
}
@media screen and (min-width: 992px) {
  .header .navbar-store,
  .header .navbar-toggler {
    display: none;
  }
}
.header .navbar-brand {
  flex-shrink: 0;
  max-width: 5rem;
  min-height: 4rem;
  padding: 0.625rem 0;
  margin: 0;
  color: inherit;
}
@media screen and (min-width: 992px) {
  .header .navbar-brand {
    max-width: 7.5rem;
    padding-top: 0.375rem;
  }
}
.header .navbar-menu {
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 20;
  flex-shrink: 1;
  width: 100%;
  height: calc(100vh - 64px);
  overflow-y: auto;
  background-color: var(--bs-dark);
}
@media screen and (min-width: 992px) {
  .header .navbar-menu {
    position: initial;
    top: auto;
    left: auto;
    z-index: auto;
    display: block;
    height: auto;
    overflow-y: visible;
    background-color: transparent;
  }
}
.header .navbar-menu-wrapper {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}
@media screen and (min-width: 992px) {
  .header .navbar-menu-wrapper {
    flex-direction: row;
  }
}
.header .navbar-menu-header {
  width: 100%;
  padding: var(--item-padding);
}
@media screen and (min-width: 992px) {
  .header .navbar-menu-header {
    display: flex;
    flex-shrink: 0;
    align-items: center;
    gap: var(--item-padding);
    order: 2;
    width: auto;
    padding: 0;
  }
}
.header .navbar-menu-header li {
  display: none;
  order: 5;
  width: 100%;
}
@media screen and (min-width: 992px) {
  .header .navbar-menu-header li {
    display: block;
  }
}
.header .navbar-menu-header .header-search {
  display: flex;
  flex-shrink: 1;
  width: calc(100% - 70px);
  padding: 10px;
  margin-right: 70px;
  background-color: rgba(179, 138, 255, 0.2);
  border-radius: 8px;
}
@media screen and (min-width: 992px) {
  .header .navbar-menu-header .header-search {
    order: 2;
    width: auto;
    padding: 0;
    margin: 0;
    background-color: transparent;
  }
}
.header .navbar-menu-header .menu-account-wrap {
  display: block;
  flex-shrink: 0;
  width: auto;
  min-width: 32px;
}
@media screen and (min-width: 992px) {
  .header .navbar-menu-header .menu-account-wrap {
    order: 1;
  }
}
.header .header-search form {
  display: flex;
  width: 100%;
}
.header .header-search form::after {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1;
  width: 100%;
  height: 0;
  content: "";
  background-color: var(--bs-dark);
  transition: opacity 0.05s linear 0.1s, height 0.05s linear 0.1s, z-index 0.1s linear 0.1s;
}
@media screen and (min-width: 992px) {
  .header .header-search form::after {
    opacity: 0;
  }
}
.header .header-search button {
  flex-shrink: 0;
  height: auto;
  padding: 0;
  color: inherit;
}
.header .header-search .btn-close {
  display: none;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  padding: 0;
  color: inherit;
  cursor: pointer;
  background: none;
  border: 0;
}
.header .header-search .btn-close::after {
  display: block;
  width: 100%;
  height: 100%;
  content: "";
  background: transparent url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414z'/%3e%3c/svg%3e") center/1em auto no-repeat;
}
.header .header-search [type=search] {
  flex-shrink: 1;
  width: 100%;
  line-height: 1;
  color: var(--bs-white);
  background: none;
  border: 0;
}
@media screen and (min-width: 992px) {
  .header .header-search [type=search] {
    display: none;
    opacity: 0;
    transition: opacity 0.1s linear 0.3s;
  }
}
.header .header-search [type=search]:focus {
  border: 0;
  outline: none;
  box-shadow: none;
}
.header .header-search [type=search]::-webkit-search-cancel-button {
  display: none;
}
@media screen and (min-width: 992px) {
  .header .header-search.active form {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 10;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1.5rem;
    width: 100%;
    height: 100%;
    padding: 0 3%;
    color: var(--bs-white);
  }
}
@media screen and (min-width: 992px) and (min-width: 1400px) {
  .header .header-search.active form {
    padding: 0 calc((100vw - 1300px) / 2);
  }
}
@media screen and (min-width: 992px) {
  .header .header-search.active form::after {
    z-index: -1;
    height: 100%;
    background-color: var(--bs-dark);
    opacity: 1;
  }
  .header .header-search.active [type=search] {
    display: block;
    opacity: 0;
  }
  .header .header-search.active .btn-search {
    opacity: 0;
  }
  .header .header-search.active .btn-close {
    display: flex;
    opacity: 0;
  }
  .header .header-search.active-animation form [type=search] {
    opacity: 1;
  }
  .header .header-search.active-animation .btn-search {
    opacity: 1;
  }
  .header .header-search.active-animation .btn-close {
    opacity: 1;
  }
}
.header .menu-account,
.header .menu-store {
  white-space: nowrap;
}
.header .menu-account {
  position: absolute;
  top: 1.125rem;
  right: 0;
  z-index: 2;
  display: inline-block;
  padding: 0.25rem 1rem;
  color: initial;
}
@media screen and (min-width: 992px) {
  .header .menu-account {
    position: initial;
    top: auto;
    right: auto;
    padding: 0.25rem 0;
    color: var(--bs-dark);
  }
}
.header .menu-store {
  display: none;
  height: 44px;
  padding: 0 1.875rem;
  font-size: 14px;
  border-radius: 0.75rem;
}
@media screen and (min-width: 1200px) {
  .header .menu-store {
    display: inline-flex;
  }
}
.header .menu-upgrade {
  display: none;
  height: 40px;
  padding: 0 1.25rem;
  font-size: 14px;
  border-radius: 6.25rem;
}
@media screen and (min-width: 992px) {
  .header .menu-upgrade {
    display: inline-flex;
  }
}
.header .navbar-nav {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  flex-shrink: 1;
  align-items: center;
  width: 100%;
}
@media screen and (min-width: 992px) {
  .header .navbar-nav {
    flex-direction: row;
    order: 1;
    padding: 0 0.5% 0 1%;
  }
}
@media screen and (min-width: 1280px) {
  .header .navbar-nav {
    padding: 0 0.5% 0 1.5%;
  }
}
@media screen and (min-width: 1600px) {
  .header .navbar-nav {
    padding: 0 0.5% 0 2%;
  }
}
@media screen and (min-width: 1960px) {
  .header .navbar-nav {
    padding: 0 0.5% 0 3.5%;
  }
}
.header .navbar-nav a:not(.btn) {
  color: var(--bs-dark);
}
.header .navbar-nav .nav-link {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: start;
  height: auto;
  padding: calc(var(--item-padding) * 2);
  font-weight: 600;
  color: var(--bs-white);
  white-space: nowrap;
}
@media screen and (min-width: 992px) {
  .header .navbar-nav .nav-link {
    justify-content: center;
    height: 5rem;
    padding: 0 var(--item-padding);
    color: var(--bs-dark);
  }
  .header .navbar-nav .nav-link::before {
    position: absolute;
    bottom: 20%;
    left: 50%;
    display: block;
    width: 0;
    height: 2px;
    font-size: 0.875rem;
    content: "";
    background-color: #a06dff;
    opacity: 0;
    transition: all 0.3s ease-in-out;
    transform: translateX(-50%);
  }
}
@media screen and (min-width: 1400px) {
  .header .navbar-nav .nav-link {
    font-size: 1rem;
  }
}
.header .navbar-nav li {
  width: 100%;
}
@media screen and (min-width: 992px) {
  .header .navbar-nav li {
    width: auto;
  }
  .header .navbar-nav li:hover .nav-link {
    color: #a06dff;
  }
  .header .navbar-nav li:hover .nav-link::after {
    background-image: var(--header-icon-arrow-primary);
  }
  .header .navbar-nav li:hover .nav-link::before {
    width: calc(100% - var(--item-padding) * 2);
    opacity: 1;
  }
}
.header .drop-account {
  padding: 1rem 0;
  font-size: 0.875rem;
}
.header .drop-account .account-header {
  display: none;
  padding: 0 0 1rem 0;
  text-align: center;
}
.header .drop-account .account-header span {
  display: block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.header .drop-account .account-main {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  padding-top: 0;
}
@media screen and (min-width: 992px) {
  .header .drop-account .account-main {
    gap: 0;
    padding-top: 1rem;
  }
}
.header .drop-account .account-main a {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem;
  color: var(--bs-white);
  text-decoration: none;
  border-radius: 0.5rem;
}
@media screen and (min-width: 992px) {
  .header .drop-account .account-main a::after {
    position: absolute;
    top: 50%;
    right: 10px;
    z-index: 2;
    display: inline-block;
    width: 16px;
    height: 16px;
    margin-left: 5px;
    content: "";
    background: var(--header-icon-arrow-white) no-repeat center center;
    opacity: 0.5;
    transform: translateY(-50%) rotate(-90deg);
  }
}
.header .drop-account .account-main a:hover {
  background-color: var(--header-color);
}
.header .account-active {
  width: 100%;
}
@media screen and (min-width: 992px) {
  .header .account-active {
    width: auto;
  }
}
.header .account-active .account-user {
  position: absolute;
  top: 1.125rem;
  right: 1.5rem;
  z-index: 2;
}
.header .account-active .account-user img {
  max-width: 100%;
  width: 38px;
  height: 38px;
  overflow: hidden;
  border-radius: 100%;
}
@media screen and (min-width: 992px) {
  .header .account-active {
    position: relative;
    z-index: 2;
  }
  .header .account-active .account-user {
    position: initial;
    top: auto;
    right: auto;
  }
}
@media screen and (min-width: 992px) {
  .header .account-active.account-vip .account-user {
    position: relative;
  }
}
.header .account-active.account-vip .account-user::after {
  position: absolute;
  z-index: 2;
  right: -3px;
  bottom: -4px;
  content: "";
  display: block;
  width: 18px;
  height: 18px;
  background: url('data:image/svg+xml,<svg width="20" height="20" fill="none" xmlns="http://www.w3.org/2000/svg"><circle cx="10" cy="10" r="9" fill="%23000" stroke="%238473FF" stroke-width="2"/><path d="M15.4 9.4l-1.7-3.2-.1-.2H6.5l-.2.2-1.7 3.2-.1.2.1.3 5.1 5 .1.1h.4l.1-.1 5.1-5 .1-.2-.1-.3zm-2.6.5l-2.5 2.4-.1.1H10h-.2l-.1-.1-2.5-2.4c-.2-.2-.2-.5 0-.6.2-.3.5-.3.7 0l2.1 2 2.1-2c.2-.3.5-.3.7 0 .2.1.2.4 0 .6z" fill="url(%23paint0_linear_14954_27745)"/><defs><linearGradient id="paint0_linear_14954_27745" x1="12.006" y1="6" x2="9.508" y2="15.585" gradientUnits="userSpaceOnUse"><stop stop-color="%23FFD84F"/><stop offset="1" stop-color="%23FFB052"/></linearGradient></defs></svg>') no-repeat center center;
  background-size: cover;
}
.header .account-active .drop-account {
  display: none;
  max-height: 0;
  padding: 1rem var(--item-padding);
  margin-top: var(--item-padding);
  margin-left: calc(var(--item-padding) - var(--item-padding) * 2);
  margin-right: calc(var(--item-padding) - var(--item-padding) * 2);
  color: var(--bs-white);
  transition: all 0.3s ease-in-out;
  background-color: var(--header-color);
}
@media screen and (min-width: 992px) {
  .header .account-active .drop-account {
    position: absolute;
    top: calc(100% + 10px);
    left: 50%;
    width: 300px;
    padding: 1rem;
    background-color: var(--bs-dark);
    border: solid 1px rgba(255, 255, 255, 0.3);
    border-radius: 1rem;
    transform: translateX(-50%);
    margin: 0;
  }
  .header .account-active .drop-account::before {
    position: absolute;
    top: -10px;
    left: 0;
    z-index: 1;
    display: block;
    width: 100%;
    height: 10px;
    content: "";
  }
}
.header .account-active.menu-account-active .account-user {
  position: relative;
  top: auto;
  right: auto;
}
.header .account-active.menu-account-active .drop-account {
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  padding: 1rem;
  background-color: var(--bs-dark);
}
@media screen and (min-width: 992px) {
  .header .account-active.menu-account-active .drop-account {
    top: calc(100% + 5px);
    right: 0;
    left: auto;
    width: 260px;
    transform: translateX(0);
  }
}
@media screen and (min-width: 1600px) {
  .header .account-active.menu-account-active .drop-account {
    right: auto;
    left: 50%;
    transform: translateX(-50%);
  }
}
.header .account-active .account-header {
  display: none;
  border-bottom: solid 1px rgba(255, 255, 255, 0.3);
}
@media screen and (min-width: 992px) {
  .header .account-active .account-header {
    display: block;
  }
}
@media screen and (min-width: 992px) {
  .header .account-active:hover .drop-account {
    display: block;
    max-height: 187.5rem;
  }
}
.header .account-active.active .drop-account {
  display: block;
  max-height: 187.5rem;
}
.header .account-active-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1rem;
}
@media screen and (min-width: 992px) {
  .header .account-active-wrap {
    flex-direction: row;
  }
}
.header .account-active-wrap .account-active {
  order: 2;
}
@media screen and (min-width: 992px) {
  .header .account-active-wrap .account-active {
    order: 1;
  }
}
.header .account-active-wrap .menu-upgrade {
  order: 1;
  width: 100%;
  margin-top: 1.5rem;
}
@media screen and (min-width: 992px) {
  .header .account-active-wrap .menu-upgrade {
    order: 2;
    width: auto;
    margin-top: 0;
  }
}
.header .drop-menu .btn-box .btn {
  width: 100%;
  max-width: 14.375rem;
}
.header .drop-menu .menu {
  display: none;
  width: 100%;
  max-height: 0;
  overflow: hidden;
  color: rgba(255, 255, 255, 0.5);
  background-color: var(--header-color);
  transition: all 0.3s ease-in-out;
  border: 0;
}
@media screen and (min-width: 992px) {
  .header .drop-menu .menu {
    position: absolute;
    top: 100%;
    left: 0;
    border-radius: 0 0 1rem 1rem;
  }
}
.header .drop-menu .menu a:not(.btn) {
  color: var(--bs-white);
}
.header .drop-menu .menu a:not(.btn):hover {
  color: #a06dff;
}
.header .drop-menu a:hover .txt {
  opacity: 1;
}
.header .drop-menu .menu-cont {
  max-width: 1600px;
  padding: var(--item-padding) 0;
  margin: 0 auto;
  font-size: 0.875rem;
}
@media screen and (min-width: 992px) {
  .header .drop-menu .menu-cont {
    padding: 1rem 1.5rem;
  }
}
@media screen and (min-width: 1400px) {
  .header .drop-menu .menu-cont {
    padding: 1rem 2rem;
  }
}
.header .drop-menu .item-list {
  padding: 0.5rem calc(var(--item-padding) * 2);
}
@media screen and (min-width: 992px) {
  .header .drop-menu .item-list {
    padding: 0.5rem 0 0;
  }
}
.header .drop-menu .item-list .icon {
  margin-top: -6px;
  flex-shrink: 0;
}
.header .drop-menu .ul.item-list a {
  position: relative;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0.5rem 1.5rem 0.5rem 0;
  text-decoration: none;
}
.header .drop-menu .ul.item-list a::after {
  position: absolute;
  top: 50%;
  right: 0;
  display: block;
  width: 16px;
  height: 16px;
  content: "";
  background: var(--header-icon-arrow-white) no-repeat center center;
  transition: all 0.3s ease-in-out;
  transform: translateY(-50%) rotate(-90deg);
}
.header .drop-menu .ul.item-list a:hover {
  color: #a06dff;
  text-decoration: underline;
}
.header .drop-menu .ul.item-list a:hover::after {
  background-image: var(--header-icon-arrow-primary);
}
.header .drop-menu .ul-icon.item-list a {
  position: relative;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0.5rem 1.5rem 0.5rem 0;
  text-decoration: none;
}
.header .drop-menu .ul-icon.item-list a::after {
  position: absolute;
  top: 50%;
  right: 0;
  display: block;
  width: 16px;
  height: 16px;
  content: "";
  background: no-repeat center center;
  transition: all 0.3s ease-in-out;
  transform: translateY(-50%) rotate(-90deg);
}
.header .drop-menu .ul-icon.item-list a:hover {
  color: #a06dff;
  text-decoration: underline;
}
.header .drop-menu .ul-icon.item-list a:hover::after {
  background-image: var(--header-icon-arrow-primary);
}
.header .drop-menu .list-disc {
  margin-left: 1rem;
  list-style: disc;
}
.header .drop-menu .list-disc a {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 0;
}
.header .drop-menu .list-disc a:hover {
  text-decoration: none;
}
@media screen and (max-width: 992px) {
  .header .drop-menu .ul-mobile-disc {
    margin-left: 1rem;
    list-style: disc;
  }
}
.header .drop-menu .ul-list-2 {
  display: flex;
  flex-direction: column;
  gap: 8px;
  list-style: disc;
  margin-left: 1rem;
}
@media screen and (min-width: 992px) {
  .header .drop-menu .ul-list-2 {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 16px;
    list-style: none;
    margin-left: 0;
  }
}
@media screen and (min-width: 992px) {
  .header .drop-menu .ul-list-2 li {
    flex: 1 1 calc(50% - 16px);
  }
}
.header .drop-menu .logo-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: start;
  gap: 0.5rem;
}
.header .drop-menu .list {
  display: flex;
  flex-wrap: wrap;
  gap: 0 20px;
}
.header .drop-menu .list a {
  display: flex;
  gap: 0.5rem;
  padding: 0.375rem 0;
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.2;
  text-decoration: none;
}
@media screen and (min-width: 992px) {
  .header .drop-menu .list a {
    font-weight: 600;
  }
}
.header .drop-menu .list .name {
  display: flex;
  align-items: start;
  justify-content: start;
  gap: 0.5rem;
  padding-top: 0.125rem;
}
.header .drop-menu .list .name img {
  margin: 0;
}
.header .drop-menu .list .txt {
  margin: 0.5rem 0;
  font-size: 0.75rem;
  font-weight: 400;
  line-height: 1.2;
  opacity: 0.5;
}
.header .drop-menu .list-cont li {
  width: 100%;
}
@media screen and (min-width: 992px) {
  .header .drop-menu .list-cont li {
    width: calc(50% - 20px);
  }
}
@media screen and (min-width: 1300px) {
  .header .drop-menu .list-cont li {
    width: calc(33.33% - 20px);
  }
}
@media screen and (min-width: 992px) {
  .header .drop-menu .list-cont a {
    padding: 0.75rem 1.25rem;
  }
}
.header .drop-menu .list-cont a:not(.btn):hover {
  color: var(--bs-white);
  background-color: rgba(107, 87, 255, 0.1);
  border-radius: 0.75rem;
}
.header .drop-menu .list-title {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding-bottom: 0.5rem;
  font-size: 1rem;
  color: rgba(255, 255, 255, 0.7);
}
@media screen and (min-width: 992px) {
  .header .drop-menu .menu-list {
    flex-shrink: 1;
    width: 75%;
  }
}
@media screen and (min-width: 992px) {
  .header .drop-menu .menu-main {
    display: flex;
    justify-content: space-between;
    gap: 1.5rem;
  }
}
.header .drop-menu .item-title {
  padding: 0.5rem calc(var(--item-padding) * 2);
  margin-bottom: 0.5rem;
  border-bottom: solid 1px rgba(255, 255, 255, 0.2);
}
@media screen and (min-width: 992px) {
  .header .drop-menu .item-title {
    padding: 0.5rem 0;
    font-size: 1rem;
  }
}
@media screen and (min-width: 992px) {
  .header .drop-menu .menu-more {
    flex-shrink: 0;
    width: 25%;
    max-width: 300px;
  }
}
.header .drop-menu .menu-footer {
  padding: 0.75rem 0;
  color: #a06dff;
  text-align: center;
}
@media screen and (min-width: 992px) {
  .header .drop-menu .menu-footer {
    padding: 1.5rem 0 0.5rem;
  }
}
.header .drop-menu .menu-footer a:not(.btn) {
  color: #a06dff;
}
.header .drop-menu .nav-link::after {
  position: absolute;
  top: 50%;
  right: calc(var(--item-padding) * 2);
  bottom: auto;
  display: inline-block;
  width: 16px;
  height: 16px;
  margin-left: 5px;
  content: "";
  background: var(--header-icon-arrow-white) no-repeat center center;
  transition: all 0.3s ease-in-out;
  transform: translateY(-50%);
}
@media screen and (min-width: 992px) {
  .header .drop-menu .nav-link::after {
    position: initial;
    top: auto;
    right: auto;
    background: var(--header-icon-arrow) no-repeat center center;
    transform: rotate(0);
  }
}
.header .drop-menu:hover .nav-link, .header .drop-menu.active .nav-link {
  color: var(--bs-white);
}
@media screen and (min-width: 992px) {
  .header .drop-menu:hover .nav-link, .header .drop-menu.active .nav-link {
    background-color: var(--header-color);
  }
}
.header .drop-menu:hover .nav-link::after, .header .drop-menu.active .nav-link::after {
  background: var(--header-icon-arrow-white) no-repeat center center;
}
@media screen and (min-width: 992px) {
  .header .drop-menu:hover .nav-link::after {
    transform: rotate(180deg);
  }
  .header .drop-menu:hover .menu {
    display: block;
    max-height: 2000px;
  }
}
.header .drop-menu.active .nav-link::after {
  transform: translateY(-50%) rotate(180deg);
}
.header .drop-menu.active .menu {
  display: block;
  max-height: 2000px;
}
@media screen and (min-width: 992px) {
  .header .drop-menu.active .nav-link::after {
    transform: none;
  }
}
.header .item-2,
.header .item-3 {
  padding: 0;
}
.header .menu-list-row .item-list {
  padding-top: 0;
  padding-bottom: 0;
}
@media screen and (min-width: 992px) {
  .header .menu-list-row {
    display: flex;
    gap: 1.875rem;
  }
  .header .menu-list-row .item-list {
    padding: 0;
  }
  .header .menu-list-row .item-2 {
    width: calc(50% - 15px);
  }
  .header .menu-list-row .item-3 {
    width: calc(33.33% - 20px);
  }
  .header .menu-list-row .list {
    flex-direction: column;
    gap: 8px;
  }
  .header .menu-list-row .list li {
    width: calc(100% - 20px);
  }
  .header .menu-list-row .list-2 {
    display: flex;
  }
  .header .menu-list-row .list-2 a:not(.btn) {
    padding: 0.5rem 0;
  }
  .header .menu-list-row .list-2 a:not(.btn):hover {
    color: #a06dff;
    background-color: inherit;
  }
  .header .drop-menu-max,
  .header .drop-menu-max-lg,
  .header .drop-menu-max-xl,
  .header .drop-menu-max-xxl {
    position: relative;
    z-index: 1;
  }
  .header .drop-menu-max .menu,
  .header .drop-menu-max-lg .menu,
  .header .drop-menu-max-xl .menu,
  .header .drop-menu-max-xxl .menu {
    width: 450%;
  }
  .header .drop-menu-max-lg .menu {
    width: 500%;
  }
  .header .drop-menu-max-xl .menu,
  .header .drop-menu-max-xxl .menu {
    width: 550%;
  }
  .header .menu-list-nowrap {
    flex-wrap: nowrap;
    text-wrap: nowrap;
  }
  .header .menu-list-nowrap .menu-item {
    width: 100%;
  }
}
@media screen and (min-width: 1280px) {
  .header .menu-list-row .list-2 {
    flex-direction: row;
    flex-wrap: wrap;
  }
  .header .menu-list-row .list-2 li {
    width: calc(50% - 16px);
  }
  .header .drop-menu-max .menu {
    width: 400%;
  }
  .header .drop-menu-max-xxl .menu {
    width: 700%;
  }
}
@media (min-width: 1300px) {
  .header .menu-list-row .list li {
    width: calc(100% - 20px);
  }
  .header .menu-list-row .list-2 li {
    width: calc(50% - 16px);
  }
}
@media screen and (min-width: 1400px) {
  .header .drop-menu-max-lg .menu {
    width: 450%;
  }
  .header .drop-menu-max-xl .menu {
    width: 550%;
  }
}
@media screen and (min-width: 1600px) {
  .header .drop-menu-max .menu {
    width: 350%;
  }
}
.header.header-pro {
  color: var(--bs-white);
  background-color: var(--bs-dark);
}
.header.header-pro .nav-all-menu {
  display: none;
}
.header.header-pro .navbar-toggler span {
  background-color: var(--bs-white);
}
.header.header-pro .navbar-toggler span::after, .header.header-pro .navbar-toggler span::before {
  background-color: var(--bs-white);
}
.header.header-pro .navbar-toggler[aria-expanded=true] span {
  background-color: transparent;
}
.header.header-pro .navbar-menu {
  display: block;
  height: auto;
  overflow-y: visible;
}
.header.header-pro .navbar-menu-header {
  display: none;
}
.header.header-pro .navbar-menu-header.show {
  display: block;
}
.header.header-pro .navbar-nav {
  position: relative;
  z-index: 2;
}
.header.header-pro .header-drop-menu {
  display: none;
}
.header.header-pro .header-drop-menu .nav-link {
  display: none;
}
.header.header-pro .header-drop-menu .menu {
  display: block;
  max-height: none;
  padding: 0;
  overflow: visible;
  background-color: var(--bs-dark);
  transition: all 0.3s ease-in-out;
}
.header.header-pro .header-drop-menu.show {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  display: block;
  width: 100%;
  height: calc(100vh - 136px);
  overflow-y: auto;
  background-color: var(--bs-dark);
}
.header.header-pro .nav-all-cont {
  padding: 0;
}
.header.header-pro .nav-all-drop {
  display: none;
  padding-bottom: calc(var(--item-padding) * 3);
  background-color: var(--header-color);
}
.header.header-pro .active .nav-all-drop {
  display: block;
}
.header.header-pro .active .nav-link {
  color: var(--bs-white);
}
.header.header-pro .nav-all-main .nav-link {
  display: block;
  padding: calc(var(--item-padding) * 1.5) calc(var(--item-padding) * 2);
  font-size: 1rem;
}
.header.header-pro .header-proname {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: var(--item-padding) calc(var(--item-padding) * 2);
  font-weight: 600;
  border-top: solid 1px var(--header-color);
  border-bottom: solid 1px var(--header-color);
}
.header.header-pro .header-proname span,
.header.header-pro .header-proname a {
  color: inherit;
  text-decoration: none;
}
.header.header-pro .header-proname::after {
  display: block;
  width: 16px;
  height: 16px;
  content: "";
  background: var(--header-icon-arrow-white) no-repeat center center transparent;
  transition: all 0.3s ease-in-out;
}
.header.header-pro .header-promenu {
  display: none;
}
.header.header-pro .header-promenu .menu-xl {
  max-height: calc(100vh - 180px);
  overflow-y: auto;
}
.header.header-pro .header-pro-nav {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 0;
}
@media screen and (min-width: 992px) {
  .header.header-pro .header-pro-nav .nav-link {
    padding: 0 calc(var(--item-padding) / 1.125);
  }
}
@media screen and (min-width: 1600px) {
  .header.header-pro .header-pro-nav .nav-link {
    padding: 0 calc(var(--item-padding) / 1.5);
  }
}
.header.header-pro .header-pro-nav .nav-link:hover::before {
  width: calc(100% - var(--item-padding) * 1.75);
}
@media screen and (min-width: 1600px) {
  .header.header-pro .header-pro-nav .nav-link:hover::before {
    width: calc(100% - var(--item-padding) * 1.5);
  }
}
@media screen and (min-width: 992px) {
  .header.header-pro .navbar-menu-header {
    display: flex;
  }
  .header.header-pro .navbar-nav {
    position: initial;
    z-index: initial;
  }
  .header.header-pro .header-drop-menu {
    position: initial;
    z-index: initial;
    display: flex;
  }
  .header.header-pro .header-drop-menu .nav-link {
    display: flex;
  }
  .header.header-pro .header-drop-menu .menu {
    display: none;
    background-color: var(--header-color);
  }
  .header.header-pro .header-drop-menu:hover .menu {
    display: block;
  }
  .header.header-pro .nav-all-main {
    display: none;
    flex-shrink: 1;
    width: 100%;
  }
  .header.header-pro .nav-all-main .nav-link {
    display: none;
  }
  .header.header-pro .nav-all-main.active {
    display: block;
  }
  .header.header-pro .nav-all-cont {
    display: flex;
    align-items: start;
    gap: 2rem;
  }
  .header.header-pro .nav-all-drop {
    padding-bottom: 0;
    background-color: inherit;
  }
  .header.header-pro .nav-all-menu {
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
    align-items: start;
    gap: 1rem;
    padding: 1rem 0;
    transition: all 0.3s ease-in-out;
  }
  .header.header-pro .tab-link {
    display: block;
    padding: 0.5rem 1.25rem;
    font-weight: 600;
    border-radius: 0.75rem;
  }
  .header.header-pro .tab-link:hover {
    text-decoration: none;
  }
  .header.header-pro .tab-link.active {
    color: var(--bs-white);
    background-color: rgba(107, 87, 255, 0.3);
  }
  .header.header-pro .header-proname {
    position: relative;
    z-index: 1;
    flex-direction: column;
    flex-shrink: 0;
    justify-content: center;
    width: auto;
    height: 5rem;
    padding: 0 calc(var(--item-padding) * 0.5);
    border: 0;
  }
  .header.header-pro .header-proname span,
  .header.header-pro .header-proname a {
    position: relative;
    z-index: 1;
    display: inline-block;
    padding: 0 calc(var(--item-padding) * 0.5) 0 calc(var(--item-padding) * 1.25);
    line-height: 1.2;
    color: inherit;
    border-left: solid 1px rgba(0, 0, 0, 0.6);
  }
  .header.header-pro .header-proname span::after,
  .header.header-pro .header-proname a::after {
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    display: block;
    width: 1px;
    height: 100%;
    content: "";
    background-color: rgba(255, 255, 255, 0.6);
  }
  .header.header-pro .header-proname::after {
    position: absolute;
    bottom: 25%;
    left: calc(var(--item-padding) * 1.75);
    width: calc(100% - var(--item-padding) * 2.75);
    height: 2px;
    background: var(--bs-dark);
    transition: all 0.3s ease-in-out;
  }
  .header.header-pro.text-white .header-proname span,
  .header.header-pro.text-white .header-proname a {
    border-left: 0;
  }
  .header.header-pro .header-pro-nav {
    flex-direction: row;
  }
  .header.header-pro .header-promenu {
    display: flex;
    align-items: center;
    justify-content: start;
    width: 100%;
  }
  .header.header-pro .header-promenu .menu {
    width: 300%;
  }
  .header.header-pro .header-promenu .menu-lg {
    width: 500%;
  }
  .header.header-pro .header-promenu .menu-xl {
    width: 650%;
    transform: translateX(-40%);
  }
  .header.header-pro .header-promenu .drop-menu {
    position: relative;
    z-index: 1;
  }
  .header.header-pro:not(.header-fixeding) {
    color: var(--bs-dark);
    background-color: transparent;
  }
}
@media screen and (min-width: 1280px) {
  .header.header-pro .header-promenu .menu-xl {
    width: 650%;
    transform: translateX(0);
  }
}
@media screen and (min-width: 1400px) {
  .header.header-pro .header-promenu .menu {
    width: 250%;
  }
  .header.header-pro .header-promenu .menu-lg {
    width: 500%;
  }
  .header.header-pro .header-promenu .menu-xl {
    width: 700%;
  }
}
.header .header-pro-nav.active .header-proname::after {
  transform: rotate(180deg);
}
.header .header-pro-nav.active .header-promenu {
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 2;
  display: block;
  width: 100%;
  background-color: var(--header-color);
}
.header .header-pro-nav.active .nav-link {
  padding: var(--item-padding) calc(var(--item-padding) * 2);
  font-size: 0.875rem;
  color: var(--bs-white);
}
.header.bg-dark .navbar-brand,
.header.bg-dark .menu-account,
.header.bg-dark .navbar-nav .nav-link,
.header.bg-dark .header-search button, .header.header-fixeding .navbar-brand,
.header.header-fixeding .menu-account,
.header.header-fixeding .navbar-nav .nav-link,
.header.header-fixeding .header-search button, .header.text-white .navbar-brand,
.header.text-white .menu-account,
.header.text-white .navbar-nav .nav-link,
.header.text-white .header-search button {
  color: var(--bs-white);
}
.header.bg-dark .navbar-toggler span, .header.header-fixeding .navbar-toggler span, .header.text-white .navbar-toggler span {
  background-color: var(--bs-white);
}
.header.bg-dark .navbar-toggler span::after, .header.bg-dark .navbar-toggler span::before, .header.header-fixeding .navbar-toggler span::after, .header.header-fixeding .navbar-toggler span::before, .header.text-white .navbar-toggler span::after, .header.text-white .navbar-toggler span::before {
  background-color: var(--bs-white);
}
.header.bg-dark .navbar-toggler[aria-expanded=true] span, .header.header-fixeding .navbar-toggler[aria-expanded=true] span, .header.text-white .navbar-toggler[aria-expanded=true] span {
  background-color: transparent;
}
.header.bg-dark .drop-menu .nav-link::after, .header.header-fixeding .drop-menu .nav-link::after, .header.text-white .drop-menu .nav-link::after {
  background: var(--header-icon-arrow-white) no-repeat center center;
}
.header.bg-dark .drop-menu.active .nav-link, .header.header-fixeding .drop-menu.active .nav-link, .header.text-white .drop-menu.active .nav-link {
  color: #a06dff;
}
.header.bg-dark .drop-menu.active .nav-link::after, .header.header-fixeding .drop-menu.active .nav-link::after, .header.text-white .drop-menu.active .nav-link::after {
  background: var(--header-icon-arrow-primary) no-repeat center center;
}
.header.bg-dark.header-pro .nav-link, .header.header-fixeding.header-pro .nav-link, .header.text-white.header-pro .nav-link {
  color: var(--bs-white);
}
.header.bg-dark.header-pro .header-proname, .header.header-fixeding.header-pro .header-proname, .header.text-white.header-pro .header-proname {
  color: var(--bs-white);
}
@media screen and (min-width: 992px) {
  .header.bg-dark.header-pro .header-proname::after, .header.header-fixeding.header-pro .header-proname::after, .header.text-white.header-pro .header-proname::after {
    background-color: var(--bs-white);
  }
}
.header.bg-dark, .header.header-fixeding {
  color: var(--bs-white);
  background-color: var(--bs-dark);
}
.header.header-fixeding {
  border-bottom: solid 1px rgba(255, 255, 255, 0.2);
}
.header.header-fixeding.header-pro {
  transform: translateY(-64px);
}
@media screen and (min-width: 992px) {
  .header.header-fixeding.header-pro {
    transform: translateY(0);
  }
}

.fix-nav {
  position: fixed;
  top: -1px;
  background: rgba(0, 0, 0, 0.7);
  border-bottom: solid 1px #3f3f3f;
  width: 100%;
  z-index: 1000;
  color: #fff;
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  max-height: 0;
  transition: all 0.4s;
  overflow: hidden;
}
.fix-nav.active {
  max-height: 580px;
  overflow: unset;
}
.fix-nav .btn {
  height: 32px;
  line-height: 32px;
  padding: 0 16px;
}

.fiex-nav-content .item {
  height: 80px;
  line-height: 18px;
  padding: 0 16px;
  font-size: 13px;
  font-weight: 500;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0.7;
  position: relative;
  color: #fff;
}
.fiex-nav-content .item.opacity-1 {
  opacity: 1;
}
.fiex-nav-content .item .btn {
  font-size: 13px;
  font-weight: 600;
}
.fiex-nav-content .item .btn:hover {
  transform: none;
}
.fiex-nav-content .item .item-list {
  list-style: none;
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  width: max-content;
  background: rgba(0, 0, 0, 0.8);
  border: 1px solid rgba(255, 255, 255, 0.3);
  border-top: 1px solid rgba(255, 255, 255, 0.5);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  border-radius: 16px;
  padding: 0 8px;
  max-height: 0;
  opacity: 0;
  overflow: hidden;
  transition: all 0.2s;
}
.fiex-nav-content .item .item-list li a {
  color: #fff;
  text-decoration: none;
  font-size: 14px;
  font-weight: 500;
  line-height: 36px;
  height: 36;
  display: inline-block;
  width: 100%;
  border-radius: 6px;
  padding: 0 8px;
}
.fiex-nav-content .item .item-list li a:hover {
  background: rgba(255, 255, 255, 0.1490196078);
}
.fiex-nav-content .item .item-list li:not(:first-child) {
  margin-top: 4px;
}
.fiex-nav-content .item:hover {
  opacity: 1;
  cursor: pointer;
}
.fiex-nav-content .item:hover .item-list {
  opacity: 1;
  max-height: 500px;
  padding: 16px 8px;
}

.column-wrap {
  font-size: 16px;
}
@media screen and (min-width: 992px) {
  .column-wrap {
    font-size: 18px;
  }
}
@media screen and (min-width: 1400px) {
  .column-wrap {
    font-size: 20px;
  }
}

.column-h1 {
  font-size: 32px;
  font-weight: 600;
  line-height: 1.4;
}
@media screen and (min-width: 992px) {
  .column-h1 {
    font-size: 40px;
  }
}
@media screen and (min-width: 1280px) {
  .column-h1 {
    font-size: 48px;
  }
}
@media screen and (min-width: 1600px) {
  .column-h1 {
    font-size: 56px;
  }
}

.column-h2 {
  font-size: 24px;
  font-weight: 600;
  line-height: 1.4;
}
@media screen and (min-width: 992px) {
  .column-h2 {
    font-size: 30px;
  }
}
@media screen and (min-width: 1280px) {
  .column-h2 {
    font-size: 32px;
  }
}
@media screen and (min-width: 1600px) {
  .column-h2 {
    font-size: 40px;
  }
}

.column-h3 {
  font-size: 18px;
  font-weight: 500;
  line-height: 1.4;
}
@media screen and (min-width: 992px) {
  .column-h3 {
    font-size: 24px;
  }
}
@media screen and (min-width: 1600px) {
  .column-h3 {
    font-size: 32px;
  }
}

.swiper-pagination .swiper-pagination-bullet {
  background-color: rgb(183, 173, 255);
  margin: 0 4px;
}
.swiper-pagination .swiper-pagination-bullet-active {
  width: 22px;
  border-radius: 100px;
  background-color: rgb(107, 87, 255);
  transition: all 0.3s linear;
}

.btn-radial-linear-gradient {
  position: relative;
  overflow: hidden;
  border: none;
  color: #fff;
  background: radial-gradient(114.29% 114.29% at 50% 100%, rgba(255, 255, 255, 0.45) 0%, rgba(0, 0, 0, 0) 100%, rgba(255, 255, 255, 0) 100%), linear-gradient(273deg, #c0f 0%, #09f 100%);
  background-blend-mode: overlay, normal;
  box-shadow: 0px -2px 0px 0px rgba(255, 255, 255, 0.25) inset, 0px 4px 18px 0px rgba(107, 87, 255, 0.34);
  padding-left: 24px;
  padding-right: 24px;
  font-size: 16px;
  height: 48px;
  line-height: 48px;
}
@media screen and (min-width: 992px) {
  .btn-radial-linear-gradient {
    font-size: 18px;
    padding-left: 32px;
    padding-right: 32px;
    height: 56px;
    line-height: 56px;
  }
}
@media screen and (min-width: 1400px) {
  .btn-radial-linear-gradient {
    padding-left: 48px;
    padding-right: 48px;
    font-size: 20px;
    height: 64px;
    line-height: 64px;
  }
}
.btn-radial-linear-gradient > * {
  position: relative;
  z-index: 5;
}
.btn-radial-linear-gradient::after {
  position: absolute;
  z-index: 1;
  content: "";
  top: 0;
  left: -100%;
  width: 200%;
  height: 100%;
  background-blend-mode: overlay;
  background: radial-gradient(114.29% 114.29% at 50% 100%, rgba(255, 255, 255, 0.45) 0%, rgba(0, 0, 0, 0) 100%, rgba(255, 255, 255, 0) 100%);
  background-blend-mode: overlay;
  background: linear-gradient(273.42deg, #cc00ff 0%, #0099ff 50%, #cc00ff 100%);
  transition: all 0.1s linear;
}
.btn-radial-linear-gradient:hover {
  color: #fff;
}
.btn-radial-linear-gradient:hover::after {
  left: 0;
}

.downloadBtn {
  position: relative;
  z-index: 1;
}
.downloadBtn .download-list {
  position: absolute;
  z-index: 1;
  padding-bottom: 16px;
  display: none;
  z-index: 20;
  transition: 0.5s;
  left: 50%;
  bottom: 100%;
  transform: translate(-50%, 0);
}
.downloadBtn .download-item {
  padding: 16px 16px 12px 16px;
  border-radius: 8px;
  border: 1px solid rgba(0, 0, 0, 0.04);
  background: #fff;
  box-shadow: 0px 4px 8px 0px rgba(89, 79, 213, 0.15);
}
.downloadBtn .download-item p {
  font-size: 12px;
  color: rgba(0, 0, 0, 0.8);
}
.downloadBtn .download-item .list {
  display: flex;
  gap: 16px;
}
.downloadBtn .download-item .list .cell {
  width: 25%;
  min-width: 88px;
  height: 88px;
  cursor: pointer;
}
.downloadBtn .download-item .list .cell span {
  font-size: 13px;
  line-height: 18px;
}
.downloadBtn .download-item .list .cell .defalut {
  display: flex;
}
.downloadBtn .download-item .list .cell .defalut .win {
  color: #43a0fa;
}
.downloadBtn .download-item .list .cell .defalut .mac {
  color: #316dea;
}
.downloadBtn .download-item .list .cell .defalut .iphone {
  color: black;
}
.downloadBtn .download-item .list .cell .defalut .android {
  color: #50cca3;
}
.downloadBtn .download-item .list .cell .hover {
  display: none;
  color: #6b57ff;
  text-decoration: none;
}
.downloadBtn .download-item .list .cell .hover img {
  width: 84px;
  height: 84px;
}
.downloadBtn .download-item .list .cell:hover {
  border-radius: 8px;
  border: 2px solid #6b57ff;
  background: #fff;
  box-shadow: 0px 4px 8px 0px rgba(31, 21, 115, 0.15);
}
.downloadBtn .download-item .list .cell:hover .defalut {
  display: none;
}
.downloadBtn .download-item .list .cell:hover .hover {
  display: flex;
  border-radius: 8px;
  overflow: hidden;
}
.downloadBtn:hover .download-list {
  display: block;
}

.compare-components {
  --padding-top: 100%;
  --slider-percent: 50%;
  position: relative;
  z-index: 1;
  padding-top: var(--padding-top);
  overflow: hidden;
  cursor: e-resize;
}
.compare-components .compare-line {
  height: 100%;
  width: 1px;
  top: 0;
  bottom: 0;
  left: var(--slider-percent);
  background-color: rgba(255, 255, 255, 0.8);
  cursor: e-resize;
  position: absolute;
  z-index: 7;
}
.compare-components .compare-line:not(.none-after)::after {
  position: absolute;
  top: calc(50% - 8px);
  left: -14px;
  border-radius: 50%;
  content: "";
  width: 28px;
  height: 28px;
  background: url('data:image/svg+xml,<svg preserveAspectRatio="none meet" width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg"><circle opacity="0.5" cx="24" cy="24" r="24" fill="white"/><circle cx="24.0004" cy="24.0002" r="17.4545" fill="white"/><path opacity="0.5" fill-rule="evenodd" clip-rule="evenodd" d="M28.7663 27.6747C28.3857 28.0553 28.3857 28.6723 28.7663 29.0529C29.1468 29.4335 29.7639 29.4335 30.1444 29.0529L33.9626 25.2347C34.3432 24.8541 34.3432 24.2371 33.9626 23.8565L30.1444 20.0384C29.7639 19.6578 29.1468 19.6578 28.7663 20.0384C28.3857 20.4189 28.3857 21.036 28.7663 21.4165L31.8953 24.5456L28.7663 27.6747ZM19.7796 21.4167C20.1602 21.0361 20.1602 20.4191 19.7796 20.0385C19.3991 19.658 18.782 19.658 18.4015 20.0385L14.5833 23.8567C14.2027 24.2373 14.2027 24.8543 14.5833 25.2349L18.4015 29.0531C18.782 29.4336 19.3991 29.4336 19.7796 29.0531C20.1602 28.6725 20.1602 28.0555 19.7796 27.6749L16.6506 24.5458L19.7796 21.4167Z" fill="%231B1B1B"/></svg>');
  background-size: 100%;
}
.compare-components .compare-line.transition {
  transition: all 0.5s linear;
}
.compare-components .compare-before {
  position: absolute;
  top: -2px;
  left: -2px;
  bottom: -2px;
  right: -2px;
  width: calc(100% + 4px);
  height: calc(100% + 4px);
  z-index: 2;
  overflow: hidden;
  clip-path: polygon(0% 0%, var(--slider-percent) 0, var(--slider-percent) 100%, 0% 100%);
}
.compare-components .compare-before.transition {
  transition: all 0.5s linear;
}
.compare-components .compare-after {
  position: absolute;
  top: -2px;
  left: -2px;
  bottom: -2px;
  right: -2px;
  width: calc(100% + 4px);
  height: calc(100% + 4px);
  z-index: 1;
}
.compare-components .img {
  position: absolute;
  top: -2px;
  left: -2px;
  bottom: -2px;
  right: -2px;
  width: calc(100% + 4px);
  height: calc(100% + 4px);
  z-index: 1;
  background-position: center top;
  background-repeat: no-repeat;
  background-size: cover;
}
.compare-components .img-after,
.compare-components .img-before {
  position: absolute;
  top: 18px;
  background: rgba(0, 0, 0, 0.3);
  border-radius: 8px;
  color: #fff;
  z-index: 10 !important;
  font-size: 12px;
}
@media screen and (min-width: 992px) {
  .compare-components .img-after,
  .compare-components .img-before {
    font-size: 14px;
  }
}
.compare-components .img-after span,
.compare-components .img-before span {
  display: inline-block;
  width: 62px;
  height: 30px;
  text-align: center;
  line-height: 30px;
}
@media screen and (min-width: 992px) {
  .compare-components .img-after span,
  .compare-components .img-before span {
    width: 73px;
    height: 34px;
    line-height: 34px;
  }
}
.compare-components .img-after {
  right: 18px;
}
.compare-components .img-before {
  left: 18px;
}
.compare-components.compare-components-autoAmimation .compare-line {
  width: 0;
  border: 0;
  left: 50%;
  animation: animate-compare-line 6s linear;
}
@media screen and (min-width: 992px) {
  .compare-components.compare-components-autoAmimation .compare-line {
    animation: animate-compare-line 8s linear;
  }
}
.compare-components.compare-components-autoAmimation .compare-line::after {
  width: 2px;
  height: 100%;
  top: 0;
  bottom: 0;
  left: 0;
  right: auto;
  border-radius: 0;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.8) 0%, rgba(255, 255, 255, 0) 100%);
  animation: animate-compare-line-after 6s linear;
}
@media screen and (min-width: 992px) {
  .compare-components.compare-components-autoAmimation .compare-line::after {
    animation: animate-compare-line-after 8s linear;
  }
}
.compare-components.compare-components-autoAmimation .compare-before {
  clip-path: polygon(0% 0%, 50% 0, 50% 100%, 0% 100%);
  animation: animate-compare-before 6s linear;
}
@media screen and (min-width: 992px) {
  .compare-components.compare-components-autoAmimation .compare-before {
    animation: animate-compare-before 8s linear;
  }
}
.compare-components.compare-components-autoAmimation-init .compare-line {
  animation: init-animate-compare-line 6s infinite linear;
}
.compare-components.compare-components-autoAmimation-init .compare-before {
  animation: init-animate-compare-before 6s infinite linear;
}

@keyframes animate-compare-line {
  0% {
    left: var(--slider-percent);
  }
  1% {
    left: var(--slider-percent);
  }
  25% {
    left: 0%;
  }
  26% {
    left: 0%;
  }
  75% {
    left: 100%;
  }
  76% {
    left: 100%;
  }
  100% {
    left: var(--slider-percent);
  }
}
@keyframes animate-compare-line-after {
  0% {
    left: 0;
    right: auto;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.5) 100%);
  }
  1% {
    left: 0;
    right: auto;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%);
  }
  25% {
    left: 0;
    right: auto;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%);
  }
  26% {
    right: 0;
    left: auto;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.5) 100%);
  }
  75% {
    right: 0;
    left: auto;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.5) 100%);
  }
  76% {
    left: 0;
    right: auto;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%);
  }
  100% {
    left: 0;
    right: auto;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%);
  }
}
@keyframes animate-compare-before {
  0% {
    clip-path: polygon(0% 0%, var(--slider-percent) 0, var(--slider-percent) 100%, 0% 100%);
  }
  1% {
    clip-path: polygon(0% 0%, var(--slider-percent) 0, var(--slider-percent) 100%, 0% 100%);
  }
  25% {
    clip-path: polygon(0% 0%, 0% 0, 0% 100%, 0% 100%);
  }
  26% {
    clip-path: polygon(0% 0%, 0% 0, 0% 100%, 0% 100%);
  }
  75% {
    clip-path: polygon(0% 0%, 100% 0, 100% 100%, 0% 100%);
  }
  76% {
    clip-path: polygon(0% 0%, 100% 0, 100% 100%, 0% 100%);
  }
  100% {
    clip-path: polygon(0% 0%, var(--slider-percent) 0, var(--slider-percent) 100%, 0% 100%);
  }
}
@keyframes init-animate-compare-line {
  0% {
    left: 50%;
  }
  25% {
    left: 100%;
  }
  75% {
    left: 0;
  }
  100% {
    left: 50%;
  }
}
@keyframes init-animate-compare-before {
  0% {
    clip-path: polygon(0% 0%, 50% 0, 50% 100%, 0% 100%);
  }
  25% {
    clip-path: polygon(0% 0%, 100% 0, 100% 100%, 0% 100%);
  }
  75% {
    clip-path: polygon(0% 0%, 0% 0, 0% 100%, 0% 100%);
  }
  100% {
    clip-path: polygon(0% 0%, 50% 0, 50% 100%, 0% 100%);
  }
}
.page-bottom-section .title span {
  color: #ffca8b;
}
.page-bottom-section .info {
  font-size: 14px;
}
@media screen and (min-width: 992px) {
  .page-bottom-section .info {
    font-size: 16px;
  }
}
@media screen and (min-width: 1400px) {
  .page-bottom-section .info {
    font-size: 20px;
  }
}
@media screen and (min-width: 1400px) {
  .page-bottom-section .btn {
    font-size: 20px;
  }
}

.step {
  color: rgba(0, 0, 0, 0.6);
}
.step .step-num {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  padding-right: 4px;
  background: rgba(107, 87, 255, 0.08);
  border-radius: 50%;
  font-size: 21px;
  font-style: italic;
  font-weight: 800;
  color: #6b57ff;
}
@media (min-width: 1400px) {
  .step .step-num {
    width: 56px;
    height: 56px;
    font-size: 24px;
  }
}
.step .step-title {
  font-size: 16px;
  font-weight: 500;
  line-height: 33.6px;
}
@media (min-width: 1600px) {
  .step .step-title {
    font-size: 20px;
  }
}
@media (min-width: 1960px) {
  .step .step-title {
    font-size: 24px;
  }
}
.step .step-text {
  margin: 0;
  font-size: 14px;
  line-height: 140%;
  color: inherit;
}
@media (min-width: 992px) {
  .step .step-text {
    min-height: 56px;
    margin: 12px 0;
    font-size: 16px;
  }
}
.step .progress {
  display: none;
  height: 4px;
  background: rgba(107, 87, 255, 0.2);
  border-radius: 8px;
}
.step .progress span {
  top: 0;
  left: 0;
  background-color: #6b57ff;
}
.step .stepListPic {
  margin-top: 32px;
  margin-bottom: 16px;
}
.step .step-group {
  margin-top: 32px;
}
@media (min-width: 1400px) {
  .step .step-group {
    margin-top: 64px;
  }
}
@media (min-width: 1960px) {
  .step .step-group {
    margin-top: 72px;
  }
}
.step .step-group .img-box {
  margin-bottom: 16px;
}
@media (min-width: 992px) {
  .step .step-group .img-box {
    margin-bottom: 48px;
  }
}
@media (min-width: 1960px) {
  .step .step-group .img-box {
    margin-bottom: 56px;
  }
}
.step .step-group .img-box img {
  transition: 0.2s;
}
.step .step-group .step-item.active .img-box img {
  filter: drop-shadow(0px 10px 32px rgba(0, 0, 0, 0.25));
  transform: scale(1.03);
  border-color: #8372ff;
}
.step .step-group .step-item.active .step-num {
  background: #6b57ff;
  color: #fff;
}
.step .step-group .step-item.active .step-text {
  color: rgba(107, 87, 255, 0.8);
}
.step .step-group .step-item.active .progress {
  display: block;
}
.step .step-group .step-item.active .progress span {
  animation: progressActive 3s;
}
.step .stepListText .swiper-slide.swiper-slide-thumb-active .step-num {
  background: var(--bs-primary);
  color: #fff;
}
.step .stepListText .swiper-slide.swiper-slide-thumb-active .step-text {
  color: var(--bs-primary);
}
.step.bg-dark {
  color: rgba(255, 255, 255, 0.7);
}
.step.bg-dark .title,
.step.bg-dark .step-title {
  color: #fff;
}
.step.bg-dark .step-num {
  background: rgb(207, 211, 255);
}
.step.bg-dark .step-item.active .step-text {
  color: rgba(255, 255, 255, 0.7);
}

@keyframes progressActive {
  from {
    width: 0;
  }
  to {
    width: 100%;
  }
}
@media (min-width: 992px) {
  .section-video-effects .swiper-wrapper {
    gap: 32px;
  }
}
.section-video-effects .video-cont {
  width: 100%;
  position: relative;
  margin-bottom: 16px;
}
@media (min-width: 768px) {
  .section-video-effects .video-cont {
    width: calc(33.3% - 16px);
    margin-bottom: 0;
  }
}
@media (min-width: 992px) {
  .section-video-effects .video-cont {
    width: calc(33.3% - 22px);
  }
}
.section-video-effects .video-cont::before {
  content: "";
  position: absolute;
  width: 48px;
  height: 48px;
  background: url('data:image/svg+xml,<svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg"><circle cx="24" cy="24" r="24" fill="white" fill-opacity="0.4"/><path d="M34.5837 22.1104C35.8793 22.8514 35.8793 24.7038 34.5837 25.4447L18.915 34.4057C17.6194 35.1466 15.9999 34.2204 15.9999 32.7385L15.9999 14.8166C15.9999 13.3347 17.6194 12.4085 18.915 13.1495L34.5837 22.1104Z" fill="white"/></svg>') no-repeat center center;
  background-size: 100% 100%;
  left: 24px;
  top: 24px;
}
.section-video-effects .video-cont.actived::before {
  display: none;
}
.section-video-effects .video-cont video {
  border-radius: 16px;
}
@media (min-width: 992px) {
  .section-video-effects .video-cont video {
    border-radius: 24px;
  }
}
.section-video-effects .video-cont p {
  font-size: 16px;
  font-weight: 500;
}
@media (min-width: 992px) {
  .section-video-effects .video-cont p {
    font-size: 20px;
  }
}
@media (min-width: 1600px) {
  .section-video-effects .video-cont p {
    font-size: 24px;
  }
}
.section-video-effects .compare-components-wrap {
  margin-bottom: 16px;
  width: 100%;
}
@media (min-width: 768px) {
  .section-video-effects .compare-components-wrap {
    width: calc(33.3% - 16px);
    margin-bottom: 0;
  }
}
@media (min-width: 992px) {
  .section-video-effects .compare-components-wrap {
    width: calc(33.3% - 22px);
  }
}
.section-video-effects .compare-components-wrap p {
  font-size: 16px;
  font-weight: 500;
}
@media (min-width: 992px) {
  .section-video-effects .compare-components-wrap p {
    font-size: 20px;
  }
}
@media (min-width: 1600px) {
  .section-video-effects .compare-components-wrap p {
    font-size: 24px;
  }
}
.section-video-effects .compare-components-wrap .compare-components {
  cursor: pointer;
}
.section-video-effects .compare-components-wrap .hover-auto-amimation {
  --padding-top: 60%;
  border-radius: 16px;
}
@media (min-width: 992px) {
  .section-video-effects .compare-components-wrap .hover-auto-amimation {
    border-radius: 20px;
  }
}
@media (min-width: 1400px) {
  .section-video-effects .compare-components-wrap .hover-auto-amimation {
    border-radius: 24px;
  }
}
.section-video-effects .compare-components-wrap .hover-auto-amimation .compare-line {
  width: 2px;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.2) 0%, rgb(255, 255, 255) 50%, rgba(255, 255, 255, 0.2) 100%);
}
.section-video-effects .compare-components-wrap .hover-auto-amimation .compare-line::after {
  display: none;
}
.section-video-effects .compare-components-wrap .hover-auto-amimation:hover .compare-line {
  animation: animate-compare-line 6s linear 2;
}
.section-video-effects .compare-components-wrap .hover-auto-amimation:hover .compare-before {
  clip-path: polygon(0% 0%, 50% 0, 50% 100%, 0% 100%);
  animation: animate-compare-before 6s linear 2;
}
@media (max-width: 992px) {
  .section-video-effects .compare-components-wrap .hover-auto-amimation .compare-line {
    animation: init-animate-compare-line 6s infinite linear;
  }
  .section-video-effects .compare-components-wrap .hover-auto-amimation .compare-before {
    clip-path: polygon(0% 0%, 50% 0, 50% 100%, 0% 100%);
    animation: init-animate-compare-before 6s infinite linear;
  }
}

.faq .accordion {
  margin-top: 24px;
}
@media (min-width: 992px) {
  .faq .accordion {
    margin-top: 54px;
  }
}
@media (min-width: 1600px) {
  .faq .accordion {
    margin-top: 72px;
  }
}
.faq .accordion .accordion-item {
  margin: 0 !important;
}
.faq .accordion .accordion-item .accordion-header .accordion-button {
  padding: 24px 24px 0 24px;
  font-size: 16px;
  font-weight: 500;
  background: none;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  border-bottom: solid 1px rgba(0, 0, 0, 0.1);
}
@media (min-width: 992px) {
  .faq .accordion .accordion-item .accordion-header .accordion-button {
    font-size: 18px;
  }
}
@media (min-width: 1600px) {
  .faq .accordion .accordion-item .accordion-header .accordion-button {
    font-size: 20px;
  }
}
.faq .accordion .accordion-item .accordion-header .accordion-button.collapsed {
  padding: 32px 24px;
}
@media (min-width: 992px) {
  .faq .accordion .accordion-item .accordion-header .accordion-button.collapsed {
    padding: 40px 24px;
  }
}
.faq .accordion .accordion-item .accordion-header .accordion-button:after {
  background-image: url('data:image/svg+xml,<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M7.00029 14.0003L15.2929 22.2929C15.6834 22.6834 16.3166 22.6834 16.7071 22.2929L24.9997 14.0003" stroke="black" stroke-width="3" stroke-linecap="round"/></svg>');
  background-size: 100% 100%;
  width: 32px;
  height: 32px;
}
.faq .accordion .accordion-item .accordion-header .accordion-button:not(.collapsed) {
  color: var(--bs-primary);
  background: rgba(107, 87, 255, 0.05);
  border-bottom: 0;
}
.faq .accordion .accordion-item .accordion-header .accordion-button:not(.collapsed)::after {
  background-image: url('data:image/svg+xml,<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M7.00029 14.0003L15.2929 22.2929C15.6834 22.6834 16.3166 22.6834 16.7071 22.2929L24.9997 14.0003" stroke="rgb(107 87 255)" stroke-width="3" stroke-linecap="round"/></svg>');
  background-size: 100% 100%;
  width: 32px;
  height: 32px;
  transform: rotate(180deg);
}
.faq .accordion .accordion-item .accordion-collapse {
  font-size: 14px;
}
@media (min-width: 1600px) {
  .faq .accordion .accordion-item .accordion-collapse {
    font-size: 16px;
  }
}
.faq .accordion .accordion-item .accordion-collapse:not(.collapsed) {
  background: rgba(107, 87, 255, 0.05);
}

.tips .relation-list {
  margin-top: 0;
}
@media (min-width: 992px) {
  .tips .relation-list {
    margin-top: 54px;
  }
}
@media (min-width: 1600px) {
  .tips .relation-list {
    margin-top: 72px;
  }
}
.tips .relation-list .cell {
  padding: 32px 24px;
  border-radius: 12px;
  background: rgba(107, 87, 255, 0.05);
}
@media (min-width: 1600px) {
  .tips .relation-list .cell {
    padding: 40px 32px;
  }
}
.tips .relation-list .cell li a {
  transition: transform 0.2s;
  display: block;
  font-size: 16px;
}
@media (min-width: 992px) {
  .tips .relation-list .cell li a {
    font-size: 18px;
  }
}
@media (min-width: 1600px) {
  .tips .relation-list .cell li a {
    font-size: 20px;
  }
}
.tips .relation-list .cell li a:hover {
  transform: translateX(8px);
}

#tkdw-mask .img-cont {
  left: 52px;
  bottom: 100px;
  animation: tkdw-installbox-shake 6s linear infinite alternate;
}
#tkdw-mask .img-cont img {
  max-width: 352px;
}
#tkdw-mask .img-cont > div {
  bottom: 10%;
  left: 20%;
  width: 68%;
  height: 25%;
  font-size: 18px;
  line-height: 150%;
}
#tkdw-mask .icon-cont {
  left: 160px;
  top: calc(100% - 110px);
  /* transform: translateY(-100%); */
  width: 130px;
  background-size: 100%;
  animation: tkdw-arrow-trans 1s ease infinite;
  background: url('data:image/svg+xml,<svg preserveAspectRatio="none meet" width="130" height="81" viewBox="0 0 130 81" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M129.012 0.680041C118.189 0.0360155 111.086 1.55776 102.536 8.2317C94.8161 14.2587 88.8455 24.2272 83.3992 32.2706C76.6561 42.229 60.5392 57.7275 47.4429 50.611C37.274 45.0851 36.2765 30.5374 48.009 26.3444C52.5321 24.7279 58.0678 28.389 58.8891 33.0764C59.7763 38.1392 55.6853 43.7941 52.5798 47.3166C44.2397 56.7769 30.8835 52.114 20.6539 56.9028C11.0968 61.3769 7.51935 69.6473 4.77107 79.3458C4.53566 80.1766 2.73221 77.0462 2.21086 76.3133C0.299657 73.6264 0.612497 75.1997 2.05755 77.2313C2.98692 78.5378 4.27695 81.8037 5.50577 79.812C6.39233 78.375 8.97023 76.3589 10.3925 75.3473" stroke="white" stroke-linecap="round"/></svg>');
  background-position: top;
}

@keyframes tkdw-arrow-trans {
  0% {
    height: 0;
  }
  100% {
    height: 81px;
  }
}
@keyframes tkdw-installbox-shake {
  0%, 100% {
    transform: scaleY(0);
  }
  10%, 30%, 50%, 70%, 90% {
    transform: rotate(6deg);
  }
  20%, 40%, 60%, 80% {
    transform: rotate(-6deg);
  }
}/*# sourceMappingURL=global.css.map */