/* V27 bilingual layout, contrast and mobile closure. */

html[lang="en"] body.v22,
html[lang="en"] body.v22 button,
html[lang="en"] body.v22 input,
html[lang="en"] body.v22 select {
  letter-spacing: 0;
}

body.v22 .dark-sec .cnsub,
body.v22 .dark-sec .cap,
body.v22 .dark-sec p,
body.v22 .xhero .lead,
body.v22 .v10-lineup-hero p,
body.v22 .hbg-features .lead,
body.v22 .hbg-materials .lead,
body.v22 .hbg-scenarios .lead,
body.v22 .hbg-story .lead,
body.v22 .hbg-crowd .lead {
  color: #c9d6e6 !important;
}

body.v22 .soft p,
body.v22 .card p,
body.v22 .sub,
body.v22 .lead2,
body.v22 .matrixnotice,
body.v22 .configvisualmeta small {
  color: #4e6076;
}

body.v22 footer .sub,
body.v22 footer p,
body.v22 footer a {
  color: #c1ccda;
}

body.v22 .btn,
body.v22 button,
body.v22 a {
  overflow-wrap: normal;
}

body.v22 [hidden] {
  display: none !important;
}

html[lang="en"] body.v22 .btn,
html[lang="en"] body.v22 button {
  line-height: 1.3;
}

@media (max-width: 820px) {
  body.v22 .xhero > .note,
  body.v22 [class*="hbg-"] > .note {
    box-sizing: border-box !important;
    right: 20px !important;
    left: 20px !important;
    width: auto !important;
    max-width: none !important;
    min-height: 34px !important;
    padding: 8px 12px !important;
    white-space: normal !important;
    line-height: 1.35 !important;
    text-align: left !important;
  }

  body.v22.v20-page-home .xhero.home::after {
    height: auto !important;
    aspect-ratio: 27 / 19;
    background-image: image-set(
      url("/assets/v24-ai/home-hero-mobile-v28.avif") type("image/avif"),
      url("/assets/v46/media/home-hero-mobile-v28-8841c7da.webp") type("image/webp")
    ) !important;
    background-position: center !important;
    background-size: contain !important;
  }

  html[lang="en"] body.v22.v20-page-home .xhero.home h1 {
    font-size: 34px !important;
    line-height: 1.03 !important;
  }

  html[lang="en"] body.v22.v20-page-home .xhero.home .lead {
    font-size: 14px !important;
    line-height: 1.6 !important;
  }

  body.v22 .xstats > div {
    min-width: 0 !important;
  }

  body.v22 .xstats b,
  body.v22 .xstats small {
    white-space: nowrap !important;
  }

  body.v22 .v22-table-scroll {
    position: relative;
    max-width: 100%;
    padding-bottom: 6px;
    overscroll-behavior-inline: contain;
    scrollbar-width: thin;
  }

  body.v22 .v22-table-scroll::before {
    content: "左右滑动查看完整参数 →";
    position: sticky;
    left: 0;
    display: block;
    width: max-content;
    margin: 0 0 7px;
    color: #52657d;
    font-size: 11px;
    font-weight: 750;
  }

  html[lang="en"] body.v22 .v22-table-scroll::before {
    content: "Swipe to view the full table →";
  }

  body.v22.v20-page-etxa-plus-buy .pdthumbs {
    display: flex !important;
    gap: 8px !important;
    margin: 10px -16px 0 0 !important;
    padding: 0 16px 8px 0 !important;
    overflow-x: auto !important;
    scroll-snap-type: x proximity;
    scrollbar-width: thin;
  }

  body.v22.v20-page-etxa-plus-buy .pdthumb {
    flex: 0 0 auto !important;
    width: auto !important;
    max-width: 168px !important;
    min-height: 42px !important;
    padding: 9px 13px !important;
    scroll-snap-align: start;
    white-space: normal !important;
  }

  body.v22.v20-page-etxa-plus-buy .pdmain {
    width: 100% !important;
    max-width: 100% !important;
    aspect-ratio: 16 / 9 !important;
    background: #e7edf2 !important;
  }

  body.v22.v20-page-etxa-plus-buy .pdmain img {
    width: 100% !important;
    height: 100% !important;
    aspect-ratio: auto !important;
    object-fit: contain !important;
    object-position: center !important;
  }

  body.v22.v20-page-etxa-plus-buy .buywrap,
  body.v22.v20-page-etxa-plus-buy .pdgal,
  body.v22.v20-page-etxa-plus-buy .buypanel {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  body.v22.v20-page-configurator .shopbar {
    display: none !important;
  }

  body.v22.v20-page-store .v20-commerce-jump,
  body.v22.v20-page-store .seriesfilter {
    overscroll-behavior-inline: contain;
    scroll-snap-type: x proximity;
  }

  body.v22.v20-page-store .v20-commerce-jump a,
  body.v22.v20-page-store .seriesfilter button {
    scroll-snap-align: start;
  }

  body.v22.v20-page-store .v20-commerce-jump a[aria-current="true"] {
    border-color: #216bd5 !important;
    color: #155dbf !important;
  }

  body.v22.v20-page-etxa-plus .angles figcaption {
    background: #ffffff !important;
    color: #314258 !important;
  }

  body.v22.v20-page-configurator .config-pdp-section {
    padding-top: 12px !important;
  }

  body.v22.v20-page-configurator .configcrumbs,
  body.v22.v20-page-etxa-plus-buy .crumbs {
    display: flex;
    align-items: center;
    gap: 7px;
    overflow-x: auto;
    padding: 0 0 10px !important;
    white-space: nowrap;
    scrollbar-width: none;
  }

  html[lang="en"] body.v22.v20-page-configurator .configpanel h1 {
    font-size: 30px !important;
    line-height: 1.08 !important;
  }

  body.v22 .mobilecta a,
  body.v22 .mobilecta button {
    min-width: 0;
    white-space: normal;
    text-align: center;
  }
}

@media (max-width: 430px) {
  body.v22 .nav .brandlock {
    min-width: 0;
  }

  body.v22 .nav .btxt {
    font-size: 18px !important;
  }

  body.v22 .nav .langsw {
    flex: 0 0 auto;
  }

  html[lang="en"] body.v22 .herofeats span,
  html[lang="en"] body.v22 .xstats b,
  html[lang="en"] body.v22 .xstats small {
    font-size: 11px !important;
  }
}