.contact-container {
margin: auto;
display: grid;
padding: 100px 40px 0;
gap: 5%;
max-width: 1200px;
position: relative;
z-index: 1;
justify-self: center;
text-align: center;
}
.contact-container h2 {
font-weight: 400;
font-size: var(--desktop-title-size);
letter-spacing: min(calc(0.4 * 1440px / 100), 0.4vw);
color: rgba(20, 71, 56, 1);
}
.contact-form {
width: clamp(400px,50vw, 600px);
margin: 0 auto;
}
.form-group {
margin-bottom: 2rem;
text-align: left;
}
.form-group label {
display: block;
margin-bottom: 0.5rem;
font-weight: 500;
cursor: default;
}
.form-group input,
.form-group textarea {
width: 100%;
}
.form-group textarea {
height: 10rem;
resize: vertical;
} .contact-form input:focus::placeholder,
.contact-form textarea:focus::placeholder {
opacity: 0;
transition: opacity 0.5s ease;
} .contact-form input::placeholder,
.contact-form textarea::placeholder {
opacity: 1;
transition: opacity 0.5s ease;
}
.contact-form input:focus-within,
.contact-form textarea:focus-within {
outline: none !important; 
}
@media (max-width: 1024px) { .contact-container h2 {
font-size: var(--mobile-title-size);
text-align: center;
align-self: center;
justify-self: center;
}
.contact-form input[type="submit"] {
font-size: 16px;
width: 150px;
height: 50px;
display: block;
} .contact-form .wpcf7-submit>form>div.contact-form>p>input {
font-size: 16px !important;
width: 150px !important;
height: 50px !important;
margin: 15px auto !important;
display: block !important;
background-color: rgba(20, 71, 56, 1) !important;
}
}
@media (max-width: 480px){
.contact-container{
width: 100%;
}
.contact-form {
width: 80vw;
}
}