/* =========================================================
   サンプル整体院・鍼灸院 — デモサイト用スタイル
   構成: 「カルテ縦組み型」（2026-05-10 案1・七尾蒼CD案／社長承認）
   配色: 紙白 #f6f4ee × 菫色 #7a6aa3 × 薄菫 #c8b8d4 × 墨 #2b2730
        （配色は2026-05-10案Aを完全保持）
   フォント: 見出し Noto Serif JP ／ 本文 Noto Sans JP（細）／ 手書き風 Klee One
   設計指針: LP全体を1冊のカルテに見立て、表紙＋5枚＋奥付で縦組み。
            カードは「処方表」と「セルフケア指示3点」の2箇所のみ。
            それ以外はカルテ罫線（横罫＋縦罫）で組む。
   ========================================================= */

:root {
  /* 背景：紙白系 */
  --c-bg: #f6f4ee;
  --c-bg-alt: #efece4;
  --c-bg-deep: #e6e2d6;
  /* テキスト：墨〜薄墨 */
  --c-text: #2b2730;
  --c-text-soft: #6a6477;
  --c-text-mute: #918da0;
  /* アクセント1：菫色（2026-05-10 修正：WCAG AA 合格まで輝度約12%↓ #7a6aa3→#6e5d99 / 4.85:1） */
  --c-green: #6e5d99;
  --c-green-deep: #5d4f87;
  --c-green-soft: #9588b8;
  /* アクセント2：薄菫 */
  --c-gold: #c8b8d4;
  --c-gold-deep: #9786b1;
  --c-gold-soft: #e2d8ec;
  /* 罫線：薄菫寄りグレー */
  --c-line: #dcd6e0;
  --c-line-soft: #e9e4ec;
  /* 2026-05-10 第2ラウンド：罫線が薄すぎ（1.4:1）→ 約2.2:1 で罫線として見える濃さへ */
  --c-rule: #b0a1c4;       /* カルテ横罫（少し濃いめ） */
  --c-rule-soft: #ddd4e3;  /* カルテ罫の補助色（据え置き） */
  --c-binder: #6e5d99;     /* 綴じ穴の枠（2026-05-10 修正：菫色と整合） */
  --c-binder-fill: #f6f4ee;/* 綴じ穴の中 */
  --c-white: #ffffff;
  --shadow-sm: 0 1px 3px rgba(43, 39, 48, 0.06);
  --shadow-md: 0 8px 28px rgba(43, 39, 48, 0.10);
  --shadow-paper: 0 1px 0 rgba(43, 39, 48, 0.04), 0 18px 36px -22px rgba(43, 39, 48, 0.18);
  --radius: 4px;
  --radius-lg: 8px;
  --rail-w: 220px;
  --maxw: 920px;
  --rule-h: 36px;          /* カルテ横罫の行間 */
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body.chart-body {
  margin: 0;
  font-family: "Noto Sans JP", -apple-system, BlinkMacSystemFont, "Hiragino Kaku Gothic ProN",
    "Yu Gothic", sans-serif;
  font-weight: 400;
  color: var(--c-text);
  line-height: 1.85;
  font-size: 16px;
  letter-spacing: 0.02em;
  /* 2026-05-10 修正：地紋罫線を撤去（視認性改善・社長指摘②／田所つかさ検証反映） */
  background: var(--c-bg);
  -webkit-text-size-adjust: 100%;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

img { max-width: 100%; display: block; }

a { color: var(--c-green); transition: opacity 0.2s ease; }
a:hover { opacity: 0.7; }

/* 手書き風（Klee One）
   2026-05-10 第2ラウンド修正：チェック済ラベルの可読性改善（社長スクショ指摘）
   - .hand の地色を菫色 → 墨色に変更し、letter-spacing も詰める
   - 「記入された感」は .hand-mark の Klee One ＋ 菫色だけで担保
   - チェックリスト内の .hand は通常フォント（読みやすさ優先・下のオーバーライド参照） */
.hand,
.hand-soft {
  font-family: "Klee One", "Noto Serif JP", serif;
  color: var(--c-text);
  letter-spacing: 0.02em;
}
.hand-soft {
  font-weight: 400;
  line-height: 2.1;
}
.hand--multi { display: flex; flex-direction: column; gap: 6px; }
.hand-mark {
  font-family: "Klee One", serif;
  color: var(--c-green);
  margin-right: 8px;
  font-weight: 600;
}
/* チェックリスト内の .hand は通常フォント＋墨色で読みやすく
   （チェック済みラベルが Klee One ＋ 薄色で読みづらい状態を解消） */
.check-chip .hand,
.checklist .hand,
.check-grid .hand,
.bodymap-list .hand,
.ruled__lines .hand {
  font-family: "Noto Sans JP", -apple-system, BlinkMacSystemFont, "Hiragino Kaku Gothic ProN",
    "Yu Gothic", sans-serif;
  font-weight: 500;
  color: var(--c-text);
  letter-spacing: 0.02em;
}

/* =========================================================
   左固定の縦帯ナビ（カルテ綴じ）
   ========================================================= */
.chart-rail {
  position: fixed;
  top: 0;
  left: 0;
  width: var(--rail-w);
  height: 100vh;
  padding: 32px 22px;
  background: linear-gradient(180deg, var(--c-bg-alt) 0%, var(--c-bg) 100%);
  border-right: 1px solid var(--c-line);
  display: flex;
  flex-direction: column;
  gap: 28px;
  z-index: 50;
  overflow-y: auto;
}
.chart-rail::before {
  /* 綴じ穴ライン */
  content: "";
  position: absolute;
  top: 0; bottom: 0;
  right: 14px;
  width: 1px;
  background: repeating-linear-gradient(
    to bottom,
    var(--c-line) 0 6px,
    transparent 6px 12px
  );
}
.chart-rail__brand {
  display: flex;
  flex-direction: column;
  text-decoration: none;
  color: var(--c-green-deep);
  line-height: 1.4;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--c-line);
}
.chart-rail__brand-mark {
  font-family: "Noto Serif JP", serif;
  font-size: 0.7rem;
  letter-spacing: 0.4em;
  /* 2026-05-10 第2ラウンド修正：--c-gold-deep(3.0:1) → --c-green(5.18:1 AA) */
  color: var(--c-green);
  margin-bottom: 4px;
}
.chart-rail__brand-name {
  font-family: "Noto Serif JP", serif;
  font-size: 0.95rem;
  font-weight: 500;
  letter-spacing: 0.08em;
}

.chart-rail__index {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
  flex: 1;
}
.chart-rail__index li {
  position: relative;
}
.chart-rail__index a {
  display: grid;
  grid-template-columns: 56px 1fr;
  gap: 10px;
  align-items: baseline;
  text-decoration: none;
  padding: 10px 6px;
  border-bottom: 1px dashed var(--c-line-soft);
  transition: background 0.2s ease;
}
.chart-rail__index a:hover { background: rgba(122, 106, 163, 0.06); opacity: 1; }
.chart-rail__num {
  font-family: "Cormorant Garamond", "Noto Serif JP", serif;
  font-size: 0.78rem;
  letter-spacing: 0.15em;
  /* 2026-05-10 第2ラウンド：装飾番号 → --c-text-soft(5.16:1 AA) */
  color: var(--c-text-soft);
  text-align: right;
}
.chart-rail__label {
  font-family: "Noto Serif JP", serif;
  font-size: 0.86rem;
  color: var(--c-text);
  letter-spacing: 0.08em;
}
.chart-rail__cta {
  display: inline-block;
  text-align: center;
  padding: 12px 16px;
  background: var(--c-green);
  color: #fff;
  text-decoration: none;
  font-size: 0.82rem;
  letter-spacing: 0.15em;
  border-radius: var(--radius);
  border: 1px solid var(--c-green);
  transition: background 0.2s ease, color 0.2s ease;
}
.chart-rail__cta:hover {
  background: transparent;
  color: var(--c-green);
  opacity: 1;
}

/* =========================================================
   メイン領域（左帯ぶん寄せる）
   ========================================================= */
.chart {
  margin-left: var(--rail-w);
  padding: 0;
}

/* =========================================================
   カルテ 1枚（共通レイアウト）
   ========================================================= */
.sheet {
  position: relative;
  max-width: var(--maxw);
  margin: 0 auto;
  padding: 96px 56px 110px;
  border-bottom: 1px dashed var(--c-line);
}
.sheet:last-of-type { border-bottom: none; }

/* 綴じ穴（左端に4点・菫色） */
.sheet__binder {
  position: absolute;
  top: 50%;
  left: 18px;
  transform: translateY(-50%);
  display: flex;
  flex-direction: column;
  gap: 80px;
  pointer-events: none;
}
.sheet__binder span {
  display: block;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: var(--c-binder-fill);
  border: 1.5px solid var(--c-binder);
  box-shadow: inset 0 1px 2px rgba(43, 39, 48, 0.18);
}

/* ページ番号（右上） */
.sheet__pageno {
  position: absolute;
  top: 36px;
  right: 36px;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 2px;
  font-family: "Cormorant Garamond", "Noto Serif JP", serif;
  letter-spacing: 0.18em;
  /* 2026-05-10 第2ラウンド：ページ番号 → --c-text-soft(5.16:1 AA) */
  color: var(--c-text-soft);
}
.sheet__pageno span { font-size: 0.78rem; }
.sheet__pageno strong {
  font-weight: 500;
  font-size: 0.7rem;
  letter-spacing: 0.3em;
  /* 2026-05-10 第2ラウンド：--c-text-mute(3.4:1) → --c-text-soft(5.16:1 AA) */
  color: var(--c-text-soft);
}

.sheet__head {
  margin-bottom: 36px;
  padding-bottom: 22px;
  border-bottom: 2px solid var(--c-rule);
  position: relative;
}
.sheet__head::after {
  /* 二重線（カルテヘッダ感） */
  content: "";
  position: absolute;
  left: 0; right: 0;
  bottom: -6px;
  height: 1px;
  background: var(--c-rule-soft);
}
.sheet__eyebrow {
  font-family: "Cormorant Garamond", serif;
  font-size: 0.78rem;
  letter-spacing: 0.4em;
  /* 2026-05-10 第2ラウンド：見出し直前のアイブロウ → --c-green(5.18:1 AA) */
  color: var(--c-green);
  margin: 0 0 12px;
  font-weight: 500;
}
.sheet__title {
  font-family: "Noto Serif JP", serif;
  font-size: 1.55rem;
  font-weight: 500;
  color: var(--c-green-deep);
  letter-spacing: 0.08em;
  line-height: 1.7;
  margin: 0 0 18px;
}
.sheet__lead {
  margin: 0;
  color: var(--c-text-soft);
  font-size: 0.92rem;
  line-height: 2.05;
  max-width: 720px;
}

@media (min-width: 700px) {
  .sheet__title { font-size: 1.85rem; }
}

/* =========================================================
   表紙
   ========================================================= */
.sheet--cover {
  padding-top: 110px;
  padding-bottom: 130px;
  min-height: calc(100vh - 0px);
  display: flex;
  align-items: center;
}
.cover-card {
  position: relative;
  width: 100%;
  max-width: 720px;
  margin: 0 auto;
  background: var(--c-white);
  border: 1px solid var(--c-rule);
  padding: 56px 56px 48px;
  box-shadow: var(--shadow-paper);
}
.cover-card::before {
  /* 内枠（カルテの内側ボーダー） */
  content: "";
  position: absolute;
  inset: 12px;
  border: 1px solid var(--c-line);
  pointer-events: none;
}
.cover-card::after {
  /* 折り目の影 */
  content: "";
  position: absolute;
  top: 0; bottom: 0; left: 50%;
  width: 1px;
  background: linear-gradient(180deg, transparent, rgba(122, 106, 163, 0.08), transparent);
  pointer-events: none;
  display: none;
}
.cover-card__head {
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
  padding-bottom: 18px;
  border-bottom: 2px solid var(--c-rule);
  margin-bottom: 32px;
}
.cover-card__brand { display: flex; flex-direction: column; gap: 4px; }
.cover-card__mark {
  font-family: "Noto Serif JP", serif;
  font-size: 0.7rem;
  letter-spacing: 0.4em;
  /* 2026-05-10 第2ラウンド：表紙ブランドマーク → --c-green(5.18:1 AA) */
  color: var(--c-green);
}
.cover-card__name {
  font-family: "Noto Serif JP", serif;
  font-size: 1rem;
  font-weight: 500;
  color: var(--c-green-deep);
  letter-spacing: 0.1em;
}
.cover-card__stamp {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  border: 1.5px solid var(--c-green);
  color: var(--c-green);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: "Cormorant Garamond", serif;
  font-size: 0.6rem;
  letter-spacing: 0.18em;
  text-align: center;
  line-height: 1.3;
  transform: rotate(-6deg);
  background: rgba(255, 255, 255, 0.6);
}

.cover-card__title {
  position: relative;
  font-family: "Noto Serif JP", serif;
  font-weight: 500;
  font-size: 2.1rem;
  color: var(--c-green-deep);
  letter-spacing: 0.08em;
  line-height: 1.55;
  margin: 0 0 36px;
}
.cover-card__title-eyebrow {
  display: block;
  font-family: "Cormorant Garamond", serif;
  font-size: 0.72rem;
  letter-spacing: 0.4em;
  /* 2026-05-10 第2ラウンド：表紙アイブロウ → --c-green(5.18:1 AA) */
  color: var(--c-green);
  margin-bottom: 14px;
  font-weight: 500;
}
/* 2026-05-10 第2ラウンド：本文と一緒に読まれるアクセント → --c-green(5.18:1 AA) */
.cover-card__title-accent { color: var(--c-green); }

.cover-card__form {
  margin: 0 0 28px;
  border-top: 1px solid var(--c-rule);
}
.cover-form-row {
  display: grid;
  grid-template-columns: 96px 1fr;
  gap: 14px;
  align-items: baseline;
  padding: 14px 4px;
  border-bottom: 1px solid var(--c-rule-soft);
}
.cover-form-row dt {
  font-family: "Noto Serif JP", serif;
  font-size: 0.82rem;
  letter-spacing: 0.18em;
  /* 2026-05-10 第2ラウンド：フォーム見出し → --c-green(5.18:1 AA) */
  color: var(--c-green);
}
.cover-form-row dd {
  margin: 0;
  font-size: 0.95rem;
  color: var(--c-text);
  line-height: 1.85;
}
.cover-form-row--complaint dd { font-size: 1.05rem; }
.cover-form-row--memo dd { color: var(--c-text-soft); font-size: 0.9rem; }

.cover-card__foot {
  border-top: 2px solid var(--c-rule);
  padding-top: 20px;
}
.cover-card__lead {
  margin: 0 0 22px;
  color: var(--c-text-soft);
  font-size: 0.86rem;
  line-height: 1.95;
}
.cover-card__lead strong { color: var(--c-green-deep); font-weight: 500; }

.cover-card__cta {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  text-decoration: none;
  padding: 14px 28px;
  border: 1px solid var(--c-green);
  color: var(--c-green-deep);
  background: rgba(122, 106, 163, 0.04);
  transition: background 0.2s ease, color 0.2s ease;
}
.cover-card__cta:hover {
  background: var(--c-green);
  color: #fff;
  opacity: 1;
}
.cover-card__cta:hover .cover-card__cta-small { color: var(--c-gold-soft); }
.cover-card__cta-small {
  font-size: 0.7rem;
  letter-spacing: 0.2em;
  /* 2026-05-10 第2ラウンド：CTA補助ラベル → --c-text-soft(5.16:1 AA) */
  color: var(--c-text-soft);
}
.cover-card__cta-big {
  font-family: "Noto Serif JP", serif;
  font-size: 1.1rem;
  letter-spacing: 0.1em;
  font-weight: 500;
}

/* =========================================================
   カルテ罫線ブロック（共通）
   2026-05-10 第3ラウンド：repeating-linear-gradient による罫線地紋を全撤去。
   理由：チェックリスト・メモ欄・箇条書きの背景に罫線が走ると、行間と罫線ピッチの
   不整合でモアレ・視認性低下が発生（社長スクショで指摘）。body 地紋撤去と同じ判断を
   .ruled にも適用。「カルテ感」は左の二重罫線（border-left: 4px double）と綴じ穴
   ＋手書き風タイポ＋ページ番号で十分担保される。
   ========================================================= */
.ruled {
  position: relative;
  background: var(--c-bg);
  border: 1px solid var(--c-rule);
  border-left: 4px double var(--c-rule);
  padding: 28px 32px;
}
.ruled--intake { padding-bottom: 36px; }

.ruled__heading {
  font-family: "Noto Serif JP", serif;
  font-size: 1.05rem;
  font-weight: 500;
  color: var(--c-green-deep);
  letter-spacing: 0.08em;
  margin: 32px 0 14px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--c-rule);
  display: flex;
  align-items: baseline;
  gap: 10px;
}
.ruled__heading:first-child { margin-top: 0; }
.ruled__heading-mark {
  display: inline-block;
  font-family: "Cormorant Garamond", serif;
  /* 2026-05-10 第2ラウンド：見出しの一部の章マーク → --c-green(5.18:1 AA) */
  color: var(--c-green);
  font-size: 0.95rem;
  letter-spacing: 0.1em;
  min-width: 18px;
}
.ruled__body {
  margin: 0 0 18px;
  color: var(--c-text);
  font-size: 0.95rem;
}
.ruled__bullets {
  list-style: none;
  padding: 0;
  margin: 0 0 18px;
  display: grid;
  gap: 4px;
}
.ruled__bullets li {
  position: relative;
  padding: 6px 0 6px 22px;
  font-size: 0.9rem;
  color: var(--c-text);
  line-height: var(--rule-h);
}
.ruled__bullets li::before {
  content: "・";
  position: absolute;
  left: 4px;
  color: var(--c-green);
  font-weight: 700;
}

