Pricing ad in the signup page

Paste the below html

<!-- CLIENTBASE – LEFT SIGNUP PANEL (FINAL, RESPONSIVE HIGHLIGHT BANNER) -->
<link href="https://fonts.googleapis.com/css2?family=Lexend:wght@500;600;700&family=Poppins:wght@400;500&display=swap" rel="stylesheet">
<style>
  :root{
    --cb-red:#d62828;
    --cb-burgundy:#821616;
    --cb-ink:#111111;
    --cb-text:#333333;
    --cb-muted:#7a7a7a;
    --cb-charcoal:#2a2e35;
  }
  .cb-offer-left{
    font-family:'Poppins',Arial,sans-serif;
    color:var(--cb-text);
    background:#ffffff;
    max-width:720px;
    padding:56px 32px 40px 32px;
  }
  .cb-kicker{
    font-family:'Lexend',Arial,sans-serif;
    font-weight:600;
    font-size:11px;
    letter-spacing:1.5px;
    text-transform:uppercase;
    color:var(--cb-burgundy);
    margin:0 0 10px 0;
  }
  .cb-headline{
    font-family:'Lexend',Arial,sans-serif;
    font-weight:700;
    line-height:1.2;
    font-size:38px;
    color:var(--cb-ink);
    margin:0 0 18px 0;
  }
  .cb-headline .accent{ color:var(--cb-red); }
  .cb-body{
    font-size:16px;
    line-height:1.7;
    margin:0 0 22px 0;
    max-width:600px;
  }
  /* ===== Highlight Banner (Responsive, fits content) ===== */
  .cb-highlight {
    display:inline-flex;
    align-items:center;
    justify-content:flex-start;
    gap:10px;
    background:linear-gradient(90deg,var(--cb-red) 0%,var(--cb-burgundy) 100%);
    color:#fff;
    padding:16px 22px;
    border-radius:14px;
    font-family:'Lexend',Arial,sans-serif;
    font-weight:600;
    font-size:15px;
    margin:18px 0;
    box-shadow:0 4px 12px rgba(214,40,40,0.3);
    width:fit-content;
    max-width:100%;
    flex-wrap:wrap;
  }
  .cb-highlight span{
    background:#fff;
    color:var(--cb-red);
    padding:4px 10px;
    border-radius:8px;
    font-size:13px;
    font-weight:600;
    letter-spacing:0.3px;
  }
  .cb-highlight svg{
    width:22px;
    height:22px;
    fill:#fff;
    flex-shrink:0;
  }
  /* hover animation (optional subtle glow) */
  @keyframes pulseGlow{
    from{box-shadow:0 0 10px rgba(214,40,40,0.2);}
    to{box-shadow:0 0 20px rgba(214,40,40,0.4);}
  }
  .cb-highlight:hover{
    animation:pulseGlow 2.5s infinite alternate;
  }
  .cb-micro{
    font-size:13px;
    color:var(--cb-muted);
    margin:0 0 14px 0;
  }
  .cb-urgency{
    font-family:'Lexend',Arial,sans-serif;
    font-weight:600;
    font-size:14px;
    color:var(--cb-red);
    margin:8px 0 0 0;
  }
  @media (max-width:600px){
    .cb-headline{ font-size:32px; }
    .cb-highlight{ padding:14px 18px; font-size:14px; }
  }
</style>
<div class="cb-offer-left">
  <p class="cb-kicker">Limited time</p>
  <h1 class="cb-headline">
    <span class="accent">3-Month Free Trial</span> — then $199/mo for unlimited users, clients & requests.
  </h1>
  <p class="cb-body">
    Manage every client and request in one place — track progress, assign tasks, and stay on top of deadlines without the chaos of scattered emails and spreadsheets.
  </p>
  <!-- Highlight banner that fits text width -->
  <div class="cb-highlight">
    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 2a10 10 0 1 0 10 10A10.011 10.011 0 0 0 12 2Zm-1 15-5-5 1.41-1.41L11 14.17l5.59-5.58L18 10Z"/></svg>
    Free for 90 Days • <span>Lifetime Rate Guarantee</span>
  </div>
  <p class="cb-micro">No credit card required</p>
  <p class="cb-urgency">Offer ends soon! Activate your workspace today.</p>
</div>