@tryvitris/website-harness 0.1.0-beta.5 → 0.1.0-beta.7

package/blocks/trust-strip/trust-reviews/README.md

@@ -1,35 +0,0 @@
-# trust-reviews
-
-Avatar cluster + rating line + review-platform marks.
-
-- **Category:** trust-strip
-- **Media:** 3–5 tiny portraits, 2–4 platform marks
-- **Registers:** trade, beauty, food, professional
-- **Variants:** center
-
-## Slots
-
-| Slot | Content |
-|------|---------|
-| `avatars` | 3–5 `<img class="avatar">` |
-| `rating` | `<p>` stars + `<strong>4.9</strong>` + count |
-| `platforms` | Optional 2–4 `<img>` platform marks (~120×32) |
-
-## Example
-
-```html
-<trust-reviews>
-  <img slot="avatars" src="/media/harvest/avatar-1.jpg" alt="" width="96" height="96" class="avatar">
-  <img slot="avatars" src="/media/harvest/avatar-2.jpg" alt="" width="96" height="96" class="avatar">
-  <img slot="avatars" src="/media/harvest/avatar-3.jpg" alt="" width="96" height="96" class="avatar">
-  <img slot="avatars" src="/media/harvest/avatar-4.jpg" alt="" width="96" height="96" class="avatar">
-  <p slot="rating"><span class="rating" aria-label="5 out of 5 stars"><svg class="icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M12 3l2.6 5.3L20 9.2l-4 3.9.9 5.4L12 15.9 7.1 18.5 8 13.1 4 9.2l5.4-.9L12 3z"/></svg><svg class="icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M12 3l2.6 5.3L20 9.2l-4 3.9.9 5.4L12 15.9 7.1 18.5 8 13.1 4 9.2l5.4-.9L12 3z"/></svg><svg class="icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M12 3l2.6 5.3L20 9.2l-4 3.9.9 5.4L12 15.9 7.1 18.5 8 13.1 4 9.2l5.4-.9L12 3z"/></svg><svg class="icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M12 3l2.6 5.3L20 9.2l-4 3.9.9 5.4L12 15.9 7.1 18.5 8 13.1 4 9.2l5.4-.9L12 3z"/></svg><svg class="icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M12 3l2.6 5.3L20 9.2l-4 3.9.9 5.4L12 15.9 7.1 18.5 8 13.1 4 9.2l5.4-.9L12 3z"/></svg></span> <strong>4.9</strong> from 1,800+ clients</p>
-  <img src="/media/harvest/logo-google.svg" alt="Google" width="120" height="32" slot="platforms">
-  <img src="/media/harvest/logo-yelp.svg" alt="Yelp" width="120" height="32" slot="platforms">
-  <img src="/media/harvest/logo-avvo.svg" alt="Avvo" width="120" height="32" slot="platforms">
-</trust-reviews>
-```
-
-Variants: `<trust-reviews variant="center">`.
-
-Copy this folder into the site repo as `components/<your-name>/`, rename the root class to `c-<your-name>`, and adapt slots, copy, and media.

package/blocks/trust-strip/trust-reviews/styles.css

@@ -1,9 +0,0 @@
-.c-trust-reviews{border-block:1px solid var(--color-border)}
-.c-trust-reviews__row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--space-4) var(--space-6)}
-.c-trust-reviews__people{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-4)}
-.c-trust-reviews__rating p{margin:0;display:flex;flex-wrap:wrap;align-items:center;gap:.4rem;font-size:var(--step-0);color:var(--color-muted)}
-.c-trust-reviews__rating strong{font-weight:600;color:var(--color-text)}
-.c-trust-reviews__platforms{justify-content:flex-start;gap:var(--space-5)}
-.c-trust-reviews__platforms:empty{display:none}
-.c-trust-reviews__platforms img{max-height:1.5rem}
-.c-trust-reviews--center .c-trust-reviews__row,.c-trust-reviews--center .c-trust-reviews__people,.c-trust-reviews--center .c-trust-reviews__platforms{justify-content:center}

package/blocks/trust-strip/trust-reviews/template.html

@@ -1 +0,0 @@
-<section class="c-trust-reviews section--tight"><div class="wrap c-trust-reviews__row"><div class="c-trust-reviews__people"><div class="avatar-group"><slot name="avatars"></slot></div><div class="c-trust-reviews__rating"><slot name="rating"></slot></div></div><div class="logo-row c-trust-reviews__platforms"><slot name="platforms"></slot></div></div></section>

