Initial commit 🚀

.design-sync/ds-src/Grid.md

@@ -0,0 +1,21 @@
+---
+category: Layout
+---
+
+# Grid
+
+The twelve-column grid. It is the tool for asymmetry, which is how this site composes a
+band: a headline across 7 or 8 columns, its supporting copy across 4 or 5, offset against
+each other rather than centred or evenly split.
+
+Place children with Col. Do not nest a Grid inside a Col unless the inner block genuinely
+has its own twelve-column structure.
+
+```jsx
+<Grid>
+  <Col span={7}><Heading>Security is built in, not bolted on.</Heading></Col>
+  <Col span={4} start={9}><Text measure>…</Text></Col>
+</Grid>
+```
+
+Astro equivalent: `<div class="grid">`.