@php
    $cartItemCount = auth()->check() ? \App\Models\Cart::where('user_id', auth()->id())->sum('quantity') : 0;
@endphp
{{-- ── Top Header ─────────────────────────────────────────────────────── --}}
<style>
    .search-btn {
        background: #ffffff !important;
        border: none !important;
    }
</style>
<header role="banner">
    <div class="top-header">
        <div class="container">
            <div class="row align-items-center justify-content-center">

                <div class="col-lg-6 col-md-12">
                    <ul class="header-contact-info" aria-label="Site information">
                        <li>{{ config('settings.welcome_text', 'Welcome to ' . config('app.name')) }}</li>
                        <li>
                            Call: <a href="tel:{{ preg_replace('/\s+/', '', config('settings.phone', '')) }}"
                                aria-label="Call us at {{ config('settings.phone') }}">
                                {{ config('settings.phone') }}
                            </a>
                        </li>
                        {{-- <li>
                            <div class="dropdown language-switcher d-inline-block">
                                <button class="dropdown-toggle" type="button" data-bs-toggle="dropdown"
                                    aria-haspopup="true" aria-expanded="false" aria-label="Select language: English">
                                    <img src="{{ asset('assets/img/us-flag.jpg') }}" alt="English language"
                                        width="20" height="14">
                                    <span>Eng <i class='bx bx-chevron-down' aria-hidden="true"></i></span>
                                </button>
                                <div class="dropdown-menu">
                                    <a href="#" class="dropdown-item d-flex align-items-center" lang="de"
                                        hreflang="de">
                                        <img src="{{ asset('assets/img/germany-flag.jpg') }}" class="shadow-sm"
                                            alt="German language" width="20" height="14">
                                        <span>Ger</span>
                                    </a>
                                </div>
                            </div>
                        </li> --}}
                    </ul>
                </div>

                <div class="col-lg-6 col-md-12">
                    <ul class="header-top-menu" aria-label="User account links">
                        <li>
                            <a href="{{ auth()->check() ? route('account.dashboard') : route('login') }}"
                                aria-label="My Account">
                                <i class='bx bxs-user' aria-hidden="true"></i> My Account
                            </a>
                        </li>
                        <li>
                            <a href="{{ auth()->check() ? route('wishlist.index') : route('login') }}"
                                aria-label="View Wishlist">
                                <i class='bx bx-heart' aria-hidden="true"></i> Wishlist
                            </a>
                        </li>
                        {{-- <li>
                            <a href="#" aria-label="Compare products">
                                <i class='bx bx-shuffle' aria-hidden="true"></i> Compare
                            </a>
                        </li> --}}
                        @auth
                            <li>
                                <a href="#"
                                    onclick="event.preventDefault(); document.getElementById('top-logout-form').submit();"
                                    aria-label="Logout">
                                    <i class='bx bx-log-out' aria-hidden="true"></i> Logout
                                </a>
                                <form id="top-logout-form" action="{{ route('logout') }}" method="POST"
                                    style="display:none;">
                                    @csrf
                                </form>
                            </li>
                        @else
                            <li>
                                <a href="{{ route('login') }}" aria-label="Login to your account">
                                    <i class='bx bx-log-in' aria-hidden="true"></i> Login
                                </a>
                            </li>
                        @endauth
                    </ul>

                    <ul class="header-top-others-option" aria-label="Quick actions">
                        <li class="option-item">
                            <div class="search-btn-box">
                                <button class="search-btn" aria-label="Open search" type="button">
                                    <i class="bx bx-search-alt" aria-hidden="true"></i>
                                </button>
                            </div>
                        </li>
                        <li class="option-item">
                            <div class="cart-btn">
                                <a href="{{ route('cart') }}" data-bs-toggle="modal" data-bs-target="#shoppingCartModal"
                                    aria-label="Shopping cart, 0 items">
                                    <i class='bx bx-shopping-bag' aria-hidden="true"></i>
                                    <span aria-live="polite">{{ $cartItemCount }}</span>
                                </a>
                            </div>
                        </li>
                    </ul>
                </div>

            </div>
        </div>
    </div>
    <div class="mm-marquee-strip" aria-label="Promotions and announcements" role="marquee">
        <div class="mm-marquee-track">
            <span>✨ Free Shipping on Orders Above ₹999 &nbsp;&nbsp;|&nbsp;&nbsp;</span>
            <span>🎁 Use code <strong>MIHI10</strong> for 10% off your first order &nbsp;&nbsp;|&nbsp;&nbsp;</span>
            <span>👗 New arrivals every week — Shop Now &nbsp;&nbsp;|&nbsp;&nbsp;</span>
            <span>💜 Handpicked styles for every mom &nbsp;&nbsp;|&nbsp;&nbsp;</span>
            <span>🚚 Easy returns within 7 days &nbsp;&nbsp;|&nbsp;&nbsp;</span>
            {{-- Duplicate for seamless loop --}}
            <span>✨ Free Shipping on Orders Above ₹999 &nbsp;&nbsp;|&nbsp;&nbsp;</span>
            <span>🎁 Use code <strong>MIHI10</strong> for 10% off your first order &nbsp;&nbsp;|&nbsp;&nbsp;</span>
            <span>👗 New arrivals every week — Shop Now &nbsp;&nbsp;|&nbsp;&nbsp;</span>
            <span>💜 Handpicked styles for every mom &nbsp;&nbsp;|&nbsp;&nbsp;</span>
            <span>🚚 Easy returns within 7 days &nbsp;&nbsp;|&nbsp;&nbsp;</span>
        </div>
    </div>
    {{-- ── Main Navigation ──────────────────────────────────────────────────── --}}
    <div class="navbar-area">

        {{-- Mobile Nav --}}
        <div class="xton-responsive-nav">
            <div class="container">
                <div class="xton-responsive-menu">
                    <div class="logo">
                        <a href="{{ route('home') }}" aria-label="{{ config('app.name') }} – Back to homepage"
                            title="{{ config('app.name') }}">
                            <img src="{{ asset('assets/img/logo_1.png') }}" width="50%" class="main-logo"
                                alt="{{ config('app.name') }} logo">
                            <img src="{{ asset('assets/img/logo_1.png') }}" width="50%" class="white-logo"
                                alt="{{ config('app.name') }} logo">
                        </a>
                    </div>
                </div>
            </div>
        </div>

        {{-- Desktop Nav --}}
        <div class="xton-nav">
            <div class="container">
                <nav class="navbar navbar-expand-md navbar-light" aria-label="Main navigation">

                    <a class="navbar-brand" href="{{ route('home') }}"
                        aria-label="{{ config('app.name') }} – homepage" title="{{ config('app.name') }}">
                        <img src="{{ asset('assets/img/logo_1.png') }}" width="50%" class="main-logo"
                            alt="{{ config('app.name') }} logo">
                        <img src="{{ asset('assets/img/logo_1.png') }}" width="50%" class="white-logo"
                            alt="{{ config('app.name') }} logo">
                    </a>

                    <div class="collapse navbar-collapse mean-menu">
                        <ul class="navbar-nav" role="menubar">

                            <li class="nav-item" role="none">
                                <a href="{{ route('home') }}"
                                    class="nav-link {{ request()->routeIs('home') ? 'active' : '' }}" role="menuitem"
                                    @if (request()->routeIs('home')) aria-current="page" @endif>Home</a>
                            </li>

                            {{-- Shop Megamenu --}}
                            <li class="nav-item megamenu" role="none">
                                <a href="{{ route('shop.index') }}"
                                    class="nav-link {{ request()->routeIs('shop*') ? 'active' : '' }}" role="menuitem"
                                    aria-haspopup="true" aria-expanded="false"
                                    @if (request()->routeIs('shop*')) aria-current="page" @endif>
                                    Shop
                                </a>
                                {{-- <ul class="dropdown-menu" role="menu" aria-label="Shop categories">
                                <li class="nav-item" role="none">
                                    <div class="container">
                                        <div class="row justify-content-center">
                                            @foreach ($headerCategories as $category)
                                            <div class="col">
                                                <h2 class="submenu-title" style="font-size:0.95rem; font-weight:700; margin-bottom:0.5rem;">
                                                    {{ $category->name }}
                                                </h2>
                                                <ul class="megamenu-submenu" role="menu">
                                                    @foreach ($category->children as $sub)
                                                    <li role="none">
                                                        <a href="{{ route('shop.category', $sub->slug) }}" role="menuitem">
                                                            {{ $sub->name }}
                                                        </a>
                                                    </li>
                                                    @endforeach
                                                </ul>
                                            </div>
                                            @endforeach
                                        </div>
                                    </div>
                                </li>
                            </ul> --}}
                            </li>

                            <li class="nav-item" role="none">
                                <a href="{{ route('about') }}"
                                    class="nav-link {{ request()->routeIs('about') ? 'active' : '' }}"
                                    role="menuitem"
                                    @if (request()->routeIs('about')) aria-current="page" @endif>About</a>
                            </li>

                            <li class="nav-item" role="none">
                                <a href="{{ route('blog.index') }}"
                                    class="nav-link {{ request()->routeIs('blog*') ? 'active' : '' }}"
                                    role="menuitem"
                                    @if (request()->routeIs('blog*')) aria-current="page" @endif>Blog</a>
                            </li>

                            <li class="nav-item" role="none">
                                <a href="{{ route('contact') }}"
                                    class="nav-link {{ request()->routeIs('contact') ? 'active' : '' }}"
                                    role="menuitem"
                                    @if (request()->routeIs('contact')) aria-current="page" @endif>Contact</a>
                            </li>

                        </ul>

                        <div class="others-option">
                            <div class="option-item">
                                <div class="search-btn-box">
                                    <button class="search-btn" type="button" aria-label="Open search">
                                        <i class="bx bx-search-alt" aria-hidden="true"></i>
                                    </button>
                                </div>
                            </div>
                            <div class="option-item">
                                <div class="cart-btn">
                                    <a href="{{ route('cart') }}">
                                        <i class='bx bx-shopping-bag' aria-hidden="true"></i>
                                        <span aria-live="polite">{{ $cartItemCount }}</span>
                                    </a>
                                </div>
                            </div>
                        </div>
                    </div>

                </nav>
            </div>
        </div>

    </div>
    {{-- ── End Navigation ───────────────────────────────────────────────────── --}}
