---
name: Fallengrape
description: "This site is a great example of using warm, muted earth tones to convey a premium, rustic brand identity without relying on high-contrast or neon colors."
version: alpha

colors:
  background: "#E3A36E"
  primary: "#573D21"
  secondary: "rgba(87,61,33,0.75)"
  neutral: "rgba(87,61,33,0.1)"
  bg-soft: "#E1C6AB"
  bg-quiet: "#F3F3F3"
  line: "rgba(87, 61, 33, 0.1)"

typography:
  display:
    fontFamily: transitional-serif
    fontSize: 48px
    lineHeight: 1.1
    fontWeight: 400
    letterSpacing: "-1px"
  body:
    fontFamily: grotesque-sans
    fontSize: 14px
    lineHeight: 1.3
    fontWeight: 400
    letterSpacing: "1px"
  caption:
    fontFamily: grotesque-sans
    fontSize: 16px
    lineHeight: 1.5
    fontWeight: 400
    letterSpacing: "0.6px"

rounded:
  sm: 0px
  md: 0px
  lg: 0px
  pill: 999px

spacing:
  xs: 4px
  sm: 8px
  md: 16px
  lg: 24px
  xl: 32px
  2xl: 48px
  3xl: 64px

---

## Overview

A refined wine brand age-gate using warm, organic earth tones and serif typography.

*A rustic, high-end wine cellar with warm paper textures*

## Colors

Organic warmth through natural earth tones and high-contrast serif typography.

- **Background (`#E3A36E`)** — uses `bg` token
- **Primary text (`#573D21`)** — uses `ink` token
- **Secondary text (`rgba(87,61,33,0.75)`)** — uses `ink-soft` token
- **Muted (`rgba(87,61,33,0.1)`)** — uses `muted` token
- **Borders (`rgba(87, 61, 33, 0.1)`)** — uses `line` token

## Typography

- **Display:** transitional-serif
- **Body:** grotesque-sans

- Use Romie for display elements
- Use Arial Narrow for body and UI text

## Layout

Single centered modal overlay over a full-bleed textured background

*Rhythm:* Generous vertical spacing within the central modal

## Elevation & Depth

- rgba(0, 0, 0, 0.1) 0px 4px 30px 0px
- Borders: 1px solid rgba(87, 61, 33, 0.1)

## Shapes

- `sm`: 0px
- `md`: 0px
- `lg`: 0px
- `pill`: 999px

## Components

- **button:** Flat, rectangular color blocks without borders
- **card:** Semi-transparent rectangular modal with subtle drop shadow
- **hero:** Full-screen background image with centered modal overlay

## Do's and Don'ts

**Don't:**
- Don't use bright, high-chroma accents — screenshot shows muted earth tones instead
- Don't use purely geometric sans-serif for headlines — screenshot uses a transitional serif
- Don't use small, cramped spacing — screenshot shows generous vertical padding in the modal
- Don't use heavy drop shadows — screenshot uses a very subtle, soft shadow
- Don't use sharp, rounded corners on the modal — screenshot shows sharp, unrounded edges
- Don't use white backgrounds for the main container — screenshot uses a semi-transparent beige

---

## System Prompt (paste into AI agent)

```
This design is a refined wine brand age-gate overlay, positioning itself as premium and organic. The palette relies heavily on warm earth tones, specifically a muted orange background (#E3A36E) and a beige semi-transparent modal (#E1C6AB), paired with dark brown text (#573D21). Typography contrasts an elegant transitional serif (Romie) for the main question with a clean, condensed grotesque sans (Arial Narrow) for UI elements. The layout is a single, centered modal with generous vertical spacing. Critical donts include: never use bright, high-chroma accents; avoid purely geometric sans-serifs for display; and ensure generous spacing rather than cramped layouts. The overall mood is calm, rustic, and sophisticated.
```