{% extends 'base.html' %}
{% block title %}About Us | NuraStore{% endblock %}

{% block content %}
<div class="bg-light py-5 mb-5">
    <div class="container text-center">
        <h1 class="display-4 fw-bold">About NuraStore</h1>
        <p class="lead text-muted mx-auto col-md-8">Empowering Northern Nigeria with seamless e-commerce solutions.</p>
    </div>
</div>

<div class="container mb-5">
    <div class="row align-items-center mb-5">
        <div class="col-md-6">
            <h2 class="fw-bold mb-3">Our Mission</h2>
            <p class="text-muted">Founded in Kano, NuraStore was built with a simple mission: to bridge the gap between quality products and customers across Northern Nigeria.</p>
            <p class="text-muted">We believe that logistics shouldn't be a barrier. Whether you are in Kano, Abuja, or Kaduna, you deserve access to top-tier electronics, fashion, and home essentials with reliable, affordable delivery.</p>
        </div>
        <div class="col-md-6">
            <img src="https://via.placeholder.com/600x400?text=Our+Warehouse" class="img-fluid rounded shadow-sm" alt="About Us">
        </div>
    </div>

    <div class="row text-center g-4">
        <div class="col-md-4">
            <div class="p-4 border rounded shadow-sm">
                <i class="fas fa-handshake fa-3x text-primary mb-3"></i>
                <h5>Trust & Integrity</h5>
                <p class="small text-muted">We verify every product to ensure you get exactly what you ordered.</p>
            </div>
        </div>
        <div class="col-md-4">
            <div class="p-4 border rounded shadow-sm">
                <i class="fas fa-truck fa-3x text-primary mb-3"></i>
                <h5>Local Logistics</h5>
                <p class="small text-muted">Our delivery network is optimized for the North, ensuring speed and safety.</p>
            </div>
        </div>
        <div class="col-md-4">
            <div class="p-4 border rounded shadow-sm">
                <i class="fas fa-users fa-3x text-primary mb-3"></i>
                <h5>Customer First</h5>
                <p class="small text-muted">Our support team speaks your language and understands your needs.</p>
            </div>
        </div>
    </div>
</div>
{% endblock %}