:root {
	--back: rgb(255 255 255);
	--front: rgb(0 0 0);
	--spacer: 60px;
	
	--back: rgb(20 20 22);
	--front: rgb(245 245 247);
}

body {
	background: var(--back);
	color: var(--front);
	font: 18px/1.35em myriad-pro, sans-serif;
	margin: 0;
}

a {
	color: var(--front);
	font-weight: 600;
}

h1 {
	font: 800 102px/.9em futura-pt-condensed, sans-serif;
	margin: 0;
	text-transform: uppercase;
}

	h1 span {
		display: block;
	}

h2 {
	bottom: -30px;
	font: bold 62px/1em turbinado-pro, erif; 
	margin: 0;
	position: absolute;
	right: 50px;
	text-shadow: var(--back) 0 -3px 0;
	transform: rotate(-2deg);
	white-space: nowrap;
}

body>header,
main,
footer {
	margin: 0 auto var(--spacer);
	padding: 0 25px;
	position: relative;
	max-width: 465px;
}

body>header {
	margin-top: calc(var(--spacer) / 2);
}

figure {
	margin: 0;
}

h3 {
	font: 800 32px/1em futura-pt-condensed, sans-serif;
	margin: 0;
}

article>header p {
	font-family: georgia, sans-serif;
	font-style: italic;
	margin: 0;
}

#footerInner {
	display: grid;
	gap: 30px;
	grid-template-columns: min-content auto;
}

#footerInner p {
	margin: 0;
}

@media(max-width: 620px) {
	h1 {
		font: 800 52px/.9em futura-pt-condensed, sans-serif;
	}
	
	h2 {
		bottom: -18px;
		left: 122px;
		font-size: 42px;
	}
}

@media(max-width: 360px) {
	h1 {
		font-size: 42px;
	}
}