/* Block: newsletter-cta — scoped
 *
 * Gravity Forms emits its own theme styles (Orbital or otherwise) and they
 * load at unpredictable cascade order. We override with !important on the
 * structural rules — the only reliable way to guarantee the inline pill
 * layout regardless of GF version, theme, or load order.
 */

.newsletter-cta {
  text-align: center;
  max-width: 720px;
  margin-inline: auto;
}

.newsletter-cta__heading {
  font-size: var(--fs-900);
  margin-bottom: var(--sp-200);
}

.newsletter-cta__subheading {
  color: var(--surface-fg-muted);
  font-size: var(--fs-300);
  margin-bottom: var(--sp-500);
}

.newsletter-cta__form {
  margin-top: var(--sp-400);
}

.newsletter-cta__small-print {
  margin-top: var(--sp-200);
  font-size: var(--fs-100);
  color: var(--surface-fg-muted);
}

.newsletter-cta__notice {
  padding: var(--sp-300);
  border-radius: var(--r-md);
  background: rgb(255 255 255 / 0.05);
  color: var(--surface-fg-muted);
  font-size: var(--fs-200);
}

/* ─── Inline pill form ─────────────────────────────────────
 * Make the <form> itself the pill; flex children are the input column
 * (.gform_body) and the submit (.gform_footer).
 */
.newsletter-cta .gform_wrapper {
  width: 100%;
}

.newsletter-cta .gform_wrapper form {
  background: #ffffff !important;
  border-radius: var(--r-pill) !important;
  padding: var(--sp-100) !important;
  display: flex !important;
  align-items: center !important;
  gap: var(--sp-100) !important;
  max-width: 540px;
  margin-inline: auto !important;
  box-shadow: var(--shadow-sm);
}

.newsletter-cta .gform_wrapper .gform_body,
.newsletter-cta .gform_wrapper .gform-body {
  flex: 1 !important;
  min-width: 0 !important;
  margin: 0 !important;
}

.newsletter-cta .gform_wrapper .gform_fields {
  display: block !important;
  gap: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  list-style: none !important;
}

.newsletter-cta .gform_wrapper .gfield {
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
  max-width: none !important;
  grid-column: 1 / -1 !important;
}

.newsletter-cta .gform_wrapper .gfield_label {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
}

.newsletter-cta .gform_wrapper input[type="email"],
.newsletter-cta .gform_wrapper input[type="text"] {
  border: 0 !important;
  background: transparent !important;
  width: 100% !important;
  padding: var(--sp-200) var(--sp-300) !important;
  font-family: var(--ff-body) !important;
  font-size: var(--fs-300) !important;
  color: var(--color-fg-default) !important;
  outline: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  height: auto !important;
  line-height: 1.4 !important;
}
.newsletter-cta .gform_wrapper input::placeholder { color: var(--color-fg-muted); opacity: 1; }

.newsletter-cta .gform_wrapper .gform_footer {
  margin: 0 !important;
  padding: 0 !important;
  flex-shrink: 0 !important;
  display: flex !important;
  align-items: center !important;
}

.newsletter-cta .gform_wrapper .gform_footer input[type="submit"],
.newsletter-cta .gform_wrapper .gform_footer button[type="submit"] {
  background: var(--color-primary) !important;
  color: #ffffff !important;
  border: 0 !important;
  border-radius: var(--r-pill) !important;
  padding: var(--sp-200) var(--sp-400) !important;
  margin: 0 !important;
  font-family: var(--ff-display) !important;
  font-weight: var(--fw-medium) !important;
  font-size: var(--fs-300) !important;
  line-height: 1.2 !important;
  cursor: pointer !important;
  white-space: nowrap !important;
  height: auto !important;
  width: auto !important;
  min-height: 0 !important;
  transition: background var(--t-fast) !important;
}
.newsletter-cta .gform_wrapper .gform_footer input[type="submit"]:hover,
.newsletter-cta .gform_wrapper .gform_footer button[type="submit"]:hover {
  background: #e63629 !important;
}

/* Validation messages */
.newsletter-cta .gform_wrapper .gform_validation_errors,
.newsletter-cta .gform_wrapper .gfield_validation_message,
.newsletter-cta .gform_wrapper .validation_message {
  margin-top: var(--sp-200);
  padding: var(--sp-200);
  font-size: var(--fs-100);
  color: var(--color-red);
  text-align: center;
  background: transparent;
  border: 0;
}

/* AJAX confirmation */
.newsletter-cta .gform_confirmation_message {
  text-align: center;
  padding: var(--sp-300);
  border-radius: var(--r-md);
  background: var(--surface-card-bg);
  color: var(--surface-fg);
}
