/* The Pulse — public conversion page. Navy + gold body, but the AIReady shared
   header/footer (green chrome). Light sections break up the navy. Paid membership:
   $600 per quarter, biweekly. Voice: no contractions, no em dashes, never "weekly". */
(function () {
  const { Button, Card } = window.GaiaAlliesDesignSystem_6e4515;
  const wrap = { maxWidth: 1180, margin: '0 auto', padding: '0 40px' };
  const JOIN = 'https://calendly.com/amy-adams/thepulse';
  const eb = { fontSize: 11.5, fontWeight: 700, letterSpacing: '.18em', textTransform: 'uppercase', color: 'var(--gold-h)' };
  const ebLight = { fontSize: 11.5, fontWeight: 700, letterSpacing: '.18em', textTransform: 'uppercase', color: 'var(--gold-deep)' };
  const gold = { color: 'var(--gold-h)', fontStyle: 'italic' };
  const goldD = { color: 'var(--gold-deep)', fontStyle: 'italic' };
  const ink = '#15293c';
  const inkSoft = '#46586d';
  const navyCard = { background: 'rgba(233,237,243,.05)', border: '1px solid rgba(233,237,243,.13)' };

  function HeroPulse() {
    return (
      <section id="top" className="s-navy-deep" style={{ paddingBlock: 102, background: 'radial-gradient(120% 120% at 82% -10%, rgba(201,162,74,.13), rgba(201,162,74,0) 55%), var(--navy-deep)' }}>
        <div style={wrap}>
          <div style={eb}>The Pulse · Members</div>
          <h1 style={{ fontSize: 'clamp(2.5rem, 4.8vw, 3.9rem)', lineHeight: 1.22, margin: '20px 0 0', maxWidth: '24ch', color: 'var(--frost)' }}>
            Proprietary intelligence on AI,<br /><em style={gold}>written for your firm.</em>
          </h1>
          <p className="lead" style={{ marginTop: 40, maxWidth: 540, color: 'var(--fg-soft)' }}>
            Most firms are drowning in AI news, and none of it is written for them. The Pulse cuts through the noise and hands you the few moves that change revenue and risk.
          </p>
          <div style={{ marginTop: 30 }}>
            <Button variant="primary" size="lg" href={JOIN}>Join the Pulse</Button>
          </div>
        </div>
      </section>
    );
  }

  function SampleRead() {
    return (
      <section className="s-navy" style={{ paddingBlock: 96 }}>
        <div style={{ ...wrap, display: 'grid', gridTemplateColumns: '0.82fr 1.18fr', gap: 'clamp(32px, 5vw, 60px)', alignItems: 'center' }}>
          <div>
            <div style={eb}>Proprietary intelligence</div>
            <h2 style={{ marginTop: 18, color: 'var(--frost)', maxWidth: '18ch' }}>Every read ends in a decision, <em style={gold}>and a deliverable.</em></h2>
            <p className="lead" style={{ marginTop: 16, maxWidth: 400, color: 'var(--fg-soft)' }}>
              Not a digest to wade through. The shift, what it means for your firm, and a deliverable you can take action on.
            </p>
          </div>
          <div style={{ ...navyCard, borderRadius: 'var(--radius-lg)', overflow: 'hidden', boxShadow: '0 28px 64px -30px rgba(0,0,0,.65)' }}>
            <div style={{ padding: '16px 26px', borderBottom: '1px solid rgba(233,237,243,.13)', display: 'flex', justifyContent: 'space-between', alignItems: 'center' }}>
              <span style={{ fontFamily: 'var(--font-display)', fontWeight: 500, fontSize: '1.05rem', color: 'var(--frost)' }}><em style={{ ...gold, fontSize: '.8em' }}>The</em> Pulse</span>
              <span style={{ fontSize: 11, fontWeight: 700, letterSpacing: '.12em', textTransform: 'uppercase', color: 'var(--gold-h)' }}>Sample edition</span>
            </div>
            <div style={{ padding: 26, display: 'flex', flexDirection: 'column', gap: 18 }}>
              {[
                ['The shift', 'A major e-discovery platform ships AI that auto-drafts first-pass deposition summaries.', 'var(--frost)'],
                ['Why it matters to your firm', 'Work your team bills hours on can now run in minutes, on the matters you already handle.', 'var(--fg-soft)'],
                ['The move', 'Pilot it on one closed matter this cycle, measure the hours saved, then set a review-and-sign rule before it touches active files.', 'var(--frost)'],
              ].map(([k, v, c]) => (
                <div key={k}>
                  <div style={{ fontSize: 11, fontWeight: 700, letterSpacing: '.14em', textTransform: 'uppercase', color: 'var(--gold-h)', marginBottom: 6 }}>{k}</div>
                  <p style={{ margin: 0, fontSize: 15, color: c, lineHeight: 1.5 }}>{v}</p>
                </div>
              ))}
              <div style={{ borderTop: '1px solid rgba(233,237,243,.13)', paddingTop: 18, marginTop: 4 }}>
                <div style={{ fontSize: 10, fontWeight: 700, letterSpacing: '.14em', textTransform: 'uppercase', color: 'var(--gold-h)', marginBottom: 12 }}>The deliverable, prepared for your firm</div>
                <div style={{ display: 'flex', alignItems: 'center', gap: 14, justifyContent: 'space-between', flexWrap: 'wrap' }}>
                  <div style={{ display: 'flex', alignItems: 'center', gap: 12 }}>
                    <svg width="34" height="42" viewBox="0 0 34 42" fill="none" style={{ flexShrink: 0 }} aria-hidden="true">
                      <path d="M3 3.5A2.5 2.5 0 0 1 5.5 1H21l10 10v27.5A2.5 2.5 0 0 1 28.5 41h-23A2.5 2.5 0 0 1 3 38.5V3.5Z" fill="rgba(233,237,243,.07)" stroke="rgba(233,237,243,.3)" strokeWidth="1.2" />
                      <path d="M21 1v8a2 2 0 0 0 2 2h8" stroke="rgba(220,183,94,.75)" strokeWidth="1.2" fill="none" />
                      <path d="M8 18h15M8 23.5h15M8 29h9" stroke="var(--gold-h)" strokeWidth="1.4" strokeLinecap="round" />
                    </svg>
                    <div>
                      <div style={{ fontWeight: 600, fontSize: 14, color: 'var(--frost)' }}>Your AI pilot one-pager</div>
                      <div style={{ fontSize: 12.5, color: 'var(--fg-soft)', marginTop: 2 }}>A ready-to-run plan, yours to edit and put to work.</div>
                    </div>
                  </div>
                  <span style={{ display: 'inline-flex', alignItems: 'center', gap: 7, background: 'var(--gold)', color: '#0c1722', fontSize: 12.5, fontWeight: 600, padding: '9px 15px', borderRadius: 999, whiteSpace: 'nowrap' }}>Download the one-pager →</span>
                </div>
              </div>
            </div>
          </div>
        </div>
      </section>
    );
  }

  function Allies() {
    return (
      <section className="s-white" style={{ paddingBlock: 96 }}>
        <div style={{ ...wrap, display: 'grid', gridTemplateColumns: '0.85fr 1.15fr', gap: 'clamp(32px, 5vw, 64px)', alignItems: 'start' }}>
          <div>
            <div style={ebLight}>Our Allies network</div>
            <h2 style={{ marginTop: 18, color: ink, maxWidth: '15ch' }}>When a read calls for action, <em style={goldD}>we open the door.</em></h2>
          </div>
          <div style={{ maxWidth: '58ch' }}>
            <p style={{ margin: 0, fontSize: 16.5, lineHeight: 1.65, color: inkSoft }}>
              Some reads are worth more than information. When one of yours calls for a conversation, an investment, or a partner, we make a warm introduction into our Allies network: invitation only, reaching operators and founders across startups, business leaders, and Ivy League academia.
            </p>
          </div>
        </div>
      </section>
    );
  }

  function Membership() {
    const faq = [
      ['What you get', 'A one-to-one onboarding call, then one quarter of editions read against your firm.'],
      ['How often', 'Every other week, delivered personally, so each edition stays short and yours.'],
      ['Cancel anytime', 'Membership runs by the quarter. Choose not to renew whenever you like.'],
    ];
    return (
      <section id="join" className="s-navy-deep" style={{ paddingBlock: 98 }}>
        <div style={{ ...wrap, textAlign: 'center', display: 'flex', flexDirection: 'column', alignItems: 'center' }}>
          <div style={eb}>Membership</div>
          <h2 style={{ marginTop: 18, color: 'var(--frost)' }}><em style={gold}>$600</em> per quarter.</h2>
          <p className="lead" style={{ marginTop: 16, textAlign: 'center', maxWidth: 560, color: 'var(--fg-soft)' }}>
            Your membership covers a one-to-one onboarding call and one quarter of editions, delivered personally every other week. Paid at booking, in one step.
          </p>
          <div style={{ marginTop: 30 }}>
            <Button variant="primary" size="lg" href={JOIN}>Join the Pulse</Button>
          </div>
          <div style={{ display: 'grid', gridTemplateColumns: 'repeat(3, 1fr)', gap: 28, marginTop: 60, textAlign: 'left', width: '100%', maxWidth: 880, borderTop: '1px solid var(--line)', paddingTop: 36 }}>
            {faq.map(([q, a]) => (
              <div key={q}>
                <div style={{ fontSize: 13.5, fontWeight: 700, color: 'var(--gold-h)', marginBottom: 8 }}>{q}</div>
                <p style={{ margin: 0, fontSize: 14, color: 'var(--fg-soft)', lineHeight: 1.5 }}>{a}</p>
              </div>
            ))}
          </div>
        </div>
      </section>
    );
  }

  Object.assign(window, { HeroPulse, SampleRead, Allies, Membership });
})();
