/*
Theme Name: Lightning Child
Template: lightning
*/
/* JSアニメ用 */
.hero-cta-bar .cta-anim-ready{
  position: relative;
  overflow: hidden;
  will-change: transform;
}

/* 表示時ポップ */
@keyframes ctaPop {
  0%   { transform: translateY(8px) scale(.96); opacity: .0; }
  60%  { transform: translateY(-3px) scale(1.02); opacity: 1; }
  100% { transform: translateY(0) scale(1); }
}
.hero-cta-bar .cta-pop{
  animation: ctaPop .55s cubic-bezier(.2,.8,.2,1) both;
}

/* クリックで“ぷるん” */
@keyframes ctaJelly {
  0%   { transform: scale(1); }
  30%  { transform: scale(0.96, 1.06); }
  55%  { transform: scale(1.04, 0.97); }
  80%  { transform: scale(0.99, 1.01); }
  100% { transform: scale(1); }
}
.hero-cta-bar .cta-jelly{
  animation: ctaJelly .52s cubic-bezier(.2,.8,.2,1);
}

/* キラッ（光が流れる） */
.hero-cta-bar .cta-anim-ready::after{
  content:"";
  position:absolute;
  inset:-30%;
  background: linear-gradient(120deg,
    rgba(255,255,255,0) 40%,
    rgba(255,255,255,.55) 50%,
    rgba(255,255,255,0) 60%);
  transform: translateX(-120%);
  opacity: .0;
  transition: opacity .2s ease;
  pointer-events:none;
}
.hero-cta-bar .cta-anim-ready:hover::after{
  opacity: .7;
  animation: ctaShine .9s ease forwards;
}
@keyframes ctaShine{
  to { transform: translateX(120%); }
}

/* 動きを減らす設定の人は止める */
@media (prefers-reduced-motion: reduce){
  .hero-cta-bar .cta-pop,
  .hero-cta-bar .cta-jelly,
  .hero-cta-bar .cta-anim-ready:hover::after{
    animation: none !important;
  }
}