System overview
- Hero
- visual-led · left
- Surface
- dark
- Density
- sparse
- Content width
- 800px
- Confidence
- medium
- Primary action
- None detected
Color system
Dark surfaces use 7 repeated semantic colors; hierarchy is carried mainly by tonal contrast.
Page canvas
Dominant rendered page background.Surface
Repeated container or section fill; relative occurrence score 21.Surface
Repeated container or section fill; relative occurrence score 10.Surface
Repeated container or section fill; relative occurrence score 10.Primary text
Observed display foreground with 15.5:1 contrast against the captured canvas.Secondary text
Observed reading foreground; measured canvas-reference contrast is 8.3:1.Border and divider
Most repeated inspectable border color.Typography
A single-family system uses Barlow across display and reading roles, differentiated by size and weight.
Metric previews use the observed CSS values. Source font files are not bundled, so unavailable families fall back locally.A foundation model for engineering physics.
Barlow · 84px/80.64px · weight 400 · tracking -2.52px · color rgb(230, 228, 221) · preview scaled01 The problem
Barlow · 14px/19.6px · weight 400 · tracking 1.68px · color rgba(230, 228, 221, 0.851)Engineering has always been limited by how much physics it can afford to compute. We're building a…
Barlow · 22px/31.9px · weight 400 · tracking 0px · color rgba(230, 229, 220, 0.722)Designs evaluated in the same amount of time.
Barlow · 15px/22.5px · weight 400 · tracking 0px · color rgba(230, 228, 222, 0.600)A CONVENTIONAL SOLVER
Barlow · 13px/normal · weight 400 · tracking 1.56px · color rgba(230, 228, 221, 0.851)Spacing & shape
Spacing
- Base unit
- 8px
- Section gap
- 56px
- Container
- 24px
56px24px14px104px5px48px28px1px4.5px8pxShape
Soft geometry is the dominant shape voice. Separation relies on borders and surface contrast rather than shadow.
- Containers
- 6px
- Media
- 4px
- Cards
- 0px
Inspect borders & shadows · 3
1px solid rgba(230, 230, 222, 0.122)1px solid rgba(230, 230, 220, 0.200)None observedComponent grammar
Hero
Opening proposition
Visual led, left-aligned opening anchored by the primary message.
Inspect 4 properties
- Pattern
- visual-led
- Alignment
- left
- Heading
- Barlow · 84px / 400
- Media
- image-led
Navigation
Global wayfinding
Static navigation with 1 visible actions in the desktop opening.
Inspect 7 properties
- Text
- #e6e4dd
- Border
- none
- Radius
- 0px
- Padding
- 28px 56px 28px 56px
- Type
- Barlow · 16px / 400
- Position
- absolute
- Height
- 78px
Content card
Repeated content module
1 style-matched content card instance was found among 2 candidates; properties describe the dominant observed cluster.
Inspect 7 properties
- Background
- #08090b
- Text
- #e6e4dd
- Border
- none
- Radius
- 0px
- Padding
- 48px 56px 48px 56px
- Type
- Barlow · 16px / 400
- Candidate pool
- 2
Badge or tag
Compact status or category label
1 style-matched badge or tag instance was found among 1 candidates; properties describe the dominant observed cluster.
Inspect 6 properties
- Text
- rgba(229, 228, 221, 0.702)
- Border
- none
- Radius
- 0px
- Padding
- 0px 0px 0px 0px
- Type
- Barlow · 14px / 400
- Candidate pool
- 1
Media frame
Visual proof
1 style-matched media element was found among 2 rendered candidates; cover fitting and 0px are the most repeated treatments.
Inspect 4 properties
- Fit
- cover, fill
- Ratios
- 2.15, 1.00
- Radius
- 0px, 4px
- Candidate pool
- 2
Footer
Closing navigation
4 visible actions close the page on a transparent surface.
Inspect 6 properties
- Text
- rgba(230, 228, 220, 0.549)
- Border
- 1px solid rgba(230, 230, 222, 0.122)
- Radius
- 0px
- Padding
- 48px 56px 44px 56px
- Type
- Barlow · 14px / 400
- Links
- 4
Layout & narrative
The homepage continues through 5 observed sections, moving from the opening proposition into 01 The problem, 02 What we're building, 03 What changes.
- Structure
- Visual marquee narrative
- Hero pattern
- Visual marquee: imagery carries most of the opening surface
- Grid
- 3 columns
- Closing
- Utility footer with 4 actions
Full section sequence · 5
- 01 The problem
- 02 What we're building
- 03 What changes
- 04 Why one model
- 05 Get in touch
Imagery, motion & responsive
Imagery
Image led media acts as the page’s primary visual proof rather than decoration.
cover fitting · square-edged framesInspect imagery inventory
- Composition
- A focused visual anchors the first viewport.
- Inventory
- 2 images/canvas elements and 0 videos across the analyzed homepage.
Motion
2 declared keyframes and 4 active animations were inspectable at capture; observed timing uses 1.1s, 1.2s, 1.6s.
Reduced-motion rules detectedInspect motion inventory
- Libraries
- CSS / browser-native or bundled source not identifiable
- Keyframes
- rise, fade
- Durations
- 1.1s, 1.2s, 1.6s, 0.01ms, 1200ms, 1600ms, 1100ms
- Easings
- ease-out, cubic-bezier(0.2, 0.7, 0.2, 1), linear
- States
- hover, focus
Mobile
The same 1 visible navigation action remains at mobile width. Hero alignment changes from left to center; mobile heading size is 42px.
Observed multi-column desktop regions collapse to a single-column mobile flow.Inspect responsive test
- Viewport
- 390 × 844
- Overflow
- No horizontal overflow detected
Reproduction guidance
Do
- Pair the observed #0a0b0d canvas with #e6e4dd primary copy before adding secondary surfaces.
- Use Barlow at 84px/80.64px, weight 400, for the primary display moment.
- Let the left-aligned visual-led hero establish hierarchy before secondary content.
- Image led media acts as the page’s primary visual proof rather than decoration.
Don’t
- Do not mix in arbitrary radii; 6px is the repeated treatment on containers.
- Do not introduce an accent hue that is absent from the captured palette.
- Do not introduce extra type families beyond Barlow.
- Do not add card shadows; the source separates content without repeated elevation.




