/* SAMOILOVA.Rocks - живые кнопки на лендингах (.lp-btn, .lp-cta a).
   Главная кнопка мягко пульсирует голубым кольцом и ловит блик, при наведении
   приподнимается и сдвигает стрелку. Вторичная заливается голубым, иконка качается.
   prefers-reduced-motion: всё статично. */

.lp-btn,.lp-cta a{position:relative;overflow:hidden;isolation:isolate;
  transition:transform .28s cubic-bezier(.2,.8,.2,1),box-shadow .28s ease,background .2s ease,color .2s ease,border-color .2s ease}
.lp-btn:hover,.lp-cta a:hover{transform:translateY(-2px) scale(1.03)}
.lp-btn:active,.lp-cta a:active{transform:translateY(0) scale(.97);transition-duration:.08s}

/* главная: кольцо-пульс + блик */
.lp-btn.primary,.lp-cta a{animation:lpPulse 2.8s ease-out infinite}
.lp-btn.primary{box-shadow:0 12px 28px -14px rgba(31,42,48,.6)}
.lp-btn.primary::after,.lp-cta a::after{content:'';position:absolute;inset:-2px;z-index:-1;pointer-events:none;
  background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.38) 50%,transparent 65%);
  transform:translateX(-130%);animation:lpShine 3.6s ease-in-out infinite}
.lp-btn.primary:hover{box-shadow:0 18px 36px -14px rgba(31,42,48,.65)}
.lp-cta a::after{background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.65) 50%,transparent 65%)}

@keyframes lpPulse{
  0%{box-shadow:0 0 0 0 rgba(127,182,204,.55),0 12px 28px -14px rgba(31,42,48,.6)}
  70%{box-shadow:0 0 0 14px rgba(127,182,204,0),0 12px 28px -14px rgba(31,42,48,.6)}
  100%{box-shadow:0 0 0 0 rgba(127,182,204,0),0 12px 28px -14px rgba(31,42,48,.6)}}
@keyframes lpShine{0%,55%{transform:translateX(-130%)}85%,100%{transform:translateX(130%)}}

/* стрелка уезжает вправо */
.lp-btn .arr,.lp-cta a .arr{display:inline-block;transition:transform .28s cubic-bezier(.2,.8,.2,1)}
.lp-btn:hover .arr,.lp-cta a:hover .arr{transform:translateX(5px)}

/* вторичная: голубая заливка + покачивание иконки */
.lp-btn.ghost{background:#fff;border-color:var(--sky,#b8dae8)}
.lp-btn.ghost:hover{background:var(--sky,#b8dae8);border-color:var(--sky,#b8dae8);color:var(--accent,#2b4a59);
  box-shadow:0 14px 30px -16px rgba(127,182,204,.9)}
.lp-btn .ic{display:inline-block;transform-origin:50% 80%}
.lp-btn:hover .ic{animation:lpWiggle .6s ease-in-out}
@keyframes lpWiggle{0%,100%{transform:rotate(0)}25%{transform:rotate(-14deg) scale(1.12)}50%{transform:rotate(10deg) scale(1.12)}75%{transform:rotate(-6deg)}}

/* если главная - Telegram (страницы изделий): иконка сама подмигивает раз в цикл */
.lp-btn.primary .ic{animation:lpWiggleIdle 3.6s ease-in-out infinite}
@keyframes lpWiggleIdle{0%,78%,100%{transform:rotate(0)}83%{transform:rotate(-14deg) scale(1.12)}89%{transform:rotate(10deg) scale(1.12)}95%{transform:rotate(-6deg)}}

@media (prefers-reduced-motion:reduce){
  .lp-btn,.lp-cta a,.lp-btn .arr,.lp-btn .ic{transition:none!important;animation:none!important}
  .lp-btn.primary::after,.lp-cta a::after{display:none}
  .lp-btn:hover,.lp-cta a:hover{transform:none}
}
