function CTA({ onBook, navigate }) {
  return (
    <section style={{ maxWidth: 1180, margin: "0 auto", padding: "76px 28px" }}>
      <div style={{
        background: "linear-gradient(135deg, var(--sage-100), var(--sky-100))",
        borderRadius: "var(--radius-2xl)", padding: "56px 48px", textAlign: "center",
        position: "relative", overflow: "hidden",
      }}>
        <img src="../../assets/logomark.svg" width="52" height="58" alt="" style={{ marginBottom: 6 }} />
        <h2 style={{ fontSize: 40, margin: "8px 0 0", letterSpacing: "-0.025em" }}>Let's help your child bloom</h2>
        <p style={{ fontSize: 18, color: "var(--text-muted)", margin: "14px auto 0", maxWidth: "48ch" }}>
          Book a free 30-minute consultation. No referral needed, just a conversation about your family's next step.
        </p>
        <div style={{ display: "flex", gap: 14, justifyContent: "center", marginTop: 28, flexWrap: "wrap" }}>
          <Button variant="primary" size="lg" onClick={onBook} trailingIcon={<Icon name="arrow-right" size={18} />}>Schedule a consultation</Button>
          <Button variant="outline" size="lg" leadingIcon={<Icon name="phone" size={17} />}>(555) 200-1480</Button>
        </div>
      </div>
    </section>
  );
}
window.CTA = CTA;