@font-face { font-family: 'EB Garamond Regular'; src: url('EBGaramond-Regular.ttf'); font-weight: normal; font-style: normal; font-display: swap; }
@font-face { font-family: 'Arial Narrow'; src: url('ARIALN.TTF'); font-weight: normal; font-style: normal; font-display: swap; }
@font-face { font-family: 'Arial Narrow'; src: url('ARIALNI.TTF'); font-weight: normal; font-style: italic; font-display: swap; }

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }
body { margin: 0; background: #fff; color: #000; font-family: "Arial Narrow", sans-serif; font-stretch: condensed; overflow-x: hidden; background-image: url('bg2.jpg'); background-position: top; background-repeat: no-repeat; background-size: cover; height: 100vh; }

@media (max-width: 700px) { 
	div.info p { bottom: 4vh; } 
	div.explain p { margin-left: 0 !important; } 
	/*div.footer { align-items: flex-start; flex-direction: column; }*/ }

a 		{ color: #000; text-decoration: none; border-bottom: 1px solid #111; }
a:hover { color: #fff; background: #000; text-decoration: none; border-bottom: 0px solid #000; }
p 		{ margin: 0; filter: blur(1px) url(#grainy-noise); }


div.intro 		{ min-height: 100vh; position: relative; display: flex; align-items: center; justify-content: center; padding: 4vw; }
div.intro p 	{ font-family: "EB Garamond Regular", serif; font-size: clamp(42px, 17vw, 240px); font-weight: 500; line-height: 80%; letter-spacing: -.12em; text-align: center; transform: scaleX(.72); text-shadow: 0 0 8px rgba(0, 0, 0, 0.7); }

div.info p 					{ position: absolute; font-size: 20px; font-weight: 500; line-height: 125%; letter-spacing: -.01em; transform: scaleX(.82); }
div.info p:nth-child(1) 	{ left: 5vw; bottom: 6vh; text-align: left; }
div.info p:nth-child(2) 	{ right: 5vw; bottom: 6vh; text-align: right; }


div.explain 				{ position: relative; min-height: 100vh; padding: 15vh 6vw 5vh 6vw; }
div.explain p 				{ font-size: clamp(25px, 4vw, 56px); margin-bottom: 28vh; line-height: 98%; letter-spacing: -.03em; max-width: 760px; }
div.explain p:nth-child(1) 	{ margin-left: 0vw; max-width: 650px; }
div.explain p:nth-child(2) 	{ margin-left: 25vw; max-width: 650px; }
div.explain p:nth-child(3) 	{ margin-left: 5vw; max-width: 650px; }
div.explain p:nth-child(4) 	{ margin-left: 15vw; max-width: 650px; }
div.explain p:last-child 	{ margin-left: 0vw; max-width: 100%; text-align: center; font-style: italic; }


div.footer 					{ font-size: clamp(18px, 2.2vw, 30px); min-height: 0vh; padding: 7vw 5vw; display: flex; align-items: end; justify-content: space-between; gap: 30px; }
div.footer p:first-child 	{ max-width: 520px; text-align: left; line-height: 105%; }
div.footer p:last-child 	{ font-size: 14px; text-align: right; }