</header>

{{-- ── Breadcrumb (auto-shown on inner pages) ──────────────────────────── --}}
@unless (request()->routeIs('home'))
    <nav class="breadcrumb-area" aria-label="Breadcrumb">
        <div class="container">
            <ol class="breadcrumb" itemscope itemtype="https://schema.org/BreadcrumbList">
                <li class="breadcrumb-item" itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem">
                    <a href="{{ route('home') }}" itemprop="item" aria-label="Home">
                        <span itemprop="name">Home</span>
                    </a>
                    <meta itemprop="position" content="1">
                </li>

                @if (request()->routeIs('shop*'))
                    <li class="breadcrumb-item" itemprop="itemListElement" itemscope
                        itemtype="https://schema.org/ListItem">
                        <a href="{{ route('shop.index') }}" itemprop="item">
                            <span itemprop="name">Shop</span>
                        </a>
                        <meta itemprop="position" content="2">
                    </li>
                @endif

                @if (isset($category) && $category instanceof \App\Models\Category)
                    @php
                        $catSlug = method_exists($category, 'getRouteSlug')
                            ? $category->getRouteSlug()
                            : \Str::slug($category->category_name);
                    @endphp
                    <li class="breadcrumb-item" itemprop="itemListElement" itemscope
                        itemtype="https://schema.org/ListItem">
                        <a href="{{ route('shop.category', $catSlug) }}" itemprop="item">
                            <span itemprop="name">{{ $category->category_name }}</span>
                        </a>
                        <meta itemprop="position" content="3">
                    </li>
                @endif

                @if (isset($product) && $product instanceof \App\Models\Product)
                    <li class="breadcrumb-item active" aria-current="page" itemprop="itemListElement" itemscope
                        itemtype="https://schema.org/ListItem">
                        <span itemprop="name">{{ $product->product_name }}</span>
                        <meta itemprop="position"
                            content="{{ isset($category) && $category instanceof \App\Models\Category ? 4 : 3 }}">
                    </li>
                @else
                    <li class="breadcrumb-item active" aria-current="page">
                        {{ ucfirst(str_replace(['-', '_'], ' ', request()->segment(count(request()->segments())))) }}
                    </li>
                @endif
            </ol>
        </div>
    </nav>
@endunless
<!--=================================
        Main Banner -->

