/* Estilos Globais */
body {
    font-family: 'Arial', sans-serif;
    background-color: #f9f9f9;
    color: #333;
    margin: 0;
    padding: 0;
}

/* Cabeçalho */
header .navbar-brand {
    font-size: 1.5rem;
    font-weight: bold;
    color: #f5c518; /* Dourado */
    display: flex;
    align-items: center;
    justify-content: flex-start; /* Alinha o logo à esquerda */
    margin: 0; /* Remove margens automáticas */
}

/* Estilo da Navbar */
.navbar-container {
    background-color: #212529; /* Fundo escuro */
    border-bottom: 2px solid #f5c518; /* Linha dourada */
    box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.2); /* Sombra */
    position: fixed; /* Barra fixa no topo */
    top: 0;
    width: 100%; /* Barra ocupa toda a largura */
    z-index: 1000;
    padding: 5px 15px; /* Reduzido o espaçamento vertical */
    display: flex;
    justify-content: space-between; /* Mantém espaçamento entre logo e menu */
    align-items: center;
}

/* Ajuste do Logo */
.logo {
    height: auto; /* Ajusta automaticamente */
    max-height: 90px; /* Limite máximo de altura */
    max-width: 90%; /* Permite usar até 90% da largura do container */
    width: auto;
    display: block;
}

/* Links do Menu */
.nav-link {
    color: #ffffff !important; /* Cor do texto branca */
    font-weight: 500;
    font-size: 1rem; /* Tamanho da fonte */
    transition: color 0.3s ease;
    margin-left: 10px;
    margin-right: 10px;
    text-align: center;
}

.nav-link:hover {
    color: #f5c518 !important; /* Dourado no hover */
    text-decoration: none;
}

.nav-link.active {
    color: #f5c518 !important; /* Cor ativa */
    border-bottom: 2px solid #f5c518; /* Linha dourada abaixo */
}

/* Ajuste para barra fixa */
body {
    padding-top: 120px; /* Espaço ajustado para evitar sobreposição */
}

/* Banner Principal */
section.bg-primary {
    background: linear-gradient(45deg, #007bff, #00d4ff);
    color: #fff;
    padding: 60px 0;
    text-align: center;
}
section.bg-primary h1 {
    font-size: 2.8rem; /* Fonte maior */
    font-weight: bold;
    margin-bottom: 20px;
}
section.bg-primary .btn-light {
    background-color: #fff;
    color: #007bff;
    font-weight: bold;
    border: none;
    padding: 12px 30px; /* Botão maior */
    border-radius: 25px; /* Botão arredondado */
}
section.bg-primary .btn-light:hover {
    background-color: #f8f9fa;
    color: #0056b3;
}

/* Seção de Destaques */
section.py-5 h3 {
    font-size: 1.8rem; /* Fonte maior */
    color: #0056b3;
    margin-bottom: 10px;
    text-align: center;
}
section.py-5 p {
    font-size: 1rem;
    color: #666;
    text-align: center;
}
section.py-5 img {
    width: 100px; /* Ícones maiores */
    height: auto;
    margin-bottom: 15px;
    display: block;
    margin-left: auto;
    margin-right: auto; /* Centraliza os ícones */
}

/* Rodapé */
footer {
    font-size: 0.9rem;
    background-color: #212529; /* Cor ajustada para o rodapé */
    color: #bbb;
    padding: 20px 0;
    text-align: center;
}
footer p {
    margin: 0;
    padding: 5px;
}

/* Responsividade */
@media (max-width: 768px) {
    .navbar-container {
        padding: 5px 15px; /* Ajuste de padding no mobile */
    }
    .logo {
        max-height: 70px; /* Reduz tamanho do logo em telas menores */
        max-width: 85%; /* Ajusta a largura proporcionalmente */
    }
    .nav-link {
        font-size: 0.9rem; /* Reduz tamanho da fonte dos links */
        margin-left: 5px;
        margin-right: 5px;
    }
    section.bg-primary h1 {
        font-size: 2rem; /* Fonte menor no banner */
    }
    section.py-5 h3 {
        font-size: 1.5rem; /* Ajusta tamanho da fonte */
    }
    section.py-5 img {
        width: 80px; /* Ajusta ícones */
    }
}

@media (max-width: 576px) {
    .logo {
        max-height: 60px; /* Tamanho menor ainda para dispositivos muito pequenos */
        max-width: 80%;
    }
    .nav-link {
        font-size: 0.8rem;
    }
}