/**
 * Tabs
 */

.tabs {
	display: flex;
	flex-wrap: wrap;
	width: 100%;
}

.tab-label {
	width: 100%;
	display: block;
	cursor: text;
	margin-bottom: 0;
	line-height: 1.6;
	position: relative;
	text-transform: uppercase;
	transition: color ease 0.25s;
}

.tab-label:after {
	content: "";
	background-color: var(--gray-10);
	height: 3px;
	width: 100%;
	position: absolute;
	bottom: 0;
	left: 0;
	transition: background-color ease 0.25s;
}

.tab-label__p {
	margin-top: 0;
	margin-bottom: 16px;
}

.tabs .tab {
	flex-grow: 1;
	justify-content: space-between;
	gap: 20px;
	width: 100%;
	height: 100%;
	display: block;
}

.tabs [type=radio] {
	display: none;
}

.tabs [type=radio]:checked+.tab-label {
	color: var(--golden-grass);
}

.tabs [type=radio]:checked+.tab-label:after {
	background-color: var(--golden-grass);
}

.tabs-block .content-row__figure {
	position: relative;
	overflow: hidden;
}

.tab-image {
	margin: auto;
}

.content-row__paragraph--tab {
	margin-top: 0;
}

@media (min-width: 961px) {
	.tabs .tab {
		display: none;
	}

	.tabs [type=radio]:checked+.tab-label+.tab {
		display: flex;
	}

	.content-row__paragraph.tab {
		font-size: var(--body-text);
	}

	.tabs-container .content-row__text--even,
	.tabs-container .content-row__text--odd {
		margin-top: 30px;
	}

	.tabs-container .content-row__figure--even,
	.tabs-container .content-row__figure--odd {
		margin-top: 0;
	}

	.content-row__paragraph--tab {
		margin-left: 0;
	}

	.content-row__figure--tab {
		margin-top: -80px;
	}

	.tab-label {
		order: 1;
		width: auto;
		margin-right: 40px;
		margin-bottom: 20px;
		cursor: pointer;
	}

	.tabs .tab {
		order: 9;
	}
}

@media (max-width: 960px) {
	.tabs-block {
		max-width: 560px;
		margin: auto;
	}

	.tab-label {
		width: auto;
		margin-top: 40px;
	}

	.tab-label:first-of-type {
		margin-top: 0;
	}

	.tabs .tab-label {
		color: var(--golden-grass);
	}

	.tabs .tab-label:after {
		background-color: var(--golden-grass);
	}
}

@media (max-width: 570px) {
	.tabs-block .content-row__figure {
		margin-left: -32px;
		margin-right: -32px;
	}
}