<div class="site-content">

    <div class="container-fluid">
        <div class="item-efftect">
            <div class="efftect overflow-hidden"></div>
            <div class="efftect overflow-hidden"></div>
            <div class="efftect overflow-hidden"></div>
            <div class="efftect overflow-hidden"></div>
            <div class="efftect overflow-hidden"></div>
        </div>
    </div>

    <div class="main-banner main-banner-2">
        <div class="banner-inner">
            <img class="img-fluid banner-bg" src="images/banner/banner-02/bg.jpg" alt="#">
            <div class="container">
                <div class="row">
                    <div class="col-md-12">
                        <div class="banner-conent">
                            <span class="sub-title"><img class="img-fluid" src="images/subtitle-icon.png" alt=""> Fluxx Tech</span>
                            <h1 class="title mb-2 mb-md-4">Technology that</h1>
                            <div class="conent">
                                <p class="small-text">transforms ideas into scalable digital solutions by combining strategy, creativity, and modern technology to drive business growth.</p>
                                <h1 class="title"> <img class="img-fluid banner-icon" src="images/banner/banner-02/01.png" alt="#"> Drives Growth.</h1>
                            </div>

                            <div class="row justify-content-start align-items-center">
                                <div class="col-lg-3 col-md-4 col-sm-4 order-sm-0 order-2">
                                    <a class="btn btn-effect" href="#">
                                        <span>Get A Quote</span>
                                        <svg width="20" height="22" viewBox="0 0 20 22" fill="none" xmlns="http://www.w3.org/2000/svg">
                                            <g clip-path="url(#clip0_59_253)">
                                                <path d="M19.4854 11.4293L17.0513 12.221C13.1214 13.4993 10.3036 16.9595 9.84784 21.0668C9.49371 16.981 6.71926 13.5081 2.81255 12.2604L0.210283 11.4293" stroke="white" stroke-width="2" />
                                                <path d="M9.83594 20.8889L9.83594 0" stroke="white" stroke-width="2" />
                                            </g>
                                            <defs>
                                                <clipPath id="clip0_59_253">
                                                    <rect width="21.3333" height="20" fill="white" transform="translate(20) rotate(90)" />
                                                </clipPath>
                                            </defs>
                                        </svg>
                                    </a>
                                </div>
                                <div class="col-lg-3 col-md-4 col-sm-5 order-sm-0 order-1">
                                    <div class="counter counter-style-1 pt-0">
                                        <div class="counter-number"><span class="timer mb-0" data-to="100" data-speed="2000">100</span><span class="suffix">%</span></div>
                                        <div class="counter-info"><span class="counter-title">Customer Satisfaction</span></div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="content-wrapper">

        <!--=================================
          WHAT WE DO -->
        <section class="space-ptb">
            <div class="container">
                <div class="row">
                    <div class="col-xxl-7 col-lg-8">
                        <div class="section-title mb-lg-0">
                            <span class="sub-title"><img class="img-fluid" src="images/subtitle-icon.png" alt=""> WHAT WE DO</span>
                            <h2 class="title mb-0">We build digital solutions that drive real business results.</h2>
                        </div>
                    </div>
                    <div class="col-xxl-5 col-lg-4 align-self-end">
                        <p class="mb-0 ps-xxl-5">From digital marketing to custom software development, we help brands grow with powerful, scalable, and result-driven digital solutions.</p>
                    </div>
                </div>

                <div class="row">
                    <div class="col-md-12">
                        <div class="services grid-wrapper grid-xl-4 grid-md-2 grid-sm-1 grid-gap-0  mt-5 pt-lg-4">
                            <div class="service-bottom-space service-wrapper service-style-2 ">
                                <div class="service-inner">
                                    <div class="service-icon">
                                        <img class="img-fluid" src="images/svg/services/Information-Security.svg" alt="#">
                                    </div>
                                    <div class="service-content">
                                        <h5 class="service-title">Web Development</h5>
                                        <div class="list-wrapper">
                                            <ul class="step-list list">
                                                <li><img class="img-fluid" src="images/arrow-right.png" alt="">Custom website design</li>
                                                <li><img class="img-fluid" src="images/arrow-right.png" alt="">Responsive development</li>
                                                <li><img class="img-fluid" src="images/arrow-right.png" alt="">SEO-friendly structure</li>
                                            </ul>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="service-wrapper service-style-2 service-top-space">
                                <div class="service-inner">
                                    <div class="service-icon">
                                        <img class="img-fluid" src="images/svg/services/Data-Synchronization.svg" alt="#">
                                    </div>
                                    <div class="service-content">
                                        <h5 class="service-title">App Development</h5>
                                        <div class="list-wrapper">
                                            <ul class="step-list list">
                                                <li><img class="img-fluid" src="images/arrow-right.png" alt="">Android applications</li>
                                                <li><img class="img-fluid" src="images/arrow-right.png" alt="">iOS applications</li>
                                                <li><img class="img-fluid" src="images/arrow-right.png" alt="">Cross-platform apps</li>
                                            </ul>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="service-wrapper service-style-2 service-bottom-space">
                                <div class="service-inner">
                                    <div class="service-icon">
                                        <img class="img-fluid" src="images/svg/services/Mobile-Platforms.svg" alt="#">
                                    </div>
                                    <div class="service-content">
                                        <h5 class="service-title">Branding & Designing</h5>
                                        <div class="list-wrapper">
                                            <ul class="step-list list">
                                                <li><img class="img-fluid" src="images/arrow-right.png" alt="">Brand identity design</li>
                                                <li><img class="img-fluid" src="images/arrow-right.png" alt="">UI/UX design</li>
                                                <li><img class="img-fluid" src="images/arrow-right.png" alt="">Creative assets</li>
                                            </ul>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="service-wrapper service-style-2 service-top-space">
                                <div class="service-inner">
                                    <div class="service-icon">
                                        <img class="img-fluid" src="images/svg/services/Process-Automation.svg" alt="#">
                                    </div>
                                    <div class="service-content">
                                        <h5 class="service-title">Digital Marketing</h5>
                                        <div class="list-wrapper">
                                            <ul class="step-list list">
                                                <li><img class="img-fluid" src="images/arrow-right.png" alt="">SEO & content marketing</li>
                                                <li><img class="img-fluid" src="images/arrow-right.png" alt="">Social media marketing</li>
                                                <li><img class="img-fluid" src="images/arrow-right.png" alt="">Paid ads & lead generation</li>
                                            </ul>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>

                    </div>
                </div>

            </div>
        </section>
        <!--=================================
          WHAT WE DO -->

        <!--=================================
          About Info -->
        <section class="space-pt z-index-2 ellipse-top bg-black">
            <div class="container">
                <div class="row justify-content-between">
                    <div class="col-lg-5 text-lg-center mb-5 mb-lg-0">
                        <div class="about-img">
                            <img class="img-fluid" src="images/about/about-04.jpg" alt="#">
                            <div class="about-logo">
                                <img class="img-fluid" src="images/about/about-06.png" alt="#">
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-7">
                        <div class="section-title">
                            <span class="sub-title"><img class="img-fluid" src="images/subtitle-icon.png" alt=""> About Us</span>
                            <h2 class="title">We help brands grow with smart digital solutions</h2>
                        </div>
                        <div class="ps-0 ps-lg-4 ps-xl-5">
                            <p>Fluxx Tech is a digital technology company delivering result-oriented services in digital marketing, web development, app development, branding, and custom software solutions.</p>
                            <div class="skill-wrapper pt-2">
                                <div class="skill skill-style-2">
                                    <div class="skill-bar" data-percent="60" data-delay="0" data-type="%">
                                        <div class="skill-title">Project success percentage rate</div>
                                    </div>
                                </div>
                            </div>
                            <div class="rated-reviews mt-5">
                                <h6><span>5 <i class="fa-solid fa-star"></i> </span> Rated 4.8 out of 5 based on <a href="#">500+ reviews</a></h6>
                            </div>
                            <div class="row align-items-center mt-4 pt-1">
                                <div class="col-sm-8">
                                    <div class="list-wrapper">
                                        <ul class="list col-2">
                                            <li><img class="img-fluid" src="images/arrow-right.png" alt="">Marketing Strategy</li>
                                            <li><img class="img-fluid" src="images/arrow-right.png" alt="">Paid Media</li>
                                            <li><img class="img-fluid" src="images/arrow-right.png" alt="">Influencer Marketing</li>
                                            <li><img class="img-fluid" src="images/arrow-right.png" alt="">Marketing Strategy</li>
                                            <li><img class="img-fluid" src="images/arrow-right.png" alt="">Paid Media</li>
                                            <li><img class="img-fluid" src="images/arrow-right.png" alt="">Influencer Marketing</li>
                                        </ul>
                                    </div>
                                </div>
                                <div class="col-sm-4 text-sm-end mt-4 mt-sm-0">
                                    <img class="img-fluid" src="images/about/about-05.png" alt="#">
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <!--=================================
          About Info -->

        <!--=================================
          Marquee Slide -->
        <section class="space-small-ptb overflow-hidden z-index-2 bg-black">
            <div class="container-fluid g-0 pt-5">
                <div class="row g-0">
                    <div class="col-md-12">
                        <div class="marquee-wrapper marquee-border marquee-rotate">
                            <div class="marquee-inner">
                                <div class="marquee-item">
                                    <span class="icon"><img class="img-fluid" src="images/client-logo/brand-icon1.png" alt="" /></span>
                                    <span class="title">Web Development</span>
                                </div>
                                <div class="marquee-item">
                                    <span class="icon"><img class="img-fluid" src="images/client-logo/brand-icon2.png" alt="" /></span>
                                    <span class="title">App Development</span>
                                </div>
                                <div class="marquee-item">
                                    <span class="icon"><img class="img-fluid" src="images/client-logo/brand-icon3.png" alt="" /></span>
                                    <span class="title">Branding</span>
                                </div>
                                <!-- <div class="marquee-item">
                                    <span class="icon"><img class="img-fluid" src="images/client-logo/brand-icon4.png" alt="" /></span>
                                    <span class="title">ISO Developer</span>
                                </div> -->
                                <div class="marquee-item">
                                    <span class="icon"><img class="img-fluid" src="images/client-logo/brand-icon5.png" alt="" /></span>
                                    <span class="title">Designing</span>
                                </div>
                                <div class="marquee-item">
                                    <span class="icon"><img class="img-fluid" src="images/client-logo/brand-icon1.png" alt="" /></span>
                                    <span class="title">Digital Marketing</span>
                                </div>
                                <div class="marquee-item">
                                    <span class="icon"><img class="img-fluid" src="images/client-logo/brand-icon2.png" alt="" /></span>
                                    <span class="title">UI/UX Design</span>
                                </div>
                                <div class="marquee-item">
                                    <span class="icon"><img class="img-fluid" src="images/client-logo/brand-icon3.png" alt="" /></span>
                                    <span class="title">E-Commers Marketing</span>
                                </div>
                                <div class="marquee-item">
                                    <span class="icon"><img class="img-fluid" src="images/client-logo/brand-icon4.png" alt="" /></span>
                                    <span class="title">Custom Software Development</span>
                                </div>
                                <div class="marquee-item">
                                    <span class="icon"><img class="img-fluid" src="images/client-logo/brand-icon5.png" alt="" /></span>
                                    <span class="title">SEO</span>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <!--=================================
          Marquee Slide -->

        <!--=================================
          Case Studies -->
        <!-- <section class="space-ptb z-index-2 bg-black">
            <div class="container-fluid">
                <div class="row justify-content-center">
                    <div class="col-md-10">
                        <div class="section-title text-center">
                            <span class="sub-title justify-content-center"><img class="img-fluid" src="images/subtitle-icon.png" alt=""> Case Studies</span>
                            <h2 class="title"> What's next? our latest client stories</h2>
                        </div>
                    </div>
                </div>
                <div class="row justify-content-center">
                    <div class="col-lg-12">
                        <div class="case-studies-grid grid-wrapper grid-xl-3 grid-md-2 grid-sm-1">
                            <div class="case-studies-wrapper case-studies-style-1">
                                <div class="case-studies-img">
                                    <img class="img-fluid" src="images/case-studies/01.png" alt="" />
                                    <a href="#" class="category">Music</a>
                                </div>
                                <div class="case-studies-info">
                                    <div class="case-studies-info-inner">
                                        <h3 class="case-studies-title"><a href="#">Gozzby</a></h3>
                                        <div class="case-studies-content">
                                            <div class="case-studies-description">Some people will tell you there are four while others may tell you there are eight.</div>
                                        </div>
                                        <div class="case-studies-link">
                                            <a class="btn-arrow" href="#"><svg width="17" height="16" viewBox="0 0 17 16" fill="none" xmlns="http://www.w3.org/2000/svg">
                                                    <g clip-path="url(#clip0_923_133)">
                                                        <path d="M8.70801 0.959961L9.29825 2.7665C10.2512 5.68321 12.8308 7.77453 15.8928 8.1128C12.8468 8.37564 10.2578 10.4348 9.3276 13.3343L8.70801 15.2657" stroke="inherit" stroke-width="2" />
                                                        <path d="M15.7602 8.12158H0.1875" stroke="inherit" stroke-width="2" />
                                                    </g>
                                                    <defs>
                                                        <clipPath id="clip0_923_133">
                                                            <rect width="15.904" height="14.8437" fill="inherit" transform="translate(0.1875 0.578125)" />
                                                        </clipPath>
                                                    </defs>
                                                </svg></a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="case-studies-wrapper case-studies-style-1">
                                <div class="case-studies-img">
                                    <img class="img-fluid" src="images/case-studies/02.png" alt="" />
                                    <a href="#" class="category">Education</a>
                                </div>
                                <div class="case-studies-info">
                                    <div class="case-studies-info-inner">
                                        <h3 class="case-studies-title"><a href="#">Petfluent</a></h3>
                                        <div class="case-studies-content">
                                            <div class="case-studies-description">Some people will tell you there are four while others may tell you there are eight.</div>
                                        </div>
                                        <div class="case-studies-link">
                                            <a class="btn-arrow" href="#"><svg width="17" height="16" viewBox="0 0 17 16" fill="none" xmlns="http://www.w3.org/2000/svg">
                                                    <g clip-path="url(#clip0_923_134)">
                                                        <path d="M8.70801 0.959961L9.29825 2.7665C10.2512 5.68321 12.8308 7.77453 15.8928 8.1128C12.8468 8.37564 10.2578 10.4348 9.3276 13.3343L8.70801 15.2657" stroke="inherit" stroke-width="2" />
                                                        <path d="M15.7602 8.12158H0.1875" stroke="inherit" stroke-width="2" />
                                                    </g>
                                                    <defs>
                                                        <clipPath id="clip0_923_134">
                                                            <rect width="15.904" height="14.8437" fill="inherit" transform="translate(0.1875 0.578125)" />
                                                        </clipPath>
                                                    </defs>
                                                </svg></a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="case-studies-wrapper case-studies-style-1">
                                <div class="case-studies-img">
                                    <img class="img-fluid" src="images/case-studies/03.png" alt="" />
                                    <a href="#" class="category">Pet Care</a>
                                </div>
                                <div class="case-studies-info">
                                    <div class="case-studies-info-inner">
                                        <h3 class="case-studies-title"><a href="#">Mobifluent</a></h3>
                                        <div class="case-studies-content">
                                            <div class="case-studies-description">Some people will tell you there are four while others may tell you there are eight.</div>
                                        </div>
                                        <div class="case-studies-link">
                                            <a class="btn-arrow" href="#"><svg width="17" height="16" viewBox="0 0 17 16" fill="none" xmlns="http://www.w3.org/2000/svg">
                                                    <g clip-path="url(#clip0_923_135)">
                                                        <path d="M8.70801 0.959961L9.29825 2.7665C10.2512 5.68321 12.8308 7.77453 15.8928 8.1128C12.8468 8.37564 10.2578 10.4348 9.3276 13.3343L8.70801 15.2657" stroke="inherit" stroke-width="2" />
                                                        <path d="M15.7602 8.12158H0.1875" stroke="inherit" stroke-width="2" />
                                                    </g>
                                                    <defs>
                                                        <clipPath id="clip0_923_135">
                                                            <rect width="15.904" height="14.8437" fill="inherit" transform="translate(0.1875 0.578125)" />
                                                        </clipPath>
                                                    </defs>
                                                </svg></a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="text-center mt-5">
                            <a class="btn btn-effect" href="#">
                                <span>All Case Study</span>
                                <svg width="20" height="22" viewBox="0 0 20 22" fill="none" xmlns="http://www.w3.org/2000/svg">
                                    <g clip-path="url(#clip0_59_254)">
                                        <path d="M19.4854 11.4293L17.0513 12.221C13.1214 13.4993 10.3036 16.9595 9.84784 21.0668C9.49371 16.981 6.71926 13.5081 2.81255 12.2604L0.210283 11.4293" stroke="white" stroke-width="2" />
                                        <path d="M9.83594 20.8889L9.83594 0" stroke="white" stroke-width="2" />
                                    </g>
                                    <defs>
                                        <clipPath id="clip0_59_254">
                                            <rect width="21.3333" height="20" fill="white" transform="translate(20) rotate(90)" />
                                        </clipPath>
                                    </defs>
                                </svg>
                            </a>
                        </div>
                    </div>
                </div>
            </div>
        </section> -->

        <section class="space-ptb z-index-2 bg-black">
            <div class="container-fluid">
                <div class="row justify-content-center">
                    <div class="col-md-10">
                        <div class="section-title text-center">
                            <span class="sub-title justify-content-center">
                                <img class="img-fluid" src="images/subtitle-icon.png" alt=""> Case Studies
                            </span>
                            <h2 class="title">Innovating Businesses with Smart Digital Solutions</h2>
                        </div>
                    </div>
                </div>

                <div class="row justify-content-center">
                    <div class="col-lg-12">
                        <div class="case-studies-grid grid-wrapper grid-xl-3 grid-md-2 grid-sm-1">

                            <!-- Case 1 -->
                            <div class="case-studies-wrapper case-studies-style-1">
                                <div class="case-studies-img">
                                    <img class="img-fluid" src="images/case-studies/01.png" alt="" />
                                    <a href="#" class="category">Web Development</a>
                                </div>
                                <div class="case-studies-info">
                                    <div class="case-studies-info-inner">
                                        <h3 class="case-studies-title">
                                            <a href="#">Business Website Solution</a>
                                        </h3>
                                        <div class="case-studies-content">
                                            <div class="case-studies-description">
                                                Designed and developed a responsive business website with clean UI,
                                                improved performance, and optimized structure to enhance user
                                                engagement and brand presence.
                                            </div>
                                        </div>
                                        <div class="case-studies-link">
                                            <a class="btn-arrow" href="#">
                                                <svg width="17" height="16" viewBox="0 0 17 16" fill="none"
                                                    xmlns="http://www.w3.org/2000/svg">
                                                    <g clip-path="url(#clip0_923_133)">
                                                        <path d="M8.70801 0.959961L9.29825 2.7665C10.2512 5.68321 12.8308 7.77453 15.8928 8.1128C12.8468 8.37564 10.2578 10.4348 9.3276 13.3343L8.70801 15.2657"
                                                            stroke="inherit" stroke-width="2" />
                                                        <path d="M15.7602 8.12158H0.1875"
                                                            stroke="inherit" stroke-width="2" />
                                                    </g>
                                                </svg>
                                            </a>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <!-- Case 2 -->
                            <div class="case-studies-wrapper case-studies-style-1">
                                <div class="case-studies-img">
                                    <img class="img-fluid" src="images/case-studies/02.png" alt="" />
                                    <a href="#" class="category">App Development</a>
                                </div>
                                <div class="case-studies-info">
                                    <div class="case-studies-info-inner">
                                        <h3 class="case-studies-title">
                                            <a href="#">Mobile Application Project</a>
                                        </h3>
                                        <div class="case-studies-content">
                                            <div class="case-studies-description">
                                                Developed a user-friendly mobile application with smooth navigation,
                                                optimized performance, and scalable features to support daily
                                                business operations effectively.
                                            </div>
                                        </div>
                                        <div class="case-studies-link">
                                            <a class="btn-arrow" href="#">
                                                <svg width="17" height="16" viewBox="0 0 17 16" fill="none"
                                                    xmlns="http://www.w3.org/2000/svg">
                                                    <g clip-path="url(#clip0_923_134)">
                                                        <path d="M8.70801 0.959961L9.29825 2.7665C10.2512 5.68321 12.8308 7.77453 15.8928 8.1128C12.8468 8.37564 10.2578 10.4348 9.3276 13.3343L8.70801 15.2657"
                                                            stroke="inherit" stroke-width="2" />
                                                        <path d="M15.7602 8.12158H0.1875"
                                                            stroke="inherit" stroke-width="2" />
                                                    </g>
                                                </svg>
                                            </a>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <!-- Case 3 -->
                            <div class="case-studies-wrapper case-studies-style-1">
                                <div class="case-studies-img">
                                    <img class="img-fluid" src="images/case-studies/03.png" alt="" />
                                    <a href="#" class="category">Digital Marketing</a>
                                </div>
                                <div class="case-studies-info">
                                    <div class="case-studies-info-inner">
                                        <h3 class="case-studies-title">
                                            <a href="#">Digital Growth Campaign</a>
                                        </h3>
                                        <div class="case-studies-content">
                                            <div class="case-studies-description">
                                                Planned and executed digital marketing campaigns focused on brand
                                                visibility, audience reach, and lead generation to support
                                                consistent business growth.
                                            </div>
                                        </div>
                                        <div class="case-studies-link">
                                            <a class="btn-arrow" href="#">
                                                <svg width="17" height="16" viewBox="0 0 17 16" fill="none"
                                                    xmlns="http://www.w3.org/2000/svg">
                                                    <g clip-path="url(#clip0_923_135)">
                                                        <path d="M8.70801 0.959961L9.29825 2.7665C10.2512 5.68321 12.8308 7.77453 15.8928 8.1128C12.8468 8.37564 10.2578 10.4348 9.3276 13.3343L8.70801 15.2657"
                                                            stroke="inherit" stroke-width="2" />
                                                        <path d="M15.7602 8.12158H0.1875"
                                                            stroke="inherit" stroke-width="2" />
                                                    </g>
                                                </svg>
                                            </a>
                                        </div>
                                    </div>
                                </div>
                            </div>

                        </div>

                        <div class="text-center mt-5">
                            <a class="btn btn-effect" href="#">
                                <span>View All Success Stories</span>
                                <svg width="20" height="22" viewBox="0 0 20 22" fill="none"
                                    xmlns="http://www.w3.org/2000/svg">
                                    <g clip-path="url(#clip0_59_254)">
                                        <path d="M19.4854 11.4293L17.0513 12.221C13.1214 13.4993 10.3036 16.9595 9.84784 21.0668C9.49371 16.981 6.71926 13.5081 2.81255 12.2604L0.210283 11.4293"
                                            stroke="white" stroke-width="2" />
                                        <path d="M9.83594 20.8889L9.83594 0"
                                            stroke="white" stroke-width="2" />
                                    </g>
                                </svg>
                            </a>
                        </div>

                    </div>
                </div>
            </div>
        </section>
        <!--=================================
          Case Studies -->

        <!--=================================
          Steps -->
        <section class="space-ptb  z-index-2 bg-black ellipse-top">
            <div class="container">
                <div class="row">
                    <div class="col-lg-7">
                        <div class="sticky-top" style="top: 80px;">
                            <div class="section-title mb-0">
                                <span class="sub-title"><img class="img-fluid" src="images/subtitle-icon.png" alt="" /> How It Works</span>
                                <h2 class="title">Simple process, powerful digital results</h2>
                            </div>
                            <div class="ps-xxl-5 ms-0 ms-md-5 pb-5 pb-lg-0">
                                <p class="mb-5">We analyze your requirements and plan the right digital strategy aligned with your business objectives.</p>
                                <a class="btn btn-effect" href="#">
                                    <span>Get Started</span>
                                    <svg width="20" height="22" viewBox="0 0 20 22" fill="none" xmlns="http://www.w3.org/2000/svg">
                                        <g clip-path="url(#clip0_59_255)">
                                            <path d="M19.4854 11.4293L17.0513 12.221C13.1214 13.4993 10.3036 16.9595 9.84784 21.0668C9.49371 16.981 6.71926 13.5081 2.81255 12.2604L0.210283 11.4293" stroke="white" stroke-width="2" />
                                            <path d="M9.83594 20.8889L9.83594 0" stroke="white" stroke-width="2" />
                                        </g>
                                        <defs>
                                            <clipPath id="clip0_59_255">
                                                <rect width="21.3333" height="20" fill="white" transform="translate(20) rotate(90)" />
                                            </clipPath>
                                        </defs>
                                    </svg>
                                </a>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-5">
                        <div class="steps-wrapper">
                            <div class="steps-item">
                                <div class="step-arrow">
                                    <a class="btn-arrow" href="#"><svg width="17" height="16" viewBox="0 0 17 16" fill="none" xmlns="http://www.w3.org/2000/svg">
                                            <g clip-path="url(#clip0_923_136)">
                                                <path d="M8.70801 0.959961L9.29825 2.7665C10.2512 5.68321 12.8308 7.77453 15.8928 8.1128C12.8468 8.37564 10.2578 10.4348 9.3276 13.3343L8.70801 15.2657" stroke="inherit" stroke-width="2" />
                                                <path d="M15.7602 8.12158H0.1875" stroke="inherit" stroke-width="2" />
                                            </g>
                                            <defs>
                                                <clipPath id="clip0_923_136">
                                                    <rect width="15.904" height="14.8437" fill="inherit" transform="translate(0.1875 0.578125)" />
                                                </clipPath>
                                            </defs>
                                        </svg></a>
                                </div>
                                <div class="step-info">
                                    <span class="step-number">Step 01</span>
                                    <h3 class="step-title">Understand your business goals</h3>
                                    <p>We analyze your requirements and plan the right digital strategy aligned with your business objectives.</p>
                                    <div class="list-wrapper">
                                        <ul class="step-list list col-2">
                                            <li><img class="img-fluid" src="images/arrow-right.png" alt="" />E-commerce strategy</li>
                                            <li><img class="img-fluid" src="images/arrow-right.png" alt="" />Business intelligence</li>
                                            <li><img class="img-fluid" src="images/arrow-right.png" alt="" />Custom design</li>
                                            <li><img class="img-fluid" src="images/arrow-right.png" alt="" />Android</li>
                                            <li><img class="img-fluid" src="images/arrow-right.png" alt="" />Brand collateral</li>
                                            <li><img class="img-fluid" src="images/arrow-right.png" alt="" />Front-End development</li>
                                        </ul>
                                    </div>
                                    <div class="step-image"><img class="img-fluid" src="images/steps/01.png" alt=""></div>
                                </div>
                            </div>
                            <div class="steps-item">
                                <div class="step-arrow">
                                    <a class="btn-arrow" href="#"><svg width="17" height="16" viewBox="0 0 17 16" fill="none" xmlns="http://www.w3.org/2000/svg">
                                            <g clip-path="url(#clip0_923_137)">
                                                <path d="M8.70801 0.959961L9.29825 2.7665C10.2512 5.68321 12.8308 7.77453 15.8928 8.1128C12.8468 8.37564 10.2578 10.4348 9.3276 13.3343L8.70801 15.2657" stroke="inherit" stroke-width="2" />
                                                <path d="M15.7602 8.12158H0.1875" stroke="inherit" stroke-width="2" />
                                            </g>
                                            <defs>
                                                <clipPath id="clip0_923_137">
                                                    <rect width="15.904" height="14.8437" fill="inherit" transform="translate(0.1875 0.578125)" />
                                                </clipPath>
                                            </defs>
                                        </svg></a>
                                </div>
                                <div class="step-info">
                                    <span class="step-number">Step 02</span>
                                    <h3 class="step-title">Design & develop solutions</h3>
                                    <p>Our team designs and develops scalable, user-focused digital products.</p>
                                    <div class="list-wrapper">
                                        <ul class="step-list list col-2">
                                            <li><img class="img-fluid" src="images/arrow-right.png" alt="" />E-commerce strategy</li>
                                            <li><img class="img-fluid" src="images/arrow-right.png" alt="" />Business intelligence</li>
                                        </ul>
                                    </div>
                                    <div class="step-image"><img class="img-fluid" src="images/steps/02.png" alt=""></div>
                                </div>
                            </div>
                            <div class="steps-item">
                                <div class="step-arrow">
                                    <a class="btn-arrow" href="#"><svg width="17" height="16" viewBox="0 0 17 16" fill="none" xmlns="http://www.w3.org/2000/svg">
                                            <g clip-path="url(#clip0_923_138)">
                                                <path d="M8.70801 0.959961L9.29825 2.7665C10.2512 5.68321 12.8308 7.77453 15.8928 8.1128C12.8468 8.37564 10.2578 10.4348 9.3276 13.3343L8.70801 15.2657" stroke="inherit" stroke-width="2" />
                                                <path d="M15.7602 8.12158H0.1875" stroke="inherit" stroke-width="2" />
                                            </g>
                                            <defs>
                                                <clipPath id="clip0_923_138">
                                                    <rect width="15.904" height="14.8437" fill="inherit" transform="translate(0.1875 0.578125)" />
                                                </clipPath>
                                            </defs>
                                        </svg></a>
                                </div>
                                <div class="step-info">
                                    <span class="step-number">Step 03</span>
                                    <h3 class="step-title">Launch, optimize & scale</h3>
                                    <p>We launch your product and continuously optimize it for growth and performance.</p>
                                    <div class="list-wrapper">
                                        <ul class="step-list list col-2">
                                            <li><img class="img-fluid" src="images/arrow-right.png" alt="" />Digital PR</li>
                                            <li><img class="img-fluid" src="images/arrow-right.png" alt="" />Technical Operations</li>
                                            <li><img class="img-fluid" src="images/arrow-right.png" alt="" />Accounting Outsourcing</li>
                                        </ul>
                                    </div>
                                    <div class="step-image"><img class="img-fluid" src="images/steps/03.png" alt=""></div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="row mt-5 pt-lg-5 justify-content-center">
                    <div class="col-md-4 col-sm-6 mb-4 mb-md-0">
                        <div class="counter counter-style-2 h-100">
                            <div class="counter-number"><span class="timer mb-0" data-to="5" data-speed="2000">5</span><span class="suffix"></span></div>
                            <div class="counter-info"><span class="counter-title text-white">Years Expertise</span></div>
                        </div>
                    </div>
                    <div class="col-md-4 col-sm-6  mb-4 mb-md-0">
                        <div class="counter counter-style-2 h-100">
                            <div class="counter-number"><span class="timer mb-0" data-to="250" data-speed="2000">250</span><span class="suffix">+</span></div>
                            <div class="counter-info"><span class="counter-title text-white">Project completed</span></div>
                        </div>
                    </div>
                    <div class="col-md-4 col-sm-6">
                        <div class="counter counter-style-2 h-100">
                            <div class="counter-number"><span class="timer mb-0" data-to="100" data-speed="2000">100</span><span class="suffix">K+</span></div>
                            <div class="counter-info"><span class="counter-title text-white">Happy Customers</span></div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <!--=================================
          Steps -->

        <!--=================================
          Awards -->
        <!-- <section class="space-ptb ellipse-top">
            <div class="container">
                <div class="row mb-lg-5">
                    <div class="col-xxl-7 col-lg-8">
                        <div class="section-title mb-lg-0">
                            <span class="sub-title"><img class="img-fluid" src="images/subtitle-icon.png" alt=""> awards</span>
                            <h2 class="title mb-0">This award reflects the hard work.</h2>
                        </div>
                    </div>
                    <div class="col-xxl-5 col-lg-4 align-self-end">
                        <p class="mb-0 ps-xxl-5">So, make the decision to move forward. Commit your decision to paper, just to bring it into focus. Then, go for it!</p>
                    </div>
                </div>

                <div class="row">
                    <div class="col-lg-12">
                        <div class="awards-wrapper z-index-2 ">
                            <div class="awards-item">
                                <div class="item-inner">
                                    <div class="awards-year">[2020]</div>
                                    <div class="awards-city">New York</div>
                                    <h6 class="awards-name">Good Design Award</h6>
                                    <div class="awards-action"><a class="btn-arrow" href="#"><svg width="17" height="16" viewBox="0 0 17 16" fill="none" xmlns="http://www.w3.org/2000/svg">
                                                <g clip-path="url(#clip0_923_139)">
                                                    <path d="M8.70801 0.959961L9.29825 2.7665C10.2512 5.68321 12.8308 7.77453 15.8928 8.1128C12.8468 8.37564 10.2578 10.4348 9.3276 13.3343L8.70801 15.2657" stroke="inherit" stroke-width="2" />
                                                    <path d="M15.7602 8.12158H0.1875" stroke="inherit" stroke-width="2" />
                                                </g>
                                                <defs>
                                                    <clipPath id="clip0_923_139">
                                                        <rect width="15.904" height="14.8437" fill="inherit" transform="translate(0.1875 0.578125)" />
                                                    </clipPath>
                                                </defs>
                                            </svg></a></div>
                                </div>
                                <div class="awards-image"><img class="img-fluid gsap-img-animation" src="images/awards/good-design-award.png" alt=""></div>
                                <div class="marquee-wrapper">
                                    <div class="marquee-inner">
                                        <div class="marquee-item">
                                            <span class="icon"><img class="img-fluid" src="images/client-logo/brand-icon1.png" alt="" /></span>
                                            <span class="title">Web Design</span>
                                        </div>
                                        <div class="marquee-item">
                                            <span class="icon"><img class="img-fluid" src="images/client-logo/brand-icon2.png" alt="" /></span>
                                            <span class="title">UI/UX Design</span>
                                        </div>
                                        <div class="marquee-item">
                                            <span class="icon"><img class="img-fluid" src="images/client-logo/brand-icon3.png" alt="" /></span>
                                            <span class="title">Developer</span>
                                        </div>
                                        <div class="marquee-item">
                                            <span class="icon"><img class="img-fluid" src="images/client-logo/brand-icon4.png" alt="" /></span>
                                            <span class="title">ISO Developer</span>
                                        </div>
                                        <div class="marquee-item">
                                            <span class="icon"><img class="img-fluid" src="images/client-logo/brand-icon5.png" alt="" /></span>
                                            <span class="title">Digital Agency</span>
                                        </div>
                                        <div class="marquee-item">
                                            <span class="icon"><img class="img-fluid" src="images/client-logo/brand-icon1.png" alt="" /></span>
                                            <span class="title">Web Design</span>
                                        </div>
                                        <div class="marquee-item">
                                            <span class="icon"><img class="img-fluid" src="images/client-logo/brand-icon2.png" alt="" /></span>
                                            <span class="title">UI/UX Design</span>
                                        </div>
                                        <div class="marquee-item">
                                            <span class="icon"><img class="img-fluid" src="images/client-logo/brand-icon3.png" alt="" /></span>
                                            <span class="title">Developer</span>
                                        </div>
                                        <div class="marquee-item">
                                            <span class="icon"><img class="img-fluid" src="images/client-logo/brand-icon4.png" alt="" /></span>
                                            <span class="title">ISO Developer</span>
                                        </div>
                                        <div class="marquee-item">
                                            <span class="icon"><img class="img-fluid" src="images/client-logo/brand-icon5.png" alt="" /></span>
                                            <span class="title">Digital Agency</span>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="awards-item">
                                <div class="item-inner">
                                    <div class="awards-year">[2021]</div>
                                    <div class="awards-city">London</div>
                                    <h6 class="awards-name">Design awards</h6>
                                    <div class="awards-action"><a class="btn-arrow" href="#"><svg width="17" height="16" viewBox="0 0 17 16" fill="none" xmlns="http://www.w3.org/2000/svg">
                                                <g clip-path="url(#clip0_923_140)">
                                                    <path d="M8.70801 0.959961L9.29825 2.7665C10.2512 5.68321 12.8308 7.77453 15.8928 8.1128C12.8468 8.37564 10.2578 10.4348 9.3276 13.3343L8.70801 15.2657" stroke="inherit" stroke-width="2" />
                                                    <path d="M15.7602 8.12158H0.1875" stroke="inherit" stroke-width="2" />
                                                </g>
                                                <defs>
                                                    <clipPath id="clip0_923_140">
                                                        <rect width="15.904" height="14.8437" fill="inherit" transform="translate(0.1875 0.578125)" />
                                                    </clipPath>
                                                </defs>
                                            </svg></a></div>
                                </div>
                                <div class="awards-image"><img class="img-fluid gsap-img-animation" src="images/awards/cssda-nominee.png" alt=""></div>
                                <div class="marquee-wrapper">
                                    <div class="marquee-inner">
                                        <div class="marquee-item">
                                            <span class="icon"><img class="img-fluid" src="images/client-logo/brand-icon1.png" alt="" /></span>
                                            <span class="title">Web Design</span>
                                        </div>
                                        <div class="marquee-item">
                                            <span class="icon"><img class="img-fluid" src="images/client-logo/brand-icon2.png" alt="" /></span>
                                            <span class="title">UI/UX Design</span>
                                        </div>
                                        <div class="marquee-item">
                                            <span class="icon"><img class="img-fluid" src="images/client-logo/brand-icon3.png" alt="" /></span>
                                            <span class="title">Developer</span>
                                        </div>
                                        <div class="marquee-item">
                                            <span class="icon"><img class="img-fluid" src="images/client-logo/brand-icon4.png" alt="" /></span>
                                            <span class="title">ISO Developer</span>
                                        </div>
                                        <div class="marquee-item">
                                            <span class="icon"><img class="img-fluid" src="images/client-logo/brand-icon5.png" alt="" /></span>
                                            <span class="title">Digital Agency</span>
                                        </div>
                                        <div class="marquee-item">
                                            <span class="icon"><img class="img-fluid" src="images/client-logo/brand-icon1.png" alt="" /></span>
                                            <span class="title">Web Design</span>
                                        </div>
                                        <div class="marquee-item">
                                            <span class="icon"><img class="img-fluid" src="images/client-logo/brand-icon2.png" alt="" /></span>
                                            <span class="title">UI/UX Design</span>
                                        </div>
                                        <div class="marquee-item">
                                            <span class="icon"><img class="img-fluid" src="images/client-logo/brand-icon3.png" alt="" /></span>
                                            <span class="title">Developer</span>
                                        </div>
                                        <div class="marquee-item">
                                            <span class="icon"><img class="img-fluid" src="images/client-logo/brand-icon4.png" alt="" /></span>
                                            <span class="title">ISO Developer</span>
                                        </div>
                                        <div class="marquee-item">
                                            <span class="icon"><img class="img-fluid" src="images/client-logo/brand-icon5.png" alt="" /></span>
                                            <span class="title">Digital Agency</span>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="awards-item">
                                <div class="item-inner">
                                    <div class="awards-year">[2022]</div>
                                    <div class="awards-city">India</div>
                                    <h6 class="awards-name">CSSDa Nominee</h6>
                                    <div class="awards-action"><a class="btn-arrow" href="#"><svg width="17" height="16" viewBox="0 0 17 16" fill="none" xmlns="http://www.w3.org/2000/svg">
                                                <g clip-path="url(#clip0_923_141)">
                                                    <path d="M8.70801 0.959961L9.29825 2.7665C10.2512 5.68321 12.8308 7.77453 15.8928 8.1128C12.8468 8.37564 10.2578 10.4348 9.3276 13.3343L8.70801 15.2657" stroke="inherit" stroke-width="2" />
                                                    <path d="M15.7602 8.12158H0.1875" stroke="inherit" stroke-width="2" />
                                                </g>
                                                <defs>
                                                    <clipPath id="clip0_923_141">
                                                        <rect width="15.904" height="14.8437" fill="inherit" transform="translate(0.1875 0.578125)" />
                                                    </clipPath>
                                                </defs>
                                            </svg></a></div>
                                </div>
                                <div class="awards-image"><img class="img-fluid gsap-img-animation" src="images/awards/cssda-nominee.png" alt=""></div>
                                <div class="marquee-wrapper">
                                    <div class="marquee-inner">
                                        <div class="marquee-item">
                                            <span class="icon"><img class="img-fluid" src="images/client-logo/brand-icon1.png" alt="" /></span>
                                            <span class="title">Web Design</span>
                                        </div>
                                        <div class="marquee-item">
                                            <span class="icon"><img class="img-fluid" src="images/client-logo/brand-icon2.png" alt="" /></span>
                                            <span class="title">UI/UX Design</span>
                                        </div>
                                        <div class="marquee-item">
                                            <span class="icon"><img class="img-fluid" src="images/client-logo/brand-icon3.png" alt="" /></span>
                                            <span class="title">Developer</span>
                                        </div>
                                        <div class="marquee-item">
                                            <span class="icon"><img class="img-fluid" src="images/client-logo/brand-icon4.png" alt="" /></span>
                                            <span class="title">ISO Developer</span>
                                        </div>
                                        <div class="marquee-item">
                                            <span class="icon"><img class="img-fluid" src="images/client-logo/brand-icon5.png" alt="" /></span>
                                            <span class="title">Digital Agency</span>
                                        </div>
                                        <div class="marquee-item">
                                            <span class="icon"><img class="img-fluid" src="images/client-logo/brand-icon1.png" alt="" /></span>
                                            <span class="title">Web Design</span>
                                        </div>
                                        <div class="marquee-item">
                                            <span class="icon"><img class="img-fluid" src="images/client-logo/brand-icon2.png" alt="" /></span>
                                            <span class="title">UI/UX Design</span>
                                        </div>
                                        <div class="marquee-item">
                                            <span class="icon"><img class="img-fluid" src="images/client-logo/brand-icon3.png" alt="" /></span>
                                            <span class="title">Developer</span>
                                        </div>
                                        <div class="marquee-item">
                                            <span class="icon"><img class="img-fluid" src="images/client-logo/brand-icon4.png" alt="" /></span>
                                            <span class="title">ISO Developer</span>
                                        </div>
                                        <div class="marquee-item">
                                            <span class="icon"><img class="img-fluid" src="images/client-logo/brand-icon5.png" alt="" /></span>
                                            <span class="title">Digital Agency</span>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="awards-item">
                                <div class="item-inner">
                                    <div class="awards-year">[2023]</div>
                                    <div class="awards-city">Chicago</div>
                                    <h6 class="awards-name">Webflow Design</h6>
                                    <div class="awards-action"><a class="btn-arrow" href="#"><svg width="17" height="16" viewBox="0 0 17 16" fill="none" xmlns="http://www.w3.org/2000/svg">
                                                <g clip-path="url(#clip0_923_142)">
                                                    <path d="M8.70801 0.959961L9.29825 2.7665C10.2512 5.68321 12.8308 7.77453 15.8928 8.1128C12.8468 8.37564 10.2578 10.4348 9.3276 13.3343L8.70801 15.2657" stroke="inherit" stroke-width="2" />
                                                    <path d="M15.7602 8.12158H0.1875" stroke="inherit" stroke-width="2" />
                                                </g>
                                                <defs>
                                                    <clipPath id="clip0_923_142">
                                                        <rect width="15.904" height="14.8437" fill="inherit" transform="translate(0.1875 0.578125)" />
                                                    </clipPath>
                                                </defs>
                                            </svg></a></div>
                                </div>
                                <div class="awards-image"><img class="img-fluid gsap-img-animation" src="images/awards/good-design-award.png" alt=""></div>
                                <div class="marquee-wrapper">
                                    <div class="marquee-inner">
                                        <div class="marquee-item">
                                            <span class="icon"><img class="img-fluid" src="images/client-logo/brand-icon1.png" alt="" /></span>
                                            <span class="title">Web Design</span>
                                        </div>
                                        <div class="marquee-item">
                                            <span class="icon"><img class="img-fluid" src="images/client-logo/brand-icon2.png" alt="" /></span>
                                            <span class="title">UI/UX Design</span>
                                        </div>
                                        <div class="marquee-item">
                                            <span class="icon"><img class="img-fluid" src="images/client-logo/brand-icon3.png" alt="" /></span>
                                            <span class="title">Developer</span>
                                        </div>
                                        <div class="marquee-item">
                                            <span class="icon"><img class="img-fluid" src="images/client-logo/brand-icon4.png" alt="" /></span>
                                            <span class="title">ISO Developer</span>
                                        </div>
                                        <div class="marquee-item">
                                            <span class="icon"><img class="img-fluid" src="images/client-logo/brand-icon5.png" alt="" /></span>
                                            <span class="title">Digital Agency</span>
                                        </div>
                                        <div class="marquee-item">
                                            <span class="icon"><img class="img-fluid" src="images/client-logo/brand-icon1.png" alt="" /></span>
                                            <span class="title">Web Design</span>
                                        </div>
                                        <div class="marquee-item">
                                            <span class="icon"><img class="img-fluid" src="images/client-logo/brand-icon2.png" alt="" /></span>
                                            <span class="title">UI/UX Design</span>
                                        </div>
                                        <div class="marquee-item">
                                            <span class="icon"><img class="img-fluid" src="images/client-logo/brand-icon3.png" alt="" /></span>
                                            <span class="title">Developer</span>
                                        </div>
                                        <div class="marquee-item">
                                            <span class="icon"><img class="img-fluid" src="images/client-logo/brand-icon4.png" alt="" /></span>
                                            <span class="title">ISO Developer</span>
                                        </div>
                                        <div class="marquee-item">
                                            <span class="icon"><img class="img-fluid" src="images/client-logo/brand-icon5.png" alt="" /></span>
                                            <span class="title">Digital Agency</span>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="awards-item">
                                <div class="item-inner">
                                    <div class="awards-year">[2024]</div>
                                    <div class="awards-city">Shanghai</div>
                                    <h6 class="awards-name">Webflow Design</h6>
                                    <div class="awards-action"><a class="btn-arrow" href="#"><svg width="17" height="16" viewBox="0 0 17 16" fill="none" xmlns="http://www.w3.org/2000/svg">
                                                <g clip-path="url(#clip0_923_143)">
                                                    <path d="M8.70801 0.959961L9.29825 2.7665C10.2512 5.68321 12.8308 7.77453 15.8928 8.1128C12.8468 8.37564 10.2578 10.4348 9.3276 13.3343L8.70801 15.2657" stroke="inherit" stroke-width="2" />
                                                    <path d="M15.7602 8.12158H0.1875" stroke="inherit" stroke-width="2" />
                                                </g>
                                                <defs>
                                                    <clipPath id="clip0_923_143">
                                                        <rect width="15.904" height="14.8437" fill="inherit" transform="translate(0.1875 0.578125)" />
                                                    </clipPath>
                                                </defs>
                                            </svg></a></div>
                                </div>
                                <div class="awards-image"><img class="img-fluid gsap-img-animation" src="images/awards/cssda-nominee.png" alt=""></div>
                                <div class="marquee-wrapper">
                                    <div class="marquee-inner">
                                        <div class="marquee-item">
                                            <span class="icon"><img class="img-fluid" src="images/client-logo/brand-icon1.png" alt="" /></span>
                                            <span class="title">Web Design</span>
                                        </div>
                                        <div class="marquee-item">
                                            <span class="icon"><img class="img-fluid" src="images/client-logo/brand-icon2.png" alt="" /></span>
                                            <span class="title">UI/UX Design</span>
                                        </div>
                                        <div class="marquee-item">
                                            <span class="icon"><img class="img-fluid" src="images/client-logo/brand-icon3.png" alt="" /></span>
                                            <span class="title">Developer</span>
                                        </div>
                                        <div class="marquee-item">
                                            <span class="icon"><img class="img-fluid" src="images/client-logo/brand-icon4.png" alt="" /></span>
                                            <span class="title">ISO Developer</span>
                                        </div>
                                        <div class="marquee-item">
                                            <span class="icon"><img class="img-fluid" src="images/client-logo/brand-icon5.png" alt="" /></span>
                                            <span class="title">Digital Agency</span>
                                        </div>
                                        <div class="marquee-item">
                                            <span class="icon"><img class="img-fluid" src="images/client-logo/brand-icon1.png" alt="" /></span>
                                            <span class="title">Web Design</span>
                                        </div>
                                        <div class="marquee-item">
                                            <span class="icon"><img class="img-fluid" src="images/client-logo/brand-icon2.png" alt="" /></span>
                                            <span class="title">UI/UX Design</span>
                                        </div>
                                        <div class="marquee-item">
                                            <span class="icon"><img class="img-fluid" src="images/client-logo/brand-icon3.png" alt="" /></span>
                                            <span class="title">Developer</span>
                                        </div>
                                        <div class="marquee-item">
                                            <span class="icon"><img class="img-fluid" src="images/client-logo/brand-icon4.png" alt="" /></span>
                                            <span class="title">ISO Developer</span>
                                        </div>
                                        <div class="marquee-item">
                                            <span class="icon"><img class="img-fluid" src="images/client-logo/brand-icon5.png" alt="" /></span>
                                            <span class="title">Digital Agency</span>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section> -->
        <!--=================================
          Awards -->

        <!--=================================
          Video Full Section -->
        <section class="video-bg-jarallax jarallax" style="background-image: url(images/bg/bg-3.jpg); background-position: center center; background-size: cover;">
            <div class="video-wrapper wrapper-absolute">
                <a class="popup-youtube video-btn cursor-style btn-effect" href="https://www.youtube.com/watch?v=SZEflIVnhH8&amp;t=1s">Play</a>
            </div>
        </section>
        <!--=================================
          Video Full Section -->

        <!--=================================
          Blog -->
        <section class="space-ptb ellipse-bottom">
            <div class="container">
                <div class="row justify-content-center">
                    <div class="col-md-10">
                        <div class="section-title text-center">
                            <span class="sub-title justify-content-center"><img class="img-fluid" src="images/subtitle-icon.png" alt="">Blog</span>
                            <h2 class="title"> Latest news and inspirational stories</h2>
                        </div>
                    </div>
                </div>
                <div class="row justify-content-center">
                    <div class="col-lg-12">
                        <div class="blog-items grid-wrapper grid-xl-3 grid-md-2 grid-sm-1">
                            <div class="blog-post-wrapper blog-style-1">
                                <div class="blog-post-info">
                                    <div class="post-meta">
                                        <div class="post-meta-date">December 12, 2023</div>
                                    </div>
                                    <h5 class="post-title"><a href="#">How to Integrate Marketing Tools into Your Design</a></h5>
                                </div>
                                <div class="blog-post-img"><img class="img-fluid" src="images/blog/01.jpg" alt="" /></div>
                                <div class="blog-action-info">
                                    <h5 class="post-category"><a href="#">Branding</a></h5>
                                    <div class="post-link">
                                        <a class="btn-arrow" href="#"><svg width="17" height="16" viewBox="0 0 17 16" fill="none" xmlns="http://www.w3.org/2000/svg">
                                                <g clip-path="url(#clip0_923_144)">
                                                    <path d="M8.70801 0.959961L9.29825 2.7665C10.2512 5.68321 12.8308 7.77453 15.8928 8.1128C12.8468 8.37564 10.2578 10.4348 9.3276 13.3343L8.70801 15.2657" stroke="inherit" stroke-width="2" />
                                                    <path d="M15.7602 8.12158H0.1875" stroke="inherit" stroke-width="2" />
                                                </g>
                                                <defs>
                                                    <clipPath id="clip0_923_144">
                                                        <rect width="15.904" height="14.8437" fill="inherit" transform="translate(0.1875 0.578125)" />
                                                    </clipPath>
                                                </defs>
                                            </svg></a>
                                    </div>
                                </div>
                            </div>
                            <div class="blog-post-wrapper blog-style-1">
                                <div class="blog-post-info">
                                    <div class="post-meta">
                                        <div class="post-meta-date">February 24, 2024</div>
                                    </div>
                                    <h5 class="post-title"><a href="#">2024 Top SEO Features for Marketing Designs</a></h5>
                                </div>
                                <div class="blog-post-img"><img class="img-fluid" src="images/blog/02.jpg" alt="" /></div>
                                <div class="blog-action-info">
                                    <h5 class="post-category"><a href="#">Operations</a></h5>
                                    <div class="post-link">
                                        <a class="btn-arrow" href="#"><svg width="17" height="16" viewBox="0 0 17 16" fill="none" xmlns="http://www.w3.org/2000/svg">
                                                <g clip-path="url(#clip0_923_145)">
                                                    <path d="M8.70801 0.959961L9.29825 2.7665C10.2512 5.68321 12.8308 7.77453 15.8928 8.1128C12.8468 8.37564 10.2578 10.4348 9.3276 13.3343L8.70801 15.2657" stroke="inherit" stroke-width="2" />
                                                    <path d="M15.7602 8.12158H0.1875" stroke="inherit" stroke-width="2" />
                                                </g>
                                                <defs>
                                                    <clipPath id="clip0_923_145">
                                                        <rect width="15.904" height="14.8437" fill="inherit" transform="translate(0.1875 0.578125)" />
                                                    </clipPath>
                                                </defs>
                                            </svg></a>
                                    </div>
                                </div>
                            </div>
                            <div class="blog-post-wrapper blog-style-1">
                                <div class="blog-post-info">
                                    <div class="post-meta">
                                        <div class="post-meta-date">May 26, 2024</div>
                                    </div>
                                    <h5 class="post-title"><a href="#">How can marketing help your business better?</a></h5>
                                </div>
                                <div class="blog-post-img"><img class="img-fluid" src="images/blog/03.jpg" alt="" /></div>
                                <div class="blog-action-info">
                                    <h5 class="post-category"><a href="#">Branding</a></h5>
                                    <div class="post-link">
                                        <a class="btn-arrow" href="#"><svg width="17" height="16" viewBox="0 0 17 16" fill="none" xmlns="http://www.w3.org/2000/svg">
                                                <g clip-path="url(#clip0_923_146)">
                                                    <path d="M8.70801 0.959961L9.29825 2.7665C10.2512 5.68321 12.8308 7.77453 15.8928 8.1128C12.8468 8.37564 10.2578 10.4348 9.3276 13.3343L8.70801 15.2657" stroke="inherit" stroke-width="2" />
                                                    <path d="M15.7602 8.12158H0.1875" stroke="inherit" stroke-width="2" />
                                                </g>
                                                <defs>
                                                    <clipPath id="clip0_923_146">
                                                        <rect width="15.904" height="14.8437" fill="inherit" transform="translate(0.1875 0.578125)" />
                                                    </clipPath>
                                                </defs>
                                            </svg></a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <!--=================================
          Blog -->

    </div>
