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

package/blocks/services/services-panels/styles.css

@@ -1,15 +0,0 @@
-.c-services-panels__list{display:grid;gap:var(--space-3)}
-.c-services-panels__list > *{min-height:14rem}
-.c-services-panels__list .photo-card__body h3{font-size:var(--step-2)}
-.c-services-panels__list .photo-card__body p{font-size:var(--step-0)}
-@media(min-width:900px){
-  .c-services-panels__list{display:flex;min-height:30rem}
-  .c-services-panels__list > *{flex:1 1 0;min-width:0;min-height:0;transition:flex .5s cubic-bezier(.2,.7,.2,1)}
-  .c-services-panels__list > * .photo-card__body{justify-items:start}
-  .c-services-panels__list > * .photo-card__body h3{writing-mode:vertical-rl;transform:rotate(180deg);font-size:var(--step-1);white-space:nowrap;max-height:22rem;overflow:hidden;text-overflow:ellipsis}
-  .c-services-panels__list > * .photo-card__body p{display:none}
-  .c-services-panels__list:not(:hover):not(:focus-within) > :first-child,.c-services-panels__list > :hover,.c-services-panels__list > :focus-within{flex:3.2 1 0}
-  .c-services-panels__list:not(:hover):not(:focus-within) > :first-child .photo-card__body h3,.c-services-panels__list > :hover .photo-card__body h3,.c-services-panels__list > :focus-within .photo-card__body h3{writing-mode:horizontal-tb;transform:none;font-size:var(--step-2);white-space:normal;max-height:none}
-  .c-services-panels__list:not(:hover):not(:focus-within) > :first-child .photo-card__body p,.c-services-panels__list > :hover .photo-card__body p,.c-services-panels__list > :focus-within .photo-card__body p{display:block}
-}
-@media(prefers-reduced-motion:reduce){.c-services-panels__list > *{transition:none}}

package/blocks/services/services-panels/template.html

@@ -1 +0,0 @@
-<section class="c-services-panels 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-services-panels__list"><slot name="panels"></slot></div></div></section>

package/blocks/services/services-photo-grid/README.md

@@ -1,39 +0,0 @@
-# services-photo-grid
-
-Photo tiles with the service name over a scrim; optional dark CTA tile.
-
-- **Category:** services
-- **Media:** one photo per service
-- **Registers:** trade, professional, beauty
-- **Variants:** four
-
-## 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 |
-| `tiles` | 3–8 `<a class="photo-card" href><img><div class="photo-card__body"><h3>…</h3><p>…</p></div></a>`; optionally one `<div class="card" data-scheme="dark">` CTA tile |
-
-## Example
-
-```html
-<services-photo-grid>
-  <p slot="eyebrow" class="eyebrow eyebrow--accent">What we do</p>
-  <h2 slot="heading">When we put our name on a case, we mean it.</h2>
-  <p slot="lede" class="lede">Five practice areas, one standard — honest, careful, and ours.</p>
-  <a slot="actions" class="btn-arrow" href="/services">All practice areas <svg class="icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M5 12h14M13 6l6 6-6 6"/></svg></a>
-  <a slot="tiles" class="photo-card" href="/services/business-law"><img src="/media/harvest/svc-1.jpg" alt="" width="1200" height="900" loading="lazy"><div class="photo-card__body"><h3>Business law</h3><p>Contracts, deals, and partnerships.</p></div></a>
-  <a slot="tiles" class="photo-card" href="/services/disputes"><img src="/media/harvest/svc-2.jpg" alt="" width="1200" height="900" loading="lazy"><div class="photo-card__body"><h3>Lawsuits &amp; disputes</h3><p>From first filing to final ruling.</p></div></a>
-  <a slot="tiles" class="photo-card" href="/services/compliance"><img src="/media/harvest/svc-3.jpg" alt="" width="1200" height="900" loading="lazy"><div class="photo-card__body"><h3>Compliance &amp; rules</h3><p>Steady guidance with regulators.</p></div></a>
-  <a slot="tiles" class="photo-card" href="/services/ip"><img src="/media/harvest/svc-4.jpg" alt="" width="1200" height="900" loading="lazy"><div class="photo-card__body"><h3>Intellectual property</h3><p>Patents, secrets, and brands.</p></div></a>
-  <a slot="tiles" class="photo-card" href="/services/restructuring"><img src="/media/harvest/svc-5.jpg" alt="" width="1200" height="900" loading="lazy"><div class="photo-card__body"><h3>Restructuring &amp; recovery</h3><p>Workouts and creditor protection.</p></div></a>
-  <div slot="tiles" class="card" data-scheme="dark"><div class="card__body"><h3>Meet the team behind the verdicts.</h3><a class="btn-arrow" href="/team">Our people <svg class="icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M5 12h14M13 6l6 6-6 6"/></svg></a></div></div>
-</services-photo-grid>
-```
-
-Variants: `<services-photo-grid variant="four">`.
-
-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/services/services-photo-grid/styles.css

