/* ============================================================
   FPS — Partners modal · "Become a Partner"

   Linked by index.php only, after hub.css. The form lives inside
   `.hub-modal`, whose own rules style `p` and `h2`; this file
   styles the block BELOW the partner directory and nothing else.
   Tokens come from hub.css (:root) — --line, --cyan, --white,
   --muted, --glass, --display, --body — so a hub palette change
   reaches the form too.
   ============================================================ */

.partner-eoi {
  margin-top: 26px;
  padding-top: 22px;
  border-top: 1px solid var(--line);
}

.partner-eoi__title {
  margin: 0;
  color: #fff;
  font: 900 18px/1.2 var(--display);
  text-transform: uppercase;
  letter-spacing: -.01em;
}

/* (0,2,0) beats `.hub-modal p` (0,1,1) — the hub's 12px/18px paragraph
   rules are sized for the short directory lede, not for this. */
.partner-eoi .partner-eoi__lede {
  margin: 8px 0 0;
  max-width: 58ch;
  color: #bdcbd9;
  font-size: 12px;
  line-height: 1.6;
}

.partner-eoi__flash {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin-top: 16px;
  padding: 11px 13px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: rgba(2, 10, 20, .6);
  color: #dbe7f2;
  font-size: 12px;
  line-height: 1.5;
}
.partner-eoi__flash--success {
  border-color: rgba(16, 185, 129, .45);
  background: rgba(16, 185, 129, .1);
  color: #a7f3d0;
}
.partner-eoi__flash--error {
  border-color: rgba(239, 68, 68, .45);
  background: rgba(239, 68, 68, .1);
  color: #fecaca;
}

.partner-eoi .partner-eoi__signin {
  margin: 14px 0 14px;
  max-width: 58ch;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.6;
}

.partner-eoi__form { margin-top: 16px; }

/* `.hub-form` styles `input` only. The two controls it does not know about
   are given the same box so the four fields read as one set. */
.partner-eoi__form select,
.partner-eoi__form textarea {
  width: 100%;
  min-height: 44px;
  padding: 11px 13px;
  border: 1px solid var(--line);
  border-radius: 10px;
  outline: 0;
  background: rgba(2, 10, 20, .76);
  color: #fff;
  font: inherit;
}
.partner-eoi__form textarea {
  min-height: 108px;
  resize: vertical;
  line-height: 1.55;
}
.partner-eoi__form select:focus,
.partner-eoi__form textarea:focus {
  border-color: var(--cyan);
  box-shadow: 0 0 0 3px rgba(0, 229, 255, .1);
}
.partner-eoi__form select option { background: #0a1222; color: #fff; }

/* Same visible focus the hub's inputs already have, stated explicitly for the
   textarea and select so a keyboard visitor is never left guessing. */
.partner-eoi__form textarea::placeholder { color: #6f8399; }

.partner-eoi__form .hub-btn { justify-self: start; }

@media (max-width: 560px) {
  .partner-eoi__form .hub-btn { justify-self: stretch; width: 100%; }
}