/* ============ Contact Form Section ============ */
.contact-form-container
{
	/* container for the form */
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 4rem 2rem;
	background-color: #111;
	color: #fff;
}

.contact-form-container h1
{
	/* section heading */
	font-size: 2.5rem;
	margin-bottom: 2rem;
	color: var(--primary-color);
}

.contact-form-container form
{
	/* layout the form fields */
	width: 100%;
	max-width: 600px;
	display: flex;
	flex-direction: column;
}

.contact-form-container label
{
	/* labels for each field */
	margin-bottom: 0.5rem;
	font-weight: 600;
}

.contact-form-container input,
.contact-form-container textarea
{
	/* input styling */
	margin-bottom: 1.5rem;
	padding: 0.75rem 1rem;
	border: 1px solid #444;
	border-radius: 0.5rem;
	background-color: #222;
	color: #fff;
	resize: vertical;
}

.contact-form-container input:focus,
.contact-form-container textarea:focus
{
	/* focus outline for accessibility */
	outline: 2px solid var(--primary-color);
}