# Never Use `<section>` as Root Element

Shopify automatically wraps every section's output in a `<section>` tag with `id` and `class` attributes. Adding your own creates invalid nested `<section>` elements and breaks theme editor selection.

```liquid
{% comment %} BAD: creates <section><section>...</section></section> {% endcomment %}
<section class="hero">
  <h2>{{ section.settings.title }}</h2>
  <p>{{ section.settings.text }}</p>
</section>

{% comment %} GOOD: use a div or semantic element — Shopify adds the outer <section> {% endcomment %}
<div class="hero">
  <h2>{{ section.settings.title }}</h2>
  <p>{{ section.settings.text }}</p>
</div>
```

Shopify's auto-generated `<section>` already provides the landmark role. Use `class` attribute on `{% schema %}` to style it.