{% extends "base.html" %}
{% load static %}
{% block title %}About {{ SITE_NAME }}{% endblock %}
{% block og_title %}About {{ SITE_NAME }}{% endblock %}
{% block twitter_title %}About {{ SITE_NAME }}{% endblock %}
{% block meta_description %}About {{ SITE_NAME }}. {{ SITE_TAGLINE }}. {{ CONTACT_SERVICE_AREA }}.{% endblock %}
{% block og_description %}About {{ SITE_NAME }}. {{ SITE_TAGLINE }}. {{ CONTACT_SERVICE_AREA }}.{% endblock %}
{% block twitter_description %}About {{ SITE_NAME }}. {{ SITE_TAGLINE }}. {{ CONTACT_SERVICE_AREA }}.{% endblock %}
{% block structured_data %}
<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "AboutPage",
  "name": "About {{ SITE_NAME|escapejs }}",
  "url": "{{ PUBLIC_SITE_URL }}{% url 'public:about' %}",
  "description": "{{ SITE_TAGLINE|escapejs }}",
  "mainEntity": {
    "@type": "Organization",
    "name": "{{ SITE_NAME|escapejs }}",
    "url": "{{ PUBLIC_SITE_URL }}/",
    "telephone": "{{ CONTACT_PHONE|escapejs }}",
    "email": "{{ CONTACT_EMAIL|escapejs }}"
  }
}
</script>
{% endblock %}
{% block content %}
  <section class="breadcrumbs-custom bg-image context-dark" style="background-image: url({% static 'images/breadcrumbs-image-1.jpg' %});">
    <div class="breadcrumbs-custom-inner">
      <div class="container breadcrumbs-custom-container">
        <div class="breadcrumbs-custom-main">
          <p class="breadcrumbs-custom-subtitle title-decorated">About</p>
          <h1 class="text-uppercase breadcrumbs-custom-title">{{ SITE_NAME }}</h1>
        </div>
        <ul class="breadcrumbs-custom-path">
          <li><a href="{% url 'public:home' %}">Home</a></li>
          <li class="active">About</li>
        </ul>
      </div>
    </div>
  </section>
  <section class="section section-lg">
    <div class="container">
      <div class="row row-50">
        <div class="col-lg-8">
          <h2>Who we are</h2>
          <p>{% if SITE_TAGLINE %}{{ SITE_TAGLINE }}. {% endif %}Replace this paragraph with the client’s story, team, and what customers should expect.</p>
          <p>{% if CONTACT_SERVICE_AREA %}{{ CONTACT_SERVICE_AREA }}. {% endif %}Every site seeded from this template gets a unique public app — swap photos, copy, and service pages per brand.</p>
          <a class="button button-primary button-winona" href="{% url 'public:contact' %}">Contact us</a>
        </div>
        <div class="col-lg-4">
          {% if CONTACT_PHONE %}<p><strong>Phone</strong><br><a href="tel:{{ CONTACT_PHONE_TEL }}">{{ CONTACT_PHONE }}</a></p>{% endif %}
          {% if CONTACT_EMAIL %}<p><strong>Email</strong><br><a href="mailto:{{ CONTACT_EMAIL }}">{{ CONTACT_EMAIL }}</a></p>{% endif %}
          {% if CONTACT_ADDRESS %}<p><strong>Address</strong><br>{{ CONTACT_ADDRESS }}</p>{% endif %}
        </div>
      </div>
    </div>
  </section>
{% endblock %}