* {
    margin: 0; /* Remove a margem padrão de todos os elementos */
    padding: 0; /* Remove o preenchimento interno padrão */
    box-sizing: border-box; /* Inclui padding e borda dentro da largura e altura dos elementos */
    font-family: 'Roboto', sans-serif; /* Define a fonte padrão como Roboto para todos os elementos */
}

body {
    background-color: #f2f2f2; /* Cor de fundo cinza claro para o corpo da página */
    color: #333; /* Cor do texto (cinza escuro) */
}

header {
    background-color: #007bff; /* Cor de fundo azul para o cabeçalho */
    color: #fff; /* Cor do texto no cabeçalho (branco) */
    text-align: center; /* Centraliza o texto horizontalmente */
    padding: 20px 0; /* Espaçamento interno no topo e embaixo de 20px */
    margin: 0 auto; /* Centraliza horizontalmente o cabeçalho (não tem muito efeito no header) */
}

h2 {
    text-align: center; /* Centraliza o título h2 */
    margin-bottom: 16px; /* Espaçamento inferior de 16px */
}

.container {
    max-width: 600px; /* Largura máxima de 600px para o container */
    margin: 0 auto; /* Centraliza o container horizontalmente */
    padding: 20px; /* Espaçamento interno de 20px */
    margin-top: 30px; /* Espaçamento superior de 30px */
    background-color: #fff; /* Fundo branco para o container */
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); /* Sombra suave ao redor do container */
}

.form-campo {
    margin-bottom: 20px; /* Espaçamento inferior de 20px entre os campos do formulário */
}

.form-campo label {
    display: block; /* Faz o label ocupar uma linha inteira */
    font-weight: bold; /* Deixa o texto do label em negrito */
    margin-bottom: 5px; /* Espaço inferior de 5px abaixo do label */
}

.form-campo input {
    width: 100%; /* Faz o input ocupar toda a largura disponível */
    padding: 10px; /* Espaçamento interno de 10px */
    border: 1px solid #ccc; /* Borda cinza clara */
    border-radius: 5px; /* Cantos arredondados de 5px */
}

.container button {
    background-color: #007bff; /* Cor de fundo azul no botão */
    color: white; /* Cor do texto do botão */
    padding: 10px 20px; /* Espaçamento interno: 10px acima/abaixo, 20px nas laterais */
    border: none; /* Remove a borda padrão do botão */
    cursor: pointer; /* Cursor tipo "mãozinha" ao passar sobre o botão */
    font-weight: bold; /* Texto em negrito */
    display: inline-block; /* Faz o botão ser um bloco em linha */
}

.error {
    color: red; /* Define a cor vermelha para mensagens de erro */
}
