section#end {
  background: #1a1c1f;
  overflow: hidden;
  isolation: isolate;
  position: relative;
}
section#end .mobile-grad,
section#end .grad {
  position: absolute;
  inset-inline-start: 50%;
  inset-block-start: 66%;
  translate: -50% -50%;
  width: 1280rem;
  z-index: -1;
  mix-blend-mode: hard-light;
  pointer-events: none;
  display: none;
}
@media (orientation: landscape) {
  section#end .grad {
    display: block;
  }
}
@media (orientation: portrait) {
  section#end .mobile-grad {
    display: block;
    width: 100%;
  }
}
section#end::before {
  content: '';
  position: absolute;
  z-index: -1;
  height: 100%;
  width: 100%;
  background: linear-gradient(
    to bottom,
    hsl(from #66391f h s l / 5%) 0%,
    hsl(from #66391f h s l / 100%) 70%,
    hsl(from #66391f h s l / 1%) 100%
  );
  background-position: 50% 50%;
  pointer-events: none;
}
@media (orientation: landscape) {
  section#end::before {
    inset-inline-start: 50%;
    inset-block-start: 50%;
    translate: -50% -50%;
    width: 165%;
    height: 125%;
    border-radius: 50%;
    aspect-ratio: 1 / 0.7041666666666667;
    background: radial-gradient(
      60% 100% at center center,
      hsl(from #74503a h s l / 80%) 0%,
      rgba(0, 0, 0, 0) 50%,
      rgba(0, 0, 0, 0) 100%
    );
  }
}
section#support {
  padding-block: calc(var(--headerHeight) + 8vh) 16vh;
}
@media (orientation: landscape) {
  section#support {
    padding-block: 80rem 120rem;
    margin-block-start: -1rem;
  }
}
section#support .head .info {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
section#support .head .info .edescription {
  max-width: 425rem;
  text-align: center;
  text-wrap: pretty;
  margin-block-end: 16rem;
}
@media (orientation: landscape) {
  section#support .head .info .edescription {
    margin-block-end: 34rem;
  }
}
@media (orientation: portrait) {
  section#support {
    padding-block: calc(var(--headerHeight) + 5vh) 12vh;
  }

  section#support .head .info .etitle {
    margin-block-end: 14rem;
  }
  section#support .head .info .edescription {
    font-size: 16rem;
  }
}
section#support .head .info .support-navigation {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12rem;
  width: 100%;
}
@media (orientation: portrait) {
  section#support
    .head
    .info
    .support-navigation
    .btn:nth-child(odd):last-child {
    grid-area: 2 / 2 span;
  }
}
@media (orientation: landscape) {
  section#support .head .info .support-navigation {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 13rem;
    max-width: 1120rem;
  }
}
section#support .head .info .support-navigation .btn {
  background: hsl(from currentColor h s l / 15%);
  border-color: hsl(from currentColor h s l / 15%);
  font-weight: 400;
  gap: 8rem;
  white-space: normal;
  line-height: 1.2;
  text-align: center;
}
section#support .head .info .support-navigation .btn .icon {
  width: 18rem;
  aspect-ratio: 1 / 1;
  flex-shrink: 0;
}
@media (orientation: portrait) {
  section#support .head .info .support-navigation .btn {
    font-size: 13rem;
    min-height: 48rem;
  }
}
section#support
  .head
  .info
  .support-navigation
  .btn:is(:hover, .active, :focus-visible, :active) {
  background: hsl(from currentColor h s l / 20%);
  border-color: hsl(from currentColor h s l / 100%);
  opacity: 1;
}
section#support .head .info .support-navigation .btn.active {
  background: linear-gradient(180deg, #f2b35f 0%, #b46620 100%);
  border-color: #ffd79a;
  color: #fff;
  box-shadow:
    inset 0 1px 0 hsl(38 100% 90% / 78%),
    0 0 0 1rem hsl(34 100% 78% / 28%),
    0 0 18rem hsl(32 100% 58% / 45%);
  text-shadow: 0 1px 2px hsl(0 0% 0% / 35%);
}
section#support
  .head
  .info
  .support-navigation
  .btn:is(:focus-visible, :active) {
  background: hsl(from currentColor h s l / 25%);
}
@media (orientation: landscape) {
  section#support .head .info .support-navigation .btn .icon {
    width: 22rem;
  }
}
section#support .support-download-buttons {
  margin-block-start: 10rem;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 12rem;
}
section#support .support-download-buttons .btn.apple .icon {
  width: 18rem;
}
section#support .support-download-buttons .btn.google .icon {
  width: 22rem;
}
section#support .support-download-buttons .btn.gallery .icon {
  width: 22rem;
}
@media (orientation: landscape) {
  section#support .support-download-buttons {
    margin-block-start: 18rem;
  }
}
section#support .content {
  margin-block-start: 56rem;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0;
  position: relative;
  z-index: 1;
  font-size: 151rem;
  font-weight: 700;
  line-height: 1;
}
@media (orientation: landscape) {
  section#support .content {
    font-size: 369rem;
    margin-block-start: 24rem;
  }
}
section#support .content .number {
  position: relative;
  z-index: 0;
  display: grid;
  align-items: center;
  isolation: isolate;
}
section#support .content .number ~ .number:not(:last-child) {
  font-size: 93%;
  margin-inline: -2% 0%;
  margin-block: -2% 0%;
  translate: -12% 0;
}
section#support .content .number ~ .number {
  z-index: 0;
}
section#support .content .number::before,
section#support .content .number::after {
  content: attr(data-text);
  font: inherit;
  grid-area: 1/1;
  background: linear-gradient(180deg, #f9f2e8 0%, #fafbfb 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  position: relative;
}
section#support .content .number::before {
  z-index: -1;
  filter: blur(18rem);
}
@media (orientation: landscape) {
  section#support .head .info .btn {
    padding-inline: 16rem;
    padding-block: 9rem;
  }
  section#support .content .number::before {
    filter: blur(28rem);
  }
}
section#support .content .number::after {
  z-index: 2;
}
section#support .slash {
  flex-shrink: 0;
  position: relative;
  width: 100%;
  max-width: 900rem;
  aspect-ratio: 1.86 / 1;
  margin-inline: -56% -41.5%;
  display: grid;
  place-content: flex-end;
  place-items: flex-end;
  grid-template-rows: minmax(0, 1fr);
  grid-template-columns: minmax(0, 1fr);
  z-index: 1;
}
section#support .slash .slashContent {
  display: grid;
  place-content: flex-end;
  place-items: flex-end;
  grid-template-rows: minmax(0, 1fr);
  grid-template-columns: minmax(0, 1fr);
  container-type: inline-size;
  isolation: isolate;
  width: 100%;
  max-height: 100%;
}

