:root { --ink:#172337;--muted:#667184;--blue:#215ee8;--line:#dce2ea;--paper:#f7f8fa;--tint:#eef3fc }
* { box-sizing:border-box }
html { scroll-behavior:smooth;scroll-padding-top:104px }
body { margin:0;color:var(--ink);background:white;font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;font-size:15px;line-height:1.75 }
a { color:inherit;text-decoration:none }
a:hover { color:var(--blue) }
button { font:inherit;cursor:pointer }
button, a { -webkit-tap-highlight-color:transparent }
a:focus-visible, button:focus-visible, summary:focus-visible { outline:3px solid #97b5ff;outline-offset:5px }
img { max-width:100% }
.wrap { max-width:1200px;margin:auto;padding:0 32px }
header { position:sticky;top:0;background:#ffffffed;backdrop-filter:blur(15px);z-index:10;border-bottom:1px solid var(--line) }
.nav { height:78px;display:flex;align-items:center;gap:32px }
.brand { display:flex;align-items:center;gap:10px;font-weight:750;font-size:23px;letter-spacing:-.6px;white-space:nowrap }
.brand img { width:33px;height:33px;border-radius:8px }
.navlinks { display:flex;gap:28px;margin-left:auto;font-size:13px }
.btn { display:inline-flex;align-items:center;justify-content:center;gap:14px;border:1px solid var(--line);padding:12px 22px;background:white;border-radius:5px;font-weight:600;font-size:14px;transition:.18s }
.btn:hover { border-color:var(--blue);color:var(--blue) }
.btn.primary { background:var(--blue);border-color:var(--blue);color:white }
.btn.primary:hover { background:#174bbf;transform:translateY(-1px) }
.nav .btn { padding:9px 19px;font-size:13px }
.eyebrow { font-size:11px;letter-spacing:.14em;font-weight:650;color:var(--blue);text-transform:uppercase }
.hero { display:grid;grid-template-columns:1.08fr 1fr;gap:64px;align-items:center;padding-top:70px;padding-bottom:68px }
.hero h1 { font-size:64px;line-height:1.18;letter-spacing:-3.8px;font-weight:620;margin:23px 0 }
.hero h1 em { font-style:normal;color:var(--blue) }
.lead { font-size:17px;color:var(--muted);max-width:480px;line-height:1.95 }
.hero-actions { display:flex;gap:12px;margin:28px 0 13px }
.fine { font-size:12px;color:var(--muted) }
.intro-line { display:grid;grid-template-columns:1fr 2fr;gap:70px;border-top:1px solid var(--line);padding-top:28px;padding-bottom:33px }
.intro-line h2 { font-size:20px;font-weight:600;margin:0 }
.intro-line p { font-size:14px;color:var(--muted);margin:0 }
.section { padding-top:85px;padding-bottom:85px;border-top:1px solid var(--line) }
.section-title { display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:42px }
.section-title h2 { font-size:38px;line-height:1.35;font-weight:580;letter-spacing:-1.5px;margin:12px 0 0 }
.section-title p { max-width:360px;color:var(--muted);font-size:14px;margin:0 }
.steps { display:grid;grid-template-columns:repeat(4,1fr);gap:30px }
.step { border-top:2px solid var(--ink);padding-top:17px }
.step .num { font-size:11px;letter-spacing:.08em;color:var(--muted) }
.step h3 { font-size:20px;font-weight:600;margin:22px 0 10px }
.step p { color:var(--muted);font-size:13px;margin:0 }
.step .example { font-size:11px;border-top:1px solid var(--line);padding-top:14px;margin-top:24px;color:#45546c }
.split { display:grid;grid-template-columns:1fr 1fr;gap:90px }
.split h2 { font-size:40px;line-height:1.45;letter-spacing:-1.6px;font-weight:550;margin:16px 0 }
.split p { color:var(--muted);font-size:14px }
.share-flow { border-left:1px solid var(--line);padding-left:35px }
.flow-item { position:relative;padding:0 0 28px }
.flow-item:before { content:"";position:absolute;left:-41px;top:8px;background:white;border:2px solid var(--blue);width:9px;height:9px;border-radius:50% }
.flow-item h3 { font-size:19px;margin:0 0 6px;font-weight:550 }
.flow-item p { margin:0 }
.download { background:#edf2fb }
.download-grid { display:grid;grid-template-columns:1fr 1fr;border:1px solid #ccd7ea;background:white }
.download-os { padding:34px }
.download-os+.download-os { border-left:1px solid var(--line) }
.os-title { display:flex;align-items:center;justify-content:space-between }
.os-title h3 { font-size:26px;font-weight:550;margin:0 }
.os-title span { font-size:11px;color:var(--muted) }
.download-os p { font-size:13px;color:var(--muted);margin:8px 0 25px }
.download-os .fine { margin:14px 0 0;font-size:11px }
.help { display:block;text-decoration:underline;text-underline-offset:4px;font-size:12px;margin-top:16px }
.download-foot { margin-top:21px;color:var(--muted);font-size:12px;display:flex;justify-content:space-between;gap:20px }
.billing { display:grid;grid-template-columns:1fr 1.2fr;gap:75px }
.billing h2 { font-size:31px;font-weight:550;line-height:1.4;margin:12px 0 }
.billing p { font-size:13px;color:var(--muted) }
table { width:100%;border-collapse:collapse;font-size:13px }
th, td { text-align:left;padding:15px 10px;border-bottom:1px solid var(--line) }
th { font-weight:500;color:var(--muted);font-size:11px }
.notice { padding:15px 18px;background:var(--tint);font-size:12px;color:#405272;margin-top:20px }
.faq { display:grid;grid-template-columns:1fr 1.5fr;gap:70px }
.faq h2 { font-size:32px;margin:10px 0;font-weight:550 }
details { border-bottom:1px solid var(--line) }
summary { cursor:pointer;padding:20px 0;font-weight:550;font-size:15px }
details p { color:var(--muted);font-size:13px;margin:0 0 22px }
footer { background:var(--paper);border-top:1px solid var(--line);padding:45px 0 20px }
.footer-main { display:grid;grid-template-columns:1.7fr 1fr 1.1fr 1.4fr;gap:35px }
.footer-main p, .footer-main a:not(.brand) { font-size:12px;color:var(--muted) }
.footer-main a:not(.brand) { display:block;margin:8px 0 }
.footer-main a:hover { text-decoration:underline }
.footer-main h3 { font-size:12px;margin:5px 0 15px }
.copyright { border-top:1px solid var(--line);padding-top:20px;margin-top:32px;font-size:10px;color:var(--muted);display:flex;justify-content:space-between;gap:20px }
.subpage { max-width:1050px;margin:0 auto;padding:55px 32px 85px }
.crumb { font-size:12px;color:var(--muted);margin-bottom:35px }
.subpage h1 { font-size:46px;font-weight:550;letter-spacing:-1.5px;line-height:1.4;margin:12px 0 20px }
.subpage h2 { font-size:26px;font-weight:550;margin:42px 0 18px }
.subpage h3 { font-size:19px;font-weight:550 }
.subpage p, .subpage li { font-size:14px;color:#536176 }
.subpage section { border-top:1px solid var(--line);padding:10px 0 25px;margin-top:25px }
.subpage .meta { font-size:12px }
.subpage .back, .subpage .brand, .subpage footer, .subpage .nav-rail, .subpage .toc { display:none }
.subpage a:not(.btn) { color:var(--blue);text-decoration:underline;text-underline-offset:3px }
.subpage img { max-width:780px;width:100%;height:auto }
.subpage .record { display:grid;grid-template-columns:150px 1fr;padding:13px 0;border-bottom:1px solid var(--line) }
.subpage dd { margin:0 }
.service-row { display:grid;grid-template-columns:60px 1fr 1fr;gap:35px;padding:32px 0;border-top:1px solid var(--line) }
.service-row h2 { font-size:25px;margin:0 }
.service-row p { margin:0 }
.service-row .num { color:var(--blue);font-size:12px }
.sublead { font-size:17px!important;max-width:720px;margin-bottom:35px }
.menu-btn { display:none }
@media(max-width:960px) {
.navlinks { gap:13px }
.hero { gap:30px }
.hero h1 { font-size:49px;letter-spacing:-2px }
.steps { gap:18px }
.split { gap:40px }
.footer-main { grid-template-columns:1.5fr 1fr 1fr }
.footer-contact { grid-column:1/-1 }
.section-title h2 { font-size:33px }
}
@media(max-width:700px) {
.wrap { padding-left:22px;padding-right:22px }
.nav { height:66px;gap:14px }
.brand { font-size:21px }
.nav>.btn { margin-left:auto;padding:7px 12px }
.menu-btn { display:block;border:0;background:none;padding:7px;font-size:18px }
.navlinks { display:none;position:absolute;top:66px;left:0;right:0;background:white;padding:25px;box-shadow:0 12px 12px #0001;flex-direction:column;gap:20px }
.navlinks.open { display:flex }
.hero { grid-template-columns:1fr;padding-top:40px;padding-bottom:40px;gap:30px }
.hero h1 { font-size:47px;letter-spacing:-2.7px;margin:16px 0 }
.lead { font-size:15px }
.hero-actions { gap:8px }
.hero-actions .btn { font-size:12px;padding:12px 16px }
.intro-line { grid-template-columns:1fr;gap:12px;padding-top:25px;padding-bottom:28px }
.section { padding-top:50px;padding-bottom:50px }
.section-title { display:block;margin-bottom:30px }
.section-title h2 { font-size:29px;letter-spacing:-1px }
.section-title p { margin-top:20px }
.steps { grid-template-columns:1fr 1fr;gap:26px 22px }
.step h3 { font-size:18px;margin-top:13px }
.step .example { margin-top:16px }
.split, .billing, .faq { grid-template-columns:1fr;gap:28px }
.split h2 { font-size:31px }
.share-flow { margin-left:7px }
.download-grid { grid-template-columns:1fr }
.download-os { padding:26px }
.download-os+.download-os { border-left:0;border-top:1px solid var(--line) }
.download-foot { display:block }
.download-foot span { display:block;margin:8px 0 }
.footer-main { grid-template-columns:1fr 1fr;gap:23px }
.footer-brand { grid-column:1/-1 }
.copyright { display:block;font-size:10px }
.copyright span { display:block;margin:8px 0 }
.subpage { padding:35px 22px 55px }
.subpage h1 { font-size:33px }
.service-row { grid-template-columns:30px 1fr;gap:18px }
.service-row>p { grid-column:2 }
.subpage .record { grid-template-columns:110px 1fr }
.subpage table { font-size:11px }
.subpage th, .subpage td { padding:12px 5px }
.subpage img { width:100% }
}
@media(prefers-reduced-motion:reduce) {
html { scroll-behavior:auto }
* { transition:none!important }
}
.subpage { overflow-wrap:anywhere }
.subpage pre { max-width:100%;overflow-x:auto;padding:18px;background:var(--paper);border:1px solid var(--line);font-size:12px;white-space:pre-wrap;word-break:break-word }
.subpage table { table-layout:fixed }
.subpage code { overflow-wrap:anywhere }
@media(max-width:700px) {
.hero h1 { font-size:40px;letter-spacing:-2px }
}
.navlinks { gap:20px;font-size:12px }
.workbench-points { display:grid;grid-template-columns:repeat(3,1fr);gap:40px }
.workbench-points article { border-top:1px solid var(--line);padding-top:19px }
.point-index { font-size:11px;color:var(--blue) }
.workbench-points h3 { font-size:21px;font-weight:550;margin:16px 0 10px }
.workbench-points p { font-size:13px;color:var(--muted);margin:0 }
.channel-strip { display:flex;align-items:center;gap:28px;margin-top:35px;padding:22px 26px;background:var(--tint) }
.channel-strip strong { font-size:14px;font-weight:600;display:block }
.channel-strip div span { display:block;color:var(--muted);font-size:12px;margin-top:3px }
.channel-plus { font-size:24px;color:#8496b1 }
.channel-strip>a { margin-left:auto;font-size:12px;color:var(--blue) }
.case-link { display:inline-block;font-size:12px;color:var(--blue);margin-top:10px;text-decoration:underline;text-underline-offset:4px }
@media(max-width:960px) {
.navlinks { gap:10px;font-size:11px }
.nav { gap:20px }
.hero { gap:24px }
.workbench-points { gap:25px }
.channel-strip { gap:20px }
.channel-strip>a { max-width:100px }
}
@media(max-width:700px) {
.navlinks { font-size:14px;gap:20px }
.workbench-points { grid-template-columns:1fr;gap:25px }
.workbench-points h3 { font-size:20px }
.channel-strip { padding:20px;display:grid;grid-template-columns:1fr;gap:10px }
.channel-plus { font-size:20px }
.channel-strip>a { margin:10px 0 0;max-width:none }
}
.hero-workflow { padding:36px 36px 24px;background:#edf2fb;border-top:3px solid var(--blue) }
.hero-workflow h2 { font-size:31px;line-height:1.5;font-weight:550;letter-spacing:-1px;margin:18px 0 28px }
.workflow-line { display:flex;gap:22px;border-top:1px solid #cad7ec;padding:19px 0 }
.workflow-line>span { font-size:11px;color:var(--blue);padding-top:4px }
.workflow-line strong { font-size:16px;font-weight:550 }
.workflow-line p { font-size:12px;color:var(--muted);margin:5px 0 0 }
.hero-workflow>a { display:block;padding-top:18px;border-top:1px solid #cad7ec;font-size:12px;color:var(--blue) }
.cases-teaser { display:flex;align-items:center;justify-content:space-between;gap:35px }
.cases-teaser h2 { font-size:32px;font-weight:550;letter-spacing:-1px;margin:12px 0 }
.cases-teaser p { color:var(--muted);font-size:14px }
.cases-teaser .btn { white-space:nowrap }
.case-directory { display:grid;grid-template-columns:1fr 1fr;gap:28px;margin:45px 0 }
.directory-card { border:1px solid var(--line);overflow:hidden;background:white }
.directory-cover { min-height:290px;padding:32px;display:flex;flex-direction:column;justify-content:space-between;gap:22px }
.directory-cover>span { font-size:12px }
.directory-cover strong { font-size:33px;line-height:1.5;font-weight:550;letter-spacing:-1px }
.ecommerce-cover { background:#f0e8db;color:#765331!important }
.legal-cover { background:#142335;color:#e8ddc7!important }
.directory-copy { padding:27px }
.directory-copy h2 { font-size:25px;margin:10px 0 }
.directory-copy h2 a { text-decoration:none!important;color:var(--ink)!important }
.directory-copy p { font-size:13px }
.case-index .directory-cover { text-decoration:none!important }
.case-index .directory-cover:hover strong { text-decoration:underline;text-underline-offset:6px }
@media(max-width:700px) {
.hero-workflow { padding:25px }
.hero-workflow h2 { font-size:27px }
.cases-teaser { display:block }
.cases-teaser h2 { font-size:28px }
.cases-teaser .btn { margin-top:10px }
.case-directory { grid-template-columns:1fr;gap:25px;margin-top:30px }
.directory-cover { min-height:260px }
.directory-copy { padding:24px }
.case-index h1 { font-size:31px }
}

.invite-banner { display:flex; align-items:center; gap:16px; padding:14px 18px; margin:20px 0; background:var(--tint); border:1px solid #ccd7ea; font-size:13px; }
.invite-banner[hidden] { display:none; }
.invite-banner > span { flex:1; overflow-wrap:anywhere; }
.copy-invite { background:white; border:1px solid var(--line); border-radius:4px; padding:7px 12px; color:var(--blue); white-space:nowrap; }
.download-os.recommended { box-shadow:inset 0 3px var(--blue); }
.anchor-alias { display:block; scroll-margin-top:104px; }
@media(max-width:700px) { .invite-banner { align-items:flex-start; flex-direction:column; gap:10px; } }