/* ==========================================================================
   bespoke.css — 作り込み3ページ（カウンセラー紹介 / 料金プラン / 入会までの流れ）の追加分（見本 v1）
   - std.css の後に読む。すべて body.page-std に閉じ込める。
   - 部品の質感は styles.css の .lp-*（lp-stats / lp-tile / lp-price / lp-refund / lp-cn / lp-steps / lp-final / hero__badge）から流用。
   - std.css のリスト既定は :where() で詳細度を下げてあるので、ここの同じ詳細度の指定が後勝ちで効く。
   ========================================================================== */

/* ---------- 共通：線画アイコン（.lp-ico と同じ） ---------- */
body.page-std .std-ico {
  width: 40px; height: 40px; flex: none;
  fill: none; stroke: var(--gold-deep); stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round;
}

/* ---------- 共通：全幅の navy 帯（.lp-final と同じ） ---------- */
body.page-std .std-band {
  position: relative;
  background: var(--navy);
  color: #fff;
  text-align: center;
  box-shadow: 0 0 0 100vmax var(--navy);
  clip-path: inset(0 -100vmax);
}
/* 帯が2枚続くときは、境目（2枚目の上辺）に金の細線を引く。本文幅だけに引く（全幅の擬似要素は横スクロールの原因になるので使わない） */
body.page-std .std-band + .std-band {
  background:
    linear-gradient(rgba(217, 179, 101, 0.4), rgba(217, 179, 101, 0.4)) top left / 100% 1px no-repeat,
    var(--navy);
}
/* 帯で終わるページは、本文下の余白とフッター上の余白をなくす */
body.page-std .site-main:has(.std-band:last-of-type) { padding-bottom: 0; }
body.page-std:has(.std-band:last-of-type) .site-footer { border-top: 0; }

