{% set home = get_section(path="home/_index.md") %}


{% if current_path == '/' %}

<div class="flex flex-wrap text-center lg:text-left lg:py-20 -mx-2">
  <div class="px-3 lg:mt-5 order-1 lg:order-none mx-auto text-center">
    <h2 class="
      lg:text-6xl
      font-normal
      uppercase
      mb-6
      mt-10
      leading-none
      font-heading
    ">
      {{ home.title }}
      <span class="block leading-none font-bold">{{ home.extra.subtitle }}</span>
    </h2>

    <h3 class="text-4xl leading-none font-light">{{ home.extra.slogan }}</h3>
    <div class="mb-8 mx-auto lg:text-2xl text-xl max-w-3xl">{{ home.content | safe }}</div>
    {% if home.extra.button %}
    {% if home.extra.link is containing('http')%}
    <a target="_blank" class="
        text-black
      inline-block
      bg-white
      lg:text-lg
      learn-button
      hover:bg-gray-400
      px-12
      py-1
      mr-5
      mb-4
      border-2
      shadow
      border-black
      capitalize
    " href="{{ home.extra.link }}">{{ home.extra.button }}</a>
    {% else %}
    <a class="
        text-black
      inline-block
      bg-white
      lg:text-lg
      learn-button
      hover:bg-gray-400
      px-12
      py-1
      mr-5
      mb-4
      border-2
      shadow
      border-black
      capitalize
    " href="{{ get_url(path=home.extra.link)}}">{{ home.extra.button }}</a>
    {% endif %}
    {% endif %}
  </div>
  {% set url = get_url(path='/' ~ home.relative_path |
  replace(from='_index.md', to=home.extra.imgPath)) %}
  <img class="order-2 lg:order-none mx-auto w-full" src="{{ url }}" />
</div>

{% endif %}