/* ==========================================================================
   vip-v5.css — 店家視角優化新增元件（2026-08-15）
   只放本次新增/覆寫的樣式，vip-v2/v3/v4.css 原封不動
   ========================================================================== */

/* ── [1] 影片降級為輔助：小標題 + 重點摘要 ───────────────────────── */
.hero2-vlabel{
  display:inline-flex;align-items:center;gap:6px;margin:0 0 10px;
  font-size:12.5px;font-weight:800;letter-spacing:.06em;color:var(--gold-400);
}
.vslot-cap{
  list-style:none;margin:14px 0 0;padding:0;
  display:grid;gap:7px;
}
.vslot-cap li{
  position:relative;padding-left:20px;
  font-size:13.5px;line-height:1.7;color:var(--ink-300);
}
.vslot-cap li::before{
  content:"";position:absolute;left:4px;top:.62em;
  width:6px;height:6px;border-radius:50%;background:var(--gold-500);
}

/* ── [5] 痛點卡片：對應解方 ──────────────────────────────────────── */
.pain-fix{
  display:block;margin-top:11px;padding:9px 12px;
  background:#f6f8fb;border-left:3px solid var(--gold-500);border-radius:0 8px 8px 0;
  font-size:13.5px;font-weight:700;line-height:1.65;color:var(--ink-700);
}
.pain-fix::before{content:"→ ";color:var(--gold-600);font-weight:900}
.pain:hover .pain-fix{background:#fdf7ea}

/* ── [22] 每日成本視覺化 ─────────────────────────────────────────── */
.day-cost{
  margin:26px 0 0;padding:26px 30px;
  display:flex;align-items:center;gap:28px;flex-wrap:wrap;
  background:var(--paper);border:1px solid var(--line);border-radius:16px;
  box-shadow:0 10px 30px rgba(15,30,55,.05);
}
.day-cost .dc-fig{
  display:flex;align-items:baseline;gap:3px;flex:none;color:var(--ink-900);
}
.day-cost .dc-cur{font-size:20px;font-weight:800;color:var(--ink-500)}
.day-cost .dc-num{
  font-size:clamp(48px,7vw,78px);font-weight:900;line-height:.95;
  letter-spacing:-.03em;color:var(--gold-600);
}
.day-cost .dc-unit{font-size:19px;font-weight:800;color:var(--ink-500)}
.day-cost .dc-note{flex:1 1 260px;min-width:0}
.day-cost .dc-note b{
  display:block;font-size:clamp(17px,2vw,21px);font-weight:900;
  color:var(--ink-900);line-height:1.45;margin-bottom:6px;
}
.day-cost .dc-note span{
  display:block;font-size:14.5px;line-height:1.75;color:var(--ink-500);
}
@media(max-width:560px){
  .day-cost{padding:22px;gap:16px}
  .day-cost .dc-fig{width:100%}
}

/* ── [23] 收尾比喻 + 雙 CTA ──────────────────────────────────────── */
.cmp-punch .cp-sub{
  display:block;margin-top:10px;
  font-size:clamp(14px,1.6vw,16px);line-height:1.75;color:#c7d0dc;font-weight:500;
}
.cmp-punch .cp-cta{
  margin-top:20px;display:flex;gap:10px;justify-content:center;flex-wrap:wrap;
}
.cmp-punch .cp-cta .btn2.ghost{
  --fg:#eaf0f7;border-color:rgba(255,255,255,.32);background:transparent;
}
.cmp-punch .cp-cta .btn2.ghost:hover{
  background:rgba(255,255,255,.08);border-color:var(--gold-400);--fg:#fff;
}

/* ══ 聯盟區：只有會員之間才有的機會 ═══════════════════════════════ */
.alli{
  display:grid;grid-template-columns:repeat(3,1fr);gap:16px;
}
.alli-c{
  position:relative;background:var(--paper);border:1px solid var(--line);
  border-radius:14px;padding:24px 22px 22px;transition:border-color .25s,transform .25s,box-shadow .25s;
}
.alli-c:hover{
  border-color:var(--gold-500);transform:translateY(-3px);
  box-shadow:0 14px 34px rgba(15,30,55,.09);
}
.alli-c .ac-n{
  display:block;font-size:13px;font-weight:900;letter-spacing:.1em;
  color:var(--gold-600);margin-bottom:12px;
}
.alli-c b{
  display:block;font-size:clamp(17px,2vw,20px);font-weight:900;
  color:var(--ink-900);line-height:1.4;margin-bottom:8px;
}
.alli-c p{margin:0;font-size:14.5px;line-height:1.8;color:var(--ink-500)}
@media(max-width:900px){.alli{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.alli{grid-template-columns:1fr}}

/* 互惠機制舉例 */
.alli-ex{
  margin:20px 0 0;padding:22px 26px;
  background:var(--ink-900);border-radius:14px;border-left:4px solid var(--gold-500);
}
.alli-ex .ax-tag{
  display:inline-block;margin-bottom:10px;padding:3px 11px;border-radius:999px;
  font-size:11.5px;font-weight:800;letter-spacing:.08em;
  color:var(--gold-400);background:rgba(217,174,78,.14);border:1px solid rgba(217,174,78,.32);
}
.alli-ex p{margin:0;font-size:15px;line-height:1.9;color:#c7d0dc}
.alli-ex p b{color:#fff;font-weight:800}
.alli-ex p em{color:var(--gold-400);font-style:normal;font-weight:800}

/* 年度活動 */
.alli-acts{margin:26px 0 0;text-align:center}
.alli-acts .aa-head{
  font-size:13.5px;font-weight:800;letter-spacing:.04em;color:var(--ink-400);margin-bottom:14px;
}
.alli-acts .aa-chips{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}
.alli-acts .aa-chip{
  padding:10px 20px;border-radius:999px;
  background:var(--paper);border:1px solid var(--line-strong);
  font-size:14.5px;font-weight:700;color:var(--ink-700);
  transition:border-color .2s,color .2s,background .2s;
}
.alli-acts .aa-chip:hover{border-color:var(--gold-500);color:var(--gold-600);background:#fdf7ea}
@media(max-width:560px){
  .alli-ex{padding:20px}
  .alli-acts .aa-chip{padding:9px 15px;font-size:13.5px}
}

/* 對照表收尾：把型錄那一塊接回聯盟 */
.cmp-punch .cp-half{
  display:block;margin-top:14px;padding-top:14px;
  border-top:1px solid rgba(255,255,255,.14);
  font-size:14px;line-height:1.8;color:#9fabbd;
}
.cmp-punch .cp-half a{color:var(--gold-400);font-weight:800;text-decoration:underline;text-underline-offset:3px}
.cmp-punch .cp-half a:hover{color:#f0c96f}

/* ── [7] 政府補助橫幅 ────────────────────────────────────────────── */
.gov-band{
  margin:24px 0 0;padding:22px 26px;
  display:flex;align-items:center;gap:20px;flex-wrap:wrap;
  background:linear-gradient(100deg,#fdf7ea,#fffdf8);
  border:1px solid rgba(169,119,43,.26);border-left:4px solid var(--gold-500);
  border-radius:14px;
}
.gov-band .gb-ic{
  flex:none;width:52px;height:52px;border-radius:13px;
  display:grid;place-items:center;background:#fff;color:var(--gold-600);
  box-shadow:0 4px 14px rgba(169,119,43,.16);
}
.gov-band .gb-txt{flex:1 1 320px;min-width:0}
.gov-band .gb-txt b{
  display:block;font-size:clamp(17px,2vw,20px);font-weight:900;
  color:var(--ink-900);margin-bottom:5px;
}
.gov-band .gb-txt p{
  margin:0;font-size:14px;line-height:1.8;color:var(--ink-700);
}
.gov-band .btn2{flex:none}
@media(max-width:640px){
  .gov-band{padding:20px;gap:14px}
  .gov-band .btn2{width:100%;justify-content:center}
}

/* ── [6] 流程卡：次要文字連結 ────────────────────────────────────── */
.proc-alt{
  display:block;margin-top:12px;text-align:center;
  font-size:13.5px;font-weight:700;color:var(--ink-300);
  text-decoration:underline;text-underline-offset:3px;transition:color .2s;
}
.proc-alt:hover{color:var(--gold-400)}

/* ── [9]/bug2 Sticky CTA：雙按鈕 ─────────────────────────────────── */
.cta2-btns{display:flex;align-items:center;gap:10px;flex:none}
.cta2-btns .btn2.ghost.on-ink{
  --fg:#eaf0f7;background:transparent;border-color:rgba(255,255,255,.34);box-shadow:none;
}
.cta2-btns .btn2.ghost.on-ink:hover{
  background:rgba(255,255,255,.1);border-color:var(--gold-400);--fg:#fff;transform:translateY(-2px);
}
/* 手機改成上下堆疊，兩顆按鈕各半，LINE 入口在小螢幕也要留著 */
@media(max-width:600px){
  .cta2-in{flex-direction:column;align-items:stretch;gap:10px;padding:12px 14px}
  .cta2-txt b{font-size:15px;line-height:1.4}
  .cta2-btns{width:100%;gap:8px}
  .cta2-btns .btn2{
    flex:1 1 0;min-width:0;justify-content:center;text-align:center;
    padding-left:10px;padding-right:10px;font-size:14px;white-space:nowrap;
  }
}
