/* ============================================================
   Accordion — 開閉リスト
   題をタップで本文が開く。複数同時に開ける（独立した開示）。
   開いている項目は署名色、指標(▾)が回る。高さは grid 1fr で滑らかに。
   罫で分け、カード化しない（版面の文法）。配線は js/catalog.js。
   ============================================================ */

.accordion { width: 100%; max-width: 380px; border-top: 1px solid var(--line); }
.acc-item { border-bottom: 1px solid var(--line); }

.acc-head {
  display: flex; align-items: center; gap: 12px; width: 100%;
  padding: 15px 4px; min-height: var(--tap-min);
  font-family: var(--font-serif); font-weight: 500; font-size: 14.5px;
  color: var(--ink); text-align: left;
  transition: color var(--dur-fast) var(--ease);
}
.acc-head .acc-mark {
  margin-left: auto; width: 7px; height: 7px; flex: none;
  border-right: 1.5px solid var(--ash); border-bottom: 1.5px solid var(--ash);
  transform: rotate(45deg) translateY(-1px);
  transition: transform var(--dur-mid) var(--ease), border-color var(--dur-fast) var(--ease);
}
.acc-head[aria-expanded="true"] { color: var(--brand); }
.acc-head[aria-expanded="true"] .acc-mark { transform: rotate(225deg) translateY(2px); border-color: var(--brand); }

.acc-panel {
  display: grid; grid-template-columns: minmax(0, 1fr); grid-template-rows: 0fr;
  transition: grid-template-rows var(--dur-mid) var(--ease);
}
.acc-head[aria-expanded="true"] + .acc-panel { grid-template-rows: 1fr; }
.acc-panel > .acc-inner { overflow: hidden; }
.acc-panel .acc-body {
  padding: 0 4px 16px; font-size: 13px; color: var(--ash); line-height: 1.85;
  text-align: justify; max-width: 44em;
}