H1. Main Page Title (Tag: <h1> or .h1)

H2. Section Header (Tag: <h2> or .h2)

H3. Subsection Header (Tag: <h3> or .h3)

H4. Small Grouping (Tag: <h4> or .h4)

H5. Micro Header (Tag: <h5> or .h5)

Class: .ella-p-lead — This is a larger, high-contrast paragraph style used for introductions. It captures attention and sets the stage for the rest of the content.

Class: .ella-p-base — This is the workhorse of your UI. It should be highly legible, using a comfortable line-height (usually 1.5 to 1.6). It is the default style for long-form reading and general descriptions.

Class: .ella-p-small — Used for secondary information, captions, or legal disclaimers. It is smaller than the base text but should still maintain enough contrast to meet WCAG accessibility standards.

Primary CTA Button (.ella-btn-primary)

Secondary Outline CTA (.ella-btn-outline)

Ghost CTA Button (.ella-btn-ghost)

Utility CTA / Small Clear Button (.ella-btn-utility)

Text CTA (.ella-btn-text)

Category Style 1: Horizontal Slider

Category Style 1: Vertical List

Products Style 1