.join-hero { width: min(900px, calc(100% - 48px)); margin: 112px auto 28px; }
.join-hero h1 { margin-block: 8px 12px; font-size: clamp(1.9rem, 4vw, 3rem); font-weight: 300; line-height: 1.15; letter-spacing: -.035em; }
.join-hero p { max-width: 62ch; margin: 0; color: var(--public-muted); font-size: .88rem; line-height: 1.7; }
.join-shell { width: min(900px, calc(100% - 48px)); margin: 0 auto 56px; }
.join-form { padding: clamp(20px, 4vw, 36px); border: 1px solid rgba(255, 255, 255, .7); border-radius: var(--public-radius-lg); background: var(--public-glass); box-shadow: var(--public-shadow-soft); backdrop-filter: blur(22px); -webkit-backdrop-filter: blur(22px); }
.join-form__header { max-width: 66ch; margin-block-end: 26px; }
.join-form__eyebrow { display: block; margin-block-end: 9px; color: var(--public-muted); font-size: .68rem; font-weight: 400; letter-spacing: .12em; }
.join-form__header h2 { margin: 0; font-size: clamp(1.3rem, 2.5vw, 1.7rem); font-weight: 400; }
.join-form__header p { margin-block: 9px 0; color: var(--public-muted); font-size: .82rem; line-height: 1.7; }
.join-form__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.join-field { min-width: 0; display: grid; gap: 7px; color: var(--public-ink); font-size: .78rem; font-weight: 400; }
.join-field--wide { grid-column: 1 / -1; }
.join-field[hidden] { display: none; }
.join-field input, .join-field textarea { width: 100%; min-height: 44px; padding: 11px 12px; border: 1px solid var(--public-line); border-radius: 12px; color: var(--public-ink); background: rgba(255, 255, 255, .35); font: inherit; }
.join-field textarea { min-height: 104px; resize: vertical; }
.join-field input::placeholder, .join-field textarea::placeholder { color: var(--public-muted); }
.join-field input:focus-visible, .join-field textarea:focus-visible { outline: 2px solid var(--public-accent); outline-offset: 2px; }
.join-field input:invalid:not(:placeholder-shown), .join-field textarea:invalid:not(:placeholder-shown) { border-color: #96514a; }
.join-field .liquid-select { width: 100%; }
.join-consents { display: grid; gap: 13px; margin-block-start: 24px; padding-block-start: 20px; border-block-start: 1px solid var(--public-line); }
.join-consents label { display: flex; align-items: start; gap: 10px; color: var(--public-muted); font-size: .78rem; line-height: 1.65; cursor: pointer; }
.join-consents input { flex: 0 0 17px; width: 17px; height: 17px; margin-block-start: 3px; accent-color: var(--public-ink); }
.join-feedback { margin-block-start: 18px; padding: 12px; border: 1px solid; border-radius: 12px; font-size: .82rem; line-height: 1.6; }
.join-feedback.is-success { color: #315943; border-color: rgba(49, 89, 67, .3); background: rgba(255, 255, 255, .45); }
.join-feedback.is-error { color: #843d36; border-color: rgba(132, 61, 54, .3); background: rgba(255, 255, 255, .45); }
.join-form__actions { display: flex; justify-content: end; margin-block-start: 24px; }
.join-form__actions .primary-action { min-width: 180px; min-height: 44px; padding: 10px 20px; border: 1px solid transparent; border-radius: 999px; background: var(--public-ink); color: var(--public-bg-warm); font: inherit; font-size: .8rem; }

@media (max-width: 620px) {
  .join-hero, .join-shell { width: var(--public-container); }
  .join-hero { margin-block-start: 94px; }
  .join-hero h1 { font-size: 1.9rem; }
  .join-hero p { font-size: .82rem; }
  .join-form { padding: 20px 16px; }
  .join-form__grid { grid-template-columns: 1fr; gap: 16px; }
  .join-field--wide { grid-column: auto; }
  .join-form__actions .primary-action { width: 100%; }
}