/* ===== Культура чистоты: лёгкие CSS-эффекты =====
   Только CSS, без JS. Анимация идёт по transform/opacity — эти свойства
   «дешёвые» для браузера (не трогают layout и перерисовку), поэтому
   не влияют на LCP/CLS/TBT в PageSpeed. Вес — около 1 КБ, без картинок.
   Подключается сайт-вайд, сработает на всех текущих и будущих кнопках
   этих классов — отдельно помечать каждую кнопку не нужно. */

/* --- 1) Блик на всех заметных кнопках сайта ---
   .btn — тёмные кнопки «Заказать», «Позвонить»; .btn2 — обводка «Рассчитать
   стоимость», «Оставить заявку»; .yr-btn — кнопка отзывов на Яндекс Картах.
   mix-blend-mode:overlay сам подстраивает блик под тёмный и светлый фон. */
.btn, .btn2, .yr-btn{position:relative; overflow:hidden}
.btn::after, .btn2::after, .yr-btn::after{
  content:"";
  position:absolute;
  top:0; bottom:0; left:0;
  width:30%;
  background:linear-gradient(115deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.9) 50%, rgba(255,255,255,0) 100%);
  mix-blend-mode:overlay;
  transform:translateX(-260%) skewX(-18deg);
  animation:kcShine 4.6s ease-in-out infinite;
  pointer-events:none;
  will-change:transform;
}
.btn2::after{animation-delay:.6s}
.yr-btn::after{animation-delay:1.2s}
@keyframes kcShine{
  0%   {transform:translateX(-260%) skewX(-18deg)}
  22%  {transform:translateX(360%)  skewX(-18deg)}
  100% {transform:translateX(360%)  skewX(-18deg)}
}

/* Кнопка-тоггл «Что входит» (.tipbtn) сюда намеренно не включена. */

/* --- 2) Пульсирующий зелёный индикатор у номера телефона --- */
a[href^="tel:"]:not(.btn){position:relative; padding-left:16px}
a[href^="tel:"]:not(.btn)::before,
a[href^="tel:"]:not(.btn)::after{
  content:"";
  position:absolute;
  left:0; top:50%;
  width:8px; height:8px;
  margin-top:-4px;
  border-radius:50%;
  background:#2fbf5b;
}
a[href^="tel:"]:not(.btn)::after{
  animation:kcPulse 1.8s ease-out infinite;
}
@keyframes kcPulse{
  0%   {transform:scale(1);   opacity:.65}
  100% {transform:scale(2.8); opacity:0}
}

@media (prefers-reduced-motion: reduce){
  .btn::after, .btn2::after, .yr-btn::after{animation:none; display:none}
  a[href^="tel:"]:not(.btn)::after{animation:none; opacity:.65; transform:scale(1)}
}