<!--

                  ████████████████                            
              ████░░░░░░░░░░░░░░░░████                        
██████████████░░░░░░░░░░░░░░░░░░░░░░░░████████████                     Mew :<
██░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░██            
██░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░██            
  ██▓▓▓▓▓▓▓▓░░░░░░░░░░░░░░░░░░░░░░░░░░▓▓▓▓▓▓▓▓██              
  ██▓▓▓▓▓▓░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░▓▓▓▓▓▓██              
    ██▓▓░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░▓▓██                
      ██░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░██                  
      ██░░░░░░████░░░░░░░░░░░░░░████░░░░░░██                  
      ██░░░░██  ▒▒██░░░░░░░░░░██  ▒▒██░░░░██                  
      ██░░░░██▒▒▒▒██░░░░░░░░░░██▒▒▒▒██░░░░██                  
        ██░░░░████░░░░░░░░░░░░░░████░░░░██                    
        ██░░░░░░░░░░▓▓▓▓▓▓▓▓▓▓░░░░░░░░░░██                    
    ▓▓▓▓▓▓██░░░░▓▓▓▓▒▒▒▒▒▒▒▒▒▒▓▓▓▓░░░░██                      
  ▓▓▒▒▒▒▒▒▓▓██▓▓▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▓▓██                        
  ▓▓▒▒▒▒▒▒▒▒▓▓▒▒▒▒▒▒▒▒▒▒▒▒▒▒▓▓▒▒▓▓▒▒▓▓██                      
    ▓▓▓▓▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▓▓▒▒▒▒▒▒▓▓██                    
  ▓▓▒▒▒▒▒▒▒▒▓▓▒▒▒▒▒▒▒▒▒▒▒▒▒▒▓▓▒▒▓▓▒▒▓▓░░░░██        ██████    
  ▓▓▒▒▒▒▒▒▓▓  ▓▓▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▓▓░░░░░░██        ██▓▓▓▓██  
    ▓▓▓▓▓▓    ██▓▓▓▓▒▒▒▒▒▒▒▒▒▒▓▓▓▓░░░░░░░░░░██        ██▓▓▓▓██
              ██░░░░▓▓▓▓▓▓▓▓▓▓░░░░░░░░░░░░░░██        ██▓▓▓▓██
                ██░░░░░░░░░░░░░░██░░░░░░░░░░██        ██░░▓▓██
                ██░░░░░░██░░░░░░██░░░░░░░░░░██      ██░░░░░░██
                ██░░░░░░██░░░░░░██░░░░░░░░░░██      ██░░░░██  
                ██░░░░░░██░░░░░░██░░░░░░░░░░██    ██░░░░░░██  
                  ██░░░░██░░░░██░░░░░░░░░░░░██████░░░░░░██    
                  ██░░░░██░░░░██░░░░░░░░░░░░░░░░░░░░████      
                  ██░░░░██░░░░██░░░░░░░░░░░░████████          
                    ████  ██████████████████                  


--><!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>NekoDevs</title>
  <link href="/src/styles/output.css" rel="stylesheet">
  <link rel="stylesheet" href="https://rsms.me/inter/inter.css">
  <meta name="description" content="Pawsitively Innovative Software Solutions!">
<meta name="author" content="NekoDevs">
<meta content="#A443D1" data-react-helmet="true" name="theme-color">
<meta property="og:image" content="favicon.png">
<link rel="icon" href="favicon.png" type="image/x-icon"></head>

