/**
 * よくあるご質問 — 横並びストーリーと同系タイポ・PC2列（左：ラベル／右：Q&A）
 */
.arc-faq-accordion {
  --arc-faq-bar-bg: #eef1f6;
  --arc-faq-bar-bg-active: #e4e9f2;
  /* カード内は常に明るい面＋濃い文字（セクション背景のコントラストJSに依存しない） */
  --arc-faq-item-ink: var(--arc-brand-ink);
  --arc-faq-gold: var(--arc-brand-accent);
  --arc-faq-radius: 0.875rem;
  /* 見出し（H2）— 現状サイズを維持 */
  --arc-faq-type-heading: clamp(1.5rem, 3.7vw, 2.1875rem);
  /*
   * ディスプレイ行 — H1セクションの display:h1 と同じ比率（×Y）を H2 基準に適用
   * H1 モバイル 2.65/1.55 ≈ 12/7 vw、デスクトップ 3/2 ≈ 5.2/3.4 vw
   */
  --arc-faq-type-display: clamp(2.56rem, 6.34vw, 3.89rem);
  --arc-faq-type-q: clamp(1rem, 2.2vw, 1.125rem);
  --arc-faq-gap: clamp(0.65rem, 1.8vw, 0.85rem);
  --arc-faq-col-gap: clamp(1.5rem, 4vw, 3.5rem);
  /* 見出し→短文 / 短文→Q&A（モバイル）— スタックカードと同系 */
  --arc-faq-intro-lead-gap: 4rem;
  --arc-faq-lead-main-gap-mobile: clamp(3rem, 7vw, 4.5rem);
  --arc-faq-pad-y: clamp(2.5rem, 6vw, 5rem);
  --arc-faq-pad-x: clamp(1rem, 3vw, 2rem);
  --arc-faq-ease: cubic-bezier(0.4, 0, 0.2, 1);

  max-width: 75rem;
  margin: 0 auto;
  padding: var(--arc-faq-pad-y) var(--arc-faq-pad-x);
  font-family: inherit;
  box-sizing: border-box;
}

.arc-faq-accordion *,
.arc-faq-accordion *::before,
.arc-faq-accordion *::after {
  box-sizing: border-box;
}

.arc-faq-accordion--empty {
  padding: 1rem;
  font-family: inherit;
}

.arc-faq-accordion__inner {
  display: flex;
  flex-direction: column;
  gap: var(--arc-faq-col-gap);
  align-items: stretch;
}

/* 左カラム（H1セクション .arc-h1-section__copy 相当の階層） */
.arc-faq-accordion__intro {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  gap: clamp(0.45rem, 2vw, 0.75rem);
  min-width: 0;
}

/* 補助キッカー（H1 のセクションラベル相当・任意） */
.arc-faq-accordion__meta {
  margin: 0;
  padding: 0;
  font-family: inherit;
  font-size: clamp(0.68rem, 1.5vw, 0.78rem);
  font-weight: 600;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  line-height: 1.4;
}

/* ディスプレイ行（H1 の .arc-h1-section__display-line 相当・H1より気持ち小さめ） */
.arc-faq-accordion__display-line {
  margin: 0;
  padding: 0;
  width: 100%;
  font-family: inherit;
  font-size: var(--arc-faq-type-display);
  font-weight: 500;
  line-height: 1.08;
  letter-spacing: 0.02em;
  text-align: left;
  color: inherit;
}

.arc-faq-accordion__heading {
  margin: 0;
  padding: 0;
  font-family: inherit;
  font-size: var(--arc-faq-type-heading);
  font-weight: 700;
  line-height: 1.12;
  letter-spacing: 0.04em;
  text-align: left;
  color: inherit;
}

/* パレット指定時（未指定ブロックは従来どおり背景に応じた自動色） */
.arc-faq-accordion--custom-intro-colors .arc-faq-accordion__display-line {
  color: var(--arc-faq-display-color, inherit) !important;
}

.arc-faq-accordion--custom-intro-colors .arc-faq-accordion__heading {
  color: var(--arc-faq-heading-color, inherit) !important;
}

/* 見出し下の短文 — タイポは arc-editing-common.css、左揃え・4rem（スタックカード同等） */
.arc-faq-accordion__intro + .arc-faq-accordion__lead {
  padding-top: var(--arc-faq-intro-lead-gap);
}

