# Cadvel — Design Reference

Schema: Design Details DESIGN.md v3.2
Source: https://www.cadvel.com/
Captured: 2026-10-21
CSS measured: 2026-10-21T03:55:04.184Z at 1440×1000 — https://www.cadvel.com/
Values come from computed CSS; role labels are AI judgments. Live CSS may differ from an older screenshot.
Status: AI analysed; curator review pending
Rubric: 3.2
Observer: google/gemini-3.1-pro-preview
Judge: anthropic/claude-sonnet-5

## Design direction

The website employs a highly structural, typographic design language that conveys authority and precision. The aesthetic is heavily reliant on a stark contrast between deep, inky greens and crisp white or off-white backgrounds. Typography is the hero, utilizing Suisse Intl across all levels with tight letter-spacing for display sizes, creating a modernist, grid-oriented feel. Borders are used extensively to define modular compartments, cards, and sections, reinforcing an analytical, data-driven brand identity. Corners are universally sharp, avoiding any playful or soft rounded radii.

## Classification

- Industry: finance
- Site type: Blog, Portfolio
- Business model: Software, Portfolio, Agency
- Styles: typographic, corporate, brutalist, swiss-modernist, data-driven
- Platform: Webflow
- Technology: GSAP

## Typography

- Display: Suisse Intl — weight 400; size 80px; line-height 80px; tracking -3.2px; Regular (100% role confidence, computed values)
- Heading: Suisse Intl — weight 400; size 60px; line-height 60px; tracking -2.4px; Regular (100% role confidence, computed values)
- Body: Suisse Intl — weight 400; size 16px; line-height 22.4px; tracking -0.3px; Regular (100% role confidence, computed values)
- Mono: Suisse Intl — weight 400; size 12px; line-height 16.8px; tracking -0.2px; uppercase (80% role confidence, computed values)

## Functional palette

- Canvas — canvas #FFFFFF: color-3: computed rgb(255, 255, 255); AI role: Pure white used as the foundational background for many content sections, notably the 'Five data problems' area. (100% role confidence, computed values)
- Surface — surface #0B3031: color-4: computed rgb(11, 48, 49); AI role: Deep dark green (#0B3031) used for the hero section, footer, and navigation bar backgrounds. (100% role confidence, computed values)
- Text — text #000000: color-1: computed rgb(0, 0, 0); AI role: Solid black used for primary typography on light backgrounds. (100% role confidence, computed values)
- Surface — surface #F5F5F5: color-2: computed rgb(245, 245, 245); AI role: Light gray (#F5F5F5) used as an alternating background color to separate sections. (90% role confidence, computed values)
- Text — text #F5F3EE: color-8: computed rgb(245, 243, 238); AI role: Off-white (#F5F3EE) used for text layered over the dark green surface areas. (90% role confidence, computed values)

## Exact computed CSS inventory

The browser extracted these declarations from rendered DOM at capture time. They are facts, not visual guesses. Image and video pixels are outside this inventory.

### Font configurations

