/* ============================================================
   AiBestSales · Preview V3 — Design System
   方向：深色首屏 + 浅色内容区，克制高级感，摆脱"白纸"感
   参考：linear.app / vercel.com / stripe.com
   ============================================================ */

:root{
  --bg:#ffffff;
  --bg-subtle:#fafafa;
  --bg-soft:#f3f4f6;
  --bg-dark:#0a0a0f;
  --bg-dark-2:#111118;
  --border:#e5e5e8;
  --border-strong:#d1d1d6;
  --border-dark:rgba(255,255,255,.10);
  --ink:#0a0a0a;
  --ink-2:#52525b;
  --ink-3:#8b8b90;
  --light:#ffffff;
  --light-2:#b8b8bd;
  --light-3:#78787d;
  --brand:#0f5e3f;
  --brand-ink:#0a4a32;
  --brand-wash:#ecf6f0;
  --brand-soft:#d8ede4;
  --accent:#2dd4a8;
  --radius:14px;
  --radius-sm:8px;
  --maxw:1160px;
  --font: "Inter","SF Pro Display",-apple-system,BlinkMacSystemFont,"Segoe UI",
          "PingFang SC","Hiragino Sans GB","Microsoft YaHei",system-ui,sans-serif;
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body{
  font-family:var(--font);
  background:var(--bg);
  color:var(--ink);
  font-size:16px;
  line-height:1.65;
  letter-spacing:-0.01em;
}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.container{max-width:var(--maxw);margin:0 auto;padding:0 28px}

/* ---------- Typography ---------- */
h1,h2,h3,h4{font-weight:600;letter-spacing:-0.03em;line-height:1.08;color:var(--ink)}
h1{font-size:clamp(42px,6.4vw,76px);font-weight:600;line-height:1.02}
h2{font-size:clamp(30px,3.8vw,44px)}
h2.single-line{font-size:clamp(22px,2.6vw,30px);white-space:nowrap}
h3{font-size:22px;letter-spacing:-0.02em}
h4{font-size:17px;letter-spacing:-0.01em}
.lead{font-size:clamp(17px,1.7vw,20px);color:var(--ink-2);line-height:1.7;font-weight:400}
.eyebrow{
  font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;
  color:var(--brand);margin-bottom:16px;display:inline-block;
}
.eyebrow.light{color:var(--accent)}
.muted{color:var(--ink-3)}
.section{padding:clamp(80px,10vw,140px) 0}
.section-head{max-width:680px;margin-bottom:64px}
.section-head.center{text-align:center;margin-left:auto;margin-right:auto}
.section-head p{margin-top:18px;color:var(--ink-2);font-size:18px}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex;align-items:center;gap:8px;
  font-size:15px;font-weight:500;letter-spacing:-0.01em;
  padding:12px 22px;border-radius:var(--radius-sm);
  border:1px solid transparent;cursor:pointer;transition:.18s ease;
}
.btn-primary{background:var(--ink);color:#fff}
.btn-primary:hover{background:#26262a;transform:translateY(-1px)}
.btn-ghost{background:transparent;color:var(--ink);border-color:var(--border-strong)}
.btn-ghost:hover{border-color:var(--ink);background:var(--bg-subtle)}
.btn-light{background:#fff;color:var(--ink)}
.btn-light:hover{background:#e9e9ec;transform:translateY(-1px)}
.btn-outline-light{background:transparent;color:#fff;border-color:rgba(255,255,255,.35)}
.btn-outline-light:hover{border-color:#fff;background:rgba(255,255,255,.06)}
.btn-brand{background:var(--brand);color:#fff}
.btn-brand:hover{background:var(--brand-ink);transform:translateY(-1px)}
.arrow{transition:transform .18s ease}
.btn:hover .arrow{transform:translateX(3px)}

/* ---------- Nav ---------- */
.nav{
  position:sticky;top:0;z-index:50;
  background:rgba(255,255,255,.86);backdrop-filter:saturate(180%) blur(16px);
  border-bottom:1px solid var(--border);
}
.nav-inner{display:flex;align-items:center;justify-content:space-between;height:68px}
.nav-logo{font-weight:700;font-size:18px;letter-spacing:-0.03em;display:flex;align-items:center;gap:10px}
.nav-logo .dot{width:8px;height:8px;border-radius:50%;background:var(--brand)}
.nav-links{display:flex;gap:28px;font-size:14px;color:var(--ink-2);font-weight:500}
.nav-links a:hover{color:var(--ink)}
.nav-links a.active{color:var(--ink)}
.nav-cta{display:flex;align-items:center;gap:12px}
.nav-cta .btn{padding:9px 16px;font-size:14px}
@media(max-width:900px){.nav-links{display:none}.nav-cta .btn-ghost{display:none}}

/* ---------- Soft hero (首页) ---------- */
.hero-soft{
  position:relative;background:#f6f7f9;
  color:var(--ink);overflow:hidden;
  padding:clamp(90px,11vw,140px) 0 clamp(72px,8vw,100px);
  border-bottom:1px solid var(--border);
}
.hero-soft::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background-image:
    radial-gradient(circle at 85% 20%, rgba(15,94,63,.08) 0%, transparent 35%),
    radial-gradient(circle at 10% 80%, rgba(45,212,168,.06) 0%, transparent 30%),
    linear-gradient(rgba(10,10,10,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(10,10,10,.035) 1px, transparent 1px);
  background-size:100% 100%,100% 100%,60px 60px,60px 60px;
}
.hero-soft .container{position:relative;z-index:2}
.hero-soft .eyebrow{margin-bottom:24px}
.hero-soft h1{color:var(--ink);max-width:900px}
.hero-soft h1 span{color:var(--brand)}
.hero-soft .lead{color:var(--ink-2);max-width:620px;margin:28px 0 38px;font-size:19px}
.hero-soft .hero-actions{display:flex;gap:14px;flex-wrap:wrap}
.hero-soft .hero-note{margin-top:32px;font-size:13.5px;color:var(--ink-3)}
.hero-row{display:grid;grid-template-columns:1.15fr .85fr;gap:60px;align-items:center}
@media(max-width:960px){.hero-row{grid-template-columns:1fr}.hero-visual{margin-top:48px}}

/* abstract visual in soft hero */
.hero-visual{
  position:relative;height:420px;border-radius:var(--radius);
  border:1px solid var(--border);
  background:#fff;
  box-shadow:0 24px 60px rgba(0,0,0,.05);
  display:flex;align-items:center;justify-content:center;overflow:hidden;
}
.hero-visual::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(circle at 30% 40%,rgba(15,94,63,.06),transparent 55%),
              radial-gradient(circle at 70% 70%,rgba(45,212,168,.05),transparent 50%);
}
.hero-visual svg{position:relative;z-index:2;width:100%;height:100%}

/* ---------- Stats band ---------- */
.stats-band{
  display:grid;grid-template-columns:repeat(4,1fr);gap:1px;
  background:var(--border);border-top:1px solid var(--border);border-bottom:1px solid var(--border);
}
@media(max-width:760px){.stats-band{grid-template-columns:1fr 1fr}}
.stats-band .cell{background:var(--bg);padding:34px 28px;text-align:center}
.stats-band .num{display:block;font-size:clamp(32px,4vw,48px);font-weight:600;letter-spacing:-0.03em;color:var(--ink)}
.stats-band .lab{font-size:13.5px;color:var(--ink-3);margin-top:6px}

/* ---------- Pain cards ---------- */
.pain-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
@media(max-width:820px){.pain-grid{grid-template-columns:1fr}}
.pain-card{
  border:1px solid var(--border);border-radius:var(--radius);padding:36px 32px;background:var(--bg);
  transition:.2s ease;position:relative;
}
.pain-card:hover{border-color:var(--border-strong);transform:translateY(-2px)}
.pain-card .num{
  font-size:13px;font-weight:700;color:var(--brand);letter-spacing:.06em;
  border:1px solid var(--brand-soft);display:inline-block;padding:5px 10px;border-radius:999px;margin-bottom:22px;
}
.pain-card h3{margin-bottom:12px}
.pain-card p{color:var(--ink-2);font-size:15.5px}

/* ---------- Solution section ---------- */
.sol-section{background:var(--bg-subtle);border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.sol-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;margin-top:8px}
@media(max-width:760px){.sol-grid{grid-template-columns:1fr}}
.sol-card{
  border:1px solid var(--border);border-radius:var(--radius);padding:32px;background:#fff;
  transition:.2s ease;display:flex;flex-direction:column;height:100%;
}
.sol-card:hover{border-color:var(--border-strong);box-shadow:0 12px 40px rgba(0,0,0,.04)}
.sol-card .tag{font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3);margin-bottom:14px}
.sol-card h3{font-size:24px;margin-bottom:10px}
.sol-card p{color:var(--ink-2);font-size:15px;margin-bottom:22px;flex:1}
.sol-card .more{font-size:14.5px;font-weight:600;color:var(--ink);display:inline-flex;align-items:center;gap:7px}
.sol-card .more .arrow{transition:transform .18s ease}
.sol-card:hover .more .arrow{transform:translateX(3px)}
.sol-card.featured{border-color:var(--brand);background:var(--brand-wash)}
.sol-card.featured .tag{color:var(--brand-ink)}

/* ---------- Content sections (sub pages) ---------- */
.subhero{
  position:relative;background:#f6f7f9;color:var(--ink);
  padding:clamp(90px,11vw,140px) 0 clamp(60px,7vw,90px);overflow:hidden;
  border-bottom:1px solid var(--border);
}
.subhero::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background-image:
    radial-gradient(circle at 30% 20%, rgba(15,94,63,.10) 0%, transparent 40%),
    radial-gradient(circle at 70% 80%, rgba(45,212,168,.06) 0%, transparent 35%);
}
.subhero .container{position:relative;z-index:2}
.subhero .crumb{font-size:13.5px;color:var(--ink-3);margin-bottom:22px}
.subhero h1{color:var(--ink);max-width:860px}
.subhero h1 span{color:var(--brand)}
.subhero h1.partner-title{max-width:none}
@media(min-width:900px){.subhero h1.partner-title{white-space:nowrap}}
.subhero .lead{color:var(--ink-2);max-width:640px;margin-top:22px;font-size:18px}

.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px,5vw,72px);align-items:center}
@media(max-width:860px){.split{grid-template-columns:1fr;gap:36px}}
.split.visual{
  background:var(--bg-soft);border:1px solid var(--border);border-radius:var(--radius);
  min-height:340px;display:flex;align-items:center;justify-content:center;color:var(--ink-3);font-size:14px;
  position:relative;overflow:hidden;
}
.split.visual::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(circle at 50% 50%,rgba(15,94,63,.08),transparent 60%);
}
.story-shot{border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;background:var(--bg-soft);box-shadow:0 12px 40px rgba(0,0,0,.06)}
.story-shot img{display:block;width:100%;height:auto}
.story-row{align-items:flex-start}
.story-text,.story-visual{display:flex;flex-direction:column}
.story-takeaways{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:26px}
.story-takeaways > div{background:var(--bg-soft);border:1px solid var(--border);border-radius:var(--radius-sm);padding:16px 18px}
.story-takeaways b{display:block;font-size:15px;color:var(--brand);margin-bottom:4px}
.story-takeaways span{font-size:13.5px;color:var(--ink-2)}
.story-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:18px}
.story-metrics .m{background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-sm);padding:16px;text-align:center}
.story-metrics .m span{display:block;font-size:22px;font-weight:700;color:var(--ink);line-height:1.2}
.story-metrics .m label{display:block;font-size:12.5px;color:var(--ink-2);margin-top:6px;line-height:1.4}
.story-caption{text-align:center;font-size:13px;color:var(--ink-3);margin-top:14px}
@media(max-width:860px){
  .story-takeaways{grid-template-columns:1fr}
  .story-metrics{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:520px){
  .story-metrics{grid-template-columns:1fr}
}

.feat{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--border);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;margin-top:8px}
@media(max-width:760px){.feat{grid-template-columns:1fr}}
.feat .item{background:var(--bg);padding:34px 30px}
.feat .num{font-size:13px;font-weight:600;color:var(--brand);letter-spacing:.04em}
.feat h4{font-size:17px;margin:14px 0 8px}
.feat p{font-size:14.5px;color:var(--ink-2)}