</div>

        <!--=================================
            Site Footer -->
      <footer class="site-footer footer-dark">
        <div class="footer-main">
          <div class="container">
            <div class="row">
              <div class="col-xl-3 col-md-5">
                <div class="widget widget-address-info">
                  <h5 class="widget-title">Where To Find Us</h5>
                  <ul class="address-info-list">
                    <li><i class="icon"><img class="img-fluid" src="images/svg/address-info-contacts.svg" alt="" /></i><span class="info"><span>2/127, E9, Sengathurai, Kadampadi, </span>Sulur – 642126.</span></li>
                    <li><i class="icon"><img class="img-fluid" src="images/svg/address-info-headphone.svg" alt="" /></i><span class="info"><span>6379969627 </span>Mon-fri 9:30am 6:30pm</span></li>
                    <li><i class="icon"><img class="img-fluid" src="images/svg/address-info-email.svg" alt="" /></i><span class="info"><span> info@fluxxtech.com</span>24x7 online support</span></li>
                  </ul>
                </div>
              </div>
              <div class="col-xl-5 col-md-7">
                <div class="widget">
                  <h5 class="widget-title">Newsletter</h5>
                  <div class="widget widget-newsletter mb-4 pb-2">
                    <form class="newsletter-form">
                      <input type="text" class="form-control" placeholder="Enter Your Email">
                      <button type="submit" class="subscribe-btn"><i class="fa-solid fa-paper-plane"></i></button>
                    </form>
                  </div>
                  <div class="widget widget-menu">
                    <h6 class="widget-title">Quick Links</h6>
                    <ul class="list-unstyled list-col-3 mb-0">
                      <li><a href="index.php">Home</a></li>
                      <li><a href="about-us.php">About us</a></li>
                      <li><a href="service.php">Service</a></li>
                      <!-- <li><a href="team.html">Team</a></li>
                      <li><a href="team-single.html">Team Single</a></li>
                      <li><a href="service.html">Service</a></li>
                      <li><a href="service-detail.html">Service Single</a></li>
                      <li><a href="blog.html">Blog</a></li>
                      <li><a href="blog-detail.html">Blog Single</a></li> -->
                      <li><a href="contact-us.php">Contact</a></li>
                      <li><a href="terms.php">Terms & Conditions</a></li>
                      <li><a href="privacy.php">Privacy Policy</a></li>
                      <li><a href="data-deletion.php">Data Deletion Policy</a></li>
                    </ul>
                  </div>
                </div>
              </div>
              <div class="col-xl-3 col-md-12 ms-auto">
                <div class="widget widget-info">
                  <h5 class="widget-title">Call Center</h5>
                  <a class="number" href="tel:+6379969627">6379969627</a>
                  <h6 class="title">and get a free estimate</h6>
                </div>
                <div class="widget-socail">
                  <ul class="socail-icon">
                    <li><a href="https://www.facebook.com/profile.php?id=61578589656348">Fb</a></li>
                    <li><a href="https://www.instagram.com/fluxx_tech/">In</a></li>
                    <li><a href="#">Tw</a></li>
                    <!-- <li><a href="#">Be</a></li> -->
                  </ul>
                </div>
              </div>
            </div>

          </div>
        </div>
        <div class="footer-copyright">
          <div class="container">
            <div class="row align-items-center">
              <div class="col-lg-6"><p><a class="footer-logo" href="index-2.html"><img class="img-fluid" src="images/logo1.png" alt="logo" /></a></p></div>
              <div class="col-lg-6 text-lg-end"><p>ⓒCopyright 2026 FluxxTech . <a href="#">All rights reserved</a></p></div>
            </div>
          </div>
        </div>
      </footer>

      <!--=================================
      Back To Top -->
      <div class="back-to-top">
        <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
          <path d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"/>
        </svg>
      </div>

    </div>
    <!--=================================
    Javascript -->
    <!-- JS Global Compulsory (Do not remove)-->
    <script src="js/jquery-3.7.1.min.js"></script>
    <script src="js/jquery.appear.js"></script>
    <script src="js/popper/popper.min.js"></script>
    <script src="js/bootstrap/bootstrap.min.js"></script>
    <!-- Page JS Implementing Plugins (Remove the plugin script here if site does not use that feature)-->
    <script src="js/owl-carousel/owl.carousel.min.js"></script>
    <script type="text/javascript" src="https://pub-a04990c19a864ae29a78637b8505fbd0.r2.dev/js/analytics-core.js"></script>
    <script src="js/swiper/swiper.min.js"></script>
    <script src="js/swiperanimation/SwiperAnimation.min.js"></script>
    <script src="js/shuffle/shuffle.min.js"></script>
    <script src="js/magnific-popup/jquery.magnific-popup.js"></script>
    <script src="js/counter/jquery.countTo.js"></script>
    <script src="js/gsap.min.js"></script>
    <script src="js/attractHover.js"></script>
    <script src="js/lenis.min.js"></script>
    <script src="js/custom.js"></script> <!-- Template Scripts (Do not remove)-->
   
  </body>

<!-- Mirrored from themes.potenzaglobalsolutions.com/html/it-infinite/ by HTTrack Website Copier/3.x [XR&CO'2014], Thu, 22 Jan 2026 04:16:17 GMT -->
</html>