(defcomp ()
  (~docs/page :title "Introduction"
    (~docs/section :title "What is sx?" :id "what"
      (p (~tw :tokens "text-stone-600")
        "sx is an s-expression language for building web UIs. It combines htmx's server-first hypermedia approach with React's component model. The server sends s-expression source code over the wire. The client parses, evaluates, and renders it to DOM.")
      (p (~tw :tokens "text-stone-600")
        "The same evaluator runs on both server (Python) and client (JavaScript). Components defined once render identically in both environments."))
    (~docs/section :title "Design decisions" :id "design"
      (p (~tw :tokens "text-stone-600")
        "HTML elements are first-class: (div :class \"card\" (p \"hello\")) renders exactly what you'd expect. Components use defcomp with keyword parameters and optional children. The evaluator supports let bindings, conditionals, lambda, map/filter/reduce, and ~80 primitives.")
      (p (~tw :tokens "text-stone-600")
        "sx replaces the pattern of shipping a JS framework + build step + client-side router + state management library just to render some server data. For most applications, sx eliminates the need for JavaScript entirely — htmx attributes handle interactivity, hyperscript handles small behaviours, and the server handles everything else."))
    (~docs/section :title "What sx is not" :id "not"
      (ul (~tw :tokens "space-y-2 text-stone-600")
        (li "Not a general-purpose programming language — it's a UI rendering language")
        (li "Not a full Lisp — it has macros, TCO, and delimited continuations, but no full call/cc")
        (li "Not production-hardened at scale — it runs one website")))))
