export default function Home() {
return (
{/* Header */}
Amy’s Copywriting & Marketing Services Portfolio About Contact {/* Hero Section with background image */} <section className="relative text-center py-32 bg-cover bg-center text-white" style={{ backgroundImage: "url('/images/hero-copywriting.jpg')" }} > <div className="absolute inset-0 bg-black/60"></div> <div className="relative z-10 max-w-3xl mx-auto"> <h2 className="text-4xl md:text-5xl font-bold mb-4">Words That Sell. Strategies That Convert.</h2> <p className="text-lg mb-6">Helping brands grow with persuasive copywriting and smart marketing.</p> <a href="#contact" className="bg-white text-blue-600 font-semibold px-6 py-3 rounded-full shadow-md hover:bg-gray-200">Work With Me</a> </div> </section> {/* Services with illustrative images */} <section id="services" className="py-16 px-6 md:px-20"> <h3 className="text-3xl font-bold text-center mb-10">Services</h3> <div className="grid md:grid-cols-3 gap-8"> <div className="bg-white p-6 rounded-2xl shadow-md text-center"> <img src="/images/copywriting.jpg" alt="Copywriting" className="w-full h-40 object-cover rounded-lg mb-4" /> <h4 className="text-xl font-semibold mb-3">Copywriting</h4> <p>Engaging website copy, landing pages, and ad campaigns designed to capture attention and drive sales.</p> </div> <div className="bg-white p-6 rounded-2xl shadow-md text-center"> <img src="/images/content-marketing.jpg" alt="Content Marketing" className="w-full h-40 object-cover rounded-lg mb-4" /> <h4 className="text-xl font-semibold mb-3">Content Marketing</h4> <p>Blog posts, articles, and content strategies that build authority and connect with your audience.</p> </div> <div className="bg-white p-6 rounded-2xl shadow-md text-center"> <img src="/images/email-marketing.jpg" alt="Email Marketing" className="w-full h-40 object-cover rounded-lg mb-4" /> <h4 className="text-xl font-semibold mb-3">Email Marketing</h4> <p>High-converting email campaigns that nurture leads and turn subscribers into loyal customers.</p> </div> </div> </section> {/* Portfolio */} <section id="portfolio" className="py-16 px-6 md:px-20 bg-gray-100"> <h3 className="text-3xl font-bold text-center mb-10">Portfolio</h3> <div className="grid md:grid-cols-3 gap-8"> <div className="bg-white p-6 rounded-2xl shadow-md"> <h4 className="font-semibold mb-2">E-commerce Website Copy</h4> <p>Boosted client sales by 45% with persuasive product descriptions and optimized landing pages.</p> </div> <div className="bg-white p-6 rounded-2xl shadow-md"> <h4 className="font-semibold mb-2">Content Strategy for Tech Startup</h4> <p>Developed a content plan that increased organic traffic by 60% in 3 months.</p> </div> <div className="bg-white p-6 rounded-2xl shadow-md"> <h4 className="font-semibold mb-2">Email Funnel Campaign</h4> <p>Created an email sequence that doubled lead conversion rates for a coaching business.</p> </div> </div> </section> {/* About with uploaded images */} <section id="about" className="py-16 px-6 md:px-20"> <h3 className="text-3xl font-bold text-center mb-10">About Amy</h3> <div className="max-w-3xl mx-auto text-center"> <div className="flex flex-col md:flex-row items-center justify-center gap-6 mb-6"> <img src="/uploads/Z Ami.jpg" alt="Amy portrait" className="w-48 h-48 object-cover rounded-full shadow-md" /> <img src="/uploads/Z Ami 2.jpg" alt="Amy portrait" className="w-48 h-48 object-cover rounded-full shadow-md" /> </div> <p className="text-lg mb-6"> Hi, I’m Amy — a passionate copywriter and marketer with over 7 years of experience helping businesses grow through the power of words and strategy. I believe that every brand has a unique story, and my mission is to tell it in a way that attracts, engages, and converts. </p> </div> </section> {/* Contact */} <section id="contact" className="py-16 px-6 md:px-20 bg-gradient-to-r from-indigo-600 to-blue-500 text-white"> <h3 className="text-3xl font-bold text-center mb-10">Get in Touch</h3> <div className="max-w-2xl mx-auto"> <form className="grid gap-6"> <input type="text" placeholder="Your Name" className="p-3 rounded-lg text-gray-800" /> <input type="email" placeholder="Your Email" className="p-3 rounded-lg text-gray-800" /> <textarea placeholder="Your Message" className="p-3 rounded-lg text-gray-800 h-32"></textarea> <button className="bg-white text-blue-600 font-semibold px-6 py-3 rounded-full shadow-md hover:bg-gray-200">Send Message</button> </form> </div> </section> {/* Footer */} <footer className="bg-gray-900 text-gray-300 py-6 text-center"> <p>© {new Date().getFullYear()} Amy’s Copywriting & Marketing. All rights reserved.</p> </footer> </div>
);
}