/* [cfa2] — 光がきらんと走る */
.arc-faq-accordion--colorful .arc-faq-accordion__cfa2-char {
  display: inline;
  color: var(--arc-faq-cfa2-final-color, inherit);
}

.arc-faq-accordion--colorful .arc-faq-accordion__cfa2-char.is-enter {
  animation: arc-faq-cfa2-sweep var(--arc-faq-cfa2-duration, 2s) ease-out var(--arc-faq-cfa2-delay, 0ms) both;
}

@keyframes arc-faq-cfa2-sweep {
  0%,
  100% {
    color: var(--arc-faq-cfa2-final-color, inherit);
  }

  26% {
    color: var(--arc-faq-cfa2-color, #009ace);
  }
}

@media (prefers-reduced-motion: reduce) {
  .arc-faq-accordion--colorful .arc-faq-accordion__cfa2-char.is-enter {
    animation: none;
  }
}

/* 右カラム：アコーディオン */
.arc-faq-accordion__main {
  min-width: 0;
}

.arc-faq-accordion__list {
  display: flex;
  flex-direction: column;
  gap: var(--arc-faq-gap);
}

.arc-faq-accordion__item {
  border-radius: var(--arc-faq-radius);
  background: var(--arc-faq-bar-bg);
  color: var(--arc-faq-item-ink);
  transition: background-color 0.25s var(--arc-faq-ease);
}

.arc-faq-accordion__item.is-open {
  background: var(--arc-faq-bar-bg-active);
}

.arc-faq-accordion__question-heading {
  margin: 0;
  font-size: inherit;
  font-weight: inherit;
  font-family: inherit;
}

.arc-faq-accordion__trigger {
  display: flex;
  align-items: center;
  gap: clamp(0.65rem, 2vw, 1rem);
  width: 100%;
  margin: 0;
  padding: clamp(0.9rem, 2.5vw, 1.15rem) clamp(1rem, 3vw, 1.35rem);
  border: 0;
  border-radius: var(--arc-faq-radius);
  background: transparent;
  color: var(--arc-faq-item-ink);
  text-align: left;
  cursor: pointer;
  font-family: inherit;
  -webkit-appearance: none;
  appearance: none;
  transition: opacity 0.2s var(--arc-faq-ease);
}

.arc-faq-accordion__trigger:hover,
.arc-faq-accordion__trigger:focus-visible {
  outline: none;
  opacity: 0.88;
}

.arc-faq-accordion__trigger:focus-visible {
  box-shadow: inset 0 0 0 0.125rem var(--arc-faq-gold);
}

.arc-faq-accordion__question {
  flex: 1 1 auto;
  min-width: 0;
  font-size: var(--arc-faq-type-q);
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.02em;
  color: var(--arc-faq-item-ink);
}

.arc-faq-accordion__icon {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  width: clamp(2.25rem, 6vw, 2.75rem);
  height: clamp(2.25rem, 6vw, 2.75rem);
  border-radius: 50%;
  background: var(--arc-brand-surface-card);
  color: var(--arc-faq-item-ink);
  transition:
    background-color 0.3s var(--arc-faq-ease),
    color 0.3s var(--arc-faq-ease),
    transform 0.3s var(--arc-faq-ease);
}

.arc-faq-accordion__item.is-open .arc-faq-accordion__icon {
  background: var(--arc-faq-item-ink);
  color: var(--arc-brand-on-dark);
  transform: scale(1.02);
}

.arc-faq-accordion__car-svg {
  display: block;
  width: 58%;
  height: 58%;
}

.arc-faq-accordion__toggle {
  flex: 0 0 auto;
  position: relative;
  width: 1.25rem;
  height: 1.25rem;
}

.arc-faq-accordion__toggle::before,
.arc-faq-accordion__toggle::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  height: 0.125rem;
  margin: -1px 0 0 -50%;
  background: currentColor;
  border-radius: 1px;
  transition: transform 0.35s var(--arc-faq-ease), opacity 0.25s var(--arc-faq-ease);
}

.arc-faq-accordion__toggle::after {
  transform: rotate(90deg);
}

.arc-faq-accordion__item.is-open .arc-faq-accordion__toggle::after {
  transform: rotate(90deg) scaleX(0);
  opacity: 0;
}

.arc-faq-accordion__panel {
  overflow: hidden;
}