package/blocks/work/case-alternating/README.md

@@ -1,34 +0,0 @@
-# case-alternating
-
-Numbered case studies alternating photo and copy.
-
-- **Category:** work
-- **Media:** one photo per case
-- **Registers:** professional, b2b, trade
-- **Variants:** (none)
-
-## Slots
-
-| Slot | Content |
-|------|---------|
-| `eyebrow` | Optional `<p class="eyebrow">` |
-| `heading` | `<h2>` |
-| `lede` | Optional `<p class="lede">` (one sentence) |
-| `actions` | Optional 1–2 buttons / `.btn-arrow` links |
-| `cases` | 2–4 `<article><div class="frame ratio-4x3"><img></div><div class="stack"><p class="eyebrow">…</p><h3>…</h3><p>…</p><a class="btn-outline">…</a></div></article>` |
-
-## Example
-
-```html
-<case-alternating>
-  <p slot="eyebrow" class="eyebrow eyebrow--accent">Featured case studies</p>
-  <h2 slot="heading">Real cases. Real results for our clients.</h2>
-  <p slot="lede" class="lede">A look at recent work across our service areas. Some names are kept private to respect client confidentiality.</p>
-  <a slot="actions" class="btn-arrow" href="/case-studies">All case studies <svg class="icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M5 12h14M13 6l6 6-6 6"/></svg></a>
-  <article slot="cases"><div class="frame ratio-4x3"><img src="/media/harvest/case-1.jpg" alt="Wind turbines beside an office park" width="1200" height="900" loading="lazy"></div><div class="stack"><p class="eyebrow">Case 01 · 2026 · Energy</p><h3>Helped a large energy company defeat a price-fixing lawsuit.</h3><p>The court refused to group the customers into a class, and threw the case out for good.</p><a class="btn-outline" href="/case-studies/energy">Read the full case study <svg class="icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M5 12h14M13 6l6 6-6 6"/></svg></a></div></article>
-  <article slot="cases"><div class="frame ratio-4x3"><img src="/media/harvest/case-2.jpg" alt="Two lawyers reviewing documents on marble steps" width="1200" height="900" loading="lazy"></div><div class="stack"><p class="eyebrow">Case 02 · 2025 · Technology</p><h3>Defended a US tech company against a patent troll.</h3><p>No products were blocked, and we settled on terms that worked for our client.</p><a class="btn-outline" href="/case-studies/technology">Read the full case study <svg class="icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M5 12h14M13 6l6 6-6 6"/></svg></a></div></article>
-  <article slot="cases"><div class="frame ratio-4x3"><img src="/media/harvest/case-3.jpg" alt="Newsroom desks at night" width="1200" height="900" loading="lazy"></div><div class="stack"><p class="eyebrow">Case 03 · 2025 · Media</p><h3>Won a copyright trial for an independent publisher.</h3><p>A jury verdict in nine days, and a permanent injunction that protected the catalogue.</p><a class="btn-outline" href="/case-studies/media">Read the full case study <svg class="icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M5 12h14M13 6l6 6-6 6"/></svg></a></div></article>
-</case-alternating>
-```
-
-Copy this folder into the site repo as `components/<your-name>/`, rename the root class to `c-<your-name>`, and adapt slots, copy, and media.

package/blocks/work/case-alternating/block.meta.json

