Files
qianshi/ai-customer-service.html
T
qianqiuwanzi fad26b0bd1 Initial commit: add qianshi site source files
Sync the local qianshi web project (HTML pages, assets, and config)

Co-Authored-By: Claude Code <noreply@anthropic.com>
2026-09-15 17:52:05 +08:00

324 lines
20 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>AI客服 — 千视科技</title>
<meta name="description" content="7×24小时在线的智能客服,秒级响应、精准解答、自动识别商机">
<link rel="stylesheet" href="/fontawesome/css/all.min.css">
<style>
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
--primary:#0039C8; --primary-dark:#002a94; --primary-light:#4d6be0;
--green:#00c857; --purple:#8762ff; --red:#e5484d;
--bg:#fff; --bg-alt:#f7f8fc; --bg-gray:#f2f3f5; --bg-dark:#0d1b3e;
--text:#333; --text-dim:#666; --text-light:#999; --border:#e5e8ef;
--radius:10px; --radius-lg:16px;
}
html{scroll-behavior:smooth}
body{font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;color:var(--text);line-height:1.7;background:var(--bg);padding-top:70px;overflow-x:hidden}
.container{max-width:1200px;margin:0 auto;padding:0 24px}
/* ===== 导航 ===== */
.nav{position:fixed;top:0;left:0;right:0;z-index:1000;background:rgba(255,255,255,.97);backdrop-filter:blur(12px);border-bottom:1px solid var(--border);height:70px;box-shadow:0 1px 6px rgba(0,0,0,.04)}
.nav-inner{display:flex;align-items:center;justify-content:space-between;height:100%}
.nav-logo{font-size:1.3rem;font-weight:800;color:var(--primary);text-decoration:none;letter-spacing:.5px}
.nav-links{display:flex;list-style:none;align-items:center;height:100%}
.nav-links>li{position:relative;height:100%}
.nav-links>li>a{display:flex;align-items:center;height:100%;padding:0 14px;color:var(--text);text-decoration:none;font-size:.9rem;transition:color .2s;white-space:nowrap}
.nav-links>li>a:hover,.nav-links>li:hover>a{color:var(--primary)}
.nav-links>li.has-sub::after{content:'▾';font-size:.7rem;color:var(--text-dim);margin-left:-6px}
.sub-menu{position:absolute;top:100%;left:0;min-width:200px;background:#fff;border:1px solid var(--border);border-radius:0 0 8px 8px;box-shadow:0 8px 24px rgba(0,0,0,.08);display:none;list-style:none;padding:8px 0;z-index:100}
.nav-links>li:hover .sub-menu{display:block}
.sub-menu a{display:block;padding:9px 18px;color:var(--text);text-decoration:none;font-size:.85rem;transition:all .2s}
.sub-menu a:hover{color:var(--primary);background:var(--bg-alt);padding-left:22px}
.nav-right{display:flex;align-items:center;gap:14px}
.nav-tel{color:var(--primary);font-weight:600;font-size:.9rem}
.lang-toggle{cursor:pointer;font-size:.85rem;transition:opacity .2s}
.menu-btn{display:none;background:none;border:none;font-size:1.5rem;cursor:pointer;color:var(--text)}
/* ===== 侧边栏 ===== */
.sidebar{position:fixed;right:0;top:50%;transform:translateY(-50%);z-index:999;display:flex;flex-direction:column;gap:2px}
.sidebar a{display:flex;align-items:center;justify-content:center;width:46px;height:56px;background:var(--primary);color:#fff;text-decoration:none;font-size:.72rem;writing-mode:vertical-rl;letter-spacing:2px;transition:background .2s;border-radius:4px 0 0 4px}
.sidebar a:hover{background:var(--primary-dark)}
/* ===== Hero ===== */
.hero{padding:120px 0 80px;background:linear-gradient(135deg,#f0f4ff 0%,#e8eefc 50%,#f5f3ff 100%);text-align:center;position:relative;overflow:hidden}
.hero::before{content:'';position:absolute;top:-250px;left:50%;transform:translateX(-50%);width:800px;height:800px;background:radial-gradient(circle,rgba(0,57,200,.08) 0%,transparent 70%);pointer-events:none}
.hero h1{font-size:clamp(2rem,4.5vw,3rem);font-weight:800;line-height:1.3;margin-bottom:16px;color:var(--text);position:relative}
.hero h1 span{background:linear-gradient(135deg,var(--primary),var(--purple));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.hero p{font-size:1.1rem;color:var(--text-dim);max-width:700px;margin:0 auto 40px;position:relative}
.hero-btns{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;position:relative}
/* ===== 按钮 ===== */
.btn{padding:13px 32px;border-radius:var(--radius);font-size:.95rem;font-weight:600;text-decoration:none;display:inline-block;transition:all .3s;border:none;cursor:pointer}
.btn-primary{background:var(--primary);color:#fff;box-shadow:0 4px 18px rgba(0,57,200,.25)}
.btn-primary:hover{background:var(--primary-dark);transform:translateY(-1px);box-shadow:0 6px 22px rgba(0,57,200,.35)}
.btn-outline{border:2px solid var(--primary);color:var(--primary);background:transparent}
.btn-outline:hover{background:var(--primary);color:#fff}
.btn-green{background:var(--green);color:#fff}
.btn-green:hover{opacity:.9;transform:translateY(-1px)}
/* ===== 区块 ===== */
.section{padding:80px 0}
.section-header{text-align:center;margin-bottom:50px}
.section-header h2{font-size:1.9rem;font-weight:700;margin-bottom:12px;color:var(--text)}
.section-header p{color:var(--text-dim);font-size:1rem;max-width:640px;margin:0 auto}
.section-gray{background:var(--bg-alt)}
.section-dark{background:var(--bg-dark);color:#fff}
.section-dark .section-header h2{color:#fff}
.section-dark .section-header p{color:#b8c2e0}
/* ===== 卡片网格 ===== */
.grid{display:grid;gap:20px}
.grid-2{grid-template-columns:repeat(2,1fr)}
.grid-3{grid-template-columns:repeat(3,1fr)}
.grid-4{grid-template-columns:repeat(4,1fr)}
.card{background:#fff;border:1px solid var(--border);border-radius:var(--radius-lg);padding:30px 26px;transition:all .3s;text-decoration:none;color:inherit;display:block}
.card:hover{transform:translateY(-4px);box-shadow:0 12px 40px rgba(0,0,0,.08);border-color:var(--primary-light)}
.card .icon{width:52px;height:52px;border-radius:12px;background:linear-gradient(135deg,rgba(0,57,200,.08),rgba(135,98,255,.1));display:flex;align-items:center;justify-content:center;margin-bottom:16px}
.card .icon i{font-size:1.5rem;color:var(--primary)}
.card h4{font-size:1.05rem;margin-bottom:10px;color:var(--text)}
.card p{color:var(--text-dim);font-size:.88rem;line-height:1.7}
.card .tag{display:inline-block;margin-top:10px;font-size:.75rem;color:var(--primary);font-weight:600}
/* ===== 统计条 ===== */
.stats{background:var(--primary);color:#fff;padding:55px 0}
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:30px;text-align:center}
.stat-num{font-size:2.6rem;font-weight:800}
.stat-label{font-size:.9rem;opacity:.85;margin-top:6px}
/* ===== 页脚 ===== */
.footer{background:var(--bg-dark);color:#fff;padding:60px 0 30px}
.footer-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:30px;margin-bottom:40px}
.footer-col h5{font-size:.95rem;margin-bottom:16px;color:#fff}
.footer-col a{display:block;color:#a8b3d4;text-decoration:none;font-size:.85rem;line-height:2.2;transition:color .2s}
.footer-col a:hover{color:#fff}
.footer-bottom{border-top:1px solid rgba(255,255,255,.1);padding-top:24px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;font-size:.85rem;color:#a8b3d4}
.footer-bottom a{color:#a8b3d4}
.footer-links{display:flex;gap:16px;flex-wrap:wrap;list-style:none}
.footer-links a{color:#a8b3d4;text-decoration:none;font-size:.82rem}
/* ===== 通用子页面 ===== */
.page-hero{padding:80px 0 50px;background:linear-gradient(135deg,#f0f4ff 0%,#e8eefc 50%,#f5f3ff 100%);text-align:center}
.page-hero h1{font-size:clamp(1.8rem,3.5vw,2.5rem);font-weight:800;color:var(--text)}
.page-hero p{color:var(--text-dim);margin-top:10px;font-size:1.05rem;max-width:700px;margin-left:auto;margin-right:auto}
/* ===== 响应式 ===== */
@media(max-width:1024px){.footer-grid{grid-template-columns:repeat(3,1fr)}.grid-4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:768px){
.nav-links{display:none}.nav-right{display:none}.menu-btn{display:block}
.sub-menu{position:static;display:none}
.nav-links.open{display:flex;flex-direction:column;position:absolute;top:70px;left:0;right:0;background:#fff;padding:10px 24px;border-bottom:1px solid var(--border);height:auto;gap:0}
.nav-links.open>li{height:auto}
.nav-links.open>li>a{height:44px;padding:0}
.nav-links.open .sub-menu{position:static;display:none;box-shadow:none;border:none;padding-left:16px}
.nav-links.open>li.open .sub-menu{display:block}
.hero{padding:100px 0 50px}
.hero h1{font-size:1.6rem}
.section{padding:55px 0}
.grid-2,.grid-3{grid-template-columns:1fr}
.stats-grid{grid-template-columns:repeat(2,1fr)}
.footer-grid{grid-template-columns:repeat(2,1fr)}
.sidebar{display:none}
}
@media(max-width:480px){.stats-grid,.footer-grid{grid-template-columns:1fr}}
</style>
</head>
<body>
<nav class="nav">
<div class="container nav-inner">
<a href="/" class="nav-logo" data-zh="千视科技" data-en="Qianshi Tech">千视科技</a>
<ul class="nav-links" id="navLinks">
<li><a href="/" data-zh="首页" data-en="Home">首页</a></li>
<li class="has-sub">
<a href="/enterprise-agent.html" data-zh="企业智能体" data-en="Enterprise AI">企业智能体</a>
<ul class="sub-menu">
<li><a href="/rag-kb.html" data-zh="RAG企业知识库" data-en="RAG Knowledge Base">RAG企业知识库</a></li>
<li><a href="/ai-private-expert.html" data-zh="AI私有专家" data-en="AI Private Expert">AI私有专家</a></li>
<li><a href="/ai-customer-service.html" data-zh="AI客服" data-en="AI Customer Service">AI客服</a></li>
<li><a href="/digital-human.html" data-zh="数字人/视频复刻/IP" data-en="Digital Human/Video/IP">数字人/视频复刻/IP</a></li>
<li><a href="/opc-solution.html" data-zh="OPC一人公司" data-en="OPC One-Person Biz">OPC一人公司</a></li>
</ul>
</li>
<li class="has-sub">
<a href="/ai-acquisition.html" data-zh="AI拓客" data-en="AI Prospecting">AI拓客</a>
<ul class="sub-menu">
<li><a href="/superlink.html" data-zh="Superlink" data-en="Superlink">Superlink</a></li>
<li><a href="/edm-email.html" data-zh="EDM邮件" data-en="EDM Email">EDM邮件</a></li>
</ul>
</li>
<li class="has-sub">
<a href="/ai-promotion.html" data-zh="AI推广" data-en="AI Promotion">AI推广</a>
<ul class="sub-menu">
<li><a href="/media-ops.html" data-zh="自媒体代运营" data-en="Social Media Ops">自媒体代运营</a></li>
<li><a href="/geo-seo-sem.html" data-zh="GEO/SEO/SEM" data-en="GEO/SEO/SEM">GEO/SEO/SEM</a></li>
<li><a href="/website-building.html" data-zh="建站" data-en="Website Building">建站</a></li>
<li><a href="/sentiment-management.html" data-zh="舆情管理" data-en="Sentiment Mgmt">舆情管理</a></li>
</ul>
</li>
<li><a href="/software.html" data-zh="软件定制" data-en="Custom Software">软件定制</a></li>
<li><a href="/cases.html" data-zh="客户案例" data-en="Cases">客户案例</a></li>
<li class="has-sub">
<a href="/blog.html" data-zh="博客" data-en="Blog">博客</a>
<ul class="sub-menu">
<li><a href="/marketing-resources.html" data-zh="营销资料中心" data-en="Marketing Resources">营销资料中心</a></li>
<li><a href="/forum.html" data-zh="论坛" data-en="Forum">论坛</a></li>
</ul>
</li>
<li class="has-sub">
<a href="/about.html" data-zh="关于我们" data-en="About Us">关于我们</a>
<ul class="sub-menu">
<li><a href="/company.html" data-zh="公司介绍" data-en="Company">公司介绍</a></li>
<li><a href="/news.html" data-zh="新闻中心" data-en="News">新闻中心</a></li>
<li><a href="/join.html" data-zh="加入我们" data-en="Careers">加入我们</a></li>
<li><a href="/contact.html" data-zh="联系我们" data-en="Contact">联系我们</a></li>
</ul>
</li>
</ul>
<div class="nav-right">
<span style="display:flex;gap:6px;align-items:center;color:var(--text-dim)">
<span onclick="setLang('zh')" class="lang-toggle active" data-lang="zh">中文</span><span style="color:#ccc">|</span>
<span onclick="setLang('en')" class="lang-toggle" data-lang="en" style="opacity:.5">EN</span>
</span>
<span class="nav-tel">18948732299</span>
</div>
<button class="menu-btn" id="menuBtn">☰</button>
</div>
</nav>
<div class="sidebar">
<a href="/contact.html" data-zh="联系我们" data-en="Contact">联系我们</a>
<a href="/company.html" data-zh="公司介绍" data-en="About">公司介绍</a>
<a href="/contact.html" data-zh="预约咨询" data-en="Consult">预约咨询</a>
<a href="#top" data-zh="返回顶部" data-en="Top">返回顶部</a>
</div>
<div class="page-hero" id="top">
<div class="container">
<h1 data-zh="AI客服" data-en="AI Customer Service">AI客服</h1>
<p data-zh="7×24小时在线的智能客服,秒级响应、精准解答、自动识别商机" data-en="24/7 intelligent customer service with instant responses, precise answers and automatic lead detection.">7×24小时在线的智能客服,秒级响应、精准解答、自动识别商机</p>
</div>
</div>
<section class="section">
<div class="container">
<div class="section-header">
<h2 data-zh="核心能力" data-en="Core Capabilities">核心能力</h2>
</div>
<div class="grid grid-2"><div class="card"><span class="icon"><i class="fa-solid fa-robot"></i></span>
<h4 data-zh="智能问答" data-en="Smart Q&A">智能问答</h4>
<p data-zh="基于知识库的精准问答,覆盖FAQ、产品咨询、售后问题,应答率90%+。" data-en="KB-powered answers covering FAQs, product queries and after-sales, 90%+ resolution rate.">基于知识库的精准问答,覆盖FAQ、产品咨询、售后问题,应答率90%+。</p></div><div class="card"><span class="icon"><i class="fa-solid fa-clock"></i></span>
<h4 data-zh="7×24在线" data-en="24/7 Online">7×24在线</h4>
<p data-zh="全天候自动响应,夜间和节假日也能即时接待,零等待。" data-en="Round-the-clock auto-response, even nights and holidays — zero wait time.">全天候自动响应,夜间和节假日也能即时接待,零等待。</p></div><div class="card"><span class="icon"><i class="fa-solid fa-lightbulb"></i></span>
<h4 data-zh="商机识别" data-en="Lead Detection">商机识别</h4>
<p data-zh="智能识别咨询中的购买意图,自动标记商机并推送销售跟进。" data-en="Detects purchase intent in conversations, flags leads and pushes them to sales.">智能识别咨询中的购买意图,自动标记商机并推送销售跟进。</p></div><div class="card"><span class="icon"><i class="fa-solid fa-mobile-screen"></i></span>
<h4 data-zh="多端接入" data-en="Multi-channel">多端接入</h4>
<p data-zh="官网/微信/抖音/电话全渠道接入,一个AI客服统一接待。" data-en="One AI agent across website, WeChat, Douyin and phone — unified service.">官网/微信/抖音/电话全渠道接入,一个AI客服统一接待。</p></div></div>
</div>
</section>
<section class="section section-gray">
<div class="container">
<div class="section-header">
<h2 data-zh="客户案例" data-en="Client Case">客户案例</h2>
</div>
<div class="card" style="max-width:800px;margin:0 auto;text-align:center">
<p style="font-size:1rem;color:var(--text);line-height:1.8" data-zh="某消费品牌接入AI客服后,FAQ自动应答率92%,日均处理300+条咨询,人力成本降65%。" data-en="A consumer brand achieved 92% FAQ auto-resolution, 300+ daily inquiries handled, 65% labor cost cut.">某消费品牌接入AI客服后,FAQ自动应答率92%,日均处理300+条咨询,人力成本降65%。</p>
<a href="/cases.html" class="btn btn-outline" style="margin-top:20px" data-zh="查看全部案例" data-en="View All Cases">查看全部案例</a>
</div>
</div>
</section>
<section class="section" style="text-align:center">
<div class="container">
<h2 style="font-size:1.6rem;margin-bottom:14px" data-zh="需要这项服务?" data-en="Need this service?">需要这项服务?</h2>
<p style="color:var(--text-dim);margin-bottom:26px" data-zh="联系我们,获取专属解决方案" data-en="Contact us for a tailored solution">联系我们,获取专属解决方案</p>
<div style="display:flex;gap:14px;justify-content:center;flex-wrap:wrap">
<a href="/contact.html" class="btn btn-primary" data-zh="立即咨询" data-en="Contact Now">立即咨询</a>
<a href="/cases.html" class="btn btn-outline" data-zh="查看案例" data-en="View Cases">查看案例</a>
</div>
</div>
</section>
<footer class="footer">
<div class="container">
<div class="footer-grid">
<div class="footer-col">
<h5 data-zh="企业智能体" data-en="Enterprise AI">企业智能体</h5>
<a href="/rag-kb.html" data-zh="RAG企业知识库" data-en="RAG Knowledge Base">RAG企业知识库</a>
<a href="/ai-private-expert.html" data-zh="AI私有专家" data-en="AI Private Expert">AI私有专家</a>
<a href="/ai-customer-service.html" data-zh="AI客服" data-en="AI Customer Service">AI客服</a>
<a href="/digital-human.html" data-zh="数字人/视频复刻/IP" data-en="Digital Human/Video/IP">数字人/视频复刻/IP</a>
<a href="/opc-solution.html" data-zh="OPC一人公司" data-en="OPC One-Person Biz">OPC一人公司</a>
</div>
<div class="footer-col">
<h5 data-zh="AI拓客" data-en="AI Prospecting">AI拓客</h5>
<a href="/superlink.html" data-zh="Superlink" data-en="Superlink">Superlink</a>
<a href="/edm-email.html" data-zh="EDM邮件" data-en="EDM Email">EDM邮件</a>
<h5 style="margin-top:16px" data-zh="AI推广" data-en="AI Promotion">AI推广</h5>
<a href="/media-ops.html" data-zh="自媒体代运营" data-en="Social Media Ops">自媒体代运营</a>
<a href="/geo-seo-sem.html" data-zh="GEO/SEO/SEM" data-en="GEO/SEO/SEM">GEO/SEO/SEM</a>
</div>
<div class="footer-col">
<h5 data-zh="解决方案" data-en="Solutions">解决方案</h5>
<a href="/website-building.html" data-zh="建站" data-en="Website Building">建站</a>
<a href="/sentiment-management.html" data-zh="舆情管理" data-en="Sentiment Mgmt">舆情管理</a>
<a href="/software.html" data-zh="软件定制" data-en="Custom Software">软件定制</a>
<a href="/cases.html" data-zh="客户案例" data-en="Cases">客户案例</a>
</div>
<div class="footer-col">
<h5 data-zh="博客" data-en="Blog">博客</h5>
<a href="/marketing-resources.html" data-zh="营销资料中心" data-en="Marketing Resources">营销资料中心</a>
<a href="/forum.html" data-zh="论坛" data-en="Forum">论坛</a>
<h5 style="margin-top:16px" data-zh="关于我们" data-en="About Us">关于我们</h5>
<a href="/company.html" data-zh="公司介绍" data-en="Company">公司介绍</a>
<a href="/news.html" data-zh="新闻中心" data-en="News">新闻中心</a>
<a href="/join.html" data-zh="加入我们" data-en="Careers">加入我们</a>
<a href="/contact.html" data-zh="联系我们" data-en="Contact">联系我们</a>
</div>
<div class="footer-col">
<h5 data-zh="联系方式" data-en="Contact">联系方式</h5>
<div style="font-size:1.3rem;font-weight:700;color:#fff">18948732299</div>
<div style="margin-top:4px;color:#a8b3d4">105920869@qq.com</div>
<div style="margin-top:12px;font-size:.85rem;color:#a8b3d4" data-zh="地址:深圳" data-en="Addr: Shenzhen">地址:深圳</div>
</div>
</div>
<div class="footer-bottom">
<div>© 2019-2026 千视科技 版权所有 | <a href="https://beian.miit.gov.cn" target="_blank" rel="noopener">粤ICP备2026089876号-1</a></div>
<ul class="footer-links">
<li><a href="#">友情链接</a></li><li><a href="/sitemap.html">网站地图</a></li><li><a href="/privacy.html">隐私政策</a></li>
<li><a href="/legal.html">法律声明</a></li><li><a href="/disclaimer.html">免责声明</a></li><li><a href="/cookie.html">关于Cookie</a></li>
</ul>
</div>
</div>
</footer>
<script>
(function(){
var btn=document.getElementById('menuBtn');
var nav=document.getElementById('navLinks');
if(!btn||!nav)return;
btn.addEventListener('click',function(){
nav.classList.toggle('open');
btn.textContent=nav.classList.contains('open')?'✕':'☰';
});
document.querySelectorAll('.has-sub>a').forEach(function(a){
a.addEventListener('click',function(e){
if(window.innerWidth<=768 && nav.classList.contains('open')){
e.preventDefault();
a.parentElement.classList.toggle('open');
}
});
});
})()
</script>
<script src="/i18n.js"></script>
</body>
</html>