body {
    font-family: 'Exo 2', sans-serif;
    margin: 0;
}

.top-bar {
    background-color: #0E7CC1;
    padding: 10px 0;
}

.logo {
    padding-left: 40px;
}

.logo img {
    height: 100px;
    filter: brightness(0) invert(1);
}

/* Estilos para transformar o link em badge */
.nav-item .nav-link {
    background-color: white; /* Fundo branco para o badge */
    color: #0E7CC1 !important; /* Cor da fonte azul Mirasol */
    border-radius: 20px; /* Borda arredondada para parecer um badge */
    padding: 8px 15px; /* Preenchimento interno para o badge */
    margin: 0 5px; /* Espaçamento entre os badges */
    display: inline-flex; /* Permite ícone e texto na mesma linha, centralizado */
    align-items: center; /* Alinha verticalmente ícone e texto */
    text-decoration: none !important; /* Garante que não tenha sublinhado padrão */
    transition: all 0.3s ease; /* Transição suave para o hover */
    font-weight: 600; /* Mantém o peso da fonte */
    font-size: 1.1rem; /* Mantém o tamanho da fonte */
}

/* Estilo ao passar o mouse (hover) nos badges */
.nav-item .nav-link:hover {
    background-color: #f0f0f0; /* Um tom de cinza claro ao passar o mouse */
    text-decoration: none; /* Garante que não tenha sublinhado no hover */
    transform: translateY(-2px); /* Efeito sutil de levantar */
}


.hero {
    background-color: #f8f9fa;
    padding: 60px 0;
}

.hero h1 {
    font-weight: 700;
    color: #0E7CC1;
}

.hero p {
    font-size: 1.2rem;
    color: #0E7CC1;
}

.hero .btn-outline-primary {
    font-weight: 600;
    border-width: 2px;
}

.hero img {
    border-radius: 0 60px 60px 0;
}

/* Estilos extraídos do HTML original para classes */
.about-section-title {
    background-color: #0E7CC1;
}

.institutional-section {
    background-color: #0E7CC1;
    border-top-left-radius: 60px;
}

.institutional-icon {
    border: 2px solid white;
    padding: 20px;
    border-radius: 20px;
}

.about-image {
    border-radius: 0 60px 0 60px;
}

.contact-request-line {
    background-color: #0E7CC1;
    height: 50px;
    border-bottom-right-radius: 60px;
}

.brands-carousel-line {
    background-color: #0E7CC1;
    height: 50px;
}

.platform-nestle {
    background-color: #0071bc;
    /* Para telas maiores */
    clip-path: polygon(0 0, 100% 0, 85% 100%, 0% 100%);
}

.platform-bees {
    background-color: #fff000;
}

/* Estilo do footer */
.footer-mirasol {
    background-color: #0E7CC1;
}


/* Responsividade - Ajustes para telas menores */
@media (max-width: 767.98px) {
    .logo {
        padding-left: 0; /* Centraliza logo em telas menores */
    }
    .nav {
        justify-content: center !important; /* Centraliza navegação em telas menores */
    }
    .platform-nestle, .platform-bees {
        clip-path: none; /* Remove o recorte em telas menores para melhor visualização */
    }

    /* Ajustes específicos para os links do menu hambúrguer */
    .navbar-collapse .nav-item .nav-link {
        background-color: transparent; /* Remove o fundo branco para não parecer badge no menu aberto */
        color: white !important; /* Volta para a cor branca original no menu hambúrguer */
        border-radius: 0; /* Remove a borda arredondada */
        padding: 8px 0; /* Ajusta o padding para um link normal de menu */
        margin: 0; /* Remove a margem */
        justify-content: center; /* Centraliza itens no menu hambúrguer */
    }

    .navbar-collapse .nav-item .nav-link:hover {
        background-color: rgba(255, 255, 255, 0.1); /* Fundo sutil ao passar o mouse */
        transform: none; /* Remove o efeito de levantar */
    }
}