everydayserieswebsite/app/tools/page.tsx

"use client";

import React from 'react';
import Navbar from '@/components/Navbar/navbar';
import Footer from "@/components/footer";
import { HoverEffect } from '@/components/ui/card-hover-effect';
import { motion } from 'framer-motion';
import { FaMagic, FaRobot, FaChartLine, FaCog } from 'react-icons/fa';

const heading = "Tools - Empower Non-Coders to Create and Use AI Workflows"
const description = "Easily create and use AI-powered workflows without writing a single line of code. Input your data and get the desired output effortlessly."

const tools = [
  {
    title: "Text Summarizer",
    description: "Summarize long articles or documents into concise summaries.",
    imgSrc: "https://plus.unsplash.com/premium_photo-1683880731792-39c07ceea617?w=500&auto=format&fit=crop&q=60&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8NXx8b2ZmaWNlfGVufDB8fDB8fHww",
    link: "#"
  },
  {
    title: "Sentiment Analysis",
    description: "Analyze the sentiment of customer reviews or social media posts.",
    imgSrc: "https://images.unsplash.com/photo-1568992687947-868a62a9f521?w=500&auto=format&fit=crop&q=60&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8NHx8b2ZmaWNlfGVufDB8fDB8fHww",
    link: "#"
  },
  {
    title: "Image Recognition",
    description: "Identify objects and scenes in images with high accuracy.",
    imgSrc: "data:image/jpeg;base64,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",
    link: "#"
  },
  {
    title: "Chatbot Builder",
    description: "Create and deploy chatbots for customer support and engagement.",
    imgSrc: "https://images.unsplash.com/photo-1556157382-4e063bb26661?w=500&auto=format&fit=crop&q=60&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8Nnx8Y2hhdHxlbnwwfHwwfHx8MA%3D%3D",
    link: "#"
  }
];

const features = [
  {
    title: "Magic Button",
    description: "Automate complex tasks with a single click using our Magic Button feature.",
    icon: <FaMagic className="w-6 h-6 text-white" />,
    color: "from-purple-500 to-indigo-500"
  },
  {
    title: "AI-Powered Automation",
    description: "Leverage AI to automate repetitive tasks and improve efficiency.",
    icon: <FaRobot className="w-6 h-6 text-white" />,
    color: "from-green-500 to-teal-500"
  },
  {
    title: "Advanced Analytics",
    description: "Gain insights from your data with advanced analytics and reporting tools.",
    icon: <FaChartLine className="w-6 h-6 text-white" />,
    color: "from-blue-500 to-cyan-500"
  },
  {
    title: "Custom Workflows",
    description: "Create custom workflows tailored to your specific business needs.",
    icon: <FaCog className="w-6 h-6 text-white" />,
    color: "from-yellow-500 to-orange-500"
  }
];

export default function Tools() {
  return (
    <div className="min-h-screen bg-[#080E12] dark text-white overflow-x-hidden">
      <Navbar />
      
      {/* Hero Section */}
      <div className='h-screen py-10 px-24 flex flex-col items-start justify-center'>
        <h1 className="text-8xl mb-10">{heading}</h1>
        <h2 className='text-4xl'>{description}</h2>
      </div>
      <div className="max-w-7xl mx-auto">
      
      {/* Tools Section */}
      <section className="py-16 px-4 md:px-8">
        <motion.div
          initial={{ opacity: 0, y: 30 }}
          whileInView={{ opacity: 1, y: 0 }}
          transition={{ duration: 0.6 }}
          viewport={{ once: true }}
          className="max-w-7xl mx-auto"
        >
          <h2 className="text-3xl md:text-4xl mb-12 text-center bg-clip-text text-transparent bg-gradient-to-r from-white to-violet-300">
            Available Tools
          </h2>
          <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
            {tools.map((tool, index) => (
              <motion.div
                key={index}
                initial={{ opacity: 0, y: 30 }}
                whileInView={{ opacity: 1, y: 0 }}
                transition={{ duration: 0.6, delay: index * 0.2 }}
                viewport={{ once: true }}
                className="bg-[#121212] border border-gray-800 rounded-xl p-6 text-center"
              >
                <img src={tool.imgSrc} alt={tool.title} className="w-full h-40 object-cover rounded-lg mb-4" />
                <h3 className="text-xl text-white font-medium mb-2">{tool.title}</h3>
                <p className="text-gray-400 mb-4">{tool.description}</p>
                <a href={tool.link} className="bg-violet-600 hover:bg-violet-500 font-medium px-6 py-3 rounded-lg inline-block transition-all shadow-lg hover:shadow-violet-500/40">
                  Use Tool
                </a>
              </motion.div>
            ))}
          </div>
        </motion.div>
      </section>

      {/* Features Section */}
      <section className="py-16 h-screen px-4 md:px-8">
        <motion.div
          initial={{ opacity: 0, y: 30 }}
          whileInView={{ opacity: 1, y: 0 }}
          transition={{ duration: 0.6 }}
          viewport={{ once: true }}
          className="max-w-7xl mx-auto"
        >
          <h2 className="text-3xl md:text-4xl mb-12 text-center bg-clip-text text-transparent bg-gradient-to-r from-white to-violet-300">
            Key Features
          </h2>
          <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-8">
            {features.map((feature, index) => (
              <motion.div
                key={index}
                initial={{ opacity: 0, y: 30 }}
                whileInView={{ opacity: 1, y: 0 }}
                transition={{ duration: 0.6, delay: index * 0.2 }}
                viewport={{ once: true }}
                className="relative group bg-[#121212] border border-gray-800 rounded-xl p-6 transition-all duration-500 overflow-hidden"
              >
                <div className="flex items-center gap-4 mb-2">
                  <div className="p-3 bg-gray-900 rounded-lg">{feature.icon}</div>
                  <h3 className="text-xl text-white font-medium">{feature.title}</h3>
                </div>
                <p className="text-gray-400">{feature.description}</p>
                <div
                  className={`absolute inset-0 rounded-xl bg-gradient-to-br ${feature.color} opacity-0 blur-3xl scale-125 transition-opacity duration-500 group-hover:opacity-20`}
                />
              </motion.div>
            ))}
          </div>
        </motion.div>
      </section>

      </div>
      <Footer />
    </div>
  );
}