@charset "UTF-8";
/* =========================================================
   サカシタ電装 / よくあるご質問ページ専用スタイル
   ========================================================= */

/* ---------------------------------------------------------
   カテゴリ絞り込み
   --------------------------------------------------------- */
.faq-filter {
  margin-bottom: clamp(26px, 3vw, 40px);
  padding: 22px 26px;
  border-radius: var(--radius-l);
  background: var(--bg-soft);
  border: 1px solid var(--line);
}
.faq-filter__label {
  font-family: var(--font-en);
  font-size: 11px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--leaf);
  margin-bottom: 14px;
}
.faq-filter__buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.faq-filter__btn {
  padding: 9px 22px;
  border-radius: 999px;
  border: 1px solid var(--line-strong);
  background: #fff;
  font-family: var(--font-round);
  font-size: 13.5px;
  font-weight: 700;
  color: var(--ink-sub);
  transition: background-color .3s var(--ease), color .3s var(--ease),
              border-color .3s var(--ease), transform .3s var(--ease);
}
.faq-filter__btn:hover { border-color: var(--moss); color: var(--forest); transform: translateY(-2px); }
.faq-filter__btn.is-active {
  background: var(--forest);
  border-color: var(--forest);
  color: #fff;
}

/* ---------------------------------------------------------
   一覧
   --------------------------------------------------------- */
.faq-list .accordion__item.is-hidden { display: none; }

.faq-empty {
  margin-top: 30px;
  padding: 40px 20px;
  text-align: center;
  border-radius: var(--radius);
  background: var(--bg-soft);
  color: var(--ink-sub);
  font-size: 14.5px;
}

@media (max-width: 560px) {
  .faq-filter { padding: 18px 18px; }
  .faq-filter__btn { padding: 8px 16px; font-size: 12.5px; }
}