<?php
/**
 * CloudForge Theme - Services Page
 */
$pageDescription = '服务内容 - ' . SITE_NAME;
$breadcrumbItems = [['title' => '服务内容']];
?>
<?php echo breadcrumb($breadcrumbItems); ?>

<div class="main-content">
    <div class="container">
        <div class="section-header section-header--center">
            <span class="section-label">// SERVICES</span>
            <h2 class="section-title">我们的服务</h2>
            <p class="section-subtitle"><?php echo SITE_NAME; ?> 提供全方位互联网服务，助力企业数字化转型</p>
        </div>

        <div class="service-grid">
            <div class="service-card">
                <div class="service-number">01</div>
                <h3 class="service-title">网站建设</h3>
                <p class="service-desc">专业团队提供企业官网、商城、小程序等全方位网站建设服务</p>
                <ul class="service-features">
                    <li>响应式设计</li><li>SEO优化</li><li>高性能架构</li>
                </ul>
            </div>
            <div class="service-card">
                <div class="service-number">02</div>
                <h3 class="service-title">SEO优化</h3>
                <p class="service-desc">通过搜索引擎优化提升网站排名，获取更多精准流量</p>
                <ul class="service-features">
                    <li>关键词优化</li><li>内容优化</li><li>外链建设</li>
                </ul>
            </div>
            <div class="service-card">
                <div class="service-number">03</div>
                <h3 class="service-title">网络推广</h3>
                <p class="service-desc">多渠道网络推广方案，提升品牌知名度和转化率</p>
                <ul class="service-features">
                    <li>社交媒体</li><li>信息流广告</li><li>内容营销</li>
                </ul>
            </div>
            <div class="service-card">
                <div class="service-number">04</div>
                <h3 class="service-title">微信运营</h3>
                <p class="service-desc">微信公众号、小程序开发和运营，助力企业移动端营销</p>
                <ul class="service-features">
                    <li>公众号开发</li><li>小程序开发</li><li>内容运营</li>
                </ul>
            </div>
            <div class="service-card">
                <div class="service-number">05</div>
                <h3 class="service-title">数据分析</h3>
                <p class="service-desc">专业数据分析服务，帮助企业做出数据驱动的决策</p>
                <ul class="service-features">
                    <li>流量分析</li><li>用户画像</li><li>转化分析</li>
                </ul>
            </div>
            <div class="service-card">
                <div class="service-number">06</div>
                <h3 class="service-title">技术支持</h3>
                <p class="service-desc">7x24小时技术支持服务，保障网站稳定运行</p>
                <ul class="service-features">
                    <li>服务器运维</li><li>安全防护</li><li>数据备份</li>
                </ul>
            </div>
        </div>

        <!-- Process -->
        <div class="process-section">
            <div class="section-header section-header--center">
                <span class="section-label">// PROCESS</span>
                <h3 class="section-title">服务流程</h3>
            </div>
            <div class="process-steps">
                <?php $steps = ['需求沟通', '方案设计', '开发实施', '测试上线', '售后支持']; ?>
                <?php foreach ($steps as $i => $step): ?>
                <div class="process-step">
                    <div class="process-step-num"><?php echo sprintf('%02d', $i + 1); ?></div>
                    <div class="process-step-name"><?php echo $step; ?></div>
                    <?php if ($i < count($steps) - 1): ?>
                    <div class="process-step-line"></div>
                    <?php endif; ?>
                </div>
                <?php endforeach; ?>
            </div>
        </div>

        <!-- CTA -->
        <div class="cta-box">
            <h3>需要我们的服务？</h3>
            <p>请联系我们，获取专属解决方案</p>
            <a href="<?php echo cms_url('contact'); ?>" class="btn btn--primary btn--lg">
                <span>立即咨询</span>
                <svg width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M3 8h10M9 4l4 4-4 4" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg>
            </a>
        </div>
    </div>
</div>