@media (orientation: landscape) {
  section#support .slash {
    margin-inline: -40% -29%;
  }
}

section#support .body {
  --padding: 5.5cqw;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: minmax(0, 1fr);
  align-items: center;
  justify-content: flex-start;
  justify-items: stretch;
  pointer-events: none;
  grid-area: 1 / 1;
  font-size: 16rem;
  width: 100%;
  height: 100%;
  position: relative;
  z-index: 3;
  padding-block: calc(11cqw + var(--padding)) var(--padding);
  padding-inline: var(--padding);
}
@media (orientation: landscape) {
  section#support .body {
    --padding: 7.7cqw;
  }
}

section#support .body .tabContent {
  align-items: center;
  gap: calc(var(--padding) / 2);
  visibility: hidden;
  width: 100%;
  display: flex;
  grid-area: 1/1;
}
section#support .body .tabContent .data {
  display: flex;
  flex-direction: column;
  gap: 12rem;
  max-width: none;
}
@media (orientation: landscape) {
  section#support .body .tabContent .data {
    gap: 26rem;
    max-width: 512rem;
  }
}
section#support .body .tabContent .data .view {
  --viewGap: 12rem;
  --viewLinkGap: 8rem;
  --viewIconWidth: 16rem;
  --viewCopyIconWidth: 14rem;
  display: flex;
  align-items: center;
  gap: var(--viewGap);
  container-type: inline-size;
}
@media (orientation: landscape) {
  section#support .body .tabContent .data .view {
    --viewGap: 20rem;
    --viewLinkGap: 14rem;
    --viewIconWidth: 40rem;
    --viewCopyIconWidth: 23rem;
  }
}

