<!DOCTYPE html>
<html lang="<?php echo e(str_replace('_', '-', app()->getLocale())); ?>">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="csrf-token" content="<?php echo e(csrf_token()); ?>">
    <title>Institution Axis ERP | Next-Gen School Management</title>
    
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.1/font/bootstrap-icons.css">
    
    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600;800&display=swap" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300..700&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="<?php echo e(asset('css/style.css')); ?>">
    <link rel="stylesheet" href="<?php echo e(asset('css/home.css')); ?>">
</head>
<body>

<header class="main-header sticky-top">
    <nav class="navbar navbar-expand-lg">
        <div class="container">
            <a class="navbar-brand" href="<?php echo e(route('home')); ?>">
                <img src="<?php echo e(asset('assets/images/ialogo.png')); ?>" alt="Logo" style="height: 80px;">
            </a>
            <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav">
                <span class="navbar-toggler-icon"></span>
            </button>
            <div class="collapse navbar-collapse" id="navbarNav">
                <ul class="navbar-nav ms-auto align-items-center">
                    <li class="nav-item"><a class="nav-link" href="#features">Features</a></li>
                    <li class="nav-item"><a class="nav-link" href="#modules">Modules</a></li>
                    <li class="nav-item"><a class="nav-link" href="#pricing">Pricing</a></li>
                    <?php if(auth()->guard()->check()): ?>
                        <li class="nav-item"><a class="btn btn-primary ms-3" href="<?php echo e(route('dashboard')); ?>">Dashboard</a></li>
                    <?php else: ?>
                        <li class="nav-item"><a class="btn btn-link text-dark text-decoration-none fw-bold ms-3" href="<?php echo e(route('login')); ?>">Login</a></li>
                        <li class="nav-item"><a class="btn btn-primary ms-3" href="<?php echo e(route('register')); ?>">Request Demo</a></li>
                    <?php endif; ?>
                </ul>
            </div>
        </div>
    </nav>
</header>

<section class="hero-section">
    <div class="container">
        <div class="row align-items-center">
            <div class="col-lg-6">
                <span class="badge bg-primary mb-3 px-3 py-2 rounded-pill">V1.0 Now Live</span>
                <h1>School Management <br><span style="color: #60a5fa; font-family: 'Space Grotesk', sans-serif;">Simplified.</span></h1>
                <p class="mb-5">Digitize, streamline, and centralize the operations of your institution with the most powerful SMIS in South Sudan and East Africa.</p>
                <div class="d-flex gap-3">
                    <?php if(auth()->guard()->guest()): ?>
                        <a href="<?php echo e(route('register')); ?>" class="btn btn-primary btn-lg px-4">Get Started Now</a>
                        <a href="#" class="btn btn-outline-light btn-lg px-4">Watch Demo <i class="bi bi-play-circle ms-2"></i></a>
                    <?php else: ?>
                        <a href="<?php echo e(route('dashboard')); ?>" class="btn btn-primary btn-lg px-4">Go to Dashboard</a>
                    <?php endif; ?>
                </div>
            </div>
            <div class="col-lg-6 text-center">
                <img src="<?php echo e(asset('assets/images/dashboard.png')); ?>" class="img-fluid hero-img" alt="ERP Dashboard">
            </div>
        </div>
    </div>
</section>

<section class="stats-container" id="features">
    <div class="container">
        <div class="row g-4 justify-content-center">
            <div class="col-md-3">
                <div class="stat-box">
                    <h2>50+</h2>
                    <p class="text-muted mb-0">Partner Institutions</p>
                </div>
            </div>
            <div class="col-md-3">
                <div class="stat-box">
                    <h2>10,000+</h2>
                    <p class="text-muted mb-0">Active Students</p>
                </div>
            </div>
            <div class="col-md-3">
                <div class="stat-box">
                    <h2>99.9%</h2>
                    <p class="text-muted mb-0">System Uptime</p>
                </div>
            </div>
        </div>
    </div>
</section>

<section class="section-padding py-5 mt-5" id="modules">
    <div class="container">
        <div class="text-center mb-5">
            <h2 class="section-title">Key Features</h2>
            <p class="text-muted">Everything you need to run a modern school efficiently.</p>
        </div>
        <div class="row g-4">
            <div class="col-md-3">
                <div class="feature-card">
                    <div class="icon-square"><i class="bi bi-person-badge"></i></div>
                    <h5>Student Management</h5>
                    <p class="text-muted">Centralized profiles, attendance, and behavioral tracking.</p>
                </div>
            </div>
            <div class="col-md-3">
                <div class="feature-card">
                    <div class="icon-square"><i class="bi bi-journal-check"></i></div>
                    <h5>Academic Tracking</h5>
                    <p class="text-muted">Digital report cards, exam scheduling, and lesson plans.</p>
                </div>
            </div>
            <div class="col-md-3">
                <div class="feature-card">
                    <div class="icon-square"><i class="bi bi-cash-stack"></i></div>
                    <h5>Fees & Finance</h5>
                    <p class="text-muted">Automated invoicing, fee collection, and financial reporting.</p>
                </div>
            </div>
            <div class="col-md-3">
                <div class="feature-card">
                    <div class="icon-square"><i class="bi bi-chat-dots"></i></div>
                    <h5>Communication</h5>
                    <p class="text-muted">SMS alerts and email notifications for parents and staff.</p>
                </div>
            </div>
        </div>
    </div>
