# Hero with laptop survey photo — Section Design Reference

Schema: Design Details SECTION.md v3.2
Source: https://primefold.ai/
Website: Primefold
Section ID: 689e10d7-b1ca-4edc-9aa6-0742c006e782
Design Details page: https://designdetails.io/sections/primefold-ai--home--ai-689e10d7-b1ca-4edc-9aa6-0742c006e782
Status: deterministic evidence captured; editorial AI review pending

## Purpose

This is a hero section on the Home page. Use the attached crop and measured browser facts to reconstruct its composition. Do not infer unmeasured source values.

## Layout

1440×1000px root; flex

## Visual signature

minimal, corporate, photographic, bold, soft-ui treatment at 1440×1000px. The crop spans 0–1000px of a 8058px page.

## Components

- Navigation Bar
- Hero With Background Imagery
- Logo Strip
- Feature Card
- Carousel
- Primary Button
- Newsletter Form
- Footer
- Interactive Feature Tabs
- Bento Grid Layout

## Evidence note

The geometry, typography, colors, media, and animation parameters below come from saved HTML/CSS/browser evidence when present. Website-level roles are supplied separately. Editorial section judgment remains pending unless the MCP resolves this source ID to a promoted canonical record.

## Build blueprint v3.2

### Purpose and classification

- Canonical type: hero
- Source type: hero
- Structure: 1440×1000px root; flex
- Layout: 1440×1000px root; flex
- Styles: minimal, corporate, photographic, bold, soft-ui
- Components: Navigation Bar, Hero With Background Imagery, Logo Strip, Feature Card, Carousel, Primary Button, Newsletter Form, Footer, Interactive Feature Tabs, Bento Grid Layout
- Purpose: hero section from the Home page of Primefold.
- Visual signature: rgba(0, 0, 0, 0) with 1440×1000px root; flex. Inspect the crop for image and content hierarchy.
- Place on the page: 1 of 8, before Feature collection (`495b0cdd-8173-4936-9a7f-8022435e125f`)

### Crop and composition

- Crop: 1440×1000px; aspect ratio 1.44:1
- Page bounds: 0–1000px of 8058px
- Guidance: Preserve the documented hierarchy and relationships; exact measurements were not deterministically captured.

### Exact typography evidence

The sectionScale values were measured inside this crop. The siteRoles values explain how those faces function across the source website; they must not replace section measurements.

```json
{
  "sectionScale": [
    {
      "role": "section heading",
      "family": "Stack Sans Headline",
      "stack": "\"Stack Sans Headline\", \"Stack Sans Headline Placeholder\", sans-serif",
      "size": "64px",
      "weight": "400",
      "lineHeight": "72px",
      "letterSpacing": "1.3px",
      "sample": "Ask your customers, your tenants, your teams. Anyone.",
      "element": "div",
      "occurrences": 2,
      "sourceId": "font-4"
    },
    {
      "role": "UI/supporting text",
      "family": "Inter",
      "stack": "Inter, \"Inter Placeholder\", sans-serif",
      "size": "16px",
      "weight": "500",
      "lineHeight": "24px",
      "letterSpacing": "-0.2px",
      "sample": "Platform",
      "element": "span",
      "occurrences": 30,
      "sourceId": "font-5"
    },
    {
      "role": "body/supporting copy",
      "family": "Inter",
      "stack": "Inter, \"Inter Placeholder\", sans-serif",
      "size": "18px",
      "weight": "400",
      "lineHeight": "24px",
      "letterSpacing": "normal",
      "sample": "Experience Intelligence, built to find the value in every voice.",
      "element": "p",
      "occurrences": 2,
      "sourceId": "font-14"
    },
    {
      "role": "body/supporting copy",
      "family": "not captured",
      "stack": "sans-serif",
      "size": "12px",
      "weight": "400",
      "lineHeight": "normal",
      "letterSpacing": "normal",
      "sample": "Autoplay is on. Use the Pause button for a better experience with a screen reader.",
      "element": "p",
      "occurrences": 1,
      "sourceId": "font-17"
    },
    {
      "role": "UI/supporting text",
      "family": "Inter",
      "stack": "Inter, \"Inter Placeholder\", sans-serif",
      "size": "16px",
      "weight": "500",
      "lineHeight": "22.9px",
      "letterSpacing": "-0.2px",
      "sample": "Explore XI",
      "element": "a",
      "occurrences": 4,
      "sourceId": "font-24"
    }
  ],
  "siteRoles": [
    {
      "role": "display",
      "size": "64px",
      "family": "Stack Sans Headline",
      "source": "computed",
      "traits": "Regular",
      "weight": "400",
      "evidence": "font-4: computed CSS at 1440×1000; AI role: Stack Sans Headline at 64px used for the main hero h1.",
      "sampleId": "font-4",
      "confidence": 0.95,
      "lineHeight": "72px",
      "letterSpacing": "1.3px"
    },
    {
      "role": "heading",
      "size": "48px",
      "family": "Stack Sans Headline",
      "source": "computed",
      "traits": "Regular",
      "weight": "400",
      "evidence": "font-1: computed CSS at 1440×1000; AI role: Stack Sans Headline at 48px used for major section h2 headings.",
      "sampleId": "font-1",
      "confidence": 0.9,
      "lineHeight": "56px",
      "letterSpacing": "1px"
    },
    {
      "role": "body",
      "size": "14px",
      "family": "Inter",
      "source": "computed",
      "traits": "Regular",
      "weight": "400",
      "evidence": "font-6: computed CSS at 1440×1000; AI role: Inter at 14px used extensively for standard paragraph text and descriptions.",
      "sampleId": "font-6",
      "confidence": 0.95,
      "lineHeight": "20px",
      "letterSpacing": "-0.1px"
    }
  ]
}
```

### Exact color evidence

The section samples record where each computed value was used. Functional roles come from the website-level classifier and remain separate.

```json
{
  "sectionUsage": [
    {
      "value": "#FFFFFF",
      "cssValue": "rgb(255, 255, 255)",
      "alpha": 1,
      "appliedAs": [
        "background",
        "text"
      ],
      "occurrences": 229,
      "sourceId": "color-1"
    },
    {
      "value": "#FAF9F8",
      "cssValue": "rgb(250, 249, 248)",
      "alpha": 1,
      "appliedAs": [
        "background"
      ],
      "occurrences": 6,
      "sourceId": "color-2"
    },
    {
      "value": "#000000",
      "cssValue": "rgb(0, 0, 0)",
      "alpha": 1,
      "appliedAs": [
        "background",
        "svg-fill"
      ],
      "occurrences": 16,
      "sourceId": "color-4"
    },
    {
      "value": "#1A1814",
      "cssValue": "rgb(26, 24, 20)",
      "alpha": 1,
      "appliedAs": [
        "text",
        "background"
      ],
      "occurrences": 23,
      "sourceId": "color-5"
    },
    {
      "value": "#FFFFFF",
      "cssValue": "rgba(255, 255, 255, 0.72)",
      "alpha": 0.7215686274509804,
      "appliedAs": [
        "background"
      ],
      "occurrences": 1,
      "sourceId": "color-10"
    },
    {
      "value": "#FFFFFF",
      "cssValue": "rgba(255, 255, 255, 0.12)",
      "alpha": 0.12156862745098039,
      "appliedAs": [
        "control-background",
        "background"
      ],
      "occurrences": 4,
      "sourceId": "color-11"
    },
    {
      "value": "#FFFFFF",
      "cssValue": "rgba(255, 255, 255, 0.24)",
      "alpha": 0.23921568627450981,
      "appliedAs": [
        "control-background"
      ],
      "occurrences": 2,
      "sourceId": "color-18"
    },
    {
      "value": "#211E1C",
      "cssValue": "rgb(33, 30, 28)",
      "alpha": 1,
      "appliedAs": [
        "text"
      ],
      "occurrences": 2,
      "sourceId": "color-19"
    },
    {
      "value": "#FAFAFA",
      "cssValue": "rgb(250, 250, 250)",
      "alpha": 1,
      "appliedAs": [
        "background"
      ],
      "occurrences": 1,
      "sourceId": "color-20"
    },
    {
      "value": "#FFFFFF",
      "cssValue": "rgba(255, 255, 255, 0.16)",
      "alpha": 0.1607843137254902,
      "appliedAs": [
        "border"
      ],
      "occurrences": 12,
      "sourceId": "color-22"
    },
    {
      "value": "#373533",
      "cssValue": "rgb(55, 53, 51)",
      "alpha": 1,
      "appliedAs": [
        "text"
      ],
      "occurrences": 1,
      "sourceId": "color-25"
    },
    {
      "value": "#FFFFFF",
      "cssValue": "rgba(255, 255, 255, 0.4)",
      "alpha": 0.4,
      "appliedAs": [
        "border"
      ],
      "occurrences": 4,
      "sourceId": "color-29"
    },
    {
      "value": "#1C1616",
      "cssValue": "color(srgb 0.101961 0.0941176 0.0784314 / 0.18)",
      "alpha": 0.1803921568627451,
      "appliedAs": [
        "background"
      ],
      "occurrences": 1,
      "sourceId": "color-30"
    }
  ],
  "functionalPalette": [
    {
      "hex": "#FFFFFF",
      "name": "canvas",
      "role": "canvas",
      "source": "computed",
      "evidence": "color-1: computed rgb(255, 255, 255); AI role: Pure white (#FFFFFF) used as the primary background color for the main document body.",
      "sampleId": "color-1",
      "confidence": 0.95
    },
    {
      "hex": "#1A1814",
      "name": "text",
      "role": "text",
      "source": "computed",
      "evidence": "color-5: computed rgb(26, 24, 20); AI role: Dark gray/almost black (#1A1814) used for high-contrast primary text on light backgrounds.",
      "sampleId": "color-5",
      "confidence": 0.95
    },
    {
      "hex": "#FAF9F8",
      "name": "surface",
      "role": "surface",
      "source": "computed",
      "evidence": "color-2: computed rgb(250, 249, 248); AI role: Off-white/light gray (#FAF9F8) used as a background for specific distinct sections to separate content.",
      "sampleId": "color-2",
      "confidence": 0.9
    },
    {
      "hex": "#616161",
      "name": "muted text",
      "role": "muted-text",
      "source": "computed",
      "evidence": "color-12: computed rgb(97, 97, 97); AI role: Medium gray (#616161) used for secondary or less prominent text.",
      "sampleId": "color-12",
      "confidence": 0.85
    }
  ]
}
```