@@ -1,86 +0,0 @@
-{
-  "schemaVersion": 1,
-  "id": "work/case-alternating",
-  "revision": 1,
-  "status": "draft",
-  "owner": "Vitris design library",
-  "sourceHash": "ce5e6e7e56b617a2400c71e9a61c9e3cb83560165f174edd2303c97cb616056e",
-  "fit": {
-    "visitorJobs": [
-      "Inspect project evidence and outcomes"
-    ],
-    "pageRoles": [
-      "work index"
-    ],
-    "useWhen": [
-      "Inspect project evidence and outcomes"
-    ],
-    "avoidWhen": [
-      "The content or media cannot support this composition"
-    ]
-  },
-  "content": {
-    "requiredSlots": [
-      "heading",
-      "cases"
-    ],
-    "optionalSlots": [
-      "eyebrow",
-      "lede",
-      "actions"
-    ],
-    "testedItemCounts": [
-      1
-    ]
-  },
-  "media": {
-    "min": 1,
-    "max": 8,
-    "optionalBehavior": "Recompose without empty media frames when media is optional",
-    "aspect": [
-      "content-dependent"
-    ]
-  },
-  "composition": {
-    "hierarchy": "alternating narratives",
-    "alignment": "alternating",
-    "density": "medium",
-    "mediaProminence": "high",
-    "geometry": [
-      "alternating",
-      "image-led"
-    ],
-    "boundary": "section boundary adapts to adjacent content"
-  },
-  "adaptation": {
-    "flexible": [
-      "spacing",
-      "surface treatment",
-      "type scale"
-    ],
-    "invariants": [
-      "semantic reading order",
-      "one clear section purpose"
-    ],
-    "customWhen": [
-      "The visitor job needs a different hierarchy"
-    ]
-  },
-  "responsive": {
-    "readingOrder": "DOM order follows the visitor narrative",
-    "reflow": "Stack or resize according to content",
-    "crop": "Keep important subjects visible"
-  },
-  "interaction": {
-    "behavior": "Native links and controls",
-    "islands": []
-  },
-  "evidence": {
-    "provenance": [
-      "Original Vitris block source"
-    ],
-    "testedContexts": [],
-    "accessibility": [],
-    "previewManifest": "../../../design-system/block-previews/v1/work--case-alternating.json"
-  }
-}

package/blocks/work/case-alternating/styles.css

@@ -1,7 +0,0 @@
-.c-case-alternating__list{display:grid;gap:var(--space-7)}
-.c-case-alternating__list > article{display:grid;gap:var(--space-5);align-items:center;padding-top:var(--space-7);border-top:1px solid var(--color-border)}
-.c-case-alternating__list .stack{gap:var(--space-4);justify-items:start}
-.c-case-alternating__list .stack h3{font-size:var(--step-3);max-width:20ch}
-.c-case-alternating__list .stack > p:not(.eyebrow){color:var(--color-muted);max-width:36rem}
-.c-case-alternating__list .stack .eyebrow{display:flex;gap:var(--space-3)}
-@media(min-width:900px){.c-case-alternating__list{gap:var(--space-8)}.c-case-alternating__list > article{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-8)}.c-case-alternating__list > article:nth-child(even) > .frame{order:2}}

package/blocks/work/case-alternating/template.html

@@ -1 +0,0 @@
-<section class="c-case-alternating section"><div class="wrap"><div class="section__head section__head--row"><div class="stack stack--tight"><slot name="eyebrow"></slot><slot name="heading"></slot><slot name="lede"></slot></div><div class="btn-group"><slot name="actions"></slot></div></div><div class="c-case-alternating__list"><slot name="cases"></slot></div></div></section>

package/blocks/work/case-carousel/README.md

@@ -1,26 +0,0 @@
-# case-carousel
-
-One case per slide: copy left, image right, arrow nav.
-
-- **Category:** work
-- **Media:** one photo per case
-- **Registers:** b2b, professional, beauty
-- **Variants:** (none)
-
-## Slots
-
-| Slot | Content |
-|------|---------|
-| `slides` | 3–5 `<article><div class="stack"><p class="eyebrow">…</p><h2>…</h2><p>…</p><a class="btn-arrow">…</a></div><div class="frame ratio-4x3"><img></div></article>` |
-
-## Example
-
-```html
-<case-carousel>
-  <article slot="slides"><div class="stack"><p class="eyebrow eyebrow--accent">Nextdock · Identity</p><h2>From idea to launch: how we gave Nextdock a bold identity.</h2><p>We worked with Nextdock from their earliest sketches, creating a logo that reflects speed and innovation. The new identity helped them secure their first round of investment.</p><a class="btn-arrow" href="/work/nextdock">See the project <svg class="icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M5 12h14M13 6l6 6-6 6"/></svg></a></div><div class="frame ratio-4x3"><img src="/media/harvest/work-1.jpg" alt="Nextdock wordmark on a dark billboard" width="1200" height="900" loading="lazy"></div></article>
-  <article slot="slides"><div class="stack"><p class="eyebrow eyebrow--accent">Neobase · Rebrand</p><h2>Rebranding success: a legacy brand for modern markets.</h2><p>A complete visual overhaul that kept the brand's heritage while appealing to a new generation of buyers.</p><a class="btn-arrow" href="/work/neobase">See the project <svg class="icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M5 12h14M13 6l6 6-6 6"/></svg></a></div><div class="frame ratio-4x3"><img src="/media/harvest/work-2.jpg" alt="Neobase mark applied to a car wrap" width="1200" height="900" loading="lazy"></div></article>
-  <article slot="slides"><div class="stack"><p class="eyebrow eyebrow--accent">Charter · Identity</p><h2>From concept to market: a timeless brand identity.</h2><p>Working with a mission-driven company from their earliest stages, we created a mark that reflects their values of sustainability and craft.</p><a class="btn-arrow" href="/work/charter">See the project <svg class="icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M5 12h14M13 6l6 6-6 6"/></svg></a></div><div class="frame ratio-4x3"><img src="/media/harvest/work-3.jpg" alt="Charter logo embossed on packaging" width="1200" height="900" loading="lazy"></div></article>
-</case-carousel>
-```
-
-Copy this folder into the site repo as `components/<your-name>/`, rename the root class to `c-<your-name>`, and adapt slots, copy, and media.

