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

{% block title %}Agribusiness Project by Refcom{% endblock %}

{% block content %}
<div class="container mt-5">
  <div class="text-center mb-5">
    <h1 class="display-4 text-success">Agribusiness: Empowering Communities Through Innovation</h1>
    <p class="lead">Combining agriculture and technology for food security and economic transformation.</p>
  </div>

  <div class="row mb-4">
    <div class="col-md-6">
      <img src="{% static 'images/agribusiness_1.jpg' %}" alt="Smart aquaculture system" class="img-fluid rounded shadow">
    </div>
    <div class="col-md-6 d-flex align-items-center">
      <p style="font-size: 1.25rem; font-weight:600; line-height: 1.6;">
        Refcom’s Agribusiness project focuses on sustainable farming, modern aquaculture, and digital transformation in agriculture.
        We equip communities with tools and knowledge to increase food production, improve livelihoods, and adapt to climate change.
      </p>
    </div>
  </div>

  <div class="row mb-4 bg-light p-4 rounded shadow-sm">
    <div class="col-md-6 d-flex align-items-center">
      <ul style="font-size: 1.1rem;">
        <li>Deployment of smart fish farming systems (IoT-based monitoring)</li>
        <li>Training programs for youth and women in agritech</li>
        <li>Greenhouse and vertical farming pilots</li>
        <li>Partnerships with local cooperatives and agribusiness investors</li>
      </ul>
    </div>
    <div class="col-md-6">
      <img src="{% static 'images/agribusiness_2.jpeg' %}" alt="Training farmers on agritech" class="img-fluid rounded shadow">
    </div>
  </div>

  <div class="text-center mt-5">
    <h2>Get Involved</h2>
    <p style="font-size: 1.25rem; font-weight:600; line-height: 1.6;">
      Whether you're a farmer, investor, student, or researcher, we welcome you to be part of our Agribusiness revolution.
    </p>
    <a href="{% url 'careers' %}" class="btn btn-success btn-lg">Join the Mission</a>
  </div>

  <div class="row mt-5">
    <div class="col-md-4 mb-3">
      <img src="{% static 'images/agribusiness_3.jpeg' %}" class="img-fluid rounded" alt="Greenhouse farming">
    </div>
    <div class="col-md-4 mb-3">
      <img src="{% static 'images/agribusiness_4.jpeg' %}" class="img-fluid rounded" alt="Aquaculture pond management">
    </div>
    <div class="col-md-4 mb-3">
      <img src="{% static 'images/agribusiness_5.jpeg' %}" class="img-fluid rounded" alt="Youth training in agriculture">
    </div>
  </div>
</div>
{% endblock %}