@font-face {
  font-family: Barlow;
  src: url('./assets/barlow-regular.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

* { box-sizing: border-box; }
html { color-scheme: light; scroll-behavior: smooth; }
body {
  margin: 0;
  background: #fff;
  color: #202020;
  font: 400 20px/1.65 Barlow, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
}
.site-nav {
  max-width: 1168px;
  margin-inline: auto;
  min-height: 88px;
  padding: 20px 32px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}
.site-brand { display: inline-flex; align-items: center; gap: 10px; font-size: 18px; text-decoration: none; white-space: nowrap; }
.site-logo { width: 25px; height: 24px; flex: none; }
.nav-join { border: 1px solid currentColor; padding: 9px 16px; font-size: 16px; line-height: 1.5; text-decoration: none; white-space: nowrap; }
.nav-join:hover { background: #f5f5f5; }
main {
  max-width: 680px;
  margin: 56px auto 80px;
  padding-inline: 24px;
}
.page-header { margin-bottom: 48px; }
h1 { margin: 0; font: inherit; font-size: 46px; line-height: 1.15; letter-spacing: -.025em; }
h2 { font: inherit; font-size: 28px; margin: 0 0 28px; }
p { margin: 0 0 24px; }
.application { margin-top: 64px; padding-top: 36px; border-top: 1px solid #d6d6d6; scroll-margin-top: 24px; }
.form-field { margin-bottom: 24px; }
label { display: block; margin-bottom: 8px; }
input, textarea, button { font: inherit; color: inherit; }
input, textarea { display: block; width: 100%; border: 1px solid #909090; border-radius: 0; padding: 10px 12px; background: #fff; }
textarea { resize: vertical; min-height: 160px; }
input:focus-visible, textarea:focus-visible, button:focus-visible { outline: 2px solid #202020; outline-offset: 3px; }
button { border: 1px solid #202020; padding: 10px 20px; background: #fff; cursor: pointer; }
button:hover { background: #f5f5f5; }
button:disabled { cursor: not-allowed; opacity: .65; }
.form-note { font-size: 16px; line-height: 1.5; margin: 10px 0 0; }
.form-status { margin-top: 20px; }
.form-trap { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
form[aria-busy="true"] { cursor: progress; }
a { color: inherit; text-underline-offset: 4px; }
a:focus-visible { outline: 2px solid currentColor; outline-offset: 5px; }
[hidden] { display: none !important; }
@media (max-width: 600px) {
  body { font-size: 19px; }
  .site-nav { min-height: 74px; padding: 16px 24px; gap: 12px; }
  .site-brand { font-size: 15px; gap: 8px; }
  .site-logo { width: 20px; height: 20px; }
  .nav-join { font-size: 14px; padding: 8px 12px; }
  main { margin-block: 32px 56px; }
  h1 { font-size: 36px; }
  .page-header { margin-bottom: 36px; }
}
@media (max-width: 360px) {
  .site-nav { padding-inline: 20px; gap: 8px; }
  .site-brand { font-size: 14px; }
  .nav-join { font-size: 13px; padding-inline: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}
@media print {
  .site-nav { display: none; }
  main { max-width: none; margin: 0; padding: 0; }
  body { font-size: 12pt; }
  h1 { font-size: 18pt; }
  .application { display: none; }
  p { orphans: 3; widows: 3; }
}
