/* ==========================================================================
   Липкая кнопка звонка — для телефонов и планшетов
   ==========================================================================

   Зачем: на телефоне шапка занимает 150px и остаётся на экране при
   прокрутке — это почти четверть экрана. Убираем из шапки телефон и
   кнопку «Позвонить» (они идут сразу после логотипа) и переносим звонок
   в кнопку внизу экрана: она едет вместе с прокруткой, всегда под рукой
   и не мешает читать.

   Где показывается: до 992px — там же, где меню сворачивается в кнопку
   «Меню». На компьютере кнопки нет.

   Оформление — как у остальных кнопок сайта: красный #F33535, шрифт
   Lora, прямые углы, белый текст.
   ========================================================================== */

/* По умолчанию кнопки нет — включается только на узких экранах */
.call-fab { display: none; }

@media (max-width: 992px) {

  /* Запас снизу, чтобы подвал не заезжал под кнопку.
     Задан всегда, а не только при прокрутке: иначе страница меняет
     высоту в момент появления кнопки и содержимое дёргается. */
  body { padding-bottom: 84px; }

  .call-fab {
    position: fixed;
    right: 16px;
    bottom: 16px;
    z-index: 90;                  /* ниже шапки — у неё 100 */

    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 14px 22px;

    background: #F33535;
    color: #fff;
    font-family: 'Lora', serif;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: 0.5px;
    line-height: 1;
    text-decoration: none;
    border: none;
    border-radius: 0;             /* как у всех кнопок сайта */

    box-shadow: 0 8px 24px rgba(243, 53, 53, 0.4);
    cursor: pointer;

    /* Пока шапка показывает свой телефон — кнопка спрятана.
       Прячем через прозрачность, а не display, чтобы появление
       можно было проиграть плавно. */
    opacity: 0;
    visibility: hidden;
    transform: translateY(16px);
    pointer-events: none;
    transition: opacity 0.25s ease, transform 0.25s ease, visibility 0.25s;
  }

  .call-fab i { font-size: 16px; }

  /* Прокрутили — кнопка выехала и мягко «дышит» */
  body.is-scrolled .call-fab {
    opacity: 1;
    visibility: visible;
    transform: none;
    pointer-events: auto;
    animation: call-fab-pulse 2.5s ease-in-out infinite;
  }

  body.is-scrolled .call-fab:active { transform: scale(0.96); }

  /* Шапка ужимается: телефон и кнопка «Позвонить» уходят,
     остаются логотип и меню */
  body.is-scrolled .header-right { display: none; }
}

/* Лёгкое «дыхание» тени */
@keyframes call-fab-pulse {
  0%, 100% { box-shadow: 0 8px 24px rgba(243, 53, 53, 0.40); }
  50%      { box-shadow: 0 8px 30px rgba(243, 53, 53, 0.62); }
}

/* Для тех, кто отключил анимации в системе */
@media (prefers-reduced-motion: reduce) {
  .call-fab,
  body.is-scrolled .call-fab {
    animation: none;
    transition: none;
  }
}
