/* Adicione isso ao seu arquivo styles.css */

/* Cores Personalizadas (Extraídas do código React) */
:root {
    --alma-green: #004225;
    --alma-light-green: #006B3C;
    --alma-gold: #d4af37;
}

.text-alma-green { color: var(--alma-green); }
.bg-alma-green { background-color: var(--alma-green); }
.border-alma-green { border-color: var(--alma-green); }

.text-alma-gold { color: var(--alma-gold); }
.bg-alma-gold { background-color: var(--alma-gold); }
.border-alma-gold { border-color: var(--alma-gold); }

.hover\:bg-alma-light-green:hover { background-color: var(--alma-light-green); }

/* Fontes (Placeholder caso não tenha os arquivos locais) */
.font-display, .font-cooperative, .font-empera {
    font-family: 'Montserrat', sans-serif; /* Fallback */
    font-weight: 800;
}

/* Animações Simples */
@keyframes float {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-20px); }
}
.animate-float { animation: float 6s ease-in-out infinite; }

@keyframes pulse-glow {
    0%, 100% { box-shadow: 0 0 10px rgba(212, 175, 55, 0.5); }
    50% { box-shadow: 0 0 25px rgba(212, 175, 55, 0.8); }
}
.pulse-glow { animation: pulse-glow 2s infinite; }

/* Utilitários Extras */
.scroll-hidden::-webkit-scrollbar { display: none; }
.scroll-hidden { -ms-overflow-style: none; scrollbar-width: none; }

/* 1. Definindo a fonte personalizada */
@font-face {
    font-family: 'Empera'; /* O nome que você vai usar para chamar a fonte */
    /* Ajuste o caminho abaixo dependendo de onde está seu arquivo CSS */
    src: url('fonts/empera-regular.otf') format('opentype'); 
    font-weight: normal;
    font-style: normal;
}

/* 2. Aplicando a fonte a todos os H2 */
h2 {
    font-family: 'Empera', sans-serif; /* 'sans-serif' é um fallback caso a fonte falhe */
}

/* 1. O @font-face fica IGUAL (sem !important aqui) */
@font-face {
    font-family: 'Empera';
    src: url('fonts/fonts/cooperative-dirty-bold.otf') format('opentype'); 
    font-weight: normal;
    font-style: normal;
}

/* 2. O !important entra AQUI */
h2, h4 {
    font-family: 'Empera', sans-serif !important; 
}


/* 1. Importando a Poppins do Google (coloque na 1ª linha do CSS) */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600&display=swap');

/* 2. Definindo o padrão geral do site */
body, html, button, input, textarea, a, li {
    font-family: 'Poppins', sans-serif;
}

.min-h-screen {
    min-height: 130vh!important;
}