/* =============================================================
   cta.css
   Final CTA section. Green background, white text, email form.
   ============================================================= */

.cta {
  background: var(--color-accent);
  color: #fff;
  text-align: center;
}

.cta__inner {
  max-width: var(--content-narrow-width);
  margin: 0 auto;
}

.cta__headline {
  font-size: clamp(36px, 5vw, 54px);
  color: #fff;
  margin-bottom: 20px;
  letter-spacing: 0.005em;
}

.cta__sub {
  font-size: 18px;
  line-height: 1.55;
  color: rgba(255, 255, 255, 0.85);
  margin-bottom: 40px;
}

/* Email form variant on dark background */
.cta .email-form {
  margin: 0 auto;
  background: rgba(255, 255, 255, 0.12);
  border-color: rgba(255, 255, 255, 0.2);
}

.cta .email-form__input {
  color: #fff;
}

.cta .email-form__input::placeholder {
  color: rgba(255, 255, 255, 0.65);
}

.cta .email-form__button {
  background: #fff;
  color: var(--color-text-primary);
}

.cta .email-form__button:hover {
  background: var(--color-bg-alt);
}

.cta .email-form__message {
  color: #fff;
}

@media (max-width: 540px) {
  .cta .email-form {
    background: transparent;
    border: none;
  }

  .cta .email-form__input {
    color: var(--color-text-primary);
  }

  .cta .email-form__input::placeholder {
    color: var(--color-text-secondary);
  }
}