@@ -1,10 +0,0 @@
-.c-services-photo-grid__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-3)}
-.c-services-photo-grid__grid > *{aspect-ratio:4/3;min-height:0}
-.c-services-photo-grid__grid .photo-card__body h3{font-size:var(--step-2)}
-.c-services-photo-grid__grid .photo-card__body p{font-size:var(--step-0)}
-.c-services-photo-grid__grid .card{justify-content:flex-end}
-.c-services-photo-grid__grid .card .card__body{flex:0;padding:var(--space-5)}
-.c-services-photo-grid__grid .card .card__body h3{font-size:var(--step-2)}
-@media(max-width:719px){.c-services-photo-grid__grid .photo-card__body p{display:none}.c-services-photo-grid__grid .photo-card__body{padding:var(--space-4)}.c-services-photo-grid__grid .photo-card__body h3{font-size:var(--step-1)}}
-@media(min-width:720px){.c-services-photo-grid__grid{gap:var(--space-4)}}
-@media(min-width:1080px){.c-services-photo-grid__grid{grid-template-columns:repeat(3,minmax(0,1fr))}.c-services-photo-grid--four .c-services-photo-grid__grid{grid-template-columns:repeat(4,minmax(0,1fr))}}

package/blocks/services/services-photo-grid/template.html

@@ -1 +0,0 @@
-<section class="c-services-photo-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-services-photo-grid__grid"><slot name="tiles"></slot></div></div></section>

package/blocks/services/services-priority/README.md

@@ -1,33 +0,0 @@
-# services-priority
-
-An unequal service index for a business with one primary offer and several supporting services. The featured service gets depth; the remaining rows stay easy to scan. Fictional Northline Counsel copy is used only for teaching.
-
-- **Category:** services
-- **Media:** none
-- **Registers:** professional, trade, b2b
-- **Variants:** (none)
-
-## Slots
-
-| Slot | Content |
-|------|---------|
-| `eyebrow` | Optional section label |
-| `heading` | `<h2>` explaining the service group |
-| `intro` | Optional brief context paragraph |
-| `featured` | One primary service article with action |
-| `items` | Two to four secondary service articles |
-
-## Example
-
-```html
-<services-priority>
-  <p slot="eyebrow" class="eyebrow eyebrow--accent">How we help</p>
-  <h2 slot="heading">Start with the decision in front of you.</h2>
-  <p slot="intro" class="lede">The first conversation is about the choice you need to make, the documents you have, and the time available.</p>
-  <article slot="featured"><p class="eyebrow">Primary practice</p><h3>Planning for the people who depend on you.</h3><p>Make your wishes clear and give the people you trust a workable plan.</p><a class="btn" href="/services/planning">Explore planning</a></article>
-  <article slot="items"><h3>Probate guidance</h3><p>Understand the court process and what the estate needs next.</p><a class="btn-arrow" href="/services/probate">View service</a></article>
-  <article slot="items"><h3>Business transitions</h3><p>Prepare ownership, documents, and decisions before a handover.</p><a class="btn-arrow" href="/services/business">View service</a></article>
-</services-priority>
-```
-
-Only use the unequal hierarchy when the business has a genuinely primary offer. Reorder or redesign the section if the services are peers.

package/blocks/services/services-priority/block.meta.json

@@ -1,86 +0,0 @@
-{
-  "schemaVersion": 1,
-  "id": "services/services-priority",
-  "revision": 1,
-  "status": "draft",
-  "owner": "Vitris design library",
-  "sourceHash": "538a84d99d4dc98cf0e725ccfba0749f71d254cabe70be9015354c017bc674a6",
-  "fit": {
-    "visitorJobs": [
-      "Compare primary and supporting services"
-    ],
-    "pageRoles": [
-      "service index"
-    ],
-    "useWhen": [
-      "Compare primary and supporting services"
-    ],
-    "avoidWhen": [
-      "The content or media cannot support this composition"
-    ]
-  },
-  "content": {
-    "requiredSlots": [
-      "heading",
-      "featured",
-      "items"
-    ],
-    "optionalSlots": [
-      "eyebrow",
-      "intro"
-    ],
-    "testedItemCounts": [
-      1
-    ]
-  },
-  "media": {
-    "min": 0,
-    "max": 8,
-    "optionalBehavior": "Recompose without empty media frames when media is optional",
-    "aspect": [
-      "content-dependent"
-    ]
-  },
-  "composition": {
-    "hierarchy": "one lead offer and supporting rows",
-    "alignment": "asymmetric",
-    "density": "medium",
-    "mediaProminence": "none",
-    "geometry": [
-      "priority",
-      "rows"
-    ],
-    "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/services--services-priority.json"
-  }
-}

