body {
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
    color: #333;
}

/* Cores e Botões */
.bg-primary {
    background-color: #007bff !important; /* Azul padrão do Bootstrap */
}
.btn-primary {
    background-color: #007bff;
    border-color: #007bff;
}
.btn-primary:hover {
    background-color: #0056b3;
    border-color: #0056b3;
}

/* Navbar */
.navbar-brand img {
    max-height: 100px; /* Ajusta o tamanho do logo na navbar */
}
.navbar-nav .nav-link {
    color: rgba(255, 255, 255, 0.75);
}
.navbar-nav .nav-link:hover,
.navbar-nav .nav-link.active {
    color: #fff;
}

/* Seção Hero */
#hero {
    min-height: 70vh; /* Altura da tela para a seção de introdução */
    background-size: cover;
    background-position: center;
    color: #333; /* Ajuste a cor do texto para ser visível no seu background */
}
#hero h1 {
    font-weight: bold;
}

/* Seções Gerais */
section {
    padding: 60px 0; /* Padding padrão para todas as seções */
}
section:nth-child(even) { /* Para alternar cores de fundo entre as seções */
    background-color: #f8f9fa; /* Um cinza claro */
}

/* Cards de Serviço */
.card {
    border: none;
    border-radius: 8px;
}
.card-body i {
    color: #007bff; /* Cor dos ícones dos serviços */
}

/* Logos de Autorizadas */
#authorized img {
    opacity: 0.8;
    filter: grayscale(80%); /* Deixa os logos mais discretos */
    transition: all 0.3s ease;
}
#authorized img:hover {
    opacity: 1;
    filter: grayscale(0%); /* Remove o efeito de cinza no hover */
}

/* Rodapé */
footer {
    font-size: 0.9rem;
}

/* Cards de Serviço */
.card {
    border: none;
    border-radius: 8px;
}
.card-body i {
    color: #007bff; /* Cor dos ícones dos serviços */
}

/* NOVO: Estilo para as imagens dentro dos cards de serviço */
.service-image {
    max-width: 100%; /* Garante que a imagem não transborde o card */
    height: 150px; /* Altura fixa para as imagens */
    object-fit: contain; /* Redimensiona a imagem para caber sem cortar, mantendo a proporção */
    margin-top: 15px; /* Espaço entre o ícone e a imagem */
    margin-bottom: 15px; /* Espaço entre a imagem e o título */
    /* Você pode ajustar essas margens e altura conforme a sua imagem e layout desejado */
}

/* Centralizar elementos no card-body (opcional) */
.card-body {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

#servimg {
  background-image: url('/img/Equipamentos/servidor.jpg'); /* ou ajuste conforme estrutura */
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  min-height: 100vh;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}

#servimg .bg-overlay {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background: rgba(0, 0, 0, 0.6);
  z-index: 1;
}

#servimg .container {
  position: relative;
  z-index: 2;
}