/* 行者无疆 — sub-page layouts（联系我们等子页）
   Loads after style.css and reuses its tokens & shared classes. */

/* nav on sub-pages is always solid (content is light, starts under nav) */
body:not(.home) .nav.scrolled { background: rgba(255,255,255,.82); }

/* page hero */
.phero { position: relative; overflow: hidden; min-height: 74vh; display: flex; align-items: center; padding: 110px 0 64px; }
.hero-canvas { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
/* 文字区白色渐变垫底：左侧文字清晰，右侧保留装饰画布 */
.phero::after { content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none; background: linear-gradient(90deg, var(--bg) 0%, rgba(255,255,255,.88) 42%, rgba(255,255,255,0) 70%); }
.phero .edge { position: relative; z-index: 1; }
.phero .eyebrow { color: var(--accent); }
.phero h1 { font-family: var(--cn); font-weight: 700; font-size: clamp(40px, 6vw, 74px); line-height: 1.08; letter-spacing: -.01em; margin-top: 16px; }
.phero .lead { margin-top: 22px; font-size: 19px; line-height: 1.75; color: var(--ink-2); max-width: 640px; }

/* contact — full-screen hero + figure/form split + close band */
.contact-canvas { position: fixed; inset: 0; z-index: 1; pointer-events: none; }
.contact-backdrop { position: fixed; inset: 0; z-index: 0; background: var(--bg-dark); opacity: 0; pointer-events: none; }
.contact-hero { position: relative; overflow: hidden; min-height: 100vh; min-height: 100svh; display: flex; align-items: center; }
.contact-hero-in { position: relative; z-index: 2; }
.contact-hero-in .eyebrow { color: var(--accent); }
.contact-hero-in h1 { font-family: var(--cn); font-weight: 700; font-size: clamp(40px, 6vw, 74px); line-height: 1.08; letter-spacing: -.01em; margin-top: 16px; max-width: 15ch; }
.contact-hero-in .lead { margin-top: 22px; font-size: 19px; line-height: 1.75; color: var(--ink-2); max-width: 560px; }

.contact-main { position: relative; z-index: 2; padding: 8vh 0 12vh; }
.contact-main-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: center; }
.contact-stage { position: relative; min-height: 64vh; }
.contact-panel { display: flex; flex-direction: column; gap: 30px; }
.contact-form { display: flex; flex-direction: column; gap: 16px; border: 1px solid var(--line); border-radius: var(--r); padding: 30px; background: color-mix(in srgb, var(--bg) 80%, transparent); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); }
.cf-head { font-family: var(--cn); font-weight: 700; font-size: 18px; color: var(--ink); margin-bottom: 2px; }
.contact-info { display: flex; flex-wrap: wrap; justify-content: center; gap: 22px 52px; text-align: center; }
.ci-item .ci-k { font-family: var(--sans); font-size: 12px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--ink-3); }
.ci-item .ci-v { margin-top: 8px; font-size: 15.5px; line-height: 1.6; color: var(--ink); }
.ci-item .ci-v a { border-bottom: 1px solid var(--line); }
.cf-row { display: flex; flex-direction: column; gap: 8px; }
.cf-row span { font-size: 13.5px; font-weight: 600; color: var(--ink); }
.cf-row input, .cf-row textarea { font-family: var(--cn); font-size: 15px; color: var(--ink); background: #fff; border: 1px solid var(--line); border-radius: 10px; padding: 12px 14px; outline: none; transition: border-color .2s; resize: vertical; }
.cf-row input:focus, .cf-row textarea:focus { border-color: var(--accent); }
.contact-form .btn { margin-top: 6px; align-self: flex-start; }
.contact-form .btn:disabled { opacity: 1; background: var(--accent); cursor: default; }
.cf-error { display: none; font-size: 13.5px; color: #c0392b; }
.cf-error.show { display: block; }

.contact-close { position: relative; z-index: 2; min-height: 92vh; display: flex; align-items: flex-end; justify-content: center; padding-bottom: 130px; color: #fff; }
.contact-close-in { display: flex; flex-direction: column; align-items: center; gap: 30px; text-align: center; }
.contact-close-line { font-family: var(--cn); font-weight: 700; font-size: clamp(34px, 5vw, 60px); line-height: 1.1; letter-spacing: -.01em; color: #fff; }
.contact-close .contact-info { margin-top: 4px; }
.contact-close .ci-k { color: #8a8a95; }
.contact-close .ci-v { color: #e7e7ec; }
.contact-close .ci-v a { color: #e7e7ec; border-bottom-color: rgba(255,255,255,.32); }

/* automotive full-screen hero with morphing particle field (car → key → shield) */
.auto-hero { position: relative; overflow: hidden; min-height: 100vh; min-height: 100svh; display: flex; align-items: center; }
.auto-hero-canvas { position: fixed; inset: 0; z-index: 0; pointer-events: none; }
.auto-hero-in { position: relative; z-index: 1; }
.auto-hero-in .eyebrow { color: var(--accent); }
.auto-hero-in h1 { font-family: var(--cn); font-weight: 700; font-size: clamp(40px, 6vw, 74px); line-height: 1.08; letter-spacing: -.01em; margin-top: 16px; }
.auto-hero-in .lead { margin-top: 22px; font-size: 19px; line-height: 1.75; color: var(--ink-2); max-width: 640px; }
@media (max-width: 900px) {
  .auto-hero { min-height: 100vh; align-items: flex-end; padding-bottom: 14vh; }
  .auto-hero-canvas { opacity: .9; }
}

/* 小屏弱化 hero 装饰画布，避免与标题重叠抢眼 */
@media (max-width: 760px) {
  .phero .hero-canvas { opacity: .45; }
}

/* digital-key app showcase (Automotive flagship) */
.dk-sec { position: relative; z-index: 1; background: var(--bg-soft); border-top: 1px solid var(--line); padding: 110px 0; }
.dk-top { display: grid; grid-template-columns: 1.05fr .95fr; gap: 56px; align-items: center; }
.dk-intro .eyebrow { color: var(--accent); }
.dk-intro h2 { font-family: var(--cn); font-weight: 700; font-size: clamp(30px, 4vw, 50px); line-height: 1.1; letter-spacing: -.01em; margin-top: 14px; }
.dk-intro p { margin-top: 18px; font-size: 17px; line-height: 1.7; color: var(--ink-2); max-width: 490px; }
.dk-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 18px 28px; margin-top: 34px; }

/* App Store badge */
.store-badge { display: inline-flex; align-items: center; gap: 11px; background: #0c0c0e; color: #fff; border-radius: 13px; padding: 10px 18px 10px 15px; text-decoration: none; transition: transform .2s ease, background .2s ease; }
.store-badge:hover { transform: translateY(-2px); background: #1d1d22; }
.store-apple { width: 25px; height: 25px; margin-bottom: 2px; }
.store-txt { display: flex; flex-direction: column; line-height: 1.16; }
.store-txt small { font-family: var(--sans); font-size: 10px; letter-spacing: .03em; opacity: .82; }
.store-txt strong { font-family: var(--cn); font-weight: 600; font-size: 18px; letter-spacing: .01em; }

/* APK QR */
.dk-qr { display: inline-flex; align-items: center; gap: 13px; }
.dk-qr-box { width: 88px; height: 88px; background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 8px; display: grid; place-items: center; }
.dk-qr-img { display: block; width: 100% !important; height: 100% !important; }
.dk-qr-cap { display: flex; flex-direction: column; line-height: 1.35; }
.dk-qr-cap strong { font-family: var(--cn); font-weight: 600; font-size: 14px; color: var(--ink); white-space: nowrap; }
.dk-qr-cap span { font-size: 12.5px; color: var(--ink-3); white-space: nowrap; }

/* device card */
.dk-device-wrap { justify-self: center; width: 100%; max-width: 360px; }
.dk-device { border-radius: 22px; overflow: hidden; background: #ececed; border: 1px solid var(--line); box-shadow: 0 30px 60px -34px rgba(20,20,30,.4); }
.dk-device img { width: 100%; display: block; }
.dk-device-cap { margin-top: 16px; display: flex; align-items: baseline; gap: 11px; }
.dk-device-cap strong { font-family: var(--sans); font-weight: 700; font-size: 16px; letter-spacing: .06em; color: var(--ink); }
.dk-device-cap span { font-size: 14px; color: var(--ink-2); }

/* app screenshots row */
.dk-phones { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; margin-top: 72px; }
.dk-phone { margin: 0; }
.dk-phone-screen { aspect-ratio: 460 / 995; border-radius: 26px; overflow: hidden; background: #fff; border: 1px solid var(--line); box-shadow: 0 26px 52px -26px rgba(20,20,30,.36); }
.dk-phone-screen img { width: 100%; height: 100%; object-fit: cover; display: block; }
.dk-phone figcaption { margin-top: 16px; display: flex; flex-direction: column; gap: 3px; }
.dk-phone figcaption strong { font-family: var(--cn); font-weight: 700; font-size: 15px; color: var(--ink); }
.dk-phone figcaption span { font-size: 13px; color: var(--ink-3); }

@media (max-width: 900px) {
  .dk-sec { padding: 72px 0; }
  .dk-top { grid-template-columns: 1fr; gap: 40px; }
  .dk-device-wrap { max-width: 300px; }
  .dk-phones { grid-template-columns: 1fr 1fr; gap: 20px 18px; margin-top: 48px; }
}

/* ride-hailing safety solution */
.rh-sec { position: relative; z-index: 1; background: var(--bg); border-top: 1px solid var(--line); padding: 110px 0; }
.tr-sec { background: var(--bg-soft); }
.rh-head { max-width: 760px; }
.rh-head .eyebrow { color: var(--accent); }
.rh-head h2 { font-family: var(--cn); font-weight: 700; font-size: clamp(30px, 4vw, 50px); line-height: 1.1; letter-spacing: -.01em; margin-top: 14px; }
.rh-head p { margin-top: 18px; font-size: 17px; line-height: 1.7; color: var(--ink-2); }

/* browser-window framed screenshots */
.rh-shots { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; margin-top: 54px; align-items: start; }
.rh-win { margin: 0; border: 1px solid var(--line); border-radius: 14px; overflow: hidden; background: #fff; box-shadow: 0 30px 60px -36px rgba(20,20,30,.4); }
.rh-win-bar { display: flex; align-items: center; gap: 7px; padding: 11px 14px; border-bottom: 1px solid var(--line); background: var(--bg-soft); }
.rh-win-bar i { width: 10px; height: 10px; border-radius: 50%; background: #d2d2d8; flex: none; }
.rh-url { margin-left: 10px; flex: 1; max-width: 280px; height: 22px; display: flex; align-items: center; padding: 0 11px; background: #fff; border: 1px solid var(--line); border-radius: 7px; font-family: var(--sans); font-size: 11.5px; color: var(--ink-3); overflow: hidden; white-space: nowrap; }
.rh-win-shot { background: #fff; }
.rh-win-shot img { width: 100%; display: block; }
.rh-win figcaption { padding: 16px 18px 18px; border-top: 1px solid var(--line); display: flex; flex-direction: column; gap: 3px; }
.rh-win figcaption strong { font-family: var(--cn); font-weight: 700; font-size: 15.5px; color: var(--ink); }
.rh-win figcaption span { font-size: 13px; color: var(--ink-3); }

/* detection tags */
.rh-tags { margin-top: 38px; }
.rh-tags-label { display: block; font-family: var(--sans); font-size: 12px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-3); margin-bottom: 16px; }
.rh-tag-list { display: flex; flex-wrap: wrap; gap: 10px; }
.rh-tag { display: inline-flex; align-items: center; gap: 9px; font-family: var(--cn); font-size: 14.5px; color: var(--ink); background: var(--bg-soft); border: 1px solid var(--line); border-radius: 999px; padding: 8px 16px; line-height: 1.2; transition: border-color .2s, background .2s; }
.rh-tag::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--accent); flex: none; }
.rh-tag:hover { border-color: color-mix(in srgb, var(--accent) 45%, var(--line)); background: #fff; }
.rh-tag-more { color: var(--ink-3); background: transparent; }
.rh-tag-more::before { display: none; }

@media (max-width: 900px) {
  .rh-sec { padding: 72px 0; }
  .rh-shots { grid-template-columns: 1fr; gap: 24px; }
}

/* consumer landing — product cards + shop highlight band */
.phero .intro { margin-top: 18px; font-size: 16.5px; color: var(--ink-2); max-width: 32em; }
.scards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; margin-top: 44px; }
.scard { background: #fff; border: 1px solid var(--line); border-radius: var(--r); overflow: hidden; transition: transform .25s, box-shadow .25s, opacity .8s cubic-bezier(.2,.7,.2,1); }
.scard:hover { transform: translateY(-5px); box-shadow: 0 18px 44px -28px rgba(0,0,0,.32); }
.scard-media { aspect-ratio: 5/3; position: relative; display: grid; place-items: center; }
.scard-media img { width: 44%; border-radius: 18px; box-shadow: 0 16px 36px -18px rgba(0,0,0,.25); }
.scard-body { padding: 20px 22px 24px; }
.scard-body h3 { font-family: var(--cn); font-weight: 700; font-size: 19px; }
.scard-body p { color: var(--ink-2); font-size: 14.5px; line-height: 1.6; margin-top: 8px; }
.tlink { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; font-size: 14.5px; color: var(--ink); position: relative; }
.tlink .ar { font-family: var(--sans); transition: transform .2s; }
.scard:hover .tlink .ar { transform: translateX(4px); }

.hl { background: var(--bg-dark); color: #eef2f4; padding: 86px 0; position: relative; overflow: hidden; z-index: 1; }
.hl::after { content: ""; position: absolute; right: -6%; top: -30%; width: 46vw; height: 46vw; background: radial-gradient(circle, rgba(43,123,228,.16), transparent 60%); pointer-events: none; }
.hl-inner { position: relative; display: grid; grid-template-columns: 1.3fr 1fr; gap: 56px; align-items: center; }
.hl-eyebrow { display: inline-flex; align-items: center; gap: 9px; font-family: var(--sans); font-size: 13px; font-weight: 700; color: #69a9ff; letter-spacing: .08em; }
.hl-eyebrow::before { content: ""; width: 18px; height: 2px; background: #69a9ff; border-radius: 2px; }
.hl h2 { font-family: var(--cn); font-weight: 700; color: #fff; font-size: clamp(26px, 3vw, 38px); margin: 14px 0 12px; }
.hl p { color: rgba(255,255,255,.8); font-size: 16px; max-width: 42ch; line-height: 1.7; }
.hl-cta { margin-top: 26px; }
.hl .btn-primary { background: var(--accent); }
.hl .btn-primary:hover { background: var(--accent-ink); }
.hl-points { list-style: none; display: flex; flex-direction: column; border-top: 1px solid rgba(255,255,255,.16); }
.hl-points li { display: flex; align-items: center; gap: 14px; padding: 17px 0; border-bottom: 1px solid rgba(255,255,255,.12); font-size: 15px; }
.hl-points .hk { font-family: var(--serif); color: #69a9ff; font-size: 18px; }

@media (max-width: 980px) {
  .scards { grid-template-columns: 1fr 1fr; }
  .hl-inner { grid-template-columns: 1fr; gap: 34px; }
}
@media (max-width: 640px) {
  .scards { grid-template-columns: 1fr; }
}

/* product summary pages — photo grid + hero actions */
.phero-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; margin-top: 32px; }
.phero-note { font-size: 13.5px; color: var(--ink-3); }
.pgrid { display: grid; gap: 16px; margin-top: 44px; }
.pgrid-2 { grid-template-columns: 1fr 1fr; }
.pgrid-4 { grid-template-columns: repeat(4, 1fr); }
.pgrid .ph { border-radius: var(--r); overflow: hidden; background: var(--bg-soft); border: 1px solid var(--line); aspect-ratio: 1; }
.pgrid .ph img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pgrid .ph-video { aspect-ratio: 16 / 9; grid-column: 1 / -1; background: #0a0a0c; }
.pgrid .ph-video video { width: 100%; height: 100%; object-fit: contain; display: block; }
@media (max-width: 900px) {
  .pgrid-4 { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 560px) {
  .pgrid-2 { grid-template-columns: 1fr; }
}

/* product video showcase band */
.media-band { background: var(--bg-soft); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 96px 0; }
.media-band-grid { display: grid; grid-template-columns: 1.05fr .95fr; gap: 52px; align-items: center; }
.media-band-grid .mb-text .eyebrow { color: var(--accent); }
.media-band-grid .mb-text h2 { font-family: var(--cn); font-weight: 700; font-size: clamp(28px, 3.6vw, 44px); line-height: 1.12; letter-spacing: -.01em; margin-top: 14px; }
.media-band-grid .mb-text p { margin-top: 18px; font-size: 16.5px; line-height: 1.75; color: var(--ink-2); max-width: 44ch; }
.media-band video { width: 100%; display: block; border-radius: var(--r); background: #0a0a0c; box-shadow: 0 30px 60px -36px rgba(20,20,30,.4); }
@media (max-width: 880px) {
  .media-band { padding: 64px 0; }
  .media-band-grid { grid-template-columns: 1fr; gap: 30px; }
}

/* featured plants + plant-living article cards */
.oz-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; flex-wrap: wrap; }
.oz-head .eyebrow { color: var(--accent); }
.oz-head h2 { font-family: var(--cn); font-weight: 700; font-size: clamp(26px, 3.2vw, 40px); letter-spacing: -.01em; margin-top: 12px; }
.oz-more { display: inline-flex; align-items: center; gap: 7px; font-weight: 600; font-size: 14.5px; color: var(--accent); }
.oz-more .ar { font-family: var(--sans); transition: transform .2s; }
.oz-more:hover .ar { transform: translateX(4px); }
.oz-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-top: 36px; }
.oz-card { display: block; border: 1px solid var(--line); border-radius: var(--r); padding: 26px 24px; background: #fff; transition: box-shadow .25s, transform .25s, border-color .25s, opacity .8s cubic-bezier(.2,.7,.2,1); }
.oz-card:hover { box-shadow: 0 18px 44px -28px rgba(0,0,0,.3); transform: translateY(-3px); border-color: color-mix(in srgb, var(--accent) 35%, var(--line)); }
.oz-tag { display: inline-block; font-family: var(--sans); font-size: 12px; font-weight: 600; letter-spacing: .04em; color: var(--accent); background: color-mix(in srgb, var(--accent) 9%, #fff); border: 1px solid color-mix(in srgb, var(--accent) 26%, var(--line)); border-radius: 999px; padding: 4px 12px; }
.oz-card h4 { font-family: var(--cn); font-weight: 700; font-size: 20px; margin-top: 16px; }
.oz-card .oz-date { font-family: var(--sans); font-size: 12.5px; letter-spacing: .03em; color: var(--ink-3); }
.oz-card p { color: var(--ink-2); font-size: 14px; line-height: 1.65; margin-top: 10px; }
@media (max-width: 900px) { .oz-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .oz-grid { grid-template-columns: 1fr; } }

/* legal / 协议与说明 文档页 */
.doc-hero .doc-crumb { font-family: var(--sans); font-size: 13px; color: var(--ink-3); display: flex; align-items: center; gap: 10px; }
.doc-hero .doc-crumb a { color: var(--ink-2); }
.doc-hero .doc-crumb a:hover { color: var(--accent); }
.doc-hero .doc-crumb .sep { color: var(--ink-3); opacity: .5; }
.doc-hero .doc-title { font-family: var(--cn); font-weight: 700; font-size: clamp(30px, 4.4vw, 52px); line-height: 1.12; letter-spacing: -.01em; margin-top: 14px; }
.doc-sec { padding-top: 40px; }
.doc-prose { max-width: 820px; }
.doc-prose > :first-child { margin-top: 0; }
.doc-prose h2 { font-family: var(--cn); font-weight: 700; font-size: clamp(20px, 2.4vw, 26px); letter-spacing: -.01em; margin: 44px 0 14px; padding-top: 20px; border-top: 1px solid var(--line); }
.doc-prose h3 { font-family: var(--cn); font-weight: 700; font-size: 17px; color: var(--ink); margin: 26px 0 10px; }
.doc-prose p { font-size: 15.5px; line-height: 1.85; color: var(--ink-2); margin: 12px 0; }
.doc-prose strong { color: var(--ink); font-weight: 700; }
.doc-prose a { color: var(--accent); border-bottom: 1px solid color-mix(in srgb, var(--accent) 30%, transparent); }
.doc-prose ul, .doc-prose ol { margin: 12px 0; padding-left: 22px; }
.doc-prose li { font-size: 15.5px; line-height: 1.8; color: var(--ink-2); margin: 6px 0; }
.doc-prose li::marker { color: var(--ink-3); }
.doc-prose blockquote { margin: 18px 0; padding: 12px 18px; border-left: 3px solid var(--accent); background: var(--bg-soft); border-radius: 0 8px 8px 0; color: var(--ink-2); }
.doc-prose hr { border: 0; border-top: 1px solid var(--line); margin: 30px 0; }
.doc-prose figure { margin: 16px 0; }
.doc-prose img { max-width: 300px; height: auto; display: block; border: 1px solid var(--line); border-radius: 12px; margin: 14px 0; }
.doc-prose table { width: 100%; border-collapse: collapse; margin: 18px 0; font-size: 14.5px; }
.doc-prose th, .doc-prose td { border: 1px solid var(--line); padding: 10px 14px; text-align: left; color: var(--ink-2); vertical-align: top; }
.doc-prose thead th, .doc-prose tbody tr:first-child td { background: var(--bg-soft); color: var(--ink); font-weight: 700; }
/* 中英分块：默认中文，html.iw-en 时显示英文 */
.doc-en { display: none; }
html.iw-en .doc-zh { display: none; }
html.iw-en .doc-en { display: block; }
@media (max-width: 600px) { .doc-prose img { max-width: 72%; } }

/* stats — light variant for white pages */
.stats.stats-light { padding: 20px 0 40px; color: var(--ink); }
.stats.stats-light .stat { border-left: 1px solid var(--line); }
.stats.stats-light .fig { color: var(--ink); }
.stats.stats-light .lab { color: var(--ink-2); }
.stats.stats-light .fig.fig-text { font-size: clamp(30px, 3.2vw, 44px); white-space: nowrap; }

/* story (pinned milestones with morphing scenes) */
.story-wrap { position: relative; height: 320vh; }
.story-sticky { position: sticky; top: 0; height: 100vh; overflow: hidden; display: flex; align-items: center; }
/* 文字区白色渐变垫底，避免与右侧场景（地图/地球）重叠时看不清 */
.story-sticky::after { content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none; background: linear-gradient(90deg, var(--bg) 8%, rgba(255,255,255,.82) 40%, rgba(255,255,255,0) 64%); }

.story-stage { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
.story-scene-box { position: absolute; top: 50%; right: 4%; transform: translateY(-50%) scale(.96); width: min(46%, 560px); height: 70%; opacity: 0; transition: opacity .7s ease, transform .7s cubic-bezier(.2,.7,.2,1); }
.story-scene-box.on { opacity: 1; transform: translateY(-50%) scale(1); }
.scene-svg { width: 100%; height: 100%; overflow: visible; }

/* city: twinkling windows + drifting clouds + growing buildings + pin */
@keyframes twinkle { 0%,100% { opacity: .35; } 50% { opacity: 1; } }
.scene-svg .win { animation: twinkle 3.6s ease-in-out infinite; }
@keyframes cloud-drift { from { transform: translateX(-12px); } to { transform: translateX(16px); } }
.scene-svg .clouds { animation: cloud-drift 9s ease-in-out infinite alternate; }
@keyframes bld-rise { from { transform: translateY(26px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }
.story-scene-box.on .bld { animation: bld-rise .7s cubic-bezier(.2,.7,.2,1) both; animation-delay: var(--bd); }
@keyframes pin-ring { 0% { r: 7; opacity: .8; } 100% { r: 20; opacity: 0; } }
.scene-svg .pin-ring { animation: pin-ring 2.2s ease-out infinite; }

.echart-box { width: 100%; height: 100%; }
.globe-canvas { width: 100%; height: 100%; display: block; }
.story-scene-box.globe-box { width: min(52%, 620px); height: 84%; right: 2%; }

@media (prefers-reduced-motion: reduce) {
  .scene-svg .win, .scene-svg .clouds, .scene-svg .pin-ring, .story-scene-box.on .bld { animation: none; }
}
.story-in { position: relative; z-index: 1; width: var(--edge); }
.story-head { margin-bottom: 22px; }
.story-head .eyebrow { color: var(--accent); }
.story-panels { position: relative; min-height: 280px; max-width: 480px; }
.story-panel { position: absolute; inset: 0; opacity: 0; transform: translateY(20px); transition: opacity .6s cubic-bezier(.2,.7,.2,1), transform .6s cubic-bezier(.2,.7,.2,1); pointer-events: none; }
.story-panel.on { opacity: 1; transform: none; pointer-events: auto; }
.story-scene { font-family: var(--sans); font-size: 12px; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: var(--accent); }
.story-year { font-family: var(--sans); font-weight: 600; font-size: 17px; color: var(--ink-3); margin-top: 18px; }
.story-panel h3 { font-family: var(--cn); font-weight: 700; font-size: clamp(34px, 4.6vw, 58px); line-height: 1.06; letter-spacing: -.01em; margin-top: 8px; }
.story-panel p { margin-top: 18px; font-size: 17px; line-height: 1.8; color: var(--ink-2); max-width: 440px; }
.story-dots { display: flex; gap: 10px; margin-top: 34px; }
.story-dots span { width: 30px; height: 4px; border-radius: 2px; background: var(--line); transition: background .3s, width .3s; }
.story-dots span.on { background: var(--accent); width: 46px; }

@media (max-width: 760px) {
  .story-wrap { height: 300vh; }
  .story-panels { max-width: none; }
  .story-panel h3 { font-size: clamp(30px, 8vw, 44px); }
  /* 小屏文字占满整行，场景整体调淡并改用纵向渐变垫底 */
  .story-scene-box.on { opacity: .35; }
  .story-sticky::after { background: linear-gradient(180deg, rgba(255,255,255,.9) 0%, rgba(255,255,255,.55) 55%, rgba(255,255,255,0) 100%); }
}

/* dark CTA band on light sub-pages (no scroll-driven tone system here;
   the home page paints its background via #bg-layer instead) */
body:not(.home) .cta { position: relative; z-index: 1; background: var(--bg-dark); }

/* technology — re-themed light to match the page (overrides dark band) */
.tech { background: var(--bg-soft); color: var(--ink); padding: 110px 0; border-top: 1px solid var(--line); }
.tech .eyebrow { color: var(--accent); }
.tech .sec-head h2 { color: var(--ink); }
.tech .sec-head .lead { color: var(--ink-2); }
.tech-flow { margin-top: 48px; }
.tnode { border: 1px solid var(--line); background: #fff; box-shadow: 0 14px 36px -26px rgba(0,0,0,.3); }
.tnode .nt { color: var(--ink); }
.tnode .ns { color: var(--ink-2); }
.tconn .cl { color: var(--accent); }
.tconn .cl.cl-dim { color: var(--ink-3); }
.tconn .line { background: linear-gradient(90deg, transparent, var(--line), transparent); }
.tconn .line::after { background: var(--accent); animation-duration: 3.4s; }

/* tech sub-blocks */
.tblock { margin-top: 64px; }
.tblock:first-of-type { margin-top: 52px; }
.tblock-head { margin-bottom: 26px; }
.tblock-head .tb-eyebrow { font-family: var(--sans); font-size: 12px; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: var(--accent); }
.tblock-head h3 { font-family: var(--cn); font-weight: 700; font-size: clamp(22px, 2.6vw, 30px); letter-spacing: -.01em; margin-top: 10px; color: var(--ink); }

/* multimodal capability cards */
.cap-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.cap-card { background: #fff; border: 1px solid var(--line); border-radius: var(--r); padding: 26px 24px; transition: opacity .8s cubic-bezier(.2,.7,.2,1), transform .8s cubic-bezier(.2,.7,.2,1), box-shadow .25s, border-color .25s; }
.cap-card:hover { box-shadow: 0 18px 44px -28px rgba(0,0,0,.32); border-color: var(--ink-3); }
.cap-top { display: flex; align-items: center; gap: 14px; margin-bottom: 18px; }
.cap-n { font-family: var(--sans); font-weight: 600; font-size: 26px; letter-spacing: -.02em; color: var(--ink); flex: none; }
.cap-rule { flex: 1; height: 1px; background: var(--line); }
.cap-card:hover .cap-rule { background: var(--accent); }
.cap-card h4 { font-family: var(--cn); font-weight: 700; font-size: 18px; margin: 0 0 14px; color: var(--ink); }
.cap-card ul { list-style: none; display: flex; flex-direction: column; gap: 9px; }
.cap-card li { font-size: 14px; color: var(--ink-2); padding-left: 16px; position: relative; }
.cap-card li::before { content: ""; position: absolute; left: 0; top: 8px; width: 5px; height: 5px; border-radius: 50%; background: var(--accent); }

/* edge-cloud advantage cards */
.adv-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-top: 22px; }
.adv-card { background: #fff; border: 1px solid var(--line); border-radius: var(--r); padding: 24px; transition: opacity .8s cubic-bezier(.2,.7,.2,1), transform .8s cubic-bezier(.2,.7,.2,1), box-shadow .25s; }
.adv-card:hover { box-shadow: 0 18px 44px -28px rgba(0,0,0,.32); }
.adv-card .adv-k { font-family: var(--sans); font-weight: 600; font-size: 15px; color: var(--accent); }
.adv-card h4 { font-family: var(--cn); font-weight: 700; font-size: 18px; margin: 12px 0 8px; color: var(--ink); }
.adv-card p { font-size: 13.5px; line-height: 1.6; color: var(--ink-2); }

/* application cards */
.app-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.app-card { position: relative; display: flex; gap: 20px; align-items: center; background: #fff; border: 1px solid var(--line); border-radius: var(--r); padding: 24px 26px 24px 24px; overflow: hidden; transition: opacity .8s cubic-bezier(.2,.7,.2,1), transform .8s cubic-bezier(.2,.7,.2,1), box-shadow .25s, border-color .25s; }
.app-card:hover { box-shadow: 0 18px 44px -28px rgba(0,0,0,.32); border-color: var(--tint); transform: translateY(-2px); }
.app-bar { flex: none; width: 4px; align-self: stretch; border-radius: 3px; }
.app-body h4 { font-family: var(--cn); font-weight: 700; font-size: 19px; color: var(--ink); }
.app-body p { margin-top: 6px; font-size: 14px; line-height: 1.55; color: var(--ink-2); }

@media (max-width: 900px) {
  .cap-grid, .adv-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 560px) {
  .cap-grid, .adv-grid, .app-grid { grid-template-columns: 1fr; }
}

/* honor / recognition */
.honor-sec { padding-top: 30px; }
.honor-grid { display: grid; grid-template-columns: 1.05fr 1fr; gap: 56px; align-items: center; }
.honor-photo { border: 1px solid var(--line); border-radius: var(--r); overflow: hidden; background: var(--bg-soft); box-shadow: 0 26px 60px -32px rgba(0,0,0,.4); }
.honor-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.honor-text .eyebrow { color: var(--accent); }
.honor-text h2 { font-family: var(--cn); font-weight: 700; font-size: clamp(30px, 4vw, 50px); line-height: 1.1; letter-spacing: -.01em; margin-top: 14px; }
.honor-text p { margin-top: 20px; font-size: 16.5px; line-height: 1.8; color: var(--ink-2); max-width: 480px; }

@media (max-width: 880px) {
  .honor-grid { grid-template-columns: 1fr; gap: 32px; }
  .contact-hero { min-height: 92vh; align-items: flex-end; padding-bottom: 12vh; }
  .contact-main-grid { grid-template-columns: 1fr; gap: 8px; }
  .contact-stage { min-height: 52vh; order: 2; }
  .contact-panel { order: 1; }
  .contact-info { flex-direction: column; gap: 20px; }
  .contact-close { min-height: 56vh; }
}