@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+SC:wght@400;500;600;700&family=Source+Serif+4:opsz,wght@8..60,400;8..60,500;8..60,600&display=swap');

:root {
  --blue: #2455a6;
  --blue-dark: #173c7c;
  --ink: #141414;
  --muted: #5d5d5d;
  --line: #b9b9b4;
  --soft-line: #deded9;
  --paper: #f5f5f1;
  --white: #ffffff;
  --shell: min(1320px, calc(100% - 72px));
  font-family: "Source Serif 4", "Noto Serif SC", "Songti SC", STSong, Georgia, serif;
  color: var(--ink);
  background: var(--white);
  font-synthesis: none;
  text-rendering: optimizeLegibility;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; min-width: 320px; background: var(--white); color: var(--ink); }
body, button, a { font: inherit; }
a { color: inherit; text-decoration: none; }
button { color: inherit; }
img { display: block; max-width: 100%; }
.shell { width: var(--shell); margin-inline: auto; }
.skip-link { position: fixed; left: 16px; top: -80px; z-index: 100; padding: 10px 16px; background: var(--blue-dark); color: white; border: 1px solid white; transition: top .2s; }
.skip-link:focus { top: 16px; }

.site-header { position: fixed; inset: 0 0 auto; z-index: 50; background: rgba(255,255,255,.96); border-bottom: 1px solid var(--ink); }
.nav-shell { width: var(--shell); height: 88px; margin-inline: auto; display: flex; align-items: center; justify-content: space-between; gap: 34px; }
.brand { display: inline-flex; align-items: center; gap: 15px; min-width: 280px; }
.brand-mark { width: 44px; height: 44px; object-fit: contain; }
.brand-name { width: 190px; display: grid; gap: 4px; }
.brand-name strong, .brand-name small { display: block; width: 100%; line-height: 1; white-space: nowrap; text-align: justify; text-align-last: justify; }
.brand-name strong { font-size: .96rem; font-weight: 600; }
.brand-name small { color: var(--muted); font-size: .56rem; font-weight: 500; text-align: left; text-align-last: auto; }
.brand-name small span { display: inline-block; white-space: nowrap; word-spacing: 0; }
.desktop-nav { display: flex; align-items: center; gap: 38px; margin-left: auto; }
.desktop-nav a { position: relative; font-size: .91rem; font-weight: 500; }
.desktop-nav a::after { content: ""; position: absolute; left: 0; right: 100%; bottom: -8px; height: 1px; background: currentColor; transition: right .2s; }
.desktop-nav a:hover::after, .desktop-nav a:focus-visible::after { right: 0; }
.nav-actions { display: flex; align-items: center; gap: 18px; }
.language-switch { border: 0; border-bottom: 1px solid var(--ink); background: transparent; padding: 3px 0; font-size: .78rem; font-weight: 500; cursor: pointer; }
.language-switch span[aria-hidden] { margin: 0 5px; color: var(--line); }
.lang-other { color: var(--muted); }
.menu-button { display: none; width: 42px; height: 42px; border: 0; background: transparent; padding: 10px 0 10px 12px; cursor: pointer; }
.menu-button span { display: block; height: 1px; margin: 7px 0; background: var(--ink); }
.mobile-nav { display: none; }

.hero { padding: 152px 0 0; overflow: hidden; background: var(--white); }
.hero-grid { display: grid; grid-template-columns: 1.08fr .92fr; gap: 0; align-items: stretch; min-height: 640px; border-bottom: 1px solid var(--ink); }
.hero-copy { display: flex; flex-direction: column; justify-content: center; padding: 58px 74px 70px 0; }
.hero h1 { max-width: 790px; margin: 0; font-size: clamp(4.5rem, 7vw, 7rem); line-height: .88; letter-spacing: -.045em; font-weight: 400; }
html[data-language="zh"] .hero h1 { max-width: 720px; font-size: clamp(4rem, 6.4vw, 6.4rem); line-height: 1.05; letter-spacing: -.04em; font-weight: 500; }
.hero-intro { max-width: 650px; margin: 42px 0 0; color: var(--muted); font-size: 1.15rem; line-height: 1.7; }
html[data-language="zh"] .hero-intro { line-height: 1.9; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 28px; margin-top: 42px; }
.button { display: inline-flex; min-height: 44px; align-items: center; justify-content: center; padding: 0 0 4px; border-bottom: 1px solid currentColor; font-size: .98rem; font-weight: 500; transition: color .2s; }
.button::after { content: "↗"; margin-left: 10px; font-size: .78em; }
.button:hover { color: var(--blue); }
.button-primary, .button-secondary { background: transparent; color: var(--ink); border-top: 0; border-left: 0; border-right: 0; }
.hero-visual { min-width: 0; border-left: 1px solid var(--ink); }
.hero-image-frame { position: relative; height: 100%; min-height: 640px; overflow: hidden; background: var(--blue-dark); }
.hero-image { width: 100%; height: 100%; min-height: 640px; object-fit: cover; object-position: 70% center; filter: saturate(.7) contrast(1.03); }
.hero-image-frame::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(23,60,124,.02), rgba(23,60,124,.2)); mix-blend-mode: multiply; }

