commit d6e6729
相談のページのデザインを導入比較ガイドにそろえ、3つ目の根拠を1年の記録へ

- 色・文字（Manrope＋Noto Sans JP の 900）・番号の見出し（白抜きの 01〜03）・数字の強調（.facts3）・白／薄い灰色／黒の帯・角のないボタンを、/gpu-buy-or-rent と同じ値にした。差し色の橙（実際に払った分専用）は使わない
- 3つ目の根拠を「店員が直す時間」から「1年分の作業ログ 379本」（/one-year へ）に替えた
- 見出しの1行目が「フィジカルAI／の導入を、」で折れないよう、大きさを下げた

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01LevEXSYG9NkMRzRGxEeaqX


diff --git a/src/pages/consult.astro b/src/pages/consult.astro
index 031fd06..07b23e1 100644
--- a/src/pages/consult.astro
+++ b/src/pages/consult.astro
@@ -3,6 +3,7 @@
 // 決めたこと（エイイチ 2026-10-28）：打ち合わせは週1回・訪問は月1回くらい（全国どこでも。交通費・宿泊費は別）・
 // 料金はページに出さず相談で決める・最初の相談はオンライン30分まで無料、それ以降は有料
 // 最初の画面は案A（一緒にやることが主役）。新しい肩書き・キャッチコピーは付けない（MASTER の枝概念の追加禁止）
+// デザインは導入比較ガイド（/gpu-buy-or-rent）にそろえる（色・文字・番号の見出し・数字の強調・帯）。写真や絵は使わない（2026-10-28）
 // 入口（MASTER v2.1・2026-10-28）：フッター（相談について）・研究の記録の末尾（フィジカルAI研究室・導入シミュレーション）・/llms.txt。
 // トップの画面の中と SNS の投稿には出さない（SNS はプロフィール欄にだけリンクを置く）
 import Base from '../layouts/Base.astro';
@@ -16,108 +17,162 @@ const jsonLd = [{
 }];
 ---
 <Base title={`${title} | Pixels to Motors`} description={description} path="/consult" jsonLd={jsonLd}>
+  <link slot="head" rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&family=Noto+Sans+JP:wght@400;500;700;900&display=swap" />
   <div class="cs">
-    <section class="fv">
-      <div class="in fv-in">
-        <div class="txt">
-          <p class="who">フィジカルAI・ロボットの導入を進める企業の方へ</p>
-          <h1>フィジカルAIの導入を、<br>一緒に手を動かして<br>進めます</h1>
-          <p class="lead">ロボットに何を任せ、どこを人が持つか。学習環境の立ち上げから、現場で回る運用の落とし所まで、週1回の打ち合わせと月1回の訪問で一緒に進めます。</p>
-          <a class="cta" href={CTA} data-ev="無料で相談する（最初の画面）">無料で相談する（30分）<i class="ms" aria-hidden="true">arrow_forward</i></a>
+    <section class="fv" aria-labelledby="fv-h">
+      <div class="fv-in">
+        <div class="fv-text">
+          <p class="who">フィジカル<span class="lat">AI</span>・ロボットの導入を進める、<br>企業の担当者・研究開発チーム向け</p>
+          <h1 id="fv-h">フィジカル<span class="lat">AI</span>の導入を、<br>一緒に手を動かして<br>進めます</h1>
+          <p class="fv-lead"><b>ロボットに何を任せ、どこを人が持つか。</b>学習環境の立ち上げから、現場で回る運用の落とし所まで、週1回の打ち合わせと月1回の訪問で一緒に進めます。</p>
+          <div><a class="btn dark" href={CTA} data-ev="無料で相談する（最初の画面）">無料で相談する（30分）<i class="ms" aria-hidden="true">arrow_forward</i></a></div>
         </div>
-        <ol class="do">
-          <li><b>01</b><span><strong>ロボット学習の環境を立ち上げる</strong>借りて測り、買うかどうかを決めるところまで</span></li>
-          <li><b>02</b><span><strong>サービスロボットを入れる前に確かめる</strong>店の形・台数・回し方をシミュレーションで比べる</span></li>
-          <li><b>03</b><span><strong>現場で回る運用を決める</strong>止まり方と人の手間を実物から読み、運用で解く</span></li>
+        <ol class="do" aria-label="一緒にやること">
+          <li><span class="do-n">01</span><div><h2>ロボット学習の環境を立ち上げる</h2><p>借りて測り、買うかどうかを決めるところまで</p></div></li>
+          <li><span class="do-n">02</span><div><h2>サービスロボットを入れる前に確かめる</h2><p>店の形・台数・回し方をシミュレーションで比べる</p></div></li>
+          <li><span class="do-n">03</span><div><h2>現場で回る運用を決める</h2><p>止まり方と人の手間を実物から読み、運用で解く</p></div></li>
         </ol>
       </div>
     </section>
 
