/* 胖柴官网设计系统 v2 · 2026-07-14 · 对标飞书官网的蓝白 SaaS 风 */
:root{
  /* 强调色＝胖柴 logo 实际用色（2026-08-11 采样 logo-purple.png 主体色 #6550ff）。
     结构参考飞书官网：白底 + 近黑正文 + 单一强调色只用于 CTA 与链接；不用飞书蓝。 */
  --blue:#6550ff;          /* 主 CTA / 链接（胖柴紫） */
  --blue-hover:#5341e6;
  --blue-soft:#f0edff;
  --purple:#6550ff;        /* 品牌紫 */
  --navy:#05143b;          /* 标题/页脚（胖柴藏蓝） */
  --ink:#1f2329;
  --body:#51565d;
  --mute:#8f959e;
  --line:#e5e6eb;
  --bg:#ffffff;
  --bg-soft:#f5f8ff;
  --r-btn:8px; --r-card:16px;
  --shadow-card:0 12px 32px rgba(31,60,136,.08);
  --shadow-lift:0 16px 40px rgba(31,60,136,.14);
  /* 科技风蓝紫：深空蓝 → 靛蓝 → 品牌紫。三层径向光叠在线性底上做出 mesh 质感，
     蓝的部分刻意压在紫之前，避免变成单一紫；电蓝与青蓝只作高光，不做大面积。 */
  --ink-deep:#060d2e;
  --g-tech:
    radial-gradient(94% 74% at 78% 8%,rgba(139,110,255,.72) 0%,rgba(139,110,255,0) 66%),
    radial-gradient(72% 60% at 22% 88%,rgba(122,92,255,.46) 0%,rgba(122,92,255,0) 68%),
    radial-gradient(56% 50% at 4% 30%,rgba(52,96,235,.26) 0%,rgba(52,96,235,0) 64%),
    radial-gradient(46% 42% at 66% 106%,rgba(96,180,255,.14) 0%,rgba(96,180,255,0) 72%),
    linear-gradient(160deg,#0a0f36 0%,#241a78 32%,#4a30d8 66%,#7a5cff 100%);
  --g-tech-soft:
    radial-gradient(84% 72% at 84% 0%,rgba(139,110,255,.58) 0%,rgba(139,110,255,0) 62%),
    radial-gradient(56% 54% at 6% 42%,rgba(52,96,235,.2) 0%,rgba(52,96,235,0) 64%),
    linear-gradient(154deg,#0c1140 0%,#2a1f7f 44%,#5a3fdd 100%);
  --grad-hero:var(--g-tech);
  --grad-cta:var(--g-tech-soft);
}
/* 跨文档转场：纯声明式渐进增强，不支持的浏览器按普通跳转处理，零代价 */
@view-transition{navigation:auto}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:"PingFang SC","HarmonyOS Sans SC","Source Han Sans SC","Microsoft YaHei",-apple-system,"Segoe UI",sans-serif;color:var(--body);background:var(--bg);font-size:16px;line-height:1.75;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{color:var(--navy);font-weight:600;line-height:1.32}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.wrap{max-width:1160px;margin:0 auto;padding:0 24px}
section{padding:96px 0}
.band-soft{background:var(--bg-soft)}

/* ── 按钮 ── */
.btn{display:inline-block;font-size:16px;font-weight:500;border-radius:var(--r-btn);padding:13px 30px;transition:background-color .18s ease,border-color .18s ease,color .18s ease,transform .18s ease,box-shadow .18s ease;cursor:pointer;line-height:1.6}
.btn-primary{background:var(--blue);color:#fff}
.btn-primary:hover{background:var(--blue-hover);transform:translateY(-2px);box-shadow:0 8px 20px rgba(101,80,255,.32)}
.btn-secondary{background:#fff;color:var(--navy);border:1px solid var(--line)}
.btn-secondary:hover{border-color:var(--blue);color:var(--blue);transform:translateY(-2px)}
.btn-lg{font-size:17px;padding:16px 40px}

/* ── 导航 ── */
header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.92);backdrop-filter:blur(10px);border-bottom:1px solid rgba(229,230,235,.7)}
.nav{display:flex;align-items:center;justify-content:space-between;padding:10px 24px;max-width:1160px;margin:0 auto}
.nav-logo img{height:52px;width:auto}
.nav-links{display:flex;gap:30px;align-items:center;font-size:15px;font-weight:500;color:var(--ink)}
.nav-links a:hover{color:var(--blue)}
.nav-links .btn{padding:9px 22px;font-size:14px}
.nav-toggle{display:none;background:none;border:none;font-size:24px;color:var(--navy);cursor:pointer}

/* ── Hero ── */
.hero{background:var(--grad-hero);padding:104px 0 72px;text-align:center}
.hero .eyebrow{margin-bottom:26px}
.hero h1{font-size:54px;letter-spacing:.5px;margin-bottom:22px}
.hero .lead{font-size:19px;color:var(--body);max-width:640px;margin:0 auto 38px}
.hero-ctas{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;margin-bottom:14px}
.hero .note{font-size:13.5px;color:var(--mute)}
.eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:500;color:var(--blue);background:#fff;border:1px solid rgba(101,80,255,.25);border-radius:999px;padding:7px 20px;box-shadow:0 2px 8px rgba(101,80,255,.08)}
.eyebrow::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--grad-cta)}

