@extends('layouts.app')

@section('content')

<x-page-hero
    label="Franchise Networks"
    badge="Franchise & Multi-Brand"
    title="Give franchisors visibility. Give franchisees autonomy."
    subtitle="Standardise brand standards, menus, pricing, and reporting across your franchise network — while giving each franchisee the tools to manage their own operation."
    cta1="Book a Demo"
    cta2="Contact Sales"
    :cta2url="route('contact')"
/>

<section class="section bg-surface">
    <div class="container-site">
        <div class="grid lg:grid-cols-2 gap-14 items-center">
            <div>
                <p class="section-label">Franchisor view</p>
                <h2 class="heading-md text-balance mb-8">
                    Control the brand. See every outlet. Act on what matters.
                </h2>
                <x-feature-grid cols="2" :features="[
                    ['icon' => 'layout-dashboard', 'title' => 'Central Brand Control', 'description' => 'Push your approved menu, pricing, and promotions to all franchise outlets from HQ.'],
                    ['icon' => 'chart-bar',        'title' => 'Network Reporting',     'description' => 'Compare performance across all franchise locations. Identify outliers early.'],
                    ['icon' => 'lock',             'title' => 'Compliance Controls',  'description' => 'Prevent unauthorised discounts, unapproved items, or pricing deviations at franchise outlets.'],
                    ['icon' => 'document',         'title' => 'Audit Trail',           'description' => 'Full transaction and modification logs at every outlet — reviewable from HQ.'],
                ]" />
            </div>
            <div>
                <p class="section-label">Franchisee view</p>
                <h2 class="heading-md text-balance mb-8">
                    Full operational tools within brand boundaries.
                </h2>
                <x-feature-grid cols="2" :features="[
                    ['icon' => 'monitor',   'title' => 'POS & Billing',         'description' => 'Full POS with the brand menu, approved pricing, and payment modes.'],
                    ['icon' => 'package',   'title' => 'Outlet Inventory',       'description' => 'Local stock management, purchase orders to approved suppliers, and GRN.'],
                    ['icon' => 'users',     'title' => 'Staff Management',       'description' => 'Manage your own team with roles and permissions within the approved access model.'],
                    ['icon' => 'chart-bar', 'title' => 'Outlet Reports',         'description' => 'Your own sales, cashier, and inventory reports — without seeing other outlets.'],
                ]" />
            </div>
        </div>
    </div>
</section>

<x-cta-band
    title="Managing a franchise network?"
    sub="Talk to us about multi-outlet licensing, network-level reporting, and brand compliance controls."
    cta1="Talk to Sales"
    :cta1url="route('contact')"
    cta2="Book a Demo"
    :cta2url="route('book-demo')"
/>

@endsection