---
description: Responsive breakpoints and layout rules for product demo
alwaysApply: true
---

# Responsive Product Demo Rules

Breakpoints:
- desktop: >= 1200px
- laptop/tablet landscape: 900–1199px
- tablet: 640–899px
- mobile: < 640px

Требования:
- body/html/#root не должны создавать horizontal scroll.
- Проверять overflow-x.
- Все секции используют width: min(100%, ...), max-width, padding через clamp().
- На mobile:
  - одна колонка;
  - крупные кнопки;
  - короткие тексты;
  - инженерные детали свернуты;
  - сцена масштабируется;
  - сценарии идут карточками.
- На desktop:
  - Hero + demo в понятных секциях;
  - 2 колонки только там, где хватает ширины;
  - без внутреннего хаотичного скролла.