.ruled__lines {
  list-style: none;
  padding: 0;
  margin: 0 0 12px;
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
}
.ruled__lines li {
  display: flex;
  align-items: center;
  gap: 12px;
  height: var(--rule-h);
  font-size: 0.92rem;
  color: var(--c-text);
}
@media (min-width: 700px) {
  .ruled__lines { grid-template-columns: 1fr 1fr; column-gap: 32px; }
}

.ruled__signoff {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
  margin: 28px 0 0;
  padding-top: 14px;
  border-top: 1px solid var(--c-rule);
  font-size: 0.78rem;
  /* 2026-05-10 第2ラウンド：署名行 --c-text-mute(3.4:1) → --c-text-soft(5.16:1 AA) */
  color: var(--c-text-soft);
  letter-spacing: 0.05em;
}
.ruled__date {
  font-family: "Klee One", "Noto Serif JP", serif;
  color: var(--c-green-deep);
  font-size: 0.92rem;
  letter-spacing: 0.08em;
}

/* 1枚目：問診 — 身体マップ */
.ruled__row {
  display: grid;
  grid-template-columns: 1fr;
  gap: 28px;
  margin-bottom: 12px;
}
@media (min-width: 760px) {
  .ruled__row { grid-template-columns: 1fr 220px; align-items: start; }
}
.bodymap-list {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  margin: 0;
}
.bodymap-list > div {
  display: flex;
  align-items: center;
  gap: 8px;
  height: var(--rule-h);
  font-size: 0.9rem;
}
.bodymap-list dt {
  margin: 0;
  font-family: "Klee One", serif;
  font-weight: 600;
  color: var(--c-green);
  font-size: 1rem;
  width: 18px;
  text-align: center;
}
.bodymap-list dd { margin: 0; color: var(--c-text); }

