.post-type-archive-product .site-body {
  margin-top: 0;
  padding: 0 !important;
}

.post-type-archive-product .main-section {
  margin: 0;
}

/* ============================================================
   lineup-archive-group：タクソノミーグループ
============================================================ */

.lineup-archive-group {
  padding: calc(8 / 16 * 1rem) 0 calc(50 / 16 * 1rem);
  opacity: 1;
}

.lineup-archive-group + .lineup-archive-group {
  border-top: 1px solid #e5e5e5;
}

/* グループヘッダー：ロゴ + グループ名 */
.lineup-archive-group__header {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-inline: calc(28 / 16 * 1rem);
}

.lineup-archive-group__logo-wrap {
  width: calc(150 / 16 * 1rem);
  margin-inline: auto;
}

.lineup-archive-group__name {
  font-size: calc(20 / 16 * 1rem);
  font-weight: 700;
  line-height: calc(29 / 20);
  color: var(--color-blue);
  text-align: center;
  margin: 0;
}

/* グループ内カードグリッド */
.lineup-archive-group__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: calc(20 / 16 * 1rem);
  margin-top: calc(25 / 16 * 1rem);
}

@media (min-width: 524px) {
  .lineup-archive-group__grid {
    grid-template-columns: repeat(2, 1fr);
    gap: calc(16 / 16 * 1rem);
  }
}

@media (min-width: 768px) {
  .lineup-archive-group {
    padding: calc(8 / 16 * 1rem) 0 calc(96 / 16 * 1rem);
  }
  .lineup-archive-group__logo-wrap {
    width: calc(277 / 16 * 1rem);
  }
  .lineup-archive-group__name {
    font-size: calc(20 / 16 * 1rem);
  }
  .lineup-archive-group__grid {
    grid-template-columns: repeat(3, 1fr);
    gap: calc(29 / 16 * 1rem);
    margin-top: calc(38 / 16 * 1rem);
  }
}

/* ============================================================
   lineup-archive-card：製品カード
============================================================ */

.lineup-archive-card {
  display: block;
  text-decoration: none;
  color: inherit;
  background-color: #fff;
  border-radius: 0.5rem;
  overflow: hidden;
  box-shadow: 0 0 1rem rgba(0, 0, 0, 0.2);
  transition: opacity 0.3s;
}

.lineup-archive-card:hover {
  opacity: 0.8;
}

/* カード画像 */
.lineup-archive-card__img {
  width: 100%;
  overflow: hidden;
}

.lineup-archive-card__img img {
  width: 100%;
  aspect-ratio: 360 / 216;
  object-fit: cover;
  display: block;
  transition: transform 0.3s ease;
}

.lineup-archive-card:hover .lineup-archive-card__img img {
  transform: scale(1.05);
}

/* カード本文エリア */
.lineup-archive-card__body {
  margin-top: 0.5rem;
  padding: 0 calc(15 / 16 * 1rem) calc(20 / 16 * 1rem);
}

/* カテゴリ */
.lineup-archive-card__cat {
  font-size: calc(18 / 16 * 1rem);
  font-weight: 900;
  line-height: 1.75;
  color: var(--color-blue);
  margin: 0 0 0.25rem;
  text-align: center;
}

/* タイトル */
.lineup-archive-card__title {
  font-size: calc(24 / 16 * 1rem);
  font-weight: 900;
  line-height: calc(28 / 24);
  color: var(--color-blue);
  margin: 0 0 0.5rem;
  text-align: center;
}

/* 抜粋 */
.lineup-archive-card__excerpt {
  font-size: calc(18 / 16 * 1rem);
  font-weight: 500;
  line-height: calc(24 / 16);
  color: #000;
  margin: 0;
}

@media (min-width: 768px) {
  .lineup-archive-card__body {
    margin-top: 0.5rem;
    padding: 0 calc(24 / 16 * 1rem) calc(32 / 16 * 1rem);
  }
  .lineup-archive-card__cat {
    font-size: 1rem;
  }
  .lineup-archive-card__title {
    font-size: calc(24 / 16 * 1rem);
  }
  .lineup-archive-card__excerpt {
    font-size: 1rem;
  }
}

/* ============================================================
   スクロールアニメーション（Intersection Observer 連動）
   html.js クラスが付与されているとき（JS 有効時）のみ適用
   prefers-reduced-motion: reduce の場合は無効化
============================================================ */
@media (prefers-reduced-motion: no-preference) {
  /* --- ロゴラッパー --- */
  html.js .lineup-archive-group__logo-wrap {
    opacity: 0;
    transform: translateY(28px);
    transition:
      opacity 0.7s ease,
      transform 0.7s ease;
  }
  html.js .lineup-archive-group__logo-wrap.is-in-view {
    opacity: 1;
    transform: none;
  }

  /* --- グループ名（ロゴより少し遅れて） --- */
  html.js .lineup-archive-group__name {
    opacity: 0;
    transform: translateY(20px);
    transition:
      opacity 0.65s ease 0.18s,
      transform 0.65s ease 0.18s;
  }
  html.js .lineup-archive-group__name.is-in-view {
    opacity: 1;
    transform: none;
  }

  /* --- 製品カード（JS でトランジション遅延を上書き） --- */
  html.js .lineup-archive-card {
    opacity: 0;
    transform: translateY(44px) scale(0.97);
    /* transition プロパティに opacity・transform を追加（既存の opacity 指定を上書き） */
    transition:
      opacity 0.65s ease,
      transform 0.65s cubic-bezier(0.25, 0.46, 0.45, 0.94),
      box-shadow 0.3s;
  }
  html.js .lineup-archive-card.is-in-view {
    opacity: 1;
    transform: none;
  }
  /* in-view 後の hover は通常の opacity トランジションに戻す */
  html.js .lineup-archive-card.is-in-view:hover {
    opacity: 0.8;
  }

  /* --- ブランドセクション タイトル --- */
  html.js .post-type-archive-product .lineup-brands .lineup-section-title {
    opacity: 0;
    transform: translateY(22px);
    transition:
      opacity 0.65s ease,
      transform 0.65s ease;
  }
  html.js
    .post-type-archive-product
    .lineup-brands
    .lineup-section-title.is-in-view {
    opacity: 1;
    transform: none;
  }

  /* --- ブランドアイテム（JS でスタッガー遅延上書き） --- */
  html.js .post-type-archive-product .lineup-brands__item {
    opacity: 0;
    transform: translateY(32px);
    transition:
      opacity 0.6s ease,
      transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  }
  html.js .post-type-archive-product .lineup-brands__item.is-in-view {
    opacity: 1;
    transform: none;
  }
}
