/* ============================================================
   NEWSLETTER PAGE + SHARED INNER PAGE STYLES
   ============================================================ */

.page-header--newsletter {
  background: linear-gradient(135deg, var(--bg-deep) 0%, var(--teal) 40%, var(--plum) 100%);
  min-height: 260px;
}

.newsletter-page {
  max-width: 720px;
  margin: 0 auto;
}

.newsletter-page__intro {
  text-align: center;
  margin-bottom: 2.5rem;
  font-size: 1.1rem;
  color: var(--body-muted);
}

.newsletter-page__form {
  margin-bottom: 2.5rem;
}

/* ---- Kit form — surgical fixes only -----------------------
   We only override what our global CSS breaks.
   Kit's own inline styles handle colours; we restore
   layout, inputs, buttons and typography to Kit defaults.
------------------------------------------------------------ */

/* Headings: restore Kit's own inline colour/size, undo our display font */
.formkit-form h2 {
  font-family: sans-serif !important;
  font-size: 1.5em !important;
  font-weight: 700 !important;
  color: inherit !important;
  letter-spacing: normal !important;
  line-height: 1.3 !important;
  margin: 0 0 20px !important;
}

/* Paragraphs: restore Kit defaults, undo our margin */
.formkit-form p {
  font-family: sans-serif !important;
  font-size: inherit !important;
  color: inherit !important;
  margin-bottom: 0 !important;
  line-height: 1.5 !important;
}

/* Inputs: restore white background, dark text, Kit border */
.formkit-form .formkit-input {
  background: #ffffff !important;
  color: rgb(2, 31, 53) !important;
  border: 1px solid rgb(2, 31, 53) !important;
  border-radius: 4px !important;
  font-family: sans-serif !important;
  font-size: 15px !important;
  padding: 12px !important;
  width: 100% !important;
  box-shadow: none !important;
  margin: 0 !important;
}

.formkit-form .formkit-input:focus {
  border-color: #1677be !important;
  box-shadow: none !important;
  outline: none !important;
}

/* Submit button: restore Kit's pill shape and colours */
.formkit-form .formkit-submit {
  background-color: rgb(240, 182, 255) !important;
  color: rgb(2, 31, 53) !important;
  border: none !important;
  border-radius: 24px !important;
  font-family: sans-serif !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  letter-spacing: normal !important;
  text-transform: none !important;
  padding: 0 !important;
  width: 100% !important;
  cursor: pointer !important;
  overflow: hidden !important;
  margin-bottom: 15px !important;
}

.formkit-form .formkit-submit > span {
  display: block !important;
  padding: 12px 24px !important;
  background: none !important;
}

.formkit-form .formkit-submit:hover > span {
  background-color: rgba(0,0,0,0.1) !important;
}

/* Remove our ::before hover sweep from inside Kit */
.formkit-form .formkit-submit::before {
  display: none !important;
}

/* Anchor links inside Kit: restore default colour */
.formkit-form a {
  color: inherit !important;
}
.formkit-form a:hover {
  color: inherit !important;
}

/* Fields spacing */
.formkit-form .formkit-field {
  margin: 0 0 15px 0 !important;
}

/* Guarantee text */
.formkit-form .formkit-guarantee {
  font-family: sans-serif !important;
  font-size: 13px !important;
  margin: 0 0 15px 0 !important;
}

.newsletter-page__whitelist-note {
  text-align: center;
  padding: 1.5rem;
  border: 1px solid var(--border);
  border-radius: 4px;
  background: rgba(2,56,92,0.2);
}

.newsletter-page__whitelist-note p {
  margin: 0.5rem 0 0;
  font-size: 0.95rem;
}