.bodymap-figure {
  position: relative;
  margin: 0;
  aspect-ratio: 3 / 4;
  background:
    linear-gradient(90deg, rgba(122, 106, 163, 0.06) 1px, transparent 1px),
    linear-gradient(180deg, rgba(122, 106, 163, 0.06) 1px, transparent 1px),
    var(--c-bg);
  background-size: 16px 16px;
  border: 1px solid var(--c-line);
}
.bodymap-figure__caption {
  position: absolute;
  top: 8px; left: 10px;
  font-family: "Cormorant Garamond", serif;
  font-size: 0.7rem;
  letter-spacing: 0.25em;
  /* 2026-05-10 第2ラウンド：装飾ラベル「人体図」 → --c-text-soft(5.16:1 AA) */
  color: var(--c-text-soft);
}
.bodymap-figure__silhouette {
  position: absolute;
  top: 50%; left: 50%;
  width: 60%; height: 78%;
  transform: translate(-50%, -50%);
  background:
    radial-gradient(circle at 50% 13%, rgba(122, 106, 163, 0.2) 0 14px, transparent 15px),
    linear-gradient(180deg, rgba(255, 255, 255, 0.7), rgba(239, 236, 228, 0.5));
  border: 1.5px solid rgba(93, 79, 135, 0.32);
  border-radius: 38% 38% 32% 32% / 30% 30% 22% 22%;
}
.bodymap-figure__silhouette::before,
.bodymap-figure__silhouette::after {
  content: "";
  position: absolute;
  background: rgba(122, 106, 163, 0.55);
  height: 1px;
}
/* 肩線 */
.bodymap-figure__silhouette::before {
  top: 30%; left: 8%; right: 8%;
}
/* 腰線 */
.bodymap-figure__silhouette::after {
  top: 56%; left: 12%; right: 12%;
}
.bodymap-figure__pin {
  position: absolute;
  font-size: 0.8rem;
  color: var(--c-green-deep);
  text-shadow: 0 0 0 var(--c-green-deep);
  z-index: 2;
}
.bodymap-figure__pin--shoulder { top: 28%; right: 22%; }
.bodymap-figure__pin--waist { top: 56%; left: 28%; }
.bodymap-figure__note {
  position: absolute;
  bottom: 8px; right: 10px;
  font-size: 0.66rem;
  /* 2026-05-10 第2ラウンド：図注 --c-text-mute(3.4:1) → --c-text-soft(5.16:1 AA) */
  color: var(--c-text-soft);
  letter-spacing: 0.08em;
}

