/* qualifier.jsx — "Door policy" band: a warm, positive entry pitch.
   You've got Apple + Claude → you've already made the right calls. Now make one more. */
(function(){
  const I = window.Icons;

  function Qualifier(){
    return (
      <section className="qualifier" id="qualify">
        <div className="wrap q-wrap">
          <div className="q-head reveal">
            <span className="q-eyebrow"><span className="q-dot"></span>Door policy</span>
            <h2 className="q-title">Two good calls in.<br/><span className="on">Here&rsquo;s the easy third.</span></h2>
            <p className="q-lead">You&rsquo;re on an iPhone or a Mac, you run Claude, and you&rsquo;ve got at least one Gmail or Outlook&hairsp;/&hairsp;Hotmail inbox. That&rsquo;s the whole guest list &mdash; and you&rsquo;re already on it. <b>What&rsquo;s On runs right where you already are, launching first on Apple.</b> So carry on: you&rsquo;re in exactly the right place, and about to change how your whole week feels.</p>
          </div>

          <div className="q-tickets reveal">
            <div className="q-ticket cleared">
              <span className="q-check"><I.Check/></span>
              <div className="q-tk-body">
                <div className="q-tk-k">{'iPhone & / or Mac'}</div>
                <div className="q-tk-v">The home it runs in</div>
              </div>
              <span className="q-stamp">Cleared</span>
            </div>

            <div className="q-ticket cleared">
              <span className="q-check"><I.Check/></span>
              <div className="q-tk-body">
                <div className="q-tk-k">A Claude account</div>
                <div className="q-tk-v">Pro plan ideally &mdash; the brain it thinks with</div>
              </div>
              <span className="q-stamp">Cleared</span>
            </div>

            <div className="q-ticket cleared">
              <span className="q-check"><I.Check/></span>
              <div className="q-tk-body">
                <div className="q-tk-k">A Gmail or Outlook inbox</div>
                <div className="q-tk-v">At least one &mdash; Gmail, Outlook or Hotmail</div>
              </div>
              <span className="q-stamp">Cleared</span>
            </div>

            <a className="q-ticket your-move" href="#download">
              <span className="q-check accent"><I.ArrowRight/></span>
              <div className="q-tk-body">
                <div className="q-tk-k">Get What&rsquo;s On</div>
                <div className="q-tk-v">Your move &mdash; this one&rsquo;s easy</div>
              </div>
              <span className="q-stamp accent">Now showing</span>
            </a>
          </div>

          <p className="q-foot reveal">// Other accounts too? Forward them into your Gmail or Outlook &mdash; What&rsquo;s On triages them and helps everyone move across to your main inbox.</p>
        </div>
      </section>
    );
  }

  Object.assign(window, { Qualifier });
})();