</section>

<section class="section-padding bg-light py-5" id="pricing">
    <div class="container">
        <div class="text-center mb-5">
            <h2 class="section-title">Pricing Plans</h2>
            <div class="currency-switch mt-3">
                <select id="currencySwitcher" class="form-select w-auto d-inline-block shadow-sm border-0">
                    <option value="USD">$ USD</option>
                    <option value="KES">KES</option>
                    <option value="SSP">SSP</option>
                </select>
            </div>
        </div>

        <div class="row g-4 align-items-center">
            <div class="col-lg-4">
                <div class="pricing-card">
                    <h5 class="fw-bold">Starter</h5>
                    <div class="price my-3"><span class="amount" data-usd="585">$585</span><span style="font-size: 1rem;">/year</span></div>
                    <p class="text-muted">Perfect for small schools</p>
                    <hr>
                    <ul class="list-unstyled mb-4">
                        <li class="mb-2"><i class="bi bi-check2-circle text-primary me-2"></i> 500 Students</li>
                        <li class="mb-2"><i class="bi bi-check2-circle text-primary me-2"></i> Core Modules</li>
                        <li class="mb-2"><i class="bi bi-check2-circle text-primary me-2"></i> Email Support</li>
                    </ul>
                    <a href="<?php echo e(route('register')); ?>" class="btn btn-outline-primary w-100 py-3">Get Started</a>
                </div>
            </div>

            <div class="col-lg-4">
                <div class="pricing-card popular position-relative">
                    <div class="badge-popular">Recommended</div>
                    <h5 class="fw-bold">Professional</h5>
                    <div class="price my-3"><span class="amount" data-usd="780">$780</span><span style="font-size: 1rem;">/year</span></div>
                    <p class="text-muted">For growing institutions</p>
                    <hr>
                    <ul class="list-unstyled mb-4">
                        <li class="mb-2"><i class="bi bi-check2-circle text-primary me-2"></i> 800 Students</li>
                        <li class="mb-2"><i class="bi bi-check2-circle text-primary me-2"></i> Advanced Reports</li>
                        <li class="mb-2"><i class="bi bi-check2-circle text-primary me-2"></i> Priority Support</li>
                    </ul>
                    <a href="<?php echo e(route('register')); ?>" class="btn btn-primary w-100 py-3">Choose Plan</a>
                </div>
            </div>

            <div class="col-lg-4">
                <div class="pricing-card">
                    <h5 class="fw-bold">Enterprise</h5>
                    <div class="price my-3"><span class="amount" data-usd="1050">$1050</span><span style="font-size: 1rem;">/year</span></div>
                    <p class="text-muted">Full custom solutions</p>
                    <hr>
                    <ul class="list-unstyled mb-4">
                        <li class="mb-2"><i class="bi bi-check2-circle text-primary me-2"></i> 2000 Students</li>
                        <li class="mb-2"><i class="bi bi-check2-circle text-primary me-2"></i> Custom Modules</li>
                        <li class="mb-2"><i class="bi bi-check2-circle text-primary me-2"></i> 24/7 Account Manager</li>
                    </ul>
                    <a href="<?php echo e(route('register')); ?>" class="btn btn-outline-primary w-100 py-3">Contact Sales</a>
                </div>
            </div>
        </div>
    </div>
</section>

<div class="container">
    <section class="cta-section text-center">
        <h2 class="fw-bold mb-3">Ready to transform your school?</h2>
        <p class="mb-5 opacity-75">Join dozens of schools already using Institution Axis ERP to excel.</p>
        <a href="<?php echo e(route('register')); ?>" class="btn btn-secondary btn-lg px-5 shadow">Request Free Demo</a>
    </section>
</div>

<footer class="footer mt-5">
    <div class="container">
        <div class="row border-bottom border-secondary pb-4 mb-4">
            <div class="col-md-6 text-md-start text-center">
                <img src="<?php echo e(asset('assets/images/ialogo-white.png')); ?>" alt="Logo" style="height: 80px; filter: brightness(0) invert(1);">
            </div>
            <div class="col-md-6 text-md-end text-center mt-3 mt-md-0">
                <a href="#" class="text-white me-3 text-decoration-none">Privacy Policy</a>
                <a href="#" class="text-white text-decoration-none">Terms of Service</a>
            </div>
        </div>
        <p class="text-center small mb-0">© <?php echo e(date('Y')); ?> Institution Axis ERP. Leading School Management Innovation.</p>
    </div>
</footer>

<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
<script>
    const rates = { USD: 1, KES: 130, SSP: 1300 };
    const symbols = { USD: "$", KES: "KES ", SSP: "SSP " };

    document.getElementById('currencySwitcher').addEventListener('change', function() {
        let currency = this.value;
        let rate = rates[currency];
        document.querySelectorAll('.amount').forEach(function(el){
            let usd = el.getAttribute('data-usd');
            let converted = Math.round(usd * rate).toLocaleString();
            el.innerHTML = symbols[currency] + converted;
        });
    });
</script>
</body>
</html><?php /**PATH C:\Users\User\OneDrive - dynamicconsult.co.ke\Institution Axis System\institution-axis\resources\views/home/home.blade.php ENDPATH**/ ?>