/* Кириллица в чужой типографике.

   Все правила здесь одной причины: вид сайта снят с dayos.com, а их
   кегли, интерлиньяж и запреты переноса подогнаны под английские слова.
   Русские длиннее, и в них есть буквы с выносными элементами, которых
   у латиницы нет. Ни одно правило Dayos не переписано: здесь только
   поправки поверх, и у каждой стоит замер, из которого взято число.

   Файл подключается после их таблиц и после замены гарнитур.
   Когда придёт день переписывать их правила своими именами (долг
   из `Из штаба.md`), эти поправки войдут в новые правила числами. */

/* Интерлиньяж заголовков: 0,96 вместо их 0,9.

   Замер (canvas TextMetrics, Inter Tight Bold, 12.09.2026): прописная
   «Д» поднимается на 0,728em над базовой линией и опускает ножки
   на 0,175em под неё. Полная высота строки с «Д», «Ц» или «Щ» выходит
   0,903em, а шаг строк у Dayos 0,9em — кириллическая ножка садится
   на верхушку следующей строки. У латиницы этого нет: «A» и «O»
   под базовую линию не выходят вовсе.

   Число 0,96 не выдумано. У самих Dayos многострочный заголовок идёт
   через `split-lines`, и каждая строка получает `margin-bottom:.06em`
   (`.heading1[data-v-dfdb9bb1] .line-wrap`). 0,9 + 0,06 и есть 0,96 —
   их же ритм, просто взятый интерлиньяжем, потому что их разбивку
   строк делает их код на Vue, а мы его не берём.

   В тексте с одними «А» и «О» разницы на глаз нет, а слипание уходит. */
.heading1,
.type-h1,
.type-h2,
.type-h3,
.type-h4,
.type-h5,
.type-h6 {
  line-height: 0.96;
}

/* Кегль первого экрана на телефоне.

   Замер на ширине 390 (12.09.2026): колонка 340 пикселей, а строка
   «Приложения» при их кегле 5,4rem занимает 385. Слово уезжало за край
   экрана, и то же самое делала строка «для бизнеса» на 373. У латиницы
   такой беды нет: их собственные слова в этом заголовке короче.

   `min()` держит их кегль там, где он влезает, и ужимает там, где нет.
   12,6vw на 390 даёт 49 пикселей вместо 56 — самое длинное слово
   становится 337 при колонке 340. На узких телефонах ужимается дальше
   сам собой. */
@media (max-width: 767px) {
  .hero-home h1.heading {
    font-size: min(5.4rem, 12.6vw);
  }
}

/* Строка не растягивает колонку.

   У Dayos `.line-wrap` стоит с `width:fit-content`, и это верно для них:
   их код кладёт в строку то, что уже поместилось после вёрстки. Наши
   строки разобраны по переносу в тексте, и длинное русское имя
   («Юридические услуги», «Рестораны и банкетные залы») растягивало
   колонку и уезжало за край экрана на телефоне. Потолок в 100 % ширины
   возвращает перенос внутри строки. */
.heading1 .split-lines .line-wrap,
.heading2 .split-lines .line-wrap {
  max-width: 100%;
}

/* И сама ячейка не растягивается под длинное имя. Элемент грида
   по умолчанию не сжимается уже своего содержимого (`min-width:auto`),
   а на телефоне их колонки становятся флексом с `align-items:flex-start`,
   где ширина берётся по содержимому. «Рестораны и банкетные залы»
   в заголовке раздвигали ячейку до 453 пикселей при экране в 390,
   и секция уезжала за край вместе с заглушкой. */
.columns > li,
.content-column,
.entry-solution {
  max-width: 100%;
  min-width: 0;
}

/* Перенос внутри разобранной строки.

   Их `split-lines` ставит строке `white-space:nowrap`, и для их кода это
   верно: он кладёт в строку ровно то, что поместилось после вёрстки,
   переносить там нечего. Наши строки разобраны по переносу в тексте,
   и «Юридические услуги» в колонке 281 пиксель при запрете переноса
   просто обрезалось по краю. Разрешаем перенос по пробелу. */
.split-lines .line {
  white-space: pre-line;
}

/* Перенос в заголовке карточки.

   На телефоне Dayos ставит заголовку карточки `white-space:nowrap`:
   их имена разделов короткие («Finance», «HR»), и перенос им не нужен.
   Наше «Юридические услуги» при 281 пикселе колонки уезжало за край
   и обрезалось. Возвращаем перенос по пробелу. */
@media (max-width: 767px) {
  .entry-solution .heading {
    white-space: pre-line;
  }
}

/* Плитки призыва на телефоне: одна колонка вместо их двух.

   У Dayos эта пара и на телефоне стоит в две колонки: «Book a demo»
   рядом с «Explore platform» влезает. «Написать в Telegram» в колонку
   170 пикселей не влезает ни при каком разумном кегле — одно слово
   TELEGRAM длиннее колонки, и плитки наезжали друг на друга. Ставим
   их друг под другом: раскладка меняется, вид плитки остаётся их. */
