export function BookIntro() {
  return (
    <section className="py-12 px-4">
      <div className="max-w-2xl mx-auto">
        {/* 毛玻璃卡片 */}
        <div className="glass-card-heavy p-6 sm:p-8">
          {/* 引用图标 */}
          <div className="w-10 h-10 rounded-xl bg-[var(--app-brand-light)] flex items-center justify-center mb-6">
            <svg className="w-5 h-5 text-[var(--app-brand)]" fill="currentColor" viewBox="0 0 24 24">
              <path d="M14.017 21v-7.391c0-5.704 3.731-9.57 8.983-10.609l.995 2.151c-2.432.917-3.995 3.638-3.995 5.849h4v10h-9.983zm-14.017 0v-7.391c0-5.704 3.748-9.57 9-10.609l.996 2.151c-2.433.917-3.996 3.638-3.996 5.849h3.983v10h-9.983z"/>
            </svg>
          </div>
          
          {/* 引用内容 */}
          <blockquote className="text-lg sm:text-xl text-white leading-relaxed mb-6 font-light">
            这不是一本教你成功的鸡汤书。
            <span className="text-[var(--app-text-secondary)]">
              这是我每天早上6点到9点，在Soul派对房和几百个陌生人分享的真实故事。
            </span>
          </blockquote>

          {/* 作者签名 */}
          <div className="flex items-center gap-3 mb-8">
            <div className="w-10 h-10 rounded-full bg-gradient-to-br from-[var(--app-brand)] to-[var(--ios-teal)] flex items-center justify-center text-white font-semibold text-sm">
              卡
            </div>
            <div>
              <p className="text-[var(--app-brand)] font-semibold">卡若</p>
              <p className="text-[var(--app-text-tertiary)] text-xs">Soul派对房主理人</p>
            </div>
          </div>

          {/* 分隔线 */}
          <div className="separator-ios mx-0 mb-6" />

          {/* 统计数据 */}
          <div className="grid grid-cols-3 gap-4 text-center">
            <div className="p-3">
              <p className="text-2xl sm:text-3xl font-bold text-white mb-1">55+</p>
              <p className="text-[var(--app-text-tertiary)] text-xs">真实案例</p>
            </div>
            <div className="p-3 border-x border-[var(--app-separator)]">
              <p className="text-2xl sm:text-3xl font-bold text-white mb-1">11</p>
              <p className="text-[var(--app-text-tertiary)] text-xs">核心章节</p>
            </div>
            <div className="p-3">
              <p className="text-2xl sm:text-3xl font-bold text-white mb-1">100+</p>
              <p className="text-[var(--app-text-tertiary)] text-xs">商业洞察</p>
            </div>
          </div>
        </div>
      </div>
    </section>
  )
}
