/* The weekly-email form on the plain pages (Work, About), in the Object Atlas sheet style: an open band under one ink rule,
   a pill field and the pill action the page's other buttons use. */
main.page .mq-signup { display: grid; gap: var(--wp-3); max-width: 40rem; margin: var(--cn-space-12) 0 0; padding: var(--wp-6) 0 0; background: transparent; border: 0; border-top: 1px solid var(--wp-ink); }
main.page .mq-signup p { margin: 0; max-width: 50ch; }
/* inside a page section: the content column, full width, spaced by the section gap */
main.page .page-section > .mq-signup { grid-column: -2 / -1; max-width: none; margin: var(--wp-4) 0 0; }
main.page .mq-signup-title { font: 600 1.5rem/1.1 var(--wp-font-display); letter-spacing: -0.01em; text-wrap: balance; }
/* one field; the button sits beside it on wide screens and under it on phones */
main.page .mq-signup-label { font-weight: 700; line-height: 1.25; margin-bottom: -.25rem; }
main.page .mq-signup-row { display: flex; flex-wrap: wrap; gap: var(--wp-2); }
main.page .mq-signup-row input { flex: 1 1 14rem; min-width: 0; min-height: var(--wp-tap); padding: 0 var(--wp-4); background: var(--wp-paper); border: 1px solid var(--wp-muted); border-radius: var(--wp-pill); color: var(--wp-ink); font: inherit; }
/* form. outranks the global pill button */
main.page form.mq-signup .mq-signup-row button { flex: 0 0 auto; min-height: var(--wp-tap); padding: 0 var(--wp-6); background: var(--wp-bio); border: 1px solid var(--wp-bio); border-radius: var(--wp-pill); color: var(--wp-on-bio); cursor: pointer; font-family: inherit; font-size: 1rem; font-weight: 600; line-height: 1.3; }
main.page form.mq-signup .mq-signup-row button:hover { background: var(--oa-blue-deep); border-color: var(--oa-blue-deep); color: var(--oa-paper); }
main.page .mq-signup-fine { color: var(--wp-muted); font-size: .9375rem; line-height: 1.5; overflow-wrap: anywhere; }
main.page .mq-signup-fine a { color: inherit; }
@container page (max-width: 30rem) {
  main.page .mq-signup { padding: var(--wp-4) 0 0; }
  main.page .mq-signup-row input, main.page form.mq-signup .mq-signup-row button { flex-basis: 100%; }
}
