
.ie-evolution-hiring{
	--_f--title: 'Plus Jakarta Sans', sans-serif;
	--_f--text: 'Open Sans', sans-serif;

	margin-block: 64px;
	font-family: var(--_f--text);
}

.ie-evolution-hiring__columns {
	--_flex-direction: column;
	--_size-circle: 100%;
	--_display: flex;
	--_gap: 52px;

	display: var(--_display);
	flex-direction: var(--_flex-direction);
	align-items: center;
	gap: var(--_gap);
}

@media (min-width: 1100px) {
	.ie-evolution-hiring__columns {
		--_flex-direction: row;
		--_size-circle: 578px;
		--_display: grid;
		gap: 80px;

		grid-template-columns: 1fr var(--_size-circle);
	}
}

.ie-evolution-hiring__column{
	position: relative;
}

.ie-evolution-hiring__title{
	margin-bottom: 16px;
	color: var(--wp--preset--color--primary);
	font-family: var(--_f--title);
	font-size: 24px;
}

.ie-evolution-hiring__content{
	margin-bottom: 16px;
}

.ie-evolution-hiring__content :where( p, h2, h3, h4, h5, h6 ){
	line-height: 1.6;
}

.ie-evolution-hiring__button{
	/* padding-inline: 16px;
	padding-block: 8px; */
	margin: 0;
}

.ie-evolution-hiring__picture-text{
	display: flex;
	flex-direction: row-reverse;
	width: 100%;
}

.ie-evolution-hiring__picture-content{
	--_display: flex;
	--_flex-direction: column;
	--_justify-content: space-between;

	position: relative;
	align-items: center;
	justify-content: var(--_justify-content);
	width: var(--_size-circle);
	height: auto;
	display: var(--_display);
	flex-direction: var(--_flex-direction);
	width: 100%;

}

@media (min-width: 1100px) {
	.ie-evolution-hiring__picture-content{
		--_display: grid;
		--_flex-direction: inherit;
		--_justify-content: inherit;
		position: relative;

		height: var(--_size-circle);
		border-radius: var(--_size-circle);
		grid-template-columns: 1fr 1fr;
		grid-template-rows: 1fr 1fr 1fr;
		align-items: start;
		position: relative;
	}

	.ie-evolution-hiring__picture-content::after{
		--_size: calc( var(--_size-circle) - 60px );
		--_top: 30px;
		--_left: 30px;
	
		content: "";
		border: solid 1px var(--wp--preset--color--primary);
		border-radius: var(--_size);
		width: var(--_size);
		height: var(--_size);
		display: block;
		position: absolute;
		z-index: -1;
		top: var(--_top);
		left: var(--_left);
	}
}

.ie-evolution-hiring__picture{
	--_width: 100%;
	--_position: relative;
	--_align-items: flex-start;
	--_justify-content: flex-end;

	display: flex;
	align-items: var(--_align-items);
	justify-content: var(--_justify-content);
	position: var(--_position);
	width: var(--_width);
}

@media (min-width: 1100px) {
	.ie-evolution-hiring__picture{
		--_position: absolute;
		--_align-items: center;
		--_justify-content: center;

		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		display: flex;
		align-items: center;
		justify-content: center;
		z-index: -1;
	}
}

.ie-evolution-hiring__picture img.picture{
	--_position: relative;
	--_right: -30%;
	--_height: auto;
	--_width: auto;
	--_max-width: 400px;
	display: none;

	width: var(--_width);
	height: var(--_height);
	position: var(--_position);
	right: var(--_right);
}

img.picture-mobile{
	display: block;
	position: absolute;
	right: -20px;
	top: 50%;
	transform: translateY(-50%);
}


@media (min-width: 1100px) {
	.ie-evolution-hiring__picture img.picture{
		--_position: absolute;
		--_right: auto;
		--_width: auto;
		--_height: 350px;
		display: block;
	}
	.ie-evolution-hiring__picture img.picture-mobile{
		display: none;
	}
}


.ie-evolution-hiring__picture-content--content{
	--_max-width: 160px;
	--_margin-bottom: 20px;

	background: #fff;
	max-width: var(--_max-width);
	margin-bottom: var(--_margin-bottom);
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	line-height: 1.4;
	font-size: 14px;
}

@media (min-width: 1100px) {
	.ie-evolution-hiring__picture-content--content{
		--_max-width: 100px;
		--_margin-bottom: 0;
	}
}

@media (min-width: 1100px) {
	.ie-evolution-hiring__picture-content--item{
		--_justify-content: center;
		--_align-items: center;

		display: flex;
		justify-content: var(--_justify-content);
		align-items: var(--_align-items);
		height: 100%;
	}

	.ie-evolution-hiring__picture-content--item:first-child{
		--_align-items: flex-start;

		grid-column: 3 / 1;
	}

	.ie-evolution-hiring__picture-content--item:last-child{
		grid-column: 3 / 1;
	}

	.ie-evolution-hiring__picture-content--item:nth-child(2){
		--_justify-content: flex-start;
		--_align-items: flex-start;
	}

	.ie-evolution-hiring__picture-content--item:nth-child(3){
		--_justify-content: flex-end;
		--_align-items: flex-start;
	}

	.ie-evolution-hiring__picture-content--item:nth-child(4){
		--_justify-content: flex-start;
	}

	.ie-evolution-hiring__picture-content--item:nth-child(5){
		--_justify-content: flex-end;
	}
}


.ie-evolution-hiring__column {
	width: 100%;
}

.ie-evolution-hiring__square {
	position: relative;
	display: grid;
	gap: var(--wp--preset--spacing--xxs);
	padding: var(--wp--preset--spacing--s) 0;
	justify-content: start;
}

.ie-evolution-hiring__square-item {
	display: grid;
	place-content: center;
}

.ie-evolution-hiring__square-content {
	width: 170px;
	text-align: center;
	background-color: var(--wp--preset--color--base);
	padding: var(--wp--preset--spacing--xxs);
}

@media (min-width: 1100px) {
	img.picture-mobile {
		display: none;
	}

	.ie-evolution-hiring__square {
		position: relative;

		display: grid;
		grid-template-columns: repeat(2, 1fr);
		grid-template-rows: repeat(3, 1fr);
		gap: var(--wp--preset--spacing--xxs);
		padding: var(--wp--preset--spacing--s) 0;

		background-image: var(--_ie-evolution-hiring__square-desktop);
		background-position: center;
		background-repeat: no-repeat;
		background-size: inherit;
		background-size: 32%;
	}

	.ie-evolution-hiring__square::after {
		position: absolute;
		display: block;
		inset: 0 85px;
		border: 1px solid var(--wp--preset--color--primary);
		border-radius: var(--radius--s);
		content: "";
		z-index: 1;
	}

	.ie-evolution-hiring__square-item {
		z-index: 2;
		position: relative;
	}

	.ie-evolution-hiring__square-item:nth-child(odd) {
		justify-content: flex-start;
	}

	.ie-evolution-hiring__square-item:nth-child(even) {
		justify-content: flex-end;
	}

	.ie-evolution-hiring__square-content {
		width: 170px;
		text-align: center;
		background-color: var(--wp--preset--color--base);
		padding: var(--wp--preset--spacing--xxs);
	}
}