/* ============ join / SDR application page ============ */
.join-page .spine{display:none}
.join-page .wrap{padding-left:30px}
.join-page .connect-in{padding-left:0}

.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.hp{position:absolute;left:-9999px;opacity:0;height:0;width:0}

.join-hero{padding:90px 0 96px}
.join-hero h1{font-size:clamp(2.8rem,7vw,5.6rem)}
.join-hero .deck{max-width:56ch;margin-bottom:2.2em}
.join-facts{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;margin:0 0 2.6em;max-width:860px}
.join-facts>div{border-top:2px solid var(--brass);padding-top:16px}
.jf{font-weight:700;margin:0 0 .3em;font-size:1rem}
.jfc{color:var(--muted);font-size:.92rem;margin:0}

/* ---- form shell ---- */
.form-shell{margin-top:2.6em;border:1px solid var(--line);background:rgba(10,42,37,.45);padding:34px 34px 38px;max-width:900px}

/* progress */
.prog{margin-bottom:34px}
.prog-line{height:2px;background:var(--line);position:relative;margin-bottom:14px}
.prog-line span{position:absolute;left:0;top:0;height:100%;width:33.33%;background:var(--brass);transition:width .45s cubic-bezier(.2,.7,.2,1);box-shadow:0 0 10px rgba(201,151,63,.5)}
.prog-steps{list-style:none;display:flex;justify-content:space-between;margin:0;padding:0;font-family:var(--mono);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:#6d8f86}
.prog-steps li.active{color:var(--brass)}
.prog-steps li.done{color:var(--muted)}

/* fields */
.field{margin-bottom:24px}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:22px}
label{display:block;font-size:.92rem;font-weight:500;margin-bottom:8px;color:var(--bone)}
.req{color:var(--brass)}
.opt{font-family:var(--mono);font-size:.66rem;letter-spacing:.06em;color:#6d8f86;text-transform:uppercase;font-weight:400}
.hint{font-family:var(--mono);font-size:.7rem;color:#6d8f86;margin:6px 0 0;line-height:1.6}

input[type=text],input[type=email],input[type=tel],input[type=url],select,textarea{
  width:100%;background:#082220;border:1px solid var(--line);color:var(--bone);
  font-family:var(--body);font-size:.96rem;padding:12px 14px;border-radius:2px;
  transition:border-color .2s,box-shadow .2s;
}
textarea{resize:vertical;line-height:1.6}
select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--brass) 50%),linear-gradient(135deg,var(--brass) 50%,transparent 50%);background-position:calc(100% - 19px) 51%,calc(100% - 13px) 51%;background-size:6px 6px,6px 6px;background-repeat:no-repeat;padding-right:40px}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--brass);box-shadow:0 0 0 3px rgba(201,151,63,.14)}
input::placeholder,textarea::placeholder{color:#4d7168}

input.file{background:transparent;border:1px dashed var(--line);padding:14px;cursor:pointer;font-family:var(--mono);font-size:.8rem}
input.file::file-selector-button{background:var(--line);color:var(--bone);border:0;padding:8px 14px;margin-right:14px;border-radius:2px;font-family:var(--body);font-weight:600;cursor:pointer}

/* checkbox grids */
.checks{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:4px}
.checks label{display:flex;align-items:center;gap:10px;margin:0;padding:11px 13px;border:1px solid var(--line);border-radius:2px;cursor:pointer;font-size:.87rem;font-weight:400;transition:border-color .2s,background .2s}
.checks label:hover{border-color:#2a7a68}
.checks input{appearance:none;width:15px;height:15px;flex:none;border:1.5px solid var(--line);border-radius:2px;background:#082220;position:relative;cursor:pointer;transition:all .2s}
.checks input:checked{background:var(--brass);border-color:var(--brass)}
.checks input:checked::after{content:"";position:absolute;left:4px;top:1px;width:4px;height:8px;border:solid #0A2A25;border-width:0 2px 2px 0;transform:rotate(42deg)}
.checks label:has(input:checked){border-color:var(--brass);background:rgba(201,151,63,.07)}
.checks input:focus-visible{outline:2px solid var(--brass);outline-offset:2px}

.check-inline{display:flex;gap:12px;align-items:flex-start;font-weight:400;font-size:.9rem;color:var(--muted);cursor:pointer}
.check-inline input{appearance:none;width:17px;height:17px;flex:none;margin-top:2px;border:1.5px solid var(--line);border-radius:2px;background:#082220;position:relative;cursor:pointer}
.check-inline input:checked{background:var(--brass);border-color:var(--brass)}
.check-inline input:checked::after{content:"";position:absolute;left:5px;top:2px;width:4px;height:9px;border:solid #0A2A25;border-width:0 2px 2px 0;transform:rotate(42deg)}
.consent{border-top:1px solid var(--line);padding-top:22px;margin-top:30px}

/* errors */
.err{color:#E07A6A;font-family:var(--mono);font-size:.72rem;margin:7px 0 0;display:none}
.err.show{display:block}
.field.invalid input,.field.invalid select,.field.invalid textarea{border-color:#E07A6A}
.field.invalid .checks{outline:1px solid rgba(224,122,106,.4);outline-offset:6px}

/* step nav */
.step-nav{display:flex;justify-content:space-between;align-items:center;gap:14px;margin-top:32px;padding-top:26px;border-top:1px solid var(--line)}
.form-status{font-family:var(--mono);font-size:.78rem;margin:16px 0 0;color:var(--muted);text-align:right}
.form-status.error{color:#E07A6A}

.step{border:0;padding:0;margin:0;min-width:0}
.step[hidden]{display:none}
.step-in{animation:stepIn .4s cubic-bezier(.2,.7,.2,1)}
@keyframes stepIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}

/* success */
.done{text-align:center;padding:26px 0 10px;display:flex;flex-direction:column;align-items:center}
.done h3{font-family:var(--display);font-size:2.2rem;font-weight:400;margin:22px 0 .5em}
.done p{color:var(--muted);max-width:52ch;margin-bottom:2em}

@media(max-width:900px){
  .join-facts{grid-template-columns:1fr}
  .checks{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:620px){
  .form-shell{padding:24px 20px 28px}
  .row2{grid-template-columns:1fr;gap:0}
  .checks{grid-template-columns:1fr}
  .step-nav{flex-direction:column-reverse;align-items:stretch}
  .step-nav .btn{justify-content:center}
  .prog-steps{font-size:.6rem}
}
