{/* Hero Section */}

Creative Design Studio We design digital experiences that people{" "} love Our award-winning team crafts beautiful, functional designs that drive growth and engagement.

{/* Client Logos */}

Trusted by Our Clients We've had the pleasure of working with some amazing companies

{[...Array(6)].map((_, i) => (

))}

{/* Services Section */}

Services What We Do We offer a comprehensive range of design and development services to help your business thrive

{[ { icon: , title: "UI/UX Design", description: "We create intuitive, engaging user experiences that delight your customers and drive conversions.", }, { icon:

,
                  title: "Web Development",
                  description:
                    "Our developers build fast, responsive, and accessible websites that work across all devices.",
                },
                {
                  icon: ,
                  title: "Brand Identity",
                  description:
                    "We craft distinctive brand identities that communicate your values and resonate with your audience.",
                },
                {
                  icon: ,
                  title: "Mobile Apps",
                  description: "We design and develop native and cross-platform mobile applications that users love.",
                },
                {
                  icon: ,
                  title: "Digital Marketing",
                  description:
                    "We help you reach your target audience and grow your business with data-driven marketing strategies.",
                },
                {
                  icon: ,
                  title: "Content Creation",
                  description: "We produce engaging content that tells your story and connects with your customers.",
                },
              ].map((service, index) => (
                
                  
                  
                    {service.icon}
                    {service.title}
                    {service.description}
                  
                  
                    
                      Learn more
                    
                    
                      
                    
                  
                
              ))}



        {/* Portfolio/Work Bento Grid */}
        
          
            
              
                
                  Portfolio
                
                
                  Our Work
                
                
                  A showcase of our recent projects and collaborations
                
              
            
            
              {/* Bento Grid Items */}
              
                
                
                
                  E-commerce Redesign
                  A complete overhaul of an online retail platform
                  
                    
                  
                
              
              
                
                
                
                  Mobile App Design
                  UI/UX for a fitness tracking application
                
              
              
                
                
                
                  Brand Identity
                  Complete rebrand for a tech startup
                
              
              
                
                
                
                  Web Application
                  Dashboard design for a SaaS platform
                
              
              
                
                
                
                  Marketing Campaign
                  Integrated digital campaign for product launch
                
              
            
            
              
                
              
            
          
        

        {/* About/Team Section */}
        
          
            
              
                About Us
                Our Story
                
                  Founded in 2015, our design studio has grown from a small team of passionate designers to a
                  full-service creative agency. We believe in the power of design to transform businesses and create
                  meaningful connections with audiences.
                
                
                  Our approach combines strategic thinking, creative excellence, and technical expertise to deliver
                  solutions that not only look beautiful but also drive results.
                
                
                  
                  
                
              
              
                
                  
                
              
            
            
              
                Meet Our Team
              
              
                {[
                  { name: "Alex Johnson", role: "Creative Director" },
                  { name: "Sam Taylor", role: "Lead Designer" },
                  { name: "Jordan Smith", role: "Senior Developer" },
                  { name: "Casey Brown", role: "Project Manager" },
                ].map((member, index) => (
                  
                    
                    
                      {member.name}
                      {member.role}
                    
                  
                ))}
              
            
          
        

        {/* Testimonials */}
        
          
            
              
                
                  Testimonials
                
                
                  What Our Clients Say
                
                
                  Don't just take our word for it - hear from some of our satisfied clients
                
              
            
            
              {[
                {
                  quote:
                    "Working with this team transformed our brand. They understood our vision perfectly and delivered beyond our expectations.",
                  author: "Sarah Johnson",
                  company: "CEO, TechStart",
                },
                {
                  quote:
                    "The attention to detail and creative solutions provided by the team helped us increase our conversion rate by 40%.",
                  author: "Michael Chen",
                  company: "Marketing Director, GrowthCo",
                },
                {
                  quote:
                    "Their strategic approach to design not only improved our user experience but also strengthened our brand identity.",
                  author: "Emma Rodriguez",
                  company: "Product Manager, InnovateLabs",
                },
                {
                  quote:
                    "From concept to execution, the team demonstrated exceptional skill and professionalism. Highly recommended!",
                  author: "David Kim",
                  company: "Founder, NextWave",
                },
              ].map((testimonial, index) => (
                
                  
                    
                      {[...Array(5)].map((_, i) => (
                        
                      ))}
                    
                    "{testimonial.quote}"
                  
                  
                    
                    
                      {testimonial.author}
                      {testimonial.company}
                    
                  
                
              ))}
            
          
        

        {/* Contact Section */}
        
          
            
              Contact
              Let's Work Together
              
                Ready to start your next project? Get in touch with us to discuss how we can help bring your vision to
                life.
              
              
                
                  
                    
                  
                  
                    Our Location
                    123 Design Street, Creative City, 10001
                  
                
                
                  
                    
                  
                  
                    Email Us
                    hello@designstudio.com
                  
                
                
                  
                    
                  
                  
                    Call Us
                    +1 (555) 123-4567
                  
                
              
              
                {[
                  { icon: , label: "Instagram" },
                  { icon: , label: "Twitter" },
                  { icon: , label: "LinkedIn" },
                  { icon: , label: "Facebook" },
                ].map((social, index) => (
                  
                    
                      {social.icon}
                      {social.label}
                    
                  
                ))}
              
            
            
              Send Us a Message
              
                Fill out the form below and we'll get back to you shortly.
              
              
                
                  
                    
                      First name
                    
                    
                  
                  
                    
                      Last name
                    
                    
                  
                
                
                  
                    Email
                  
                  
                
                
                  
                    Message
                  
                                  </div>
                <motion.div whileHover={{ scale: 1.02 }} whileTap={{ scale: 0.98 }}>
                  <Button type="submit" className="w-full rounded-3xl">
                    Send Message
                  </Button>
                </motion.div>
              </form>
            </motion.div>
          </motion.div>
        </section>
      </main>

      {/* Footer */}
      <footer className="w-full border-t">
        <motion.div
          initial="hidden"
          whileInView="visible"
          viewport={{ once: true }}
          variants={fadeIn}
          className="container grid gap-3 px-4 py-10 md:px-6 lg:grid-cols-4 border-x border-muted"
        >
          <div className="space-y-3">
            <Link href="/" className="flex items-center space-x-3">
              <motion.div
                whileHover={{ rotate: 5, scale: 1.1 }}
                transition={{ type: "spring", stiffness: 400, damping: 10 }}
                className="h-10 w-10 rounded-3xl bg-primary flex items-center justify-center"
              >
                <Sparkles className="h-5 w-5 text-primary-foreground" />
              </motion.div>
              <span className="font-bold text-xl">Studio</span>
            </Link>
            <p className="text-sm text-muted-foreground">
              We create beautiful, functional designs that help businesses grow and connect with their audience.
            </p>
            <div className="flex space-x-3">
              {[
                { icon: <Instagram className="h-5 w-5" />, label: "Instagram" },
                { icon: <Twitter className="h-5 w-5" />, label: "Twitter" },
                { icon: <Linkedin className="h-5 w-5" />, label: "LinkedIn" },
                { icon: <Github className="h-5 w-5" />, label: "GitHub" },
              ].map((social, index) => (
                <motion.div key={index} whileHover={{ y: -5, scale: 1.1 }} whileTap={{ scale: 0.9 }}>
                  <Link href="#" className="text-muted-foreground hover:text-foreground">
                    {social.icon}
                    <span className="sr-only">{social.label}</span>
                  </Link>
                </motion.div>
              ))}
            </div>
          </div>
          <div className="grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-1">
            <div>
              <h3 className="text-lg font-medium">Company</h3>
              <nav className="mt-4 flex flex-col space-y-2 text-sm">
                <Link href="#about" className="text-muted-foreground hover:text-foreground">
                  About Us
                </Link>
                <Link href="#" className="text-muted-foreground hover:text-foreground">
                  Careers
                </Link>
                <Link href="#" className="text-muted-foreground hover:text-foreground">
                  Our Process
                </Link>
                <Link href="#" className="text-muted-foreground hover:text-foreground">
                  News & Press
                </Link>
              </nav>
            </div>
            <div>
              <h3 className="text-lg font-medium">Services</h3>
              <nav className="mt-4 flex flex-col space-y-2 text-sm">
                <Link href="#" className="text-muted-foreground hover:text-foreground">
                  UI/UX Design
                </Link>
                <Link href="#" className="text-muted-foreground hover:text-foreground">
                  Web Development
                </Link>
                <Link href="#" className="text-muted-foreground hover:text-foreground">
                  Brand Identity
                </Link>
                <Link href="#" className="text-muted-foreground hover:text-foreground">
                  Digital Marketing
                </Link>
              </nav>
            </div>
          </div>
          <div className="grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-1">
            <div>
              <h3 className="text-lg font-medium">Resources</h3>
              <nav className="mt-4 flex flex-col space-y-2 text-sm">
                <Link href="#" className="text-muted-foreground hover:text-foreground">
                  Blog
                </Link>
                <Link href="#" className="text-muted-foreground hover:text-foreground">
                  Case Studies
                </Link>
                <Link href="#" className="text-muted-foreground hover:text-foreground">
                  Guides & Tutorials
                </Link>
                <Link href="#" className="text-muted-foreground hover:text-foreground">
                  FAQ
                </Link>
              </nav>
            </div>
            <div>
              <h3 className="text-lg font-medium">Legal</h3>
              <nav className="mt-4 flex flex-col space-y-2 text-sm">
                <Link href="#" className="text-muted-foreground hover:text-foreground">
                  Privacy Policy
                </Link>
                <Link href="#" className="text-muted-foreground hover:text-foreground">
                  Terms of Service
                </Link>
                <Link href="#" className="text-muted-foreground hover:text-foreground">
                  Cookie Policy
                </Link>
              </nav>
            </div>
          </div>
          <div className="space-y-3">
            <h3 className="text-lg font-medium">Subscribe to our newsletter</h3>
            <p className="text-sm text-muted-foreground">
              Stay updated with our latest projects, design tips, and company news.
            </p>
            <form className="flex space-x-3">
              <Input type="email" placeholder="Enter your email" className="max-w-lg flex-1 rounded-3xl" />
              <Button type="submit" className="rounded-3xl">
                Subscribe
              </Button>
            </form>
          </div>
        </motion.div>
        <div className="border-t">
          <div className="container flex flex-col items-center justify-between gap-3 py-6 md:h-16 md:flex-row md:py-0">
            <p className="text-xs text-muted-foreground">
              © {new Date().getFullYear()} Design Studio. All rights reserved.
            </p>
            <p className="text-xs text-muted-foreground">Crafted with passion in New York City</p>
          </div>
        </div>
      </footer>
    </div>
  )
}
</article></body></html>