schema: ai-cjm-component-contract/v1
id: hero
version: 1.0.0
status: stable
owner: AI CJM Design
purpose: Сразу объясняет аудитории изменение в работе и следующий шаг.
use_when:
- Нужна вводная область страницы с одной основной мыслью.
evidence:
- id: production-style
  url: https://aicjm.ru/edu/styles.css?v=20260811-edu-canon
  locator: .hero, .hero__copy, .hero h1, .hero__lead, .hero__actions
  supports:
  - anatomy
  - variant:editorial
  - size:default
  - state:default
- id: production-dom
  url: https://aicjm.ru/edu/
  locator: main > section.hero
  supports:
  - approved-example
  - content
anatomy:
- id: eyebrow
  required: false
  role: Контекст или категория.
- id: title
  required: true
  role: Единственный H1 страницы.
- id: lead
  required: true
  role: Конкретизация результата.
- id: actions
  required: false
  role: Primary и secondary action.
- id: proof
  required: false
  role: Ближайшее доказательство.
variants:
- id: editorial
  status: stable
  description: Светлая вводная плоскость.
  evidence_refs:
  - production-style
- id: deep
  status: candidate
  description: Редкая navy-опора с on-deep text.
sizes:
- id: default
  status: stable
  description: Размер определяется содержимым и перечисленными semantic/component tokens; raw dimensions запрещены.
  evidence_refs:
  - production-style
states:
  default:
    status: stable
    basis: observed
    description: default is observed at the exact production locator in evidence_refs.
    evidence_refs:
    - production-style
  hover:
    status: not-applicable
    basis: not-applicable
    description: hover is not owned by hero.
  focus-visible:
    status: not-applicable
    basis: not-applicable
    description: focus-visible is not owned by hero.
  active:
    status: not-applicable
    basis: not-applicable
    description: active is not owned by hero.
  selected:
    status: not-applicable
    basis: not-applicable
    description: selected is not owned by hero.
  open:
    status: not-applicable
    basis: not-applicable
    description: open is not owned by hero.
  disabled:
    status: not-applicable
    basis: not-applicable
    description: disabled is not owned by hero.
  loading:
    status: not-applicable
    basis: not-applicable
    description: loading is not owned by hero.
  success:
    status: not-applicable
    basis: not-applicable
    description: success is not owned by hero.
  error:
    status: not-applicable
    basis: not-applicable
    description: error is not owned by hero.
  empty:
    status: not-applicable
    basis: not-applicable
    description: empty is not owned by hero.
responsive:
  mode: split-copy-to-single-column
  reading_order: DOM order remains authoritative in every mode.
  rules:
  - Keep proof, heading, lead and actions in that DOM order.
  - Collapse actions to a single column before labels wrap; primary action becomes full-row.
  - Metrics reflow from a row to one vertical list with separators.
accessibility:
  pattern: labelled-page-introduction
  semantics:
  - Use one page h1; proof and lead remain text alternatives before actions.
  keyboard:
  - The hero container owns no keyboard behavior; actions delegate to button/text-link.
  focus:
  - Focus order follows proof-free reading order into actions.
  motion:
  - Entrance motion is optional and removed under reduced motion.
tokens:
- surface.page
- surface.deep
- text.primary
- text.secondary
- text.on-deep
- type.size.display-min
- type.size.display-max
- type.line-height.display
- type.tracking.display
- layout.container-max
- layout.gutter-mobile
- layout.section-space-min
content:
  required:
  - Один H1.
  - Изменение в работе.
  - Следующий шаг или доказательство.
  constraints:
  - H1 выражает одну мысль.
  - Claims имеют источник.
do:
- 'Строить смысл: задача → изменение → доказательство.'
dont:
- Не добавлять абстрактную AI-метафору ради заполнения.
examples:
  approved:
    status: stable
    description: Компонент hero в указанном scoped production locator.
    evidence: https://aicjm.ru/edu/
  prohibited:
    description: Не добавлять абстрактную AI-метафору ради заполнения.
acceptance:
- id: hero-1
  criterion: На странице один H1.
  method: manual
- id: hero-2
  criterion: Reading order сохраняется на mobile.
  method: manual