index-4.html

<!DOCTYPE html>

<!--
 // WEBSITE: https://themefisher.com
 // TWITTER: https://twitter.com/themefisher
 // FACEBOOK: https://www.facebook.com/themefisher
 // GITHUB: https://github.com/themefisher/
-->

<html lang="en">
  <head>
    <!-- Basic Page Needs
  ================================================== -->
    <meta charset="utf-8" />
    <title>Seed Innovation Technologies</title>

    <!-- Mobile Specific Metas
  ================================================== -->
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="description" content="Corporate Html5 Template" />
    <meta
      name="viewport"
      content="width=device-width, initial-scale=1.0, maximum-scale=5.0"
    />
    <meta name="author" content="Themefisher" />
    <meta name="generator" content="Themefisher Rappo HTML Template v1.0" />

    <!-- theme meta -->
    <meta name="theme-name" content="rappo" />

    <!-- bootstrap -->
    <link rel="stylesheet" href="plugins/bootstrap/bootstrap.min.css" />
    <script src="/plugins/bootstrap/bootstrap.min.js" defer></script>
    <!-- Animate -->
    <link rel="stylesheet" href="plugins/animate-css/animate.css" />
    <!-- Icon Font css -->
    <link rel="stylesheet" href="plugins/fontawesome/css/all.css" />
    <link rel="stylesheet" href="plugins/fonts/Pe-icon-7-stroke.css" />
    <!-- Themify icon Css -->
    <link rel="stylesheet" href="plugins/themify/css/themify-icons.css" />
    <!-- Slick Carousel CSS -->
    <link rel="stylesheet" href="plugins/slick-carousel/slick/slick.css" />
    <link
      rel="stylesheet"
      href="plugins/slick-carousel/slick/slick-theme.css"
    />

    <!-- Google fonts -->
    <link rel="preconnect" href="https://fonts.googleapis.com" />
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

    <!-- Main Stylesheet -->
    <link rel="stylesheet" href="css/style.css" />
    <!--Favicon-->
    <link rel="icon" href="images/favicon.png" type="image/x-icon" />
    <link rel="preconnect" href="https://fonts.googleapis.com" />
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
    <!-- Socials -->

    <!-- Primary Meta Tags -->
    <title>Seed Inov</title>
    <meta name="title" content="Seed Inov" />
    <meta
      name="description"
      content="SeedInov harnesses cutting-edge technology to craft transformative solutions. Through a fusion of creativity and expertise, SeedInov paves the way for advancements that shape the future."
    />

    <!-- Open Graph / Facebook -->
    <meta property="og:type" content="website" />
    <meta property="og:url" content="https://seedinov.com/" />
    <meta property="og:title" content="Seed Inov" />
    <meta
      property="og:description"
      content="SeedInov harnesses cutting-edge technology to craft transformative solutions. Through a fusion of creativity and expertise, SeedInov paves the way for advancements that shape the future."
    />
    <meta
      property="og:image"
      content="https://seedinov.com/images/icon/logo.png"
    />

    <!-- Twitter -->
    <meta property="twitter:card" content="summary_large_image" />
    <meta property="twitter:url" content="https://seedinov.com/" />
    <meta property="twitter:title" content="Seed Inov" />
    <meta
      property="twitter:description"
      content="SeedInov harnesses cutting-edge technology to craft transformative solutions. Through a fusion of creativity and expertise, SeedInov paves the way for advancements that shape the future."
    />
    <meta
      property="twitter:image"
      content="https://seedinov.com/images/icon/logo.png"
    />

    <!-- Meta Tags Generated with https://metatags.io -->
    <script>
      document.addEventListener("DOMContentLoaded", function () {
        var tooltipElements = document.querySelectorAll(
          '[data-toggle="tooltip"]',
        );
        tooltipElements.forEach(function (element) {
          new bootstrap.Tooltip(element);
        });
      });
    </script>
    <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.js" defer></script>
    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-0VCSYBHKJC"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());

      gtag("config", "G-0VCSYBHKJC");
    </script>
  </head>

  <body id="top-header"></body>
</html>


<!-- LOADER TEMPLATE -->
<div id="page-loader">
  <div class="loader-icon fa fa-spin colored-border"></div>
</div>
<!-- /LOADER TEMPLATE -->

<!-- NAVBAR
    ================================================= -->

<nav class="navbar navbar-expand-lg navbar-dark fixed-top site-navigation main-nav navbar-togglable trans-navigation">
  <div class="container">
    <a class="navbar-brand" href="index-4.html">
      <h3>Rappo</h3>
    </a>
    <!-- Toggler -->
    <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarCollapse"
      aria-controls="navbarCollapse" aria-expanded="false" aria-label="Toggle navigation">
      <span class="fa fa-bars"></span>
    </button>

    <!-- Collapse -->
    <div class="collapse navbar-collapse has-dropdown" id="navbarCollapse">
      <!-- Links -->
      <ul class="navbar-nav ">
        <li class="nav-item dropdown">
          <a class="nav-link dropdown-toggle" href="#!" id="navbarWelcome" role="button" data-toggle="dropdown"
            aria-haspopup="true" aria-expanded="false">
            Home
          </a>
          <ul class="dropdown-menu" aria-labelledby="navbarWelcome">
            <li><a class="dropdown-item" href="index.html">Home-1</a></li>
            <li><a class="dropdown-item" href="index-2.html">Home-2</a></li>
            <li><a class="dropdown-item" href="index-3.html">Home-3</a></li>
            <li><a class="dropdown-item" href="index-4.html">Home-4</a></li>

            <li class="dropdown dropdown-submenu dropright">
              <a class="dropdown-item dropdown-toggle" href="#!" id="dropdown0301" role="button"
                data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Sub Menu</a>

              <ul class="dropdown-menu" aria-labelledby="dropdown0301">
                <li><a class="dropdown-item" href="index.html">Submenu 01</a></li>
                <li><a class="dropdown-item" href="index.html">Submenu 02</a></li>
              </ul>
            </li>

            <li class="dropdown dropdown-submenu dropleft">
              <a class="dropdown-item dropdown-toggle" href="#!" id="dropdown0301" role="button"
                data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Sub Menu</a>

              <ul class="dropdown-menu" aria-labelledby="dropdown0301">
                <li><a class="dropdown-item" href="index.html">Submenu 01</a></li>
                <li><a class="dropdown-item" href="index.html">Submenu 02</a></li>
              </ul>
            </li>
          </ul>
        </li>
        <li class="nav-item ">
          <a href="about.html" class="nav-link js-scroll-trigger">
            About
          </a>
        </li>
        <li class="nav-item ">
          <a href="service.html" class="nav-link js-scroll-trigger">
            Services
          </a>
        </li>
        <li class="nav-item ">
          <a href="pricing.html" class="nav-link js-scroll-trigger">
            Pricing
          </a>
        </li>

        <li class="nav-item ">
          <a href="project.html" class="nav-link js-scroll-trigger">
            Projects
          </a>
        </li>

        <li class="nav-item ">
          <a href="contact.html" class="nav-link">
            Contact
          </a>
        </li>
      </ul>

      <ul class="ml-lg-auto list-unstyled m-0 nav-btn">
        <li><a href="contact.html" class="btn btn-trans-white btn-circled">Get a quote</a></li>
      </ul>
    </div> <!-- / .navbar-collapse -->
  </div> <!-- / .Container -->
</nav>

 <!-- HERO
    ================================================== -->
    <section class="banner-area py-5" id="banner-4">
       <div class="overlay feature-overlay"></div>
        <!-- Content -->
        <div class="container">
            <div class="row  align-items-center justify-content-center">
                <div class="col-md-12 col-lg-9">
                   <div class="banner-content2 text-center style-2">
                        <!-- Heading -->
                        <h1 class="display-4 mb-4 ">
                            Industry Leading Managed Services Solutions
                        </h1>

                        <!-- Subheading -->
                        <p class="lead mb-5 pr-0">
                            Pindom is set of landing and support pages aimed at helping companies promote new products and business launches.
                        </p>

                        <!-- Button -->
                        <p class="mb-0">
                            <a href="#!" target="_blank" class="btn btn-white btn-circled">
                                Purchase now
                            </a>
                        </p>
                    </div>
                </div>
            </div> <!-- / .row -->
        </div> <!-- / .container -->
    </section>


