.va-detail {
  /* Font sizes follow the M-series clamp(px, vw, px) scale. */
  --va-font: "Microsoft YaHei", sans-serif;
  --va-background: #0f1219;
  --va-text: #9aa3b2;
  --va-white: #fff;
  --va-gradient-start: #9ccff5;
  --va-gradient-end: #efd4c5;
  --va-fs-12: clamp(12px, 0.632vw, 12px);
  --va-fs-14: clamp(12px, 0.737vw, 14px);
  --va-fs-16: clamp(14px, 0.842vw, 16px);
  --va-fs-20: clamp(16px, 1.053vw, 20px);
  --va-fs-22: clamp(18px, 1.158vw, 22px);
  --va-fs-24: clamp(18px, 1.263vw, 24px);
  --va-fs-28: clamp(22px, 1.474vw, 28px);
  --va-fs-56: clamp(36px, 2.947vw, 56px);
  --va-fs-58: clamp(28px, 3.053vw, 58px);
  --va-fs-64: clamp(48px, 3.368vw, 64px);
  --va-fs-160: clamp(80px, 8.421vw, 160px);
  --va-title-size: var(--va-fs-56);
  --va-body-size: var(--va-fs-24);
  --va-eyebrow-size: var(--va-fs-20);
  --va-mark-size: var(--va-fs-160);
  --va-name-size: var(--va-fs-58);
  --va-hero-body-size: var(--va-fs-22);
  --va-title-leading: 1.2;
  --va-body-leading: 1.5;
  --va-title-weight: 700;
  --va-body-weight: 400;
  --va-fade-duration: 1.6s;
  --va-line-gap: 0.3s;
  --va-drop-distance: clamp(20px, 2.5cqw, 48px);
  --va-drop-easing: cubic-bezier(0.16, 1, 0.3, 1);
  --va-video-text-delay: 0.6s;
  container-type: inline-size;
  width: 100%;
  margin: 0 auto;
  background: var(--va-background);
  color: var(--va-text);
  font-family: var(--va-font);
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

.va-detail *,
.va-detail *::before,
.va-detail *::after {
  box-sizing: border-box;
}

.va-detail .va-section {
  position: relative;
  width: 100%;
  isolation: isolate;
}

.va-detail .va-background,
.va-detail .va-background img {
  display: block;
  width: 100%;
  height: auto;
}

.va-detail .va-copy {
  position: absolute;
  z-index: 1;
  top: 4.6875cqw;
  left: 50%;
  width: min(1200px, 90%);
  transform: translateX(-50%);
  text-align: center;
  pointer-events: none;
}

.va-detail .va-title,
.va-detail .va-hero-title,
.va-detail .va-description,
.va-detail .va-eyebrow,
.va-detail .va-hero-description {
  padding: 0;
  margin: 0;
  border: 0;
  font-family: var(--va-font);
  font-style: normal;
  text-transform: none;
  letter-spacing: 0;
}

.va-detail .va-title {
  display: inline-block;
  color: var(--va-gradient-start);
  background: linear-gradient(90deg, var(--va-gradient-start) 15%, var(--va-gradient-end) 85%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  font-size: var(--va-title-size);
  line-height: var(--va-title-leading);
  font-weight: var(--va-title-weight);
}

.va-detail .va-description {
  max-width: 100%;
  margin: 1.55cqw auto 0;
  color: var(--va-text);
  font-size: var(--va-body-size);
  line-height: var(--va-body-leading);
  font-weight: var(--va-body-weight);
  text-wrap: balance;
}

.va-detail .va-eyebrow,
.va-detail .va-hero-title,
.va-detail .va-hero-description {
  position: absolute;
  left: 50%;
  width: min(1200px, 90%);
  transform: translateX(-50%);
  text-align: center;
}

.va-detail .va-eyebrow {
  top: 4.05cqw;
  color: #b0b7c7;
  font-size: var(--va-eyebrow-size);
  font-weight: var(--va-body-weight);
  letter-spacing: 11px;
  line-height: 1.2;
}

.va-detail .va-hero-title {
  top: 6.05cqw;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.7cqw;
  font-weight: var(--va-title-weight);
  color: var(--va-white);
}

.va-detail .va-mark,
.va-detail .va-hero-name {
  background: linear-gradient(#fff 10%, #a4b1c5 100%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.va-detail .va-mark {
  font-size: var(--va-mark-size);
  line-height: 1;
  letter-spacing: 16px;
}

.va-detail .va-hero-name {
  font-size: var(--va-name-size);
  letter-spacing: 7px;
  line-height: 1.23;
  text-align: left;
}

.va-detail .va-hero-description {
  top: 15.5cqw;
  color: #e8eef6;
  font-size: var(--va-hero-body-size);
  line-height: 1.81818;
  letter-spacing: 4px;
  font-weight: var(--va-body-weight);
}

.va-detail .va-hero-description strong {
  font-weight: var(--va-title-weight);
}

.va-detail .va-assembly,
.va-detail .va-airflow,
.va-detail .va-cruise {
  aspect-ratio: 1920 / 950;
}

.va-detail .va-installation {
  aspect-ratio: 1920 / 1100;
}

.va-detail .va-video {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  background: var(--va-background);
}

.va-detail .va-installation .va-video,
.va-detail .va-cruise .va-video {
  top: 18.177083cqw;
  left: 18.75%;
  width: 62.5%;
  height: 31.25cqw;
  border-radius: 0.5cqw;
}

.va-detail .va-cruise .va-video {
  top: 15.052083cqw;
}

.va-detail .va-installation .va-copy {
  top: 5cqw;
}

.va-detail .va-installation .va-description {
  margin-top: 2.15cqw;
}

.va-detail .va-airflow .va-description {
  max-width: 100%;
}

.va-detail .va-custom .va-copy {
  top: 2.8125cqw;
}

@media (min-width: 751px) and (max-width: 1440px) {
  .va-detail .va-eyebrow { letter-spacing: 8px; }
  .va-detail .va-mark { letter-spacing: 12px; }
  .va-detail .va-hero-name { letter-spacing: 4px; }
  .va-detail .va-hero-description { letter-spacing: 2px; }
}

@media (min-width: 751px) and (max-width: 1100px) {
  .va-detail .va-eyebrow { letter-spacing: 6px; }
  .va-detail .va-mark { letter-spacing: 8px; }
  .va-detail .va-hero-name { letter-spacing: 3px; }
  .va-detail .va-hero-description { top: calc(6.05cqw + 90px); }
}

@media (max-width: 750px) {
  .va-detail {
    --va-fs-14: clamp(14px, 1.867vw, 16px);
    --va-fs-16: clamp(16px, 2.133vw, 18px);
    --va-fs-24: clamp(24px, 3.2vw, 28px);
    --va-fs-28: clamp(26px, 3.733vw, 28px);
    --va-fs-64: clamp(64px, 8.533vw, 72px);
    --va-title-size: var(--va-fs-28);
    --va-body-size: var(--va-fs-16);
    --va-eyebrow-size: var(--va-fs-12);
    --va-mark-size: var(--va-fs-64);
    --va-name-size: var(--va-fs-24);
    --va-hero-body-size: var(--va-fs-14);
  }

  .va-detail .va-hero .va-background img {
    aspect-ratio: 750 / 729;
    width: 100% !important;
    margin-left: 0 !important;
  }

  .va-detail .va-hero-title {
    top: 14cqw;
    gap: 1.6cqw;
  }

  .va-detail .va-mark {
    font-size: var(--va-mark-size);
    letter-spacing: 6px;
  }

  .va-detail .va-hero-name {
    font-size: var(--va-name-size);
    letter-spacing: 1px;
  }

  .va-detail .va-eyebrow {
    top: 9.6cqw;
    font-size: var(--va-eyebrow-size);
    letter-spacing: 3px;
  }

  .va-detail .va-hero-description {
    top: 35.7cqw;
    font-size: var(--va-hero-body-size);
    letter-spacing: 0.5px;
  }

  .va-detail .va-assembly { aspect-ratio: 750 / 830; }
  .va-detail .va-installation { aspect-ratio: 750 / 829; }
  .va-detail .va-airflow { aspect-ratio: 750 / 792; }
  .va-detail .va-cruise { aspect-ratio: 750 / 857; }

  .va-detail .va-assembly,
  .va-detail .va-installation,
  .va-detail .va-airflow,
  .va-detail .va-cruise {
    display: flex;
    flex-direction: column;
  }

  .va-detail .va-assembly .va-copy,
  .va-detail .va-installation .va-copy,
  .va-detail .va-airflow .va-copy,
  .va-detail .va-cruise .va-copy {
    position: relative;
    top: auto;
    left: auto;
    order: -1;
    flex: 0 0 auto;
    margin: 0 auto;
    padding-top: 12.6cqw;
    transform: none;
  }

  .va-detail .va-description,
  .va-detail .va-installation .va-description,
  .va-detail .va-airflow .va-description {
    max-width: 100%;
    margin-top: 20px;
  }

  .va-detail .va-video,
  .va-detail .va-installation .va-video,
  .va-detail .va-cruise .va-video {
    position: relative;
    inset: auto;
    flex: 0 0 auto;
    width: 90%;
    height: auto;
    margin: 24px auto 0;
    border-radius: 8px;
  }

  .va-detail .va-installation .va-description {
    max-width: 100%;
  }

  .va-detail .va-description { text-wrap: wrap; }
  .va-detail .va-description br { display: none; }

  .va-detail .va-custom .va-copy {
    top: 5.066667cqw;
  }

  .va-detail .va-custom .va-description {
    max-width: 100%;
    margin-top: 20px;
  }
}



.va-detail .va-line {
  display: block;
  white-space: pre;
}

.va-detail .va-lines-ready {
  background-image: none;
}

.va-detail .va-title .va-line,
.va-detail .va-mark .va-line,
.va-detail .va-hero-name .va-line {
  background-image: var(--va-line-gradient);
  background-clip: text;
  -webkit-background-clip: text;
}

.va-detail.va-motion .va-reveal .va-line {
  opacity: 0;
  transform: translateY(calc(-1 * var(--va-drop-distance)));
}

.va-detail.va-motion .va-video-first {
  --va-start-delay: var(--va-video-text-delay);
}

.va-detail.va-motion .va-visible .va-line {
  opacity: 1;
  transform: translateY(0);
  transition: opacity var(--va-fade-duration) ease,
    transform var(--va-fade-duration) var(--va-drop-easing);
  transition-delay: calc(var(--va-start-delay, 0s) + var(--va-line-index) * var(--va-line-gap));
}

@media (max-width: 750px) {
  .va-detail.va-motion .va-video-first {
    --va-start-delay: 0s;
  }
}

@media (min-width: 751px) {
  .va-detail:not(.va-detail--shop) .va-airflow::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background: linear-gradient(to bottom, #0f1219 13%, rgba(15, 18, 25, 0.45) 33%, rgba(15, 18, 25, 0) 58%);
  }
}

@media (prefers-reduced-motion: reduce) {
  .va-detail.va-motion .va-reveal .va-line {
    opacity: 1;
    transform: none;
    transition: none;
  }
}

/* Start the hero animation before the deferred script and fonts finish. */
@media (prefers-reduced-motion: no-preference) {
  .va-detail .va-hero :is(.va-eyebrow, .va-hero-title, .va-hero-description) {
    animation: va-hero-enter var(--va-fade-duration) var(--va-drop-easing) both;
  }

  .va-detail .va-hero .va-hero-title {
    animation-delay: var(--va-line-gap);
  }

  .va-detail .va-hero .va-hero-description {
    animation-delay: calc(2 * var(--va-line-gap));
  }

  .va-detail.va-motion .va-hero .va-reveal .va-line {
    opacity: 1;
    transform: none;
    transition: none;
  }
}

@keyframes va-hero-enter {
  from {
    opacity: 0;
    translate: 0 calc(-1 * var(--va-drop-distance));
  }

  to {
    opacity: 1;
    translate: 0 0;
  }
}

/* Form styling follows the Chinese MN1130 website form. */
.va-detail .va-custom {
  display: grid;
}

.va-detail .va-custom .va-background {
  grid-area: 1 / 1;
  align-self: start;
}

.va-detail .va-custom-form-panel {
  --font-16: clamp(14px, 0.842vw, 16px);
  font-family: "Open Sans", Tahoma, Arial, "Microsoft YaHei", sans-serif;
  font-size: 16px;
  grid-area: 1 / 1;
  align-self: start;
  z-index: 1;
  width: min(900px, 90%);
  margin: 16.510417cqw auto 6.8cqw;
  padding: 64px 56px;
  border-radius: 16px;
  background: rgba(0, 0, 0, 0.5);
  color: #fff;
}

.va-detail .va-custom-form-panel:empty {
  display: none;
}

.va-detail .va-custom-form-panel .form-container,
.va-detail .va-custom-form-panel .custom_from {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  width: 100%;
  column-gap: 30px;
  row-gap: 20px;
  text-align: left;
}

.va-detail .va-custom-form-panel .custom_from {
  gap: 30px !important;
}

.va-detail .va-custom-form-panel .form-group {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.va-detail .va-custom-form-panel .form-group.full-width,
.va-detail .va-custom-form-panel .form-container.full-width,
.va-detail .va-custom-form-panel .from_general label:has(.span2) {
  grid-column: span 2;
}

.va-detail .va-custom-form-panel .form-name {
  margin-bottom: 8px;
  color: #fff !important;
  font-size: 14px;
  font-weight: unset !important;
}

.va-detail .va-custom-form-panel .form-name .c3 {
  color: #009dff;
}

.va-detail .va-custom-form-panel .tips {
  margin: 0;
  color: #979899;
  font-size: 13px;
}

.va-detail .va-custom-form-panel .form-group input,
.va-detail .va-custom-form-panel .form-group select,
.va-detail .va-custom-form-panel .form-group textarea {
  width: 100%;
  min-width: 0;
  padding: 12px 16px;
  border: 1px solid transparent;
  border-radius: 8px;
  outline: none;
  background-color: #f5f5f5;
  color: #333;
  font-size: 14px;
  font-family: inherit;
  transition: all 0.3s ease;
}

.va-detail .va-custom-form-panel .form-group input:focus,
.va-detail .va-custom-form-panel .form-group select:focus,
.va-detail .va-custom-form-panel .form-group textarea:focus {
  border-color: #ddd;
  background-color: #fff;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

.va-detail .va-custom-form-panel .form-group textarea {
  height: 120px;
  resize: vertical;
}

.va-detail .va-custom-form-panel .submit.ib {
  display: flex;
  justify-content: center;
  margin-top: 20px;
}

.va-detail .va-custom-form-panel #dosubmit {
  margin-top: 26px;
  padding: 12px 72px;
  border: none;
  border-radius: 6px;
  background-color: #e5e5e5 !important;
  color: #121212 !important;
  font-size: var(--font-16);
  font-family: inherit;
  cursor: pointer;
  transition: opacity 0.3s;
}

.va-detail .va-custom-form-panel #dosubmit:hover {
  opacity: 0.85;
}

.va-detail .va-custom-form-panel .form-website {
  display: none;
}

.va-detail .va-custom-form-panel .coloress-form {
  margin-top: 0 !important;
  background-color: rgba(0, 0, 0, 0.5) !important;
}

.va-detail .va-custom-form-panel .success-form {
  background-color: rgba(0, 0, 0, 0.5) !important;
}

@media (max-width: 750px) {
  .va-detail .va-custom-form-panel {
    margin-top: max(30cqw, 220px);
    padding: 18px;
  }

  .va-detail .va-custom-form-panel .form-container,
  .va-detail .va-custom-form-panel .custom_from {
    grid-template-columns: minmax(0, 1fr);
  }

  .va-detail .va-custom-form-panel .custom_from {
    gap: 15px !important;
  }

  .va-detail .va-custom-form-panel .form-group.full-width,
  .va-detail .va-custom-form-panel .form-container.full-width,
  .va-detail .va-custom-form-panel .from_general label:has(.span2) {
    grid-column: span 1;
  }

  .va-detail .va-custom-form-panel .form-group input,
  .va-detail .va-custom-form-panel .form-group select,
  .va-detail .va-custom-form-panel .form-group textarea {
    padding: 8px 16px !important;
  }

  .va-detail .va-custom-form-panel #dosubmit {
    margin-top: 0 !important;
  }
}

@media (max-width: 360px) {
  .va-detail[lang="en"] .va-custom-form-panel {
    margin-top: 260px;
  }
}

@media (max-width: 540px) {
  .va-detail .va-custom-form-panel #dosubmit {
    width: 100%;
  }
}




@font-face {
  font-family: "VA Anton";
  src: url("https://img.tmotor.com/products/va10-20/font/Anton-va-en.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

.va-detail[lang="en"]:not(.va-detail--shop) {
  --va-font: Arial, sans-serif;
  --va-fs-18: clamp(14px, 0.947vw, 18px);
  --va-fs-53: clamp(28px, 2.789vw, 53px);
  --va-fs-133: clamp(64px, 6.989vw, 133px);
  --va-eyebrow-size: var(--va-fs-18);
  --va-mark-size: var(--va-fs-133);
  --va-name-size: var(--va-fs-53);
  --va-hero-body-size: var(--va-fs-24);
}

.va-detail[lang="en"]:not(.va-detail--shop) .va-eyebrow {
  letter-spacing: 1.8px;
}

.va-detail[lang="en"]:not(.va-detail--shop) .va-hero-title {
  top: 6.45cqw;
  gap: clamp(16px, 1.474vw, 28px);
}

.va-detail[lang="en"]:not(.va-detail--shop) .va-mark,
.va-detail[lang="en"]:not(.va-detail--shop) .va-hero-name {
  font-family: "VA Anton", sans-serif;
  font-weight: 400;
  letter-spacing: 0;
}

.va-detail[lang="en"]:not(.va-detail--shop) .va-hero-name {
  line-height: 1.187;
}

.va-detail[lang="en"]:not(.va-detail--shop) .va-hero-description {
  top: 15.1cqw;
  letter-spacing: 2.4px;
}

@media (max-width: 750px) {
  .va-detail[lang="en"]:not(.va-detail--shop) .va-hero {
    --va-eyebrow-size: clamp(10px, 2.5vw, 14px);
    --va-mark-size: clamp(30px, 8.7vw, 64px);
    --va-name-size: clamp(14px, 3.8vw, 28px);
    --va-hero-body-size: var(--va-fs-14);
    aspect-ratio: 750 / 729;
    padding-top: 8cqw;
  }

  .va-detail[lang="en"]:not(.va-detail--shop) .va-hero .va-background {
    position: absolute;
    inset: 0;
    z-index: -1;
  }

  .va-detail[lang="en"]:not(.va-detail--shop) .va-hero :is(.va-eyebrow, .va-hero-title, .va-hero-description) {
    position: relative;
    top: auto;
    left: auto;
    transform: none;
    margin-inline: auto;
    letter-spacing: 0.5px;
  }

  .va-detail[lang="en"]:not(.va-detail--shop) .va-hero-title {
    gap: clamp(8px, 2vw, 16px);
    margin-top: clamp(8px, 2vw, 16px);
  }

  .va-detail[lang="en"]:not(.va-detail--shop) .va-mark {
    white-space: nowrap;
  }

  .va-detail[lang="en"]:not(.va-detail--shop) .va-hero-description {
    margin-top: clamp(8px, 2vw, 16px);
    line-height: var(--va-body-leading);
    text-wrap: balance;
  }
}

.va-detail[lang="en"]:not(.va-detail--shop) .va-assembly .va-copy,
.va-detail[lang="en"]:not(.va-detail--shop) .va-airflow .va-copy {
  top: 4.95cqw;
}

.va-detail[lang="en"]:not(.va-detail--shop) .va-installation .va-copy {
  top: 3.65cqw;
}

.va-detail[lang="en"]:not(.va-detail--shop) .va-cruise {
  display: flex;
  flex-direction: column;
}

.va-detail[lang="en"]:not(.va-detail--shop) .va-cruise .va-copy {
  position: relative;
  top: auto;
  left: auto;
  order: -1;
  flex: 0 0 auto;
  margin: 0 auto;
  padding-top: 2.2cqw;
  transform: none;
}

.va-detail[lang="en"]:not(.va-detail--shop) .va-cruise .va-video {
  position: relative;
  inset: auto;
  flex: 0 0 auto;
  margin: 24px auto 0;
}

.va-detail[lang="en"]:not(.va-detail--shop) .va-cruise .va-title {
  line-height: 1.15;
}

.va-detail[lang="en"]:not(.va-detail--shop) .va-custom .va-copy {
  top: 2.34cqw;
}

.va-detail[lang="en"]:not(.va-detail--shop) .va-custom .va-description {
  margin-top: 2cqw;
}

.va-detail--shop {
  --va-shop-fs-17: clamp(12px, 1.58vw, 17px);
  --va-shop-fs-19: clamp(14px, 1.766vw, 19px);
  --va-shop-fs-22: clamp(16px, 2.045vw, 22px);
  --va-shop-fs-48: clamp(28px, 4.461vw, 48px);
  --va-shop-fs-51: clamp(24px, 4.748vw, 51px);
  --va-shop-fs-144: clamp(64px, 13.383vw, 144px);
  max-width: 1076px;
}

@media (min-width: 751px) {
  .va-detail--shop {
    --va-title-size: var(--va-shop-fs-48);
    --va-body-size: var(--va-shop-fs-22);
    --va-eyebrow-size: var(--va-shop-fs-17);
    --va-mark-size: var(--va-shop-fs-144);
    --va-name-size: var(--va-shop-fs-51);
    --va-hero-body-size: var(--va-shop-fs-19);
  }

  .va-detail--shop .va-eyebrow {
    top: 6.7cqw;
    letter-spacing: 10px;
  }

  .va-detail--shop .va-hero-title {
    top: 10.6cqw;
    gap: 12px;
  }

  .va-detail--shop .va-mark { letter-spacing: 14px; }
  .va-detail--shop .va-hero-name { letter-spacing: 6px; }

  .va-detail--shop .va-hero-description {
    top: 25.1cqw;
    letter-spacing: 3.8px;
  }

  .va-detail--shop .va-assembly { aspect-ratio: 1076 / 830; }
  .va-detail--shop .va-installation { aspect-ratio: 1076 / 829; }
  .va-detail--shop .va-airflow { aspect-ratio: 1076 / 792; }
  .va-detail--shop .va-cruise { aspect-ratio: 1076 / 857; }

  .va-detail--shop .va-section .va-copy {
    top: 8.921933cqw;
  }

  .va-detail--shop .va-section .va-description {
    margin-top: 3.903346cqw;
  }

  .va-detail--shop .va-section .va-video {
    top: 32.713755cqw;
    left: 5.204461%;
    width: 89.591078%;
    height: 44.423792cqw;
    border-radius: 8px;
  }

  .va-detail--shop .va-installation .va-video { top: 32.620818cqw; }
  .va-detail--shop .va-airflow .va-video { top: 29.182156cqw; }
  .va-detail--shop .va-cruise .va-video { top: 29.553903cqw; height: 44.888476cqw; }
}

@media (max-width: 750px) {
  .va-detail--shop .va-hero {
    background: #080a0e;
  }

  .va-detail--shop .va-hero .va-background {
    padding-top: max(64px, 14cqw);
  }

  .va-detail--shop .va-hero .va-background img {
    aspect-ratio: 1076 / 729;
  }

  .va-detail--shop .va-hero-title {
    top: calc(14cqw + 2px);
  }

  .va-detail--shop .va-assembly,
  .va-detail--shop .va-installation,
  .va-detail--shop .va-airflow,
  .va-detail--shop .va-cruise {
    aspect-ratio: auto;
    padding-bottom: 40px;
  }

  .va-detail--shop .va-section .va-copy {
    padding-top: 40px;
  }
}