@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;700&display=swap');

/* =========================================================================
 * L-VOICE — 「上品ダーク × ネオン音波」テーマ（Bootstrap 5 へのオーバーライド）
 *   深紫黒のヘッダー/ヒーロー＋明るく読みやすい本文＋バイオレット→ピンクのアクセント。
 * ========================================================================= */
:root{
  --lv-dark:#15131f;
  --lv-dark-2:#211d33;
  --lv-ink:#2b2733;
  --lv-violet:#a855f7;
  --lv-pink:#ec4899;
  --lv-grad:linear-gradient(135deg,#a855f7 0%,#ec4899 100%);
  --lv-grad-soft:linear-gradient(135deg,rgba(168,85,247,.13),rgba(236,72,153,.13));
}

body{
  font-family:"Noto Sans JP",-apple-system,"Segoe UI","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;
  color:var(--lv-ink);
  background:#f7f6fb;
}

/* ---- navbar（全ページ・深紫黒＋グラデの下線） ---- */
.navbar.bg-dark{ background:var(--lv-dark)!important; border-bottom:2px solid transparent; border-image:var(--lv-grad) 1; }
.navbar-brand .fw-bold{
  background:var(--lv-grad); -webkit-background-clip:text; background-clip:text; color:transparent;
  letter-spacing:.06em; font-weight:700;
}
.navbar-brand i{ color:var(--lv-pink)!important; }

/* ---- hero（トップ・ダークグラデ＋音波の装飾） ---- */
.lv-hero{
  position:relative; overflow:hidden;
  background:radial-gradient(130% 150% at 12% 0%, #2c2547 0%, var(--lv-dark) 62%);
  color:#f3f0fb; border-bottom:1px solid rgba(255,255,255,.08);
}
.lv-hero h1{ color:#fff; font-weight:700; position:relative; z-index:1; }
.lv-hero h1 i{ color:var(--lv-pink)!important; }
.lv-hero p{ position:relative; z-index:1; }
.lv-hero .text-muted{ color:#d9cffb!important; font-weight:500; }
.lv-hero .text-secondary,.lv-hero .small{ color:#a99fc7!important; }
.lv-hero strong{ color:#fff; }
.lv-hero::after{
  content:""; position:absolute; right:0; bottom:0; top:0; width:60%;
  background:repeating-linear-gradient(90deg, rgba(168,85,247,0) 0 7px, rgba(168,85,247,.12) 7px 10px);
  -webkit-mask:linear-gradient(90deg,transparent,#000 85%); mask:linear-gradient(90deg,transparent,#000 85%);
  pointer-events:none;
}

/* ---- セクション見出し ---- */
.section-head{ border-left:4px solid transparent; border-image:var(--lv-grad) 1; padding-left:.6rem; font-weight:700; }

/* ---- 作品カード ---- */
.discovery-card{ transition:transform .15s ease, box-shadow .15s ease; border-radius:.7rem; overflow:hidden; }
.discovery-card:hover{ transform:translateY(-4px); box-shadow:0 .6rem 1.5rem rgba(168,85,247,.24)!important; }

/* 隠れ度バッジ（グラデのピル） */
.badge.lv-gap{ background:var(--lv-grad); color:#fff; border:0; font-weight:600; }
.badge.lv-gap .opacity-75{ color:rgba(255,255,255,.82); }

/* ランク/件数バッジ（薄バイオレット＋濃文字で可読） */
.badge.bg-info{ background:#ead9ff!important; color:#6b21a8!important; }

/* 試聴ボタン（重要CTA＝アクセントグラデ）。.btn.js- で Bootstrap の outline を上書き */
.btn.js-voice-sample{ background:var(--lv-grad-soft); border:1px solid rgba(168,85,247,.55); color:#7c2bd6; font-weight:600; }
.btn.js-voice-sample:hover{ background:var(--lv-grad); border-color:transparent; color:#fff; }
.btn.js-voice-sample.btn-primary{ background:var(--lv-grad); border-color:transparent; color:#fff; }

/* FANZAボタン */
.discovery-card .btn-outline-danger{ font-weight:600; }

/* ---- ハブ一覧カード ---- */
.hub-card{ transition:background-color .12s ease, box-shadow .12s ease, transform .12s ease; border-radius:.6rem; }
.hub-card:hover{ background:var(--lv-grad-soft); box-shadow:0 .3rem .9rem rgba(168,85,247,.16); transform:translateY(-2px); }

/* ---- ハブ解説文 ---- */
.hub-lead{ font-size:.94rem; line-height:1.85; color:#4a4658; }

/* ---- リンク ---- */
a{ color:#9333ea; }
a:hover{ color:#c026d3; }

/* ---- ページネーション ---- */
.pagination .page-link{ color:#9333ea; }
.pagination .page-item.active .page-link{ background:var(--lv-violet); border-color:var(--lv-violet); }

/* ---- フッター ---- */
footer.bg-dark{ background:var(--lv-dark)!important; }