// About.jsx - About Section
function About() {
    return (
        <section id="about" className="py-20 bg-cream">
            <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
                <div className="grid lg:grid-cols-2 gap-12 items-center">
                    {/* Image */}
                    <div className="relative">
                        <div className="aspect-[4/5] rounded-2xl overflow-hidden shadow-xl">
                            <img
                                src="https://images.unsplash.com/photo-1579783902614-a3fb3927b6a5?w=800"
                                alt="Arpita teaching art"
                                className="w-full h-full object-cover"
                            />
                        </div>
                        {/* Decorative elements */}
                        <div className="absolute -bottom-6 -right-6 w-32 h-32 bg-crimson/10 rounded-full -z-10"></div>
                        <div className="absolute -top-6 -left-6 w-24 h-24 bg-gold/20 rounded-full -z-10"></div>
                    </div>

                    {/* Content */}
                    <div>
                        <h2 className="font-serif text-3xl md:text-4xl font-semibold text-charcoal mb-6">
                            Meet Arpita
                        </h2>
                        <p className="text-gray-600 text-lg leading-relaxed mb-6">
                            With over 15 years of experience in fine arts and art education, Arpita has dedicated her life to nurturing artistic talent across the globe. Her unique teaching methodology blends classical techniques with contemporary approaches, making art accessible to everyone.
                        </p>
                        <p className="text-gray-600 text-lg leading-relaxed mb-6">
                            Having taught students from over 45 countries, Arpita understands that every artist's journey is unique. Her patient guidance and personalized approach have helped thousands of students discover their artistic voice.
                        </p>

                        {/* Credentials */}
                        <div className="grid grid-cols-2 gap-6 mb-8">
                            <div className="bg-white rounded-xl p-4 shadow-sm">
                                <div className="text-2xl font-serif font-semibold text-crimson">15+</div>
                                <div className="text-sm text-gray-500">Years Experience</div>
                            </div>
                            <div className="bg-white rounded-xl p-4 shadow-sm">
                                <div className="text-2xl font-serif font-semibold text-crimson">MFA</div>
                                <div className="text-sm text-gray-500">Fine Arts Degree</div>
                            </div>
                            <div className="bg-white rounded-xl p-4 shadow-sm">
                                <div className="text-2xl font-serif font-semibold text-crimson">50+</div>
                                <div className="text-sm text-gray-500">Countries Reached</div>
                            </div>
                            <div className="bg-white rounded-xl p-4 shadow-sm">
                                <div className="text-2xl font-serif font-semibold text-crimson">1000+</div>
                                <div className="text-sm text-gray-500">Students Mentored</div>
                            </div>
                        </div>

                        {/* Teaching Philosophy */}
                        <div className="bg-white rounded-xl p-6 shadow-sm border-l-4 border-crimson">
                            <h3 className="font-serif text-xl font-semibold text-charcoal mb-3">
                                Teaching Philosophy
                            </h3>
                            <p className="text-gray-600 italic">
                                "Every stroke on canvas is a step towards self-discovery. My role is not just to teach techniques, but to help each student find their unique artistic voice and confidence."
                            </p>
                        </div>
                    </div>
                </div>
            </div>
        </section>
    );
}

window.About = About;