---
version: "alpha"
name: "Brendbuk"
description: "Sistema de identidad editorial observado en una guia de marca en ruso, con rojo frambuesa dominante, acentos amarillo maiz y oliva, patron chevron y una estructura de capitulos para logotipo, paleta, tipografia y aplicaciones impresas."
mode: light
source: "C:\\Users\\USER\\claude-skill-library-v2\\utilidades\\DESIGN Style guides 2\\screens 2\\brendbuk-firmennyj-stil-gajdlajn-2026-06-21-11_42_44.png"
sourceType: image
sourceAccuracy: "Colores medidos desde la imagen. La marca observada en el screenshot aparece como ХОРОВОД ВРЕМЁН. Tipografias visibles detectadas por lectura de la pagina de tipografia y aproximadas para HTML cuando no hay archivo fuente."
atmosphere:
  - editorial
  - cultural
  - print-led
  - folk-modern
  - disciplined
colors:
  primary:
    name: Raspberry Chapter
    hex: "#B7163B"
    usage: Fondos de capitulo, titulares, acento principal y sistema de navegacion
  secondary:
    name: Corn Yellow
    hex: "#F4B43A"
    usage: Titulares de portada, highlights y llamadas secundarias
  tertiary:
    name: Olive Pattern
    hex: "#8A912C"
    usage: Pattern de soporte, codificacion de secciones y contraste natural
  quaternary:
    name: Russet Brown
    hex: "#6B3424"
    usage: Versiones profundas de logotipo, paneles de contraste y texto sobre fondos claros
  background:
    name: Paper Cream
    hex: "#F7EEDC"
    usage: Canvas general, slides internas y composicion principal
  surface:
    name: Warm Sand
    hex: "#EFE1C8"
    usage: Tarjetas, paneles y superficies secundarias
  text-primary:
    name: Cocoa Ink
    hex: "#4A241C"
    usage: Texto principal, lockups y labels oscuros
  text-secondary:
    name: Toasted Clay
    hex: "#7C6052"
    usage: Texto secundario y notas tecnicas
  border:
    name: Archive Line
    hex: "#D7C4A8"
    usage: Bordes finos y separadores
typography:
  display:
    family: "NAMU"
    role: Headings, chapter covers, large editorial statements
    weight: "700 aprox"
    size: "72px aprox"
    lineHeight: 0.9
    letterSpacing: "-0.04em"
    htmlFamily: "Montserrat"
    htmlNote: "Original visible en la pagina de tipografia. Sustituto HTML aproximado."
  body:
    family: "Conqueror Sans"
    role: Body copy, captions, descriptive notes and usage rules
    weight: "400 a 600 aprox"
    size: "16px"
    lineHeight: 1.55
    letterSpacing: "0"
    htmlFamily: "Source Sans 3"
    htmlNote: "Original visible en la pagina de tipografia. Sustituto HTML aproximado."
  logo:
    family: "Logotipo observado en cirilico"
    role: Wordmark and logo applications
    weight: "(no detectado)"
    htmlFamily: "Montserrat"
    htmlNote: "Recreacion tipografica aproximada solo para preview HTML."
rounded:
  sm: "4px"
  md: "10px"
  lg: "16px"
  xl: "24px"
spacing:
  base: "8px"
  sm: "8px"
  md: "12px"
  lg: "16px"
  xl: "24px"
  xxl: "40px"
components:
  button-primary:
    backgroundColor: "#B7163B"
    textColor: "#F7EEDC"
    border: "1px solid rgba(183, 22, 59, 0.32)"
    rounded: "999px"
    padding: "12px 20px"
  button-secondary:
    backgroundColor: "#F7EEDC"
    textColor: "#B7163B"
    border: "1px solid #D7C4A8"
    rounded: "999px"
    padding: "12px 20px"
  card:
    backgroundColor: "#FFF8ED"
    border: "1px solid #D7C4A8"
    rounded: "16px"
    padding: "22px"
  badge:
    backgroundColor: "rgba(244, 180, 58, 0.18)"
    textColor: "#8B4D12"
    border: "1px solid rgba(244, 180, 58, 0.26)"