### Design tokens

```json
{
  "radius": "Consistent use of large border-radius across cards, interactive elements, and layout boundaries.",
  "density": "Low density, utilizing significant negative space to draw focus to typography and imagery.",
  "evidence": "Observed via visual inspection of section layouts, card structures, button shapes, and overall spacing in the provided desktop crops.",
  "borderStyle": "Mostly borderless design relying on background color differences or shadows, with occasional subtle transparent borders.",
  "buttonStyle": "Pill-shaped, appearing in both solid contrasting colors (white on dark, black on light) and semi-transparent treatments.",
  "cornerStyle": "Fully rounded (pill-shaped) buttons and heavily rounded corners on cards and image containers.",
  "contentWidth": "Centered content with a constrained maximum width to ensure readability on large displays.",
  "spacingRhythm": "Generous and structured, with large vertical padding between sections to allow content to breathe."
}
```

### Reconstruction specification

This is the implementation contract for the captured desktop viewport. Prefer section-specific facts here over general website descriptions.

- Root: 1440×1000px; flex; padding {"top":"0px","right":"0px","bottom":"0px","left":"0px"}; gap 10px; background rgba(0, 0, 0, 0); radius 0px.
- Observed gaps: 8, 10, 16px.
- Representative content widths: 1280, 650px.
- Layout containers: 4; cards/surfaces: 4; media elements: 10; browser animations: 0.

#### Container, grid, and spacing

```json
{
  "viewport": {
    "width": 1440,
    "captureBounds": {
      "top": 0,
      "bottom": 992,
      "pageHeight": 7994
    }
  },
  "container": {
    "size": "1440×1000px",
    "position": "x 0px, y 0px",
    "display": "flex",
    "positionMode": "relative",
    "padding": {
      "top": "0px",
      "right": "0px",
      "bottom": "0px",
      "left": "0px"
    },
    "margin": {
      "top": "0px",
      "right": "0px",
      "bottom": "0px",
      "left": "0px"
    },
    "gap": "10px",
    "columns": "not captured",
    "background": "rgba(0, 0, 0, 0)",
    "radius": "0px",
    "border": "0px none rgb(0, 0, 0)",
    "shadow": "none",
    "overflow": "visible"
  },
  "spacing": {
    "observedGapsPx": [
      8,
      10,
      16
    ],
    "representativeContentWidthsPx": [
      1280,
      650
    ]
  },
  "columns": [
    {
      "element": "section · @keyframes rmxSlideInR-re { from { transform: translateX(100%); } to { transform: translateX(0); } }",
      "size": "1440×1000px",
      "position": "x 0px, y 0px",
      "display": "flex",
      "template": "not captured",
      "direction": "row",
      "gap": "10px"
    },
    {
      "element": "p · Book a callSee how it works",
      "size": "650×43px",
      "position": "x 80px, y 412px",
      "display": "flex",
      "template": "not captured",
      "direction": "row",
      "gap": "16px"
    },
    {
      "element": "p · Explore RIBook a call",
      "size": "650×43px",
      "position": "x 80px, y 388px",
      "display": "flex",
      "template": "not captured",
      "direction": "row",
      "gap": "16px"
    },
    {
      "element": "div · PlatformExperience IntelligenceReal Estate IntelligenceMore coming in 2027",
      "size": "1280×102px",
      "position": "x 80px, y 866px",
      "display": "flex",
      "template": "not captured",
      "direction": "row",
      "gap": "16px"
    }
  ]
}
```

#### Cards and surfaces

```json
{
  "cards": [
    {
      "element": "a · Platform",
      "size": "215×102px",
      "position": "x 80px, y 866px",
      "padding": [
        "20px",
        "20px",
        "20px",
        "20px"
      ],
      "radius": "8px",
      "border": "1px solid rgba(255, 255, 255, 0.4)",
      "shadow": "none",
      "background": "rgb(255, 255, 255)"
    },
    {
      "element": "a · Experience Intelligence",
      "size": "215×102px",
      "position": "x 311px, y 866px",
      "padding": [
        "20px",
        "20px",
        "20px",
        "20px"
      ],
      "radius": "8px",
      "border": "1px solid rgba(255, 255, 255, 0.16)",
      "shadow": "none",
      "background": "rgba(255, 255, 255, 0.12)"
    },
    {
      "element": "a · Real Estate Intelligence",
      "size": "215×102px",
      "position": "x 542px, y 866px",
      "padding": [
        "20px",
        "20px",
        "20px",
        "20px"
      ],
      "radius": "8px",
      "border": "1px solid rgba(255, 255, 255, 0.16)",
      "shadow": "none",
      "background": "rgba(255, 255, 255, 0.12)"
    },
    {
      "element": "div · More coming in 2027",
      "size": "215×102px",
      "position": "x 773px, y 866px",
      "padding": [
        "20px",
        "20px",
        "20px",
        "20px"
      ],
      "radius": "8px",
      "border": "1px solid rgba(255, 255, 255, 0.16)",
      "shadow": "none",
      "background": "rgba(255, 255, 255, 0.12)"
    }
  ],
  "surfaces": {
    "radii": [
      "999px",
      "8px"
    ],
    "borders": [
      "1px solid rgba(255, 255, 255, 0.4)",
      "1px solid rgba(255, 255, 255, 0.16)"
    ],
    "shadows": [
      "rgba(38, 57, 90, 0.16) 0px 0px 0px 1px, rgba(38, 57, 91, 0.1) 0px 1px 1px 0px"
    ]
  }
}
```

#### Media treatment