```json
[
  {
    "id": "font-1",
    "family": "Suisse Intl",
    "fontStack": "\"Suisse Intl\", Arial, sans-serif",
    "weight": "400",
    "size": "24px",
    "lineHeight": "24px",
    "letterSpacing": "-1px",
    "traits": "Regular",
    "count": 6,
    "contexts": [
      {
        "tag": "h3",
        "text": "Baseline",
        "top": 3031,
        "property": "font"
      },
      {
        "tag": "h3",
        "text": "Root cause",
        "top": 3031,
        "property": "font"
      },
      {
        "tag": "h3",
        "text": "Proof",
        "top": 3031,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-2",
    "family": "Suisse Intl",
    "fontStack": "\"Suisse Intl\", Arial, sans-serif",
    "weight": "400",
    "size": "60px",
    "lineHeight": "60px",
    "letterSpacing": "-2.4px",
    "traits": "Regular",
    "count": 5,
    "contexts": [
      {
        "tag": "h1",
        "text": "Your data should drive value. Not costs.",
        "top": 127,
        "property": "font"
      },
      {
        "tag": "h2",
        "text": "Start with one defined problem and a measurable baseline",
        "top": 3508,
        "property": "font"
      },
      {
        "tag": "h2",
        "text": "Every project leaves a number behind",
        "top": 4851,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-3",
    "family": "Suisse Intl",
    "fontStack": "\"Suisse Intl\", Arial, sans-serif",
    "weight": "400",
    "size": "36px",
    "lineHeight": "36px",
    "letterSpacing": "-1.4px",
    "traits": "Regular",
    "count": 4,
    "contexts": [
      {
        "tag": "h3",
        "text": "Diagnosis",
        "top": 3978,
        "property": "font"
      },
      {
        "tag": "h3",
        "text": "Measurement pilot",
        "top": 3978,
        "property": "font"
      },
      {
        "tag": "h2",
        "text": "Senior expertise stays close to the work",
        "top": 4303,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-4",
    "family": "Suisse Intl",
    "fontStack": "\"Suisse Intl\", Arial, sans-serif",
    "weight": "400",
    "size": "32px",
    "lineHeight": "32px",
    "letterSpacing": "-1.3px",
    "traits": "Regular",
    "count": 4,
    "contexts": [
      {
        "tag": "h3",
        "text": "Sealand Liquids: ISO Tank Fleet Visibility and Utilization",
        "top": 5061,
        "property": "font"
      },
      {
        "tag": "h3",
        "text": "Sales Data Reconciliation and Cloud Cost Assessment for an International Retail Group",
        "top": 5061,
        "property": "font"
      },
      {
        "tag": "h3",
        "text": "Secure Data Sharing for an International Payments Technology Company",
        "top": 5061,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-5",
    "family": "Suisse Intl",
    "fontStack": "\"Suisse Intl\", Arial, sans-serif",
    "weight": "400",
    "size": "80px",
    "lineHeight": "80px",
    "letterSpacing": "-3.2px",
    "traits": "Regular",
    "count": 3,
    "contexts": [
      {
        "tag": "h2",
        "text": "Five data problems we get hired to fix",
        "top": 910,
        "property": "font"
      },
      {
        "tag": "h2",
        "text": "We only fix what we can measure",
        "top": 2490,
        "property": "font"
      },
      {
        "tag": "h2",
        "text": "Start with one costly problem.",
        "top": 8717,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-6",
    "family": "Suisse Intl",
    "fontStack": "\"Suisse Intl\", Arial, sans-serif",
    "weight": "400",
    "size": "32px",
    "lineHeight": "38.4px",
    "letterSpacing": "-1.3px",
    "traits": "Regular",
    "count": 3,
    "contexts": [
      {
        "tag": "h3",
        "text": "Platform costs grow without a clear connection to the workloads and outcomes they support.",
        "top": 1327,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "Cadvel is a boutique data engineering consultancy based in Kraków, Poland. We help enterprises reduc",
        "top": 1856,
        "property": "font"
      },
      {
        "tag": "h3",
        "text": "For utilities, suppliers and charge point operators.",
        "top": 8066,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-7",
    "family": "Suisse Intl",
    "fontStack": "\"Suisse Intl\", Arial, sans-serif",
    "weight": "400",
    "size": "22px",
    "lineHeight": "22px",
    "letterSpacing": "-0.9px",
    "traits": "Regular",
    "count": 3,
    "contexts": [
      {
        "tag": "h4",
        "text": "Wasted hours.",
        "top": 7027,
        "property": "font"
      },
      {
        "tag": "h4",
        "text": "Unexplained infrastructure costs.",
        "top": 7004,
        "property": "font"
      },
      {
        "tag": "h4",
        "text": "Customer impact.",
        "top": 7004,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-8",
    "family": "Suisse Intl",
    "fontStack": "\"Suisse Intl\", Arial, sans-serif",
    "weight": "400",
    "size": "40px",
    "lineHeight": "44px",
    "letterSpacing": "-1.6px",
    "traits": "Regular",
    "count": 1,
    "contexts": [
      {
        "tag": "h3",
        "text": "The cost of bad data rarely appears on the balance sheet",
        "top": 6731,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-9",
    "family": "Suisse Intl",
    "fontStack": "\"Suisse Intl\", Arial, sans-serif",
    "weight": "400",
    "size": "24px",
    "lineHeight": "28.8px",
    "letterSpacing": "-1px",
    "traits": "Regular",
    "count": 1,
    "contexts": [
      {
        "tag": "h3",
        "text": "Why does it matter? At a 3% net margin, operational waste equal to 1% of revenue can reduce annual p",
        "top": 7203,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-10",
    "family": "Suisse Intl",
    "fontStack": "\"Suisse Intl\", Arial, sans-serif",
    "weight": "400",
    "size": "16px",
    "lineHeight": "22.4px",
    "letterSpacing": "-0.3px",
    "traits": "Regular",
    "count": 44,
    "contexts": [
      {
        "tag": "p",
        "text": "We measure which workloads, queries, storage, and services are driving cost.",
        "top": 1462,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "We measure what your problem costs before we propose anything. If the savings will not cover the cos",
        "top": 2583,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "Start with a fixed-price assessment focused on one costly problem. Expand only if the findings justi",
        "top": 3668,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-11",
    "family": "Suisse Intl",
    "fontStack": "\"Suisse Intl\", Arial, sans-serif",
    "weight": "400",
    "size": "12px",
    "lineHeight": "16.8px",
    "letterSpacing": "-0.2px",
    "traits": "uppercase",
    "count": 19,
    "contexts": [
      {
        "tag": "div",
        "text": "Five buyer pains",
        "top": 861,
        "property": "font"
      },
      {
        "tag": "div",
        "text": "04",
        "top": 1212,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "About us",
        "top": 1807,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-12",
    "family": "Suisse Intl",
    "fontStack": "\"Suisse Intl\", Arial, sans-serif",
    "weight": "400",
    "size": "10px",
    "lineHeight": "14px",
    "letterSpacing": "-0.2px",
    "traits": "uppercase",
    "count": 4,
    "contexts": [
      {
        "tag": "p",
        "text": "Logistics & Transport",
        "top": 5055,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "Retail",
        "top": 5055,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "Finance",
        "top": 5055,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-13",
    "family": "Suisse Intl",
    "fontStack": "\"Suisse Intl\", Arial, sans-serif",
    "weight": "400",
    "size": "14px",
    "lineHeight": "19.6px",
    "letterSpacing": "normal",
    "traits": "Regular",
    "count": 3,
    "contexts": [
      {
        "tag": "p",
        "text": "We establish where the problem starts, what it affects, and what it costs. You get the number and th",
        "top": 3067,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "We identify what is driving the problem: architecture, workload, cost, data quality, or process. Unt",
        "top": 3067,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "We measure the change on your data, in your environment. You keep the result and method; where imple",
        "top": 3067,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-14",
    "family": "Suisse Intl",
    "fontStack": "\"Suisse Intl\", Arial, sans-serif",
    "weight": "400",
    "size": "18px",
    "lineHeight": "27px",
    "letterSpacing": "-0.3px",
    "traits": "Regular",
    "count": 1,
    "contexts": [
      {
        "tag": "p",
        "text": "Data engineering and consulting for Snowflake and ClickHouse. We help companies speed up analytics, ",
        "top": 287,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-15",
    "family": "Suisse Intl",
    "fontStack": "\"Suisse Intl\", Arial, sans-serif",
    "weight": "400",
    "size": "18px",
    "lineHeight": "27px",
    "letterSpacing": "-0.4px",
    "traits": "Regular",
    "count": 1,
    "contexts": [
      {
        "tag": "p",
        "text": "A recent retail assessment identified an estimated $40,000 in monthly savings within six weeks, prim",
        "top": 659,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-16",
    "family": "Suisse Intl",
    "fontStack": "\"Suisse Intl\", Arial, sans-serif",
    "weight": "400",
    "size": "16px",
    "lineHeight": "16px",
    "letterSpacing": "-0.6px",
    "traits": "Regular",
    "count": 10,
    "contexts": [
      {
        "tag": "div",
        "text": "Late detection",
        "top": 1151,
        "property": "font"
      },
      {
        "tag": "div",
        "text": "Fragmented data",
        "top": 1151,
        "property": "font"
      },
      {
        "tag": "div",
        "text": "Conflicting numbers",
        "top": 1151,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-17",
    "family": "Suisse Intl",
    "fontStack": "\"Suisse Intl\", Arial, sans-serif",
    "weight": "400",
    "size": "14px",
    "lineHeight": "normal",
    "letterSpacing": "-0.1px",
    "traits": "Regular",
    "count": 7,
    "contexts": [
      {
        "tag": "a",
        "text": "Home",
        "top": 0,
        "property": "font"
      },
      {
        "tag": "a",
        "text": "Cost measurement",
        "top": 0,
        "property": "font"
      },
      {
        "tag": "div",
        "text": "Services",
        "top": 28,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-18",
    "family": "Suisse Intl",
    "fontStack": "\"Suisse Intl\", Arial, sans-serif",
    "weight": "400",
    "size": "16px",
    "lineHeight": "normal",
    "letterSpacing": "-0.2px",
    "traits": "Regular",
    "count": 3,
    "contexts": [
      {
        "tag": "a",
        "text": "See our work",
        "top": 420,
        "property": "font"
      },
      {
        "tag": "div",
        "text": "Learn more",
        "top": 8185,
        "property": "font"
      },
      {
        "tag": "a",
        "text": "Case studies",
        "top": 9004,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-19",
    "family": "Suisse Intl",
    "fontStack": "\"Suisse Intl\", Arial, sans-serif",
    "weight": "400",
    "size": "16px",
    "lineHeight": "normal",
    "letterSpacing": "-0.1px",
    "traits": "Regular",
    "count": 2,
    "contexts": [
      {
        "tag": "div",
        "text": "Calculate the cost",
        "top": 420,
        "property": "font"
      },
      {
        "tag": "div",
        "text": "Book a 30-minute call",
        "top": 9004,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-20",
    "family": "Suisse Intl",
    "fontStack": "\"Suisse Intl\", Arial, sans-serif",
    "weight": "400",
    "size": "16px",
    "lineHeight": "28px",
    "letterSpacing": "-0.2px",
    "traits": "Regular",
    "count": 1,
    "contexts": [
      {
        "tag": "div",
        "text": "Book a 30-minute call",
        "top": 7399,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-21",
    "family": "Suisse Intl",
    "fontStack": "\"Suisse Intl\", Arial, sans-serif",
    "weight": "400",
    "size": "14px",
    "lineHeight": "19.6px",
    "letterSpacing": "-0.3px",
    "traits": "Regular",
    "count": 1,
    "contexts": [
      {
        "tag": "div",
        "text": "Energy and EV",
        "top": 8365,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-22",
    "family": "Suisse Intl",
    "fontStack": "\"Suisse Intl\", Arial, sans-serif",
    "weight": "400",
    "size": "16px",
    "lineHeight": "19.2px",
    "letterSpacing": "-0.2px",
    "traits": "Regular",
    "count": 2,
    "contexts": [
      {
        "tag": "a",
        "text": "Read more",
        "top": 4141,
        "property": "font"
      },
      {
        "tag": "a",
        "text": "Read more",
        "top": 4141,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-23",
    "family": "Suisse Intl",
    "fontStack": "\"Suisse Intl\", Arial, sans-serif",
    "weight": "400",
    "size": "12px",
    "lineHeight": "16.8px",
    "letterSpacing": "-0.2px",
    "traits": "Regular",
    "count": 1,
    "contexts": [
      {
        "tag": "a",
        "text": "Performance & Cost Optimization",
        "top": 1605,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-24",
    "family": "Suisse Intl",
    "fontStack": "\"Suisse Intl\", Arial, sans-serif",
    "weight": "400",
    "size": "12px",
    "lineHeight": "normal",
    "letterSpacing": "-0.1px",
    "traits": "Regular",
    "count": 1,
    "contexts": [
      {
        "tag": "a",
        "text": "See use cases",
        "top": 5455,
        "property": "font"
      }
    ]
  }
]
```

