# Design Language for gunsul.studio

## Aesthetics and Tone
An architectural studio portfolio where construction projects are documented with industrial elegance -- gunsul.studio (건설 studio) renders as a high-end architecture firm's project gallery: concrete textures, exposed-steel typography, and the dramatic scale of construction photography translated into CSS. The industrial-elegant aesthetic balances raw material honesty with the sophistication of curated presentation.

The tone is architect-confident: "We build. This is what we have built. This is what we will build next."

## Layout Motifs and Structure
**Portfolio System:** Large-scale project showcases in a single vertical scroll.

**Section Flow:**
1. **The Facade:** Hero with the studio name on a concrete-textured background, minimal and bold.
2. **The Projects:** Large-format project cards (full-width, 70vh each) with project name, description, and steel-frame decorative borders.
3. **The Process:** A section showing the studio's methodology in numbered steps.
4. **The Foundation:** Closing section with contact/info.

## Typography and Palette
- **Headlines:** "Bebas Neue" at 3rem-6rem, weight 400, letter-spacing: 0.05em.
- **Body:** "Barlow" at 1rem, weight 400, line-height 1.7.
- **Labels:** "Barlow Condensed" at 0.8rem, weight 600, all-caps.

**Palette:** Concrete (#e0dcd4), Steel Dark (#2a2a2a), Rust (#a04020), Blueprint (#1a3050), Raw White (#f8f4f0), Shadow (#1a1a1a40).

## Imagery and Motifs
**Concrete Texture:** Background using CSS noise pattern in warm grey tones creating a concrete surface.

**Steel Frame Borders:** Project cards use angular borders (no border-radius) with double-line edges (2px solid + 1px solid, 4px gap) creating an I-beam/steel-frame look.

**Large Section Numbers:** Project/step numbers displayed at 6-8rem in light grey behind content, creating watermark-scale numbering.

**Rust Accent:** Rust orange used sparingly for active states and emphasis, evoking oxidized steel.

## Prompts for Implementation
Build as an architecture portfolio. The concrete-textured hero loads with the title in massive Bebas Neue -- no animation, just presence. Project cards are large and impactful, scrolling through them feels like walking through a building. Steel-frame borders create structural visual framing. Large background numbers help with orientation. The process section uses clean numbered steps. Everything is bold, confident, and structural. No soft elements, no rounded corners, no playful accents.

## Uniqueness Notes
1. **Industrial-elegant architecture portfolio:** The combination of raw materials (concrete, steel) with curated presentation is distinctive.
2. **Double-line steel-frame borders:** The I-beam-inspired double border creates a unique structural framing element.
3. **Watermark-scale section numbers:** Oversized background numbers create a distinctive numbering system.
4. **Concrete CSS texture as brand element:** The warm grey noise pattern creates a unique material identity.

Document chosen seed/style: aesthetic: industrial-elegant, layout: portfolio-large, typography: condensed-bold, palette: concrete-steel, patterns: steel-borders, imagery: concrete-texture, motifs: watermark-numbers, tone: architect-confident
<!-- DESIGN STAMP
  timestamp: 2026-03-18T22:30:09
  seed: aesthetic: industrial-elegant, layout: portfolio-large, typography: condensed-bold, palette: concrete-steel
  aesthetic: An architectural studio portfolio where construction projects are documented with ind...
  content_hash: b0c1d2e3f4a5
-->