<div class="product-card">
  <img src="{{ product.featured_image | img_url: '400x' }}" alt="{{ product.title }}">
  <h2>{{ product.title }}</h2>
  <p class="price">{{ product.price | money }}</p>
  
  {% if product.compare_at_price > product.price %}
    <span class="sale-badge">Sale</span>
    <s>{{ product.compare_at_price | money }}</s>
  {% endif %}
  
  {% if product.available %}
    <button>Add to Cart</button>
  {% else %}
    <button disabled>Sold Out</button>
  {% endif %}
</div>

theme/
├── assets/              # CSS, JS, images, fonts
├── blocks/              # Reusable block components
├── config/
│   ├── settings_data.json    # Current theme settings
│   └── settings_schema.json  # Settings definitions
├── layout/
│   └── theme.aqua     # Main layout wrapper
├── locales/
│   └── en.default.json  # Translations
├── sections/            # Page sections
├── snippets/            # Reusable Aqua includes
└── templates/           # Page templates (JSON format)
    ├── index.json
    ├── product.json
    ├── collection.json
    └── ...

{%- assign name = "value" -%}
{{- product.title -}}

{% comment %}
  This won't appear in the output
{% endcomment %}

{# Shorthand single-line comment #}