/* Join page (/join): the landing page social links point at. Loaded after site.css, on this page only,
   so the page can ship without redeploying the shared stylesheet. */
.j-facts { margin-top: 44px; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); border-top: 1px solid var(--line-2); max-width: 1040px; }
.j-facts div { padding: 18px 20px 0 0; }
.j-facts div + div { padding-left: 20px; border-left: 1px solid var(--line); }
.j-facts dt { font: 500 .8rem/1 var(--mono); color: var(--ink-3); }
.j-facts dd { margin: 10px 0 0; font: 800 1.25rem/1.15 var(--display); letter-spacing: -.02em; }
.j-apply { padding-top: 0; }
.j-apply h2, .j-faq h2 { font-size: clamp(2.2rem, 5vw, 4rem); }
.j-template { margin-top: 40px; max-width: 640px; display: grid; gap: 14px; justify-items: start; }
.j-template pre { margin: 0; width: 100%; padding: 20px 22px; background: var(--night-2); border: 1px solid var(--line); border-left: 4px solid var(--ember); color: var(--ink); font-size: .95rem; line-height: 1.9; white-space: pre-wrap; }
.j-links { margin-top: 48px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.j-links a { display: block; height: 100%; color: inherit; text-decoration: none; padding: 24px; background: var(--night-2); border: 1px solid var(--line); transition: border-color .2s; }
.j-links a:hover { border-color: var(--ember); }
.j-links p { margin-top: 8px; color: var(--ink-2); font-size: .98rem; }
.j-qa { margin-top: 40px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 clamp(28px, 4vw, 64px); max-width: 1040px; }
.j-qa div { padding: 22px 0; border-top: 1px solid var(--line); }
.j-qa dt { font: 800 1.1rem/1.3 var(--display); letter-spacing: -.02em; }
.j-qa dd { margin: 8px 0 0; color: var(--ink-2); }
.j-qa a { color: var(--ember); }
@media (max-width: 1000px) { .j-facts { grid-template-columns: repeat(3, minmax(0, 1fr)); } .j-facts div:nth-child(4) { padding-left: 0; border-left: 0; } .j-links { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) {
  .j-facts { grid-template-columns: 1fr 1fr; }
  .j-facts div, .j-facts div + div { padding: 16px 0 0; border-left: 0; }
  .j-links, .j-qa { grid-template-columns: 1fr; }
}
