/*
* Layout
*/
:root {
	--wrap-padding: 1rem;
}

.page-wrapper {
	display: grid;
	grid-template-rows: max-content 1fr;
	align-items: center;
	min-height: 100svh;
	padding: var(--wrap-padding);
}

.page-content {
	height: 100%;
	padding-block: 1rem;
}

.page-title {
	padding-inline: 2rem;
}

.page-subtitle {
	max-width: 200px;
}

.contacts {
	--icon-size: 1.25rem;
}

.contact:hover {
	color: var(--clr-primary-500);
}

.page-image {
	height: 20rem;
	min-height: 50svh;
}

/*
* Responsive
*/
@media (min-width: 769px) {
	.page-wrapper {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		grid-template-rows: unset;
		padding-left: 0;
	}

	.page-content {
		grid-row: 1;
		grid-template-rows: 1fr max-content;
		padding-inline: var(--wrap-padding);
	}

	.page-image {
		grid-column: 2;
		height: 100%;
	}

	.page-subtitle {
		max-width: unset;
	}
}