/* 2枚目：所見 — concerns lines */
.ruled__concerns {
  display: grid;
  gap: 0;
}
.concern-line {
  display: grid;
  grid-template-columns: 48px 1fr;
  gap: 12px;
  align-items: center;
  height: var(--rule-h);
  border-bottom: 1px dashed var(--c-rule-soft);
}
.concern-line:last-child { border-bottom: none; }
.concern-line__no {
  font-family: "Cormorant Garamond", serif;
  font-size: 0.95rem;
  /* 2026-05-10 第2ラウンド：装飾番号 → --c-text-soft(5.16:1 AA) */
  color: var(--c-text-soft);
  letter-spacing: 0.1em;
}
.concern-line__text { font-size: 0.92rem; color: var(--c-text); }

/* =========================================================
   3枚目：処方箋カード（カード使用箇所その1）
   ========================================================= */
.prescription-card {
  background: var(--c-white);
  border: 1px solid var(--c-rule);
  border-left: 4px double var(--c-green);
  padding: 32px 36px 28px;
  box-shadow: var(--shadow-paper);
  position: relative;
}
.prescription-card__head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 18px;
  padding-bottom: 18px;
  margin-bottom: 18px;
  border-bottom: 2px solid var(--c-rule);
}
.prescription-card__head-left {
  display: flex;
  align-items: center;
  gap: 16px;
}
.prescription-card__rx {
  font-family: "Cormorant Garamond", serif;
  font-size: 2.4rem;
  color: var(--c-green);
  line-height: 1;
}
.prescription-card__heading {
  margin: 0;
  font-family: "Noto Serif JP", serif;
  font-size: 1.15rem;
  font-weight: 500;
  color: var(--c-green-deep);
  letter-spacing: 0.1em;
}
.prescription-card__sub {
  margin: 4px 0 0;
  font-family: "Cormorant Garamond", serif;
  font-size: 0.72rem;
  letter-spacing: 0.25em;
  /* 2026-05-10 第2ラウンド：処方箋サブ → --c-text-soft(5.16:1 AA) */
  color: var(--c-text-soft);
}
.prescription-card__no {
  margin: 0;
  font-family: "Cormorant Garamond", serif;
  font-size: 0.78rem;
  letter-spacing: 0.18em;
  /* 2026-05-10 第2ラウンド：No → --c-text-soft(5.16:1 AA) */
  color: var(--c-text-soft);
}

