/* Reset e ajustes globais */
body {
  font-family: 'Roboto', sans-serif;
  line-height: 1.6;
  color: #333;
  background-color: #fff;
  padding-top: 80px; /* Espaço para o header fixo */
}

h1, h2, h3, h4, h5 {
  font-weight: 700;
}

section {
  padding: 60px 0;
}

section[id] {
  scroll-margin-top: 100px; /* Ajusta conforme altura do seu header */
}

/* Header fixo */
header {
  background-color: #212529;
  z-index: 1000;
}

.nav-link {
  font-weight: 500;
  transition: color 0.3s;
}

.nav-link:hover {
  color: #0d6efd;
}

.nav-link.active {
  color: #0d6efd !important;
  font-weight: 600;
}

/* Hero */
#hero {
  background-color: #000;
  background-size: cover;
  background-position: center;
  color: white;
  text-shadow: 0 1px 3px rgba(0,0,0,0.7);
}

/* Botões */
.btn-primary {
  background-color: #22587A;
  border-color: #22587A;
  transition: background-color 0.3s;
}

.btn-primary:hover {
  background-color: #0b5ed7;
  border-color: #0a58ca;
}

/* Títulos */
section h2 {
  font-size: 2rem;
  color: #0291E3;
}

/* Produtos - Carrossel Bootstrap com zoom */
#produtos img {
  height: 300px;
  width: 100%;
  object-fit: cover;
  border-radius: 6px;
  transition: transform 0.4s ease;
}

#produtos img:hover {
  transform: scale(1.05);
}

/* Rodapé */
footer {
  background-color: #212529;
  color: #fff;
}

/* Formulário */
input, textarea {
  border-radius: 4px;
  border: 1px solid #ccc;
  padding: 10px;
}

/* Ícones */
i {
  color: #0d6efd;
}

/* Parallax leve em desktop */
/* #sobre e #orcamento foram substituídos pelos containers maiores no HTML, mas mantemos o estilo para o id sobre, que ainda usa a imagem de fundo */
#sobre,
#produtos-orcamento-contato-container {
  background-attachment: fixed !important; /* Força o parallax no container que agrupa Produtos/Orçamento/Contato */
}

/* --- Ajuste de Peso de Fonte para o Texto de Benefícios na Seção Sobre --- */
#sobre .row p {
  font-weight: 300; /* Define o peso da fonte para 'Light' */
}

/* Opcional: Se quiser um peso de fonte que combine mais com a leitura principal, use 500 (Medium) */
/*
#sobre .row p {
  font-weight: 500;
}
*/


/* Desativa parallax em dispositivos móveis */
@media (max-width: 991px) {
  #sobre,
  #produtos-orcamento-contato-container {
    background-attachment: scroll !important;
  }
}

/* Estilo de ícones do carrossel */
.carousel-control-prev-icon,
.carousel-control-next-icon {
  background-color: rgba(0, 0, 0, 0.5);
  border-radius: 50%;
}

/* Botão flutuante do WhatsApp */
.whatsapp-float {
  position: fixed;
  bottom: 20px;
  right: 20px;
  z-index: 999;
  cursor: pointer;
  transition: transform 0.3s ease;
}

.whatsapp-float img {
  width: 60px;
  height: 60px;
}

.whatsapp-float:hover {
  transform: scale(1.1);
}

/* --- ESTILOS PARA O VISUAL CLEAN E DESTAQUE DE SERVIÇOS (NOVOS) --- */

/* Seção de serviços em fundo mais claro (bg-light do Bootstrap) para contraste e visual clean */
#servicos {
    background-color: #f8f9fa !important;
    color: #333; 
}

/* Estilo para o Card de Serviço */
.service-card {
    /* Fundo branco e borda discreta, mas com sombra para destaque */
    background-color: #fff;
    border-radius: 8px;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

/* Efeito Hover chamativo para os Cards */
.service-card:hover {
    transform: translateY(-5px); /* Efeito de elevação sutil */
    box-shadow: 0 1rem 3rem rgba(13, 110, 253, 0.2) !important; /* Sombra mais forte, focada na cor primária */
    cursor: default;
}

.service-card .card-title {
    color: #212529; /* Título em cor escura para contraste */
}

/* Garante que os títulos h2 na seção de serviços tenham a cor primária */
#servicos h2 {
    color: #0291E3; 
}

/* Garante que os ícones fiquem na cor primária */
.service-card i {
    color: #0291E3; 
}