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

{% block content %}
<div class="container my-5">
  <div class="text-center mb-5">
    <h3 class="fw-bold">Climate Change, Environment and Conservation</h3>
    <p class="lead text-muted">Building resilience and promoting sustainable practices in the Rabai community.</p>
  </div>

  <!-- 1. Environmental Education and Awareness -->
  <div class="row align-items-center mb-5">
    <div class="col-md-6">
      <img src="{% static 'images/climate_awareness.jpeg' %}" class="img-fluid rounded shadow" alt="Climate Education">
    </div>
    <div class="col-md-6">
      <h5 class="fw-semibold text-success">Environmental Education and Awareness</h5>
      <p style="font-size: 1.15rem; font-weight:600; line-height: 1.6;">
        RefCom conducts educational campaigns to raise awareness about the effects of climate change and the importance of environmental conservation. Community engagement through workshops, seminars, and meetings promotes biodiversity and sustainable living.
      </p>
    </div>
  </div>

  <!-- 2. Reforestation and Habitat Restoration -->
  <div class="row align-items-center mb-5 flex-md-row-reverse">
    <div class="col-md-6">
      <img src="{% static 'images/community_planting.jpg' %}" class="img-fluid rounded shadow" alt="Tree Planting">
    </div>
    <div class="col-md-6">
      <h5 class="fw-semibold text-primary">Reforestation and Habitat Restoration</h5>
      <p style="font-size: 1.15rem; font-weight:600; line-height: 1.6;">
        Community-led tree planting initiatives restore degraded landscapes and support biodiversity. These activities not only regenerate the environment but also sequester carbon and combat climate change.
      </p>
    </div>
  </div>

  <!-- 3. Sustainable Agriculture Practices -->
  <div class="row align-items-center mb-5">
    <div class="col-md-6">
      <img src="{% static 'images/sustainable_agriculture.jpg' %}" class="img-fluid rounded shadow" alt="Sustainable Farming">
    </div>
    <div class="col-md-6">
      <h5 class="fw-semibold text-warning">Sustainable Agriculture Practices</h5>
      <p style="font-size: 1.15rem; font-weight:600; line-height: 1.6;">
        Through training on agroecology and organic farming, RefCom equips farmers with techniques that preserve soil health, limit chemical use, and strengthen climate resilience.
      </p>
    </div>
  </div>

  <!-- 4. Climate Adaptation Strategies -->
  <div class="row align-items-center mb-5 flex-md-row-reverse">
    <div class="col-md-6">
      <img src="{% static 'images/climate_adaptation.jpeg' %}" class="img-fluid rounded shadow" alt="Climate Adaptation">
    </div>
    <div class="col-md-6">
      <h5 class="fw-semibold text-danger">Climate Adaptation Strategies</h5>
      <p style="font-size: 1.15rem; font-weight:600; line-height: 1.6;">
        By identifying climate-resilient crops and promoting water conservation, RefCom helps communities adapt to changing conditions while protecting their livelihoods.
      </p>
    </div>
  </div>

  <!-- 5. Partnerships and Advocacy -->
  <div class="row align-items-center mb-5">
    <div class="col-md-6">
      <img src="{% static 'images/policy_change.jpg' %}" class="img-fluid rounded shadow" alt="Partnerships for Sustainability">
    </div>
    <div class="col-md-6">
      <h5 class="fw-semibold text-info">Partnerships and Advocacy</h5>
      <p style="font-size: 1.15rem; font-weight:600; line-height: 1.6;">
        Collaborating with organizations at every level, RefCom advocates for effective climate policies and supports grassroots environmental action.
      </p>
    </div>
  </div>

  <!-- 6. Community Conservation Initiatives -->
  <div class="row align-items-center mb-5 flex-md-row-reverse">
    <div class="col-md-6">
      <img src="{% static 'images/community_conservation.jpeg' %}" class="img-fluid rounded shadow" alt="Community Conservation">
    </div>
    <div class="col-md-6">
      <h5 class="fw-semibold text-secondary">Community Conservation Initiatives</h5>
      <p style="font-size: 1.15rem; font-weight:600; line-height: 1.6;">
        RefCom empowers local groups to protect critical habitats and practice sustainable fishing and conservation, reinforcing biodiversity and local livelihoods.
      </p>
    </div>
  </div>

  <!-- Closing Summary -->
  <div class="bg-light p-4 rounded shadow-sm">
    <h5 class="fw-semibold text-dark">Fostering a Sustainable Future</h5>
    <p style="font-size: 1.25rem; font-weight:600; line-height: 1.6;">
      RefCom’s Climate Change, Environment, and Conservation Program is shaping a greener, more resilient Rabai community by addressing urgent environmental challenges today for a sustainable tomorrow.
    </p>
    <p class="text-muted fst-italic">
      “Protecting our environment is not just a necessity—it’s our responsibility.”
    </p>
    <a href="#" class="btn btn-outline-primary mt-3">Join the Movement</a>
  </div>
</div>
{% endblock %}