.prescription-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.92rem;
}
.prescription-table thead th {
  background: rgba(122, 106, 163, 0.08);
  color: var(--c-green-deep);
  font-family: "Noto Serif JP", serif;
  font-weight: 500;
  letter-spacing: 0.12em;
  font-size: 0.82rem;
  padding: 12px 16px;
  text-align: left;
  border-bottom: 1px solid var(--c-rule);
  border-top: 1px solid var(--c-rule);
}
.prescription-table tbody tr {
  border-bottom: 1px solid var(--c-rule-soft);
}
.prescription-table tbody tr:last-child { border-bottom: none; }
.prescription-table tbody th,
.prescription-table tbody td {
  padding: 16px;
  vertical-align: middle;
  text-align: left;
  font-weight: 400;
}
.prescription-table__col-time {
  width: 18%;
  white-space: nowrap;
  text-align: center;
  color: var(--c-text-soft);
  font-family: "Cormorant Garamond", "Noto Serif JP", serif;
  font-size: 0.95rem;
  letter-spacing: 0.05em;
}
.prescription-table__col-amount {
  width: 22%;
  white-space: nowrap;
  text-align: right;
  /* 2026-05-10 第2ラウンド：料金は本文として読まれる → --c-green(5.18:1 AA) */
  color: var(--c-green);
  font-family: "Cormorant Garamond", "Noto Serif JP", serif;
  font-size: 1.1rem;
  font-weight: 500;
}
.rx-name {
  display: block;
  font-family: "Noto Serif JP", serif;
  font-size: 0.98rem;
  color: var(--c-green-deep);
  margin-bottom: 4px;
  letter-spacing: 0.04em;
}
.rx-memo {
  display: block;
  font-size: 0.76rem;
  /* 2026-05-10 第2ラウンド：処方メモ --c-text-mute(3.4:1) → --c-text-soft(5.16:1 AA) */
  color: var(--c-text-soft);
  letter-spacing: 0.05em;
  /* 細字 300 は読みづらいため 400 に引上げ */
  font-weight: 400;
}
.prescription-table__row--ticket {
  background: rgba(122, 106, 163, 0.04);
}
.prescription-table__row--ticket .rx-name {
  position: relative;
  padding-left: 18px;
}
.prescription-table__row--ticket .rx-name::before {
  content: "◆";
  position: absolute;
  left: 0; top: 1px;
  color: var(--c-gold);
  font-size: 0.7rem;
}

.prescription-card__foot {
  margin-top: 20px;
  padding-top: 16px;
  border-top: 1px solid var(--c-rule);
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 14px;
}
.prescription-card__note {
  margin: 0;
  font-size: 0.78rem;
  color: var(--c-text-soft);
  line-height: 1.85;
  letter-spacing: 0.04em;
  flex: 1;
  min-width: 240px;
}
.prescription-card__sign {
  margin: 0;
  font-size: 0.86rem;
  color: var(--c-green-deep);
}

/* =========================================================
   4枚目：セルフケア指示 3枚（カード使用箇所その2）
   ========================================================= */