package/blocks/work/case-carousel/styles.css

@@ -1,7 +0,0 @@
-.c-case-carousel__carousel .carousel__track{gap:var(--space-6);scroll-padding-inline:0}
-.c-case-carousel__carousel .carousel__track > *{flex:0 0 100%;display:grid;gap:var(--space-5);align-items:center}
-.c-case-carousel__carousel .stack{gap:var(--space-4);justify-items:start}
-.c-case-carousel__carousel .stack h2{max-width:18ch}
-.c-case-carousel__carousel .stack > p:not(.eyebrow){color:var(--color-muted);max-width:34rem}
-.c-case-carousel__carousel .frame{box-shadow:none}
-@media(min-width:900px){.c-case-carousel__carousel .carousel__track > *{grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:var(--space-8)}}

package/blocks/work/case-carousel/template.html

@@ -1 +0,0 @@
-<section class="c-case-carousel section"><div class="wrap carousel c-case-carousel__carousel" data-island="carousel" tabindex="0" aria-roledescription="carousel"><div class="carousel__track"><slot name="slides"></slot></div><div class="carousel__nav"><button type="button" data-carousel-prev aria-label="Previous"><svg class="icon" viewBox="0 0 24 24" aria-hidden="true"><path d="m15 6-6 6 6 6"/></svg></button><button type="button" data-carousel-next aria-label="Next"><svg class="icon" viewBox="0 0 24 24" aria-hidden="true"><path d="m9 6 6 6-6 6"/></svg></button></div></div></section>

package/blocks/work/case-header/README.md

@@ -1,38 +0,0 @@
-# case-header
-
-Case study / project header: breadcrumb, title, meta, hero image, side CTA card.
-
-- **Category:** work
-- **Media:** one hero photo
-- **Registers:** professional, b2b, trade
-- **Variants:** (none)
-
-## Slots
-
-| Slot | Content |
-|------|---------|
-| `breadcrumb` | Optional `<a>` trail ending in `<span aria-current="page">` |
-| `(default)` | `<h1>` |
-| `meta` | 2–4 `<span>` facts (date, category, client) |
-| `media` | `<img>` 16:9 (LCP) |
-| `aside` | Optional `<h3>` + `<p>` + `.btn` for the side card |
-
-## Example
-
-```html
-<case-header>
-  <a slot="breadcrumb" href="/">Home</a>
-  <a slot="breadcrumb" href="/case-studies">Case studies</a>
-  <span slot="breadcrumb" aria-current="page">Energy antitrust</span>
-  <h1>An energy company beats a price-fixing lawsuit.</h1>
-  <span slot="meta">Nov 18, 2025</span>
-  <span slot="meta">Class action defense</span>
-  <span slot="meta">Lead partner: Dana Kowalski</span>
-  <img src="/media/harvest/case-1.jpg" alt="Two lawyers reviewing a tablet beside wind turbines" width="1600" height="900" slot="media" fetchpriority="high">
-  <h3 slot="aside">Need counsel on a matter like this?</h3>
-  <p slot="aside">A senior partner takes the first call. Conflicts cleared within the hour, a strategy memo on your desk inside seventy-two.</p>
-  <a slot="aside" class="btn" href="/contact">Get in touch <svg class="icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M5 12h14M13 6l6 6-6 6"/></svg></a>
-</case-header>
-```
-
-Copy this folder into the site repo as `components/<your-name>/`, rename the root class to `c-<your-name>`, and adapt slots, copy, and media.

