.joblist {
	margin-left: auto;
	margin-right: auto;
/* 	max-width: var(--max-content-width); */
	padding-bottom: 10vw;
	
}
.joblist__intro {
	padding: var(--indent-sides);
	margin-bottom: var(--indent-sides);
	background-color: var(--cl3);
	
}
.joblist__intro p {
	font-size: var(--md);
	line-height: var(--lh-md);
	color: var(--cl4);
	
}
.joblist__intro h1 {
	font-size: var(--xxl);
	line-height: var(--lh-xxl);
	color: var(--cl4);
	letter-spacing: -.05rem;
}
.joblist__filter {
	display: flex;
	justify-content: space-between;
	padding-left: var(--indent-sides);
	padding-right: var(--indent-sides);
	margin-bottom: var(--indent-sides);
	flex-direction: column;
	gap: clamp(1rem,2vw,2rem);
	
}
.joblist__filter select {
	padding: .3rem;
	font-size: var(--md);
	line-height: var(--lh-md);
	
}
.joblist__filter-reset {
	font-size: var(--md);
	line-height: var(--lh-md);
	color: var(--cl1);
	text-decoration: underline;
	text-underline-offset: .2rem;
}
.joblist__cats {
	display: flex;
	flex-direction: column;
	gap: var(--indent-sides);
	padding-bottom: 5vw;
	padding-left: var(--indent-sides);
	padding-right: var(--indent-sides);
}
.joblist__cat-items {
/* 	display: grid; */
	
}
.joblist__item {
	border-top: var(--line) solid var(--cl1);
	padding: clamp(1rem,2vw,1.8rem);
	display: flex;
	flex-direction: row;
	justify-content: center;
	text-decoration: none;
	
}
.joblist__item:hover .joblist__item-title {
	color: var(--cl1);
	
}
.joblist__item:hover .joblist__item-icon {
	transform: translateX(1rem);
	
}

.joblist__item-title {
	flex-grow: 1;
	font-family: 'Inter' !important;
	line-height: var(--lh-md);
	font-size: var(--md);
	color: var(--cl2);
	transition: color .3s ease;
	
}
.joblist__item-icon {
	width: clamp(1rem,2vw,2.5rem);
	transition: transform .3s ease;
	
}
.joblist__cat-title {
	font-size: var(--lg);
	line-height: var(--lh-lg);
	margin-bottom: clamp(1rem,3vw,3rem);
	
}
.joblist__form {
	border-top: 2px solid var(--cl1);
	padding-top: calc( 4vw + var(--header-height));
	padding-left: var(--indent-sides);
	padding-right: var(--indent-sides);
}
.joblist__form input {
	width: 100%;
	
}
.joblist__form span {
	display: block;
/* 	width: 100%; */
	
}
.joblist__form label {
	display: block;
	margin-bottom: .3rem;
	
}
.joblist__form form {
	display: grid;
	grid-row-gap: var(--indent);
}
.joblist__form form p {
	margin: 0rem;
	
}
.joblist__form-hl {
	font-size: var(--xl);
	line-height: var(--lh-xl);
	
}
.joblist__form  input[type="text"],
.joblist__form  input[type="email"],
.joblist__form  input[type="tel"],
.joblist__form  textarea {
	display: block;
	width: 100%;
	padding: .5rem;
	font-size: var(--md);
	line-height: var(--lh-md);
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	
}
.wpcf7 form.sent .wpcf7-response-output {
	background-color: #46b450;
	color: white;
	border: none;
	padding: var(--indent);
	
}
@media screen and (min-width: 768px){
	.joblist__cat-items {
/* 		grid-template-columns: 1fr 1fr; */
		grid-column-gap: clamp(1rem,2vw,3rem);
		column-count: 2;
	}
	.joblist__form form {
		grid-template-columns: 1fr 1fr;
		gap: var(--grid-gap);
		
	}
	.joblist__form form p {
		grid-column: span 2;
		
	}
	.joblist__form .formfield {
		
	}
	.joblist__form .formfield:nth-of-type(6),
	.wpcf7 form.sent .wpcf7-response-output {
		grid-column: span 2;
		
	}
	.joblist__intro {
		background-image: linear-gradient( to left, var(--cl1), var(--cl3) 70%);
		
	}
	.joblist__filter {
		flex-direction: row;
		
	}
	
}