/* Pie 对外官网：白底、近黑字、细字重；青苹果绿只给主按钮和一处强调（DESIGN.md §5 Ramp 参考） */
:root{
  --bg:#ffffff;--ink:#0c0a08;--ink2:#3a3a3c;--muted:#6e6e73;--line:#ececee;--soft:#f7f7f8;
  --accent:#a6ed1b;--accent-ink:#2f5d00;--ok-bg:#e6f2e9;
  --font:-apple-system,BlinkMacSystemFont,"SF Pro Display","Segoe UI","Helvetica Neue","PingFang SC","Microsoft YaHei",Roboto,sans-serif;
  --r:14px;--shadow:0 1px 2px rgba(0,0,0,.04),0 12px 32px rgba(0,0,0,.08);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font);font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased}
a{color:inherit}
img{max-width:100%}
.wrap{max-width:1120px;margin:0 auto;padding-inline:20px}
.row{display:flex;align-items:center;justify-content:space-between;gap:16px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* 三语：html[lang] 决定显示哪一种（en / fr / zh）。.nfr = 英文和中文共用、法文时换掉的内容（价格写法、法律主体一句话等） */
html[lang="en"] .zh,html[lang="en"] .fr,html[lang="en"] .zh-only{display:none}
html[lang="fr"] .en,html[lang="fr"] .zh,html[lang="fr"] .zh-only,html[lang="fr"] .nfr{display:none}
html[lang="zh"] .en,html[lang="zh"] .fr{display:none}

.top{position:sticky;top:0;z-index:5;background:rgba(255,255,255,.86);-webkit-backdrop-filter:saturate(180%) blur(16px);backdrop-filter:saturate(180%) blur(16px);border-bottom:1px solid var(--line)}
.top .row{height:64px}
.brand{display:flex;align-items:center;gap:8px;text-decoration:none;font-weight:500;font-size:20px;letter-spacing:-.02em}
.brand-zh{color:var(--muted);font-weight:400}
.nav{display:flex;align-items:center;gap:20px;font-size:14px}
.nav a{text-decoration:none;color:var(--ink2)}
.nav a:hover{color:var(--ink)}
.lang{-webkit-appearance:none;appearance:none;text-align:center;background:none;border:1px solid var(--line);border-radius:999px;padding:6px 12px;font:inherit;font-size:13px;color:var(--ink2);cursor:pointer}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;background:var(--accent);color:#0c0a08;border:0;border-radius:999px;padding:14px 22px;font:inherit;font-weight:500;text-decoration:none;cursor:pointer;white-space:nowrap;transition:transform 140ms cubic-bezier(.23,1,.32,1),filter .15s}
.btn:hover{filter:brightness(.96)}
.btn:active{transform:scale(.97)}
.btn.small{padding:8px 16px;font-size:14px}
.btn:focus-visible,.lang:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible{outline:2px solid var(--ink);outline-offset:2px}

.eyebrow{margin:0 0 16px;font-size:13px;color:var(--muted);letter-spacing:.02em}
h1{margin:0 0 20px;font-size:clamp(40px,6vw,64px);line-height:1.04;font-weight:400;letter-spacing:-.035em;text-wrap:balance}
h2{margin:0 0 28px;font-size:clamp(28px,4vw,40px);line-height:1.12;font-weight:400;letter-spacing:-.025em;text-wrap:balance}
h3{margin:0 0 8px;font-size:18px;font-weight:500;letter-spacing:-.01em}
.lede{margin:0 0 28px;font-size:18px;color:var(--ink2);max-width:36em}
.pill{display:flex;align-items:center;gap:6px;max-width:480px;background:#fafafa;border:1px solid var(--line);border-radius:999px;padding:6px}
.pill input[type=email]{flex:1;min-width:0;border:0;background:transparent;font:inherit;font-size:16px;padding:10px 14px;color:var(--ink)}
.pill input:focus{outline:none}
.fine{margin:12px 0 0;font-size:13px;color:var(--muted)}

.works{padding-block:24px 64px}
.works-head{margin:0 0 18px;text-align:center;font-size:14px;color:var(--muted)}
/* 合作平台：原色 logo。默认（没有 JS / 减少动态效果）平铺；JS 接管后变成固定格子轮换 */
.logos{list-style:none;margin:0 auto;padding:0;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:20px 56px;max-width:1040px}
.logos li{display:flex;align-items:center;justify-content:center;height:56px}
.logos img{height:var(--h,26px);width:auto;max-width:100%}
.logos.roll{display:grid;grid-template-columns:repeat(var(--n,4),minmax(0,1fr));gap:0 24px}
.logos.roll .slot{display:grid;place-items:center;height:56px;overflow:hidden}
.logos.roll .slot>li{grid-area:1/1;transition:transform .7s cubic-bezier(.23,1,.32,1),opacity .5s ease}
.logos.roll .slot>li.below{transform:translateY(70%);opacity:0}
.logos.roll .slot>li.above{transform:translateY(-70%);opacity:0}
@media (max-width:560px){.logos{gap:16px 36px}.logos img{height:calc(var(--h,26px) * .82)}.logos.roll{gap:0 12px}}

.features{padding-block:56px;border-top:1px solid var(--line)}
.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px 32px}
.grid article p{margin:0;color:var(--ink2)}

.gift{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:48px;align-items:center;padding-block:72px;border-top:1px solid var(--line)}
.gift-copy>p{color:var(--ink2);margin:0 0 20px;max-width:36em}
.ticks{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.ticks li{position:relative;padding-left:28px}
.ticks li::before{content:"";position:absolute;left:0;top:.35em;width:16px;height:16px;border-radius:50%;background:var(--accent)}
.gift-cta{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px;margin-top:28px}
/* 礼品卡 + 会员（2026-10-18）：左边黑底储值价格，右边会员玩法，一样大 */
.gift2{padding-block:72px;border-top:1px solid var(--line)}
.gift2 h2{margin:6px 0 10px}
.g2-lead{color:var(--muted);margin:0 0 28px;font-size:17px}
.g2-duo{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px}
.g2-pane{border:1px solid var(--line);border-radius:24px;padding:28px;display:grid;gap:16px;align-content:start}
.g2-pane.dark{background:#0c0a08;color:#fff;border-color:#0c0a08}
.g2-k{font-size:13px;letter-spacing:.04em;color:var(--muted);display:flex;align-items:center;gap:8px}
.g2-pane.dark .g2-k,.g2-pane.dark small{color:#a1a1a6}
.g2-big{font-size:clamp(40px,5vw,52px);letter-spacing:-.03em;line-height:1;font-variant-numeric:tabular-nums}
.g2-big small{font-size:15px;letter-spacing:0}
.g2-pane ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.g2-pane li{display:flex;gap:10px;align-items:baseline}
.g2-pane li::before{content:"✓";color:var(--accent);font-weight:600}
.g2-inc{font-size:12px;border-radius:999px;padding:2px 10px;background:#eefbd5;color:#2f5d00;letter-spacing:0}
.g2-mech{display:grid;gap:14px}
.g2-m{display:grid;grid-template-columns:48px 1fr;gap:14px;align-items:center}
.g2-ic{width:48px;height:48px;border-radius:14px;background:#eefbd5;display:grid;place-items:center;font-size:21px}
.g2-more .g2-ic{background:var(--soft,#f3f3f5)}
.g2-m b{display:block;font-weight:500;font-size:18px}
.g2-m span:not(.g2-ic){font-size:14px;color:var(--muted)}
@media (max-width:900px){.g2-duo{grid-template-columns:minmax(0,1fr)}.g2-pane{padding:22px}}
.gift-login{font-size:14px;color:var(--ink2);text-decoration:none}
.gift-login:hover{color:var(--ink);text-decoration:underline}
.card-art{display:flex;justify-content:center}
.gc{position:relative;width:min(340px,100%);aspect-ratio:1.586;border-radius:18px;background:#0c0a08;color:#fff;padding:22px;display:flex;flex-direction:column;justify-content:space-between;box-shadow:var(--shadow)}
.gc-brand{font-size:15px;letter-spacing:.02em}
.gc-code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:15px;color:#cfcfd4;letter-spacing:.06em}
.gc-bal{font-size:32px;letter-spacing:-.02em;color:var(--accent);font-variant-numeric:tabular-nums}

.faq{padding-block:56px;border-top:1px solid var(--line);max-width:820px}
.faq details{border-bottom:1px solid var(--line);padding-block:18px}
.faq summary{cursor:pointer;font-size:18px;list-style:none;display:flex;justify-content:space-between;gap:16px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";color:var(--muted);font-size:22px;line-height:1}
.faq details[open] summary::after{content:"–"}
.faq details p{margin:12px 0 0;color:var(--ink2)}
/* 多种情况的回答拆成编号（2026-10-17 Roger：「这种有条理的介绍方式应用到所有地方」） */
.faq .faq-steps{margin:12px 0 0;padding-left:1.4em;color:var(--ink2);display:grid;gap:6px}
.faq .faq-steps li::marker{color:var(--muted);font-variant-numeric:tabular-nums}
.faq details p.faq-tail{margin-top:10px;color:var(--muted)}

.cta{text-align:center;padding-block:80px;border-top:1px solid var(--line)}
.cta h2{margin-bottom:24px}

.foot{border-top:1px solid var(--line);background:var(--soft);padding-block:40px 24px;font-size:14px;color:var(--muted)}
.foot-row{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap}
.foot p{margin:10px 0 0}
.foot nav{display:flex;gap:20px;flex-wrap:wrap}
.foot a{text-decoration:none}
.foot a:hover{color:var(--ink)}
.small-brand{font-size:16px;color:var(--ink)}
.copy{margin-top:24px;font-size:12px}

/* 法律页 */
.legal{max-width:760px;padding-block:56px 80px}
.legal h1{font-size:clamp(32px,5vw,44px);margin-bottom:8px}
.legal .upd{color:var(--muted);font-size:14px;margin:0 0 32px}
.legal h2{font-size:22px;margin:36px 0 10px;font-weight:500;letter-spacing:-.01em}
.legal p,.legal li{color:var(--ink2)}
.legal ul{padding-left:20px}
.legal table{border-collapse:collapse;width:100%;font-size:14px;margin:8px 0}
.legal th,.legal td{border-bottom:1px solid var(--line);padding:8px 6px;text-align:left;vertical-align:top}
.legal th{font-weight:500;color:var(--ink)}
.tbl{overflow-x:auto}

@media (max-width:900px){
  .gift{grid-template-columns:1fr;gap:32px}
  .grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .nav a:not(.btn){display:none}
}
@media (max-width:560px){
  .grid{grid-template-columns:1fr;gap:28px}
  .pill{flex-direction:column;align-items:stretch;border-radius:20px}
  .pill .btn{width:100%}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.btn{transition:none}}

/* 定价页 /pricing（2026-10-10）：Lite 底座 + 模块勾选 + $199 封顶计算器 */
.nav a[aria-current="page"]{color:var(--ink);font-weight:500}
.pr-head{padding-block:64px 28px;max-width:820px}
.promises{display:flex;flex-wrap:wrap;gap:8px 18px;margin:0;padding:0;list-style:none;font-size:14px;color:var(--ink2)}
.promises li::before{content:"✓";color:var(--accent-ink);font-weight:600;margin-right:6px}
.pr-ends{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;padding-block:8px 56px}
.pr-end{display:flex;flex-direction:column;gap:14px;border:1px solid var(--line);border-radius:var(--r);padding:26px 24px}
.pr-end.hi{border-color:var(--ink);box-shadow:var(--shadow)}
.pr-price{display:flex;align-items:baseline;gap:6px;flex-wrap:wrap}
.pr-price b{font-size:46px;font-weight:400;letter-spacing:-.04em;font-variant-numeric:tabular-nums}
.pr-price small,.muted{color:var(--muted);font-size:14px}
.pr-sub{margin:0;color:var(--ink2)}
.pr-feat{margin:0;padding:0;list-style:none;display:grid;gap:8px;font-size:15px}
.pr-feat li{display:grid;grid-template-columns:18px 1fr;gap:6px}
.pr-feat li::before{content:"✓";color:var(--accent-ink);font-weight:600}
.pr-chip{align-self:flex-start;font-size:13px;color:var(--accent-ink);background:var(--ok-bg);border-radius:8px;padding:5px 10px;font-variant-numeric:tabular-nums}
.pr-plans,.pr-compare,.pr-rules{border-top:1px solid var(--line);padding-block:56px}
.pr-soon{display:inline-block;margin-left:6px;font-size:11px;font-weight:500;color:#8a5a00;background:#fff6e0;border-radius:6px;padding:1px 6px;vertical-align:2px}
.pr-tbl{overflow-x:auto;border:1px solid var(--line);border-radius:12px}
.pr-tbl table{border-collapse:collapse;width:100%;min-width:560px;font-size:15px}
.pr-tbl th,.pr-tbl td{text-align:left;padding:13px 16px;border-bottom:1px solid var(--line);vertical-align:top}
.pr-tbl th{font-size:13px;font-weight:500;color:var(--muted);background:var(--soft)}
.pr-tbl tr:last-child td{border-bottom:0}
.pr-tbl td.n{font-variant-numeric:tabular-nums;white-space:nowrap}
.pr-rule-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px 40px}
.pr-rule-grid p{margin:6px 0 0;color:var(--ink2);font-size:15px}
@media (max-width:900px){.pr-ends,.pr-rule-grid{grid-template-columns:minmax(0,1fr)}}

/* 首页（2026-10-10 第二版，参考 monday.com/crm）：居中首屏 + 四角漂浮小卡 + 「你想先解决什么」选项格；
   往下是层层叠起来的功能卡（每张左边一句话、右边同一件事在动的界面），最后是其余功能三列 */
.hero2{position:relative;padding-block:84px 64px;overflow:hidden}
.hero2-in{position:relative;z-index:1;max-width:1020px;text-align:center;display:flex;flex-direction:column;align-items:center}
.hero2 h1{font-size:clamp(42px,6.6vw,78px);line-height:1.02;letter-spacing:-.045em;margin-bottom:22px;max-width:880px}
.hero2 .lede{max-width:34em;margin:0 0 30px}
.hero2 .pill{width:100%;max-width:500px}
.pick-q{margin:60px 0 16px;font-size:15px;color:var(--muted)}
.picks{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;width:100%}
.pick{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;min-height:112px;padding:22px 10px 16px;border:1px solid var(--line);border-radius:18px;background:var(--bg);text-decoration:none;font-size:14px;font-weight:500;line-height:1.3;color:var(--ink);transition:border-color 160ms ease,box-shadow 200ms ease,transform 160ms cubic-bezier(.23,1,.32,1)}
.pick svg{width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.pk-box{position:absolute;top:10px;left:10px;width:16px;height:16px;border-radius:5px;border:1.5px solid #c7c7cc;transition:background 160ms ease,border-color 160ms ease}
.pk-box::after{content:"";position:absolute;left:4px;top:1px;width:4px;height:8px;border:solid var(--ink);border-width:0 2px 2px 0;transform:rotate(45deg) scale(.6);opacity:0;transition:opacity 160ms ease,transform 160ms cubic-bezier(.23,1,.32,1)}
@media (hover:hover){
  .pick:hover{border-color:var(--ink);box-shadow:var(--shadow)}
  .pick:hover .pk-box{background:var(--accent);border-color:var(--accent)}
  .pick:hover .pk-box::after{opacity:1;transform:rotate(45deg) scale(1)}
}
.pick:active{transform:scale(.97)}

/* 漂浮小卡：宽屏才出现，先依次浮现，再极轻地上下飘（只动 8px） */
.floaters{position:absolute;inset:0;pointer-events:none;display:none}
.fl{position:absolute;display:flex;align-items:center;gap:10px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:10px 14px;font-size:13px;color:var(--ink2);white-space:nowrap;box-shadow:0 1px 2px rgba(0,0,0,.04),0 12px 30px rgba(0,0,0,.08);opacity:0;scale:.96;animation:flin .7s cubic-bezier(.23,1,.32,1) var(--dl) forwards,fldrift 6s ease-in-out var(--dl) infinite alternate}
.fl>i{width:8px;height:8px;border-radius:50%;background:var(--c);flex:none}
.fl b{color:var(--ink);font-weight:500}
.fl .cur{position:absolute;right:-12px;bottom:-16px;width:20px;height:20px;fill:var(--ink);stroke:#fff;stroke-width:1.5}
.fl .cur.c2{right:auto;left:-12px;transform:scaleX(-1)}
.fl1{top:72px;left:calc(50% - 680px);rotate:-3deg;--dl:.25s}
.fl2{top:316px;left:calc(50% - 640px);rotate:2deg;--dl:.55s}
.fl3{top:92px;right:calc(50% - 680px);rotate:3deg;--dl:.4s}
.fl4{top:330px;right:calc(50% - 650px);rotate:-2deg;--dl:.7s}
@keyframes flin{to{opacity:1;scale:1}}
@keyframes fldrift{from{translate:0 0}to{translate:0 -8px}}
@media (min-width:1360px){.floaters{display:block}}

/* 叠卡（照 monday.com/crm 的 hp-sticky-card）：纯 CSS position:sticky，第 i 张停在 88px + i×16px，
   往下滚时一张盖一张、上面露出一条边。被盖住的卡由 site.js 按盖住的比例缩小、变暗（「收紧」）。900px 以下不叠，正常往下排 */
.stack-sec{padding-block:80px 24px;border-top:1px solid var(--line)}
.stack-title{text-align:center;margin-bottom:48px}
.stack{padding-bottom:10vh}
.scard{--cb:#f2f2f4;--cf:var(--ink);--cm:var(--ink2);--tb:#fff;--tf:var(--ink);--vb:#fff;position:sticky;top:calc(88px + var(--i) * 16px);display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:48px;align-items:center;height:clamp(470px,calc(100vh - 150px),560px);margin-bottom:64px;padding:40px 40px 40px 52px;border-radius:28px;background:var(--cb);color:var(--cf);transform-origin:50% 0;overflow:hidden}
.scard:last-child{margin-bottom:0}
#c-pause{--cb:#eefbd5;--tf:var(--accent-ink)}
#c-print{--cb:#2f5d00;--cf:#fff;--cm:#d4e8b8;--tb:rgba(255,255,255,.14);--tf:#fff;--vb:#f7f7f8}
#c-net{--cb:#1b2a10;--cf:#fff;--cm:#c3cbb9;--tb:rgba(166,237,27,.14);--tf:var(--accent);--vb:#f7f7f8}
#c-margin{--cb:#0c0a08;--cf:#fff;--cm:#a1a1a6;--tb:rgba(166,237,27,.14);--tf:var(--accent);--vb:#f7f7f8}
.sc-tag{display:inline-block;font-size:13px;font-weight:500;padding:6px 12px;border-radius:999px;background:var(--tb);color:var(--tf)}
.sc-text h3{margin:18px 0 16px;font-size:clamp(28px,3.1vw,40px);line-height:1.08;font-weight:400;letter-spacing:-.03em;text-wrap:balance}
.sc-text p{margin:0;font-size:17px;color:var(--cm);max-width:30em}
.sc-vis{height:100%;min-height:0;display:flex;flex-direction:column;background:var(--vb);color:var(--ink);border-radius:20px;padding:28px 26px}
.sc-dim{position:absolute;inset:0;background:#000;opacity:0;pointer-events:none}

/* 演示场景：.on 由 site.js 在卡片露出一半时加上，场景里的动画从头播 */
.scene{flex:1;display:flex;flex-direction:column;gap:18px}
.sc-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;font-size:14px;color:var(--muted)}
.sc-head b{font-size:20px;font-weight:500;color:var(--ink);letter-spacing:-.01em}
.sc-done{margin:auto 0 0;font-size:14px;color:var(--accent-ink);background:var(--ok-bg);border-radius:12px;padding:12px 14px;opacity:0;transform:translateY(6px);transition:opacity .3s,transform .3s}
.scene.on .sc-done{opacity:1;transform:none;transition-delay:1.5s}

/* 平台行：品牌色只做小圆点 */
.plats{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;background:#fff;border-radius:16px;border:1px solid var(--line)}
.plats li{display:flex;align-items:center;gap:10px;padding:14px 16px;border-bottom:1px solid var(--line);font-size:15px}
.plats li:last-child{border-bottom:0}
.plats li>i{width:8px;height:8px;border-radius:50%;background:var(--c);flex:none}
.plats .sw,.plats .st{margin-left:auto}

/* 下架：开关依次关掉 */
.sw{position:relative;width:42px;height:26px;border-radius:999px;background:var(--accent);flex:none;transition:background .25s}
.sw::after{content:"";position:absolute;top:2px;left:18px;width:22px;height:22px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.2);transition:left .25s cubic-bezier(.23,1,.32,1)}
.scene.on .sw{background:#e3e3e8;transition-delay:calc(var(--d) + 700ms)}
.scene.on .sw::after{left:2px;transition-delay:calc(var(--d) + 700ms)}

/* 暂停：门店状态从营业中变暂停中，各平台跟着变 */
.state{display:inline-grid;justify-items:end;font-size:13px;border-radius:999px;padding:4px 10px;background:var(--ok-bg);color:var(--accent-ink);white-space:nowrap;transition:background .2s,color .2s}
.state>span{grid-area:1/1;transition:opacity .2s}
.state .s-paused{opacity:0}
.scene.on .state{background:#fff3e0;color:#9a5b00;transition-delay:.6s}
.scene.on .state .s-open{opacity:0;transition-delay:.6s}
.scene.on .state .s-paused{opacity:1;transition-delay:.6s}
.plats.pause .st{font-size:13px;color:#9a5b00;opacity:0;transition:opacity .25s}
.scene.on .plats.pause .st{opacity:1;transition-delay:calc(var(--d) + 800ms)}
.timer{height:6px;border-radius:99px;background:#e9e9ee;overflow:hidden}
.timer i{display:block;height:100%;width:100%;background:#f0a63a;transform-origin:left;transform:scaleX(1)}
.scene.on .timer i{transform:scaleX(.72);transition:transform 3.5s linear 1.4s}

/* 打印：小票从打印机里出来 */
.printer{background:#1d1d1f;color:#d1d1d6;border-radius:14px;padding:14px 16px 18px;font-size:13px;position:relative;z-index:1}
.printer::after{content:"";position:absolute;left:18px;right:18px;bottom:6px;height:4px;border-radius:2px;background:#000}
.tickets{display:flex;flex-direction:column;gap:12px;margin-top:-18px;padding:0 22px;overflow:hidden}
.ticket{display:flex;flex-direction:column;gap:2px;background:#fff;border:1px solid var(--line);border-radius:0 0 10px 10px;padding:16px 16px 12px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:13px;color:var(--ink2);transform:translateY(-110%);opacity:0;transition:transform .6s cubic-bezier(.23,1,.32,1),opacity .2s}
.ticket b{font-family:var(--font);font-size:14px;font-weight:600;color:var(--ink);margin-bottom:4px}
.ticket em{font-style:normal;color:var(--muted);margin-top:4px}
.ticket.t2{border-radius:10px}
.scene.on .ticket{transform:none;opacity:1}
.scene.on .t1{transition-delay:.3s}
.scene.on .t2{transition-delay:1.2s}

/* 到手：所有平台一页看完 */
.live{display:inline-flex;align-items:center;gap:6px;font-size:13px;white-space:nowrap}
.live i{width:7px;height:7px;border-radius:50%;background:#34c759}
.big{font-size:44px;letter-spacing:-.03em;font-variant-numeric:tabular-nums;line-height:1}
.big small{font-size:14px;letter-spacing:0;color:var(--muted);margin-left:6px}
.rows{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}
.rows li{display:grid;grid-template-columns:8px minmax(0,1fr) auto;align-items:center;column-gap:10px;row-gap:6px;font-size:15px}
.rows li>i{width:8px;height:8px;border-radius:50%;background:var(--c)}
.rows li b{font-weight:500;font-variant-numeric:tabular-nums}
.rows li::after{content:"";grid-column:2/4;height:4px;border-radius:2px;background:linear-gradient(var(--c),var(--c)) left/0 100% no-repeat,#e9e9ee;transition:background-size .7s cubic-bezier(.23,1,.32,1)}
.scene.on .rows li::after{background-size:var(--w) 100%}
.scene.on .rows li:nth-child(2)::after{transition-delay:.08s}.scene.on .rows li:nth-child(3)::after{transition-delay:.16s}
.scene.on .rows li:nth-child(4)::after{transition-delay:.24s}.scene.on .rows li:nth-child(5)::after{transition-delay:.32s}

/* 成本与活动：各平台毛利逐行出来，最后给活动打「保留 / 下线」 */
.mrows{list-style:none;margin:0;padding:0;background:#fff;border:1px solid var(--line);border-radius:16px}
.mrows li,.verdicts li{opacity:0;translate:0 6px;transition:opacity .35s ease,translate .35s cubic-bezier(.23,1,.32,1)}
.mrows li{display:flex;justify-content:space-between;gap:12px;padding:13px 16px;border-bottom:1px solid var(--line);font-size:15px}
.mrows li:last-child{border-bottom:0}
.mrows b{font-weight:500;font-variant-numeric:tabular-nums;color:var(--accent-ink)}
.mrows li.bad b{color:#b3261e}
.verdicts{list-style:none;margin:auto 0 0;padding:0;display:grid;gap:8px}
.verdicts li{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:14px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:10px 14px}
.verdicts em{font-style:normal;font-size:12px;font-weight:600;border-radius:999px;padding:3px 10px}
.verdicts .keep{background:var(--ok-bg);color:var(--accent-ink)}
.verdicts .stop{background:#fdecea;color:#b3261e}
.scene.on .mrows li,.scene.on .verdicts li{opacity:1;translate:0 0;transition-delay:calc(var(--d) + 300ms)}

.more{padding-block:72px;border-top:1px solid var(--line)}

@media (max-width:900px){
  .hero2{padding-block:52px 40px}
  .pick-q{margin-top:44px}
  .picks{grid-template-columns:repeat(3,minmax(0,1fr))}
  .stack-sec{padding-block:56px 8px}
  .stack-title{margin-bottom:28px}
  .stack{padding-bottom:0}
  .scard{position:relative;top:auto;grid-template-columns:minmax(0,1fr);height:auto;gap:24px;padding:28px 22px 22px;margin-bottom:16px;border-radius:24px}
  .sc-vis{height:auto;min-height:340px}
  .more{padding-block:48px}
}
/* 手机 / 平板也叠（2026-10-11 Roger 要）：上下排的卡片压成一屏高，停在 72px + i×10px；
   文字和演示都收紧一号，演示区吃剩下的高度。屏幕太矮（<600px，横屏或小手机）就不叠，正常往下排 */
@media (max-width:900px) and (min-height:600px){
  .stack{padding-bottom:6vh}
  .scard{position:sticky;top:calc(72px + var(--i) * 10px);grid-template-rows:auto minmax(0,1fr);align-items:stretch;height:calc(100vh - 124px);height:calc(100svh - 124px);max-height:760px;gap:14px;padding:20px 18px 18px;margin-bottom:28px}
  .sc-tag{font-size:12px;padding:5px 10px}
  .sc-text h3{margin:10px 0 8px;font-size:clamp(22px,6.2vw,28px)}
  .sc-text p{font-size:14.5px;line-height:1.45}
  .sc-vis{min-height:0;height:auto;overflow:hidden;padding:16px 14px;border-radius:16px}
  .scene{gap:12px}
  .sc-head b{font-size:17px}
  .plats li{padding:9px 12px;font-size:14px}
  .sw{width:38px;height:23px}.sw::after{width:19px;height:19px;left:17px}
  .sc-done{font-size:13px;padding:9px 12px}
  .printer{padding:11px 14px 15px}
  .ticket{padding:12px 14px 10px;font-size:12px}
  .tickets{gap:8px}
  .big{font-size:32px}
  .rows{gap:8px}.rows li{font-size:14px;row-gap:4px}
  .mrows li{padding:9px 12px;font-size:14px}
  .verdicts{gap:6px}.verdicts li{padding:8px 12px;font-size:13px}
}
@media (max-width:560px){
  .picks{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pick{min-height:96px}
  .sc-vis{padding:22px 16px;border-radius:16px}
  .big{font-size:36px}
}
/* 减少动态效果：不叠、不飘、不播动画，直接显示每个场景做完的样子（site.js 会一次给所有场景加 .on） */
@media (prefers-reduced-motion:reduce){
  .fl{animation:none;opacity:1;scale:1}
  .pick,.sc-done,.sw,.sw::after,.plats .st,.timer i,.ticket,.rows li::after,.state,.state>span,.mrows li,.verdicts li{transition:none!important}
}

/* 定价页四档卡片（2026-10-11 上线）：白 / 白 / 浅绿「最受欢迎」/ 黑；底部 = 单买多少、省多少 + 含几个模块的进度条 */
.tiers{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;padding-block:8px 56px}
.tier{display:flex;flex-direction:column;gap:14px;border-radius:24px;padding:22px 22px 18px;background:var(--bg);border:1px solid var(--line)}
.tier-h{display:flex;align-items:center;gap:10px;min-height:34px}
.tier-h h3{margin:0;font-size:18px}
.tier-ic{width:34px;height:34px;border-radius:50%;background:var(--soft);display:grid;place-items:center;flex:none;color:var(--ink)}
.tier-ic svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.tier-tag{margin-left:auto;font-size:12px;font-weight:500;background:var(--ink);color:#fff;border-radius:999px;padding:4px 10px;white-space:nowrap}
.tier-price{display:flex;align-items:baseline;flex-wrap:wrap;gap:6px}
.tier-price b{font-size:42px;font-weight:400;letter-spacing:-.04em;line-height:1;font-variant-numeric:tabular-nums}
.tier-price small{color:var(--muted);font-size:14px}
.tier-sub{margin:0;color:var(--ink2);font-size:15px}
.tier-feat{list-style:none;margin:0;padding:0;display:grid;gap:8px;font-size:14.5px}
.tier-feat li{display:grid;grid-template-columns:16px 1fr;gap:8px}
.tier-feat li::before{content:"✓";color:var(--accent-ink);font-weight:600}
.tier-feat li.plus{font-weight:500}
.tier-f{margin-top:auto;padding-top:16px;display:grid;gap:8px}
.tier-row{display:flex;justify-content:space-between;gap:8px;font-size:13px;font-weight:500;font-variant-numeric:tabular-nums}
.tier-row span:first-child{min-width:0}
.tier-row span:last-child{color:var(--muted);font-weight:400;white-space:nowrap}
.tier-bar{height:6px;border-radius:99px;background:#ececee;overflow:hidden}
.tier-alc{font-size:12.5px;color:var(--muted)}
.tier.dark .tier-alc{color:#a1a1a6}
.tier-bar i{display:block;height:100%;width:var(--w,0);background:var(--ink);border-radius:99px;transition:width .7s cubic-bezier(.23,1,.32,1)}
.tier.pop{background:#eefbd5;border-color:#eefbd5}
.tier.pop .tier-ic{background:#fff}
.tier.pop .tier-bar{background:rgba(12,10,8,.1)}
.tier.dark{background:#0c0a08;border-color:#0c0a08;color:#fff}
.tier.dark .tier-sub,.tier.dark .tier-price small,.tier.dark .tier-row span:last-child{color:#a1a1a6}
.tier.dark .tier-ic{background:#2a2a2c;color:#fff}
.tier.dark .tier-feat li::before{color:var(--accent)}
.tier.dark .tier-bar{background:#2a2a2c}.tier.dark .tier-bar i{background:var(--accent)}
@media (max-width:1000px){.tiers{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){.tiers{grid-template-columns:minmax(0,1fr)}.tier-price b{font-size:38px}}
@media (prefers-reduced-motion:reduce){.tier-bar i{transition:none}}

/* 建站服务（2026-10-12）：首页 #websites 示意网页 + /pricing 建站块 + /websites 页 */
.web-more{margin:24px 0 0}
.site-art{display:flex;justify-content:center}
.bw{width:min(380px,100%);border:1px solid var(--line);border-radius:16px;background:var(--bg);box-shadow:var(--shadow);overflow:hidden;font-size:13px}
.bw-bar{display:flex;align-items:center;gap:6px;padding:10px 12px;background:var(--soft);border-bottom:1px solid var(--line)}
.bw-bar i{width:9px;height:9px;border-radius:50%;background:#d9d9de}
.bw-bar span{flex:1;margin-left:8px;background:var(--bg);border:1px solid var(--line);border-radius:999px;padding:3px 10px;color:var(--muted);font-size:12px}
.bw-body{padding:16px;display:grid;gap:12px}
.bw-nav{display:flex;justify-content:space-between;align-items:center}
.bw-nav b{font-weight:600;font-size:15px}
.bw-lang{color:var(--muted)}
.bw-lang em{font-style:normal;color:var(--ink);border-bottom:2px solid var(--accent);margin-right:6px}
.bw-cal{border:1px solid var(--line);border-radius:12px;padding:12px;display:grid;gap:10px}
.bw-cal p{margin:0;color:var(--ink2)}
.bw-cal ol{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(7,1fr);gap:5px}
.bw-cal li{aspect-ratio:1;border-radius:6px;background:var(--soft)}
.bw-cal li.on{background:var(--accent)}
.bw-btn{justify-self:start;background:#0c0a08;color:#fff;border-radius:999px;padding:6px 12px;font-size:12px}
.bw-tiles{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.bw-tiles>span{border:1px solid var(--line);border-radius:10px;padding:14px 10px;text-align:center;color:var(--ink2)}
.pr-web{border-top:1px solid var(--line);padding-top:56px}
.pr-web .pr-ends{align-items:center}
.pr-web-copy p:not(.eyebrow){color:var(--ink2);margin:0 0 14px;max-width:34em}
.pr-end .btn{align-self:flex-start}
.pr-price b.pr-q{font-size:28px;letter-spacing:-.02em}
.pr-end .fine a,.pr-feat a{color:var(--ink)}
.pr-webtiers{list-style:none;margin:0;padding:0;display:grid}
.pr-webtiers li{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding-block:11px;border-bottom:1px solid var(--line)}
.pr-webtiers li:last-child{border-bottom:0}
.pr-webtiers li>span{display:grid;gap:2px;min-width:0}
.pr-webtiers b{font-weight:500}
.pr-webtiers small{color:var(--muted);font-size:13px}
.pr-webtiers em{font-style:normal;font-size:22px;letter-spacing:-.02em;font-variant-numeric:tabular-nums;white-space:nowrap}

/* 定价页（2026-10-14 改）：卡片上一个主按钮 + 每档包含什么的对比表，不让客人勾模块 */
.tier-cta{width:100%;padding:11px 16px;font-size:15px}
.tier:not(.pop):not(.dark) .tier-cta{background:var(--soft);border:1px solid var(--line)}
.cmp{min-width:640px}
.cmp th.c,.cmp td.c{text-align:center;width:13%;white-space:nowrap}
.cmp th.c{color:var(--ink);font-size:14px}
.cmp th small{display:block;color:var(--muted);font-weight:400;font-variant-numeric:tabular-nums}
.cmp td b{font-weight:500}
.cmp td small{display:block;color:var(--muted);font-size:13px;margin-top:2px}
.cmp tr.grp td{background:var(--soft);font-size:12px;color:var(--muted);letter-spacing:.04em;padding-block:8px}
.cmp .ck{color:var(--accent-ink);font-weight:600}
.cmp .add{color:var(--muted);font-size:13px;font-variant-numeric:tabular-nums}

.tier.pop .tier-cta{background:var(--ink);color:#fff}
.tier-note{margin:-6px 0 0;text-align:center;font-size:13px;color:var(--muted);font-variant-numeric:tabular-nums}
.tier.dark .tier-note{color:#a1a1a6}
/* 「即将开放」小字（2026-10-16 Google 两项；Pie 的 Google 接口批下来当天删） */
.more .soon{margin-top:10px;font-size:13px;color:var(--muted,#6e6e73)}

/* 礼品卡价格页 /gift-cards（2026-10-17）：左边一档价格卡，右边「另收的费」表 + 已在用 Pie 的说明 */
.gc-plan-name{margin:0;font-size:18px;font-weight:500}
.gc-cta{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px;margin-top:6px}
.gc-fees{align-self:start}
.gc-fees table{min-width:0}
.gc-fees .pr-soon{margin-left:6px}
.gc-also{margin:0;padding:12px 16px;border-top:1px solid var(--line);font-size:13.5px;color:var(--ink2)}
.gc-also a{color:var(--ink)}

/* 申请开通 /apply（2026-10-18）：左一句标题 + 三个卖点，右一张卡只放 3 格 + 一个主按钮；提交后同一位置换成「收到了 + 推荐链接」 */
.apply{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,480px);gap:56px;align-items:start;padding-block:72px 96px}
.apply h1{font-size:clamp(36px,5vw,58px)}
.apply .lede{margin-bottom:24px}
.apply-pts{margin:0;padding:0;list-style:none;display:grid;gap:10px;color:var(--ink2);font-size:15px}
.apply-pts li{display:flex;gap:10px;align-items:baseline}
.apply-pts li::before{content:"";flex:none;width:8px;height:8px;border-radius:50%;background:var(--accent);transform:translateY(-2px)}
.acard{background:var(--bg);border:1px solid var(--line);border-radius:24px;padding:32px;box-shadow:var(--shadow)}
.field{display:grid;gap:8px;margin:0 0 18px;padding:0;border:0;min-width:0;font-size:14px;font-weight:500;color:var(--ink2)}
.field legend{padding:0;margin-bottom:8px}
.field input[type=text]{width:100%;min-height:48px;border:1px solid var(--line);border-radius:12px;background:#fafafa;padding:11px 14px;font:inherit;font-size:16px;font-weight:400;color:var(--ink)}
.field input[type=text]:focus{outline:none;border-color:var(--ink);background:var(--bg)}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{position:relative;display:inline-flex;align-items:center;min-height:40px;padding:8px 16px;border:1px solid var(--line);border-radius:999px;background:#fafafa;font-size:14px;font-weight:400;color:var(--ink);cursor:pointer;user-select:none;transition:border-color .15s,background .15s}
.chip input{position:absolute;inset:0;opacity:0;margin:0;cursor:pointer}
.chip:has(input:checked){background:var(--ink);border-color:var(--ink);color:var(--bg)}
.chip:has(input:focus-visible){outline:2px solid var(--ink);outline-offset:2px}
.btn-wide{width:100%;margin-top:6px;padding:15px 22px;font-size:16px}
.btn:disabled{opacity:.6;cursor:wait}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.msg{margin:12px 0 0;font-size:14px;color:#b3261e}
.acard .fine{margin-top:14px}
.acard .fine a{color:var(--muted)}
.done .done-ok{display:flex;align-items:center;gap:8px;margin:0 0 12px;font-size:15px;color:var(--accent-ink);font-weight:500}
.done .done-ok svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.done h2{margin:0 0 8px;font-size:26px;font-weight:500;letter-spacing:-.02em}
.done-sub{margin:0 0 22px;color:var(--ink2)}
.linkbox{background:var(--soft);border-radius:16px;padding:18px 20px;margin-bottom:16px}
.linklab{margin:0 0 8px;font-size:13px;color:var(--muted)}
.linkrow{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.linkrow code{flex:1 1 220px;min-width:0;font-family:var(--font);font-size:15px;background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:10px 12px;overflow-wrap:anywhere;user-select:all}
.linkbox .fine{margin-top:10px;color:var(--ink2)}
@media (max-width:900px){.apply{grid-template-columns:1fr;gap:32px;padding-block:40px 64px}.acard{padding:24px 20px}}

/* 卖结果改版（2026-10-21）：首屏下一行真实数字、叠卡里「以前」一行、开通三步、另外还能做 */
.hero-alt{margin:14px 0 0;font-size:15px}
.hero-alt a{color:var(--ink2);text-underline-offset:3px}
.hero-alt a:hover{color:var(--ink)}
.proof{padding-block:8px 48px}
.proof-k{margin:0 0 18px;text-align:center;font-size:14px;color:var(--muted)}
.proof-nums{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;max-width:1000px;margin:0 auto;padding:28px 32px;background:var(--soft);border-radius:var(--r)}
.proof-nums div{min-width:0}
.proof-nums b{display:block;font-size:clamp(30px,3.6vw,40px);font-weight:400;letter-spacing:-.025em;font-variant-numeric:tabular-nums}
.proof-nums span{font-size:14px;color:var(--ink2)}
.proof .fine{text-align:center;max-width:44em;margin:14px auto 0}
.sc-text p.sc-was{margin:0 0 10px;font-size:15px;opacity:.72}
.steps3{padding-block:72px;border-top:1px solid var(--line)}
.steps3 ol{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}
.steps3 li{border-top:2px solid var(--ink);padding-top:16px;min-width:0}
.steps3 .who{font-size:13px;color:var(--muted)}
.steps3 h3{margin:6px 0 6px}
.steps3 p{margin:0;color:var(--ink2)}
.steps3 .also{margin:40px 0 0;color:var(--ink2)}
.steps3 .also a{text-underline-offset:3px}
@media (max-width:900px){.proof-nums{grid-template-columns:repeat(2,minmax(0,1fr));padding:22px 20px;gap:20px}.steps3{padding-block:48px}.steps3 ol{grid-template-columns:1fr;gap:24px}}
@media (max-width:900px) and (min-height:600px){.sc-text p.sc-was{font-size:13px;line-height:1.4;margin-bottom:6px}}
.verdicts.top{margin-top:0}
/* 定价卡（2026-10-21）：套餐名变小字，结果当大字，下面一行「你每周要做的」 */
.tier-h h3{font-size:13px;font-weight:500;color:var(--muted);letter-spacing:.02em}
.tier .tier-out{font-size:21px;line-height:1.25;font-weight:500;color:var(--ink);letter-spacing:-.015em}
.tier-you{margin:0;font-size:13px;color:var(--ink2);background:var(--soft);border-radius:8px;padding:7px 10px}
.tier.dark .tier-out{color:#fff}.tier.dark .tier-h h3{color:#a1a1a6}
.tier.dark .tier-you{background:rgba(255,255,255,.08);color:#d1d1d6}