### Color configurations

```json
[
  {
    "id": "color-1",
    "hex": "#000000",
    "alpha": 1,
    "cssValue": "rgb(0, 0, 0)",
    "count": 758,
    "contexts": [
      {
        "tag": "svg",
        "text": "",
        "top": 2711,
        "property": "svg-fill"
      },
      {
        "tag": "g",
        "text": "",
        "top": 2623,
        "property": "svg-fill"
      },
      {
        "tag": "path",
        "text": "",
        "top": 2838,
        "property": "svg-fill"
      }
    ]
  },
  {
    "id": "color-2",
    "hex": "#F5F5F5",
    "alpha": 1,
    "cssValue": "rgb(245, 245, 245)",
    "count": 25,
    "contexts": [
      {
        "tag": "body",
        "text": "ConsentDetails[#IABV2SETTINGS#]AboutThis website uses cookiesWe use cookies for content, service imp",
        "top": 0,
        "property": "background"
      },
      {
        "tag": "section",
        "text": "Five buyer painsFive data problems we get hired to fixLate detectionFragmented dataConflicting numbe",
        "top": 761,
        "property": "background"
      },
      {
        "tag": "div",
        "text": "",
        "top": 1767,
        "property": "background"
      }
    ]
  },
  {
    "id": "color-3",
    "hex": "#FFFFFF",
    "alpha": 1,
    "cssValue": "rgb(255, 255, 255)",
    "count": 126,
    "contexts": [
      {
        "tag": "a",
        "text": "Calculate the cost",
        "top": 408,
        "property": "control-background"
      },
      {
        "tag": "button",
        "text": "Late detection",
        "top": 1130,
        "property": "control-background"
      },
      {
        "tag": "div",
        "text": "04Platform costs grow without a clear connection to the workloads and outcomes they support.We measu",
        "top": 1188,
        "property": "background"
      }
    ]
  },
  {
    "id": "color-4",
    "hex": "#0B3031",
    "alpha": 1,
    "cssValue": "rgb(11, 48, 49)",
    "count": 35,
    "contexts": [
      {
        "tag": "nav",
        "text": "HomeCost measurementServicesData modeling & lineageOne number everyone trustsPerformance & cost opti",
        "top": 0,
        "property": "background"
      },
      {
        "tag": "section",
        "text": "Your data should drive value. Not costs.Data engineering and consulting for Snowflake and ClickHouse",
        "top": 81,
        "property": "background"
      },
      {
        "tag": "div",
        "text": "",
        "top": 13,
        "property": "background"
      }
    ]
  },
  {
    "id": "color-5",
    "hex": "#F9FAFA",
    "alpha": 1,
    "cssValue": "rgb(249, 250, 250)",
    "count": 4,
    "contexts": [
      {
        "tag": "div",
        "text": "Logistics & TransportSealand Liquids: ISO Tank Fleet Visibility and UtilizationFleet utilization ros",
        "top": 5031,
        "property": "background"
      }
    ]
  },
  {
    "id": "color-6",
    "hex": "#0A1F1A",
    "alpha": 1,
    "cssValue": "rgb(10, 31, 26)",
    "count": 53,
    "contexts": [
      {
        "tag": "div",
        "text": "Book a call",
        "top": 28,
        "property": "text"
      },
      {
        "tag": "div",
        "text": "",
        "top": 22,
        "property": "background"
      },
      {
        "tag": "path",
        "text": "",
        "top": 429,
        "property": "svg-fill"
      }
    ]
  },
  {
    "id": "color-7",
    "hex": "#0A2F30",
    "alpha": 1,
    "cssValue": "rgb(10, 47, 48)",
    "count": 11,
    "contexts": [
      {
        "tag": "path",
        "text": "",
        "top": 2950,
        "property": "svg-fill"
      }
    ]
  },
  {
    "id": "color-8",
    "hex": "#F5F3EE",
    "alpha": 1,
    "cssValue": "rgb(245, 243, 238)",
    "count": 48,
    "contexts": [
      {
        "tag": "path",
        "text": "",
        "top": 28,
        "property": "svg-fill"
      },
      {
        "tag": "a",
        "text": "Home",
        "top": 0,
        "property": "text"
      },
      {
        "tag": "div",
        "text": "Services",
        "top": 28,
        "property": "text"
      }
    ]
  },
  {
    "id": "color-9",
    "hex": "#000000",
    "alpha": 0.050980392156862744,
    "cssValue": "rgba(0, 0, 0, 0.05)",
    "count": 1,
    "contexts": [
      {
        "tag": "div",
        "text": "A recent retail assessment identified an estimated $40,000 in monthly savings within six weeks, prim",
        "top": 638,
        "property": "background"
      }
    ]
  },
  {
    "id": "color-10",
    "hex": "#FAF8F4",
    "alpha": 1,
    "cssValue": "rgb(250, 248, 244)",
    "count": 3,
    "contexts": [
      {
        "tag": "p",
        "text": "Data engineering and consulting for Snowflake and ClickHouse. We help companies speed up analytics, ",
        "top": 287,
        "property": "text"
      }
    ]
  },
  {
    "id": "color-11",
    "hex": "#C8CDC4",
    "alpha": 1,
    "cssValue": "rgb(200, 205, 196)",
    "count": 60,
    "contexts": [
      {
        "tag": "path",
        "text": "",
        "top": 2838,
        "property": "svg-stroke"
      }
    ]
  },
  {
    "id": "color-12",
    "hex": "#C9CCC4",
    "alpha": 1,
    "cssValue": "rgb(201, 204, 196)",
    "count": 8,
    "contexts": [
      {
        "tag": "path",
        "text": "",
        "top": 2757,
        "property": "svg-stroke"
      }
    ]
  },
  {
    "id": "color-13",
    "hex": "#9FABA2",
    "alpha": 1,
    "cssValue": "rgb(159, 171, 162)",
    "count": 2,
    "contexts": [
      {
        "tag": "path",
        "text": "",
        "top": 2756,
        "property": "svg-fill"
      }
    ]
  },
  {
    "id": "color-14",
    "hex": "#0A1D1D",
    "alpha": 0.10196078431372549,
    "cssValue": "rgba(10, 31, 26, 0.1)",
    "count": 49,
    "contexts": [
      {
        "tag": "div",
        "text": "Late detectionFragmented dataConflicting numbersUnexplained spendData not ready for AI 01Data failur",
        "top": 1130,
        "property": "border"
      },
      {
        "tag": "button",
        "text": "Late detection",
        "top": 1130,
        "property": "border"
      },
      {
        "tag": "section",
        "text": "How we workYou can stop after the first stage. We designed it that way.The first stage gives you a d",
        "top": 5595,
        "property": "border"
      }
    ]
  },
  {
    "id": "color-15",
    "hex": "#425E5E",
    "alpha": 1,
    "cssValue": "rgb(66, 94, 94)",
    "count": 3,
    "contexts": [
      {
        "tag": "path",
        "text": "",
        "top": 6256,
        "property": "svg-stroke"
      }
    ]
  },
  {
    "id": "color-16",
    "hex": "#B7C8B8",
    "alpha": 1,
    "cssValue": "rgb(183, 200, 184)",
    "count": 2,
    "contexts": [
      {
        "tag": "path",
        "text": "",
        "top": 2781,
        "property": "svg-stroke"
      }
    ]
  },
  {
    "id": "color-17",
    "hex": "#E2E2E2",
    "alpha": 0.10196078431372549,
    "cssValue": "rgba(229, 229, 229, 0.1)",
    "count": 23,
    "contexts": [
      {
        "tag": "section",
        "text": "Your data should drive value. Not costs.Data engineering and consulting for Snowflake and ClickHouse",
        "top": 81,
        "property": "border"
      },
      {
        "tag": "div",
        "text": "Two entry offersTwo entry offersStart with one defined problem and a measurable baselineStart with a",
        "top": 3258,
        "property": "border"
      }
    ]
  },
  {
    "id": "color-18",
    "hex": "#F5F5EB",
    "alpha": 0.10196078431372549,
    "cssValue": "rgba(245, 243, 238, 0.1)",
    "count": 16,
    "contexts": [
      {
        "tag": "nav",
        "text": "HomeCost measurementServicesData modeling & lineageOne number everyone trustsPerformance & cost opti",
        "top": 0,
        "property": "border"
      },
      {
        "tag": "footer",
        "text": "Our perspective, straight to your inboxBy subscribing, you agree to receive Cadvel updates. See our ",
        "top": 9420,
        "property": "border"
      },
      {
        "tag": "div",
        "text": "Our perspective, straight to your inboxBy subscribing, you agree to receive Cadvel updates. See our ",
        "top": 9421,
        "property": "border"
      }
    ]
  },
  {
    "id": "color-19",
    "hex": "#B2B2B2",
    "alpha": 1,
    "cssValue": "rgb(178, 178, 178)",
    "count": 1,
    "contexts": [
      {
        "tag": "path",
        "text": "",
        "top": 6256,
        "property": "svg-stroke"
      }
    ]
  },
  {
    "id": "color-20",
    "hex": "#2F7A4D",
    "alpha": 1,
    "cssValue": "rgb(47, 122, 77)",
    "count": 3,
    "contexts": [
      {
        "tag": "div",
        "text": "04",
        "top": 1212,
        "property": "text"
      },
      {
        "tag": "a",
        "text": "Performance & Cost Optimization",
        "top": 1605,
        "property": "text"
      }
    ]
  },
  {
    "id": "color-21",
    "hex": "#E5E5E5",
    "alpha": 1,
    "cssValue": "rgb(229, 229, 229)",
    "count": 10,
    "contexts": [
      {
        "tag": "div",
        "text": "BaselineWe establish where the problem starts, what it affects, and what it costs. You get the numbe",
        "top": 2710,
        "property": "border"
      }
    ]
  },
  {
    "id": "color-22",
    "hex": "#48D393",
    "alpha": 1,
    "cssValue": "rgb(72, 211, 147)",
    "count": 2,
    "contexts": [
      {
        "tag": "path",
        "text": "",
        "top": 6331,
        "property": "svg-stroke"
      },
      {
        "tag": "path",
        "text": "",
        "top": 6407,
        "property": "svg-fill"
      }
    ]
  },
  {
    "id": "color-23",
    "hex": "#4AD494",
    "alpha": 1,
    "cssValue": "rgb(74, 212, 148)",
    "count": 1,
    "contexts": [
      {
        "tag": "path",
        "text": "",
        "top": 6331,
        "property": "svg-stroke"
      }
    ]
  },
  {
    "id": "color-24",
    "hex": "#7D8E88",
    "alpha": 1,
    "cssValue": "rgb(125, 142, 136)",
    "count": 1,
    "contexts": [
      {
        "tag": "div",
        "text": "Energy and EV",
        "top": 8365,
        "property": "text"
      }
    ]
  },
  {
    "id": "color-25",
    "hex": "#224443",
    "alpha": 1,
    "cssValue": "rgb(34, 68, 67)",
    "count": 5,
    "contexts": [
      {
        "tag": "path",
        "text": "",
        "top": 2847,
        "property": "svg-fill"
      }
    ]
  },
  {
    "id": "color-26",
    "hex": "#FFFFFF",
    "alpha": 0.10196078431372549,
    "cssValue": "rgba(255, 255, 255, 0.1)",
    "count": 1,
    "contexts": [
      {
        "tag": "div",
        "text": "A recent retail assessment identified an estimated $40,000 in monthly savings within six weeks, prim",
        "top": 638,
        "property": "border"
      }
    ]
  },
  {
    "id": "color-27",
    "hex": "#49D494",
    "alpha": 1,
    "cssValue": "rgb(73, 212, 148)",
    "count": 3,
    "contexts": [
      {
        "tag": "div",
        "text": "",
        "top": 1130,
        "property": "background"
      }
    ]
  },
  {
    "id": "color-28",
    "hex": "#1F392D",
    "alpha": 1,
    "cssValue": "rgb(31, 57, 45)",
    "count": 4,
    "contexts": [
      {
        "tag": "path",
        "text": "",
        "top": 2850,
        "property": "svg-fill"
      }
    ]
  },
  {
    "id": "color-29",
    "hex": "#39231F",
    "alpha": 1,
    "cssValue": "rgb(57, 35, 31)",
    "count": 3,
    "contexts": [
      {
        "tag": "path",
        "text": "",
        "top": 2749,
        "property": "svg-fill"
      }
    ]
  },
  {
    "id": "color-30",
    "hex": "#E9F1EA",
    "alpha": 1,
    "cssValue": "rgb(233, 241, 234)",
    "count": 1,
    "contexts": [
      {
        "tag": "div",
        "text": "",
        "top": 1219,
        "property": "background"
      }
    ]
  },
  {
    "id": "color-31",
    "hex": "#333333",
    "alpha": 1,
    "cssValue": "rgb(51, 51, 51)",
    "count": 4,
    "contexts": [
      {
        "tag": "iframe",
        "text": "",
        "top": -9999,
        "property": "border"
      }
    ]
  }
]
```

