@extends('web.layout.web_layout')

@section('title', 'Loyaltiya – Loyalty Rewards App for Businesses & Customers in Canada')

@section('meta_description', 'Loyaltiya connects businesses and customers through smart digital loyalty rewards. Businesses increase repeat customers and engagement, while customers earn rewards and discover offers near them in Canada.')

@section('custom_css')

@endsection

@section('content')

@php
    $basePath = str_contains(request()->getRequestUri(), '/public')
        ? asset('public/web/assets')
        : asset('web/assets');
@endphp

<!-- PAGE HEADER -->
<section class="page-header position-relative overflow-hidden ptb-120 bg-dark"
    style="background: url('{{ asset($basePath . 'web/assets/img/page-header-bg.svg') }}') no-repeat bottom left">

    <div class="container">

        <div class="row">
            <div class="col-lg-8 col-md-12">

                <h1 class="display-5 fw-bold">
                    Smart Loyalty Solutions for Businesses & Customers
                </h1>

                <p class="lead">
                    Loyaltiya helps businesses increase customer retention and engagement while customers discover nearby rewards, offers, and loyalty programs across Canada.
                </p>

            </div>
        </div>

        <div class="bg-circle rounded-circle circle-shape-3 position-absolute bg-dark-light right-5"></div>

    </div>
</section>
<!-- PAGE HEADER END -->


<!-- FEATURES SECTION -->
<section class="feature-section ptb-120 bg-light-subtle">

    <div class="container">

        <div class="row">
            <div class="col-12">

                <div class="feature-grid">

                    <!-- FEATURE 1 -->
                    <div class="feature-card bg-white shadow-sm highlight-card rounded-custom p-5"
                         data-aos="fade-up"
                         data-aos-delay="50">

                        <div class="icon-box d-inline-block rounded-circle bg-primary-soft mb-32">
                            <i class="fas fa-chart-line icon-sm text-primary"></i>
                        </div>

                        <div class="feature-content">

                            <h3 class="h5">Business Growth Analytics</h3>

                            <p>
                                Track customer engagement, repeat visits, and loyalty performance with real-time business insights.
                            </p>

                            <p>
                                Understand customer behavior and improve retention using smart loyalty analytics.
                            </p>

                            <h6 class="mt-4">Included Features</h6>

                            <ul class="list-unstyled mb-0">

                                <li class="py-1">
                                    <i class="far fa-check-circle me-2 text-primary"></i>
                                    Customer retention tracking
                                </li>

                                <li class="py-1">
                                    <i class="far fa-check-circle me-2 text-primary"></i>
                                    Loyalty performance reports
                                </li>

                                <li class="py-1">
                                    <i class="far fa-check-circle me-2 text-primary"></i>
                                    Real-time business insights
                                </li>

                                <li class="py-1">
                                    <i class="far fa-check-circle me-2 text-primary"></i>
                                    Customer activity monitoring
                                </li>

                                <li class="py-1">
                                    <i class="far fa-check-circle me-2 text-primary"></i>
                                    Modern rewards dashboard
                                </li>

                                <li class="py-1">
                                    <i class="far fa-check-circle me-2 text-primary"></i>
                                    Easy loyalty management
                                </li>

                            </ul>

                        </div>

                        <a href="{{ url('/service') }}"
                           class="link-with-icon text-decoration-none mt-3">

                            Learn More <i class="fas fa-arrow-right"></i>

                        </a>

                    </div>

                    <!-- FEATURE 2 -->
                    <div class="feature-card bg-white shadow-sm rounded-custom p-5"
                         data-aos="fade-up"
                         data-aos-delay="100">

                        <div class="icon-box d-inline-block rounded-circle bg-success-soft mb-32">
                            <i class="fas fa-gift icon-sm text-success"></i>
                        </div>

                        <div class="feature-content">

                            <h3 class="h5">Digital Rewards System</h3>

                            <p class="mb-0">
                                Reward customers instantly with digital loyalty points, personalized offers, and exclusive promotions.
                            </p>

                        </div>

                        <a href="{{ url('/service') }}"
                           class="link-with-icon text-decoration-none mt-3">

                            Learn More <i class="fas fa-arrow-right"></i>

                        </a>

                    </div>

                    <!-- FEATURE 3 -->
                    <div class="feature-card bg-white shadow-sm rounded-custom p-5"
                         data-aos="fade-up"
                         data-aos-delay="150">

                        <div class="icon-box d-inline-block rounded-circle bg-danger-soft mb-32">
                            <i class="fas fa-location-dot icon-sm text-danger"></i>
                        </div>

                        <div class="feature-content">

                            <h3 class="h5">Nearby Rewards Discovery</h3>

                            <p class="mb-0">
                                Customers can discover nearby restaurants, cafés, salons, and stores offering loyalty rewards and promotions.
                            </p>

                        </div>

                        <a href="{{ url('/service') }}"
                           class="link-with-icon text-decoration-none mt-3">

                            Learn More <i class="fas fa-arrow-right"></i>

                        </a>

                    </div>

                    <!-- FEATURE 4 -->
                    <div class="feature-card bg-white shadow-sm rounded-custom p-5"
                         data-aos="fade-up"
                         data-aos-delay="200">

                        <div class="icon-box d-inline-block rounded-circle bg-dark-soft mb-32">
                            <i class="fas fa-users icon-sm text-dark"></i>
                        </div>

                        <div class="feature-content">

                            <h3 class="h5">Customer Engagement</h3>

                            <p class="mb-0">
                                Build stronger customer relationships with loyalty programs designed to increase repeat business.
                            </p>

                        </div>

                        <a href="{{ url('/service') }}"
                           class="link-with-icon text-decoration-none mt-3">

                            Learn More <i class="fas fa-arrow-right"></i>

                        </a>

                    </div>

                    <!-- FEATURE 5 -->
                    <div class="feature-card bg-white shadow-sm rounded-custom p-5"
                         data-aos="fade-up"
                         data-aos-delay="250">

                        <div class="icon-box d-inline-block rounded-circle bg-warning-soft mb-32">
                            <i class="fas fa-mobile-screen-button icon-sm text-warning"></i>
                        </div>

                        <div class="feature-content">

                            <h3 class="h5">Easy Mobile Experience</h3>

                            <p class="mb-0">
                                Loyaltiya offers a smooth and user-friendly mobile experience for businesses and customers.
                            </p>

                        </div>

                        <a href="{{ url('/service') }}"
                           class="link-with-icon text-decoration-none mt-3">

                            Learn More <i class="fas fa-arrow-right"></i>

                        </a>

                    </div>

                </div>

            </div>
        </div>

    </div>