<section class="section bg-grey intro-bg-image" id="feature">
    <div class="container">
        <div class="row justify-content-center">
            <div class="col-lg-12 mb-3 text-center justify-content-center">
                <h2 class="head-title-text mb-5">
                    We consistently put forth our best effort and consistently left a meaningful
                    impression with the outcomes of our <span>Endeavors.</span>
                </h2>
            </div>
            </div>
        <div class="row justify-content-center mb-72">
            <div class="col-lg-3 col-sm-6 col-md-6 d-flex justify-content-center">
                <div class="text-center feature-block">
                    <div class="img-icon-block mb-4">
                        <!-- <i class="ti-thumb-up"></i> -->
                        <img loading="lazy" src="../../images/about/Frame 7.png" width="60px" height="60px" alt="">
                    </div>
                    <h4 class="mb-2">The right advice</h4>
                    <p>Our team are experts in matching you with the right provider.</p>
                </div>
            </div>

            <div class="col-lg-3 col-sm-6 col-md-6 d-flex justify-content-center">
                <div class="text-center feature-block">
                    <div class="img-icon-block mb-4">
                        <img loading="lazy" src="../../images/about/Frame 6.png" width="60px" height="60px" alt="">
                    </div>
                    <h4 class="mb-2">Excellence Personified</h4>
                    <p>We’ve been awarded for our high rate of customer satisfaction</p>
                </div>
            </div>

            <div class="col-lg-3 col-sm-6 col-md-6 d-flex justify-content-center">
                <div class="text-center feature-block">
                    <div class="img-icon-block mb-4">
                        <img loading="lazy" src="../../images/about/Frame 5.png" width="60px" height="60px" alt="">
                    </div>
                    <h4 class="mb-2">Compare the best</h4>
                    <p>We only compare market leaders with a reputation for service quality.</p>
                </div>
            </div>

            <div class="col-lg-3 col-sm-6 col-md-6 d-flex justify-content-center">
                <div class="text-center feature-block">
                    <div class="img-icon-block mb-4">
                        <img loading="lazy" src="../../images/about/Frame 4.png" width="60px" height="60px" alt="">
                    </div>
                    <h4 class="mb-2">Premium Services</h4>
                    <p>We only compare market leaders with a reputation for service quality.</p>
                </div>
            </div>
        </div>
    </div> <!-- / .container -->