<body class="bg-gray-900">
  <div class="relative isolate overflow-hidden bg-gray-900">
    <svg class="absolute inset-0 -z-10 h-full w-full stroke-white/10 [mask-image:radial-gradient(100%_100%_at_top_right,white,transparent)]" aria-hidden="true">
      <defs>
        <pattern id="983e3e4c-de6d-4c3f-8d64-b9761d1534cc" width="200" height="200" x="50%" y="-1" patternUnits="userSpaceOnUse">
          <path d="M.5 200V.5H200" fill="none" />
        </pattern>
      </defs>
      <svg x="50%" y="-1" class="overflow-visible fill-gray-800/20">
        <path d="M-200 0h201v201h-201Z M600 0h201v201h-201Z M-400 600h201v201h-201Z M200 800h201v201h-201Z" stroke-width="0" />
      </svg>
      <rect width="100%" height="100%" stroke-width="0" fill="url(#983e3e4c-de6d-4c3f-8d64-b9761d1534cc)" />
    </svg>
    <div class="absolute left-[calc(50%-4rem)] top-10 -z-10 transform-gpu blur-3xl sm:left-[calc(50%-18rem)] lg:left-48 lg:top-[calc(50%-30rem)] xl:left-[calc(50%-24rem)]" aria-hidden="true">
      <div class="aspect-[1108/632] w-[69.25rem] bg-gradient-to-r from-[#80caff] to-[#4f46e5] opacity-20" style="clip-path: polygon(73.6% 51.7%, 91.7% 11.8%, 100% 46.4%, 97.4% 82.2%, 92.5% 84.9%, 75.7% 64%, 55.3% 47.5%, 46.5% 49.4%, 45% 62.9%, 50.3% 87.2%, 21.3% 64.1%, 0.1% 100%, 5.4% 51.1%, 21.4% 63.9%, 58.9% 0.2%, 73.6% 51.7%)"></div>
    </div>
    <div class="mx-auto max-w-7xl px-6 pb-24 pt-10 sm:pb-32 lg:flex lg:px-8 lg:py-40">
      <div class="mx-auto max-w-2xl flex-shrink-0 lg:mx-0 lg:max-w-xl lg:pt-8">
        <h1 class="mt-10 text-4xl font-bold tracking-tight text-white sm:text-6xl">Our projects</h1>
        <p class="mt-6 text-lg leading-8 text-gray-300">Look at the projects our cats have worked on so far.</p>
      </div>
    </div>
  </div>
  <!-- 
  ⠀⣴⣶⠤⣿⣶⣦⣤⡄⣤⣴⣿⣦⠀⢠⣤⣤⡤⣤⣴⣦⠀⠀⢸⡇⠀⠀⣭⣥⣿⡇⣾⠏⣴⣶⠄⠀⢠⣶⡦⣠⣶⣦⣄⣴⣾⣿⢠⣶⣤
