---
name: Enter Support De
description: "This site is a strong example of restrained, professional corporate design that uses geometric abstraction to convey reliability without being cold."
version: alpha

colors:
  background: "#c4dbd8"
  primary: "#000000"
  secondary: "#282828"
  tertiary: "#ff5000"
  neutral: "#282828"
  bg-soft: "#f9f8ea"
  line: "rgba(0,0,0,0)"

typography:
  display:
    fontFamily: grotesque-sans
    fontSize: 28px
    lineHeight: 1.3
    fontWeight: 400
    letterSpacing: "-0.5px"
  body:
    fontFamily: grotesque-sans
    fontSize: 16px
    lineHeight: 1.5
    fontWeight: 400
    letterSpacing: "0px"

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

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

---

## Overview

A restrained corporate identity for an IT support firm using geometric illustrations and a muted, calming palette.

*A clean, organized workshop or a calm corporate lobby.*

## Colors

Muted primary background with sharp high-chroma accents and dark UI elements.

- **Background (`#c4dbd8`)** — uses `bg` token
- **Primary text (`#000000`)** — uses `ink` token
- **Secondary text (`#282828`)** — uses `ink-soft` token
- **Accent (`#ff5000`)** — uses `accent` token
- **Muted (`#282828`)** — uses `muted` token
- **Borders (`rgba(0,0,0,0)`)** — uses `line` token

## Typography

- **Display:** grotesque-sans
- **Body:** grotesque-sans
- **Mono:** monospace

- Use monospace for technical callouts or specific UI elements.
- Maintain a clean, unhurried typographic rhythm.

## Layout

Full-width color blocks transitioning into white content areas.

*Rhythm:* generous padding in content blocks (e.g., 130px 100px 180px)

## Elevation & Depth

- Borders: None observed.

## Shapes

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

## Components

- **button:** Dark background with white text, rounded corners (15px radius).
- **card:** None observed.
- **chip:** None observed.
- **input:** None observed.
- **hero:** Full-width color block featuring abstract geometric illustrations and minimal text.

## Do's and Don'ts

**Don't:**
- Don't use drop shadows — screenshot shows completely flat surfaces.
- Don't use drop shadows — screenshot shows completely flat surfaces.
- Don't use drop shadows — screenshot shows completely flat surfaces.
- Don't use complex gradients — screenshot shows solid color blocks.
- Don't use decorative serif fonts — screenshot shows purely sans-serif and monospace typography.
- Don't use aggressive, high-saturation background colors — screenshot uses a muted teal.

---

## System Prompt (paste into AI agent)

```
Design a calm, reliable interface for a B2B IT support firm. Use a muted teal (#c4dbd8) primary background, white content areas (#f9f8ea), and dark UI elements (#282828). Accent with a sharp orange (#ff5000). Typography should be clean grotesque-sans for display/body and monospace for specific technical elements. Avoid drop shadows, gradients, and aggressive marketing language. Use generous spacing and simple geometric illustrations to convey reliability.
```