/* Definindo as cores da marca Awake como variáveis */
:root {
    --cor-principal-roxo: #8368F3;
    --cor-principal-azul-claro: #4694DC;
    --cor-principal-verde-agua: #1AC4BB;
    --cor-principal-laranja: #EDB78B;
    --cor-principal-coral: #F68177;

    --cor-complementar-cinza: #606060;
    --cor-complementar-azul-escuro: #36639E;
    --cor-complementar-amarelo: #EFCD74;
}

/* Aplicando as fontes e cores base */
body {
    font-family: 'Open Sans', sans-serif; /* Fonte do sistema para textos longos */
    color: var(--cor-complementar-cinza);
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'Montserrat', sans-serif; /* Usando Montserrat como alternativa para "Congenial" */
    color: var(--cor-complementar-azul-escuro);
}

/* Customizando a barra de navegação */
.navbar-dark.bg-dark {
    background-color: var(--cor-complementar-azul-escuro) !important;
}

/* Customizando o botão principal */
.btn-primary {
    background-color: var(--cor-principal-roxo);
    border-color: var(--cor-principal-roxo);
}

.btn-primary:hover {
    background-color: #6a50d1; /* Um tom um pouco mais escuro do roxo */
    border-color: #6a50d1;
}

/* Customizando os títulos das seções do questionário */
.card-title strong {
    color: var(--cor-complementar-azul-escuro);
}

.navbar img {
    height: 80px !important; /* ou o valor que você preferir */
    width: auto !important;
}