:root { --ink:#101315; --muted:#677175; --line:#d9dfdc; --paper:#f5f7f5; --acid:#b8f63d; --teal:#0e726d; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:"Plus Jakarta Sans","PingFang SC","Microsoft YaHei",sans-serif; }
a { color:inherit; text-decoration:none; } button { font:inherit; }
.site-header { height:72px; padding:0 clamp(24px,5vw,80px); display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); background:rgba(245,247,245,.9); position:sticky; top:0; z-index:5; backdrop-filter:blur(12px); }
.brand { display:inline-flex; align-items:center; gap:10px; font-size:18px; font-weight:800; letter-spacing:-.045em; }.brand img{ display:block; }
nav { display:flex; gap:30px; margin-left:auto; margin-right:36px; } nav a { color:#4e585b; font-size:14px; font-weight:600; transition:color .2s; } nav a:hover,.text-link:hover { color:var(--teal); }
.header-cta,.button { display:inline-flex; justify-content:center; align-items:center; min-height:42px; padding:0 18px; border:1px solid transparent; border-radius:8px; font-size:14px; font-weight:750; transition:transform .22s cubic-bezier(.16,1,.3,1),background .22s; }.header-cta,.button.primary { background:var(--ink); color:#f7f9f7; }.header-cta:hover,.button.primary:hover { transform:translateY(-2px); background:#273033; }.button:active,.header-cta:active { transform:translateY(1px) scale(.98); }.button.secondary { border-color:#bbc4c1; color:#263033; background:transparent; }
.hero { min-height:calc(100dvh - 72px); max-width:1440px; margin:auto; padding:clamp(60px,8vw,118px) clamp(24px,6vw,92px) 76px; display:grid; grid-template-columns:minmax(0,.92fr) minmax(460px,1.08fr); align-items:center; gap:clamp(38px,6vw,100px); overflow:hidden; }.eyebrow { margin:0 0 18px; color:var(--teal); font-size:11px; font-family:"IBM Plex Mono",monospace; font-weight:600; letter-spacing:.13em; }.hero h1,.section h2 { margin:0; letter-spacing:-.075em; line-height:.98; }.hero h1 { font-size:clamp(45px,5.1vw,76px); max-width:650px; }.hero-description { max-width:500px; margin:25px 0 29px; color:var(--muted); font-size:17px; line-height:1.75; }.hero-actions { display:flex; gap:12px; }
.hero-visual { position:relative; min-height:535px; display:flex; justify-content:center; align-items:center; }.orbit { position:absolute; border:1px solid #d7dfdb; border-radius:50%; }.orbit::before{ content:""; position:absolute; top:50%; left:-5px; width:9px; height:9px; margin-top:-4.5px; border-radius:50%; background:var(--acid); box-shadow:0 0 12px rgba(184,246,61,.75); }.orbit-one { width:610px; height:610px; animation:orbit-spin 110s linear infinite; }.orbit-two { width:440px; height:440px; border-color:#c6d9ca; }.orbit-two::before{ background:var(--teal); box-shadow:0 0 12px rgba(14,114,109,.8); } .orbit-two { animation:orbit-spin 72s linear infinite reverse; }.run-panel { width:min(100%,470px); padding:24px; border:1px solid #1b2728; border-radius:16px; background:#182123; color:#eaf0ed; box-shadow:22px 22px 0 #cfd8d3; position:relative; z-index:1; }.panel-topline { display:flex; align-items:center; justify-content:space-between; }.panel-label,.pass-state,.signal-card span { font:600 10px "IBM Plex Mono",monospace; letter-spacing:.13em; }.pass-state { padding:6px 9px; background:#2b4034; color:#cbff82; border-radius:5px; }.run-panel h2 { margin:17px 0 4px; font-size:21px; letter-spacing:-.04em; }.run-meta { margin:0 0 19px; color:#9eacab; font:12px "IBM Plex Mono",monospace; }.device-preview { width:182px; margin:0 auto 22px; padding:11px; border-radius:21px; background:#f6faf7; color:#1c2a28; box-shadow:0 0 0 5px #29383a; }.device-status { display:flex; justify-content:space-between; font-size:8px; font-weight:700; }.phone-title { margin:15px 0 10px; font-size:14px; font-weight:800; }.phone-search { padding:7px 8px; border-radius:5px; background:#e8eeea; color:#87918d; font-size:9px; }.merchant-card { display:flex; gap:7px; align-items:center; margin:11px 0; }.merchant-card b { display:block; font-size:9px; }.merchant-card small { display:block; margin-top:4px; color:#6d7975; font-size:7px; }.merchant-image { width:36px; height:34px; border-radius:5px; background:linear-gradient(135deg,#e7bc74,#9b6045); }.phone-button { width:100%; border:0; border-radius:5px; padding:8px; background:#1b8b70; color:white; font-size:9px; font-weight:700; }.run-log { border-top:1px solid #344346; }.run-log div { display:grid; grid-template-columns:19px 1fr auto; gap:5px; padding:11px 0 0; color:#c4cfca; font-size:11px; }.run-log code { font-family:"IBM Plex Mono",monospace; }.run-log time { color:#82908b; font-size:10px; }.check { color:var(--acid); }.current span { width:7px;height:7px;margin:4px; border-radius:50%;background:var(--acid); animation:pulse 1.5s infinite; }.signal-card { position:absolute; right:-4px; bottom:14px; z-index:2; padding:15px 17px; border:1px solid #c4d0ca; border-radius:11px; background:#e9efeb; color:#1d2d2a; transform:rotate(-4deg); }.signal-card strong { display:block; margin:5px 0 2px; font-size:25px; letter-spacing:-.08em; }.signal-card i { color:#61706b; font-size:10px; font-style:normal; }
.proof-bar { max-width:1260px; margin:0 auto; padding:23px clamp(24px,5vw,58px); border-top:1px solid var(--line); border-bottom:1px solid var(--line); display:flex; align-items:center; justify-content:space-between; gap:20px; }.proof-bar p { margin:0; font-size:13px; color:#53605e; }.proof-bar div { display:flex; flex-wrap:wrap; gap:18px; }.proof-bar span { font:600 11px "IBM Plex Mono",monospace; color:#253331; }
.section { max-width:1260px; margin:auto; padding:142px clamp(24px,5vw,58px); }.section h2 { font-size:clamp(38px,4.5vw,62px); max-width:780px; }.capability-grid { display:grid; grid-template-columns:1.1fr .9fr; gap:12px; margin-top:58px; }.feature { min-height:285px; padding:29px; border:1px solid var(--line); border-radius:12px; background:#fafcfb; }.feature-large { grid-row:span 2; min-height:582px; background:#e5efea; display:flex; flex-direction:column; justify-content:flex-end; }.feature-tinted { background:#d8e6d9; }.feature-dark { background:#22302e; color:#edf3ef; }.feature-number { margin:0 0 auto; color:#6e7d77; font:11px "IBM Plex Mono",monospace; }.feature h3 { margin:18px 0 10px; font-size:26px; line-height:1.08; letter-spacing:-.06em; }.feature p:not(.feature-number) { max-width:400px; margin:0; color:#61706b; font-size:14px; line-height:1.7; }.feature-dark p:not(.feature-number) { color:#b6c3bd; }.prompt-block { margin-top:42px; padding:14px; border:1px solid #bfd0c6; border-radius:7px; background:#f5f8f5; }.prompt-block span { display:block; margin-bottom:7px; color:var(--teal); font:10px "IBM Plex Mono",monospace; }.prompt-block code { font-size:13px; color:#2c3b37; }
.workflow { background:#d9e9df; max-width:none; padding-left:max(24px,calc((100vw - 1144px)/2)); padding-right:max(24px,calc((100vw - 1144px)/2)); }.workflow-heading p:not(.eyebrow) { max-width:470px; color:#53625c; line-height:1.7; }.workflow-steps { margin-top:56px; display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid #afc6b7; }.workflow-steps article { padding:21px 26px 8px 0; margin-right:22px; }.workflow-steps article+article { border-left:1px solid #afc6b7; padding-left:22px; }.workflow-steps span { display:block; font-size:18px; font-weight:750; letter-spacing:-.045em; }.workflow-steps p { color:#57675f; font-size:13px; line-height:1.65; }
.platforms { display:grid; grid-template-columns:.9fr 1.1fr; gap:100px; align-items:center; }.platform-copy p { max-width:420px; margin:24px 0; color:var(--muted); font-size:15px; line-height:1.75; }.text-link { color:var(--teal); font-size:14px; font-weight:750; }.platform-list { border-top:1px solid var(--line); }.platform-list div { display:flex; align-items:baseline; justify-content:space-between; gap:20px; padding:17px 0; border-bottom:1px solid var(--line); }.platform-list b { font-size:22px; letter-spacing:-.05em; }.platform-list span { color:#71807a; font-size:13px; }.final-cta { max-width:none; padding-left:max(24px,calc((100vw - 1144px)/2)); padding-right:max(24px,calc((100vw - 1144px)/2)); background:#182322; color:#eff7f0; }.final-cta .eyebrow { color:#b8f63d; }.final-cta h2 { max-width:900px; margin-bottom:34px; } footer { max-width:1260px; margin:auto; padding:31px clamp(24px,5vw,58px); display:flex; align-items:center; justify-content:space-between; }footer p{margin:0;color:#79847f;font:12px "IBM Plex Mono",monospace;}
.reveal { opacity:0; transform:translateY(18px); transition:opacity .7s cubic-bezier(.16,1,.3,1),transform .7s cubic-bezier(.16,1,.3,1); }.reveal.visible { opacity:1; transform:none; } @keyframes pulse { 50% { opacity:.35; transform:scale(.7); } } @media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}.current span{animation:none}}
@media (max-width:800px) { .site-header{height:64px;padding:0 20px} nav{display:none}.hero{min-height:auto;padding:66px 24px 86px;grid-template-columns:1fr;gap:45px}.hero h1{font-size:clamp(42px,12vw,61px)}.hero-visual{min-height:490px;transform:scale(.92);transform-origin:center}.proof-bar{align-items:flex-start;flex-direction:column;padding:20px 24px}.section{padding:90px 24px}.capability-grid{grid-template-columns:1fr;margin-top:38px}.feature-large{min-height:430px}.feature{min-height:250px}.workflow-steps{grid-template-columns:1fr 1fr}.workflow-steps article:nth-child(3){border-left:0;padding-left:0}.workflow-steps article{margin-right:12px}.platforms{grid-template-columns:1fr;gap:45px}.final-cta h2{font-size:clamp(37px,10vw,53px)} }
@media (max-width:480px) { .header-cta{min-height:37px;padding:0 12px;font-size:12px}.hero-actions{flex-direction:column;align-items:stretch}.hero-visual{min-height:450px;transform:scale(.78);margin:-48px -50px}.workflow-steps{grid-template-columns:1fr}.workflow-steps article,.workflow-steps article+article,.workflow-steps article:nth-child(3){border-left:0;border-top:1px solid #afc6b7;padding:18px 0;margin:0}.workflow-steps article:first-child{border-top:0}.platform-list div{align-items:flex-start;flex-direction:column;gap:6px} }

/* 结尾 CTA 按钮:置于深色(#182322)区,默认墨色按钮被吞,改用品牌酸性绿点亮并加大 */
.final-cta .button.primary {
  background:#b8f63d;
  color:#182322;
  min-height:56px;
  padding:0 32px;
  font-size:16px;
  box-shadow:0 10px 26px rgba(184,246,61,.30);
}
.final-cta .button.primary:hover {
  background:#c6ff57;
  transform:translateY(-2px);
  box-shadow:0 14px 30px rgba(184,246,61,.40);
}
@media (max-width:480px){
  .final-cta .button.primary { width:100%; box-sizing:border-box; }
}

/* 轨道自转动画 */
@keyframes orbit-spin { to { transform:rotate(360deg); } }

/* 辅助偏好:减少动画 → 停掉轨道旋转 */
@media (prefers-reduced-motion:reduce){ .orbit{animation:none!important} }