-    <section class="proof">
-      <div class="in">
-        <h2>どれも、自分で手を動かして確かめてきたことです</h2>
-        <div class="nums">
-          <a href="/gpu-buy-or-rent" data-ev="根拠：導入比較ガイド"><b>4,677<small>円</small></b><span>ロボットAIの学習を、クラウドで7回回した実費。買うか借りるかの判断まで公開しています</span><em>導入比較ガイドを見る<i class="ms" aria-hidden="true">arrow_forward</i></em></a>
-          <a href="/serving-robot-one-less-staff" data-ev="根拠：配膳ロボットの試算"><b>19<small>本</small></b><span>配膳ロボットの導入シミュレーションの記録。店の図面と人数から、何人で回るかを出します</span><em>導入前の試算を見る<i class="ms" aria-hidden="true">arrow_forward</i></em></a>
-          <a href="/record/serving-robot-video-ledger" data-ev="根拠：現場の観察"><b>5<small>秒</small></b><span>止まった配膳ロボットを店員が直す時間。長いのは、店員が来るまでのほうでした</span><em>現場の観察の記録を見る<i class="ms" aria-hidden="true">arrow_forward</i></em></a>
+    <section class="band-white" aria-labelledby="proof-h">
+      <div class="wrap">
+        <div class="sec-head"><span class="sec-no" aria-hidden="true">01</span><h2 id="proof-h">どれも、自分で手を動かして<br>確かめてきたこと</h2></div>
+        <div class="facts3">
+          <a class="fact" href="/gpu-buy-or-rent" data-ev="根拠：導入比較ガイド">
+            <b class="fact-n">4,677<small>円</small></b>
+            <h3>ロボット<span class="lat">AI</span>の学習を、<br>クラウドで7回回した実費</h3>
+            <p>借りて測り、買うか借りるかの判断まで公開しています。</p>
+            <span class="more">導入比較ガイドを見る<i class="ms" aria-hidden="true">arrow_forward</i></span>
+          </a>
+          <a class="fact" href="/serving-robot-one-less-staff" data-ev="根拠：配膳ロボットの試算">
+            <b class="fact-n">19<small>本</small></b>
+            <h3>配膳ロボットの<br>導入シミュレーションの記録</h3>
+            <p>店の図面と人数から、何人で回るか・どこで止まるかを出します。</p>
+            <span class="more">導入前の試算を見る<i class="ms" aria-hidden="true">arrow_forward</i></span>
+          </a>
+          <a class="fact" href="/one-year" data-ev="根拠：1年の記録">
+            <b class="fact-n">379<small>本</small></b>
+            <h3>コードと実行ログを省かずに残した、<br><span class="lat">1</span>年分の作業ログ</h3>
+            <p><span class="lat">AI</span> に書かせ・確かめさせ・記録させる進め方が、ロボットを動かす <span class="lat">AI</span> の土台になっています。</p>
+            <span class="more">1年の記録を見る<i class="ms" aria-hidden="true">arrow_forward</i></span>
+          </a>
         </div>
       </div>
     </section>
 
-    <section class="flow">
-      <div class="in">
-        <h2>進め方</h2>
+    <section class="band-tint" aria-labelledby="flow-h">
+      <div class="wrap">
+        <div class="sec-head"><span class="sec-no" aria-hidden="true">02</span><h2 id="flow-h">進め方</h2></div>
         <ol class="steps">
-          <li><b>まず</b><strong>オンラインで30分</strong><span>無料。今の状況と、ロボットに任せたいことを伺います</span></li>
-          <li><b>次に</b><strong>1か月、小さく試す</strong><span>ここから有料です。料金は、内容を伺ってから相談して決めます</span></li>
-          <li><b>そして</b><strong>週1回の打ち合わせと<br>月1回の訪問</strong><span>訪問は全国どこでも。交通費・宿泊費は別にいただきます</span></li>
+          <li class="first"><span class="kicker">まず</span><h3>オンラインで<span class="lat">30</span>分</h3><p>無料。今の状況と、ロボットに任せたいことを伺います。</p></li>
+          <li><span class="kicker">次に</span><h3><span class="lat">1</span>か月、小さく試す</h3><p>ここから有料です。料金は、内容を伺ってから相談して決めます。</p></li>
+          <li><span class="kicker">そして</span><h3>週<span class="lat">1</span>回の打ち合わせと<br>月<span class="lat">1</span>回の訪問</h3><p>訪問は全国どこでも。交通費・宿泊費は別にいただきます。</p></li>
         </ol>
       </div>
     </section>
 
