/* =========================================================
   12-about.css — docs/about/index.md 専用
   2026-09-23、tomo リポジトリ（このサイトの前身、旧 hotline → kabuka → tomo）の
   Home（制作物ポートフォリオ）ページと同じ内容を、会社に伝えている旧URL
   https://minnanosaiban.github.io/hotline/about/ の受け皿として、このリポジトリにも
   並行運用のために複製した（来年度、tomo 単独運用に一本化する予定でこのページは削除する）。
   このファイル自体は tomo の 12-about.css をそのままコピーしたもの。以下は tomo 側での経緯：
   2026-08-10 モック承認：案B（番号のエディトリアル）＋カード廃止。
   青いバー・青いラベルを使わず、無彩色の番号＋文字の大きさで見出しを
   立てる方針だったが、2026-08-17 見直し：タイトルが名前として弱く
   見えたため、Home/agm/trial 見出しと同じ .bar-title（行頭の青バー）
   に統一。番号は引き続き無彩色のまま（併用）。
   2026-09-23: about/ がHomeに昇格・ポートフォリオ機能も持たせるにあたり、
   カード化はせず（上の方針を維持）、ホバー時の微細な反応（バー・番号・ボタン）
   だけを足して「作り込まれた質感」を強める方向で洗練。
   ========================================================= */

/* 控えめボタン（無彩色チップ。ライト/ダークは Material 変数が吸収。
   旧: .x-share と同系だったが、.x-share は2026-08-20にサイトの青へ変更済み）。
   2026-09-23: ホバーで少し持ち上がる（box-shadow＋translateY）反応を追加、
   「押せる・触れる」手触りを足した。カード化はしていない（枠線・背景の大幅変更なし）。 */
.about-btn {
  display: inline-block;
  padding: 0.5em 1.1em;
  font-size: 13px;
  border-radius: 0.25rem;
  color: var(--md-typeset-color) !important;
  background-color: var(--md-default-fg-color--lightest);
  text-decoration: none !important;
  transition: background-color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
}
.about-btn:hover {
  background-color: var(--md-default-fg-color--lighter);
  text-decoration: none !important;
  transform: translateY(-1px);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}
[data-md-color-scheme="slate"] .about-btn:hover {
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.35);
}
.about-btn:active {
  transform: translateY(0);
  box-shadow: none;
}

/* 代表記事のテキスト一覧（カード廃止・番号と説明は無彩色、リンクだけ青） */
.md-typeset .about-art-list {
  list-style: none !important;
  margin: 0.7rem 0 0 !important;
  padding: 0 !important;
}
.md-typeset .about-art-list li {
  font-size: 14.5px;
  line-height: 1.7;
  margin: 0 0 0.4rem !important;
}
.md-typeset .about-art-list .n {
  font-size: 12px;
  letter-spacing: 0.08em;
  color: var(--md-default-fg-color--light);
  margin-right: 0.5em;
}
.md-typeset .about-art-list .d {
  font-size: 13px;
  color: var(--md-default-fg-color--light);
  margin-left: 0.5em;
}
