Swiss grid studio website

Turn studio facts, real projects and services into a white-and-cobalt website on a twelve-column grid, with complete page code. A compact direction to help the next screen feel deliberate, specific, and easy to remix.

Create a complete Swiss / International Typographic Style studio website, not merely typography advice. Deliver previewable frontend code in a tool that can generate HTML/CSS.

INPUT
Studio: [name, discipline, audience, optional city]
Projects: [2–6 real projects: name, description, role, optional year, available images, actual URLs]
Services and introduction: [actual services, working method, brand statement]
Primary action: [real email or enquiry URL; optional existing secondary URLs]
Brand constraints: [whether cobalt is allowed; licensed fonts, logo and images; prohibited elements]
Delivery: [standalone index.html by default; specify any other stack; content language]

MISSING INFORMATION
Ask at most three concrete questions only when missing identity/core content, essential asset access or the primary action blocks completion. Mark noncritical gaps [To supply] or remove the region. Use labeled neutral image placeholders rather than unrelated work. If a fictional demo is explicitly requested, identify all demo content; never claim actual clients, awards or results. Flag a brand ban on the sole blue accent rather than silently changing the defining palette.

MAKE
1. Verify facts, asset rights and links, then map supplied material to navigation, hero and introduction, numbered project index, service grid, studio statement, contact and footer. Reduce sections when necessary instead of inventing six projects or achievement metrics.
2. Establish a strict twelve-column desktop grid. Palette: white #ffffff, near-black #0a0a0a and sole accent cobalt #1f4fff. Structure with 1px ink hairlines and 2px cobalt primary rules; square corners, no gradients or card shadows. Align headlines, project rows and body to the same tracks. Build hierarchy through type and space rather than cinematic photography.
3. Use available sans-serif type for headings/body and mono only for small indices/labels. Supply Chinese system-font fallbacks without mandatory external downloads. Let the hero break across two lines, preserve Chinese phrase boundaries and bound sizes with clamp. Project rows carry actual names, descriptions and URLs; services use hairline divisions.
4. Collapse to one column on phones; move years/secondary fields below names without truncating essential copy. Collapsed navigation still reaches every section. Actions use supplied addresses only; projects without URLs are plain rows. An optional decorative scrolling strip can be paused and respects reduced motion.
5. Use semantic HTML, visible keyboard focus and suitable touch areas; hide decorative grids from assistive technology. Check 390px/1440px, long Chinese titles, no images, fewer than two projects and no achievement data. Distinguish performed checks from pending ones and never claim untested accessibility compliance.

DELIVER
A. Brief structure, assumptions and asset gaps.
B. One complete index.html block with inline CSS/necessary JS, full actual copy and replaceable content/color variables; no “add code here” sections.
C. Entry/target/real availability table and viewport/edge-case/performed-or-pending/problem checks.
No source-brand identity, invented reviews or commercial endorsements. A style illustration is not page code. Disclose when code has not been run.

Site adaptation of Jason Zhou / Superdesign, Swiss Grid Agency Layout (prompt text CC0-1.0). Retains grid, hairlines, single cobalt and numbered structure; removes demo achievements and adds Chinese, factual and full-delivery boundaries. No upstream preview, fonts or code reused: https://github.com/superdesigndev/superdesign-prompts/blob/6c60906945208df5aa2187f19f8ddfe9b2948aa0/prompts/swiss-grid-agency-layout/README.md .

type advice only, invented projects/achievements, unlicensed upstream branding/assets, overflowing Chinese headings, rounded gradient styling, dead actions, hidden essential copy, unrun checks claimed passed