<section class="pb-100 laptop:pb-250 bg-cream text-gray-900 relative" data-header-theme="dark">
  <div
    class="relative pb-20 pt-40 md:pt-60 md:pb-35 laptop:pt-100 container md:grid md:grid-cols-12  md:gap-x-18"
  >
    <span class="absolute w-full h-1 bg-current opacity-20 top-0 left-0"></span>
    <div class="hidden md:block md:col-span-4 h3 m-0" data-animation="split">{{ section.settings.xuhao }}</div>
    <h3 class="md:col-span-8 m-0" data-animation="split">{{ section.settings.heading }}</h3>
    <span
      class="absolute w-full h-1 bg-current opacity-20 bottom-0 left-0"
    ></span>
  </div>
  <div class="mb-30 md:mb-60">
    {% for block in section.blocks %}
    <div
      class="container relative pt-40 pb-60 md:pt-12 md:pb-40 md:grid md:grid-cols-12 md:gap-x-18"
      data-animation="moveUp"
    >
      <h4 class="hidden md:flex md:col-span-4 lg:col-span-4">{{ block.settings.xuhao }}</h4>
      <h4 class="lg:pr-60 md:col-span-4 lg:col-span-5">{{ block.settings.title }}</h4>
      <div class="pr-30 md:pr-10 md:col-span-4 lg:col-span-3">
        <div class="wysiwyg reset-last">
          {{ block.settings.text }}
        </div>
      </div>
      <span class="absolute w-full h-1 bg-current opacity-20 bottom-0 left-0"></span>
    </div>
    {% endfor %}
  </div>
  
  <div class="font-medium container md:flex md:justify-center" data-animation="moveUp">
    <div>
      <a
        class="inline-flex items-center link link--underline"
        href="/pages/contact"
        target="_blank"
        ><span>Contact Us</span
        ><span
          class="ml-5 w-[0.9em] h-[0.9em] relative top-[0.1em] inline-block align-baseline"
        >
           <span class="svg-wrapper" style="width: 15px;">
              {{- 'icon-plus.svg' | inline_asset_content -}}
           </span>
        </span
      ></a>
    </div>
  </div>
  
</section>

{% schema %}
{
  "name": "LP 14",
  "blocks": [
    {
      "type": "item",
      "name": "item",
      "settings": [     
        {
          "type": "text",
          "id": "xuhao",
          "label": "xuhao"
        },         
        {
          "type": "textarea",
          "id": "title",
          "label": "title"
        },
        {
          "type": "richtext",
          "id": "text",
          "label": "text"
        }          
      ]
    }    
  ],
  "settings": [      
    {
      "type": "text",
      "id": "xuhao",
      "label": "xuhao"
    },   
    {
      "type": "textarea",
      "id": "heading",
      "label": "heading"
    }    
  ],
  "presets": [{"name": "LP 14"}]
}
{% endschema %}
