.titulo.fundo-principal {
  font-family: 'Raleway', sans-serif;
  font-weight: 400;
  fonte-size: 1.5rem;
  color: #0C103A !important;
}

@media (max-width: 768px) {
  .span3 {
    display: none !important;
  }
}

@media (max-width: 768px) {
  #menuinsta {
    display: none !important;
  }
}

.listagem-item {
  padding: 30px; /* espaço interno */
  border-radius: 16px; /* bordas arredondadas */
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); /* sombra preta com 30% de opacidade */
  background: #ffffff; /* garante fundo branco do card */
}

.nome-produto.cor-secundaria {
  font-size: 20px;            /* tamanho da fonte */
  color: #0C103A;             /* cor do texto */
  line-height: 1.4em;         /* altura da linha */
  font-family: 'Raleway', sans-serif; /* fonte */
  font-weight: 400;           /* peso da fonte */
  text-decoration: none;      /* remove sublinhado se tiver */
  display: block;             /* força a quebra de linha, se precisar */
}


/* Destacar apenas o preço à vista */
.preco-produto.destaque-avista .preco-promocional {
  font-size: 1.8rem;          /* tamanho maior */
  color: #0C103A;             /* cor destaque */
  font-family: 'Raleway', sans-serif;
  font-weight: 700;           /* negrito */
  line-height: 1.4em;
  display: block;             /* força a quebra de linha */
  margin-bottom: 8px;         /* espaço abaixo */
}


.botao.botao-comprar.principal {
  background-color: #28a745;   /* verde */
  color: #fff !important;      /* texto branco */
  padding: 20px;               /* espaço interno */
  font-weight: 700;            /* bold */
  border: none;                /* remove borda */
  border-radius: 500px;        /* bordas super arredondadas */
  display: block;              /* ocupa toda a largura do container */
  width: 100%;                 /* se adapta horizontalmente */
  text-align: center;          /* centraliza texto e ícone */
  text-decoration: none;       /* tira sublinhado */
  transition: all 0.3s ease;   /* efeito suave no hover */
  box-sizing: border-box;      /* garante que padding respeite largura */
}

.botao.botao-comprar.principal:hover {
  background-color: #218838;   /* verde mais escuro no hover */
}