<body id="io0c" class="bg-gray-900 text-white">
<div id="i0ds" class="w-full lg:h-28">
<nav id="i5gd" x-data="{ isOpen: false }" class="z-50 w-full p-6 fixed">
<div id="ikli" class="container mx-auto flex w-full flex-col rounded-lg bg-gray-800 bg-opacity-80 p-2 backdrop-blur backdrop-filter lg:flex-row">
<div class="flex h-12 items-center">
<h1 id="ibt8" class="text-2xl font-bold py-1 rounded-full tracking-widest px-4 border-2 border-white">FlowMetrics
</h1>
<div class="flex-grow lg:hidden">
</div>
<div x-on:click="isOpen = !isOpen" x-on:click.outside="isOpen = false" class="flex w-12 cursor-pointer items-center justify-center lg:hidden">
<span :class="!isOpen ? '' : 'hidden'"><i title="icon" class="fas fa-bars">
</i></span>
<span :class="isOpen ? '' : 'hidden'"><i title="icon" class="fas fa-times">
</i></span>
</div>
</div>
<div id="ixpsh" :class="isOpen ? '' : 'hidden'" class="flex-grow flex-col justify-end pt-4 lg:flex lg:flex-row lg:pt-0">
<a href="#features" class="-mx-2 flex h-12 items-center px-6 lg:mx-0 text-gray-300 hover:text-white">Features</a>
<a href="#benefits" class="-mx-2 flex h-12 items-center px-6 lg:mx-0 text-gray-300 hover:text-white">Benefits</a>
<a href="#pricing" class="-mx-2 flex h-12 items-center px-6 lg:mx-0 text-gray-300 hover:text-white">Pricing</a>
<a href="#testimonials" class="-mx-2 flex h-12 items-center px-6 lg:mx-0 text-gray-300 hover:text-white">Testimonials</a>
<a href="#contact" class="mx-4 mb-4 mt-4 flex h-12 items-center justify-center rounded-lg bg-cyan-500 px-6 text-white hover:bg-cyan-700 lg:mb-0 lg:ml-4 lg:mr-0 lg:mt-0">Start Free Trial</a>
</div>
</div>
</nav>
</div>
<!--Hero Section-->
<section id="ivu3th" class="container mx-auto mb-16">
<div id="iimbqh-2-2" class="bg-gradient-to-br from-gray-900 via-gray-800 to-cyan-900 lg:rounded-lg relative overflow-hidden">
<!--Decorative Elements-->
<div id="ireiiq-2-2" class="absolute inset-0">
<div class="absolute top-0 left-0 w-48 h-48 bg-cyan-500 rounded-full mix-blend-multiply filter blur-lg opacity-20">
</div>
<div class="absolute top-1-4 right-0 w-48 h-48 bg-cyan-300 rounded-full mix-blend-multiply filter blur-lg opacity-20">
</div>
<div class="absolute bottom-0 left-1-4 w-48 h-48 bg-cyan-400 rounded-full mix-blend-multiply filter blur-lg opacity-20">
</div>
</div>
<!--Content-->
<div id="i695k6-2-2" class="relative z-10 flex flex-col items-center justify-center p-6 pt-28 lg:p-16">
<div id="iony46-2" class="max-w-4xl mx-auto text-center">
<h1 id="ip7l9g-2" class="text-4xl lg:text-6xl font-bold mb-6 text-transparent bg-gradient-to-r from-cyan-200 to-cyan-400 bg-clip-text max-w-3xl mx-auto">Transform Remote Work with AI-Powered Efficiency
</h1>
<p class="text-xl lg:text-2xl mb-8 text-gray-300">Project management and team collaboration reimagined for the modern workforce
</p>
<div id="i4fwm8-2" class="relative mb-8 flex justify-center">
<img id="idc7wj-2-2" alt="Platform Preview" src="https://assets.senangwebs.com/websites/1e14731a-1555-4170-9257-5276fce105b1/images/IKvYJ05OL1t8J4KIVG4MPhl41UmiToAzB62wodhZ.svg" class="w-full max-w-lg"/>
</div>
<div class="flex flex-col lg:flex-row gap-4 justify-center">
<a id="ing66i-2" href="#demo" class="bg-gradient-to-r from-cyan-500 to-cyan-600 text-white text-lg rounded-lg px-8 h-12 flex items-center justify-center hover:opacity-80 font-semibold">Watch Demo</a>
<a id="idrunp-2-2" href="#signup" class="backdrop-blur text-white text-lg rounded-lg px-8 h-12 flex items-center justify-center font-semibold border-2 hover:opacity-80">Start Free</a>
</div>
</div>
</div>
</div>
</section>
<!--Features Section-->
<section id="i019nt" class="h-12">
</section>
<section id="features" class="container mx-auto my-8 px-6 lg:my-16 lg:px-16">
<div class="mb-4 grid grid-cols-1 lg:mx-24 lg:mb-8">
<div class="col-span-1">
<div class="border-2 rounded-md border-cyan-500 text-cyan-500 px-2 max-w-max font-bold mb-2 lg:mb-4">Features
</div>
</div>
<div>
<h1 id="ilbyt" class="text-2xl lg:text-6xl capitalize font-bold mb-2 lg:mb-4">Everything You Need for Seamless Collaboration
</h1>
</div>
</div>
<div class="grid gap-4 lg:grid-cols-3">
<div id="ijd83x" class="flex flex-col rounded-lg border border-gray-700 p-4 bg-gray-800">
<div class="mb-8 flex h-16 w-16 items-center justify-center rounded-md bg-cyan-500 text-4xl text-white">
<i title="icon" class="fas fa-tasks">
</i>
</div>
<h4 class="mb-2 text-lg font-semibold">Real-time Task Tracking
</h4>
<p class="text-lg text-gray-300">Monitor project progress with live updates, automatic status changes, and visual workflows.
</p>
</div>
<div class="flex flex-col rounded-lg border border-gray-700 p-4 bg-gray-800">
<div class="mb-8 flex h-16 w-16 items-center justify-center rounded-md bg-cyan-500 text-4xl text-white">
<i title="icon" class="fas fa-robot">
</i>
</div>
<h4 class="mb-2 text-lg font-semibold">AI-Powered Insights
</h4>
<p class="text-lg text-gray-300">Get intelligent recommendations for task allocation, risk assessment, and productivity optimization.
</p>
</div>
<div class="flex flex-col rounded-lg border border-gray-700 p-4 bg-gray-800">
<div class="mb-8 flex h-16 w-16 items-center justify-center rounded-md bg-cyan-500 text-4xl text-white">
<i title="icon" class="fas fa-random">
</i>
</div>
<h4 class="mb-2 text-lg font-semibold">Automated Workflows
</h4>
<p class="text-lg text-gray-300">Create custom automation rules to eliminate repetitive tasks and streamline processes.
</p>
</div>
</div>
</section>
<!--Benefits Section-->
<section id="benefits" class="container mx-auto my-8 px-6 lg:my-16 lg:px-16">
<div id="it7f5j" class="mb-4 grid grid-cols-1 lg:mx-24 lg:mb-8">
<div id="iuivew">
<h1 id="i7evds" class="text-2xl lg:text-6xl capitalize font-bold mb-2 lg:mb-4">Real Results for Remote Teams
</h1>
</div>
<div id="i28011" class="flex items-center">
<p id="ivfe51" class="text-xl lg:text-2xl font-semibold w-full opacity-70 text-gray-300">Discover how FlowMetrics transforms the way distributed teams work together
</p>
</div>
</div>
<div id="i5bbh" class="flex flex-col gap-16 lg:gap-32">
<div class="flex flex-col lg:mx-24">
<div class="grid gap-8 lg:grid-cols-3 lg:gap-16">
<div class="order-2 flex flex-col justify-center gap-4 lg:order-1 lg:col-span-2 lg:gap-8">
<div class="mb-2 max-w-max rounded-md bg-cyan-900 px-2 py-1 text-cyan-400 font-bold">Productivity
</div>
<p class="text-2xl font-bold lg:text-4xl">40% Increase in Team Productivity
</p>
<p class="text-xl lg:text-2xl text-gray-300">Our AI-powered platform automatically identifies workflow bottlenecks, optimizes resource allocation, and streamlines communication channels. Teams report saving an average of 15 hours per week on administrative tasks.
</p>
<ul class="grid gap-4 text-lg">
<li class="flex items-center">
<i title="icon" class="fas text-cyan-400 mr-2 fa-check-circle">
</i>Smart task prioritization
</li>
<li class="flex items-center">
<i title="icon" class="fas text-cyan-400 mr-2 fa-check-circle">
</i>Automated progress tracking
</li>
<li class="flex items-center">
<i title="icon" class="fas text-cyan-400 mr-2 fa-check-circle">
</i>Real-time performance analytics
</li>
</ul>
</div>
<div class="order-1 lg:order-2">
<img id="i3ud7e" src="https://assets.senangwebs.com/websites/1e14731a-1555-4170-9257-5276fce105b1/images/wmceRqVBHv3mDKakw3c22E1dBjnR4jhIZ4dQ7nrh.svg" class="h-full w-full object-contain rounded-lg"/>
</div>
</div>
</div>
<div class="flex flex-col lg:mx-24">
<div class="grid gap-8 lg:grid-cols-3 lg:gap-16">
<div>
<img id="i0miqe" src="https://assets.senangwebs.com/websites/1e14731a-1555-4170-9257-5276fce105b1/images/Y2jW3mO6ywD8gQuHFUtZZtEEpSdtjn4EwW9muU9v.svg" class="h-full w-full object-contain rounded-lg"/>
</div>
<div class="flex flex-col justify-center gap-4 lg:col-span-2 lg:gap-8">
<div class="mb-2 max-w-max rounded-md bg-cyan-900 px-2 py-1 text-cyan-400 font-bold">Collaboration
</div>
<p class="text-2xl font-bold lg:text-4xl">Better Team Alignment & Communication
</p>
<p class="text-xl lg:text-2xl text-gray-300">Break down silos and keep everyone aligned with centralized project visibility and smart communication tools. Teams report 65% fewer status update meetings and 80% faster decision-making.
</p>
<ul class="grid gap-4 text-lg">
<li class="flex items-center">
<i title="icon" class="fas text-cyan-400 mr-2 fa-check-circle">
</i>Centralized project dashboard
</li>
<li class="flex items-center">
<i title="icon" class="fas text-cyan-400 mr-2 fa-check-circle">
</i>Intelligent meeting scheduling
</li>
<li class="flex items-center">
<i title="icon" class="fas text-cyan-400 mr-2 fa-check-circle">
</i>Cross-team collaboration tools
</li>
</ul>
</div>
</div>
</div>
<div class="flex flex-col lg:mx-24">
<div class="grid gap-8 lg:grid-cols-3 lg:gap-16">
<div class="order-2 flex flex-col justify-center gap-4 lg:order-1 lg:col-span-2 lg:gap-8">
<div class="mb-2 max-w-max rounded-md bg-cyan-900 px-2 py-1 text-cyan-400 font-bold">Analytics
</div>
<p class="text-2xl font-bold lg:text-4xl">Data-Driven Decision Making
</p>
<p class="text-xl lg:text-2xl text-gray-300">Transform raw project data into actionable insights with our advanced analytics engine. Leaders report 90% more confidence in project planning and resource allocation.
</p>
<ul class="grid gap-4 text-lg">
<li class="flex items-center">
<i title="icon" class="fas text-cyan-400 mr-2 fa-check-circle">
</i>Predictive project timelines
</li>
<li class="flex items-center">
<i title="icon" class="fas text-cyan-400 mr-2 fa-check-circle">
</i>Resource utilization tracking
</li>
<li class="flex items-center">
<i title="icon" class="fas text-cyan-400 mr-2 fa-check-circle">
</i>Custom performance metrics
</li>
</ul>
</div>
<div class="order-1 lg:order-2">
<img id="i9dddx" src="https://assets.senangwebs.com/websites/1e14731a-1555-4170-9257-5276fce105b1/images/q98SAaz01NgoreTOyVO0Zsoxu8PBvq9CmoJpvhgD.svg" class="h-full w-full object-contain rounded-lg"/>
</div>
</div>
</div>
</div>
</section>
<!--Pricing Section-->
<section id="iamvah" class="h-12">
</section>
<section id="pricing" class="bg-gray-800 py-16 border-y-2 border-cyan-500">
<div id="i6u1b4" class="container mx-auto my-8 px-6 lg:my-16 lg:px-16">
<div id="ix7a74" class="mb-8 text-center">
<div id="isn0rd" class="border-2 rounded-md border-cyan-500 text-cyan-500 px-2 max-w-max font-bold mb-4 mx-auto">PRICING PLANS
</div>
<h2 id="iuffc3" class="text-2xl lg:text-6xl font-bold mb-4">Choose Your Growth Path
</h2>
<p id="itbzyl" class="text-xl text-gray-300 max-w-3xl mx-auto">Scale your team's efficiency with AI-powered tools that grow with your needs
</p>
</div>
<div id="iyggbx" class="mt-4 grid gap-4 lg:gap-8 lg:mt-12 lg:grid-cols-3">
<!--Startup Plan-->
<div class="flex flex-col rounded-lg bg-gray-700 p-8 border border-gray-600">
<div class="text-center">
<h4 class="mb-2 text-xl font-semibold">Startup
</h4>
<p class="text-3xl font-bold">$29
<span class="text-sm">/month</span>
</p>
<p class="mt-2 text-sm text-gray-300">Perfect for small remote teams
</p>
</div>
<div class="mt-8 flex-grow">
<ul class="space-y-4">
<li class="flex items-start">
<i title="icon" class="fas text-cyan-400 mt-1 mr-3 fa-check">
</i>
<span>Up to 10 team members</span>
</li>
<li class="flex items-start">
<i title="icon" class="fas text-cyan-400 mt-1 mr-3 fa-check">
</i>
<span>Basic AI task prioritization</span>
</li>
<li class="flex items-start">
<i title="icon" class="fas text-cyan-400 mt-1 mr-3 fa-check">
</i>
<span>5 automated workflows</span>
</li>
<li class="flex items-start">
<i title="icon" class="fas text-cyan-400 mt-1 mr-3 fa-check">
</i>
<span>Basic performance analytics</span>
</li>
</ul>
</div>
<div class="mt-8">
<a id="iv4bdf" href="#signup" class="flex h-12 w-full items-center justify-center rounded-lg border-2 border-cyan-500 px-6 text-lg font-semibold text-cyan-400 hover:bg-cyan-900 transition">Start Free Trial</a>
</div>
</div>
<!--Growth Plan-->
<div id="i8zxj4" class="flex flex-col rounded-lg bg-cyan-500 p-8 text-white relative transform lg:scale-105 shadow-xl">
<div class="absolute -top-4 left-1-2 transform -translate-x-1-2">
<span id="ighay7" class="bg-gradient-to-r from-red-500 to-red-700 text-white text-sm font-semibold px-4 py-1 rounded-full">MOST POPULAR</span>
</div>
<div class="text-center">
<h4 class="mb-2 text-xl font-semibold">Growth
</h4>
<p class="text-3xl font-bold">$79
<span class="text-sm">/month</span>
</p>
<p class="mt-2 text-sm text-cyan-200">Ideal for scaling teams
</p>
</div>
<div class="mt-8 flex-grow">
<ul class="space-y-4">
<li class="flex items-start">
<i title="icon" class="fas mt-1 mr-3 fa-check">
</i>
<span>Up to 50 team members</span>
</li>
<li class="flex items-start">
<i title="icon" class="fas mt-1 mr-3 fa-check">
</i>
<span>Advanced AI insights & recommendations</span>
</li>
<li class="flex items-start">
<i title="icon" class="fas mt-1 mr-3 fa-check">
</i>
<span>Unlimited automated workflows</span>
</li>
<li class="flex items-start">
<i title="icon" class="fas mt-1 mr-3 fa-check">
</i>
<span>Resource optimization AI</span>
</li>
<li class="flex items-start">
<i title="icon" class="fas mt-1 mr-3 fa-check">
</i>
<span>Advanced analytics & reporting</span>
</li>
</ul>
</div>
<div class="mt-8">
<a href="#signup" class="flex h-12 w-full items-center justify-center rounded-lg bg-white px-6 text-lg font-semibold text-cyan-500 hover:opacity-90 transition">Start Free Trial</a>
</div>
</div>
<!--Enterprise Plan-->
<div class="flex flex-col rounded-lg bg-gray-700 p-8 border border-gray-600">
<div class="text-center">
<h4 class="mb-2 text-xl font-semibold">Enterprise
</h4>
<p class="text-3xl font-bold">Custom
</p>
<p class="mt-2 text-sm text-gray-300">For large organizations
</p>
</div>
<div class="mt-8 flex-grow">
<ul class="space-y-4">
<li class="flex items-start">
<i title="icon" class="fas text-cyan-400 mt-1 mr-3 fa-check">
</i>
<span>Unlimited team members</span>
</li>
<li class="flex items-start">
<i title="icon" class="fas text-cyan-400 mt-1 mr-3 fa-check">
</i>
<span>Custom AI model training</span>
</li>
<li class="flex items-start">
<i title="icon" class="fas text-cyan-400 mt-1 mr-3 fa-check">
</i>
<span>Dedicated AI optimization team</span>
</li>
<li class="flex items-start">
<i title="icon" class="fas text-cyan-400 mt-1 mr-3 fa-check">
</i>
<span>Enterprise-grade security</span>
</li>
<li class="flex items-start">
<i title="icon" class="fas text-cyan-400 mt-1 mr-3 fa-check">
</i>
<span>24/7 priority support</span>
</li>
</ul>
</div>
<div class="mt-8">
<a href="#contact" class="flex h-12 w-full items-center justify-center rounded-lg bg-cyan-500 px-6 text-lg font-semibold text-white hover:bg-cyan-700 transition">Contact Sales</a>
</div>
</div>
</div>
</div>
</section>
<!--Testimonials Section-->
<section id="ibzv3h" class="h-12">
</section>
<section id="testimonials-2" class="container mx-auto my-8 px-6 lg:my-16 lg:px-16">
<!--Header-->
<div id="icxe57" class="mb-8 text-center">
<div class="border-2 rounded-md border-cyan-500 text-cyan-500 px-2 max-w-max font-bold mb-4 mx-auto">SUCCESS STORIES
</div>
<h2 id="ifzdha" class="text-2xl lg:text-6xl font-bold mb-4">Trusted by 10,000+ Remote Teams
</h2>
<p class="text-xl text-gray-300 max-w-3xl mx-auto">See how teams across different industries are transforming their workflow with FlowMetrics
</p>
</div>
<!--Featured Testimonial-->
<div class="mb-16 bg-cyan-500 rounded-2xl p-8 text-white">
<div id="imkb6l" class="grid lg:grid-cols-2 gap-8 items-center">
<div>
<div class="flex items-center gap-2 mb-6">
<img id="iwa9ln" alt="Sarah Chen" src="https://assets.senangwebs.com/websites/1e14731a-1555-4170-9257-5276fce105b1/images/b5osyYTmnPMZjOhnwOmiBovU6p02gbeohH9WIXTM.jpg" class="rounded-full w-20 h-20"/>
<div>
<h4 class="text-xl font-bold">Sarah Chen
</h4>
<p class="text-cyan-200">VP of Engineering at TechFlow
</p>
</div>
</div>
<blockquote class="text-2xl font-semibold mb-6">"FlowMetrics helped us scale from 20 to 200 developers while maintaining our agility. Our sprint velocity improved by 45% and cross-team collaboration has never been better."
</blockquote>
<div class="flex items-center gap-4 text-cyan-200">
<span>⭐️ 98% Team Adoption</span>
<span>•</span>
<span>45% Faster Delivery</span>
</div>
</div>
<div class="hidden lg:block">
<img id="i8le9l" alt="TechFlow Team" src="https://images.pexels.com/photos/3184405/pexels-photo-3184405.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1" class="rounded-lg w-full"/>
</div>
</div>
</div>
<!--Metrics-->
<div class="grid grid-cols-2 lg:grid-cols-4 gap-4 mb-16">
<div class="bg-gray-800 p-6 rounded-xl text-center">
<p class="text-4xl font-bold text-cyan-400 mb-2">98%
</p>
<p class="text-gray-300">Customer Satisfaction
</p>
</div>
<div class="bg-gray-800 p-6 rounded-xl text-center">
<p class="text-4xl font-bold text-cyan-400 mb-2">45%
</p>
<p class="text-gray-300">Productivity Gain
</p>
</div>
<div class="bg-gray-800 p-6 rounded-xl text-center">
<p class="text-4xl font-bold text-cyan-400 mb-2">2.5x
</p>
<p class="text-gray-300">Faster Delivery
</p>
</div>
<div class="bg-gray-800 p-6 rounded-xl text-center">
<p class="text-4xl font-bold text-cyan-400 mb-2">150+
</p>
<p class="text-gray-300">Countries Served
</p>
</div>
</div>
<!--Testimonial Grid-->
<div class="grid lg:grid-cols-3 gap-6">
<div class="bg-gray-800 rounded-xl p-6 shadow-sm border border-gray-700">
<div class="text-yellow-400 text-xl mb-4">★★★★★
</div>
<blockquote class="text-gray-300 mb-6">"The automated workflows have eliminated 15 hours of manual work per week. Our team can now focus on strategic initiatives instead of repetitive tasks."
</blockquote>
<div class="flex items-center gap-4">
<img id="i5begy" alt="Marcus Thompson" src="https://assets.senangwebs.com/websites/1e14731a-1555-4170-9257-5276fce105b1/images/OR1j0KXlQoV5AvWrRx4H5KwlVY97XXHj5vcDjrqB.jpg" class="rounded-full w-12 h-12"/>
<div>
<h4 class="font-semibold">Marcus Thompson
</h4>
<p class="text-sm text-gray-400">CTO, Digital Solutions Inc.
</p>
</div>
</div>
</div>
<div class="bg-gray-800 rounded-xl p-6 shadow-sm border border-gray-700">
<div class="text-yellow-400 text-xl mb-4">★★★★★
</div>
<blockquote class="text-gray-300 mb-6">"Managing our global design team became seamless. Project delivery time improved by 40% and team satisfaction scores are at an all-time high."
</blockquote>
<div class="flex items-center gap-4">
<img id="i6j9pg" alt="Elena Rodriguez" src="https://assets.senangwebs.com/websites/1e14731a-1555-4170-9257-5276fce105b1/images/b5osyYTmnPMZjOhnwOmiBovU6p02gbeohH9WIXTM.jpg" class="rounded-full w-12 h-12"/>
<div>
<h4 class="font-semibold">Elena Rodriguez
</h4>
<p class="text-sm text-gray-400">Creative Director, Global Innovations
</p>
</div>
</div>
</div>
<div class="bg-gray-800 rounded-xl p-6 shadow-sm border border-gray-700">
<div class="text-yellow-400 text-xl mb-4">★★★★★
</div>
<blockquote class="text-gray-300 mb-6">"FlowMetrics' AI insights helped us optimize resource allocation and improve sprint planning accuracy by 60%. It's like having a data scientist on the team."
</blockquote>
<div class="flex items-center gap-4">
<img id="i3jawu" alt="James Wilson" src="https://assets.senangwebs.com/websites/1e14731a-1555-4170-9257-5276fce105b1/images/OR1j0KXlQoV5AvWrRx4H5KwlVY97XXHj5vcDjrqB.jpg" class="rounded-full w-12 h-12"/>
<div>
<h4 class="font-semibold">James Wilson
</h4>
<p class="text-sm text-gray-400">Product Manager, SaaS Solutions
</p>
</div>
</div>
</div>
</div>
</section>
<!--CTA Section-->
<section id="i9eu5k" class="h-12">
</section>
<section id="idxhg3" class="container mx-auto my-8 px-6 lg:my-16 lg:px-16">
<div class="relative grid grid-cols-1 gap-4 overflow-hidden rounded-lg bg-cyan-500 p-4 text-white lg:grid-cols-3 lg:px-16 lg:py-12">
<div class="col-span-1 flex flex-col justify-center lg:col-span-2">
<h1 class="mb-2 text-2xl font-semibold capitalize lg:text-6xl lg:font-bold">Ready to Transform Your Team's Productivity?
</h1>
<p class="mb-4 w-full text-base text-white lg:mb-8 lg:text-2xl">Start your 14-day free trial today. No credit card required.
</p>
<div class="flex flex-col gap-4 lg:flex-row">
<a href="#signup" class="flex h-12 w-full items-center justify-center rounded-lg bg-white px-6 text-lg font-semibold text-cyan-500 hover:opacity-80 lg:max-w-max">Start Free Trial</a>
<a href="#demo" class="flex h-12 w-full items-center justify-center rounded-lg border-2 border-white px-6 text-lg font-semibold text-white hover:opacity-80 lg:max-w-max">Schedule Demo</a>
</div>
</div>
<div class="justify-right hidden lg:flex">
<img id="iikukz" src="https://assets.senangwebs.com/websites/1e14731a-1555-4170-9257-5276fce105b1/images/BxhKBLjFD5jgXGZq2mSXLSsztlCnmlHttNMCQihu.svg" class="mx-auto w-full"/>
</div>
</div>
</section>
<!--Footer-->
<section id="ivn87j" class="h-12">
</section>
<footer id="ia40px" class="container mx-auto grid gap-8 px-6 lg:grid-cols-4 lg:gap-16 lg:px-16">
<div class="flex flex-col gap-2">
<div class="h-12 max-w-max">
<h2 id="i03agx" class="text-2xl font-bold text-cyan-400">FlowMetrics
</h2>
</div>
<p class="max-w-sm text-sm text-gray-300">Empowering remote teams with AI-driven project management and collaboration tools.
</p>
</div>
<div class="flex flex-col gap-2">
<h4 class="text-lg font-semibold">Product
</h4>
<a href="#features" class="text-sm text-gray-300 hover:text-white">Features</a>
<a href="#pricing" class="text-sm text-gray-300 hover:text-white">Pricing</a>
<a href="#integrations" class="text-sm text-gray-300 hover:text-white">Integrations</a>
<a href="#updates" class="text-sm text-gray-300 hover:text-white">Updates</a>
</div>
<div class="flex flex-col gap-2">
<h4 class="text-lg font-semibold">Company
</h4>
<a href="#about" class="text-sm text-gray-300 hover:text-white">About Us</a>
<a href="#careers" class="text-sm text-gray-300 hover:text-white">Careers</a>
<a href="#blog" class="text-sm text-gray-300 hover:text-white">Blog</a>
<a href="#press" class="text-sm text-gray-300 hover:text-white">Press</a>
</div>
<div class="flex flex-col gap-2">
<h4 class="text-lg font-semibold">Legal
</h4>
<a href="#privacy" class="text-sm text-gray-300 hover:text-white">Privacy Policy</a>
<a href="#terms" class="text-sm text-gray-300 hover:text-white">Terms of Service</a>
<a href="#security" class="text-sm text-gray-300 hover:text-white">Security</a>
</div>
</footer>
<footer id="ijbl0z" class="flex flex-col lg:flex-row container mx-auto pt-4 px-6 lg:px-16 mb-16">
<div class="flex justify-center">
<a href="#" class="bg-gray-700 rounded-md flex items-center justify-center w-8 h-8 text-gray-300 text-sm mr-2 hover:bg-gray-600"><i title="icon" class="fab fa-google">
</i></a>
<a href="#" class="bg-gray-700 rounded-md flex items-center justify-center w-8 h-8 text-gray-300 text-sm mr-2 hover:bg-gray-600"><i title="icon" class="fab fa-linkedin">
</i></a>
<a href="#" class="bg-gray-700 rounded-md flex items-center justify-center w-8 h-8 text-gray-300 text-sm mr-2 hover:bg-gray-600"><i title="icon" class="fab fa-twitter">
</i></a>
<a href="#" class="bg-gray-700 rounded-md flex items-center justify-center w-8 h-8 text-gray-300 text-sm mr-2 hover:bg-gray-600"><i title="icon" class="fab fa-facebook">
</i></a>
</div>
<div id="i9zz6m" class="flex-grow h-8 flex items-center justify-center lg:justify-end font-semibold text-gray-300">2024 © FlowMetrics
</div>
<div class="flex justify-center">
<a href="#" class="flex items-center justify-center w-8 h-8 text-sm lg:ml-4 bg-cyan-500 text-white rounded-md hover:bg-cyan-700"><i title="icon" class="fas fa-arrow-up">
</i></a>
</div>
</footer>
<script src="https://cdn.tailwindcss.com"></script>
<script src="//unpkg.com/alpinejs" defer></script>
</body>Welcome to SenangStart Template Preview! 🎉 Visit our homepage for a deeper dive into our offerings, or you can edit this template with drag-n-drop website builder.
Edit Template