Awesome Jev — Homepage (Opening Viewport)

---
version: alpha
name: Awesome Jev — Homepage
colors:
  surface-1: rgb(222, 222, 222)
  surface-2: rgb(254, 254, 254)
  surface-3: rgb(30, 30, 30)
  surface-4: rgb(243, 134, 161)
  heading: rgb(30, 30, 30)
  body: rgb(30, 30, 30)
  primary: rgb(30, 30, 30)
typography:
  heading:
    fontFamily: '"Inter Tight", Inter, system-ui, sans-serif'
    fontSize: 168px
    fontWeight: 800
    lineHeight: 154.56px
  body:
    fontFamily: '"JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace'
    fontSize: 12px
    fontWeight: 400
    lineHeight: 18px
---

## Overview
Oversized black editorial typography below a pink-and-cyan atmospheric banner with a retro terminal-style announcement. Captured October 6, 2026. Opening viewport reference only; the entire large directory is not represented.

## Colors
Use the measured surface and text tokens above as the base palette. Dominant background samples describe interface surfaces, not colors inside logos or photographs. Preserve the restrained relationship between the canvas, supporting text and the focal accent.

## Typography
The inspected headline uses "Inter Tight", Inter, system-ui, sans-serif at 168px, weight 800, with 154.56px line height. Supporting text sample uses "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace at 12px with 18px leading. These are computed styles at 1440px, not an inferred global type scale. Keep headings visually distinct from metadata and allow natural narrow-screen wrapping.

## Layout
Split the opening into a colorful shallow banner and a white centered hero. Place a tiny terminal-style update box in the banner; set the hero headline over two emphatic lines. On mobile the title scales down and the two underlined actions stack.

## Elevation & Depth
Use the screenshot as the depth reference: keep text and content surfaces visually quiet, reserving emphasis for primary actions and highlighted content. Avoid adding heavy shadows that compete with the directory. Exact shadow values were not measured.

## Shapes
The sampled heading radius is 0px; this is not a card-radius token. Follow the visible component shapes described below. Keep consistent alignment, adequate touch targets, and content-driven heights.

## Components
Use squared black-and-white navigation tabs, a hard-edged terminal announcement, fine corner marks and oversized tightly spaced sans-serif headline text. Pink and cyan washes contrast with the uncompromising black headline.

## Do’s and Don’ts
Preserve the reference-specific hierarchy and spacing rhythm. Use original content and properly licensed imagery when adapting. Do not copy live counts as product claims, imitate broken assets, or infer filtering, hover, payment, authentication or keyboard behavior from a still image. Mobile evidence covers the opening viewport at 390px; intermediate breakpoints and accessibility were not audited. Opening viewport reference only; the entire large directory is not represented.