/* ==========================================================================
   よくある質問のページだけの CSS（キャンバス案E v51 の FaqE。/faq/）
   --------------------------------------------------------------------------
   このページでだけ読む（inc/assets.php の planart_page_styles() の 'faq'。style.css のあと）。
   問いと答えの行（.c-faq）・ヒーローの札（.c-chips）・英字の帯・相談の帯は style.css の共通の部品。
   ここには、種類ごとの段の組み方（左に見出しとリンク、右に問い。幅 760px 以下は縦に並べる）だけを書く。
   色・余白・角丸・影は :root のトークンだけ。トークンは style.css の 0章（2026-11-03 まとめで、このファイルの :root から移した。名前はそのまま）。
   ========================================================================== */

/* 種類ごとの段（上下は、ふつうの段より少し狭い） */
.p-faq-group {
  padding-block: var(--sp-section-md);
}

/* 左に見出し（1）、右に問い（2）。キャンバスの .pe-split */
.p-faq-group__split {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 2fr);
  align-items: start;
  gap: var(--s-20) var(--sp-faq-split);
}

.p-faq-group__head {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: var(--s-10);
}

.p-faq-group__title {
  color: var(--c-ink);
  font-size: var(--fs-h2-split);
  line-height: 1.3;
  font-weight: 700;
  font-feature-settings: 'palt';
  text-wrap: balance;
}

/* 「…について」のリンク（列いっぱいに伸ばさない） */
.p-faq-group__link {
  align-self: flex-start;
}

.p-faq-group__list {
  min-width: 0;
}

@container (max-width: 760px) {
  .p-faq-group__split {
    grid-template-columns: minmax(0, 1fr);
  }
}