section#support .body .tabContent .data .view .viewLink {
  --px: 12rem;
  --py: 4rem;
  display: inherit;
  align-items: inherit;
  gap: var(--viewLinkGap);
  overflow: hidden;
  border: clamp(1px, 1rem, 1rem) solid #a4a5b1;
  padding-inline: var(--px);
  padding-block: var(--py);
  border-radius: 6rem;
  min-height: 24rem;
}

.support-video {
  position: relative;
  z-index: -1;
  grid-area: 1 / 1;
  max-width: none;
  width: 560rem;
  margin-inline: 0rem -110rem;
  margin-block: 0rem -30rem;
  pointer-events: none;
  transition: filter 1.5s ease, opacity 1.5s ease;
}

@media (orientation: landscape) {
  .support-video {
    width: 1400rem;
    margin-inline: 0rem -255rem;
    margin-block: 0rem -60rem;
  }
}

.support-video:not([poster]):not([video]) {
  opacity: 0;
  filter: blur(8rem);
}

#support-present-video + #support-switch-video {
  visibility: hidden;
}

@media (orientation: portrait) {
  section#support .content {
    margin-block-start: 34rem;
  }

  section#support.mobile-static-support .content {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    justify-items: center;
  }

  section#support.mobile-static-support .content .number {
    grid-area: 1 / 1;
    z-index: 0;
  }

  section#support.mobile-static-support .content .number ~ .number:not(:last-child),
  section#support.mobile-static-support .content .number ~ .number {
    margin: 0;
    translate: 0;
  }

  section#support.mobile-static-support .content .slash {
    grid-area: 1 / 1;
    width: min(92vw, 430rem);
    max-width: none;
    aspect-ratio: 1.16 / 1;
    margin-inline: 0;
    place-content: center;
    place-items: center;
    z-index: 2;
  }

  section#support.mobile-static-support .slash .slashContent {
    width: 100%;
    height: 100%;
    max-height: none;
    place-content: stretch;
    place-items: stretch;
  }

  section#support.mobile-static-support .body {
    padding-block: var(--padding);
    padding-inline: var(--padding);
    z-index: 3;
  }

  section#support.mobile-static-support .slash .slashContent::before {
    content: '';
    grid-area: 1 / 1;
    width: 164%;
    height: 164%;
    min-height: 0;
    background-image: url('/assets/epn_cards/img/support-switch.png?v=20260429-1');
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    position: relative;
    z-index: 2;
    place-self: center;
    translate: 0 -14%;
    pointer-events: none;
  }

  section#support.mobile-static-support .support-video {
    display: none;
  }
}

