/* pagina.css: o arranjo da pagina provisoria de zerovinteeum.com (tarefa 25 do task.md).
   Carregue depois do tokens.css e do base.css, que trazem as variaveis e os componentes.
   Cor, letra e medida so pelas variaveis do tokens.css: o ferramentas/site/montar_site.py --conferir recusa cor e
   medida escritas por extenso aqui (sobram 0 e 100%). */

/* ---------------------------------------------------------------- topo */

/* embaixo, pouco espaco: a secao seguinte ja traz o dela */
.topo {
  padding-block: var(--espaco-48) var(--espaco-16);
  text-align: center;
}

.topo-conteudo {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--espaco-16);
}

.topo-conteudo > * {
  margin: 0;
}

.topo-marca img {
  display: block;
}

.topo-texto {
  margin-block-end: var(--espaco-8);
}

/* linhas equilibradas nos textos centrados, sem palavra sozinha na ultima linha */
.topo-texto,
.encomenda .texto-corrido {
  text-wrap: balance;
}

/* ---------------------------------------------------------------- sabores */

.lista-sabores {
  margin: 0 0 var(--espaco-32);
  padding: 0;
  list-style: none;
}

/* ---------------------------------------------------------------- faixa e encomenda */

.faixa-texto {
  margin: 0;
  padding-block: var(--espaco-24);
  text-align: center;
}

.encomenda {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--espaco-16);
  text-align: center;
}

.encomenda > * {
  margin: 0;
}

/* ---------------------------------------------------------------- rodape */

.rodape {
  padding-block: var(--espaco-32);
  text-align: center;
}

.rodape p {
  margin: 0 0 var(--espaco-8);
}