/* ---------- No.1 バッジの帯（トップのヒーローと同じバッジ＋注釈） ---------- */
body.page-std .std-no1 {
  margin-top: 3.4em;
  padding: 52px 0 40px;
  font-family: var(--serif);
  line-break: strict;
  overflow-wrap: anywhere;
}
body.page-std .std-no1 .hero__badge { justify-content: center; }
/* 月桂樹のグラデーション id は、他の SVG（トップの id="lg"）と重ならないよう std-no1-lg にしてある。styles.css は url(#lg) を参照しているので、ここで参照先を差し替える */
body.page-std .std-no1 .hero__laurel-leaves { fill: url(#std-no1-lg); }
body.page-std .std-no1 .hero__laurel-stem { stroke: url(#std-no1-lg); }
body.page-std .std-no1__notes {
  max-width: 46em;
  margin: 24px auto 0;
  font-family: var(--font-sans);
  font-size: 0.6875rem;     /* 11px（.hero__notes と同じ） */
  line-height: 1.8;
  letter-spacing: 0.02em;
  color: rgba(255, 255, 255, 0.8);
  text-align: center;
}
body.page-std .std-no1__notes p { margin: 0 0 0.35em; }
body.page-std .std-no1__notes p:last-child { margin-bottom: 0; }

/* ---------- 最後の navy CTA 帯（.lp-final と同じ） ---------- */
body.page-std .std-final { padding: 64px 0 72px; }
body.page-std .std-final--btn-only { padding: 44px 0 56px; }
body.page-std .site-main .std-final h2 {
  margin: 0 0 0.4em;
  padding: 0;
  border: 0;
  font-size: 1.6rem;
  line-height: 1.5;
  text-align: center;
  color: #fff;
}
body.page-std .site-main .std-final h2::after { display: none; }
body.page-std .site-main .std-final p { margin: 0; color: #fff; }
body.page-std .site-main .std-final p:has(> .cta-button) { margin-top: 1.6em; }
body.page-std .site-main .std-final--btn-only p:has(> .cta-button) { margin-top: 0; }
body.page-std .site-main .std-final .cta-button { box-shadow: 0 4px 14px rgba(0, 0, 0, 0.3); }

/* ==========================================================================
   A. カウンセラー紹介
   ========================================================================== */
/* プロフィールカード（lp-cn の質感。PC 2カラム／SP 縦積み） */
body.page-std .std-cn {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
  align-items: center;
  gap: 1.8em;
  margin: 0 0 1.4em;
  padding: 1.1em 1.4em 1.1em 1.1em;
  background: #fcfbf7;
  border: 1px solid var(--line);
  border-radius: var(--card-r);
  box-shadow: var(--card-sh);
}
body.page-std .std-cn__ph { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; margin: 0; }
body.page-std .site-main .std-cn__name {
  margin: 0; padding: 0; border: 0;
  font-size: 1rem; line-height: 1.5; letter-spacing: 0.04em; text-align: left;
}
body.page-std .site-main .std-cn__name::after { display: none; }
body.page-std .std-cn__role {
  display: block;
  margin: 0 0 0.3em;
  font-family: var(--font-sans);
  font-size: 0.82rem; font-weight: 700; letter-spacing: 0.06em; line-height: 1.6;
  color: var(--gold-deep);
}
body.page-std .std-cn__n { font-size: 1.9rem; font-weight: 700; color: var(--navy); letter-spacing: 0.06em; }
body.page-std .std-cn__k { font-family: var(--font-sans); font-size: 0.9rem; font-weight: 400; letter-spacing: 0.04em; color: #666; white-space: nowrap; }

/* 数字のカード（lp-stats の質感。PC 4列／SP 2列） */
body.page-std .std-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.7em; margin: 0 0 2.8em; padding: 0; list-style: none; }
body.page-std .std-stats > li {
  display: flex; flex-direction: column; justify-content: space-between; align-items: center;
  gap: 0.6em; margin: 0; padding: 1.1em 0.8em 1em;
  background: #fcfbf7; border: 1px solid var(--line); border-radius: var(--card-r); box-shadow: var(--card-sh);
  text-align: center;
}
body.page-std .std-stats > li::before { display: none; }
body.page-std .std-stats__l { font-size: 0.8rem; line-height: 1.6; color: #555; text-wrap: balance; word-break: auto-phrase; }
body.page-std .std-stats__v {
  font-family: var(--serif); font-weight: 700; font-size: 1.8rem; line-height: 1.2; letter-spacing: 0.02em;
  color: var(--navy); font-variant-numeric: lining-nums tabular-nums; white-space: nowrap;
}
body.page-std .std-stats__v small { margin-left: 0.2em; font-size: 0.45em; font-weight: 700; letter-spacing: 0.04em; }
body.page-std .std-stats__v small.pre { margin: 0 0.2em 0 0; }

/* サポートの小タイル3枚（lp-tile の質感） */
body.page-std .std-tiles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.7em; margin: 0 0 1.6em; padding: 0; list-style: none; }
body.page-std .std-tiles > li {
  display: flex; flex-direction: column; align-items: center; gap: 0.45em;
  margin: 0; padding: 1.1em 0.6em 1em;
  background: #fcfbf7; border: 1px solid var(--line); border-radius: var(--card-r); box-shadow: var(--card-sh);
  text-align: center;
}
body.page-std .std-tiles > li::before { display: none; }
body.page-std .std-tiles .std-ico { width: 34px; height: 34px; }
body.page-std .std-tiles__t { font-family: var(--serif); font-weight: 700; font-size: 1rem; line-height: 1.45; letter-spacing: 0.04em; color: var(--navy); word-break: auto-phrase; text-wrap: balance; }

/* YouTube カード */
body.page-std .std-yt {
  display: flex; flex-direction: column; align-items: center; gap: 0.2em;
  padding: 1.7em 1.2em 1.8em; text-align: center;
  background: #fff; border: 1px solid var(--line); border-radius: var(--card-r); box-shadow: var(--card-sh);
}
body.page-std .std-yt .std-ico { width: 44px; height: 44px; margin-bottom: 0.3em; }
body.page-std .site-main .std-yt p { margin: 0 0 0.9em; text-wrap: balance; word-break: auto-phrase; }
body.page-std .site-main .std-yt p:last-child { margin-bottom: 0; }
/* 枠線ボタン（navy 枠・角丸 999px） */
body.page-std .site-main a.std-btn {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 48px; padding: 0.55em 1.9em;
  background: #fff; border: 1.5px solid var(--navy); border-radius: 999px;
  color: var(--navy); font-weight: 700; font-size: 0.98rem; line-height: 1.4; letter-spacing: 0.04em;
}
body.page-std .site-main a.std-btn:hover { background: var(--cream); opacity: 1; }

/* ==========================================================================
   B. 料金プラン
   =========================================================================== */
/* 料金カード4枚（.lp-price と同じ。PC 4列／SP 2列） */
body.page-std .std-price { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.7em; margin: 0 0 1em; padding: 0; list-style: none; }
body.page-std .std-price > li {
  display: flex; flex-direction: column; gap: 0.25em; margin: 0; padding: 1.2em 0.6em;
  background: #fff; border: 1px solid var(--line); border-radius: var(--card-r); box-shadow: var(--card-sh);
  text-align: center;
}
body.page-std .std-price > li::before { display: none; }
body.page-std .std-price__l { font-size: 0.85rem; line-height: 1.6; color: #555; }
body.page-std .std-price__l sup { margin-left: 0.15em; font-size: 0.72em; line-height: 0; vertical-align: super; color: var(--gold-deep); font-weight: 700; }
body.page-std .std-price__v {
  font-family: var(--serif); font-weight: 700; font-size: 1.7rem; line-height: 1.2; letter-spacing: 0.02em;
  color: var(--navy); font-variant-numeric: lining-nums tabular-nums; white-space: nowrap;
}
body.page-std .std-price__v small { margin-left: 0.2em; font-size: 0.45em; font-weight: 700; letter-spacing: 0.04em; }
body.page-std .std-price + p { margin: 0 0 0.4em; font-size: 0.8rem; line-height: 1.7; color: #666; text-align: center; }

/* 内訳の3枚カード（PC 3列／SP 1列） */
body.page-std .std-cards3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1em; margin: 2.2em 0 0; align-items: stretch; }
body.page-std .std-card {
  min-width: 0; padding: 1.3em 1.35em 0.9em;
  background: #fcfbf7; border: 1px solid var(--line); border-radius: var(--card-r); box-shadow: var(--card-sh);
}
body.page-std .site-main .std-card h3 {
  margin: 0 0 0.9em; padding-bottom: 0.6em; border-bottom: 1px solid var(--line);
  font-family: var(--serif); font-size: 1.05rem; line-height: 1.5; letter-spacing: 0.04em;
}
body.page-std .site-main .std-card h3::before { display: none; }
body.page-std .std-card ul { margin: 0; font-size: 0.92rem; line-height: 1.75; }
body.page-std .std-card ul > li { margin-bottom: 0.5em; }
body.page-std .std-card ul > li::before { top: calc(0.875em - 2.5px); }
/* 入れ子の菱形は中抜きの小さな菱形に */
body.page-std .std-card ul ul { margin: 0.4em 0 0.2em; }
body.page-std .std-card ul ul > li::before { background: transparent; border: 1px solid var(--gold-deep); width: 4px; height: 4px; top: calc(0.875em - 2.5px); }

/* 必要書類の2枚パネル（PC 2列） */
body.page-std .std-panels2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1em; margin: 1em 0 0; align-items: stretch; }
body.page-std .site-main .std-panels2 .panel { margin: 0; }
body.page-std .std-panels2 .panel > p {
  margin: 0 0 0.8em; padding-bottom: 0.6em; border-bottom: 1px solid var(--line); line-height: 1.7;
}
body.page-std .std-panels2 .panel ul { font-size: 0.95rem; line-height: 1.8; }

/* 全額返金（.lp-refund の質感。navy 地・上辺 4px gold・白文字） */
body.page-std .std-refund {
  margin: 2.4em 0 0; padding: 1.8em 1.6em 1.7em;
  background: var(--navy); color: #fff;
  border-top: 4px solid var(--gold); border-radius: var(--card-r);
}
body.page-std .std-refund .std-ico { display: block; margin: 0 auto 0.5em; stroke: var(--gold); }
body.page-std .site-main .std-refund h3 {
  margin: 0 0 0.9em;
  font-family: var(--serif); font-weight: 800; font-size: 2.2rem; line-height: 1.3; letter-spacing: 0.08em;
  color: #fff; text-align: center;
}
body.page-std .site-main .std-refund h3::before { display: none; }
body.page-std .site-main .std-refund > ul { max-width: 40em; margin: 0 auto; font-size: 0.95rem; line-height: 1.85; color: #fff; }
body.page-std .std-refund > ul > li::before { background: var(--gold); }
body.page-std .site-main .std-refund > p { max-width: 40em; margin: 1.5em auto 0.7em; font-weight: 700; color: var(--gold); }
body.page-std .std-refund__cond {
  max-width: 40em; margin: 0 auto; padding: 1.2em 1.4em 0.8em;
  background: #fff; color: var(--std-text); border-radius: var(--card-r);
}
body.page-std .std-refund__cond ul { margin: 0; font-size: 0.92rem; line-height: 1.8; }

/* ==========================================================================
   C. 入会までの流れ（縦のタイムライン。.lp-steps と同じ金の縦線）
   ========================================================================== */
body.page-std .std-steps { counter-reset: step; list-style: none; margin: 0; padding: 0; }
body.page-std .std-steps > li.std-step {
  counter-increment: step;
  position: relative;
  display: flex; align-items: flex-start; gap: 1.1em;
  margin: 0 0 1.3em; padding: 0;
}
body.page-std .std-steps > li.std-step:last-child { margin-bottom: 0; }
/* 金の縦線：丸の下から次の丸の上まで */
body.page-std .std-steps > li.std-step:not(:last-child)::after {
  content: "";
  position: absolute; left: 19.5px; top: 46px; bottom: -1.3em; width: 1px; background: var(--gold);
}
/* 丸：直径 40px・白地・金枠・明朝 gold-deep の番号（番号は CSS カウンタで出す＝本文の文字は増やさない） */
body.page-std .std-step__n {
  position: relative; z-index: 1;
  display: grid; place-items: center; flex: none;
  width: 40px; height: 40px;
  background: #fff; border: 1px solid var(--gold-deep); border-radius: 50%;
  font-family: var(--serif); font-weight: 700; font-size: 1.05rem; line-height: 1; letter-spacing: 0;
  color: var(--gold-deep); font-variant-numeric: lining-nums tabular-nums;
}
body.page-std .std-step__n::before { content: counter(step); }
body.page-std .std-step__card {
  flex: 1 1 auto; min-width: 0; padding: 1.15em 1.4em 1em;
  background: #fff; border: 1px solid var(--line); border-radius: var(--card-r); box-shadow: var(--card-sh);
}
body.page-std .std-step__card > :last-child { margin-bottom: 0; }
body.page-std .site-main .std-step__card h3 {
  margin: 0 0 0.6em; font-family: var(--serif); font-size: 1.12rem; line-height: 1.55; letter-spacing: 0.04em;
}
body.page-std .site-main .std-step__card h3::before { display: none; }
body.page-std .std-step__lb {
  display: inline-block; font-family: var(--font-sans); font-size: 0.72rem; font-weight: 700; letter-spacing: 0.14em;
  color: var(--gold-deep); vertical-align: 0.12em;
}
body.page-std .std-step__card ul { font-size: 0.95rem; line-height: 1.8; }
body.page-std .site-main .std-step__card ul + p { margin-top: 1.2em; }

/* ===========================================================================
   スマホ（〜600px）
   ========================================================================== */
@media (max-width: 600px) {
  body.page-std .std-no1 { margin-top: 2.8em; padding: 40px 0 32px; }
  body.page-std .std-final { padding: 48px 0 56px; }
  body.page-std .std-final--btn-only { padding: 40px 0 48px; }
  body.page-std .site-main .std-final h2 { font-size: 1.4rem; }

  body.page-std .std-cn { grid-template-columns: 1fr; gap: 1em; padding: 0.9em 0.9em 1.2em; }
  body.page-std .std-cn__n { font-size: 1.75rem; }
  body.page-std .std-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.page-std .std-stats__v { font-size: 1.6rem; }
  body.page-std .std-tiles { gap: 0.5em; }
  body.page-std .std-tiles > li { padding: 0.95em 0.3em 0.85em; }
  body.page-std .std-tiles__t { font-size: 0.86rem; }

  body.page-std .std-price { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.page-std .std-price__v { font-size: 1.55rem; }
  body.page-std .std-cards3 { grid-template-columns: minmax(0, 1fr); }
  body.page-std .std-panels2 { grid-template-columns: minmax(0, 1fr); }
  body.page-std .std-refund { padding: 1.5em 1.1em 1.4em; }
  body.page-std .site-main .std-refund h3 { font-size: 1.9rem; }
  body.page-std .std-refund__cond { padding: 1em 1.1em 0.6em; }

  body.page-std .std-steps > li.std-step { gap: 0.8em; }
  body.page-std .std-step__card { padding: 1em 1.05em 0.9em; }
}
