<!DOCTYPE html>
<html lang="en">
<head>
    <%- include('partials/head') %> 
    <style>
      .social-icons a {
      transition: all .38s ease;
      font-size: 25px;
      margin-left: 10px;
      color: black;
      }
      .social-icons a:hover{
        color: white;
        transform: scale(1.2);
        padding: 2px 6px;
        border-radius: 4px;
      }
      #github:hover{
        background-color:#3a383c ;
      }
      #linkedin:hover{
        background-color:#0a66c2 ;
      }
      #instagram:hover{
        background-color: #e1306c;
      }
      #twitter:hover{
        background-color: #14171A;
      }
    </style>
</head>
<body>
    <%- include('partials/navbar') %>
    
    <!-- Meet the Team Section -->
    <section class="team-section text-center mt-4 mb-5 pb-5">
      <div class="container">
        <h2 class="mb-4">Meet the Team</h2>
        <p class="lead">Get to know the amazing team behind Scruter.</p>
        <div class="row">
          <div class="col-md-4 mb-4">
            <img src="/swaroop.jpg" class="rounded-circle img-fluid mb-3" alt="Team Member 1">
            <h4>Swaroop Patil</h4>
            <p>Full Stack Developer</p>
            <div class="social-icons">
              <a href="https://instagram.com/swaroop.patil.x" id="instagram"><i class="fab fa-instagram"></i></a>
              <a href="https://x.com/sastatonystark" id="twitter"><i class="fab fa-x-twitter"></i></a>
              <a href="https://linkedin.com/in/swaroop-patil-x" id="linkedin"><i class="fab fa-linkedin"></i></a>
              <a href="https://github.com/swarooppatilx" id="github"><i class="fab fa-github"></i></a>
            </div>
          </div>
          <div class="col-md-4 mb-4">
            <img src="/ashish.jpg" class="rounded-circle img-fluid mb-3" alt="Team Member 2">
            <h4>Ashish Kharde</h4>
            <p>Frontend Developer</p>
            <div class="social-icons">
              <a href="https://instagram.com/ashish_kharde1" id="instagram"><i class="fab fa-instagram"></i></a>
              <a href="https://x.com/ashkharde" id="twitter"><i class="fab fa-x-twitter"></i></a>
              <a href="https://linkedin.com/in/ashish-kharde-b5a114288/" id="linkedin"><i class="fab fa-linkedin"></i></a>
              <a href="https://github.com/Ashish-kharde1" id="github"><i class="fab fa-github"></i></a>
            </div>
          </div>
          <div class="col-md-4 mb-4">
            <img src="/chinmay.jpg" id="chinmay-photo" class="rounded-circle img-fluid mb-3" alt="Team Member 3">
            <h4>Chinmay Nakwa</h4>
            <p id="chinmay-role">AI & ML</p>
            <div class="social-icons">
              <a href="https://instagram.com/chinmay._.29/" id="instagram"><i class="fab fa-instagram"></i></a>
              <a href="#" id="twitter"><i class="fab fa-x-twitter"></i></a>
              <a href="https://linkedin.com/in/chinmay-nakwa-9a0836241" id="linkedin"><i class="fab fa-linkedin"></i></a>
              <a href="https://github.com/ChinmayNakwa" id="github"><i class="fab fa-github"></i></a>
            </div>
          </div>
          <div class="col-md-4 mb-4">
            <img src="/omkar.jpg" class="rounded-circle img-fluid mb-3" alt="Team Member 4">
            <h4>Omkar Avasare</h4>
            <p>UI/UX</p>
            <div class="social-icons">
              <a href="https://instagram.com/omkar_avasare_" id="instagram"><i class="fab fa-instagram"></i></a>
              <a href="https://x.com/omkar_avasare" id="twitter"><i class="fab fa-x-twitter"></i></a>
              <a href="https://linkedin.com/in/omkar-avasare-302212279" id="linkedin"><i class="fab fa-linkedin"></i></a>
              <a href="https://github.com/Omkar-Avasare" id="github"><i class="fab fa-github"></i></a>
            </div>
          </div>
          <div class="col-md-4 mb-4">
            <img src="/hrikesh.jpg" class="rounded-circle img-fluid mb-3" alt="Team Member 5">
            <h4>Hrishikesh Wadhile</h4>
            <p>QA & Cross Platform</p>
            <div class="social-icons">
              <a href="https://instagram.com/hrishikesh_wadile" id="instagram"><i class="fab fa-instagram"></i></a>
              <a href="#" id="twitter"><i class="fab fa-x-twitter"></i></a>
              <a href="https://linkedin.com/in/hrishikesh-wadile-5b8284292" id="linkedin"><i class="fab fa-linkedin"></i></a>
              <a href="https://github.com/HrishikeshWadile" id="github"><i class="fab fa-github"></i></a>
            </div>
          </div>
          <div class="col-md-4 mb-4">
            <img src="/anushka.jpg" class="rounded-circle img-fluid mb-3" alt="Team Member 6">
            <h4>Anushka Gaikwad</h4>
            <p>Content Manager</p>
            <div class="social-icons">
              <a href="https://instagram.com/anushkagaikwad924" id="instagram"><i class="fab fa-instagram"></i></a>
              <a href="https://x.com/AnushkaGai32263" id="twitter"><i class="fab fa-x-twitter"></i></a>
              <a href="https://in.linkedin.com/in/anushka-gaikwad-562981310" id="linkedin"><i class="fab fa-linkedin"></i></a>
              <a href="#" id="github"><i class="fab fa-github"></i></a>
            </div>
          </div>
        </div>
      </div>
    </section>
    <script>
      // /preloader js styling
      let preloader = document.querySelector("#preloader");
                window.addEventListener("load",function(e){
                    preloader.style.display = "none";
                });
      document.querySelector("#chinmay-photo").addEventListener("click", function(){
        document.querySelector("#chinmay-photo").setAttribute("src", "/chinmay2.jpg");
        document.querySelector("#chinmay-role").setHTMLUnsafe("AI Jargon Expert");
      });
    </script>
    <script>
      window.embeddedChatbotConfig = {
      chatbotId: "3y5y_b4ZtgDExQUL8b2_A",
      domain: "www.chatbase.co"
      }
      </script>
      <script
      src="https://www.chatbase.co/embed.min.js"
      chatbotId="3y5y_b4ZtgDExQUL8b2_A"
      domain="www.chatbase.co"
      defer>
      </script>

    <%- include('partials/bottom_nav') %>
</body>
</html>
