---
name: Aplos
description: "This site is a strong example of using a limited color palette and high-quality photography to establish a sophisticated, modern brand identity."
version: alpha

colors:
  background: "#000000"
  primary: "#000000"
  secondary: "#646464"
  neutral: "#646464"
  bg-soft: "#F2F1ED"
  line: "rgba(180,174,172,1)"

typography:
  display:
    fontFamily: transitional-serif
    fontSize: 40px
    lineHeight: 1.05
    fontWeight: 400
    letterSpacing: "-0.5px"
  subtitle:
    fontFamily: humanist-sans
    fontSize: 26px
    lineHeight: 1.08
    fontWeight: 400
    letterSpacing: "-0.325px"
  body:
    fontFamily: humanist-sans
    fontSize: 13px
    lineHeight: 1.23
    fontWeight: 400
    letterSpacing: "0"

rounded:
  sm: 3px
  md: 5px
  lg: 12px
  pill: 999px

spacing:
  xs: 3px
  sm: 6px
  md: 12px
  lg: 24px
  xl: 48px
  2xl: 96px

---

## Overview

A premium direct-to-consumer brand for sophisticated botanical beverages, featuring rich dark imagery and refined serif typography.

*A modern luxury apothecary for zero-proof spirits.*

## Colors

High-contrast monochrome foundation with warm, off-white surfaces for readability and focus.

- **Background (`#000000`)** — uses `bg` token
- **Primary text (`#000000`)** — uses `ink` token
- **Secondary text (`#646464`)** — uses `ink-soft` token
- **Muted (`#646464`)** — uses `muted` token
- **Borders (`rgba(180,174,172,1)`)** — uses `line` token

## Typography

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

## Layout

Full-bleed dark hero with large, centered modal overlays.

*Rhythm:* Strict multiples of 3px with 12px and 24px as primary gutters.

## Elevation & Depth

- rgb(180, 174, 172) 0px 0px 0px 1px inset
- Borders: Subtle 1px borders and inset box-shadows to define input fields and containers.

## Shapes

- `sm`: 3px
- `md`: 5px
- `lg`: 12px
- `pill`: 999px

## Components

- **button:** High-contrast black pill or large-radius buttons with white text for primary actions.
- **card:** Split-view modal with a cinematic image on one side and a clean, functional form on the other.
- **input:** Clean text inputs with subtle 1px inset box-shadows and slightly rounded corners.
- **hero:** Large-scale photographic hero with atmospheric lighting and overlaid typography.

## Do's and Don'ts

**Don't:**
- don't use bright accent colors — screenshot shows a strict black, white, and off-white palette
- don't use rounded buttons with large radii — screenshot shows buttons with a more subtle, modern radius of 5px
- don't use generic sans-serif fonts for display — screenshot shows transitional-serif for all major headlines
- don't use busy, multi-column layouts — screenshot shows a clean, focused split-view modal and full-bleed hero
- don't use light, airy backgrounds for the main site — screenshot shows a dominant deep black background
- don't use aggressive drop shadows — screenshot shows subtle inset box-shadows and borders for definition

---

## System Prompt (paste into AI agent)

```
This design represents a premium, direct-to-consumer beverage brand specializing in zero-proof spirits. It leverages a sophisticated, minimalist aesthetic dominated by deep black (#000000) and warm off-white (#F2F1ED) surfaces. Typography is anchored by a refined transitional-serif for display and a clean humanist-sans for body and UI elements. Key interaction patterns include high-contrast, large-radius primary buttons and subtle inset borders for form fields. Critical constraints: strictly avoid vibrant accent colors, never use generic sans-serifs for headlines, and maintain the restrained, photographic-forward layout.
```