@media (max-width: 767px) {
  .entry1 .items {
    grid-template-columns: 1fr;
  }
}

/* Плитки стека на телефоне: две колонки вместо их четырёх.

   В их четырёх колонках лежат логотипы, они сжимаются до любой ширины.
   У нас на месте логотипов слова («React Native», «ИИ в продукте»),
   и в колонке 80 пикселей от них остаётся столбик по букве. */
@media (max-width: 767px) {
  /* Их селектор записан с атрибутом Vue и весит больше короткого
     имени, поэтому атрибут стоит и здесь. */
  .grid1 .content.cols-4[data-v-44ad30c9] {
    grid-template-columns: repeat(2, 1fr);
  }
  .grid-item-wrap {
    min-width: 0;
  }
}

/* Колонки подвала на телефоне.

   Их `groups` идёт в две колонки и на телефоне тоже. Имена наших
   разделов длиннее английских, и правая колонка уезжала за край:
   элемент грида не сжимается уже своего содержимого, пока ему
   не сказать `min-width:0`. */
.the-footer .groups > .group,
.the-footer .links,
.the-footer .links li {
  min-width: 0;
}

/* Ссылки подвала переносятся.

   Их `.links` держат ссылку в одну строку: «Platform», «Pricing»,
   «Careers» — каждая короче колонки. У нас в подвале лежат имена
   разделов целиком («Выкладка в App Store и Google Play»), и запрет
   переноса уводил их за край экрана. */
.the-footer .links a {
  white-space: pre-line;
}

/* Ник в подвале не уезжает за край.

   На телефоне Dayos ставит верх подвала строкой: логотип слева, контакт
   справа, ширина контакта по содержимому. Их контакт — короткий адрес,
   наш `@timur_connector` длиннее своей ячейки в 104 пикселя и вылезал
   за правый край на 28. Ставим логотип и контакт друг под другом,
   контакту отдаём всю ширину колонки. */
@media (max-width: 767px) {
  .the-footer .top .left {
    flex-direction: column;
  }
  .the-footer .mail {
    width: 100%;
  }
}

/* Заголовок первого экрана по образцу surf.ru.

   У Dayos он 13rem прописными, и на их коротких английских словах это
   работает. Тимур принёс образцом surf.ru: там заголовок вдвое мельче,
   строчными буквами и в три строки. Прописные сняты: у образца их нет.

   Гарнитура стоит только здесь. У Dayos узкая Suisse держит все
   заголовки от h1 до h6 и цитаты; остальные остаются на Inter Tight.
   Tektur был примерен первым и объявлен в `shrifty.css` рядом —
   переключение между ними в одну строку.

   Кегль 5,4rem, тот же, что Тимур принял на Inter Tight.
   Замер ширин — `scripts/zamer-geroya.mjs`.

   Межбуквенное прижато на 0,02em вместо их 0,03. */
.hero-home h1.heading {
  font-family: Onest, SuisseIntlCond, sans-serif;
  font-size: 5.4rem;
  letter-spacing: -0.02em;
  text-transform: none;
}

/* На телефоне кегль ведётся процентом ширины: обе примеренные
   гарнитуры шире Inter Tight, под который был подобран прежний 10vw. */
@media (max-width: 767px) {
  .hero-home h1.heading {
    font-size: min(3.6rem, 8.2vw);
  }
}

/* Хвосты «у», «д», «ц», «щ» не срезаются маской строки.

   У Dayos каждая строка заголовка лежит в `.line-wrap` с `overflow:hidden`
   — это маска, из-под которой строка выезжает при появлении. Высота
   маски равна шагу строки, и для латиницы этого хватает: «A», «O», «M»
   под базовую линию не опускаются вовсе.

   Замер на Onest, кегль 48 (`scripts/zamer-vynosnyh.mjs`, 12.09.2026):
   маска 43,2 пикселя, верх «Д» 34, хвост «у» 11,5. Полная высота строки
   45,5 — на 2,3 пикселя больше маски, и хвост «у» в слове «продукты»
   срезался ровно по этой границе.

   Запас 0,08em (3,8 пикселя на этом кегле) покрывает «у» и «щ»
   с небольшим избытком. Отрицательное поле снизу возвращает шаг строк
   к прежнему: их 0,06em минус наши 0,08em. */
.split-lines .line-wrap {
  margin-bottom: -0.02em;
  padding-bottom: 0.08em;
}

/* Заголовки карточек разделов: «ПРОЕКТИРОВАНИЕ», «МАРКЕТПЛЕЙСЫ»,
   «ТЕСТИРОВАНИЕ» одним словом длиннее колонки, и слово обрезалось
   справа. Кегль их type-h4 4.8rem снижен до 4rem; на телефоне
   колонка шире слова, там кегль их. Замер 14.09.2026: самое длинное
   слово при 4rem занимает 296px в колонке 373px. */
@media (min-width: 768px) {
  .entry-solution .heading {
    font-size: 4rem;
  }
}
