/* =============================================================
   HOLY-MOLY LP — Accordion
   <details>/<summary> のネイティブ実装。仕様書 §4-2 / §5-10 / §7
   モバイルファースト：SPはヘッダー行40px/14px、768px以上で44px/16px。
   ※ 開閉時の高さアニメーション（grid-template-rows 0fr→1fr）は
      js/accordion.js の実装と合わせて追加する。
   ============================================================= */

.accordion + .accordion {
  margin-top: 46px;
}

.accordion__head {
  display: flex;
  align-items: center;
  gap: 14px;
  height: 40px;
  cursor: pointer;
  list-style: none;
}

.accordion__head::-webkit-details-marker {
  display: none;
}

.accordion__marker {
  display: block;
  flex-shrink: 0;
  width: 22px;
  height: 22px;
}

.accordion__title {
  flex: 1;
  font-size: 14px;
  font-weight: 600;
  color: var(--c-text);
}

.accordion__chevron {
  display: block;
  flex-shrink: 0;
  width: 28px;
  height: 28px;
  transition: transform var(--dur-fast) ease;
}

.accordion[open] .accordion__chevron {
  transform: rotate(180deg);
}

.accordion__body {
  padding-top: 20px;
}

.qa dt {
  margin-top: 26px;
  font-size: var(--fs-body);
  color: var(--gold-400);
}

.qa dt:first-child {
  margin-top: 0;
}

.qa dd {
  margin-top: 10px;
  font-size: var(--fs-body);
  color: var(--c-text-body);
}

@media (min-width: 768px) {
  .accordion__head {
    height: 44px;
  }

  .accordion__title {
    font-size: var(--fs-body);
  }
}