### Extraction limits

- Font families are computed CSS declarations, not optical font identification.
- Colors are computed CSS converted by the browser to sRGB; image/video pixels and gradient stops are not sampled.
- Transparent colors are recorded with alpha but excluded from opaque palette role assignments.
- Only currently rendered DOM elements are sampled; closed shadow roots and iframe contents are excluded.

## Type, spacing, and shape language

- Spacing rhythm: Generous macro-spacing between distinct sections, contrasted with tight, grid-locked micro-spacing within feature cards and tables. Margins and paddings appear mathematically proportioned.
- Corner style: Universally sharp and angular. No rounded corners are present on the interface.
- Radius: 0px for all elements including buttons, cards, images, and layout containers.
- Borders: Extensive use of 1px solid borders. These act as architectural framing devices, dividing the page into distinct cells. Low opacity is often used to soften the grid's visual weight.
- Buttons: Rectangular and blocky. Buttons typically feature a stark contrasting background (e.g., white on dark green) and often include a square icon compartment delineated by a 1px border.
- Content width: Centered, constrained max-width container that ensures readability while allowing background colors or border grids to bleed to the viewport edges.
- Density: Low to medium. The strict grid system introduces structure, but ample whitespace prevents the UI from feeling cluttered, emphasizing the typography.
- Evidence: Visual inspection of the sharp-edged 'Calculate the cost' button, the 1px grid lines separating 'Late detection' / 'Fragmented data' blocks, and the stark presentation of the 80px typography.

