# Kora Template Dump Analysis

Source: https://kora.framer.media

Dump date: 2026-04-29

## What Was Captured

- Firecrawl map output: `map.json`
- Firecrawl scrape output for:
  - `home`
  - `cases`
  - `cases/sitemark`
  - `cases/theo`
  - `cases/milano`
  - `cases/elevance`
  - `cases/hamilton`
  - `insights`
  - `contact`
  - `about`
- For each scraped page: `.json`, `.html`, `.md`, and `.links.json` when available.
- Raw Framer homepage HTML: `raw-home.html`
- Raw homepage asset references: `raw-home-assets.json`
- Downloaded referenced assets/modules: `assets/`
- Asset manifest: `asset-download-manifest.json`

## Asset Summary

- 43 JavaScript module assets
- 26 JPEG image assets
- 8 PNG image assets
- 1 SVG asset
- 1 CSS asset
- Total downloaded asset weight: about 16.3 MB

## Main Visual System

The template is not a card-heavy SaaS layout. It is an editorial agency layout built from large, immersive sections.

Core signals:

- Huge rounded image panels, often almost full viewport width.
- Floating pill navigation in the top left, separate black pill CTA in the top right.
- Inter-style typography with oversized, soft-weight headlines.
- Off-white page background with slightly warmer white panels.
- Deep charcoal and green used as the dominant contrast pair.
- Large vertical breathing room between sections.
- Case cards and testimonial cards sit inside or over image-heavy surfaces.
- Buttons are small pills, not oversized SaaS CTAs.

Observed color family from raw HTML:

- Deep ink: `rgb(36, 36, 36)`, `rgb(41, 41, 41)`, `#292929`
- Off-white: `rgb(255, 255, 250)`, `rgb(250, 250, 247)`, `rgb(247, 247, 237)`
- Green: `rgb(93, 195, 155)`, `#5dc39b`
- Muted text: `rgb(97, 97, 97)`

Observed radius pattern:

- Main visual containers: around `30px` to `40px`
- Smaller cards/buttons inherit softer pill or panel radii.
- The design uses rounded image surfaces aggressively, while inner cards are simpler.

## Homepage Structure

The homepage content order is:

1. Hero image stage
   - Full-width flower image.
   - Large white headline.
   - Small supporting copy.
   - Two CTAs.
   - Trust avatar row and logo row.
   - Floating case-study card in the lower right.

2. Statement section
   - Large headline: the old way does not scale.

3. Before/after change section
   - Two large vertical cards.
   - Left: before state.
   - Right: after state.

4. Services section
   - Intro proof metric/chart.
   - Repeating service modules.
   - Each module pairs strong copy with a large image or visual panel.
   - Each service includes “What we offer.”
   - Each service includes a quote/person proof block.

5. Case-study / proof section
   - Large image-led case study area.
   - Repeated metric blocks.

6. Testimonials
   - Hero-style testimonial image panel.
   - Large overlaid heading.
   - Glass quote card.
   - Rating/proof block.
   - Smaller testimonial cards below.

7. Pricing
   - Stage-based pricing cards.

8. FAQ
   - Tabbed categories.

9. Insights
   - Editorial card grid.

10. Contact/footer
   - CTA/form block.
   - Large footer with newsletter, founder card, socials, legal, navigation.

## Page Patterns To Reuse For Hyprd

Use the structure, not the exact Kora business copy.

Strong fits for Hyprd:

- Hero image stage with floating audit card.
- Before/after section for scattered digital layer vs owned digital layer.
- Services browser or alternating service modules, but not both in long repeated form.
- Testimonial/proof section with large corporate image and glass card.
- One primary form on Contact only.
- Case index as “sample audits now, approved case studies later.”
- Contact page as the only complete audit capture flow.

Weak fits for Hyprd:

- Kora’s pricing section is less important right now than the Free Digital Space Audit.
- Kora’s long repeated service modules can make Hyprd feel repetitive if copied too literally.
- Kora’s growth-agency proof metrics should not be copied until Hyprd has verified outcomes.

## Implementation Notes For Current Hyprd Site

The current Hyprd site should move closer to Kora by emphasizing:

- Fewer sections with stronger visual identity.
- Larger media-led surfaces.
- Shorter copy.
- One primary conversion path: audit request.
- More “image plus floating proof card” compositions.
- Less dashboard-style UI unless it serves the audit story.

The Kora template depends heavily on:

- Full-bleed or near-full-bleed image panels.
- Scroll-linked hero transitions.
- Sticky/floating nav.
- Large radius image containers.
- Small pills for tags, CTAs, and service metadata.
- Editorial proof cards, not generic SaaS feature grids.

## Files Most Useful For Build Reference

- `home.md`: readable page order and copy hierarchy.
- `home.html`: extracted page HTML from Firecrawl.
- `raw-home.html`: original shipped Framer HTML.
- `raw-home-assets.json`: source asset references.
- `asset-download-manifest.json`: downloaded asset inventory.
- `assets/`: downloaded image/module assets.
- `contact.md`: form and FAQ structure.
- `cases.md`: case index structure.
- `cases__sitemark.md`: case-detail page structure.

## Caution

This dump is a reference for analysis. Hyprd should reuse the layout logic and interaction ideas while keeping its own brand, content, assets, and implementation.