> ## Documentation Index
> Fetch the complete documentation index at: https://docs.gavai.io/llms.txt
> Use this file to discover all available pages before exploring further.

# Core concepts

> The five ideas behind every gavAI app — pages assembled from blocks, capabilities that wire blocks to real actions, a schema that validates writes, and a per-tenant runtime that keeps workspaces isolated.

export const Path = ({icon, title, href, children}) => <a className="gv-choose-path__card" href={href}>
    {icon && <span className="gv-choose-path__icon" aria-hidden="true">
        <Icon icon={icon} />
      </span>}
    <h4 className="gv-choose-path__title">{title}</h4>
    {children && <p className="gv-choose-path__body">{children}</p>}
    <svg className="gv-choose-path__arrow" viewBox="0 0 24 24" width="14" height="14" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" aria-hidden="true">
      <line x1="7" y1="17" x2="17" y2="7" />
      <polyline points="7 7 17 7 17 17" />
    </svg>
  </a>;

export const ChoosePath = ({eyebrow = "CHOOSE YOUR PATH", label, children}) => <section className="gv-choose-path">
    <div className="gv-choose-path__header">
      <Eyebrow label={eyebrow} />
      {label && <h3 className="gv-choose-path__label">{label}</h3>}
    </div>
    <div className="gv-choose-path__grid">{children}</div>
  </section>;

export const BrandCard = ({eyebrow, title, href, icon, badge, cta, featured = false, horizontal = false, children}) => {
  const classes = ["gv-card", featured && "gv-card--featured", horizontal && "gv-card--horizontal"].filter(Boolean).join(" ");
  const inner = <>
      {icon && <span className="gv-card__icon" aria-hidden="true">
          <Icon icon={icon} />
        </span>}
      <div className="gv-card__main">
        {(eyebrow || badge) && <div className="gv-card__meta">
            {eyebrow && <Eyebrow label={eyebrow} tone="muted" />}
            {badge && <span className="gv-card__badge">{badge}</span>}
          </div>}
        <h3 className="gv-card__title">{title}</h3>
        {children && <div className="gv-card__body">{children}</div>}
        {cta && <span className="gv-card__cta">
            {cta}
            <svg className="gv-card__cta-arrow" viewBox="0 0 24 24" width="12" height="12" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" aria-hidden="true">
              <line x1="7" y1="17" x2="17" y2="7" />
              <polyline points="7 7 17 7 17 17" />
            </svg>
          </span>}
      </div>
    </>;
  return href ? <a className={classes} href={href}>
      {inner}
    </a> : <div className={classes}>{inner}</div>;
};

export const Eyebrow = ({label, tone = "default"}) => <div className={`gv-eyebrow gv-eyebrow--${tone}`}>
    <span className="gv-eyebrow__bar" aria-hidden="true" />
    <span className="gv-eyebrow__label">{label}</span>
  </div>;

<Eyebrow label="CONCEPTS" />

A gavAI app is five ideas snapped together: **pages** assembled from composable **blocks**, **capabilities** that wire those blocks to real-world actions, a **schema** the runtime validates writes against, and a **multi-tenant runtime** that keeps every workspace isolated. By the end of this section you will know what each piece is, why it exists, and which page to read when you need to go deeper.

For who the platform is for and what is included at each entry point (Builder, MCP, code), see [Who this is for](/mission). The concepts below describe how the platform works once you've chosen an entry point.

<ChoosePath label="Where to start">
  <Path icon="layout-grid" title="I'm new to gavAI" href="/concepts/pageblocks">Read top-to-bottom from PageBlocks. Builds the mental model fastest.</Path>
  <Path icon="cpu" title="I'm integrating from the outside" href="/concepts/architecture">Start with Architecture and Multi-tenant, then come back for the page model.</Path>
</ChoosePath>

The pieces aren't independent — they compose. A page is a JSON document; the document declares a schema; blocks in the document bind to schema tables and invoke capabilities; the runtime renders the document and dispatches the capability calls on per-tenant infrastructure. You can read these pages in any order, but the order below is the one that builds the picture fastest.

<Columns cols={2}>
  <BrandCard eyebrow="UI MODEL" title="PageBlocks" href="/concepts/pageblocks" icon="layout-grid" featured cta="Start here">
    Pages are JSON trees of typed blocks — NavShell, Hero, Form, Table, and seven more. The document is the page; there is no build step.
  </BrandCard>

  <BrandCard eyebrow="ACTIONS" title="Capabilities" href="/concepts/capabilities" icon="zap">
    Pages need to *do* things — charge a card, send an email, store a file. Capabilities are typed runtime actions with Zod-validated inputs and outputs.
  </BrandCard>

  <BrandCard eyebrow="DATA" title="Schema" href="/concepts/schema" icon="database">
    Tables and field shapes declared as JSON on the page document. The runtime validates every write against the schema — no SQL, no migrations.
  </BrandCard>

  <BrandCard eyebrow="ISOLATION" title="Multi-tenant model" href="/concepts/multi-tenant" icon="building">
    Every workspace gets its own isolated runtime, its own Postgres database, and its own subdomain. Cross-tenant access is structurally impossible.
  </BrandCard>

  <BrandCard eyebrow="INTERNALS" title="Architecture" href="/concepts/architecture" icon="cpu">
    How the Builder, the public API, the per-tenant runtime, and the MCP layer connect. Read this if you're integrating gavAI from the outside.
  </BrandCard>

  <BrandCard eyebrow="BUILDER" title="The Builder" href="/concepts/builder-ux" icon="wand-magic-sparkles">
    The visual surface where a non-technical owner composes pages, defines data, and ships to a subdomain — no code.
  </BrandCard>
</Columns>

## A suggested reading order

If you're new to gavAI, read them top-to-bottom: pages first (so the artifact is concrete), then capabilities (what pages can do), then schema (what they read and write), then the multi-tenant model and architecture (where it all runs). The Builder page is independent — read it whenever you want to see the visual surface a non-technical owner uses.

If you're integrating from the outside, start with **Architecture** and **Multi-tenant model**, then come back for the page model when you need to read or patch a document.
