@extends('layouts.app')

{{-- 说明：以下文案为示例（以本项目身份「深圳市云创芯电子有限公司 / CloudChip」填充）。
     替换为贵司真实信息即可，公司名同时可在后台 Setting（site_name）或 .env 的 APP_NAME 调整。 --}}

@section('title', '关于我们 - ' . App\Models\Setting::get('site_name', '深圳市云创芯电子有限公司'))
@section('description', '了解深圳市云创芯电子有限公司（TypeC 产品顾问）：专注多口 TypeC 接口 IC 与快充协议芯片的设计、量产与技术支持。')

@section('content')
    {{-- Hero：简约大气，大量留白 + 单一主色 --}}
    <section class="px-4 sm:px-6 lg:px-8 pt-14 lg:pt-20 pb-6">
        <div class="max-w-8xl mx-auto">
            <p class="text-sm font-medium tracking-wide text-primary">关于我们</p>
            <h1 class="mt-3 max-w-3xl text-3xl font-bold leading-tight tracking-tight text-fg sm:text-4xl lg:text-5xl">
                以芯片之力，连接更高效的充电世界
            </h1>
                <p class="mt-5 max-w-2xl text-base text-muted lg:text-lg">
                    深圳市云创芯电子有限公司（TypeC 产品顾问）是一家专注于接口控制与电源管理芯片的半导体方案商，致力于为充电与外设厂商提供稳定、易集成、可量产的芯片与技术服务。
                </p>
        </div>
    </section>

    {{-- 公司简介 --}}
    <section class="px-4 sm:px-6 lg:px-8 py-10">
        <div class="max-w-8xl mx-auto grid gap-10 lg:grid-cols-3">
            <div class="lg:col-span-1">
                <h2 class="text-xl font-bold tracking-tight text-fg">公司简介</h2>
                <p class="mt-3 text-sm text-muted">我们是谁，以及我们坚持的事。</p>
            </div>
            <div class="lg:col-span-2 space-y-4 text-[15px] leading-7 text-fg/90">
                <p>
                    深圳市云创芯电子有限公司（CloudChip）成立于专注电源与接口协议的芯片赛道，核心团队来自芯片设计、协议栈与量产工程领域。我们围绕多口 PD 电源及其信号智能控制、协议转换与同步整流等关键环节，提供从选型、评估到量产导入的全流程支持。
                </p>
                <p>
                    我们相信，一颗好芯片的价值不止于参数，更在于能否被工程师轻松集成、在产线上稳定出货。因此，我们把「易用性」与「可靠性」放在与性能同等重要的位置，并以完善的文档、参考设计与技术支持降低客户的研发门槛。
                </p>
            </div>
        </div>
    </section>

    {{-- 核心能力 --}}
    <section class="border-t border-line bg-surface px-4 sm:px-6 lg:px-8 py-14 lg:py-20">
        <div class="max-w-8xl mx-auto">
            <div class="max-w-2xl">
                <h2 class="text-2xl font-bold tracking-tight text-fg">核心能力</h2>
                <p class="mt-2 text-sm text-muted">覆盖芯片设计、协议支持、量产与服务的完整闭环。</p>
            </div>
            <div class="mt-8 grid gap-6 sm:grid-cols-2 lg:grid-cols-4">
                <div class="rounded-xl border border-line bg-surface p-6 shadow-card">
                    <span class="inline-flex h-11 w-11 items-center justify-center rounded-lg bg-primary-soft text-primary"><x-icon name="box" :size="24" /></span>
                    <h3 class="mt-4 font-semibold text-fg">芯片设计</h3>
                    <p class="mt-2 text-sm text-muted">自研接口与电源管理 IP，覆盖多口 PD 电源及其信号智能控制与同步整流。</p>
                </div>
                <div class="rounded-xl border border-line bg-surface p-6 shadow-card">
                    <span class="inline-flex h-11 w-11 items-center justify-center rounded-lg bg-primary-soft text-primary"><x-icon name="book" :size="24" /></span>
                    <h3 class="mt-4 font-semibold text-fg">协议栈</h3>
                    <p class="mt-2 text-sm text-muted">支持 PD3.X / PPS / SPRS 等快充协议，提供完整参考设计。</p>
                </div>
                <div class="rounded-xl border border-line bg-surface p-6 shadow-card">
                    <span class="inline-flex h-11 w-11 items-center justify-center rounded-lg bg-primary-soft text-primary"><x-icon name="check" :size="24" /></span>
                    <h3 class="mt-4 font-semibold text-fg">量产交付</h3>
                    <p class="mt-2 text-sm text-muted">面向充电与外设厂商出货，建立稳定的质量与供货体系。</p>
                </div>
                <div class="rounded-xl border border-line bg-surface p-6 shadow-card">
                    <span class="inline-flex h-11 w-11 items-center justify-center rounded-lg bg-primary-soft text-primary"><x-icon name="chat" :size="24" /></span>
                    <h3 class="mt-4 font-semibold text-fg">技术支持</h3>
                    <p class="mt-2 text-sm text-muted">应用工程师协助方案评估、调试与量产导入。</p>
                </div>
            </div>
        </div>
    </section>

    {{-- 发展历程 --}}
    <section class="px-4 sm:px-6 lg:px-8 py-14 lg:py-20">
        <div class="max-w-8xl mx-auto">
            <h2 class="text-2xl font-bold tracking-tight text-fg">发展历程</h2>
            <p class="mt-2 text-sm text-muted">关键节点的持续积累。</p>
            <ol class="mt-8 space-y-6 border-l-2 border-line pl-6">
                <li>
                    <p class="text-sm font-semibold text-primary">起步</p>
                    <p class="mt-1 text-[15px] text-fg/90">聚焦多口 TypeC 接口 IC，完成首颗协议转换芯片流片与验证。</p>
                </li>
                <li>
                    <p class="text-sm font-semibold text-primary">产品化</p>
                    <p class="mt-1 text-[15px] text-fg/90">建立完整选型矩阵与参考设计，进入充电与外设客户量产导入。</p>
                </li>
                <li>
                    <p class="text-sm font-semibold text-primary">平台化</p>
                    <p class="mt-1 text-[15px] text-fg/90">搭建技术文档、术语库与论坛，形成面向工程师的开放支持体系。</p>
                </li>
            </ol>
        </div>
    </section>

    {{-- 资质与价值观 --}}
    <section class="border-t border-line bg-surface px-4 sm:px-6 lg:px-8 py-14 lg:py-20">
        <div class="max-w-8xl mx-auto grid gap-10 lg:grid-cols-2">
            <div>
                <h2 class="text-2xl font-bold tracking-tight text-fg">资质与合规</h2>
                <ul class="mt-6 space-y-3 text-[15px] text-fg/90">
                    <li class="flex items-start gap-3"><x-icon name="check" :size="20" class="mt-0.5 shrink-0 text-primary" /><span>产品通过相关可靠性与环境测试，满足量产导入要求。</span></li>
                    <li class="flex items-start gap-3"><x-icon name="check" :size="20" class="mt-0.5 shrink-0 text-primary" /><span>完整的文档、规格书与参考设计交付体系。</span></li>
                    <li class="flex items-start gap-3"><x-icon name="check" :size="20" class="mt-0.5 shrink-0 text-primary" /><span>规范的供应链与质量管控流程。</span></li>
                </ul>
            </div>
            <div>
                <h2 class="text-2xl font-bold tracking-tight text-fg">我们的价值观</h2>
                <div class="mt-6 grid gap-4 sm:grid-cols-2">
                    <div class="rounded-xl border border-line bg-surface p-5 shadow-card">
                        <h3 class="font-semibold text-fg">可靠优先</h3>
                        <p class="mt-1 text-sm text-muted">把稳定性放在第一位，让客户用得安心。</p>
                    </div>
                    <div class="rounded-xl border border-line bg-surface p-5 shadow-card">
                        <h3 class="font-semibold text-fg">工程师视角</h3>
                        <p class="mt-1 text-sm text-muted">从集成与调试的真实痛点出发做产品。</p>
                    </div>
                    <div class="rounded-xl border border-line bg-surface p-5 shadow-card">
                        <h3 class="font-semibold text-fg">开放协作</h3>
                        <p class="mt-1 text-sm text-muted">以文档与社区降低技术门槛。</p>
                    </div>
                    <div class="rounded-xl border border-line bg-surface p-5 shadow-card">
                        <h3 class="font-semibold text-fg">长期主义</h3>
                        <p class="mt-1 text-sm text-muted">与客户共同成长，而非一锤子买卖。</p>
                    </div>
                </div>
            </div>
        </div>
    </section>

    {{-- CTA --}}
    <section class="px-4 sm:px-6 lg:px-8 pb-16">
        <div class="max-w-8xl mx-auto rounded-2xl bg-primary px-6 py-10 text-center sm:px-10">
            <h2 class="text-xl font-bold tracking-tight text-white sm:text-2xl">想了解我们的芯片与方案？</h2>
            <p class="mt-2 text-sm text-white/85">无论是选型、样品还是技术合作，我们都乐于沟通。</p>
            <a href="{{ url('/contact') }}" class="mt-6 inline-flex items-center gap-2 rounded-lg bg-surface px-6 py-3 text-sm font-semibold text-primary transition hover:bg-surface/90">
                联系我们 <x-icon name="arrow" :size="18" />
            </a>
        </div>
    </section>
@endsection