{% assign feature_image = '' %}
{% capture feature_image %}{% picture open_graph pages/{{ page.pos_section_four.i_image}} %}{% endcapture %}

<section class="mb-5 pos_section_four">
  <div class="is-container" data-aos="fade-in" data-aos-duration="700">
    <h2 class="text-center">{{ page.pos_section_four.t_title }}</h2>
    <p class="text-center section_subtitle">{{ page.pos_section_four.t_subtitle }}</p>
    <div class="row align-items-center">
      <div class="col-sm-5 col-md-5">
        <img class="terminal" data-sal="slide-up" data-sal-duration="500" data-sal-ease="ease-in-out" src="{{ feature_image }}" alt="{{ page.pos_section_four.i_image | remove: '.png' | remove: '.webp' | remove: '.jpg' | replace: '-',' ' | replace: '_',' ' }}">
      </div>

      <div class="col-sm-7 col-md-7">
        {% for desc in page.pos_section_four.t_description %}
          <p class="desc-text {% if forloop.index == 2 %} desc-text2{% endif %}">{{ desc }}</p>
        {% endfor %}
        <div class="row">
          {% for feature in page.pos_section_four.features %}
          <div class="{{feature.p_class}}">
          <div class="feature-box">
            {% assign feature_icon = '' %}
            {% capture feature_icon %}{% picture open_graph pages/{{ feature.icon}} %}{% endcapture %}
            <div class="feature-box-item">
              <h3 class="feature-text-heading">{{ feature.t_heading }}</h3>
              <img data-sal="slide-up" data-sal-duration="500" data-sal-ease="ease-in-out" src="{{ feature_icon }}" alt="{{ feature.icon | remove: '.png' | remove: '.webp' | remove: '.jpg' | replace: '-',' ' | replace: '_',' ' }}">
            </div>
            <p class="feature-text">{{ feature.t_subheading }}</p>
          </div>
          </div>
          {% endfor %}
          {% if page.pos_section_four.t_button %}
            <div class="col-12 mt-2">
              <a href="{{ site.url }}/{{ page.pos_section_four.p_link}}">{{ page.pos_section_four.t_button}} 
              </a>
            </div>
          {% endif %}
        </div>
        
      </div>
      
    </div>
  </div>
</section>