/* 動き(JSが動くときだけ有効。動かなくても内容は普通に見える) */
.js .rv{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s ease}
.js .rv.in{opacity:1;transform:none}
.js .rv.d1{transition-delay:.08s}.js .rv.d2{transition-delay:.16s}.js .rv.d3{transition-delay:.24s}.js .rv.d4{transition-delay:.32s}

/* トップ画像:ゆっくり拡大しながら現れる */
.hero-img{animation:heroIn 1.4s ease both}
@keyframes heroIn{from{opacity:0;transform:scale(1.04)}to{opacity:1;transform:scale(1)}}

/* オレンジの帯:光が流れる */
.visit-band{background-size:200% 100%;animation:shine 6s linear infinite}
@keyframes shine{0%{background-position:0 0}100%{background-position:-200% 0}}

/* カード・ボタンのホバー */
.card{transition:transform .25s ease,box-shadow .25s ease}
.card:hover{transform:translateY(-4px);box-shadow:0 10px 24px rgba(0,0,0,.1)}
.btn{transition:transform .2s ease,box-shadow .2s ease,background .2s}
.btn:hover{transform:translateY(-2px);box-shadow:0 8px 18px rgba(0,0,0,.2)}

/* LINEボタンはやさしく脈打つ */
.btn.lg{animation:pulse 2.6s ease-in-out infinite}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(6,199,85,.45)}60%{box-shadow:0 0 0 14px rgba(6,199,85,0)}}