package/blocks/services/services-priority/styles.css

@@ -1,16 +0,0 @@
-.c-services-priority{overflow-wrap:anywhere}
-.c-services-priority__head{display:grid;gap:var(--space-4);margin-bottom:var(--space-7)}
-.c-services-priority__head h2{max-width:15ch}
-.c-services-priority__head > p{max-width:52ch;color:var(--color-muted)}
-.c-services-priority__layout{display:grid;gap:var(--space-5)}
-.c-services-priority__featured{padding:var(--space-6);background:var(--color-surface-2);display:grid;align-content:space-between;min-height:24rem;min-width:0}
-.c-services-priority__featured > article{display:grid;gap:var(--space-4);align-content:start}
-.c-services-priority__featured h3{font-size:var(--step-3);max-width:16ch}
-.c-services-priority__featured p{max-width:48ch}
-.c-services-priority__others{border-top:1px solid var(--color-border);min-width:0}
-.c-services-priority .btn,.c-services-priority .btn-outline{white-space:normal;text-align:center;max-width:100%}
-.c-services-priority__others > article{display:grid;gap:var(--space-2);padding:var(--space-4) 0;border-bottom:1px solid var(--color-border)}
-.c-services-priority__others h3{font-size:var(--step-1)}
-.c-services-priority__others p{color:var(--color-muted);margin:0}
-.c-services-priority__others a{justify-self:start}
-@media(min-width:850px){.c-services-priority__head{grid-template-columns:minmax(0,1fr) minmax(18rem,.75fr);align-items:end}.c-services-priority__layout{grid-template-columns:minmax(0,1.25fr) minmax(18rem,.75fr);gap:var(--space-8)}}

package/blocks/services/services-priority/template.html

@@ -1 +0,0 @@
-<section class="c-services-priority section"><div class="wrap"><div class="c-services-priority__head"><div><slot name="eyebrow"></slot><slot name="heading"></slot></div><slot name="intro"></slot></div><div class="c-services-priority__layout"><div class="c-services-priority__featured"><slot name="featured"></slot></div><div class="c-services-priority__others"><slot name="items"></slot></div></div></div></section>

package/blocks/stats/stats-cards/README.md

@@ -1,31 +0,0 @@
-# stats-cards
-
-Metric cards with labels.
-
-- **Category:** stats
-- **Media:** none
-- **Registers:** b2b, trade
-- **Variants:** (none)
-
-## Slots
-
-| Slot | Content |
-|------|---------|
-| `eyebrow` | Optional `<p class="eyebrow">` |
-| `heading` | `<h2>` |
-| `lede` | Optional `<p class="lede">` (one sentence) |
-| `cards` | 3 `.card` items with a `.stat` and optional `<p>` detail |
-
-## Example
-
-```html
-<stats-cards>
-  <p slot="eyebrow" class="eyebrow eyebrow--accent">By the numbers</p>
-  <h2 slot="heading">What a year of maintenance looks like</h2>
-  <div slot="cards" class="card"><div class="card__body"><div class="stat"><p class="stat__value" data-count-to="312">312</p><p class="stat__label">Units under contract</p></div><p>Across 41 buildings from Kittery to Brunswick.</p></div></div>
-  <div slot="cards" class="card"><div class="card__body"><div class="stat"><p class="stat__value" data-count-to="97" data-count-suffix="%">97%</p><p class="stat__label">Issues caught on a scheduled visit</p></div><p>Only 3% of last year's repairs were emergency calls.</p></div></div>
-  <div slot="cards" class="card"><div class="card__body"><div class="stat"><p class="stat__value">2.6h</p><p class="stat__label">Median emergency response</p></div><p>Against a 4-hour contractual promise.</p></div></div>
-</stats-cards>
-```
-
-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/stats/stats-cards/styles.css

@@ -1,4 +0,0 @@
-.c-stats-cards__grid .card{background:var(--color-surface-2);border-color:transparent}
-.c-stats-cards__grid .card__body{padding:var(--space-6);gap:var(--space-4)}
-.c-stats-cards__grid .stat__value{font-size:var(--step-5)}
-.c-stats-cards__grid .card__body > p{font-size:var(--step-0)}