/* ---------- Content library ---------- */
.lib-bar{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:28px}
.tags{display:flex;gap:8px;flex-wrap:wrap}
.tag-chip{font-size:13px;padding:6px 13px;border-radius:999px;border:1px solid var(--border);color:var(--ink-2);background:var(--bg);cursor:pointer;transition:.15s}
.tag-chip:hover{border-color:var(--border-strong)}
.tag-chip.active{background:var(--ink);color:#fff;border-color:var(--ink)}
.posts{display:grid;gap:14px}
.post{display:grid;grid-template-columns:130px 1fr auto;gap:22px;align-items:center;border:1px solid var(--border);border-radius:var(--radius-sm);padding:22px 26px;transition:.18s}
.post:hover{border-color:var(--border-strong);background:var(--bg-subtle)}
.post .meta{font-size:12.5px;color:var(--ink-3);letter-spacing:.02em}
.post h4{font-size:16.5px;font-weight:600;margin-bottom:3px}
.post p{font-size:14px;color:var(--ink-2)}
.post .read{font-size:13.5px;color:var(--ink);white-space:nowrap;font-weight:500}
@media(max-width:680px){.post{grid-template-columns:1fr;gap:8px}}
.pager{display:flex;gap:7px;justify-content:center;margin-top:34px}
.pager button{min-width:38px;height:38px;border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--bg);color:var(--ink-2);font-size:14px;cursor:pointer;transition:.15s}
.pager button:hover{border-color:var(--border-strong)}
.pager button.active{background:var(--ink);color:#fff;border-color:var(--ink)}
.pager button:disabled{opacity:.35;cursor:default}

/* ---------- Distribution ---------- */
.dist{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
@media(max-width:760px){.dist{grid-template-columns:1fr}}
.dist .tier{border:1px solid var(--border);border-radius:var(--radius);padding:34px 30px;background:var(--bg)}
.dist .tier .lv{font-size:13px;font-weight:600;color:var(--brand);letter-spacing:.05em}
.dist .tier .rate{font-size:42px;font-weight:600;letter-spacing:-0.02em;margin:10px 0 6px}
.dist .tier p{font-size:14px;color:var(--ink-2)}
.dist-foot{margin-top:26px;padding:24px 28px;border:1px solid var(--border);border-radius:var(--radius);background:var(--brand-wash);color:var(--brand-ink);font-size:15px}

/* ---------- Timeline ---------- */
.timeline{display:grid;gap:0;border-left:1px solid var(--border);margin-left:8px}
.tl-item{padding:0 0 40px 32px;position:relative}
.tl-item::before{content:"";position:absolute;left:-5px;top:4px;width:9px;height:9px;border-radius:50%;background:var(--brand);border:2px solid #fff;box-shadow:0 0 0 1px var(--border)}
.tl-item .ph{font-size:13px;font-weight:600;color:var(--brand);letter-spacing:.04em}
.tl-item h4{font-size:18px;margin:8px 0 8px}
.tl-item p{font-size:14.5px;color:var(--ink-2);max-width:620px}

/* ---------- Pricing ---------- */
.price-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;align-items:stretch}
@media(max-width:820px){.price-grid{grid-template-columns:1fr}}
.price{border:1px solid var(--border);border-radius:var(--radius);padding:34px 32px;display:flex;flex-direction:column}
.price.featured{border-color:var(--ink);box-shadow:0 12px 40px rgba(0,0,0,.05)}
.price .pname{font-size:15px;font-weight:600}
.price .pdesc{font-size:13.5px;color:var(--ink-3);margin-top:4px;min-height:38px}
.price .pamt{font-size:36px;font-weight:600;letter-spacing:-0.02em;margin:20px 0 2px}
.price .pamt small{font-size:14px;font-weight:400;color:var(--ink-3)}
.price ul{list-style:none;margin:20px 0 26px;display:grid;gap:11px}
.price li{font-size:14px;color:var(--ink-2);display:flex;gap:9px;position:relative;padding-left:24px}
.price li::before{content:"";position:absolute;left:0;top:3px;width:16px;height:16px;border-radius:50%;background:var(--brand-wash)}
.price li::after{content:"";position:absolute;left:5px;top:6px;width:5px;height:9px;border:1.5px solid var(--brand);border-top:0;border-left:0;transform:rotate(40deg)}
.price .btn{margin-top:auto;justify-content:center}
.price-grid.four{grid-template-columns:repeat(4,1fr)}
@media(max-width:1024px){.price-grid.four{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.price-grid.four{grid-template-columns:1fr}}
.price .credit{display:inline-block;margin-top:10px;font-size:12px;font-weight:600;color:var(--brand-ink);background:var(--brand-wash);border:1px solid var(--brand-soft);border-radius:999px;padding:5px 12px}
.usage-table{width:100%;border-collapse:collapse;border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;background:#fff;font-size:14px}
.usage-table th,.usage-table td{padding:15px 18px;text-align:left;border-bottom:1px solid var(--border)}
.usage-table thead th{background:var(--bg-soft);font-size:12.5px;font-weight:700;color:var(--ink-2)}
.usage-table tbody tr:last-child td{border-bottom:0}
.usage-table tbody td{color:var(--ink-2)}
.usage-table tbody td:first-child{font-weight:500;color:var(--ink)}
@media(max-width:760px){.usage-table{font-size:13px}.usage-table th,.usage-table td{padding:12px 10px}}

/* ---------- FAQ ---------- */
.faq{display:grid;gap:12px;max-width:860px}
.faq details{border:1px solid var(--border);border-radius:var(--radius-sm);padding:0 24px;background:var(--bg)}
.faq summary{list-style:none;cursor:pointer;padding:22px 0;font-size:16px;font-weight:500;display:flex;justify-content:space-between;align-items:center;gap:16px}
.faq summary::-webkit-details-marker{display:none}
.faq summary .ic{flex:none;width:20px;height:20px;position:relative;transition:.2s}
.faq summary .ic::before,.faq summary .ic::after{content:"";position:absolute;background:var(--ink-2);border-radius:2px}
.faq summary .ic::before{top:9px;left:2px;width:16px;height:2px}
.faq summary .ic::after{top:2px;left:9px;width:2px;height:16px;transition:.2s}
.faq details[open] summary .ic::after{transform:rotate(90deg);opacity:0}
.faq .ans{padding:0 0 22px;color:var(--ink-2);font-size:15px}

/* ---------- CTA band ---------- */
.cta-band{
  position:relative;background:var(--brand);color:#fff;border-radius:var(--radius);
  padding:clamp(52px,7vw,80px);text-align:center;overflow:hidden;
}
.cta-band::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(circle at 50% 0%,rgba(45,212,168,.18),transparent 50%);
}
/* 内容层抬到 ::before 渐变层之上，确保按钮可点击（::before 已设 pointer-events:none 双保险） */
.cta-band > *{position:relative;z-index:2}
.cta-band h2{color:#fff}
.cta-band p{color:rgba(255,255,255,.82);max-width:560px;margin:18px auto 32px;font-size:17px}

/* ---------- Footer ---------- */
.footer{border-top:1px solid var(--border);padding:64px 0 44px;margin-top:0;color:var(--ink-2);background:var(--bg-subtle)}
.footer .cols{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:48px}
@media(max-width:760px){.footer .cols{grid-template-columns:1fr 1fr;gap:34px}}
.footer h5{font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3);margin-bottom:18px}
.footer a{display:block;font-size:14.5px;color:var(--ink-2);padding:5px 0}
.footer a:hover{color:var(--ink)}
.footer .brand-blurb{font-size:14.5px;color:var(--ink-2);max-width:300px;margin-top:14px;line-height:1.7}
.footer .legal{margin-top:48px;padding-top:24px;border-top:1px solid var(--border);display:flex;justify-content:space-between;font-size:13px;color:var(--ink-3);flex-wrap:wrap;gap:10px}

/* ---------- Utility ---------- */
.badge{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;color:var(--brand-ink);background:var(--brand-wash);border:1px solid var(--brand-soft);padding:6px 12px;border-radius:999px}

/* ============================================================
   Product detail enrichments (iSales / 建站 / TradeOS)
   ============================================================ */

/* dual module showcase */
.module-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}
@media(max-width:820px){.module-grid{grid-template-columns:1fr}}
.module-card{border:1px solid var(--border);border-radius:var(--radius);padding:34px 32px;background:#fff;display:flex;flex-direction:column}
.module-card.featured{border-color:var(--brand);background:var(--brand-wash)}
.module-card .m-tag{font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--brand-ink);margin-bottom:12px}
.module-card h3{font-size:24px;margin-bottom:10px}
.module-card .m-lead{color:var(--ink-2);font-size:15px;margin-bottom:22px;flex:1}
.module-list{list-style:none;display:grid;gap:12px;margin-bottom:26px}
.module-list li{font-size:14.5px;color:var(--ink);display:flex;gap:10px;align-items:flex-start}
.module-list li b{font-weight:600}
.module-list li .ck{flex:none;width:18px;height:18px;border-radius:50%;background:var(--brand-wash);display:inline-flex;align-items:center;justify-content:center;margin-top:1px}
.module-list li .ck::after{content:"";width:5px;height:9px;border:1.5px solid var(--brand);border-top:0;border-left:0;transform:rotate(40deg);margin-top:-2px}
.module-price{display:flex;align-items:baseline;gap:8px;font-size:14px;color:var(--ink-3)}
.module-price b{font-size:22px;font-weight:600;color:var(--ink);letter-spacing:-0.02em}

/* tech compare (GNN vs RAG) */
.vs-grid{display:grid;grid-template-columns:1fr 1fr;gap:0;border:1px solid var(--border);border-radius:var(--radius);overflow:hidden}
@media(max-width:760px){.vs-grid{grid-template-columns:1fr}}
.vs-col{padding:34px 32px}
.vs-col.a{background:var(--bg)}
.vs-col.b{background:var(--brand-wash);border-left:1px solid var(--border)}
@media(max-width:760px){.vs-col.b{border-left:0;border-top:1px solid var(--border)}}
.vs-col h4{font-size:18px;margin-bottom:4px}
.vs-col .sub{font-size:13px;color:var(--ink-3);margin-bottom:18px}
.vs-col ul{list-style:none;display:grid;gap:12px}
.vs-col li{font-size:14.5px;color:var(--ink-2);padding-left:22px;position:relative;line-height:1.55}
.vs-col li::before{content:"✓";position:absolute;left:0;top:0;color:var(--brand);font-weight:700}

/* case grid */
.case-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
@media(max-width:820px){.case-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.case-grid{grid-template-columns:1fr}}
.case-card{border:1px solid var(--border);border-radius:var(--radius);padding:28px 26px;background:#fff;transition:.2s;display:flex;flex-direction:column}
.case-card:hover{border-color:var(--border-strong);transform:translateY(-2px)}
.case-card .ind{font-size:12px;font-weight:600;color:var(--brand);letter-spacing:.05em;margin-bottom:12px;display:inline-block}
.case-card h4{font-size:18px;margin-bottom:8px}
.case-card p{font-size:14px;color:var(--ink-2);line-height:1.6;flex:1}
.case-card .tagrow{margin-top:16px;display:flex;gap:7px;flex-wrap:wrap}
.chip{font-size:11.5px;color:var(--ink-3);border:1px solid var(--border);border-radius:999px;padding:4px 10px;white-space:nowrap}

/* signed customers highlight */
.signed{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:26px}
@media(max-width:760px){.signed{grid-template-columns:1fr}}
.signed .sc{border:1px solid var(--brand-soft);background:var(--brand-wash);border-radius:var(--radius);padding:26px 28px}
.signed .sc .k{font-size:12px;font-weight:700;color:var(--brand-ink);letter-spacing:.05em;margin-bottom:10px;display:inline-block}
.signed .sc h4{font-size:20px;margin-bottom:8px}
.signed .sc p{font-size:14px;color:var(--ink-2);line-height:1.6}

/* value-added services */
.svc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
@media(max-width:820px){.svc-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.svc-grid{grid-template-columns:1fr}}
.svc-card{border:1px solid var(--border);border-radius:var(--radius);padding:30px 28px;background:#fff;display:flex;flex-direction:column}
.svc-card .n{font-size:12px;font-weight:700;color:var(--brand);letter-spacing:.06em;border:1px solid var(--brand-soft);display:inline-block;padding:5px 10px;border-radius:999px;margin-bottom:18px;align-self:flex-start}
.svc-card h4{font-size:19px;margin-bottom:8px}
.svc-card p{font-size:14px;color:var(--ink-2);flex:1;line-height:1.6}
.svc-card .pv{margin-top:18px;font-size:13.5px;font-weight:600;color:var(--brand-ink);background:var(--brand-wash);border-radius:var(--radius-sm);padding:10px 14px}

/* bundled packages */
.pkg-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
@media(max-width:820px){.pkg-grid{grid-template-columns:1fr}}
.pkg{border:1px solid var(--border);border-radius:var(--radius);padding:32px;background:#fff;display:flex;flex-direction:column}
.pkg.featured{border-color:var(--ink);box-shadow:0 12px 40px rgba(0,0,0,.05)}
.pkg h4{font-size:20px;margin-bottom:4px}
.pkg .pdesc{font-size:13.5px;color:var(--ink-3);margin-bottom:18px}
.pkg .ptot{font-size:30px;font-weight:600;letter-spacing:-0.02em;margin-bottom:18px}
.pkg ul{list-style:none;display:grid;gap:10px;margin-bottom:22px}
.pkg li{font-size:14px;color:var(--ink-2);display:flex;gap:9px;padding-left:22px;position:relative;line-height:1.5}
.pkg li::before{content:"✓";position:absolute;left:0;color:var(--brand);font-weight:700}
.pkg .btn{margin-top:auto;justify-content:center}

/* flywheel (TradeOS) + profit callout */
.fly{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--border);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden}
@media(max-width:820px){.fly{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.fly{grid-template-columns:1fr}}
.fly .f{background:#fff;padding:30px 26px}
.fly .f .fn{font-size:13px;font-weight:700;color:var(--brand);margin-bottom:12px}
.fly .f h4{font-size:17px;margin-bottom:8px}
.fly .f p{font-size:14px;color:var(--ink-2);line-height:1.6}
.callout{border:1px solid var(--brand-soft);background:var(--brand-wash);border-radius:var(--radius);padding:30px 32px;margin-top:26px}
.callout h4{font-size:18px;margin-bottom:8px;color:var(--brand-ink)}
.callout p{font-size:15px;color:var(--ink-2);line-height:1.65}
.profit{display:grid;grid-template-columns:1.15fr .85fr;gap:48px;align-items:center}
@media(max-width:820px){.profit{grid-template-columns:1fr;gap:32px}}

/* ---- comparison table (为什么选我们 / 竞品区别) ---- */
.cmp{width:100%;border-collapse:collapse;border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;background:#fff;font-size:14.5px}
.cmp th,.cmp td{padding:16px 18px;text-align:left;border-bottom:1px solid var(--border);vertical-align:top;line-height:1.6}
.cmp thead th{background:var(--bg-soft);font-size:13px;font-weight:700;color:var(--ink-2);letter-spacing:.02em}
.cmp tbody tr:last-child td{border-bottom:none}
.cmp td.d{color:var(--brand);font-weight:600}
.cmp td .x{color:var(--ink-3)}
.cmp .rowhead{font-weight:600;color:var(--ink);background:var(--bg-subtle);width:22%}

/* ---- why/problem blocks (left label + list) ---- */
.why-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
@media(max-width:820px){.why-grid{grid-template-columns:1fr}}
.why-card{border:1px solid var(--border);border-radius:var(--radius);padding:26px 24px;background:#fff}
.why-card h4{font-size:16px;margin:10px 0 10px;letter-spacing:-.01em}
.why-card p{font-size:14px;color:var(--ink-2);line-height:1.65}
.why-card .num{font-size:13px;font-weight:700;color:var(--brand)}

/* ---- integration pillars ---- */
.integ{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--border);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden}
@media(max-width:820px){.integ{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.integ{grid-template-columns:1fr}}
.integ .g{background:#fff;padding:28px 24px}
.integ .g .step{font-size:12px;font-weight:700;color:var(--accent);letter-spacing:.04em;margin-bottom:10px}
.integ .g h4{font-size:16px;margin-bottom:8px}
.integ .g p{font-size:13.5px;color:var(--ink-2);line-height:1.6}
.integ-note{border:1px solid var(--brand-soft);background:var(--brand-wash);border-radius:var(--radius);padding:22px 26px;margin-top:22px;font-size:15px;color:var(--ink-2);line-height:1.7}
.integ-note b{color:var(--brand-ink)}

/* ============================================================
   TradeOS borrowed sections (demo band / customers / report / workflow / credits)
   ============================================================ */

/* Demo band */
.demo-band{background:var(--bg-dark);color:#fff;border-radius:var(--radius);padding:26px 34px;display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap}
.demo-band p{margin:0;font-size:17px;color:#fff}
.demo-band p span{color:var(--accent)}
.demo-form{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.demo-form input{background:rgba(255,255,255,.08);border:1px solid var(--border-dark);color:#fff;padding:11px 16px;border-radius:var(--radius-sm);min-width:180px;font-size:14px;font-family:inherit}
.demo-form input::placeholder{color:var(--light-3)}
@media(max-width:720px){.demo-band{flex-direction:column;align-items:stretch}.demo-form{width:100%}.demo-form input{flex:1;min-width:0}}

/* Onboarding steps band (TradeOS) */
.onboarding-band{background:var(--bg-subtle);border:1px solid var(--border);border-radius:var(--radius);padding:34px 40px}
.onboarding-band h4{font-size:18px;margin-bottom:26px}
.onboarding-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.onboarding-steps .os{position:relative}
.onboarding-steps .os .n{font-size:13px;font-weight:700;color:var(--brand);margin-bottom:10px}
.onboarding-steps .os h5{font-size:15px;margin-bottom:8px}
.onboarding-steps .os p{font-size:13.5px;color:var(--ink-3);line-height:1.6;margin:0}
@media(max-width:900px){.onboarding-steps{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.onboarding-band{padding:26px}.onboarding-steps{grid-template-columns:1fr}}

/* Customer sample cards */
.customer-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
@media(max-width:900px){.customer-cards{grid-template-columns:1fr}}
.customer-card{border:1px solid var(--border);border-radius:var(--radius);padding:26px 24px;background:#fff;transition:.2s ease}
.customer-card:hover{border-color:var(--border-strong);transform:translateY(-2px)}
.customer-card .top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:14px}
.customer-card .top h4{font-size:17px;letter-spacing:-0.01em}
.customer-card .score{font-size:12px;font-weight:700;color:#fff;background:var(--brand);padding:4px 10px;border-radius:999px;white-space:nowrap}
.customer-card .meta{font-size:13px;color:var(--ink-3);margin-bottom:14px}
.customer-card .kv{display:grid;gap:8px;font-size:13.5px;line-height:1.5}
.customer-card .kv .k{color:var(--ink-3)}
.customer-card .kv .v{color:var(--ink)}
.customer-card .evidence{margin-top:16px;padding-top:16px;border-top:1px dashed var(--border);font-size:13px;color:var(--ink-2);line-height:1.6}

/* Report preview */
.report-preview{border:1px solid var(--border);border-radius:var(--radius);background:#fff;overflow:hidden;box-shadow:0 24px 60px rgba(0,0,0,.06);max-width:900px;margin:0 auto}
.report-preview .rp-head{background:var(--bg-dark);color:#fff;padding:18px 26px;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.report-preview .rp-head h4{font-size:16px;color:#fff;margin:0}
.report-preview .rp-head .date{font-size:13px;color:var(--light-3)}
.report-preview .rp-body{padding:32px}
.report-preview .icp{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;text-align:center;margin-bottom:30px}
@media(max-width:600px){.report-preview .icp{grid-template-columns:1fr}}
.report-preview .icp .icp-item{background:var(--bg-subtle);border:1px solid var(--border);border-radius:var(--radius-sm);padding:22px 16px}
.report-preview .icp .lab{font-size:12px;color:var(--ink-3);margin-bottom:6px}
.report-preview .icp .val{font-size:18px;font-weight:600;color:var(--ink)}
.report-preview .bars{display:grid;gap:18px}
.report-preview .bar{display:grid;gap:6px}
.report-preview .bar .bl{display:flex;justify-content:space-between;font-size:13.5px}
.report-preview .bar .bl .bn{color:var(--ink-2)}
.report-preview .bar .bl .bv{font-weight:600;color:var(--ink)}
.report-preview .bar .track{height:8px;background:var(--bg-soft);border-radius:999px;overflow:hidden}
.report-preview .bar .fill{height:100%;border-radius:999px}
.report-preview .actions{margin-top:26px;padding:18px 20px;background:var(--brand-wash);border:1px solid var(--brand-soft);border-radius:var(--radius-sm);font-size:14px;color:var(--brand-ink);line-height:1.7}

/* Workflow */
.workflow{display:flex;justify-content:space-between;gap:14px;position:relative}
.workflow::before{content:"";position:absolute;top:22px;left:36px;right:36px;height:1px;background:var(--border);z-index:0}
.workflow .w-step{position:relative;z-index:1;text-align:center;flex:1;min-width:0}
.workflow .w-step .n{width:44px;height:44px;border-radius:50%;background:#fff;border:1px solid var(--border);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:15px;color:var(--brand);margin:0 auto 14px}
.workflow .w-step h4{font-size:14px;margin-bottom:6px}
.workflow .w-step p{font-size:12px;color:var(--ink-3);line-height:1.5}
@media(max-width:900px){.workflow{flex-wrap:wrap;gap:28px}.workflow::before{display:none}.workflow .w-step{flex:1 1 30%;min-width:120px}}
@media(max-width:560px){.workflow .w-step{flex:1 1 45%}}

/* Credit cards */
.credit-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
@media(max-width:980px){.credit-cards{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.credit-cards{grid-template-columns:1fr}}
.credit-card{border:1px solid var(--border);border-radius:var(--radius);padding:28px 24px;background:#fff;text-align:center;display:flex;flex-direction:column;height:100%}
.credit-card .big{font-size:42px;font-weight:600;color:var(--brand);letter-spacing:-0.02em;margin-bottom:8px}
.credit-card .big small{font-size:14px;color:var(--ink-3);font-weight:500;display:block;margin-top:4px}
.credit-card h4{font-size:16px;margin-bottom:12px}
.credit-card ul{list-style:none;text-align:left;font-size:13px;color:var(--ink-2);display:grid;gap:9px;margin-top:auto}
.credit-card li{display:flex;gap:8px;align-items:flex-start}
.credit-card li::before{content:"✓";color:var(--brand);font-weight:700;flex:none}
.credit-card.featured{border-color:var(--brand);background:var(--brand-wash)}

/* ============================================================
   交互增强：弹窗、展开内容、合作伙伴页
   ============================================================ */

/* ---- Modal / 弹窗 ---- */
.modal-overlay{
  position:fixed;inset:0;background:rgba(10,10,15,.55);
  display:flex;align-items:center;justify-content:center;
  z-index:100;opacity:0;pointer-events:none;transition:.2s ease;
  padding:20px;
}
.modal-overlay.active{opacity:1;pointer-events:auto}
.modal{
  background:#fff;border-radius:var(--radius);width:100%;max-width:520px;
  max-height:90vh;overflow:auto;box-shadow:0 30px 80px rgba(0,0,0,.18);
  transform:translateY(12px);transition:.2s ease;
}
.modal-overlay.active .modal{transform:translateY(0)}
.modal-head{padding:26px 30px 0;border-bottom:0}
.modal-head h3{font-size:22px;margin-bottom:6px}
.modal-head p{font-size:14px;color:var(--ink-3)}
.modal-body{padding:22px 30px 30px}
.modal-close{
  position:absolute;top:18px;right:18px;width:32px;height:32px;
  border:1px solid var(--border);border-radius:50%;background:#fff;
  cursor:pointer;display:flex;align-items:center;justify-content:center;
  font-size:18px;color:var(--ink-2);transition:.15s;
}
.modal-close:hover{border-color:var(--ink);color:var(--ink)}
.form-group{margin-bottom:16px}
.form-group label{display:block;font-size:13.5px;font-weight:600;margin-bottom:6px;color:var(--ink)}
.form-group input,.form-group textarea,.form-group select{
  width:100%;padding:11px 14px;border:1px solid var(--border);border-radius:var(--radius-sm);
  font-family:inherit;font-size:14.5px;background:#fff;color:var(--ink);outline:none;
}
.form-group input:focus,.form-group textarea:focus,.form-group select:focus{border-color:var(--brand)}
.form-group textarea{min-height:90px;resize:vertical}
.form-actions{display:flex;gap:12px;justify-content:flex-end;margin-top:22px}
.form-success{display:none;background:var(--brand-wash);border:1px solid var(--brand-soft);
  border-radius:var(--radius);padding:18px 20px;color:var(--brand-ink);font-size:14.5px;line-height:1.7}
.form-success.active{display:block}

/* ---- Clickable expandable cards ---- */
[data-expand]{cursor:pointer}
[data-expand]:hover{border-color:var(--border-strong)}
.expand-content{
  display:none;margin-top:18px;padding-top:18px;border-top:1px dashed var(--border);
  font-size:14.5px;color:var(--ink-2);line-height:1.75;
}
.expanded .expand-content{display:block}
.expanded .read::after{content:"收起";margin-left:4px}
.read{cursor:pointer}

/* ---- Posts as expandable ---- */
.post{position:relative}
.post.expanded{background:var(--bg-subtle)}
.post .expand-content{grid-column:1 / -1;margin-top:8px;padding-top:16px}
.post .expand-content h5{font-size:15px;color:var(--ink);margin-bottom:8px}
.post .expand-content ul,.post .expand-content ol{margin-left:18px;margin-bottom:12px}
.post .expand-content li{margin-bottom:6px}

/* ---- Pricing expandable ---- */
.price[data-expand]{cursor:pointer;transition:.2s ease}
.price[data-expand]:hover{box-shadow:0 8px 30px rgba(0,0,0,.06)}
.price.expanded{border-color:var(--brand)}
.price .expand-content{margin-top:20px}
.price .expand-content ul{list-style:none;margin:0;display:grid;gap:10px}
.price .expand-content li{font-size:14px;color:var(--ink-2);padding-left:22px;position:relative}
.price .expand-content li::before{content:"✓";position:absolute;left:0;color:var(--brand);font-weight:700}

/* ---- Case grid: 6 in one row ---- */
.case-grid.six{grid-template-columns:repeat(6,1fr)}
@media(max-width:1100px){.case-grid.six{grid-template-columns:repeat(3,1fr)}}
@media(max-width:760px){.case-grid.six{grid-template-columns:1fr 1fr}}
@media(max-width:480px){.case-grid.six{grid-template-columns:1fr}}

/* ---- Partner page ---- */
/* partner page reuses .subhero for visual consistency */
.partner-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--border);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;margin-top:48px}
@media(max-width:900px){.partner-steps{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.partner-steps{grid-template-columns:1fr}}
.partner-steps .step{background:#fff;padding:30px 26px;text-align:center}
.partner-steps .step .n{width:36px;height:36px;border-radius:50%;background:var(--brand);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px;margin:0 auto 14px}
.partner-steps .step h4{font-size:17px;margin-bottom:8px}
.partner-steps .step p{font-size:13.5px;color:var(--ink-2);line-height:1.6}
.commission-table{width:100%;border-collapse:collapse;border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;background:#fff;font-size:14.5px}
.commission-table th,.commission-table td{padding:16px 18px;text-align:left;border-bottom:1px solid var(--border)}
.commission-table thead th{background:var(--bg-soft);font-size:13px;font-weight:700;color:var(--ink-2)}
.commission-table tbody tr:last-child td{border-bottom:none}
.commission-table .rate{font-weight:700;color:var(--brand)}
.commission-table .note{color:var(--ink-3);font-size:13px}
.partner-form{max-width:680px;margin:0 auto;background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:34px 32px}
.ref-link-box{display:none;background:var(--brand-wash);border:1px solid var(--brand-soft);border-radius:var(--radius);padding:18px 20px;margin-top:18px}
.ref-link-box.active{display:block}
.ref-link-box code{display:block;background:#fff;border:1px solid var(--border);border-radius:var(--radius-sm);padding:12px;font-size:13px;word-break:break-all;margin-top:10px}

/* ---- TradeOS inline signup card ---- */
.signup-card{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:34px;box-shadow:0 24px 60px rgba(0,0,0,.06)}
.signup-card h3{font-size:20px;margin-bottom:6px}
.signup-card .sub{font-size:14px;color:var(--ink-3);margin-bottom:22px}
.signup-card .form-row{display:grid;grid-template-columns:1fr auto;gap:12px}
.signup-card .form-row.full{grid-template-columns:1fr}
.signup-card input{width:100%;padding:12px 14px;border:1px solid var(--border);border-radius:var(--radius-sm);font-family:inherit;font-size:14.5px;outline:none;background:#fff;color:var(--ink)}
.signup-card input:focus{border-color:var(--brand)}
.signup-card .check{font-size:13px;color:var(--ink-2);display:flex;gap:10px;align-items:flex-start;margin:16px 0}
.signup-card .check input{margin-top:3px;flex:none;width:16px;height:16px;accent-color:var(--brand)}
.signup-card .check a{color:var(--brand);text-decoration:underline}
.signup-card .btn{width:100%;justify-content:center}
.signup-card .hint{font-size:12.5px;color:var(--ink-3);margin-top:14px;line-height:1.6}
.signup-card .form-success{display:none;background:var(--brand-wash);border:1px solid var(--brand-soft);border-radius:var(--radius-sm);padding:16px;color:var(--brand-ink);font-size:14px;line-height:1.7;margin-top:14px}
.signup-card .form-success.active{display:block}
@media(max-width:960px){.signup-card{padding:26px}}
@media(max-width:720px){.signup-card .form-row{grid-template-columns:1fr}}

/* ---- GEO before/after + health check ---- */
.ba-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}
@media(max-width:820px){.ba-grid{grid-template-columns:1fr}}
.ba-card{border:1px solid var(--border);border-radius:var(--radius);padding:26px 26px 22px;background:#fff}
.ba-card.before{background:#fafbfc;border-color:#ececec}
.ba-card.after{border-color:var(--brand);background:var(--brand-wash)}
.ba-tag{font-size:12.5px;font-weight:600;letter-spacing:.04em;color:var(--ink-3);margin-bottom:16px}
.ba-tag.ok{color:var(--brand-ink)}
.ba-q{display:inline-block;font-size:12px;font-weight:700;color:var(--ink-3);background:#eef0f2;border-radius:6px;padding:3px 10px;margin-bottom:8px}
.ba-ans{font-size:14px;color:var(--ink);margin-bottom:14px;font-weight:600}
.ba-a{font-size:14px;color:var(--ink-2);line-height:1.7;background:#fff;border-radius:var(--radius-sm);border:1px solid var(--border);padding:14px 16px}
.ba-card.after .ba-a{border-color:var(--brand-soft)}
.ba-miss{color:#c0392b;font-weight:700}
.ba-hit{color:var(--brand);font-weight:700}
.ba-a a{color:var(--brand);text-decoration:underline}
.ba-foot{font-size:12.5px;color:var(--ink-3);margin-top:14px;border-top:1px dashed var(--border);padding-top:12px}
.ba-foot.ok{color:var(--brand-ink);border-top-color:var(--brand-soft)}

.geo-check{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:8px}
@media(max-width:820px){.geo-check{grid-template-columns:1fr}}
.geo-item{border:1px solid var(--border);border-radius:var(--radius);padding:22px 22px;background:#fff;display:flex;gap:14px;align-items:flex-start}
.geo-item h4{font-size:16.5px;margin-bottom:7px}
.geo-item p{font-size:13.5px;color:var(--ink-2);line-height:1.6}
.g-ico{flex:none;width:26px;height:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;color:#fff;margin-top:2px}
.g-ico.miss{background:#d9534f}
.geo-cycle{font-size:14.5px;color:var(--ink-2);max-width:760px;margin-top:14px;line-height:1.7}

/* ---- Website before/after metrics + trust + case expand ---- */
.ba-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:22px}
@media(max-width:820px){.ba-metrics{grid-template-columns:1fr}}
.bm{border:1px solid var(--border);border-radius:var(--radius);padding:20px 22px;background:#fff;text-align:center}
.bm-n{display:block;font-size:22px;font-weight:600;color:var(--brand);letter-spacing:-0.01em;margin-bottom:6px}
.bm-l{font-size:13.5px;color:var(--ink-2)}

.trust-list{display:grid;gap:14px}
.trust-item{border:1px solid var(--border);border-left:3px solid var(--brand);border-radius:var(--radius-sm);padding:18px 20px;background:#fff}
.trust-item .ti-n{font-size:15px;font-weight:700;color:var(--brand-ink);margin-bottom:6px}
.trust-item p{font-size:13.5px;color:var(--ink-2);line-height:1.6}

.case-card .expand-content{margin-top:14px;padding-top:16px;border-top:1px dashed var(--border);font-size:14px;color:var(--ink-2);line-height:1.7}
.case-card .expand-content h5{font-size:14px;color:var(--ink);margin-bottom:8px}
.case-card[data-expand]:hover{cursor:pointer}

/* ---- iSales sample buyers + credit points ---- */
.sample-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:8px}
@media(max-width:900px){.sample-grid{grid-template-columns:1fr}}
.sample-card{border:1px solid var(--border);border-radius:var(--radius);padding:24px 24px;background:#fff}
.sample-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;gap:10px}
.sample-card .ind{margin-bottom:0}
.sample-card .score{font-size:13px;font-weight:700;color:var(--brand);background:var(--brand-wash);border:1px solid var(--brand-soft);border-radius:999px;padding:4px 12px;white-space:nowrap}
.s-signal{font-size:14px;color:var(--ink-2);line-height:1.6;margin-bottom:14px}
.s-signal b{color:var(--ink)}
.s-action{font-size:13.5px;color:var(--brand-ink);background:var(--brand-wash);border-radius:var(--radius-sm);padding:12px 14px;line-height:1.6}

.creditvis{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:8px}
@media(max-width:900px){.creditvis{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.creditvis{grid-template-columns:1fr}}
.cv-card{border:1px solid var(--border);border-radius:var(--radius);padding:24px 22px;background:#fff;text-align:center;display:flex;flex-direction:column}
.cv-card.featured{border-color:var(--brand);background:var(--brand-wash)}
.cv-p{font-size:24px;font-weight:600;color:var(--brand);letter-spacing:-0.01em;margin-bottom:8px}
.cv-h{font-size:16px;margin-bottom:8px}
.cv-sub{font-size:13px;color:var(--ink-2);line-height:1.6;margin-top:auto}
.cv-note{font-size:13.5px;color:var(--ink-2);margin-top:18px;line-height:1.7;border-top:1px dashed var(--border);padding-top:16px}

/* ---- website case study : 案例网站外观示意 + 解读 ---- */
.case-study{border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;background:#fff;margin-top:30px}
.case-study:first-of-type{margin-top:0}
.cs-head{padding:20px 28px;border-bottom:1px solid var(--border);display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.cs-head .ind{font-size:12px;font-weight:600;color:var(--brand);letter-spacing:.06em}
.cs-head h3{font-size:19px;margin:0;letter-spacing:-0.02em}
.cs-head .tag{margin-left:auto;font-size:12px;color:var(--ink-3);background:var(--bg-soft);border:1px solid var(--border);border-radius:999px;padding:5px 12px;white-space:nowrap}

/* 浏览器窗口 mockup（网站外观示意） */
.site-mock{border-bottom:1px solid var(--border);background:var(--bg-subtle)}
.sm-bar{display:flex;align-items:center;gap:7px;padding:11px 16px;background:var(--bg-soft);border-bottom:1px solid var(--border)}
.sm-dot{width:10px;height:10px;border-radius:50%;background:#d4d4d8}
.sm-dot.r{background:#ff5f57}.sm-dot.y{background:#febc2e}.sm-dot.g{background:#28c840}
.sm-url{flex:1;margin-left:12px;font-size:12px;color:var(--ink-3);background:#fff;border:1px solid var(--border);border-radius:6px;padding:5px 11px;letter-spacing:.01em}
.sm-screen{background:#fff;padding:24px 30px 28px}
.sm-nav{display:flex;align-items:center;justify-content:space-between;padding-bottom:20px;border-bottom:1px solid var(--border)}
.sm-logo{display:flex;align-items:center;gap:9px;font-size:15px;font-weight:700;color:var(--ink);letter-spacing:-0.02em}
.sm-logo .sq{width:17px;height:17px;border-radius:5px;background:var(--brand)}
.sm-menu{display:flex;gap:22px;font-size:13px;color:var(--ink-3)}
.sm-hero{display:flex;justify-content:space-between;align-items:flex-end;gap:28px;padding:28px 0 24px}
.sm-hero .t1{font-size:23px;font-weight:700;letter-spacing:-0.03em;line-height:1.18;color:var(--ink);max-width:60%}
.sm-hero .t2{font-size:13px;color:var(--ink-2);margin-top:12px;line-height:1.6;max-width:64%}
.sm-cta{display:inline-block;background:var(--brand);color:#fff;font-size:13px;font-weight:600;padding:10px 18px;border-radius:8px;white-space:nowrap}
.sm-row{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;padding-top:22px;border-top:1px solid var(--border)}
.sm-mini{border:1px solid var(--border);border-radius:8px;padding:13px 14px;background:var(--bg-subtle);font-size:12px;color:var(--ink-2);line-height:1.5}
.sm-mini b{display:block;color:var(--ink);font-size:12.5px;margin-bottom:3px}
.sm-certs{display:flex;gap:8px;margin-top:18px;flex-wrap:wrap}
.sm-cert{font-size:11px;font-weight:600;color:var(--brand-ink);background:var(--brand-wash);border:1px solid var(--brand-soft);border-radius:6px;padding:5px 10px}

/* 解读 3 列 */
.cs-body{display:grid;grid-template-columns:repeat(3,1fr)}
.cs-col{padding:22px 26px;border-right:1px solid var(--border)}
.cs-col:last-child{border-right:none}
.cs-col .cs-k{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--brand);margin-bottom:12px}
.cs-col h5{font-size:14.5px;margin-bottom:9px;color:var(--ink);letter-spacing:-0.01em}
.cs-col p{font-size:13.5px;color:var(--ink-2);line-height:1.65}
.cs-col ol{margin:0;padding-left:17px;font-size:13.5px;color:var(--ink-2);line-height:1.68}
.cs-col ol li{margin-bottom:7px}
@media(max-width:820px){
  .cs-body{grid-template-columns:1fr}
  .cs-col{border-right:none;border-bottom:1px solid var(--border)}
  .cs-col:last-child{border-bottom:none}
  .sm-hero{flex-direction:column;align-items:flex-start;gap:16px}
  .sm-hero .t1,.sm-hero .t2{max-width:100%}
  .sm-row{grid-template-columns:repeat(2,1fr)}
  .sm-menu{display:none}
}

