@port60/template-kit 0.1.0

package/src/vendor/validator/preview.mjs

@@ -0,0 +1,111 @@
+// The STUDIO PREVIEW renderer (developer program T1.3): a validated artifact rendered over the
+// contract's KIND FIXTURES — no tenant, no tenant data, exactly what `template-kit dev` will show
+// locally in T3. Deliberately NOT the production TemplateHost path: a studio version must never
+// touch a live site, so this renders from an in-memory file map and the page it produces is
+// self-contained and network-dead — a CSP meta of default-src 'none' means the template's CSS
+// cannot fetch, beacon or import anything, and the consumer embeds it in a sandboxed iframe.
+// Islands render as labelled placeholder boxes (previews carry no runtime).
+import { Liquid } from 'liquidjs';
+import { CONTENT_SLOT, configureDialect, splitIslandParts } from '../engine/dialect.mjs';
+import { LIQUID_BUDGETS } from '../engine/budgets.mjs';
+import dialect from '../contract/v1/dialect.json' with { type: 'json' };
+import sectionCatalogue from '../contract/v1/sections.json' with { type: 'json' };
+import islandRegistry from '../contract/v1/islands.json' with { type: 'json' };
+import contextContract from '../contract/v1/context.json' with { type: 'json' };
+
+const escapeHtml = (s) =>
+  String(s).replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;');
+
+function islandPlaceholder(name) {
+  return `<div class="p60-preview-island" role="note">island: ${escapeHtml(name)}</div>`;
+}
+
+function partsToHtml(html, contentHtml) {
+  let out = '';
+  for (const part of splitIslandParts(html)) {
+    if (part.island === CONTENT_SLOT) out += contentHtml ?? '';
+    else if (part.island) out += islandPlaceholder(part.island);
+    else out += part.html;
+  }
+  return out;
+}
+
+/** Knob defaults → the same body attributes / CSS vars TemplateHost stamps, minus network fonts
+ *  (the CSP kills font fetches by design; system fallbacks are fine for a structural preview). */
+function knobDefaults(manifest) {
+  const attrs = [];
+  const vars = [];
+  for (const knob of manifest?.settings?.schema ?? []) {
+    const value = knob.default;
+    if (value == null || value === '') continue;
+    if (knob.kind === 'color') {
+      if (/^#[0-9a-fA-F]{3,8}$/.test(String(value))) vars.push(`--p60s-${knob.key}: ${value};`);
+    } else if (knob.kind === 'font') {
+      vars.push(`--p60s-${knob.key}: '${String(value).replace(/'/g, '')}', system-ui, sans-serif;`);
+    } else {
+      attrs.push(`data-p60s-${knob.key}="${escapeHtml(String(value))}"`);
+    }
+  }
+  return { attrs: attrs.join(' '), vars: vars.join(' ') };
+}
+
+/**
+ * Renders the artifact's declared sections (sample fixtures) inside its layout (when declared)
+ * and returns a complete, self-contained HTML document. Throws on parse/render failure — callers
+ * preview only versions the validator has already passed, so a throw here is a bug report, not
+ * a user flow.
+ */
+export async function renderStudioPreview(files) {
+  const manifest = JSON.parse(files['manifest.json']);
+  const allIslands = new Set(islandRegistry.islands.map((i) => i.name));
+  const liquid = new Liquid({ outputEscape: 'escape', strictFilters: true, ...LIQUID_BUDGETS });
+  configureDialect(liquid, dialect, allIslands);
+
+  const catalogueByType = new Map(sectionCatalogue.sections.map((s) => [s.type, s]));
+  const brand = contextContract.fixtures.brand;
+
+  const sectionsHtml = [];
+  for (const type of manifest?.supports?.sections ?? []) {
+    const entry = catalogueByType.get(type);
+    const source = files[`sections/${type}.liquid`];
+    if (!entry || source == null) continue;
+    const rendered = await liquid.parseAndRender(source, { section: entry.sample ?? {}, brand });
+    sectionsHtml.push(partsToHtml(rendered, ''));
+  }
+  const contentHtml = sectionsHtml.join('\n');
+
+  let bodyHtml;
+  if (manifest?.supports?.layout && files['layout.liquid'] != null) {
+    const rendered = await liquid.parseAndRender(files['layout.liquid'], {
+      brand,
+      nav: contextContract.fixtures.layout.nav,
+      socials: contextContract.fixtures.layout.socials ?? [],
+      worship: manifest?.supports?.worship ? (contextContract.fixtures.layout.worship ?? null) : null
+    });
+    bodyHtml = partsToHtml(rendered, contentHtml);
+  } else {
+    bodyHtml = contentHtml;
+  }
+
+  const themeCss = files['assets/theme.css'] ?? '';
+  const { attrs, vars } = knobDefaults(manifest);
+
+  return `<!doctype html>
+<html lang="en">
+<head>
+<meta charset="utf-8">
+<!-- Network-dead by design: the template's CSS can style, never fetch. -->
+<meta http-equiv="Content-Security-Policy" content="default-src 'none'; style-src 'unsafe-inline'; img-src data:;">
+<meta name="viewport" content="width=device-width, initial-scale=1">
+<title>${escapeHtml(manifest?.label ?? manifest?.name ?? 'Template preview')} — studio preview</title>
+<style>${vars ? `:root { ${vars} }` : ''}
+.p60-preview-island { border: 2px dashed #8aa; border-radius: 8px; padding: 18px; margin: 8px 0;
+  font: 13px/1.4 system-ui, sans-serif; color: #567; background: rgba(120,160,160,0.08); text-align: center; }
+</style>
+<style>${themeCss}</style>
+</head>
+<body ${attrs}>
+${bodyHtml}
+</body>
+</html>`;
+}

package/src/vendor/validator/validate.mjs

@@ -0,0 +1,265 @@
+// The Port60 template CONFORMANCE VALIDATOR as a PURE MODULE (developer program T1.3): the same
+// checks the publish-time CLI has always run, callable with an in-memory file map — no fs, no
+// argv, no process.exit — so the studio upload lane (an HTTP endpoint) and the CLI share ONE
+// implementation, and "validated ⇒ renders in production" keeps holding: the Liquid instance is
+// configured identically to the engine's, dialect enforcement is the same shared module, and the
+// render budgets here match production's.
+//
+//   validateArtifact(files) → { errors: string[], warnings: string[], manifest: object|null }
+//
+// `files` is a plain object of artifact-relative path → string content (manifest.json,
+// layout.liquid, sections/*.liquid, pages/*.liquid, assets/theme.css).
+import { Liquid } from 'liquidjs';
+import Ajv2020 from 'ajv/dist/2020.js';
+import { CONTENT_SLOT, configureDialect, splitIslandParts } from '../engine/dialect.mjs';
+import { LIQUID_BUDGETS } from '../engine/budgets.mjs';
+
+import dialect from '../contract/v1/dialect.json' with { type: 'json' };
+import sectionCatalogue from '../contract/v1/sections.json' with { type: 'json' };
+import islandRegistry from '../contract/v1/islands.json' with { type: 'json' };
+import manifestSchema from '../contract/v1/manifest.schema.json' with { type: 'json' };
+import contextContract from '../contract/v1/context.json' with { type: 'json' };
+import fontCatalogue from '../contract/v1/fonts.json' with { type: 'json' };
+
+const Ajv = Ajv2020.default ?? Ajv2020;
+
+export { dialect as contractDialect, sectionCatalogue, islandRegistry, contextContract };
+
+export async function validateArtifact(files) {
+  const errors = [];
+  const warnings = [];
+  const has = (path) => Object.hasOwn(files, path);
+  const read = (path) => files[path];
+
+  // 1. Manifest against the schema.
+  let manifest = null;
+  if (!has('manifest.json')) {
+    return { errors: ['manifest.json is missing — every artifact starts with its manifest'], warnings, manifest };
+  }
+  try {
+    manifest = JSON.parse(read('manifest.json'));
+  } catch (e) {
+    return { errors: [`manifest.json unreadable: ${e.message}`], warnings, manifest: null };
+  }
+  const ajv = new Ajv({ allErrors: true });
+  const validateManifest = ajv.compile(manifestSchema);
+  if (!validateManifest(manifest)) {
+    for (const err of validateManifest.errors) {
+      errors.push(`manifest${err.instancePath || ''}: ${err.message}`);
+    }
+  }
+
+  // Font knobs: the default family must be a real catalogue entry (the tenant-unset render uses
+  // it), and the slot must declare the weights the template's typographic system needs.
+  {
+    const familyNames = new Set(fontCatalogue.families.map((f) => f.name));
+    for (const knob of manifest?.settings?.schema ?? []) {
+      if (knob.kind !== 'font') continue;
+      if (typeof knob.default !== 'string' || !familyNames.has(knob.default)) {
+        errors.push(`settings knob '${knob.key}': font default '${knob.default}' is not in the font catalogue`);
+      } else if (!Array.isArray(knob.weights) || knob.weights.length === 0) {
+        errors.push(`settings knob '${knob.key}': font knobs must declare the weights the template uses`);
+      }
+    }
+  }
+
+  // Looks: every value must target a declared knob and be valid for it — a look that half-applies
+  // would leave the tenant in a state no author designed.
+  {
+    const knobByKey = new Map((manifest?.settings?.schema ?? []).map((k) => [k.key, k]));
+    const familyNames = new Set(fontCatalogue.families.map((f) => f.name));
+    const seenNames = new Set();
+    for (const look of manifest?.looks ?? []) {
+      if (seenNames.has(look.name)) errors.push(`look '${look.name}': duplicate name`);
+      seenNames.add(look.name);
+      for (const [key, value] of Object.entries(look.values ?? {})) {
+        const knob = knobByKey.get(key);
+        if (!knob) {
+          errors.push(`look '${look.name}': '${key}' is not a declared settings knob`);
+        } else if (knob.kind === 'select' && !(knob.options ?? []).includes(value)) {
+          errors.push(`look '${look.name}': '${value}' is not an option of select knob '${key}'`);
+        } else if (knob.kind === 'font' && !familyNames.has(value)) {
+          errors.push(`look '${look.name}': font '${value}' is not in the font catalogue`);
+        } else if (knob.kind === 'color' && value !== '' && !/^#[0-9a-fA-F]{3,8}$/.test(value)) {
+          errors.push(`look '${look.name}': '${value}' is not a colour value for knob '${key}'`);
+        }
+      }
+    }
+  }
+
+  // Engine identical to production: escape-by-default, strict filters, restricted dialect,
+  // and the SAME DoS budgets the live renderer runs with.
+  const availableIslands = new Set(
+    islandRegistry.islands.filter((i) => i.status === 'available').map((i) => i.name)
+  );
+  const allIslands = new Set(islandRegistry.islands.map((i) => i.name));
+  const liquid = new Liquid({ outputEscape: 'escape', strictFilters: true, ...LIQUID_BUDGETS });
+  configureDialect(liquid, dialect, allIslands);
+
+  const catalogueByType = new Map(sectionCatalogue.sections.map((s) => [s.type, s]));
+  const declaredIslands = new Set(manifest?.supports?.islands ?? []);
+  const placedIslands = new Set();
+
+  // 2–4. Sections: catalogue membership, parse, fixture renders.
+  for (const type of manifest?.supports?.sections ?? []) {
+    const entry = catalogueByType.get(type);
+    if (!entry) {
+      errors.push(`section '${type}': not in the platform section catalogue`);
+      continue;
+    }
+    const file = `sections/${type}.liquid`;
+    if (!has(file)) {
+      errors.push(`section '${type}': declared in the manifest but sections/${type}.liquid is missing`);
+      continue;
+    }
+    let parsed;
+    try {
+      parsed = liquid.parse(read(file));
+    } catch (e) {
+      errors.push(`section '${type}': does not parse under the dialect — ${e.message}`);
+      continue;
+    }
+    for (const fixtureName of ['minimal', 'sample']) {
+      const fixture = entry[fixtureName] ?? {};
+      try {
+        const html = await liquid.render(parsed, {
+          section: fixture,
+          brand: contextContract.fixtures.brand
+        });
+        for (const part of splitIslandParts(html)) {
+          if (part.island === CONTENT_SLOT) {
+            errors.push(`section '${type}': uses {% content %} — that tag is layout-only`);
+          } else if (part.island) {
+            placedIslands.add(part.island);
+          }
+        }
+      } catch (e) {
+        errors.push(`section '${type}': failed rendering the ${fixtureName} fixture — ${e.message}`);
+      }
+    }
+  }
+
+  // 7. Layout (when declared): parse + render the layout fixture + exactly one content slot.
+  if (manifest?.supports?.worship && !manifest?.supports?.layout) {
+    errors.push('manifest: supports.worship requires supports.layout — the worship rail is layout chrome');
+  }
+  if (manifest?.supports?.layout) {
+    if (!has('layout.liquid')) {
+      errors.push('layout: manifest declares supports.layout but layout.liquid is missing');
+    } else {
+      let parsedLayout;
+      try {
+        parsedLayout = liquid.parse(read('layout.liquid'));
+      } catch (e) {
+        errors.push(`layout: does not parse under the dialect — ${e.message}`);
+      }
+      if (parsedLayout) {
+        try {
+          const html = await liquid.render(parsedLayout, {
+            brand: contextContract.fixtures.brand,
+            nav: contextContract.fixtures.layout.nav,
+            socials: contextContract.fixtures.layout.socials ?? [],
+            worship: contextContract.fixtures.layout.worship ?? null
+          });
+          let contentSlots = 0;
+          const layoutIslands = [];
+          for (const part of splitIslandParts(html)) {
+            if (part.island === CONTENT_SLOT) contentSlots++;
+            else if (part.island) { placedIslands.add(part.island); layoutIslands.push(part.island); }
+          }
+          if (contentSlots !== 1) {
+            errors.push(`layout: must contain exactly one {% content %} slot (found ${contentSlots})`);
+          }
+          if (!layoutIslands.includes('member_menu')) {
+            warnings.push("layout: no {% island 'member_menu' %} — member sign-in will be unreachable on tenants that allow sign-ups; place it in your header");
+          }
+
+          // Two-sided worship honesty, checked BEHAVIOURALLY: does the rendered layout actually
+          // display the worship fixture's times? Declaration and behaviour must agree — the
+          // choosers steer worship-enabled tenants by supports.worship, so a false declaration
+          // either hides their times (undeclared but rendered is fine to fix by declaring) or
+          // promises a rail that never appears.
+          const worshipProbe = contextContract.fixtures.layout.worship?.times?.[0]?.name;
+          if (worshipProbe) {
+            const rendersWorship = html.includes(worshipProbe);
+            if (manifest?.supports?.worship && !rendersWorship) {
+              errors.push('layout: manifest declares supports.worship but the rendered layout does not display the worship fixture times — the rail never appears');
+            }
+            if (!manifest?.supports?.worship && rendersWorship) {
+              errors.push('layout: renders the worship rail but the manifest does not declare supports.worship — declare it so the choosers can badge it');
+            }
+            if (manifest?.supports?.worship) {
+              const nullHtml = await liquid.render(parsedLayout, {
+                brand: contextContract.fixtures.brand,
+                nav: contextContract.fixtures.layout.nav,
+                socials: contextContract.fixtures.layout.socials ?? [],
+                worship: null
+              });
+              if (nullHtml.includes(worshipProbe)) {
+                errors.push('layout: worship rail content appears even when `worship` is null — always branch on it (tenants without a schedule must not see a rail)');
+              }
+            }
+          }
+        } catch (e) {
+          errors.push(`layout: failed rendering the layout fixture — ${e.message}`);
+        }
+      }
+    }
+  } else if (has('layout.liquid')) {
+    warnings.push('layout.liquid present but manifest.supports.layout is not true — it will be ignored');
+  }
+
+  // 8. Page templates (when declared): file exists, parses, renders the page's data fixture.
+  for (const pageName of manifest?.supports?.pageTemplates ?? []) {
+    const fixture = contextContract.fixtures.pages?.[pageName];
+    if (!fixture) {
+      errors.push(`page template '${pageName}': no such page in the contract (no fixtures.pages.${pageName})`);
+      continue;
+    }
+    const pageFile = `pages/${pageName}.liquid`;
+    if (!has(pageFile)) {
+      errors.push(`page template '${pageName}': declared in supports.pageTemplates but pages/${pageName}.liquid is missing`);
+      continue;
+    }
+    let parsedPage;
+    try {
+      parsedPage = liquid.parse(read(pageFile));
+    } catch (e) {
+      errors.push(`page template '${pageName}': does not parse under the dialect — ${e.message}`);
+      continue;
+    }
+    try {
+      const html = await liquid.render(parsedPage, { ...fixture, brand: contextContract.fixtures.brand });
+      for (const part of splitIslandParts(html)) {
+        if (part.island === CONTENT_SLOT) {
+          errors.push(`page template '${pageName}': uses {% content %} — that tag is layout-only`);
+        } else if (part.island) {
+          placedIslands.add(part.island);
+        }
+      }
+    } catch (e) {
+      errors.push(`page template '${pageName}': failed rendering the page fixture — ${e.message}`);
+    }
+  }
+
+  // 5. Island discipline: placed ⊆ declared ⊆ registry (and available).
+  for (const name of placedIslands) {
+    if (!declaredIslands.has(name)) {
+      errors.push(`island '${name}': placed in a section but not declared in manifest.supports.islands`);
+    }
+  }
+  for (const name of declaredIslands) {
+    if (!allIslands.has(name)) {
+      errors.push(`island '${name}': not in the platform island registry`);
+    } else if (!availableIslands.has(name)) {
+      warnings.push(`island '${name}': registry status is 'planned' — it will render nothing until available`);
+    }
+  }
+
+  // 6. Theme.
+  if (!has('assets/theme.css') || read('assets/theme.css').trim() === '') {
+    errors.push('assets/theme.css missing or empty — a template must ship its look');
+  }
+
+  return { errors, warnings, manifest };
+}

package/starter/assets/theme.css

@@ -0,0 +1,43 @@
+/* starter theme — a deliberately distinct look (midnight/emerald) proving the artifact owns the skin */
+:root:root {
+  --bg: #0e1614;
+  --bg-tint: #14201d;
+  --surface: #16231f;
+  --ink: #eef6f2;
+  --muted: #93a8a0;
+  --primary: #2dd4a7;
+  --primary-strong: #19b28a;
+  --primary-soft: rgba(45, 212, 167, 0.14);
+  --accent: #f2b23e;
+  --accent-strong: #d99a24;
+  --line: rgba(238, 246, 242, 0.14);
+  --line-strong: rgba(45, 212, 167, 0.4);
+  --shadow-sm: 0 8px 24px rgba(0, 0, 0, 0.35);
+  --shadow: 0 24px 60px rgba(0, 0, 0, 0.5);
+  --radius: 10px;
+  --radius-sm: 7px;
+}
+body { background: var(--bg); }
+h1, h2, h3, h4 { color: var(--ink); font-family: 'IBM Plex Sans Arabic', var(--p60s-siteFont, 'Inter'), sans-serif; letter-spacing: -0.02em; margin: 0 0 1rem; line-height: 1.1; }
+h1 { font-size: clamp(2.4rem, 5vw, 3.6rem); }
+h2 { font-size: clamp(1.7rem, 3vw, 2.4rem); }
+h3 { font-size: 1.15rem; }
+p { color: var(--muted); line-height: 1.7; margin: 0 0 1rem; }
+strong { color: var(--ink); }
+.site-header { background: rgba(14, 22, 20, 0.86); }
+.lq-hero { padding: 4.5rem 0 2.5rem; border-bottom: 1px solid var(--line); }
+.lq-kicker { display: inline-block; border: 1px solid var(--line-strong); color: var(--primary); border-radius: 4px; padding: 0.3rem 0.8rem; font-size: 0.75rem; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 700; }
+.lq-hero h1 { margin-top: 1rem; max-width: 18ch; }
+.lq-hero-body { max-width: 62ch; }
+.lq-values { padding: 3.5rem 0; }
+.lq-value-rail { list-style: none; margin: 0; padding: 0 0 0 1.4rem; border-left: 2px solid var(--line-strong); display: grid; gap: 1.6rem; max-width: 700px; }
+.lq-value-rail li { position: relative; }
+.lq-value-dot { position: absolute; left: -1.75rem; top: 0.35rem; width: 0.65rem; height: 0.65rem; border-radius: 50%; background: var(--primary); box-shadow: 0 0 0 4px var(--primary-soft); }
+.lq-value-rail h3 { margin: 0 0 0.25rem; }
+.lq-value-rail p { margin: 0; }
+.lq-cta { padding: 3.5rem 0 4.5rem; }
+.lq-cta-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 2.5rem; align-items: start; }
+@media (max-width: 900px) { .lq-cta-grid { grid-template-columns: 1fr; } }
+
+/* The one font slot — headings above already follow it; body text too. */
+body { font-family: ' IBM Plex Sans Arabic', var(--p60s-siteFont, 'Inter'), ui-sans-serif, system-ui, sans-serif; }