```json
[
  {
    "element": "img · img",
    "size": "1440×1000px",
    "position": "x 0px, y 0px",
    "aspectRatio": 1.4,
    "objectFit": "cover",
    "objectPosition": "50% 50%",
    "radius": "0px",
    "overflow": "clip",
    "source": "https://framerusercontent.com/images/RAjs2AsxMPYWQK7qgQzwPegjUEI.webp?scale-down-to=2048&width=3200&height=1788"
  },
  {
    "element": "img · img",
    "size": "1440×1000px",
    "position": "x 0px, y 0px",
    "aspectRatio": 1.4,
    "objectFit": "cover",
    "objectPosition": "50% 50%",
    "radius": "0px",
    "overflow": "clip",
    "source": "https://framerusercontent.com/images/0ludMTRIYsIsZjBXbYoAOYh09IY.webp?scale-down-to=2048&width=3500&height=1969"
  },
  {
    "element": "canvas · canvas",
    "size": "104×36px",
    "position": "x 1250px, y 20px",
    "aspectRatio": 2.9,
    "objectFit": "fill",
    "objectPosition": "50% 50%",
    "radius": "0px",
    "overflow": "clip",
    "source": "source not captured"
  },
  {
    "element": "img · framer-Q1hM3 framer-hl7epk",
    "size": "124×24px",
    "position": "x 80px, y 24px",
    "aspectRatio": 5.2,
    "objectFit": "fill",
    "objectPosition": "50% 50%",
    "radius": "0px",
    "overflow": "clip",
    "source": "data:image/svg+xml,<svg display=\"block\" id=\"4095158972\" role=\"presentation\" viewBox=\"0 0 114 22\" xmlns=\"http://www.w3.org/2000/svg\"><g fill=\"transparent\" height=\"22.00164818859829px\" id=\"Zucbdu4MF\" transform=\"translate(-0.002 -0.002)\" width=\"113.66718309999723px\"><path d=\"M 0 22 L 0 0 L 113.663 0 L 113.663 22 Z\" fill=\"transparent\" height=\"22px\" id=\"Olo7fCEKZ\" transform=\"translate(0.002 0.002)\" width=\"113.663px\"/><g fill=\"transparent\" height=\"22.00164818859829px\" id=\"dBdiT0hkU\" transform=\"translate(0 0)\" width=\"113.66718309999723px\"><path d=\"M 0 22 L 0 0 L 113.667 0 L 113.667 22 Z\" fill=\"transparent\" height=\"22px\" id=\"HlwODwLcz\" transform=\"translate(0 0)\" width=\"113.667px\"/><g fill=\"transparent\" height=\"22.000015497353694px\" id=\"y6KXZ3sS1\" transform=\"translate(0 0.002)\" width=\"21.999932427587844px\"><path d=\"M 0 5.745 C 0.801 0.548 7.745 -1.707 10.173 1.449 C 12.917 5.015 9.215 10.459 13.533 12.898 C 12.65 13.145 11.74 13.282 10.823 13.306 C 9.132 12.239 8.55 10.035 8.699 7.582 C 8.916 4.042 7.87 3.054 7.153 2.822 C 6.143 2.494 3.009 2.552 0.801 7.582 C 0.478 6.995 0.21 6.381 0 5.745 Z\" fill=\"rgb(255, 255, 255)\" height=\"13.30633282676043px\" id=\"tRs9SNX87\" transform=\"translate(0.41 8.694)\" width=\"13.533041px\"/><path d=\"M 3.493 15.835 C 2.267 14.73 5.5 9.402 6.433 11.193 C 7.291 12.841 5.328 15.836 7.011 17.978 C 5.715 17.49 4.521 16.763 3.493 15.836 Z M 1.658 1.671 C 4.253 -0.243 9.343 -0.313 11.621 0.466 C 16.646 2.183 17.175 6.996 17.502 10.392 C 17.737 12.826 18.871 13.732 19.97 14.035 C 19.319 14.949 18.532 15.759 17.638 16.437 C 12.098 14.678 16.672 8.543 11.794 4.075 C 8.869 1.397 2.415 2.575 0 5.925 C 0.246 4.406 0.811 2.956 1.658 1.671 Z\" fill=\"rgb(255, 255, 255)\" height=\"17.977545302988563px\" id=\"SbeWNdm8c\" transform=\"translate(0 3.317)\" width=\"19.97023105px\"/><path d=\"M 6.145 0 C 12.259 0 17.216 4.926 17.216 11.002 C 17.216 11.944 17.095 12.882 16.855 13.793 C 14.638 13.235 16.184 11.002 13.929 6.532 C 11.673 2.063 6.89 -0.629 0 1.849 C 1.821 0.639 3.959 -0.004 6.145 0 Z\" fill=\"rgb(255, 255, 255)\" height=\"13.79311525874974px\" id=\"VEh7YSgOC\" transform=\"translate(4.784 0)\" width=\"17.21557154196773px\"/></g><path d=\"M 76.042 13.809 C 75.116 13.809 74.311 13.587 73.626 13.142 C 72.953 12.685 72.43 12.055 72.058 11.249 C 71.685 10.444 71.499 9.525 71.499 8.491 C 71.499 7.446 71.685 6.52 72.058 5.715 C 72.43 4.91 72.953 4.279 73.626 3.822 C 74.311 3.365 75.116 3.137 76.042 3.137 C 76.811 3.137 77.466 3.299 78.006 3.624 C 78.547 3.948 78.974 4.399 79.287 4.976 L 79.287 11.989 C 78.994 12.533 78.565 12.992 78.043 13.323 C 77.514 13.647 76.847 13.809 76.042 13.809 Z M 76.294 12.043 C 76.967 12.043 77.52 11.892 77.952 11.592 C 78.397 11.279 78.728 10.853 78.944 10.312 C 79.172 9.771 79.287 9.164 79.287 8.491 C 79.287 7.806 79.172 7.193 78.944 6.652 C 78.728 6.111 78.397 5.685 77.952 5.372 C 77.52 5.06 76.967 4.904 76.294 4.904 C 75.717 4.904 75.218 5.054 74.798 5.354 C 74.377 5.643 74.053 6.057 73.824 6.598 C 73.596 7.139 73.482 7.77 73.482 8.491 C 73.482 9.2 73.596 9.825 73.824 10.366 C 74.053 10.895 74.377 11.31 74.798 11.61 C 75.218 11.898 75.717 12.043 76.294 12.043 Z M 79.287 13.521 L 79.287 0 L 81.216 0 L 81.216 13.521 Z M 67.732 0 L 69.661 0 L 69.661 13.521 L 67.732 13.521 Z M 60.828 13.809 C 59.782 13.809 58.875 13.587 58.106 13.142 C 57.337 12.685 56.736 12.055 56.303 11.249 C 55.882 10.444 55.672 9.525 55.672 8.491 C 55.672 7.446 55.882 6.52 56.303 5.715 C 56.736 4.91 57.337 4.279 58.106 3.822 C 58.875 3.365 59.782 3.137 60.828 3.137 C 61.874 3.137 62.781 3.365 63.55 3.822 C 64.319 4.279 64.914 4.91 65.335 5.715 C 65.768 6.52 65.984 7.446 65.984 8.491 C 65.984 9.525 65.768 10.444 65.335 11.249 C 64.914 12.055 64.319 12.685 63.55 13.142 C 62.781 13.587 61.874 13.809 60.828 13.809 Z M 60.828 12.043 C 61.489 12.043 62.054 11.898 62.522 11.61 C 62.991 11.31 63.352 10.895 63.604 10.366 C 63.857 9.825 63.983 9.2 63.983 8.491 C 63.983 7.77 63.857 7.139 63.604 6.598 C 63.352 6.057 62.991 5.643 62.522 5.354 C 62.054 5.054 61.489 4.904 60.828 4.904 C 60.167 4.904 59.596 5.054 59.115 5.354 C 58.646 5.643 58.286 6.057 58.034 6.598 C 57.781 7.139 57.655 7.77 57.655 8.491 C 57.655 9.2 57.781 9.825 58.034 10.366 C 58.286 10.895 58.646 11.31 59.115 11.61 C 59.596 11.898 60.167 12.043 60.828 12.043 Z M 50.53 13.521 L 50.53 2.56 C 50.53 2.043 50.626 1.593 50.819 1.208 C 51.023 0.823 51.341 0.529 51.774 0.325 C 52.207 0.108 52.754 0 53.415 0 L 54.983 0 L 54.983 1.659 L 53.433 1.659 C 52.784 1.659 52.459 1.959 52.459 2.56 L 52.459 13.521 Z M 49.376 3.425 L 54.713 3.425 L 54.713 5.084 L 49.376 5.084 Z M 43.575 13.809 C 42.53 13.809 41.622 13.587 40.853 13.142 C 40.084 12.685 39.483 12.055 39.05 11.249 C 38.63 10.444 38.419 9.525 38.419 8.491 C 38.419 7.446 38.63 6.52 39.05 5.715 C 39.483 4.91 40.084 4.279 40.853 3.822 C 41.622 3.365 42.53 3.137 43.575 3.137 C 44.26 3.137 44.904 3.269 45.504 3.533 C 46.105 3.798 46.622 4.189 47.055 4.705 C 47.487 5.222 47.806 5.853 48.01 6.598 C 48.215 7.332 48.269 8.173 48.172 9.122 L 39.519 9.122 L 39.519 7.5 L 47.091 7.5 L 46.279 8.058 C 46.315 7.482 46.231 6.959 46.027 6.49 C 45.823 6.009 45.516 5.625 45.108 5.336 C 44.699 5.048 44.188 4.904 43.575 4.904 C 42.866 4.904 42.277 5.06 41.809 5.372 C 41.34 5.685 40.985 6.111 40.745 6.652 C 40.517 7.193 40.402 7.806 40.402 8.491 C 40.402 9.164 40.517 9.771 40.745 10.312 C 40.985 10.853 41.34 11.279 41.809 11.592 C 42.277 11.892 42.866 12.043 43.575 12.043 C 44.284 12.043 44.843 11.88 45.252 11.556 C 45.673 11.219 45.961 10.811 46.117 10.33 L 48.172 10.33 C 48.016 11.027 47.728 11.634 47.307 12.151 C 46.898 12.667 46.376 13.076 45.739 13.377 C 45.114 13.665 44.393 13.809 43.575 13.809 Z M 22.593 3.425 L 24.522 3.425 L 24.522 13.521 L 22.593 13.521 Z M 24.522 8.491 L 24.233 6.508 C 24.233 6.195 24.287 5.847 24.396 5.462 C 24.508 5.069 24.684 4.698 24.918 4.363 C 25.171 4.002 25.501 3.708 25.91 3.479 C 26.331 3.251 26.859 3.137 27.496 3.137 C 28.121 3.137 28.668 3.269 29.137 3.533 C 29.606 3.798 29.966 4.237 30.219 4.849 C 30.483 5.451 30.615 6.268 30.615 7.301 L 30.615 13.521 L 28.686 13.521 L 28.686 7.536 C 28.686 6.983 28.644 6.508 28.56 6.111 C 28.488 5.703 28.332 5.39 28.091 5.174 C 27.851 4.946 27.484 4.831 26.992 4.831 C 26.571 4.831 26.174 4.97 25.802 5.246 C 25.429 5.523 25.123 5.931 24.882 6.472 C 24.642 7.013 24.522 7.686 24.522 8.491 Z M 30.615 8.491 L 30.128 6.508 C 30.128 6.195 30.189 5.847 30.309 5.462 C 30.447 5.066 30.648 4.695 30.904 4.363 C 31.18 4.002 31.535 3.708 31.967 3.479 C 32.412 3.251 32.953 3.137 33.59 3.137 C 34.215 3.137 34.762 3.269 35.23 3.533 C 35.699 3.798 36.06 4.237 36.312 4.849 C 36.576 5.451 36.709 6.268 36.709 7.301 L 36.709 13.521 L 34.78 13.521 L 34.78 7.536 C 34.78 6.983 34.737 6.508 34.653 6.111 C 34.581 5.703 34.425 5.39 34.185 5.174 C 33.944 4.946 33.578 4.831 33.085 4.831 C 32.664 4.831 32.268 4.97 31.895 5.246 C 31.523 5.523 31.216 5.931 30.976 6.472 C 30.735 7.013 30.615 7.686 30.615 8.491 Z M 18.38 3.425 L 20.327 3.425 L 20.327 13.521 L 18.38 13.521 Z M 18.272 0 L 20.435 0 L 20.435 2.217 L 18.272 2.217 Z M 11.344 3.425 L 13.273 3.425 L 13.273 13.521 L 11.344 13.521 Z M 13.273 8.221 L 13.002 6.724 C 13.002 6.412 13.038 6.051 13.111 5.643 C 13.195 5.234 13.357 4.843 13.597 4.471 C 13.85 4.086 14.216 3.768 14.697 3.515 C 15.19 3.263 15.839 3.137 16.644 3.137 L 16.644 5.084 C 15.935 5.084 15.328 5.18 14.823 5.372 C 14.318 5.565 13.934 5.889 13.669 6.346 C 13.405 6.79 13.273 7.415 13.273 8.221 Z M 0 0.901 L 1.965 0.901 L 1.965 13.521 L 0 13.521 Z M 0.992 7.373 L 4.164 7.373 L 4.164 9.104 L 0.992 9.104 Z M 4.164 7.373 C 4.898 7.373 5.517 7.307 6.021 7.175 C 6.538 7.043 6.929 6.802 7.193 6.454 C 7.47 6.106 7.608 5.619 7.608 4.994 C 7.608 4.357 7.47 3.87 7.193 3.533 C 6.929 3.185 6.538 2.95 6.021 2.83 C 5.517 2.698 4.898 2.632 4.164 2.632 L 4.164 0.901 C 5.294 0.901 6.268 1.034 7.085 1.298 C 7.914 1.562 8.551 1.995 8.996 2.596 C 9.441 3.185 9.663 3.984 9.663 4.994 C 9.663 5.979 9.441 6.778 8.996 7.391 C 8.551 7.992 7.914 8.431 7.085 8.707 C 6.268 8.972 5.294 9.104 4.164 9.104 Z M 0.992 0.901 L 4.164 0.901 L 4.164 2.632 L 0.992 2.632 Z\" fill=\"rgb(255, 255, 255)\" height=\"13.809310091476439px\" id=\"RCx0UqITE\" transform=\"translate(31.547 4.203)\" width=\"81.21579656982422px\"/></g></g></svg>"
  },
  {
    "element": "canvas · canvas",
    "size": "74×36px",
    "position": "x 1153px, y 20px",
    "aspectRatio": 2.1,
    "objectFit": "fill",
    "objectPosition": "50% 50%",
    "radius": "0px",
    "overflow": "clip",
    "source": "source not captured"
  },
  {
    "element": "img · img",
    "size": "20×20px",
    "position": "x 101px, y 887px",
    "aspectRatio": 1,
    "objectFit": "contain",
    "objectPosition": "50% 50%",
    "radius": "0px",
    "overflow": "clip",
    "source": "https://framerusercontent.com/images/0ngLiiCSe7c81sENFiXDCxUe8Ew.svg?width=20&height=20"
  },
  {
    "element": "img · img",
    "size": "20×20px",
    "position": "x 101px, y 887px",
    "aspectRatio": 1,
    "objectFit": "contain",
    "objectPosition": "50% 50%",
    "radius": "0px",
    "overflow": "clip",
    "source": "https://framerusercontent.com/images/Ok2FqoeufFP2awsp0MRNxJXTDA.svg?width=20&height=20"
  },
  {
    "element": "img · img",
    "size": "20×20px",
    "position": "x 332px, y 887px",
    "aspectRatio": 1,
    "objectFit": "contain",
    "objectPosition": "50% 50%",
    "radius": "0px",
    "overflow": "clip",
    "source": "https://framerusercontent.com/images/8Xe3QbAF8z173WRaVrPeURWrGc.svg?width=20&height=20"
  },
  {
    "element": "img · img",
    "size": "20×20px",
    "position": "x 563px, y 887px",
    "aspectRatio": 1,
    "objectFit": "contain",
    "objectPosition": "50% 50%",
    "radius": "0px",
    "overflow": "clip",
    "source": "https://framerusercontent.com/images/Vmatt47vXW6vUstSo8WnUvQwvRQ.svg?width=20&height=20"
  },
  {
    "element": "img · img",
    "size": "20×20px",
    "position": "x 794px, y 887px",
    "aspectRatio": 1,
    "objectFit": "contain",
    "objectPosition": "50% 50%",
    "radius": "0px",
    "overflow": "clip",
    "source": "https://framerusercontent.com/images/FKdTY48jmzOKCr6FVHOYD8MSv7s.svg?width=20&height=20"
  }
]
```

