/* ==========================================================================
   The O-1A roadmap pilot (/o1a/, /o1a/thanks/). Loaded after styles.css and
   only on those two pages, so nothing here can move a detention page. Uses
   the shared tokens; adds the form, which no other static page has.
   ========================================================================== */

.o1a-kicker {
  color: var(--secondary);
  font-size: var(--fs-helper);
  line-height: var(--lh-helper);
  font-weight: 700;
  margin-bottom: calc(var(--s-4) - var(--s-8)); /* 32px hero gap → 16px */
}

.prose ol.o1a-criteria {
  padding-left: var(--s-6);
}
.prose ol.o1a-criteria li + li { margin-top: var(--s-2); }

/* --- The form band ------------------------------------------------------ */

.o1a-form-band {
  background: var(--tint-section);
  border-block: 1px solid var(--border);
  padding-block: var(--pad-block);
  scroll-margin-top: var(--s-16);
}

.o1a-form-band h2 {
  font-size: var(--fs-section-title);
  line-height: var(--lh-section-title);
}

.o1a-form-intro {
  margin-top: var(--s-3);
  max-width: var(--measure);
  color: var(--muted);
  font-size: var(--fs-helper);
  line-height: var(--lh-helper);
}

.o1a-alert {
  margin-top: var(--s-6);
  max-width: var(--measure);
  padding: var(--s-4);
  border: 1px solid var(--time-border);
  border-radius: var(--radius);
  background: var(--time-tint);
  color: var(--time-text);
  font-weight: 700;
}
.o1a-alert[hidden] { display: none; }

.o1a-form {
  display: flex;
  flex-direction: column;
  gap: var(--s-8);
  margin-top: var(--s-8);
  max-width: var(--measure);
}

.o1a-field {
  display: flex;
  flex-direction: column;
  gap: var(--s-2);
  margin: 0;
  padding: 0;
  border: 0;
  min-width: 0;
}

.o1a-field > label:not(.o1a-choice),
.o1a-field > legend {
  font-weight: 700;
  padding: 0;
}
/* A legend does not take part in its fieldset's flex gap. */
.o1a-field > legend { margin-bottom: var(--s-2); }

.o1a-req {
  color: var(--muted);
  font-size: var(--fs-helper);
  font-weight: 400;
}

.o1a-hint {
  color: var(--muted);
  font-size: var(--fs-helper);
  line-height: var(--lh-helper);
}

.o1a-field input[type="email"],
.o1a-field input[type="text"],
.o1a-field input[type="month"],
.o1a-field select,
.o1a-field textarea {
  width: 100%;
  min-height: var(--tap);
  padding: var(--s-3);
  border: 1px solid var(--muted);
  border-radius: var(--radius);
  background: var(--surface-card);
  color: var(--ink);
  font: inherit;
}
.o1a-field textarea { resize: vertical; }

.o1a-field input[type="file"] {
  font: inherit;
  font-size: var(--fs-helper);
  min-height: var(--tap);
}

.o1a-choice {
  display: flex;
  align-items: flex-start;
  gap: var(--s-3);
  min-height: var(--tap);
  padding-block: var(--s-2);
  font-weight: 400;
  cursor: pointer;
}
.o1a-choice input {
  flex: none;
  width: 22px;
  height: 22px;
  margin: 3px 0 0;
  accent-color: var(--primary);
}
.o1a-consent { font-weight: 400; }

/* Hidden from people, still in the form for bots that fill every field. */
.o1a-hp {
  position: absolute;
  left: -10000px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

.o1a-form .btn[disabled] { opacity: .7; cursor: progress; }