/* 数字の実績ストリップ */
.stats{background:#fff;border-bottom:1px solid var(--line)}
.stats .wrap{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;padding-top:26px;padding-bottom:26px;text-align:center}
.stats .num{font-size:clamp(28px,6vw,44px);font-weight:800;color:var(--main);line-height:1.2}
.stats .num small{font-size:.5em;margin-left:2px}
.stats .lab{font-size:12px;color:var(--sub)}
@media(max-width:560px){.stats .wrap{grid-template-columns:repeat(2,1fr);gap:18px}}

/* 画面右下のLINEボタン(スクロールすると現れる) */
.float-line{position:fixed;right:16px;bottom:16px;z-index:50;background:#06c755;color:#fff;text-decoration:none;font-weight:800;font-size:14px;padding:12px 18px;border-radius:999px;box-shadow:0 8px 20px rgba(0,0,0,.25);opacity:0;transform:translateY(20px);pointer-events:none;transition:opacity .35s,transform .35s}
.float-line.show{opacity:1;transform:none;pointer-events:auto}

@media (prefers-reduced-motion:reduce){
 .js .rv{opacity:1;transform:none;transition:none}
 .hero-img,.visit-band,.btn.lg{animation:none}
 .card,.btn{transition:none}
}
.js .card.rv.in:hover{transform:translateY(-4px)}
.visit-band{background:linear-gradient(90deg,#fbbf24,#f59e0b,#f97316,#f59e0b,#fbbf24);background-size:200% 100%}

/* 価格アニメーション(基本価格→半額。最後に「半額」がピカッと光る) */
.pa{margin:6px 0 10px}
.pa-base{font-size:14px;color:var(--sub);text-decoration:line-through;text-decoration-color:rgba(220,38,38,.8);text-decoration-thickness:2px}
.pa-now{font-weight:800;line-height:1.2;color:var(--ink)}
.pa-num{font-size:clamp(30px,6vw,40px);font-variant-numeric:tabular-nums}
.pa-unit{font-size:18px;margin-left:2px}
.pa-now small{font-size:12px;font-weight:400;color:var(--sub);margin-left:6px}
.pa-badge{position:relative;display:inline-block;overflow:hidden;margin-top:6px;background:#fbbf24;color:#7c2d12;font-weight:800;font-size:14px;padding:4px 14px;border-radius:999px}
.js .pa .pa-badge{opacity:0;transform:scale(.6)}
.js .pa.done .pa-badge{animation:badgePop .7s cubic-bezier(.2,1.6,.4,1) forwards}
.js .pa.done .pa-badge:after{content:"";position:absolute;top:0;left:-60%;width:40%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.95),transparent);transform:skewX(-20deg);animation:badgeShine 1.1s ease .35s 2}
.js .pa.done .pa-num{color:#dc2626;animation:numFlash .9s ease}
@keyframes badgePop{0%{opacity:0;transform:scale(.6)}60%{opacity:1;transform:scale(1.18);box-shadow:0 0 0 0 rgba(251,191,36,.7)}100%{opacity:1;transform:scale(1);box-shadow:0 0 0 14px rgba(251,191,36,0)}}
@keyframes badgeShine{from{left:-60%}to{left:140%}}
@keyframes numFlash{0%{transform:scale(1)}40%{transform:scale(1.12);text-shadow:0 0 18px rgba(251,191,36,.9)}100%{transform:scale(1)}}
@media (prefers-reduced-motion:reduce){.js .pa .pa-badge{opacity:1;transform:none}.js .pa.done .pa-badge,.js .pa.done .pa-badge:after,.js .pa.done .pa-num{animation:none}}

/* オープニング演出(トップのみ・1セッションに1回):「買い切り」が近づいてきて、バシンと落ち着く */
#intro{position:fixed;inset:0;z-index:9999;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;background:radial-gradient(circle at 50% 50%,#0f766e 0%,#0b3d3a 55%,#06201f 100%);color:#fff;overflow:hidden;animation:introOut .55s ease 3.2s forwards;cursor:pointer}
#intro .streaks{position:absolute;inset:-50%;background:repeating-conic-gradient(from 0deg,rgba(255,255,255,.0) 0deg 6deg,rgba(251,191,36,.20) 6deg 7deg);opacity:0;animation:streaks 1.5s ease-in .5s both}
#intro .l1{position:relative;font-size:clamp(14px,3.6vw,22px);letter-spacing:.12em;opacity:0;animation:fadeUp .6s ease .1s forwards}
#intro .word{position:relative;font-size:clamp(64px,19vw,190px);font-weight:900;line-height:1.1;letter-spacing:.04em;text-shadow:0 6px 30px rgba(0,0,0,.45);transform:scale(.04);opacity:0;animation:zoomIn 1.9s cubic-bezier(.5,0,.2,1) .55s forwards}
#intro .word b{color:#fbbf24}
#intro .l2{position:relative;font-size:clamp(14px,3.6vw,22px);font-weight:700;opacity:0;animation:fadeUp .6s ease 2.25s forwards}
#intro .flash{position:absolute;inset:0;background:#fff;opacity:0;animation:flash .5s ease 2.18s}
#intro .skip{position:absolute;right:16px;bottom:14px;font-size:12px;opacity:.55}
@keyframes zoomIn{
 0%{transform:scale(.04);opacity:0;filter:blur(10px)}
 12%{opacity:1}
 60%{transform:scale(2.3);filter:blur(1px)}
 72%{transform:scale(.88);filter:none}
 82%{transform:scale(1.07)}
 100%{transform:scale(1);opacity:1;filter:none}}
@keyframes streaks{0%{opacity:0;transform:scale(.6) rotate(0)}30%{opacity:1}75%{opacity:1;transform:scale(1.4) rotate(14deg)}100%{opacity:0;transform:scale(1.6) rotate(18deg)}}
@keyframes flash{0%{opacity:0}18%{opacity:.75}100%{opacity:0}}
@keyframes fadeUp{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes introOut{to{opacity:0;visibility:hidden}}
#intro.shake{animation:introOut .55s ease 3.2s forwards,shake .35s ease 2.18s}
@keyframes shake{0%,100%{transform:translate(0,0)}20%{transform:translate(-9px,5px)}40%{transform:translate(8px,-6px)}60%{transform:translate(-5px,-3px)}80%{transform:translate(4px,3px)}}
@media (prefers-reduced-motion:reduce){#intro{display:none}}