/* Cinematic edition of the original XONSOFT hero. */
.edition-2026 .hero--cinematic {
  min-height: max(780px, 100svh);
  background: #010d24;
  align-items: center;
}
.hero--cinematic .hero__mesh {
  background: radial-gradient(ellipse at 4% 60%, #071c36 0%, transparent 60%), #010d24;
}
.edition-2026 .hero--cinematic .hero__mesh::after { opacity: .025; }
.hero--cinematic .hero__glow,
.hero--cinematic .blade,
.hero--cinematic .rail { display: none; }
.hero--cinematic::before {
  content: '';
  position: absolute;
  inset: 0 0 0 51%;
  pointer-events: none;
  background: linear-gradient(107deg, transparent 45%, rgba(253,117,16,.12) 45.1%, rgba(253,117,16,.035) 45.25%, transparent 70%);
}
.edition-2026 .hero--cinematic .hero__body {
  width: 56%;
  max-width: 880px;
  padding: 168px 0 146px var(--pad);
  transform: none;
}
.edition-2026 .hero--cinematic .status {
  margin-bottom: 28px;
  max-width: 95%;
  font-size: 9px;
  line-height: 1.8;
  letter-spacing: .13em;
}
.hero--cinematic .status__dot { flex: 0 0 6px; width: 6px; height: 6px; }
.edition-2026 .hero--cinematic .title {
  font-family: 'Oswald', 'Manrope', sans-serif;
  font-weight: 600;
  line-height: 1.035;
  letter-spacing: -.035em;
}
html .edition-2026 .hero--cinematic .title .line {
  font-size: clamp(62px, 6.8vw, 112px);
  padding-bottom: .035em;
}
.edition-2026 .hero--cinematic .title .t2 {
  color: #fd7510;
  text-shadow: none;
}
html[lang="zh"] .edition-2026 .hero--cinematic .title .line {
  font-family: 'Manrope', sans-serif;
  font-size: clamp(48px, 6.1vw, 92px);
  line-height: 1.2;
  letter-spacing: -.05em;
}
.edition-2026 .hero--cinematic .hero__lead {
  max-width: min(410px, 88%);
  margin-top: 27px;
  font-size: 15px;
  line-height: 1.85;
  color: #a9b6ca;
}
.edition-2026 .hero--cinematic .hero__actions { margin-top: 29px; gap: 22px; }
.edition-2026 .hero--cinematic .btn {
  min-height: 56px;
  padding-inline: 24px;
  font-size: 10px;
  letter-spacing: .09em;
  border-radius: 2px;
}
.hero--cinematic .btn--solid { background: #fd7510; color: #071224; border-color: #fd7510; }
.hero--cinematic .btn--solid svg { transition: transform .25s ease; }
.hero--cinematic .btn--solid:hover svg { transform: translateX(4px); }
.edition-2026 .hero--cinematic .btn--ghost {
  padding-inline: 0;
  border: 0;
  background: transparent;
  color: #d6deeb;
}
.hero--cinematic .btn--ghost::after { content: '↗'; color: #fd7510; font-size: 18px; margin-left: 4px; }
.hero--cinematic .hero__signature {
  max-width: min(410px, 88%);
  border: 0;
  padding-top: 0;
  margin-top: 24px;
  font-size: 10px;
  color: #8a9bb6;
}
.hero--cinematic .hero__signature > :last-child { display: none; }
.hero-motion {
  position: absolute;
  z-index: 3;
  margin: 0;
  width: min(52vw, 840px);
  right: .5%;
  top: 48%;
  transform: translateY(-46%);
  mix-blend-mode: lighten;
}
.hero-motion__stage {
  position: relative;
  aspect-ratio: 1;
  pointer-events: none;
  /* Dissolve the plate's outer edge without masking the mane or chin. */
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 5%, #000 97%, transparent), linear-gradient(transparent, #000 3%, #000 96%, transparent);
  mask-image: linear-gradient(90deg, transparent, #000 5%, #000 97%, transparent), linear-gradient(transparent, #000 3%, #000 96%, transparent);
  -webkit-mask-composite: source-in;
  mask-composite: intersect;
}
.hero-motion__poster, .hero-motion__video {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.hero-motion__video {
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity .5s ease;
}
.hero-motion.is-ready .hero-motion__video { opacity: 1; }
.hero-motion__toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-height: 44px;
  padding: 8px 13px;
  position: absolute;
  right: 10%;
  bottom: 8%;
  background: rgba(1,13,36,.75);
  border: 1px solid rgba(167,183,210,.2);
  border-radius: 24px;
  color: #b6c2d5;
  font: 500 10px/1.4 'Manrope', sans-serif;
  cursor: pointer;
  transition: border-color .2s, color .2s;
}
.hero-motion__toggle[hidden] { display: none; }
.hero-motion__toggle:hover { color: #fff; border-color: #fd7510; }
.hero-motion__toggle:focus-visible { outline: 2px solid #fd7510; outline-offset: 5px; }
.hero-motion__pause { display: none; }
[data-motion-action="pause"] .hero-motion__pause { display: block; }
[data-motion-action="pause"] .hero-motion__play { display: none; }
.hero--cinematic .hero__footer { bottom: 30px; padding-top: 22px; }
.hero--cinematic .hero__footer a { font-size: 10px; }

@media (min-width: 1700px) {
  .edition-2026 .hero--cinematic .hero__body { width: 54%; padding-left: max(var(--pad), calc((100vw - 1660px) / 2)); }
  .hero-motion { right: max(1%, calc((100vw - 1720px) / 2)); }
}
@media (min-width: 641px) and (max-width: 1080px) {
  .edition-2026 .hero--cinematic { min-height: max(770px, 100svh); }
  .edition-2026 .hero--cinematic .hero__body { width: 56%; padding-top: 145px; padding-bottom: 130px; }
  html .edition-2026 .hero--cinematic .title .line { font-size: clamp(46px, 6.7vw, 72px); }
  .edition-2026 .hero--cinematic .hero__lead { font-size: 13px; max-width: 94%; }
  .edition-2026 .hero--cinematic .status { font-size: 8px; max-width: 94%; letter-spacing: .08em; }
  .edition-2026 .hero--cinematic .hero__actions { align-items: flex-start; gap: 6px 18px; }
  .edition-2026 .hero--cinematic .btn { font-size: 9px; padding-inline: 18px; min-height: 50px; }
  .edition-2026 .hero--cinematic .btn--ghost { padding-inline: 0; }
  .hero-motion { width: 55vw; right: 0; transform: translateY(-55%); }
  .hero-motion__toggle { bottom: -25px; right: 12%; }
  .hero--cinematic .hero__coordinates { display: none; }
}
@media (max-width: 640px) {
  .edition-2026 .hero--cinematic {
    display: grid;
    grid-template-columns: minmax(0,1fr);
    min-height: 0;
    padding: 114px var(--pad) 28px;
    align-items: start;
  }
  .hero--cinematic::before { inset: 15% -50% 20% 0; opacity: .5; }
  .edition-2026 .hero--cinematic .hero__body { display: contents; }
  .hero--cinematic .status, .hero--cinematic .title,
  .hero--cinematic .hero__lead, .hero--cinematic .hero__actions,
  .hero--cinematic .hero__signature { position: relative; z-index: 5; }
  .edition-2026 .hero--cinematic .status { grid-row: 1; margin-bottom: 20px; font-size: 8px; max-width: 100%; letter-spacing: .06em; }
  .hero--cinematic .title { grid-row: 2; }
  html .edition-2026 .hero--cinematic .title .line { font-size: clamp(44px, 12.3vw, 72px); line-height: 1.035; }
  html[lang="zh"] .edition-2026 .hero--cinematic .title .line { font-size: 12vw; }
  .hero-motion {
    grid-row: 3;
    position: relative;
    width: min(108%, 450px);
    justify-self: center;
    right: auto;
    top: auto;
    transform: none;
    margin: -4px -4% 0;
    padding-bottom: 18px;
  }
  .hero-motion__toggle { bottom: 3px; right: 3%; min-height: 40px; font-size: 9px; }
  .edition-2026 .hero--cinematic .hero__lead { grid-row: 4; margin-top: 14px; max-width: 100%; font-size: 13px; line-height: 1.8; }
  .edition-2026 .hero--cinematic .hero__actions { grid-row: 5; margin-top: 24px; gap: 18px; }
  .edition-2026 .hero--cinematic .btn { flex: none; min-height: 52px; padding-inline: 18px; font-size: 9px; }
  .edition-2026 .hero--cinematic .btn--ghost { padding-inline: 0; }
  .hero--cinematic .hero__signature { grid-row: 6; max-width: 100%; margin-top: 19px; font-size: 9px; }
  .hero--cinematic .hero__footer { grid-row: 7; position: relative; inset: auto; margin-top: 33px; padding-top: 20px; font-size: 9px; gap: 12px; }
  .hero--cinematic .hero__footer a { font-size: 9px; gap: 8px; }
  .hero--cinematic .hero__coordinates { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .hero-motion__video { transition: none; }
  .hero--cinematic .btn--solid:hover svg { transform: none; }
}
