:root {
        --verde-50: #f0fdf4;
        --verde-100: #dcfce7;
        --verde-200: #bbf7d0;
        --verde-300: #86efac;
        --verde-400: #4ade80;
        --verde-500: #22c55e;
        --verde-600: #16a34a;
        --verde-700: #15803d;
        --verde-800: #166534;
        --verde-900: #14532d;
    }

    html { scroll-behavior: smooth; }
    
    body { 
        font-family: 'Inter', sans-serif; 
        color: #4a5568; 
        background-color: rgba(248, 249, 250) !important; 
        
        /* Reduz o site globalmente para 90% da escala */
        zoom: 90%; /* Chrome, Edge, Opera e Safari */
        -moz-transform: scale(0.9); /* Suporte para Firefox */
        -moz-transform-origin: top center; /* Garante que o Firefox alinhe pelo topo */

        /* Evita que o usuário consiga selecionar textos */
        -webkit-user-select: none;  /* Safari */
        -moz-user-select: none;     /* Firefox */
        -ms-user-select: none;      /* IE/Edge */
        user-select: none;          /* Padrão */
    }

    /* Garante que as imagens não sejam arrastadas */
    img {
        -webkit-user-drag: none;
        user-drag: none;
    }
    
    /* Custom Spacing & Typography Helpers to match Tailwind */
    .py-24 { padding-top: 6rem !important; padding-bottom: 6rem !important; }
    .fw-extrabold { font-weight: 800 !important; }
    .letter-spacing-wide { letter-spacing: 0.05em; }
    
    /* Custom Green Classes */
    .bg-verde-100 { background-color: var(--verde-100) !important; }
    .bg-verde-500 { background-color: var(--verde-500) !important; }
    .bg-verde-600 { background-color: var(--verde-600) !important; }
    .bg-verde-900 { background-color: var(--verde-900) !important; }
    .text-verde-100 { color: var(--verde-100) !important; }
    .text-verde-300 { color: var(--verde-300) !important; }
    .text-verde-400 { color: var(--verde-400) !important; }
    .text-verde-600 { color: var(--verde-600) !important; }
    .text-verde-700 { color: var(--verde-700) !important; }
    .border-verde-500 { border-color: var(--verde-500) !important; }

 /* Component Styles - Hero Section */
    .hero-bg {
        background: linear-gradient(135deg, rgba(20,83,45,0.95) 0%, rgba(22,101,52,0.9) 50%, rgba(21,128,61,0.85) 100%);
    }

    /* Ajustes específicos para o Título no Mobile */
    @media (max-width: 575.98px) {
        .hero-bg h1 {
            font-size: calc(1.6rem + 4vw) !important;
        }
    }

    /* Regras Responsivas para o Hero (Margin e Padding) */
    
    /* MOBILE: margin-top -7rem e padding vertical 3rem */
    @media (max-width: 767.98px) {
        .hero-bg {
            margin-top: -7rem !important;
            padding-top: 3rem !important;
            padding-bottom: 3rem !important;
        }
    }

    /* DESKTOP: margin-top -5rem */
    @media (min-width: 768px) {
        .hero-bg {
            margin-top: -5rem !important;
        }
    }

      .card-hover {
        transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    }
    .card-hover:hover {
        transform: translateY(-8px);
        box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25) !important;
    }
    .fade-in {
        opacity: 0;
        transform: translateY(30px);
        transition: opacity 0.8s ease-out, transform 0.8s ease-out;
    }
    .fade-in.visible {
        opacity: 1;
        transform: translateY(0);
    }
    
   /* Configuração Base do Navbar */
#navbar { 
    transition: all 0.4s ease; 
    z-index: 1060;
}

/* DESKTOP: Barra arredondada e flutuante */
@media (min-width: 768px) {
    #navbar { 
        top: 15px; 
    }
    .nav-wrapper {
        background: rgba(255, 255, 255, 0.95) !important;
        backdrop-filter: blur(10px);
        border-radius: 0.75rem;
        padding: 10px 25px !important;
        box-shadow: 0 4px 15px rgba(0,0,0,0.08);
    }
    .logo-container { width: 100px; }
}

/* MOBILE: Logo não fica fixa */
@media (max-width: 767.98px) {
    #navbar {
        position: relative !important; /* Logo sobe com o scroll */
        padding-top: 20px !important;
    }
    .nav-wrapper {
        background: transparent !important;
        box-shadow: none !important;
        justify-content: center !important; /* Logo centralizada */
    }
    .logo-container { width: 120px; }
}