.metrics { display: grid; grid-template-columns: repeat(4, 1fr); border-bottom: 1px solid var(--ink); }
.metric { min-height: 154px; padding: 32px 34px; display: flex; flex-direction: column; justify-content: center; border-right: 1px solid var(--ink); }
.metric:first-child { border-left: 1px solid var(--ink); }
.metric strong { color: var(--blue); font-size: clamp(2.8rem, 4vw, 4rem); line-height: 1; letter-spacing: -.04em; font-weight: 400; }
.metric span { margin-top: 13px; color: var(--muted); font-size: .84rem; }

.section { padding: 142px 0; }
.section-intro { background: var(--paper); border-bottom: 1px solid var(--ink); }
.intro-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12%; align-items: start; }
.section-heading h2, .global-copy h2, .strategy-panel h2, .closing h2 { margin: 0; font-size: clamp(3.5rem, 5.6vw, 5.8rem); line-height: .97; letter-spacing: -.04em; font-weight: 400; }
html[data-language="zh"] .section-heading h2, html[data-language="zh"] .global-copy h2, html[data-language="zh"] .strategy-panel h2, html[data-language="zh"] .closing h2 { font-weight: 500; line-height: 1.12; }
.intro-body { padding-top: 4px; }
.intro-body p { margin: 0 0 28px; color: var(--muted); font-size: 1.12rem; line-height: 1.85; }
.intro-body p:first-child { color: var(--ink); font-size: 1.45rem; line-height: 1.65; }

