{% extends 'base.html' %}
{% load static %}

{% block extra_head %}
<link rel="stylesheet" href="{% static 'css/about.css' %}">
{% endblock %}

{% block content %}
<section class="about-hero">
    <div class="about-hero-content">
        <h1>About Hamro Karma</h1>
        <p class="about-subtitle">Empowering Nepal Through Digital Commerce</p>
    </div>
</section>

<section class="about-intro">
    <div class="intro-text">
        <p>Hamro Karma is a digital marketplace that connects buyers with trusted sellers across Nepal. Our goal is to make online shopping reliable, simple, and transparent.</p>
    </div>
</section>

<section class="mission-vision">
    <div class="mission-vision-grid">
        <div class="mission-box">
            <h2>Our Mission</h2>
            <p>Deliver dependable online shopping backed by verified products, fair pricing, and customer-first service.</p>
        </div>
        <div class="vision-box">
            <h2>Our Vision</h2>
            <p>Build Nepal's most trusted and modern e-commerce ecosystem for long-term digital growth.</p>
        </div>
    </div>
</section>

<section class="values">
    <h2 class="section-title">Core Values</h2>
    <div class="values-grid">
        <div class="value-card"><h3>Trust</h3><p>Reliable products and clear communication.</p></div>
        <div class="value-card"><h3>Quality</h3><p>Better standards in every listing and delivery.</p></div>
        <div class="value-card"><h3>Community</h3><p>Strong support for local sellers and buyers.</p></div>
        <div class="value-card"><h3>Innovation</h3><p>Continuous product and service improvements.</p></div>
    </div>
</section>
{% endblock %}
