Ring Ripple Button

【対象要素】
- サイト内のボタン1点（CTA・リンクボタン・フォームの送信ボタン等）に適用する

【演出内容】
- ホバーしている間、ボタンと同じ形のリングが外側へ次々と広がって消えていく
- 2本のリングを半周期ずらして出し、途切れずに波紋が続いているように見せる

【品質要件】
- 1本あたりの広がりは1.4秒前後、拡大率は1.5倍程度まで
- リングは必ず薄れて消えきってから次の周回に入る
- prefers-reduced-motion 時は演出を無効化し、状態変化だけが分かる静的表示にフォールバックする
- ラベルの可読性を落とさない。文字が読めなくなる瞬間を作らない

[Target element]
- Apply to a single button on your site (a CTA, a link button, a form submit button, etc.)

[Motion]
- While hovered, rings in the button's shape expand outward one after another and fade away
- Two rings run half a cycle apart so the ripple never breaks

[Quality requirements]
- Each ring expands over about 1.4s, scaling to roughly 1.5x
- Each ring must fade out completely before the cycle restarts
- When prefers-reduced-motion is set, disable the animation and fall back to a static state change
- Never reduce the legibility of the label; do not create a moment where the text cannot be read