/* Estilos Gerais */
.content-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px;
}

/* Layout em Duas Colunas */
.contact-wrapper {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    flex-wrap: wrap;
}

/* Estilos para a Coluna da Esquerda */
.contact-info {
    flex: 1;
    min-width: 300px;
    background-color: #f9f9f9; /* Fundo branco */
    padding: 30px;
    border-radius: 10px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
    position: relative;
}

.contact-info h2 {
	font-size: 2em;
	margin-bottom: 20px;
	color: #241c4b;
	border-bottom: 2px solid #241c4b; /* Linha abaixo do título */
	padding-bottom: 10px;
}

.contact-info p {
	font-size: 1.1em;
	margin-bottom: 20px;
	color: #333;
	line-height: 1.6;
}

.contact-info p strong {
	color: #241c4b;
}

.contact-info p i {
	font-size: 1.2em;
	margin-right: 10px;
	color: #241c4b;
}

.contact-quote {
    font-style: italic;
    color: #241c4b;
    font-size: 1.2em;
    text-align: center;
}

/* Estilos para a Coluna da Direita */
.contact-form {
    flex: 1.5;
    min-width: 300px;
    background: #f8f9fa; /* Fundo cinza claro */
    padding: 30px;
    border-radius: 10px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
}

.contact-form h2 {
	font-size: 2em;
	margin-bottom: 20px;
	color: #241c4b;
	border-bottom: 2px solid #241c4b; /* Linha abaixo do título */
	padding-bottom: 10px;
}

.contact-form label {
	display: block;
	font-size: 1.1em;
	margin-bottom: 8px;
	color: #333;
}

.contact-form input,
.contact-form textarea {
	width: 100%;
	padding: 15px;
	margin-bottom: 20px;
	border: 1px solid #ddd;
	border-radius: 5px;
	font-size: 1em;
	box-sizing: border-box;
	background-color: #ffffff; /* Fundo branco para os campos */
}

.contact-form textarea {
	resize: vertical;
}

.contact-form .btn {
	display: inline-block;
	width: 100%;
	padding: 15px;
	background-color: #241c4b;
	color: #fff;
	font-size: 1.2em;
	border: none;
	border-radius: 5px;
	cursor: pointer;
	transition: background-color 0.3s ease;
}

.contact-form .btn:hover {
	background-color: #0056b3;
}

/* Responsividade */
@media (max-width: 768px) {
    .contact-wrapper {
        flex-direction: column;
    }
}


.contact {
    background: url('caminho/para/imagem.jpg') no-repeat center center;
    background-size: cover;
    padding: 50px 0;
}

.contact-wrapper {
    background: rgba(255, 255, 255, 0.9); /* Fundo branco semi-transparente */
    padding: 40px;
    border-radius: 10px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
}
/* Estilos Gerais */
.content-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px;
}

/* Layout em Duas Colunas */
.contact-wrapper {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    flex-wrap: wrap;
}

/* Estilos para a Coluna da Esquerda */
.contact-info {
    flex: 1;
    min-width: 300px;
    background-color: #f9f9f9; /* Fundo branco */
    padding: 30px;
    border-radius: 10px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
    position: relative;
}

.contact-info h2 {
    font-size: 2em;
    margin-bottom: 20px;
    color: #241c4b;
    border-bottom: 2px solid #241c4b; /* Linha abaixo do título */
    padding-bottom: 10px;
}

.contact-info p {
    font-size: 1.1em;
    margin-bottom: 20px;
    color: #333;
    line-height: 1.6;
}

.contact-info p strong {
    color: #241c4b;
}

.contact-info p i {
    font-size: 1.2em;
    margin-right: 10px;
    color: #241c4b;
}

.contact-quote {
    font-style: italic;
    color: #241c4b;
    font-size: 1.2em;
    text-align: center;
}

/* Estilos para a Coluna da Direita */
.contact-form {
    flex: 1.5;
    min-width: 300px;
    background: #f8f9fa; /* Fundo cinza claro */
    padding: 30px;
    border-radius: 10px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
}

.contact-form h2 {
    font-size: 2em;
    margin-bottom: 20px;
    color: #241c4b;
    border-bottom: 2px solid #241c4b; /* Linha abaixo do título */
    padding-bottom: 10px;
}

.contact-form label {
    display: block;
    font-size: 1.1em;
    margin-bottom: 8px;
    color: #333;
}

.contact-form input,
.contact-form textarea {
    width: 100%;
    padding: 15px;
    margin-bottom: 20px;
    border: 1px solid #ddd;
    border-radius: 5px;
    font-size: 1em;
    box-sizing: border-box;
    background-color: #ffffff; /* Fundo branco para os campos */
}

.contact-form textarea {
    resize: vertical;
}

.contact-form button {
    display: inline-block;
    width: 100%;
    padding: 15px;
    background-color: #241c4b;
    color: #fff;
    font-size: 1.2em;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    transition: background-color 0.3s ease;
}

.contact-form button:hover {
    background-color: #0056b3;
}

/* Responsividade */
@media (max-width: 768px) {
    .contact-wrapper {
        flex-direction: column;
    }
}

.contact {
    background-size: cover;
    padding: 50px 0;
}

.contact-wrapper {
    background: url('https://lirp.cdn-website.com/9928f089/dms3rep/multi/opt/AdobeStock_277845433-2880w.jpeg') no-repeat center center;
    padding: 40px;
    border-radius: 10px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
}

/* Estilos para o Combobox */
.contact-form select {
    width: 100%;
    padding: 15px;
    margin-bottom: 20px;
    border: 1px solid #ddd;
    border-radius: 5px;
    font-size: 1em;
    box-sizing: border-box;
    background-color: #ffffff; /* Fundo branco para o combobox */
    color: #333; /* Cor do texto */
    transition: border-color 0.3s ease;
    text-transform: uppercase; /* Deixa os itens em maiúsculas */
}

.contact-form select:focus {
	border-color: #241c4b;
	outline: none;
}

/* Responsividade para telas muito pequenas (mobile) */
@media (max-width: 480px) {
	.contact{
		padding:0;
	}
	.contact-wrapper{
		background:none;
		padding:0px;
	}
	.contact-form, .contact-info {
		min-width:0;
		padding:20px;
	}
	.contact-form h2, .contact-info h2 {
		font-size: 1.5em;
	}
	.contact-info p{
		font-size:0.8em;
		line-height:1.4;
	}
}