## Sections

Gallery section count: 15. Each entry corresponds to one gallery capture.

1. **Hero — Data Value Hero** (Home)
   AI suggestion (98% confidence): Complete page-opening hero with navigation, bold value proposition, supporting copy, dual calls to action, distinctive 3D visual, proof statement, and technology logos.
   Capture: 1440×762px; page bounds 0–762px of 10351px; source section ID: `64824d3e-3fb2-445d-a24f-b2cf7ee9944c`; image: https://media.designdetails.io/library/2e181a61702a251a431fe6df778421dc34a9daceb58aa0c7f725e0785da8a334/64824d3e-3fb2-445d-a24f-b2cf7ee9944c.webp
   SECTION.md v3.2: `64824d3e-3fb2-445d-a24f-b2cf7ee9944c` (deterministic evidence; editorial review pending)
2. **Features — Five data problems we get hired to fix** (Home)
   Reusable feature composition from Home, organized around “Five data problems we get hired to fix”.
   Capture: 1440×946px; page bounds 761–1707px of 10351px; source section ID: `707f594a-68ad-4d85-9426-d49f8123bec5`; image: https://media.designdetails.io/library/e2853a65bf53f3871ef378bc076476d0ffa6e7c929bd0d803cd1ff4db0c4e615/section_crop-707f594a-2026-10-21T03-55-14-371Z.webp
   SECTION.md v3.2: `707f594a-68ad-4d85-9426-d49f8123bec5` (deterministic evidence; editorial review pending)
