/* Движение. Числа сняты с dayos.com замером, а не на глаз: метод
   и таблица в `Образцы/dayos/Движение.md`, сырые данные в `zamery.json`.

   Почему это здесь, а не в их файлах. У Dayos движение живёт в бандлах
   Nuxt на GSAP, в CSS лежит только раскладка: `.hover-loop .second`
   знает, где стоять, но не знает, как приезжать. Их код мы не берём
   (решение Тимура 11.09.2026), поэтому переходы написаны своими
   правилами с их числами. */

/* --- Выезд второй строки на кнопке ---------------------------------
   Замер: первая строка уходит на свою высоту за 300 мс, вторая
   приходит снизу за те же 300 мс, кривая квадратичная с обеих сторон
   (`power1.inOut` у GSAP, `cubic-bezier(.455,.03,.515,.955)` в CSS).
   На середине пути ровно половина — движение симметрично. */
.hover-loop .first,
.hover-loop .second {
  transition: transform 0.3s cubic-bezier(0.455, 0.03, 0.515, 0.955);
}

/* Покой второй строки. Для простой кнопки она стоит ровно под первой;
   для стрелки (`up-right`) их собственное правило уже ставит
   `translate(-100%,100%)`, и трогать его не надо. */
.hover-loop:not(.up-right):not(.down-right) .second {
  transform: translateY(100%);
}

:is(a, button):hover .hover-loop:not(.up-right):not(.down-right) .first {
  transform: translateY(-100%);
}
:is(a, button):hover .hover-loop:not(.up-right):not(.down-right) .second {
  transform: translateY(0);
}

/* Стрелка в плитках призыва: старая улетает вверх-вправо, новая
   приходит снизу-слева. Диагональ их, она записана в их же правиле
   для покоя второй копии. */
:is(a, button):hover .hover-loop.up-right .first {
  transform: translate(100%, -100%);
}
:is(a, button):hover .hover-loop.up-right .second {
  transform: translate(0, 0);
}

/* --- Появление строк заголовка -------------------------------------
   Замер: только прозрачность, с 0 до 1 за 500 мс, задержка между
   строками 100 мс, кривая квадратичная на выходе. Сдвига по вертикали
   на замеренном блоке нет вовсе — `transform` не шелохнулся за все
   155 кадров, хотя обёртка строки к сдвигу готова. */
.split-lines .line {
  transition: opacity 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* Пока строки не разобраны кодом, текст виден как есть: без этого
   заголовок пропал бы у всех, у кого не выполнился наш скрипт. */
.split-lines.gotov .line {
  opacity: 0;
  transition-delay: calc(var(--i, 0) * 0.1s);
}

.split-lines.gotov.vidno .line {
  opacity: 1;
}

/* Интерлиньяж внутри разобранного заголовка первого экрана. Их
   `.line-wrap` держит `margin-bottom:.06em`, и вместе с нашей общей
   поправкой 0,96 зазор вышел бы двойным. Внутри строк возвращаем
   их 0,9: ножки «Д» и «Ц» тут разводит их собственный отступ. */
.heading1 .split-lines .line {
  line-height: 0.9;
}

/* --- Поворот плитки за курсором ------------------------------------
   Углы считает `components/dayos/plitka.tsx`, здесь только то, без чего
   поворот виден рывками. Сглаживание у них живёт в коде: каждый кадр
   угол проходит 5,3 % оставшегося пути, за 0,21 с половину. */
.mouse-3d-rotate .rotate {
  transform-style: preserve-3d;
  will-change: transform;
}

/* Кому движение мешает — тому его нет. Настройка операционной системы,
   и спорить с ней нечем. */
@media (prefers-reduced-motion: reduce) {
  .hover-loop .first,
  .hover-loop .second,
  .split-lines .line {
    transition: none;
  }
  .split-lines.gotov .line {
    opacity: 1;
  }
}