/* vacancy Layout Styles */
.vacancy_article {
	height: 100%;
}

.vacancy-block {
	height: 100%;
	width: 100%;
	position: relative;
	text-decoration: none;
	color: var(--odnhn-black-100);
	display: flex;
	flex-direction: column;
	border-radius: var(--general-border-radius);
	border: var(--general-post-border-width) solid var(--general-post-border-color);
	background-color: var(--odnhn-lime);
	overflow: hidden;
	min-height: max(31.25rem, calc(31.25 * var(--su)));
}

.vacancy-block .vacancy-image {
	position: absolute;
	inset: 0;
	z-index: 1;
}

.vacancy-block .vacancy-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	border-radius: var(--general-border-radius-small);
}

.vacancy-block .vacancy-content {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	z-index: 3;
	padding: max(1rem, calc(1.5 * var(--su)));
	border-radius: var(--general-border-radius-small);
	background-color: var(--odnhn-white-100);
	margin-top: auto;
}

.vacancy-block .vacancy-content .vacancy-title {
	margin-bottom: max(1rem, calc(1 * var(--su)));
}

.vacancy-block .vacancy-content .button-wrap {
	display: grid;
	grid-template-rows: 0fr;
	transition: grid-template-rows 0.3s ease-in-out, padding 0.3s ease-in-out;
}

.vacancy-block .vacancy-content .button-wrap .button-inner {
	overflow: hidden;
}

.vacancy-block .vacancy-content .button-wrap .button-inner .button {
	font-size: max(0.875rem, calc(0.875 * var(--su)));
	color: var(--odnhn-white-100);
	border-radius: 999px;
	text-align: center;
	letter-spacing: -0.02em;
	line-height: .8;
	background-color: var(--button-primary-bg);
	width: 100%;
	padding: max(1rem, calc(1 * var(--su))) max(1.25rem, calc(1.25 * var(--su)));
}

.vacancy-block:hover .vacancy-content .button-wrap,
.vacancy-block:active .vacancy-content .button-wrap {
	grid-template-rows: 1fr;
	padding-top: max(1.5rem, calc(1.5 * var(--su)));
}

@media screen and (max-width: 767px) {
	
	.vacancy-block .vacancy-content .vacancy-tags {
		display: none;
	}
	
	.vacancy-block .vacancy-content .button-wrap {
		grid-template-rows: 1fr;
	}
	
}