<div class="newsletter">
  <div class="newsletter-text">
    <h3>Stay in the loop</h3>
    <p class="input-hint">No spam. Unsubscribe anytime.</p>
  </div>
  <form class="newsletter-form" onsubmit="return false">
    <input class="input" type="email" placeholder="your@email.com" required />
    <button type="submit" class="btn btn-primary">Subscribe</button>
  </form>
</div>

<style>
.newsletter {
  background: var(--surface); border: 1px solid var(--border);
  border-radius: 1rem; padding: 2rem;
  display: flex; align-items: center; justify-content: space-between;
  gap: 2rem; flex-wrap: wrap;
}
.newsletter-form { display: flex; gap: 0.75rem; flex: 1; min-width: 280px; }
.newsletter-form .input { flex: 1; }
</style>