#### Browser-exposed animation parameters

```json
[]
```

### Measured geometry, surfaces, media, and animation

These raw values come from the saved element map and computed styles. Empty arrays mean the fact was not captured; they are not permission to invent source values.

```json
{
  "schema": "little-details-section-measurements-v1",
  "source": "saved DOM/CSS element and animation maps",
  "capturedAt": "2026-09-24T19:16:13.727Z",
  "viewportWidth": 1440,
  "bounds": {
    "top": 0,
    "bottom": 992,
    "pageHeight": 7994
  },
  "root": {
    "id": "ld-8",
    "tag": "section",
    "role": null,
    "label": "@keyframes rmxSlideInR-re { from { transform: translateX(100%); } to { transform: translateX(0); } }",
    "rect": {
      "x": 0,
      "y": 0,
      "width": 1440,
      "height": 1000
    },
    "display": "flex",
    "position": "relative",
    "padding": {
      "top": "0px",
      "right": "0px",
      "bottom": "0px",
      "left": "0px"
    },
    "margin": {
      "top": "0px",
      "right": "0px",
      "bottom": "0px",
      "left": "0px"
    },
    "gap": "10px",
    "columns": null,
    "background": "rgba(0, 0, 0, 0)",
    "radius": "0px",
    "border": "0px none rgb(0, 0, 0)",
    "shadow": "none",
    "overflow": "visible"
  },
  "spacing": {
    "gapsPx": [
      8,
      10,
      16
    ],
    "representativeContentWidthsPx": [
      1280,
      650
    ]
  },
  "columns": [
    {
      "id": "ld-8",
      "tag": "section",
      "role": null,
      "label": "@keyframes rmxSlideInR-re { from { transform: translateX(100%); } to { transform: translateX(0); } }",
      "rect": {
        "x": 0,
        "y": 0,
        "width": 1440,
        "height": 1000
      },
      "display": "flex",
      "columns": null,
      "direction": "row",
      "gap": "10px"
    },
    {
      "id": "ld-24",
      "tag": "p",
      "role": null,
      "label": "Book a callSee how it works",
      "rect": {
        "x": 80,
        "y": 412,
        "width": 650,
        "height": 43
      },
      "display": "flex",
      "columns": null,
      "direction": "row",
      "gap": "16px"
    },
    {
      "id": "ld-43",
      "tag": "p",
      "role": null,
      "label": "Explore RIBook a call",
      "rect": {
        "x": 80,
        "y": 388,
        "width": 650,
        "height": 43
      },
      "display": "flex",
      "columns": null,
      "direction": "row",
      "gap": "16px"
    },
    {
      "id": "ld-52",
      "tag": "div",
      "role": "tablist",
      "label": "PlatformExperience IntelligenceReal Estate IntelligenceMore coming in 2027",
      "rect": {
        "x": 80,
        "y": 866,
        "width": 1280,
        "height": 102
      },
      "display": "flex",
      "columns": null,
      "direction": "row",
      "gap": "16px"
    }
  ],
  "cards": [
    {
      "id": "ld-53",
      "tag": "a",
      "role": "tab",
      "label": "Platform",
      "rect": {
        "x": 80,
        "y": 866,
        "width": 215,
        "height": 102
      },
      "radius": "8px",
      "border": "1px solid rgba(255, 255, 255, 0.4)",
      "shadow": "none",
      "background": "rgb(255, 255, 255)",
      "padding": [
        "20px",
        "20px",
        "20px",
        "20px"
      ]
    },
    {
      "id": "ld-60",
      "tag": "a",
      "role": "tab",
      "label": "Experience Intelligence",
      "rect": {
        "x": 311,
        "y": 866,
        "width": 215,
        "height": 102
      },
      "radius": "8px",
      "border": "1px solid rgba(255, 255, 255, 0.16)",
      "shadow": "none",
      "background": "rgba(255, 255, 255, 0.12)",
      "padding": [
        "20px",
        "20px",
        "20px",
        "20px"
      ]
    },
    {
      "id": "ld-65",
      "tag": "a",
      "role": "tab",
      "label": "Real Estate Intelligence",
      "rect": {
        "x": 542,
        "y": 866,
        "width": 215,
        "height": 102
      },
      "radius": "8px",
      "border": "1px solid rgba(255, 255, 255, 0.16)",
      "shadow": "none",
      "background": "rgba(255, 255, 255, 0.12)",
      "padding": [
        "20px",
        "20px",
        "20px",
        "20px"
      ]
    },
    {
      "id": "ld-70",
      "tag": "div",
      "role": "presentation",
      "label": "More coming in 2027",
      "rect": {
        "x": 773,
        "y": 866,
        "width": 215,
        "height": 102
      },
      "radius": "8px",
      "border": "1px solid rgba(255, 255, 255, 0.16)",
      "shadow": "none",
      "background": "rgba(255, 255, 255, 0.12)",
      "padding": [
        "20px",
        "20px",
        "20px",
        "20px"
      ]
    }
  ],
  "surfaces": {
    "radii": [
      "999px",
      "8px"
    ],
    "borders": [
      "1px solid rgba(255, 255, 255, 0.4)",
      "1px solid rgba(255, 255, 255, 0.16)"
    ],
    "shadows": [
      "rgba(38, 57, 90, 0.16) 0px 0px 0px 1px, rgba(38, 57, 91, 0.1) 0px 1px 1px 0px"
    ]
  },
  "media": [
    {
      "id": "ld-13",
      "tag": "img",
      "role": null,
      "label": "img",
      "rect": {
        "x": 0,
        "y": 0,
        "width": 1440,
        "height": 1000
      },
      "aspectRatio": 1.4,
      "objectFit": "cover",
      "objectPosition": "50% 50%",
      "radius": "0px",
      "overflow": "clip",
      "media": {
        "src": "https://framerusercontent.com/images/RAjs2AsxMPYWQK7qgQzwPegjUEI.webp?scale-down-to=2048&width=3200&height=1788",
        "naturalWidth": 1440,
        "naturalHeight": 804,
        "alt": ""
      }
    },
    {
      "id": "ld-33",
      "tag": "img",
      "role": null,
      "label": "img",
      "rect": {
        "x": 0,
        "y": 0,
        "width": 1440,
        "height": 1000
      },
      "aspectRatio": 1.4,
      "objectFit": "cover",
      "objectPosition": "50% 50%",
      "radius": "0px",
      "overflow": "clip",
      "media": {
        "src": "https://framerusercontent.com/images/0ludMTRIYsIsZjBXbYoAOYh09IY.webp?scale-down-to=2048&width=3500&height=1969",
        "naturalWidth": 1440,
        "naturalHeight": 810,
        "alt": "a view of a city skyline at dusk"
      }
    },
    {
      "id": "ld-1495",
      "tag": "canvas",
      "role": null,
      "label": "canvas",
      "rect": {
        "x": 1250,
        "y": 20,
        "width": 104,
        "height": 36
      },
      "aspectRatio": 2.9,
      "objectFit": "fill",
      "objectPosition": "50% 50%",
      "radius": "0px",
      "overflow": "clip",
      "media": null
    },
    {
      "id": "ld-1449",
      "tag": "img",
      "role": null,
      "label": "framer-Q1hM3 framer-hl7epk",
      "rect": {
        "x": 80,
        "y": 24,
        "width": 124,
        "height": 24
      },
      "aspectRatio": 5.2,
      "objectFit": "fill",
      "objectPosition": "50% 50%",
      "radius": "0px",
      "overflow": "clip",
      "media": {
        "src": "data:image/svg+xml,<svg display=\"block\" id=\"4095158972\" role=\"presentation\" viewBox=\"0 0 114 22\" xmlns=\"http://www.w3.org/2000/svg\"><g fill=\"transparent\" height=\"22.00164818859829px\" id=\"Zucbdu4MF\" transform=\"translate(-0.002 -0.002)\" width=\"113.66718309999723px\"><path d=\"M 0 22 L 0 0 L 113.663 0 L 113.663 22 Z\" fill=\"transparent\" height=\"22px\" id=\"Olo7fCEKZ\" transform=\"translate(0.002 0.002)\" width=\"113.663px\"/><g fill=\"transparent\" height=\"22.00164818859829px\" id=\"dBdiT0hkU\" transform=\"translate(0 0)\" width=\"113.66718309999723px\"><path d=\"M 0 22 L 0 0 L 113.667 0 L 113.667 22 Z\" fill=\"transparent\" height=\"22px\" id=\"HlwODwLcz\" transform=\"translate(0 0)\" width=\"113.667px\"/><g fill=\"transparent\" height=\"22.000015497353694px\" id=\"y6KXZ3sS1\" transform=\"translate(0 0.002)\" width=\"21.999932427587844px\"><path d=\"M 0 5.745 C 0.801 0.548 7.745 -1.707 10.173 1.449 C 12.917 5.015 9.215 10.459 13.533 12.898 C 12.65 13.145 11.74 13.282 10.823 13.306 C 9.132 12.239 8.55 10.035 8.699 7.582 C 8.916 4.042 7.87 3.054 7.153 2.822 C 6.143 2.494 3.009 2.552 0.801 7.582 C 0.478 6.995 0.21 6.381 0 5.745 Z\" fill=\"rgb(255, 255, 255)\" height=\"13.30633282676043px\" id=\"tRs9SNX87\" transform=\"translate(0.41 8.694)\" width=\"13.533041px\"/><path d=\"M 3.493 15.835 C 2.267 14.73 5.5 9.402 6.433 11.193 C 7.291 12.841 5.328 15.836 7.011 17.978 C 5.715 17.49 4.521 16.763 3.493 15.836 Z M 1.658 1.671 C 4.253 -0.243 9.343 -0.313 11.621 0.466 C 16.646 2.183 17.175 6.996 17.502 10.392 C 17.737 12.826 18.871 13.732 19.97 14.035 C 19.319 14.949 18.532 15.759 17.638 16.437 C 12.098 14.678 16.672 8.543 11.794 4.075 C 8.869 1.397 2.415 2.575 0 5.925 C 0.246 4.406 0.811 2.956 1.658 1.671 Z\" fill=\"rgb(255, 255, 255)\" height=\"17.977545302988563px\" id=\"SbeWNdm8c\" transform=\"translate(0 3.317)\" width=\"19.97023105px\"/><path d=\"M 6.145 0 C 12.259 0 17.216 4.926 17.216 11.002 C 17.216 11.944 17.095 12.882 16.855 13.793 C 14.638 13.235 16.184 11.002 13.929 6.532 C 11.673 2.063 6.89 -0.629 0 1.849 C 1.821 0.639 3.959 -0.004 6.145 0 Z\" fill=\"rgb(255, 255, 255)\" height=\"13.79311525874974px\" id=\"VEh7YSgOC\" transform=\"translate(4.784 0)\" width=\"17.21557154196773px\"/></g><path d=\"M 76.042 13.809 C 75.116 13.809 74.311 13.587 73.626 13.142 C 72.953 12.685 72.43 12.055 72.058 11.249 C 71.685 10.444 71.499 9.525 71.499 8.491 C 71.499 7.446 71.685 6.52 72.058 5.715 C 72.43 4.91 72.953 4.279 73.626 3.822 C 74.311 3.365 75.116 3.137 76.042 3.137 C 76.811 3.137 77.466 3.299 78.006 3.624 C 78.547 3.948 78.974 4.399 79.287 4.976 L 79.287 11.989 C 78.994 12.533 78.565 12.992 78.043 13.323 C 77.514 13.647 76.847 13.809 76.042 13.809 Z M 76.294 12.043 C 76.967 12.043 77.52 11.892 77.952 11.592 C 78.397 11.279 78.728 10.853 78.944 10.312 C 79.172 9.771 79.287 9.164 79.287 8.491 C 79.287 7.806 79.172 7.193 78.944 6.652 C 78.728 6.111 78.397 5.685 77.952 5.372 C 77.52 5.06 76.967 4.904 76.294 4.904 C 75.717 4.904 75.218 5.054 74.798 5.354 C 74.377 5.643 74.053 6.057 73.824 6.598 C 73.596 7.139 73.482 7.77 73.482 8.491 C 73.482 9.2 73.596 9.825 73.824 10.366 C 74.053 10.895 74.377 11.31 74.798 11.61 C 75.218 11.898 75.717 12.043 76.294 12.043 Z M 79.287 13.521 L 79.287 0 L 81.216 0 L 81.216 13.521 Z M 67.732 0 L 69.661 0 L 69.661 13.521 L 67.732 13.521 Z M 60.828 13.809 C 59.782 13.809 58.875 13.587 58.106 13.142 C 57.337 12.685 56.736 12.055 56.303 11.249 C 55.882 10.444 55.672 9.525 55.672 8.491 C 55.672 7.446 55.882 6.52 56.303 5.715 C 56.736 4.91 57.337 4.279 58.106 3.822 C 58.875 3.365 59.782 3.137 60.828 3.137 C 61.874 3.137 62.781 3.365 63.55 3.822 C 64.319 4.279 64.914 4.91 65.335 5.715 C 65.768 6.52 65.984 7.446 65.984 8.491 C 65.984 9.525 65.768 10.444 65.335 11.249 C 64.914 12.055 64.319 12.685 63.55 13.142 C 62.781 13.587 61.874 13.809 60.828 13.809 Z M 60.828 12.043 C 61.489 12.043 62.054 11.898 62.522 11.61 C 62.991 11.31 63.352 10.895 63.604 10.366 C 63.857 9.825 63.983 9.2 63.983 8.491 C 63.983 7.77 63.857 7.139 63.604 6.598 C 63.352 6.057 62.991 5.643 62.522 5.354 C 62.054 5.054 61.489 4.904 60.828 4.904 C 60.167 4.904 59.596 5.054 59.115 5.354 C 58.646 5.643 58.286 6.057 58.034 6.598 C 57.781 7.139 57.655 7.77 57.655 8.491 C 57.655 9.2 57.781 9.825 58.034 10.366 C 58.286 10.895 58.646 11.31 59.115 11.61 C 59.596 11.898 60.167 12.043 60.828 12.043 Z M 50.53 13.521 L 50.53 2.56 C 50.53 2.043 50.626 1.593 50.819 1.208 C 51.023 0.823 51.341 0.529 51.774 0.325 C 52.207 0.108 52.754 0 53.415 0 L 54.983 0 L 54.983 1.659 L 53.433 1.659 C 52.784 1.659 52.459 1.959 52.459 2.56 L 52.459 13.521 Z M 49.376 3.425 L 54.713 3.425 L 54.713 5.084 L 49.376 5.084 Z M 43.575 13.809 C 42.53 13.809 41.622 13.587 40.853 13.142 C 40.084 12.685 39.483 12.055 39.05 11.249 C 38.63 10.444 38.419 9.525 38.419 8.491 C 38.419 7.446 38.63 6.52 39.05 5.715 C 39.483 4.91 40.084 4.279 40.853 3.822 C 41.622 3.365 42.53 3.137 43.575 3.137 C 44.26 3.137 44.904 3.269 45.504 3.533 C 46.105 3.798 46.622 4.189 47.055 4.705 C 47.487 5.222 47.806 5.853 48.01 6.598 C 48.215 7.332 48.269 8.173 48.172 9.122 L 39.519 9.122 L 39.519 7.5 L 47.091 7.5 L 46.279 8.058 C 46.315 7.482 46.231 6.959 46.027 6.49 C 45.823 6.009 45.516 5.625 45.108 5.336 C 44.699 5.048 44.188 4.904 43.575 4.904 C 42.866 4.904 42.277 5.06 41.809 5.372 C 41.34 5.685 40.985 6.111 40.745 6.652 C 40.517 7.193 40.402 7.806 40.402 8.491 C 40.402 9.164 40.517 9.771 40.745 10.312 C 40.985 10.853 41.34 11.279 41.809 11.592 C 42.277 11.892 42.866 12.043 43.575 12.043 C 44.284 12.043 44.843 11.88 45.252 11.556 C 45.673 11.219 45.961 10.811 46.117 10.33 L 48.172 10.33 C 48.016 11.027 47.728 11.634 47.307 12.151 C 46.898 12.667 46.376 13.076 45.739 13.377 C 45.114 13.665 44.393 13.809 43.575 13.809 Z M 22.593 3.425 L 24.522 3.425 L 24.522 13.521 L 22.593 13.521 Z M 24.522 8.491 L 24.233 6.508 C 24.233 6.195 24.287 5.847 24.396 5.462 C 24.508 5.069 24.684 4.698 24.918 4.363 C 25.171 4.002 25.501 3.708 25.91 3.479 C 26.331 3.251 26.859 3.137 27.496 3.137 C 28.121 3.137 28.668 3.269 29.137 3.533 C 29.606 3.798 29.966 4.237 30.219 4.849 C 30.483 5.451 30.615 6.268 30.615 7.301 L 30.615 13.521 L 28.686 13.521 L 28.686 7.536 C 28.686 6.983 28.644 6.508 28.56 6.111 C 28.488 5.703 28.332 5.39 28.091 5.174 C 27.851 4.946 27.484 4.831 26.992 4.831 C 26.571 4.831 26.174 4.97 25.802 5.246 C 25.429 5.523 25.123 5.931 24.882 6.472 C 24.642 7.013 24.522 7.686 24.522 8.491 Z M 30.615 8.491 L 30.128 6.508 C 30.128 6.195 30.189 5.847 30.309 5.462 C 30.447 5.066 30.648 4.695 30.904 4.363 C 31.18 4.002 31.535 3.708 31.967 3.479 C 32.412 3.251 32.953 3.137 33.59 3.137 C 34.215 3.137 34.762 3.269 35.23 3.533 C 35.699 3.798 36.06 4.237 36.312 4.849 C 36.576 5.451 36.709 6.268 36.709 7.301 L 36.709 13.521 L 34.78 13.521 L 34.78 7.536 C 34.78 6.983 34.737 6.508 34.653 6.111 C 34.581 5.703 34.425 5.39 34.185 5.174 C 33.944 4.946 33.578 4.831 33.085 4.831 C 32.664 4.831 32.268 4.97 31.895 5.246 C 31.523 5.523 31.216 5.931 30.976 6.472 C 30.735 7.013 30.615 7.686 30.615 8.491 Z M 18.38 3.425 L 20.327 3.425 L 20.327 13.521 L 18.38 13.521 Z M 18.272 0 L 20.435 0 L 20.435 2.217 L 18.272 2.217 Z M 11.344 3.425 L 13.273 3.425 L 13.273 13.521 L 11.344 13.521 Z M 13.273 8.221 L 13.002 6.724 C 13.002 6.412 13.038 6.051 13.111 5.643 C 13.195 5.234 13.357 4.843 13.597 4.471 C 13.85 4.086 14.216 3.768 14.697 3.515 C 15.19 3.263 15.839 3.137 16.644 3.137 L 16.644 5.084 C 15.935 5.084 15.328 5.18 14.823 5.372 C 14.318 5.565 13.934 5.889 13.669 6.346 C 13.405 6.79 13.273 7.415 13.273 8.221 Z M 0 0.901 L 1.965 0.901 L 1.965 13.521 L 0 13.521 Z M 0.992 7.373 L 4.164 7.373 L 4.164 9.104 L 0.992 9.104 Z M 4.164 7.373 C 4.898 7.373 5.517 7.307 6.021 7.175 C 6.538 7.043 6.929 6.802 7.193 6.454 C 7.47 6.106 7.608 5.619 7.608 4.994 C 7.608 4.357 7.47 3.87 7.193 3.533 C 6.929 3.185 6.538 2.95 6.021 2.83 C 5.517 2.698 4.898 2.632 4.164 2.632 L 4.164 0.901 C 5.294 0.901 6.268 1.034 7.085 1.298 C 7.914 1.562 8.551 1.995 8.996 2.596 C 9.441 3.185 9.663 3.984 9.663 4.994 C 9.663 5.979 9.441 6.778 8.996 7.391 C 8.551 7.992 7.914 8.431 7.085 8.707 C 6.268 8.972 5.294 9.104 4.164 9.104 Z M 0.992 0.901 L 4.164 0.901 L 4.164 2.632 L 0.992 2.632 Z\" fill=\"rgb(255, 255, 255)\" height=\"13.809310091476439px\" id=\"RCx0UqITE\" transform=\"translate(31.547 4.203)\" width=\"81.21579656982422px\"/></g></g></svg>",
        "naturalWidth": 300,
        "naturalHeight": 58,
        "alt": ""
      }
    },
    {
      "id": "ld-1485",
      "tag": "canvas",
      "role": null,
      "label": "canvas",
      "rect": {
        "x": 1153,
        "y": 20,
        "width": 74,
        "height": 36
      },
      "aspectRatio": 2.1,
      "objectFit": "fill",
      "objectPosition": "50% 50%",
      "radius": "0px",
      "overflow": "clip",
      "media": null
    },
    {
      "id": "ld-55",
      "tag": "img",
      "role": null,
      "label": "img",
      "rect": {
        "x": 101,
        "y": 887,
        "width": 20,
        "height": 20
      },
      "aspectRatio": 1,
      "objectFit": "contain",
      "objectPosition": "50% 50%",
      "radius": "0px",
      "overflow": "clip",
      "media": {
        "src": "https://framerusercontent.com/images/0ngLiiCSe7c81sENFiXDCxUe8Ew.svg?width=20&height=20",
        "naturalWidth": 20,
        "naturalHeight": 20,
        "alt": ""
      }
    },
    {
      "id": "ld-56",
      "tag": "img",
      "role": null,
      "label": "img",
      "rect": {
        "x": 101,
        "y": 887,
        "width": 20,
        "height": 20
      },
      "aspectRatio": 1,
      "objectFit": "contain",
      "objectPosition": "50% 50%",
      "radius": "0px",
      "overflow": "clip",
      "media": {
        "src": "https://framerusercontent.com/images/Ok2FqoeufFP2awsp0MRNxJXTDA.svg?width=20&height=20",
        "naturalWidth": 20,
        "naturalHeight": 20,
        "alt": ""
      }
    },
    {
      "id": "ld-62",
      "tag": "img",
      "role": null,
      "label": "img",
      "rect": {
        "x": 332,
        "y": 887,
        "width": 20,
        "height": 20
      },
      "aspectRatio": 1,
      "objectFit": "contain",
      "objectPosition": "50% 50%",
      "radius": "0px",
      "overflow": "clip",
      "media": {
        "src": "https://framerusercontent.com/images/8Xe3QbAF8z173WRaVrPeURWrGc.svg?width=20&height=20",
        "naturalWidth": 20,
        "naturalHeight": 20,
        "alt": ""
      }
    },
    {
      "id": "ld-67",
      "tag": "img",
      "role": null,
      "label": "img",
      "rect": {
        "x": 563,
        "y": 887,
        "width": 20,
        "height": 20
      },
      "aspectRatio": 1,
      "objectFit": "contain",
      "objectPosition": "50% 50%",
      "radius": "0px",
      "overflow": "clip",
      "media": {
        "src": "https://framerusercontent.com/images/Vmatt47vXW6vUstSo8WnUvQwvRQ.svg?width=20&height=20",
        "naturalWidth": 20,
        "naturalHeight": 20,
        "alt": ""
      }
    },
    {
      "id": "ld-71",
      "tag": "img",
      "role": null,
      "label": "img",
      "rect": {
        "x": 794,
        "y": 887,
        "width": 20,
        "height": 20
      },
      "aspectRatio": 1,
      "objectFit": "contain",
      "objectPosition": "50% 50%",
      "radius": "0px",
      "overflow": "clip",
      "media": {
        "src": "https://framerusercontent.com/images/FKdTY48jmzOKCr6FVHOYD8MSv7s.svg?width=20&height=20",
        "naturalWidth": 20,
        "naturalHeight": 20,
        "alt": ""
      }
    }
  ],
  "animations": [],
  "coverage": {
    "elementsInSection": 46,
    "cards": 4,
    "media": 10,
    "animations": 0
  },
  "limitations": [
    "Values describe the captured desktop viewport and may change at other breakpoints.",
    "Transforms, sticky layers, and virtualized content can make the inferred section root approximate.",
    "Animations include browser-exposed Web Animations API state; CSS or script motion that was inactive at capture time may be absent."
  ]
}
```

