186 lines
8.8 KiB
HTML
186 lines
8.8 KiB
HTML
{# 营销官网基础模板（批次 C3）：单文件内联样式，无外部依赖，Lighthouse 友好 #}
|
|
<!DOCTYPE html>
|
|
<html lang="zh-CN">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<title>{% block title %}{{ site_name }} · {{ tagline }}{% endblock %}</title>
|
|
<meta name="description" content="{% block description %}{{ tagline }}：进销存、批次效期、总账核算、AI 应收风控一体化 SaaS。{% endblock %}">
|
|
<meta name="keywords" content="{% block keywords %}经销商进销存,进销存SaaS,批次效期管理,FEFO,AI开单,应收风控,管家婆替代{% endblock %}">
|
|
<meta property="og:title" content="{% block og_title %}{{ site_name }}{% endblock %}">
|
|
<meta property="og:description" content="{% block og_desc %}{{ tagline }}{% endblock %}">
|
|
<meta property="og:type" content="website">
|
|
<link rel="canonical" href="{% block canonical %}/{% endblock %}">
|
|
<script type="application/ld+json">
|
|
{
|
|
"@context": "https://schema.org",
|
|
"@type": "SoftwareApplication",
|
|
"name": "{{ site_name }}",
|
|
"applicationCategory": "BusinessApplication",
|
|
"operatingSystem": "Web",
|
|
"description": "{% block ld_desc %}{{ tagline }}{% endblock %}",
|
|
"offers": [
|
|
{% for p in plans %}{"@type": "Offer", "name": "{{ p.name }}", "price": "{{ p.price_monthly|floatformat:0 }}", "priceCurrency": "CNY"}{% if not forloop.last %},{% endif %}{% endfor %}
|
|
]
|
|
}
|
|
</script>
|
|
<style>
|
|
:root {
|
|
--brand: #1d4ed8; --brand-dark: #1e3a8a; --ink: #0f172a; --muted: #64748b;
|
|
--line: #e2e8f0; --bg: #f8fafc; --ok: #16a34a; --warn: #d97706; --danger: #dc2626;
|
|
}
|
|
* { box-sizing: border-box; }
|
|
body {
|
|
margin: 0; color: var(--ink); background: #fff;
|
|
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Microsoft YaHei", sans-serif;
|
|
line-height: 1.65; -webkit-font-smoothing: antialiased;
|
|
}
|
|
a { color: var(--brand); text-decoration: none; }
|
|
.wrap { max-width: 1080px; margin: 0 auto; padding: 0 20px; }
|
|
|
|
header.nav {
|
|
position: sticky; top: 0; z-index: 10; background: rgba(255,255,255,.96);
|
|
backdrop-filter: blur(8px); border-bottom: 1px solid var(--line);
|
|
}
|
|
.nav-inner { display: flex; align-items: center; justify-content: space-between; height: 62px; }
|
|
.logo { font-weight: 800; font-size: 19px; color: var(--brand-dark); letter-spacing: .3px; }
|
|
.nav-links { display: flex; gap: 22px; align-items: center; font-size: 14px; }
|
|
.nav-links a { color: #334155; }
|
|
.nav-links a:hover { color: var(--brand); }
|
|
.btn {
|
|
display: inline-block; padding: 10px 20px; border-radius: 8px; font-weight: 600;
|
|
font-size: 14px; border: 1px solid transparent; cursor: pointer; transition: .15s;
|
|
}
|
|
.btn-primary { background: var(--brand); color: #fff !important; }
|
|
.btn-primary:hover { background: var(--brand-dark); }
|
|
.btn-ghost { border-color: var(--line); color: #334155 !important; background: #fff; }
|
|
.btn-ghost:hover { border-color: var(--brand); color: var(--brand) !important; }
|
|
.btn-lg { padding: 14px 30px; font-size: 16px; }
|
|
|
|
.hero { padding: 62px 0 48px; background: linear-gradient(180deg, #f8fafc 0%, #fff 100%); }
|
|
.hero h1 { font-size: 38px; line-height: 1.25; margin: 0 0 16px; letter-spacing: -.5px; }
|
|
.hero h1 .hl { color: var(--brand); }
|
|
.hero p.lead { font-size: 17px; color: var(--muted); max-width: 660px; margin: 0 0 26px; }
|
|
.hero-actions { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; }
|
|
.hero-note { color: var(--muted); font-size: 13px; }
|
|
|
|
section { padding: 54px 0; }
|
|
section.alt { background: var(--bg); }
|
|
h2.section-title { font-size: 26px; margin: 0 0 8px; letter-spacing: -.3px; }
|
|
p.section-sub { color: var(--muted); margin: 0 0 30px; font-size: 15px; }
|
|
|
|
.grid { display: grid; gap: 18px; }
|
|
.grid-3 { grid-template-columns: repeat(3, 1fr); }
|
|
.grid-2 { grid-template-columns: repeat(2, 1fr); }
|
|
.card {
|
|
border: 1px solid var(--line); border-radius: 12px; padding: 22px;
|
|
background: #fff; height: 100%;
|
|
}
|
|
.card .icon { font-size: 26px; margin-bottom: 10px; }
|
|
.card h3 { margin: 0 0 8px; font-size: 17px; }
|
|
.card p { margin: 0; color: var(--muted); font-size: 14px; }
|
|
.card.ai { border-color: #bfdbfe; background: #f0f7ff; }
|
|
.card.ai.hot { border-color: #fca5a5; background: #fff5f5; }
|
|
.badge {
|
|
display: inline-block; font-size: 11px; font-weight: 700; padding: 2px 8px;
|
|
border-radius: 999px; background: var(--brand); color: #fff; margin-bottom: 8px;
|
|
}
|
|
.badge.hot { background: var(--danger); }
|
|
|
|
.roles { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
|
|
.role { padding: 18px; border-left: 3px solid var(--brand); background: #fff;
|
|
border-radius: 0 10px 10px 0; border-top: 1px solid var(--line);
|
|
border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
|
|
.role h4 { margin: 0 0 6px; font-size: 15px; }
|
|
.role .tags { font-size: 12px; color: var(--brand); margin-bottom: 8px; }
|
|
.role p { margin: 0; font-size: 13px; color: var(--muted); }
|
|
|
|
table.compare { width: 100%; border-collapse: collapse; background: #fff; font-size: 14px; }
|
|
table.compare th, table.compare td { border: 1px solid var(--line); padding: 11px 14px; }
|
|
table.compare th { background: #f1f5f9; font-weight: 600; text-align: left; }
|
|
table.compare td.num { text-align: center; }
|
|
table.compare tr.hl td { background: #fffbeb; }
|
|
|
|
.price-card { border: 2px solid var(--line); border-radius: 14px; padding: 26px; background: #fff; }
|
|
.price-card.featured { border-color: var(--brand); box-shadow: 0 8px 28px rgba(29,78,216,.12); }
|
|
.price-name { font-size: 18px; font-weight: 700; }
|
|
.price-value { font-size: 34px; font-weight: 800; color: var(--brand-dark); margin: 8px 0 4px; }
|
|
.price-value .unit { font-size: 14px; font-weight: 500; color: var(--muted); }
|
|
.price-desc { color: var(--muted); font-size: 13px; min-height: 40px; }
|
|
.price-card ul { list-style: none; padding: 0; margin: 16px 0; font-size: 13.5px; }
|
|
.price-card ul li { padding: 4px 0; color: #334155; }
|
|
.price-card ul li::before { content: "✓ "; color: var(--ok); font-weight: 700; }
|
|
|
|
.pain { border-left: 3px solid var(--danger); background: #fff5f5; padding: 14px 18px;
|
|
border-radius: 0 8px 8px 0; margin-bottom: 12px; }
|
|
.pain strong { display: block; margin-bottom: 4px; }
|
|
.pain span { color: var(--muted); font-size: 13.5px; }
|
|
.sol { border-left: 3px solid var(--ok); background: #f0fdf4; padding: 14px 18px;
|
|
border-radius: 0 8px 8px 0; margin-bottom: 12px; }
|
|
.sol strong { display: block; margin-bottom: 4px; }
|
|
.sol span { color: var(--muted); font-size: 13.5px; }
|
|
|
|
.cta { text-align: center; padding: 56px 0; background: var(--brand-dark); color: #fff; }
|
|
.cta h2 { font-size: 27px; margin: 0 0 12px; }
|
|
.cta p { color: #cbd5e1; margin: 0 0 24px; }
|
|
.cta .btn-primary { background: #fff; color: var(--brand-dark) !important; }
|
|
.cta .btn-ghost { border-color: rgba(255,255,255,.4); color: #fff !important; background: transparent; }
|
|
.cta .btn-ghost:hover { background: rgba(255,255,255,.1); }
|
|
|
|
footer { padding: 32px 0; border-top: 1px solid var(--line); color: var(--muted); font-size: 13px; }
|
|
footer .foot-links { display: flex; gap: 18px; flex-wrap: wrap; margin-bottom: 10px; }
|
|
|
|
@media (max-width: 860px) {
|
|
.grid-3, .roles { grid-template-columns: 1fr; }
|
|
.grid-2 { grid-template-columns: 1fr; }
|
|
.hero h1 { font-size: 28px; }
|
|
.nav-links { gap: 14px; font-size: 13px; }
|
|
.nav-links a.hide-sm { display: none; }
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
|
|
<header class="nav">
|
|
<div class="wrap nav-inner">
|
|
<a class="logo" href="/site/">dealerhub</a>
|
|
<nav class="nav-links">
|
|
<a href="/site/pricing/">价格</a>
|
|
<a class="hide-sm" href="/site/industry/food/">食品</a>
|
|
<a class="hide-sm" href="/site/industry/hardware/">五金</a>
|
|
<a class="hide-sm" href="/site/industry/autoparts/">汽配</a>
|
|
<a class="btn btn-primary" href="{{ demo_url }}">免费试用</a>
|
|
</nav>
|
|
</div>
|
|
</header>
|
|
|
|
{% block content %}{% endblock %}
|
|
|
|
<section class="cta">
|
|
<div class="wrap">
|
|
<h2>先试用，再决定</h2>
|
|
<p>免注册进入演示账套（食品经销商真实数据），或注册免费版自己录一单试试。</p>
|
|
<div class="hero-actions" style="justify-content: center">
|
|
<a class="btn btn-primary btn-lg" href="{{ demo_url }}">🎬 免注册体验</a>
|
|
<a class="btn btn-ghost btn-lg" href="/site/pricing/">查看价格</a>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<footer>
|
|
<div class="wrap">
|
|
<div class="foot-links">
|
|
<a href="/site/">首页</a>
|
|
<a href="/site/pricing/">价格</a>
|
|
<a href="/site/industry/food/">食品行业</a>
|
|
<a href="/site/industry/hardware/">五金行业</a>
|
|
<a href="/site/industry/autoparts/">汽配行业</a>
|
|
<a href="{{ app_url }}">登录系统</a>
|
|
</div>
|
|
<div>© 2026 dealerhub 经销商中枢 · {{ tagline }}</div>
|
|
</div>
|
|
</footer>
|
|
|
|
</body>
|
|
</html>
|