/* Efeito de Scroll (Apenas Desktop) */
.nav-scrolled .nav-wrapper {
    background: rgba(248, 249, 250, 0.98) !important;
    box-shadow: 0 8px 20px rgba(0,0,0,0.1) !important;
}
.nav-scrolled .nav-link { color: #14532d !important; }

/* Mobile */
/* Ajuste a cor padrão dos ícones e textos do menu mobile */
.mobile-bottom-nav .nav-link, 
.mobile-bottom-nav .mobile-nav-item {
    color: #64748b !important; /* Cor cinza para itens inativos */
}

/* Ajuste a cor do item ativo (o que está selecionado) */
.mobile-bottom-nav .mobile-nav-item.active {
    color: #15803d !important; /* Mude aqui para o seu VERDE preferido */
}

/* Se estiver usando ícones (ex: FontAwesome ou Bootstrap Icons), force a cor também */
.mobile-bottom-nav .nav-link i,
.mobile-bottom-nav .mobile-nav-item i {
    color: #15803d !important; /* Força os ícones a ficarem verdes */
}


/* ==========================================
   GERENCIAMENTO DE ESPAÇAMENTO RESPONSIVO (BODY)
   ========================================== */
body {
    padding-bottom: 68px; /* Evita que a barra inferior cubra o fim do conteúdo */
}

@media (min-width: 768px) {
    body {
        padding-bottom: 0px;
        padding-top: 80px; /* Recuo superior para o cabeçalho fixo no desktop */
    }
}


/* ==========================================
   REGRAS EXCLUSIVAS PARA DISPOSITIVOS MÓVEIS
   ========================================== */
@media (max-w: 767.98px) {
    /* Oculta o botão azul flutuante de redes sociais / compartilhamento */
    .btn-flutuante-social, 
    .fa-share-alt,
    [style*="background-color: rgb(43, 108, 226)"], 
    .bg-primary.rounded-circle { 
        display: none !important; 
    }
    
    /* Move o botão voltar ao topo para cima da barra de navegação inferior */
    #backToTopBtn {
        bottom: 80px !important;
    }
    /* Classe para efeito de hover */
    /* Efeito Verde 900 no Hover */
    .hover-verde-900:hover {
        background-color: var(--verde-900) !important;
        color: #760c0c !important; /* Garante que o ícone continue branco */
        transition: background-color 0.3s ease !important;
        cursor: pointer;
    }
    
}

/* Evita que o conteúdo da página fique escondido atrás da barra inferior no mobile */
body {
    padding-bottom: 64px;
}
@media (min-width: 768px) {
    body {
        padding-bottom: 0px;
    }
}
    
    /* Decorative Elements */
    .pulse-ring {
        animation: pulse-ring 2s cubic-bezier(0.215, 0.61, 0.355, 1) infinite;
    }
    @keyframes pulse-ring {
        0% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.7); }
        70% { transform: scale(1); box-shadow: 0 0 0 20px rgba(34, 197, 94, 0); }
        100% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(34, 197, 94, 0); }
    }
    .gradient-text {
        background: linear-gradient(135deg, #16a34a 0%, #15803d 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
    }
    .stat-counter {
        font-variant-numeric: tabular-nums;
    }

    /* Utility Micro-adjustments */
    .bg-white-10 { background-color: rgba(255, 255, 255, 0.1) !important; }
    .bg-white-20 { background-color: rgba(255, 255, 255, 0.2) !important; }
    .border-white-20 { border-color: rgba(255, 255, 255, 0.2) !important; }
    .border-white-30 { border-color: rgba(255, 255, 255, 0.3) !important; }
    
    /* Custom inputs to replicate Tailwind focus states */
    .custom-input:focus, .custom-select:focus {
        border-color: var(--verde-500) !important;
        box-shadow: 0 0 0 0.25rem rgba(34, 197, 94, 0.2) !important;
        outline: none;
    }
    .custom-input, .custom-select {
        padding: 0.75rem 1rem;
        border-radius: 0.75rem;
        border: 1px solid #e2e8f0;
        background-color: #fff;
    }
    
    /* Tamanho padronizado dos botões principais */
    .floating-btn-size {
        width: 56px;
        height: 56px;
        transition: transform 0.3s ease, background-color 0.3s ease;
    }
    .floating-btn-size:hover {
        transform: scale(1.1);
    }
    
    /* Tamanho padronizado dos botões secundários (Redes Sociais) */
    .sub-btn-size {
        width: 46px;
        height: 46px;
        transition: transform 0.3s ease, opacity 0.3s ease;
    }
    .sub-btn-size:hover {
        transform: scale(1.1);
    }

    /* Cores customizadas baseadas na imagem image_4a0ec6.png */
    .bg-top { background-color: #4B5563; }
    .bg-top:hover { background-color: #374151; }
    
    /* ADICIONADO: Estilos específicos do Acordeon Premium */
    .custom-accordion .accordion-button:not(.collapsed) {
        color: var(--verde-300) !important;
        background-color: transparent !important;
    }

    .custom-accordion .accordion-button::after {
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffffff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e") !important;
        transition: transform 0.3s ease;
    }

    .custom-accordion .accordion-button:not(.collapsed)::after {
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%2386efac'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e") !important;
    }

    .custom-accordion .accordion-item {
        transition: background-color 0.3s ease, border-color 0.3s ease;
    }
    
    .custom-accordion .accordion-item:hover {
        background-color: rgba(255, 255, 255, 0.15) !important;
        border-color: rgba(255, 255, 255, 0.3) !important;
    }
    
    .bg-share { background-color: #2563EB; }
    .bg-share:hover { background-color: #1D4ED8; }
    
    .bg-fb { background-color: #3B82F6; }
    .bg-ig { background-color: #EC4899; }
    .bg-in { background-color: #1D4ED8; }
    
    .bg-wa { background-color: #22C55E; }
    .bg-wa:hover { background-color: #16A34A; }

    /* Controle de visibilidade e animação do menu horizontal */
    .social-menu-wrapper {
        opacity: 0;
        visibility: hidden;
        transform: translateY(-50%) translateX(15px);
        transition: opacity 0.3s ease, visibility 0.3s ease, transform 0.3s ease;
    }
    .social-menu-wrapper.show {
        opacity: 1;
        visibility: visible;
        transform: translateY(-50%) translateX(0);
    }

.modal-backdrop {
    background-color: rgba(255, 255, 255, 0.82) !important;
}
.modal-backdrop.show {
    opacity: 1 !important;
}
/* Botão estilo contorno customizado */
.btn-verde-outline {
    border: 2px solid #14532d !important; /* Sua cor verde */
    color: #14532d !important;
    background: transparent !important;
    transition: all 0.3s ease;
}

.btn-verde-outline:hover {
    background: #14532d !important;
    color: white !important;
}