/* A mobile-first destination for social bios, led by community links. */
.home.join-page { --join-surface: var(--home-ivory); min-height: 100svh; font-family: "Satoshi Wordmark", var(--home-sans); }
.join-shell { width: min(100% - 36px, 480px); margin-inline: auto; padding-block: 34px 22px; }
.join-header { margin-bottom: 28px; text-align: center; }
.home .join-brand { display: inline-flex; align-items: center; gap: .3em; font: 600 clamp(22px, 6vw, 26px)/1.15 "Satoshi Wordmark", var(--home-sans); letter-spacing: -.035em; text-decoration: none; }
.join-logo { display: block; width: 2em; height: 2em; flex-shrink: 0; }
.join-logo--dark { display: none; }
.home .join-brand h1 { margin: 0; font: inherit; letter-spacing: inherit; white-space: nowrap; }
.join-header p { margin: 14px 0 0; color: var(--home-muted); font-size: 14px; line-height: 1.6; }
.join-socials, .join-section { display: grid; gap: 8px; }
.join-section { margin-top: 26px; }
.join-social-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
:root body.home .join-social-row a.site-button { padding-inline: 10px; gap: 8px; font-size: 14px; }
.join-social-row .join-icon { width: 18px; height: 18px; flex-basis: 18px; }
.home .join-shell h2 { margin: 0 0 3px; font-family: inherit; font-size: 13px; font-weight: 600; letter-spacing: 0; color: var(--home-muted); }
.home .join-link { display: flex; align-items: center; gap: 14px; min-height: 56px; padding: 14px 17px; border: 1px solid var(--home-rule); background: var(--join-surface); color: var(--home-text); font-size: 15px; font-weight: 600; line-height: 1.4; text-decoration: none; transition: background-color 140ms, border-color 140ms; }
.join-link > span:not(.join-icon):not(.join-arrow) { min-width: 0; }
.join-link__note { display: block; margin-top: 3px; color: var(--home-muted); font-size: 12px; font-weight: 400; line-height: 1.5; }
.join-arrow { margin-left: auto; flex-shrink: 0; font-size: 18px; font-weight: 400; }
.join-icon { flex: 0 0 24px; width: 24px; height: 24px; background: currentColor; mask: var(--join-icon) center/contain no-repeat; -webkit-mask: var(--join-icon) center/contain no-repeat; }
.join-icon--discord { --join-icon: url('/assets/icons/discord.svg'); }
.join-icon--instagram { --join-icon: url('/assets/icons/instagram.svg'); }
.join-icon--linkedin { --join-icon: url('/assets/icons/linkedin.svg'); }
.join-icon--x { --join-icon: url('/assets/icons/x.svg'); }
.join-icon--mail { --join-icon: url('/assets/icons/mail.svg'); }
.home .join-link--primary { background: var(--home-navy); color: var(--home-ivory); border-color: var(--home-navy); }
.join-link--primary .join-link__note { color: #dae6e6; }
.home .join-link--resource { background: var(--home-paper); }
.home .join-link:hover { background: #dae6e6; border-color: #036b7d; color: var(--home-navy); }
.home .join-link--primary:hover { background: var(--home-navy-soft); color: var(--home-ivory); }
.join-page a:focus-visible, .join-page button:focus-visible { outline: 3px solid #036b7d; outline-offset: 3px; }
.join-footer { margin-top: 28px; padding-top: 14px; border-top: 1px solid var(--home-rule); text-align: center; }
.join-footer > div { display: flex; justify-content: center; gap: 28px; }
.join-footer a { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; font-size: 13px; font-weight: 500; }
.join-theme { min-height: 44px; margin: 8px auto 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; font-size: 12px; }
[data-fellowship-state="interest"] .join-deadline { display: none; }
:root[data-theme="dark"] .join-page { --join-surface: #0c2233; --home-paper: #102d43; --home-text: #e3ebe8; --home-muted: #b4c4cc; --home-rule: rgba(226,236,234,.22); background: #071a2b; color: var(--home-text); }
:root[data-theme="dark"] .join-logo--light { display: none; }
:root[data-theme="dark"] .join-logo--dark { display: block; }
:root[data-theme="dark"] .join-link--primary { background: var(--home-aqua); color: var(--home-navy); border-color: var(--home-aqua); }
:root[data-theme="dark"] .join-link--primary .join-link__note { color: var(--home-navy); }
:root[data-theme="dark"] .join-link:hover { background: #123851; color: var(--home-text); border-color: var(--home-aqua); }
:root[data-theme="dark"] .join-link--primary:hover { background: var(--home-ivory); color: var(--home-navy); }
:root[data-theme="dark"] .join-page a:focus-visible, :root[data-theme="dark"] .join-page button:focus-visible { outline-color: var(--home-aqua); }
@media (min-width: 700px) {
  .join-shell { padding-block: 56px 32px; }
  .join-header { margin-bottom: 32px; }
}
@media (prefers-reduced-motion: reduce) { .home .join-link { transition: none; } }