package/blocks/stats/stats-cards/template.html

@@ -1 +0,0 @@
-<section class="c-stats-cards section" data-island="counter"><div class="wrap"><div class="section__head"><slot name="eyebrow"></slot><slot name="heading"></slot><slot name="lede"></slot></div><div class="grid grid--3 c-stats-cards__grid"><slot name="cards"></slot></div></div></section>

package/blocks/stats/stats-mosaic/README.md

@@ -1,27 +0,0 @@
-# stats-mosaic
-
-Dark stat tiles alternating with photos in one band.
-
-- **Category:** stats
-- **Media:** 2 photos
-- **Registers:** professional, b2b, trade
-- **Variants:** (none)
-
-## Slots
-
-| Slot | Content |
-|------|---------|
-| `tiles` | 4 tiles alternating `<div class="stat" data-scheme="dark"><p class="eyebrow">Label</p><p class="stat__value">200+</p><p>Sentence.</p></div>` and `<div class="frame"><img></div>` |
-
-## Example
-
-```html
-<stats-mosaic>
-  <div slot="tiles" class="stat" data-scheme="dark"><p class="eyebrow">Cases</p><p class="stat__value">200+</p><p>Cases successfully resolved — showing the steady results we deliver.</p></div>
-  <div slot="tiles" class="frame"><img src="/media/harvest/mosaic-1.jpg" alt="Partners reviewing a brief" width="900" height="900" loading="lazy"></div>
-  <div slot="tiles" class="stat" data-scheme="dark"><p class="eyebrow">Clients</p><p class="stat__value">100+</p><p>Clients served with personal attention, clear advice, and dedicated support.</p></div>
-  <div slot="tiles" class="frame"><img src="/media/harvest/mosaic-2.jpg" alt="Lawyers walking through the office" width="900" height="900" loading="lazy"></div>
-</stats-mosaic>
-```
-
-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/stats/stats-mosaic/styles.css

@@ -1,9 +0,0 @@
-.c-stats-mosaic__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-3)}
-.c-stats-mosaic__grid > *{min-height:15rem}
-.c-stats-mosaic__grid > .stat{padding:var(--space-6);border-radius:var(--radius-lg);align-content:space-between;gap:var(--space-4)}
-.c-stats-mosaic__grid > .stat .eyebrow{color:var(--color-muted)}
-.c-stats-mosaic__grid > .stat .stat__value{font-size:var(--step-5)}
-.c-stats-mosaic__grid > .stat > p:last-child{margin:0;color:var(--color-muted);font-size:var(--step-0);max-width:16rem}
-.c-stats-mosaic__grid > .frame{box-shadow:none}
-.c-stats-mosaic__grid > .frame img{width:100%;height:100%;object-fit:cover}
-@media(min-width:900px){.c-stats-mosaic__grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-4)}.c-stats-mosaic__grid > *{min-height:17rem}}

package/blocks/stats/stats-mosaic/template.html

@@ -1 +0,0 @@
-<section class="c-stats-mosaic section--tight"><div class="wrap c-stats-mosaic__grid"><slot name="tiles"></slot></div></section>

package/blocks/stats/stats-row/README.md

@@ -1,29 +0,0 @@
-# stats-row
-
-Inline four metrics.
-
-- **Category:** stats
-- **Media:** none
-- **Registers:** trade, b2b, professional
-- **Variants:** dark
-
-## Slots
-
-| Slot | Content |
-|------|---------|
-| `stats` | 3–4 `.stat` blocks (`data-count-to` optional) |
-
-## Example
-
-```html
-<stats-row>
-  <div slot="stats" class="stat"><p class="stat__value" data-count-to="1200" data-count-suffix="+">1200+</p><p class="stat__label">Roofs replaced</p></div>
-  <div slot="stats" class="stat"><p class="stat__value" data-count-to="15">15</p><p class="stat__label">Years in Portland</p></div>
-  <div slot="stats" class="stat"><p class="stat__value">4.9</p><p class="stat__label">Average rating</p></div>
-  <div slot="stats" class="stat"><p class="stat__value" data-count-to="48" data-count-suffix="h">48h</p><p class="stat__label">Estimate turnaround</p></div>
-</stats-row>
-```
-
-Variants: `<stats-row variant="dark">`.
-
-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/stats/stats-row/styles.css