### Observed motion

No timestamped authored motion is attached. Use only restrained baseline transitions.

The browser animation records above are deterministic parameters captured from active browser animations. The timestamped observations describe what Gemini saw in the video. Treat them as complementary evidence. When either source is empty or they conflict, state the uncertainty instead of inventing timing or easing.

### Responsive contract

- Measured viewport: 1440px wide.
- Mobile/tablet values: not measured by this section evidence unless a separate capture is explicitly listed.
- Preserve hierarchy and sequence; collapse simultaneous columns only where needed, maintain media aspect ratios, and verify touch targets and text wrapping at target breakpoints.

### Structure versus visual skin

- Preserve: content hierarchy, layout relationships, section rhythm, interaction purpose.
- Adapt: brand colors, font family, copy, imagery, icons, decorative details.
- Rule: Preserve the observed design logic while creating original branding, copy, assets, and implementation details.

### Adaptation and dependencies

- Effort: Not assessed
- What transfers: Documented hierarchy and composition
- Dependencies: None recorded
- Guidance: Adapt the pattern to the new product and content.

### Evidence readiness

- Coverage: 7/7
- Can build: Yes
- Missing facts: timestamped authored motion
- Warning: Buildable with adaptations for these unsupported facts: timestamped authored motion.

### Agent implementation prompt

