/* features-hux-06.css — 写真+テキストを左右交互に並べる事業紹介。旧 features-mod-02 の置き換え。
 * 旧版の壊れ方: 画像列の中身が全て絶対配置で列の高さが 0 になり、figure と img が 0x0 に
 *   なっていた(本番の実顧客サイトで6ブロック中4つ)。さらに figure に z-index:-1 が付いており
 *   写真がセクション背景の裏へ回っていた。
 * 対策: 器を aspect-ratio で確定させ、絶対配置と負の z-index を一切使わない。
 * .lgx は付けない(旧テーマの float グリッドを継承しない)。
 */
.features-hux-06 .mx-auto { margin-inline: auto; }
.features-hux-06 .max-w-7xl { max-width: 80rem; }
.features-hux-06 .px-4 { padding-inline: 1rem; }
.features-hux-06 .py-8 { padding-block: 2rem; }

.features-hux-06 .hux06-list { display: grid; gap: 3rem; }

.features-hux-06 .hux06-item { display: grid; grid-template-columns: 1fr; gap: 1.25rem; align-items: center; }

.features-hux-06 .hux06-media {
  margin: 0;
  aspect-ratio: 4 / 3;
  max-height: 460px;
  overflow: hidden;
  border-radius: 0.5rem;
}
.features-hux-06 .hux06-media img { display: block; width: 100%; height: 100%; object-fit: cover; }

.features-hux-06 .hux06-num {
  margin: 0 0 0.25em;
  font-weight: 700;
  line-height: 1;
  color: var(--color-primary);
  letter-spacing: 0.06em;
}
.features-hux-06 .hux06-title { margin: 0 0 0.6em; line-height: 1.4; }
.features-hux-06 .hux06-text { margin: 0 0 1.25rem; }
.features-hux-06 .hux06-more { margin: 0; }
.features-hux-06 .hux06-btn {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 44px; padding: 0.7em 2.2em; border-radius: 999px;
  background: var(--color-primary); color: var(--color-on-primary);
  text-decoration: none; font-weight: 600;
}
.features-hux-06 .hux06-btn:hover { opacity: 0.88; }

@media (min-width: 768px) {
  .features-hux-06 .px-4 { padding-inline: 1.5rem; }
  .features-hux-06 .hux06-list { gap: 4rem; }
  .features-hux-06 .hux06-item { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 2.5rem; }
  /* 偶数番目は写真を右へ。order だけで入れ替えるので float も絶対配置も要らない。 */
  .features-hux-06 .hux06-item:nth-child(even) .hux06-media { order: 2; }
}
@media (min-width: 1024px) {
  .features-hux-06 .px-4 { padding-inline: 2rem; }
  .features-hux-06 .hux06-item { gap: 4rem; }
}