Nav

O componente @nav renderiza uma barra de navegação responsiva com suporte a dropdown, mega menu e hamburger mobile.

Estrutura básica

```seed
@nav
  @logo
    @image src=/logo.png, alt=Logo
  @menu
    @item href=/
      @title Home
    @item href=/sobre
      @title Sobre
  @actions
    @button variant=secondary
      Docs
    @button variant=primary
      Login
```

Slots do @nav

Itens com dropdown

Adicione @subitem dentro de um @item para criar um dropdown:

```seed
@nav
  @menu
    @item href=/produto
      @title
        Produto
      @subitem href=/produto/features
        @title
          Features
        @caption
          Tudo que você precisa
      @subitem href=/produto/pricing
        @title
          Preços
        @caption
          Planos para todos
```

Slots do @item

Slots do @subitem

Mega menu

Use design=mega no @item para um dropdown com layout de grid (2 colunas):

```seed
@item href=/plataforma, design=mega
  @title
    Plataforma
  @subitem href=/editor
    @title Editor
    @caption Escreva em .seed
  @subitem href=/deploy
    @title Deploy
    @caption Publicação instantânea
  @subitem href=/api
    @title API
    @caption Integre com tudo
  @subitem href=/componentes
    @title Componentes
    @caption Sistema de design
```

Variantes do @nav

Comportamento mobile

Em telas menores que md (768px):

• O menu desktop fica oculto (hidden md:flex)
• Um botão hamburger (3 linhas) aparece no canto direito
• Ao clicar, o menu mobile desliza para baixo do nav
• Os @actions aparecem no rodapé do painel mobile
• Items com subitems abrem em accordion no mobile