.selfcare-row {
  display: grid;
  grid-template-columns: 1fr;
  gap: 18px;
  margin-bottom: 36px;
}
@media (min-width: 760px) {
  .selfcare-row { grid-template-columns: repeat(3, 1fr); gap: 14px; }
}
.memo-card {
  background: var(--c-white);
  border: 1px solid var(--c-rule);
  padding: 22px 22px 20px;
  position: relative;
  box-shadow: var(--shadow-paper);
}
.memo-card::before {
  /* メモの上端ピン（薄菫の点） */
  content: "";
  position: absolute;
  top: -6px; left: 50%;
  transform: translateX(-50%);
  width: 12px; height: 12px;
  background: var(--c-gold);
  border: 1.5px solid var(--c-green);
  border-radius: 50%;
}
.memo-card__head {
  margin-bottom: 14px;
  padding-bottom: 12px;
  border-bottom: 1px dashed var(--c-rule);
}
.memo-card__no {
  display: block;
  font-family: "Cormorant Garamond", serif;
  font-size: 0.7rem;
  letter-spacing: 0.3em;
  /* 2026-05-10 第2ラウンド：メモ番号 → --c-text-soft(5.16:1 AA) */
  color: var(--c-text-soft);
  margin-bottom: 6px;
}
.memo-card__title {
  margin: 0;
  font-family: "Noto Serif JP", serif;
  font-size: 1rem;
  font-weight: 500;
  color: var(--c-green-deep);
  letter-spacing: 0.06em;
  line-height: 1.55;
}
.memo-card__steps {
  list-style: none;
  padding: 0;
  margin: 0 0 14px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.memo-card__steps li {
  display: grid;
  grid-template-columns: 22px 1fr;
  gap: 8px;
  font-size: 0.85rem;
  color: var(--c-text);
  line-height: 1.7;
}
.memo-card__step-no {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px; height: 20px;
  background: var(--c-green);
  color: #fff;
  border-radius: 50%;
  font-family: "Cormorant Garamond", serif;
  font-size: 0.74rem;
  margin-top: 2px;
}
.memo-card__memo {
  margin: 0;
  font-size: 0.84rem;
  line-height: 1.85;
  border-top: 1px dashed var(--c-rule-soft);
  padding-top: 10px;
}

/* 来院フロー */
.ruled--flow .flow-line {
  list-style: none;
  padding: 0;
  margin: 0;
}
.flow-line li {
  display: grid;
  grid-template-columns: 56px 160px 1fr;
  gap: 14px;
  align-items: center;
  padding: 8px 0;
  border-bottom: 1px dashed var(--c-rule-soft);
  min-height: var(--rule-h);
}
.flow-line li:last-child { border-bottom: none; }
.flow-line__no {
  font-family: "Cormorant Garamond", serif;
  font-size: 1.1rem;
  /* 2026-05-10 第2ラウンド：装飾番号 → --c-text-soft(5.16:1 AA) */
  color: var(--c-text-soft);
  letter-spacing: 0.08em;
}
.flow-line__title {
  font-family: "Noto Serif JP", serif;
  color: var(--c-green-deep);
  font-size: 0.95rem;
  letter-spacing: 0.08em;
}
.flow-line__desc {
  color: var(--c-text-soft);
  font-size: 0.85rem;
  line-height: 1.7;
}
@media (max-width: 700px) {
  .flow-line li { grid-template-columns: 44px 1fr; }
  .flow-line__desc { grid-column: 1 / -1; padding-left: 58px; font-size: 0.82rem; }
}

/* =========================================================
   5枚目：FAQ + 予約フォーム
   ========================================================= */
.qa-list {
  display: grid;
  gap: 0;
  margin-bottom: 8px;
}
.qa-item {
  border-bottom: 1px solid var(--c-rule-soft);
}
.qa-item summary {
  cursor: pointer;
  list-style: none;
  padding: 14px 36px 14px 8px;
  font-family: "Noto Serif JP", serif;
  font-weight: 500;
  font-size: 0.96rem;
  color: var(--c-green-deep);
  letter-spacing: 0.05em;
  line-height: 1.7;
  display: flex;
  gap: 10px;
  align-items: baseline;
  position: relative;
}
.qa-item summary::-webkit-details-marker { display: none; }
.qa-item summary::after {
  content: "";
  position: absolute;
  right: 12px;
  top: 50%;
  width: 9px; height: 9px;
  border-right: 1px solid var(--c-green);
  border-bottom: 1px solid var(--c-green);
  transform: translateY(-70%) rotate(45deg);
  transition: transform 0.25s ease;
}
.qa-item[open] summary::after { transform: translateY(-30%) rotate(-135deg); }
.qa-item p {
  margin: 0;
  padding: 0 8px 16px 30px;
  color: var(--c-text-soft);
  font-size: 0.88rem;
  line-height: 1.95;
  position: relative;
  display: flex;
  gap: 10px;
}
.qa-mark {
  font-family: "Cormorant Garamond", serif;
  /* 2026-05-10 第3ラウンド：Qマークも --c-green(5.18:1 AA) に揃える（旧 --c-gold #c8b8d4 は1.5:1で背景に溶ける）。Q/A の識別は font-weight で取る */
  color: var(--c-green);
  font-size: 1rem;
  font-weight: 500;
  letter-spacing: 0.1em;
  flex-shrink: 0;
  width: 16px;
}
/* 2026-05-10 第2/3ラウンド：A マークは Q より太く、--c-green-deep(6.5:1) で識別性を強化 */
.qa-mark--a { color: var(--c-green-deep); font-weight: 700; }

/* 予約ブロック */
.reservation-block {
  margin-top: 56px;
  padding: 28px 32px;
  background: var(--c-white);
  border: 1px solid var(--c-rule);
  border-left: 4px double var(--c-rule);
}
.reservation-block__lead {
  margin: 0 0 24px;
  color: var(--c-text-soft);
  font-size: 0.9rem;
  line-height: 1.95;
}
.reservation-block__layout {
  display: grid;
  grid-template-columns: 1fr;
  gap: 28px;
}
@media (min-width: 880px) {
  .reservation-block__layout {
    grid-template-columns: 0.85fr 1.4fr;
    gap: 36px;
    align-items: start;
  }
}
.reservation-block__contact {
  display: grid;
  gap: 14px;
}
.contact-card {
  background: var(--c-bg);
  border: 1px solid var(--c-line);
  padding: 20px 22px;
  text-align: left;
  border-left: 3px solid var(--c-green);
}
.contact-card__label {
  margin: 0 0 8px;
  font-family: "Cormorant Garamond", serif;
  font-size: 0.72rem;
  letter-spacing: 0.3em;
  /* 2026-05-10 第2ラウンド：連絡先見出しラベル → --c-green(5.18:1 AA) */
  color: var(--c-green);
}
.contact-card__main {
  margin: 0 0 6px;
  font-family: "Noto Serif JP", serif;
  font-size: 1.25rem;
  letter-spacing: 0.06em;
}
.contact-card__main a {
  color: var(--c-green-deep);
  text-decoration: none;
  letter-spacing: 0.08em;
}
.contact-card__main--mail { font-size: 0.95rem; word-break: break-all; }
.contact-card__sub {
  margin: 0;
  font-size: 0.78rem;
  color: var(--c-text-soft);
  letter-spacing: 0.04em;
}

.chart-form {
  background: var(--c-bg);
  border: 1px solid var(--c-line);
  padding: 28px 24px 24px;
}
.chart-form__lead {
  margin: 0 0 20px;
  font-family: "Noto Serif JP", serif;
  text-align: left;
  font-weight: 500;
  color: var(--c-green-deep);
  font-size: 0.98rem;
  letter-spacing: 0.06em;
  padding-bottom: 14px;
  border-bottom: 1px dashed var(--c-rule-soft);
}
.form-row {
  margin-bottom: 18px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.form-row label {
  font-size: 0.82rem;
  font-weight: 500;
  color: var(--c-text);
  letter-spacing: 0.08em;
  display: flex;
  align-items: center;
  gap: 10px;
}
.form-row__required {
  display: inline-block;
  background: var(--c-gold);
  color: #fff;
  font-size: 0.65rem;
  letter-spacing: 0.1em;
  padding: 2px 8px;
  border-radius: 2px;
  font-weight: 400;
}
.form-row input,
.form-row textarea,
.form-row select {
  font-family: inherit;
  /* 2026-05-10 修正：iOS 16px未満で自動ズーム発動するため 1rem(16px) に引上げ */
  font-size: 1rem;
  padding: 12px 14px;
  border: 1px solid var(--c-line);
  border-radius: var(--radius);
  background: var(--c-white);
  color: var(--c-text);
  transition: border-color 0.2s ease, background 0.2s ease;
  letter-spacing: 0.04em;
}
.form-row textarea { resize: vertical; min-height: 110px; }
.form-row select {
  appearance: none;
  background-image:
    linear-gradient(45deg, transparent 50%, var(--c-green) 50%),
    linear-gradient(135deg, var(--c-green) 50%, transparent 50%);
  background-position: calc(100% - 18px) center, calc(100% - 13px) center;
  background-size: 5px 5px, 5px 5px;
  background-repeat: no-repeat;
  padding-right: 40px;
}
.form-row input:focus,
.form-row textarea:focus,
.form-row select:focus {
  outline: none;
  border-color: var(--c-gold);
}
.form-row--two {
  display: grid;
  grid-template-columns: 1fr;
  gap: 18px;
}
.form-row--two > div {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.check-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
}
.check-chip {
  position: relative;
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 42px;
  padding: 10px 12px;
  background: var(--c-white);
  border: 1px solid var(--c-line);
  border-radius: var(--radius);
  cursor: pointer;
  transition: border-color 0.2s ease, background 0.2s ease;
}
.check-chip:hover { border-color: var(--c-gold); }
.check-chip input {
  width: 16px; height: 16px;
  margin: 0; padding: 0; border: 0;
  background: transparent;
  accent-color: var(--c-green);
  flex-shrink: 0;
}
.check-chip span {
  font-size: 0.84rem;
  color: var(--c-text);
  line-height: 1.5;
  letter-spacing: 0.05em;
}
.check-chip:has(input:checked) {
  border-color: var(--c-green);
  /* 2026-05-10 第2ラウンド修正：新菫色RGB（110,93,153）＋ 透過 0.08→0.14 で
     「チェック済」の存在感を上げる（社長スクショ指摘：チェック済の方が読みづらい矛盾解消） */
  background: rgba(110, 93, 153, 0.14);
}
.check-chip:has(input:checked) .hand,
.check-chip:has(input:checked) span {
  color: var(--c-text);
  font-weight: 600;
}
.check-grid--soft .check-chip { background: var(--c-bg); }
.form-row__hint {
  margin: 2px 0 0;
  font-size: 0.76rem;
  /* 2026-05-10 第2ラウンド：フォームヒント --c-text-mute(3.4:1) → --c-text-soft(5.16:1 AA) */
  color: var(--c-text-soft);
  line-height: 1.8;
  letter-spacing: 0.04em;
}
@media (min-width: 600px) {
  .form-row--two { grid-template-columns: 1fr 1fr; }
  .check-grid { grid-template-columns: repeat(2, 1fr); }
}
.chart-form__submit {
  width: 100%;
  margin-top: 8px;
  padding: 16px 22px;
  background: var(--c-green);
  color: #fff;
  border: 1px solid var(--c-green);
  border-radius: var(--radius);
  font-family: inherit;
  font-size: 0.95rem;
  letter-spacing: 0.12em;
  cursor: pointer;
  transition: background 0.2s ease, color 0.2s ease;
}
.chart-form__submit:hover {
  background: var(--c-green-deep);
  border-color: var(--c-green-deep);
}
.chart-form__note {
  margin: 14px 0 0;
  font-size: 0.78rem;
  /* 2026-05-10 第2ラウンド：フォーム注 --c-text-mute(3.4:1) → --c-text-soft(5.16:1 AA) */
  color: var(--c-text-soft);
  text-align: center;
  letter-spacing: 0.05em;
}

/* =========================================================
   奥付 COLOPHON
   ========================================================= */
.colophon {
  position: relative;
  max-width: var(--maxw);
  margin: 0 auto;
  padding: 84px 56px 56px;
  background: var(--c-green-deep);
  color: rgba(246, 244, 238, 0.88);
  border-top: 4px double var(--c-gold);
}
.colophon__binder span {
  background: var(--c-green-deep);
  border-color: var(--c-gold);
}
.colophon__head { margin-bottom: 36px; }
.colophon__eyebrow {
  margin: 0 0 8px;
  font-family: "Cormorant Garamond", serif;
  font-size: 0.78rem;
  letter-spacing: 0.4em;
  color: var(--c-gold);
}
.colophon__title {
  margin: 0;
  font-family: "Noto Serif JP", serif;
  font-size: 1.25rem;
  font-weight: 500;
  color: #fff;
  letter-spacing: 0.08em;
}
.colophon__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 32px;
  padding-bottom: 32px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.15);
}
@media (min-width: 760px) {
  .colophon__grid { grid-template-columns: 1fr 1fr; gap: 36px 56px; }
}
.colophon__block-heading {
  margin: 0 0 14px;
  font-family: "Cormorant Garamond", serif;
  font-size: 0.74rem;
  letter-spacing: 0.32em;
  color: var(--c-gold);
  font-weight: 500;
  padding-bottom: 6px;
  border-bottom: 1px dashed rgba(255, 255, 255, 0.18);
}
.colophon__brand-mark {
  margin: 0 0 4px;
  font-family: "Noto Serif JP", serif;
  font-size: 0.78rem;
  letter-spacing: 0.4em;
  color: var(--c-gold);
}
.colophon__brand-name {
  margin: 0 0 10px;
  font-family: "Noto Serif JP", serif;
  font-size: 1.1rem;
  font-weight: 500;
  color: #fff;
  letter-spacing: 0.1em;
}
.colophon__tagline {
  margin: 0 0 12px;
  font-family: "Noto Serif JP", serif;
  font-size: 0.88rem;
  color: var(--c-gold-soft);
  letter-spacing: 0.06em;
}
.colophon__about {
  margin: 0;
  font-size: 0.84rem;
  line-height: 1.95;
  color: rgba(246, 244, 238, 0.82);
  letter-spacing: 0.04em;
}
.colophon__list {
  margin: 0;
  display: grid;
  gap: 0;
}
.colophon__list > div {
  display: grid;
  grid-template-columns: 88px 1fr;
  gap: 12px;
  padding: 10px 0;
  border-bottom: 1px dashed rgba(255, 255, 255, 0.12);
  font-size: 0.82rem;
  line-height: 1.8;
}
.colophon__list > div:last-child { border-bottom: none; }
.colophon__list dt {
  font-family: "Noto Serif JP", serif;
  color: var(--c-gold);
  letter-spacing: 0.12em;
  font-size: 0.78rem;
}
.colophon__list dd {
  margin: 0;
  color: rgba(246, 244, 238, 0.9);
  letter-spacing: 0.05em;
}
.colophon__list dd a {
  color: var(--c-gold-soft);
  text-decoration: none;
  border-bottom: 1px solid rgba(255, 255, 255, 0.18);
}
.colophon__note {
  display: inline-block;
  margin-top: 6px;
  font-size: 0.74rem;
  color: rgba(246, 244, 238, 0.55);
}
.colophon__copy {
  margin: 24px 0 0;
  font-size: 0.74rem;
  text-align: center;
  letter-spacing: 0.18em;
  color: rgba(246, 244, 238, 0.5);
  font-family: "Cormorant Garamond", serif;
}

