:root {
  color-scheme: light;
  --background: #fff;
  --surface: #f5f5f7;
  --ink: #1d1d1f;
  --muted: #6e6e73;
  --blue: #0071e3;
  --blue-hover: #0062c4;
  --button-blue: #0071e3;
  --button-hover: #0062c4;
  --line: #e5e5e7;
  --radius: 24px;
  --page-width: 1200px;
  --header-height: 84px;
  --statement-height: 76px;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  color: var(--ink);
  background: var(--background);
  font-synthesis: none;
  -webkit-font-smoothing: antialiased;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: calc(var(--header-height) + 24px); }
body { margin: 0; }
button, a, summary { -webkit-tap-highlight-color: transparent; }
button { font: inherit; }
button { cursor: pointer; }
a { color: inherit; text-decoration: none; }
button, summary, a { touch-action: manipulation; }
button:focus-visible, a:focus-visible, summary:focus-visible, [tabindex]:focus-visible { outline: 2px solid var(--blue); outline-offset: 5px; }
button:disabled { cursor: default; }
[hidden] { display: none !important; }
img { max-width: 100%; display: block; }
h1, h2, h3, p, figure { margin: 0; }
.semantic-heading > span { white-space: nowrap; }
.optical-punctuation { display: inline-block; width: .35em; overflow: visible; text-align: left; }
.inline-comma { width: 1em; }
button, summary, a { transition: color .2s, background .2s, opacity .2s; }
.container { max-width: calc(var(--page-width) + 96px); padding-inline: 48px; margin-inline: auto; }
.section { padding-block: 120px; }
.skip-link { position: fixed; left: 20px; top: -60px; padding: 12px 20px; background: white; z-index: 20; border: 1px solid var(--blue); border-radius: 8px; }
.skip-link:focus { top: 12px; }
.site-header { position: sticky; top: 0; z-index: 10; height: var(--header-height); background: rgba(255,255,255,.96); }
.header-inner { height: 100%; max-width: 1500px; margin-inline: auto; padding-inline: 48px; display: flex; align-items: center; justify-content: space-between; gap: 40px; }
.brand { display: block; flex-shrink: 0; }
.brand img { width: 174px; height: 58px; object-fit: contain; }
.site-nav { display: flex; align-items: center; gap: clamp(24px, 3.7vw, 56px); margin-left: auto; }
.header-actions { display: flex; align-items: center; gap: 4px; flex-shrink: 0; }
.preference-toggle { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: 44px; height: 44px; color: var(--ink); background: transparent; border: 0; border-radius: 50%; font-size: 13px; font-weight: 500; }
.preference-toggle:hover { background: var(--surface); }
.site-nav a { font-size: 14px; min-height: 44px; display: flex; align-items: center; white-space: nowrap; }
.site-nav a:hover, .footer-column a:hover, .footer-bottom a:hover { color: var(--blue); }
.menu-toggle { width: 44px; height: 44px; border: 0; background: transparent; padding: 11px; }
.menu-toggle span { display: block; height: 1.5px; width: 22px; background: var(--ink); margin-block: 6px; transition: transform .2s; }
.hero { min-height: 280px; height: calc(100svh - var(--header-height) - var(--statement-height)); max-height: 1000px; position: relative; isolation: isolate; overflow: hidden; text-align: center; }
.hero-media { position: absolute; inset: 0; z-index: -1; background: white; }
.hero-media img, .hero-media video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center bottom; }
.hero-media video { opacity: 0; transition: opacity .35s; }
.hero-media video.is-playing { opacity: 1; }
.hero-content { position: relative; padding: clamp(56px, 12svh, 120px) 22px 0; display: flex; flex-direction: column; align-items: center; font-family: "PingFang SC", "Microsoft YaHei", "Noto Sans CJK SC", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
.hero h1 { font-size: clamp(48px, 4.2vw, 60px); font-weight: 500; line-height: 1.25; letter-spacing: -.025em; }
.hero-kicker { display: inline-flex; align-items: center; gap: 12px; font-size: 22px; font-weight: 400; line-height: 1.5; color: #626266; margin-top: 22px; letter-spacing: .03em; }
.kicker-dot { color: #929297; font-size: .8em; }
.button { min-height: 46px; padding: 11px 28px; display: inline-flex; align-items: center; justify-content: center; font-size: 17px; border-radius: 999px; line-height: 1.4; }
.button-primary { background: var(--button-blue); color: #fff; }
.button-primary:hover { background: var(--button-hover); }
.hero .button { margin-top: 28px; min-width: 144px; min-height: 44px; padding: 10px 26px; font-size: 16px; font-weight: 400; line-height: 1.5; }
.motion-toggle { position: absolute; right: 32px; bottom: 24px; min-height: 44px; border-radius: 999px; border: 1px solid rgba(110,110,115,.15); padding: 8px 15px; background: rgba(255,255,255,.8); color: #444449; display: inline-flex; align-items: center; gap: 9px; font-size: 12px; }
.motion-toggle > span:first-child { min-width: 13px; font-size: 16px; }
.brand-statement { height: var(--statement-height); padding-inline: 22px; display: flex; align-items: center; justify-content: center; text-align: center; background: #fafafa; font-size: 18px; line-height: 1.6; letter-spacing: .06em; color: #515156; }
.section-heading { text-align: center; }
.eyebrow { color: var(--muted); font-size: 14px; letter-spacing: .12em; margin-bottom: 22px; }
h2 { font-size: clamp(32px, 3.2vw, 44px); line-height: 1.32; font-weight: 500; letter-spacing: -.02em; }
.section-intro { color: var(--muted); font-size: 17px; line-height: 1.8; margin-top: 22px; }
.product-tabs { display: flex; justify-content: center; gap: 32px; margin: 49px auto 32px; }
.product-tabs button { color: var(--muted); padding: 15px 5px 16px; border: 0; border-bottom: 2px solid transparent; background: transparent; font-size: 16px; }
.product-tabs button:hover { color: var(--ink); }
.product-tabs button[aria-selected="true"] { border-bottom-color: var(--ink); color: var(--ink); }
.product-panel { display: grid; grid-template-columns: 1fr 1fr; border-radius: var(--radius); background: var(--surface); overflow: hidden; min-height: 440px; align-items: center; margin-top: 30px; }
.product-copy { padding: 52px 36px; text-align: center; }
.product-category { color: var(--muted); font-size: 13px; letter-spacing: .035em; margin-bottom: 20px; }
.product-copy h3 { font-size: clamp(25px, 2.2vw, 30px); font-weight: 500; letter-spacing: -.02em; }
.product-description { font-size: clamp(25px, 2.2vw, 30px); line-height: 1.5; margin-top: 18px; letter-spacing: -.015em; }
.product-body { font-size: 16px; color: var(--muted); line-height: 1.85; max-width: 365px; margin: 20px auto 0; }
.product-details { margin: 20px auto 0; max-width: 385px; }
.product-details summary { width: fit-content; max-width: 100%; margin-inline: auto; cursor: pointer; font-size: 15px; min-height: 44px; display: flex; align-items: center; justify-content: center; gap: 12px; color: var(--blue); list-style: none; }
.product-details summary::-webkit-details-marker { display: none; }
.product-details summary [aria-hidden] { font-size: 20px; }
.product-details[open] summary [aria-hidden] { transform: rotate(90deg); }
.details-content { padding-block: 8px 4px; font-size: 14px; line-height: 1.85; color: #5d5d63; }
.details-content p + p { margin-top: 12px; }
.details-content ul { list-style: none; padding: 0; margin-block: 12px 0; }
.details-content li + li { margin-top: 4px; }
.product-art { min-width: 0; height: 350px; position: relative; margin: 34px; }
.product-art figcaption { position: absolute; bottom: 0; width: 100%; text-align: center; color: #7c8593; font-size: 12px; letter-spacing: .08em; }
.workflow-grid { position: absolute; inset: 18px 0 25px; background-image: radial-gradient(#b9c6d5 .8px, transparent .8px); background-size: 18px 18px; mask-image: radial-gradient(ellipse, black 20%, transparent 70%); }
.flow-node { display: flex; flex-direction: column; align-items: center; justify-content: center; position: absolute; width: 110px; height: 114px; border: 1px solid #dce6f2; background: rgba(255,255,255,.9); border-radius: 16px; box-shadow: 0 8px 30px #244b7c08; z-index: 1; font-size: 13px; }
.flow-node small { color: #8995a7; font-size: 9px; margin-top: 6px; }
.node-symbol { color: #508bc6; font-size: 29px; line-height: 1; margin-bottom: 12px; }
.flow-start { top: 140px; left: 0; }
.flow-center { top: 53px; left: calc(50% - 55px); border-color: #94bce7; box-shadow: 0 10px 38px #0071e30c; }
.flow-end { top: 140px; right: 0; }
.flow-connector { position: absolute; top: 166px; width: calc(50% - 55px); height: 1px; background: #afc9e5; transform-origin: center; }
.connector-first { left: 55px; transform: rotate(-39deg); }
.connector-second { right: 55px; transform: rotate(39deg); }
.archive-back { width: 245px; height: 245px; border-radius: 16px; background: #e3edf8; border: 1px solid #cfdef0; position: absolute; top: 40px; left: calc(50% - 105px); transform: rotate(7deg); }
.archive-sheet { width: 265px; padding: 25px 22px; background: linear-gradient(140deg, #fff, #ffffffc9); border: 1px solid #dae3ed; border-radius: 16px; position: absolute; top: 51px; left: calc(50% - 142px); transform: rotate(-4deg); box-shadow: 0 20px 50px #465c7910; }
.archive-label { font-size: 9px; color: #7c8b9e; letter-spacing: .08em; padding-bottom: 23px; display: flex; justify-content: space-between; }
.archive-label span { color: #0071e3; }
.archive-row { display: flex; align-items: center; gap: 15px; height: 54px; border-top: 1px solid #e7edf4; color: #8e9db0; font-size: 10px; }
.archive-row i { display: block; width: 120px; height: 4px; border-radius: 2px; background: #e2eaf3; }
.archive-row:nth-child(3) i { width: 85px; }
.archive-row b { margin-left: auto; font-weight: 400; color: #75a2d0; font-size: 19px; }
.intelligence-art svg { width: 100%; height: calc(100% - 28px); filter: drop-shadow(0 15px 12px #0071e309); }
.about { background: #fafafa; text-align: center; }
.about-intro { display: grid; gap: 30px; justify-items: center; }
.about-copy { max-width: 680px; font-size: 18px; color: var(--muted); line-height: 1.9; }
.about-copy p + p { margin-top: 18px; }
.research-grid { margin-top: 76px; display: grid; grid-template-columns: 1fr 1fr; gap: 64px; }
.research-item { border-top: 1px solid #dcdce0; padding-top: 28px; scroll-margin-top: 115px; }
.research-number { color: #919196; font-size: 11px; letter-spacing: .1em; }
.research-item h3 { font-size: 24px; font-weight: 500; margin-top: 23px; }
.research-item p { color: var(--muted); font-size: 16px; line-height: 1.85; max-width: 425px; margin: 14px auto 0; }
.site-footer { padding-top: 78px; text-align: center; }
.footer-main { display: grid; grid-template-columns: 1.7fr 1fr .8fr .6fr; gap: 44px; min-height: 260px; }
.footer-brand img { width: 210px; height: 70px; object-fit: contain; margin: -20px auto 13px; }
.footer-brand p { color: var(--muted); font-size: 13px; line-height: 1.8; }
.footer-brand .footer-tagline { color: #919196; margin-top: 6px; letter-spacing: .08em; }
.footer-email { display: inline-flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 4px 8px; min-height: 44px; margin-top: 6px; color: var(--muted); font-size: 13px; overflow-wrap: anywhere; }
.footer-email:hover { color: var(--blue); }
.footer-column { display: flex; flex-direction: column; align-items: center; }
.footer-column h2 { font-size: 15px; letter-spacing: 0; line-height: 1.6; margin-bottom: 19px; font-weight: 500; }
.footer-column a { min-height: 44px; display: flex; align-items: center; font-size: 14px; color: var(--muted); }
.footer-bottom { border-top: 1px solid var(--line); padding-block: 22px; min-height: 84px; color: #86868b; font-size: 12px; display: flex; align-items: center; justify-content: flex-start; text-align: left; gap: 32px; }
.footer-bottom a { min-height: 44px; display: flex; align-items: center; gap: 10px; white-space: nowrap; }

@media (max-width: 1023px) {
  :root { --header-height: 76px; }
  .container { padding-inline: 36px; }
  .header-inner { padding-inline: 30px; gap: 16px; }
  .site-nav { gap: 24px; }
  .site-nav a { font-size: 12px; }
  .hero h1 { font-size: 52px; }
  .section { padding-block: 96px; }
  .product-copy { padding: 40px 24px; }
  .product-body { font-size: 15px; }
  .product-art { margin-inline: 16px; }
  .flow-node { width: 88px; height: 102px; }
  .flow-center { left: calc(50% - 44px); }
  .flow-start, .flow-end { top: 176px; }
  .flow-connector { top: 182px; width: calc(50% - 22px); }
  .connector-first { left: 22px; transform: rotate(-59deg); }
  .connector-second { right: 22px; transform: rotate(59deg); }
  .about-intro { gap: 30px; }
  .about-copy { font-size: 17px; }
  .footer-main { gap: 24px; grid-template-columns: 1.4fr 1fr .8fr .6fr; }
  .footer-brand img { width: 180px; }
  .footer-brand p { font-size: 12px; }
}
@media (max-width: 767px) {
  :root { --header-height: 70px; --statement-height: 64px; }
  .container { padding-inline: 22px; }
  .section { padding-block: 78px; }
  .header-inner { padding-inline: 17px; gap: 10px; flex-wrap: wrap; }
  .brand img { width: 144px; height: 48px; }
  .site-header { height: auto; min-height: var(--header-height); }
  .header-inner > .brand { height: 70px; display: flex; align-items: center; }
  .site-nav { width: 100%; padding: 0 6px 18px; flex-wrap: wrap; gap: 4px 20px; }
  .site-nav a { font-size: 14px; }
  .js .site-nav { display: none; position: absolute; top: 70px; left: 0; padding: 8px 22px 22px; background: white; border-bottom: 1px solid var(--line); box-shadow: 0 18px 24px #00000008; }
  .js .site-nav.is-open { display: flex; flex-direction: column; align-items: stretch; gap: 4px; }
  .menu-toggle[aria-expanded="true"] span:first-child { transform: translateY(3.75px) rotate(45deg); }
  .menu-toggle[aria-expanded="true"] span:last-child { transform: translateY(-3.75px) rotate(-45deg); }
  .hero { max-height: 820px; }
  .hero-content { padding-top: clamp(52px, 11svh, 96px); }
  .hero h1 { max-width: 470px; margin-inline: auto; font-size: 36px; line-height: 1.3; letter-spacing: -.025em; text-wrap: balance; }
  .semantic-heading > span { display: block; }
  .inline-comma { width: .35em; }
  .hero-kicker { gap: 10px; font-size: 18px; margin-top: 20px; }
  .hero .button { min-width: 136px; }
  .hero-media img, .hero-media video { object-position: 63% bottom; }
  .motion-toggle { bottom: 16px; right: 16px; }
  .brand-statement { font-size: 15px; }
  .eyebrow { font-size: 12px; margin-bottom: 18px; }
  h2 { font-size: 30px; line-height: 1.4; text-wrap: balance; }
  .section-intro { font-size: 15px; margin-top: 18px; max-width: 290px; margin-inline: auto; }
  .product-tabs { gap: 16px; justify-content: space-between; margin: 31px 0 23px; }
  .product-tabs button { font-size: 12px; padding: 13px 0; }
  .product-panel { grid-template-columns: 1fr; min-height: auto; border-radius: 20px; margin-top: 22px; }
  .product-copy { padding: 32px 26px 0; }
  .product-category { font-size: 11px; margin-bottom: 17px; }
  .product-copy h3 { font-size: 25px; }
  .product-description { font-size: 25px; margin-top: 17px; }
  .product-body { font-size: 14px; line-height: 1.85; margin-top: 17px; }
  .product-details { margin-top: 13px; }
  .product-details summary { font-size: 13px; }
  .product-art { height: 290px; margin: 12px 23px 28px; }
  .flow-center { top: 30px; }
  .flow-start, .flow-end { top: 137px; }
  .flow-connector { top: 147px; }
  .archive-sheet { top: 18px; width: 240px; left: calc(50% - 125px); padding: 22px; }
  .archive-back { top: 10px; width: 230px; height: 230px; left: calc(50% - 105px); }
  .archive-row { height: 48px; }
  .archive-label { padding-bottom: 18px; }
  .about-intro { grid-template-columns: 1fr; gap: 28px; }
  .about-copy { font-size: 16px; line-height: 1.85; }
  .research-grid { grid-template-columns: 1fr; gap: 34px; margin-top: 48px; }
  .research-item { padding-top: 23px; }
  .research-item h3 { font-size: 22px; margin-top: 17px; }
  .research-item p { font-size: 15px; margin-top: 12px; }
  .site-footer { padding-top: 52px; text-align: left; }
  .footer-main { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); grid-template-areas: "brand brand" "products explore" "products company"; gap: 28px 24px; padding-bottom: 38px; }
  .footer-brand { grid-area: brand; }
  .footer-products { grid-area: products; }
  .footer-explore { grid-area: explore; }
  .footer-company { grid-area: company; }
  /* Align the visible mark despite the original PNG's transparent left margin. */
  .footer-brand img { width: 190px; height: 63px; margin: -16px 0 8px -10px; }
  .footer-brand p { font-size: 13px; }
  .footer-email { justify-content: flex-start; }
  .footer-column { align-items: flex-start; }
  .footer-column h2 { font-size: 14px; margin-bottom: 8px; }
  .footer-column a { font-size: 13px; }
  .footer-bottom { flex-direction: column; align-items: flex-start; font-size: 11px; padding-block: 20px 12px; gap: 4px; }
}
@media (max-width: 360px) {
  .brand img { width: 112px; height: auto; }
  .hero h1 { font-size: 34px; }
  .product-tabs { gap: 10px; }
  .product-tabs button { font-size: 11px; }
  .product-copy { padding-inline: 22px; }
  .product-copy h3 { font-size: 24px; }
  .product-description { font-size: 22px; }
}
@media (max-height: 600px) {
  .hero { min-height: 240px; }
  .hero-content { padding-top: 24px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition: none !important; }
}

/* English keeps normal word wrapping instead of Chinese punctuation spacing. */
html[lang="en"] .optical-punctuation { display: none; }
html[lang="en"] .semantic-heading > span { display: inline; white-space: normal; }
html[lang="en"] .hero h1 { max-width: 980px; text-wrap: balance; }
html[lang="en"] .product-description br,
html[lang="en"] #about-title br { display: none; }
html[lang="en"] .product-description { text-wrap: balance; }
html[lang="en"] .footer-column a { overflow-wrap: anywhere; }
@media (max-width: 767px) {
  html[lang="en"] .hero h1 { max-width: 430px; font-size: 36px; }
  html[lang="en"] .hero-kicker { font-size: 17px; gap: 9px; letter-spacing: 0; }
  html[lang="en"] .brand-statement { font-size: 14px; letter-spacing: 0; }
  html[lang="en"] .research-item h3 { font-size: 21px; }
}
@media (max-width: 360px) {
  html[lang="en"] .hero h1 { font-size: 32px; }
  html[lang="en"] .hero-kicker { font-size: 16px; gap: 8px; }
}