@@ -1,8 +0,0 @@
-.c-stats-row{border-block:1px solid var(--color-border)}
-.c-stats-row__row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-5)}
-.c-stats-row__row .stat{text-align:center;justify-items:center}
-@media(min-width:720px){
-  .c-stats-row__row{grid-template-columns:repeat(auto-fit,minmax(10rem,1fr))}
-  .c-stats-row__row .stat + .stat{border-left:1px solid var(--color-border)}
-}
-.c-stats-row--dark{--color-bg:#141210;--color-text:#F7F4EF;--color-muted:#B8B0A4;--color-surface:#1E1B18;--color-surface-2:#2A2622;--color-border:#3A342E;--color-focus:#F7F4EF;background:var(--color-bg);color:var(--color-text);border-block-color:transparent;padding-block:var(--space-7)}

package/blocks/stats/stats-row/template.html

@@ -1 +0,0 @@
-<section class="c-stats-row section--tight" data-island="counter"><div class="wrap c-stats-row__row"><slot name="stats"></slot></div></section>

package/blocks/stats/stats-split/README.md

@@ -1,35 +0,0 @@
-# stats-split
-
-Stat cluster beside copy.
-
-- **Category:** stats
-- **Media:** optional media
-- **Registers:** professional, trade
-- **Variants:** (none)
-
-## Slots
-
-| Slot | Content |
-|------|---------|
-| `eyebrow` | Optional `<p class="eyebrow">` |
-| `heading` | `<h2>` |
-| `lede` | Optional `<p class="lede">` (one sentence) |
-| `actions` | Optional button |
-| `stats` | 4 `.stat` blocks (rendered as a 2×2 grid) |
-
-## Example
-
-```html
-<stats-split>
-  <p slot="eyebrow" class="eyebrow eyebrow--accent">Track record</p>
-  <h2 slot="heading">Numbers our clients check before they call</h2>
-  <p slot="lede" class="lede">Every figure here is from the last twelve months and updates quarterly.</p>
-  <a slot="actions" class="btn" href="/contact">Talk to us</a>
-  <div slot="stats" class="stat"><p class="stat__value" data-count-to="214">214</p><p class="stat__label">Estates administered</p></div>
-  <div slot="stats" class="stat"><p class="stat__value" data-count-to="11">11</p><p class="stat__label">Days median to first filing</p></div>
-  <div slot="stats" class="stat"><p class="stat__value">$0</p><p class="stat__label">Surprise fees, ever</p></div>
-  <div slot="stats" class="stat"><p class="stat__value">4.9</p><p class="stat__label">Client rating</p></div>
-</stats-split>
-```
-
-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/stats/stats-split/styles.css

@@ -1,3 +0,0 @@
-.c-stats-split__copy .section__head{margin-bottom:var(--space-5)}
-.c-stats-split__grid{--gap:var(--space-4);grid-template-columns:repeat(2,minmax(0,1fr))}
-.c-stats-split__grid .stat{padding:var(--space-5);background:var(--color-surface);border-radius:var(--radius-lg);border:1px solid var(--color-border)}

package/blocks/stats/stats-split/template.html

@@ -1 +0,0 @@
-<section class="c-stats-split section section--muted" data-island="counter"><div class="wrap split"><div class="c-stats-split__copy"><div class="section__head"><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="grid grid--2 c-stats-split__grid"><slot name="stats"></slot></div></div></section>

package/blocks/team/team-featured/README.md

@@ -1,42 +0,0 @@
-# team-featured
-
-Featured person + roster.
-
-- **Category:** team
-- **Media:** portraits
-- **Registers:** professional, beauty
-- **Variants:** reverse
-
-## Slots
-
-| Slot | Content |
-|------|---------|
-| `media` | Featured portrait `<img>` (3:4) |
-| `lead` | `<h3>` name, `<p class="c-team-role">`, 1–2 `<p>` bio |
-| `eyebrow` | Optional `<p class="eyebrow">` |
-| `heading` | `<h2>` |
-| `lede` | Optional `<p class="lede">` |
-| `people` | 2 or 4 compact `.card` people (portrait, `<h3>`, `<p class="c-team-role">`) |
-
-## Example
-
-```html
-<team-featured>
-  <img src="/media/harvest/team-elena.jpg" alt="Dr. Elena Marsh" width="900" height="1200" slot="media" loading="lazy">
-  <h3 slot="lead">Dr. Elena Marsh, DDS</h3>
-  <p slot="lead" class="c-team-role">Owner &amp; general dentist</p>
-  <p slot="lead">Elena bought the practice in 2016 after eight years in a hospital dental clinic. She's known for talking through every step and for a very steady hand.</p>
-  <p slot="lead">Tufts DMD · Maine Dental Association · Invisalign certified</p>
-  <p slot="eyebrow" class="eyebrow eyebrow--accent">Our team</p>
-  <h2 slot="heading">Small on purpose</h2>
-  <p slot="lede" class="lede">Four people who know your name and your history.</p>
-  <div slot="people" class="card"><div class="card__media ratio-3x4"><img src="/media/harvest/team-nick.jpg" alt="Nick Alvarez" width="900" height="1200" loading="lazy"></div><div class="card__body"><h3>Nick Alvarez</h3><p class="c-team-role">Hygienist</p></div></div>
-  <div slot="people" class="card"><div class="card__media ratio-3x4"><img src="/media/harvest/team-june.jpg" alt="June Park" width="900" height="1200" loading="lazy"></div><div class="card__body"><h3>June Park</h3><p class="c-team-role">Hygienist</p></div></div>
-  <div slot="people" class="card"><div class="card__media ratio-3x4"><img src="/media/harvest/team-rob.jpg" alt="Rob Feeney" width="900" height="1200" loading="lazy"></div><div class="card__body"><h3>Rob Feeney</h3><p class="c-team-role">Dental assistant</p></div></div>
-  <div slot="people" class="card"><div class="card__media ratio-3x4"><img src="/media/harvest/team-tess.jpg" alt="Tess Morrow" width="900" height="1200" loading="lazy"></div><div class="card__body"><h3>Tess Morrow</h3><p class="c-team-role">Front desk &amp; billing</p></div></div>
-</team-featured>
-```
-
-Variants: `<team-featured variant="reverse">`.
-
-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/team/team-featured/styles.css

@@ -1,9 +0,0 @@
-.c-team-featured__grid{display:grid;gap:var(--space-7);align-items:start}
-@media(min-width:900px){.c-team-featured__grid{grid-template-columns:minmax(0,2fr) minmax(0,3fr);gap:var(--space-8)}.c-team-featured--reverse .c-team-featured__lead{order:2}}
-.c-team-featured__lead .card__body{padding:var(--space-5);gap:var(--space-2)}
-.c-team-featured__lead .card__body > h3{font-size:var(--step-2)}
-.c-team-featured__lead .card__body > p:not(.c-team-role){margin-top:var(--space-2)}
-.c-team-featured .c-team-role{color:var(--color-accent);font-weight:600;font-size:var(--step-0)}
-.c-team-featured__people{grid-template-columns:repeat(2,minmax(0,1fr));--gap:var(--space-4)}
-.c-team-featured__people .card__body{padding:var(--space-4);gap:var(--space-1)}
-.c-team-featured__people .card__body > h3{font-size:var(--step-1)}

package/blocks/team/team-featured/template.html

@@ -1 +0,0 @@
-<section class="c-team-featured section section--muted"><div class="wrap c-team-featured__grid"><div class="card c-team-featured__lead"><div class="card__media ratio-3x4"><slot name="media"></slot></div><div class="card__body"><slot name="lead"></slot></div></div><div class="c-team-featured__rest"><div class="section__head"><slot name="eyebrow"></slot><slot name="heading"></slot><slot name="lede"></slot></div><div class="grid grid--2 c-team-featured__people"><slot name="people"></slot></div></div></div></section>

package/blocks/team/team-grid/README.md

@@ -1,35 +0,0 @@
-# team-grid
-
-Portrait grid of people.
-
-- **Category:** team
-- **Media:** portraits
-- **Registers:** professional, beauty, b2b, trade
-- **Variants:** three
-
-## Slots
-
-| Slot | Content |
-|------|---------|
-| `eyebrow` | Optional `<p class="eyebrow">` |
-| `heading` | `<h2>` |
-| `lede` | Optional `<p class="lede">` |
-| `people` | 4 or 8 `.card` items: `.card__media.ratio-3x4` portrait, `<h3>` name, `<p class="c-team-role">`, optional one-line `<p>` |
-
-## Example
-
-```html
-<team-grid>
-  <p slot="eyebrow" class="eyebrow eyebrow--accent">The crew</p>
-  <h2 slot="heading">Eight people. Zero subcontractors.</h2>
-  <p slot="lede" class="lede">Everyone on your roof is on our payroll, trained by us, and insured by us.</p>
-  <div slot="people" class="card"><div class="card__media ratio-3x4"><img src="/media/harvest/team-mike.jpg" alt="Mike Harbor" width="900" height="1200" loading="lazy"></div><div class="card__body"><h3>Mike Harbor</h3><p class="c-team-role">Founder &amp; lead estimator</p><p>Started roofing in 1998; still climbs every roof he quotes.</p></div></div>
-  <div slot="people" class="card"><div class="card__media ratio-3x4"><img src="/media/harvest/team-ana.jpg" alt="Ana Reyes" width="900" height="1200" loading="lazy"></div><div class="card__body"><h3>Ana Reyes</h3><p class="c-team-role">Foreman</p><p>Runs the install crew. Twelve years, four hundred roofs.</p></div></div>
-  <div slot="people" class="card"><div class="card__media ratio-3x4"><img src="/media/harvest/team-devon.jpg" alt="Devon Blake" width="900" height="1200" loading="lazy"></div><div class="card__body"><h3>Devon Blake</h3><p class="c-team-role">Foreman</p><p>Metal and cedar specialist. Ex-shipwright.</p></div></div>
-  <div slot="people" class="card"><div class="card__media ratio-3x4"><img src="/media/harvest/team-sarah.jpg" alt="Sarah Lin" width="900" height="1200" loading="lazy"></div><div class="card__body"><h3>Sarah Lin</h3><p class="c-team-role">Office &amp; scheduling</p><p>The voice on the phone. Returns every call the same day.</p></div></div>
-</team-grid>
-```
-
-Variants: `<team-grid variant="three">`.
-
-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/team/team-grid/styles.css

@@ -1,8 +0,0 @@
-.c-team-grid__grid{grid-template-columns:repeat(2,minmax(0,1fr));--gap:var(--space-4)}
-@media(min-width:720px){.c-team-grid__grid{--gap:var(--space-5)}}
-@media(min-width:1080px){.c-team-grid__grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
-.c-team-grid__grid .card__body{padding:var(--space-4) var(--space-4) var(--space-5);gap:var(--space-1)}
-.c-team-grid__grid .card__body > h3{font-size:var(--step-1)}
-.c-team-grid__grid .c-team-role{font-size:var(--step-0);color:var(--color-accent);font-weight:600}
-.c-team-grid__grid .card__body > p:not(.c-team-role){font-size:var(--step-0);margin-top:var(--space-2)}
-@media(min-width:1080px){.c-team-grid--three .c-team-grid__grid{grid-template-columns:repeat(3,minmax(0,1fr))}}

package/blocks/team/team-grid/template.html

@@ -1 +0,0 @@
-<section class="c-team-grid section"><div class="wrap"><div class="section__head"><slot name="eyebrow"></slot><slot name="heading"></slot><slot name="lede"></slot></div><div class="grid grid--4 c-team-grid__grid"><slot name="people"></slot></div></div></section>

package/blocks/team/team-list/README.md

@@ -1,32 +0,0 @@
-# team-list
-
-Compact name/role list.
-
-- **Category:** team
-- **Media:** optional avatars
-- **Registers:** professional, b2b
-- **Variants:** (none)
-
-## Slots
-
-| Slot | Content |
-|------|---------|
-| `eyebrow` | Optional `<p class="eyebrow">` |
-| `heading` | `<h2>` |
-| `lede` | Optional `<p class="lede">` |
-| `people` | 4–10 `<li>`: `<img class="avatar">`, a `<div>` with `<strong>` name + `<span>` role, optional trailing `<a>` (email/LinkedIn) |
-
-## Example
-
-```html
-<team-list>
-  <p slot="eyebrow" class="eyebrow eyebrow--accent">People</p>
-  <h2 slot="heading">Who you'll work with</h2>
-  <li slot="people"><img src="/media/harvest/avatar-1.jpg" alt="" width="96" height="96" class="avatar"><div><strong>Rachel Osei</strong><span>Partner · estates &amp; trusts</span></div><a href="mailto:rachel@example.com">rachel@example.com</a></li>
-  <li slot="people"><img src="/media/harvest/avatar-2.jpg" alt="" width="96" height="96" class="avatar"><div><strong>Daniel Whitcomb</strong><span>Partner · probate &amp; elder law</span></div><a href="mailto:daniel@example.com">daniel@example.com</a></li>
-  <li slot="people"><img src="/media/harvest/avatar-3.jpg" alt="" width="96" height="96" class="avatar"><div><strong>Maya Torres</strong><span>Paralegal</span></div><a href="mailto:maya@example.com">maya@example.com</a></li>
-  <li slot="people"><img src="/media/harvest/avatar-4.jpg" alt="" width="96" height="96" class="avatar"><div><strong>Ben Carver</strong><span>Client coordinator</span></div><a href="tel:+15550102000">(555) 010-2000</a></li>
-</team-list>
-```
-
-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/team/team-list/styles.css

@@ -1,7 +0,0 @@
-.c-team-list__rows{list-style:none;margin:0;padding:0;display:grid;border-top:1px solid var(--color-border);max-width:52rem}
-.c-team-list__rows > *{display:flex;gap:var(--space-4);align-items:center;padding:var(--space-4) 0;border-bottom:1px solid var(--color-border)}
-.c-team-list__rows > * > div{display:grid;flex:1}
-.c-team-list__rows strong{font-weight:600}
-.c-team-list__rows span{color:var(--color-muted);font-size:var(--step-0)}
-.c-team-list__rows > * > a{color:var(--color-muted);font-size:var(--step-0);text-decoration:none}
-.c-team-list__rows > * > a:hover{color:var(--color-text)}

package/blocks/team/team-list/template.html

@@ -1 +0,0 @@
-<section class="c-team-list section"><div class="wrap"><div class="section__head"><slot name="eyebrow"></slot><slot name="heading"></slot><slot name="lede"></slot></div><ul class="c-team-list__rows"><slot name="people"></slot></ul></div></section>

package/blocks/testimonial/testimonial-carousel/README.md

@@ -1,32 +0,0 @@
-# testimonial-carousel
-
-Buttoned testimonial carousel.
-
-- **Category:** testimonial
-- **Media:** portraits
-- **Registers:** trade, beauty, food
-- **Variants:** (none)
-
-## Slots
-
-| Slot | Content |
-|------|---------|
-| `eyebrow` | Optional `<p class="eyebrow">` |
-| `heading` | `<h2>` |
-| `lede` | Optional `<p class="lede">` |
-| `cards` | 4–8 testimonial `<figure class="card">` slides (same markup as testimonial-grid) |
-
-## Example
-
-```html
-<testimonial-carousel>
-  <p slot="eyebrow" class="eyebrow eyebrow--accent">What clients say</p>
-  <h2 slot="heading">Rated 4.9 across 212 reviews</h2>
-  <figure slot="cards" class="card"><blockquote class="card__body"><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><p class="quote quote--card">“Showed up when they said they would, finished a day early, and the yard was cleaner than when they started.”</p></blockquote><figcaption class="card__footer byline"><img src="/media/harvest/review-1.jpg" alt="" width="96" height="96" class="avatar"><div><strong>Jordan P.</strong><span>Deering Center</span></div></figcaption></figure>
-  <figure slot="cards" class="card"><blockquote class="card__body"><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><p class="quote quote--card">“The estimate had every line explained. The final invoice matched it to the dollar.”</p></blockquote><figcaption class="card__footer byline"><img src="/media/harvest/review-2.jpg" alt="" width="96" height="96" class="avatar"><div><strong>Dana K.</strong><span>South Portland</span></div></figcaption></figure>
-  <figure slot="cards" class="card"><blockquote class="card__body"><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><p class="quote quote--card">“Two other companies said replace. Harbor fixed the flashing for $600 and it hasn't leaked since.”</p></blockquote><figcaption class="card__footer byline"><img src="/media/harvest/review-3.jpg" alt="" width="96" height="96" class="avatar"><div><strong>Chris M.</strong><span>Cape Elizabeth</span></div></figcaption></figure>
-  <figure slot="cards" class="card"><blockquote class="card__body"><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><p class="quote quote--card">“Our property management company has used them on eleven buildings. Same crew, same quality, every time.”</p></blockquote><figcaption class="card__footer byline"><img src="/media/harvest/review-4.jpg" alt="" width="96" height="96" class="avatar"><div><strong>Priya S.</strong><span>Bayside Property Group</span></div></figcaption></figure>
-</testimonial-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/testimonial/testimonial-carousel/styles.css

@@ -1,7 +0,0 @@
-.c-testimonial-carousel .card blockquote{margin:0;gap:var(--space-4)}
-.c-testimonial-carousel .card .quote{color:var(--color-text)}
-.c-testimonial-carousel .card .card__footer{border-top:1px solid var(--color-border);background:color-mix(in srgb,var(--color-surface-2) 60%,transparent)}
-.c-testimonial-carousel .card .rating .icon{width:1rem;height:1rem}
-.c-testimonial-carousel__head{display:flex;align-items:end;justify-content:space-between;gap:var(--space-5)}
-.c-testimonial-carousel__head .section__head,.c-testimonial-carousel__head .carousel__nav{margin-bottom:var(--space-6)}
-.c-testimonial-carousel__carousel .carousel__track > *{flex-basis:min(88%,24rem);display:flex;flex-direction:column}