/* 首页 · 首屏、数据条、合作层级、G2 */

/* 首屏轮播 */
.hero { position: relative; height: 100vh; height: 100svh; min-height: 620px; max-height: 1080px; overflow: hidden; background: #000; touch-action: pan-y; }
.slide { position: absolute; inset: 0; opacity: 0; visibility: hidden; transition: opacity 900ms var(--ease), visibility 0s linear 900ms; }
.slide.is-active { opacity: 1; visibility: visible; transition-delay: 0s; z-index: 1; }
.slide__media { position: absolute; inset: 0; }
.slide__media > img { width: 100%; height: 100%; object-fit: cover; }
.slide.is-active .slide__media > img { animation: kenburns 8s var(--ease) both; }
@keyframes kenburns { from { transform: scale(1.06); } to { transform: scale(1); } }
.slide__media::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(rgb(4 7 11 / 0.62), rgb(4 7 11 / 0.12) 42%, transparent 62%, rgb(4 7 11 / 0.55));
}
.slide__media--stage { background: radial-gradient(70% 60% at 50% 78%, #3a4657, #141c27 58%, #06090d); }
.slide__media--stage::after { background: none; }
.slide__media--stage > img {
  position: absolute; left: 50%; bottom: 8%; width: auto; height: min(46%, 100% - 440px); max-width: 86vw; translate: -50% 0;
  object-fit: contain; filter: drop-shadow(0 40px 50px rgb(0 0 0 / 0.5));
}
.slide.is-active .slide__media--stage > img { animation: rise 1.4s var(--ease) both; }
@keyframes rise { from { opacity: 0; transform: translateY(40px); } to { opacity: 1; transform: none; } }

.slide__copy {
  position: relative; z-index: 2; text-align: center; display: grid; justify-items: center; gap: var(--s-4);
  padding-top: calc(var(--header-h) + clamp(40px, 9vh, 112px));
}
.slide__copy h1, .slide__copy h2 { font-size: var(--fs-hero); text-shadow: 0 2px 30px rgb(0 0 0 / 0.25); }
.slide__media--render + .slide__copy :is(h1, h2, .slide__sub), .slide__media--stage + .slide__copy :is(h1, h2, .slide__sub) { text-shadow: none; }
.slide__copy .num-title { font-size: clamp(48px, 7vw, 104px); letter-spacing: 0.01em; line-height: 1; }
.slide__sub { font-size: var(--fs-lead); color: var(--ink-mid); letter-spacing: 0.06em; text-shadow: 0 1px 14px rgb(0 0 0 / 0.45); }
.slide__copy .links { justify-content: center; margin-top: var(--s-3); }
.slide__copy .link-more { color: var(--ink-hi); transition: color var(--t-fast) var(--ease); }
.slide__copy .link-more:hover { color: var(--brand-hi); }
.slide.is-active .slide__copy > * { animation: copyIn 1s var(--ease) both; }
.slide.is-active .slide__copy > :nth-child(2) { animation-delay: 80ms; }
.slide.is-active .slide__copy > :nth-child(3) { animation-delay: 160ms; }
.slide.is-active .slide__copy > :nth-child(4) { animation-delay: 240ms; }
@keyframes copyIn { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }

.hero__ctrl { position: absolute; z-index: 3; inset: auto 0 clamp(24px, 4vh, 40px); display: flex; justify-content: center; gap: 10px; }
.hero__dot { width: 36px; height: 20px; position: relative; }
.hero__dot::before, .hero__dot::after { content: ""; position: absolute; left: 0; top: 9px; height: 2px; border-radius: 2px; }
.hero__dot::before { right: 0; background: rgb(255 255 255 / 0.3); }
.hero__dot::after { width: 0; background: #fff; }
.hero__dot[aria-current="true"]::after { width: 100%; }
.hero.is-playing .hero__dot[aria-current="true"]::after { animation: fill var(--dur, 6500ms) linear both; }
.hero.is-paused .hero__dot[aria-current="true"]::after { animation-play-state: paused; }
@keyframes fill { from { width: 0; } to { width: 100%; } }
.hero__arrow {
  position: absolute; z-index: 3; top: 50%; translate: 0 -50%; width: 48px; height: 48px; border-radius: 50%;
  display: grid; place-items: center; color: #fff; background: rgb(255 255 255 / 0.08);
  opacity: 0; transition: opacity var(--t-fast) var(--ease), background-color var(--t-fast) var(--ease);
}
.hero:hover .hero__arrow, .hero__arrow:focus-visible { opacity: 1; }
.hero__arrow:hover { background: rgb(255 255 255 / 0.18); }
.hero__arrow svg { width: 18px; height: 18px; }
/* 第 1 屏：机器人在画面正中，PC 端文案靠左，避开机身 */
@media (min-width: 721px) {
  .slide--left .slide__copy { text-align: left; justify-items: start; padding-top: calc(var(--header-h) + clamp(32px, 6vh, 96px)); }
  .slide--left .slide__copy .links { justify-content: flex-start; }
  .slide--left .slide__media::after {
    background: linear-gradient(90deg, rgb(4 7 11 / 0.6), rgb(4 7 11 / 0.18) 42%, transparent 60%),
      linear-gradient(rgb(4 7 11 / 0.55), rgb(4 7 11 / 0.1) 42%, transparent 62%, rgb(4 7 11 / 0.55));
  }
}
.hero__arrow--prev { left: var(--gutter); }
.hero__arrow--next { right: var(--gutter); }
:root[data-hero="single"] .slide:not(:first-child), :root[data-hero="single"] .hero__ctrl,
:root[data-hero="single"] .hero__arrow { display: none; }
@media (prefers-reduced-motion: reduce) {
  .slide.is-active .slide__media > img, .slide.is-active .slide__copy > *, .slide.is-active .slide__media--stage > img { animation: none; }
}
@media (max-width: 720px) {
  .hero { height: calc(100svh - var(--mbar-h)); min-height: 560px; }
  /* 竖屏裁切后主体居中，文案上移、加深顶部渐变，避免压在机器人上 */
  .slide__copy { gap: var(--s-3); padding-top: calc(var(--header-h) + clamp(24px, 4vh, 40px)); }
  .slide__copy h1, .slide__copy h2:not(.num-title) { font-size: clamp(26px, 7.6vw, 36px); }
  .slide__media:not(.slide__media--stage)::after {
    background: linear-gradient(rgb(4 7 11 / 0.72), rgb(4 7 11 / 0.4) 40%, transparent 58%, rgb(4 7 11 / 0.5));
  }
  .slide__media--stage > img { width: 92vw; height: auto; max-width: none; bottom: 14%; }
  .hero__arrow { display: none; }
}