@media (orientation: landscape) {
  section#support .body .tabContent .data .view .viewLink {
    --px: 24rem;
    --py: 8rem;
    border-radius: 12rem;
    min-height: 72rem;
  }
}
section#support .body .tabContent .data .view .viewLink .icon {
  flex-shrink: 0;
  width: var(--viewIconWidth);
  aspect-ratio: 1/1;
}
section#support .body .tabContent .data .view .viewLink .value {
  --offsetY: 0.2ex;
  padding-block: var(--offsetY);
  margin-block: calc(var(--offsetY) * -1);
  font-size: 16rem;
  line-height: normal;
  font-weight: 700;
  overflow: hidden;
}
section#support .body .tabContent.whatsapp .data .view .viewLink .value {
  font-size: 14rem;
}
section#support .body .tabContent.wechat .data .view .viewLink .value {
  font-size: 10rem;
}
@media (orientation: landscape) {
  section#support .body .tabContent .data .view .viewLink .value {
    font-size: 48rem;
  }
  section#support .body .tabContent.whatsapp .data .view .viewLink .value {
    font-size: 46rem;
  }
  section#support .body .tabContent.wechat .data .view .viewLink .value {
    font-size: 26rem;
  }
}
section#support .body .tabContent .data .view .viewLink .value .valueText {
  background: linear-gradient(
    185.86deg,
    #26c8e4 -154.64%,
    #00bbff -88.64%,
    #29a9ea -74.63%,
    #29a9eb -5.39%,
    #ffffff 47.49%,
    #29a9eb 136.04%,
    #ffffff 212.55%
  );
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  white-space: nowrap;
  mask-image: linear-gradient(
    to right,
    rgb(0, 0, 0)
      calc(
        100cqw - var(--viewGap) - var(--viewIconWidth) - var(--viewLinkGap) -
          var(--viewCopyIconWidth) - var(--px) * 2
      ),
    rgba(0, 0, 0, 0)
      calc(
        100cqw - var(--viewGap) - var(--viewIconWidth) - var(--viewLinkGap) -
          var(--px) - var(--viewCopyIconWidth)
      )
  );
  margin-inline-end: calc(var(--px) * -1);
  padding-inline-end: var(--px);
  margin-block: -0.23ex;
}
section#support .body .tabContent .data .view .copy {
  color: inherit;
}
section#support .body .tabContent .data .view .copy .icon {
  width: var(--viewCopyIconWidth);
  height: auto;
  color: hsl(from currentColor h s l / 90%);
}
section#support .body .tabContent .data .view .copy:not(.active) .icon.done {
  display: none;
}
section#support .body .tabContent .data .view .copy.active {
  cursor: default;
  opacity: 1;
}
section#support .body .tabContent .data .view .copy.active .icon:not(.done) {
  display: none;
}
section#support .body .tabContent .data .text {
  color: hsl(from currentColor h s l / 70%);
  font-size: 10rem;
  line-height: 125%;
  font-weight: 400;
}
@media (orientation: landscape) {
  section#support .body .tabContent .data .text {
    font-size: 24rem;
  }
}
section#support .body .tabContent .qr {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-inline-start: auto;
  border: clamp(1px, 1rem, 1rem) solid hsl(from var(--color-white) h s l / 20%);
  background: hsl(from var(--color-white) h s l / 10%);
  padding: 8rem;
  border-radius: 8rem;
  width: 90rem;
  aspect-ratio: 1/1;
}
@media (orientation: landscape) {
  section#support .body .tabContent .qr {
    padding: 17rem;
    border-radius: 12rem;
    width: 192rem;
  }
}
section#support .body .tabContent .qr > * {
  width: 100%;
  height: auto;
}

