#page {
	position: relative;
	
	background-image: linear-gradient(to bottom, #0A1F38, #318091 33%, #83ADA8 57%, #CEE0C7);
	background-attachment: fixed;
	
	text-align: center;
	color: #FFF;
	
	isolation: isolate;
}
#page:before {
	content: '';
	position: fixed; top: calc((100dvh + var(--wp-admin--admin-bar--height, 0px)) / 2); left: 50%; transform: translate(-50%, -50%); z-index: -1;
	display: block; width: min(80vh, min(50vw, 580px)); height: min(80vh, min(50vw, 580px));
	
	background-image: url("../../images/tag-1.svg");
	background-position: center;
	background-size: contain;
	background-repeat: no-repeat;
	
	transition: filter .4s ease-out;
	
	pointer-events: none;
}
#page.static:before { filter: blur(4px); }
#page.scroll:before { filter: blur(10px); }

/*------------------------------------------------------------------------------------------------------*/

#page > .content-wrapper {
	display: flex; min-height: calc(100vh - var(--wp-admin--admin-bar--height, 0px));
	flex-direction: column;
	justify-content: flex-start;
	align-items: center;
	padding: 55vh 0 100px;
}

/*------------------------------------------------------------------------------------------------------*/

#page > .content-wrapper > .title {
	margin: 0 0 75px;
	text-transform: uppercase;
	font-weight: 400;
}
@media (min-width: 900px)	 { #page > .content-wrapper > .title { font-size: 32px; } }
@media (max-width: 899.99px) { #page > .content-wrapper > .title { font-size: 24px; } }

/*----------------------------------------------------------------------------------*/

#page > .content-wrapper > .body {
	max-width: 800px;
	margin: 0 auto;
}
@media (min-width: 900px) {
	#page > .content-wrapper > .body {
		line-height: 28px;
		font-size: 18px;
	}
}
@media (max-width: 899.99px) {
	#page > .content-wrapper > .body {
		line-height: 20px;
		font-size: 14px;
	}
}

#page > .content-wrapper > .body h2 { font-weight: 400; }
#page > .content-wrapper > .body h3 { font-weight: 400; }
#page > .content-wrapper > .body p {}
#page > .content-wrapper > .body a { text-decoration: underline; }
@media (min-width: 900px) {
	#page > .content-wrapper > .body h2 { margin: 75px 0 50px; }
	#page > .content-wrapper > .body h3 { margin: 50px 0 30px; }
	#page > .content-wrapper > .body p { margin: 30px 0; }
}
@media (max-width: 899.99px) {
	#page > .content-wrapper > .body h2 { margin: 50px 0 30px; }
	#page > .content-wrapper > .body h3 { margin: 30px 0 20px; }
	#page > .content-wrapper > .body p { margin: 20px 0; }
}

#page > .content-wrapper > .body > :last-child { margin-bottom: 0; }