/* ============================================================
   全ページ共通フッター（2026-09-10 統一）
   ------------------------------------------------------------
   それまでフッターは4種類あった: teal のブランド面（市場・サービス）、
   白い奥付（ホーム・/live・/start）、ログイン後の簡易な法務行、規約用。
   運営者の指示で「紙面フル」に一本化する。base.html が全ページで読むので、
   marketing 系のCSSを読まない画面（/assets・/portfolio・検索など）でも
   同じフッターになる。
   ============================================================ */

/* ── Footer — 紙面の奥付（2026-09-10 全ページ統一・同日 圧縮）────────
   それまで4種類あったフッターを「紙面フル」に一本化したが、PCで361px＝
   ページの30%、スマホでは720px＝約2画面ぶんを占めていた。中身を数えると
   リンク8本はすべてヘッダーに在るものの再掲（うち4本は文字まで同じ）で、
   出典行はホームの奥付とも二重だった。3列を1行に流し、出典を著作権行へ畳む。
   残すのは ワードマーク / 一文 / リンク1行 / 法務・出典 の4つ。 */
.p9-footer {
  background: var(--pv-bg, #f6f9f8);
  color: var(--pv-ink-2, #374151);
  border-top: 3px double var(--pv-ink, #0f172a);
  padding: 1.25rem 1.5rem 1rem;
}
.p9-footer-inner {
  max-width: var(--p9-max-w, 76rem);
  margin: 0 auto;
}

/* 上段: 左にブランドと一文、右に「リンク1行 ＋ 素性・法務1行」の2段 */
/* align-items:stretch — 右列を左のブランド列と同じ高さに開き、その中で
   リンクを上、素性・法務を下に置く（2026-09-10 二度目の圧縮）。
   こうすると右下に余白が残らず、横罫と下段の帯を丸ごと外せる。 */
.p9-footer-head {
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  gap: 2rem;
  flex-wrap: wrap;
}
.p9-footer-brand {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  min-width: 0;
}
.p9-footer-logo-wrap {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
}
.p9-footer-logo-wrap .pv-wordmark { color: var(--pv-ink, #0f172a); font-size: 1rem; }
.p9-footer .pv-wm-pv, .p9-footer .pv-wm-market { color: var(--pv-ink, #0f172a); }
.p9-footer .pv-jp { color: var(--pv-green-600, #00956f); }
/* ワードマーク下の「発電所の資産管理」はヘッダーと重複するので出さない */
.p9-footer-logo-wrap .pv-tagline { display: none; }
/* 紙面なので、ロゴ画像の白い座布団は要らない */
.p9-footer-brand img { display: none; }
.p9-footer-tagline {
  margin: 0;
  font-size: 0.8rem;
  color: var(--pv-muted, #5b6675);
  line-height: 1.75;
  /* 幅は <br> で決める（max-width で折ると「…支えま／す。」と割れる） */
}

/* 右列。flex:1 1 0 が肝で、basis を content にすると法務行の長さを列が
   要求してしまい、狭い画面で右列ごと下に落ちてフッターが179pxに跳ねる（実測）。
   0 にすると法務行だけが2行に折り返し、107px で収まる。 */
.p9-footer-right {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: space-between;
  gap: 0.5rem;
  min-width: 0;
  flex: 1 1 0;
}

/* リンクは1行に流す（列見出しは置かない — 7本に見出しは要らない） */
.p9-footer-links {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem 1.05rem;
  margin: 0;
  padding: 0;
  list-style: none;
  justify-content: flex-end;
  /* 折り返した時の行送りをタグラインと揃える */
  line-height: 1.75;
}
/* 広い画面では1行に収める（左のタグラインが2行になったぶん幅が回る） */
@media (min-width: 1040px) {
  .p9-footer-links { flex-wrap: nowrap; }
}
.p9-footer-links a {
  font-size: 0.8rem;
  color: var(--pv-ink-2, #374151) !important;
  text-decoration: none !important;
  white-space: nowrap;
}
.p9-footer-links a:hover { color: var(--pv-green-700, #00734f) !important; }

/* 運営者の名乗り・出典・法務を1行に。横罫も下段の帯も持たない */
.p9-footer-legal {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: baseline;
  gap: 0.35rem 1rem;
  min-width: 0;
  font-size: 0.72rem;
  color: var(--pv-muted, #5b6675);
}
.p9-footer-legal a {
  color: var(--pv-muted, #5b6675) !important;
  text-decoration: none !important;
}
.p9-footer-legal a:hover { color: var(--pv-green-700, #00734f) !important; }

/* 中央寄せのページ（検索・規約など）に引きずられないように */
.p9-footer, .p9-footer-inner { text-align: left; }

/* 上段が2段に割れる幅からは、右列を幅いっぱいに落として左揃えにする。
   flex:1 1 0 のまま縦長の細い列にすると法務行が5行に割れ、
   スマホのフッターが 427px に膨れる（実測） */
@media (max-width: 880px) {
  .p9-footer-right { flex: 1 1 100%; align-items: flex-start; gap: 0.7rem; }
  .p9-footer-legal { justify-content: flex-start; }
}
@media (max-width: 760px) {
  .p9-footer { padding: 1rem 1.2rem 0.9rem; }
  .p9-footer-head { gap: 1rem; }
  .p9-footer-links { justify-content: flex-start; gap: 0.3rem 0.9rem; }
  .p9-footer-links a { font-size: 0.76rem; }
}

/* 運営者の名乗り（2026-09-10）。著作権行に同居させる */
.p9-footer-copy { display: inline; }
.p9-footer .p9-footer-copy a { color: var(--pv-ink-2, #374151) !important; font-weight: 700; }
.p9-footer-copy a:hover { color: var(--pv-green-700, #00734f) !important; }
/* 罫線色（#cbd5e1）だと 0.72rem では見えず、区切りの役をしていなかった。
   本文より薄く、しかし見える濃さに（2026-09-10） */
.p9-footer-sep { color: #9aa7b2; }
