:root { --ink: #101010; --sans: "Diatype", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Inter, Arial, sans-serif; }
* { box-sizing: border-box; }
html { min-height: 100%; }
body {
  margin: 0; min-height: 100vh; position: relative;
  font-family: var(--sans); font-size: 1.6rem; line-height: 1.15; color: var(--ink); background: #fff;
  -webkit-font-smoothing: antialiased;
}
body::before {
  content: ""; position: fixed; inset: 0; z-index: -1;
  background: url(/images/bg.jpg) center / cover no-repeat; opacity: .5;
}
main { max-width: 70%; padding: 2.5rem 3rem 3rem; }
a { color: var(--ink); text-decoration: underline; }
a:active { opacity: .7; }
h1 { font-size: 4.5rem; font-weight: 700; line-height: 1.15; letter-spacing: -.02em; margin: 0; }
h2 { font-size: 2.2rem; font-weight: 500; line-height: 1.2; margin: 0; }
p { margin: 0 0 1.15em; }
p:last-child { margin-bottom: 0; }
hr { background: rgba(0,0,0,.6); border: 0; height: 1px; margin: 0 0 .5rem; }
.top .nav { margin: 0 0 1.15em; }
.indent { margin-left: calc(2 / 12 * 100% + 2rem * 2 / 12); padding: 1.15em 0 2.3em; }
.hero h1 { margin-bottom: 1.15em; }
.hero .badge img { display: block; width: 300px; max-width: 100%; height: auto; }
.section-title { margin: 1.15em 0 2.3em; }
.section-title + .indent { padding-top: 0; }
.foot { padding: 1.15em 0 0; }
@media (max-width: 900px) {
  main { max-width: 100%; padding: 2rem 1.5rem; }
  body { font-size: 1.4rem; }
  h1 { font-size: 3.4rem; }
  h2 { font-size: 1.9rem; }
  .indent { margin-left: 0; }
}
