/* Cores da Cooperativa Terra Livre */
:root {
    --cor-principal: #27AE60;
    --cor-principal-hover: #1E8449;
    --cor-secundaria: #2ECC71;
    --cor-destaque: #F39C12;
    --cor-texto-claro: #ECF0F1;
    --cor-fundo-escuro: #2C3E50;
}

/* Substituir cor laranja por verde */
.ns-section-subtitle,
.ns-banner-btn,
.ns-about-play-btn-2,
.ns-service-btn,
.ns-project-content-btn a,
.ns-footer-social a:hover {
    background-color: var(--cor-principal) !important;
    border-color: var(--cor-principal) !important;
}

/* Hover effects */
.ns-banner-btn:hover,
.ns-service-btn:hover,
.ns-project-content-btn a:hover {
    background-color: var(--cor-principal-hover) !important;
    border-color: var(--cor-principal-hover) !important;
}

/* Elementos de destaque */
.ns-feature-item-icon,
.ns-service-content-icon-2 {
    background-color: var(--cor-principal) !important;
}

/* Bordas e linhas */
.ns-feature-item::before,
.ns-service-item-2::before,
.ns-project-item::before {
    background-color: var(--cor-principal) !important;
}

/* Links e textos de destaque */
a:hover,
.ns-section-subtitle {
    color: var(--cor-principal) !important;
}

/* Botões e CTAs */
.ns-banner-btn-2,
.ns-footer-subscribe-btn {
    background-color: var(--cor-principal) !important;
}

.ns-banner-btn-2:hover,
.ns-footer-subscribe-btn:hover {
    background-color: var(--cor-principal-hover) !important;
}

/* Paginação */
.swiper-pagination-bullet-active {
    background-color: var(--cor-principal) !important;
}

/* Ícones e elementos decorativos */
.ns-about-content-list-2 li i {
    color: var(--cor-principal) !important;
}

/* Shapes e formas */
.ns-service-shape-1,
.ns-service-shape-2,
.ns-project-shape-1,
.ns-project-shape-2 {
    background-color: var(--cor-principal) !important;
}

/* Centralizar o menu de navegação */
.ns-header-menu-2 .ns-header-main-menu {
    text-align: center;
}

.ns-header-main-menu ul {
    display: flex;
    justify-content: center;
    align-items: center;
}

.ns-header-main-menu ul li {
    margin: 0 20px;
}

/* Ajustar o layout do header para centralização */
.ns-header-navbar .col-xl-10 {
    display: flex;
    justify-content: center;
}

/* Estilo dos links do menu */
.ns-header-main-menu ul li a {
    font-weight: 500;
    transition: color 0.3s ease;
}

.ns-header-main-menu ul li a:hover {
    color: var(--cor-principal) !important;
}

/* Banner simplificado e centralizado */
.ns-banner-wrap-3 .row {
    justify-content: center;
}

.ns-banner-content {
    text-align: center;
    max-width: 800px;
    margin: 0 auto;
}

.ns-banner-content-title {
    font-size: 48px;
    line-height: 1.2;
    margin-bottom: 20px;
}

.ns-banner-content p {
    font-size: 18px;
    margin-bottom: 30px;
}

.ns-banner-action-btn {
    display: flex;
    justify-content: center;
}

/* Ajustar altura do banner */
.ns-banner-area-3 {
    min-height: 600px;
    display: flex;
    align-items: center;
}

.ns-banner-single-3 {
    padding: 100px 0;
}

/* Corrigir exibição do menu */
.ns-header-navbar .col-xl-10 {
    display: block !important;
}

.ns-header-menu-2 {
    display: flex;
    justify-content: center;
    width: 100%;
}

.ns-header-main-menu {
    width: 100%;
}

.ns-header-main-menu ul {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
}

.ns-header-main-menu ul li {
    display: inline-block !important;
    margin: 0 15px !important;
}

/* Corrigir cor do botão "Conheça Mais" */
.ns-header-btn,
.ns-theme-btn,
.ns-banner-btn {
    background-color: var(--cor-principal) !important;
    border-color: var(--cor-principal) !important;
    color: #fff !important;
}

.ns-header-btn:hover,
.ns-theme-btn:hover,
.ns-banner-btn:hover {
    background-color: var(--cor-principal-hover) !important;
    border-color: var(--cor-principal-hover) !important;
}

/* Ajustar layout do header */
.ns-header-area-3 {
    background-color: rgba(44, 62, 80, 0.95) !important;
}

.ns-header-logo-2 {
    z-index: 10;
}

/* Banner com 2 imagens - Responsivo */
@media (max-width: 768px) {
    .banner-images-grid {
        grid-template-columns: 1fr !important;
    }
    
    .ns-banner-content-title {
        font-size: 36px !important;
    }
    
    .ns-banner-content p {
        font-size: 16px !important;
    }
    
    .ns-banner-action-btn {
        flex-direction: column !important;
        align-items: center !important;
    }
    
    .ns-banner-action-btn a {
        width: 100%;
        max-width: 280px;
        text-align: center;
    }
}

/* Hover do botão branco "Nossos Projetos" */
.ns-banner-action-btn a[href="realizacoes.html"]:hover {
    background-color: #27AE60 !important;
    color: #fff !important;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(39, 174, 96, 0.3);
    transition: all 0.3s ease;
}

/* Hover do botão verde "Conheça Mais" */
.ns-banner-action-btn a[href="#about"]:hover {
    background-color: #1E8449 !important;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(30, 132, 73, 0.3);
    transition: all 0.3s ease;
}