section#support .body .tabContent.telegram .support-agent-chat {
  display: grid;
  grid-template-rows: 1fr auto;
  align-items: stretch;
  gap: 10rem;
  width: 100%;
  max-width: none;
  min-height: 100%;
  height: 100%;
  box-sizing: border-box;
  flex: 1 1 auto;
}
section#support .body .tabContent.telegram {
  align-items: stretch;
  align-self: stretch;
  justify-self: stretch;
  height: 100%;
  min-height: 0;
  max-width: none;
  width: 100%;
  padding-inline: 0;
  box-sizing: border-box;
  margin-inline: 0;
  translate: 0;
  flex: 1 1 auto;
}
@media (orientation: landscape) {
  section#support .body .tabContent.telegram {
    width: 100%;
    margin-inline: 0;
    translate: 0;
  }
}
section#support .body .tabContent.telegram .support-advisor-card {
  display: grid;
  grid-template-columns: 34% minmax(0, 1fr);
  align-items: end;
  gap: 0.8cqw;
  width: 100%;
  height: 100%;
  min-height: 0;
}
section#support .body .tabContent.telegram .advisor-avatar-wrap {
  align-self: end;
  justify-self: center;
  width: min(100%, 38cqw);
  max-height: 92%;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: center;
  overflow: visible;
}
section#support .body .tabContent.telegram .advisor-chat-button {
  align-self: center;
  position: relative;
  z-index: 2;
  margin-block: -4.2cqw 1.2cqw;
  padding: 0.7cqw 1.4cqw;
  border: clamp(1px, 0.12cqw, 2px) solid hsl(34 76% 76% / 75%);
  border-radius: 4rem;
  background: linear-gradient(180deg, #d28b3a 0%, #9a5517 100%);
  box-shadow:
    inset 0 1px 0 hsl(38 100% 88% / 70%),
    0 0.3cqw 0.6cqw hsl(0 0% 0% / 28%);
  color: #fff;
  font-weight: 600;
  font-size: 24rem;
  line-height: 1;
  text-shadow: 0 1px 2px hsl(0 0% 0% / 35%);
  cursor: pointer;
}
section#support .body .tabContent.telegram .advisor-chat-button[hidden] {
  display: none;
}
section#support .body .tabContent.telegram .advisor-avatar {
  display: block;
  width: 100%;
  max-height: 100%;
  object-fit: contain;
  object-position: center bottom;
  scale: 1.22;
  translate: 0 6.2cqw;
  transform-origin: center bottom;
}
section#support
  .body
  .tabContent.telegram
  .advisor-avatar[src$="technicalSupport.png"] {
  scale: 1.04;
  translate: 0 5.6cqw;
}
section#support .body .tabContent.telegram .advisor-avatar.is-missing {
  visibility: hidden;
}
section#support .body .tabContent.telegram .advisor-copy {
  align-self: stretch;
  height: calc(100% + 4cqw);
  max-height: calc(100% + 4cqw);
  min-height: 0;
  margin-block: -2cqw;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding-inline-end: 0.2cqw;
  color: #fff;
  font-weight: 400;
  font-size: 16rem;
  line-height: 1.2;
  text-shadow: none;
  scrollbar-width: thin;
  scrollbar-color: hsl(from #fff h s l / 55%) transparent;
}
section#support .body .tabContent.telegram .advisor-copy::-webkit-scrollbar {
  width: 6rem;
}
section#support .body .tabContent.telegram .advisor-copy::-webkit-scrollbar-thumb {
  background: hsl(from #fff h s l / 45%);
  border-radius: 999rem;
}
section#support .body .tabContent.telegram .advisor-title {
  margin-block-end: 1.8cqw;
}
section#support .body .tabContent.telegram .advisor-text {
  white-space: pre-line;
}
@media (orientation: portrait) {
  section#support .body .tabContent.telegram .support-advisor-card {
    grid-template-columns: 34% minmax(0, 1fr);
    gap: 1.6cqw;
    align-items: stretch;
    align-self: start;
    height: 64%;
    max-height: 64%;
    overflow: visible;
  }
  section#support .body .tabContent.telegram .advisor-avatar-wrap {
    align-self: end;
    width: min(100%, 48cqw);
    max-height: none;
    overflow: visible;
  }
  section#support .body .tabContent.telegram .advisor-copy {
    align-self: start;
    height: 74%;
    max-height: 74%;
    min-height: 0;
    margin-block-start: 10cqw;
    margin-block-end: 0;
    padding-block: 0 1cqw;
    padding-inline-end: 3.6cqw;
    overflow-y: auto;
    overflow-x: hidden;
    font-size: 11rem;
    line-height: 1.14;
  }
  section#support .body .tabContent.telegram .advisor-copy::-webkit-scrollbar {
    width: 3rem;
  }
  section#support .body .tabContent.telegram .advisor-copy::-webkit-scrollbar-track {
    margin-block: 10cqw 1cqw;
  }
  section#support .body .tabContent.telegram .advisor-copy::before,
  section#support .body .tabContent.telegram .advisor-copy::after {
    content: "";
    display: block;
    flex: 0 0 auto;
  }
  section#support .body .tabContent.telegram .advisor-copy::before {
    height: 1.2cqw;
  }
  section#support .body .tabContent.telegram .advisor-copy::after {
    height: 2cqw;
  }
  section#support .body .tabContent.telegram .advisor-avatar {
    scale: 1.1;
    translate: 1cqw 6cqw;
  }
}
section#support:has(.btn.tab.show-content) .body {
  padding-block: var(--padding);
  padding-inline: var(--padding);
}
@media (orientation: landscape) {
  section#support .body .tabContent.telegram .support-agent-chat {
    gap: 16rem;
  }
}
section#support .body .tabContent.telegram .chat-feed,
section#support .body .tabContent.telegram .chat-compose {
  border: clamp(1px, 1rem, 1rem) solid hsl(from var(--color-white) h s l / 30%);
  background: hsl(from var(--color-white) h s l / 10%);
  border-radius: 8rem;
  backdrop-filter: blur(8rem);
}
@media (orientation: landscape) {
  section#support .body .tabContent.telegram .chat-feed,
  section#support .body .tabContent.telegram .chat-compose {
    border-radius: 12rem;
  }
}
section#support .body .tabContent.telegram .chat-feed {
  min-height: 0;
  height: auto;
  max-height: none;
  overflow: auto;
  padding: 12rem;
  display: grid;
  gap: 8rem;
  box-sizing: border-box;
}
@media (orientation: landscape) {
  section#support .body .tabContent.telegram .chat-feed {
    min-height: 0;
    padding: 18rem;
    gap: 12rem;
  }
}
section#support .body .tabContent.telegram .chat-row {
  display: flex;
}
section#support .body .tabContent.telegram .chat-row.agent {
  justify-content: flex-start;
}
section#support .body .tabContent.telegram .chat-row.user {
  justify-content: flex-end;
}
section#support .body .tabContent.telegram .chat-bubble {
  max-width: 100%;
  width: 100%;
  font-size: 10rem;
  line-height: 1.35;
  padding: 0;
  border-radius: 0;
  color: #ffffff;
}
@media (orientation: landscape) {
  section#support .body .tabContent.telegram .chat-bubble {
    font-size: 17rem;
    border-radius: 10rem;
    padding: 9rem 14rem;
  }
}
section#support .body .tabContent.telegram .chat-row.agent .chat-bubble {
  background: transparent;
  border: 0;
}
section#support .body .tabContent.telegram .chat-row.user .chat-bubble {
  background: hsl(from #2f6fff h s l / 38%);
  border: clamp(1px, 1rem, 1rem) solid hsl(from #9ec9ff h s l / 45%);
}
section#support .body .tabContent.telegram .chat-compose {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8rem;
  padding: 6rem;
  margin: 0;
  position: relative;
  z-index: 2;
  box-sizing: border-box;
}
@media (orientation: landscape) {
  section#support .body .tabContent.telegram .chat-compose {
    gap: 10rem;
    padding: 9rem;
  }
}
section#support .body .tabContent.telegram .chat-input {
  min-width: 0;
  width: 100%;
  border: 0;
  outline: 0;
  color: #fff;
  background: transparent;
  font: inherit;
  font-size: 11rem;
  line-height: 1.2;
  padding: 0 6rem;
}
section#support .body .tabContent.telegram .chat-input::placeholder {
  color: hsl(from #ffffff h s l / 62%);
}
@media (orientation: landscape) {
  section#support .body .tabContent.telegram .chat-input {
    font-size: 18rem;
    padding: 0 10rem;
  }
}
section#support .body .tabContent.telegram .chat-send {
  border: 0;
  cursor: pointer;
  color: #fff;
  background: #987c49;
  border-radius: 6rem;
  padding: 6rem 10rem;
  font-size: 10rem;
  line-height: 1;
}
section#support .body .tabContent.telegram .chat-send:is(:hover, :focus-visible) {
  background: #ac8f57;
}
@media (orientation: landscape) {
  section#support .body .tabContent.telegram .chat-send {
    border-radius: 8rem;
    padding: 10rem 14rem;
    font-size: 15rem;
  }
}