3. **Features — We only fix what we can measure** (Home)
   Reusable feature composition from Home, organized around “We only fix what we can measure”.
   Capture: 1440×369px; page bounds 2341–2710px of 10351px; source section ID: `cf3cf031-9c3d-41fd-a103-baf9da006349`; image: https://media.designdetails.io/library/015cfbbeba08ce5c403cbfaf1fc9cd0f74c7586b0dd8e06352b11d79ef2e8086/section_crop-cf3cf031-2026-10-21T03-55-16-394Z.webp
   SECTION.md v3.2: `cf3cf031-9c3d-41fd-a103-baf9da006349` (deterministic evidence; editorial review pending)
4. **Features — Baseline** (Home)
   Reusable feature composition from Home, organized around “Baseline”.
   Capture: 1440×548px; page bounds 2710–3258px of 10351px; source section ID: `65e0dfed-d634-4c11-9359-950861c0e84c`; image: https://media.designdetails.io/library/fe204b1c791355b603446efe44e1b7e7703a29ff58bf296fd5d3173c9f6a4ea1/section_crop-65e0dfed-2026-10-21T03-55-17-375Z.webp
   SECTION.md v3.2: `65e0dfed-d634-4c11-9359-950861c0e84c` (deterministic evidence; editorial review pending)
5. **Features — Start with one defined problem and a measurable baseline** (Home)
   Reusable feature composition from Home, organized around “Start with one defined problem and a measurable baseline”.
   Capture: 1440×985px; page bounds 3258–4243px of 10351px; source section ID: `00dfe809-d39d-486f-84be-9c335bafdd34`; image: https://media.designdetails.io/library/6ebd07e3817d9ff5eefefe2c1c234c67af99f65db6c663039c6a9b2832bacf8d/section_crop-00dfe809-2026-10-21T03-55-18-439Z.webp
   SECTION.md v3.2: `00dfe809-d39d-486f-84be-9c335bafdd34` (deterministic evidence; editorial review pending)
6. **Features — Senior expertise stays close to the work** (Home)
   Reusable feature composition from Home, organized around “Senior expertise stays close to the work”.
   Capture: 1440×376px; page bounds 4243–4619px of 10351px; source section ID: `1c0e1c26-bd82-4a8d-b18e-588d564d609e`; image: https://media.designdetails.io/library/61fba683b04d9bc4da7e2f593f41de9f60ce7c5ac1dff58b308d3391e1545614/section_crop-1c0e1c26-2026-10-21T03-55-19-476Z.webp
   SECTION.md v3.2: `1c0e1c26-bd82-4a8d-b18e-588d564d609e` (deterministic evidence; editorial review pending)
7. **Features — Every project leaves a number behind** (Home)
   Reusable feature composition from Home, organized around “Every project leaves a number behind”.
   Capture: 1440×976px; page bounds 4619–5595px of 10351px; source section ID: `78497f38-df8d-404c-a8d7-5556d236a624`; image: https://media.designdetails.io/library/7f577f29fdf886ac0e858429e3e3fb5ffa64172f9fa1917b87b3f77499f6bc8d/section_crop-78497f38-2026-10-21T03-55-20-720Z.webp
   SECTION.md v3.2: `78497f38-df8d-404c-a8d7-5556d236a624` (deterministic evidence; editorial review pending)
