/* =====================================================
   店舗ページの上書きテーマ（江坂・庄内・曽根城山の3店舗で共通）
   - 文章・構成は変えず、色と形だけを少し上書きするレイヤー
   - 方針：書体・見出しは元の明朝ベースのまま。
           差し色をボルドーから金色にし、カード・ボタン・タグを少しだけ軽く
   - 各店舗の既存CSS（store/lp.css, store/esaka/style.css）の後に読み込む
   ===================================================== */

:root{
  --paper-2: #faf8f3;
  --paper-3: #f1ebde;
  --bordeaux: #a8842a;        /* 差し色：ボルドー → 濃い金 */
  --bordeaux-deep: #8a6b1e;
  --rule: #ebe5d8;
  --rule-strong: #ddd3bf;
  --radius: 8px;
  --card-shadow: 0 6px 20px rgba(40, 32, 12, .05);
  --gold: #c9a84c;
  --gold-deep: #a8842a;
}

/* ---- 見出しのローマ数字を、うっすら金色に ---- */
.chapter-num{ color:rgba(201, 168, 76, .35) !important; }

/* ---- タグ ---- */
.pill{
  border-radius:4px !important;
  background:var(--gold) !important;
  border-color:var(--gold) !important;
  color:#fff !important;
}
.pill.is-quiet, .tag{
  border-radius:4px !important;
  background:#fff !important;
  border-color:var(--rule-strong) !important;
  color:var(--ink-soft) !important;
}

/* ---- ボタン ---- */
.btn-primary, .plan-cta, .btn-line{
  border-radius:6px !important;
  transition:transform .2s ease, box-shadow .2s ease, background-color .2s ease !important;
}
.btn-primary{
  background:var(--gold) !important;
  border-color:var(--gold) !important;
  color:#fff !important;
  box-shadow:0 6px 16px rgba(168,132,42,.2);
}
.btn-primary:hover{ background:var(--gold-deep) !important; border-color:var(--gold-deep) !important; }
.btn-primary:hover, .btn-line:hover, .plan-cta:hover{ transform:translateY(-1px); }

/* ---- ページ内リンク ---- */
.jump a{ border-radius:4px !important; }
.jump a:hover{ border-color:var(--gold) !important; color:var(--gold-deep) !important; }

/* ---- チェックリスト：細い枠のカードに ---- */
.need-grid{ border:none !important; gap:10px !important; }
.need-grid li, .problem-cell{
  border:1px solid var(--rule) !important;
  border-radius:var(--radius);
  background:#fff;
}
.need-grid li::before{ color:var(--gold) !important; }

/* ---- カード類：控えめな角丸と影 ---- */
.course, .goal-cell, .plan, .flow-step, .reason-lead-fig, .reason-fig, .gallery-item, .info-row, .notice{
  border-radius:var(--radius);
}
.course, .goal-cell, .plan{
  background:#fff;
  border-color:var(--rule) !important;
  box-shadow:var(--card-shadow);
}
.reason-row img, .gallery-item img, .hero-figure img, .course img{ border-radius:var(--radius); }

/* ---- よくある質問：カテゴリ分け ---- */
.faq-cats{ display:flex; flex-wrap:wrap; gap:8px; margin:0 0 36px; }
.faq-cats__item{
  display:inline-flex; align-items:center; gap:8px;
  padding:8px 14px;
  border:1px solid var(--rule-strong);
  border-radius:4px;
  background:#fff;
  font-size:.86rem;
  letter-spacing:.06em;
  text-decoration:none;
  color:var(--ink-soft);
  transition:border-color .2s ease, color .2s ease;
}
.faq-cats__item span{ font-size:.75rem; color:var(--gold-deep); }
.faq-cats__item:hover{ border-color:var(--gold); color:var(--gold-deep); }
.faq-group{ scroll-margin-top:90px; }
.faq-group + .faq-group{ margin-top:44px; }
.faq-group__title{
  display:flex; align-items:center; gap:12px;
  margin:0 0 14px;
  font-size:1.05rem;
  font-weight:600;
  letter-spacing:.08em;
}
.faq-group__title::before{
  content:""; width:18px; height:2px; background:var(--gold);
}
/* 長い回答がスマホで途中で切れないように（元は max-height:400px） */
.faq-item.open .faq-a{ max-height:1600px !important; }

/* ---- お客様の声は枠なしの引用スタイル（esaka/lp.css 側の指定を通す） ---- */
#voices .problem-grid .problem-cell, #results .problem-grid .problem-cell{
  border:0 !important; border-left:1px solid var(--rule) !important; border-radius:0; background:transparent;
}
#voices .problem-grid .problem-cell:first-child, #results .problem-grid .problem-cell:first-child{ border-left:0 !important; }
@media (max-width:760px){
  #voices .problem-grid .problem-cell, #results .problem-grid .problem-cell{ border-left:0 !important; border-top:1px solid var(--rule) !important; }
  #voices .problem-grid .problem-cell:first-child, #results .problem-grid .problem-cell:first-child{ border-top:0 !important; }
}