/* design-forge preset: retro — animations
   レトロ系:ぱたぱたと素朴に。ネオン点滅は1箇所まで */

@keyframes fadeUp{
  from{opacity:0;transform:translateY(24px)}
  to{opacity:1;transform:translateY(0)}
}
@keyframes fadeIn{
  from{opacity:0}
  to{opacity:1}
}
@keyframes float{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-10px)}
}
@keyframes pulse{
  0%,100%{transform:scale(1);opacity:1}
  50%{transform:scale(1.05);opacity:.85}
}

/* スクロール出現(JSで .is-visible 付与)
   紙めくりのように、傾きながらぱたっと現れる */
.reveal{
  opacity:0;transform:translateY(20px) rotate(.8deg) scale(.985);
  transition:opacity .6s steps(6,end),transform .6s steps(6,end); /* コマ落ち風の素朴な動き */
}
.reveal.is-visible{opacity:1;transform:translateY(0) rotate(0) scale(1)}
.reveal:nth-child(2){transition-delay:.14s}
.reveal:nth-child(3){transition-delay:.28s}

/* ホバー(ぐいっと持ち上がらず、少し傾いて浮く) */
.hover-lift{transition:transform var(--speed),box-shadow var(--speed)}
.hover-lift:hover{transform:translateY(-4px) rotate(-.6deg);box-shadow:var(--shadow-m)}

/* retro固有:のれんが揺れるようにゆっくり漂う装飾 */
.float-deco{animation:float 7s ease-in-out infinite}

/* retro固有:スタンプを押したような登場(カードアイコン等に) */
@keyframes stampIn{
  0%{opacity:0;transform:scale(1.6) rotate(-10deg)}
  70%{opacity:1;transform:scale(.94) rotate(-3deg)}
  100%{opacity:1;transform:scale(1) rotate(-4deg)}
}
.stamp-in{animation:stampIn .5s steps(4,end) both}

/* retro固有:ネオン看板風の点滅(控えめ・ページ内1箇所まで) */
@keyframes neonFlicker{
  0%,92%,96%,100%{opacity:1;text-shadow:0 0 8px color-mix(in srgb,var(--c-primary) 55%,transparent)}
  93%,95%{opacity:.55;text-shadow:none}
}
.neon-sign{animation:neonFlicker 4.5s linear infinite;color:var(--c-primary)}