# Garantia (`garantia`)

<!-- GERADO por scripts/gerar-catalogo.mjs a partir do componente.json. Para mudar, edite o componente.json e rode o script. -->

Bloco com selo desenhado em CSS (escudo + número de dias), título e condição da garantia. Sem imagem de selo pronta.

- **Categoria:** Venda e conversão
- **Equivalente no Elementor:** Caixa de Ícone ou Imagem com selo de garantia (montagem manual)
- **Arquivos:** `garantia.html`, `garantia.css`
- **Precisa de JavaScript:** não

## Quando usar
- Logo depois do preço, para reduzir o risco da compra
- Perto do último botão da página

## Quando não usar
- Sem garantia real e definida na oferta do projeto

## Variações
- **Padrão (selo ao lado no computador, acima no celular):** classe ds-garantia

## Conteúdo esperado
- Número de dias
- Título
- Condição em linguagem simples
- Nota legal opcional

## Acessibilidade
- <aside> rotulado pelo título: é informação complementar à oferta
- Selo é decorativo (aria-hidden); o prazo está no título

## Como carregar

```html
<link rel="stylesheet" href="tokens.css"><!-- do projeto, gerado por gerar-tokens-css.mjs -->
<link rel="stylesheet" href="base/base.css">
<link rel="stylesheet" href="componentes/garantia/garantia.css">
```

Tokens do contrato usados: `--ds-borda-largura-forte`, `--ds-cartao-padding`, `--ds-cor-destaque`, `--ds-cor-sobre-destaque`, `--ds-cor-superficie`, `--ds-cor-texto-suave`, `--ds-espaco-2`, `--ds-espaco-6`, `--ds-espaco-8`, `--ds-fonte-impacto`, `--ds-raio-cartao`, `--ds-sombra-md`, `--ds-tamanho-h2`, `--ds-tamanho-h3`, `--ds-tamanho-pequeno`.

## Notas

Garantia de 7 dias é o mínimo do Código de Defesa do Consumidor para compra on-line; o prazo real vem da oferta do projeto.