Create an original hero section inspired by the design evidence titled “Hero with laptop survey photo”.

Purpose: hero section from the Home page of Primefold.

Structure: 1440×1000px root; flex. Source layout label: 1440×1000px root; flex. Preserve the documented hierarchy and relationships; exact measurements were not deterministically captured.

Visual signature to preserve at the pattern level: rgba(0, 0, 0, 0) with 1440×1000px root; flex. Inspect the crop for image and content hierarchy.

Components: Navigation Bar, Hero With Background Imagery, Logo Strip, Feature Card, Carousel, Primary Button, Newsletter Form, Footer, Interactive Feature Tabs, Bento Grid Layout.

Style direction: minimal, corporate, photographic, bold, soft-ui.

Observed crop: 1440×1000px (1.44:1). Treat this as evidence of composition, not a mandatory output size.

Typography evidence: {"role":"display","size":"64px","family":"Stack Sans Headline","source":"computed","traits":"Regular","weight":"400","evidence":"font-4: computed CSS at 1440×1000; AI role: Stack Sans Headline at 64px used for the main hero h1.","sampleId":"font-4","confidence":0.95,"lineHeight":"72px","letterSpacing":"1.3px"} {"role":"heading","size":"48px","family":"Stack Sans Headline","source":"computed","traits":"Regular","weight":"400","evidence":"font-1: computed CSS at 1440×1000; AI role: Stack Sans Headline at 48px used for major section h2 headings.","sampleId":"font-1","confidence":0.9,"lineHeight":"56px","letterSpacing":"1px"} {"role":"body","size":"14px","family":"Inter","source":"computed","traits":"Regular","weight":"400","evidence":"font-6: computed CSS at 1440×1000; AI role: Inter at 14px used extensively for standard paragraph text and descriptions.","sampleId":"font-6","confidence":0.95,"lineHeight":"20px","letterSpacing":"-0.1px"}

