Hero

O @hero renderiza uma seção hero responsiva com título, descrição, botões de ação e imagem opcional.

Uso básico

```seed
@hero
  @title
    Crie sites incríveis
  @description
    A forma moderna de construir páginas web bonitas e responsivas.
  @cta
    @button variant=primary
      Começar agora
    @button variant=secondary
      Saiba mais
  @image src=https://placehold.co/600x400, alt=Hero
```

Slots

Design: padrão vs. center

design=default (padrão)

Layout duas colunas: imagem à direita, texto à esquerda (em desktop). No mobile empilha verticalmente.

```seed
@hero
  @title
    Duas colunas
  @image src=/img.jpg, alt=Img
```

design=center

Conteúdo centralizado, sem coluna de imagem. Ideal para hero de chamada simples.

```seed
@hero design=center
  @title
    Centralizado
  @description
    Texto centrado na página.
  @cta
    @button variant=primary
      Ação
```

Variantes CSS

Combinações

```seed
@hero variant=dark, design=center
  @title
    Dark + Centrado
  @description
    Combinando variante CSS e design template.
  @cta
    @button variant=primary
      Começar
```