/* base.css — правила, общие для всех страниц.
   Раньше отклик на нажатие и prefers-reduced-motion жили только в index.html,
   поэтому на остальных 25 страницах их не было вовсе. */

/* Отклик на нажатии, а не на отпускании.
   Обёртка .mt-btn-wrap масштабируется вместо вложенной кнопки, иначе
   сжатие удваивается. */
button,
.mt-btn-wrap {
  transition: transform 110ms cubic-bezier(0.22, 1, 0.36, 1);
}
button:active { transform: scale(0.97); }
.mt-btn-wrap:active { transform: scale(0.97); }
.mt-btn-wrap:active > button { transform: none; }
a:active { opacity: 0.65; }

/* Ховер-эффекты — только там, где указатель действительно наводится.
   На тач-экране :hover залипает после тапа: заливка остаётся на кнопке. */
@media (hover: none), (pointer: coarse) {
  .mt-fill:hover::after { transform: translateX(-100%); }
  .mt-fill.from-right:hover::after { transform: translateX(100%); }
  .mt-underline:hover::after { transform: scaleX(0); }
}

/* «Уменьшить движение».
   Прежнее правило в index.html гасило только animation — transition и
   scroll-behavior продолжали работать. Здесь закрыты все три. */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
  html { scroll-behavior: auto !important; }
  button:active,
  .mt-btn-wrap:active { transform: none; opacity: 0.8; }
}

/* Матовая подложка шапки живёт на псевдоэлементе, а не на самом <header>.
   backdrop-filter делает элемент содержащим блоком для position:fixed
   потомков — из-за этого мобильное меню внутри шапки получало top/bottom
   относительно её 77px и схлопывалось в полоску 40px вместо 736px. */
.site-header::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  background: rgba(255, 255, 255, 0.92);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}