@font-face {
  font-family: "Gestura Text";
  font-style: normal;
  src: url("/fonts/Gestura-Text-Roman-VF.woff2") format("woff2");
}
@font-face {
  font-family: "Gestura Text";
  font-style: italic;
  src: url("/fonts/Gestura-Text-Italic-VF.woff2") format("woff2");
}
@font-face {
  font-family: "Suisse Int'l";
  font-style: normal;
  font-weight: 400;
  src: url("/fonts/SuisseIntl-Regular-WebS.woff2") format("woff2");
}
@font-face {
  font-family: "Suisse Int'l";
  font-style: italic;
  font-weight: 400;
  src: url("/fonts/SuisseIntl-RegularItalic-WebS.woff2") format("woff2");
}

body {
  background-color: rgb(64 59 58);
  color: rgb(255 255 255);
}
.wrapper {
  max-width: 1440px;
  margin: auto;
  padding: 64px 64px;
}
.text-wrapper {
  max-width: 805px;
}
h1 {
  font: 300 3.5rem / 1.2 "Gestura Text", serif;
}
p {
  font: 400 1.25rem / 1.5 "Suisse Int'l", sans-serif;
}
p.lead {
  font: 400 2rem / 1.3 "Gestura Text", serif;
}
a {
  color: inherit;
  text-decoration: underline;
}
a:hover {
  text-decoration: none;
}

@media screen and (max-width: 1200px) {
  h1 {
    font: 400 2.5rem / 1.2 "Gestura Text", serif;
  }
  p {
    font: 400 1.125rem / 1.5 "Suisse Int'l", sans-serif;
  }
  p.lead {
    font: 300 1.5rem / 1.4 "Gestura Text", serif;
  }
  .wrapper {
    padding: 64px 30px;
  }
}

@media screen and (max-width: 700px) {
  .wrapper {
    padding: 64px 15px;
  }
}
