first commit
This commit is contained in:
R-Bharathraj
758
solutions_page.php
Normal file
758
solutions_page.php
Normal file
@@ -0,0 +1,758 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<?php include 'includes/head.php'; ?>
|
||||
|
||||
<body style="background-color: #fffdf5;"
|
||||
class="wp-singular page-template-default page page-id-2983 wp-theme-aiero theme-aiero woocommerce-no-js mega-menu-main elementor-default elementor-kit-6 elementor-page elementor-page-2983">
|
||||
|
||||
<?php
|
||||
$current_page = 'Solutions';
|
||||
include 'includes/header.php';
|
||||
include 'includes/offcanvas.php';
|
||||
?>
|
||||
|
||||
<!-- PAGE CONTENT HERE -->
|
||||
<main>
|
||||
|
||||
<div class="page-title-container has-additional-text has-decoration">
|
||||
<div class="page-title-bg"></div>
|
||||
<div class="page-title-decoration-tl">
|
||||
<div class="page-title-decoration-tl-inner"></div>
|
||||
</div>
|
||||
<div class="page-title-decoration-br">
|
||||
<div class="page-title-decoration-br-inner"></div>
|
||||
</div>
|
||||
<div class="page-title-row">
|
||||
<div class="page-title-wrapper">
|
||||
<div class="page-title-box">
|
||||
<h1 class="page-title">Solutions</h1>
|
||||
<div class="elementor-element elementor-element-5e13830 elementor-widget elementor-widget-aiero_heading"
|
||||
data-id="5e13830" data-element_type="widget"
|
||||
data-widget_type="aiero_heading.default">
|
||||
<div class="elementor-widget-container">
|
||||
<div class="aiero-heading-widget">
|
||||
<h1 style="text-align: center;" class="aiero-heading"><span
|
||||
class="aiero-heading-content has_gradient_color_text"><del>Loyaly</del>
|
||||
is future</span></h1>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="page-title-additional">Loyaly</div>
|
||||
<div class="breadcrumbs-wrapper">
|
||||
<nav class="breadcrumbs">
|
||||
<a href="../index.html">Home</a>
|
||||
<span class='delimiter'></span>
|
||||
<span class="current">Solutions</span>
|
||||
</nav>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<div class="content">
|
||||
|
||||
<div class="content-inner">
|
||||
<div data-elementor-type="wp-page" data-elementor-id="8591" class="elementor elementor-8591">
|
||||
|
||||
|
||||
<!-- <section
|
||||
class="elementor-section elementor-top-section elementor-element elementor-element-e1194d7 elementor-section-full_width elementor-section-stretched elementor-section-height-default elementor-section-height-default"
|
||||
data-id="e1194d7" data-element_type="section"
|
||||
data-settings="{"stretch_section":"section-stretched","background_background":"classic"}">
|
||||
<div class="elementor-container elementor-column-gap-default">
|
||||
<div class="elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-8517e7e"
|
||||
data-id="8517e7e" data-element_type="column">
|
||||
<div class="elementor-widget-wrap elementor-element-populated">
|
||||
<div class="elementor-element elementor-element-5d841c7 elementor-absolute elementor-widget elementor-widget-image"
|
||||
data-id="5d841c7" data-element_type="widget"
|
||||
data-settings="{"_position":"absolute"}"
|
||||
data-widget_type="image.default">
|
||||
<div class="elementor-widget-container">
|
||||
<img fetchpriority="high" decoding="async" width="1860" height="1190"
|
||||
src="/loyaly_php/assets/images/Group-18432-1.svg"
|
||||
class="attachment-full size-full wp-image-5144" alt="" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="elementor-element elementor-element-5e13830 elementor-widget elementor-widget-aiero_heading"
|
||||
data-id="5e13830" data-element_type="widget"
|
||||
data-widget_type="aiero_heading.default">
|
||||
<div class="elementor-widget-container">
|
||||
<div class="aiero-heading-widget">
|
||||
<h1 class="aiero-heading"><span
|
||||
class="aiero-heading-content has_gradient_color_text"><del>Loyaly</del>
|
||||
is future</span></h1>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="elementor-element elementor-element-71f5e7e elementor-widget elementor-widget-text-editor"
|
||||
data-id="71f5e7e" data-element_type="widget"
|
||||
data-widget_type="text-editor.default">
|
||||
<div class="elementor-widget-container">
|
||||
<p>A unified AI suite that transforms every aspect of your retail
|
||||
operations.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="elementor-element elementor-element-4e63876 aiero-button-border-style-solid aiero-button-bakground-style-gradient elementor-widget elementor-widget-aiero_button"
|
||||
data-id="4e63876" data-element_type="widget"
|
||||
data-widget_type="aiero_button.default">
|
||||
<div class="elementor-widget-container">
|
||||
<div class="button-widget" >
|
||||
<div class="button-container" >
|
||||
<a class="aiero-button" href="#" target="_blank" >Get Started
|
||||
<span class="icon-button-arrow"></span><span
|
||||
class="button-inner"></span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section> -->
|
||||
|
||||
|
||||
<!-- need to change -->
|
||||
<section class="pt-32 pb-24">
|
||||
<div class="container_1 mx-auto px-4">
|
||||
|
||||
|
||||
<div class="solutions-nav-bar">
|
||||
<a href="#footfall" class="solutions-nav-btn">Footfall</a>
|
||||
<a href="#journey" class="solutions-nav-btn">Journey</a>
|
||||
<a href="#engagement" class="solutions-nav-btn">Engagement</a>
|
||||
<a href="#loyalty" class="solutions-nav-btn">Loyalty</a>
|
||||
<a href="#revenue" class="solutions-nav-btn">Revenue</a>
|
||||
</div>
|
||||
|
||||
<div class="space-y-8">
|
||||
<div id="footfall"
|
||||
class="grid lg:grid-cols-2 gap-8 items-center p-8 rounded-3xl premium-feature-card">
|
||||
|
||||
<div>
|
||||
<div
|
||||
class="w-16 h-16 rounded-2xl bg-gradient-gold flex items-center justify-center mb-6">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24"
|
||||
viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
|
||||
stroke-linecap="round" stroke-linejoin="round"
|
||||
class="lucide lucide-message-square w-8 h-8 text-primary-foreground">
|
||||
<path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z">
|
||||
</path>
|
||||
</svg>
|
||||
</div>
|
||||
|
||||
<h2 class="font-display text-3xl font-bold mb-4">Footfall Intelligence</h2>
|
||||
<p class="text-lg text-muted-foreground mb-6">Track and analyze store traffic
|
||||
with
|
||||
AI-powered computer vision</p>
|
||||
<div class="elementor-element elementor-element-21e8f2f elementor-icon-list--layout-traditional elementor-list-item-link-full_width elementor-widget elementor-widget-icon-list" data-id="21e8f2f" data-element_type="widget" data-widget_type="icon-list.default">
|
||||
<div class="elementor-widget-container">
|
||||
<ul class="elementor-icon-list-items">
|
||||
<li class="elementor-icon-list-item">
|
||||
<span class="elementor-icon-list-icon">
|
||||
<i aria-hidden="true" class="fontello icon-accordion-arrow-right"></i> </span>
|
||||
<span class="elementor-icon-list-text"><span style="font-weight: 700;">Real-time visitor counting</span> – Instantly track how many customers enter and exit your store.</span>
|
||||
</li>
|
||||
<li class="elementor-icon-list-item">
|
||||
<span class="elementor-icon-list-icon">
|
||||
<i aria-hidden="true" class="fontello icon-accordion-arrow-right"></i> </span>
|
||||
<span class="elementor-icon-list-text"><span style="font-weight: 700;">Traffic pattern analysis</span> – Understand when and where customers spend their time in your store.</span>
|
||||
</li>
|
||||
</li>
|
||||
<li class="elementor-icon-list-item">
|
||||
<span class="elementor-icon-list-icon">
|
||||
<i aria-hidden="true" class="fontello icon-accordion-arrow-right"></i> </span>
|
||||
<span class="elementor-icon-list-text"><span style="font-weight: 700;">Peak hour identification</span> – Identify the busiest times in your store to optimize staffing and inventory.</span>
|
||||
</li>
|
||||
</li>
|
||||
<li class="elementor-icon-list-item">
|
||||
<span class="elementor-icon-list-icon">
|
||||
<i aria-hidden="true" class="fontello icon-accordion-arrow-right"></i> </span>
|
||||
<span class="elementor-icon-list-text"><span style="font-weight: 700;">Staff optimization</span> – Allocate resources effectively based on traffic insights.</span>
|
||||
</li>
|
||||
<li class="elementor-icon-list-item">
|
||||
<span class="elementor-icon-list-icon">
|
||||
<i aria-hidden="true" class="fontello icon-accordion-arrow-right"></i> </span>
|
||||
<span class="elementor-icon-list-text"><span style="font-weight: 700;">Zone-based heatmaps</span> – Visualize customer movement and engagement within different areas of your store.</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div class="elementor-element elementor-element-9f54ccc aiero-button-border-style-gradient aiero-button-bakground-style-gradient elementor-widget elementor-widget-aiero_button" data-id="9f54ccc" data-element_type="widget" data-widget_type="aiero_button.default">
|
||||
<div class="elementor-widget-container">
|
||||
<div class="button-widget">
|
||||
<div class="button-container">
|
||||
<a class="aiero-button" href="../services-page/index.html" target="_blank">
|
||||
Explore more <span class="icon-button-arrow"></span>
|
||||
<span class="button-inner"></span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
|
||||
<div class="relative">
|
||||
<div
|
||||
class="aspect-video rounded-2xl bg-gradient-to-br from-primary/20 via-card to-gold-deep/20 border border-border flex items-center justify-center">
|
||||
<!-- <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trending-up w-24 h-24 text-primary/30">
|
||||
<polyline points="22 7 13.5 15.5 8.5 10.5 2 17"></polyline>
|
||||
<polyline points="16 7 22 7 22 13"></polyline>
|
||||
</svg> -->
|
||||
<img width="auto" height="auto"
|
||||
src="/loyaly_php/assets/images/Solution-1.png" alt="">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<div id="journey"
|
||||
class="grid lg:grid-cols-2 gap-8 items-center p-8 rounded-3xl premium-feature-card" >
|
||||
<div class="lg:order-2">
|
||||
<div
|
||||
class="w-16 h-16 rounded-2xl bg-gradient-gold flex items-center justify-center mb-6">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24"
|
||||
viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
|
||||
stroke-linecap="round" stroke-linejoin="round"
|
||||
class="lucide lucide-map w-8 h-8 text-primary-foreground">
|
||||
<polygon points="3 6 9 3 15 6 21 3 21 18 15 21 9 18 3 21"></polygon>
|
||||
<line x1="9" x2="9" y1="3" y2="18"></line>
|
||||
<line x1="15" x2="15" y1="6" y2="21"></line>
|
||||
</svg>
|
||||
</div>
|
||||
<h2 class="font-display text-3xl font-bold mb-4">Customer Journey</h2>
|
||||
<p class="text-lg text-muted-foreground mb-6">Map the complete in-store customer
|
||||
path from
|
||||
entry to exit</p>
|
||||
|
||||
<div class="elementor-element elementor-element-21e8f2f elementor-icon-list--layout-traditional elementor-list-item-link-full_width elementor-widget elementor-widget-icon-list" data-id="21e8f2f" data-element_type="widget" data-widget_type="icon-list.default">
|
||||
<div class="elementor-widget-container">
|
||||
<ul class="elementor-icon-list-items">
|
||||
<li class="elementor-icon-list-item">
|
||||
<span class="elementor-icon-list-icon">
|
||||
<i aria-hidden="true" class="fontello icon-accordion-arrow-right"></i> </span>
|
||||
<span class="elementor-icon-list-text"><span style="font-weight: 700;">Path visualization</span> - Track and visualize the complete customer movement inside your store.</span>
|
||||
</li>
|
||||
<li class="elementor-icon-list-item">
|
||||
<span class="elementor-icon-list-icon">
|
||||
<i aria-hidden="true" class="fontello icon-accordion-arrow-right"></i> </span>
|
||||
<span class="elementor-icon-list-text"><span style="font-weight: 700;">Dwell time analysis</span> - Measure how long customers spend in specific areas or zones.</span>
|
||||
</li>
|
||||
<li class="elementor-icon-list-item">
|
||||
<span class="elementor-icon-list-icon">
|
||||
<i aria-hidden="true" class="fontello icon-accordion-arrow-right"></i> </span>
|
||||
<span class="elementor-icon-list-text"><span style="font-weight: 700;">Conversion funnels</span> - Identify and analyze the steps customers take to complete a purchase.</span>
|
||||
</li>
|
||||
<li class="elementor-icon-list-item">
|
||||
<span class="elementor-icon-list-icon">
|
||||
<i aria-hidden="true" class="fontello icon-accordion-arrow-right"></i> </span>
|
||||
<span class="elementor-icon-list-text"><span style="font-weight: 700;">Hot zone identification</span> - Discover the most popular and engaging areas of your store.</span>
|
||||
</li>
|
||||
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div class="elementor-element elementor-element-9f54ccc aiero-button-border-style-gradient aiero-button-bakground-style-gradient elementor-widget elementor-widget-aiero_button" data-id="9f54ccc" data-element_type="widget" data-widget_type="aiero_button.default">
|
||||
<div class="elementor-widget-container">
|
||||
<div class="button-widget">
|
||||
<div class="button-container">
|
||||
<a class="aiero-button" href="../services-page/index.html" target="_blank">
|
||||
Explore more <span class="icon-button-arrow"></span>
|
||||
<span class="button-inner"></span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
<div class="relative lg:order-1">
|
||||
<div
|
||||
class="aspect-video rounded-2xl bg-gradient-to-br from-primary/20 via-card to-gold-deep/20 border border-border flex items-center justify-center">
|
||||
<!-- <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chart-column w-24 h-24 text-primary/30">
|
||||
<path d="M3 3v16a2 2 0 0 0 2 2h16"></path><path d="M18 17V9"></path><path d="M13 17V5"></path><path d="M8 17v-3"></path>
|
||||
</svg> -->
|
||||
<img width="auto" height="auto"
|
||||
src="/loyaly_php/assets/images/Solution-2.png" alt="">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
<div id="engagement"
|
||||
class="grid lg:grid-cols-2 gap-8 items-center p-8 rounded-3xl premium-feature-card">
|
||||
|
||||
<div>
|
||||
<div
|
||||
class="w-16 h-16 rounded-2xl bg-gradient-gold flex items-center justify-center mb-6">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24"
|
||||
viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
|
||||
stroke-linecap="round" stroke-linejoin="round"
|
||||
class="lucide lucide-message-square w-8 h-8 text-primary-foreground">
|
||||
<path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z">
|
||||
</path>
|
||||
</svg>
|
||||
</div>
|
||||
|
||||
<h2 class="font-display text-3xl font-bold mb-4">Customer Engagement</h2>
|
||||
<p class="text-lg text-muted-foreground mb-6">
|
||||
Deliver personalized interactions at the perfect moment
|
||||
</p>
|
||||
<div class="elementor-element elementor-element-21e8f2f elementor-icon-list--layout-traditional elementor-list-item-link-full_width elementor-widget elementor-widget-icon-list" data-id="21e8f2f" data-element_type="widget" data-widget_type="icon-list.default">
|
||||
<div class="elementor-widget-container">
|
||||
<ul class="elementor-icon-list-items">
|
||||
<li class="elementor-icon-list-item">
|
||||
<span class="elementor-icon-list-icon">
|
||||
<i aria-hidden="true" class="fontello icon-accordion-arrow-right"></i> </span>
|
||||
<span class="elementor-icon-list-text"><span style="font-weight: 700;">Contextual messaging</span> - Deliver relevant messages based on customer behavior and in-store context.</span>
|
||||
</li>
|
||||
<li class="elementor-icon-list-item">
|
||||
<span class="elementor-icon-list-icon">
|
||||
<i aria-hidden="true" class="fontello icon-accordion-arrow-right"></i> </span>
|
||||
<span class="elementor-icon-list-text"><span style="font-weight: 700;">Real-time notifications</span> - Send instant alerts and updates to engage customers at the right moment.</span>
|
||||
</li>
|
||||
<li class="elementor-icon-list-item">
|
||||
<span class="elementor-icon-list-icon">
|
||||
<i aria-hidden="true" class="fontello icon-accordion-arrow-right"></i> </span>
|
||||
<span class="elementor-icon-list-text"><span style="font-weight: 700;">Personalized offers</span> - Provide tailored promotions to increase engagement and drive conversions.</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div class="elementor-element elementor-element-9f54ccc aiero-button-border-style-gradient aiero-button-bakground-style-gradient elementor-widget elementor-widget-aiero_button" data-id="9f54ccc" data-element_type="widget" data-widget_type="aiero_button.default">
|
||||
<div class="elementor-widget-container">
|
||||
<div class="button-widget">
|
||||
<div class="button-container">
|
||||
<a class="aiero-button" href="../services-page/index.html" target="_blank">
|
||||
Explore more <span class="icon-button-arrow"></span>
|
||||
<span class="button-inner"></span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
|
||||
<div class="relative">
|
||||
<div
|
||||
class="aspect-video rounded-2xl bg-gradient-to-br from-primary/20 via-card to-gold-deep/20 border border-border flex items-center justify-center">
|
||||
<!-- <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trending-up w-24 h-24 text-primary/30">
|
||||
<polyline points="22 7 13.5 15.5 8.5 10.5 2 17"></polyline>
|
||||
<polyline points="16 7 22 7 22 13"></polyline>
|
||||
</svg> -->
|
||||
<img width="auto" height="auto"
|
||||
src="/loyaly_php/assets/images/Solution-3.png" alt="">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- <div id="footfall"
|
||||
class="grid lg:grid-cols-2 gap-8 items-center p-8 rounded-3xl premium-feature-card">
|
||||
<div
|
||||
class="w-16 h-16 rounded-2xl bg-gradient-gold flex items-center justify-center mb-6">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24"
|
||||
viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
|
||||
stroke-linecap="round" stroke-linejoin="round"
|
||||
class="lucide lucide-footprints w-8 h-8 text-primary-foreground">
|
||||
<path d="M4 16v-2.38C4 11.5 2.97 10.5 3 8c.03-2.72 1.49-6 4.5-6C9.37 2 10 3.8 10 5.5c0 3.11-2 5.66-2 8.68V16a2 2 0 1 1-4 0Z"></path>
|
||||
<path d="M20 20v-2.38c0-2.12 1.03-3.12 1-5.62-.03-2.72-1.49-6-4.5-6C14.63 6 14 7.8 14 9.5c0 3.11 2 5.66 2 8.68V20a2 2 0 1 0 4 0Z"></path>
|
||||
<path d="M16 17h4"></path>
|
||||
<path d="M4 13h4"></path>
|
||||
</svg>
|
||||
</div>
|
||||
<h2 class="font-display text-3xl font-bold mb-4">Footfall Intelligence</h2>
|
||||
<p class="text-lg text-muted-foreground mb-6">Track and analyze store traffic
|
||||
with
|
||||
AI-powered computer vision</p>
|
||||
|
||||
|
||||
<div class="elementor-element elementor-element-21e8f2f elementor-icon-list--layout-traditional elementor-list-item-link-full_width elementor-widget elementor-widget-icon-list" data-id="21e8f2f" data-element_type="widget" data-widget_type="icon-list.default">
|
||||
<div class="elementor-widget-container">
|
||||
<ul class="elementor-icon-list-items">
|
||||
<li class="elementor-icon-list-item">
|
||||
<span class="elementor-icon-list-icon">
|
||||
<i aria-hidden="true" class="fontello icon-accordion-arrow-right"></i> </span>
|
||||
<span class="elementor-icon-list-text">Real-time visitor counting</span>
|
||||
</li>
|
||||
<li class="elementor-icon-list-item">
|
||||
<span class="elementor-icon-list-icon">
|
||||
<i aria-hidden="true" class="fontello icon-accordion-arrow-right"></i> </span>
|
||||
<span class="elementor-icon-list-text">Traffic pattern analysis</span>
|
||||
</li>
|
||||
<li class="elementor-icon-list-item">
|
||||
<span class="elementor-icon-list-icon">
|
||||
<i aria-hidden="true" class="fontello icon-accordion-arrow-right"></i> </span>
|
||||
<span class="elementor-icon-list-text">Peak hour identification</span>
|
||||
</li>
|
||||
<li class="elementor-icon-list-item">
|
||||
<span class="elementor-icon-list-icon">
|
||||
<i aria-hidden="true" class="fontello icon-accordion-arrow-right"></i> </span>
|
||||
<span class="elementor-icon-list-text">Staff optimization </span>
|
||||
</li>
|
||||
<li class="elementor-icon-list-item">
|
||||
<span class="elementor-icon-list-icon">
|
||||
<i aria-hidden="true" class="fontello icon-accordion-arrow-right"></i> </span>
|
||||
<span class="elementor-icon-list-text">Zone-based heatmaps </span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div> -->
|
||||
<!-- <div class="elementor-element elementor-element-f51e8ba aiero-button-border-style-gradient aiero-button-bakground-style-gradient elementor-widget elementor-widget-aiero_button" data-id="f51e8ba" data-element_type="widget" data-widget_type="aiero_button.default">
|
||||
<div class="elementor-widget-container">
|
||||
<div class="button-widget">
|
||||
<div class="button-container">
|
||||
<a class="aiero-button" href="../services-page/index.html" target="_blank">Explore more </a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="relative">
|
||||
<div
|
||||
class="aspect-video rounded-2xl bg-gradient-to-br from-primary/20 via-card to-gold-deep/20 border border-border flex items-center justify-center">
|
||||
|
||||
<img width="auto" height="auto"
|
||||
src="/loyaly_php/assets/images/Solution-1.png" alt="">
|
||||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
|
||||
|
||||
<div id="loyalty"
|
||||
class="grid lg:grid-cols-2 gap-8 items-center p-8 rounded-3xl premium-feature-card lg:flex-row-reverse">
|
||||
|
||||
<div class="lg:order-2">
|
||||
<div
|
||||
class="w-16 h-16 rounded-2xl bg-gradient-gold flex items-center justify-center mb-6">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24"
|
||||
viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
|
||||
stroke-linecap="round" stroke-linejoin="round"
|
||||
class="lucide lucide-crown w-8 h-8 text-primary-foreground">
|
||||
<path
|
||||
d="M11.562 3.266a.5.5 0 0 1 .876 0L15.39 8.87a1 1 0 0 0 1.516.294L21.183 5.5a.5.5 0 0 1 .798.519l-2.834 10.246a1 1 0 0 1-.956.734H5.81a1 1 0 0 1-.957-.734L2.02 6.02a.5.5 0 0 1 .798-.519l4.276 3.664a1 1 0 0 0 1.516-.294z">
|
||||
</path>
|
||||
<path d="M5 21h14"></path>
|
||||
</svg>
|
||||
</div>
|
||||
|
||||
<h2 class="font-display text-3xl font-bold mb-4">Loyalty Management</h2>
|
||||
<p class="text-lg text-muted-foreground mb-6">
|
||||
Build emotional loyalty without plastic cards
|
||||
</p>
|
||||
|
||||
|
||||
<div class="elementor-element elementor-element-21e8f2f elementor-icon-list--layout-traditional elementor-list-item-link-full_width elementor-widget elementor-widget-icon-list" data-id="21e8f2f" data-element_type="widget" data-widget_type="icon-list.default">
|
||||
<div class="elementor-widget-container">
|
||||
<ul class="elementor-icon-list-items">
|
||||
<li class="elementor-icon-list-item">
|
||||
<span class="elementor-icon-list-icon">
|
||||
<i aria-hidden="true" class="fontello icon-accordion-arrow-right"></i> </span>
|
||||
<span class="elementor-icon-list-text"><span style="font-weight: 700;">App-less loyalty</span> - Enable seamless loyalty experiences without requiring customers to install an app.</span>
|
||||
</li>
|
||||
<li class="elementor-icon-list-item">
|
||||
<span class="elementor-icon-list-icon">
|
||||
<i aria-hidden="true" class="fontello icon-accordion-arrow-right"></i> </span>
|
||||
<span class="elementor-icon-list-text"><span style="font-weight: 700;">Automatic recognition</span> - Identify and acknowledge loyal customers in real-time.</span>
|
||||
</li>
|
||||
<li class="elementor-icon-list-item">
|
||||
<span class="elementor-icon-list-icon">
|
||||
<i aria-hidden="true" class="fontello icon-accordion-arrow-right"></i> </span>
|
||||
<span class="elementor-icon-list-text"><span style="font-weight: 700;">Tier management</span> - Create and manage different loyalty tiers with unique benefits.</span>
|
||||
</li>
|
||||
</li>
|
||||
<li class="elementor-icon-list-item">
|
||||
<span class="elementor-icon-list-icon">
|
||||
<i aria-hidden="true" class="fontello icon-accordion-arrow-right"></i> </span>
|
||||
<span class="elementor-icon-list-text"><span style="font-weight: 700;">Reward automation</span> - Streamline the distribution of rewards based on customer actions.</span>
|
||||
</li>
|
||||
<li class="elementor-icon-list-item">
|
||||
<span class="elementor-icon-list-icon">
|
||||
<i aria-hidden="true" class="fontello icon-accordion-arrow-right"></i> </span>
|
||||
<span class="elementor-icon-list-text"><span style="font-weight: 700;">VIP experiences</span> - Provide exclusive opportunities and personalized service to top-tier customers.</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div class="elementor-element elementor-element-9f54ccc aiero-button-border-style-gradient aiero-button-bakground-style-gradient elementor-widget elementor-widget-aiero_button" data-id="9f54ccc" data-element_type="widget" data-widget_type="aiero_button.default">
|
||||
<div class="elementor-widget-container">
|
||||
<div class="button-widget">
|
||||
<div class="button-container">
|
||||
<a class="aiero-button" href="../services-page/index.html" target="_blank">
|
||||
Explore more <span class="icon-button-arrow"></span>
|
||||
<span class="button-inner"></span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
|
||||
<div class="relative lg:order-1">
|
||||
<div
|
||||
class="aspect-video rounded-2xl bg-gradient-to-br from-primary/20 via-card to-gold-deep/20 border border-border flex items-center justify-center">
|
||||
<!-- <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-crown w-24 h-24 text-primary/30">
|
||||
<path d="M11.562 3.266a.5.5 0 0 1 .876 0L15.39 8.87a1 1 0 0 0 1.516.294L21.183 5.5a.5.5 0 0 1 .798.519l-2.834 10.246a1 1 0 0 1-.956.734H5.81a1 1 0 0 1-.957-.734L2.02 6.02a.5.5 0 0 1 .798-.519l4.276 3.664a1 1 0 0 0 1.516-.294z"></path>
|
||||
<path d="M5 21h14"></path>
|
||||
</svg> -->
|
||||
<img width="auto" height="auto" src="/loyaly_php/assets/images/Solution-4.png"
|
||||
alt="">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<div id="revenue"
|
||||
class="grid lg:grid-cols-2 gap-8 items-center p-8 rounded-3xl premium-feature-card">
|
||||
|
||||
<div>
|
||||
<div
|
||||
class="w-16 h-16 rounded-2xl bg-gradient-gold flex items-center justify-center mb-6">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24"
|
||||
viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
|
||||
stroke-linecap="round" stroke-linejoin="round"
|
||||
class="lucide lucide-trending-up w-8 h-8 text-primary-foreground">
|
||||
<polyline points="22 7 13.5 15.5 8.5 10.5 2 17"></polyline>
|
||||
<polyline points="16 7 22 7 22 13"></polyline>
|
||||
</svg>
|
||||
</div>
|
||||
|
||||
<h2 class="font-display text-3xl font-bold mb-4">Revenue Optimization</h2>
|
||||
<p class="text-lg text-muted-foreground mb-6">
|
||||
Maximize every transaction with smart pricing
|
||||
</p>
|
||||
<div class="elementor-element elementor-element-21e8f2f elementor-icon-list--layout-traditional elementor-list-item-link-full_width elementor-widget elementor-widget-icon-list" data-id="21e8f2f" data-element_type="widget" data-widget_type="icon-list.default">
|
||||
<div class="elementor-widget-container">
|
||||
<ul class="elementor-icon-list-items">
|
||||
<li class="elementor-icon-list-item">
|
||||
<span class="elementor-icon-list-icon">
|
||||
<i aria-hidden="true" class="fontello icon-accordion-arrow-right"></i> </span>
|
||||
<span class="elementor-icon-list-text"><span style="font-weight: 700;">Dynamic pricing</span> - Adjust prices in real-time based on demand, competition, and other market factors.</span>
|
||||
</li>
|
||||
<li class="elementor-icon-list-item">
|
||||
<span class="elementor-icon-list-icon">
|
||||
<i aria-hidden="true" class="fontello icon-accordion-arrow-right"></i> </span>
|
||||
<span class="elementor-icon-list-text"><span style="font-weight: 700;">Smart discounts</span> - Offer personalized discount opportunities based on customer behavior and preferences.</span>
|
||||
</li>
|
||||
</li>
|
||||
<li class="elementor-icon-list-item">
|
||||
<span class="elementor-icon-list-icon">
|
||||
<i aria-hidden="true" class="fontello icon-accordion-arrow-right"></i> </span>
|
||||
<span class="elementor-icon-list-text"><span style="font-weight: 700;">Basket optimization</span> - Maximize the value of each customer purchase through intelligent product recommendations.</span>
|
||||
</li>
|
||||
<li class="elementor-icon-list-item">
|
||||
<span class="elementor-icon-list-icon">
|
||||
<i aria-hidden="true" class="fontello icon-accordion-arrow-right"></i> </span>
|
||||
<span class="elementor-icon-list-text"><span style="font-weight: 700;">Upsell triggers</span> - Identify and present relevant cross-selling opportunities at the point of sale.</span>
|
||||
</li>
|
||||
<li class="elementor-icon-list-item">
|
||||
<span class="elementor-icon-list-icon">
|
||||
<i aria-hidden="true" class="fontello icon-accordion-arrow-right"></i> </span>
|
||||
<span class="elementor-icon-list-text"><span style="font-weight: 700;">Margin protection</span> - Implement strategies to safeguard profit margins while offering competitive pricing.</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div class="elementor-element elementor-element-9f54ccc aiero-button-border-style-gradient aiero-button-bakground-style-gradient elementor-widget elementor-widget-aiero_button" data-id="9f54ccc" data-element_type="widget" data-widget_type="aiero_button.default">
|
||||
<div class="elementor-widget-container">
|
||||
<div class="button-widget">
|
||||
<div class="button-container">
|
||||
<a class="aiero-button" href="../services-page/index.html" target="_blank">
|
||||
Explore more <span class="icon-button-arrow"></span>
|
||||
<span class="button-inner"></span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
|
||||
<div class="relative">
|
||||
<div
|
||||
class="aspect-video rounded-2xl bg-gradient-to-br from-primary/20 via-card to-gold-deep/20 border border-border flex items-center justify-center">
|
||||
<!-- <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trending-up w-24 h-24 text-primary/30">
|
||||
<polyline points="22 7 13.5 15.5 8.5 10.5 2 17"></polyline>
|
||||
<polyline points="16 7 22 7 22 13"></polyline>
|
||||
</svg> -->
|
||||
<img width="auto" height="auto" src="/loyaly_php/assets/images/Solution-5.png"
|
||||
alt="">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</section>
|
||||
|
||||
<?php include 'components/get_in_touch.php'; ?>
|
||||
<!-- </div>
|
||||
</div> -->
|
||||
</main>
|
||||
<style>
|
||||
.page-title-container .page-title-bg {
|
||||
background-position: center center;
|
||||
background-repeat: no-repeat;
|
||||
-webkit-background-size: cover;
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
.page-title-container .page-title-bg {
|
||||
background-image: url("/loyaly_php/assets/images/page-title-bg-min.jpg");
|
||||
}
|
||||
|
||||
/* Premium Feature Card Styles */
|
||||
.premium-feature-card {
|
||||
background: linear-gradient(145deg, #ffffff, #fafafa);
|
||||
border: 1px solid rgba(245, 166, 35, 0.2);
|
||||
box-shadow: 0 15px 35px rgba(0, 0, 0, 0.03), inset 0 0 0 1px rgba(245, 166, 35, 0.05);
|
||||
transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
z-index: 3;
|
||||
}
|
||||
|
||||
|
||||
.premium-feature-card:hover {
|
||||
transform: translateY(-8px);
|
||||
box-shadow: 0 30px 60px rgba(245, 166, 35, 0.08), inset 0 0 0 1px rgba(245, 166, 35, 0.2);
|
||||
border-color: rgba(245, 166, 35, 0.3);
|
||||
}
|
||||
|
||||
/* Glowing Orb Effect */
|
||||
.premium-feature-card::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: -100px;
|
||||
right: -100px;
|
||||
width: 300px;
|
||||
height: 300px;
|
||||
border-radius: 50%;
|
||||
background: radial-gradient(circle, rgba(245, 166, 35, 0.12) 0%, transparent 60%);
|
||||
opacity: 0.5;
|
||||
z-index: 0;
|
||||
transition: all 0.6s ease;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.premium-feature-card:hover::before {
|
||||
transform: scale(1.3);
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* Keep content above the orb */
|
||||
.premium-feature-card>* {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
/* Elevate the image wrapper on hover */
|
||||
.premium-feature-card .aspect-video {
|
||||
transition: all 0.5s ease;
|
||||
}
|
||||
|
||||
.premium-feature-card:hover .aspect-video {
|
||||
transform: scale(1.03);
|
||||
box-shadow: 0 20px 40px rgba(245, 166, 35, 0.15);
|
||||
border-color: rgba(245, 166, 35, 0.3);
|
||||
}
|
||||
|
||||
/* Solutions Custom Navigation */
|
||||
.solutions-nav-bar {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 1rem;
|
||||
margin-bottom: 4rem;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
width: fit-content;
|
||||
position: sticky;
|
||||
top: 7rem;
|
||||
z-index: 3;
|
||||
background-color: rgba(255, 255, 255, 0.4);
|
||||
backdrop-filter: blur(20px);
|
||||
-webkit-backdrop-filter: blur(20px);
|
||||
padding: 0.75rem 1.5rem;
|
||||
border-radius: 9999px;
|
||||
box-shadow: 0 12px 40px rgba(0, 0, 0, 0.05);
|
||||
border: 1px solid rgba(255, 255, 255, 0.5);
|
||||
}
|
||||
|
||||
.solutions-nav-btn {
|
||||
padding: 0.6rem 1.8rem;
|
||||
background: linear-gradient(to right, #cc9a1f, #a17409);
|
||||
color: #ffffff;
|
||||
font-weight: 600;
|
||||
font-size: 0.95rem;
|
||||
text-decoration: none;
|
||||
border-radius: 9999px;
|
||||
border: none;
|
||||
box-shadow: 0 8px 20px rgba(204, 154, 31, 0.3);
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.solutions-nav-btn:hover {
|
||||
background: linear-gradient(to right, #b88a1a, #8f6506);
|
||||
color: #ffffff;
|
||||
box-shadow: 0 12px 25px rgba(204, 154, 31, 0.4);
|
||||
transform: translateY(-2px);
|
||||
}
|
||||
|
||||
html {
|
||||
scroll-behavior: smooth;
|
||||
scroll-padding-top: 140px;
|
||||
}
|
||||
</style>
|
||||
</main>
|
||||
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.2/gsap.min.js"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.2/ScrollTrigger.min.js"></script>
|
||||
<script>
|
||||
function getstart() {
|
||||
window.location.href = "/loyaly_php/contacts.php";
|
||||
}
|
||||
|
||||
// GSAP Scroll Animations
|
||||
document.addEventListener("DOMContentLoaded", (event) => {
|
||||
if (typeof gsap !== "undefined") {
|
||||
gsap.registerPlugin(ScrollTrigger);
|
||||
|
||||
const cards = document.querySelectorAll('.premium-feature-card');
|
||||
|
||||
cards.forEach((card) => {
|
||||
// Select text content elements to animate
|
||||
const textElements = card.querySelectorAll("h2, p.text-muted-foreground, li, .gap-4");
|
||||
|
||||
// Initial hidden state
|
||||
gsap.set(textElements, { y: 30, opacity: 0 });
|
||||
|
||||
// Create animation that triggers on scroll
|
||||
gsap.to(textElements, {
|
||||
scrollTrigger: {
|
||||
trigger: card,
|
||||
start: "top 85%",
|
||||
toggleActions: "play none none reverse"
|
||||
},
|
||||
y: 0,
|
||||
opacity: 1,
|
||||
duration: 0.8,
|
||||
stagger: 0.15,
|
||||
ease: "power3.out"
|
||||
});
|
||||
});
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<?php include 'includes/footer.php'; ?>
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
Reference in New Issue
Block a user