/*
 * paginas.css: páginas de apoio (contato, sobre, garantia, política de privacidade).
 */

.topo-pagina__lead {
  max-width: 40rem;
  margin: var(--sp-3) 0 0;
  color: #EDEDED;
}

/* ---------- Contato ---------- */

.contato__cards {
  display: grid;
  gap: var(--sp-4);
}

@media (min-width: 48rem) {
  .contato__cards {
    grid-template-columns: repeat(3, 1fr);
  }
}

.contato__grade {
  display: grid;
  gap: var(--sp-6);
}

@media (min-width: 64rem) {
  .contato__grade {
    grid-template-columns: 0.8fr 1.2fr;
    align-items: start;
    gap: var(--sp-7);
  }
}

/* Painel escuro com as informações (ref. 2) */
.contato__painel {
  padding: var(--sp-6);
  border-radius: var(--raio);
  background: var(--escuro);
  color: var(--escuro-texto);
}

.contato__painel h2 {
  color: #FFFFFF;
}

.contato__lista {
  display: grid;
  gap: var(--sp-3);
  margin: 0 0 var(--sp-5);
  padding: 0;
  list-style: none;
  font-size: var(--fs-sm);
}

.contato__lista li {
  display: flex;
  align-items: flex-start;
  gap: var(--sp-3);
}

.contato__lista svg {
  width: 1.125rem;
  height: 1.125rem;
  flex: none;
  margin-top: 0.15em;
  color: var(--amarelo);
}

.contato__lista small {
  color: var(--escuro-suave);
}

.contato__redes a {
  color: var(--escuro-texto);
}

/* Botões de WhatsApp por assunto, no lugar do formulário */
.contato__botoes {
  display: grid;
  gap: var(--sp-3);
  margin-top: var(--sp-5);
}

@media (min-width: 40rem) {
  .contato__botoes {
    grid-template-columns: 1fr 1fr;
  }
}

.contato__assunto {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  padding: var(--sp-4);
  border: 1px solid var(--borda);
  border-left: 4px solid var(--whats);
  border-radius: var(--raio-sm);
  background: var(--bg);
  color: var(--grafite);
  font-family: var(--font-titulo);
  font-weight: 700;
  text-decoration: none;
  transition: box-shadow var(--transicao), transform var(--transicao);
}

.contato__assunto:hover {
  box-shadow: var(--sombra);
  transform: translateY(-2px);
}

.contato__assunto svg {
  width: 1.5rem;
  height: 1.5rem;
  flex: none;
  color: var(--ocre);
}

.contato__assunto svg:last-child {
  width: 1.125rem;
  height: 1.125rem;
  margin-left: auto;
  color: var(--texto-suave);
}

.contato__assunto--geral svg:first-child {
  color: #128C4B;
}

/* Mapa na largura toda */
.contato__mapa {
  min-height: 24rem;
  border-radius: 0;
}

/* ---------- Textos legais (garantia, privacidade) ---------- */

.texto-legal {
  max-width: 48rem;
}

.texto-legal h2 {
  margin-top: var(--sp-7);
  font-size: var(--fs-h3);
}

.texto-legal ul {
  padding-left: 1.25rem;
}

.texto-legal li + li {
  margin-top: var(--sp-2);
}

.texto-legal a {
  color: var(--grafite);
  font-weight: 600;
}

.texto-legal .botoes {
  margin-top: var(--sp-6);
}