package/blocks/work/case-header/styles.css

@@ -1,18 +0,0 @@
-.c-case-header{padding-block:calc(var(--section-y) - var(--space-4)) var(--section-y)}
-.c-case-header__crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-2);margin-bottom:var(--space-6);font-size:var(--step-0);color:var(--color-muted)}
-.c-case-header__crumbs:empty{display:none}
-.c-case-header__crumbs > * + *::before{content:"/";margin-right:var(--space-2);color:var(--color-border)}
-.c-case-header__crumbs a{color:inherit;text-decoration:none}
-.c-case-header__crumbs [aria-current]{color:var(--color-text)}
-.c-case-header__title{display:grid;gap:var(--space-4);max-width:52rem;margin-bottom:var(--space-7)}
-.c-case-header h1{font-size:var(--step-4);max-width:24ch}
-.c-case-header__meta{display:flex;flex-wrap:wrap;gap:var(--space-2) var(--space-4);font-size:var(--step-0);color:var(--color-muted)}
-.c-case-header__meta > * + *::before{content:"·";margin-right:var(--space-4);color:var(--color-border)}
-.c-case-header__grid{display:grid;gap:var(--space-4)}
-.c-case-header__media{box-shadow:none}
-.c-case-header__aside{display:grid;gap:var(--space-3);align-content:start;padding:var(--space-6)}
-.c-case-header__aside:empty{display:none}
-.c-case-header__aside h3{font-size:var(--step-2)}
-.c-case-header__aside p{margin:0;color:var(--color-muted)}
-.c-case-header__aside .btn,.c-case-header__aside .btn-outline{justify-self:start}
-@media(min-width:900px){.c-case-header__grid{grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:var(--space-5)}.c-case-header__grid:has(.c-case-header__aside:empty){grid-template-columns:1fr}}

package/blocks/work/case-header/template.html

@@ -1 +0,0 @@
-<section class="c-case-header section"><div class="wrap"><nav class="c-case-header__crumbs" aria-label="Breadcrumb"><slot name="breadcrumb"></slot></nav><div class="c-case-header__title"><slot></slot><div class="c-case-header__meta"><slot name="meta"></slot></div></div><div class="c-case-header__grid"><div class="frame ratio-16x9 c-case-header__media"><slot name="media"></slot></div><aside class="card card--flat c-case-header__aside"><slot name="aside"></slot></aside></div></div></section>

package/blocks/work/project-evidence/README.md

@@ -1,35 +0,0 @@
-# project-evidence
-
-A project story led by one real image and a compact fact ledger. Captions explain what the image actually shows; facts remain independently verifiable. This example is for the fictional Tide & Slate roofing company and uses a synthetic teaching image, never customer proof.
-
-- **Category:** work
-- **Media:** one project photo required
-- **Registers:** trade, professional, b2b
-- **Variants:** (none)
-
-## Slots
-
-| Slot | Content |
-|------|---------|
-| `eyebrow` | Optional project context |
-| `heading` | `<h2>` with the project question or result |
-| `summary` | Brief project narrative without unsupported claims |
-| `media` | One image with truthful alt text and explicit dimensions |
-| `caption` | Visible description and provenance context for the image |
-| `facts` | Two to four `<div>` items containing `<dt>` and `<dd>` factual pairs |
-
-## Example
-
-```html
-<project-evidence>
-  <p slot="eyebrow" class="eyebrow eyebrow--accent">Tide &amp; Slate · fictional teaching example</p>
-  <h2 slot="heading">A roof shaped by the coast.</h2>
-  <p slot="summary" class="lede">The example shows how a project story can connect material choice, site conditions, and a clear next step without inventing a testimonial.</p>
-  <img slot="media" src="/media/teaching/slate-roof-finished.webp" alt="Synthetic teaching image of a slate roof on a coastal house" width="1536" height="1024" loading="lazy">
-  <span slot="caption">Synthetic teaching image. Replace with a verified project photograph and accurate caption.</span>
-  <div slot="facts"><dt>Material</dt><dd>Slate tiles</dd></div>
-  <div slot="facts"><dt>Setting</dt><dd>Coastal residence</dd></div>
-</project-evidence>
-```
-
-The media is essential to this composition. Do not use it when no genuine project image exists. On a real site, source the facts and caption from the project record.