<!-- </section> -->
<style>
    .feature-block {
        max-width: 200px;
    }

    .feature-block h4 {
        color: var(--heading-color, #202020);
        font-family: Plus Jakarta Sans;
        font-size: 18px;
        font-style: normal;
        font-weight: 500;
        line-height: normal;
    }

    .feature-block p {
        color: var(--text-color, #2C2C2C);
        text-align: center;
        font-family: Plus Jakarta Sans;
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        line-height: normal;
    }

    .intro-bg-image {
        background-image: url('../../images/intro/intro-bg.png');
        background-size: cover;
        background-position: center center;
    }
    
    .mb-72 {
        margin-bottom: 72px;
    }
</style>

<section class="bg-grey" id="service">
        <div class="container">
            <div class="row ">
                <div class="col-lg-4">
                    <div class="service-img">
                        <img loading="lazy" src="images/blog-lg.jpg" alt="" class="img-fluid">
                    </div>
                </div>

                <div class="col-lg-6 pl-4">
                    <div class="service-content">
                        <h1>Get a better deal and start saving money today</h1>
                        <p>We compare hundreds of leading products and plans across many categories to bring you the best value for money.</p>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <section class="pt-5 service-wrap">
        <div class="container">
            <div class="row ">
                <div class="col-lg-8 offset-lg-4">
                    <div class="carousel slide " id="service-carousel" data-ride="carousel">
                        <div class="carousel-inner">
                            <div class="carousel-item active">
                                <div class="col-lg-12">
                                    <div class="row">
                                        <div class="col-lg-6">
                                            <div class="service-block media">
                                                <div class="service-icon">
                                                    <i class="ti-reload"></i>
                                                </div>
                                                <div class="service-inner-content media-body">
                                                    <h4>Backup System</h4>
                                                    <p>Our team are experts in matching you with the right provider.</p>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="col-lg-6">
                                            <div class="service-block media">
                                                <div class="service-icon">
                                                    <i class="ti-cloud"></i>
                                                </div>
                                                <div class="service-inner-content media-body">
                                                    <h4>Cloud Hosting</h4>
                                                    <p>Our team are experts in matching you with the right provider.</p>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <div class="carousel-item">
                                <div class="col-lg-12">
                                    <div class="row">
                                        <div class="col-lg-6">
                                            <div class="service-block media">
                                                <div class="service-icon">
                                                    <i class="ti-world"></i>
                                                </div>
                                                <div class="service-inner-content media-body">
                                                    <h4>Web hosting</h4>
                                                    <p>Our team are experts in matching you with the right provider.</p>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="col-lg-6">
                                            <div class="service-block media">
                                                <div class="service-icon">
                                                    <i class="ti-server"></i>
                                                </div>
                                                <div class="service-inner-content media-body">
                                                    <h4>Office Cloud</h4>
                                                    <p>Our team are experts in matching you with the right provider.</p>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="row">
                        <div class="col-lg-12">
                            <p class="pl-3">Want to know more about this? <a href="#!">Contact us</a></p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
<section class="section seed-section" id="process">
    <div class="container" id="companies-container">
        <div class="row justify-content-center">
            <div class="col-md-8 col-lg-9 text-center m-30">
                <div class="section-heading mb-2">
                    <!-- Subheading -->
                    <p class="earn-trust mb-5">
                        We earn <span>Trust</span> by committing to provide value and consistently delivering on that
                        promise
                    </p>
                </div>
            </div>
        </div> <!-- / .row -->

        <div class="row justify-content-center align-items-center">
            <div class="col-lg-4 col-sm-3 col-6 ">
                <div class="process-block">
                    <img loading="lazy" src="../../images/companies/School Logo.svg" alt="" class="img-fluid" width="auto" height="auto">
                </div>
            </div>
            <div class="col-lg-4 col-sm-3 col-6 offset-md-0 offset-sm-1 offset-0">
                <div class="process-block">
                    <img loading="lazy" src="../../images/companies/Luvvi.png" alt="" class="img-fluid"  width="auto" height="auto">
                </div>
            </div>
            <div class="col-lg-4 col-sm-3 col-6 offset-md-0 offset-sm-1 offset-0">
                <div class="process-block">
                    <img loading="lazy" src="../../images/companies/BW.png" alt="" class="img-fluid"  width="auto" height="auto">
                </div>
            </div>
            <div class="col-lg-4 col-sm-3 col-6">
                <div class="process-block">
                    <img loading="lazy" src="../../images/companies/Tribify.png" alt="" class="img-fluid"  width="auto" height="auto">
                </div>
            </div>
            <div class="col-lg-4 col-sm-3 col-6 offset-md-0 offset-sm-1 offset-0 ">
                <div class="process-block">
                    <img loading="lazy" src="../../images/companies/Logo bird 1.png" alt="" class="img-fluid"  width="auto" height="auto">
                </div>
            </div>
            <div class="col-lg-4 col-sm-3 col-6 offset-md-0 offset-sm-1 offset-0 ">
                <div class="process-block">
                    <img loading="lazy" src="../../images/companies/Pod cut.png" alt="" class="img-fluid"  width="auto" height="auto">
                </div>
            </div>
            </div>
</section>

<section class="section" id="services-2">
  <div class="container">
    <div class="service-container">
      <div
        class="d-flex justify-content-center align-items-center flex-column"
        style="max-width: 700px; margin: 0 auto"
      >
        <!-- Heading -->
        <h2 class="section-title mb-2 text-center" id="service-heading">
          From Concept to Reality With <span>SeedInov</span> Scalable Digital
          Transformation
        </h2>
        <!-- Subheading -->
        <p class="mb-5 text-center" id="service-subheading">
          Seed Innov is an AI-powered software company and IT consultancy with a
          global presence, We specialize in delivering end-to-end, custom-built
          solutions, covering Product Design & Development and Artificial
          Intelligence solutions.
        </p>
      </div>
      <!-- / .row -->

      <div class="service-blocks">
        <div class="web-service-block">
          <!-- <i class="ti-light-bulb"></i> -->
          <div class="image-container">
            <img loading="lazy"
              src="../../images/service/chatgpt.svg"
              width="auto"
              height="auto"
              alt="Chat Bots Service"
            />
          </div>
          <h3>Chat Bots</h3>
          <p>
            Engage customers effortlessly with Seedinov's Chat Bot solutions.
            We've designed them to simplify customer interactions, streamline
            support, and enhance overall satisfaction.
          </p>
          <a class="d-flex align-items-center" href="/chatbot-service.html"
            >Learn More&nbsp;
            <img loading="lazy"
              src="../../images/icon/right-arrow.svg"
              width="auto"
              height="auto"
              alt="arrow icon"
          /></a>
        </div>

        <div class="web-service-block">
          <!-- <i class="ti-announcement"></i> -->
          <div class="image-container">
            <img loading="lazy"
              src="../../images/service/gen-ai.svg"
              width="auto"
              height="auto"
              alt="Custom Ai Solutions"
            />
          </div>
          <h3>Custom AI Solutions</h3>
          <p>
            Unlock the potential of your business with Seedinov's Custom AI
            Solutions. Our tailored applications optimize your processes,
            analyze data effectively, and empower intelligent decision-making
            for enhanced business performance.
          </p>
          <a class="d-flex align-items-center" href="/custom-solution.html"
            >Learn More&nbsp;
            <img loading="lazy"
              src="../../images/icon/right-arrow.svg"
              width="auto"
              height="auto"
              alt="arrow icon"
          /></a>
        </div>
        <div class="web-service-block">
          <!-- <i class="ti-settings"></i> -->
          <div class="image-container">
            <img loading="lazy"
              src="../../images/service/cloud-service 1.svg"
              width="auto"
              height="auto"
              alt="Saas Icon"
            />
          </div>
          <h3>SaaS (Software as a Service)</h3>
          <p>
            Take your business to new heights with Seedinov's SaaS applications.
            Our cloud-based solutions offer user-friendly experiences,
            scalability to meet your needs, and a competitive edge in the
            digital landscape.
          </p>
          <a class="d-flex align-items-center" href="/sass-service.html"
            >Learn More&nbsp;
            <img loading="lazy"
              src="../../images/icon/right-arrow.svg"
              alt="arrow Icon"
              width="auto"
              height="auto"
          /></a>
        </div>
        <div class="web-service-block">
          <!-- <i class="ti-layers-alt"></i> -->
          <div class="image-container">
            <img loading="lazy"
              src="../../images/service/ux-design.svg"
              width="auto"
              height="auto"
              alt="UI UX icon"
            />
          </div>
          <h3>Automation Services</h3>
          <p>
            Simplify and boost efficiency with Seedinov's Automation Services.
            Our solutions make tasks faster and better, allowing you to focus on
            core aspects of your business.
          </p>
          <a class="d-flex align-items-center" href="/automation-service.html"
            >Learn More&nbsp;
            <img loading="lazy"
              src="../../images/icon/right-arrow.svg"
              width="auto"
              height="auto"
              alt="arrow icon"
          /></a>
        </div>
        <div class="web-service-block">
          <!-- <i class="ti-desktop"></i> -->
          <div class="image-container">
            <img loading="lazy"
              src="../../images/service/bespoke-ai.svg"
              width="auto"
              height="auto"
              alt="Web Dev Icon"
            />
          </div>
          <h3>Product Design</h3>
          <p>
            Elevate your brand with Seedinov's Product Design expertise. Our
            talented team transforms your vision into visually captivating
            products, ensuring a positive impact on your audience.
          </p>
          <a
            class="d-flex align-items-center"
            href="/product-design-service.html"
            href="#!"
            >Learn More&nbsp;
            <img loading="lazy"
              src="../../images/icon/right-arrow.svg"
              width="auto"
              height="auto"
              alt="arrow icon"
          /></a>
        </div>
        <div class="web-service-block">
          <!-- <i class="ti-mobile"></i> -->
          <div class="image-container">
            <img loading="lazy"
              src="../../images/service/web-dev.svg"
              width="auto"
              height="auto"
              alt="Development Hub Icon"
            />
          </div>
          <h3>Development Hub</h3>
          <p>
            Seedinov's Integrated Development Solutions: Innovate effortlessly
            with our user-centric approach, combining web and app development
            for a comprehensive digital experience. Enhance brand recognition
            through our efficient development process.
          </p>
          <a class="d-flex align-items-center" href="/dev-hub-service.html"
            >Learn More&nbsp;
            <img loading="lazy"
              src="../../images/icon/right-arrow.svg"
              width="auto"
              height="auto"
              alt="arrow icon"
          /></a>
        </div>
        <!-- <div class="web-service-block"> -->
        <!-- <i class="ti-mobile"></i> -->
        <!-- <div class="image-container">
            <img
              src="../../images/service/web-dev.svg"
              width="auto"
              height="auto"
              alt="Development Hub Icon"
            />
          </div>
          <h3>Rapid MVP Development</h3>
          <p>
            Seedinov's Integrated Development Solutions: Innovate effortlessly
            with our user-centric approach, combining web and app development
            for a comprehensive digital experience. Enhance brand recognition
            through our efficient development process.
          </p>
          <a
            class="d-flex align-items-center"
            href="/mvp-service.html"
            >Learn More&nbsp;
            <img
              src="../../images/icon/right-arrow.svg"
              width="auto"
              height="auto"
              alt="arrow icon"
          /></a>
        </div> -->
      </div>
    </div>
  </div>
</section>

<section class="section" id="pricing">
        <!-- Content -->
        <div class="container">
            <div class="row justify-content-center">
                <div class="col-md-8 col-lg-6 text-center">
                    <div class="section-heading">
                        <!-- Heading -->
                        <h2 class="section-title">
                            Affordable Price Plan
                        </h2>

                        <!-- Subheading -->
                        <p>
                            Rappo can be used to create anything from a small marketing page to a sophisticated website.
                        </p>
                    </div>
                </div>
            </div> <!-- / .row -->

            <div class="row justify-content-center">
                <div class="col-lg-4 col-sm-6 col-md-6">
                    <div class="pricing-box">
                       <h3>Standard</h3>
                        <div class="price-block">
                             <h2><small>$</small>13<span>monthly</span></h2>
                        </div>

                        <ul class="price-features list-unstyled">
                            <li>Unlimited Domain</li>
                            <li>Unmetered Bandwidth</li>
                            <li>Free SSL Certificate </li>
                            <li>20 Email Subscription</li>
                            <li>SSD Hosting</li>
                        </ul>

                        <a href="#!" class="btn btn-outline-dark btn-circled">Purchase Now</a>
                    </div>
                </div>
                <div class="col-lg-4 col-sm-6 col-md-6">
                    <div class="pricing-box">
                        <h3>Premium</h3>
                        <div class="price-block">
                             <h2><small>$</small>23<span>monthly</span></h2>
                        </div>

                        <ul class="price-features list-unstyled">
                            <li>Unlimited Domain</li>
                            <li>Unmetered Bandwidth</li>
                            <li>Free SSL Certificate </li>
                            <li>20 Email Subscription</li>
                            <li>SSD Hosting</li>
                        </ul>

                        <a href="#!" class="btn btn-primary btn-circled">Purchase Now</a>
                    </div>
                </div>
                <div class="col-lg-4 col-sm-8 col-md-6">
                    <div class="pricing-box ">
                        <h3>Business</h3>
                        <div class="price-block">
                             <h2><small>$</small>33<span>monthly</span></h2>
                        </div>

                        <ul class="price-features list-unstyled">
                            <li>Unlimited Domain</li>
                            <li>Unmetered Bandwidth</li>
                            <li>Free SSL Certificate </li>
                            <li>20 Email Subscription</li>
                            <li>SSD Hosting</li>
                        </ul>

                        <a href="#!" class="btn btn-outline-dark btn-circled">Purchase Now</a>
                    </div>
                </div>
            </div>
        </div>
    </section>

<section class="section" id="projects-wrap">
  <div class="overlay"></div>
  <div class="container">
    <div class="row">
      <div class="col-lg-6">
        <div class="section-heading">
          <h1 class="text-white">
            We are trying to deliver 100% quality product and success their
            business to achieve ultimate goal.
          </h1>
        </div>
      </div>
      <!-- <div class="col-lg-6">
                    <p class="lead text-white">We are providing best service since 1990 to present , committed to best service delivery.Nullam metus enim, placerat in lacus vel, porttitor egestas libero. Etiam ex risus, feugiat eget accumsan eu, sagittis eu urna. In eget ultrices metus. Nunc accumsan </p>
                </div> -->
    </div>
  </div>
</section>

<section id="projects" class="section-bottom">
  <div class="container">
    <div class="row justify-content-center">
      <!-- <div class="col-lg-4 col-md-6 col-sm-6 mb-5">
                <div class="single-project">
                    <object class="img-fluid" type="image/svg+xml" data="images/projects/sfl.svg">
                        Your browser does not support SVG.
                    </object>
                    <div class="project-content">
                        <h4>School for life</h4>
                        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Cupiditate eligendi consequuntur
                            veniam quod</p>
                    </div>
                </div>
            </div> -->
      <div class="col-lg-4 col-md-6 col-sm-6 mb-5">
        <div class="single-project">
          <img loading="lazy" src="images/projects/p-4.jpg" alt="" class="img-fluid" />
          <div class="project-content">
            <h4>Project: business</h4>
            <p>
              Lorem ipsum dolor sit amet, consectetur adipisicing elit.
              Cupiditate eligendi consequuntur veniam quod
            </p>
          </div>
        </div>
      </div>
      <div class="col-lg-4 col-md-6 col-sm-8">
        <div class="single-project">
          <img loading="lazy" src="images/projects/p-3.jpg" alt="" class="img-fluid" />
          <div class="project-content">
            <h4>Project : Marketing</h4>
            <p>
              Lorem ipsum dolor sit amet, consectetur adipisicing elit.
              Cupiditate eligendi consequuntur veniam quod
            </p>
          </div>
        </div>
      </div>
    </div>

    <div class="row py-4">
      <div class="col-lg-7 col-md-12 col-sm-12">
        <div class="single-project">
          <img loading="lazy" src="images/bg/banner_bg.jpg" alt="" class="img-fluid" />
        </div>
      </div>
      <div class="col-lg-4 col-md-12 col-sm-12">
        <div class="project-content-block">
          <h4>Do you know who we are?</h4>
          <h2>More than just service your products...</h2>
          <p>
            Explain to you how all this mistaken idea of denouncing pleasure and
            praising pain was born and we will give you a complete account of
            the system.
          </p>
        </div>
      </div>
    </div>
  </div>
</section>


<section class="section" id="section-testimonial">
  <div class="container">
    <div class="testimonial-container">
      <div
        class="d-flex justify-content-center align-items-center flex-column"
        style="max-width: 600px; margin: 0 auto"
      >
        <!-- Heading -->
        <h2
          class="section-title mb-2 text-white text-center"
          id="service-heading"
        >
          Raving Reviews: Client <span>Testimonials</span>
        </h2>
        <!-- Subheading -->
        <p class="text-white text-center" id="service-subheading">
          We place a strong emphasis on ensuring client satisfaction, and we are
          proud to share testimonials from our valued clients
        </p>
      </div>
      <div class="row align-items-center">
        <div class="col-lg-12 d-flex justify-content-end technology-arrow">
          <div>
            <button class="testimonial-prev slider-prev">
              <img loading="lazy" src="../../images/arrow.png" width="40px" height="20px" />
            </button>
            <button class="testimonial-next slider-next">
              <img loading="lazy" src="../../images/arrow.png" width="40px" height="20px" />
            </button>
          </div>
        </div>
        <div class="col-lg-12 col-sm-12 col-md-12">
          <div class="testimonals-slider">

            <!-- Video Review -->
            <div class="element video-gallery element-1" data-video-src="../../images/testimonials/sam-cropped.mp4" data-author-img="../../images/client/sam.png" data-author-name="Oscar van Maarseveen" data-author-role="Orthopedic resident & Entrepreneur AI Healthcare" data-star-rating="5" data-description="The SeedInov team have been a pleasure to work with. We're partnering to build a complex AI-driven tech product, and every step of the way I've been impressed with their communication, pace, quality, and flexibility. I've had some staff engineers review their code, and they've concluded the same thing -- these guys are killer. Cannot recommend highly enough.">
              
              <div class="test-inner mx-3">
                The SeedInov team have been a pleasure to work with. We're partnering to build a complex AI-driven tech product, and every step of the way I've been impressed with their communication, pace, quality, and flexibility. I've had some staff engineers review their code, and they've concluded the same thing -- these guys are killer. Cannot recommend highly enough.
                <div
                  style="
                    display: inline-flex;
                    align-items: flex-start;
                    gap: 4px;
                    margin-bottom: 10px;
                  "
                >
                  <img loading="lazy"
                    src="../../images/icon/star.svg"
                    width="auto"
                    height="auto"
                    alt="star"
                  />
                  <img loading="lazy"
                    src="../../images/icon/star.svg"
                    width="auto"
                    height="auto"
                    alt="star"
                  />
                  <img loading="lazy"
                    src="../../images/icon/star.svg"
                    width="auto"
                    height="auto"
                    alt="star"
                  />
                  <img loading="lazy"
                    src="../../images/icon/star.svg"
                    width="auto"
                    height="auto"
                    alt="star"
                  />
                  <img loading="lazy"
                    src="../../images/icon/star.svg"
                    width="auto"
                    height="auto"
                    alt="star"
                  />
                </div>
                <div class="test-author-thumb d-flex">
                  <img loading="lazy"
                    src="images/client/sam.png"
                    alt="Testimonial author"
                    class="img-fluid"
                    width="auto"
                    height="auto"
                  />
                  <div class="test-author-info">
                    <h4>Sam Slezek</h4>
                    <h6>Product Owner Of Thespian</h6>
                  </div>
                  <div class="play-button" data-video-src="../../images/testimonials/sam-cropped.mp4" data-author-img="../../images/client/sam.png" data-author-name="Sam Slezek" data-author-role="Product Owner Of Thespian" data-star-rating="5" data-description="The SeedInov team have been a pleasure to work with. We're partnering to build a complex AI-driven tech product, and every step of the way I've been impressed with their communication, pace, quality, and flexibility. I've had some staff engineers review their code, and they've concluded the same thing -- these guys are killer. Cannot recommend highly enough.">&#9658;</div>
                </div>
              </div>
             
            </div>
            
             <!-- Video Review -->
            <div class="element video-gallery element-2" >
              
              <div class="test-inner mx-3">
                I want to share how much I value my partnership with SeedInov. As the CEO of EsperWise, I have seen first-hand the amazing AI applications they create. These tools have become a part of our business and help us innovate and work more efficiently. SeedInov's skill and dedication have played a big role in our success!
                <div
                  style="
                    display: inline-flex;
                    align-items: flex-start;
                    gap: 4px;
                    margin-bottom: 10px;
                  "
                >
                  <img loading="lazy"
                    src="../../images/icon/star.svg"
                    width="auto"
                    height="auto"
                    alt="star"
                  />
                  <img loading="lazy"
                    src="../../images/icon/star.svg"
                    width="auto"
                    height="auto"
                    alt="star"
                  />
                  <img loading="lazy"
                    src="../../images/icon/star.svg"
                    width="auto"
                    height="auto"
                    alt="star"
                  />
                  <img loading="lazy"
                    src="../../images/icon/star.svg"
                    width="auto"
                    height="auto"
                    alt="star"
                  />
                  <img loading="lazy"
                    src="../../images/icon/star.svg"
                    width="auto"
                    height="auto"
                    alt="star"
                  />
                </div>
                <div class="test-author-thumb d-flex">
                  <img loading="lazy"
                    src="images/client/oscar.png"
                    alt="Testimonial author"
                    class="img-fluid"
                    width="auto"
                    height="auto"
                  />
                  <div class="test-author-info">
                    <h4>Oscar van Maarseveen</h4>
                    <h6>Orthopedic resident & Entrepreneur AI Healthcare</h6>
                  </div>
                  <div class="play-button" data-video-src="../../images/testimonials/oscar.mp4" data-author-img="../../images/client/oscar.png" data-author-name="Oscar van Maarseveen" data-author-role="Orthopedic resident & Entrepreneur AI Healthcare" data-star-rating="5" data-description="Great Experience!">&#9658;</div>
                </div>
              </div>
             
            </div>
            <div class="element element-3">
              
              <div class="test-inner mx-3">
                The seedinnov  team are highly communicative professionals, always available to keep you informed about all project updates. They are known for their respectfulness and consistently deliver excellent results on time.
                <div
                  style="
                    display: inline-flex;
                    align-items: flex-start;
                    gap: 4px;
                    margin-bottom: 10px;
                  "
                >
                  <img loading="lazy"
                    src="../../images/icon/star.svg"
                    width="auto"
                    height="auto"
                    alt="star"
                  />
                  <img loading="lazy"
                    src="../../images/icon/star.svg"
                    width="auto"
                    height="auto"
                    alt="star"
                  />
                  <img loading="lazy"
                    src="../../images/icon/star.svg"
                    width="auto"
                    height="auto"
                    alt="star"
                  />
                  <img loading="lazy"
                    src="../../images/icon/star.svg"
                    width="auto"
                    height="auto"
                    alt="star"
                  />
                  <img loading="lazy"
                    src="../../images/icon/star.svg"
                    width="auto"
                    height="auto"
                    alt="star"
                  />
                </div>
                <div class="test-author-thumb d-flex">
                  <img loading="lazy"
                    src="images/client/ayoub.png"
                    alt="Testimonial author"
                    class="img-fluid"
                    width="auto"
                    height="auto"
                  />
                  <div class="test-author-info">
                    <h4>Ayoub Khefifi</h4>
                    <h6>CoFounder, Podcut.ai</h6>
                  </div>
                </div>
              </div>
            </div>
            <div class="element element-4">
              <div class="test-inner mx-3">
               "Our dream team: Where time zones are our greatest enemy."
                <div
                  style="
                    display: inline-flex;
                    align-items: flex-start;
                    gap: 4px;
                    margin-bottom: 10px;
                  "
                >
                  <img loading="lazy"
                    src="../../images/icon/star.svg"
                    width="auto"
                    height="auto"
                    alt="star"
                  />
                  <img loading="lazy"
                    src="../../images/icon/star.svg"
                    width="auto"
                    height="auto"
                    alt="star"
                  />
                  <img loading="lazy"
                    src="../../images/icon/star.svg"
                    width="auto"
                    height="auto"
                    alt="star"
                  />
                  <img loading="lazy"
                    src="../../images/icon/star.svg"
                    width="auto"
                    height="auto"
                    alt="star"
                  />
                  <img loading="lazy"
                    src="../../images/icon/star.svg"
                    width="auto"
                    height="auto"
                    alt="star"
                  />
                </div>
                <div class="test-author-thumb d-flex">
                  <img loading="lazy"
                    src="images/client/emin.png"
                    alt="Testimonial author"
                    class="img-fluid"
                    width="auto"
                    height="auto"
                  />
                  <div class="test-author-info">
                    <h4>Emin Khefifi</h4>
                    <h6>Founder, Lemino 1.0</h6>
                  </div>
                </div>
              </div>
            </div>
           
            <div class="element element-5">
              <div class="test-inner mx-3">
                An excellent start to our project! Highly recommended for their
                great communication skills, on-time delivery, and flexibility.
                <div
                  style="
                    display: inline-flex;
                    align-items: flex-start;
                    gap: 4px;
                    margin-bottom: 10px;
                  "
                >
                  <img loading="lazy"
                    src="../../images/icon/star.svg"
                    width="auto"
                    height="auto"
                    alt="star"
                  />
                  <img loading="lazy"
                    src="../../images/icon/star.svg"
                    width="auto"
                    height="auto"
                    alt="star"
                  />
                  <img loading="lazy"
                    src="../../images/icon/star.svg"
                    width="auto"
                    height="auto"
                    alt="star"
                  />
                  <img
                    src="../../images/icon/star.svg"
                    width="auto"
                    height="auto"
                    alt="star"
                  />
                  <img loading="lazy"
                    src="../../images/icon/star.svg"
                    width="auto"
                    height="auto"
                    alt="star"
                  />
                </div>
                <div class="test-author-thumb d-flex">
                  <img loading="lazy"
                    src="images/client/cameron.jpg"
                    alt="Testimonial author"
                    width="auto"
                    height="auto"
                    class="img-fluid"
                  />
                  <div class="test-author-info">
                    <h4>Cameron D’Arcy</h4>
                    <h6>
                      CEO of Brightworks - TVC and Video Content Production
                    </h6>
                  </div>
                </div>
              </div>
            </div>
            <div class="element element-6">
              <div class="test-inner mx-3">
                I had a fruitful collaboration with seedinov. Eager to continue
                working together for at least 10 years. Highly recommend for
                project starters.
                <div
                  style="
                    display: inline-flex;
                    align-items: flex-start;
                    gap: 4px;
                    margin-bottom: 10px;
                  "
                >
                  <img loading="lazy"
                    src="../../images/icon/star.svg"
                    width="auto"
                    height="auto"
                    alt="star"
                  />
                  <img loading="lazy"
                    src="../../images/icon/star.svg"
                    width="auto"
                    height="auto"
                    alt="star"
                  />
                  <img loading="lazy"
                    src="../../images/icon/star.svg"
                    width="auto"
                    height="auto"
                    alt="star"
                  />
                  <img loading="lazy"
                    src="../../images/icon/star.svg"
                    width="auto"
                    height="auto"
                    alt="star"
                  />
                  <img loading="lazy"
                    src="../../images/icon/star.svg"
                    width="auto"
                    height="auto"
                    alt="star"
                  />
                </div>
                <div class="test-author-thumb d-flex">
                  <img loading="lazy"
                    src="https://fiverr-res.cloudinary.com/image/upload/f_auto,q_auto,t_profile_small/v1/attachments/profile/photo/7d9a4e8f9dfb5a84f5c969de453e1b7a-1590644561119/160db798-63d5-4d81-978b-24babf593dae.jpg"
                    alt="Testimonial author"
                    class="img-fluid"
                    width="auto"
                    height="auto"
                  />
                  <div class="test-author-info">
                    <h4>leonaslt</h4>
                    <h6>Entrepreneur</h6>
                  </div>
                </div>
              </div>
            </div>
            <div class="element element-7">
              <div class="test-inner mx-3">
               "Flexible, well-behaved. Wish them the best."
                <div
                  style="
                    display: inline-flex;
                    align-items: flex-start;
                    gap: 4px;
                    margin-bottom: 10px;
                  "
                >
                  <img loading="lazy"
                    src="../../images/icon/star.svg"
                    width="auto"
                    height="auto"
                    alt="star"
                  />
                  <img loading="lazy"
                    src="../../images/icon/star.svg"
                    width="auto"
                    height="auto"
                    alt="star"
                  />
                  <img loading="lazy"
                    src="../../images/icon/star.svg"
                    width="auto"
                    height="auto"
                    alt="star"
                  />
                  <img loading="lazy"
                    src="../../images/icon/star.svg"
                    width="auto"
                    height="auto"
                    alt="star"
                  />
                  <img loading="lazy"
                    src="../../images/icon/star.svg"
                    width="auto"
                    height="auto"
                    alt="star"
                  />
                </div>
                <div class="test-author-thumb d-flex">
                  <img loading="lazy"
                    src="images/client/tranziner.png"
                    alt="Testimonial author"
                    class="img-fluid"
                    width="auto"
                    height="auto"
                  />
                  <div class="test-author-info">
                    <h4>Tranziner</h4>
                    <h6>Youtube Community</h6>
                  </div>
                </div>
              </div>
            </div>
            
            <div class="element element-8">
              <div class="test-inner mx-3">
                An incredible seller! Exceeded my expectations and delivered
                within time frame. Looking forward to working together again.
                <div
                  style="
                    display: inline-flex;
                    align-items: flex-start;
                    gap: 4px;
                    margin-bottom: 10px;
                  "
                >
                  <img loading="lazy"
                    src="../../images/icon/star.svg"
                    width="auto"
                    height="auto"
                    alt="star"
                  />
                  <img loading="lazy"
                    src="../../images/icon/star.svg"
                    width="auto"
                    height="auto"
                    alt="star"
                  />
                  <img loading="lazy"
                    src="../../images/icon/star.svg"
                    width="auto"
                    height="auto"
                    alt="star"
                  />
                  <img loading="lazy"
                    src="../../images/icon/star.svg"
                    width="auto"
                    height="auto"
                    alt="star"
                  />
                  <img loading="lazy"
                    src="../../images/icon/star.svg"
                    width="auto"
                    height="auto"
                    alt="star"
                  />
                </div>
                <div class="test-author-thumb d-flex">
                  <img loading="lazy"
                    src="images/client/shahbbir.png"
                    alt="Testimonial author"
                    class="img-fluid"
                    width="auto"
                    height="auto"
                  />
                  <div class="test-author-info">
                    <h4>Muhammad Shabbir</h4>
                    <h6>Founder @mrwebgcc</h6>
                  </div>
                </div>
              </div>
            </div>
            
          
            </div>
           
          </div>
        </div>
      </div>
    </div>
  </div>

  <div id="video-modal" class="modal">
    <div class="modal-content">
      <span class="close">&times;</span>
      
      <div class="player">
        <video width="100%" height="auto" class="viewer">
          <source src="" type="video/mp4" />
          Your browser does not support the video tag.
        </video>
        <div class="player__controls">
          <button class="player__button toggle" title="Toggle Play">⏵︎</button>
          <div class="progress">
            <div class="progress__filled"></div>
          </div>
        </div>
      </div>
        
    
      <div class=" mx-3">
        <div class="test-author-thumb mt-4 d-flex mb-2">
          <img loading="lazy"
            src=""
            alt="Testimonial author"
            class="img-fluid"
            width="auto"
            height="auto"
          />
          <div class="test-author-info">
            <h4></h4>
            <!-- <h6></h6> -->
            <!-- <div
              class="star-ratings"
              style="
                display: inline-flex;
                align-items: flex-start;
                gap: 0px;
                margin-bottom: 10px;
              "
            ></div> -->
          </div>
        </div>
        <!-- <p class="text-white"></p> -->
      </div>
    </div>
  </div>
</section>

<section class="seed-section" id="blog">
  <div class="container">
    <div class="row justify-content-center">
      <div class="col-md-8 col-lg-6 text-center">
        <div class="section-heading mb-4">
          <!-- Subheading -->
          <p class="col-md-11 col-lg-11 alumni-description">
            Sharing Our Journey, <br />
            Enriching Your <span>Experience</span>
          </p>
        </div>
      </div>
      <!-- / .row -->

      <div class="row justify-content-center">
        <div class="col-lg-4 col-md-6 p-0">
          <div class="blog-box m-2">
            <div class="blog-img-box">
              <img loading="lazy"
                src="images/blog/html-video-thumbnail.jpg"
                alt=""
                class="img-fluid blog-img"
              />
            </div>
            <div class="single-blog">
              <div class="blog-content">
                <h6>7 Feb 2021</h6>
                <a href="#!">
                  <h3 class="card-title">
                    Complete HTML Course Beginners to Advanced
                  </h3>
                </a>
                <p>
                  Learn HTML with a step-by-step process, including projects and
                  sources provided in the lectures. Each topic will begin with a
                  brief introduction to the previous lecture.
                </p>
                <a
                  target="_blank"
                  style="margin-top: auto"
                  href="https://www.youtube.com/watch?v=-p9X4tOQsSs&t=26s&ab_channel=ehtishamdot"
                  class="link d-flex align-items-center"
                  >Read More&nbsp;&nbsp;<img
                    src="../../images/icon/right-arrow.svg"
                    alt="arrow"
                /></a>
              </div>
            </div>
          </div>
        </div>

        <div class="col-lg-4 col-md-6 p-0">
          <div class="blog-box m-2">
            <div class="blog-img-box">
              <img loading="lazy"
                src="images/blog/programming-career.jpg"
                alt=""
                class="img-fluid blog-img"
              />
            </div>
            <div class="single-blog">
              <div class="blog-content">
                <h6>14 Jan 2021</h6>
                <a href="#!">
                  <h3 class="card-title">
                    "The only way to learn programming..." by George Hotz
                  </h3>
                </a>
                <p>
                  "The only way to learn programming is by immersing yourself in
                  hands-on projects," stated George Hotz.
                </p>
                <a
                  target="_blank"
                  style="margin-top: auto"
                  href="https://www.youtube.com/watch?v=kL2Q2ctCJys&ab_channel=ehtishamdot"
                  class="link d-flex align-items-center"
                  >Read More&nbsp;&nbsp;<img
                    src="../../images/icon/right-arrow.svg"
                    alt="arrow"
                /></a>
              </div>
            </div>
          </div>
        </div>

        <div class="col-lg-4 col-md-6 p-0">
          <div class="blog-box m-2">
            <div class="blog-img-box">
              <img loading="lazy"
                src="images/blog/visual-studio-faster.jpg"
                alt=""
                class="img-fluid blog-img"
              />
            </div>
            <div class="single-blog">
              <div class="blog-content">
                <h6>6 DEC 2020</h6>
                <a href="#!">
                  <h3 class="card-title">MAKE VISUAL STUDIO FASTER</h3>
                </a>
                <p>
                  Improve Visual Studio's performance with these optimization
                  tips. For a detailed description, explore the techniques to
                  boost its speed and efficiency.
                </p>
                <a
                  target="_blank"
                  style="margin-top: auto"
                  href="https://www.youtube.com/watch?v=D2_haCjrarE&ab_channel=ehtishamdot"
                  class="link d-flex align-items-center"
                  >Read More&nbsp;&nbsp;<img loading="lazy"
                    src="../../images/icon/right-arrow.svg"
                    alt="arrow"
                /></a>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</section>

<footer class="section" id="footer">
  <div class="overlay footer-overlay"></div>
  <!--Content -->
  <div class="container">
    <div class="row justify-content-start">
      <div class="col-lg-4 col-sm-12">
        <div class="footer-widget">
          <!-- Brand -->
          <a
            href="index.html"
            class="footer-brand text-white"
            aria-label="Visit Seedinov Website"
          >
            <img loading="lazy"
              style="max-width: 200px"
              class="logo"
              src="../../images/icon/logo.png"
              alt="seedinov logo"
            />
          </a>
          <p
            style="
              color: var(--white-color, #fafafa);
              font-size: 14px;
              font-style: normal;
              font-weight: 400;
              line-height: normal;
            "
          >
            SeedInov harnesses cutting-edge technology to craft transformative
            solutions. Through a fusion of creativity and expertise, SeedInov
            paves the way for advancements that shape the future.
          </p>
        </div>
      </div>

      <div class="col-lg-2 col-sm-6">
        <div class="footer-widget">
          <h3
            class="m-0"
            style="
              color: var(--white-color, #fafafa);
              font-size: 16px;
              font-style: normal;
              font-weight: 500;
              line-height: normal;
            "
          >
            Our Socials
          </h3>
          <a
            href="mailto:contact@seedinov.com"
            style="
              color: var(--white-color, #fafafa);
              font-size: 16px;
              font-style: normal;
              font-weight: 400;
              line-height: normal;
            "
            >contact@seedinov.com</a
          >
        </div>
        <div class="d-flex align-items-center social-icons">
          <a
            href="https://www.facebook.com/seedinov"
            target="_blank"
            class="social-icon"
            aria-label="Visit Seedinov on Facebook"
          >
            <img loading="lazy"
              src="../../images/icon/facebook.svg"
              alt="facebook icon"
              width="auto"
              height="auto"
            />
          </a>
          <!-- <a
            href="https://twitter.com/seedinov"
            target="_blank"
            class="social-icon"
            aria-label="Visit Seedinov on Twitter"
          >
            <img
              src="../../images/icon/twitter.png"
              alt="twitter icon"
              width="auto"
              height="auto"
            />
          </a> -->
          <a
            href="https://wa.me/+12282061826"
            target="_blank"
            class="social-icon"
            aria-label="Visit Seedinov on LinkedIn"
          >
            <img loading="lazy"
              src="../../images/icon/whatsapp-green.png"
              alt="linkedin icon"
              style="filter: brightness(0) invert(1)"
              width="auto"
              height="auto"
            />
          </a>
          <a
            href="https://www.linkedin.com/company/seedinov/"
            target="_blank"
            class="social-icon"
            aria-label="Visit Seedinov on LinkedIn"
          >
            <img loading="lazy"
              src="../../images/icon/linkedin.png"
              alt="linkedin icon"
              width="auto"
              height="auto"
            />
          </a>
          <a
            href="https://www.instagram.com/_seedinov/"
            target="_blank"
            class="social-icon"
            aria-label="Visit Seedinov on LinkedIn"
          > 
            <img loading="lazy"
              src="../../images/icon/instagram-green.png"
              style="filter: brightness(0) invert(1)"
              alt="instagram icon"
              width="auto"
              height="auto"
            />
          </a>
        </div>
      </div>
      <div class="col-lg-3 col-sm-6 ml-auto mt-4-mobile">
        <div class="footer-widget">
          <h3
            class="m-0"
            style="
              color: var(--white-color, #fafafa);
              font-size: 16px;
              font-style: normal;
              font-weight: 500;
              line-height: normal;
            "
          >
            Have a Project to Discuss?
          </h3>
          <a
            href="mailto:info@seedinov.com"
            style="
              color: var(--white-color, #fafafa);
              font-size: 16px;
              font-style: normal;
              font-weight: 400;
              line-height: normal;
            "
            >We’re Ready</a
          >
        </div>
        <a href="mailto:contact@seedinov.com">
          <button class="primary-btn mt-3">Contact Us</button>
        </a>
      </div>
    </div>
    <!-- / .row -->

    <div class="row pt-5">
      <div class="col-lg-12">
        <div class="overflow-hidden">
          <!-- Copyright -->
          <p class="footer-copy">
            SeedInov &copy;
            <span id="currentYear"></span>
            <script>
              var CurrentYear = new Date().getFullYear();
              document.getElementById("currentYear").innerHTML = CurrentYear;
            </script>
            . All Rights Reserved
          </p>
        </div>
      </div>
    </div>
    <!-- / .row -->
  </div>
  <!-- / .container -->
</footer>

<!--  Page Scroll to Top  -->

<a
  id="scroll-to-top"
  class="scroll-to-top green top js-scroll-trigger"
  href="#top-header"
  aria-label="Visit Seedinov on LinkedIn"
>
  <i class="fa fa-angle-up"></i>
</a>

<!-- <div class="handle-side-navbar scroll-to-top js-scroll-trigger">
  <a href="https://wa.me/+12282061826">
    <img
      src="../../images/icon/whatsapp-green.png"
      alt="twitter icon"
      width="24px"
      height="24px"
    />
  </a>
  <a href="https://www.linkedin.com/company/seedinov">
    <img
      src="../../images/icon/linkedin-green.png"
      alt="twitter icon"
      width="24px"
      height="24px"
    />
  </a>
  <a href="https://www.facebook.com/seedinov">
    <img
      src="../../images/icon/facebook-green.png"
      alt="twitter icon"
      width="24px"
      height="24px"
    />
  </a>
  <a href="https://www.instagram.com/_seedinov/">
    <img
      src="../../images/icon/instagram-green.png"
      alt="twitter icon"
      width="24px"
      height="24px"
    />
  </a>
  <a href="https://www.linkedin.com/company/seedinov">
    <img
      src="../../images/icon/twitter-x-green.png"
      alt="twitter icon"
      width="24px"
      height="24px"
    />
  </a>
</div> -->


  <!-- 
  Essential Scripts
  =====================================-->
  <!-- jQuery -->
  <!-- <script
  defer
  src="https://cdn.jsdelivr.net/npm/simplex-noise@4.0.3/dist/cjs/simplex-noise.min.js"
></script> -->
  <!-- <script src="https://cdn.jsdelivr.net/npm/simplex-noise@4.0.3/dist/cjs/simplex-noise.min.js" type="module"></script> -->
  <script src="plugins/jquery/jquery.min.js"></script>
  <!-- Bootstrap -->
  <script src="plugins/bootstrap/bootstrap.min.js"></script>
  <!-- Slick Slider -->
  <script src="plugins/slick-carousel/slick/slick.min.js"></script>
  <!-- Google Map -->
  <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCcABaamniA6OL5YvYSpB3pFMNrXwXnLwU"></script>
  <script src="plugins/google-map/gmap.js"></script>

  <script type="module">
    // Import the functions you need from the SDKs you need
    import { initializeApp } from "https://www.gstatic.com/firebasejs/10.12.2/firebase-app.js";
    import { getDatabase, ref, push, set } from "https://www.gstatic.com/firebasejs/10.12.2/firebase-database.js";
    // TODO: Add SDKs for Firebase products that you want to use
    // https://firebase.google.com/docs/web/setup#available-libraries
  
    // Your web app's Firebase configuration
    const firebaseConfig = {
    apiKey: "AIzaSyC0nJZwyOT4Q9A2uT8eFfuRak_0SfQER6g",
    authDomain: "seedinov-portfolio.firebaseapp.com",
    databaseURL: "https://seedinov-portfolio-default-rtdb.firebaseio.com",
    projectId: "seedinov-portfolio",
    storageBucket: "seedinov-portfolio.appspot.com",
    messagingSenderId: "357131043562",
    appId: "1:357131043562:web:a914294845d85ba9f20d93"
  };
    // Initialize Firebase
    var app = initializeApp(firebaseConfig);
    var database = getDatabase(app);

    var chatMessages = document.querySelector(".chat-messages");
    var userInput = document.getElementById("user-input");
    var submitBtn = document.getElementById("chat-submit-btn");
    var userInputWarpper = document.getElementById("input-wrapper");
    var loader = document.getElementById("loader");

if(submitBtn) {
  var step = 1;
  var userEmail = "";
  var userPainPoint = "";

  function getScrollHeight(elm){
    var savedValue = elm.value
    elm.value = ''
    elm._baseScrollHeight = elm.scrollHeight
    elm.value = savedValue
  }

  const handleChatSubmit = (e) => {
    e.preventDefault();
    var userInputValue = userInput.value.trim();
    if (userInputValue === "") return;

    if (step === 1) {
        userEmail = userInputValue;
        appendUserMessage(userEmail);
        userInput.value = "";
        step++;
        showLoader();
        setTimeout(function() {
            hideLoader();
            appendBotMessage("Can you share more details about your problem?");
        }, 2000); // 2-second delay
    } else if (step === 2) {
        userPainPoint = userInputValue;
        appendUserMessage(userPainPoint);
        userInput.value = "";
        userInput.disabled = true;
        submitBtn.disabled = true;
        showLoader();
        setTimeout(function() {
            hideLoader();
            appendBotMessage("Thank you! Our team will get back to you soon.");
            userInputWarpper.style.display = "none";
        }, 2000); // 2-second delay

        // Save data to Firebase
        saveMessage(userEmail, userPainPoint);
    } 
  }
  
  submitBtn.addEventListener("click", handleChatSubmit);

  userInput.addEventListener("keydown", function (e) {
    if (e.key === "Enter") {
        handleChatSubmit(e);
    }
  });

  userInput.addEventListener('input', onExpandableTextareaInput);

  function onExpandableTextareaInput() {
    console.log("Hello");
    userInput.style.height = 'auto';
    userInput.style.height = (userInput.scrollHeight) + 'px';
  }

  function appendUserMessage(message) {
    var userMessage = document.createElement("div");
    userMessage.classList.add("chat-message", "d-flex", "gap-4","flex-row-reverse");
    userMessage.innerHTML = `
        <img src="../../images/avatar.png" width="32px" height="32px" class="img-fluid"/>
        <div class="max-w-300px">
            <p style="color:#30ab89">${message}</p>
        </div>
    `;
    chatMessages.appendChild(userMessage);
  }

  function appendBotMessage(message) {
    var botMessage = document.createElement("div");
    botMessage.classList.add("chat-message", "d-flex", "gap-4");
    botMessage.innerHTML = `
        <img src="../../images/favicon.png" width="32px" height="32px" class="img-fluid"/>
        <div class="max-w-300px">
            <p>${message}</p>
        </div>
    `;
    chatMessages.appendChild(botMessage);
    chatMessages.scrollTop = chatMessages.scrollHeight; // Scroll to the bottom
  }

  function showLoader() {
    loader.style.display = 'flex';
  }

  function hideLoader() {
    loader.style.display = 'none';
  }

  // Save message to Firebase
  function saveMessage(email, painPoint) {
    const messagesRef = ref(database, 'chatForm');
    const newMessageRef = push(messagesRef);
    set(newMessageRef, {
        email: email,
        painPoint: painPoint,
        timestamp: new Date().toISOString()
    }).then(() => {
        console.log("Data saved successfully.");
    }).catch((error) => {
        console.error("Data could not be saved.", error);
    });
  }
}

document.getElementById('contactForm')
  .addEventListener('submit', contactSubmitForm);

  console.log('submitForm')
function contactSubmitForm(e) {
  e.preventDefault();

  // // Get values
  var name = getInputVal('name');
  var phone = getInputVal('phone');
  var email = getInputVal('email');
  var message = getInputVal("message");
  var subject = getInputVal("subject");

  // console.log(name, phone, email, subject, message);
  saveContactMessage(name, phone, email, subject, message);
  
  alert("Thank you for contacting us. We will get back to you shortly.");
  document.getElementById('contactForm').reset();
}

// Function to get form values
function getInputVal(id) {
  return document.getElementById(id).value;
}

// Save message to firebase
function saveContactMessage(name, phone, email, subject, message) {
    const messagesRef = ref(database, '/contact-form');
    var newMessageRef = push(messagesRef);

    try {
        set(newMessageRef, {
            name: name,
            phone: phone,
            email: email,
            subject: subject,
            message: message,
            timestamp: new Date().toISOString()
        }, function(error) {
            if (error) {
                console.error("Data could not be saved.", error);
            } else {
                console.log("Data saved successfully.");
            }
        });
    } catch (err) {
        console.log("Error:", err);
    }
}
 </script>

<script src="js/script.js" defer></script>
<script src="plugins/simplex-noise/simplex-noise.min.js" type="module"></script>
<script type="module">
    const canvas = document.getElementById('backgroundCanvas');
const ctx = canvas.getContext('2d');

let width, height;
canvas.width = width = window.innerWidth;
canvas.height = height = window.innerHeight;

const width_half = width / 2;
const height_half = height / 2;

function hsl(h, s, l, a = 1) {
    return `hsla(${h}, ${s}%, ${l}%, ${a})`;
}

function map(value, start1, stop1, start2, stop2) {
    return start2 + (stop2 - start2) * ((value - start1) / (stop1 - start1));
}

function floor(value) {
    return Math.floor(value);
}

function cos(value) {
    return Math.cos(value);
}

function sin(value) {
    return Math.sin(value);
}

function beginPath() {
    ctx.beginPath();
}

function moveTo(x, y) {
    ctx.moveTo(x, y);
}

function lineTo(x, y) {
    ctx.lineTo(x, y);
}

function stroke(color, width) {
    ctx.strokeStyle = color;
    ctx.lineWidth = width;
    ctx.stroke();
}

function compositeOperation(op) {
    ctx.globalCompositeOperation = op;
}
const noise = new SimplexNoise();

function draw(e) {
    let xCount = 35;
    let yCount = 40;
    let iXCount = 1 / (xCount - 1);
    let iYCount = 1 / (yCount - 1);
    let time = e * 0.001;
    let timeStep = 0.005; // Slowed down
    let grad = ctx.createLinearGradient(-width, 0, width, height);
    let t = time % 1;
    let tSide = floor(time % 2) === 0;
    let hueA = tSide ? 120 : 240;  // Adjusted for light and dark green hues
    let hueB = !tSide ? 240 : 240; // Adjusted for light and dark green hues
    let colorA = hsl(hueA, 100, 50,0.1);
    let colorB = hsl(hueB, 120, 50,0.1);
    grad.addColorStop(map(t, 0, 1, 0, 0.33), colorA);
    grad.addColorStop(map(t, 0, 1, 0.33, 0.66), colorB);
    grad.addColorStop(map(t, 0, 1, 0.66, 1), colorA);

    ctx.globalAlpha = map(cos(time), -1, 1, 0.15, 0.3);
    ctx.clearRect(0, 0, width, height); // Clear the canvas instead of using background color
    ctx.globalAlpha = 1;

    let opacityGrad = ctx.createLinearGradient(0, 0, width, 0);
    opacityGrad.addColorStop(0, 'rgba(0, 0, 0, 0)');
    opacityGrad.addColorStop(1, 'rgba(0, 0, 0, 1)');

    beginPath();
    for (let j = 0; j < yCount; j++) {
        let tj = j * iYCount;
        let c = cos(tj * Math.PI * 2 + time) * 0.3;
        for (let i = 0; i < xCount; i++) {
            let t = i * iXCount;
            let n = noise.noise3D(t, time, c);
            let y = height_half + n * height_half;  // Center the y-coordinate
            let x = width_half + t * (width + 20) - width_half - 10; // Center the x-coordinate
            (i ? lineTo : moveTo)(x, y);
        }
        time += timeStep;
    }
    compositeOperation('lighter');

    ctx.strokeStyle = opacityGrad;
    stroke(grad, 5);

    // ctx.filter = 'blur(10px)';
    stroke(grad, 5);
    // ctx.filter = 'blur(5px)';
    ctx.strokeStyle = opacityGrad;
    stroke(hsl(0, 0, 100, 0.8), 2);
}

let animationFrame = 0;
function animate() {
    draw(animationFrame);
    animationFrame++;
    requestAnimationFrame(animate);
}

animate();

window.addEventListener('resize', () => {
    canvas.width = width = window.innerWidth;
    canvas.height = height = window.innerHeight;
});
</script>

</body>
</html>
   