{% extends "website/base.html" %}
{% block title %}{{ page_title }} · {{ site_name }}{% endblock %}
{% block description %}{{ page_desc }}{% endblock %}
{% block keywords %}{{ industry }}进销存,{{ industry }}经销商软件,批次效期,多单位换算,经销商SaaS{% endblock %}

{% block content %}

<div class="hero" style="padding: 46px 0 30px">
  <div class="wrap">
    <span class="badge">{{ industry }}行业方案</span>
    <h1 style="font-size: 33px">{{ page_title }}</h1>
    <p class="lead">{{ page_desc }}</p>
    <div class="hero-actions">
      <a class="btn btn-primary btn-lg" href="{{ demo_url }}">🎬 用演示账套试一下</a>
      <a class="btn btn-ghost btn-lg" href="/site/pricing/">查看价格</a>
    </div>
  </div>
</div>

<section>
  <div class="wrap">
    <h2 class="section-title">这个行业最痛的三个问题</h2>
    <p class="section-sub">都是我们在实际经销商现场反复听到的。</p>
    {% for title, desc in pain_points %}
    <div class="pain"><strong>{{ title }}</strong><span>{{ desc }}</span></div>
    {% endfor %}
  </div>
</section>

<section class="alt">
  <div class="wrap">
    <h2 class="section-title">dealerhub 怎么解决</h2>
    <p class="section-sub">下方每条都对应系统里已经能点的功能，不是 ppt。</p>
    {% for title, desc in solutions %}
    <div class="sol"><strong>{{ title }}</strong><span>{{ desc }}</span></div>
    {% endfor %}
  </div>
</section>

<section>
  <div class="wrap">
    <h2 class="section-title">价格</h2>
    <p class="section-sub">{{ industry }}行业通常从基础版起步即可（¥998/月）；多仓多业务员选专业版。</p>
    <div class="grid grid-3">
      {% for p in plans %}
      <div class="price-card {% if p.code == 'basic' %}featured{% endif %}">
        <div class="price-name">{{ p.name }}</div>
        <div class="price-value">¥{{ p.price_monthly|floatformat:0 }}<span class="unit"> / 月</span></div>
        <div class="price-desc">{{ p.description }}</div>
        <a class="btn btn-primary" style="width: 100%; text-align: center" href="/site/pricing/">看详情</a>
      </div>
      {% endfor %}
    </div>
  </div>
</section>

{% endblock %}