"use client" import { useState } from "react" import { motion } from "framer-motion" import { fadeIn, slideUp, stagger, staggerItem, cardHoverTarget, buttonTapTarget } from "@/lib/animations" import { Button } from "@/components/ui/button" import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card" import { Input } from "@/components/ui/input" import { Badge } from "@/components/ui/badge" import { Separator } from "@/components/ui/separator" import { cn } from "@/lib/utils" import { Compass, Users, Plane, Hotel, MapPin, Calendar, Plus, Minus, Check, ArrowRight, Mail, User, Percent, Gift, } from "lucide-react" export default function GroupBooking() { const [travelers, setTravelers] = useState(5) const [step, setStep] = useState(0) return (

Group Travel

Group{" "} Booking

Book for 10+ travelers and save up to 25%

Trip Details

Destination

Departure City

Departure Date

Return Date

Number of Travelers

travelers

Group Discount Applied

10-19 travelers: 15% off

20-49 travelers: 20% off

50+ travelers: 25% off

Group Benefits

{["Dedicated group coordinator", "Flexible payment plan", "Free cancellation up to 30 days"].map((b) => (

{b}

))}

) }

Group Booking

Group Booking

Group Booking