[V0_FILE]jpg:file="public/professional-woman-english-teacher-smiling.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/professional-woman-english-teacher-smiling-isTv5v34Y8Y6NcRUDbPnBDhzgLBwHI.jpg" isMerged="true" [V0_FILE]json:file="package.json" isMerged="true" { "name": "my-v0-project", "version": "0.1.0", "private": true, "scripts": { "dev": "next dev", "build": "next build", "start": "next start", "lint": "next lint" }, "dependencies": { "@hookform/resolvers": "^3.10.0", "@radix-ui/react-accordion": "1.2.2", "@radix-ui/react-alert-dialog": "1.1.4", "@radix-ui/react-aspect-ratio": "1.1.1", "@radix-ui/react-avatar": "1.1.2", "@radix-ui/react-checkbox": "1.1.3", "@radix-ui/react-collapsible": "1.1.2", "@radix-ui/react-context-menu": "2.2.4", "@radix-ui/react-dialog": "1.1.4", "@radix-ui/react-dropdown-menu": "2.1.4", "@radix-ui/react-hover-card": "1.1.4", "@radix-ui/react-label": "2.1.1", "@radix-ui/react-menubar": "1.1.4", "@radix-ui/react-navigation-menu": "1.2.3", "@radix-ui/react-popover": "1.1.4", "@radix-ui/react-progress": "1.1.1", "@radix-ui/react-radio-group": "1.2.2", "@radix-ui/react-scroll-area": "1.2.2", "@radix-ui/react-select": "2.1.4", "@radix-ui/react-separator": "1.1.1", "@radix-ui/react-slider": "1.2.2", "@radix-ui/react-slot": "1.1.1", "@radix-ui/react-switch": "1.1.2", "@radix-ui/react-tabs": "1.1.2", "@radix-ui/react-toast": "1.2.4", "@radix-ui/react-toggle": "1.1.1", "@radix-ui/react-toggle-group": "1.1.1", "@radix-ui/react-tooltip": "1.1.6", "@vercel/analytics": "1.3.1", "autoprefixer": "^10.4.20", "class-variance-authority": "^0.7.1", "clsx": "^2.1.1", "cmdk": "1.0.4", "date-fns": "4.1.0", "embla-carousel-react": "8.5.1", "geist": "^1.3.1", "input-otp": "1.4.1", "lucide-react": "^0.454.0", "next": "15.5.4", "next-themes": "^0.4.6", "react": "19.1.0", "react-day-picker": "9.8.0", "react-dom": "19.1.0", "react-hook-form": "^7.60.0", "react-resizable-panels": "^2.1.7", "recharts": "2.15.4", "sonner": "^1.7.4", "tailwind-merge": "^3.3.1", "tailwindcss-animate": "^1.0.7", "vaul": "^0.9.9", "zod": "3.25.67", "resend": "6.4.2" }, "devDependencies": { "@tailwindcss/postcss": "^4.1.9", "@types/node": "^22", "@types/react": "^18", "@types/react-dom": "^18", "postcss": "^8.5", "tailwindcss": "^4.1.9", "tw-animate-css": "1.3.3", "typescript": "^5" } } [V0_FILE]jpg:file="public/ritika-professional-portrait.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/ritika-professional-portrait-a5Gy0uOSlUt703LSZeUXg7Y4oE334v.jpg" isMerged="true" [V0_FILE]jpg:file="public/spoken-english-training-class.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/spoken-english-training-class-Ql0Ql0Ql0Ql0Ql0Ql0Ql0Ql0Ql0Ql0Q.jpg" isMerged="true" [V0_FILE]jpg:file="public/accent-training-professional.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/accent-training-professional-Ql0Ql0Ql0Ql0Ql0Ql0Ql0Ql0Ql0Ql0Q.jpg" isMerged="true" [V0_FILE]jpg:file="public/business-email-writing-training.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/business-email-writing-training-Ql0Ql0Ql0Ql0Ql0Ql0Ql0Ql0Ql0Ql0Q.jpg" isMerged="true" [V0_FILE]jpg:file="public/testimonial-priya.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/testimonial-priya-Ql0Ql0Ql0Ql0Ql0Ql0Ql0Ql0Ql0Ql0Q.jpg" isMerged="true" [V0_FILE]jpg:file="public/testimonial-rahul.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/testimonial-rahul-Ql0Ql0Ql0Ql0Ql0Ql0Ql0Ql0Ql0Ql0Q.jpg" isMerged="true" [V0_FILE]jpg:file="public/testimonial-anjali.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/testimonial-anjali-Ql0Ql0Ql0Ql0Ql0Ql0Ql0Ql0Ql0Ql0Q.jpg" isMerged="true" [V0_FILE]jpg:file="public/testimonial-vikram.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/testimonial-vikram-Ql0Ql0Ql0Ql0Ql0Ql0Ql0Ql0Ql0Ql0Q.jpg" isMerged="true" [V0_FILE]jpg:file="public/testimonial-meera.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/testimonial-meera-Ql0Ql0Ql0Ql0Ql0Ql0Ql0Ql0Ql0Ql0Q.jpg" isMerged="true" [V0_FILE]jpg:file="public/testimonial-arjun.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/testimonial-arjun-Ql0Ql0Ql0Ql0Ql0Ql0Ql0Ql0Ql0Ql0Q.jpg" isMerged="true" [V0_FILE]jpg:file="public/professional-spoken-english-training-classroom-wit.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/professional-spoken-english-training-classroom-wit-O80OXiX0NvrMoppmkvr6tVSpbJDVoo.jpg" isMerged="true" [V0_FILE]jpg:file="public/professional-accent-training-session-with-micropho.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/professional-accent-training-session-with-micropho-5IekSE82jEUwG4ujkBYPl78YXKwCaP.jpg" isMerged="true" [V0_FILE]jpg:file="public/professional-business-email-writing-on-laptop-in-m.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/professional-business-email-writing-on-laptop-in-m-4QUlxbm8TX0w6nAadw3KFBZ66SnAOM.jpg" isMerged="true" [V0_FILE]jpg:file="public/professional-indian-woman-english-teacher-smiling-.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/professional-indian-woman-english-teacher-smiling--4sTN72zGoFsSmD5W80mx0yx6dwEdGN.jpg" isMerged="true" [V0_FILE]jpg:file="public/professional-portrait-indian-woman-english-languag.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/professional-portrait-indian-woman-english-languag-Cmu2yZFLAJkgKmwvxr7PQPG1FmPafD.jpg" isMerged="true" [V0_FILE]jpg:file="public/indian-students-learning-spoken-english-in-modern-.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/indian-students-learning-spoken-english-in-modern--z8bmhWstl042nWR5C0qhOGjeeHUdew.jpg" isMerged="true" [V0_FILE]jpg:file="public/indian-professional-practicing-accent-training-wit.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/indian-professional-practicing-accent-training-wit-RNbrTWfEF8AUF6lBMrSogRvOnbOmuq.jpg" isMerged="true" [V0_FILE]jpg:file="public/indian-business-professional-writing-email-on-lapt.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/indian-business-professional-writing-email-on-lapt-dwh0V9WxIRkb8KDt1gKEEDekulIgCf.jpg" isMerged="true" [V0_FILE]jpg:file="public/indian-woman-software-engineer-professional-headsh.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/indian-woman-software-engineer-professional-headsh-Gf1Xmw0NkeT5bTJ9m8PAhoq2s5Euo5.jpg" isMerged="true" [V0_FILE]jpg:file="public/indian-male-mba-student-professional-headshot.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/indian-male-mba-student-professional-headshot-b9jkqIE0HkWoWax6llJLWd0v9ykyZH.jpg" isMerged="true" [V0_FILE]jpg:file="public/indian-woman-hr-manager-professional-headshot.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/indian-woman-hr-manager-professional-headshot-6z7lCWHvBAqib1BwRGHOeXHKTHFiH2.jpg" isMerged="true" [V0_FILE]jpg:file="public/indian-male-business-owner-professional-headshot.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/indian-male-business-owner-professional-headshot-T5KYVKVFR4BsatWdZVTZhXUzRN8Cni.jpg" isMerged="true" [V0_FILE]jpg:file="public/indian-female-college-student-professional-headsho.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/indian-female-college-student-professional-headsho-68IQi4bAvLbcOEVkMK8R6wsXNVpcwO.jpg" isMerged="true" [V0_FILE]jpg:file="public/indian-male-marketing-manager-professional-headsho.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/indian-male-marketing-manager-professional-headsho-fPB8z8c1DvOQbvzfCpHyj9uaFLfXzE.jpg" isMerged="true" [V0_FILE]css:file="app/globals.css" isEdit="true" isMerged="true" @import "tailwindcss"; @import "tw-animate-css"; @custom-variant dark (&:is(.dark *)); :root { /* Updated to Cambridge English vibrant color scheme */ /* Turquoise, Orange, Purple, Dark Teal */ --background: oklch(1 0 0); --foreground: oklch(0.15 0 0); --card: oklch(0.98 0 0); --card-foreground: oklch(0.15 0 0); --popover: oklch(1 0 0); --popover-foreground: oklch(0.15 0 0); /* Primary: Turquoise */ --primary: oklch(0.65 0.18 199); --primary-foreground: oklch(1 0 0); /* Secondary: Orange */ --secondary: oklch(0.6 0.2 48); --secondary-foreground: oklch(1 0 0); --muted: oklch(0.95 0 0); --muted-foreground: oklch(0.5 0 0); /* Accent: Purple */ --accent: oklch(0.5 0.18 310); --accent-foreground: oklch(1 0 0); --destructive: oklch(0.577 0.245 27.325); --destructive-foreground: oklch(0.577 0.245 27.325); --border: oklch(0.92 0 0); --input: oklch(0.92 0 0); --ring: oklch(0.65 0.18 199); --chart-1: oklch(0.65 0.18 199); --chart-2: oklch(0.6 0.2 48); --chart-3: oklch(0.5 0.18 310); --chart-4: oklch(0.35 0.15 260); --chart-5: oklch(0.769 0.188 70.08); --radius: 0.625rem; --sidebar: oklch(0.985 0 0); --sidebar-foreground: oklch(0.145 0 0); --sidebar-primary: oklch(0.65 0.18 199); --sidebar-primary-foreground: oklch(0.985 0 0); --sidebar-accent: oklch(0.97 0 0); --sidebar-accent-foreground: oklch(0.65 0.18 199); --sidebar-border: oklch(0.922 0 0); --sidebar-ring: oklch(0.65 0.18 199); } .dark { --background: oklch(0.12 0 0); --foreground: oklch(0.95 0 0); --card: oklch(0.15 0 0); --card-foreground: oklch(0.95 0 0); --popover: oklch(0.12 0 0); --popover-foreground: oklch(0.95 0 0); --primary: oklch(0.75 0.18 199); --primary-foreground: oklch(0.12 0 0); --secondary: oklch(0.7 0.2 48); --secondary-foreground: oklch(0.12 0 0); --muted: oklch(0.25 0 0); --muted-foreground: oklch(0.65 0 0); --accent: oklch(0.65 0.18 310); --accent-foreground: oklch(0.12 0 0); --destructive: oklch(0.396 0.141 25.723); --destructive-foreground: oklch(0.637 0.237 25.331); --border: oklch(0.25 0 0); --input: oklch(0.25 0 0); --ring: oklch(0.75 0.18 199); --chart-1: oklch(0.75 0.18 199); --chart-2: oklch(0.7 0.2 48); --chart-3: oklch(0.65 0.18 310); --chart-4: oklch(0.627 0.265 303.9); --chart-5: oklch(0.645 0.246 16.439); --sidebar: oklch(0.15 0 0); --sidebar-foreground: oklch(0.95 0 0); --sidebar-primary: oklch(0.75 0.18 199); --sidebar-primary-foreground: oklch(0.95 0 0); --sidebar-accent: oklch(0.25 0 0); --sidebar-accent-foreground: oklch(0.95 0 0); --sidebar-border: oklch(0.25 0 0); --sidebar-ring: oklch(0.75 0.18 199); } @theme inline { --font-sans: "Inter", system-ui, sans-serif; --font-serif: "Merriweather", serif; /* Color System - Cambridge English Inspired */ --color-primary: var(--primary); --color-primary-hover: var(--primary); --color-secondary: var(--secondary); --color-accent: var(--accent); --color-dark: var(--background); --color-darker: var(--background); /* Semantic Tokens */ --color-background: var(--background); --color-foreground: var(--foreground); --color-muted: var(--muted); --color-muted-foreground: var(--muted-foreground); --color-border: var(--border); --color-card: var(--card); --color-card-foreground: var(--card-foreground); --color-popover: var(--popover); --color-popover-foreground: var(--popover-foreground); --color-destructive: var(--destructive); --color-destructive-foreground: var(--destructive-foreground); --color-input: var(--input); --color-ring: var(--ring); --color-sidebar: var(--sidebar); --color-sidebar-foreground: var(--sidebar-foreground); --color-sidebar-primary: var(--sidebar-primary); --color-sidebar-primary-foreground: var(--sidebar-primary-foreground); --color-sidebar-accent: var(--sidebar-accent); --color-sidebar-accent-foreground: var(--sidebar-accent-foreground); --color-sidebar-border: var(--sidebar-border); --color-sidebar-ring: var(--sidebar-ring); --radius-sm: calc(var(--radius) - 4px); --radius-md: calc(var(--radius) - 2px); --radius-lg: var(--radius); --radius-xl: calc(var(--radius) + 4px); } @layer base { * { @apply border-border outline-ring/50; } body { @apply bg-background text-foreground; } } body { font-family: var(--font-sans); background-color: var(--color-background); color: var(--color-foreground); } h1, h2, h3, h4, h5, h6 { font-family: var(--font-sans); font-weight: 700; } [V0_FILE]png:file="public/images/design-mode/image.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/design-mode-images/image-3G8AQRLpwMT89KIG6xNnGhxcmfwxDB.png" isMerged="true" [V0_FILE]png:file="public/wg-logo.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/Gemini_Generated_Image_g2qvyvg2qvyvg2qv-imKkN5sPY9VjXlrD8IBe1GYdWNriHw.png" isMerged="true" [V0_FILE]png:file="public/ritika-laptop-working.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/RitikaSidana-pdpG5fxE4tj7SiVIM5GhcGWYt3oDfI.png" isMerged="true" [V0_FILE]typescriptreact:file="app/services/page.tsx" isEdit="true" isQuickEdit="true" isMerged="true" import { Navigation } from "@/components/navigation" import { Footer } from "@/components/footer" import { MessageSquare, Users, BookOpen, CheckCircle, ArrowRight, Clock, Target, TrendingUp } from "lucide-react" import Link from "next/link" export default function ServicesPage() { return (

{/* Hero Section */}

Professional English Training Services

Comprehensive programs designed to elevate your communication skills and professional presence

{/* Main Services */}

{/* Service 1: Spoken English */}

Spoken English Training

Speak fluently and confidently in everyday conversations, presentations, and professional interactions. Learn to express yourself naturally and leave a lasting impression wherever you go.

Conversational Fluency

Master everyday English conversations with confidence

Vocabulary Enhancement

Expand your word bank for effective communication

Grammar in Practice

Apply grammar rules naturally in speech

Public Speaking Skills

Present ideas clearly and confidently

Enroll Now

8-12 weeks program

{/* Service 2: Accent Training */}

Corporate Favorite

Accent Training & Neutralization

Develop a neutral, professional accent that enhances clarity and credibility in business communication. Ideal for professionals working in international environments.

Pronunciation Mastery

Perfect your pronunciation of challenging sounds

Intonation & Rhythm

Master the natural flow of English speech

Stress Patterns

Learn correct word and sentence stress

Business Communication

Sound professional in meetings and presentations

Enroll Now

10-16 weeks program

{/* Service 3: Email Writing */}

Professional Essential

Business Email Writing

Master the art of writing clear, professional, and impactful emails. Build confidence in business communication that represents your professionalism.

Professional Tone

Write emails that convey professionalism and clarity

Email Structure

Learn proper formatting and organization

Business Etiquette

Understand corporate communication protocols

Effective Messaging

Communicate your message clearly and concisely

Enroll Now

6-8 weeks program

{/* Training Approach */}

My Training Approach

A proven methodology that delivers measurable results

Assessment

Initial evaluation to understand your current level, goals, and learning style for a customized training plan.

Interactive Sessions

Engaging one-on-one or group sessions with practical exercises, role-plays, and real-world scenarios.

Progress Tracking

Regular feedback and assessments to monitor improvement and adjust the training approach as needed.

{/* CTA Section */}

Ready to Elevate Your English Skills?

Choose the program that fits your goals and start your journey to confident communication today.

Request Training

) } [V0_FILE]typescriptreact:file="app/contact/page.tsx" isEdit="true" isQuickEdit="true" isMerged="true" "use client" import type React from "react" import { Navigation } from "@/components/navigation" import { Footer } from "@/components/footer" import { Mail, Phone, MapPin, Send, CheckCircle } from 'lucide-react' import { useState } from "react" export default function ContactPage() { const [formData, setFormData] = useState({ name: "", email: "", phone: "", requirement: "", }) const [isSubmitted, setIsSubmitted] = useState(false) const [isSubmitting, setIsSubmitting] = useState(false) const handleChange = (e: React.ChangeEvent) => { setFormData({ ...formData, [e.target.name]: e.target.value, }) } const handleSubmit = async (e: React.FormEvent) => { e.preventDefault() setIsSubmitting(true) try { const response = await fetch('/api/send-email', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify(formData) }) if (response.ok) { setIsSubmitted(true) setIsSubmitting(false) // Reset form after 3 seconds setTimeout(() => { setIsSubmitted(false) setFormData({ name: "", email: "", phone: "", requirement: "", }) }, 3000) } else { console.error('[v0] Form submission failed') setIsSubmitting(false) } } catch (error) { console.error('[v0] Error submitting form:', error) setIsSubmitting(false) } } return (

{/* Hero Section */}

Get in Touch

Ready to start your English learning journey? Fill out the form below and I'll get back to you within 24 hours.

{/* Contact Section */}

{/* Contact Information */}

Let's Connect

Whether you're a student looking to improve your spoken English, a professional seeking accent training, or an organization interested in corporate training programs, I'm here to help.

{/* Contact Details */}

ritikacoach.training@gmail.com

Phone

+91 6284300188

Location

New Delhi, India

{/* Training Options */}

Training Options Available

One-on-One Sessions
Group Classes
Corporate Training Programs
Online & In-Person Options

{/* Contact Form */}

{isSubmitted ? (

Thank You!

Your inquiry has been submitted successfully. I'll get back to you within 24 hours.

) : (

Full Name *

Email Address *

Mobile Number *

Enter 10-digit mobile number

Training Requirement *

</div>

<button
                    type="submit"
                    disabled={isSubmitting}
                    className="w-full px-6 py-3 bg-primary text-white rounded-lg hover:bg-primary-hover transition-colors font-medium flex items-center justify-center gap-2 disabled:opacity-50 disabled:cursor-not-allowed"
                  >
                    {isSubmitting ? (
                      <>
                        <div className="w-5 h-5 border-2 border-white border-t-transparent rounded-full animate-spin" />
                        Submitting...
                      </>
                    ) : (
                      <>
                        Submit Inquiry
                        <Send size={20} />
                      </>
                    )}
                  </button>

<p className="text-xs text-muted-foreground text-center">
                    By submitting this form, you agree to be contacted regarding your training inquiry.
                  </p>
                </form>
              )}
            </div>
          </div>
        </div>
      </section>

{/* FAQ Section */}
      <section className="py-20 px-4 sm:px-6 lg:px-8 bg-muted">
        <div className="max-w-4xl mx-auto">
          <h2 className="text-3xl font-bold text-foreground mb-8 text-center">Frequently Asked Questions</h2>
          <div className="space-y-6">
            <div className="bg-card border border-border rounded-xl p-6">
              <h3 className="text-lg font-bold text-card-foreground mb-2">What is the duration of each program?</h3>
              <p className="text-muted-foreground leading-relaxed">
                Program durations vary: Spoken English (8-12 weeks), Accent Training (10-16 weeks), and Email Writing
                (6-8 weeks). Each program is customizable based on your goals and pace.
              </p>
            </div>

<div className="bg-card border border-border rounded-xl p-6">
              <h3 className="text-lg font-bold text-card-foreground mb-2">Do you offer online training?</h3>
              <p className="text-muted-foreground leading-relaxed">
                Yes! I offer both online and in-person training options. Online sessions are conducted via video calls
                with the same quality and personalized attention as in-person classes.
              </p>
            </div>

<div className="bg-card border border-border rounded-xl p-6">
              <h3 className="text-lg font-bold text-card-foreground mb-2">What are the fees for training?</h3>
              <p className="text-muted-foreground leading-relaxed">
                Fees vary based on the program type, duration, and whether it's individual or group training. Please
                contact me for detailed pricing information tailored to your specific needs.
              </p>
            </div>

<div className="bg-card border border-border rounded-xl p-6">
              <h3 className="text-lg font-bold text-card-foreground mb-2">
                Do you provide corporate training for teams?
              </h3>
              <p className="text-muted-foreground leading-relaxed">
                I have extensive experience training corporate teams. Programs can be customized for your organization's
                specific communication needs and can be conducted at your office or online.
              </p>
            </div>
          </div>
        </div>
      </section>

<Footer />
    </div>
  )
}
[V0_FILE]typescriptreact:file="app/demo/page.tsx" isEdit="true" isQuickEdit="true" isMerged="true"
"use client"

import type React from "react"

import { Navigation } from "@/components/navigation"
import { Footer } from "@/components/footer"
import { Calendar, Clock, Users, Video, CheckCircle } from 'lucide-react'
import { useState } from "react"

export default function DemoPage() {
  const [formData, setFormData] = useState({
    name: "",
    email: "",
    phone: "",
    service: "",
    preferredDate: "",
    preferredTime: "",
    sessionType: "online",
    message: "",
  })
  const [isSubmitted, setIsSubmitted] = useState(false)
  const [isSubmitting, setIsSubmitting] = useState(false)

const handleChange = (e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement | HTMLSelectElement>) => {
    setFormData({
      ...formData,
      [e.target.name]: e.target.value,
    })
  }

const handleSubmit = async (e: React.FormEvent) => {
    e.preventDefault()
    setIsSubmitting(true)

try {
      const response = await fetch('/api/send-email', {
        method: 'POST',
        headers: { 'Content-Type': 'application/json' },
        body: JSON.stringify(formData)
      })

if (response.ok) {
        setIsSubmitted(true)
        setIsSubmitting(false)

// Reset form after 3 seconds
        setTimeout(() => {
          setIsSubmitted(false)
          setFormData({
            name: "",
            email: "",
            phone: "",
            service: "",
            preferredDate: "",
            preferredTime: "",
            sessionType: "online",
            message: "",
          })
        }, 3000)
      } else {
        console.error('[v0] Form submission failed')
        setIsSubmitting(false)
      }
    } catch (error) {
      console.error('[v0] Error submitting form:', error)
      setIsSubmitting(false)
    }
  }

return (
    <div className="min-h-screen flex flex-col">
      <Navigation />

{/* Hero Section */}
      <section className="pt-32 pb-16 px-4 sm:px-6 lg:px-8">
        <div className="max-w-4xl mx-auto text-center">
          <h1 className="text-4xl sm:text-5xl font-bold text-foreground mb-6 text-balance">
            Book Your Free Demo Session
          </h1>
          <p className="text-xl text-muted-foreground leading-relaxed">
            Experience my teaching methodology firsthand. Schedule a complimentary 30-minute demo session to understand
            how I can help you achieve your English language goals.
          </p>
        </div>
      </section>

{/* Demo Request Section */}
      <section className="pb-20 px-4 sm:px-6 lg:px-8">
        <div className="max-w-6xl mx-auto">
          <div className="grid grid-cols-1 lg:grid-cols-2 gap-12">
            {/* Demo Information */}
            <div className="space-y-8">
              <div>
                <h2 className="text-3xl font-bold text-foreground mb-4">What to Expect</h2>
                <p className="text-muted-foreground leading-relaxed">
                  During your free demo session, we'll assess your current English proficiency, discuss your learning
                  goals, and create a personalized roadmap for your language journey.
                </p>
              </div>

{/* Demo Features */}
              <div className="space-y-4">
                <div className="flex items-start gap-4">
                  <div className="w-12 h-12 bg-primary/10 rounded-lg flex items-center justify-center flex-shrink-0">
                    <Clock className="text-primary" size={20} />
                  </div>
                  <div>
                    <p className="font-medium text-foreground mb-1">30-Minute Session</p>
                    <p className="text-muted-foreground text-sm">
                      Focused one-on-one interaction to understand your needs
                    </p>
                  </div>
                </div>

<div className="flex items-start gap-4">
                  <div className="w-12 h-12 bg-primary/10 rounded-lg flex items-center justify-center flex-shrink-0">
                    <Users className="text-primary" size={20} />
                  </div>
                  <div>
                    <p className="font-medium text-foreground mb-1">Personalized Assessment</p>
                    <p className="text-muted-foreground text-sm">Evaluation of your current proficiency level</p>
                  </div>
                </div>

<div className="flex items-start gap-4">
                  <div className="w-12 h-12 bg-primary/10 rounded-lg flex items-center justify-center flex-shrink-0">
                    <Calendar className="text-primary" size={20} />
                  </div>
                  <div>
                    <p className="font-medium text-foreground mb-1">Customized Learning Plan</p>
                    <p className="text-muted-foreground text-sm">Tailored roadmap based on your goals and timeline</p>
                  </div>
                </div>

<div className="flex items-start gap-4">
                  <div className="w-12 h-12 bg-primary/10 rounded-lg flex items-center justify-center flex-shrink-0">
                    <Video className="text-primary" size={20} />
                  </div>
                  <div>
                    <p className="font-medium text-foreground mb-1">Flexible Format</p>
                    <p className="text-muted-foreground text-sm">Choose between online or in-person demo sessions</p>
                  </div>
                </div>
              </div>

{/* Benefits */}
              <div className="bg-muted rounded-xl p-6">
                <h3 className="text-lg font-bold text-foreground mb-4">Demo Session Benefits</h3>
                <ul className="space-y-2">
                  <li className="flex items-center gap-2 text-muted-foreground">
                    <div className="w-1.5 h-1.5 bg-primary rounded-full" />
                    No commitment required
                  </li>
                  <li className="flex items-center gap-2 text-muted-foreground">
                    <div className="w-1.5 h-1.5 bg-primary rounded-full" />
                    Experience teaching methodology
                  </li>
                  <li className="flex items-center gap-2 text-muted-foreground">
                    <div className="w-1.5 h-1.5 bg-primary rounded-full" />
                    Get instant feedback on your English
                  </li>
                  <li className="flex items-center gap-2 text-muted-foreground">
                    <div className="w-1.5 h-1.5 bg-primary rounded-full" />
                    Discuss program options and pricing
                  </li>
                </ul>
              </div>
            </div>

{/* Demo Request Form */}
            <div className="bg-card border border-border rounded-2xl p-8">
              {isSubmitted ? (
                <div className="flex flex-col items-center justify-center py-12 text-center">
                  <div className="w-16 h-16 bg-primary/10 rounded-full flex items-center justify-center mb-4">
                    <CheckCircle className="text-primary" size={32} />
                  </div>
                  <h3 className="text-2xl font-bold text-card-foreground mb-2">Demo Requested!</h3>
                  <p className="text-muted-foreground">
                    Your demo session request has been received. I'll contact you within 24 hours to confirm the
                    schedule.
                  </p>
                </div>
              ) : (
                <form onSubmit={handleSubmit} className="space-y-6">
                  <div>
                    <label htmlFor="name" className="block text-sm font-medium text-card-foreground mb-2">
                      Full Name <span className="text-primary">*</span>
                    </label>
                    <input
                      type="text"
                      id="name"
                      name="name"
                      value={formData.name}
                      onChange={handleChange}
                      required
                      className="w-full px-4 py-3 bg-background border border-border rounded-lg focus:outline-none focus:ring-2 focus:ring-primary text-foreground"
                      placeholder="Enter your full name"
                    />
                  </div>

<div>
                    <label htmlFor="email" className="block text-sm font-medium text-card-foreground mb-2">
                      Email Address <span className="text-primary">*</span>
                    </label>
                    <input
                      type="email"
                      id="email"
                      name="email"
                      value={formData.email}
                      onChange={handleChange}
                      required
                      className="w-full px-4 py-3 bg-background border border-border rounded-lg focus:outline-none focus:ring-2 focus:ring-primary text-foreground"
                      placeholder="your.email@example.com"
                    />
                  </div>

<div>
                    <label htmlFor="phone" className="block text-sm font-medium text-card-foreground mb-2">
                      Mobile Number <span className="text-primary">*</span>
                    </label>
                    <input
                      type="tel"
                      id="phone"
                      name="phone"
                      value={formData.phone}
                      onChange={handleChange}
                      required
                      pattern="[0-9]{10}"
                      className="w-full px-4 py-3 bg-background border border-border rounded-lg focus:outline-none focus:ring-2 focus:ring-primary text-foreground"
                      placeholder="9876543210"
                    />
                    <p className="text-xs text-muted-foreground mt-1">Enter 10-digit mobile number</p>
                  </div>

<div>
                    <label htmlFor="service" className="block text-sm font-medium text-card-foreground mb-2">
                      Service Interest <span className="text-primary">*</span>
                    </label>
                    <select
                      id="service"
                      name="service"
                      value={formData.service}
                      onChange={handleChange}
                      required
                      className="w-full px-4 py-3 bg-background border border-border rounded-lg focus:outline-none focus:ring-2 focus:ring-primary text-foreground"
                    >
                      <option value="">Select a service</option>
                      <option value="spoken-english">Spoken English Training</option>
                      <option value="accent-training">Accent Training & Neutralization</option>
                      <option value="email-writing">Professional Email Writing</option>
                      <option value="corporate">Corporate Training</option>
                      <option value="not-sure">Not Sure / Need Guidance</option>
                    </select>
                  </div>

<div className="grid grid-cols-1 sm:grid-cols-2 gap-4">
                    <div>
                      <label htmlFor="preferredDate" className="block text-sm font-medium text-card-foreground mb-2">
                        Preferred Date <span className="text-primary">*</span>
                      </label>
                      <input
                        type="date"
                        id="preferredDate"
                        name="preferredDate"
                        value={formData.preferredDate}
                        onChange={handleChange}
                        required
                        min={new Date().toISOString().split("T")[0]}
                        className="w-full px-4 py-3 bg-background border border-border rounded-lg focus:outline-none focus:ring-2 focus:ring-primary text-foreground"
                      />
                    </div>

<div>
                      <label htmlFor="preferredTime" className="block text-sm font-medium text-card-foreground mb-2">
                        Preferred Time <span className="text-primary">*</span>
                      </label>
                      <select
                        id="preferredTime"
                        name="preferredTime"
                        value={formData.preferredTime}
                        onChange={handleChange}
                        required
                        className="w-full px-4 py-3 bg-background border border-border rounded-lg focus:outline-none focus:ring-2 focus:ring-primary text-foreground"
                      >
                        <option value="">Select time</option>
                        <option value="morning">Morning (9 AM - 12 PM)</option>
                        <option value="afternoon">Afternoon (12 PM - 4 PM)</option>
                        <option value="evening">Evening (4 PM - 8 PM)</option>
                      </select>
                    </div>
                  </div>

<div>
                    <label className="block text-sm font-medium text-card-foreground mb-2">
                      Session Type <span className="text-primary">*</span>
                    </label>
                    <div className="flex gap-4">
                      <label className="flex items-center gap-2 cursor-pointer">
                        <input
                          type="radio"
                          name="sessionType"
                          value="online"
                          checked={formData.sessionType === "online"}
                          onChange={handleChange}
                          className="w-4 h-4 text-primary focus:ring-2 focus:ring-primary"
                        />
                        <span className="text-sm text-card-foreground">Online</span>
                      </label>
                      <label className="flex items-center gap-2 cursor-pointer">
                        <input
                          type="radio"
                          name="sessionType"
                          value="in-person"
                          checked={formData.sessionType === "in-person"}
                          onChange={handleChange}
                          className="w-4 h-4 text-primary focus:ring-2 focus:ring-primary"
                        />
                        <span className="text-sm text-card-foreground">In-Person</span>
                      </label>
                    </div>
                  </div>

<div>
                    <label htmlFor="message" className="block text-sm font-medium text-card-foreground mb-2">
                      Additional Information
                    </label>
                    <textarea
                      id="message"
                      name="message"
                      value={formData.message}
                      onChange={handleChange}
                      rows={4}
                      className="w-full px-4 py-3 bg-background border border-border rounded-lg focus:outline-none focus:ring-2 focus:ring-primary text-foreground resize-none"
                      placeholder="Tell me about your current English level and specific goals (optional)"
                    />
                  </div>

<button
                    type="submit"
                    disabled={isSubmitting}
                    className="w-full px-6 py-3 bg-primary text-white rounded-lg hover:bg-primary-hover transition-colors font-medium flex items-center justify-center gap-2 disabled:opacity-50 disabled:cursor-not-allowed"
                  >
                    {isSubmitting ? (
                      <>
                        <div className="w-5 h-5 border-2 border-white border-t-transparent rounded-full animate-spin" />
                        Submitting...
                      </>
                    ) : (
                      <>
                        <Calendar size={20} />
                        Request Demo Session
                      </>
                    )}
                  </button>

<p className="text-xs text-muted-foreground text-center">
                    By requesting a demo, you agree to be contacted to schedule your session.
                  </p>
                </form>
              )}
            </div>
          </div>
        </div>
      </section>

{/* Why Demo Section */}
      <section className="py-20 px-4 sm:px-6 lg:px-8 bg-muted">
        <div className="max-w-4xl mx-auto">
          <h2 className="text-3xl font-bold text-foreground mb-8 text-center">Why Book a Demo?</h2>
          <div className="grid grid-cols-1 md:grid-cols-3 gap-6">
            <div className="bg-card border border-border rounded-xl p-6 text-center">
              <div className="w-12 h-12 bg-primary/10 rounded-lg flex items-center justify-center mx-auto mb-4">
                <Users className="text-primary" size={24} />
              </div>
              <h3 className="text-lg font-bold text-card-foreground mb-2">Personalized Approach</h3>
              <p className="text-muted-foreground text-sm leading-relaxed">
                Experience my teaching style and see how I tailor lessons to individual learning needs.
              </p>
            </div>

<div className="bg-card border border-border rounded-xl p-6 text-center">
              <div className="w-12 h-12 bg-primary/10 rounded-lg flex items-center justify-center mx-auto mb-4">
                <CheckCircle className="text-primary" size={24} />
              </div>
              <h3 className="text-lg font-bold text-card-foreground mb-2">Clear Expectations</h3>
              <p className="text-muted-foreground text-sm leading-relaxed">
                Understand the program structure, timeline, and expected outcomes before committing.
              </p>
            </div>

<div className="bg-card border border-border rounded-xl p-6 text-center">
              <div className="w-12 h-12 bg-primary/10 rounded-lg flex items-center justify-center mx-auto mb-4">
                <Calendar className="text-primary" size={24} />
              </div>
              <h3 className="text-lg font-bold text-card-foreground mb-2">Risk-Free Trial</h3>
              <p className="text-muted-foreground text-sm leading-relaxed">
                No payment required. Experience the quality of training before making any decision.
              </p>
            </div>
          </div>
        </div>
      </section>

<Footer />
    </div>
  )
}
[V0_FILE]typescript:file="app/api/send-email/route.ts" isEdit="true" isQuickEdit="true" isMerged="true"
import { NextRequest, NextResponse } from 'next/server'
import { Resend } from 'resend'

const resend = new Resend(process.env.RESEND_API_KEY)

export async function POST(req: NextRequest) {
  try {
    const body = await req.json()
    
    const recipient = 'ritika@aspirefluence.com'

// Format the email content based on form type
    const isContactForm = body.requirement !== undefined
    const emailSubject = isContactForm 
      ? `New Contact Form Submission from ${body.name}`
      : `New Demo Request from ${body.name}`

const emailContent = isContactForm 
      ? `
Name: ${body.name}
Email: ${body.email}
Phone: ${body.phone}
Training Requirement: ${body.requirement}
      `
      : `
Name: ${body.name}
Email: ${body.email}
Phone: ${body.phone}
Service Interest: ${body.service}
Preferred Date: ${body.preferredDate}
Preferred Time: ${body.preferredTime}
Session Type: ${body.sessionType}
Additional Information: ${body.message || 'N/A'}
      `

const result = await resend.emails.send({
      from: 'Ritika Sidana Academy <onboarding@resend.dev>',
      to: recipient,
      subject: emailSubject,
      html: `<pre>${emailContent}</pre>`
    })
    
    if (result.error) {
      return NextResponse.json(
        { error: result.error.message },
        { status: 400 }
      )
    }

return NextResponse.json(
      { 
        message: 'Form submitted successfully',
        messageId: result.data?.id
      },
      { status: 200 }
    )
  } catch (error) {
    console.error('[v0] Error processing form:', error)
    return NextResponse.json(
      { error: 'Failed to process form' },
      { status: 500 }
    )
  }
}
[V0_FILE]xml:file="public/sitemap.xml" isMerged="true"
<?xml version="1.0" encoding="UTF-8"?>
<urlset
      xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"
      xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
      xsi:schemaLocation="http://www.sitemaps.org/schemas/sitemap/0.9
            http://www.sitemaps.org/schemas/sitemap/0.9/sitemap.xsd">

<url>
  <loc>https://www.aspirefluence.com/</loc>
  <lastmod>2025-11-18T06:42:45+00:00</lastmod>
  <priority>1.00</priority>
</url>
<url>
  <loc>https://www.aspirefluence.com/about</loc>
  <lastmod>2025-11-18T06:42:45+00:00</lastmod>
  <priority>0.80</priority>
</url>
<url>
  <loc>https://www.aspirefluence.com/services</loc>
  <lastmod>2025-11-18T06:42:45+00:00</lastmod>
  <priority>0.80</priority>
</url>
<url>
  <loc>https://www.aspirefluence.com/testimonials</loc>
  <lastmod>2025-11-18T06:42:45+00:00</lastmod>
  <priority>0.80</priority>
</url>
<url>
  <loc>https://www.aspirefluence.com/demo</loc>
  <lastmod>2025-11-18T06:42:45+00:00</lastmod>
  <priority>0.80</priority>
</url>
<url>
  <loc>https://www.aspirefluence.com/contact</loc>
  <lastmod>2025-11-18T06:42:45+00:00</lastmod>
  <priority>0.80</priority>
</url>

</urlset>
[V0_FILE]html:file="public/google25117a65189678d8.html" isMerged="true"
google-site-verification: google25117a65189678d8.html
[V0_FILE]typescriptreact:file="app/layout.tsx" isEdit="true" isMerged="true"
import type React from "react"
import type { Metadata } from "next"
import { Inter } from 'next/font/google'
import "./globals.css"

const inter = Inter({
  subsets: ["latin"],
  variable: "--font-inter",
})

export const metadata: Metadata = {
  title: "Ritika Sidana - Award-Winning English Trainer",
  description:
    "Professional English training for spoken English, accent training, and business communication. Transform your communication skills with personalized coaching.",
}

export default function RootLayout({
  children,
}: {
  children: React.ReactNode
}) {
  return (
    <html lang="en" className={inter.variable}>
      <head>
        <script async src="https://www.googletagmanager.com/gtag/js?id=G-SC4L4PVL8J"></script>
        <script>
          {`
            window.dataLayer = window.dataLayer || [];
            function gtag(){dataLayer.push(arguments);}
            gtag('js', new Date());
            gtag('config', 'G-SC4L4PVL8J');
          `}
        </script>
      </head>
      <body className="antialiased">{children}</body>
    </html>
  )
}
[V0_FILE]png:file="public/aspirefluence-logo.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/AspireFluenceLogo-S3QOiBrGgROFg6o2Rsag0f0ei7FF6z.png" isMerged="true"
[V0_FILE]typescriptreact:file="components/navigation.tsx" isEdit="true" isQuickEdit="true" isMerged="true"
"use client"

import Link from "next/link"
import { useState } from "react"
import { Menu, X } from 'lucide-react'
import Image from "next/image"

export function Navigation() {
  const [isOpen, setIsOpen] = useState(false)

const navItems = [
    { href: "/", label: "Home" },
    { href: "/about", label: "About" },
    { href: "/services", label: "Services" },
    { href: "/testimonials", label: "Testimonials" },
    { href: "/demo", label: "Book Demo" },
    { href: "/contact", label: "Contact" },
  ]

return (
    <nav className="fixed top-0 left-0 right-0 z-50 bg-white border-b border-cyan-100 shadow-sm">
      <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 h-[80px]">
        <div className="flex items-center justify-between h-16">
          {/* Logo */}
          <Link href="/" className="flex items-center gap-2">
            <Image
              src="/aspirefluence-logo.png"
              alt="Aspirefluence - English Training"
              width={560}
              height={240}
              className="w-auto h-[240px] drop-shadow-md"
            />
          </Link>

{/* Desktop Navigation */}
          <div className="hidden md:flex items-center gap-1">
            {navItems.map((item) => (
              <Link
                key={item.href}
                href={item.href}
                className="px-3 py-2 text-sm font-medium text-foreground hover:text-primary hover:bg-cyan-50 rounded-md transition-all"
              >
                {item.label}
              </Link>
            ))}
          </div>

{/* CTA Button */}
          <div className="hidden md:flex items-center gap-4">
            <Link
              href="/demo"
              className="px-5 py-2 bg-primary text-white rounded-lg hover:bg-primary/90 transition-colors text-sm font-medium"
            >
              Book Demo
            </Link>
          </div>

{/* Mobile Menu Button */}
          <button onClick={() => setIsOpen(!isOpen)} className="md:hidden p-2 text-foreground" aria-label="Toggle menu">
            {isOpen ? <X size={24} /> : <Menu size={24} />}
          </button>
        </div>

{/* Mobile Navigation */}
        {isOpen && (
          <div className="md:hidden py-4 border-t border-cyan-100 bg-cyan-50">
            <div className="flex flex-col gap-2">
              {navItems.map((item) => (
                <Link
                  key={item.href}
                  href={item.href}
                  onClick={() => setIsOpen(false)}
                  className="px-4 py-2 text-sm font-medium text-foreground hover:text-primary hover:bg-primary/5 rounded-md transition-all"
                >
                  {item.label}
                </Link>
              ))}
              <Link
                href="/demo"
                onClick={() => setIsOpen(false)}
                className="mx-4 px-4 py-2 bg-primary text-white rounded-lg hover:bg-primary/90 transition-colors text-sm font-medium text-center"
              >
                Book Demo
              </Link>
            </div>
          </div>
        )}
      </div>
    </nav>
  )
}
[V0_FILE]typescriptreact:file="components/footer.tsx" isEdit="true" isQuickEdit="true" isMerged="true"
import Link from "next/link"
import { Mail, Phone, Linkedin, Youtube } from 'lucide-react'
import Image from "next/image"

export function Footer() {
  return (
    <footer className="bg-muted border-t border-border">
      <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-12">
        <div className="grid grid-cols-1 md:grid-cols-3 gap-8">
          {/* About Section */}
          <div>
            <div className="flex items-center gap-2 mb-4">
              <Image
                src="/aspirefluence-logo.png"
                alt="Aspirefluence Logo"
                width={480}
                height={200}
                className="w-auto h-[200px] drop-shadow-md"
              />
            </div>
            <p className="text-sm text-muted-foreground leading-relaxed">
              Award-winning English trainer specializing in spoken English, accent training, and professional
              communication.
            </p>
          </div>

{/* Quick Links */}
          <div>
            <h3 className="text-lg font-bold text-foreground mb-4">Quick Links</h3>
            <div className="flex flex-col gap-2">
              <Link href="/about" className="text-sm text-muted-foreground hover:text-primary transition-colors">
                About Me
              </Link>
              <Link href="/services" className="text-sm text-muted-foreground hover:text-primary transition-colors">
                Services
              </Link>
              <Link href="/testimonials" className="text-sm text-muted-foreground hover:text-primary transition-colors">
                Testimonials
              </Link>
              <Link href="/contact" className="text-sm text-muted-foreground hover:text-primary transition-colors">
                Contact
              </Link>
            </div>
          </div>

{/* Contact Info */}
          <div>
            <h3 className="text-lg font-bold text-foreground mb-4">Get in Touch</h3>
            <div className="flex flex-col gap-3">
              <a
                href="mailto:ritikacoach.training@gmail.com"
                className="flex items-center gap-2 text-sm text-muted-foreground hover:text-primary transition-colors"
              >
                <Mail size={16} />
                ritikacoach.training@gmail.com
              </a>
              <a
                href="tel:+916284300188"
                className="flex items-center gap-2 text-sm text-muted-foreground hover:text-primary transition-colors"
              >
                <Phone size={16} />
                +91 6284300188
              </a>
              <div className="flex items-center gap-4 mt-2">
                <a
                  href="https://www.linkedin.com/in/ritika-sidana-672616380/"
                  target="_blank"
                  rel="noopener noreferrer"
                  className="text-muted-foreground hover:text-primary transition-colors"
                  aria-label="LinkedIn"
                >
                  <Linkedin size={20} />
                </a>
                <a
                  href="https://youtube.com"
                  target="_blank"
                  rel="noopener noreferrer"
                  className="text-muted-foreground hover:text-primary transition-colors"
                  aria-label="YouTube"
                >
                  <Youtube size={20} />
                </a>
              </div>
            </div>
          </div>
        </div>

<div className="mt-8 pt-8 border-t border-border text-center">
          <p className="text-sm text-muted-foreground">
            © {new Date().getFullYear()} Aspirefluence. All rights reserved.
          </p>
        </div>
      </div>
    </footer>
  )
}
[V0_FILE]jpg:file="public/images/ritika-pic1.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/Ritika_Pic1-uqzxYJkqm1jujTbzDoWLiV4Np2yPli.jpg" isMerged="true"
[V0_FILE]typescriptreact:file="app/page.tsx" isEdit="true" isQuickEdit="true" isMerged="true"
import Link from "next/link"
import { ArrowRight, CheckCircle, Users, Award, BookOpen, Zap } from "lucide-react"
import { Navigation } from "@/components/navigation"
import { Footer } from "@/components/footer"

export default function HomePage() {
  return (
    <div className="min-h-screen flex flex-col">
      <Navigation />

<section className="pt-32 pb-16 px-4 sm:px-6 lg:px-8 bg-gradient-to-br from-cyan-50 to-emerald-50">
        <div className="max-w-7xl mx-auto">
          <div className="grid grid-cols-1 lg:grid-cols-2 gap-12 items-center">
            {/* Left Content */}
            <div className="space-y-8">
              <div className="space-y-4">
                <div className="inline-block px-4 py-2 bg-primary/10 text-primary rounded-full text-sm font-semibold">
                  ✓ Award-Winning English Trainer
                </div>
                <h1 className="text-5xl sm:text-6xl font-bold text-foreground leading-tight text-balance">
                  Master Professional English
                </h1>
                <p className="text-xl text-muted-foreground leading-relaxed">
                  Transform your communication skills with personalized training from an experienced educator.
                  Specializing in spoken English, accent training, and professional writing.
                </p>
              </div>

{/* Key Benefits */}
              <div className="space-y-3">
                {[
                  "1-on-1 personalized coaching",
                  "Proven results in 8-12 weeks",
                  "Corporate & individual programs",
                ].map((benefit, i) => (
                  <div key={i} className="flex items-center gap-3">
                    <CheckCircle className="text-primary flex-shrink-0" size={20} />
                    <span className="text-foreground font-medium">{benefit}</span>
                  </div>
                ))}
              </div>

{/* CTA Buttons */}
              <div className="flex flex-col sm:flex-row gap-4 pt-4">
                <Link
                  href="/demo"
                  className="inline-flex items-center justify-center gap-2 px-8 py-4 bg-primary text-white rounded-lg hover:bg-primary/90 transition-all font-semibold text-lg shadow-lg hover:shadow-xl"
                >
                  Book Free Demo
                  <ArrowRight size={20} />
                </Link>
                <Link
                  href="/services"
                  className="inline-flex items-center justify-center gap-2 px-8 py-4 border-2 border-primary text-primary rounded-lg hover:bg-primary/5 transition-all font-semibold text-lg"
                >
                  Explore Programs
                </Link>
              </div>
            </div>

{/* Right Image */}
            <div className="relative">
              <div className="aspect-square rounded-2xl overflow-hidden bg-gray-200 shadow-2xl">
                <img
                  src="/ritika-laptop-working.png"
                  alt="Ritika Sidana - English Trainer working on laptop"
                  className="w-full h-full object-cover"
                />
              </div>
            </div>
          </div>
        </div>
      </section>

<section className="py-16 px-4 sm:px-6 lg:px-8 bg-white">
        <div className="max-w-7xl mx-auto">
          <div className="grid grid-cols-1 sm:grid-cols-3 gap-8">
            {[
              { icon: Users, label: "Students Trained", value: "150+" },
              { icon: Award, label: "Awards Won", value: "10+" },
              { icon: BookOpen, label: "Corporate Clients", value: "50+" },
            ].map((stat, i) => (
              <div
                key={i}
                className="bg-gradient-to-br from-cyan-50 to-emerald-50 rounded-xl p-8 text-center border border-cyan-200 hover:shadow-lg hover:border-primary transition-all"
              >
                <div className="inline-flex items-center justify-center w-14 h-14 bg-primary/10 rounded-lg mb-4">
                  <stat.icon className="text-primary" size={28} />
                </div>
                <p className="text-4xl font-bold text-foreground mb-2">{stat.value}</p>
                <p className="text-muted-foreground font-medium">{stat.label}</p>
              </div>
            ))}
          </div>
        </div>
      </section>

<section className="py-20 px-4 sm:px-6 lg:px-8 bg-gradient-to-br from-gray-50 to-white">
        <div className="max-w-7xl mx-auto">
          <div className="text-center mb-16">
            <h2 className="text-4xl sm:text-5xl font-bold text-foreground mb-4 text-balance">Our Training Programs</h2>
            <p className="text-xl text-muted-foreground max-w-2xl mx-auto">
              Comprehensive programs designed to meet your specific communication goals
            </p>
          </div>

<div className="grid grid-cols-1 md:grid-cols-3 gap-8">
            {[
              {
                icon: Zap,
                title: "Spoken English",
                description:
                  "Build fluency and confidence in conversations, presentations, and professional interactions.",
                features: ["Conversation practice", "Presentation skills", "Confidence building"],
                bgColor: "from-cyan-50 to-teal-50",
                iconColor: "text-cyan-600",
                borderColor: "border-cyan-200",
              },
              {
                icon: Users,
                title: "Accent Training",
                description:
                  "Develop a neutral accent and improve pronunciation for clear, professional communication.",
                features: ["Pronunciation coaching", "Accent reduction", "Clarity improvement"],
                bgColor: "from-orange-50 to-amber-50",
                iconColor: "text-orange-600",
                borderColor: "border-orange-200",
              },
              {
                icon: BookOpen,
                title: "Email Writing",
                description:
                  "Master professional email etiquette and business writing for effective corporate communication.",
                features: ["Email structure", "Professional tone", "Business writing"],
                bgColor: "from-purple-50 to-violet-50",
                iconColor: "text-purple-600",
                borderColor: "border-purple-200",
              },
            ].map((service, i) => (
              <div
                key={i}
                className={`bg-gradient-to-br ${service.bgColor} rounded-xl p-8 border ${service.borderColor} hover:shadow-lg transition-all`}
              >
                <div
                  className={`w-12 h-12 bg-opacity-20 rounded-lg flex items-center justify-center mb-4 ${service.iconColor.replace("text", "bg")}`}
                >
                  <service.icon className={service.iconColor} size={24} />
                </div>
                <h3 className="text-2xl font-bold text-foreground mb-3">{service.title}</h3>
                <p className="text-muted-foreground leading-relaxed mb-6">{service.description}</p>
                <ul className="space-y-2 mb-6">
                  {service.features.map((feature, j) => (
                    <li key={j} className="flex items-center gap-2 text-sm text-foreground">
                      <div className="w-1.5 h-1.5 bg-primary rounded-full" />
                      {feature}
                    </li>
                  ))}
                </ul>
                <Link
                  href="/services"
                  className="inline-flex items-center gap-2 text-primary font-semibold hover:gap-3 transition-all"
                >
                  Learn more
                  <ArrowRight size={16} />
                </Link>
              </div>
            ))}
          </div>
        </div>
      </section>

<section className="py-20 px-4 sm:px-6 lg:px-8 bg-primary text-white">
        <div className="max-w-4xl mx-auto text-center">
          <h2 className="text-4xl sm:text-5xl font-bold mb-6 text-balance">Ready to Transform Your English Skills?</h2>
          <p className="text-xl mb-8 opacity-95">
            Join hundreds of professionals and students who have improved their communication with personalized
            training.
          </p>
          <div className="flex flex-col sm:flex-row gap-4 justify-center">
            <Link
              href="/demo"
              className="inline-flex items-center justify-center gap-2 px-8 py-4 bg-white text-primary rounded-lg hover:bg-gray-100 transition-colors font-semibold text-lg"
            >
              Book Your Free Demo
              <ArrowRight size={20} />
            </Link>
            <Link
              href="/contact"
              className="inline-flex items-center justify-center gap-2 px-8 py-4 border-2 border-white text-white rounded-lg hover:bg-white/10 transition-colors font-semibold text-lg"
            >
              Get in Touch
            </Link>
          </div>
        </div>
      </section>

<Footer />
    </div>
  )
}
[V0_FILE]typescriptreact:file="app/testimonials/page.tsx" isEdit="true" isQuickEdit="true" isMerged="true"
import { Navigation } from "@/components/navigation"
import { Footer } from "@/components/footer"
import { Star, Quote, Briefcase, GraduationCap, Building2 } from "lucide-react"

const testimonials = [
  {
    name: "Priya Sharma",
    role: "Software Engineer",
    company: "Tech Solutions Inc.",
    image: "/indian-woman-software-engineer-professional-headsh.jpg",
    rating: 5,
    text: "Ritika's accent training program transformed my communication skills. I now feel confident presenting to international clients and my colleagues have noticed a significant improvement in my clarity and pronunciation.",
    category: "corporate",
  },
  {
    name: "Rahul Verma",
    role: "MBA Student",
    company: "IIM Bangalore",
    image: "/indian-male-mba-student-professional-headshot.jpg",
    rating: 5,
    text: "The spoken English course helped me ace my job interviews. Ritika's personalized approach and practical exercises made learning enjoyable and effective. Highly recommend for students!",
    category: "student",
  },
  {
    name: "Anjali Desai",
    role: "HR Manager",
    company: "Global Enterprises",
    image: "/indian-woman-hr-manager-professional-headshot.jpg",
    rating: 5,
    text: "We hired Ritika for corporate training for our team of 30 employees. The improvement in their email writing and presentation skills was remarkable. Professional, punctual, and results-driven!",
    category: "corporate",
  },
  {
    name: "Vikram Singh",
    role: "Business Owner",
    company: "Singh Consultancy",
    image: "/indian-male-business-owner-professional-headshot.jpg",
    rating: 5,
    text: "Ritika's business communication training helped me communicate more effectively with my international clients. Her focus on practical scenarios and real-world applications made all the difference.",
    category: "professional",
  },
  {
    name: "Meera Patel",
    role: "College Student",
    company: "Delhi University",
    image: "/indian-female-college-student-professional-headsho.jpg",
    rating: 5,
    text: "I was always nervous speaking English in public. After completing Ritika's course, I can confidently participate in class discussions and presentations. She's patient, encouraging, and truly cares about her students.",
    category: "student",
  },
  {
    name: "Arjun Reddy",
    role: "Marketing Manager",
    company: "Digital Marketing Pro",
    image: "/indian-male-marketing-manager-professional-headsho.jpg",
    rating: 5,
    text: "The email writing course was exactly what I needed. Ritika taught me how to write professional, concise emails that get responses. My communication with clients has improved significantly.",
    category: "corporate",
  },
]

export default function TestimonialsPage() {
  return (
    <div className="min-h-screen flex flex-col">
      <Navigation />

{/* Hero Section */}
      <section className="pt-32 pb-16 px-4 sm:px-6 lg:px-8">
        <div className="max-w-4xl mx-auto text-center">
          <h1 className="text-4xl sm:text-5xl font-bold text-foreground mb-6 text-balance">What My Students Say</h1>
          <p className="text-xl text-muted-foreground leading-relaxed">
            Real stories from students and professionals who transformed their English communication skills
          </p>
        </div>
      </section>

{/* Stats Section */}
      <section className="pb-16 px-4 sm:px-6 lg:px-8">
        <div className="max-w-6xl mx-auto">
          <div className="grid grid-cols-1 sm:grid-cols-3 gap-6">
            <div className="bg-muted rounded-xl p-6 text-center">
              <div className="inline-flex items-center justify-center w-12 h-12 bg-primary/10 rounded-lg mb-3">
                <Star className="text-primary" size={24} />
              </div>
              <p className="text-3xl font-bold text-foreground mb-1">4.9/5</p>
              <p className="text-muted-foreground">Average Rating</p>
            </div>
            <div className="bg-muted rounded-xl p-6 text-center">
              <div className="inline-flex items-center justify-center w-12 h-12 bg-primary/10 rounded-lg mb-3">
                <GraduationCap className="text-primary" size={24} />
              </div>
              <p className="text-3xl font-bold text-foreground mb-1">150+</p>
              <p className="text-muted-foreground">Happy Students</p>
            </div>
            <div className="bg-muted rounded-xl p-6 text-center">
              <div className="inline-flex items-center justify-center w-12 h-12 bg-primary/10 rounded-lg mb-3">
                <Building2 className="text-primary" size={24} />
              </div>
              <p className="text-3xl font-bold text-foreground mb-1">50+</p>
              <p className="text-muted-foreground">Corporate Clients</p>
            </div>
          </div>
        </div>
      </section>

{/* Testimonials Grid */}
      <section className="pb-20 px-4 sm:px-6 lg:px-8">
        <div className="max-w-6xl mx-auto">
          <div className="grid grid-cols-1 md:grid-cols-2 gap-8">
            {testimonials.map((testimonial, index) => (
              <div
                key={index}
                className="bg-card border border-border rounded-xl p-6 hover:shadow-lg transition-shadow"
              >
                {/* Quote Icon */}
                <div className="w-10 h-10 bg-primary/10 rounded-lg flex items-center justify-center mb-4">
                  <Quote className="text-primary" size={20} />
                </div>

{/* Rating */}
                <div className="flex items-center gap-1 mb-4">
                  {[...Array(testimonial.rating)].map((_, i) => (
                    <Star key={i} className="text-primary fill-primary" size={16} />
                  ))}
                </div>

{/* Testimonial Text */}
                <p className="text-muted-foreground leading-relaxed mb-6">{testimonial.text}</p>

{/* Author Info */}
                <div className="flex items-center gap-4 pt-4 border-t border-border">
                  <div className="w-12 h-12 rounded-full overflow-hidden bg-muted flex-shrink-0">
                    <img
                      src={testimonial.image || "/placeholder.svg"}
                      alt={testimonial.name}
                      className="w-full h-full object-cover"
                    />
                  </div>
                  <div>
                    <p className="font-bold text-card-foreground">{testimonial.name}</p>
                    <p className="text-sm text-muted-foreground">
                      {testimonial.role} • {testimonial.company}
                    </p>
                  </div>
                </div>
              </div>
            ))}
          </div>
        </div>
      </section>

{/* Category Highlights */}
      <section className="py-20 px-4 sm:px-6 lg:px-8 bg-muted">
        <div className="max-w-6xl mx-auto">
          <div className="text-center mb-12">
            <h2 className="text-3xl font-bold text-foreground mb-4">Trusted by Diverse Learners</h2>
            <p className="text-lg text-muted-foreground">
              From students to corporate professionals, everyone benefits from personalized training
            </p>
          </div>

<div className="grid grid-cols-1 md:grid-cols-3 gap-8">
            <div className="bg-card border border-border rounded-xl p-6 text-center">
              <div className="inline-flex items-center justify-center w-12 h-12 bg-primary/10 rounded-lg mb-4">
                <GraduationCap className="text-primary" size={24} />
              </div>
              <h3 className="text-xl font-bold text-card-foreground mb-2">Students</h3>
              <p className="text-muted-foreground leading-relaxed">
                College students and young professionals building confidence for academic and career success
              </p>
            </div>

<div className="bg-card border border-border rounded-xl p-6 text-center">
              <div className="inline-flex items-center justify-center w-12 h-12 bg-primary/10 rounded-lg mb-4">
                <Briefcase className="text-primary" size={24} />
              </div>
              <h3 className="text-xl font-bold text-card-foreground mb-2">Professionals</h3>
              <p className="text-muted-foreground leading-relaxed">
                Working professionals enhancing communication skills for career advancement and global opportunities
              </p>
            </div>

<div className="bg-card border border-border rounded-xl p-6 text-center">
              <div className="inline-flex items-center justify-center w-12 h-12 bg-primary/10 rounded-lg mb-4">
                <Building2 className="text-primary" size={24} />
              </div>
              <h3 className="text-xl font-bold text-card-foreground mb-2">Corporates</h3>
              <p className="text-muted-foreground leading-relaxed">
                Organizations investing in employee development for better team communication and productivity
              </p>
            </div>
          </div>
        </div>
      </section>

{/* CTA Section */}
      <section className="py-20 px-4 sm:px-6 lg:px-8">
        <div className="max-w-4xl mx-auto text-center">
          <h2 className="text-3xl sm:text-4xl font-bold text-foreground mb-4 text-balance">
            Join Hundreds of Successful Learners
          </h2>
          <p className="text-lg text-muted-foreground mb-8">
            Start your journey to confident English communication today
          </p>
          <a
            href="/contact"
            className="inline-flex items-center gap-2 px-8 py-4 bg-primary text-white rounded-lg hover:bg-primary-hover transition-colors font-medium text-lg"
          >
            Request Training
          </a>
        </div>
      </section>

<Footer />
    </div>
  )
}
[V0_FILE]typescriptreact:file="app/about/page.tsx" isEdit="true" isQuickEdit="true"
import { Navigation } from "@/components/navigation"
import { Footer } from "@/components/footer"
import { Target, Heart, Sparkles } from "lucide-react"

export default function AboutPage() {
  return (
    <div className="min-h-screen flex flex-col">
      <Navigation />

{/* Hero Section */}
      <section className="pt-32 pb-16 px-4 sm:px-6 lg:px-8">
        <div className="max-w-4xl mx-auto text-center">
          <h1 className="text-4xl sm:text-5xl font-bold text-foreground mb-6 text-balance">About Ritika Sidana</h1>
          <p className="text-xl text-muted-foreground leading-relaxed">
            Empowering individuals and organizations through effective English communication training
          </p>
        </div>
      </section>

{/* Main Content */}
      <section className="pb-20 px-4 sm:px-6 lg:px-8">
        <div className="max-w-6xl mx-auto">
          <div className="grid grid-cols-1 lg:grid-cols-2 gap-12 items-start mb-20">
            {/* Image */}
            <div className="relative">
              <div className="aspect-[4/5] rounded-2xl overflow-hidden bg-muted">
                <img
                  src="/images/ritika-pic1.jpg"
                  alt="Ritika Sidana - Professional Portrait"
                  className="w-full h-full object-cover"
                />
              </div>
            </div>

{/* Content */}
            <div className="space-y-6">
              <div>
                <h2 className="text-3xl font-bold text-foreground mb-4">My Journey</h2>
                <div className="space-y-4 text-muted-foreground leading-relaxed">
                  <p>
                    With over 10 years of experience in English language training, I have dedicated my career to helping
                    students, professionals, and organizations communicate with clarity and confidence.
                  </p>
                  <p>
                    My journey began with a passion for language and a belief that effective communication is the
                    cornerstone of personal and professional success. Over the years, I have trained more than 150
                    students and worked with 50+ corporate clients across various industries.
                  </p>
                  <p>
                    I specialize in spoken English, accent training, and professional business communication. My
                    teaching methodology combines practical exercises, real-world scenarios, and personalized feedback
                    to ensure measurable improvement in every session.
                  </p>
                </div>
              </div>

{/* Quick Stats */}
              <div className="grid grid-cols-2 gap-4 pt-6">
                <div className="bg-muted rounded-lg p-4">
                  <p className="text-3xl font-bold text-foreground mb-1">10+</p>
                  <p className="text-sm text-muted-foreground">Years Teaching</p>
                </div>
                <div className="bg-muted rounded-lg p-4">
                  <p className="text-3xl font-bold text-foreground mb-1">150+</p>
                  <p className="text-sm text-muted-foreground">Students Trained</p>
                </div>
                <div className="bg-muted rounded-lg p-4">
                  <p className="text-3xl font-bold text-foreground mb-1">50+</p>
                  <p className="text-sm text-muted-foreground">Corporate Clients</p>
                </div>
                <div className="bg-muted rounded-lg p-4">
                  <p className="text-3xl font-bold text-foreground mb-1">10+</p>
                  <p className="text-sm text-muted-foreground">Awards Won</p>
                </div>
              </div>
            </div>
          </div>

{/* Teaching Philosophy */}
          <div className="mb-20">
            <h2 className="text-3xl font-bold text-foreground mb-8 text-center">My Teaching Philosophy</h2>
            <div className="grid grid-cols-1 md:grid-cols-3 gap-8">
              <div className="bg-card border border-border rounded-xl p-6">
                <div className="w-12 h-12 bg-primary/10 rounded-lg flex items-center justify-center mb-4">
                  <Target className="text-primary" size={24} />
                </div>
                <h3 className="text-xl font-bold text-card-foreground mb-3">Personalized Approach</h3>
                <p className="text-muted-foreground leading-relaxed">
                  Every learner is unique. I tailor my teaching methods to match individual learning styles, goals, and
                  pace to ensure maximum effectiveness.
                </p>
              </div>

<div className="bg-card border border-border rounded-xl p-6">
                <div className="w-12 h-12 bg-primary/10 rounded-lg flex items-center justify-center mb-4">
                  <Heart className="text-primary" size={24} />
                </div>
                <h3 className="text-xl font-bold text-card-foreground mb-3">Practical Learning</h3>
                <p className="text-muted-foreground leading-relaxed">
                  I focus on real-world applications through interactive exercises, role-plays, and scenarios that
                  mirror actual communication challenges.
                </p>
              </div>

<div className="bg-card border border-border rounded-xl p-6">
                <div className="w-12 h-12 bg-primary/10 rounded-lg flex items-center justify-center mb-4">
                  <Sparkles className="text-primary" size={24} />
                </div>
                <h3 className="text-xl font-bold text-card-foreground mb-3">Continuous Growth</h3>
                <p className="text-muted-foreground leading-relaxed">
                  Learning is a journey, not a destination. I provide ongoing support and feedback to help you
                  continuously improve and build lasting confidence.
                </p>
              </div>
            </div>
          </div>

{/* Expertise Areas */}
          <div>
            <h2 className="text-3xl font-bold text-foreground mb-8 text-center">Areas of Expertise</h2>
            <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4">
              {[
                "Spoken English for Professionals",
                "Accent Neutralization",
                "Business Email Writing",
                "Presentation Skills",
                "Interview Preparation",
                "Corporate Communication",
                "Grammar & Vocabulary",
                "Pronunciation Training",
                "Confidence Building",
              ].map((expertise) => (
                <div
                  key={expertise}
                  className="flex items-center gap-3 bg-card border border-border rounded-lg p-4 hover:border-primary transition-colors"
                >
                  <div className="w-2 h-2 bg-primary rounded-full flex-shrink-0" />
                  <span className="text-card-foreground font-medium">{expertise}</span>
                </div>
              ))}
            </div>
          </div>
        </div>
      </section>