8. **Features — You can stop after the first stage. We designed it that way.** (Home)
   Reusable feature composition from Home, organized around “You can stop after the first stage. We designed it that way.”.
   Capture: 1440×2045px; page bounds 5595–7640px of 10351px; source section ID: `4ccb4f53-232d-4326-88ee-3066b033e81f`; image: https://media.designdetails.io/library/3f6373974a43acfd5f430bb420174b1927c7fa0ca2ddbfd32c72ecb804b46ce1/section_crop-4ccb4f53-2026-10-21T03-55-21-725Z.webp
   SECTION.md v3.2: `4ccb4f53-232d-4326-88ee-3066b033e81f` (deterministic evidence; editorial review pending)
9. **Features — Where data, operations, and regulation meet** (Home)
   Reusable feature composition from Home, organized around “Where data, operations, and regulation meet”.
   Capture: 1440×878px; page bounds 7640–8518px of 10351px; source section ID: `02160b26-fd9c-4a30-bf9d-834672da1a84`; image: https://media.designdetails.io/library/d13f9fe1331f177a8ccf4e829afcd174e7a4bfeeb4ace3183f7df5406b856e87/section_crop-02160b26-2026-10-21T03-55-22-967Z.webp
   SECTION.md v3.2: `02160b26-fd9c-4a30-bf9d-834672da1a84` (deterministic evidence; editorial review pending)
10. **Founder — Cadvel Founders and Company Story** (Home)
   AI suggestion (90% confidence): Self-contained split section pairing a substantial two-founder portrait with the consultancy story, expertise summary, and partner technology marks.
   Capture: 1440×525px; page bounds 1767–2292px of 10351px; source section ID: `ab6f63c5-c658-448f-9d53-1fbefa09c720`; image: https://media.designdetails.io/library/175acfac29b3cc0157ce4ee88ac06a1fa17a1d87bee9bf750f0e900226a4c29c/ab6f63c5-c658-448f-9d53-1fbefa09c720.webp
   SECTION.md v3.2: `ab6f63c5-c658-448f-9d53-1fbefa09c720` (deterministic evidence; editorial review pending)
11. **Comparison — Two Entry Offers** (Home)
   AI suggestion (94% confidence): Complete, self-contained service-offer section contrasting Diagnosis and Measurement Pilot, followed by a shared senior-expertise checklist. Distinctive stepped framing and clear section boundaries make it reusable.
   Capture: 1440×1341px; page bounds 3344–4685px of 10351px; source section ID: `c5278332-ad93-4195-93e7-b0c334558d25`; image: https://media.designdetails.io/library/f421bc61c4704711d263d18357ab3d0195c40106af8558b0a5fb2c418aa6cf56/c5278332-ad93-4195-93e7-b0c334558d25.webp
   SECTION.md v3.2: `c5278332-ad93-4195-93e7-b0c334558d25` (deterministic evidence; editorial review pending)
12. **Process — Stop After the First Stage** (Home)
   AI suggestion (96% confidence): Complete “How we work” section combining a clear introductory promise, three decision principles, and a self-contained paid-step/decision outcome diagram.
   Capture: 1440×948px; page bounds 5680–6628px of 10351px; source section ID: `418e9acb-9ea3-41c3-a51d-7aca76888101`; image: https://media.designdetails.io/library/7b68594f022f012679d596256c002b862a4c52fc4dd3649b5473576a4bfac302/418e9acb-9ea3-41c3-a51d-7aca76888101.webp
   SECTION.md v3.2: `418e9acb-9ea3-41c3-a51d-7aca76888101` (deterministic evidence; editorial review pending)
13. **Features — The Hidden Cost of Bad Data** (Home)
   AI suggestion (91% confidence): Complete impact section with three cost categories, a quantified business rationale, supporting illustration, and a concluding call-booking action.
   Capture: 1440×954px; page bounds 6631–7585px of 10351px; source section ID: `2cd771c6-bff5-45a8-bf92-bd80e4b08165`; image: https://media.designdetails.io/library/6e15c419b3b4c350241a526225cab6e2f5a1d38c33596eda45d3fb93396380a5/2cd771c6-bff5-45a8-bf92-bd80e4b08165.webp
   SECTION.md v3.2: `2cd771c6-bff5-45a8-bf92-bd80e4b08165` (deterministic evidence; editorial review pending)
14. **CTA — Start With One Costly Problem CTA** (Home)
   AI suggestion (98% confidence): Complete, high-impact conversion block with a focused headline, supporting copy, primary call-booking button, secondary case-studies link, and distinctive patterned treatment.
   Capture: 1440×840px; page bounds 8588–9428px of 10351px; source section ID: `ba2a00af-fe67-4fd8-bde3-e761c8a7b3cc`; image: https://media.designdetails.io/library/d213e9dba0c14a8e3e0dc5e57189a836cadcda7adbce7c260aa974e6f7cd0f2e/ba2a00af-fe67-4fd8-bde3-e761c8a7b3cc.webp
   SECTION.md v3.2: `ba2a00af-fe67-4fd8-bde3-e761c8a7b3cc` (deterministic evidence; editorial review pending)
15. **Footer — Cadvel Site Footer** (Home)
   AI suggestion (99% confidence): Complete and substantial footer combining an inbox prompt, grouped service and industry navigation, company links, contact and social details, legal links, and oversized brand mark.
   Capture: 1440×923px; page bounds 9428–10351px of 10351px; source section ID: `541ff92e-6821-4ea2-9589-ee2b07555ad1`; image: https://media.designdetails.io/library/aa85bb949e25d04ff03e73a1b9e4946a98f98e27f52aef1128b825e3de296fe8/541ff92e-6821-4ea2-9589-ee2b07555ad1.webp
   SECTION.md v3.2: `541ff92e-6821-4ea2-9589-ee2b07555ad1` (deterministic evidence; editorial review pending)

## Capture and motion evidence

