/* Правки поверх стилей, приходящих из Claude Design.
 *
 * Файл подключается после styles.css и переживает новые выгрузки:
 * styles.css пересобирается из исходника каждый раз, а этот — наш.
 * Если очередная выгрузка чинит что-то из перечисленного, лишним не будет —
 * значения здесь совпадают по смыслу с тем, что должно быть.
 */

/* ── Заголовок первого экрана ────────────────────────────────────────────────
 *
 * Приходило font-size:min(14.5vw,96px) вместе с overflow-wrap:anywhere.
 * На 375px это 54.4px, и строка «в движении» занимает 382px при доступных 335.
 * Она не помещалась, «в» уезжало на отдельную строку, а «движении» вставало
 * впритык (333 против 335) и разрывалось посреди слова.
 *
 * 12.2vw даёт запас 18–29px на всех ширинах от 320 до 480px, строка держится
 * целиком. Переносы внутри слова запрещаем полностью: для заголовка из двух
 * слов они не нужны никогда, а выглядят как ошибка вёрстки.
 */
@media (max-width: 480px) {
  [data-hero-title] {
    font-size: min(12.2vw, 96px) !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
    hyphens: none !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  [data-hero-title] {
    overflow-wrap: normal !important;
    word-break: normal !important;
    hyphens: none !important;
  }
}

/* ── Страховка от горизонтальной прокрутки ───────────────────────────────────
 *
 * overflow-x:hidden на body уже стоит, но он лечит симптом, а не причину:
 * страница всё равно может стать шире экрана, и тогда часть содержимого
 * окажется недоступной. Ограничиваем корень явно.
 */
html {
  overflow-x: hidden;
  max-width: 100%;
}
