* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: Arial, sans-serif; /* Define a fonte padrão para todo o documento */
}

body {
    background-color: #f9f9f9; /* Define a cor de fundo do corpo da página */
    color: #333; /* Define a cor padrão do texto */
    line-height: 1.6; /* Define o espaçamento entre linhas do texto */
}

.header {
    text-align: center;
    padding: 20px;
    background-color: #006699; /* Cor de fundo do cabeçalho */
    color: white; /* Cor do texto no cabeçalho */
}

/* Contêiner flexível para alinhar logo e imagem */
.header-container {
    display: flex;
    justify-content: center; /* Alinha os itens no centro horizontalmente */
    align-items: center; /* Alinha os itens no centro verticalmente */
    gap: 30px; /* Espaçamento de 30px (~15mm) entre a logo e a imagem */
}

.logo {
    max-width: 200px; /* Define a largura máxima da logo */
    height: auto; /* Mantém a proporção da altura */
}

.anuncio-img {
    max-height: 200px; /* Limita a altura máxima da imagem */
    width: auto; /* Garante que a largura seja ajustada automaticamente */
    cursor: pointer; /* Cursor de mão ao passar sobre a imagem */
}

.form-section {
    margin: 20px; /* Espaçamento externo para separar a seção do formulário */
    padding: 20px; /* Espaçamento interno dentro da seção do formulário */
    background-color: #fff; /* Cor de fundo da seção do formulário */
    border-radius: 8px; /* Arredonda os cantos da seção */
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); /* Adiciona sombra à seção para destacar */
    text-align: center; /* Centraliza o texto dentro da seção (incluindo o título) */
}

.form-section h2 {
    color: #004080; /* Define a nova cor da frase "Preencha o formulário abaixo e enviaremos uma proposta" para um azul escuro */
    font-size: 24px; /* Aumenta o tamanho da fonte */
}

.form-container {
    display: flex;
    flex-direction: column; /* Organiza os elementos de forma vertical */
    gap: 15px; /* Espaçamento entre os elementos do formulário */
    max-width: 600px; /* Largura máxima do formulário */
    margin: 0 auto; /* Centraliza o formulário horizontalmente */
}

label {
    font-weight: bold; /* Deixa o texto dos rótulos em negrito */
}

input, textarea, select {
    padding: 10px; /* Espaçamento interno nos campos de formulário */
    border: 1px solid #ccc; /* Define a cor e espessura da borda dos campos */
    border-radius: 4px; /* Arredonda os cantos dos campos */
    font-size: 16px; /* Define o tamanho da fonte dos campos */
}

button {
    padding: 10px 20px; /* Define o espaçamento interno do botão */
    background-color: #006699; /* Cor de fundo do botão */
    color: white; /* Cor do texto no botão */
    border: none; /* Remove a borda padrão do botão */
    cursor: pointer; /* Define o cursor como "mão" quando passar sobre o botão */
    border-radius: 4px; /* Arredonda os cantos do botão */
}

button:hover {
    background-color: #005680; /* Muda a cor do botão quando o cursor está sobre ele */
}

.footer {
    text-align: center; /* Centraliza o conteúdo do rodapé */
    padding: 20px; /* Define o espaçamento interno do rodapé */
    background-color: #006699; /* Cor de fundo do rodapé */
    color: white; /* Cor do texto no rodapé */
    margin-top: 40px; /* Espaçamento acima do rodapé para separá-lo do conteúdo principal */
}

/* Estilos para dispositivos móveis */
@media (max-width: 768px) {
    .form-container {
        width: 100%; /* Define que o formulário ocupará 100% da largura da tela em dispositivos menores */
    }

    .header-container {
        flex-direction: column; /* Em dispositivos menores, empilha os elementos */
    }

    .header, .footer {
        padding: 10px; /* Reduz o espaçamento no cabeçalho e rodapé em telas pequenas */
    }
}