# Design Direction — Simon's Guest House Rome (v2: Fusion, client-aligned)

> Binding visual direction for all components & pages. v2 reconciles the brief's "osa di più" with the client's REAL existing identity (Simone's graphic). Read before building/reworking any UI.

## Client's existing identity (anchor — honor it)
Simone already uses a wordmark: **"Simon's"** and **"Rome"** in the script font **Great Vibes**; **"GUESTHOUSE"** in letter-spaced serif caps; a thin **ornamental rule with little scroll/curl flourishes** at the ends; and a small **luggage-tag** icon. Palette neutral/warm (taupe), black type. The taste is **elegant, romantic, classic** — not street-art. This is the brand core.

## The thesis (FUSION)
Elegant-romantic **brand identity** (Simone's) executed with **bold editorial confidence**. The property's story — opulent marble/gold/Klimt interiors inside the artsy Pigneto/Tor Pignattara quarter — is told with big photography, strong type hierarchy, and refined motion. **Street-art appears only as a thematic thread in the neighborhood section**, never as the site's core visual language.

## Brand identity (use everywhere)
- **Wordmark:** "Simon's" + "Rome" in **Great Vibes** (self-host `@fontsource/great-vibes`); "GUESTHOUSE" in letter-spaced serif (Fraunces) small-caps; optional thin ornamental rule with end-curls beneath, echoing Simone's graphic. Real HTML text (responsive, SEO), not an image.
- **Mark / favicon = a refined LUGGAGE TAG** (Simone's motif): a tag silhouette, coral fill with brass/gold string-hole + a hairline, legible at 16px. Replaces the earlier arch+S mark. Regenerate favicon.svg + PNG set + apple-touch.
- **Imagery framing = rounded-corner squares** (client preference). Photos render as `aspect-ratio: 1/1` with a `clamp(14px, 2vw, 22px)` corner radius and a thin gold hairline. The earlier arch/portal crop is dropped: it cropped too aggressively, so square imagery with soft corners is the standard device.

## Color (warm, elegant; coral as a confident accent — not garish)
- `--c-cream #FBF8F2` / `--c-travertine #F4EFE6` (bases) · add `--c-taupe #C9BEB2` (echo Simone's greige, for some surfaces/dividers)
- `--c-ink #1A1715` (text/dark) · `--c-plum #2B2233` (optional deep romantic surface)
- `--c-coral #F25C4D` / `--c-coral-700 #C9442F` — confident accent (CTAs, key highlights, links), used with restraint, NOT full-bleed everywhere
- `--c-brass #C9A24B` / gold `#E7B765` — the elegant/Klimt metal: hairlines, the ornamental rule, tag string, small flourishes. Gold is the primary "elegance" signal.
- Contrast/AA: body text on cream = ink or coral-700 (never bright coral for small text).

## Type
- **Great Vibes** — brand wordmark ONLY (Simon's/Rome). Never for body/headings.
- **Fraunces Variable** — display headings & room names (elegant, characterful). Also the "GUESTHOUSE" small-caps.
- **Inter Variable** — body (multilingual Latin+Cyrillic).
- **Eyebrows/labels** = letter-spaced UPPERCASE in Inter or Fraunces (echo Simone's "GUESTHOUSE" treatment). **Drop Space Mono** (too techy/street for this elegant identity) — remove the dependency/import.

## Layout, signature, motion
- Editorial, asymmetric, generous whitespace; confident size jumps. Alternate surfaces cream → travertine → (occasional) plum/taupe band for rhythm.
- **Signatures:** (1) the Great-Vibes wordmark + ornamental rule, (2) the luggage-tag mark, (3) elegant rounded-square feature imagery. One bold-but-tasteful accent moment (e.g. the booking band) — coral, not loud.
- Imagery: rounded-corner square framing via shared `.arch-image` radius/clip; subtle hover scale; brass hairlines.
- Motion: restrained hero load reveal; scroll-reveal; gold underline grow on links; reduced-motion respected. Keep the brush/street texture ONLY in the neighborhood section, subtle.

## Voice / copy
Warm, romantic-but-concrete, active voice. Eyebrows set place/identity in letter-spaced caps ("PIAZZA MICHELE SANMICHELI · ROMA"). Bilingual IT (source) + EN; localize later. Never edit frozen room texts (spec §6).

## Quality floor (non-negotiable)
Responsive 360/768/1024/1440 (no h-overflow), visible keyboard focus, alt text, semantic headings, AA contrast, reduced-motion respected.

## Reuse note (from WIP checkpoint 247e54c)
Salvageable: extended tokens base, curated images, IT/EN content copy, ScrollReveal. Rework to v2: Hero (elegant arch + Great Vibes lockup, coral restrained), SectionDivider (subtler, gold/ornamental not heavy spray), RoomPreview (elegant rounded-square cards). Remove Space Mono usage. Build remaining: Faq, BookingCta (tasteful coral band), Home page.