- Desktop screenshot: https://media.designdetails.io/library/c1fc3da67e86efcf5a551f0a5e1b72d80768a218f2cba614e02a2408eeae4eda/desktop_full-c4596a47-2026-10-21T03-55-04-213Z.webp
- Mobile screenshot: https://media.designdetails.io/library/864d0ac0dbaffebd09c054a95670eaaaa1972d2dd89cdf7bb9e5ce3d13ca4530/mobile_full-c4596a47-2026-10-21T03-56-01-597Z.webp
- Open Graph image: https://media.designdetails.io/library/5837cfa773570fbd8eed744cf4e82487d25c5b67d366729caf2dc8e8952cd7e6/og_image-c4596a47-2026-10-21T03-55-12-499Z.webp
- Full-page video: https://media.designdetails.io/library/ae91d9c142c6b08095b4a3e17075d7cec90b47c7318f3fbda84df2cb334dd1ac/motion-1792556408740.mp4
- Video poster: https://media.designdetails.io/library/8531645e89277a953acc235c7d87891188edc7243a70ac5344e0a140f4e3e4cb/motion-poster-1792556408740.webp
- Motion status: Recording attached. Consult the motion score and section motion records; do not infer exact easing from frames alone.

## Implementation contract

- Treat computed CSS values, screenshot dimensions, and section bounds as measured evidence.
- Treat typography roles, palette roles, style labels, quality scores, and prose analysis as model or curator judgments.
- Rebuild the page in the listed section order. Request SECTION.md v3.2 using the listed ID. Promoted IDs include editorial observation and judgment; raw gallery IDs still return deterministic geometry, site design facts, media treatment, and explicit evidence gaps.
- Do not invent exact responsive behavior, motion curves, or hidden interaction states when they were not captured.

## Reusable components

- Navigation Bar
- Hero
- Feature Collection
- Editorial Card
- Footer
- Primary Button
- Bordered Grid Layout
- Process Flowchart

## Quality rubric

Overall: 57.65/100 (Competent)
Evidence coverage: 100%
Judge tier: Competent
Verdict: Cadvel executes a tidy, systematic Swiss-modernist/data-dashboard aesthetic with a disciplined type scale and content-aware diagrams and photography, but its bordered-grid module, green/white palette, and conventional hover/fade motion are drawn from a now-common B2B consultancy template, keeping the overall impression competent rather than distinctive.

- Typography (15%): 62 — A single family (Suisse Intl) is used across the entire scale from 80px display down to 10px micro-labels, with letter-spacing tightened progressively as size increases (-3.2px at 80px to roughly -0.1px at 14px), which shows a deliberate, rule-based type system rather than ad hoc sizing. Hierarchy is clear and consistent across sections (buyer-pain cards, process steps, case studies, footer). However, the system relies entirely on weight/size/tracking variation within one regular-weight font with no use of a secondary display face, italics, or textural contrast, limiting expressive range.
- Color (10%): 60 — The palette is restrained and consistently applied: deep green (#0B3031) for hero/nav/footer, white/off-white/light-gray (#FFFFFF, #F5F5F5, #F5F3EE) for content sections, black for primary text, with a single accent green (#48D393/#2F7A4D) reserved for small highlights (numbering, bar-graph icon, tab underline). This creates a legible, professional B2B rhythm, but the range is narrow and safe, with limited use of secondary hues beyond the green-neutral axis.
- Layout (20%): 64 — A bordered-grid module (thin 1px low-opacity borders forming cells) recurs across the buyer-pains tabs, process-step columns, offer cards, senior-expertise checklist, and case-study grid, giving the page a coherent structural language that alternates dark and light full-bleed sections. Content width is constrained with bleed-to-edge borders, and the rhythm of macro whitespace vs. tight grid-locked micro-spacing is consistent. The weakness is that nearly every section resolves to the same bordered-cell pattern, so compositional variety across the page is limited despite the underlying coherence.
- Motion (20%): 56 — The observed motion vocabulary—headline translate-in on load, color-change link hovers, arrow-icon slide on button hover, scroll-triggered wipe-ins paired with a small bar-graph animation, line-draw animations in the process diagrams, and footer fade-ins—is reasonably broad and ties some effects (the bar graph, the connecting lines) to the content's data narrative. However, these are standard fade/translate/hover patterns common to many marketing sites, and there is no evidence here of refined easing, frame-rate quality, or technically distinguishing choreography beyond the conventional toolkit.
- Originality (25%): 47 — The overall idiom—deep green/white corporate palette, sharp-cornered bordered grid cells resembling spreadsheets, process-flow node diagrams, and sepia-toned case-study photography—is a now-common 'data-driven B2B consultancy' template seen widely across competitor and SaaS marketing sites. The bordered-grid/table motif and icon-in-circle process diagrams are executed cleanly but are not hard-to-substitute signature devices; they read as a well-produced instance of an established genre rather than a site offering several genuinely distinctive ideas.
- Content (10%): 66 — Design choices are meaningfully tied to the content: case-study cards present specific measured outcomes (fleet utilization rising from 37% to 53%, $40,000 monthly savings) paired with industry photography and the brand's sepia treatment; the three-step 'Baseline / Root cause / Proof' methodology is paired with matching custom diagrams (radial node map, branching tree, zigzag-to-trend chart) that visually echo the described process; buyer-pain tabs and industry tabs structurally mirror the copy's enumerated claims.

Coverage: 100% of the current weighted rubric. Compare overall scores only at similar evidence coverage.

Formula: weighted mean of scored axes — Typography 15%, Color 10%, Layout 20%, Motion 20%, Originality 25%, Content 10%. Inconclusive and not-assessed axes are excluded and coverage is shown explicitly.

## Verification checklist

- [x] Score evidence
- [x] Design tokens
- [ ] Functional palette
- [x] Normalized sections
- [x] Reusable components
- [x] Typography roles

## Curator notes

A dark green hero with glassy stacked blocks sets a serious, technical mood, while a tabbed pain-point section and plain black and white founder photos build trust before the pitch. Dark bands repeat down the long page to break up chapters, and simple three-step diagrams keep a dense consulting process easy to scan.

## Usage guidance

Use this record as design evidence. Combine it with other references and create an original implementation; do not reproduce the source website or its proprietary copy and assets.