<?php
/**
 * CloudForge Theme - About Us
 * 公司介绍页——故事·使命·历程·团队
 */
$pageDescription = '关于' . SITE_NAME . ' — ' . SITE_SLOGAN;
$breadcrumbItems = [['title' => '关于我们']];
?>
<?php echo breadcrumb($breadcrumbItems); ?>

<div class="main-content">
    <div class="container">

        <!-- ====== HERO ====== -->
    <div style="padding:var(--sp-16) 0 var(--sp-12);text-align:center;">
        <span class="section-label" style="display:inline-block;margin-bottom:var(--sp-4);">// ABOUT</span>
        <h1 class="hero-title" style="margin:0 auto var(--sp-4);text-align:center;max-width:16ch;">
            用技术重新定义<br>企业数字化
        </h1>
        <p class="hero-desc" style="margin:0 auto var(--sp-6);text-align:center;max-width:64ch;">
            <?php echo SITE_NAME; ?> 成立于长沙，专注于为企业提供轻量级、可自建的<br>
            内容管理系统与数字化解决方案，让每一个中小企业都能拥有专业级的网站
        </p>
        <div style="display:flex;flex-wrap:wrap;gap:var(--sp-6);justify-content:center;font-family:var(--font-mono);font-size:var(--fs-xs);color:var(--text-muted);">
            <span>成立 2026</span>
            <span>·</span>
            <span>团队 10+ 人</span>
            <span>·</span>
            <span>服务企业 50+</span>
            <span>·</span>
            <span>长沙 · 中国</span>
        </div>
    </div>

    <!-- ====== 故事 ====== -->
    <div style="display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-10);align-items:center;margin-bottom:var(--sp-12);padding:var(--sp-10) 0;border-top:1px solid var(--border-subtle);border-bottom:1px solid var(--border-subtle);">
        <div>
            <span class="section-label" style="margin-bottom:var(--sp-3);display:block;">// OUR STORY</span>
            <h2 style="font-family:var(--font-display);font-size:var(--fs-2xl);font-weight:700;color:var(--text-primary);margin-bottom:var(--sp-4);letter-spacing:-0.02em;">我们的故事</h2>
            <div style="font-size:var(--fs-base);color:var(--text-secondary);line-height:var(--lh-relaxed);">
                <p style="margin-bottom:var(--sp-4);">
                    <?php echo SITE_NAME; ?> 的诞生源于一个简单的观察：市面上的企业建站方案要么过于昂贵（SaaS年费数千元），
                    要么技术门槛太高（需要专业的开发团队）。中小企业需要的，只是一个「装上去就能用」的网站系统。
                </p>
                <p style="margin-bottom:var(--sp-4);">
                    我们团队来自一线互联网公司，有丰富的Web开发与系统架构经验。我们决定打造一套 
                    <strong style="color:var(--accent);">纯PHP、无框架依赖、自助授权</strong> 的内容管理系统，
                    让任何人都能在 10 分钟内完成部署，一键获得企业级网站的能力。
                </p>
                <p>
                    没有复杂的授权流程，没有隐藏的收费陷阱。你需要的只是一个域名，剩下的交给我们。
                </p>
            </div>
        </div>
        <div style="background:var(--bg-surface-2);border:1px solid var(--border-default);border-radius:var(--r-lg);padding:var(--sp-8);display:flex;flex-direction:column;gap:var(--sp-6);">
            <div style="display:flex;gap:var(--sp-4);align-items:flex-start;">
                <div style="width:4px;height:40px;background:var(--accent);border-radius:var(--r-full);flex-shrink:0;"></div>
                <div>
                    <div style="font-family:var(--font-mono);font-size:var(--fs-xs);color:var(--accent);margin-bottom:var(--sp-1);">VISION</div>
                    <div style="font-size:var(--fs-base);color:var(--text-primary);">让每一家企业都能以最低成本拥有高质量的数字化官网</div>
                </div>
            </div>
            <div style="display:flex;gap:var(--sp-4);align-items:flex-start;">
                <div style="width:4px;height:40px;background:var(--accent);border-radius:var(--r-full);flex-shrink:0;"></div>
                <div>
                    <div style="font-family:var(--font-mono);font-size:var(--fs-xs);color:var(--accent);margin-bottom:var(--sp-1);">MISSION</div>
                    <div style="font-size:var(--fs-base);color:var(--text-primary);">降低企业数字化门槛，提供稳定、安全、易用的自主建站工具</div>
                </div>
            </div>
            <div style="display:flex;gap:var(--sp-4);align-items:flex-start;">
                <div style="width:4px;height:40px;background:var(--accent);border-radius:var(--r-full);flex-shrink:0;"></div>
                <div>
                    <div style="font-family:var(--font-mono);font-size:var(--fs-xs);color:var(--accent);margin-bottom:var(--sp-1);">VALUES</div>
                    <div style="font-size:var(--fs-base);color:var(--text-primary);">极致简单 · 开放透明 · 持续进化 · 客户成功</div>
                </div>
            </div>
        </div>
    </div>

    <!-- ====== 历程 ====== -->
    <div style="margin-bottom:var(--sp-12);">
        <div class="section-header section-header--center">
            <span class="section-label">// TIMELINE</span>
            <h2 class="section-title">发展历程</h2>
        </div>
        <div style="display:flex;justify-content:space-between;gap:var(--sp-4);position:relative;padding:var(--sp-8) 0;">
            <div style="position:absolute;top:50%;left:10%;right:10%;height:1px;background:var(--border-default);z-index:0;"></div>
            <div style="text-align:center;position:relative;z-index:1;flex:1;">
                <div style="width:40px;height:40px;border-radius:50%;background:var(--accent-subtle);border:2px solid var(--accent);display:flex;align-items:center;justify-content:center;margin:0 auto var(--sp-3);font-family:var(--font-mono);font-size:var(--fs-xs);font-weight:700;color:var(--accent);">Q1</div>
                <div style="font-family:var(--font-mono);font-size:var(--fs-xs);color:var(--accent);">2026.01</div>
                <div style="font-size:var(--fs-sm);color:var(--text-primary);font-weight:500;">项目立项</div>
                <div style="font-size:var(--fs-xs);color:var(--text-muted);">完成核心架构设计</div>
            </div>
            <div style="text-align:center;position:relative;z-index:1;flex:1;">
                <div style="width:40px;height:40px;border-radius:50%;background:var(--accent-subtle);border:2px solid var(--accent);display:flex;align-items:center;justify-content:center;margin:0 auto var(--sp-3);font-family:var(--font-mono);font-size:var(--fs-xs);font-weight:700;color:var(--accent);">Q2</div>
                <div style="font-family:var(--font-mono);font-size:var(--fs-xs);color:var(--accent);">2026.03</div>
                <div style="font-size:var(--fs-sm);color:var(--text-primary);font-weight:500;">V1.0 发布</div>
                <div style="font-size:var(--fs-xs);color:var(--text-muted);">文章·产品·案例·表单</div>
            </div>
            <div style="text-align:center;position:relative;z-index:1;flex:1;">
                <div style="width:40px;height:40px;border-radius:50%;background:var(--accent-subtle);border:2px solid var(--accent);display:flex;align-items:center;justify-content:center;margin:0 auto var(--sp-3);font-family:var(--font-mono);font-size:var(--fs-xs);font-weight:700;color:var(--accent);">Q3</div>
                <div style="font-family:var(--font-mono);font-size:var(--fs-xs);color:var(--accent);">2026.06</div>
                <div style="font-size:var(--fs-sm);color:var(--text-primary);font-weight:500;">V2.0 发布</div>
                <div style="font-size:var(--fs-xs);color:var(--text-muted);">多主题·授权·补丁推送</div>
            </div>
            <div style="text-align:center;position:relative;z-index:1;flex:1;">
                <div style="width:40px;height:40px;border-radius:50%;background:var(--accent-subtle);border:2px solid var(--accent);display:flex;align-items:center;justify-content:center;margin:0 auto var(--sp-3);font-family:var(--font-mono);font-size:var(--fs-xs);font-weight:700;color:var(--accent);">Q4</div>
                <div style="font-family:var(--font-mono);font-size:var(--fs-xs);color:var(--text-muted);">2026.09</div>
                <div style="font-size:var(--fs-sm);color:var(--text-muted);font-weight:500;">持续迭代中</div>
                <div style="font-size:var(--fs-xs);color:var(--text-muted);">模板市场·API·更多特性</div>
            </div>
        </div>
    </div>

    <!-- ====== 为什么选择我们 ====== -->
    <div style="margin-bottom:var(--sp-12);padding:var(--sp-10) 0;border-top:1px solid var(--border-subtle);border-bottom:1px solid var(--border-subtle);">
        <div class="section-header section-header--center">
            <span class="section-label">// WHY US</span>
            <h2 class="section-title">为什么选择 <?php echo SITE_NAME; ?></h2>
        </div>
        <div style="display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-6);">
            <div style="background:var(--bg-surface-1);border:1px solid var(--border-default);border-radius:var(--r-md);padding:var(--sp-6);text-align:center;">
                <div style="font-family:var(--font-mono);font-size:var(--fs-3xl);font-weight:700;color:var(--accent);margin-bottom:var(--sp-3);">01</div>
                <h3 style="font-family:var(--font-display);font-weight:600;margin-bottom:var(--sp-2);font-size:var(--fs-lg);">真正自建</h3>
                <p style="font-size:var(--fs-sm);color:var(--text-secondary);line-height:var(--lh-normal);">源码在手，数据自主。不像SaaS平台随时可能涨价或关停，您拥有完全的控制权。</p>
            </div>
            <div style="background:var(--bg-surface-1);border:1px solid var(--border-default);border-radius:var(--r-md);padding:var(--sp-6);text-align:center;">
                <div style="font-family:var(--font-mono);font-size:var(--fs-3xl);font-weight:700;color:var(--accent);margin-bottom:var(--sp-3);">02</div>
                <h3 style="font-family:var(--font-display);font-weight:600;margin-bottom:var(--sp-2);font-size:var(--fs-lg);">零门槛部署</h3>
                <p style="font-size:var(--fs-sm);color:var(--text-secondary);line-height:var(--lh-normal);">仅需 PHP 7.4+ 和 MySQL，兼容绝大多数虚拟主机和云服务器。下载解压即可运行。</p>
            </div>
            <div style="background:var(--bg-surface-1);border:1px solid var(--border-default);border-radius:var(--r-md);padding:var(--sp-6);text-align:center;">
                <div style="font-family:var(--font-mono);font-size:var(--fs-3xl);font-weight:700;color:var(--accent);margin-bottom:var(--sp-3);">03</div>
                <h3 style="font-family:var(--font-display);font-weight:600;margin-bottom:var(--sp-2);font-size:var(--fs-lg);">持续更新</h3>
                <p style="font-size:var(--fs-sm);color:var(--text-secondary);line-height:var(--lh-normal);">活跃的研发团队持续迭代，补丁推送系统确保您的站点始终保持最新最安全。</p>
            </div>
        </div>
    </div>

    <!-- ====== 技术理念 ====== -->
    <div style="margin-bottom:var(--sp-12);">
        <div class="section-header section-header--center">
            <span class="section-label">// PHILOSOPHY</span>
            <h2 class="section-title">我们的技术理念</h2>
        </div>
        <div style="display:grid;grid-template-columns:repeat(2,1fr);gap:var(--sp-6);">
            <div style="background:var(--bg-surface-1);border:1px solid var(--border-default);border-radius:var(--r-md);padding:var(--sp-6);">
                <h3 style="font-family:var(--font-display);font-weight:600;margin-bottom:var(--sp-2);font-size:var(--fs-base);">过程式 · 不 MVC</h3>
                <p style="font-size:var(--fs-sm);color:var(--text-secondary);">我们不追求流行的框架封装，而是坚持轻量过程式架构。每一行代码都清晰可见，没有黑魔法，没有复杂路由。中小型企业网站的复杂度远不到需要 MVC 的程度，简单即是高效。</p>
            </div>
            <div style="background:var(--bg-surface-1);border:1px solid var(--border-default);border-radius:var(--r-md);padding:var(--sp-6);">
                <h3 style="font-family:var(--font-display);font-weight:600;margin-bottom:var(--sp-2);font-size:var(--fs-base);">最小依赖 · 最大兼容</h3>
                <p style="font-size:var(--fs-sm);color:var(--text-secondary);">不依赖 Composer 包管理、不要求 PHP 扩展、不绑定特定服务器环境。无论你用 Nginx 还是 Apache，Linux 还是 Windows，都能稳定运行。兼容 PHP 7.4 到 8.x。</p>
            </div>
            <div style="background:var(--bg-surface-1);border:1px solid var(--border-default);border-radius:var(--r-md);padding:var(--sp-6);">
                <h3 style="font-family:var(--font-display);font-weight:600;margin-bottom:var(--sp-2);font-size:var(--fs-base);">安全内置 · 非附加</h3>
                <p style="font-size:var(--fs-sm);color:var(--text-secondary);">参数化查询、XSS 过滤、CSRF 保护、AES-256 授权加密、HMAC 签名验证——这些安全机制不是插件，而是核心架构的一部分。安全不是功能，是底线。</p>
            </div>
            <div style="background:var(--bg-surface-1);border:1px solid var(--border-default);border-radius:var(--r-md);padding:var(--sp-6);">
                <h3 style="font-family:var(--font-display);font-weight:600;margin-bottom:var(--sp-2);font-size:var(--fs-base);">开箱即用 · 自由扩展</h3>
                <p style="font-size:var(--fs-sm);color:var(--text-secondary);">22 张数据表覆盖企业网站全部核心需求，安装向导一键完成配置。同时模板系统支持完全自定义设计，你可以自由修改每一个页面的呈现方式。</p>
            </div>
        </div>
    </div>

    <!-- ====== CTA ====== -->
    <div class="cta-section" style="text-align:center;padding:var(--sp-12);border-top:1px solid var(--border-subtle);">
        <span class="cta-label">// JOIN US</span>
        <h2 class="cta-title">加入 <?php echo SITE_NAME; ?></h2>
        <p class="cta-desc">
            不论您是寻找建站解决方案的企业，还是对 CMS 开发感兴趣的开发者，<br>
            我们都欢迎您的加入，一起构建更好的数字化未来。
        </p>
        <div style="display:flex;gap:var(--sp-4);justify-content:center;flex-wrap:wrap;">
            <a href="<?php echo cms_url('download'); ?>" class="btn btn--primary btn--lg">
                <svg width="18" height="18" viewBox="0 0 18 18" fill="none"><path d="M9 2v10M4 7l5 5 5-5M2 13v3h14v-3" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg>
                <span>免费下载</span>
            </a>
            <a href="<?php echo cms_url('contact'); ?>" class="btn btn--outline btn--lg">
                <svg width="18" height="18" viewBox="0 0 18 18" fill="none"><path d="M2 4h14v10H2V4z" stroke="currentColor" stroke-width="1.5"/><path d="M2 5l7 5 7-5" stroke="currentColor" stroke-width="1.5" stroke-linejoin="round"/></svg>
                <span>联系我们</span>
            </a>
        </div>
    </div>
</div>

</div>
