@font-face {
  font-family: 'ZalandoSans';
  font-display: swap;
  src: url('../fonts/ZalandoSans-VariableFont_wdth,wght.woff2') format('woff2-variations');
  font-weight: 200 900;
}
:root {
  --container-width: 85rem;
  --container-padding: 2.5rem;
  --app-min-width: 26.25rem;
  --header-height: 5rem;
  --content-gap: 1.25rem;
}
@media (width < 1024px) {
  :root {
    --container-padding: 2.5rem;
  }
}
@media (width < 768px) {
  :root {
    --container-padding: 1.5rem;
  }
}
@media (width < 480px) {
  :root {
    --container-padding: 1rem;
  }
}
.scrollbar-hide {
  -ms-overflow-style: none;
  scrollbar-width: none;
}
.scrollbar-hide::-webkit-scrollbar {
  display: none;
}
.btn-clip-path {
  clip-path: polygon(
    0 0.5rem,
    0.5rem 0,
    calc(100% - 0.5rem) 0,
    100% 0.5rem,
    100% calc(100% - 0.5rem),
    calc(100% - 0.5rem) 100%,
    0.5rem 100%,
    0 calc(100% - 0.5rem)
  );
}
.btn-frame-clip-path {
  clip-path: polygon(
    0 0.5rem,
    0.5rem 0,
    calc(100% - 0.5rem) 0,
    100% 0.5rem,
    100% calc(100% - 0.5rem),
    calc(100% - 0.5rem) 100%,
    0.5rem 100%,
    0 calc(100% - 0.5rem),
    0 0.5rem,
    0.125rem calc(0.5rem + 0.83px),
    0.125rem calc(100% - 0.5rem - 0.83px),
    calc(0.5rem + 0.83px) calc(100% - 0.125rem),
    calc(100% - 0.5rem - 0.83px) calc(100% - 0.125rem),
    calc(100% - 0.125rem) calc(100% - 0.5rem - 0.83px),
    calc(100% - 0.125rem) calc(0.5rem + 0.83px),
    calc(100% - 0.5rem - 0.83px) 0.125rem,
    calc(0.5rem + 0.83px) 0.125rem,
    0.125rem calc(0.5rem + 0.83px)
  );
}
/* base */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
@media (width >= 1024px) {
  * ::-webkit-scrollbar {
    width: 0.375rem;
    height: 0.375rem;
  }
  * ::-webkit-scrollbar-thumb {
    background-color: #484b58;
    border-radius: 0.375rem;
    background-clip: padding-box;
  }
  * ::-webkit-scrollbar-track {
    background: transparent;
  }
}
*:after,
*:before {
  box-sizing: inherit;
}
html {
  overflow: hidden scroll;
  -webkit-tap-highlight-color: transparent;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  display: flex;
  flex-direction: column;
}
@media (width < 1440px) and (width >= 1024px) {
  html {
    font-size: 1.11vw;
  }
}
html:only-child {
  display: flex !important;
}
body {
  font-family: 'ZalandoSans', sans-serif;
  font-variation-settings: 'wdth' 125;
  font-size: 1.063rem;
  line-height: 1.48;
  color: #fff;
  min-width: var(--app-min-width);
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  background-color: #000;
  overflow: hidden;
  padding: 0 !important;
}
body:has(.header) {
  padding-top: var(--header-height) !important;
}
@media (width < 1024px) {
  body {
    font-size: 0.875rem;
    line-height: 1.4;
  }
}
.container {
  margin-left: auto;
  margin-right: auto;
  width: calc(var(--container-width) + 2 * var(--container-padding));
  padding-left: var(--container-padding);
  padding-right: var(--container-padding);
  max-width: 100%;
}
.h1,
.h2 {
  font-weight: 900;
  text-transform: uppercase;
}
.h1 {
  font-size: 3.125rem;
  line-height: 1.2;
}
@media (width < 1024px) {
  .h1 {
    font-size: 2.5rem;
  }
}
.h2 {
  font-size: 2.375rem;
  line-height: 1.28;
}
@media (width < 1024px) {
  .h2 {
    font-size: 2rem;
  }
}
.h3 {
  font-size: 1.75rem;
  line-height: 1.32;
  font-weight: 700;
  text-transform: uppercase;
}
@media (width < 1024px) {
  .h3 {
    font-size: 1.5rem;
  }
}
.h4 {
  font-size: 1.25rem;
  line-height: 1.32;
  font-weight: 800;
  text-transform: uppercase;
}
@media (width < 1024px) {
  .h4 {
    font-size: 1.125rem;
  }
}
@media (width < 1200px) {
  .hidden-desktop {
    display: none !important;
  }
}
@media (width < 1024px) {
  .hidden-tablet {
    display: none !important;
  }
}
@media (width < 768px) {
  .hidden-mobile {
    display: none !important;
  }
}
@media (width >= 768px) {
  .visible-mobile {
    display: none !important;
  }
}
@media (width >= 1024px) {
  .visible-tablet {
    display: none !important;
  }
}
@media (width >= 1200px) {
  .visible-desktop {
    display: none !important;
  }
}
.cover-img {
  display: flex;
  overflow: hidden;
  will-change: transform;
}
.cover-img picture,
.cover-img img,
.cover-img video,
.cover-img canvas {
  width: 100%;
  object-fit: cover;
  height: 100%;
}
.contain-img {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
}
.contain-img img,
.contain-img video {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}
img {
  border: 0;
  max-width: 100%;
  height: auto;
}
picture img {
  display: block;
}
ul,
ol {
  list-style: none;
}
b,
strong {
  font-weight: 700;
}
button {
  all: unset;
  box-sizing: border-box;
  -webkit-user-select: none;
  user-select: none;
  cursor: pointer;
  appearance: button;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
  background-color: transparent;
}
svg {
  all: unset;
  flex: none;
}
use {
  fill: currentColor;
}
.swiper-slide {
  height: auto;
}
a {
  text-decoration: none;
  color: #2bc2c4;
}
.icon {
  --size: 1rem;
  width: var(--size);
  height: var(--size);
}
.btn {
  --height: 2.75rem;
  --color: #2bc2c4;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  min-height: var(--height);
  cursor: pointer;
  padding: calc(0.2 * var(--height)) calc(0.45 * var(--height));
  max-width: 100%;
  color: var(--color);
  flex: none;
  font-size: 0.813rem;
  font-weight: 700;
  -webkit-user-select: none;
  user-select: none;
  text-transform: uppercase;
  position: relative;
  transition:
    color 0.4s,
    border-color 0.4s,
    background-color 0.4s,
    background-position 0.4s;
  clip-path: polygon(
    0 0.5rem,
    0.5rem 0,
    calc(100% - 0.5rem) 0,
    100% 0.5rem,
    100% calc(100% - 0.5rem),
    calc(100% - 0.5rem) 100%,
    0.5rem 100%,
    0 calc(100% - 0.5rem)
  );
}
.btn:hover {
  background-color: var(--color);
  color: #fff;
}
.btn:before {
  content: '';
  position: absolute;
  inset: 0;
  background: var(--color);
  z-index: -1;
  clip-path: polygon(
    0 0.5rem,
    0.5rem 0,
    calc(100% - 0.5rem) 0,
    100% 0.5rem,
    100% calc(100% - 0.5rem),
    calc(100% - 0.5rem) 100%,
    0.5rem 100%,
    0 calc(100% - 0.5rem),
    0 0.5rem,
    0.125rem calc(0.5rem + 0.83px),
    0.125rem calc(100% - 0.5rem - 0.83px),
    calc(0.5rem + 0.83px) calc(100% - 0.125rem),
    calc(100% - 0.5rem - 0.83px) calc(100% - 0.125rem),
    calc(100% - 0.125rem) calc(100% - 0.5rem - 0.83px),
    calc(100% - 0.125rem) calc(0.5rem + 0.83px),
    calc(100% - 0.5rem - 0.83px) 0.125rem,
    calc(0.5rem + 0.83px) 0.125rem,
    0.125rem calc(0.5rem + 0.83px)
  );
}
.btn-white-fill {
  background-color: #fff;
  color: #2bc2c4;
}
.btn-white-fill:before {
  display: none;
}
.btn-simple {
  clip-path: unset;
}
.btn-simple:before {
  display: none;
}
.btn-simple-border {
  border: solid 1px rgba(255, 255, 255, 0.2);
  background-color: rgba(255, 255, 255, 0.04);
  color: #fff;
}
.btn-simple-border:hover {
  background-color: #fff;
  border-color: #fff;
  color: #000;
}
.btn-simple-gradient {
  background-image: linear-gradient(to right, #2bc2c4, #80e4e5, #2bc2c4);
  background-size: 200% 100%;
  color: #000;
}
.btn-simple-gradient:hover {
  background-position-x: -100%;
  color: #000;
}
.swiper-horizontal {
  margin: unset;
  top: unset;
}
.form-block {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
.form-block:has([readonly]) .form-block-title {
  color: rgba(255, 255, 255, 0.4);
  font-size: 0.75rem;
}
.form-block.disabled {
  opacity: 0.4;
  pointer-events: none;
}
.form-block-title {
  font-size: 0.813rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.form-block-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 0.5rem;
}
.input-block {
  position: relative;
  display: flex;
  flex-direction: column;
  --input-color: #fff;
  --input-height: 3.75rem;
  --input-bg: #12171c;
  --input-padding: 1.25rem;
  --input-font-weight: 500;
  --input-font-size: 1.063rem;
}
.input-block:has(.input:-webkit-autofill) .input-placeholder {
  transform: translate(0.375rem, calc(-0.5 * var(--input-height))) scale(0.7);
}
.input-block:has(.input:focus) .input-placeholder,
.input-block:has(.input:not(:placeholder-shown)) .input-placeholder,
.input-block:has(.input:autofill) .input-placeholder,
.input-block:has(.input:-webkit-autofill) .input-placeholder,
.input-block.active .input-placeholder {
  transform: translate(0.375rem, calc(-0.5 * var(--input-height))) scale(0.7);
}
.input-placeholder {
  position: absolute;
  pointer-events: none;
  left: calc(var(--input-padding) - 0.375rem);
  top: calc(0.5 * var(--input-height) - 0.5lh);
  font-weight: var(--input-font-weight);
  font-size: var(--input-font-size);
  color: rgba(255, 255, 255, 0.4);
  padding: 0 0.375rem;
  -webkit-user-select: none;
  user-select: none;
  max-width: calc(100% - 2 * var(--input-padding));
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  background: linear-gradient(
    to bottom,
    transparent,
    transparent calc(50% - 1px),
    var(--input-bg) calc(50% - 1px),
    var(--input-bg) calc(50% + 0.125rem),
    transparent calc(50% + 0.125rem)
  );
  transform-origin: left center;
  transition: transform 0.2s;
}
@media (width < 1024px) {
  .input-placeholder {
    font-size: 1rem;
  }
}
.input {
  --color: var(--input-color, #fff);
  --height: var(--input-height, 3.75rem);
  --bg: var(--input-bg, #12171c);
  font-variation-settings: inherit;
  height: var(--height);
  border: solid 1px rgba(255, 255, 255, 0.2);
  display: block;
  width: 100%;
  padding: 0 var(--input-padding, 1.25rem);
  appearance: none;
  box-shadow: none;
  caret-color: var(--color);
  transition: border-color 0.4s;
  color: var(--color);
  outline: none;
  line-height: 1;
  text-overflow: ellipsis;
  font-weight: var(--input-font-weight);
  font-size: var(--input-font-size);
  border-radius: 0;
  font-family: 'ZalandoSans', sans-serif;
  background: var(--bg);
}
@media (width < 1024px) {
  .input {
    font-size: 1rem;
  }
}
.input:focus:not(.select-toggle) {
  border-color: rgba(255, 255, 255, 0.4);
}
.input:-webkit-autofill {
  -webkit-text-fill-color: var(--color);
  background-color: transparent;
  -webkit-transition:
    background-color 5000000s 0s,
    border-color 0.4s;
  transition:
    background-color 5000000s 0s,
    border-color 0.4s;
  animation-name: onAutoFillStart;
  animation-duration: 0.01s;
  animation-iteration-count: 1;
}
.input:not(:-webkit-autofill) {
  animation-name: onAutoFillCancel;
  animation-duration: 0.01s;
  animation-iteration-count: 1;
}
.input:-webkit-autofill::first-line {
  font-family: 'ZalandoSans', sans-serif;
}
.input::-webkit-outer-spin-button,
.input::-webkit-inner-spin-button {
  appearance: none;
  display: none;
}
.input::-webkit-search-decoration,
.input::-webkit-search-cancel-button,
.input::-webkit-search-results-button,
.input::-webkit-search-results-decoration {
  appearance: none;
  display: none;
}
.input[type='number'] {
  -moz-appearance: textfield;
}
.input[type='password'] {
  padding-right: 2.5rem;
}
.textarea {
  resize: none;
  height: 9.375rem;
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}
.input-block-number {
  position: relative;
}
.input-block-number .input-placeholder {
  max-width: calc(100% - var(--input-padding) - 2.25rem);
}
.input-block-number .input {
  padding-right: 2.25rem;
}
.input-number-btn {
  position: absolute;
  right: 0.75rem;
  display: flex;
  color: #2bc2c4;
  transition: color 0.4s;
}
.input-number-btn:hover {
  color: #80e4e5;
}
.input-number-btn svg {
  --size: 0.75rem;
}
.input-number-btn-plus {
  bottom: 50%;
}
.input-number-btn-minus {
  top: 50%;
}
.tab-block:not(.active) {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  height: 0;
  overflow: hidden;
  padding: 0;
  margin: 0;
  will-change: transform;
}
.tab-block.active {
  transition:
    opacity 0.4s,
    visibility 0.4s;
}
.marquee {
  overflow: hidden;
  display: flex;
  --gap: 1rem;
  max-width: 120rem;
  margin: 0 auto;
}
.marquee-rtl {
  justify-content: flex-end;
}
.marquee-rtl .marquee-track {
  animation-name: marquee-rtl;
  padding-right: 0;
  padding-left: var(--gap);
}
.marquee-track {
  animation: marquee var(--speed, 16s) linear infinite;
  display: flex;
  gap: var(--gap);
  flex: none;
  padding-right: var(--gap);
}
.marquee-track:hover {
  animation-play-state: paused;
}
.marquee-group {
  display: flex;
  gap: var(--gap);
  flex: none;
}
.marquee-slide {
  flex: none;
}
@keyframes marquee {
  to {
    transform: translateX(-50%);
  }
}
@keyframes marquee-vertical {
  to {
    transform: translateY(-50%);
  }
}
@keyframes marquee-rtl {
  to {
    transform: translateX(50%);
  }
}
.checkbox {
  --icon: 1.5rem;
  --radius: 0px;
  display: inline-flex;
  width: fit-content;
  gap: 0.75rem;
  position: relative;
  cursor: pointer;
  -webkit-user-select: none;
  user-select: none;
  font-size: 0.813rem;
  line-height: 1.2;
  padding: 0.5rem 0;
}
.checkbox input {
  position: absolute;
  left: 0;
  top: 0.5rem;
  cursor: pointer;
  opacity: 0;
  border-radius: var(--radius);
  width: var(--icon);
  height: var(--icon);
}
.checkbox > i {
  flex: none;
  border: solid 1px rgba(255, 255, 255, 0.2);
  background-color: rgba(255, 255, 255, 0.06);
  border-radius: var(--radius);
  width: var(--icon);
  height: var(--icon);
  display: grid;
  place-items: center;
  color: #fff;
  transition:
    background-color 0.4s,
    border-color 0.4s;
}
.checkbox > i svg {
  transition:
    opacity 0.4s,
    transform 0.4s;
  opacity: 0;
  transform: scale(0);
}
.checkbox > span {
  align-self: center;
}
.checkbox:has(input:checked) > i {
  background-color: #2bc2c4;
  border-color: #2bc2c4;
}
.checkbox:has(input:checked) > i svg {
  opacity: 1;
  transform: scale(1);
}
.checkbox a {
  transition: color 0.4s;
}
.checkbox a:hover {
  color: #80e4e5;
}
.checkbox-switcher {
  justify-content: space-between;
  font-size: 0.813rem;
  gap: 0.5rem;
  align-items: center;
}
.checkbox-switcher > i {
  width: 2.375rem;
  height: 1.375rem;
  border-radius: 2.375rem;
  border: 0;
  background-color: rgba(255, 255, 255, 0.2);
  position: relative;
  transition: background-color 0.4s;
}
.checkbox-switcher > i:before {
  content: '';
  height: 1rem;
  aspect-ratio: 1;
  border-radius: 50%;
  background-color: #fff;
  position: absolute;
  left: 0.188rem;
  top: calc(50% - 0.5rem);
  transition:
    transform 0.4s,
    background-color 0.4s;
  box-shadow: 0px 0.25rem 0.25rem 0px rgba(0, 0, 0, 0.25);
}
.checkbox-switcher:has(input:checked) > i:before {
  transform: translateX(1rem);
}
.checkbox-switcher-alt > i {
  width: 2rem;
  height: 0.625rem;
}
.checkbox-switcher-alt > i:before {
  left: 0;
}
.radio {
  --icon: 1.5rem;
  --radius: 50%;
  display: inline-flex;
  gap: 0.75rem;
  position: relative;
  cursor: pointer;
  -webkit-user-select: none;
  user-select: none;
  font-size: 0.813rem;
  line-height: 1.2;
}
.radio input {
  position: absolute;
  left: 0;
  top: 0;
  cursor: pointer;
  opacity: 0;
  border-radius: var(--radius);
  width: var(--icon);
  height: var(--icon);
}
.radio > i {
  flex: none;
  border: solid 1px rgba(255, 255, 255, 0.2);
  border-radius: var(--radius);
  width: var(--icon);
  height: var(--icon);
  display: grid;
  place-items: center;
  position: relative;
}
.radio > i:before {
  content: '';
  position: absolute;
  inset: 0.188rem;
  background-color: #2bc2c4;
  border-radius: inherit;
  opacity: 0;
  transform: scale(0);
  transition:
    opacity 0.4s,
    transform 0.4s;
}
.radio > span {
  align-self: center;
}
.radio:has(input:checked) > i:before {
  opacity: 1;
  transform: scale(1);
}
.radio-btns {
  display: flex;
  gap: 0.938rem;
}
.radio-btn {
  flex: auto;
  font-size: 0.813rem;
  font-weight: 600;
  padding: 0.25rem 0.5rem;
  align-items: center;
  justify-content: center;
  display: flex;
  border: solid 1px rgba(255, 255, 255, 0.2);
  background-color: rgba(255, 255, 255, 0.04);
  min-height: 2.25rem;
  transition:
    color 0.4s,
    background-color 0.4s,
    border-color 0.4s;
}
.radio-btn:hover {
  color: #2bc2c4;
}
.radio-btn:has(:checked) {
  background-color: #101114;
  color: #fff;
  border-color: #2bc2c4;
}
.frame {
  position: relative;
}
.frame-img {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.frame-mask {
  -webkit-mask-image: var(--mask-image);
  mask-image: var(--mask-image);
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  position: relative;
  display: flex;
  width: 100%;
  height: 100%;
}
[data-aos='fade-up'] {
  opacity: 0;
  transform: translateY(2.5rem);
  transition-property: transform, opacity;
  transition-duration: 0.4s;
  transition-delay: 0.2s;
}
[data-aos='fade-up'].aos-animate {
  opacity: 1;
  transform: translateY(0);
}
.slider-pagination {
  margin: 0;
  display: flex;
  align-items: center;
  gap: 0.938rem;
  flex-wrap: wrap;
}
.slider-pagination:empty {
  display: none;
}
.slider-pagination .swiper-pagination-bullet {
  width: 0.75rem;
  aspect-ratio: 1;
  background-color: #353535;
  flex: none;
  transition: background-color 0.4s;
  cursor: pointer;
  -webkit-user-select: none;
  user-select: none;
}
.slider-pagination .swiper-pagination-bullet:hover,
.slider-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
  background-color: var(--section-color, #2bc2c4);
}
.range-slider-wrapp .input {
  height: 2.75rem;
}
.range-slider {
  flex: auto;
  min-width: 0;
  height: 0.25rem;
  background-color: rgba(255, 255, 255, 0.06);
  border-radius: 0.125rem;
}
.range-slider .range-slider__thumb {
  width: 1rem;
  height: 1rem;
  box-shadow: 0px 0.25rem 0.25rem 0px rgba(0, 0, 0, 0.25);
  border-radius: 50%;
  background-color: #fff;
}
.range-slider .range-slider__range {
  border-radius: inherit;
  background-color: #2bc2c4;
  pointer-events: none;
}
.range-slider-disabled-min [data-lower] {
  width: 0;
  pointer-events: none;
}
.range-slider-body {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  padding-top: 0.375rem;
}
.range-slider-min-max {
  display: flex;
  gap: 1rem;
  justify-content: space-between;
  font-size: 0.938rem;
  font-weight: 500;
}
.modal {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 666666;
}
.modal:not(.active) {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
.modal.open,
.modal.close {
  transition:
    opacity 0.4s,
    visibility 0.4s;
}
.modal.open .modal-body,
.modal.close .modal-body {
  transition: transform 0.4s;
}
.modal.active .modal-body {
  transform: scale(1);
}
.modal-wrapp {
  width: 100%;
  height: 100%;
  display: flex;
  background: rgba(0, 0, 0, 0.8);
  padding: var(--container-padding);
  overflow: hidden;
  overflow-y: scroll;
  outline: none;
}
.modal-body {
  width: 30rem;
  max-width: 100%;
  padding: 0.75rem;
  margin: auto;
  position: relative;
  transform: scale(0.8);
}
.modal-frame {
  color: #2bc2c4;
  position: absolute;
  inset: 0;
  border: solid 0.125rem;
}
.modal-frame i {
  position: absolute;
  width: 2.25rem;
  height: 2.25rem;
  background: currentColor;
  clip-path: polygon(
    0 0,
    0.375rem 0.375rem,
    0.375rem calc(100% - 0.375rem),
    calc(100% - 0.375rem) calc(100% - 0.375rem),
    100% 100%,
    0 100%
  );
}
.modal-frame i:nth-child(1) {
  left: -0.125rem;
  top: -0.125rem;
  transform: rotate(90deg);
}
.modal-frame i:nth-child(2) {
  right: -0.125rem;
  top: -0.125rem;
  transform: rotate(180deg);
}
.modal-frame i:nth-child(3) {
  right: -0.125rem;
  bottom: -0.125rem;
  transform: rotate(-90deg);
}
.modal-frame i:nth-child(4) {
  left: -0.125rem;
  bottom: -0.125rem;
}
.modal-content {
  position: relative;
  z-index: 1;
  padding: 2.5rem 1rem 1rem;
  background-color: #12171c;
}
.modal-close-btn {
  position: absolute;
  right: 0.75rem;
  top: 0.75rem;
  display: flex;
  transition: color 0.4s;
}
.modal-close-btn:hover {
  color: #2bc2c4;
}
.modal-title {
  margin-bottom: 2rem;
}
@media (width < 1024px) {
  .modal-title {
    margin-bottom: 1.5rem;
  }
}
.modal-title:last-child {
  margin-bottom: 0;
}
.modal-title + .modal-desc {
  margin-top: -1.25rem;
}
.modal-desc {
  font-size: 0.938rem;
  margin-bottom: 2rem;
}
@media (width < 1024px) {
  .modal-desc {
    margin-bottom: 1.5rem;
  }
}
.modal-desc:last-child {
  margin-bottom: 0;
}
.breadcrumbs {
  display: flex;
  flex-wrap: wrap;
  font-size: 0.75rem;
  color: rgba(255, 255, 255, 0.5);
  margin-bottom: 2rem;
}
@media (width < 1024px) {
  .breadcrumbs {
    margin: 0 calc(-1 * var(--container-padding)) 1.5rem;
    padding: 0 var(--container-padding);
    overflow-x: auto;
    -ms-overflow-style: none;
    scrollbar-width: none;
    white-space: nowrap;
    flex-wrap: nowrap;
  }
  .breadcrumbs::-webkit-scrollbar {
    display: none;
  }
}
.breadcrumbs:last-child {
  margin-bottom: 0;
}
.breadcrumbs li:not(:last-child) {
  padding-right: 0.438rem;
  margin-right: 0.438rem;
  position: relative;
}
.breadcrumbs li:not(:last-child):after {
  content: '•';
  position: absolute;
  left: 100%;
  top: 0;
  transform: translateX(-50%);
}
.breadcrumbs a {
  color: #fff;
  transition: color 0.4s;
}
.breadcrumbs a:hover {
  color: #2bc2c4;
}
.pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 2.5rem;
  margin-top: 2.75rem;
}
@media (width < 1024px) {
  .pagination {
    justify-content: space-between;
    margin-top: 2rem;
    gap: 1rem;
  }
}
.pagination-btn {
  width: 2.75rem;
  aspect-ratio: 1;
  padding: 0;
}
.pagination-btn.disabled {
  color: rgba(255, 255, 255, 0.5);
  pointer-events: none;
}
.pagination-btn.disabled:before {
  background-color: currentColor;
}
.pagination-links {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  font-size: 1.125rem;
  --gradient-start: #2bc2c4;
  --gradient-end: #80e4e5;
  background: linear-gradient(to right, var(--gradient-start), var(--gradient-end));
  -webkit-background-clip: text;
  color: transparent;
}
@media (width < 1024px) {
  .pagination-links:before {
    content: attr(data-title);
  }
}
.pagination-links a {
  color: inherit;
  transition: color 0.4s;
  display: flex;
  margin: -0.5rem;
  padding: 0.5rem;
}
.pagination-links a:hover {
  color: #fff;
}
@media (width < 1024px) {
  .pagination-links a {
    display: none;
  }
}
.pagination-links a.active {
  color: #fff;
  pointer-events: none;
}
@media (width < 1024px) {
  .pagination-links span {
    display: none;
  }
}
.select {
  position: relative;
  display: flex;
  flex-direction: column;
}
.select.active {
  z-index: 66;
}
.select.active .select-toggle {
  border-color: rgba(255, 255, 255, 0.4);
}
.select.active .select-options {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition:
    opacity 0.4s,
    visibility 0.4s;
}
.select-multiple .select-toggle {
  height: auto;
  min-height: var(--input-height);
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}
.select-multiple .select-title {
  white-space: normal;
  flex-wrap: wrap;
  gap: 0.25rem;
}
.select-multiple .select-title > span {
  white-space: normal;
}
.select-tag {
  display: flex;
  align-items: center;
  gap: 0.375rem;
  padding: 0.375rem 0.625rem;
  background-color: rgba(255, 255, 255, 0.06);
  font-size: 0.625rem;
  font-weight: 500;
}
.select-tag svg {
  cursor: pointer;
  --size: 0.75rem;
}
.select-toggle {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.select-toggle:hover {
  border-color: rgba(255, 255, 255, 0.4);
}
.select-toggle-arrow {
  color: #2bc2c4;
  margin-left: auto;
  transition: transform 0.4s;
  --size: 0.75rem;
}
.select-title {
  flex: auto;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.select-title:has(span) {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.select-title > span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.select-title[data-placeholder]:empty:before {
  content: attr(data-placeholder);
  color: rgba(255, 255, 255, 0.4);
  overflow: hidden;
  text-overflow: ellipsis;
}
.tippy-box[data-theme='unset'] {
  all: unset;
}
.tippy-box[data-theme='unset'] .tippy-content {
  padding: 0;
}
.tippy-tooltip {
  display: none;
}
.tippy-box .select-options {
  display: block;
}
.tippy-box .tippy-tooltip {
  display: flex;
}
.select-options {
  border: solid 1px #1f2024;
  background-color: #16161a;
  display: none;
  font-size: 1rem;
  padding: 0.5rem;
  min-width: var(--select-width);
}
.select-multiple-options .select-options-list {
  gap: 0;
}
.select-options-list {
  overflow: hidden auto;
  max-height: 21.25rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.select-option {
  width: 100%;
  padding: 0 0.5rem;
  align-items: center;
  transition: color 0.4s;
  color: inherit;
  overflow: hidden;
  text-overflow: ellipsis;
  display: flex;
  gap: 0.5rem;
}
.select-option > span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.select-option .icon {
  opacity: 0;
  transition: opacity 0.4s;
  color: #2bc2c4;
  margin-left: auto;
}
.select-option:hover {
  color: #2bc2c4;
}
.select-option.active:hover {
  color: #fff;
}
.select-option.active .icon {
  opacity: 1;
}
.tippy-info {
  flex: none;
  width: 1rem;
  aspect-ratio: 1;
  border-radius: 50%;
  background-color: rgba(255, 255, 255, 0.06);
  font-size: 0.563rem;
  display: grid;
  place-items: center;
  font-weight: 500;
  font-style: unset;
  cursor: pointer;
  -webkit-user-select: none;
  user-select: none;
}
.tippy-box[data-theme='tooltip'] {
  all: unset;
}
.tippy-box[data-theme='tooltip'] .tippy-content {
  padding: 0.938rem;
  font-size: 0.75rem;
  background: #16161a;
  font-weight: 500;
  border: solid 1px #293441;
}
.tippy-box[data-theme~='tooltip'][data-placement^='top'] > .tippy-arrow::before {
  border-top-color: #293441;
}
.tippy-box[data-theme~='tooltip'][data-placement^='bottom'] > .tippy-arrow::before {
  border-bottom-color: #293441;
}
.tippy-box[data-theme~='tooltip'][data-placement^='left'] > .tippy-arrow::before {
  border-left-color: #293441;
}
.tippy-box[data-theme~='tooltip'][data-placement^='right'] > .tippy-arrow::before {
  border-right-color: #293441;
}
.file-input {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
  border-color: rgba(255, 255, 255, 0.4);
  background-color: rgba(255, 255, 255, 0.04);
  transition: color 0.4s;
}
.file-input:hover {
  color: #2bc2c4;
}
.file-input svg {
  --size: 1.25rem;
}
.file-input input {
  position: absolute;
  left: 0;
  top: 0;
  border-radius: inherit;
  cursor: pointer;
  opacity: 0;
  font-size: 0;
  width: 100%;
  height: 100%;
  z-index: 6;
  -webkit-user-select: none;
  user-select: none;
}
.file-input input::-webkit-file-upload-button,
.file-input input::file-selector-button {
  display: none;
  appearance: none;
}
.file-input-title {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.file-input-title:empty:before {
  content: attr(data-title);
}
.content-text {
  display: flow-root;
}
.content-text h1,
.content-text h2,
.content-text h3,
.content-text h4,
.content-text h5,
.content-text h6 {
  margin: calc(2 * var(--content-gap) + 0.5rem) 0 var(--content-gap);
}
.content-text h1:first-child,
.content-text h2:first-child,
.content-text h3:first-child,
.content-text h4:first-child,
.content-text h5:first-child,
.content-text h6:first-child {
  margin-top: 0;
}
.content-text h1:last-child,
.content-text h2:last-child,
.content-text h3:last-child,
.content-text h4:last-child,
.content-text h5:last-child,
.content-text h6:last-child {
  margin-bottom: 0;
}
.content-text h1 {
  font-weight: 900;
  text-transform: uppercase;
  font-size: 2.375rem;
  line-height: 1.28;
}
@media (width < 1024px) {
  .content-text h1 {
    font-size: 2rem;
  }
}
.content-text h2 {
  font-size: 1.5rem;
  font-weight: 900;
  text-transform: uppercase;
  line-height: 1.33;
}
@media (width < 1024px) {
  .content-text h2 {
    font-size: 1.25rem;
  }
}
.content-text h3 {
  font-size: 1.5rem;
  font-weight: 900;
  text-transform: uppercase;
  line-height: 1.33;
}
@media (width < 1024px) {
  .content-text h3 {
    font-size: 1.125rem;
  }
}
.content-text h4,
.content-text h5,
.content-text h6 {
  font-size: inherit;
  font-weight: 900;
  text-transform: uppercase;
}
.content-text b,
.content-text strong {
  font-weight: 700;
}
.content-text p {
  margin-bottom: var(--content-gap);
}
.content-text p:last-child {
  margin-bottom: 0;
}
.content-text a:not(.btn) {
  transition: color 0.4s;
}
.content-text a:not(.btn):hover {
  color: #80e4e5;
}
.content-text ol {
  list-style: none;
  counter-reset: counter;
  margin-bottom: var(--content-gap);
  display: flow-root;
}
.content-text ol:last-child {
  margin-bottom: 0;
}
.content-text ol li {
  margin-bottom: calc(var(--content-gap) / 2);
  padding-left: 1.5rem;
  position: relative;
}
.content-text ol li:last-child {
  margin-bottom: 0;
}
.content-text ol li:before {
  content: counter(counter) '.';
  position: absolute;
  flex: none;
  left: 0;
  top: 0;
  counter-increment: counter;
  width: 1.5rem;
  text-align: center;
}
.content-text ul {
  list-style: none;
  margin-bottom: var(--content-gap);
  display: flow-root;
}
.content-text ul:last-child {
  margin-bottom: 0;
}
.content-text ul li {
  display: flex;
  margin-bottom: calc(var(--content-gap) / 2);
  padding-left: 1.5rem;
  position: relative;
}
.content-text ul li:last-child {
  margin-bottom: 0;
}
.content-text ul li:before {
  content: '';
  position: absolute;
  width: 0.25rem;
  height: 0.25rem;
  border-radius: 50%;
  background-color: currentColor;
  left: 0.5rem;
  top: calc(0.5lh - 0.125rem);
}
.content-text figure {
  margin: calc(1.5 * var(--content-gap)) 0;
}
.content-text figure:first-child {
  margin-top: 0;
}
.content-text figure:last-child {
  margin-bottom: 0;
}
.content-text img {
  display: block;
  min-height: 15rem;
  object-fit: cover;
}
.content-text blockquote {
  margin: calc(1.5 * var(--content-gap)) 0;
  padding-left: 1rem;
  border-left: solid 1px #2bc2c4;
  font-style: italic;
}
.content-text blockquote:first-child {
  margin-top: 0;
}
.content-text blockquote:last-child {
  margin-bottom: 0;
}
.content-text q {
  display: block;
  padding-left: 1rem;
  margin-bottom: var(--content-gap);
  border-left: solid 1px #2bc2c4;
  font-style: italic;
}
.content-text q:last-child {
  margin-bottom: 0;
}
.content-text table {
  margin: var(--content-gap) 0;
  width: 100%;
  table-layout: fixed;
  font-size: 0.875rem;
}
.content-text table:first-child {
  margin-top: 0;
}
.content-text table:last-child {
  margin-bottom: 0;
}
.content-text table td {
  border: solid 0.125rem #293441;
  padding: 0.5rem 0.75rem;
}
.header {
  position: fixed;
  inset: 0 0 auto;
  z-index: 600;
  transition:
    background-color 0.4s,
    transform 0.4s;
}
.header > .container {
  display: flex;
  align-items: center;
  height: var(--header-height);
  gap: 1.75rem;
  position: relative;
  z-index: 1;
}
@media (width < 768px) {
  .header > .container {
    gap: 1rem;
  }
}
.header:before {
  content: '';
  position: absolute;
  inset: auto 0 0;
  border-bottom: solid 1px rgba(255, 255, 255, 0.14);
  pointer-events: none;
  transition: opacity 0.4s;
}
.header .logo {
  margin-right: auto;
}
.header.hide:not(:hover) {
  transform: translateY(-100%);
}
.header.fixed {
  background-color: #000;
}
.logo {
  display: flex;
  max-width: 9.625rem;
}
.header-links {
  display: flex;
  align-items: center;
  gap: 1.75rem;
  white-space: nowrap;
}
@media (width < 768px) {
  .header-links {
    gap: 1rem;
  }
}
@media (width < 480px) {
  .header-links {
    gap: 0.5rem;
  }
}
.header-link {
  font-size: 0.75rem;
  font-weight: 700;
  color: inherit;
  transition: color 0.4s;
  text-transform: uppercase;
  margin: -0.25rem;
  padding: 0.25rem;
}
.header-link:hover {
  color: #80e4e5;
}
@media (width < 768px) {
  .header-link {
    font-size: 0.625rem;
  }
}
@media (width < 768px) {
  .header-btn {
    font-size: 0.625rem;
    --height: 2rem;
  }
}
.home-hero {
  min-height: 50rem;
  margin-top: calc(-1 * var(--header-height));
  padding: calc(var(--header-height) + 1.5rem) 5rem;
  position: relative;
}
@media (width < 1024px) {
  .home-hero {
    padding: var(--header-height) 0 1.5rem;
    min-height: 0;
  }
}
.home-hero .container {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
}
.home-hero-video {
  position: absolute;
  inset: 0;
  -webkit-mask-image: linear-gradient(to bottom, black calc(100% - 18.625rem), transparent);
  mask-image: linear-gradient(to bottom, black calc(100% - 18.625rem), transparent);
}
.home-hero-title {
  font-size: 0;
  display: flex;
  justify-content: center;
}
@media (width < 768px) {
  .home-hero-title {
    margin-top: -1.25rem;
  }
}
.home-hero-title img {
  width: 48.875rem;
  height: 8.75rem;
}
.home-hero-img {
  display: flex;
  width: 28.688rem;
  margin: -5.75rem auto -10rem;
}
@media (width < 1024px) {
  .home-hero-img {
    margin: -5.75rem 0 -11.25rem auto;
  }
}
@media (width < 480px) {
  .home-hero-img {
    width: 20rem;
    margin: -4.5rem -1.5rem -8.75rem auto;
  }
}
.home-hero-body {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: flex-end;
  gap: 4rem;
  justify-content: space-between;
}
@media (width < 1024px) {
  .home-hero-body {
    flex-direction: column;
    gap: 1.5rem;
    align-items: unset;
  }
}
.home-hero-desc {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  text-transform: uppercase;
}
@media (width < 1024px) {
  .home-hero-desc {
    gap: 0.25rem;
  }
}
.home-hero-desc-for {
  -webkit-text-stroke: 0.125rem #fff;
  color: transparent;
  font-size: 1.75rem;
  font-weight: 900;
  line-height: 1.3;
}
@media (width < 1024px) {
  .home-hero-desc-for {
    font-size: 1.375rem;
  }
}
.home-hero-info {
  display: flex;
  max-width: 26.563rem;
  align-items: center;
  gap: 1.25rem;
  min-height: 3.75rem;
}
.home-hero-info img {
  flex: none;
  width: 3.188rem;
}
.section {
  --section-color: #2bc2c4;
  --padding: 4.5rem;
  padding: var(--padding) 0;
}
@media (width < 1024px) {
  .section {
    --padding: 2rem;
  }
}
.home-illustration {
  display: flex;
  padding: 5rem 1rem 3.75rem;
  position: relative;
  z-index: 1;
}
@media (width < 768px) {
  .home-illustration {
    padding: 1.5rem 0.5rem;
  }
}
.home-illustration-body {
  width: min(102.5rem, 100%);
  position: relative;
  margin: 0 auto;
  display: flex;
}
@media (width < 768px) {
  .home-illustration-body {
    padding: 3rem 0;
  }
}
.home-illustration-main {
  width: 53.5714%;
  padding: 0.875rem;
  aspect-ratio: 900/615;
  z-index: 1;
  margin: auto;
}
@media (width < 768px) {
  .home-illustration-main {
    width: 80%;
  }
}
.home-illustration-img {
  width: 20.7317%;
  aspect-ratio: 340/237;
  padding: 0.5rem;
  position: absolute;
}
@media (width < 768px) {
  .home-illustration-img {
    width: 34%;
  }
}
.home-illustration-img-left-top {
  top: 6.5%;
  left: 0;
}
@media (width < 768px) {
  .home-illustration-img-left-top {
    top: 0;
  }
}
.home-illustration-img-left-bottom {
  bottom: 7.5%;
  left: 5.7926%;
}
@media (width < 768px) {
  .home-illustration-img-left-bottom {
    bottom: 0;
    left: 0;
  }
}
.home-illustration-img-right-top {
  top: 6.5%;
  right: 0;
}
@media (width < 768px) {
  .home-illustration-img-right-top {
    top: 0;
  }
}
.home-illustration-img-right-bottom {
  bottom: 7.5%;
  right: 5.7926%;
}
@media (width < 768px) {
  .home-illustration-img-right-bottom {
    bottom: 0;
    right: 0;
  }
}
.simple {
  position: relative;
  --section-color: #e7a26e;
}
.simple .container {
  position: relative;
  z-index: 1;
}
.simple .section-head {
  text-align: center;
  align-items: center;
}
@media (width >= 1024px) {
  .simple {
    padding-top: 3.75rem;
  }
}
.simple-img {
  position: absolute;
  width: 105.25rem;
  top: -23.125rem;
  left: calc(50% - 52.625rem);
  aspect-ratio: 1684/1050;
  pointer-events: none;
  z-index: -1;
}
@media (width < 1024px) {
  .simple-img {
    transform: scale(0.6);
  }
}
@media (width < 768px) {
  .simple-img {
    transform: scale(0.4);
  }
}
.section-head {
  margin-bottom: 2rem;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
@media (width < 1024px) {
  .section-head {
    margin-bottom: 1.5rem;
    gap: 0.5rem;
  }
}
.section-head:last-child {
  margin-bottom: 0;
}
.section-label {
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--section-color, #2bc2c4);
}
.section-desc {
  margin-top: 1rem;
}
@media (width < 1024px) {
  .section-desc {
    margin-top: 0.5rem;
  }
}
.section-desc:first-child {
  margin-top: 0;
}
.section-btn {
  width: fit-content;
  margin-top: 1.75rem;
  --color: var(--section-color, #2bc2c4);
}
@media (width < 1024px) {
  .section-btn {
    margin-top: 0.75rem;
  }
}
.section-btn:first-child {
  margin-top: 0;
}
.simple-list {
  display: grid;
  gap: 1.25rem;
}
@media (width >= 1024px) {
  .simple-list {
    grid-template-columns: 1fr 1fr;
  }
}
.simple-item {
  min-width: 0;
  aspect-ratio: 670/280;
  padding: 2.75rem 2rem 3.5rem;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  color: inherit;
}
.simple-item-frame {
  position: absolute;
  inset: 0;
  padding: 0.75rem;
}
.simple-item-body {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 0.75rem;
  position: relative;
  z-index: 1;
}
@media (width < 768px) {
  .simple-item-body {
    flex-direction: column;
    align-items: flex-start;
  }
}
.simple-item-content {
  max-width: 23.375rem;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
.simple-item-btn {
  font-size: 0.688rem;
  --color: var(--section-color);
}
.text2canvas {
  --section-color: #d45d3f;
}
.text2canvas .container {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 2rem;
}
@media (width < 1024px) {
  .text2canvas .container {
    flex-direction: column-reverse;
    align-items: unset;
  }
}
.text2canvas-gallery {
  position: relative;
  z-index: 1;
}
@media (width >= 1024px) {
  .text2canvas-gallery {
    width: 41.75rem;
  }
}
.text2canvas-gallery .slider-pagination {
  position: relative;
  z-index: 2;
  margin: -2.5rem 29.125rem 0 1.5rem;
  width: fit-content;
}
@media (width < 1024px) {
  .text2canvas-gallery .slider-pagination {
    margin: 1.5rem 0 0;
  }
}
.text2canvas-slider {
  width: auto;
  margin: 0 -1rem;
  padding: 0 1rem;
  -webkit-mask-image: linear-gradient(to right, transparent 0, black 1rem, black calc(100% - 1rem), transparent);
  mask-image: linear-gradient(to right, transparent 0, black 1rem, black calc(100% - 1rem), transparent);
}
.text2canvas-slide {
  display: flex;
  flex-direction: column;
}
.text2canvas-slide-frame {
  aspect-ratio: 1;
  padding: 1rem;
}
.text2canvas-slide-content {
  width: 27.625rem;
  min-height: 7.75rem;
  padding: 2rem 1.75rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
  z-index: 1;
  margin: -3.875rem 0 0 auto;
}
@media (width < 1024px) {
  .text2canvas-slide-content {
    max-width: calc(100% - 1.5rem);
  }
}
.text2canvas-slide-content-frame {
  position: absolute;
  inset: 0;
}
.text2canvas-slide-desc {
  position: relative;
  z-index: 1;
  font-size: 0.813rem;
  color: #919191;
}
.text2canvas-body {
  display: flex;
  flex-direction: column;
}
@media (width >= 1024px) {
  .text2canvas-body {
    width: 34.375rem;
    padding: 4.5rem 0;
  }
}
@media (width >= 1024px) {
  .text2canvas-body .section-head {
    max-width: 28.875rem;
  }
}
.text2canvas-video {
  width: 70.625rem;
  height: 0;
  display: flex;
  flex-direction: column;
  pointer-events: none;
  z-index: -1;
  align-self: center;
  margin-top: -7.5rem;
  position: relative;
}
@media (width < 1024px) {
  .text2canvas-video {
    height: 12.5rem;
  }
}
.gallery-marquee {
  --mask-size: 17.25rem;
  --gap: 1.25rem;
  -webkit-mask-image: linear-gradient(
    to right,
    transparent 0,
    black var(--mask-size),
    black calc(100% - var(--mask-size)),
    transparent
  );
  mask-image: linear-gradient(
    to right,
    transparent 0,
    black var(--mask-size),
    black calc(100% - var(--mask-size)),
    transparent
  );
}
@media (width < 1024px) {
  .gallery-marquee {
    --mask-size: 2rem;
  }
}
.gallery-marquee .marquee-group {
  align-items: flex-start;
}
.gallery-marquee-slide {
  width: 20.313rem;
  aspect-ratio: 325/226;
  padding: 0.5rem;
}
.gallery-marquee-slide:nth-child(even) {
  margin-top: 3.125rem;
}
.paintbrush {
  --section-color: #5743b4;
  overflow: hidden;
}
.paintbrush .section-head {
  text-align: center;
  align-items: center;
}
.paintbrush .slider-pagination {
  margin-top: 2rem;
  justify-content: center;
}
@media (width < 1024px) {
  .paintbrush .slider-pagination {
    margin-top: 1.5rem;
  }
}
.paintbrush-slider {
  --offset: 1.25rem;
  width: auto;
  margin: 0 calc(-1 * var(--offset));
  padding: 0 var(--offset);
  -webkit-mask-image: linear-gradient(
    to right,
    transparent 0,
    black var(--offset),
    black calc(100% - var(--offset)),
    transparent
  );
  mask-image: linear-gradient(
    to right,
    transparent 0,
    black var(--offset),
    black calc(100% - var(--offset)),
    transparent
  );
}
@media (width < 1024px) {
  .paintbrush-slider {
    overflow: visible;
    --offset: var(--container-padding);
  }
}
.paintbrush-slide {
  aspect-ratio: 325/485;
  position: relative;
  display: flex;
  flex-direction: column;
  padding: 1.875rem 3rem;
  justify-content: flex-end;
  color: inherit;
  transition: color 0.4s;
}
@media (width < 1024px) {
  .paintbrush-slide {
    width: 20.313rem;
  }
}
.paintbrush-slide:hover {
  color: #2bc2c4;
}
.paintbrush-slide-frame {
  position: absolute;
  inset: 0;
  padding: 0.688rem 0.625rem;
}
.paintbrush-slide-frame .frame-mask:after {
  content: '';
  inset: calc(100% - 7.5rem) 0 0;
  position: absolute;
  z-index: 1;
  background: linear-gradient(to top, #000, rgba(0, 0, 0, 0));
}
.paintbrush-slide-title {
  position: relative;
  z-index: 1;
  max-width: 14.75rem;
}
.packs {
  position: relative;
}
.packs .section-head {
  text-align: center;
  align-items: center;
}
.packs-video {
  height: 12.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: -1;
  pointer-events: none;
  position: relative;
}
.packs-video video {
  height: 59rem;
}
.packs-img {
  position: absolute;
  width: 105rem;
  top: 20rem;
  left: calc(50% - 52.5rem);
  aspect-ratio: 1680/945;
  pointer-events: none;
  z-index: -1;
}
@media (width < 1024px) {
  .packs-img {
    transform: scale(0.6);
  }
}
@media (width < 768px) {
  .packs-img {
    transform: scale(0.4);
  }
}
.packs-list {
  display: grid;
  grid-template-columns: repeat(var(--columns, 5), 1fr);
  grid-template-rows: auto 1fr;
  gap: 1.25rem;
}
@media (width < 1024px) {
  .packs-list {
    grid-template-columns: repeat(auto-fit, 16rem);
    justify-content: center;
  }
}
.packs-item {
  padding: 1.875rem 1.875rem 1.875rem 2.5rem;
  position: relative;
  min-height: 31.25rem;
  display: grid;
  grid-row: span 2;
  grid-template-rows: subgrid;
}
.packs-item-frame {
  position: absolute;
  inset: 0;
}
.packs-item-body {
  flex: auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  position: relative;
  z-index: 1;
}
.packs-item-desc {
  margin-top: -0.25rem;
  font-size: 0.813rem;
  color: #919191;
}
.packs-item-price {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 0.5rem;
  white-space: nowrap;
  margin-top: auto;
  padding-top: 0.75rem;
}
.packs-item-pixels {
  font-size: 0.938rem;
  font-weight: 800;
  line-height: 1.2;
}
.packs-item-pixels span {
  font-size: 1.25rem;
}
.packs-item-cost {
  display: flex;
  justify-content: flex-end;
  font-size: 0.75rem;
  font-weight: 800;
  color: #919191;
  line-height: 1.2;
}
.packs-item-foot {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  position: relative;
  z-index: 1;
  padding-top: 0.75rem;
}
.packs-item-get {
  font-size: 0.75rem;
  margin-top: auto;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
.packs-item-get-title {
  font-weight: 800;
}
.packs-item-get-item {
  padding-left: 1.375rem;
  position: relative;
}
.packs-item-get-item svg {
  color: #2bc2c4;
  position: absolute;
  left: 0;
  top: calc(0.5lh - 0.5 * var(--size));
}
.packs-item-btn {
  margin: 0 auto 0 1.25rem;
}
.packs-item-custom {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
.packs-item-custom .input-block {
  width: 6.75rem;
}
.packs-item-custom .input {
  --height: 2.75rem;
  --bg: #000;
  padding: 0 0.875rem;
  font-size: 0.875rem;
  font-weight: 400;
}
.packs-item-custom .input:not(:focus) {
  border-color: #1e2730;
}
.packs-item-range {
  height: 1rem;
  background-color: #000;
  border-radius: 0;
}
.packs-item-range .range-slider__thumb {
  background-color: #2bc2c4;
  box-shadow: none;
  border-radius: 0;
}
.packs-item-best .packs-item-title {
  color: #2bc2c4;
}
.packs-item-label {
  font-size: 0.625rem;
  line-height: 0.75rem;
  font-weight: 900;
  text-transform: uppercase;
  color: #2bc2c4;
  margin: -0.75rem 0 -1rem;
}
.accordion {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}
.accordion-item {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
}
.accordion-item:before {
  content: '';
  position: absolute;
  inset: 0;
  background: #293441;
  z-index: -1;
  pointer-events: none;
  clip-path: polygon(
    0 0.5rem,
    0.5rem 0,
    calc(100% - 0.5rem) 0,
    100% 0.5rem,
    100% calc(100% - 0.5rem),
    calc(100% - 0.5rem) 100%,
    0.5rem 100%,
    0 calc(100% - 0.5rem),
    0 0.5rem,
    0.125rem calc(0.5rem + 0.83px),
    0.125rem calc(100% - 0.5rem - 0.83px),
    calc(0.5rem + 0.83px) calc(100% - 0.125rem),
    calc(100% - 0.5rem - 0.83px) calc(100% - 0.125rem),
    calc(100% - 0.125rem) calc(100% - 0.5rem - 0.83px),
    calc(100% - 0.125rem) calc(0.5rem + 0.83px),
    calc(100% - 0.5rem - 0.83px) 0.125rem,
    calc(0.5rem + 0.83px) 0.125rem,
    0.125rem calc(0.5rem + 0.83px)
  );
}
.accordion-item.active .accordion-item-main {
  grid-template-rows: 1fr;
}
.accordion-item.active .accordion-item-toggle > i svg {
  transform: rotate(-180deg);
}
.accordion-item-toggle {
  padding: 1rem 1.25rem 1rem 1.875rem;
  display: flex;
  gap: 1.25rem;
  align-items: center;
  justify-content: space-between;
  font-size: 1.188rem;
  font-weight: 800;
  transition: color 0.4s;
}
@media (width < 1024px) {
  .accordion-item-toggle {
    padding: 1rem;
  }
}
.accordion-item-toggle:hover {
  color: #2bc2c4;
}
.accordion-item-toggle > i {
  width: 2.75rem;
  aspect-ratio: 1;
  padding: 0;
  pointer-events: none;
}
.accordion-item-toggle > i svg {
  color: #2bc2c4;
  transition: transform 0.4s;
}
.accordion-item-main {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 0.4s;
}
.accordion-body {
  overflow: hidden;
}
.accordion-item-content {
  padding: 0 1.25rem 1.5rem 1.875rem;
  max-width: 52.625rem;
}
@media (width < 1024px) {
  .accordion-item-content {
    padding: 0 1rem 1.5rem;
  }
}
.faq {
  --section-color: #5d6a79;
}
.faq .section-head {
  align-items: center;
  text-align: center;
}
.faq-body {
  max-width: 58.875rem;
  margin: 0 auto;
}
.reviews {
  position: relative;
}
.reviews .section-head {
  text-align: center;
  align-items: center;
}
.reviews-video {
  --scale: 1;
  height: calc(var(--scale) * 59rem);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: -1;
  pointer-events: none;
  position: relative;
  margin: calc(var(--scale) * -25rem) 0 calc(var(--scale) * -10rem);
}
@media (width < 1024px) {
  .reviews-video {
    --scale: 0.6;
  }
}
.reviews-video:after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(to bottom, #000, rgba(0, 0, 0, 0));
}
.reviews-video video {
  height: 100%;
}
.reviews-advantages {
  display: flex;
  justify-content: space-around;
  margin-bottom: 4.5rem;
  gap: 1.5rem;
}
@media (width < 1024px) {
  .reviews-advantages {
    flex-direction: column;
    margin-bottom: 2.5rem;
  }
}
.reviews-advantage {
  display: flex;
  flex-direction: column;
  gap: 0.375rem;
}
.reviews-advantage-title {
  font-weight: 700;
  text-transform: uppercase;
  color: #2bc2c4;
  font-size: 0.938rem;
}
.reviews-advantage-desc {
  font-size: 1.938rem;
  font-weight: 800;
  line-height: 1.2;
  text-transform: uppercase;
}
.reviews-sliders {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  --mask-size: 17.25rem;
  -webkit-mask-image: linear-gradient(
    to right,
    transparent 0,
    black var(--mask-size),
    black calc(100% - var(--mask-size)),
    transparent
  );
  mask-image: linear-gradient(
    to right,
    transparent 0,
    black var(--mask-size),
    black calc(100% - var(--mask-size)),
    transparent
  );
}
@media (width < 1024px) {
  .reviews-sliders {
    --mask-size: 2rem;
  }
}
.reviews-slider {
  -gap: 1.25rem;
}
.reviews-slide {
  width: 27.5rem;
  min-height: 19.125rem;
  padding: 2.5rem 2rem 3rem 2.75rem;
  position: relative;
  display: flex;
  flex-direction: column;
}
@media (width < 1024px) {
  .reviews-slide {
    width: 24.25rem;
  }
}
.reviews-slide-frame {
  position: absolute;
  inset: 0;
}
.reviews-slide-body {
  flex: auto;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  position: relative;
  z-index: 1;
}
.reviews-slide-stars {
  display: flex;
  align-items: center;
  gap: 0.125rem;
  color: #2bc2c4;
  align-self: flex-end;
}
.reviews-slide-text {
  font-size: 0.938rem;
}
.reviews-slide-user {
  margin-top: auto;
  font-size: 0.938rem;
}
.reviews-slide-user-name {
  font-weight: 700;
}
.reviews-slide-user-desc {
  color: #919191;
}
.footer {
  margin-top: auto;
  padding: 7.5rem 0 6rem;
  position: relative;
  overflow: hidden;
  min-height: 45.625rem;
  display: flex;
  flex-direction: column;
}
.footer .container {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  flex: auto;
  gap: 8.25rem;
}
@media (width < 1024px) {
  .footer .container {
    gap: 4.5rem;
  }
}
@media (width < 1024px) {
  .footer {
    padding: 3.75rem 0 3rem;
    min-height: 0;
  }
}
.footer-img {
  position: absolute;
  inset: 0;
}
.footer-grid {
  display: flex;
  gap: 2.5rem;
  justify-content: space-between;
}
@media (width < 1024px) {
  .footer-grid {
    flex-direction: column;
  }
}
.footer-cell {
  display: flex;
  flex-direction: column;
  gap: 5.25rem;
  align-items: flex-start;
}
@media (width < 1024px) {
  .footer-cell {
    gap: 2.5rem;
  }
}
.footer-cell-right {
  flex: none;
}
@media (width >= 1024px) {
  .footer-cell-right {
    width: 51.5rem;
  }
}
.footer-nav {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 2rem;
  width: 100%;
}
@media (width < 768px) {
  .footer-nav {
    grid-template-columns: 1fr 1fr;
  }
}
.footer-nav-item {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}
@media (width < 768px) {
  .footer-nav-item:nth-child(2) {
    order: 1;
    grid-column: span 2;
  }
}
.footer-nav-title {
  font-size: 0.813rem;
  font-weight: 800;
  color: #2bc2c4;
  text-transform: uppercase;
}
.footer-menu {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  font-size: 0.875rem;
  font-weight: 600;
}
.footer-menu a {
  display: flex;
  margin: -0.25rem;
  padding: 0.25rem;
  color: inherit;
  transition: color 0.4s;
}
.footer-menu a:hover {
  color: #2bc2c4;
}
.footer-logos {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 1rem 2.5rem;
}
.footer-logo {
  display: flex;
}
.footer-logo img {
  height: 1.75rem;
  object-fit: contain;
}
.footer-foot {
  margin-top: auto;
}
@media (width < 1024px) {
  .footer-foot {
    gap: 1.5rem;
  }
  .footer-foot .footer-left {
    order: 1;
  }
}
.footer-copyright {
  font-size: 0.875rem;
  line-height: 2;
  margin: auto 0;
}
.footer-info {
  font-size: 0.875rem;
  line-height: 2;
}
.cookies {
  position: fixed;
  inset: auto 0 0;
  z-index: 66;
  pointer-events: none;
  padding: 0 var(--container-padding) var(--container-padding);
}
@media (width < 1024px) {
  .cookies {
    padding: 0;
  }
}
.cookies.hide .cookies-main {
  opacity: 0;
  transform: translateY(100%);
  visibility: hidden;
  pointer-events: none;
  transition:
    transform 0.4s,
    opacity 0.4s,
    visibility 0.4s;
}
.cookies-main {
  width: min(75rem, 100%);
  background: linear-gradient(to right, #2bc2c4, #80e4e5);
  color: #000;
  padding: 1.25rem 2rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  pointer-events: auto;
  margin: 0 auto;
  clip-path: polygon(
    0 0.5rem,
    0.5rem 0,
    calc(100% - 0.5rem) 0,
    100% 0.5rem,
    100% calc(100% - 0.5rem),
    calc(100% - 0.5rem) 100%,
    0.5rem 100%,
    0 calc(100% - 0.5rem)
  );
}
@media (width < 1024px) {
  .cookies-main {
    padding: 0.75rem;
    gap: 0.75rem;
    clip-path: unset;
  }
}
@media (width < 768px) {
  .cookies-main {
    flex-direction: column;
    gap: 0.5rem;
    align-items: flex-start;
  }
}
.cookies-body {
  font-size: 0.938rem;
}
.cookies-body a {
  color: inherit;
  transition: opacity 0.4s;
}
.cookies-body a:hover {
  opacity: 0.7;
}
.cookies-btn {
  min-width: 16.5rem;
}
.login-form {
  display: flex;
  flex-direction: column;
  gap: 3.75rem;
}
@media (width < 1024px) {
  .login-form {
    gap: 2.5rem;
  }
}
.login-form-inputs {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}
.login-form-btns {
  display: flex;
  align-items: center;
  gap: 1rem;
  justify-content: space-between;
}
.login-form-submit {
  min-width: 11.5rem;
}
.login-form-forgot {
  font-size: 0.75rem;
  font-weight: 900;
  color: #2bc2c4;
  text-transform: uppercase;
  transition: color 0.4s;
}
.login-form-forgot:hover {
  color: #80e4e5;
}
.login-form-nav {
  padding: 1.25rem;
  clip-path: polygon(
    0 0.5rem,
    0.5rem 0,
    calc(100% - 0.5rem) 0,
    100% 0.5rem,
    100% calc(100% - 0.5rem),
    calc(100% - 0.5rem) 100%,
    0.5rem 100%,
    0 calc(100% - 0.5rem)
  );
  background-image: linear-gradient(to right, #2bc2c4, #80e4e5);
  color: #000;
  font-size: 0.938rem;
  text-align: center;
}
.login-form-nav button,
.login-form-nav a {
  color: inherit;
  transition: opacity 0.4s;
  font-weight: 700;
}
.login-form-nav button:hover,
.login-form-nav a:hover {
  opacity: 0.7;
}
.home-page .header:not(.fixed):before,
.error-page .header:not(.fixed):before {
  opacity: 0;
}
.service-hero {
  position: relative;
  margin-top: calc(-1 * var(--header-height));
  padding-top: calc(var(--header-height) + 1rem);
  overflow: hidden;
}
.service-hero .container {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  gap: 1.75rem;
}
.service-hero-video {
  position: absolute;
  inset: 0 0 auto;
  height: 100%;
  max-height: 59.063rem;
}
.service-hero-video:before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 2;
  background: url(../img/service-hero-bg.svg) center top / 139.438rem 42.25rem no-repeat;
}
.service-hero-video:after {
  content: '';
  position: absolute;
  inset: calc(100% - 18.625rem) 0 0;
  background-image: linear-gradient(to top, #000, rgba(0, 0, 0, 0));
}
.service-hero-main {
  display: flex;
  gap: 2rem;
  justify-content: space-between;
}
@media (width < 1024px) {
  .service-hero-main {
    flex-direction: column;
  }
}
.service-hero-body {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}
@media (width >= 1024px) {
  .service-hero-body {
    max-width: 41.875rem;
  }
}
.service-hero-body .section-head {
  margin: auto 0;
}
.service-hero-body .section-label {
  font-size: 1.25rem;
  line-height: 1.32;
  font-weight: 800;
  text-transform: uppercase;
}
@media (width < 1024px) {
  .service-hero-body .section-label {
    font-size: 1.125rem;
  }
}
.service-hero-body .breadcrumbs {
  margin: 0;
}
.service-hero-frame {
  flex: none;
  width: 37rem;
  aspect-ratio: 1;
  align-self: flex-start;
  padding: 0.75rem;
}
@media (width < 1024px) {
  .service-hero-frame {
    align-self: center;
    max-width: 100%;
  }
}
.service-hero-advantages {
  position: relative;
  display: flex;
  justify-content: space-between;
  gap: 1.5rem;
}
@media (width >= 1024px) {
  .service-hero-advantages {
    padding: 4.375rem 5rem;
    min-height: 13.813rem;
  }
}
@media (width < 1024px) {
  .service-hero-advantages {
    display: grid;
  }
}
@media (width < 1024px) and (width >= 768px) {
  .service-hero-advantages {
    grid-template-columns: 1fr 1fr;
  }
}
.service-hero-advantages-frame {
  position: absolute;
  inset: 0;
}
@media (width < 1024px) {
  .service-hero-advantages-frame {
    display: none;
  }
}
.service-hero-advantage {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  gap: 0.125rem;
}
.service-hero-advantage-title {
  font-size: 0.938rem;
  font-weight: 700;
  color: #2bc2c4;
  text-transform: uppercase;
}
@media (width < 1024px) {
  .service-hero-advantage-title {
    font-size: 0.813rem;
  }
}
.service-hero-advantage-desc {
  font-size: 2.375rem;
  line-height: 1.2;
  font-weight: 800;
}
@media (width < 1024px) {
  .service-hero-advantage-desc {
    font-size: 2rem;
  }
}
.inspiration .container {
  display: flex;
  justify-content: space-between;
  gap: 2rem;
  align-items: flex-start;
}
@media (width < 1024px) {
  .inspiration .container {
    flex-direction: column;
    align-items: unset;
    gap: 1.5rem;
  }
}
.inspiration-body {
  flex: none;
  width: 30rem;
  display: flex;
  flex-direction: column;
  gap: 2rem;
}
@media (width < 1024px) {
  .inspiration-body {
    width: auto;
    gap: 1.5rem;
    position: relative;
  }
}
.inspiration-video {
  width: 18.75rem;
  height: 18.75rem;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  z-index: -1;
  position: relative;
}
@media (width < 1024px) {
  .inspiration-video {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    opacity: 0.4;
  }
}
.inspiration-video video {
  flex: none;
  width: 44.625rem;
}
.inspiration-list {
  display: grid;
  gap: 1.25rem;
}
@media (width >= 768px) {
  .inspiration-list {
    grid-template-columns: 1fr 1fr;
  }
}
@media (width >= 1024px) {
  .inspiration-list {
    max-width: 50.5rem;
    flex: auto;
    min-width: 0;
  }
}
.inspiration-item {
  position: relative;
  padding: 2.5rem 2rem;
  min-height: 17.063rem;
}
@media (width < 768px) and (width >= 480px) {
  .inspiration-item {
    padding: 3rem;
  }
}
.inspiration-item-frame {
  position: absolute;
  inset: 0;
}
.inspiration-item-body {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.cta {
  position: relative;
}
@media (width >= 1024px) {
  .cta-reverse .cta-main {
    padding: 0.75rem 5rem 1rem 3.375rem;
  }
}
@media (width >= 1024px) {
  .cta-reverse .cta-body {
    flex-direction: row-reverse;
  }
}
@media (width >= 1024px) {
  .cta-reverse .cta-user {
    margin-left: auto;
  }
}
.cta-bg {
  position: absolute;
  inset: 0;
  z-index: -1;
}
@media (width >= 1024px) {
  .cta-bg {
    transform: translateX(-50%);
    width: 105rem;
    inset: 0 0 auto 50%;
    height: 50.313rem;
  }
}
.cta-bg:after {
  content: '';
  position: absolute;
  z-index: 1;
  inset: 0;
  background: radial-gradient(50% 50% at 50% 50%, rgba(0, 0, 0, 0), #000);
}
.cta-main {
  position: relative;
  display: flex;
  flex-direction: column;
}
@media (width >= 1024px) {
  .cta-main {
    padding: 0.75rem 3.375rem 1rem 5rem;
    min-height: 31.375rem;
  }
}
.cta-frame {
  position: absolute;
  inset: 0;
}
@media (width < 1024px) {
  .cta-frame {
    display: none;
  }
}
.cta-body {
  display: flex;
  justify-content: space-between;
  gap: 1.5rem;
  position: relative;
  z-index: 1;
  flex: auto;
}
@media (width < 768px) {
  .cta-body {
    flex-direction: column;
  }
}
.cta-content {
  margin: auto 0;
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
}
@media (width >= 1024px) {
  .cta-content {
    max-width: 40.75rem;
    padding: 2rem 0;
  }
}
.cta-user {
  text-transform: uppercase;
  font-weight: 700;
  letter-spacing: 0.05em;
}
.cta-user-name {
  font-size: 1rem;
}
.cta-user-desc {
  color: var(--section-color, #2bc2c4);
  font-size: 0.75rem;
}
.cta-img {
  flex: none;
  align-self: flex-end;
  width: 32.813rem;
  display: flex;
  align-items: flex-end;
  height: 0;
  position: relative;
}
@media (width < 1024px) {
  .cta-img {
    width: 20rem;
    height: auto;
  }
}
@media (width < 768px) {
  .cta-img {
    width: min(32.813rem, 100%);
    margin: 0 auto;
  }
}
.cta-img svg {
  position: absolute;
  width: 67.875rem;
  height: 67.875rem;
  bottom: 16.375rem;
  left: 50%;
  transform: translate(-50%, 50%);
  pointer-events: none;
}
@media (width < 1024px) {
  .cta-img svg {
    bottom: 50%;
  }
}
.cta-img img {
  aspect-ratio: 1;
  object-position: center bottom;
  object-fit: contain;
  position: relative;
  z-index: 1;
}
.fantastic {
  --section-color: #e52e88;
}
.fantastic .section-head {
  align-items: center;
  text-align: center;
}
.fantastic-list {
  display: grid;
  gap: 1.25rem;
}
@media (width >= 1024px) {
  .fantastic-list {
    grid-template-columns: 1fr 1fr;
  }
}
.fantastic-item {
  position: relative;
  min-height: 36.563rem;
  display: flex;
  flex-direction: column;
  padding: 20.625rem 0.625rem 2.5rem;
}
.fantastic-item-frame {
  position: absolute;
  inset: 0;
  padding: 0.625rem;
}
.fantastic-item-frame .frame-mask {
  height: 17.5rem;
}
.fantastic-item-icon {
  position: absolute;
  z-index: 1;
  width: 3.938rem;
  top: 0.75rem;
  left: 0.75rem;
  display: flex;
}
@media (width < 768px) {
  .fantastic-item-icon {
    width: 2.5rem;
  }
}
.fantastic-item-body {
  position: relative;
  z-index: 1;
  padding: 0 1.875rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  flex: auto;
}
@media (width < 768px) {
  .fantastic-item-body {
    padding: 0 0.75rem;
  }
}
.fantastic-item-btn {
  margin: auto auto 0 0;
  --color: var(--section-color, #2bc2c4);
  min-width: 11.5rem;
}
.fantastic-video {
  height: 13.875rem;
  position: relative;
  z-index: -1;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}
.fantastic-video-body {
  position: relative;
}
.fantastic-video-body:after {
  content: '';
  position: absolute;
  z-index: 1;
  inset: 0;
  background: radial-gradient(50% 50% at 50% 50%, rgba(0, 0, 0, 0), #000);
}
.fantastic-video-body video {
  width: 105rem;
}
.creators {
  --section-color: #8978db;
}
.creators .container {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2.5rem;
}
.creators .section-head {
  align-items: center;
  text-align: center;
  max-width: 53rem;
}
.creators .section-label {
  font-weight: 900;
  text-transform: uppercase;
  font-size: 3.125rem;
  line-height: 1.2;
}
@media (width < 1024px) {
  .creators .section-label {
    font-size: 2.5rem;
  }
}
.creators-avatars {
  display: flex;
}
.creators-avatar {
  width: 5.188rem;
  aspect-ratio: 1;
  padding: 0.625rem;
}
.creators-avatar + .creators-avatar {
  margin-left: -0.313rem;
}
.creators-avatar .frame-mask {
  border-radius: 50%;
}
.creators-avatar:nth-child(2) .frame-img {
  transform: rotate(30deg);
}
.creators-avatar:nth-child(3) .frame-img {
  transform: rotate(101deg);
}
.creators-avatar:nth-child(4) .frame-img {
  transform: rotate(-75deg);
}
.creators-avatar:nth-child(5) .frame-img {
  transform: rotate(-90deg);
}
.page-main {
  padding-top: 1rem;
}
.page-title {
  margin-bottom: 2rem;
}
@media (width < 1024px) {
  .page-title {
    margin-bottom: 1.5rem;
  }
}
.page-title:last-child {
  margin-bottom: 0;
}
.journal-list {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 1.25rem;
}
@media (width < 1024px) {
  .journal-list {
    grid-template-columns: 1fr 1fr;
  }
}
@media (width < 768px) {
  .journal-list {
    grid-template-columns: 1fr;
  }
}
.journal-item {
  position: relative;
  display: flex;
  flex-direction: column;
  padding: 1.5rem 1.5rem 1rem;
  color: inherit;
}
@media (width >= 1024px) {
  .journal-item {
    min-height: 29.313rem;
  }
}
.journal-item:hover .journal-item-img img {
  transform: scale(1.06);
}
.journal-item:hover .journal-item-title {
  color: #2bc2c4;
}
.journal-item:hover .journal-item-read-more {
  color: #80e4e5;
}
.journal-item-frame {
  position: absolute;
  inset: 0;
}
.journal-body {
  position: relative;
  z-index: 1;
  flex: auto;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.journal-item-img {
  aspect-ratio: 392/221;
  margin-bottom: 1rem;
}
.journal-item-img img {
  transition: transform 0.4s;
}
.journal-item-title {
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  transition: color 0.4s;
}
.journal-item-desc {
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  font-size: 0.938rem;
  line-height: 1.48;
}
.journal-item-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: auto;
  gap: 6rem;
  font-size: 0.75rem;
}
@media (width < 1024px) {
  .journal-item-foot {
    padding: 0.5rem 0 1rem;
  }
}
@media (width < 768px) {
  .journal-item-foot {
    padding-bottom: 0;
  }
}
.journal-item-date {
  opacity: 0.5;
}
.journal-item-read-more {
  font-weight: 700;
  text-transform: uppercase;
  color: #2bc2c4;
  transition: color 0.4s;
}
.article {
  display: grid;
  grid-template-columns: 1fr 27.5rem;
  gap: 1.25rem 3.75rem;
}
@media (width < 1024px) {
  .article {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
  }
}
.article-head {
  grid-column-end: 2;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}
.article-date {
  font-size: 0.75rem;
  opacity: 0.5;
}
.article-body {
  grid-row-start: 2;
}
.article-img {
  margin-bottom: 3.75rem;
  position: relative;
  padding: 1.5rem;
  display: flex;
}
@media (width < 1024px) {
  .article-img {
    padding: 1rem;
    margin-bottom: 2.5rem;
  }
}
.article-img img {
  width: 100%;
}
.article-img-frame {
  position: absolute;
  inset: 0;
  border: solid 0.125rem #2bc2c4;
}
.article-img-frame i {
  position: absolute;
  width: 4.5rem;
  height: 4.5rem;
  background: #2bc2c4;
  --frame: 0.75rem;
  clip-path: polygon(
    0 0,
    var(--frame) var(--frame),
    var(--frame) calc(100% - var(--frame)),
    calc(100% - var(--frame)) calc(100% - var(--frame)),
    100% 100%,
    0 100%
  );
}
.article-img-frame i:nth-child(1) {
  left: -0.125rem;
  top: -0.125rem;
  transform: rotate(90deg);
}
.article-img-frame i:nth-child(2) {
  right: -0.125rem;
  top: -0.125rem;
  transform: rotate(180deg);
}
.article-img-frame i:nth-child(3) {
  right: -0.125rem;
  bottom: -0.125rem;
  transform: rotate(-90deg);
}
.article-img-frame i:nth-child(4) {
  left: -0.125rem;
  bottom: -0.125rem;
}
.article-share {
  margin-top: 3rem;
  padding-top: 3rem;
  border-top: solid 1px rgba(255, 255, 255, 0.16);
  display: flex;
  gap: 1rem;
  align-items: center;
  justify-content: space-between;
}
@media (width < 1024px) {
  .article-share {
    margin-top: 2rem;
    padding-top: 2rem;
    flex-direction: column;
    align-items: unset;
  }
}
.share-btns {
  display: flex;
  align-items: center;
  gap: 1rem;
}
.share-btn {
  border-radius: 0.75rem;
  display: flex;
  max-width: 3rem;
}
.share-btn img {
  transition: transform 0.4s;
}
.share-btn:hover img {
  transform: translateY(-0.5rem);
}
.article-sidebar {
  grid-row-start: 2;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}
@media (width < 1024px) {
  .article-sidebar {
    margin-top: 1.25rem;
  }
}
@media (width < 1024px) and (width >= 768px) {
  .article-sidebar {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
}
@media (width < 1024px) and (width >= 768px) {
  .article-sidebar .journal-item:nth-child(3) {
    display: none;
  }
}
.contacts {
  display: flex;
  gap: 1.5rem;
  align-items: flex-start;
}
@media (width < 1024px) {
  .contacts {
    flex-direction: column;
    align-items: unset;
  }
}
.contacts-section {
  position: relative;
  padding: 0.75rem;
}
.contacts-section-info {
  flex: none;
}
@media (width >= 1024px) {
  .contacts-section-info {
    width: 27.25rem;
  }
}
.contacts-section-body {
  padding: 1rem;
  background-color: #12171c;
  position: relative;
  z-index: 1;
}
.contacts-list {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}
.contacts-item {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  align-items: flex-start;
}
.contacts-item-title {
  font-size: 0.813rem;
  opacity: 0.56;
}
.contacts-item-link {
  color: inherit;
  transition: color 0.4s;
}
.contacts-item-link:hover {
  color: #2bc2c4;
}
.contacts-item-desc {
  font-weight: 500;
}
.contacts-section-form {
  flex: auto;
  min-width: 0;
}
.contacts-section-form .contacts-section-frame {
  color: #8978db;
}
.contacts-form {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}
.contacts-form-inputs {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}
.contacts-form-group {
  display: grid;
  gap: 1.5rem;
}
@media (width >= 768px) {
  .contacts-form-group {
    grid-template-columns: 1fr 1fr;
  }
}
.contacts-form-submit {
  min-width: 11rem;
  align-self: flex-start;
  --color: #8978db;
}
.error-hero .section-head {
  align-items: center;
  text-align: center;
  padding-top: 4.5rem;
}
@media (width < 1024px) {
  .error-hero .section-head {
    padding-top: 2rem;
  }
}
.error-code-img {
  margin: 0 auto;
  width: min(55.125rem, 100%);
  filter: drop-shadow(0px 1.625rem 1.625rem #2bc2c4);
}
.promo-banner {
  max-width: 59.5rem;
  margin: 0 auto;
  aspect-ratio: 952/200;
  padding: 2rem 2.875rem 2.375rem 5.25rem;
  display: flex;
  flex-direction: column;
  position: relative;
}
@media (width < 1024px) {
  .promo-banner {
    padding: 1.125rem 1.5rem 1.75rem;
  }
}
@media (width < 768px) {
  .promo-banner {
    padding: 0;
    aspect-ratio: unset;
  }
}
.promo-banner-frame {
  position: absolute;
  inset: 0;
}
@media (width < 768px) {
  .promo-banner-frame {
    display: none;
  }
}
.promo-banner-body {
  flex: auto;
  display: flex;
  align-items: center;
  gap: 3rem;
  position: relative;
  z-index: 1;
}
@media (width < 1024px) {
  .promo-banner-body {
    gap: 1.5rem;
  }
}
@media (width < 768px) {
  .promo-banner-body {
    display: grid;
    grid-template-columns: 7.5rem 1fr;
    gap: 0 1rem;
  }
}
.promo-banner-img {
  display: flex;
  align-self: flex-end;
  height: 0;
  align-items: flex-end;
  width: 8.875rem;
  flex: none;
  margin-right: 1rem;
}
@media (width < 1024px) {
  .promo-banner-img {
    width: 7.5rem;
    margin: 0;
  }
}
@media (width < 768px) {
  .promo-banner-img {
    height: auto;
  }
}
.promo-banner-title {
  flex: auto;
  min-width: 0;
  font-size: 0.875rem;
  font-weight: 500;
}
@media (width < 768px) {
  .promo-banner-title {
    padding: 1.5rem 0;
  }
}
.promo-banner-title span {
  font-weight: 700;
  color: #d45d3f;
}
@media (width < 1024px) and (width >= 768px) {
  .promo-banner-btn {
    font-size: 0.688rem;
  }
}
@media (width < 768px) {
  .promo-banner-btn {
    grid-column: 1/-1;
  }
}
.cabinet-header {
  background-color: #0c0d11;
  height: 6.25rem;
  border-bottom: solid 1px rgba(255, 255, 255, 0.17);
  position: fixed;
  inset: 0 0 auto 15.625rem;
  z-index: 666;
  padding: 0 2.25rem;
  display: flex;
  align-items: center;
  gap: 1.5rem;
  justify-content: space-between;
}
@media (width < 1024px) {
  .cabinet-header {
    left: 0;
    padding: 0 var(--container-padding);
    height: var(--header-height);
  }
}
.cabinet-header .logo {
  margin-right: auto;
}
.cabinet-header-title {
  font-weight: 900;
}
@media (width >= 1024px) {
  .cabinet-header-nav {
    min-width: 17.5rem;
  }
}
.cabinet-header-nav .select-toggle {
  height: 3.125rem;
  padding: 0 0.625rem 0 1.25rem;
  gap: 0.5rem;
}
@media (width < 1024px) {
  .cabinet-header-nav .select-toggle {
    padding-left: 0.625rem;
  }
}
.cabinet-header-nav .select-options {
  padding: 0 0.625rem 0.5rem 1.25rem;
  background-color: #12171c;
  border-color: rgba(255, 255, 255, 0.2);
}
@media (width >= 1024px) {
  .cabinet-header-nav .select-options {
    border-top: 0;
    margin-top: -0.563rem;
  }
}
@media (width < 1024px) {
  .cabinet-header-nav .select-options {
    padding: 0.5rem 0.625rem;
  }
}
.cabinet-header-nav.active .select-toggle {
  border-color: rgba(255, 255, 255, 0.2);
}
.cabinet-header-nav.active .select-toggle-arrow {
  transform: rotate(-180deg);
}
.cabinet-header-nav-tokens {
  font-size: 0.813rem;
  flex: auto;
  min-width: 0;
}
@media (width < 1024px) {
  .cabinet-header-nav-tokens {
    padding: 0.5rem 0 1rem;
  }
}
.cabinet-header-nav-tokens b {
  color: #80e4e5;
}
.cabinet-header-nav-lang {
  clip-path: polygon(
    0 0.5rem,
    0.5rem 0,
    calc(100% - 0.5rem) 0,
    100% 0.5rem,
    100% calc(100% - 0.5rem),
    calc(100% - 0.5rem) 100%,
    0.5rem 100%,
    0 calc(100% - 0.5rem)
  );
  width: 2.25rem;
  aspect-ratio: 1;
  flex: none;
  background: linear-gradient(to right, #2bc2c4, #80e4e5);
  display: grid;
  place-items: center;
  color: #000;
  text-transform: uppercase;
  font-weight: 600;
  font-size: 0.813rem;
}
.cabinet-header-menu {
  border-top: solid 1px rgba(255, 255, 255, 0.2);
  font-size: 0.938rem;
  font-weight: 500;
}
.cabinet-header-menu a {
  display: flex;
  margin: 0 -0.625rem 0 -1.25rem;
  padding: 0.5rem 0.625rem 0.5rem 1.25rem;
  color: inherit;
  transition: color 0.4s;
}
.cabinet-header-menu a:hover {
  color: #2bc2c4;
}
.cabinet-header-menu .cabinet-header-menu-logout {
  color: #d45d3f;
}
.cabinet-header-menu .cabinet-header-menu-logout:hover {
  color: #dd8069;
}
.cabinet-header-sidebar-toggle {
  display: flex;
  color: #80e4e5;
  margin: -0.5rem;
  padding: 0.5rem;
  position: relative;
}
@media (width >= 1024px) {
  .cabinet-header-sidebar-toggle {
    display: none;
  }
}
.cabinet-header-sidebar-toggle svg {
  transition:
    opacity 0.4s,
    transform 0.4s;
}
.cabinet-header-sidebar-toggle svg:last-child {
  position: absolute;
  left: calc(50% - 0.5 * var(--size));
  top: calc(50% - 0.5 * var(--size));
  opacity: 0;
  transform: scale(0);
}
.cabinet-header-sidebar-toggle.active svg:first-child {
  opacity: 0;
  transform: scale(0);
}
.cabinet-header-sidebar-toggle.active svg:last-child {
  opacity: 1;
  transform: scale(1);
}
.cabinet-sidebar .modal-body {
  all: unset;
  box-sizing: border-box;
  width: 15.625rem;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  padding: 2rem;
  overflow: hidden auto;
  border-right: solid 1px rgba(255, 255, 255, 0.17);
  background-color: #0c0d11;
}
@media (width < 1024px) {
  .cabinet-sidebar {
    top: calc(var(--header-height) - 1px);
  }
  .cabinet-sidebar .modal-wrapp {
    padding: 0;
    background: rgba(0, 0, 0, 0.8);
  }
  .cabinet-sidebar .modal-body {
    margin-left: 0;
    height: 100%;
    transform: translateX(-100%);
  }
  .cabinet-sidebar.active .modal-body {
    transform: translateX(0);
  }
}
@media (width >= 1024px) {
  .cabinet-sidebar {
    display: contents;
  }
  .cabinet-sidebar .modal-wrapp {
    display: contents;
  }
  .cabinet-sidebar .modal-body {
    position: fixed;
    inset: 0 auto 0 0;
    z-index: 600;
  }
  .cabinet-sidebar:not(.active) {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
  }
}
@media (width >= 1024px) {
  html:has(.cabinet-sidebar.active) {
    overflow: hidden scroll !important;
  }
}
body:has(.cabinet) {
  background-color: #0c0d11;
}
.cabinet-nav {
  padding-top: 1.5rem;
  border-top: solid 1px rgba(255, 255, 255, 0.12);
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}
.cabinet-menu {
  display: flex;
  flex-direction: column;
  font-size: 0.938rem;
  font-weight: 500;
}
.cabinet-menu a {
  display: flex;
  padding: 0.625rem;
  gap: 0.75rem;
  align-items: center;
  border: solid 1px rgba(255, 255, 255, 0);
  transition:
    border-color 0.4s,
    background-color 0.4s,
    color 0.4s;
  color: inherit;
}
.cabinet-menu a svg {
  --size: 1.25rem;
  transition: color 0.4s;
}
.cabinet-menu a:hover {
  color: #2bc2c4;
}
.cabinet-menu a:hover svg {
  color: #2bc2c4;
}
.cabinet-menu .active > a {
  border-color: rgba(255, 255, 255, 0.12);
  background-color: #12171c;
  pointer-events: none;
}
.cabinet-menu .active > a svg {
  color: #80e4e5;
}
.cabinet-sidebar-copyright {
  margin-top: auto;
  font-size: 0.813rem;
  opacity: 0.5;
}
.cabinet {
  display: flex;
  flex-direction: column;
  padding: 8.5rem 2.25rem 2.25rem 17.875rem;
  gap: 2rem;
  flex: auto;
}
@media (width < 1024px) {
  .cabinet {
    padding: calc(var(--header-height) + 1.5rem) var(--container-padding) 3rem;
  }
}
.cabinet-explore-nav {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.5rem 1.5rem;
  font-weight: 500;
}
.cabinet-explore-nav a {
  display: flex;
  align-items: center;
  gap: 0.25rem;
  color: #5d5d5d;
  transition: color 0.4s;
}
.cabinet-explore-nav a:hover {
  color: #fff;
}
.cabinet-explore-nav a svg {
  --size: 0.75rem;
  color: #2bc2c4;
  display: none;
}
.cabinet-explore-nav a.active {
  color: #fff;
}
.cabinet-explore-nav a.active svg {
  display: block;
}
.cabinet-explore-list {
  margin: 0 -0.125rem -0.25rem;
  position: relative;
}
.cabinet-explore-item {
  padding: 0 0.125rem 0.25rem;
  width: 20%;
  max-width: 17rem;
  display: flex;
  position: absolute;
}
@media (width < 1024px) {
  .cabinet-explore-item {
    width: 25%;
    max-width: unset;
  }
}
@media (width < 768px) {
  .cabinet-explore-item {
    width: 33.333%;
  }
}
.cabinet-explore-item-link {
  display: flex;
  width: 100%;
}
.cabinet-explore-item-link img {
  width: 100%;
}
.cabinet-models-list {
  display: grid;
  gap: 0.875rem;
  grid-template-columns: repeat(auto-fill, 16.25rem);
}
@media (width < 1440px) {
  .cabinet-models-list {
    grid-template-columns: repeat(4, 1fr);
  }
}
@media (width < 1024px) {
  .cabinet-models-list {
    grid-template-columns: 1fr 1fr 1fr;
  }
}
@media (width < 768px) {
  .cabinet-models-list {
    grid-template-columns: 1fr 1fr;
  }
}
.cabinet-models-item {
  --padding: 1.25rem;
  aspect-ratio: 260/365;
  position: relative;
  padding: var(--padding);
  display: flex;
  flex-direction: column;
  color: inherit;
  min-width: 0;
  overflow: hidden;
}
@media (width < 768px) {
  .cabinet-models-item {
    --padding: 0.5rem;
  }
}
.cabinet-models-item:hover .cabinet-models-item-img img {
  transform: scale(1.06);
}
.cabinet-models-item-img {
  position: absolute;
  inset: 0;
}
.cabinet-models-item-img img {
  transition: transform 0.4s;
}
.cabinet-models-item-body {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  flex: auto;
}
.cabinet-models-item-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem;
}
.cabinet-models-item-tag {
  padding: 0.25rem 0.5rem;
  border: solid 1px rgba(0, 0, 0, 0.2);
  background-color: rgba(0, 0, 0, 0.7);
  font-size: 0.625rem;
  font-weight: 600;
}
.cabinet-models-item-info {
  margin: auto calc(-1 * var(--padding)) calc(-1 * var(--padding));
  padding: 3.5rem var(--padding) var(--padding);
  background-image: linear-gradient(to top, #000, rgba(0, 0, 0, 0));
}
.cabinet-models-item-title {
  font-weight: 700;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.cabinet-models-item-desc {
  font-size: 0.75rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.cabinet-create {
  display: flex;
  flex-direction: column;
  flex: auto;
  gap: 2.5rem;
  min-height: 0;
}
@media (width >= 1024px) {
  .cabinet-create {
    padding-left: 27.5rem;
  }
}
.cabinet-create-form {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  font-size: 0.938rem;
  --input-height: 2.75rem;
  --input-font-size: 0.938rem;
  --input-font-weight: 400;
  --input-padding: 0.938rem;
}
@media (width >= 1024px) {
  .cabinet-create-form {
    width: 27.5rem;
    position: fixed;
    inset: 6.25rem auto 0 15.625rem;
    overflow: hidden auto;
    border-right: solid 1px rgba(255, 255, 255, 0.17);
    padding: 2.25rem;
  }
}
.cabinet-create-form .btn {
  font-size: 0.938rem;
  font-weight: 600;
  padding: 0.375rem 0.75rem;
  text-transform: none;
}
.cabinet-create-form .input-block {
  --input-height: inherit;
  --input-font-size: inherit;
  --input-font-weight: inherit;
  --input-padding: inherit;
}
.model-select .select-toggle {
  padding: 0.938rem 0.625rem 0.938rem 0.938rem;
  height: unset;
}
.model-select [data-tippy-root] {
  width: var(--select-width);
}
.model-select .select-options {
  min-width: unset;
}
.model-select .select-options-list {
  gap: 0.938rem;
}
.model-option {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex: auto;
  min-width: 0;
}
.model-option-img {
  flex: none;
  width: 3.125rem;
  aspect-ratio: 1;
  background-color: rgba(255, 255, 255, 0.06);
}
.model-option-img:has(img) {
  background: none;
}
.model-option-body {
  flex: auto;
  min-width: 0;
}
.model-option-title {
  font-size: 1rem;
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.model-option-desc {
  font-size: 0.75rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.model-option-tags {
  white-space: nowrap;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  align-items: flex-end;
}
.model-option-tag {
  font-size: 0.688rem;
  font-weight: 700;
  padding: 0.125rem 0.25rem;
  background-image: linear-gradient(to right, #2bc2c4, #80e4e5);
  color: #000;
}
.cabinet-create-prompt-input {
  height: 8.125rem;
  border-color: #2bc2c4;
}
.cabinet-create-prompt-input:focus:not(.select-toggle) {
  border-color: #80e4e5;
}
.cabinet-create-prompt-type {
  gap: 1.75rem;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
.cabinet-create-prompt-btn {
  display: flex;
  color: #2bc2c4;
  transition: color 0.4s;
}
.cabinet-create-prompt-btn:hover {
  color: #80e4e5;
}
.cabinet-create-prompt-btn svg {
  --size: 1.25rem;
}
.cabinet-create-btns {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.938rem;
}
.cabinet-create-settings {
  border: solid 0.125rem #2a2a2e;
  background-color: rgba(255, 255, 255, 0.04);
}
.cabinet-create-setting {
  display: flex;
  flex-direction: column;
}
.cabinet-create-setting:not(:last-child) {
  border-bottom: solid 0.125rem #2a2a2e;
}
.cabinet-create-setting.active > .cabinet-create-setting-toggle > svg {
  transform: rotate(-180deg);
}
.cabinet-create-setting.active > .cabinet-create-setting-main {
  grid-template-rows: 1fr;
}
.cabinet-create-setting-toggle {
  padding: 1.25rem 0.938rem;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  font-size: 1rem;
  font-weight: 600;
  transition: color 0.4s;
  cursor: pointer;
  -webkit-user-select: none;
  user-select: none;
}
.cabinet-create-setting-toggle:hover {
  color: #2bc2c4;
}
.cabinet-create-setting-toggle > svg {
  --size: 0.75rem;
  transition: transform 0.4s;
  margin-left: auto;
  color: #2bc2c4;
}
.cabinet-create-setting-main {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 0.4s;
}
.cabinet-create-setting-body {
  overflow: hidden;
}
.cabinet-create-setting-content {
  padding: 0 0.938rem 1.25rem;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  overflow: hidden;
}
.cabinet-create-setting-size {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
}
.cabinet-create-setting-size-divider {
  width: 2.5rem;
  text-align: center;
  font-size: 1.25rem;
  line-height: 1;
  font-weight: 300;
}
.cabinet-create-setting-number .form-block-head {
  white-space: nowrap;
}
.cabinet-create-setting-number .form-block-title,
.cabinet-create-setting-number .checkbox {
  font-size: 0.75rem;
}
.cabinet-create-settings-seed {
  gap: 1.25rem;
}
.cabinet-create-settings-seed .form-block-title {
  justify-content: center;
}
.cabinet-create-settings-input {
  display: flex;
  gap: 0.938rem;
}
.cabinet-create-settings-input .input-block {
  flex: auto;
  min-width: 0;
}
.cabinet-create-settings-input.disabled {
  opacity: 0.4;
  pointer-events: none;
}
.cabinet-create-settings-input-btn {
  flex: none;
  width: 2.75rem;
  aspect-ratio: 1;
  display: grid;
  place-items: center;
  border: solid 1px rgba(255, 255, 255, 0.06);
  background-color: #12171c;
  transition: color 0.4s;
}
.cabinet-create-settings-input-btn:hover {
  color: #2bc2c4;
}
.cabinet-create-settings-uuid .input-block {
  --input-font-size: 0.75rem;
  --input-font-weight: 400;
  --input-padding: 0.625rem;
}
.cabinet-create-settings-group {
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
  padding-bottom: 1.25rem;
  border-bottom: solid 1px #2a2a2e;
}
.cabinet-create-settings-group-add {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  justify-content: space-between;
}
.cabinet-create-settings-group-add-title {
  font-weight: 37.5rem;
}
.cabinet-create-settings-group-add-btn {
  padding: 0.375rem 0.938rem;
  font-size: 0.75rem;
  font-weight: 600;
  border: solid 1px rgba(255, 255, 255, 0.4);
  background-color: rgba(255, 255, 255, 0.04);
  transition: color 0.4s;
}
.cabinet-create-settings-group-add-btn:hover {
  color: #2bc2c4;
}
.cabinet-create-settings-group-list {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}
.cabinet-create-settings-group-list:empty {
  display: none;
}
.cabinet-create-settings-group-item .cabinet-create-setting-toggle {
  padding: 0.875rem 0;
}
.cabinet-create-settings-group-item .cabinet-create-setting-content {
  padding: 0;
}
.cabinet-create-settings-group-item .model-select .select-toggle {
  background-color: #0c0d11;
}
.cabinet-create-settings-group-item-remove {
  flex: none;
  width: 2.75rem;
  aspect-ratio: 1;
  display: grid;
  place-items: center;
  border: solid 1px rgba(255, 255, 255, 0.06);
  background-color: rgba(255, 255, 255, 0.04);
  transition: color 0.4s;
  color: #fff;
}
.cabinet-create-settings-group-item-remove:hover {
  color: #d45d3f;
}
.cabinet-create-main {
  display: flex;
  flex-direction: column;
  gap: 4rem;
}
@media (width < 1024px) {
  .cabinet-create-main {
    gap: 2rem;
  }
}
.cabinet-create-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
}
.cabinet-create-head-title {
  font-size: 1rem;
  font-weight: 600;
}
.cabinet-create-view-btns {
  display: flex;
}
.cabinet-create-view-btn {
  border: solid 0.125rem #293441;
  width: 1.75rem;
  height: 1.75rem;
  display: grid;
  position: relative;
  place-items: center;
  transition: color 0.4s;
}
.cabinet-create-view-btn:hover {
  color: #2bc2c4;
}
.cabinet-create-view-btn:first-child {
  border-radius: 0.375rem 0 0 0.375rem;
}
.cabinet-create-view-btn:last-child {
  border-radius: 0 0.375rem 0.375rem 0;
}
.cabinet-create-view-btn:before {
  content: '';
  position: absolute;
  inset: -0.125rem;
  border-radius: inherit;
  background-image: linear-gradient(to right, #2bc2c4, #80e4e5);
  opacity: 0;
  transition: opacity 0.4s;
}
.cabinet-create-view-btn svg {
  position: relative;
  z-index: 1;
}
.cabinet-create-view-btn.active {
  pointer-events: none;
}
.cabinet-create-view-btn.active:before {
  opacity: 1;
}
.cabinet-create-body {
  display: flex;
  flex-direction: column;
  gap: 2.25rem;
}
.cabinet-create-list {
  display: grid;
  grid-template-columns: repeat(var(--columns, 2), 1fr);
  gap: 0.25rem;
}
@media (width < 768px) {
  .cabinet-create-list {
    grid-template-columns: 1fr 1fr;
  }
}
@media (width < 480px) {
  .cabinet-create-list {
    grid-template-columns: 1fr;
  }
}
.cabinet-create-item {
  position: relative;
  aspect-ratio: 464/260;
  display: flex;
  flex-direction: column;
}
.cabinet-create-item:hover .cabinet-create-item-body {
  opacity: 1;
}
.cabinet-create-item-img {
  position: absolute;
  inset: 0;
}
.cabinet-create-item-body {
  flex: auto;
  margin: -1px;
  display: flex;
  flex-direction: column;
  gap: 0.938rem;
  padding: 1.5rem;
  background-color: rgba(0, 0, 0, 0.7);
  position: relative;
  z-index: 1;
  transition: opacity 0.4s;
  opacity: 0;
}
@media (width < 1024px) {
  .cabinet-create-item-body {
    padding: 1rem;
  }
}
.cabinet-create-item-btns {
  margin-top: auto;
  display: flex;
  gap: 0.938rem;
}
@media (width < 1024px) {
  .cabinet-create-item-btns {
    gap: 0.5rem;
  }
}
.cabinet-create-item-btn {
  border: solid 1px #63666f;
  flex: none;
  width: 2.75rem;
  aspect-ratio: 1;
  display: grid;
  place-items: center;
  border-radius: 0.625rem;
  transition: color 0.4s;
  background-color: rgba(19, 21, 24, 0.7);
}
.cabinet-create-item-btn:hover {
  color: #2bc2c4;
}
.cabinet-create-item-btn-remove {
  margin-left: auto;
}
.cabinet-create-item-btn-remove:hover {
  color: #d45d3f;
}
.cabinet-wallet {
  display: flex;
  flex-direction: column;
  gap: 2.25rem;
}
.cabinet-wallet-main {
  display: flex;
  align-items: center;
  gap: 2.25rem;
  justify-content: space-between;
}
@media (width < 1024px) {
  .cabinet-wallet-main {
    flex-direction: column;
    align-items: unset;
  }
}
.cabinet-wallet-info {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1.5rem;
  min-width: 0;
}
@media (width >= 1024px) {
  .cabinet-wallet-info {
    max-width: 46.75rem;
  }
}
.cabinet-wallet-btn {
  min-width: 11.5rem;
}
.cabinet-wallet-balance {
  background-color: #12171c;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  align-items: flex-start;
  padding: 1.5rem;
}
@media (width >= 1024px) {
  .cabinet-wallet-balance {
    min-width: 27.5rem;
    padding: 1.875rem 2.25rem;
  }
}
.cabinet-wallet-balance-title {
  font-size: 1.375rem;
  line-height: 1.2;
}
.cabinet-wallet-balance-tokens {
  font-size: 1.75rem;
}
.cabinet-wallet-balance-tokens b {
  font-weight: 600;
}
.cabinet-wallet-balance-add {
  font-size: 0.938rem;
  transition: opacity 0.4s;
  --gradient-start: #2bc2c4;
  --gradient-end: #80e4e5;
  background: linear-gradient(to right, var(--gradient-start), var(--gradient-end));
  -webkit-background-clip: text;
  color: transparent;
}
.cabinet-wallet-balance-add:hover {
  opacity: 0.7;
}
.cabinet-wallet-history {
  padding: 1.5rem 1.875rem;
  background-color: #12171c;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}
@media (width < 1024px) {
  .cabinet-wallet-history {
    padding: 1.5rem;
  }
}
.cabinet-wallet-history-title {
  font-size: 1.5rem;
  font-weight: 600;
  line-height: 1.32;
}
.cabinet-wallet-history-table {
  width: 100%;
  font-size: 0.938rem;
  font-weight: 500;
}
@media (width < 1024px) {
  .cabinet-wallet-history-table {
    display: block;
  }
}
@media (width >= 1024px) {
  .cabinet-wallet-history-table td {
    padding: 0.5rem 1rem 0.5rem 0;
    border-top: solid 1px rgba(255, 255, 255, 0.16);
    border-bottom: solid 1px rgba(255, 255, 255, 0.16);
  }
  .cabinet-wallet-history-table td:last-child {
    padding-right: 0;
    text-align: right;
  }
}
@media (width < 1024px) {
  .cabinet-wallet-history-table td {
    display: grid;
    grid-column: span 2;
    grid-template-columns: subgrid;
    gap: 1rem;
  }
  .cabinet-wallet-history-table td:before {
    content: attr(data-title) ':';
    color: rgba(255, 255, 255, 0.5);
    font-size: 0.75rem;
  }
}
.cabinet-wallet-history-table thead {
  vertical-align: bottom;
  font-size: 0.75rem;
  color: rgba(255, 255, 255, 0.5);
}
@media (width < 1024px) {
  .cabinet-wallet-history-table thead {
    display: none;
  }
}
@media (width < 1024px) {
  .cabinet-wallet-history-table tbody {
    display: block;
    border-top: solid 1px rgba(255, 255, 255, 0.16);
  }
}
@media (width < 1024px) {
  .cabinet-wallet-history-table tbody tr {
    display: grid;
    grid-template-columns: auto 1fr;
    padding: 1rem 0;
    border-bottom: solid 1px rgba(255, 255, 255, 0.16);
    row-gap: 0.5rem;
  }
}
.top-up-form {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}
.top-up-form-inputs {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}
.top-up-form-submit {
  align-self: flex-start;
  min-width: 11.5rem;
}
.cabinet-checkout {
  display: flex;
  flex-direction: column;
  gap: 2.5rem;
}
.cabinet-checkout-products {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.cabinet-checkout-product {
  display: flex;
  align-items: center;
  padding: 2.25rem;
  background-color: #14161d;
  gap: 2.25rem;
}
@media (width < 1024px) {
  .cabinet-checkout-product {
    gap: 1.5rem;
    padding: 1.5rem;
  }
}
@media (width < 768px) {
  .cabinet-checkout-product {
    flex-direction: column;
    gap: 1rem;
    align-items: flex-start;
  }
}
.cabinet-checkout-product-img {
  display: flex;
  margin: -2rem 0 -2rem -2rem;
  flex: none;
  max-width: 10.625rem;
}
@media (width < 1024px) {
  .cabinet-checkout-product-img {
    margin: -1.25rem 0 -1.25rem -1.25rem;
  }
}
@media (width < 768px) {
  .cabinet-checkout-product-img {
    margin-bottom: 0;
  }
}
.cabinet-checkout-product-body {
  flex: auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.cabinet-checkout-product-title {
  font-weight: 600;
}
.cabinet-checkout-product-desc {
  color: #919191;
}
.cabinet-checkout-product-cost {
  flex: none;
  white-space: nowrap;
}
.cabinet-checkout-form {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 2.5rem;
}
@media (width < 1024px) {
  .cabinet-checkout-form {
    flex-direction: column;
  }
}
.cabinet-checkout-form-body {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1.25rem;
}
.cabinet-checkout-form-inputs {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  align-items: flex-start;
}
.cabinet-checkout-form-radios {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem 2.25rem;
  flex-wrap: wrap;
}
.cabinet-checkout-form-agreement a {
  color: inherit;
}
.cabinet-checkout-form-agreement a:hover {
  color: #2bc2c4;
}
.cabinet-checkout-form-submit {
  min-width: 11.5rem;
}
.cabinet-settings-form {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}
.cabinet-settings-form:not(:last-child) {
  margin-bottom: 3rem;
  padding-bottom: 3rem;
  border-bottom: solid 1px rgba(255, 255, 255, 0.12);
}
@media (width < 1024px) {
  .cabinet-settings-form:not(:last-child) {
    margin-bottom: 2rem;
    padding-bottom: 2rem;
  }
}
.cabinet-settings-form-title {
  font-size: 1.5rem;
  margin-bottom: 0.25rem;
}
@media (width < 1024px) {
  .cabinet-settings-form-title {
    font-size: 1.25rem;
  }
}
.cabinet-settings-form-inputs {
  display: grid;
  gap: 1.5rem;
}
@media (width >= 1024px) {
  .cabinet-settings-form-inputs {
    grid-template-columns: 1fr 1fr 1fr;
  }
}
.cabinet-settings-form-submit {
  min-width: 11.5rem;
  align-self: flex-start;
}