-    <section class="who-box">
-      <div class="in">
-        <h2>誰がやっているか</h2>
-        <p>島津栄一（Pixels to Motors）。29年のデザイナー経験。秋田から、ロボットの学習と推論を自分の手で回し、その記録をすべて公開しています。ロボットやフィジカルAIが、これからどこに立つのかを見極め、いま運用に耐える落とし所へ持っていくことを仕事にしています。</p>
-        <a class="cta" href={CTA} data-ev="無料で相談する（最後）">無料で相談する（30分）<i class="ms" aria-hidden="true">arrow_forward</i></a>
+    <section class="band-ink" aria-labelledby="who-h">
+      <div class="wrap">
+        <div class="sec-head"><span class="sec-no" aria-hidden="true">03</span><h2 id="who-h">誰がやっているか</h2></div>
+        <div class="who-row">
+          <p class="who-text">島津栄一（Pixels to Motors）。29年のデザイナー経験。秋田から、ロボットの学習と推論を自分の手で回し、その記録をすべて公開しています。ロボットやフィジカルAIが、これからどこに立つのかを見極め、いま運用に耐える落とし所へ持っていくことを仕事にしています。</p>
+          <div><a class="btn" href={CTA} data-ev="無料で相談する（最後）">無料で相談する（30分）<i class="ms" aria-hidden="true">arrow_forward</i></a></div>
+        </div>
       </div>
     </section>
   </div>
 </Base>
 
 <style>
