import React from 'react';

const AboutPage: React.FC = () => {
  return (
    <div className="bg-gray-50 min-h-screen">
      <div className="container mx-auto px-4 py-16">
        <h1 className="text-4xl font-bold text-center mb-12">关于野服饰</h1>
        
        <section className="mb-16">
          <h2 className="text-3xl font-semibold mb-6">我们的故事</h2>
          <p className="text-gray-700 mb-4">
            野服饰诞生于2020年,是一群热爱中国传统文化的年轻设计师共同创立的新中式女装品牌。我们的使命是将中国传统美学与现代时尚完美融合,为现代女性打造既优雅又富有个性的服装。
          </p>
          <p className="text-gray-700 mb-4">
            我们的名字"野",不仅代表了自然之美,更象征着我们追求自由、创新和突破传统框架的设计理念。我们相信,真正的时尚应该是对文化的传承和创新的完美平衡。
          </p>
        </section>
        
        <section className="mb-16">
          <h2 className="text-3xl font-semibold mb-6">设计理念</h2>
          <div className="grid md:grid-cols-3 gap-8">
            <div className="bg-white p-6 rounded-lg shadow-md">
              <h3 className="text-xl font-semibold mb-4">传统与现代的融合</h3>
              <p className="text-gray-700">我们将中国传统元素如水墨画、青花瓷等融入现代剪裁中,创造出独特的视觉语言。</p>
            </div>
            <div className="bg-white p-6 rounded-lg shadow-md">
              <h3 className="text-xl font-semibold mb-4">匠心工艺</h3>
              <p className="text-gray-700">每件作品都经过精心制作,从面料选择到缝纫细节,我们都力求完美。</p>
            </div>
            <div className="bg-white p-6 rounded-lg shadow-md">
              <h3 className="text-xl font-semibold mb-4">可持续时尚</h3>
              <p className="text-gray-700">我们注重环保材料的使用,追求时尚与环境保护的和谐统一。</p>
            </div>
          </div>
        </section>
        
        <section>
          <h2 className="text-3xl font-semibold mb-6">我们的团队</h2>
          <div className="grid md:grid-cols-3 gap-8">
            <div className="text-center">
              <img src="https://images.unsplash.com/photo-1438761681033-6461ffad8d80?ixlib=rb-1.2.1&auto=format&fit=crop&w=300&q=80" alt="设计师照片" className="w-40 h-40 rounded-full mx-auto mb-4 object-cover" />
              <h3 className="text-xl font-semibold">李梦华</h3>
              <p className="text-gray-600">创始人 &amp; 首席设计师</p>
            </div>
            <div className="text-center">
              <img src="https://images.unsplash.com/photo-1500648767791-00dcc994a43e?ixlib=rb-1.2.1&auto=format&fit=crop&w=300&q=80" alt="设计师照片" className="w-40 h-40 rounded-full mx-auto mb-4 object-cover" />
              <h3 className="text-xl font-semibold">张艺谋</h3>
              <p className="text-gray-600">面料开发总监</p>
            </div>
            <div className="text-center">
              <img src="https://images.unsplash.com/photo-1607746882042-944635dfe10e?ixlib=rb-1.2.1&auto=format&fit=crop&w=300&q=80" alt="设计师照片" className="w-40 h-40 rounded-full mx-auto mb-4 object-cover" />
              <h3 className="text-xl font-semibold">王菲</h3>
              <p className="text-gray-600">市场营销总监</p>
            </div>
          </div>
        </section>
      </div>
    </div>
  );
};

export default AboutPage;