package/starter/layout.liquid

@@ -0,0 +1,75 @@
+{% comment %}
+  The starter's chrome — header/nav/footer around the {% content %} slot. It reuses the platform
+  chrome classes (.site-header/.site-nav/…) so the base mechanics (sticky header, burger
+  breakpoint, dropdown hover) apply, and emits the documented behaviour attributes
+  (data-nav-burger, #site-nav) so the platform tail script wires the mobile burger. Identity is
+  PLACED, never rebuilt: {% island 'member_menu' %}. The footer derives everything from brand/nav —
+  no fabricated copy (derive or omit).
+{% endcomment %}
+<header class="site-header">
+  <div class="container header-inner">
+    <a class="brand-lockup" href="/">
+      {% if brand.logoUrl and brand.logoType != 'icon' %}
+        <img class="brand-logo" src="{{ brand.logoUrl }}" alt="{{ brand.name }}">
+      {% elsif brand.logoUrl %}
+        <img class="brand-logo-icon" src="{{ brand.logoUrl }}" alt="">
+        <strong>{{ brand.name }}</strong>
+      {% else %}
+        <span class="brand-mark" aria-hidden="true">♥</span>
+        <strong>{{ brand.name }}</strong>
+      {% endif %}
+    </a>
+
+    <button type="button" class="nav-burger" data-nav-burger aria-label="Menu" aria-expanded="false" aria-controls="site-nav">
+      <span aria-hidden="true"></span>
+      <span aria-hidden="true"></span>
+      <span aria-hidden="true"></span>
+    </button>
+
+    <nav class="site-nav" id="site-nav" aria-label="Primary">
+      {% for item in nav.items %}
+        {% if item.children %}
+          <span class="nav-dropdown">
+            <a href="{{ item.href }}" class="nav-dropdown-toggle" aria-haspopup="true">{{ item.label }} ▾</a>
+            <span class="nav-dropdown-menu">
+              {% for child in item.children %}
+                <a href="{{ child.href }}">{{ child.label }}</a>
+              {% endfor %}
+            </span>
+          </span>
+        {% elsif item.cta %}
+          <a class="nav-cta" href="{{ item.href }}">{{ item.label }}</a>
+        {% else %}
+          <a href="{{ item.href }}">{{ item.label }}</a>
+        {% endif %}
+      {% endfor %}
+      {% island 'member_menu' %}
+    </nav>
+  </div>
+</header>
+
+<main>
+  {% content %}
+</main>
+
+<footer class="site-footer">
+  <div class="container footer-grid">
+    <div>
+      <p class="lq-kicker">{{ brand.name }}</p>
+      {% if brand.tagline %}<h2>{{ brand.tagline }}</h2>{% endif %}
+    </div>
+    <div class="footer-links">
+      {% for item in nav.items %}
+        <a href="{{ item.href }}">{{ item.label }}</a>
+      {% endfor %}
+    </div>
+  </div>
+  <div class="container">
+    <p class="footer-note">
+      <span class="footer-legal-links">
+        <a href="/cookies">Cookies</a>
+        · <button type="button" class="footer-linklike" data-consent-open>Cookie settings</button>
+      </span>
+    </p>
+  </div>
+</footer>

package/starter/manifest.json

@@ -0,0 +1,40 @@
+{
+ "name": "starter",
+ "version": "1.2.0",
+ "format": "port60-liquid@1",
+ "label": "Starter",
+ "description": "The reference template for the Port60 dialect \u2014 the developer docs' worked example and the base to copy when building your own. 1.1.0 adds the layout slot: the template owns the header, navigation and footer chrome.",
+ "supports": {
+  "pages": [
+   "about"
+  ],
+  "sections": [
+   "hero",
+   "values",
+   "cta"
+  ],
+  "islands": [
+   "donation_widget",
+   "member_menu"
+  ],
+  "layout": true
+ },
+ "settings": {
+  "schema": [
+   {
+    "key": "siteFont",
+    "kind": "font",
+    "label": "Site font",
+    "default": "Inter",
+    "weights": [
+     400,
+     500,
+     600,
+     700,
+     800
+    ]
+   }
+  ]
+ },
+ "changelog": "The reference font slot \u2014 one 'Site font' knob showing the var(--p60s-*) pattern."
+}

package/starter/sections/cta.liquid

@@ -0,0 +1,12 @@
+<section class="lq-cta">
+  <div class="container lq-cta-grid">
+    <div>
+      <h2>{{ section.heading }}</h2>
+      {% if section.text %}<p>{{ section.text }}</p>{% endif %}
+      <a class="button button-primary" href="{{ section.buttonHref }}">{{ section.buttonLabel }}</a>
+    </div>
+    <div class="lq-cta-widget">
+      {% island 'donation_widget' %}
+    </div>
+  </div>
+</section>

package/starter/sections/hero.liquid

@@ -0,0 +1,7 @@
+<section class="lq-hero">
+  <div class="container">
+    {% if section.eyebrow %}<p class="lq-kicker">{{ section.eyebrow }}</p>{% endif %}
+    <h1>{{ section.title }}</h1>
+    <div class="lq-hero-body">{{ section.bodyHtml | raw }}</div>
+  </div>
+</section>

package/starter/sections/values.liquid

@@ -0,0 +1,14 @@
+<section class="lq-values">
+  <div class="container">
+    <h2>{{ section.heading | default: "What guides us" }}</h2>
+    <ol class="lq-value-rail">
+      {% for item in section.items %}
+      <li>
+        <span class="lq-value-dot"></span>
+        <h3>{{ item.title }}</h3>
+        <p>{{ item.description }}</p>
+      </li>
+      {% endfor %}
+    </ol>
+  </div>
+</section>