-  .cs { padding-top: 64px; background: var(--bg); color: var(--ink); }
-  .in { width: 1080px; max-width: calc(100% - 48px); margin: 0 auto; }
-  .cs h2 { margin: 0 0 32px; font: 700 28px/1.5 var(--sans); }
-  .cta { display: inline-flex; align-items: center; gap: 10px; padding: 14px 24px; border-radius: 4px; background: var(--dark); color: #fff; font: 600 16px/24px 'Noto Sans JP', sans-serif; text-decoration: none; }
-  .cta .ms { font-size: 20px; transition: transform .2s ease; }
-  .cta:hover .ms { transform: translateX(3px); }
+  /* 色・文字・形は導入比較ガイド（/gpu-buy-or-rent の .gbr）と同じ値。差し色（橙）は「実際に払った分」専用なので、このページでは使わない */
+  .cs {
+    --paper: #f4f5f7; --sheet: #fff; --ink: #121418; --muted: #5c616b; --rule: #e2e4e9; --tint: #e9ebef;
+    --gut: max(16px, env(safe-area-inset-left, 0px));
+    --font: "Manrope", "Noto Sans JP", "Hiragino Sans", system-ui, sans-serif;
+    background: var(--paper); color: var(--ink); font-family: var(--font); font-size: 17px; line-height: 1.75; letter-spacing: .02em;
+    padding-top: 48px; -webkit-font-smoothing: antialiased;
+  }
+  .cs *, .cs *::before, .cs *::after { box-sizing: border-box; }
+  .cs h1, .cs h2, .cs h3 { text-wrap: balance; letter-spacing: 0; margin: 0; }
+  .cs p { margin: 0; }
+  .cs .lat { -webkit-text-stroke: .028em currentColor; paint-order: stroke fill; letter-spacing: .01em; }
+  .cs section { padding-block: 80px; }
+  .cs .wrap { max-width: calc(1080px + 2 * var(--gut)); margin: 0 auto; padding-inline: var(--gut); display: grid; gap: 40px; }
+
+  .btn { display: inline-flex; align-items: center; gap: 8px; font-weight: 700; text-decoration: none; padding: 12px 20px; border: 1.5px solid var(--ink); color: var(--ink); background: var(--sheet); font-size: .95rem; }
+  .btn.dark { background: var(--ink); border-color: var(--ink); color: #fff; }
+  .btn .ms { font-size: 18px; transition: transform .2s; }
+  .btn:hover { transform: translateY(-1px); }
+  .btn:hover .ms { transform: translateX(3px); }
+  .btn:focus-visible { outline: none; text-decoration: underline; text-underline-offset: 4px; }
+  @media (prefers-reduced-motion: reduce) { .btn:hover { transform: none; } }
 
-  .fv { min-height: calc(100vh - 64px); display: flex; align-items: center; padding: 64px 0; box-sizing: border-box; }
-  .fv-in { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 56px; align-items: center; }
-  .who { margin: 0 0 16px; font: 500 14px/22px var(--sans); color: var(--ink-2); }
-  h1 { margin: 0 0 24px; font: 700 44px/1.35 var(--sans); letter-spacing: .01em; }
-  .lead { margin: 0 0 32px; font: 400 16px/1.9 var(--sans); max-width: 30em; }
-  .do { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
-  .do li { display: grid; grid-template-columns: 48px minmax(0, 1fr); gap: 16px; align-items: start; padding: 24px; background: var(--panel); border-radius: 4px; }
-  .do b { font: 700 24px/1 var(--sans); }
-  .do strong { display: block; margin-bottom: 6px; font: 700 18px/1.5 var(--sans); }
-  .do span { font: 400 14px/1.8 var(--sans); color: var(--ink-2); }
+  /* 最初の画面 */
+  .fv { padding: 0; }
+  .fv-in { max-width: calc(1080px + 2 * var(--gut)); margin: 0 auto; padding: 72px var(--gut) 88px; display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: 56px; align-items: center; }
+  .fv-text { display: grid; gap: 20px; max-width: 33rem; }
+  .who { font-size: .9rem; font-weight: 700; line-height: 1.6; }
+  .fv h1 { font-size: clamp(1.9rem, 3.9vw, 2.9rem); line-height: 1.14; font-weight: 900; letter-spacing: -.01em; }
+  .fv-lead { font-size: 1rem; line-height: 1.85; color: #2a2d33; max-width: 30em; }
+  .fv-lead b { display: block; margin-bottom: 6px; font-size: 1.15rem; line-height: 1.6; color: var(--ink); }
+  .do { list-style: none; margin: 0; padding: 0; background: var(--sheet); border-top: 2px solid var(--ink); }
+  .do li { display: grid; grid-template-columns: 72px minmax(0, 1fr); gap: 8px; align-items: center; padding: 22px 24px 22px 20px; }
+  .do li + li { border-top: 1px solid var(--rule); }
+  .do-n { font-family: 'Manrope', sans-serif; font-weight: 800; font-size: 2.6rem; line-height: 1; color: var(--sheet); -webkit-text-stroke: 2px var(--ink); paint-order: stroke fill; letter-spacing: -.02em; }
+  .do h2 { font-size: 1.1rem; line-height: 1.5; font-weight: 700; }
+  .do p { margin-top: 4px; font-size: .88rem; color: var(--muted); line-height: 1.7; }
 
-  .proof { padding: 96px 0; background: var(--dark); color: #fff; }
-  .proof h2 { color: #fff; }
-  .nums { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
-  .nums a { display: flex; flex-direction: column; padding: 8px 32px 8px 0; color: #fff; text-decoration: none; }
-  .nums a + a { padding-left: 32px; border-left: 1px solid rgba(255,255,255,.18); }
-  .nums b { font: 700 56px/1.1 var(--sans); }
-  .nums small { font-size: 20px; font-weight: 500; margin-left: 4px; }
-  .nums span { margin: 16px 0 24px; font: 400 15px/1.8 var(--sans); color: rgba(255,255,255,.8); }
-  .nums em { margin-top: auto; display: inline-flex; align-items: center; gap: 6px; font: 600 14px/22px var(--sans); font-style: normal; text-decoration: underline; text-underline-offset: 4px; }
-  .nums em .ms { font-size: 18px; transition: transform .2s ease; }
-  .nums a:hover em .ms { transform: translateX(3px); }
+  /* 番号の見出し（導入比較ガイドの .sec-head と同じ） */
+  .sec-head { display: flex; align-items: flex-end; gap: 20px; flex-wrap: wrap; }
+  .sec-no { font-family: 'Manrope', sans-serif; font-weight: 800; font-size: clamp(3.2rem, 7vw, 5rem); line-height: .82; color: var(--paper); -webkit-text-stroke: 3px var(--ink); paint-order: stroke fill; letter-spacing: -.02em; }
+  .sec-head h2 { flex: 1 1 20rem; padding-bottom: 4px; font-size: clamp(1.75rem, 3.3vw, 2.55rem); line-height: 1.3; font-weight: 800; letter-spacing: -.005em; }
+  .band-white { background: #fff; }
+  .band-white .sec-no { color: #fff; }
+  .band-tint { background: var(--tint); }
+  .band-tint .sec-no { color: var(--tint); }
+  .band-ink { background: var(--ink); color: #e8eaf0; }
+  .band-ink h2 { color: #fff; }
+  .band-ink .sec-no { color: var(--ink); -webkit-text-stroke-color: #fff; }
 
-  .flow { padding: 96px 0; }
-  .steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
-  .steps li { padding: 28px 24px; background: var(--panel); border-radius: 4px; }
-  .steps b { display: block; margin-bottom: 12px; font: 600 13px/20px var(--sans); color: var(--ink-3); }
-  .steps strong { display: block; margin-bottom: 8px; font: 700 22px/1.45 var(--sans); }
-  .steps span { font: 400 14px/1.8 var(--sans); color: var(--ink-2); }
+  /* 根拠の数字（導入比較ガイドの .facts3 と同じ） */
+  .facts3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 2px solid var(--ink); }
+  .fact { padding: 24px 28px 8px 0; display: grid; gap: 10px; align-content: start; min-width: 0; color: var(--ink); text-decoration: none; }
+  .fact + .fact { padding-left: 28px; border-left: 1px solid var(--rule); }
+  .fact-n { font-family: 'Manrope', sans-serif; font-weight: 800; font-size: clamp(2.4rem, 5vw, 3.4rem); line-height: 1; letter-spacing: -.02em; text-autospace: no-autospace; }
+  .fact-n small { font-size: .42em; font-weight: 700; margin-left: 4px; }
+  .fact-n small.pre { margin: 0 4px 0 0; }
+  .fact h3 { margin-top: 6px; font-size: 1.02rem; line-height: 1.5; }
+  .fact p { font-size: .85rem; color: var(--muted); line-height: 1.75; }
+  .more { margin-top: 8px; display: inline-flex; align-items: center; gap: 6px; font-size: .88rem; font-weight: 700; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
+  .more .ms { font-size: 18px; transition: transform .2s; }
+  .fact:hover .more { text-decoration-thickness: 2px; }
+  .fact:hover .more .ms { transform: translateX(3px); }
 
-  .who-box { padding: 0 0 120px; }
-  .who-box p { margin: 0 0 40px; max-width: 40em; font: 400 16px/2 var(--sans); }
+  /* 進め方 */
+  .steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
+  .steps li { background: var(--sheet); padding: 24px 24px 22px; display: grid; gap: 8px; align-content: start; border-top: 2px solid var(--ink); }
+  .steps li.first { background: var(--ink); color: #fff; }
+  .kicker { font-size: .8rem; font-weight: 700; letter-spacing: .12em; color: var(--muted); }
+  .steps li.first .kicker { color: #b9bec7; }
+  .steps h3 { font-size: 1.35rem; line-height: 1.45; font-weight: 800; }
+  .steps p { font-size: .88rem; line-height: 1.75; color: var(--muted); }
+  .steps li.first p { color: #cfd4de; }
 
-  @media (max-width: 767px) {
-    .in { max-width: calc(100% - 32px); }
-    .fv { min-height: auto; padding: 48px 0 64px; }
-    .fv-in { grid-template-columns: 1fr; gap: 32px; }
-    h1 { font-size: 30px; }
-    .cs h2 { font-size: 22px; margin-bottom: 24px; }
-    .proof, .flow { padding: 64px 0; }
-    .nums { grid-template-columns: 1fr; }
-    .nums a, .nums a + a { padding: 24px 0; border-left: 0; }
-    .nums a + a { border-top: 1px solid rgba(255,255,255,.18); }
-    .nums b { font-size: 44px; }
-    .steps { grid-template-columns: 1fr; }
-    .who-box { padding-bottom: 80px; }
+  /* 誰がやっているか */
+  .who-row { display: grid; grid-template-columns: minmax(0, 36em) auto; gap: 32px 56px; align-items: end; justify-content: space-between; }
+  .who-text { font-size: 1rem; line-height: 2; color: #cfd4de; }
+
+  @media (max-width: 900px) {
+    .fv-in { grid-template-columns: 1fr; gap: 36px; padding: 48px var(--gut) 64px; }
+    .facts3, .steps { grid-template-columns: 1fr; }
+    .fact, .fact + .fact { padding: 24px 0 16px; border-left: 0; }
+    .fact + .fact { border-top: 1px solid var(--rule); }
+    .who-row { grid-template-columns: 1fr; }
+    .cs section { padding-block: 64px; }
+  }
+  @media (max-width: 600px) {
+    .do li { grid-template-columns: 56px minmax(0, 1fr); padding: 18px 16px 18px 14px; }
+    .do-n { font-size: 2rem; }
   }
 </style>
commit d9e4104
相談のページ：最初の画面の3項目を各節へのリンクに、余白と線を整え、進め方のカードを押すと黒に

- 最初の画面の 01〜03 を押すと、01 根拠・02 進め方・03 誰がやっているか へ移る（マウスを乗せると黒に）
- 最初の画面の上の線を消し、上下の余白を詰めた（.cs section の 80px が最初の画面にもかかっていた）
- 進め方のカードの上の線を消し、マウスを乗せると黒になるようにした

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01LevEXSYG9NkMRzRGxEeaqX


diff --git a/src/pages/consult.astro b/src/pages/consult.astro
index 07b23e1..2160486 100644
--- a/src/pages/consult.astro
+++ b/src/pages/consult.astro
@@ -28,14 +28,14 @@ const jsonLd = [{
           <div><a class="btn dark" href={CTA} data-ev="無料で相談する（最初の画面）">無料で相談する（30分）<i class="ms" aria-hidden="true">arrow_forward</i></a></div>
         </div>
         <ol class="do" aria-label="一緒にやること">
-          <li><span class="do-n">01</span><div><h2>ロボット学習の環境を立ち上げる</h2><p>借りて測り、買うかどうかを決めるところまで</p></div></li>
-          <li><span class="do-n">02</span><div><h2>サービスロボットを入れる前に確かめる</h2><p>店の形・台数・回し方をシミュレーションで比べる</p></div></li>
-          <li><span class="do-n">03</span><div><h2>現場で回る運用を決める</h2><p>止まり方と人の手間を実物から読み、運用で解く</p></div></li>
+          <li><a href="#proof" data-ev="最初の画面：01へ"><span class="do-n">01</span><div><h2>ロボット学習の環境を立ち上げる</h2><p>借りて測り、買うかどうかを決めるところまで</p></div><i class="ms" aria-hidden="true">arrow_downward</i></a></li>
+          <li><a href="#flow" data-ev="最初の画面：02へ"><span class="do-n">02</span><div><h2>サービスロボットを入れる前に確かめる</h2><p>店の形・台数・回し方をシミュレーションで比べる</p></div><i class="ms" aria-hidden="true">arrow_downward</i></a></li>
+          <li><a href="#who" data-ev="最初の画面：03へ"><span class="do-n">03</span><div><h2>現場で回る運用を決める</h2><p>止まり方と人の手間を実物から読み、運用で解く</p></div><i class="ms" aria-hidden="true">arrow_downward</i></a></li>
         </ol>
       </div>
     </section>
 
-    <section class="band-white" aria-labelledby="proof-h">
+    <section class="band-white" id="proof" aria-labelledby="proof-h">
       <div class="wrap">
         <div class="sec-head"><span class="sec-no" aria-hidden="true">01</span><h2 id="proof-h">どれも、自分で手を動かして<br>確かめてきたこと</h2></div>
         <div class="facts3">
@@ -61,7 +61,7 @@ const jsonLd = [{
       </div>
     </section>
 
-    <section class="band-tint" aria-labelledby="flow-h">
+    <section class="band-tint" id="flow" aria-labelledby="flow-h">
       <div class="wrap">
         <div class="sec-head"><span class="sec-no" aria-hidden="true">02</span><h2 id="flow-h">進め方</h2></div>
         <ol class="steps">
@@ -72,7 +72,7 @@ const jsonLd = [{
       </div>
     </section>
 
-    <section class="band-ink" aria-labelledby="who-h">
+    <section class="band-ink" id="who" aria-labelledby="who-h">
       <div class="wrap">
         <div class="sec-head"><span class="sec-no" aria-hidden="true">03</span><h2 id="who-h">誰がやっているか</h2></div>
         <div class="who-row">
@@ -97,7 +97,7 @@ const jsonLd = [{
   .cs h1, .cs h2, .cs h3 { text-wrap: balance; letter-spacing: 0; margin: 0; }
   .cs p { margin: 0; }
   .cs .lat { -webkit-text-stroke: .028em currentColor; paint-order: stroke fill; letter-spacing: .01em; }
-  .cs section { padding-block: 80px; }
+  .cs section { padding-block: 80px; scroll-margin-top: 48px; }
   .cs .wrap { max-width: calc(1080px + 2 * var(--gut)); margin: 0 auto; padding-inline: var(--gut); display: grid; gap: 40px; }
 
   .btn { display: inline-flex; align-items: center; gap: 8px; font-weight: 700; text-decoration: none; padding: 12px 20px; border: 1.5px solid var(--ink); color: var(--ink); background: var(--sheet); font-size: .95rem; }
@@ -109,15 +109,20 @@ const jsonLd = [{
   @media (prefers-reduced-motion: reduce) { .btn:hover { transform: none; } }
 
   /* 最初の画面 */
-  .fv { padding: 0; }
-  .fv-in { max-width: calc(1080px + 2 * var(--gut)); margin: 0 auto; padding: 72px var(--gut) 88px; display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: 56px; align-items: center; }
+  .cs .fv { padding: 0; }
+  .fv-in { max-width: calc(1080px + 2 * var(--gut)); margin: 0 auto; padding: 48px var(--gut) 64px; display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: 56px; align-items: center; }
   .fv-text { display: grid; gap: 20px; max-width: 33rem; }
   .who { font-size: .9rem; font-weight: 700; line-height: 1.6; }
   .fv h1 { font-size: clamp(1.9rem, 3.9vw, 2.9rem); line-height: 1.14; font-weight: 900; letter-spacing: -.01em; }
   .fv-lead { font-size: 1rem; line-height: 1.85; color: #2a2d33; max-width: 30em; }
   .fv-lead b { display: block; margin-bottom: 6px; font-size: 1.15rem; line-height: 1.6; color: var(--ink); }
-  .do { list-style: none; margin: 0; padding: 0; background: var(--sheet); border-top: 2px solid var(--ink); }
-  .do li { display: grid; grid-template-columns: 72px minmax(0, 1fr); gap: 8px; align-items: center; padding: 22px 24px 22px 20px; }
+  .do { list-style: none; margin: 0; padding: 0; background: var(--sheet); }
+  .do a { display: grid; grid-template-columns: 72px minmax(0, 1fr) auto; gap: 8px; align-items: center; padding: 22px 20px 22px 20px; color: var(--ink); text-decoration: none; transition: background .2s, color .2s; }
+  .do a > .ms { font-size: 20px; color: var(--muted); transition: transform .2s, color .2s; }
+  .do a:hover { background: var(--ink); color: #fff; }
+  .do a:hover p, .do a:hover > .ms { color: #cfd4de; }
+  .do a:hover .do-n { color: var(--ink); -webkit-text-stroke-color: #fff; }
+  .do a:hover > .ms { transform: translateY(3px); }
   .do li + li { border-top: 1px solid var(--rule); }
   .do-n { font-family: 'Manrope', sans-serif; font-weight: 800; font-size: 2.6rem; line-height: 1; color: var(--sheet); -webkit-text-stroke: 2px var(--ink); paint-order: stroke fill; letter-spacing: -.02em; }
   .do h2 { font-size: 1.1rem; line-height: 1.5; font-weight: 700; }
@@ -151,7 +156,10 @@ const jsonLd = [{
 
   /* 進め方 */
   .steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
-  .steps li { background: var(--sheet); padding: 24px 24px 22px; display: grid; gap: 8px; align-content: start; border-top: 2px solid var(--ink); }
+  .steps li { background: var(--sheet); padding: 24px 24px 22px; display: grid; gap: 8px; align-content: start; transition: background .2s, color .2s; }
+  .steps li:hover { background: var(--ink); color: #fff; }
+  .steps li:hover .kicker { color: #b9bec7; }
+  .steps li:hover p { color: #cfd4de; }
   .steps li.first { background: var(--ink); color: #fff; }
   .kicker { font-size: .8rem; font-weight: 700; letter-spacing: .12em; color: var(--muted); }
   .steps li.first .kicker { color: #b9bec7; }
@@ -164,7 +172,7 @@ const jsonLd = [{
   .who-text { font-size: 1rem; line-height: 2; color: #cfd4de; }
 
   @media (max-width: 900px) {
-    .fv-in { grid-template-columns: 1fr; gap: 36px; padding: 48px var(--gut) 64px; }
+    .fv-in { grid-template-columns: 1fr; gap: 32px; padding: 32px var(--gut) 48px; }
     .facts3, .steps { grid-template-columns: 1fr; }
     .fact, .fact + .fact { padding: 24px 0 16px; border-left: 0; }
     .fact + .fact { border-top: 1px solid var(--rule); }
@@ -172,7 +180,7 @@ const jsonLd = [{
     .cs section { padding-block: 64px; }
   }
   @media (max-width: 600px) {
-    .do li { grid-template-columns: 56px minmax(0, 1fr); padding: 18px 16px 18px 14px; }
+    .do a { grid-template-columns: 56px minmax(0, 1fr) auto; padding: 18px 14px; }
     .do-n { font-size: 2rem; }
   }
 </style>
commit fc74adf
相談のページ：ボタンとカードに 4px の角丸（導入比較ガイドのボタンと同じ値）

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01LevEXSYG9NkMRzRGxEeaqX


diff --git a/src/pages/consult.astro b/src/pages/consult.astro
index 2160486..f29f612 100644
--- a/src/pages/consult.astro
+++ b/src/pages/consult.astro
@@ -100,7 +100,8 @@ const jsonLd = [{
   .cs section { padding-block: 80px; scroll-margin-top: 48px; }
   .cs .wrap { max-width: calc(1080px + 2 * var(--gut)); margin: 0 auto; padding-inline: var(--gut); display: grid; gap: 40px; }
 
-  .btn { display: inline-flex; align-items: center; gap: 8px; font-weight: 700; text-decoration: none; padding: 12px 20px; border: 1.5px solid var(--ink); color: var(--ink); background: var(--sheet); font-size: .95rem; }
+  /* 角丸は導入比較ガイドのボタンと同じ 4px。ボタンとカードにだけ付ける */
+  .btn { border-radius: 4px; display: inline-flex; align-items: center; gap: 8px; font-weight: 700; text-decoration: none; padding: 12px 20px; border: 1.5px solid var(--ink); color: var(--ink); background: var(--sheet); font-size: .95rem; }
   .btn.dark { background: var(--ink); border-color: var(--ink); color: #fff; }
   .btn .ms { font-size: 18px; transition: transform .2s; }
   .btn:hover { transform: translateY(-1px); }
@@ -116,7 +117,7 @@ const jsonLd = [{
   .fv h1 { font-size: clamp(1.9rem, 3.9vw, 2.9rem); line-height: 1.14; font-weight: 900; letter-spacing: -.01em; }
   .fv-lead { font-size: 1rem; line-height: 1.85; color: #2a2d33; max-width: 30em; }
   .fv-lead b { display: block; margin-bottom: 6px; font-size: 1.15rem; line-height: 1.6; color: var(--ink); }
-  .do { list-style: none; margin: 0; padding: 0; background: var(--sheet); }
+  .do { list-style: none; margin: 0; padding: 0; background: var(--sheet); border-radius: 4px; overflow: hidden; }
   .do a { display: grid; grid-template-columns: 72px minmax(0, 1fr) auto; gap: 8px; align-items: center; padding: 22px 20px 22px 20px; color: var(--ink); text-decoration: none; transition: background .2s, color .2s; }
   .do a > .ms { font-size: 20px; color: var(--muted); transition: transform .2s, color .2s; }
   .do a:hover { background: var(--ink); color: #fff; }
@@ -156,7 +157,7 @@ const jsonLd = [{
 
   /* 進め方 */
   .steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
-  .steps li { background: var(--sheet); padding: 24px 24px 22px; display: grid; gap: 8px; align-content: start; transition: background .2s, color .2s; }
+  .steps li { border-radius: 4px; background: var(--sheet); padding: 24px 24px 22px; display: grid; gap: 8px; align-content: start; transition: background .2s, color .2s; }
   .steps li:hover { background: var(--ink); color: #fff; }
   .steps li:hover .kicker { color: #b9bec7; }
   .steps li:hover p { color: #cfd4de; }
commit f51f95c
相談のページ：相談のボタンを導入比較ガイドの相談のボタンと同じオレンジに

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01LevEXSYG9NkMRzRGxEeaqX


diff --git a/src/pages/consult.astro b/src/pages/consult.astro
index f29f612..c58a8a0 100644
--- a/src/pages/consult.astro
+++ b/src/pages/consult.astro
@@ -25,7 +25,7 @@ const jsonLd = [{
           <p class="who">フィジカル<span class="lat">AI</span>・ロボットの導入を進める、<br>企業の担当者・研究開発チーム向け</p>
           <h1 id="fv-h">フィジカル<span class="lat">AI</span>の導入を、<br>一緒に手を動かして<br>進めます</h1>
           <p class="fv-lead"><b>ロボットに何を任せ、どこを人が持つか。</b>学習環境の立ち上げから、現場で回る運用の落とし所まで、週1回の打ち合わせと月1回の訪問で一緒に進めます。</p>
-          <div><a class="btn dark" href={CTA} data-ev="無料で相談する（最初の画面）">無料で相談する（30分）<i class="ms" aria-hidden="true">arrow_forward</i></a></div>
+          <div><a class="btn cta" href={CTA} data-ev="無料で相談する（最初の画面）">無料で相談する（30分）<i class="ms" aria-hidden="true">arrow_forward</i></a></div>
         </div>
         <ol class="do" aria-label="一緒にやること">
           <li><a href="#proof" data-ev="最初の画面：01へ"><span class="do-n">01</span><div><h2>ロボット学習の環境を立ち上げる</h2><p>借りて測り、買うかどうかを決めるところまで</p></div><i class="ms" aria-hidden="true">arrow_downward</i></a></li>
@@ -77,7 +77,7 @@ const jsonLd = [{
         <div class="sec-head"><span class="sec-no" aria-hidden="true">03</span><h2 id="who-h">誰がやっているか</h2></div>
         <div class="who-row">
           <p class="who-text">島津栄一（Pixels to Motors）。29年のデザイナー経験。秋田から、ロボットの学習と推論を自分の手で回し、その記録をすべて公開しています。ロボットやフィジカルAIが、これからどこに立つのかを見極め、いま運用に耐える落とし所へ持っていくことを仕事にしています。</p>
-          <div><a class="btn" href={CTA} data-ev="無料で相談する（最後）">無料で相談する（30分）<i class="ms" aria-hidden="true">arrow_forward</i></a></div>
+          <div><a class="btn cta" href={CTA} data-ev="無料で相談する（最後）">無料で相談する（30分）<i class="ms" aria-hidden="true">arrow_forward</i></a></div>
         </div>
       </div>
     </section>
@@ -102,7 +102,10 @@ const jsonLd = [{
 
   /* 角丸は導入比較ガイドのボタンと同じ 4px。ボタンとカードにだけ付ける */
   .btn { border-radius: 4px; display: inline-flex; align-items: center; gap: 8px; font-weight: 700; text-decoration: none; padding: 12px 20px; border: 1.5px solid var(--ink); color: var(--ink); background: var(--sheet); font-size: .95rem; }
-  .btn.dark { background: var(--ink); border-color: var(--ink); color: #fff; }
+  /* 相談のボタンは導入比較ガイドの相談のボタン（.cta-x-main）と同じオレンジ。マウスを乗せると黒（黒い帯の上では白） */
+  .btn.cta { --cta: #f2600c; background: var(--cta); border-color: var(--cta); color: #fff; transition: background .15s, border-color .15s, color .15s, transform .2s; }
+  .btn.cta:hover { background: var(--ink); border-color: var(--ink); }
+  .band-ink .btn.cta:hover { background: #fff; border-color: #fff; color: var(--ink); }
   .btn .ms { font-size: 18px; transition: transform .2s; }
   .btn:hover { transform: translateY(-1px); }
   .btn:hover .ms { transform: translateX(3px); }