.section-business { background: var(--white); border-bottom: 1px solid var(--ink); }
.business-heading { display: grid; grid-template-columns: 1fr .72fr; align-items: end; gap: 12%; margin-bottom: 80px; }
.business-heading > p { margin: 0 0 4px; color: var(--muted); font-size: 1.08rem; line-height: 1.75; }
.business-grid { display: grid; grid-template-columns: repeat(2, 1fr); border-top: 1px solid var(--ink); border-left: 1px solid var(--ink); }
.business-card { position: relative; min-height: 330px; display: flex; flex-direction: column; align-items: flex-start; padding: 38px 42px; border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); background: white; transition: color .2s, background .2s; }
.business-card:hover { color: white; background: var(--blue-dark); }
.card-number { margin-bottom: 92px; color: var(--blue); font-size: .9rem; font-variant-numeric: lining-nums; }
.business-card:hover .card-number { color: white; }
.business-card h3 { max-width: 460px; margin: 0; font-size: 2rem; line-height: 1.12; letter-spacing: -.025em; font-weight: 500; }
.business-card p { max-width: 510px; margin: 22px 0 0; color: var(--muted); font-size: 1.02rem; line-height: 1.75; }
.business-card:hover p { color: #e8edf6; }
.business-card-dark { color: var(--ink); background: white; }

.section-global { border-bottom: 1px solid var(--ink); }
.global-grid { display: grid; grid-template-columns: .78fr 1.22fr; gap: 10%; align-items: center; }
.global-copy > p { margin: 38px 0 48px; color: var(--muted); font-size: 1.08rem; line-height: 1.8; }
.region-list { display: grid; border-top: 1px solid var(--ink); }
.region-list > div { display: grid; grid-template-columns: 50px 110px 1fr; align-items: baseline; gap: 12px; padding: 22px 0; border-bottom: 1px solid var(--soft-line); }
.region-list span { color: var(--blue); font-size: .8rem; }.region-list strong { font-size: 1rem; font-weight: 600; }.region-list small { color: var(--muted); font-size: .9rem; line-height: 1.5; }
.network-visual { position: relative; min-height: 0; aspect-ratio: 20 / 13; overflow: hidden; background: var(--blue-dark); border: 1px solid var(--ink); }
.network-overlay { position: absolute; inset: 0; z-index: 2; width: 100%; height: 100%; overflow: visible; }
.world-map-vector { opacity: .34; }
.network-route { fill: none; stroke: rgba(255,255,255,.85); stroke-width: 2; vector-effect: non-scaling-stroke; }
.node-halo { fill: rgba(255,255,255,.12); stroke: rgba(255,255,255,.38); stroke-width: 1; vector-effect: non-scaling-stroke; }
.node-core { fill: #fff; }
.network-node text { fill: #fff; font-family: "Source Serif 4", "Noto Serif SC", "Songti SC", STSong, Georgia, serif; font-size: 17px; font-weight: 600; }
.network-caption { position: absolute; z-index: 3; left: 38px; bottom: 38px; display: grid; gap: 7px; color: white; }.network-caption span { color: #b7c6e1; font-size: .74rem; letter-spacing: .08em; }.network-caption strong { font-size: 1.1rem; font-weight: 500; }

.section-partners { overflow: hidden; background: var(--paper); border-bottom: 1px solid var(--ink); }
.partners-intro { display: grid; grid-template-columns: .82fr 1.18fr; gap: 12%; align-items: start; margin-bottom: 78px; }
.partners-intro h2 { max-width: 610px; margin: 0; font-size: clamp(3.3rem, 5vw, 5.25rem); line-height: .98; letter-spacing: -.04em; font-weight: 400; }
html[data-language="zh"] .partners-intro h2 { font-size: clamp(3.1rem, 4.1vw, 3.7rem); font-weight: 500; line-height: 1.12; white-space: nowrap; }
.partners-intro p { max-width: 740px; margin: 5px 0 0; color: var(--muted); font-size: 1.08rem; line-height: 1.9; }
.partner-marquee { width: 100%; overflow-x: auto; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink); scrollbar-width: none; }
.partner-marquee::-webkit-scrollbar { display: none; }
.partner-marquee-track { display: flex; width: max-content; }
.partner-set { display: flex; flex: none; }
.partner-item { width: clamp(220px, 20vw, 290px); height: 142px; flex: none; display: grid; place-items: center; padding: 30px 34px; background: var(--white); border-right: 1px solid var(--soft-line); }
.partner-item img { width: auto; max-width: 82%; max-height: 68px; object-fit: contain; filter: grayscale(1); opacity: .76; transition: filter .25s, opacity .25s; }
.partner-item:hover img { filter: none; opacity: 1; }
.partner-powerchina img { max-width: 76%; max-height: 92px; }
.partner-kaisa img { max-height: 74px; }
.partner-grab img { max-height: 54px; }
.partner-coach img { max-height: 66px; }
.partner-keio img { max-width: 88%; }
.partner-uniwisee img { max-width: 90%; max-height: 70px; }
.partner-roster { display: grid; grid-template-columns: 220px 1fr; gap: 30px; margin: 40px 0 0; padding-top: 26px; color: var(--muted); border-top: 1px solid var(--soft-line); font-size: .9rem; line-height: 1.8; }
.partner-roster strong { color: var(--ink); font-weight: 600; }

.section-strategy { padding: 0; background: var(--blue-dark); border-bottom: 1px solid var(--ink); }
.strategy-panel { display: grid; grid-template-columns: .8fr 1.2fr; gap: 12%; padding: 110px 0; color: white; }
.strategy-copy p { margin: 5px 0 48px; color: #d7dfec; font-size: 1.18rem; line-height: 1.8; }
.strategy-flow { display: flex; align-items: center; flex-wrap: wrap; gap: 22px; padding-top: 30px; border-top: 1px solid rgba(255,255,255,.4); }
.strategy-flow span { font-size: 1.05rem; font-weight: 500; }.strategy-flow i { color: #9eb7df; font-style: normal; }

.section-brands { background: var(--paper); border-bottom: 1px solid var(--ink); }
.centered { max-width: 920px; margin: 0 0 76px; text-align: left; }
.brand-grid { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--ink); border-left: 1px solid var(--ink); }
.brand-card { min-height: 430px; display: flex; flex-direction: column; padding: 0 34px 34px; border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); background: transparent; }
.brand-logo-stage { height: 250px; margin: 0 -34px 32px; display: grid; place-items: center; padding: 34px; overflow: hidden; background: var(--white); border-bottom: 1px solid var(--soft-line); }
.brand-logo { display: block; width: auto; height: auto; object-fit: contain; }
.brand-logo-xinhua { max-width: 88%; max-height: 118px; }
.brand-logo-trustlink { max-width: 96%; max-height: 118px; }
.brand-logo-care { max-width: 174px; max-height: 198px; }
.brand-card > p:last-child { margin: auto 0 0; color: var(--muted); font-size: 1rem; line-height: 1.75; }
.sr-only { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; }

.closing { padding: 132px 0; color: white; background: #101010; }
.closing-inner { display: grid; grid-template-columns: 1.4fr .6fr; align-items: end; gap: 10%; }
.closing h2 { max-width: 900px; }
.button-light { justify-self: end; color: white; background: transparent; }
.button-light:hover { color: #9eb7df; }
.site-footer { padding: 38px 0; color: #a8a8a8; background: #101010; border-top: 1px solid #666; }
.footer-grid { display: flex; justify-content: space-between; align-items: end; gap: 30px; }
.footer-brand { display: grid; gap: 8px; }.footer-brand strong { color: white; font-size: .92rem; font-weight: 500; }.footer-brand span, .footer-grid > p { margin: 0; font-size: .76rem; }

.reveal { opacity: 0; transform: translateY(12px); transition: opacity .55s ease, transform .55s ease; }
.reveal.is-visible { opacity: 1; transform: translateY(0); }
.business-card:nth-child(2), .brand-card:nth-child(2) { transition-delay: .06s; }.business-card:nth-child(3), .brand-card:nth-child(3) { transition-delay: .12s; }.business-card:nth-child(4) { transition-delay: .18s; }

@media (max-width: 1040px) {
  :root { --shell: min(100% - 44px, 820px); }
  .desktop-nav { display: none; }.menu-button { display: block; }.brand { min-width: 0; }
  .mobile-nav { position: fixed; inset: 88px 0 auto; display: grid; max-height: 0; overflow: hidden; background: white; border-bottom: 1px solid var(--ink); transition: max-height .25s; }.mobile-nav.is-open { max-height: 330px; }.mobile-nav a { width: var(--shell); margin-inline: auto; padding: 18px 0; border-bottom: 1px solid var(--soft-line); }
  .hero-grid { grid-template-columns: 1fr; }.hero-copy { padding-right: 0; }.hero-visual { border-left: 0; border-top: 1px solid var(--ink); }.hero-image-frame, .hero-image { min-height: 500px; height: 500px; }.metrics { grid-template-columns: repeat(2, 1fr); }.metric:nth-child(2) { border-right: 0; }.metric:nth-child(-n+2) { border-bottom: 1px solid var(--ink); }
  .intro-grid, .business-heading, .global-grid, .partners-intro, .strategy-panel { grid-template-columns: 1fr; gap: 58px; }.global-copy { max-width: 700px; }.partners-intro p { max-width: 760px; }.brand-grid { grid-template-columns: 1fr; }.brand-card { min-height: 390px; }.closing-inner { grid-template-columns: 1fr; gap: 46px; }.button-light { justify-self: start; }
}

@media (max-width: 680px) {
  :root { --shell: calc(100% - 30px); }.nav-shell { height: 74px; gap: 12px; }.brand { gap: 10px; }.brand-name { width: 154px; gap: 3px; }.brand-name strong { font-size: .78rem; }.brand-name small { font-size: .45rem; }.brand-mark { width: 38px; height: 38px; }.mobile-nav { inset: 74px 0 auto; }
  .hero { padding-top: 108px; }.hero h1 { font-size: 3.55rem; }.hero-copy { padding: 34px 0 52px; }.hero-intro { font-size: 1.03rem; margin-top: 30px; }.hero-actions { display: grid; justify-items: start; gap: 14px; }.hero-image-frame, .hero-image { min-height: 410px; height: 410px; }
  .metric { min-height: 122px; padding: 22px 16px; }.metric:first-child { border-left: 0; }.metric strong { font-size: 2.35rem; }.metric span { font-size: .72rem; }.section { padding: 94px 0; }.section-heading h2, .global-copy h2, .partners-intro h2, .strategy-panel h2, .closing h2 { font-size: 3.15rem; }.business-heading { margin-bottom: 54px; }.business-grid { grid-template-columns: 1fr; }.business-card { min-height: 290px; padding: 30px 26px; }.card-number { margin-bottom: 60px; }.network-node text { font-size: 22px; }.network-caption { left: 24px; bottom: 24px; }.partners-intro { margin-bottom: 56px; }.partners-intro h2, html[data-language="zh"] .partners-intro h2 { white-space: normal; }.partner-item { width: 215px; height: 124px; padding: 24px; }.partner-roster { grid-template-columns: 1fr; gap: 8px; }.strategy-panel { padding: 86px 0; }.region-list > div { grid-template-columns: 38px 90px 1fr; }.brand-card { min-height: 360px; padding: 0 24px 28px; }.brand-logo-stage { height: 220px; margin: 0 -24px 26px; padding: 28px; }.brand-logo-xinhua, .brand-logo-trustlink { max-height: 104px; }.brand-logo-care { max-width: 154px; max-height: 174px; }.footer-grid { display: grid; }.footer-grid > p { line-height: 1.6; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: .01ms !important; }
  .reveal { opacity: 1; transform: none; }
}