/* ------------------------------------
				RESET	
-------------------------------------*/
*, *:after, *:before {-moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box}
article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary {display: block}
audio, canvas, video {display: inline-block}
audio:not([controls]) {display: none; height: 0}
[hidden], template {display: none}
/* ------------------------------------
				BASE	
-------------------------------------*/
html {height: 100%; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%}
body, html {margin: 0; font-size:15px; overflow:auto}
body {height:100%}
p {cursor:default;margin-bottom:1.5em;-epub-hyphens:none;hyphens:none;font-size:1em;line-height:1.1em;margin:0;word-break:break-word;font-feature-settings:"liga" 0, "dlig" 0}
b, strong, .strong {font-weight:bold}
dfn, em, .em {font-style:italic;font-size:inherit}
a {background:transparent;cursor:pointer}
a:focus {outline: 0}
a, a:active, a:hover, a:visited {outline:0;text-decoration:none}
img {border:0}
svg:not(:root) {overflow:hidden}
figure {margin:0}
h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5 {cursor:default;text-rendering:optimizelegibility;font-weight:normal; padding:0;}
ul{margin:0; padding:0}
/* ------------------------------------
				FONTS	
-------------------------------------*/
@font-face {
	font-family: 'k3270';
	src: url('fonts/3270-regular-key.woff2') format('woff2'), url('fonts/3270-regular-key.woff') format('woff');
	font-weight: normal;
	font-style: normal;
	font-display: swap;
}
/* ------------------------------------
				SITE	
-------------------------------------*/
body {
	padding: 0;
  font-family: neue-haas-grotesk-text, sans-serif;
	font-weight: 400;
	font-style: normal;
	background-color: #7B1E22;
	color: #1a1a1a;
  text-align: center
}
.site-header {
  display:flex;
  justify-content: center;
  text-align: center;
  padding:2em 0 3em
}
.logo {
  margin:1em 0 1em
}
.slogan {
  margin-top:.3em;
  font-family:mokoko-variable;
  font-weight:900;
  font-size:2.4em;
  white-space: pre-wrap;
}
.slogan br {
  
}
.slogan + p {
  margin-top:1.5em;
}
.page-section {
  display:flex;
  justify-content: center;
  text-align: center;
  position: relative
}
.section-7 {
  padding-bottom:4em
}
.section-wrap {
  display:flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  width:100%;
  max-width:1200px;
  padding:1em;
  position: relative;
}
.section-wrap header {
  width:100%;
}
.site-footer {
  background:#1a1a1a;
  height:100px;
  color:#7B1E22;
  font-family:polymath-display;
  font-size:1.2em;
  display:flex;
  justify-content: center;
  align-items: center;
}
h2 {
  margin-bottom:0;
  text-transform: uppercase;
  font-family:rama-slab-m;
  line-height: .8em;
  font-size:4.125em;
  font-weight:700*/
}
h2:first-of-type {
  margin-top:2.5rem
}
h2 + p {
  background:#1a1a1a;
  display:block;
  flex:0 1 auto;
  color: #7B1E22;
  padding:8px 14px 8px;
  line-height: 1em;
  text-transform: uppercase;
  font-family:polymath-display;
  font-size:1.2em;
  margin:.25em auto;
  width:100%;
  max-width:760px;
}
h2 span {
  font-size:3.7rem;
}
.section-wrap header ~ p {
   margin:1.5em 0
}
.page-interrupt {
  display:flex;
}
.glitch-block {
  height :150px;
  background:#1a1a1a;
  color:#777;
  justify-content: center;
  align-items: center
}
.glitch-block .threshold-line {
  font-family: k3270, monospace;
  white-space: pre-wrap;
  margin:0 0 .5em;
  text-align: center;
  letter-spacing: -.1em;
  font-size: 1.2em;
}
.flesh {
  max-width:300px;
  color:#aaa;
  letter-spacing: .0666em;
  line-height: 1.2em;
  padding:2em 0 4.5em;
  border-bottom:7px solid #1a1a1a;
  font-size:1.2em;
}
.flesh span {
  font-weight:600;
}
form {
  position:relative;
  margin:1.5em 0 0;
  width:90%;
  max-width:420px;
  display:flex;
  flex-direction: column;
  align-items: center;
  gap: .4em
}
input, textarea {
  font-family:neue-haas-grotesk-text, sans-serif;
  font-size:.9rem
}
input {
  border:none;
  background:#1a1a1a;
  margin-bottom:1em;
  display:block;
  margin:0 auto;
  width:100%;
  padding:6px 8px;
  color:#999;
  outline:none;
}
textarea {
  display:block;
  width:100%;
  margin:0 auto;
  border:none;
  outline:none;
  background:#1a1a1a;
  padding:6px 8px;
  resize:vertical;
  color:#999;
}
input::placeholder, textarea::placeholder {
  color:gray;
}
input:focus, textarea:focus {
  color:#ddd !important;
}
button {
  margin:.25em 0 1em;
  width:111px;
  height:40px;
  border-radius: 5px;
  border:none;
  display:block;
  padding;4px;
  background:#efefef;
  font-family:polymath-display;
  font-size:1.2em;
  letter-spacing: .04em;
  text-transform: uppercase;
  cursor: pointer
}
button::hover {
  background:#fefefe
}
@media screen and (min-width:480px){
  .site-footer {
    font-size:2em
  }
}
@media screen and (min-width:760px){
  .logo img {
    width:222px;
    height:auto;
  }
  .slogan {
    max-width:720px;
    font-size:2.75em
  }
  .slogan br {
    display:none
  }
  .glitch-block .threshold-line {
    font-size:1.6em;
    letter-spacing: 0em
  }
  h2 {
    font-size:6em
  }
  h2 span {
    font-size:inherit;
  }
  h2 br {
    
  }
  h2 + p {
    font-size:2em;
    white-space: pre-wrap;
  }
  .section-7 h2 br {
    display: none;
  }
  .section-7 .flesh {
    white-space: pre-wrap;
  }
  .flesh {
    font-size:1.3em;
    max-width:540px;
    letter-spacing: .05rem;
    display:block;
    margin:1em auto;
    padding:4em 0 6.5em
  }
  input, textarea {
    font-size:1em;
    padding:8px 10px
  }
  input {
    margin-bottom:.3em;
  }
  textarea {
    height:140px
  }
  button {
    margin-top:1em
  }
  .site-footer {
    height:200px;
    font-size:3.5em
  }
}
@media screen and (min-width:1000px){
  .logo img {
    width:250px;
  }
  .slogan {
    max-width:760px;
    font-size:3em
  }
  h2 {
    font-size:7em
  }
  h2 + p {
    font-size:2.4em;
    max-width: 920px
  }
  .flesh {
    font-size:1.5em;
    max-width:620px;
  }
  .site-footer {
    font-size:4.75em
  }
}
@media screen and (min-width:1200px){
  .logo img {
    width:270px
  }
  .slogan {
    max-width:890px;
    font-size:3.5em
  }
  h2 {
    font-size:8.5em
  }
  h2 + p {
    font-size:2.7em;
    max-width: 1100px
  }
  .flesh {
    font-size:1.75em;
    max-width:700px;;
  }
  input, textarea {
    font-size:1.3em;
  }
  .site-footer {
    height:240px;
    font-size:7em;
  }
}