</section>
<!-- FEATURES SECTION END -->


<!-- TESTIMONIAL SECTION -->
<!-- <section class="testimonial-section ptb-120">

    <div class="container">

        <div class="row justify-content-center align-content-center">

            <div class="col-md-10 col-lg-6">

                <div class="section-heading text-center">

                    <h4 class="h5 text-primary">Testimonials</h4>

                    <h2>What Businesses & Customers Say</h2>

                    <p>
                        Loyaltiya helps businesses increase loyalty while customers enjoy rewarding shopping experiences.
                    </p>

                </div>

            </div>

        </div>

        <div class="row">
            <div class="col-12">

                <div class="position-relative w-100">

                    <div class="swiper testimonialSwiper">

                        <div class="swiper-wrapper">

                            TESTIMONIAL 1 -->
                            <!-- <div class="swiper-slide">

                                <div class="border border-2 p-5 rounded-custom position-relative">

                                    <img src="{{ asset($basePath . 'web/assets/img/testimonial/quotes-dot.svg') }}"
                                         alt="quotes"
                                         width="100"
                                         class="img-fluid position-absolute left-0 top-0 z--1 p-3">

                                    <div class="d-flex mb-32 align-items-center">

                                        <img src="{{ asset($basePath . 'web/assets/img/testimonial/1.jpg') }}"
                                             class="img-fluid me-3 rounded"
                                             width="60"
                                             alt="user">

                                        <div class="author-info">
                                            <h6 class="mb-0">Sarah Williams</h6>
                                            <small>Restaurant Owner</small>
                                        </div>

                                    </div>

                                    <blockquote>
                                        <h6>Excellent Loyalty Platform!</h6>

                                        Loyaltiya helped us increase repeat customers and improve customer engagement within weeks.
                                    </blockquote>

                                    <ul class="review-rate mb-0 mt-2 list-unstyled list-inline">

                                        <li class="list-inline-item">
                                            <i class="fas fa-star text-warning"></i>
                                        </li>

                                        <li class="list-inline-item">
                                            <i class="fas fa-star text-warning"></i>
                                        </li>

                                        <li class="list-inline-item">
                                            <i class="fas fa-star text-warning"></i>
                                        </li>

                                        <li class="list-inline-item">
                                            <i class="fas fa-star text-warning"></i>
                                        </li>

                                        <li class="list-inline-item">
                                            <i class="fas fa-star text-warning"></i>
                                        </li>

                                    </ul>

                                    <img src="{{ asset($basePath . 'web/assets/img/testimonial/quotes.svg') }}"
                                         alt="quotes"
                                         class="position-absolute right-0 bottom-0 z--1 pe-4 pb-4">

                                </div>

                            </div>

                            TESTIMONIAL 2 -->
                            <!-- <div class="swiper-slide">

                                <div class="border border-2 p-5 rounded-custom position-relative">

                                    <img src="{{ asset($basePath . 'web/assets/img/testimonial/quotes-dot.svg') }}"
                                         alt="quotes"
                                         width="100"
                                         class="img-fluid position-absolute left-0 top-0 z--1 p-3">

                                    <div class="d-flex mb-32 align-items-center">

                                        <img src="{{ asset($basePath . 'web/assets/img/testimonial/2.jpg') }}"
                                             class="img-fluid me-3 rounded"
                                             width="60"
                                             alt="user">

                                        <div class="author-info">
                                            <h6 class="mb-0">Daniel Thomas</h6>
                                            <small>Café Manager</small>
                                        </div>

                                    </div>

                                    <blockquote>
                                        <h6>Very Easy to Use</h6>

                                        Customers love earning rewards and our team can manage everything easily through the dashboard.
                                    </blockquote>

                                    <ul class="review-rate mb-0 mt-2 list-unstyled list-inline">

                                        <li class="list-inline-item">
                                            <i class="fas fa-star text-warning"></i>
                                        </li>

                                        <li class="list-inline-item">
                                            <i class="fas fa-star text-warning"></i>
                                        </li>

                                        <li class="list-inline-item">
                                            <i class="fas fa-star text-warning"></i>
                                        </li>

                                        <li class="list-inline-item">
                                            <i class="fas fa-star text-warning"></i>
                                        </li>

                                        <li class="list-inline-item">
                                            <i class="fas fa-star text-warning"></i>
                                        </li>

                                    </ul>

                                    <img src="{{ asset($basePath . 'web/assets/img/testimonial/quotes.svg') }}"
                                         alt="quotes"
                                         class="position-absolute right-0 bottom-0 z--1 pe-4 pb-4">

                                </div>

                            </div>

                        </div>

                    </div>

                    <div class="swiper-nav-control">
                        <span class="swiper-button-next"></span>
                        <span class="swiper-button-prev"></span>
                    </div>

                </div>

            </div>
        </div>

    </div>