.arc-faq-accordion__panel-inner {
  overflow: hidden;
  max-height: 0;
  opacity: 0;
  transition:
    max-height 0.4s var(--arc-faq-ease),
    opacity 0.3s var(--arc-faq-ease);
}

.arc-faq-accordion__item.is-open .arc-faq-accordion__panel-inner {
  opacity: 1;
}

.arc-faq-accordion__answer {
  padding: 0 clamp(1rem, 3vw, 1.35rem) clamp(1.1rem, 3vw, 1.45rem);
  padding-left: calc(
    clamp(1rem, 3vw, 1.35rem) + clamp(2.25rem, 6vw, 2.75rem) + clamp(0.65rem, 2vw, 1rem)
  );
  font-family: inherit;
  text-align: left;
  color: var(--arc-faq-item-ink);
  opacity: 0.92;
}

.arc-faq-accordion__answer a {
  color: var(--arc-faq-item-ink);
  text-decoration: underline;
  text-underline-offset: 0.15em;
  font-weight: 600;
}

/* テーマのリンク色・セクション白文字の上書き（モバイル含む） */
[class*='wp-block-arc-editing'] .arc-faq-accordion__item .arc-faq-accordion__trigger,
[class*='wp-block-arc-editing'] .arc-faq-accordion__item .arc-faq-accordion__question,
[class*='wp-block-arc-editing'] .arc-faq-accordion__item .arc-faq-accordion__answer,
[class*='wp-block-arc-editing'] .arc-faq-accordion__item .arc-faq-accordion__answer a {
  color: var(--arc-faq-item-ink) !important;
}

/*
 * 価格表シート — body ポータル時（ブロック外）も FAQ カードと同じ固定文字色。
 * テーマの body 文字色継承を遮断する。表 HTML は panel 内のサーバー出力のまま。
 */
body > .arc-faq-accordion__item.is-ppf-sheet,
body > .arc-faq-accordion__item.is-ppf-sheet .arc-faq-accordion__trigger,
body > .arc-faq-accordion__item.is-ppf-sheet .arc-faq-accordion__question,
body > .arc-faq-accordion__item.is-ppf-sheet .arc-ppf-table-sheet__close {
  color: var(--arc-faq-item-ink, var(--arc-brand-ink, #2c2e36));
}

.arc-faq-accordion__answer img,
.arc-faq-accordion__answer figure {
  max-width: 100%;
  height: auto;
}

.arc-faq-accordion__answer figure {
  margin: 0.75em 0;
}

.arc-faq-accordion__answer ul,
.arc-faq-accordion__answer ol {
  margin: 0 0 0.85em;
  padding-left: 1.35em;
}

@media (min-width: 768px) {
  .arc-faq-accordion {
    --arc-faq-type-display: clamp(2.25rem, 5.66vw, 3.28rem);
  }

  .arc-faq-accordion__inner {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--arc-faq-col-gap);
    align-items: start;
  }

  /* 見出し下の短文と Q&A リストの上端を揃える（行間は intro→lead の 4rem のみ） */
  .arc-faq-accordion--has-lead .arc-faq-accordion__inner {
    row-gap: 0;
  }

  .arc-faq-accordion--has-lead .arc-faq-accordion__intro {
    grid-column: 1;
    grid-row: 1;
  }

  .arc-faq-accordion--has-lead .arc-faq-accordion__lead {
    grid-column: 1;
    grid-row: 2;
  }

  .arc-faq-accordion--has-lead .arc-faq-accordion__main {
    grid-column: 2;
    grid-row: 2;
  }

  .arc-faq-accordion--no-header .arc-faq-accordion__inner {
    grid-template-columns: 1fr;
  }

  .arc-faq-accordion--no-header .arc-faq-accordion__main {
    grid-column: 1 / -1;
  }
}

/* 短文あり — モバイル: intro→lead→Q&A の縦間隔を個別管理 */
@media (max-width: 767px) {
  .arc-faq-accordion--has-lead .arc-faq-accordion__inner {
    gap: 0;
  }

  .arc-faq-accordion--has-lead .arc-faq-accordion__main {
    margin-top: var(--arc-faq-lead-main-gap-mobile);
  }
}

@media (prefers-reduced-motion: reduce) {
  .arc-faq-accordion__panel-inner,
  .arc-faq-accordion__icon,
  .arc-faq-accordion__toggle::before,
  .arc-faq-accordion__toggle::after,
  .arc-faq-accordion__item {
    transition: none;
  }
}