package/blocks/work/project-evidence/block.meta.json

@@ -1,87 +0,0 @@
-{
-  "schemaVersion": 1,
-  "id": "work/project-evidence",
-  "revision": 1,
-  "status": "draft",
-  "owner": "Vitris design library",
-  "sourceHash": "1a4977448d8eff5dfdb483b44ae62737cc4a74d387db07f430e227d8169f9593",
-  "fit": {
-    "visitorJobs": [
-      "Inspect a real project and its verified facts"
-    ],
-    "pageRoles": [
-      "project story"
-    ],
-    "useWhen": [
-      "Inspect a real project and its verified facts"
-    ],
-    "avoidWhen": [
-      "The content or media cannot support this composition"
-    ]
-  },
-  "content": {
-    "requiredSlots": [
-      "heading",
-      "summary",
-      "media",
-      "caption",
-      "facts"
-    ],
-    "optionalSlots": [
-      "eyebrow"
-    ],
-    "testedItemCounts": [
-      1
-    ]
-  },
-  "media": {
-    "min": 1,
-    "max": 8,
-    "optionalBehavior": "Recompose without empty media frames when media is optional",
-    "aspect": [
-      "content-dependent"
-    ]
-  },
-  "composition": {
-    "hierarchy": "image with fact ledger",
-    "alignment": "asymmetric",
-    "density": "medium",
-    "mediaProminence": "high",
-    "geometry": [
-      "image-led",
-      "facts"
-    ],
-    "boundary": "section boundary adapts to adjacent content"
-  },
-  "adaptation": {
-    "flexible": [
-      "spacing",
-      "surface treatment",
-      "type scale"
-    ],
-    "invariants": [
-      "semantic reading order",
-      "one clear section purpose"
-    ],
-    "customWhen": [
-      "The visitor job needs a different hierarchy"
-    ]
-  },
-  "responsive": {
-    "readingOrder": "DOM order follows the visitor narrative",
-    "reflow": "Stack or resize according to content",
-    "crop": "Keep important subjects visible"
-  },
-  "interaction": {
-    "behavior": "Native links and controls",
-    "islands": []
-  },
-  "evidence": {
-    "provenance": [
-      "Original Vitris block source"
-    ],
-    "testedContexts": [],
-    "accessibility": [],
-    "previewManifest": "../../../design-system/block-previews/v1/work--project-evidence.json"
-  }
-}

package/blocks/work/project-evidence/styles.css

@@ -1,12 +0,0 @@
-.c-project-evidence__intro{display:grid;gap:var(--space-4);margin-bottom:var(--space-6)}
-.c-project-evidence__intro h2{max-width:18ch}
-.c-project-evidence__intro > p{max-width:56ch;color:var(--color-muted)}
-.c-project-evidence__body{display:grid;gap:var(--space-5)}
-.c-project-evidence__figure{margin:0;min-width:0}
-.c-project-evidence__figure img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover}
-.c-project-evidence__figure figcaption{font-size:var(--step-0);color:var(--color-muted);margin-top:var(--space-2);max-width:65ch}
-.c-project-evidence__facts{align-self:start;display:grid;border-top:2px solid var(--color-accent);margin:0}
-.c-project-evidence__facts > div{padding:var(--space-4) 0;border-bottom:1px solid var(--color-border);display:grid;gap:var(--space-2)}
-.c-project-evidence__facts dt{font-size:var(--step-0);color:var(--color-muted)}
-.c-project-evidence__facts dd{margin:0;font-weight:600}
-@media(min-width:900px){.c-project-evidence__intro{grid-template-columns:minmax(0,1fr) minmax(18rem,.75fr);align-items:end}.c-project-evidence__body{grid-template-columns:minmax(0,1.5fr) minmax(16rem,.55fr);gap:var(--space-7)}}

package/blocks/work/project-evidence/template.html

@@ -1 +0,0 @@
-<section class="c-project-evidence section"><div class="wrap"><div class="c-project-evidence__intro"><div><slot name="eyebrow"></slot><slot name="heading"></slot></div><slot name="summary"></slot></div><div class="c-project-evidence__body"><figure class="c-project-evidence__figure"><slot name="media"></slot><figcaption><slot name="caption"></slot></figcaption></figure><dl class="c-project-evidence__facts"><slot name="facts"></slot></dl></div></div></section>

package/blocks/work/project-grid/README.md

