.join-wrap{max-width:760px;margin:0 auto;padding:40px 20px 70px}
.join-title{text-align:center;color:#eef2fb}
.join-sub{text-align:center;color:#94a1bd;margin:6px 0 30px}

.join-card{
  background:#141c30;
  background-image:linear-gradient(var(--bright-orange),var(--bright-orange)),linear-gradient(var(--bright-orange),var(--bright-orange)),linear-gradient(var(--bright-orange),var(--bright-orange)),linear-gradient(var(--bright-orange),var(--bright-orange));
  background-repeat:no-repeat;
  background-size:20px 2px,2px 20px,20px 2px,2px 20px;
  background-position:bottom left,bottom left,bottom right,bottom right;
  border:1px solid rgba(255,255,255,.06);
  border-top:3px solid var(--bright-orange);
  border-radius:8px;
  padding:36px 34px;
  box-shadow:0 20px 50px rgba(0,0,0,.35);
}

.join-field{margin-bottom:18px}
.join-field label{display:block;margin-bottom:7px;font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#8ea3c9}
.join-row{display:flex;gap:18px}
.join-row .join-field{flex:1}

.join-input{
  max-width:none;width:100%;text-align:left;margin:0;
  background:#d8dde9;
  border:1px solid rgba(255,165,21,.14);
  border-radius:6px;
  padding:13px 15px;
  color:#1c2539;
  font-size:15px;
  box-shadow:inset 0 1px 2px rgba(0,0,0,.3);
  transition:border-color .15s ease,box-shadow .15s ease,background .15s ease;
}
.join-input::placeholder{color:#5c6b8a}
.join-input:hover{border-color:rgba(255,165,21,.3)}
.join-input:focus{
  border-color:var(--bright-orange);
  background:#d8dde9;
  box-shadow:0 0 0 3px rgba(255,165,21,.15);
}
.join-textarea{padding:13px 15px;line-height:1.5}

select.join-input{
  appearance:none;-webkit-appearance:none;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8'><path d='M1 1l5 5 5-5' stroke='%23FFA515' stroke-width='2' fill='none' stroke-linecap='round' stroke-linejoin='round'/></svg>");
  background-repeat:no-repeat;
  background-position:right 15px center;
  padding-right:38px;
  cursor:pointer;
}

.join-msg{margin:14px 0 0;text-align:center;font-size:14px;font-weight:600;min-height:2px}
.join-msg.ok{color:#42F4B0}
.join-msg.bad{color:#EA4E3D}
.join-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

.join-submit{clip-path:none;width:100%;max-width:none;padding:16px;margin:6px 0 0;border-radius:4px;letter-spacing:.08em}
.join-submit:active{transform:translateY(1px)}

@media(max-width:560px){.join-row{flex-direction:column;gap:0}.join-card{padding:26px 20px}}