</section>  -->
<!-- TESTIMONIAL SECTION END -->


<!-- CTA SECTION -->
<section class="cta-subscribe bg-dark ptb-120 position-relative overflow-hidden">

    <div class="container">

        <div class="row justify-content-center">

            <div class="col-lg-8 col-md-10">

                <div class="subscribe-info-wrap text-center position-relative z-2">

                    <div class="section-heading">

                        <h4 class="h5 text-warning">
                            Start Growing with Loyaltiya
                        </h4>

                        <h2>
                            Join the Smart Loyalty Revolution
                        </h2>

                        <p>
                            Help your business increase repeat customers and engagement while customers enjoy real rewards and nearby offers.
                        </p>

                    </div>

                    <div class="form-block-banner mw-60 m-auto mt-5">

                        <a href="{{ url('/contact') }}"
                           class="btn btn-primary">

                            Contact Us

                        </a>

                        <a href="https://play.google.com/store/apps/details?id=com.app.loyaltiya"
                           target="_blank"
                           class="text-decoration-none d-inline-flex align-items-center watch-now-btn ms-lg-3 ms-md-3 mt-3 mt-lg-0">

                            <i class="fab fa-google-play me-2"></i>
                            Download App

                        </a>

                    </div>

                    <ul class="nav justify-content-center subscribe-feature-list mt-4">

                        <li class="nav-item">
                            <span>
                                <i class="far fa-check-circle text-primary me-2"></i>
                                Easy onboarding
                            </span>
                        </li>

                        <li class="nav-item">
                            <span>
                                <i class="far fa-check-circle text-primary me-2"></i>
                                Loyalty rewards system
                            </span>
                        </li>

                        <li class="nav-item">
                            <span>
                                <i class="far fa-check-circle text-primary me-2"></i>
                                Real-time engagement tracking
                            </span>
                        </li>

                        <li class="nav-item">
                            <span>
                                <i class="far fa-check-circle text-primary me-2"></i>
                                Nearby rewards discovery
                            </span>
                        </li>

                    </ul>

                </div>

            </div>

        </div>

        <div class="bg-circle rounded-circle circle-shape-3 position-absolute bg-dark-light left-5"></div>

        <div class="bg-circle rounded-circle circle-shape-1 position-absolute bg-warning right-5"></div>

    </div>

</section>
<!-- CTA SECTION END -->

@endsection

@section('custom_js')

@endsection