38474-vm/index.php

<?php
declare(strict_types=1);
require_once __DIR__ . '/includes/header.php';

// Fetch Featured Cars for Home Page
try {
    $db = db();
    $featured_cars = $db->query("SELECT c.*, b.name as branch_name 
                                FROM cars c 
                                JOIN branches b ON c.branch_id = b.id 
                                WHERE c.status = 'Available' AND c.is_featured = 1
                                ORDER BY c.created_at DESC 
                                LIMIT 6")->fetchAll();
                                
    $branches = $db->query("SELECT * FROM branches LIMIT 3")->fetchAll();
} catch (Exception $e) {
    $featured_cars = [];
    $branches = [];
}
?>

<!-- 1. & 2. Hero Section & Background Design -->
<section class="hero">
    <h1>Experience <span>Supreme</span> Luxury Automotive</h1>
    <p>Afghanistan's premier destination for elite vehicles, flexible installments, and professional service across our major branches.</p>
    <div class="hero-btns">
        <a href="marketplace.php" class="btn">View Cars</a>
        <a href="contact.php" class="btn btn-outline">Sell Your Car</a>
    </div>
</section>

<!-- 6. Why Choose Us Section -->
<section class="container">
    <div class="section-title">
        <div>
            <h2>Why Choose Us</h2>
            <p>Our commitment to excellence makes us the market leader.</p>
        </div>
    </div>
    <div class="grid">
        <div class="feature-box">
            <i class="fas fa-certificate"></i>
            <h3>Trusted Dealership</h3>
            <p>Over 10 years of excellence in the automotive industry with thousands of happy clients.</p>
        </div>
        <div class="feature-box">
            <i class="fas fa-check-circle"></i>
            <h3>Verified Listings</h3>
            <p>Every vehicle undergoes a rigorous 150-point technical and background inspection.</p>
        </div>
        <div class="feature-box">
            <i class="fas fa-shield-alt"></i>
            <h3>Secure Transactions</h3>
            <p>Safe, transparent, and legally binding payment processes for all vehicle sales.</p>
        </div>
        <div class="feature-box">
            <i class="fas fa-bolt"></i>
            <h3>Fast Approval</h3>
            <p>Get your luxury car today with instant installment approval and minimal paperwork.</p>
        </div>
    </div>
</section>

<!-- 5. Featured Cars Section -->
<section class="container" style="background: var(--surface-color);">
    <div class="section-title">
        <div>
            <h2>Featured Collection</h2>
            <p>Hand-picked premium vehicles currently available in our showrooms.</p>
        </div>
        <a href="marketplace.php" class="btn btn-outline" style="padding: 0.8rem 1.5rem;">View All <i class="fas fa-arrow-right" style="margin-left: 10px;"></i></a>
    </div>
    <div class="grid">
        <?php foreach ($featured_cars as $car): ?>
        <div class="car-card">
            <div class="car-image">
                <span class="car-badge">PREMIUM</span>
                <img src="<?= htmlspecialchars($car['image_url']) ?>" alt="<?= htmlspecialchars($car['brand']) ?>">
            </div>
            <div class="car-content">
                <div class="car-title"><?= htmlspecialchars($car['brand'] . ' ' . $car['model']) ?></div>
                <div class="car-price">$<?= number_format((float)$car['price'], 0) ?></div>
                <div class="car-meta">
                    <span><i class="fas fa-calendar-alt"></i> <?= $car['year'] ?></span>
                    <span><i class="fas fa-map-marker-alt"></i> <?= htmlspecialchars($car['branch_name']) ?></span>
                </div>
                <div class="installment-box">
                    Installments from <strong>$<?= number_format($car['price'] / 60, 0) ?>/mo</strong>
                </div>
                <div style="margin-top: 1.5rem;">
                    <a href="marketplace.php" class="btn" style="width: 100%; padding: 0.8rem;">View Details</a>
                </div>
            </div>
        </div>
        <?php endforeach; ?>
    </div>
</section>

<!-- 3. Review Section -->
<section class="container">
    <div class="section-title">
        <div>
            <h2>Customer Reviews</h2>
            <p>What our elite clientele says about their experience with AFG_CARS.</p>
        </div>
    </div>
    <div class="grid">
        <div class="review-card">
            <div class="review-header">
                <div class="customer-photo">AS</div>
                <div>
                    <div style="font-weight: 800; font-size: 1.1rem;">Ahmad Shah</div>
                    <div style="font-size: 0.8rem; color: var(--accent-color);">Verified Buyer</div>
                </div>
            </div>
            <div class="stars">
                <i class="fas fa-star"></i><i class="fas fa-star"></i><i class="fas fa-star"></i><i class="fas fa-star"></i><i class="fas fa-star"></i>
            </div>
            <p style="color: var(--text-secondary);">"The best experience I've had buying a car in Kabul. The installment plan was very easy to understand and the team was extremely professional. Highly recommended!"</p>
        </div>
        <div class="review-card">
            <div class="review-header">
                <div class="customer-photo">MK</div>
                <div>
                    <div style="font-weight: 800; font-size: 1.1rem;">Mariam Khan</div>
                    <div style="font-size: 0.8rem; color: var(--accent-color);">Business Owner</div>
                </div>
            </div>
            <div class="stars">
                <i class="fas fa-star"></i><i class="fas fa-star"></i><i class="fas fa-star"></i><i class="fas fa-star"></i><i class="fas fa-star"></i>
            </div>
            <p style="color: var(--text-secondary);">"Found my dream Lexus LX 600 here. The condition was exactly as described. The Herat branch team was very helpful with all the paperwork. 5 stars!"</p>
        </div>
        <div class="review-card">
            <div class="review-header">
                <div class="customer-photo">RZ</div>
                <div>
                    <div style="font-weight: 800; font-size: 1.1rem;">Reza Zaki</div>
                    <div style="font-size: 0.8rem; color: var(--accent-color);">Verified Buyer</div>
                </div>
            </div>
            <div class="stars">
                <i class="fas fa-star"></i><i class="fas fa-star"></i><i class="fas fa-star"></i><i class="fas fa-star"></i><i class="fas fa-star"></i>
            </div>
            <p style="color: var(--text-secondary);">"Transparent pricing and high-quality inventory. I appreciate the technical reports they provided before I made my decision. Best dealership in Afghanistan."</p>
        </div>
    </div>
</section>

<!-- 4. Physical Location Section -->
<section class="container" style="background: var(--surface-color);">
    <div class="section-title">
        <div>
            <h2>Dealership Locations</h2>
            <p>Visit us at any of our modern showrooms across Afghanistan.</p>
        </div>
    </div>
    <div class="grid">
        <?php foreach ($branches as $branch): ?>
        <div class="location-card">
            <h3><i class="fas fa-city"></i> <?= htmlspecialchars($branch['city']) ?></h3>
            <div class="location-info">
                <p><i class="fas fa-map-marker-alt"></i> <?= htmlspecialchars($branch['address']) ?></p>
                <p><i class="fas fa-phone"></i> <?= htmlspecialchars($branch['phone']) ?></p>
                <p><i class="fas fa-clock"></i> <?= htmlspecialchars($branch['hours']) ?></p>
            </div>
            <a href="https://maps.google.com" target="_blank" class="btn btn-outline" style="width: 100%; margin-top: 1rem; padding: 0.8rem;">Open Map</a>
        </div>
        <?php endforeach; ?>
    </div>
</section>

<?php require_once __DIR__ . '/includes/footer.php'; ?>