⠀⣽⣿⡖⣿⢸⣿⢸⣧⣿⠇⣿⠀⠀⢸⣿⣿⡇⣿⣧⣿⠂⠀⣬⣥⠀⠀⣿⡇⣿⡇⠀⠀⣽⣿⡆⠀⢨⣿⣷⢻⣧⣿⡿⣿⣼⣿⢻⣧⣿
⠀⠈⠉⠀⠉⠈⠉⠀⠉⠁⠀⠉⠀⠀⠀⠉⠉⠀⠿⠏⠁⠀⠀⠈⠁⠀⠀⠉⠁⠉⠁⠀⠀⠈⠉⠀⠀⠀⠉⠁⠀⠉⠉⠀⠉⠉⠉⠀⠉⠉
⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢀⣀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⡀⠀⠀⠀⠀⣀⡀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀
⠀⠀⠀⠀⠀⠀⠀⠀⣼⣿⣬⣿⢠⣤⣤⣤⣤⢀⣤⣤⡀⠀⠀⣿⣿⡇⣠⣤⡄⣿⢠⣤⢠⣤⣤⣤⣤⣤⣤⡄⢸⣿⣷⠀⠀⠀⠀⠀⠀⠀
⠀⠀⠀⠀⠀⠀⠀⠀⢹⣿⢹⣿⢹⣿⣿⣿⣿⢸⣿⣿⡇⠀⠀⠀⠁⠀⣻⣷⡄⣿⢸⣿⣸⣿⣿⡏⢹⣿⣹⣿⠀⠈⠀⠀⠀⠀⠀⠀⠀⠀
⠀⠀⠀⠀⠀⠀⠀⠀⠘⠛⠘⠛⠘⠛⠛⠃⠛⠈⠛⠛⠁⠀⠀⠀⠀⠀⠛⠛⠁⠛⠂⠛⠛⠃⠛⠃⢸⣿⠛⠃⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀
⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀
⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀
⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀
⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⣀⡀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀
⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⣀⡾⠛⣧⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢀⡿⠻⣶⡀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀
⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⣰⠟⠀⠀⢿⡀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⣼⠃⠀⠀⠹⢷⡄⠀⠀⠀⠀⠀⠀⠀⠀
⠀⠀⠀⠀⠀⠀⠀⠀⠀⢀⣾⠋⠀⠀⠀⠸⡇⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢠⡟⠀⠀⠀⠀⠀⠹⣧⡀⠀⠀⠀⠀⠀⠀
⠀⠀⠀⠀⠀⠀⠀⠀⢀⡾⠁⠀⠀⠀⠀⠀⣧⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⣸⠉⠀⠀⠀⠀⠀⠀⠈⢿⡄⠀⠀⠀⠀⠀
⠀⠀⠀⠀⠀⠀⠀⢀⡾⠁⠀⠀⠀⠀⠀⠀⢽⡀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⣞⠀⠀⠀⠀⠀⠀⠀⠀⠈⢷⡄⠀⠀⠀⠀
⠀⠀⠀⠀⠀⠀⢠⡾⠁⠀⠀⠀⠀⠀⠀⠀⢸⡇⢀⣀⣀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢰⡇⠀⠀⠀⠀⠀⠀⠀⠀⠀⠘⣷⠀⠀⠀⠀        Woww I made a lot of boykisser ASCII thingies now
⠀⠀⠀⠀⠀⠀⣾⠃⠀⠀⠀⠀⠀⠀⠀⠀⠀⣿⠈⣿⠉⠙⠳⠶⣤⣀⡀⠀⠀⠀⠀⠀⠀⢼⠁⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢹⡆⠀⠀⠀
⠀⠀⠀⠀⠀⣼⠇⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢹⡄⠸⣧⠀⠀⠀⠀⠉⠛⠷⣦⣄⠀⠀⠀⣿⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⣇⠀⠀⠀          but I'm slowly running out of pictures to convert
⠀⠀⠀⠀⢠⡟⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠈⡇⠀⢹⡄⠀⠀⠀⠀⠀⠀⠀⠉⠻⢶⣤⠛⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢹⠀⠀⠀
⠀⠀⠀⠀⢸⠁⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢀⣈⣧⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠈⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢸⠀⠀⠀            I'm so sorry TwT
⠀⠀⠀⠀⣸⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⣀⣴⠾⠛⠉⠁⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢸⠀⠀⠀  
⠀⠀⠀⠀⢷⠀⠀⠀⠀⠀⠀⠀⠀⢀⣴⣟⣋⣀⣀⣀⣤⣤⡤⠴⠶⠖⠀⠀⠀⣀⣀⣀⣀⡀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢼⠀⠀⠀
⠀⠀⠀⠀⢸⠀⠀⠀⠀⠀⠀⠀⠀⠈⢉⣽⠟⠉⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠉⠀⠀⠈⠙⠷⠄⠀⠀⠀⠀⠀⠀⠀⠀⠀⢀⡯⠀⠀⠀
⠀⠀⠀⠀⢸⡄⠀⠀⠀⠀⠀⠀⠀⠀⢺⠁⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⣾⠇⠀⠀⠀
⠀⠀⠀⠀⠈⣷⠀⠀⠀⠀⠀⠀⠀⠀⣀⣠⣤⣤⣤⣀⠀⠀⠀⠀⠀⠀⠀⢠⡾⠛⠉⠉⠙⠚⠲⣦⡀⠀⠀⠀⠀⠀⠀⠀⣼⠏⠀⠀⠀⠀
⠀⠀⠀⠀⠀⠹⣇⠀⠀⠀⠀⠀⣴⡟⠋⠁⠀⠀⠈⠙⣷⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠈⠻⣦⠀⠀⠀⢠⣴⣾⣁⣀⡀⠀⠀⠀
⠀⠀⠀⠀⠀⠀⠹⠗⠀⠀⢀⡾⠁⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⣀⣀⣀⡀⠀⠀⠀⠀⠸⣧⠀⠀⠀⠉⠀⠉⠉⠛⠛⣲⠆
⠘⢿⣍⠙⠛⠛⠛⠛⠛⠀⢸⠃⠀⠀⠀⠀⠀⣴⣿⣷⡆⠀⠀⠀⠀⠀⠀⠀⣼⣿⣿⣿⣿⣦⠀⠀⠀⠀⢻⠀⠀⠀⠀⠀⠀⠀⢀⣾⠋⠀
⠀⠀⠙⠳⣦⣀⠀⠀⢀⡀⢻⠀⠀⠀⠀⠀⢸⣿⣿⣿⣿⠀⠀⠀⠀⠀⠀⠀⣿⣿⣿⣿⣿⡿⠀⠀⠀⠀⣿⣤⢀⣠⠀⠀⠀⣴⡟⠀⠀⠀
⠀⠀⠀⠀⢈⣽⠇⣰⣟⣥⢾⣿⠀⠀⠀⠀⠘⠛⠛⠋⠉⠀⠴⠶⠤⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⣠⣿⡵⠛⣹⠆⢠⡾⠋⠀⠀⠀⠀
⠀⠀⢀⣴⠏⠁⠀⠛⠉⠁⠞⠁⠀⠀⠀⠀⠀⠀⠀⡀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠉⠉⠀⠀⠉⠀⠀⠻⣦⡀⠀⠀⠀
⠀⠀⣿⣁⡀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠐⣿⣀⢀⣀⣴⣄⡀⠀⠀⢀⣴⠇⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠈⠻⣦⡀⠀
⠀⠀⠉⠉⠉⠉⠉⠉⠛⠛⣤⣄⡀⠀⠀⠀⠀⠀⠀⠀⢩⣿⣋⣠⡿⠛⠛⠛⠋⠁⠀⠀⠀⠀⠀⢀⣀⣤⣶⠆⠤⣤⣤⡤⠴⠶⠛⠛⠁⠀
⠀⠀⠀⠀⠀⠀⠀⠀⠀⢠⠤⠬⠿⠷⠶⡦⢀⣤⡴⠶⢿⣧⣀⣸⡏⠉⠛⠳⣦⣄⠀⠀⠰⠟⢛⡿⠋⠁⠉⠙⢷⣄⠀⠀⠀⠀⠀⠀⠀⠀
⠀⠀⠀⠀⠀⠀⠀⠀⠀⠘⣧⠀⠀⠀⠀⣤⡟⠁⠀⠀⠸⣧⣤⠾⠋⠀⠀⠀⣸⣿⡆⠀⠀⠀⠸⡁⠀⠀⠀⠀⠀⠹⣦⡀⠀⠀⠀⠀⠀⠀
⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⣈⡿⢀⡾⢻⣿⣷⣤⣀⣀⣀⣀⣀⣀⣀⣤⡴⡞⣛⣿⠇⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠙⣷⡀⠀⠀⠀⠀⠀
⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠛⠚⣿⣁⣸⣿⡳⣾⣿⣋⣯⣿⣯⣻⣿⣿⣿⣿⣧⣿⠶⠛⠂⠀⠀⢤⣤⣀⠀⠀⠀⠀⠀⠸⣇⠀⠀⠀⠀⠀
⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠰⠟⠉⠉⣟⢷⡜⢿⣿⡿⠿⣿⣿⣿⡟⠉⣿⠟⠁⠀⠀⠀⠀⠀⠀⠀⠉⠻⢶⣄⠀⠀⠀⢻⡄⠀⠀⠀⠀
⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢀⡀⠀⠀⠀⢿⠈⣿⣿⣺⣀⡀⠀⠚⡿⢶⣻⣏⡀⠀⠀⠀⠀⠀⠀⠀⢠⣤⡄⠀⠉⠀⠀⠀⠈⣇⠀⠀⠀⠀
⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⣸⠁⠀⠀⠠⣾⡟⡟⡨⠍⠉⠀⠀⠀⠀⠈⢛⠿⣻⡿⠃⠀⠀⠀⠀⠀⠀⣾⣃⠀⠀⠀⠀⠀⠀⢿⠄⠀⠀⠀
⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⣿⠀⠀⠀⠀⠙⣗⡞⠠⠠⠄⠀⠀⠀⠀⣿⢴⢴⡟⠁⠀⠀⠀⠀⠀⠀⠐⠛⠻⠇⠀⠀⠀⠀⠀⣸⡇⠀⠀⠀
⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⣿⠀⠀⢠⣄⣀⣿⡏⠁⠀⠀⠀⠀⠀⠀⣿⣶⣼⣦⣀⣤⡀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⣠⡟⠁⠀⠀⠀
⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⣿⠀⠀⠀⠹⣿⡏⣧⡄⣀⣰⣀⣀⣀⣀⣿⣿⣃⣿⢁⡿⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⣀⣴⠾⠋⠀⠀⠀⠀⠀
⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢹⣆⠀⠀⠀⢹⣧⣔⣛⢽⡿⣿⣿⣿⡿⡿⣭⣯⡯⢸⣇⠀⣰⠆⠀⠠⠤⠴⠶⠛⠛⠉⠀⠀⠀⠀⠀⠀⠀⠀
⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠉⠈⠛⠖⠟⠁⠈⠙⠛⠟⠶⣿⣶⣷⡿⠟⠁⠀⠀⠛⠛⠋⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀
    -->
    <div class="container mx-auto px-6 py-10">
        <h2 class="text-2xl font-bold text-white mb-6">Project List</h2>
        <div class="bg-gray-800 rounded-lg shadow-lg overflow-hidden">
            <table class="w-full border border-gray-700">
                <thead>
                    <tr>
                        <th class="py-3 px-4 bg-gray-900 text-left text-xs font-semibold text-gray-300 uppercase tracking-wider">Name</th>
                        <th class="py-3 px-4 bg-gray-900 text-left text-xs font-semibold text-gray-300 uppercase tracking-wider">Description</th>
                        <th class="py-3 px-4 bg-gray-900 text-left text-xs font-semibold text-gray-300 uppercase tracking-wider">Status</th>
                        <th class="py-3 px-4 bg-gray-900 text-left text-xs font-semibold text-gray-300 uppercase tracking-wider">Actions</th>
                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td class="py-3 px-4 border-b border-gray-700 text-gray-300">NekoDevs main website</td>
                        <td class="py-3 px-4 border-b border-gray-700 text-gray-300">Main website for NekoDevs (the site you're currently on)</td>
                        <td class="py-3 px-4 border-b border-gray-700">
                            <span class="inline-block py-1 px-2 rounded-full text-xs font-semibold text-green-200 bg-green-900">In Progress</span>
                        </td>
                        <td class="py-3 px-4 border-b border-gray-700">
                            <a href="https://nekodevs.eu" class="text-gray-300 hover:text-gray-100">View Project</a>
                        </td>
                    </tr>
                    <!-- commented out since there aren't any other projects
                    <tr>
                        <td class="py-3 px-4 border-b border-gray-700 text-gray-300">Project 2</td>
                        <td class="py-3 px-4 border-b border-gray-700 text-gray-300">Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</td>
                        <td class="py-3 px-4 border-b border-gray-700">
                            <span class="inline-block py-1 px-2 rounded-full text-xs font-semibold text-red-200 bg-red-900">Completed</span>
                        </td>
                        <td class="py-3 px-4 border-b border-gray-700">
                            <a href="#" class="text-gray-300 hover:text-gray-100">View Project</a>
                        </td>
                    </tr>
                    <tr>
                        <td class="py-3 px-4 border-b border-gray-700 text-gray-300">Project 3</td>
                        <td class="py-3 px-4 border-b border-gray-700 text-gray-300">Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</td>
                        <td class="py-3 px-4 border-b border-gray-700">
                            <span class="inline-block py-1 px-2 rounded-full text-xs font-semibold text-orange-200 bg-orange-900">Pending</span>
                        </td>
                        <td class="py-3 px-4 border-b border-gray-700">
                            <a href="#" class="text-gray-300 hover:text-gray-100">View Project</a>
                        </td>
                    </tr>
                    -->
                </tbody>
            </table>
        </div>
    </div>

  <div class="bg-gray-800">
    <footer class="mx-auto max-w-screen-2xl px-4 md:px-8">
      <div class="mb-16 grid grid-cols-2 gap-12 pt-10 md:grid-cols-4 lg:grid-cols-6 lg:gap-8 lg:pt-12">
        <div class="col-span-full lg:col-span-2">
          <!-- logo - start -->
          <div class="mb-4 lg:-mt-2">
            <a href="/" class="inline-flex items-center gap-2 text-xl font-bold text-gray-100 md:text-2xl" aria-label="logo">
              <img src="logo_long.png" alt="NekoDevs" style="height: 50px;">
            </a>
          </div>
          <!-- logo - end -->

          <p class="mb-6 text-gray-400 sm:pr-8">Pawsitively Innovative Software Solutions.</p>

          <!-- social - start -->
          <div class="flex gap-4">
            <a href="https://tube.fembois.eu/c/nekodevs/videos" target="_blank" class="text-gray-400 transition duration-100 hover:text-gray-500 active:text-gray-600">
              <svg class="h-5 w-5" width="24" height="24" viewBox="0 0 24 24" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
                <path d="M12 0C5.372 0 0 5.372 0 12s5.372 12 12 12 12-5.372 12-12S18.628 0 12 0zm1.5 17.25l-6-4.5 6-4.5v9z" />
              </svg>
            </a>

            <a href="https://github.com/Nekodevs-EU/Landing-Page" target="_blank" class="text-gray-400 transition duration-100 hover:text-gray-500 active:text-gray-600">
              <svg class="h-5 w-5" width="24" height="24" viewBox="0 0 24 24" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
                <path d="M12 0c-6.626 0-12 5.373-12 12 0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23.957-.266 1.983-.399 3.003-.404 1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v3.293c0 .319.192.694.801.576 4.765-1.589 8.199-6.086 8.199-11.386 0-6.627-5.373-12-12-12z" />
              </svg>
            </a>
          </div>
          <!-- social - end -->
        </div>

        <!-- nav - start -->
        <div>
          <div class="mb-4 font-bold uppercase tracking-widest text-gray-100">Projects</div>

          <nav class="flex flex-col gap-4">
            <div>
              <a href="#" class="text-gray-400 transition duration-100 hover:text-purple-500 active:text-purple-600">Overview</a>
            </div>

            <div>
              <a href="#" class="text-gray-400 transition duration-100 hover:text-purple-500 active:text-purple-600">Solutions</a>
            </div>

            <div>
              <a href="#" class="text-gray-400 transition duration-100 hover:text-purple-500 active:text-purple-600">Pricing</a>
            </div>

            <div>
              <a href="#" class="text-gray-400 transition duration-100 hover:text-purple-500 active:text-purple-600">Customers</a>
            </div>
          </nav>
        </div>
        <!-- nav - end -->

        <!-- nav - start -->
        <div>
          <div class="mb-4 font-bold uppercase tracking-widest text-gray-100">About us</div>

          <nav class="flex flex-col gap-4">
            <div>
              <a href="/story" class="text-gray-400 transition duration-100 hover:text-purple-500 active:text-purple-600">Our story</a>
            </div>

            <div>
              <a href="/goals" class="text-gray-400 transition duration-100 hover:text-purple-500 active:text-purple-600">Our goal</a>
            </div>

            <div>
              <a href="/donate" class="text-gray-400 transition duration-100 hover:text-purple-500 active:text-purple-600">Donate</a>
            </div>

          </nav>
        </div>
        <!-- nav - end -->

        <!-- nav - start -->
        <div>
          <div class="mb-4 font-bold uppercase tracking-widest text-gray-100">Support</div>

          <nav class="flex flex-col gap-4">
            <div>
              <a href="mailto:contact@nekodevs.eu" class="text-gray-400 transition duration-100 hover:text-purple-500 active:text-purple-600">Contact</a>
            </div>

            <div>
              <a href="https://docs.nekodevs.eu" class="text-gray-400 transition duration-100 hover:text-purple-500 active:text-purple-600">Documentation</a>
            </div>

            <div>
              <a href="#" class="text-gray-400 transition duration-100 hover:text-purple-500 active:text-purple-600">Community</a>
            </div>

            <div>
              <a href="/faq" class="text-gray-400 transition duration-100 hover:text-purple-500 active:text-purple-600">FAQ</a>
            </div>
          </nav>
        </div>
        <!-- nav - end -->

        <!-- nav - start -->
        <div>
          <div class="mb-4 font-bold uppercase tracking-widest text-gray-100">Legal</div>

          <nav class="flex flex-col gap-4">
            <div>
              <a href="/tos" class="text-gray-400 transition duration-100 hover:text-purple-500 active:text-purple-600">Terms of Service</a>
            </div>

            <div>
              <a href="/privacy" class="text-gray-400 transition duration-100 hover:text-purple-500 active:text-purple-600">Privacy Policy</a>
            </div>

            <div>
              <a href="/cookies" class="text-gray-400 transition duration-100 hover:text-purple-500 active:text-purple-600">Cookie Policy</a>
            </div>
          </nav>
        </div>
        <!-- nav - end -->  
      </div>

      <div class="border-t border-gray-800 py-8 text-center text-sm text-gray-400">© 2024 - Present NekoDevs. All rights reserved.</div>
    </footer>
  </div>  <script>
  document.querySelectorAll('a[href^="#"]').forEach(anchor => {
    anchor.addEventListener('click', function (e) {
      e.preventDefault();

      document.querySelector(this.getAttribute('href')).scrollIntoView({
        behavior: 'smooth'
      });
    });
  });
</script>
<script>
  document.addEventListener('DOMContentLoaded', function() {
    const accordionButtons = document.querySelectorAll('.flex.items-center.justify-center.w-8.h-8.rounded-full.bg-gray-700');

    accordionButtons.forEach(button => {
        button.addEventListener('click', function() {
            const answerDiv = this.parentElement.nextElementSibling;
            const svgIcon = this.querySelector('svg');

            if (answerDiv.classList.contains('max-h-0')) {
                answerDiv.classList.remove('max-h-0');
                answerDiv.classList.add('max-h-full');
                svgIcon.classList.add('rotate-180');
            } else {
                answerDiv.classList.remove('max-h-full');
                answerDiv.classList.add('max-h-0');
                svgIcon.classList.remove('rotate-180');
            }
        });
    });
});
</script>
</body>

</html>