/* ── 数字条（悬浮白卡） ── */
.stats-card{max-width:960px;margin:56px auto 0;background:#fff;border-radius:var(--r-card);box-shadow:var(--shadow-card);display:grid;grid-template-columns:repeat(4,1fr);padding:34px 20px;gap:12px}
.stat{text-align:center;border-right:1px solid var(--line)}
.stat:last-child{border-right:0}
.stat .num{font-size:40px;font-weight:600;color:var(--navy);line-height:1.15}
.stat .num sup{font-size:20px;color:var(--blue)}
.stat .lbl{font-size:13.5px;color:var(--mute);margin-top:4px}

/* ── TLDR / GEO 摘要 ── */
.tldr{max-width:760px;margin:40px auto 0;background:#fff;border:1px solid var(--line);border-radius:12px;padding:18px 26px;font-size:14.5px;color:var(--body);text-align:left}
.tldr strong{color:var(--navy)}

/* ── 节头 ── */
.sec-head{text-align:center;max-width:760px;margin:0 auto 56px}
.sec-head .tag{display:inline-block;font-size:14px;font-weight:500;color:var(--blue);margin-bottom:14px;letter-spacing:1px}
.sec-head h2{font-size:38px;margin-bottom:16px}
.sec-head .lead{font-size:17px;color:var(--body)}
.sec-head.left{text-align:left;margin-left:0}

/* ── 通用卡片 ── */
.card{background:#fff;border:1px solid var(--line);border-radius:var(--r-card);padding:36px 32px;transition:box-shadow .2s ease,transform .2s ease,border-color .2s ease}
.card:hover{box-shadow:var(--shadow-lift);transform:translateY(-4px);border-color:transparent}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}

/* ── 痛点区 ── */
.insight-quote{font-size:28px;font-weight:600;color:var(--navy);line-height:1.5}
.insight-quote em{font-style:normal;color:var(--blue)}
.insight-quote .src{display:block;margin-top:16px;font-size:13.5px;font-weight:400;color:var(--mute)}
.insight-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:56px;align-items:center}
.pain-list{list-style:none;display:flex;flex-direction:column;gap:12px}
.pain-list li{background:#fff;border:1px solid var(--line);border-radius:12px;padding:14px 22px;font-size:15px;display:flex;gap:12px;align-items:flex-start}
.pain-list li::before{content:"";flex-shrink:0;width:8px;height:8px;border-radius:50%;background:var(--grad-cta);margin-top:10px}
.pain-list li{transition:border-color .18s ease,background-color .18s ease,transform .18s ease,color .18s ease;cursor:default}
/* 鼠标停在哪条，哪条高亮——其余保持原样，靠对比把注意力压到当前这条 */
.pain-list li:hover{border-color:var(--blue);background:#faf9ff;transform:translateX(4px)}
.pain-list li:hover::before{background:var(--blue)}
.pain-list li.hl{background:var(--navy);color:#fff;border-color:var(--navy);font-weight:500}
.pain-list li.hl:hover{background:#0a1f52;border-color:var(--blue);transform:translateX(4px)}
.pain-list li.hl::before{background:#fff}

/* ── CTA 模式卡 ── */
.cta-card .chip{width:56px;height:56px;border-radius:14px;background:var(--grad-cta);color:#fff;font-size:26px;font-weight:600;display:flex;align-items:center;justify-content:center;margin-bottom:20px}
.cta-card .en{font-size:12.5px;letter-spacing:2px;color:var(--mute);text-transform:uppercase;margin-bottom:8px}
.cta-card h3{font-size:21px;margin-bottom:14px}
.cta-card ul{list-style:none;display:flex;flex-direction:column;gap:9px;font-size:15px;color:var(--body)}
.cta-card ul li{padding-left:18px;position:relative}
.cta-card ul li::before{content:"";position:absolute;left:0;top:11px;width:6px;height:6px;border-radius:50%;background:var(--blue)}
.flow-note{margin-top:36px;background:var(--blue-soft);border-radius:12px;padding:20px 28px;font-size:15.5px;color:var(--navy);font-weight:500;text-align:center}

/* ── 解决方案卡 ── */
.sol-card{display:flex;flex-direction:column}
.sol-card .head{border-radius:12px;padding:22px 24px;margin-bottom:22px;color:var(--navy)}
.sol-card .head .tag{font-size:12.5px;letter-spacing:2px;opacity:.75;display:block;margin-bottom:6px}
.sol-card .head h3{font-size:20px;line-height:1.45}
.sol-ec .head{background:linear-gradient(120deg,#eef2ff,#f3efff)}
.sol-food .head{background:linear-gradient(120deg,#e8fbf8,#eef7ff)}
.sol-more .head{background:linear-gradient(120deg,#fff8e6,#f5f8ff)}
.sol-card ul{list-style:none;display:flex;flex-direction:column;gap:10px;font-size:14.5px;color:var(--body);margin-bottom:26px}
.sol-card ul li{padding-left:20px;position:relative}
.sol-card ul li::before{content:"✓";position:absolute;left:0;color:var(--blue);font-weight:600}
.sol-card .btn{margin-top:auto;align-self:flex-start}

/* ── demo 卡 ── */
.demo-card h4{font-size:16.5px;margin:0 0 8px}
.demo-card p{font-size:13.5px;color:var(--body);line-height:1.65}
.demo-card .dot{width:34px;height:34px;border-radius:9px;display:flex;align-items:center;justify-content:center;font-size:15px;margin-bottom:14px;background:var(--blue-soft)}
.demo-note{margin-top:40px;display:flex;align-items:center;justify-content:center;gap:18px;flex-wrap:wrap}
.demo-note .small{font-size:13.5px;color:var(--mute)}

/* ── 案例卡 ── */
.case-card{position:relative;padding-top:52px}
.case-card::before{content:"“";position:absolute;top:14px;left:28px;font-size:56px;line-height:1;color:var(--blue);opacity:.35;font-family:Georgia,serif}
.case-card p{font-size:16px;color:var(--ink);line-height:1.8}
.case-card .who{display:inline-block;margin-top:18px;font-size:12.5px;color:var(--blue);background:var(--blue-soft);border-radius:999px;padding:5px 14px}
.clients{margin-top:48px;text-align:center}
.clients-label{font-size:13px;letter-spacing:2px;color:var(--mute);display:block;margin-bottom:18px}
.client-chips{display:flex;gap:12px;flex-wrap:wrap;justify-content:center}
.client-chips span{border:1px solid var(--line);background:#fff;border-radius:999px;padding:9px 22px;font-size:14.5px;font-weight:500;color:var(--navy)}

/* ── 活动墙 ── */
.events-photos{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.events-photos img{aspect-ratio:16/10;object-fit:cover;border-radius:var(--r-card);box-shadow:var(--shadow-card)}
.events-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:16px;margin-top:26px}
.event-card{margin:0}
.event-card img{width:100%;border-radius:12px;border:1px solid var(--line)}
.event-card figcaption{font-size:12.5px;color:var(--mute);margin-top:8px;line-height:1.5}

/* ── 关于 ── */
.about-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:56px;align-items:start}
.about-copy p{margin-bottom:18px;font-size:16px}
/* 关于胖柴的三条承诺：替代原来的「真诚利他/学习力强/乐于分享」内部价值观。
   客户不关心你的价值观，关心你怎么干活、以及什么时候会说不。 */
.promise{list-style:none;display:flex;flex-direction:column;gap:0;border-top:1px solid var(--line)}
.promise li{padding:18px 0;border-bottom:1px solid var(--line)}
.promise b{display:block;font-size:16.5px;font-weight:600;color:var(--navy);margin-bottom:5px}
.promise b::before{content:"";display:inline-block;width:18px;height:2px;background:var(--blue);
  vertical-align:5px;margin-right:10px}
.promise span{display:block;font-size:14.5px;line-height:1.75;color:var(--body)}
.about-grid{align-items:start}
.city-card{background:#fff;border:1px solid var(--line);border-radius:var(--r-card);padding:30px;box-shadow:var(--shadow-card)}
.city-card h4{font-size:14px;letter-spacing:2px;color:var(--mute);font-weight:500;margin-bottom:16px}
.city-card .cities{display:flex;gap:10px;flex-wrap:wrap}
.city-card .cities a{background:var(--bg-soft);color:var(--navy);border-radius:999px;padding:7px 18px;font-size:14.5px;font-weight:500;transition:background-color .15s ease,color .15s ease}
.city-card .cities a:hover{background:var(--blue);color:#fff}

/* ── FAQ ── */
.faq-list{max-width:820px;margin:0 auto}
.faq-list details{background:#fff;border:1px solid var(--line);border-radius:12px;padding:20px 26px;margin-bottom:14px}
.faq-list details[open]{box-shadow:var(--shadow-card)}
.faq-list summary{font-size:17px;font-weight:600;color:var(--navy);cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:16px}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list summary::after{content:"+";font-size:22px;color:var(--blue);font-weight:400;flex-shrink:0}
.faq-list details[open] summary::after{content:"−"}
.faq-list details p{margin-top:12px;font-size:15px;color:var(--body);max-width:700px}
.faq-more{text-align:center;margin-top:32px}

/* ── 留资渐变带 ── */
.lead-band{position:relative;background:var(--g-tech);text-align:center;color:#fff;overflow:hidden}
.lead-band::before{content:"";position:absolute;inset:0;pointer-events:none;
  background-image:
    linear-gradient(to right,rgba(255,255,255,.05) 1px,transparent 1px),
    linear-gradient(to bottom,rgba(255,255,255,.05) 1px,transparent 1px);
  background-size:68px 68px;
  -webkit-mask-image:radial-gradient(90% 80% at 50% 0%,#000,transparent 76%);
  mask-image:radial-gradient(90% 80% at 50% 0%,#000,transparent 76%)}
.lead-band > .wrap{position:relative;z-index:1}
.lead-band .btn-primary{background:#fff;color:var(--navy)}
.lead-band .btn-primary:hover{background:#eeeaff;color:var(--navy)}
.lead-band .hook{background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.16)}
.lead-band h2{color:#fff;font-size:40px;margin-bottom:16px}
.lead-band .lead{color:rgba(255,255,255,.88);max-width:560px;margin:0 auto 36px;font-size:17px}
.lead-band .btn-primary{background:#fff;color:var(--blue)}
.lead-band .btn-primary:hover{background:#f0f4ff;box-shadow:0 8px 24px rgba(0,0,0,.18)}
.hooks{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;max-width:940px;margin:52px auto 0;text-align:left}
.hook{background:rgba(255,255,255,.14);border-radius:14px;padding:26px 24px;backdrop-filter:blur(4px)}
.hook .lvl{font-size:12px;letter-spacing:2px;color:rgba(255,255,255,.75);margin-bottom:10px}
.hook h4{color:#fff;font-size:17px;margin-bottom:8px}
.hook p{font-size:13.5px;color:rgba(255,255,255,.82)}

/* ── 客服二维码弹层 ── */
.qr-modal{position:fixed;inset:0;display:none;align-items:center;justify-content:center;z-index:100}
.qr-modal:target{display:flex}
.qr-backdrop{position:absolute;inset:0;background:rgba(5,20,59,.55)}
.qr-box{position:relative;background:#fff;border-radius:var(--r-card);padding:28px;max-width:320px;text-align:center;box-shadow:var(--shadow-lift)}
.qr-box img{width:100%;border-radius:10px}
.qr-box p{font-size:14px;color:var(--body);margin:14px 0 18px;line-height:1.6}

/* ── 内页 ── */
.page-hero{background:var(--grad-hero);padding:72px 0 48px;text-align:center}
.page-hero h1{font-size:42px;margin-bottom:16px}
.page-hero .lead{font-size:17px;color:var(--body);max-width:680px;margin:0 auto}
.breadcrumb{font-size:13px;color:var(--mute);margin-bottom:20px}
.breadcrumb a{color:var(--blue)}
.content-md{max-width:860px;margin:0 auto;text-align:left;overflow-wrap:anywhere}
.content-md > h2{font-size:28px;margin:42px 0 16px;padding-left:14px;border-left:3px solid var(--blue)}
.content-md > h3{font-size:20px;margin:28px 0 12px}
.content-md p{margin-bottom:16px}
.content-md ul{padding-left:22px;margin-bottom:16px}
.content-md li{margin-bottom:8px}
.content-md table{display:block;width:100%;overflow-x:auto;border-collapse:collapse;margin:24px 0;background:#fff}
.content-md th,.content-md td{min-width:150px;padding:12px 14px;border:1px solid var(--line);text-align:left;vertical-align:top}
.table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:12px;margin:24px 0}
table.cmp{border-collapse:collapse;width:100%;font-size:14.5px;background:#fff}
table.cmp th,table.cmp td{border-bottom:1px solid var(--line);padding:14px 16px;text-align:left;vertical-align:top}
table.cmp th{background:var(--bg-soft);color:var(--navy);font-weight:600;white-space:nowrap}
table.cmp tr:last-child td{border-bottom:0}
.src-note{font-size:12.5px;color:var(--mute);margin-top:10px}
.source-note{margin:22px 0 0;padding:13px 16px;border-left:3px solid rgba(101,80,255,.55);background:rgba(255,255,255,.72);color:#68717c;font-size:12.5px;line-height:1.65}
.source-note a{color:var(--blue);font-weight:500}

/* ── 页脚 ── */
footer{background:var(--navy);color:rgba(255,255,255,.72);padding:64px 0 40px;font-size:14px}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr .9fr;gap:44px;align-items:start}
.foot-grid img.logo{height:56px;width:auto;margin-bottom:18px}
.foot-col h5{color:#fff;font-size:14px;margin-bottom:14px;font-weight:600}
.foot-links{display:flex;flex-direction:column;gap:10px}
.foot-links a:hover{color:#9db9ff}
.foot-qr{display:flex;gap:18px;align-items:flex-start}
.foot-qr .qr-item{text-align:center}
.foot-qr img{width:92px;border-radius:8px;margin-bottom:8px}
.foot-qr p{font-size:12px}
/* ── 客户 logo 墙（文字版） ── */
.logo-wall{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;max-width:900px;margin:0 auto}
.logo-wall span{border:1px solid var(--line);border-radius:10px;padding:16px 28px;font-size:16.5px;font-weight:600;color:var(--navy);background:#fff;letter-spacing:.5px}
/* ── 产品页小标签 ── */
.tag-soft{display:inline-block;font-size:11.5px;font-weight:500;color:var(--blue);background:var(--blue-soft);border-radius:999px;padding:2px 10px;margin-left:8px;vertical-align:middle}
.foot-bottom{border-top:1px solid rgba(255,255,255,.14);margin-top:44px;padding-top:22px;font-size:12.5px;color:rgba(255,255,255,.45);display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px}
.credential-card{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,.72fr);gap:36px;align-items:start;margin:40px 0;padding:30px;border:1px solid var(--line);border-radius:16px;background:#f7f9fc}
.credential-card h2{margin-top:0}
.credential-copy dl{display:grid;gap:10px;margin:22px 0}
.credential-copy dl div{display:grid;grid-template-columns:110px 1fr;gap:12px;padding-top:10px;border-top:1px solid var(--line)}
.credential-copy dt{font-weight:700;color:var(--navy)}
.credential-copy dd{margin:0}
.credential-figure{margin:0;padding:10px;background:#fff;border:1px solid var(--line);border-radius:10px}
.credential-figure img{display:block;width:100%;height:auto}
.credential-figure figcaption{padding:10px 4px 2px;color:var(--mute);font-size:12.5px;line-height:1.6}
.hash-value{overflow-wrap:anywhere;word-break:break-all}
.evidence-boundaries{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;margin:36px 0}
.evidence-boundaries section{padding:24px;border:1px solid var(--line);border-radius:14px;background:#fff}
.evidence-boundaries h2{margin-top:0;font-size:22px}

/* ── 响应式 ── */
@media (max-width:960px){
  .credential-card{grid-template-columns:1fr}
  .evidence-boundaries{grid-template-columns:1fr}
  .hero h1{font-size:38px}
  .sec-head h2{font-size:30px}
  .page-hero h1{font-size:32px}
  .insight-grid,.about-grid{grid-template-columns:1fr}
  .grid-3,.hooks{grid-template-columns:1fr}
  .grid-4{grid-template-columns:1fr 1fr}
  .events-grid{grid-template-columns:repeat(3,1fr)}
  .events-photos{grid-template-columns:1fr}
  .stats-card{grid-template-columns:1fr 1fr;gap:20px}
  .stat:nth-child(2){border-right:0}
  .foot-grid{grid-template-columns:1fr 1fr}
  section{padding:64px 0}
  .nav-links{display:none;position:absolute;top:100%;left:0;right:0;background:#fff;flex-direction:column;padding:20px 24px;border-bottom:1px solid var(--line);gap:18px;align-items:flex-start}
  .nav-links.open{display:flex}
  .nav-toggle{display:block}
}
@media (max-width:560px){
  .credential-card{padding:20px 16px;gap:22px}
  .credential-copy dl div{grid-template-columns:1fr;gap:3px}
  .wrap{padding-left:18px;padding-right:18px}
  .page-hero{padding:56px 0 40px}
  .page-hero h1{font-size:28px}
  .page-hero .lead{font-size:16px}
  .content-md > h2{font-size:24px;margin-top:34px;padding-left:12px}
  .hero h1{font-size:30px}
  .grid-4,.events-grid{grid-template-columns:1fr 1fr}
  .insight-quote{font-size:22px}
  .lead-band h2{font-size:28px}
  .stat .num{font-size:30px}
  .foot-grid{grid-template-columns:1fr}
}

/* ══ 首页首屏（2026-08-11 大面积渐变版）══
   大面积品牌渐变：藏蓝 #05143b → 品牌紫 #6550ff，两色都取自 logo。
   判断表做成白卡浮在渐变上，对比最强、一眼抓住。
   首屏仍是「零动效区」，LCP 元素锁定为 H1 文本（文本 LCP 最快）。 */
.home{--paper:#ffffff;--paper-line:var(--line);--signal:var(--blue);background:#fff;color:var(--ink);overflow-x:hidden}
.home header{background:rgba(255,255,255,.94);border-bottom-color:var(--line)}
.home .home-hero{
  position:relative;text-align:left;overflow:hidden;
  min-height:calc(100svh - 66px);
  display:flex;flex-direction:column;justify-content:center;
  padding:40px 0 60px;color:#fff;
  background:var(--g-tech);
}
/* 细网格叠在渐变上，增加质感又不抢内容 */
.home .home-hero::before{
  content:"";position:absolute;inset:0;pointer-events:none;z-index:0;
  background-image:
    linear-gradient(to right,rgba(255,255,255,.055) 1px,transparent 1px),
    linear-gradient(to bottom,rgba(255,255,255,.055) 1px,transparent 1px);
  background-size:68px 68px;
  -webkit-mask-image:linear-gradient(180deg,#000 0%,rgba(0,0,0,.35) 72%,transparent 100%);
  mask-image:linear-gradient(180deg,#000 0%,rgba(0,0,0,.35) 72%,transparent 100%);
}
.home .home-hero > .wrap{position:relative;z-index:1;width:100%}
.home-hero-grid{display:grid;grid-template-columns:minmax(0,49fr) minmax(0,51fr);gap:56px;align-items:center;flex:1 1 auto;align-content:center}
.home-hero-copy,.home-hero-panel{min-width:0}
.home .home-hero h1{font-size:clamp(32px,3.8vw,52px);font-weight:600;line-height:1.19;letter-spacing:-.012em;color:#fff;margin:0 0 18px}
.home .home-hero .lead{font-size:19px;line-height:1.7;max-width:520px;margin:0 0 24px;color:rgba(255,255,255,.82)}
.home .home-hero .lead b{color:#fff;font-weight:600}

/* 三步：细线分隔的编号要点，反白 */
.hero-steps{list-style:none;margin:0 0 30px;padding:0;display:grid;gap:0;max-width:520px;
  border-top:1px solid rgba(255,255,255,.2)}
.hero-steps li{display:grid;grid-template-columns:44px 1fr;align-items:baseline;gap:12px;
  padding:13px 0;border-bottom:1px solid rgba(255,255,255,.2);font-size:16px;
  color:rgba(255,255,255,.92);line-height:1.6}
.hero-steps .n{font-family:"SF Pro Display","Segoe UI",-apple-system,sans-serif;
  font-variant-numeric:tabular-nums;font-size:13px;font-weight:600;letter-spacing:.06em;color:#b3a6ff}

/* 深底上的按钮反转：主按钮白底深字，副按钮描边 */
.home .home-hero .hero-ctas{justify-content:flex-start;margin-bottom:0}
.home .home-hero .btn-primary{background:#fff;color:var(--navy)}
.home .home-hero .btn-primary:hover{background:#eeeaff;color:var(--navy)}
.home .home-hero .btn-secondary{background:transparent;color:#fff;border-color:rgba(255,255,255,.5)}
.home .home-hero .btn-secondary:hover{background:rgba(255,255,255,.12);border-color:#fff;color:#fff}

/* 判断表：白卡浮在渐变上，对比最强 */
.verdict-wrap{border:0;border-radius:var(--r-card);background:#fff;overflow:hidden;
  box-shadow:0 30px 70px rgba(3,10,38,.34),0 2px 6px rgba(3,10,38,.2)}
table.verdict{width:100%;border-collapse:collapse;font-size:13.5px;line-height:1.7}
table.verdict caption{text-align:left;padding:18px 20px 16px;border-bottom:1px solid var(--line);background:#fff}
table.verdict caption b{display:block;font-size:17px;font-weight:600;color:var(--navy);letter-spacing:-.01em}
table.verdict caption span{display:block;margin-top:3px;font-size:12.5px;color:var(--mute)}
table.verdict th,table.verdict td{padding:14px;text-align:left;vertical-align:top;border-bottom:1px solid #f0f1f3}
table.verdict thead th{font-size:11.5px;letter-spacing:.06em;color:#fff;font-weight:500;
  background:var(--navy);border-bottom:0;white-space:nowrap}
table.verdict tbody tr:last-child th,table.verdict tbody tr:last-child td{border-bottom:0}
table.verdict tbody th{color:var(--navy);font-weight:600;white-space:nowrap;width:1%;font-size:15px}
table.verdict td.do{color:var(--ink)}
table.verdict td.hold{color:var(--mute)}
table.verdict td .mk{display:inline-block;font-size:10.5px;line-height:1.5;padding:2px 7px;border-radius:3px;
  margin-right:8px;vertical-align:1px;white-space:nowrap}
table.verdict td.do .mk{background:var(--blue);color:#fff;font-weight:600}
table.verdict td.hold .mk{background:#f2f3f5;color:#79808a}
table.verdict tbody tr:hover td,table.verdict tbody tr:hover th{background:#fbfaff}
.verdict-note{margin-top:14px;font-size:12.5px;line-height:1.7;color:rgba(255,255,255,.66)}

/* 首屏底部导览带：反白细线 */
.hero-jump{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin:40px 0 0;
  border-top:1px solid rgba(255,255,255,.22)}
.hero-jump a{display:block;padding:20px 22px 24px;border-right:1px solid rgba(255,255,255,.22);
  transition:background-color .18s ease}
.hero-jump a:first-child{padding-left:0}
.hero-jump a:last-child{border-right:0}
.hero-jump a:hover{background:rgba(255,255,255,.08)}
.hero-jump .jl{display:block;font-size:15.5px;font-weight:600;color:#fff;margin-bottom:4px}
.hero-jump .jl::after{content:"↓";margin-left:7px;font-size:12px;color:#b3a6ff;
  display:inline-block;transition:transform .18s ease}
.hero-jump a:hover .jl::after{transform:translateY(3px)}
.hero-jump .jd{display:block;font-size:13px;color:rgba(255,255,255,.66);line-height:1.6}
.home-diagnostic{padding:76px 0;background:#f7f6ff;border-top:0;border-bottom:1px solid var(--line)}
.diagnostic-layout{display:grid;grid-template-columns:.72fr 1.28fr;gap:64px;align-items:start}
.diagnostic-intro .tag{color:var(--blue);letter-spacing:.08em}
/* 不用宋体栈：Mac 落 Songti SC 尚可，Windows 会掉到 SimSun，大字号下很难看 */
.diagnostic-intro h2{font-size:clamp(26px,2.6vw,34px);margin:12px 0 18px}
.diagnostic-intro p{color:#66707a}
.diagnostic-panel{background:var(--g-tech-soft);color:#fff;padding:32px;border-radius:var(--r-card)}
.diagnostic-group{border:0;margin:0 0 22px;padding:0}
.diagnostic-group legend{font-size:14px;color:#c7d2df;margin-bottom:10px}
.diagnostic-choices{display:flex;gap:8px;flex-wrap:wrap}
.diagnostic-group[data-diagnostic="industry"] .diagnostic-choices button{padding:8px 13px;font-size:14px}
.diagnostic-choices button{appearance:none;border:1px solid rgba(255,255,255,.28);background:rgba(255,255,255,.08);color:#fff;border-radius:3px;padding:10px 16px;font:inherit;cursor:pointer;transition:background-color .18s ease,border-color .18s ease,color .18s ease}
.diagnostic-choices button:hover{background:rgba(255,255,255,.16);border-color:rgba(255,255,255,.5)}
.diagnostic-choices button[aria-pressed="true"]{background:var(--blue);color:#fff;border-color:var(--blue)}
.diagnostic-choices button:focus-visible,.wechat-float-close:focus-visible{outline:3px solid #a99bff;outline-offset:3px}
.diagnostic-result{border-left:3px solid var(--blue);background:rgba(0,0,0,.24);padding:18px 20px;margin-top:26px}
.diagnostic-result span{display:block;font-size:12px;color:#abb9c9;margin-bottom:5px}
.diagnostic-result strong{display:block;font-size:19px;margin-bottom:5px}
.diagnostic-result p{font-size:14px;color:#cbd5df}
.diagnostic-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}
.diagnostic-panel .btn-secondary{border-color:rgba(255,255,255,.34);background:transparent;color:#fff}
.delivery-steps{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--paper-line);border-bottom:1px solid var(--paper-line);margin-bottom:76px}
.delivery-steps article{padding:27px 24px;border-right:1px solid var(--paper-line)}
.delivery-steps article:last-child{border-right:0}
.delivery-steps span{font-size:13px;color:var(--blue);font-weight:600;font-family:var(--num-stack,inherit);font-variant-numeric:tabular-nums}
.delivery-steps h3{font-size:19px;margin:8px 0}
.delivery-steps p{font-size:14px;color:#68717c;line-height:1.65}
.wechat-float{position:fixed;z-index:38;right:12px;top:50%;width:140px;transform:translateY(-50%);background:#fff;border:1px solid var(--paper-line);box-shadow:0 16px 42px rgba(5,20,59,.2);padding:10px}
.wechat-float-close{position:absolute;right:5px;top:3px;border:0;background:transparent;color:#69737f;font-size:20px;line-height:1;cursor:pointer}
.wechat-float-card{display:grid;gap:7px;text-align:center;color:var(--navy);font-size:14px;font-weight:600}
.wechat-qr-crop{display:block;height:118px;overflow:hidden;margin-top:8px}
.wechat-qr-crop img{width:100%;height:auto}
.wechat-float small{font-size:11.5px;font-weight:400;color:#69737f}
.wechat-float.is-collapsed{display:none}
.wechat-mobile-entry{display:none}
@media (min-width:961px) and (max-width:1415px){
  .wechat-float{display:none}
  .wechat-mobile-entry{display:block;position:fixed;z-index:39;right:14px;bottom:14px;background:var(--navy);color:#fff;border:1px solid rgba(255,255,255,.4);border-radius:3px;padding:11px 15px;font-size:14px;font-weight:600;box-shadow:0 10px 28px rgba(5,20,59,.25)}
}
@media (max-width:960px){
  .home-hero-grid,.diagnostic-layout{grid-template-columns:1fr}
  .home .home-hero{padding-top:34px;min-height:0;display:block}
  .home-hero-panel{max-width:720px}
  .hero-jump{grid-template-columns:1fr 1fr;margin-top:30px}
  .hero-jump a{border-bottom:1px solid var(--line);padding:16px 18px 18px}
  .hero-jump a:nth-child(odd){padding-left:0}
  .hero-jump a:nth-child(2n){border-right:0}
  .hero-jump a:nth-last-child(-n+2){border-bottom:0}
  .delivery-steps{grid-template-columns:1fr 1fr}
  .delivery-steps article:nth-child(2){border-right:0}
  .delivery-steps article:nth-child(-n+2){border-bottom:1px solid var(--paper-line)}
  .wechat-float{display:none}
  .wechat-mobile-entry{display:block;position:fixed;z-index:39;right:14px;bottom:14px;background:var(--navy);color:#fff;border:1px solid rgba(255,255,255,.4);border-radius:3px;padding:11px 15px;font-size:14px;font-weight:600;box-shadow:0 10px 28px rgba(5,20,59,.25)}
}
/* 窄屏：判断表由三列改为按卡点分组的纵向块，避免中文被挤成一字一行 */
@media (max-width:720px){
  /* caption 必须一起转 block：表格变成 display:block 之后，caption 仍是 table-caption，
     浏览器会给它套一个匿名表格盒并按 shrink-to-fit 算宽，中文就被压成一列一个字，
     右边留出整片空白。2026-08-14 实机截图发现。 */
  table.verdict,table.verdict caption,table.verdict tbody,table.verdict tr,table.verdict th,table.verdict td{display:block;width:auto}
  table.verdict thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  table.verdict tbody tr{border-bottom:1px solid var(--line);padding:4px 0 10px}
  table.verdict tbody tr:last-child{border-bottom:0}
  table.verdict tbody th{padding:12px 14px 4px;white-space:normal}
  table.verdict th,table.verdict td{border-bottom:0}
  table.verdict td{padding:5px 14px}
}
@media (max-width:560px){
  .hero-jump{grid-template-columns:1fr}
  .hero-jump a,.hero-jump a:nth-child(odd){border-right:0;padding:14px 0 15px}
  .hero-jump a:last-child{border-bottom:0}
  .hero-steps li{grid-template-columns:36px 1fr;font-size:15px}
  .home .home-hero h1{font-size:29px}
  .home .home-hero .lead{font-size:16px}
  .home .home-hero .btn{width:100%;text-align:center}
  .home-hero-grid{gap:34px}
  .home-hero-evidence{padding:8px}
  .diagnostic-layout{gap:28px}
  .diagnostic-intro h2{font-size:29px}
  .diagnostic-panel{padding:22px 18px}
  .diagnostic-choices button{flex:1 1 auto;padding:10px 8px}
  .diagnostic-actions .btn{width:100%;text-align:center}
  .delivery-steps{grid-template-columns:1fr}
  .delivery-steps article{border-right:0;border-bottom:1px solid var(--paper-line)}
  .delivery-steps article:last-child{border-bottom:0}
}

/* ══ 七城办公点地图 (2026-08-10) ══ */
.office-map-layout{display:grid;grid-template-columns:1.15fr .85fr;gap:28px;margin-top:34px;align-items:stretch}
.office-map{position:relative;min-height:380px;border-radius:var(--r-card);overflow:hidden;background:linear-gradient(150deg,#f0edff 0%,#f7f5ff 100%);border:1px solid var(--line);box-shadow:var(--shadow-card)}
.office-map-ph{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;text-align:center;padding:24px}
.office-map-ph span{font-size:19px;font-weight:600;color:var(--navy)}
.office-map-ph small{font-size:13.5px;color:var(--mute);line-height:1.9}
.office-list{list-style:none;display:flex;flex-direction:column;gap:10px}
.office-list li a{display:block;background:#fff;border:1px solid var(--line);border-radius:12px;padding:13px 16px;transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease}
.office-list li a:hover{border-color:var(--blue);box-shadow:0 6px 18px rgba(101,80,255,.13);transform:translateX(3px)}
.office-list strong{display:block;font-size:15.5px;color:var(--navy);margin-bottom:3px}
.office-list span{font-size:13px;color:var(--body);line-height:1.65}
@media(max-width:960px){.office-map-layout{grid-template-columns:1fr}.office-map{min-height:300px;order:2}.office-list{order:1}}
/* 高德地图容器：隔离站点全局 reset，避免 canvas 被 box-sizing/display 影响导致 0x0 */
.office-map .amap-maps,.office-map .amap-layers,.office-map canvas{box-sizing:content-box}
.office-map canvas.amap-layer{display:block;width:100%;height:100%}
.office-map img{max-width:none}
/* demo 卡片界面示意图 (2026-08-10)：图片顶到卡片边缘，替代原 emoji 图标 */
.demo-card{overflow:hidden;padding:0;display:flex;flex-direction:column}
.demo-shot{background:linear-gradient(160deg,#eef3ff 0%,#f7f4ff 100%);padding:14px 14px 0;border-bottom:1px solid var(--line)}
.demo-shot img{width:100%;height:auto;border-radius:8px 8px 0 0;display:block;transition:transform .35s ease}
.demo-card:hover .demo-shot img{transform:translateY(-4px) scale(1.015)}
.demo-card h4{padding:16px 18px 0}
.demo-card p{padding:0 18px 18px}
/* 客户墙：按行业分组 + 链接到飞书官方案例页 (2026-08-10) */
/* ══ 客户名册（2026-08-11 改版）══
   刻意不做 logo 墙：一是客户 Logo 未获授权，二是同行都在铺 logo（智书企飞 27 个），
   而顶级咨询公司与律所的 client roster 本来就是纯文字。名字放大到 22px 之后，
   「敢把客户名大大方方写出来」本身就是信号，比缩略图更有分量。
   瑞士风：四栏等宽、1px 竖线分隔、行业名做小字轨道标签、零阴影零圆角。 */
.clients{margin-top:64px;text-align:left}
.clients .clients-label{display:block;text-align:left;font-size:12px;letter-spacing:.14em;
  color:var(--mute);margin-bottom:0;padding-bottom:16px;border-bottom:1px solid var(--navy)}
.client-groups{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-top:0}
.client-group{display:flex;flex-direction:column;gap:0;padding:26px 26px 8px;
  border-right:1px solid var(--line)}
.client-group:last-child{border-right:0}
.client-group:first-child{padding-left:0}
.cg-label{position:relative;font-size:11.5px;font-weight:400;color:var(--mute);
  letter-spacing:.12em;padding-top:12px;margin-bottom:16px}
.cg-label::before{content:"";position:absolute;left:0;top:0;width:24px;height:2px;background:var(--blue)}
.cg-items{display:flex;flex-direction:column;gap:0}
.cg-items a{position:relative;display:inline-flex;align-items:baseline;gap:7px;
  padding:9px 0;font-size:22px;font-weight:600;line-height:1.35;color:var(--navy);
  background:none;border:0;border-radius:0;
  transition:color .2s ease}
.cg-items a::after{content:"↗";font-size:12px;font-weight:400;color:var(--line);
  transition:color .2s ease,transform .2s ease}
/* 下划线用 scaleX 展开，走合成器，不改 width（不触发 layout） */
.cg-items a::before{content:"";position:absolute;left:0;right:14px;bottom:6px;height:1px;
  background:var(--blue);transform:scaleX(0);transform-origin:left;transition:transform .26s cubic-bezier(.22,1,.36,1)}
.cg-items a:hover,.cg-items a:focus-visible{color:var(--blue)}
.cg-items a:hover::after,.cg-items a:focus-visible::after{color:var(--blue);transform:translate(2px,-2px)}
.cg-items a:hover::before,.cg-items a:focus-visible::before{transform:scaleX(1)}
.clients .source-note{margin-top:28px;border-left-color:rgba(101,80,255,.4)}
@media (max-width:900px){
  .client-groups{grid-template-columns:1fr 1fr}
  .client-group{border-right:0;border-bottom:1px solid var(--line);padding:22px 0 14px}
  .client-group:nth-child(odd){padding-right:22px;border-right:1px solid var(--line)}
  .client-group:nth-last-child(-n+2){border-bottom:0}
  .cg-items a{font-size:19px}
}
@media (max-width:560px){
  .client-groups{grid-template-columns:1fr}
  .client-group,.client-group:nth-child(odd){border-right:0;padding:20px 0 12px}
  .client-group:last-child{border-bottom:0}
  .cg-items a{font-size:20px}
}

/* ══ 折叠线以下的进场动效（2026-08-11）══
   三条硬约束：
   1) 只作用于首屏之外的区块。首屏是零动效区——Chrome 的 LCP 规则会把
      opacity:0 的元素排除出 LCP 候选，首屏做淡入等于自己把 LCP 往后推。
   2) 起手用 transform / clip-path，不用 opacity:0，理由同上。
   3) 用原生 CSS scroll-driven（animation-timeline），跑在合成线程、不抢 INP，
      零 JS、零依赖；不支持的浏览器（主要是 Firefox）直接看到终态，不是白屏。 */
@supports (animation-timeline: view()){
  @media (prefers-reduced-motion: no-preference){
    .pain-list li,
    .delivery-steps article,
    .grid-3 > .card,
    .grid-4 > .demo-card,
    .stats-card .stat,
    .faq-list details,
    .office-list li{
      animation:pc-rise linear both;
      animation-timeline:view();
      animation-range:entry 8% cover 26%;
    }
    /* 同组元素轻微错峰，制造节奏而不是整排一起跳 */
    .pain-list li:nth-child(2),.delivery-steps article:nth-child(2),
    .grid-3 > .card:nth-child(2),.grid-4 > .demo-card:nth-child(2){animation-range:entry 4% cover 28%}
    .pain-list li:nth-child(3),.delivery-steps article:nth-child(3),
    .grid-3 > .card:nth-child(3),.grid-4 > .demo-card:nth-child(3){animation-range:entry 1% cover 30%}
    .pain-list li:nth-child(4),.delivery-steps article:nth-child(4),
    .grid-4 > .demo-card:nth-child(4){animation-range:entry -2% cover 32%}
    /* 通栏引文：随滚动裁切揭示，比淡入更有编辑感且不动 opacity */
    .insight-quote{
      animation:pc-reveal linear both;
      animation-timeline:view();
      animation-range:entry 10% cover 34%;
    }
  }
}
@keyframes pc-rise{
  from{transform:translateY(14px)}
  to{transform:none}
}
@keyframes pc-reveal{
  from{clip-path:inset(0 22% 0 0);transform:translateY(8px)}
  to{clip-path:inset(0 0 0 0);transform:none}
}

/* ══ ICP 备案号（法定页脚展示项，2026-08-11） ══ */
.foot-bottom .icp{white-space:nowrap}
.foot-bottom .icp a{color:rgba(255,255,255,.55)}
.foot-bottom .icp a:hover{color:rgba(255,255,255,.85)}

/* ══ 动效降级：尊重系统「减少动态效果」设置（2026-08-11） ══
   低端机与无障碍需求下把动画与平滑滚动一并关掉；
   保留 transition 的终态，只把时长压到接近 0，避免出现半截状态。 */
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
    scroll-behavior:auto !important;
  }
  .btn:hover,.card:hover,.office-list li a:hover,.cg-items a:hover,.demo-card:hover .demo-shot img{transform:none}
  @view-transition{navigation:none}
}

/* ══ 中段浅色带（2026-08-12）══
   原本这一屏做成了第三个深色锚点，实测 1360px 高、整块压下来太重。
   改为极淡紫底 + 细线网格：仍与纯白区块区分开、保住节奏，但不抢首屏与留资带。
   全页只留两个深色重音：首屏、留资带。 */
.band-tint{position:relative;background:#f7f6ff;overflow:hidden}
.band-tint::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background-image:
    linear-gradient(to right,rgba(101,80,255,.05) 1px,transparent 1px),
    linear-gradient(to bottom,rgba(101,80,255,.05) 1px,transparent 1px);
  background-size:68px 68px;
  -webkit-mask-image:linear-gradient(180deg,transparent,#000 26%,#000 74%,transparent);
  mask-image:linear-gradient(180deg,transparent,#000 26%,#000 74%,transparent);
}
.band-tint > .wrap{position:relative;z-index:1}
/* 数字条：去掉悬浮白卡与阴影，改成细线网格，和首屏判断表同语言 */
.band-tint .stats-card{background:#fff;border:1px solid var(--line);box-shadow:none;
  border-radius:var(--r-card);padding:0;gap:0;overflow:hidden}
.band-tint .stat{border-right:1px solid var(--line);padding:28px 20px;text-align:center}
.band-tint .stat:last-child{border-right:0}
.band-tint .stat b{display:block;font-family:"SF Pro Display","Segoe UI",-apple-system,sans-serif;
  font-variant-numeric:tabular-nums;font-size:40px;font-weight:600;color:var(--navy);line-height:1.1;letter-spacing:-.02em}
.band-tint .stat span{display:block;margin-top:7px;font-size:13.5px;color:var(--mute)}
.band-tint .case-card{background:#fff;box-shadow:none}
.band-tint .case-card:hover{border-color:var(--blue);transform:none;box-shadow:none}
@media (max-width:960px){
  .band-tint .stats-card{grid-template-columns:1fr 1fr}
  .band-tint .stat:nth-child(2){border-right:0}
  .band-tint .stat:nth-child(-n+2){border-bottom:1px solid var(--line)}
}

/* 服务规模区第三层：具体成果。与客户名单分开成组，说明两组证据不是一回事 */
.outcomes{margin-top:44px;padding-top:36px;border-top:1px solid var(--line)}
.outcomes h3{font-size:19px;margin:0 0 20px;color:var(--navy)}
.band-tint .outcomes{border-top-color:rgba(101,80,255,.18)}

/* ══ 活动轨道（2026-08-13 重排）══
   原来是 2 张现场照占满整行 + 6 张海报另起一排，照片压场、两块割裂。
   改成一条轨道：现场照(3:2)与海报(5:6)统一高度、宽窄交替滚动，
   内容在 HTML 里复制了一份，位移到 -50% 时正好接回起点，看不出接缝。
   位移用 transform 起手（不是 opacity），避免把元素排除出 LCP 候选。 */
.event-rail{margin-top:8px;padding:2px 0;overflow:hidden;
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  background:var(--bg-soft)}
.er-track{list-style:none;margin:0;padding:0;display:flex;width:max-content;
  animation:er-scroll 72s linear infinite}
.event-rail:hover .er-track,
.event-rail:focus-within .er-track{animation-play-state:paused}
/* 间距用 margin-right 不用 gap：gap 只存在于元素之间（16 项只有 15 道），
   -50% 就对不上一份内容的宽度，每轮会跳一下；margin 每项都带，半程正好等于一份。 */
@keyframes er-scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.er-track > li{flex:0 0 auto;width:212px;margin-right:16px;display:flex;flex-direction:column}
.er-track > li.er-wide{width:378px}
.er-track img{width:100%;height:252px;object-fit:cover;object-position:top;display:block;
  border-radius:10px;border:1px solid var(--line);background:#fff}
.er-track > li.er-wide img{object-position:center}
.er-track b{margin-top:11px;font-size:13.5px;font-weight:600;color:var(--navy);line-height:1.45}
.er-track span{margin-top:3px;font-size:12px;color:var(--mute);letter-spacing:.02em}
@media (max-width:760px){
  .er-track > li{width:158px;margin-right:12px}
  .er-track > li.er-wide{width:282px}
  .er-track img{height:190px}
}
/* 关掉动效时轨道停住，改成可以自己横向拨 */
@media (prefers-reduced-motion:reduce){
  .event-rail{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .er-track{animation:none}
}

/* ══ 可公开成果（2026-08-12 重做）══
   可公开的客户结果只有两条，硬凑就是注水；
   改为给这两条足够分量 + 把「为什么只有两条」讲清楚，把稀缺变成信任信号。 */
.outcome-grid{display:grid;grid-template-columns:1fr 1fr;gap:2px;background:var(--line);
  border:1px solid var(--line);border-radius:var(--r-card);overflow:hidden}
.outcome{background:#fff;padding:28px 26px 24px;display:flex;flex-direction:column;gap:0}
.oc-tag{display:inline-block;align-self:flex-start;font-size:11.5px;letter-spacing:.08em;
  color:var(--blue);background:var(--blue-soft);padding:4px 10px;border-radius:3px;margin-bottom:18px}
/* 原句必须逐字保留（seo_audit 的 OWNER_FACT_RESULTS 硬校验，
   防止负责人确认过的成果被改写或美化），所以分量靠字号与留白给，不拆句子。 */
.oc-line{font-size:21px;font-weight:600;line-height:1.5;color:var(--navy);margin:0 0 20px;
  letter-spacing:-.005em}
.oc-link{margin-top:auto;align-self:flex-start;font-size:13.5px;color:var(--blue);font-weight:500}
.oc-link::after{content:"→";margin-left:6px;display:inline-block;transition:transform .18s ease}
.oc-link:hover::after{transform:translateX(3px)}
.oc-why{margin:22px 0 0;font-size:14.5px;line-height:1.85;color:var(--body);max-width:820px}
.oc-why b{color:var(--navy);font-weight:600}
.oc-ctas{display:flex;gap:12px;flex-wrap:wrap;margin-top:22px}
@media (max-width:760px){
  .outcome-grid{grid-template-columns:1fr}
  .oc-line{font-size:19px}
}

/* ══ 客户来信节选（2026-08-12）══
   形式对齐胖柴公众号已在用的呈现：编号 + 客户名 + 逐字引用。
   只用文字不放扫描件——扫描件同时携带公章信用代码、内部水印、客户手机号，
   而文字卡每个字段都可控，视觉也统一。信中点名的顾问姓名一律不展示。 */
.letters{margin-top:44px;padding-top:36px;border-top:1px solid var(--line)}
.band-tint .letters{border-top-color:rgba(101,80,255,.18)}
.letters h3{font-size:19px;margin:0 0 22px;color:var(--navy)}
.letter-list{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:0 40px;margin:0;padding:0}
.letter-list li{display:grid;grid-template-columns:44px 1fr;gap:16px;align-items:start;
  padding:20px 0;border-top:1px solid var(--line)}
.letter-list .ln{font-family:"SF Pro Display","Segoe UI",-apple-system,sans-serif;
  font-variant-numeric:tabular-nums;font-size:13px;font-weight:600;letter-spacing:.06em;
  color:var(--blue);padding-top:3px}
.letter-list .lorg{display:block;font-size:14px;font-weight:600;color:var(--navy);margin-bottom:8px}
.letter-list blockquote{margin:0;position:relative;padding-left:14px;font-size:14.5px;line-height:1.8;color:var(--body)}
.letter-list blockquote::before{content:"";position:absolute;left:0;top:5px;bottom:5px;width:2px;
  background:rgba(101,80,255,.35);border-radius:1px}
.letters .source-note{margin-top:24px}
@media (max-width:860px){
  .letter-list{grid-template-columns:1fr;gap:0}
  .letter-list li{grid-template-columns:36px 1fr;gap:12px}
}


/* ══ 服务城市与办公点（2026-08-12）══
   七个城市原本各占一页、正文完全同构，合成一页 + 城市锚点。
   排版按「地址优先」：城市名 → 地址 → 当地常见业务问题，方便直接抄地址导航。 */
.city-jump{display:flex;flex-wrap:wrap;gap:9px;margin-top:26px}
.city-jump a{background:rgba(255,255,255,.9);color:var(--navy);border:1px solid var(--line);
  border-radius:999px;padding:7px 18px;font-size:14.5px;font-weight:500;
  transition:background-color .15s ease,color .15s ease,border-color .15s ease}
.city-jump a:hover{background:var(--blue);border-color:var(--blue);color:#fff}
.city-offices{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;
  gap:0 40px}
.city-offices > li{padding:26px 0;border-top:1px solid var(--line);scroll-margin-top:88px}
.city-offices > li:first-child,.city-offices > li:nth-child(2){border-top:none;padding-top:6px}
.city-offices h3{font-size:20px;color:var(--navy);margin:0 0 10px;letter-spacing:-.01em}
.city-offices .city-addr{font-size:14.5px;line-height:1.7;color:var(--navy);font-weight:500;
  margin:0 0 10px;padding-left:13px;border-left:2px solid rgba(101,80,255,.4)}
.city-offices p{font-size:14.5px;line-height:1.85;color:var(--body);margin:0}
@media (max-width:860px){
  .city-offices{grid-template-columns:1fr;gap:0}
  .city-offices > li:nth-child(2){border-top:1px solid var(--line);padding-top:26px}
}


/* ══ demo 卡片改为「点了就加企业客服」（2026-08-12）══
   真实动线是顾问照着客户业务现场演示，网站上不放 demo 外链，
   所以整张卡片本身就是入口——卡片由 div 变成 a，需要恢复文字颜色并给出可点提示。 */
a.demo-card{color:inherit;text-decoration:none}
a.demo-card:hover{border-color:transparent}
a.demo-card h4{color:var(--navy)}
/* demos 页的卡片用 emoji 圆角块开头，但 .demo-card 的 padding 被首页那版清成了 0，
   图标一直贴在卡片左上角、和下面缩进 18px 的标题对不齐。这里把图标缩进补回来。 */
.demo-card .dot{margin:18px 0 12px 18px}
.demo-cta{margin-top:auto;padding:0 18px 18px;font-size:12.5px;font-weight:500;color:var(--blue);
  opacity:0;transform:translateY(4px);transition:opacity .18s ease,transform .18s ease}
a.demo-card:hover .demo-cta,a.demo-card:focus-visible .demo-cta{opacity:1;transform:none}
/* 触屏没有 hover，提示常驻，否则整张卡看不出可点 */
@media (hover:none){
  .demo-cta{opacity:1;transform:none}
}




/* ══ 深色头部的文字色（2026-08-13 修）══
   08-12 把 --grad-hero 换成深紫科技渐变时，.page-hero / .hero 的文字色没跟着改，
   还停在浅底时代的取值：h1 用 --navy(#05143b)、lead 用 --body(#51565d)。
   实测对比度最低到 1.05:1（WCAG AA 正文要求 4.5:1），18 个页面全中——
   首页因为 .home .home-hero 另有白字规则才幸免。 */
/* 内页头部改用较深的同族渐变：--g-tech 最亮的角落（#7a5cff）配纯白只有 4.37:1，
   差一点点过不了 AA；--g-tech-soft 收在 #5a3fdd，纯白能到 6.58:1。同一套品牌色，不新造颜色。
   首屏 .home-hero 维持 --g-tech 不动（文字压在左侧深色区，且是已拍板的视觉）。 */
.page-hero{background:var(--g-tech-soft)}
.page-hero h1,.hero h1{color:#fff}
.page-hero .lead{color:#fff}
.hero .lead{color:#fff;opacity:.94}
.page-hero .breadcrumb{color:rgba(255,255,255,.78)}
.page-hero .breadcrumb a{color:#fff;text-decoration:underline;text-underline-offset:2px}
.page-hero .lead a{color:#fff;text-decoration:underline;text-underline-offset:2px}
.hero .note{color:rgba(255,255,255,.78)}
/* 头部里的来源说明是浅色小卡，底色提到近乎不透明，字色才够黑 */
.page-hero .source-note{background:rgba(255,255,255,.93);color:var(--body);
  border-left-color:var(--blue)}
.page-hero .source-note a{color:var(--blue)}

/* 悬浮企业微信卡片：滚到页脚就收起。
   页脚本身有企业客服二维码，两个一样的码同屏出现很怪。 */
.wechat-float.is-at-footer{opacity:0;visibility:hidden;pointer-events:none;
  transition:opacity .2s ease,visibility .2s ease}


/* ══ 正文链接的可点性（2026-08-13）══
   全局是 a{color:inherit;text-decoration:none}，正文里的链接和普通文字长得一模一样。
   /content-index 整页都是链接，结果一个都不像能点的。这里只给正文区上色，
   不动导航、页脚和按钮（它们各有自己的配色）。 */
.content-md li a:not(.btn),
.content-md p a:not(.btn),
.content-md td a:not(.btn){color:var(--blue);font-weight:500}
.content-md li a:not(.btn):hover,
.content-md p a:not(.btn):hover,
.content-md td a:not(.btn):hover{text-decoration:underline;text-underline-offset:3px}
/* 深色页头里的链接保持白字（上面已单独定义），不被这条覆盖 */
.page-hero .lead a:not(.btn){color:#fff;font-weight:500}


/* ══ 手机端排版（2026-08-14）══
   问题不是「布局错乱」——栅格早就塌成单列了、也没有横向溢出。
   问题是**桌面比例塞进手机**：11 个 section 的上下留白合计 1432px（1.8 屏纯空白），
   卡片内边距还是 36/32，标题还是 30px，首页在 375 宽下高达 20738px ＝ 25.5 屏。
   手机上没人滚 25 屏。这一段只压比例、不改结构，全部关在 760px 以内，桌面零影响。 */
@media (max-width:760px){
  /* 1. 留白：最大的一块。11 个 section 各省 72px */
  section{padding:40px 0}
  .wrap{padding:0 18px}
  .sec-head{margin-bottom:28px}
  .sec-head h2{font-size:23px;margin-bottom:10px}
  .sec-head .lead{font-size:15px}
  .sec-head .tag{margin-bottom:8px;font-size:13px}

  /* 2. 卡片与栅格：内边距和间距按手机收 */
  .card{padding:22px 18px;border-radius:12px}
  .grid-3,.grid-4{gap:12px}
  .cta-card .chip{width:44px;height:44px;font-size:21px;margin-bottom:14px}
  .cta-card h3{font-size:18px;margin-bottom:10px}
  .cta-card ul{font-size:14px;gap:7px}
  .flow-note{margin-top:22px;padding:14px 18px;font-size:14.5px}

  /* 3. 首屏：判断表是首页最高的单块（1102px），压行内留白与字号 */
  .home .home-hero{padding-top:24px}
  .home-hero-grid{gap:28px}
  .home .home-hero h1{font-size:27px;margin-bottom:12px}
  .home .home-hero .lead{font-size:16px;margin-bottom:16px}
  .hero-steps li{font-size:14.5px;padding:9px 0}
  .hero-ctas{gap:10px}
  table.verdict tbody tr{padding:2px 0 8px}
  table.verdict th[scope=row]{font-size:15.5px;padding:10px 0 6px}
  table.verdict td{font-size:13.5px;padding:5px 0}
  .verdict-note{font-size:12.5px;margin-top:10px}
  .hero-jump{margin-top:20px;gap:10px}

  /* 4. 数字条与客户名册 */
  .stats-card{margin-top:28px;padding:20px 12px;gap:8px}
  .stat .num{font-size:30px}
  .stat .lbl{font-size:12px}
  .cg-items a{font-size:16px}
  .client-group{margin-bottom:18px}

  /* 5. 客户来信：7 条在手机上有 1089px，压紧 */
  .letters{margin-top:28px;padding-top:24px}
  .letter-list li{padding:14px 0}
  .letter-list blockquote{font-size:13.5px;line-height:1.7}
  .letter-list .lorg{font-size:13px;margin-bottom:6px}

  /* 6. 成果卡与留资带 */
  .oc-line{font-size:17px;margin-bottom:14px}
  .outcome{padding:20px 18px 18px}
  .oc-why{font-size:13.5px;margin-top:16px}
  .lead-band h2{font-size:22px;margin-bottom:10px}
  .lead-band .lead{font-size:15px;margin-bottom:22px}
  .hooks{margin-top:28px;gap:12px}

  /* 7. 办公点地图：桌面 380px 高的占位在手机上纯浪费 */
  .office-map{min-height:210px}
  .office-map-layout{margin-top:22px;gap:16px}
  .office-list li a{padding:11px 13px}
  .office-list strong{font-size:14.5px}
  .office-list span{font-size:12.5px}

  /* 8. 活动轨道 */
  .event-rail{margin-top:4px}
  .er-track img{height:150px}
  .er-track b{font-size:12.5px;margin-top:8px}
  .er-track span{font-size:11.5px}

  /* 9. 内页头部与正文 */
  .page-hero{padding:40px 0 30px}
  .page-hero h1{font-size:26px;margin-bottom:10px}
  .page-hero .lead{font-size:15.5px}
  .content-md > h2{font-size:21px;margin:28px 0 12px;padding-left:11px}
  .content-md > h3{font-size:17px;margin:20px 0 9px}
  .content-md p,.content-md li{font-size:15px}
  .content-md ul{padding-left:19px}
  .source-note{padding:11px 13px;font-size:12px;margin-top:16px}
  .tldr{margin-top:26px;padding:14px 18px;font-size:14px}

  /* 10. 城市页与加入我们 */
  .city-jump{margin-top:18px;gap:7px}
  .city-jump a{padding:6px 14px;font-size:13.5px}
  .city-offices > li{padding:18px 0;scroll-margin-top:70px}
  .city-offices h3{font-size:18px;margin-bottom:8px}
  .city-offices .city-addr,.city-offices p{font-size:13.5px}

  /* 11. 按钮与页脚 */
  .btn{padding:11px 24px;font-size:15px}
  .btn-lg{padding:13px 28px;font-size:16px}
  footer{padding:36px 0 26px;font-size:13.5px}
  .foot-grid{gap:26px}
  .foot-col h5{margin-bottom:10px}
  .foot-links{gap:7px}
  .foot-bottom{margin-top:24px;padding-top:18px}

  /* 12. 表格在手机上本来就横向滚动，把单元格收窄一点少滚几下 */
  .content-md th,.content-md td{min-width:118px;padding:9px 10px;font-size:13.5px}
}

/* 超窄屏再收一档 */
@media (max-width:380px){
  .wrap{padding:0 14px}
  .home .home-hero h1{font-size:25px}
  .sec-head h2{font-size:21px}
  .stats-card{grid-template-columns:1fr 1fr}
}


/* ══ 手机端第二轮（2026-08-14）══
   第一轮只压比例，首页从 25.5 屏降到 22.3 屏，不够。这一轮做两件事：
   修一个自己造的回归，以及在手机上折叠低优先级内容（不删内容，只是先不铺开）。 */
@media (max-width:760px){
  /* 回归修复：触屏没有 hover，上一轮让「找顾问看这个」常驻，
     结果 22 张 demo 卡各多一行，/demos 反而涨了 7%。
     改成绝对定位压在卡片右下角，不再占文档流。 */
  .demo-card{position:relative}
  .demo-cta{position:absolute;right:14px;bottom:12px;padding:0;margin:0;
    font-size:11.5px;opacity:.9}
  a.demo-card p{padding-bottom:26px}

  /* 首页 demo 区：8 张在手机上 1348px。先显 4 张，够判断「有没有我要的场景」，
     想看全部本来就有「看全部 demo 分类 →」的入口。 */
  #demos .grid-4 > a.demo-card:nth-child(n+5){display:none}
  #demos .demo-note{margin-top:20px}

  /* 客户来信 7 条在手机上 1114px。先显 3 条，其余在末尾给一行提示。 */
  .letter-list > li:nth-child(n+4){display:none}
  .letters{position:relative}
  .letter-list::after{content:"另有 4 封客户来信，加企业微信可看原件";
    display:block;margin-top:14px;padding-top:14px;border-top:1px solid var(--line);
    font-size:12.5px;color:var(--mute)}

  /* 办公点：地图占位在手机上只是个渐变块，地址列表才是有用的。地图收起。 */
  #offices .office-map{display:none}
  #offices .office-map-layout{margin-top:18px}

  /* 页脚城市列表：7 条各占一行太浪费，收成一行胶囊 */
  .foot-col:last-of-type .foot-links{flex-direction:row;flex-wrap:wrap;gap:8px}
  .foot-col:last-of-type .foot-links a{background:rgba(255,255,255,.09);
    border-radius:999px;padding:5px 12px;font-size:12.5px}

  /* 首屏判断表再收一档：它是首屏核心，不折叠，只压间距 */
  table.verdict tbody tr{padding:0 0 6px}
  table.verdict td{font-size:13px;line-height:1.6;padding:4px 0}
  table.verdict td .mk{margin-right:5px}
  .verdict-wrap{padding:0}
  table.verdict caption{padding:14px 14px 12px}

  /* 方案卡与 CTA 卡：手机上正文收一档 */
  .sol-card{padding:20px 16px}
  .sol-card h3{font-size:17px}
  .sol-card li{font-size:13.5px}
  .hook{padding:18px 16px}
  .hook h4{font-size:15.5px}
  .insight-quote{font-size:21px}
  .pain-list li{font-size:14px;padding:11px 16px}
  .faq-list details{padding:14px 0}
  .about-grid{gap:18px}
}