/* =========================================================
   SP用 下部タブバー（縦帯ナビの代替）
   ========================================================= */
.chart-tabbar {
  display: none;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 60;
  background: rgba(246, 244, 238, 0.96);
  backdrop-filter: blur(8px);
  border-top: 1px solid var(--c-line);
  padding: 6px 4px calc(6px + env(safe-area-inset-bottom));
  justify-content: space-around;
}
.chart-tabbar a {
  flex: 1;
  text-align: center;
  text-decoration: none;
  color: var(--c-green-deep);
  font-family: "Noto Serif JP", serif;
  font-size: 0.78rem;
  letter-spacing: 0.08em;
  padding: 8px 4px;
  border-right: 1px dashed var(--c-line);
}
.chart-tabbar a:last-child { border-right: none; }
.chart-tabbar a:hover { opacity: 1; background: rgba(122, 106, 163, 0.06); }

/* =========================================================
   レスポンシブ：SPでは縦帯ナビを隠し、下部タブバーへ切替
   ========================================================= */
@media (max-width: 920px) {
  .chart-rail { display: none; }
  .chart { margin-left: 0; }
  .chart-tabbar { display: flex; }
  .sheet { padding: 72px 24px 90px; }
  .sheet__binder { left: 8px; gap: 56px; }
  .sheet__binder span { width: 10px; height: 10px; }
  .sheet__pageno { top: 24px; right: 22px; }
  .sheet__title { font-size: 1.4rem; }
  .cover-card { padding: 36px 26px 32px; }
  .cover-card__title { font-size: 1.6rem; }
  .ruled { padding: 22px 18px; }
  .prescription-card { padding: 22px 18px; }
  .reservation-block { padding: 22px 18px; }
  .colophon { padding: 56px 24px 80px; }
}

