Matterhaus — Architecture Studio Website — Référence de design web et prompt

> A SELF-CONTAINED, PIXEL-FAITHFUL REPRODUCTION OF THE MATTERHAUS ARCHITECTURE THEME — EVERY PAGE, EVERY LAYOUT, HOVER STATES, AND INTERACTIONS — AS PLAIN HTML/CSS/JS.
> REFERENCE: `https://lexingtonthemes.com/viewports/matterhaus`

## SUMMARY

MATTERHAUS IS AN ARCHITECTURE / STUDIO THEME FOR ASTRO & TAILWIND CSS BY LEXINGTON THEMES. IT FEATURES A CLEAN, EDITORIAL SPLIT-LAYOUT DESIGN ACROSS ALL PAGES: A FIXED FULL-WIDTH HEADER WITH MIX-BLEND-DIFFERENCE NAV (WHITE TEXT ON ANY BACKGROUND), A CONSISTENT TWO-COLUMN SPLIT (LEFT SIDE = STICKY HEADING / INFO, RIGHT SIDE = SCROLLABLE CONTENT OR FULL-HEIGHT IMAGE), AND A FULLY FUNCTIONAL SEARCH MODAL POWERED BY FUSE.JS. THE PALETTE IS STRICTLY MONOCHROMATIC (GREYSCALE BASE SCALE) WITH AN OPTIONAL ACCENT (OKLCH BLUE/PURPLE). NO DARK MODE. LIGHT-ONLY.

## STYLE

- **FONT**: SWITZER (VARIABLE, 100–900) FROM FONTSHARE CDN — `https://api.fontshare.com/v2/css?f[]=switzer@1,2&display=swap`
- **PALETTE (OKLCH)**:
  - `--color-base-50`: `oklch(98.5% 0 0)` (NEAR WHITE)