* { margin: 0; padding: 0; box-sizing: border-box; }

body { font-family: 'Montserrat', sans-serif; background-color: #000; color: #fff; }

.split-container { display: flex; min-height: 100vh; flex-wrap: wrap; }

/* LADO BRANCO */
.lado-branco {
    flex: 1; background-color: #fff; color: #000;
    display: flex; justify-content: center; align-items: center; padding: 40px;
}

.coluna-conteudo { width: 100%; max-width: 500px; }

.moldura-preta-foto {
    border: 15px solid #000; margin-bottom: 30px; line-height: 0;
    box-shadow: 10px 10px 0px rgba(0,0,0,0.05);
}

.foto-principal { 
    width: 100%; 
    /* REMOVIDO O GRAYSCALE para o seu batom vermelho aparecer real! */
    filter: contrast(110%); 
}

/* DIAGRAMAÇÃO DAS SKILLS EM HORIZONTAL */
.skills-horizontal {
    display: flex; justify-content: space-between; gap: 10px; margin-top: 20px;
}

.skill-group { flex: 1; }

.skill-group h3 {
    color: #e60000; font-size: 0.65rem; letter-spacing: 2px;
    border-bottom: 1px solid #e60000; margin-bottom: 10px; padding-bottom: 5px;
}

.skill-group ul { list-style: none; }
.skill-group li { font-size: 0.7rem; margin-bottom: 4px; font-weight: 400; }

/* LADO PRETO */
.lado-preto {
    flex: 1; background-color: #000; padding: 60px;
    display: flex; flex-direction: column; justify-content: center;
}

.assinatura { font-family: 'Dancing Script', cursive; font-size: 4.5rem; margin-bottom: 5px; }

.cargo { font-size: 0.8rem; letter-spacing: 5px; color: #888; margin-bottom: 30px; }

/* Texto Base mais leve e sem negrito */
.bio { font-size: 0.85rem; line-height: 1.8; color: #ccc; margin-bottom: 40px; font-weight: 300; }

/* GRID DE 10 BOTÕES */
.grid-projetos {
    display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; margin-bottom: 50px;
}

.btn-pill {
    text-decoration: none; color: #fff; border: 1px solid #333;
    padding: 10px 15px; font-size: 0.7rem; border-radius: 30px;
    transition: 0.3s; text-align: center;
}

.btn-pill:hover { border-color: #e60000; color: #e60000; transform: scale(1.02); }

/* BOTÕES DE AÇÃO */
.contato-footer { display: flex; gap: 20px; }

.btn-red {
    flex: 1; text-decoration: none; background-color: #e60000; color: #fff;
    padding: 15px; font-weight: 700; font-size: 0.8rem; border-radius: 40px;
    text-align: center; transition: 0.3s;
}

.btn-red:hover { background-color: #ff0000; transform: translateY(-3px); }

@media (max-width: 900px) { .lado-branco, .lado-preto { min-width: 100%; } }