---
name: Drink818
description: "The site is a strong example of a premium consumer brand using a restricted, sophisticated palette and non-traditional UI typography (monospaced) to create a distinct and memorable identity."
version: alpha

colors:
  background: "#F3E9D5"
  primary: "#0E1111"
  neutral: "#536451"
  line: "rgba(14, 17, 17, 0.12)"

typography:
  display:
    fontFamily: transitional-serif
    fontSize: 34px
    lineHeight: 1.0
    fontWeight: 700
    letterSpacing: "-1px"
  body:
    fontFamily: monospaced
    fontSize: 20px
    lineHeight: 1.6
    fontWeight: 400
    letterSpacing: "0.2px"

rounded:
  sm: 4px
  md: 8px
  lg: 12px
  pill: 999px

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

---

## Overview

Premium tequila brand site featuring an elegant, muted earthy palette and a blend of serif and mono typography.

*A high-end boutique tequila brand website with a refined, earthy aesthetic.*

## Colors

Earthy and refined palette using a warm cream background, dark charcoal text, and a muted olive green for secondary sections.

- **Background (`#F3E9D5`)** — uses `bg` token
- **Primary text (`#0E1111`)** — uses `ink` token
- **Muted (`#536451`)** — uses `muted` token
- **Borders (`rgba(14, 17, 17, 0.12)`)** — uses `line` token

## Typography

- **Display:** transitional-serif
- **Body:** monospaced
- **Mono:** monospaced

- All-caps styling for navigation and legal text.
- Wide letter-spacing applied across the interface for a refined look.
- Transitional serif used for expressive text, while monospaced is used for almost all UI elements.

## Layout

Centered, single-column layouts with generous vertical spacing and large typography.

*Rhythm:* A consistent 4px base grid is used for padding, margins, and component spacing.

## Elevation & Depth

- 0px 9999px 0px 9999px rgba(0, 0, 0, 0.4) for modal overlays
- 0px 0px 10px 3px rgba(122, 122, 122, 0.2) for subtle lift
- Borders: 1px solid rgba(14, 17, 17, 0.12) for inputs and subtle dividers.

## Shapes

- `sm`: 4px
- `md`: 8px
- `lg`: 12px
- `pill`: 999px

## Components

- **button:** Solid cream or green backgrounds with monospaced uppercase text and small border-radius.
- **card:** Not heavily featured, but implied by section blocks with generous padding.
- **chip:** Not present.
- **input:** Monospaced uppercase text with a light border and subtle border-radius.
- **hero:** Large image background or solid color block with massive, bold serif typography.

## Do's and Don'ts

**Don't:**
- Don't use bright, high-saturation accent colors — the screenshot shows a muted earthy palette with olive and cream.
- Don't use rounded, geometric sans-serif fonts for UI — the screenshot exclusively uses transitional-serif and monospaced fonts.
- Don't use small, cramped spacing — the screenshot shows generous padding and large gaps between elements.
- Don't use complex, multi-column layouts for content — the screenshot shows a clean, centered single-column layout.
- Don't use lowercase text for primary navigation or CTAs — the screenshot shows consistent use of uppercase letters.
- Don't use drop shadows for depth on primary UI elements — the screenshot uses flat colors with very subtle shadows only for overlays.

---

## System Prompt (paste into AI agent)

```
This is a premium spirits brand website with a refined, earthy aesthetic. The color palette is dominated by a warm cream (#F3E9D5) background and dark charcoal (#0E1111) text, accented by a muted olive green (#536451). Typography relies on a blend of transitional-serif for expressive headlines and monospaced fonts for almost all UI elements, all frequently set in uppercase with wide letter-spacing. Critical constraints include avoiding bright neon accents, never using lowercase for primary navigation or CTAs, and ensuring layouts remain centered with generous vertical spacing. The design prioritizes a sophisticated, editorial feel over dense information display.
```