Color evidence: {"hex":"#FFFFFF","name":"canvas","role":"canvas","source":"computed","evidence":"color-1: computed rgb(255, 255, 255); AI role: Pure white (#FFFFFF) used as the primary background color for the main document body.","sampleId":"color-1","confidence":0.95} {"hex":"#1A1814","name":"text","role":"text","source":"computed","evidence":"color-5: computed rgb(26, 24, 20); AI role: Dark gray/almost black (#1A1814) used for high-contrast primary text on light backgrounds.","sampleId":"color-5","confidence":0.95} {"hex":"#FAF9F8","name":"surface","role":"surface","source":"computed","evidence":"color-2: computed rgb(250, 249, 248); AI role: Off-white/light gray (#FAF9F8) used as a background for specific distinct sections to separate content.","sampleId":"color-2","confidence":0.9} {"hex":"#616161","name":"muted text","role":"muted-text","source":"computed","evidence":"color-12: computed rgb(97, 97, 97); AI role: Medium gray (#616161) used for secondary or less prominent text.","sampleId":"color-12","confidence":0.85}

Typography measured inside this section: {"id":"font-4","family":"Stack Sans Headline","fontStack":"\"Stack Sans Headline\", \"Stack Sans Headline Placeholder\", sans-serif","weight":"400","size":"64px","lineHeight":"72px","letterSpacing":"1.3px","traits":"Regular","count":2,"contexts":[{"tag":"div","text":"Ask your customers, your tenants, your teams. Anyone.","top":156,"property":"font"},{"tag":"h1","text":"Ask your portfolio anything.","top":156,"property":"font"}]} {"id":"font-5","family":"Inter","fontStack":"Inter, \"Inter Placeholder\", sans-serif","weight":"500","size":"16px","lineHeight":"24px","letterSpacing":"-0.2px","traits":"Regular","count":30,"contexts":[{"tag":"span","text":"Platform","top":923,"property":"font"},{"tag":"span","text":"Experience Intelligence","top":923,"property":"font"},{"tag":"span","text":"Real Estate Intelligence","top":923,"property":"font"}]} {"id":"font-14","family":"Inter","fontStack":"Inter, \"Inter Placeholder\", sans-serif","weight":"400","size":"18px","lineHeight":"24px","letterSpacing":"normal","traits":"Regular","count":2,"contexts":[{"tag":"p","text":"Experience Intelligence, built to find the value in every voice.","top":396,"property":"font"},{"tag":"p","text":"Real Estate Intelligence, built to grow asset value.","top":324,"property":"font"}]} {"id":"font-17","family":null,"fontStack":"sans-serif","weight":"400","size":"12px","lineHeight":"normal","letterSpacing":"normal","traits":"Regular","count":1,"contexts":[{"tag":"p","text":"Autoplay is on. Use the Pause button for a better experience with a screen reader.","top":968,"property":"font"}]} {"id":"font-24","family":"Inter","fontStack":"Inter, \"Inter Placeholder\", sans-serif","weight":"500","size":"16px","lineHeight":"22.9px","letterSpacing":"-0.2px","traits":"Regular","count":4,"contexts":[{"tag":"a","text":"Explore XI","top":460,"property":"font"},{"tag":"a","text":"Book a call","top":460,"property":"font"},{"tag":"a","text":"Explore RI","top":388,"property":"font"}]}

