import Link from 'next/link';
import { ArrowRight, ClipboardList } from 'lucide-react';
import { Button } from '@/components/ui/button';

export default function Home() {
  return (
    <div className="min-h-[calc(100vh-3.5rem)] border-t bg-background">
      <section className="container max-w-4xl mx-auto px-4 py-16 md:py-24">
        <div className="space-y-8">
          <div className="space-y-4">
            <div className="inline-flex h-10 w-10 items-center justify-center rounded border bg-muted">
              <ClipboardList className="h-5 w-5" />
            </div>
            <h1 className="text-3xl md:text-5xl font-semibold tracking-normal">
              心理量表测试
            </h1>
            <p className="text-base md:text-lg text-muted-foreground max-w-2xl">
              选择一个量表，完成答题后查看结果。数据只在当前浏览器中处理，结果仅供参考，不构成医疗诊断。
            </p>
          </div>

          <Button size="lg" asChild>
            <Link href="/questionnaire" className="gap-2">
              开始测试
              <ArrowRight className="h-5 w-5" />
            </Link>
          </Button>

          <div className="grid grid-cols-1 sm:grid-cols-3 gap-3 pt-4 text-sm text-muted-foreground">
            <div className="border rounded p-4">人格、认知、情绪状态</div>
            <div className="border rounded p-4">自动计算结果</div>
            <div className="border rounded p-4">可复制完整记录</div>
          </div>
        </div>
      </section>
    </div>
  );
}