/* =========================================================
   Reveal-on-scroll（軽いフェードイン）
   ========================================================= */
.reveal {
  opacity: 0;
  transform: translateY(14px);
  transition: opacity 0.7s ease, transform 0.7s ease;
}
.reveal.is-visible {
  opacity: 1;
  transform: none;
}

/* 表紙の主訴行：スクロールに合わせて1行ずつ追記される演出 */
.cover-form-row--complaint .hand--multi span {
  display: inline-block;
  opacity: 0;
  transform: translateY(4px);
  transition: opacity 0.5s ease, transform 0.5s ease;
}
.cover-form-row--complaint .hand--multi.is-typed span:nth-child(1) { transition-delay: 0.2s; opacity: 1; transform: none; }
.cover-form-row--complaint .hand--multi.is-typed span:nth-child(2) { transition-delay: 0.7s; opacity: 1; transform: none; }
.cover-form-row--complaint .hand--multi.is-typed span:nth-child(3) { transition-delay: 1.2s; opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
  .reveal { opacity: 1; transform: none; transition: none; }
  .cover-form-row--complaint .hand--multi span { opacity: 1; transform: none; transition: none; }
  html { scroll-behavior: auto; }
}

/* ===== サンプル告知バナー（菫色×墨の斜線） ===== */
.demo-banner {
  background: repeating-linear-gradient(
    -45deg,
    rgba(110, 93, 153, 0.18) 0,
    rgba(110, 93, 153, 0.18) 14px,
    rgba(43, 39, 48, 0.10) 14px,
    rgba(43, 39, 48, 0.10) 28px
  );
  border-bottom: 2px solid var(--c-green);
  padding: 10px 16px;
  text-align: center;
  font-size: 13px;
  line-height: 1.6;
  color: var(--c-text);
  font-family: "Noto Sans JP", sans-serif;
  letter-spacing: 0.04em;
}
.demo-banner strong { display: inline-block; margin-right: 8px; font-weight: 700; }
.demo-banner span { display: inline; font-weight: 500; }