/* ============================= */
/*        Botões Padrão          */
/* ============================= */
.button-primary {
    display: inline-block;
    padding: 3rem 5rem;
    border-radius: 1rem;
    margin-top: 5rem;
    background-color: var(--button-background-primary) !important;
    color: var(--button-color) !important;
    font-weight: bold;
    font-size: 5rem;
    text-transform: uppercase;
    text-decoration: none !important;
    box-shadow: 0 1rem 2rem rgba(0, 0, 0, 0.1);
    transition: background-color 0.3s ease, transform 0.2s ease;
}

.button-primary:hover {
    background-color: var(--button-background-hover);
    transform: translateY(-1rem);
}


/* ========================================= */
/* Cartões de Funcionalidade (Feature Cards) */
/* ========================================= */
.feature-cards { 
    display: flex; 
    flex-wrap: wrap; /* Permite que os cards se ajustem responsivamente */ 
    justify-content: center; /* Centraliza os cards */ 
    gap: 5em; /* Espaçamento entre os cards */ 
    margin-top: 5em;
 }

.feature-card { 
    flex: 1 1 calc(33.33% - 6rem); /* 3 cards por linha, considerando espaçamento */ 
    max-width: 80em; /* Define um tamanho máximo para os cards */ 
    background: var(--card-background-color); 
    padding: 5em; 
    border-radius: 1.5em; 
    box-shadow: 0 1em 2em rgba(0, 0, 0, 0.1); 
    display: flex; 
    flex-direction: column; 
    align-items: center; 
    text-align: center; 
}

.feature-card:hover {
    transform: translateY(-1em);
    box-shadow: 0 2em 3em rgba(0, 0, 0, 0.15);
    border-color: var(--button-background-hover);
}

.feature-card-no-hover { 
    flex: 1 1 calc(33.33% - 6rem); /* 3 cards por linha, considerando espaçamento */ 
    max-width: 80em; /* Define um tamanho máximo para os cards */ 
    background: var(--card-background-color); 
    padding: 5em; 
    border-radius: 1.5em; 
    box-shadow: 0 1em 2em rgba(0, 0, 0, 0.1); 
    display: flex; 
    flex-direction: column; 
    align-items: center; 
    text-align: center; 
}

.feature-icon { 
    width: 10em; 
    height: 10em; 
    margin-bottom: 3em; 
}

.feature-title { 
    font-size: 5em; 
    font-weight: bold; 
    margin-bottom: 2em; 
}

.feature-description { 
    font-size: 4em; 
    color: var(--text-color-secondary)
}

.feature-card:hover {
    transform: translateY(-1em);
    box-shadow: 0 2em 3em rgba(0, 0, 0, 0.15);
    border-color: var(--button-background-hover);
}