/*
 * 全ページ共通ナビゲーション（templates/partials/navbar.html）専用スタイル。
 * 元はtop/index.html内に個別実装されていたものを、共通ナビ化に伴い抽出した。
 * 配色はトップページのデザイントークン（--top-color-*）と同じ値を直接使う
 * （ナビはbase.html経由で全ページに読み込まれるため、特定ページのCSS変数に依存しない）。
 */

.site-navbar {
  background-color: #ffffff;
  border-bottom: 1px solid #e9e7df;
}

.site-navbar .navbar-brand {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-weight: 700;
  color: #234f38;
}

.site-navbar .navbar-brand img {
  width: 2rem;
  height: 2rem;
  border-radius: 0.5rem;
}

.site-navbar .nav-link {
  color: #5c5f5a;
  font-weight: 500;
}

.site-navbar .nav-link:hover,
.site-navbar .nav-link:focus-visible {
  color: #234f38;
}

.site-navbar .nav-link.active {
  color: #234f38;
  font-weight: 700;
}

/* ダークモード対応は未実装（トップ・サービス紹介・ブログ公開ページ側が
   まだ対応していないため、ナビだけ対応すると表示がちぐはぐになる。
   サイト全体でダークモード対応する際にあわせて追加する）。 */