/* Final CTA — accent-coloured card with a single big "APPLY NOW" button. */

const FinalCTA = () => {
  const { StarSpark } = window.AAS;

  return (
    <section className="final-cta">
      <div className="container">
        <div className="final-cta-card">
          <div className="eyebrow">LET'S GO</div>
          <h2 className="final-cta-title">
            Let's make your <span className="it">dream app.</span>
          </h2>
          <p className="final-cta-sub">
            You've already done the hard part in building an audience that trusts you. Let's give them an exciting app they want to everyday!
          </p>
          <div className="final-cta-actions">
            <a href="https://tally.so/r/NpM1RW" target="_blank" rel="noopener" className="pill-btn lg final-cta-btn">APPLY NOW</a>
          </div>

          {/* Sparkles — desktop set + mobile-only set, toggled via CSS. */}
          <span className="final-cta-spark final-cta-spark--1"><StarSpark size={22}/></span>
          <span className="final-cta-spark final-cta-spark--2"><StarSpark size={16}/></span>
          <span className="final-cta-spark final-cta-spark--3"><StarSpark size={12}/></span>
          <span className="final-cta-spark final-cta-spark--4"><StarSpark size={14}/></span>
          <span className="final-cta-spark final-cta-spark--mob final-cta-spark--mob-1"><StarSpark size={14}/></span>
          <span className="final-cta-spark final-cta-spark--mob final-cta-spark--mob-2"><StarSpark size={12}/></span>
        </div>
      </div>
    </section>
  );
};

window.AAS = window.AAS || {};
window.AAS.FinalCTA = FinalCTA;