{% extends 'base.html' %}
{% load static %}
{% block title %}{{ t.title_about }} — PickkerMarket{% endblock %}
{% block content %}
<section class="page-hero" style="background-image: url('{% static 'img/cabbage-web.jpg' %}');">
    <div class="page-hero-inner">
        <h1>{{ t.about_hero_title }}</h1>
        <p>{{ t.about_hero_subtitle }}</p>
    </div>
</section>

<section class="split-section">
    <div class="split-media">
        <img src="{% static 'img/onion-web.jpg' %}" alt="Fresh onions at the market">
    </div>
    <div class="split-text">
        <span class="section-kicker">{{ t.about_mission_kicker }}</span>
        <h2>{{ t.about_mission_title }}</h2>
        <p>{{ t.about_mission_body }}</p>
    </div>
</section>

<section class="content-section" style="background: #f7f8f5;">
    <div class="content-inner">
        <span class="section-kicker">{{ t.about_b2b_kicker }}</span>
        <h2 style="margin-bottom: 14px;">{{ t.about_b2b_title }}</h2>
        <p style="color: var(--muted); line-height: 1.7;">
            {{ t.about_b2b_body }}
        </p>
        <p style="color: var(--muted); margin-top: 20px; font-size: 0.92rem;">
            {{ t.about_company_prefix }}<strong>Clanert Sustain Company Limited</strong>.
        </p>
    </div>
</section>
{% endblock %}