/* Tipografia geral */
body {
  font-family: 'Roboto', sans-serif !important;
  line-height: 1.6;
}

/* Botões principais */
.botao.principal, .botao.principal:hover {
  background-color: #ff713f !important;
  color: white !important;
  border-radius: 8px;
  padding: 10px 20px;
  font-weight: bold;
  transition: background 0.3s;
}

.botao.principal:hover {
  background-color: #e86030 !important;
}

/* Header */
.header-topo {
  background: #0099a7 !important;
  color: white !important;
  padding: 15px;
}

.header-topo a {
  color: white !important;
  font-weight: 500;
}

.logo img {
  max-width: 160px;
}

/* Menu */
.menu-principal ul li a {
  color: white !important;
  padding: 10px 20px;
  transition: background 0.3s;
}

.menu-principal ul li a:hover {
  background: #ff713f !important;
}

/* Mensagem topo */
.top-bar {
  background: #ff713f;
  color: white;
  text-align: center;
  font-size: 0.9rem;
  padding: 8px 0;
}

/* Vitrine de produtos */
.produto .info-produto {
  background: white !important;
  border-radius: 12px;
  box-shadow: 0 0 10px rgba(0,0,0,0.05);
  padding: 15px;
  transition: transform 0.3s;
}

.produto:hover .info-produto {
  transform: translateY(-5px);
}

/* Preço */
.preco-produto {
  color: #134f5c !important;
  font-weight: bold;
}

/* Títulos */
h1, h2, h3 {
  color: #0099a7;
  font-weight: 700;
}

/* Rodapé */
#rodape {
  background: #222 !important;
  color: white !important;
  padding: 30px 10px;
}

#rodape a {
  color: #ff713f !important;
}

#rodape .titulo {
  color: #ff713f;
  font-weight: bold;
}

/* Responsividade */
@media (max-width: 768px) {
  .menu-principal ul {
    flex-direction: column;
    gap: 10px;
  }

  .produto {
    width: 48% !important;
    margin: 1%;
  }

  .header-topo {
    flex-direction: column;
    text-align: center;
  }
}