/* The October free-stuff offer and signup forms built for older readers (owner, 2026-10-12). "Free" is allowed again
   and the offer is "October only: free stuff for you and your friends." 68% of ad spend reaches people 65 and older, so
   every signup form gets an 18px email field and an 18px button, each at least 56px tall, one above the other at every
   width, with strong contrast and a readable line under the button about the 6-digit code.
   Text and CSS only: lifestyleLanding.tsx still finds every form by its id, .signup-row, input[type=email],
   button[type=submit] and .form-status, and mounts its security check right after .signup-row. */

/* One field, one big button. */
form.signup-form .signup-row {
  flex-direction: column;
  align-items: stretch;
  gap: 10px;
}
form.signup-form .signup-row > input[type=email] {
  flex: none;
  width: 100%;
  min-height: 58px;
  padding: 14px 16px;
  border: 2px solid #6b7175;
  border-radius: 0;
  background: #fff;
  color: var(--ink);
  font-size: 18px;
  line-height: 1.3;
}
form.signup-form .signup-row > input[type=email]::placeholder { color: #5c6266; opacity: 1; }
form.signup-form .signup-row > input[type=email]:focus-visible { border-color: var(--aelo-blue); outline: 3px solid var(--aelo-blue); outline-offset: 2px; }
form.signup-form .signup-row > button[type=submit] {
  flex: none;
  width: 100%;
  max-width: none;
  min-height: 58px;
  justify-content: center;
  gap: 0;
  padding: 14px 20px;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: -.005em;
  text-align: center;
  white-space: normal;
  text-wrap: balance;
}
form.signup-form .signup-row > button[type=submit]:focus-visible { outline: 3px solid var(--aelo-blue); outline-offset: 3px; }

/* "Next, we email you a 6-digit code. Type it in and your free invite link is ready." (form p.… outranks section rules
   such as .editorial-link p:not(.eyebrow), which would shrink it to 14px in the research band on phones.) */
form.signup-form p.signup-helper {
  margin: 12px 0 0;
  font-size: 16px;
  line-height: 1.45;
  color: #2f3437;
  text-wrap: pretty;
}
.signup-form .signup-secondary { margin-top: 6px; }
.signup-form .signup-secondary .quiet-button { font-size: 15px; }
/* The form's own result line and its follow-up links (the adapter's injected rules set 13 to 14px). */
form.signup-form p.form-status,
form.signup-form p.form-status[data-live-outcome] { font-size: 16px; line-height: 1.5; }
.signup-form > .lifestyle-live-actions { gap: 6px 22px; font-size: 16px; }
.signup-form > .lifestyle-live-actions :is(a, button) { display: inline-flex; align-items: center; min-height: 44px; }

/* Hero: the offer sits right above the first form. */
#top .hero-offer {
  width: 100%;
  max-width: 510px;
  margin: 20px 0 0;
  font-size: clamp(19px, 1.5vw, 22px);
  font-weight: 750;
  line-height: 1.35;
  letter-spacing: -.01em;
  color: var(--wine);
  text-wrap: balance;
}
#top .hero-description,
#top .hero-invite { font-size: clamp(18px, 1.32vw, 20px); line-height: 1.55; }
#top .hero-offer + .hero-invite { margin-top: 8px; }
@media (max-width: 900px) {
  #top .hero-offer { max-width: none; margin-top: 18px; }
}

/* Rewards: "Invite friends. Get free stuff." Every product tier carries a FREE tag. */
.referral-heading .referral-intro { font-size: 18px; line-height: 1.6; }
.referral-stages .referral-stage .referral-copy > p.referral-value {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 10px;
  font-size: 15px;
  letter-spacing: .08em;
}
.referral-free {
  display: inline-block;
  padding: 5px 10px 4px;
  background: var(--wine);
  color: #fff;
  font-size: 14px;
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.referral-stage-start .referral-copy .text-link { font-size: 16px; }
.referral-footer-invite > p { font-size: 18px; line-height: 1.6; color: var(--ink); }

/* The research band, the FAQ answers' inline forms and the closing invitation. */
.research-feature .research-signup-copy > p { font-size: 18px; line-height: 1.6; color: var(--ink); }
.faq-group .answer .faq-signup-title { font-size: 19px; font-weight: 750; line-height: 1.35; color: var(--wine); }
.faq-group .answer .faq-signup-description { font-size: 18px; line-height: 1.55; color: var(--ink); }
.closing-copy > p { font-size: clamp(18px, 1.4vw, 20px); }