{%- comment -%} Large statement. Each word lights up as you scroll to it. {%- endcomment -%}
<section class="jp-wrap jp-tg">
  {%- if section.settings.kicker != blank -%}<div class="jp-kick jp-tg__k">{{ section.settings.kicker }}</div>{%- endif -%}
  <p class="jp-tg__t">
    {%- assign words = section.settings.text | strip_newlines | split: ' ' -%}
    {%- for w in words -%}<span class="jp-tg__w">{{ w }}</span> {% endfor -%}
  </p>
  {%- if section.settings.sub != blank -%}<p class="jp-tg__s">{{ section.settings.sub }}</p>{%- endif -%}
</section>
{% schema %}
{
  "name": "Big statement",
  "settings": [
    { "type": "text", "id": "kicker", "label": "Small label", "default": "Why Just Protein" },
    { "type": "textarea", "id": "text", "label": "Statement", "default": "Eating less should never mean eating less protein. Every serving counted, every label shown, delivered across Canada." },
    { "type": "text", "id": "sub", "label": "Line under it" }
  ],
  "presets": [{ "name": "Big statement" }]
}
{% endschema %}