/* Мобильные эффекты MAS Project (только до 768px). Подключается блоком tools/call-button.py на всех страницах.
   Выбор Натальи из демо /demo/mobile-fx: переходы как в приложении, карусель отзывов, цифры набираются,
   текст загорается при чтении, липкая нижняя панель, шапка прячется при прокрутке. */

.mfx-dock { display: none; }

@media (max-width: 768px) {
  /* Липкая нижняя панель вместо круглой кнопки «Позвонить» */
  .call-fab { display: none !important; }
  .mfx-dock {
    display: block; position: fixed; left: 0; right: 0; bottom: 0; z-index: 960;
    padding: 8px 10px calc(8px + env(safe-area-inset-bottom, 0px));
    background: rgba(11, 6, 6, 0.86);
    backdrop-filter: saturate(160%) blur(14px); -webkit-backdrop-filter: saturate(160%) blur(14px);
    border-top: 1px solid rgba(240, 120, 0, 0.18);
    transform: translateY(110%); transition: transform .4s cubic-bezier(.2,.9,.25,1);
  }
  .mfx-dock.is-on { transform: translateY(0); }
  .mfx-dock__in { display: grid; grid-template-columns: 1fr 1fr 1.25fr; gap: 8px; max-width: 520px; margin: 0 auto; }
  .mfx-dock a {
    display: flex; align-items: center; justify-content: center; gap: 6px; min-height: 46px; padding: 0 6px;
    border-radius: 14px; font: 800 13px/1 Montserrat, Arial, sans-serif; text-decoration: none; color: #fff;
    background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.12);
  }
  .mfx-dock a:active { transform: scale(.96); }
  .mfx-dock a.mfx-dock__call { background: linear-gradient(135deg, #f07800, #ff9a2e); border-color: transparent; }
  .mfx-dock svg { width: 17px; height: 17px; fill: currentColor; flex-shrink: 0; }
  body.mfx-has-dock { padding-bottom: calc(66px + env(safe-area-inset-bottom, 0px)); }
  body.mfx-has-dock #backToTop { bottom: calc(76px + env(safe-area-inset-bottom, 0px)) !important; }

  /* Шапка прячется при прокрутке вниз */
  .header { transition: transform .35s cubic-bezier(.2,.8,.2,1), background .3s, box-shadow .3s; will-change: transform; }
  .header.mfx-hide { transform: translateY(-110%); }

  /* Точки под каруселью отзывов */
  .mfx-dots { display: flex; justify-content: center; gap: 6px; margin-top: 14px; }
  .mfx-dots i { width: 7px; height: 7px; border-radius: 7px; background: rgba(127,127,127,.35); transition: width .25s, background .25s; }
  .mfx-dots i.is-on { width: 22px; background: #f07800; }

  /* Текст загорается при чтении */
  .mfx-w { transition: opacity .35s; }
  .mfx-reveal .mfx-w { opacity: .3; }
  .mfx-reveal .mfx-w.is-lit { opacity: 1; }
}

/* Переходы между страницами как в приложении */
@media (max-width: 768px) and (prefers-reduced-motion: no-preference) {
  @view-transition { navigation: auto; }
  .case__cover { view-transition-name: case-hero; }
  ::view-transition-old(root), ::view-transition-new(root) { animation-duration: .28s; }
  ::view-transition-group(case-hero) { animation-duration: .42s; animation-timing-function: cubic-bezier(.2,.8,.2,1); }
}

@media (prefers-reduced-motion: reduce) {
  .mfx-dock, .header, .mfx-w { transition: none !important; }
  .mfx-reveal .mfx-w { opacity: 1; }
}
