/* ============================================================
 * cv_improvements_v14.css
 * 2026/05/15 — 価格訴求強化 + CTA文言ソフト化 + デッドクリック救出 v2
 *
 * 背景 (前日 daily_report_2026-05-14 / tldv 2026-05-12 / 2026-03-26 ハイライト):
 *   ・モーダル open 80 → form_start 1 (1.25%) の二段目ファネル断絶
 *     → 5/14 で 2FA 撤廃済み。次手は「価格お得感」と「CTAコピー柔らかさ」
 *   ・Clarity デッドクリック上位5件のうち 3件 が h2 / hero テキスト
 *     → v11 でラップ済みだが「eスポーツ ▫▫▫▫-▫▫-▫▫」(298件) が新規上位
 *   ・KPI: CVR 10% (現在 0.066%) — 値引き訴求 + CTA文言で 2-3pt の上振れを狙う
 *
 * 方針:
 *   A. モーダル内プラン選択に "通常価格 → GW特価" の打ち消し線パターンを追加
 *   B. 「購入を確定する」 → 「次へ進む（注文内容の確認）」 の柔らかいコピーへ
 *      （tldv 3/26: 「今すぐ購入は買わされる感、次へ進むの方が誘導しやすい」）
 *   C. eスポーツ日付見出し系のデッドクリック救出（料金プランへの a 化）
 *   D. モバイル スティッキー CTA バーの視認性向上 (font-size +1px / contrast↑)
 *
 * 影響範囲: webroot_lp.xhtml (control), Norton / VB レイアウト全てに薄く適用
 *           data-lp-layout 属性に依存しないため後方互換
 * ============================================================ */

/* === A. モーダルプラン選択 === */
.modal-product-item .modal-product-price-original {
  display: inline-block;
  margin-right: 6px;
  color: #94a3b8;
  font-size: 0.85em;
  text-decoration: line-through;
  font-weight: 500;
}
.modal-product-item .modal-product-savings {
  display: inline-block;
  margin-left: 6px;
  padding: 2px 6px;
  background: linear-gradient(135deg, #ff6b35 0%, #ff3b6b 100%);
  color: #fff;
  font-size: 0.7em;
  font-weight: 700;
  border-radius: 4px;
  vertical-align: middle;
}
.modal-product-item .modal-product-price {
  font-weight: 800;
}
.modal-product-item .modal-product-price strong {
  color: #ff3b6b;
  font-size: 1.05em;
}

/* === B. モーダル CTA 文言ソフト化 (テキストは JS で差し替え)、
       ボタン自体の視認性を上げる === */
#modal-btn-purchase {
  font-size: 17px !important;
  letter-spacing: 0.02em;
  padding-top: 14px !important;
  padding-bottom: 14px !important;
  background: linear-gradient(135deg, #16a34a 0%, #15803d 100%) !important;
  box-shadow: 0 4px 14px rgba(22,163,74,0.35);
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}
#modal-btn-purchase:not(:disabled):hover,
#modal-btn-purchase:not(:disabled):focus {
  transform: translateY(-1px);
  box-shadow: 0 6px 18px rgba(22,163,74,0.45);
}
#modal-btn-purchase:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}
/* 安心感メッセージをボタン直下に出すスペース */
.modal-btn--reassure-text {
  display: block;
  margin-top: 8px;
  font-size: 12px;
  color: #475569;
  text-align: center;
  line-height: 1.5;
}
.modal-btn--reassure-text .strong {
  color: #16a34a;
  font-weight: 700;
}

/* === C. eスポーツ section / 日付見出しのリンク化救出 === */
a.dead-click-rescue-v14 {
  color: inherit;
  text-decoration: none;
  display: block;
}
a.dead-click-rescue-v14:hover,
a.dead-click-rescue-v14:focus {
  color: inherit;
  text-decoration: none;
  opacity: 0.95;
}

/* === D. モバイル fixed-cta 視認性 (overlap protection) === */
@media (max-width: 767px) {
  .fixed-cta {
    box-shadow: 0 -8px 24px rgba(0, 0, 0, 0.15) !important;
  }
  .fixed-cta__btn {
    font-size: 15px !important;
    line-height: 1.3 !important;
    padding: 12px 6px !important;
    min-height: 48px;
    display: -webkit-flex !important;
    display: flex !important;
    -webkit-align-items: center !important;
    align-items: center !important;
    -webkit-justify-content: center !important;
    justify-content: center !important;
  }
  .fixed-cta__btn--trial {
    background: linear-gradient(135deg, #ff6b35 0%, #ff3b6b 100%) !important;
    color: #fff !important;
  }
  /* スマホでモーダル CTA をフルワイドに、購入確認は固定下端 */
  .modal-section--submit {
    padding-bottom: calc(env(safe-area-inset-bottom, 0px) + 12px);
  }
}

/* === E. Plan / Pricing カード "OFF" バッジ === */
.lp-plan-savings-badge {
  display: inline-block;
  margin-left: 8px;
  padding: 3px 8px;
  background: #fef3c7;
  color: #b45309;
  font-size: 11px;
  font-weight: 700;
  border-radius: 999px;
  vertical-align: middle;
}