Colors measured inside this section: {"id":"color-1","hex":"#FFFFFF","alpha":1,"cssValue":"rgb(255, 255, 255)","count":229,"contexts":[{"tag":"body","text":":root body { background: rgb(255, 255, 255); }html body { background: var(--token-95aefa38-21c0-4cf3","top":0,"property":"background"},{"tag":"div","text":"html body { background: var(--token-95aefa38-21c0-4cf3-a72e-912657312a38, rgb(250, 249, 248)); } @ke","top":0,"property":"background"},{"tag":"div","text":"Ask your customers, your tenants, your teams. Anyone.","top":156,"property":"text"}]} {"id":"color-2","hex":"#FAF9F8","alpha":1,"cssValue":"rgb(250, 249, 248)","count":6,"contexts":[{"tag":"div","text":"⠏Ask. Understand. Act. How a question becomes a next move.⠏One intelligence. Applied to different fi","top":1000,"property":"background"},{"tag":"section","text":"⠏Ask. Understand. Act. How a question becomes a next move.⠏One intelligence. Applied to different fi","top":1091,"property":"background"}]} {"id":"color-4","hex":"#000000","alpha":1,"cssValue":"rgb(0, 0, 0)","count":16,"contexts":[{"tag":"section","text":"@keyframes rmxSlideInR-re { from { transform: translateX(100%); } to { transform: translateX(0); } }","top":0,"property":"background"},{"tag":"svg","text":"","top":2869,"property":"svg-fill"},{"tag":"use","text":"","top":2870,"property":"svg-fill"}]} {"id":"color-5","hex":"#1A1814","alpha":1,"cssValue":"rgb(26, 24, 20)","count":23,"contexts":[{"tag":"span","text":"Real Estate Intelligence","top":923,"property":"text"},{"tag":"span","text":"","top":964,"property":"background"},{"tag":"div","text":"How was your experience with us?A quick two-minute survey your honest feedback helps us fix what's s","top":2572,"property":"background"}]} {"id":"color-10","hex":"#FFFFFF","alpha":0.7215686274509804,"cssValue":"rgba(255, 255, 255, 0.72)","count":1,"contexts":[{"tag":"div","text":"","top":4,"property":"background"}]} {"id":"color-11","hex":"#FFFFFF","alpha":0.12156862745098039,"cssValue":"rgba(255, 255, 255, 0.12)","count":4,"contexts":[{"tag":"a","text":"Platform","top":866,"property":"control-background"},{"tag":"div","text":"More coming in 2027","top":866,"property":"background"}]} {"id":"color-18","hex":"#FFFFFF","alpha":0.23921568627450981,"cssValue":"rgba(255, 255, 255, 0.24)","count":2,"contexts":[{"tag":"a","text":"Book a call","top":460,"property":"control-background"}]} {"id":"color-19","hex":"#211E1C","alpha":1,"cssValue":"rgb(33, 30, 28)","count":2,"contexts":[{"tag":"a","text":"Explore XI","top":460,"property":"text"}]}

Exact section measurements from the saved element map: root {"rect":{"x":0,"y":0,"width":1440,"height":1000},"padding":{"top":"0px","right":"0px","bottom":"0px","left":"0px"},"gap":"10px","columns":null,"overflow":"visible"}; spacing {"gapsPx":[8,10,16],"representativeContentWidthsPx":[1280,650]}; surfaces {"radii":["999px","8px"],"borders":["1px solid rgba(255, 255, 255, 0.4)","1px solid rgba(255, 255, 255, 0.16)"],"shadows":["rgba(38, 57, 90, 0.16) 0px 0px 0px 1px, rgba(38, 57, 91, 0.1) 0px 1px 1px 0px"]}; media [{"tag":"img","rect":{"x":0,"y":0,"width":1440,"height":1000},"aspectRatio":1.4,"objectFit":"cover","objectPosition":"50% 50%","radius":"0px"},{"tag":"img","rect":{"x":0,"y":0,"width":1440,"height":1000},"aspectRatio":1.4,"objectFit":"cover","objectPosition":"50% 50%","radius":"0px"},{"tag":"canvas","rect":{"x":1250,"y":20,"width":104,"height":36},"aspectRatio":2.9,"objectFit":"fill","objectPosition":"50% 50%","radius":"0px"},{"tag":"img","rect":{"x":80,"y":24,"width":124,"height":24},"aspectRatio":5.2,"objectFit":"fill","objectPosition":"50% 50%","radius":"0px"}]

Do not invent signature motion. Use only restrained baseline transitions if the product needs them.

Transfer the documented hierarchy and composition rather than source copy or assets.

No explicit dependencies were recorded.

Adapt the pattern to the new product and content.

Use new copy, imagery, branding, and implementation details. Do not reproduce the source website or its proprietary assets.