@@ -1,38 +0,0 @@
-# project-grid
-
-Portfolio grid: image, title, category.
-
-- **Category:** work
-- **Media:** one photo per project
-- **Registers:** b2b, beauty, trade, professional
-- **Variants:** two
-
-## Slots
-
-| Slot | Content |
-|------|---------|
-| `eyebrow` | Optional `<p class="eyebrow">` |
-| `heading` | `<h2>` |
-| `lede` | Optional `<p class="lede">` (one sentence) |
-| `actions` | Optional 1–2 buttons / `.btn-arrow` links |
-| `projects` | 3–9 `<a href><div class="frame ratio-4x3"><img></div><h3>Title</h3><p>Category · Year</p></a>` |
-
-## Example
-
-```html
-<project-grid>
-  <p slot="eyebrow" class="eyebrow eyebrow--accent">Featured work</p>
-  <h2 slot="heading">Marks that stuck.</h2>
-  <a slot="actions" class="btn-arrow" href="/work">All projects <svg class="icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M5 12h14M13 6l6 6-6 6"/></svg></a>
-  <a slot="projects" href="/work/neobase"><div class="frame ratio-4x3"><img src="/media/harvest/work-2.jpg" alt="Neobase identity" width="1200" height="900" loading="lazy"></div><h3>Neobase</h3><p>Rebrand · 2026</p></a>
-  <a slot="projects" href="/work/nextdock"><div class="frame ratio-4x3"><img src="/media/harvest/work-1.jpg" alt="Nextdock identity" width="1200" height="900" loading="lazy"></div><h3>Nextdock</h3><p>Logo &amp; identity · 2026</p></a>
-  <a slot="projects" href="/work/scalar"><div class="frame ratio-4x3"><img src="/media/harvest/work-3.jpg" alt="Scalar identity" width="1200" height="900" loading="lazy"></div><h3>Scalar</h3><p>Icon system · 2025</p></a>
-  <a slot="projects" href="/work/charter"><div class="frame ratio-4x3"><img src="/media/harvest/work-4.jpg" alt="Charter identity" width="1200" height="900" loading="lazy"></div><h3>Charter</h3><p>Brand identity · 2025</p></a>
-  <a slot="projects" href="/work/echo"><div class="frame ratio-4x3"><img src="/media/harvest/work-5.jpg" alt="Echo identity" width="1200" height="900" loading="lazy"></div><h3>Echo</h3><p>Rebrand · 2025</p></a>
-  <a slot="projects" href="/work/harbor"><div class="frame ratio-4x3"><img src="/media/harvest/work-6.jpg" alt="Harbor identity" width="1200" height="900" loading="lazy"></div><h3>Harbor Roofing</h3><p>Logo &amp; fleet · 2024</p></a>
-</project-grid>
-```
-
-Variants: `<project-grid variant="two">`.
-
-Copy this folder into the site repo as `components/<your-name>/`, rename the root class to `c-<your-name>`, and adapt slots, copy, and media.

package/blocks/work/project-grid/styles.css

@@ -1,9 +0,0 @@
-.c-project-grid__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-6) var(--space-4)}
-.c-project-grid__grid > a{display:grid;gap:var(--space-3);align-content:start;color:inherit;text-decoration:none}
-.c-project-grid__grid > a .frame{box-shadow:none}
-.c-project-grid__grid > a img{transition:transform .5s ease}
-.c-project-grid__grid > a:hover img{transform:scale(1.03)}
-.c-project-grid__grid h3{font-size:var(--step-1)}
-.c-project-grid__grid p{margin:calc(-1 * var(--space-2)) 0 0;font-size:var(--step-0);color:var(--color-muted)}
-@media(min-width:720px){.c-project-grid__grid{gap:var(--space-7) var(--space-5)}}
-@media(min-width:1080px){.c-project-grid__grid{grid-template-columns:repeat(3,minmax(0,1fr))}.c-project-grid--two .c-project-grid__grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-8) var(--space-6)}}

package/blocks/work/project-grid/template.html

@@ -1 +0,0 @@
-<section class="c-project-grid section"><div class="wrap"><div class="section__head section__head--row"><div class="stack stack--tight"><slot name="eyebrow"></slot><slot name="heading"></slot><slot name="lede"></slot></div><div class="btn-group"><slot name="actions"></slot></div></div><div class="c-project-grid__grid"><slot name="projects"></slot></div></div></section>