motion:
  level: restrained
  durations: "180ms, 260ms"
  easing: "cubic-bezier(0.22, 1, 0.36, 1)"
  pattern: Print-like transitions, color fades and small lifts only
---

## Overview

- **Composition cues:**
  - Layout: Grid
  - Content Width: Full Bleed
  - Framing: Editorial boards
  - Grid: Strong

## Source reliability

- Source used: single screenshot of the brand guide
- Observed brand in source: `ХОРОВОД ВРЕМЁН`
- Colors: measured from image
- Typography: `NAMU` and `Conqueror Sans` are visibly named in the screenshot
- Exact CSS variables, exact export sizes and exact print specifications: `(no detectado)`

## Colors

The system uses a warm editorial palette with raspberry red as the chapter anchor, corn yellow as the callout accent and olive as the pattern support color.

- **Primary (#B7163B):** chapter backgrounds, hero headlines and main emphasis.
- **Secondary (#F4B43A):** large title contrast and warm highlight moments.
- **Tertiary (#8A912C):** pattern support, section coding and earthy contrast.
- **Quaternary (#6B3424):** deep logo applications and darker editorial blocks.

- **Usage:** Background: #F7EEDC; Surface: #EFE1C8; Text Primary: #4A241C; Text Secondary: #7C6052; Border: #D7C4A8; Accent: #B7163B

## Typography

Typography appears explicitly documented in the screenshot.

- **Display:** NAMU, 72px approx, weight 700 approx, compact line-height and bold editorial presence.
- **Body:** Conqueror Sans, 16px approx, regular to medium weights for captions and specifications.
- **Logo wordmark:** observed in Cyrillic, exact font source `(no detectado)`, reconstructed only as an approximation in HTML.

## Layout

Layout follows a chapter-based print grid. Each section behaves like a board with a large title zone, dense reference modules and a disciplined vertical flow between chapter dividers.

- **Layout type:** Grid
- **Content width:** Full Bleed
- **Base unit:** 8px
- **Scale:** 8px, 12px, 16px, 24px, 40px
- **Section padding:** 24px, 32px, 40px
- **Card padding:** 22px, 24px

## Elevation & Depth

Depth is light and print-led. Contrast comes more from paper, red blocks and color panels than from shadows or blur.

- **Surface style:** Flat editorial cards with soft paper depth
- **Borders:** 1px #D7C4A8, 1px rgba(183, 22, 59, 0.14)
- **Shadows:** 0 20px 50px -34px rgba(74, 36, 28, 0.18)
- **Blur:** `(no detectado)`

## Shapes

Shapes are modestly rounded. Most modules are rectangular with only enough softness to feel contemporary while staying compatible with print layouts.

- **Corner radii:** 4px, 10px, 16px, 24px, 999px
- **Icon sets:** custom logo applications and simple dot markers

## Components

The visible component language is built around logo application boards, palette tables, type specimens, misuse matrices and print collateral.

### Buttons

- **Primary:** #B7163B background, cream text, pill silhouette.
- **Secondary:** cream background, raspberry text, archival line border.

### Cards and Surfaces

- **Card surface:** #FFF8ED, border #D7C4A8, radius 16px, padding 22px.

### Brand system

- **Observed:** primary logo, reverse logo, chapter boards, color tables, typography specimen, misuse matrix, poster and print applications.

## Do's and Don'ts

### Do

- Do keep raspberry as the strongest chapter color.
- Do use yellow and olive as supporting accents instead of equal competitors.
- Do preserve the print-board rhythm of dense references inside calm paper canvases.
- Do keep the logo applications high-contrast and rule-driven.

### Don't

- Don't replace the warm cultural palette with cool corporate blues.
- Don't over-soften the layout with glassmorphism or heavy blur.
- Don't turn the pattern into decorative noise over the headline column.
- Don't distort or recolor the logo outside the observed variants.

## Motion

Motion should feel almost printed into the interface. Use simple fades, small upward travel and restrained hover contrast.

**Motion Level:** restrained

**Durations:** 180ms, 260ms

**Easing:** cubic-bezier(0.22, 1, 0.36, 1)

**Hover Patterns:** contrast, subtle lift, border emphasis

**Scroll Patterns:** chapter reveal, staggered board entrance