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

<section class="mb-5 pos_section_three">
  <div class="is-container" data-aos="fade-in" data-aos-duration="700">
    <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_three.i_image | remove: '.png' | remove: '.webp' | remove: '.jpg' | replace: '-',' ' | replace: '_',' ' }}">
      </div>

      <div class="col-sm-7 col-md-7">
        <h2>{{ page.pos_section_three.t_title }}</h2>
        
        {% for desc in page.pos_section_three.t_description %}
          <p class="desc-text">{{ desc }}</p>
        {% endfor %}
        
        {% for feature in page.pos_section_three.features %}
          <div class="feature-box">
            {% assign feature_icon = '' %}
            {% capture feature_icon %}{% picture open_graph pages/{{ feature.icon}} %}{% endcapture %}
            <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: '_',' ' }}">
            <p class="feature-text">{{ feature.text }}</p>
          </div>
        {% endfor %}
      </div>
      
    </div>
  </div>
</section>