/* Novo arquivo de estilos com propriedades !important para garantir a prioridade */

:root {
    --color-primary: #1E1E1E !important;
    --color-secondary: #928f8c !important;
    --color-secondary-light: #93908D !important;
}

body {
    font-family: 'Gotham', sans-serif !important;
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'Californian FB', 'Libre Baskerville', serif !important;
    color: var(--color-primary) !important;
}

.btn-primary {
    background: var(--color-primary) !important;
    border-color: var(--color-primary) !important;
}

.btn-secondary {
    background: var(--color-secondary) !important;
    border-color: var(--color-secondary) !important;
}

.card-icon {
    background: rgba(30, 30, 30, 0.1) !important;
}

.pilar-card:hover .card-icon {
    background: var(--color-primary) !important;
}

.feature-icon {
    background: rgba(30, 30, 30, 0.1) !important;
}

.experience-badge {
    background: var(--color-primary) !important;
}

.area-icon {
    background: var(--color-primary) !important;
}

.area-card h3::after {
    background: var(--color-primary) !important;
}

.timeline-number {
    background: var(--color-primary) !important;
}

.main-navigation a::after {
    background: var(--color-primary) !important;
}

.hero-gradient {
    background: linear-gradient(to right, rgb(255 255 255 / 80%), rgba(146, 143, 140, 0.4)) !important
}

.overlay {
    background: rgba(30, 30, 30, 0.85) !important;
}

.site-footer {
    background: var(--color-primary) !important;
}

.membro-back {
    background: var(--color-primary) !important;
}

.contato-icon {
    background: rgba(30, 30, 30, 0.1) !important;
    color: var(--color-primary) !important;
}

.overline {
    color: var(--color-secondary) !important;
}

.hero-content h1, .visao-content h2, .membro-bio h3 {
    color: #ffffff !important;
}

/* Estilos específicos para botões com efeito gradiente */
.btn-gradient {
    background: linear-gradient(to right, var(--color-primary), var(--color-secondary)) !important;
    border: none !important;
}

/* Estilos para cards com borda gradiente */
.gradient-border {
    position: relative !important;
    border: none !important;
}

.gradient-border::before {
    content: '' !important;
    position: absolute !important;
    top: -2px !important;
    left: -2px !important;
    right: -2px !important;
    bottom: -2px !important;
    background: linear-gradient(to right, var(--color-primary), var(--color-secondary)) !important;
    z-index: -1 !important;
    border-radius: calc(var(--border-radius-md) + 2px) !important;
}

/* Ajustes complementares para adaptar ao novo design */
.section-header h2::after {
    content: '' !important;
    display: block !important;
    width: 60px !important;
    height: 3px !important;
    background: linear-gradient(to right, var(--color-primary), var(--color-secondary)) !important;
    margin: 25px auto 0 !important;
}

.section-header:not(.center) h2::after {
    margin-left: 0 !important;
}

/* Ajustes para legibilidade em fundos escuros */
.visao-section p, .metricas-section .metrica-label {
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5) !important;
}

/* Ajustes para mobile */
@media (max-width: 768px) {
    .section-header h2::after {
        margin: 15px auto 0 !important;
        width: 50px !important;
    }
    
    .sobre-text {
        text-align: center !important;
    }
    
    .feature-item {
        justify-content: center !important;
    }
}